@import url(https://fonts.bunny.net/css?family=atkinson-hyperlegible:400);

* {
    font-family: 'Atkinson Hyperlegible', sans-serif;
}

body {
    --bigfin-accent: #d1a0f2;
    --bigfin-primary: #131215;
    --bigfin-secondary: #090909;
    --bigfin-text: #ffffff;
    background: var(--bigfin-primary);
    color: var(--bigfin-text);
    padding: 5% 15% 5% 15%;
}

div.text {
    padding: 5%;
    padding-top: 5%;
}

code {
    font-family: monospace;
}

::selection {
    background: var(--bigfin-accent);
    color: var(--bigfin-primary);
}

a {
    color: var(--bigfin-accent);
}

::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-track {
    background: var(--bigfin-primary);
}

::-webkit-scrollbar-thumb {
    background: var(--bigfin-accent);
}

li {
    margin-top: 1%;
}

div {
    margin-top: 3%;
}

@keyframes colors {
    0% {
        color: var(--bigfin-accent);
    }
    50% {
        color: var(--bigfin-text);
    }
    100% {
        color: var(--bigfin-accent);
    }
}

h1, h3 {
    animation-name: colors;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}

span {
    padding-left: 1%;
}

i {
    font-size: 150%;
}

blockquote {
  border-left: 1px solid white;
  padding-left: 2%;
  margin-left: 0;
}

:root {
    --mylinkcolor: #d1a0f2;
}

small a {
    text-decoration: none;
}

small i {
    font-size: 12px;
}

webring-css {
    margin-top: 2%;
}

@media only screen and (max-width: 768px) {
    body {
        padding: 1% 5% 1% 5%;
    }

    code {
        display: none;
    }

    i {
        display: none;
    }

    #alts {
        display: none;
    }

    #contact, #tm {
        margin-top: 15%;
    }
}