/*
<!--

---- BEGIN SIGNATURE STRING ----

MzAgMzEgMzAgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzAgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzEgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzAgMzEgMzEgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzEgMzEgMzAgMzE=

---- END SIGNATURE STRING ----

-->
*/
/* Totally not stolen from a diffrent coder and edited */
@import url('./cappucin.css');

@font-face {
    font-family: W95FA;
    src: url(./src/W95FA-Regular.woff2) format('woff2'),
         url(./src/W95FA-Regular.woff) format('woff'),
         url(./src/W95FA-Regular.otf) format('truetype');
    font-display: swap;
}

@font-face {
    font-family: Departure Mono;
    src: url(./src/DepartureMono-Regular.woff2) format('woff2'),
         url(./src/DepartureMono-Regular.woff) format('woff'),
         url(./src/DepartureMono-Regular.otf) format('truetype');
    font-display: swap;
}

:root {
    font-family: W95FA, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    --accent-color: var(--azuretxzs-blue);
    --accent-color-secondary: var(--azuretxzs-mint);
    --rctv-anim-time: 0.25s;
}

* {
    margin: 0;
    padding: 0;
}

.status {
    border: none;
    width: 728px;
}

.invisible {
    display: none;
    height: 0px;
    width: 0px;
}

body {
    display: table;
    width: 100%;
    min-height: 100vh;
    background-color: var(--ctp-mocha-base);
}

.text {
    transition: font-size var(--rctv-anim-time);
}

.box {
    width: fit-content;
    min-width: fit-content;
    text-align: center;
}

.boxes {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
}

.me {
    min-height: 135px;

    margin-left: 50%;
    transform: translate(-50%, 20px);
    transition: min-height var(--rctv-anim-time);
}

/*
.subtle-glow {
    text-shadow: 0 0 9px;
}

.glowo {
    text-shadow: 0 0 16px;
}
*/

.title {
    font-size: 69px;
    font-weight: 500;
    transition: font-size var(--rctv-anim-time);
}

.title-primary {
    color: var(--accent-color);
    margin: 0 15px;
    transition: color 0.125s ease-out, font-size var(--rctv-anim-time) !important;
    display: inline-block;
    position: relative;
}

/* really awful solution */
.title-crack {
    margin-left: 16.5px;
}

.animation {
    color: var(--ctp-latte-mauve);
    font-size: 18px;
    margin-top: 80px;
}

.title-primary:hover {
    color: var(--accent-color-secondary);
}

/* stolen from somewhere idk */
.title-primary:after {
    content: "";
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    border-radius: 2px;
    height: 1px;
    bottom: 11%;
    left: 0;
    background-color: var(--accent-color);
    transform-origin: center right;
    transition: transform 0.125s ease-out, height 0.125s ease-out, bottom 0.125s ease-out, background-color 0.125s ease-out, border-radius 0.125s ease-out;
}

.title-primary:hover:after {
    transform: scaleX(1);
    transform-origin: center left;
    border-radius: 3px;
    height: 6px;
    bottom: 8%;
    background-color: var(--accent-color-secondary);
}

/* --- */

.title-secondary {
    color: var(--ctp-mocha-text);
}

.title-tetriary {
    color: var(--ctp-mocha-text);
    margin: 0 -15px;
}

/*

---- BEGIN SIGNATURE STRING ----

MzAgMzEgMzAgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzAgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzAgMzEgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzEgMzEgMzAgMzEgMzEgMzEgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzAgMzAgMzAgMzEgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzAgMjAgMzAgMzEgMzAgMzEgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMzAgMjAgMzAgMzEgMzAgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzEgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzEgMjAgMzAgMzEgMzEgMzEgMzEgMzAgMzAgMzEgMjAgMzAgMzAgMzEgMzEgMzAgMzEgMzAgMzEgMjAgMzAgMzEgMzEgMzAgMzEgMzAgMzEgMzAgMjAgMzAgMzEgMzEgMzAgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzEgMzAgMjAgMzAgMzAgMzEgMzEgMzAgMzAgMzAgMzAgMjAgMzAgMzAgMzEgMzEgMzEgMzEgMzAgMzE=

---- END SIGNATURE STRING ----

*/
.title-container {
    background: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 78px;
    user-select: none;
    margin-top: 4px;
}

