diff --git a/index.html b/index.html
index 93fb6d2..90138e8 100644
--- a/index.html
+++ b/index.html
@@ -4,195 +4,19 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>We keep climbing!</title>
-<link rel="icon" type="image/x-icon" href="stairs.png">
-<style>
-html, body {
-    margin: 0;
-    padding: 0;
-    height: 100%;
-}
-body {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: #111111;
-    color: #dddddd;
-    font-family: Arial, Helvetica, sans-serif;
-}
-a, a:hover, a:link, a:visited, a:active {
-    color: grey;
-}
-@font-face {
-    font-family: determination;
-    src: url(determination.ttf);
-}
-.page {
-    width: 520px;
-    position: relative;
-    z-index: 1;
-}
-.header {
-    margin-bottom: 20px;
-}
-.logo {
-    font-family: determination;
-    font-size: 6rem;
-    letter-spacing: 4px;
-    color: #dddddd;
-    display: flex;
-}
-.tagline {
-    margin-top: 6px;
-    color: #666666;
-    font-size: 13px;
-    text-align: center;
-}
-.footer {
-    margin-top: 16px;
-    color: #555;
-    font-size: 11px;
-    text-align: center;
-}
-.panel {
-    background: #1a1a1a;
-    border: 1px solid #333;
-}
-.links {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-}
-.link {
-    display: block;
-    text-decoration: none;
-    color: #ddd;
-    border-bottom: 1px solid #2a2a2a;
-    border-right: 1px solid #2a2a2a;
-    box-sizing: border-box;
-}
-.link:nth-child(3n) {
-    border-right: none;
-}
-.link:hover {
-    background: #222;
-}
-.link-inner {
-    padding: 18px;
-}
-.name {
-    font-size: 16px;
-}
-.desc {
-    margin-top: 4px;
-    font-size: 12px;
-    color: #888;
-}
-.clear {
-    clear: both;
-}
-.section-title {
-    padding: 14px 18px;
-    font-size: 11px;
-    letter-spacing: 2px;
-    color: #666;
-    border-bottom: 1px solid #2a2a2a;
-    background: #161616;
-}
-.s { animation: bouncy 1.5s ease-in-out -1.9s infinite alternate; }
-.t { animation: bouncy 1.5s ease-in-out -1.8s infinite alternate; }
-.a { animation: bouncy 1.5s ease-in-out -1.7s infinite alternate; }
-.i { animation: bouncy 1.5s ease-in-out -1.6s infinite alternate; }
-.r { animation: bouncy 1.5s ease-in-out -1.5s infinite alternate; }
-.ss { animation: bouncy 1.5s ease-in-out -1.4s infinite alternate; }
-.dot { animation: bouncy 1.5s ease-in-out -1.3s infinite alternate; }
-.l { animation: bouncy 1.5s ease-in-out -1.2s infinite alternate; }
-.aa { animation: bouncy 1.5s ease-in-out -1.1s infinite alternate; }
-.tt { animation: bouncy 1.5s ease-in-out -1s infinite alternate; }
-.stairs {
-    animation: stairs 1.5s linear infinite;
-    width: auto;
-    opacity: 0.3;
-}
-.stair-container {
-    overflow: hidden;
-    display: flex;
-    max-width: 420px;
-    z-index: -1;
-    -webkit-mask-size: cover;
-    mask-size: cover;
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-image: linear-gradient(45deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 46%, rgba(0, 0, 0, 0) 100%);
-    mask-image: linear-gradient(45deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 46%, rgba(0, 0, 0, 0) 100%);
-}
-.stair-top {
-    position: fixed;
-    top: 2rem;
-    left: 4rem;
-    z-index: 0;
-    pointer-events: none;
-}
-.stair-bottom {
-    position: fixed;
-    bottom: 2rem;
-    right: 4rem;
-    z-index: 0;
-    pointer-events: none;
-}
-.buttons88 {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 6px;
-    justify-content: center;
-    padding: 14px 10px;
-    margin-top: 10px;
-}
-.buttons88 img {
-    width: 88px;
-    height: 31px;
-    image-rendering: pixelated;
-}
-@keyframes bouncy {
-    0% { transform: translateY(0); color: #AAAAAA; }
-    100% { color: #FFFFFF; transform: translateY(-20px); }
-}
-@keyframes stairs {
-    0% { transform: translate(0, 0); }
-    100% { transform: translate(-90px, 90px); }
-}
-
-@media (max-width: 560px) {
-    body {
-        padding: 10px;
-        box-sizing: border-box;
-    }
-    .page {
-        width: 100%;
-    }
-    .logo {
-        font-size: 4rem;
-        justify-content: center;
-    }
-    .stair-top {
-        top: 0.5rem;
-        left: 0.5rem;
-    }
-    .stair-bottom {
-        bottom: 0.5rem;
-        right: 0.5rem;
-    }
-}
-</style>
+<link rel="icon" type="image/x-icon" href="favicon.ico">
+<link rel="stylesheet" href="styles.css">
 <base target="_blank">
 </head>
 <body>
 <div class="stair-top">
     <div class="stair-container">
-        <img class="stairs" src="stairs.png">
+        <img class="stairs-up" src="stairs.png">
     </div>
 </div>
 <div class="stair-bottom">
     <div class="stair-container">
-        <img class="stairs" src="stairs.png">
+        <img class="stairs-down" src="stairs.png">
     </div>
 </div>
 <div class="page">
@@ -212,75 +36,110 @@ a, a:hover, a:link, a:visited, a:active {
         <div class="tagline">
             <p>The power of a couple of nerds and cheap servers</p>
         </div>
-        <div class="panel">
-            <div class="section-title">SERVICES</div>
-            <div class="links">
-                <a class="link" href="https://miraishi.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">Miraishi</div>
-                        <div class="desc">screen sharing</div>
-                    </div>
-                </a>
-                <a class="link" href="https://git.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">forgejo</div>
-                        <div class="desc">hell yeah code yee</div>
-                    </div>
-                </a>
-                <a class="link" href="https://cirno.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">cirno</div>
-                        <div class="desc">(9)baka</div>
-                    </div>
-                </a>
-                <a class="link" href="https://mail.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">Mail</div>
-                        <div class="desc">webmail</div>
-                    </div>
-                </a>
-                <a class="link" href="https://irc.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">IRC</div>
-                        <div class="desc">gamja</div>
-                    </div>
-                </a>
-                <a class="link" href="/anas">
-                    <div class="link-inner">
-                        <div class="name">anas redirect</div>
-                        <div class="desc">static anas archive redirect</div>
-                    </div>
-                </a>
-                <a class="link" href="https://b.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">bakugit</div>
-                        <div class="desc">github frontend</div>
-                    </div>
-                </a>
-                <a class="link" href="https://c.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">curda</div>
-                        <div class="desc">chords and lyrics</div>
-                    </div>
-                </a>
-                <a class="link" href="https://s.stairs.lat">
-                    <div class="link-inner">
-                        <div class="name">see</div>
-                        <div class="desc">shorten links</div>
-                    </div>
-                </a>
-            </div>
-        </div>
         <div class="buttons88">
             <a href="https://stairs.lat">
-                <img src="/button.png" alt="stairs.lat">
+                <img src="./button.png" alt="stairs.lat">
             </a>
-            <img src="/netherlands.png" alt="this server is in the netherlands">
-        </div>
-        <div class="footer">
-            hypertext under gpl 2.0 (<a href="stairslat.7z">source</a>) ° brought to you by <b>stairs industries</b> (<a href="/dmca">dmca</a>)
+            <img src="./argentina.png" alt="atendido por sus propios dueños">
+            <img src="./netherlands.png" alt="this server is in the netherlands">
+        </div>   
+    </div>   
+
+    <div class="panel">
+        <div class="section-title">SERVICES</div>
+        <div class="links">
+
+            <a class="link" href="https://miraishi.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">Miraishi</div>
+                    <div class="desc">screen sharing</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://git.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">forgejo</div>
+                    <div class="desc">hell yeah code yee</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://cirno.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">cirno</div>
+                    <div class="desc">(9)baka</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://mail.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">Mail</div>
+                    <div class="desc">webmail</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://irc.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">IRC</div>
+                    <div class="desc">gamja</div>
+                </div>
+            </a>
+
+            <a class="link" href="/anas">
+                <div class="link-inner">
+                    <div class="name">anas redirect</div>
+                    <div class="desc">static anas archive redirect</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://b.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">bakugit</div>
+                    <div class="desc">github frontend</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://c.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">curda</div>
+                    <div class="desc">chords and lyrics</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://s.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">see</div>
+                    <div class="desc">shorten links</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://f.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">files</div>
+                    <div class="desc">file sharing</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://p.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">pasta</div>
+                    <div class="desc">pastebin</div>
+                </div>
+            </a>
+
+            <a class="link" href="https://ip.stairs.lat">
+                <div class="link-inner">
+                    <div class="name">ip</div>
+                    <div class="desc">IP information</div>
+                </div>
+            </a>
+
         </div>
     </div>
+</div>   
+
+<div class="footer">
+    hypertext under gpl 2.0 (<a href="stairslat.7z">source</a>) ° brought to you by
+    <b>stairs industries</b> (<a href="/dmca">dmca</a>)
 </div>
 </body>
 </html>