:root {
    --green: #00ff6e;
    --blue: #3700ff;
    --light-grey: #f5f5f4;
    --middle-grey: #8e929a;

    --pixel: 'pixelpoiizregular';
    --arial: Arial, Helvetica, sans-serif;

    --arrow: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' x='0px' y='0px' width='14px' height='14px' viewBox='0 0 40 40'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D .cls-2 %7B fill: %238e929a; %7D .cls-3 %7B fill: %23c7cbd3; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='30.12 20.93 28.27 20.93 28.27 19.09 26.42 19.09 26.42 17.24 24.57 17.24 24.57 15.41 22.73 15.41 22.73 13.56 20.88 13.56 20.88 11.71 19.04 11.71 19.04 9.86 17.19 9.86 17.19 8.02 15.34 8.02 15.34 6.17 13.5 6.17 13.5 4.32 9.88 4.32 9.88 33.81 13.5 33.81 13.5 31.94 15.35 31.94 15.35 30.19 15.35 30.11 15.35 28.27 17.23 28.27 17.23 30.11 19.08 30.11 19.08 31.96 20.94 31.96 20.94 33.79 22.78 33.79 22.78 35.65 26.44 35.65 26.44 30.15 24.59 30.15 24.59 26.42 26.45 26.42 26.45 24.57 30.12 24.57 30.12 20.93'/%3E%3Cpath class='cls-2' d='M32.04,20.88h-1.85v-1.86h-1.85v-1.84h-1.85v-1.85h-1.84v-1.83h-1.85v-1.85h-1.84v-1.85h-1.85v-1.85h-1.85v-1.83h-1.84v-1.86h-1.84v-1.82h-3.77v1.84h-1.83v29.58h1.85v1.84h5.6v-3.69h3.64v3.68h3.69v1.88h3.73v-1.87h1.85v-5.58h-1.83v-3.63h3.68v-1.87h1.86v-3.73ZM19.08,31.96v-1.85h-1.84v-1.84h-1.89v3.67h-1.85v1.86h-3.63V4.32h3.62v1.84h1.84v1.86h1.85v1.83h1.85v1.85h1.84v1.85h1.85v1.85h1.84v1.83h1.85v1.85h1.85v1.84h1.85v3.64h-3.68v1.85h-1.86v3.73h1.85v5.51h-3.66v-1.86h-1.84v-1.84h-1.86Z'/%3E%3Cpolygon class='cls-3' points='22.76 24.56 22.76 25.72 22.76 26.42 22.76 28.27 24.59 28.27 24.59 26.42 26.45 26.42 26.45 24.57 26.45 24.56 22.76 24.56'/%3E%3C/svg%3E") 0 0, default;
    --pointer: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' x='0px' y='0px' width='15px' height='15px' viewBox='0 0 40 40'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D .cls-2 %7B fill: %238e929a; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M35.28,15.33h-2.26v2.36h-2.45v-4.72h-2.26v4.72h-2.45v-4.72h-4.62v4.72h-2.45V3.54h-4.62v18.86h-2.45v-2.36h-2.36v-2.36h-4.62v4.62h2.36v2.36h2.36v4.71h2.36v2.36h2.36v2.36h2.36v2.36h14.05v-2.36h2.36v-9.43h2.36v-9.34ZM21.23,31.84h-2.45v-9.53h2.45v9.53ZM25.94,31.84h-2.45v-9.53h2.45v9.53ZM30.66,31.84h-2.45v-9.53h2.45v9.53Z'/%3E%3Cpath class='cls-2' d='M2.32,22.4v-4.81h2.31v-2.36h4.81v2.36h2.26V3.45h2.36V1.14h4.81v2.31h2.36v7.12h9.43v2.31h4.72v2.36h2.31v11.81h-2.31v7.14h-2.36v4.67H14.06v-4.67h-2.36v-2.36h-2.36v-2.36h-2.36v-4.72h-2.36v-2.36h-2.31ZM11.7,20.05h-2.36v-2.36h-4.62v4.62h2.36v2.36h2.36v4.71h2.36v2.36h2.36v2.36h2.36v2.36h14.05v-2.36h2.36v-9.43h2.36v-9.34h-2.26v2.36h-2.45v-4.72h-2.26v4.72h-2.45v-4.72h-4.62v4.72h-2.45V3.54h-4.62v18.86h-2.45v-2.36ZM18.77,22.31h2.45v9.53h-2.45v-9.53ZM23.49,22.31h2.45v9.53h-2.45v-9.53ZM28.2,22.31h2.45v9.53h-2.45v-9.53Z'/%3E%3C/svg%3E") 2 0, default;
}

body {
    box-sizing: border-box;
    width: 100vw;
    height: 100vh;
    background-color: var(--light-grey);
    color: var(--middle-grey);
    padding: 10px;
    font-family: var(--pixel);
    font-size: 10pt;
    line-height: 115%;
    overflow: hidden;

    cursor: var(--arrow);

    transition: all 0.7s ease-in-out;
    overflow: hidden;
}

