@font-face {
    font-family: Oneshot;
    src: url('Oneshot.ttf');
}

html {
    overflow: scroll;
    overflow-x: hidden;
}

a:link {
  color: white; /* change to your color */
}
a:hover {
  color: white; /* change to your color */
}
a:visited {
  color: white; /* change to your color */
}
a:active {
  color: white; /* change to your color */
}


html, body {
    margin: 0;
    padding: 0;
}

body {
    color: black;
    font-family: Verdana;
    overflow: hidden;
}


/* =========================
   BACKGROUND LAYERS
   ========================= */

/* bruh.png - bottom layer */
#snow {
    background-image: url('bruh.png');
    background-repeat: repeat-x;
    background-position: 0 100%;
    background-size: auto 100%;
    
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100vw;
    height: 100vh;

    z-index: -2;
    pointer-events: none;

    animation: snow 1000s linear infinite;
}

/* aa.png - top layer */
#aa-layer {
    background-image: url('aa.png');
    background-repeat: repeat-x;
    background-position: 0 100%;
    background-size: auto 100%;

    position: fixed;
    bottom: 0;
    left: 0;
    width: 100vw;
    height: 100vh;

    z-index: -1;
    pointer-events: none;

    animation: aaScroll 300s linear infinite;
}


/* =========================
   ANIMATIONS
   ========================= */

@keyframes snow {
    from {
        background-position: 0 100%;
    }

    to {
        background-position: 50000px 100%;
    }
}

@keyframes aaScroll {
    from {
        background-position: 0 100%;
    }

    to {
        background-position: 25000px 100%;
    }
}


/* =========================
   WEBSITE CONTENT
   ========================= */

.content {
    position: relative;
    z-index: 10;
}