.me-content-container {
    transition: margin-top var(--rctv-anim-time);
}

.content-container {
    margin-top: 10px;
}

.text {
    color: var(--ctp-mocha-text);
    font-size: 26px;
    transition: font-size var(--rctv-anim-time);
}

.small-text {
    font-size: 16px;
}

/* i need to start using LESS or something */
.socials a:visited {
    color: var(--ctp-mocha-text);
}

.this-svg-does-not-exist {
    position: absolute;
    height: 0px;
    user-select: none;
    pointer-events: none;
}

.socials {
    color: var(--ctp-mocha-text);
    font-family: Departure Mono, monospace;
    font-size: 22px;
    filter: url(#nukeantialiasing);
    transition: font-size var(--rctv-anim-time);
    width: max-content;
    margin: 0 auto;
    margin-top: 14px;
}

.s-center {
    width: max-content;
}

.socials p {
    text-align: left;
}

.projects a:visited {
    color: var(--ctp-mocha-text);
}

.projects {
    color: var(--ctp-mocha-text);
    font-family: Departure Mono, monospace;
    font-size: 22px;
    filter: url(#nukeantialiasing);
    transition: font-size var(--rctv-anim-time);
    width: max-content;
    margin: 0 auto;
    margin-top: 14px;
}

.projects p {
    text-align: left;
}

.ta-center {
    text-align: center !important;
}

.center-h {
    text-align: center;
    margin-left: 50%;
    transform: translate(-50%);
}

.chowonk-w {
    width: max-content;
}

.vsc-blue {
    color: var(--vsc-colors-blue) !important;
}

.vsc-gray {
    color: var(--vsc-colors-gray) !important;
}

.lat-mauve {
    color: var(--ctp-latte-mauve) !important;
}

.azure {
    color: var(--azuretxzs-blue) !important;
}

.mint {
    color: var(--azuretxzs-mint) !important;
}

.red {
    color: var(--ctp-mocha-red) !important;
}

.maroon {
    color: var(--ctp-mocha-maroon) !important;
}

.peach {
    color: var(--ctp-mocha-peach) !important;
}

.yellow {
    color: var(--ctp-mocha-yellow) !important;
}

.green {
    color: var(--ctp-mocha-green) !important;
}

.sky {
    color: var(--ctp-mocha-sky) !important;
}

.teal {
    color: var(--ctp-mocha-teal) !important;
}

.blue {
    color: var(--ctp-mocha-blue) !important;
}

.content {
    display: table-row;
    height: 100%;
}


footer {
    display: table-row-group;
    width: 100%;
}

footer>.boxes {
    margin-top: 2px;
}

hr {
    color: var(--ctp-mocha-surface1);
}

/* 88x31 buttons */
img[src*="88x31"], img[width="88"][height="31"] {
    image-rendering: auto;
    image-rendering: optimizeSpeed;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
    image-rendering: -webkit-optimize-contrast;
}
.gone {
    filter: grayscale(0.4) sepia(0.3) brightness(0.6) saturate(0.3);
}


@media only screen and (max-width: 505px) {
    .title {
        font-size: 58px;
    }

    .text {
        font-size: 20px;
    }

    .me-content-container {
        margin-top: -2px;
    }

    .me {
        min-height: 115px;
    }

    .status {
        display: none;
    }
}

/* everything below max-width: 413px completely breaks and idk why */
@media only screen and (max-width: 420px) {
    .title {
        font-size: 48px;
    }

    .text {
        font-size: 18px;
    }

    .socials {
        font-size: 16.5px;
        filter: unset; /* looks ass otherwise (sometimes) */
    }

        .projects {
        font-size: 16.5px;
        filter: unset; /* looks ass otherwise (sometimes) */
    }

    /* make filter exist on phone screens/hidpi */
    @media (resolution >= 2dppx) {
        .socials {
            filter: url(#nukeantialiasing) !important; /* looks ass otherwise (sometimes) */
        }
        .projects {
            filter: url(#nukeantialiasing) !important; /* looks ass otherwise (sometimes) */
        }
    }
}