::-moz-selection {
    /* color: #fff; */
    background-color: var(--green);
}

::selection {
    /* color: #fff; */
    background-color: var(--green);
}

a {
    font-family: var(--arial);
    font-weight: bold;
    color: var(--blue);
    cursor: var(--pointer);
}

a:hover {
    color: var(--green);
}

.arial {
    font-family: var(--arial);
    font-weight: lighter;
}

.px-font {
    font-family: var(--pixel);
    text-transform: uppercase;

}

p.icon-link {
    position: relative;
    margin-left: 3.5em;
    line-height: 130%;
}

.icone {
    font-family: 'icons';
    position: absolute;
    left: -2em;
    top: -0.13em;
}

.icone svg {
    width: 0.9em;
    height: auto;
    fill: var(--middle-grey);
    vertical-align: -0.05em;
}

.large svg {
    width: 1.15em;
}

table tr:hover td {
    background-color: white;
    /* text-shadow: white 3px 3px 3px; */

    /* text-shadow: 0px 1px 3px #FFF, 1px 0px 3px #FFF, -1px 0px 3px #FFF, -1px 1px 3px #FFF, -1px -1px 3px #FFF, 0 0 3px #FFF, 0px 1px 2px #FFF, 1px 0px 2px #FFF, -1px 0px 2px #FFF, -1px 1px 2px #FFF, -1px -1px 2px #FFF, 0 0 1px #FFF, 0 0 2px #FFF, 0 0 3px #FFF, 0 0 5px #FFF, 0 0 10px #FFF, 0 0 15px #FFF, 2px 2px 2px #ffffff; */
}

table tr td:nth-child(1) {
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

table tr td:nth-child(3) {
    padding-right: 1.5em;
    padding-left: 2.5em;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

.mini-footer {
    position: fixed;
    bottom: 0;
    padding: 10px;
    display: flex;
}

.perrito {
    width: 1.2em;
    min-width: 15px;

    margin-right: 1em;
}

.perrito img {
    width: 100%;
    height: auto;
}

.cutephrase {
    font-family: var(--arial);
}



/* ANIMATIONS pixels */

.dot {
    position: absolute;
    width: 2px;
    height: 2px;
    background-color: #8e929ae9;
    pointer-events: none;
    animation-timing-function: linear;
}

@keyframes moveRight {
    0% {
        opacity: 1;
        transform: translate(0px, 0px);
    }

    100% {
        opacity: 0;
        transform: translate(100vw, var(--fall-distance));
    }
}

.explosion-dot {
    position: absolute;
    width: 2px;
    height: 2px;
    background-color: #8e929ae9;
    pointer-events: none;
    animation: explosion 1s ease-out forwards;
}

@keyframes explosion {
    0% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
    }

    100% {
        transform: translate(var(--deltaX), var(--deltaY)) scale(0.9);
        opacity: 0;
    }
}

@media (max-width: 600px) {
    body {
        font-size: clamp(9px, 3.6vw, 12pt);
        overflow: hidden;
    }

    p.icon-link {
        margin-left: 2.5em;
    }
}


/***
 *          .
 *      .x88888x.                      ..
 *     :8**888888X.  :>        u.     888>         u.
 *     f    `888888x./   ...ue888b    "8P    ...ue888b
 *    '       `*88888~   888R Y888r    .     888R Y888r
 *     \.    .  `?)X.    888R I888>  u888u.  888R I888>
 *      `~=-^   X88> ~   888R I888> `'888E   888R I888>
 *             X8888  ~  888R I888>   888E   888R I888>
 *             488888   u8888cJ888    888E  u8888cJ888     .
 *     .xx.     88888X   "*888*P"     888E   "*888*P"    .@8c
 *    '*8888.   '88888>    'Y"        888E     'Y"      '%888"
 *      88888    '8888>               888E                ^*
 *      `8888>    `888                888E
 *       "8888     8%                 888P
 *        `"888x:-"                 .J88" "
 *         ...     ..                                  ..
 *      .=*8888x <"?88h.                             dF
 *     X>  '8888H> '8888                 u.    u.   '88bu.             u.
 *    '88h. `8888   8888        .u     x@88k u@88c. '*88888bu    ...ue888b
 *    '8888 '8888    "88>    ud8888.  ^"8888""8888"   ^"*8888N   888R Y888r
 *     `888 '8888.xH888x.  :888'8888.   8888  888R   beWE "888L  888R I888>
 *       X" :88*~  `*8888> d888 '88%"   8888  888R   888E  888E  888R I888>
 *     ~"   !"`      "888> 8888.+"      8888  888R   888E  888E  888R I888>
 *      .H8888h.      ?88  8888L        8888  888R   888E  888F u8888cJ888
 *     :"^"88888h.    '!   '8888c. .+  "*88*" 8888" .888N..888   "*888*P"
 *     ^    "88888hx.+"     "88888%      ""   'Y"    `"888*""      'Y"
 *            ^"**""          "YP'                      ""
 *
 */