:root {
    --font-title: "Archivo Black", sans-serif;
    --font-paraph: "Syne", sans-serif;
    --font-color: "Racing Sans One", sans-serif;
}

/* reset */
* {
    margin: 0;
    padding: 0;
    color: inherit;
    box-sizing: border-box;
    scroll-behavior: smooth;
}
html {
    width: 100dvw;   
}
body {
    min-height: 100vh;
    height: max-content;
    width: 100%;
    overflow-x: hidden;
    position: relative;
    --sb-track-color: #FFFFFF;
    --sb-thumb-color: #0C3112;
    --sb-size: 14px;    
}
li, a {
    list-style: none;
    text-decoration: none;
}
button {
    cursor: pointer;
}

body::-webkit-scrollbar {
    width: var(--sb-size);
}
body::-webkit-scrollbar-track {
    background: var(--sb-track-color);
    border-radius: 1px;
}
body::-webkit-scrollbar-thumb {
    background: var(--sb-thumb-color);
    border-radius: 1px;
}

.container-principal {
    min-height: 100vh;
    height: 100%;
    width: 100%;
    display: grid;
    grid:
        "header" auto
        "main" 1fr
        "footer" auto
        / 1fr;
}
/* HEADER */
.header { 
    grid-area: header;
    padding: 4vh;
}
    .header h1 {
        text-transform: uppercase;
        font-family: var(--font-title);
    }
/* MAIN */
.main { 
    grid-area: main;
    padding: 2vh 4vh;
    width: 100%;
    display: grid;
    grid:
        "filter-container" auto
        "palettes-section" 1fr
        / 1fr;
}
/* SECTION FILTER */
.filter-container { grid-area: filter-container; }
.filter-control {
    padding: 4vh 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
    .btn-filter {
        border: 3px solid #000;
        box-shadow: 4px 4px 0px #000;
        min-width: 5vw;
        font-family: var(--font-color);
        padding: 1vh;
    }
/* H2 */
h2 {
    font-family: var(--font-paraph);
    text-transform: uppercase;
    font-weight: 400;
}
/* SECTION PALETTE */
.palettes-section { 
    grid-area: palettes-section;
    width: 100%;
    display: grid;
    grid:
        "palettes-title" auto
        "palettes-container" 1fr
        / 1fr;
}
    .palettes-title {
        grid-area: palettes-title;
    } 
.palettes-container {
    grid-area: palettes-container;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8vh;
    padding: 2vh;
}
    .palette-container {
        cursor: pointer;
        transition: all 120ms ease-out;
        height: 20vh;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        border: 2px solid #000;
        box-shadow: 4px 4px 0px #000;        
    }
    .palette-container:hover {
        scale: 1.06;
    }
    /* PALETTE CARD */
        .card-palette {
            border: 3px solid #000;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;

        }
            .color-title {
                font-family: var(--font-color);
            }
            .color-square {
                display: flex;
                align-items: center;
                justify-content: center;
                width: 100%;
                height: 100%;
            }
/* LINE 1 */
/* PAL 1 */
.pal-one .card-palette:nth-of-type(1) .color-square {
    background-color: #0C3112;
} 
.pal-one .card-palette:nth-of-type(2) .color-square {
    background-color: #54C366;
} 
.pal-one .card-palette:nth-of-type(3) .color-square {
    background-color: #AAFF00;
}
.pal-one .card-palette:nth-of-type(4) .color-square {
    background-color: #AA00FF;
}
.pal-one .card-palette:nth-of-type(5) .color-square {
    background-color: #CCCCFF;
} 
.pal-one .card-palette:nth-of-type(6) .color-square {
    background-color: #f7f7ff;
}
/* PAL 2 */
.pal-two .card-palette:nth-of-type(1) .color-square {
    background-color: #85ACFF;
} 
.pal-two .card-palette:nth-of-type(2) .color-square {
    background-color: #4800FF;
} 
.pal-two .card-palette:nth-of-type(3) .color-square {
    background-color: #FFFF00;
}
.pal-two .card-palette:nth-of-type(4) .color-square {
    background-color: #FFAA00;
}
.pal-two .card-palette:nth-of-type(5) .color-square {
    background-color: #342300;
} 
.pal-two .card-palette:nth-of-type(6) .color-square {
    background-color: #f5f5f5;
}
/* PAL 3 */
.pal-three .card-palette:nth-of-type(1) .color-square {
    background-color: #A6E394;
} 
.pal-three .card-palette:nth-of-type(2) .color-square {
    background-color: #003405;
} 
.pal-three .card-palette:nth-of-type(3) .color-square {
    background-color: #D194E3;
}
.pal-three .card-palette:nth-of-type(4) .color-square {
    background-color: #63486B;
}
.pal-three .card-palette:nth-of-type(5) .color-square {
    background-color: #000e02;
} 
.pal-three .card-palette:nth-of-type(6) .color-square {
    background-color: #F4FCF2;
}
/* LINE 2 */
/* PAL 4 */
.pal-four .card-palette:nth-of-type(1) .color-square {
    background-color: #ffe5ac;
} 
.pal-four .card-palette:nth-of-type(2) .color-square {
    background-color: #4D96FF;
} 
.pal-four .card-palette:nth-of-type(3) .color-square {
    background-color: #6BCB77;
}
.pal-four .card-palette:nth-of-type(4) .color-square {
    background-color: #FFD93D;
}
.pal-four .card-palette:nth-of-type(5) .color-square {
    background-color: #151515;
} 
.pal-four .card-palette:nth-of-type(6) .color-square {
    background-color: #F0F0F0;
}
/* PAL 5 */
.pal-five .card-palette:nth-of-type(1) .color-square {
    background-color: #F2D1D8;
} 
.pal-five .card-palette:nth-of-type(2) .color-square {
    background-color: #D96C8E;
} 
.pal-five .card-palette:nth-of-type(3) .color-square {
    background-color: #A62A52;
}
.pal-five .card-palette:nth-of-type(4) .color-square {
    background-color: #4A1A2D;
}
.pal-five .card-palette:nth-of-type(5) .color-square {
    background-color: #1A0B12;
} 
.pal-five .card-palette:nth-of-type(6) .color-square {
    background-color: #FFFFFF;
}
/* PAL 6 */
.pal-six .card-palette:nth-of-type(1) .color-square {
    background-color: #ffa7b1;
} 
.pal-six .card-palette:nth-of-type(2) .color-square {
    background-color: #ADC973;
} 
.pal-six .card-palette:nth-of-type(3) .color-square {
    background-color: #6B8E23;
}
.pal-six .card-palette:nth-of-type(4) .color-square {
    background-color: #E7005A;
}
.pal-six .card-palette:nth-of-type(5) .color-square {
    background-color: #FD7A81;
} 
.pal-six .card-palette:nth-of-type(6) .color-square {
    background-color: #000304;
}
/* LINE 3 */
/* PAL 7 */
.pal-seven .card-palette:nth-of-type(1) .color-square {
    background-color: #FFD166;
} 
.pal-seven .card-palette:nth-of-type(2) .color-square {
    background-color: #F7A072;
} 
.pal-seven .card-palette:nth-of-type(3) .color-square {
    background-color: #E07A5F;
}
.pal-seven .card-palette:nth-of-type(4) .color-square {
    background-color: #3D405B;
}
.pal-seven .card-palette:nth-of-type(5) .color-square {
    background-color: #1A1A2E;
} 
.pal-seven .card-palette:nth-of-type(6) .color-square {
    background-color: #FFFFFF;
}
/* PAL 8 */
.pal-eight .card-palette:nth-of-type(1) .color-square {
    background-color: #7FFFD4;
} 
.pal-eight .card-palette:nth-of-type(2) .color-square {
    background-color: #20B2AA;
} 
.pal-eight .card-palette:nth-of-type(3) .color-square {
    background-color: #006994;
}
.pal-eight .card-palette:nth-of-type(4) .color-square {
    background-color: #FFD700;
}
.pal-eight .card-palette:nth-of-type(5) .color-square {
    background-color: #1A0B12;
} 
.pal-eight .card-palette:nth-of-type(6) .color-square {
    background-color: #FFFFFF;
}
/* PAL 9 */
.pal-nine .card-palette:nth-of-type(1) .color-square {
    background-color: #FFFACD;
} 
.pal-nine .card-palette:nth-of-type(2) .color-square {
    background-color: #90EE90;
} 
.pal-nine .card-palette:nth-of-type(3) .color-square {
    background-color: #2E8B57;
}
.pal-nine .card-palette:nth-of-type(4) .color-square {
    background-color: #ADFF2F;
}
.pal-nine .card-palette:nth-of-type(5) .color-square {
    background-color: #F6FFE8;
} 
.pal-nine .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1A1A;
}
/* LINE 4 */
/* PAL 10 */
.pal-ten .card-palette:nth-of-type(1) .color-square {
    background-color: #EE964B;
} 
.pal-ten .card-palette:nth-of-type(2) .color-square {
    background-color: #F4D35E;
} 
.pal-ten .card-palette:nth-of-type(3) .color-square {
    background-color: #90BE6D;
}
.pal-ten .card-palette:nth-of-type(4) .color-square {
    background-color: #A7D6C6;
}
.pal-ten .card-palette:nth-of-type(5) .color-square {
    background-color: #FFF2D9;
} 
.pal-ten .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1A1A;
}
/* PAL 11 */
.pal-eleven .card-palette:nth-of-type(1) .color-square {
    background-color: #90EE90;
}
.pal-eleven .card-palette:nth-of-type(2) .color-square {
    background-color: #87CEEB;
}
.pal-eleven .card-palette:nth-of-type(3) .color-square {
    background-color: #ADD8E6;
}
.pal-eleven .card-palette:nth-of-type(4) .color-square {
    background-color: #FAFAD2;
}
.pal-eleven .card-palette:nth-of-type(5) .color-square {
    background-color: #FFDEAD;
}
.pal-eleven .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1A1A;
}
/* PAL 12 */
.pal-twelve .card-palette:nth-of-type(1) .color-square {
    background-color: #FF6600;
}
.pal-twelve .card-palette:nth-of-type(2) .color-square {
    background-color: #CC5500;
}
.pal-twelve .card-palette:nth-of-type(3) .color-square {
    background-color: #FF9966;
}
.pal-twelve .card-palette:nth-of-type(4) .color-square {
    background-color: #FFDBAC;
}
.pal-twelve .card-palette:nth-of-type(5) .color-square {
    background-color: #F2E8CF;
}
.pal-twelve .card-palette:nth-of-type(6) .color-square {
    background-color: #0F0F0F;
}
/* LINE 5 */
/* PAL 13 */
.pal-thirteen .card-palette:nth-of-type(1) .color-square {
    background-color: #1A1A1A;
}
.pal-thirteen .card-palette:nth-of-type(2) .color-square {
    background-color: #C5A572;
}
.pal-thirteen .card-palette:nth-of-type(3) .color-square {
    background-color: #E8DCC2;
}
.pal-thirteen .card-palette:nth-of-type(4) .color-square {
    background-color: #8C7851;
}
.pal-thirteen .card-palette:nth-of-type(5) .color-square {
    background-color: #F5EFE6;
}
.pal-thirteen .card-palette:nth-of-type(6) .color-square {
    background-color: #000000;
}
/* PAL 14 */
.pal-fourteen .card-palette:nth-of-type(1) .color-square {
    background-color: #f59b00;
}
.pal-fourteen .card-palette:nth-of-type(2) .color-square {
    background-color: #00A6FB;
}
.pal-fourteen .card-palette:nth-of-type(3) .color-square {
    background-color: #F5F5F5;
}
.pal-fourteen .card-palette:nth-of-type(4) .color-square {
    background-color: #F9C80E;
}
.pal-fourteen .card-palette:nth-of-type(5) .color-square {
    background-color: #2D2D2D;
}
.pal-fourteen .card-palette:nth-of-type(6) .color-square {
    background-color: #000000;
}
/* PAL 15 */
.pal-fifteen .card-palette:nth-of-type(1) .color-square {
    background-color: #00E5FF;
}
.pal-fifteen .card-palette:nth-of-type(2) .color-square {
    background-color: #0081A7;
}
.pal-fifteen .card-palette:nth-of-type(3) .color-square {
    background-color: #1A1A1A;
}
.pal-fifteen .card-palette:nth-of-type(4) .color-square {
    background-color: #4D4D4D;
}
.pal-fifteen .card-palette:nth-of-type(5) .color-square {
    background-color: #B0BEC5;
}
.pal-fifteen .card-palette:nth-of-type(6) .color-square {
    background-color: #000000;
}
/* LINE 6 */
/* PAL 16 */
.pal-sixteen .card-palette:nth-of-type(1) .color-square {
    background-color: #2962FF;
}
.pal-sixteen .card-palette:nth-of-type(2) .color-square {
    background-color: #00C853;
}
.pal-sixteen .card-palette:nth-of-type(3) .color-square {
    background-color: #FFD600;
}
.pal-sixteen .card-palette:nth-of-type(4) .color-square {
    background-color: #D50000;
}
.pal-sixteen .card-palette:nth-of-type(5) .color-square {
    background-color: #F5F5F5;
}
.pal-sixteen .card-palette:nth-of-type(6) .color-square {
    background-color: #212121;
}
/* PAL 17 */
.pal-seventeen .card-palette:nth-of-type(1) .color-square {
    background-color: #3498DB;
}
.pal-seventeen .card-palette:nth-of-type(2) .color-square {
    background-color: #2ECC71;
}
.pal-seventeen .card-palette:nth-of-type(3) .color-square {
    background-color: #E74C3C;
}
.pal-seventeen .card-palette:nth-of-type(4) .color-square {
    background-color: #F1C40F;
}
.pal-seventeen .card-palette:nth-of-type(5) .color-square {
    background-color: #ECF0F1;
}
.pal-seventeen .card-palette:nth-of-type(6) .color-square {
    background-color: #2C3E50;
}
/* PAL 18 */
.pal-eighteen .card-palette:nth-of-type(1) .color-square {
    background-color: #FF0000;
}
.pal-eighteen .card-palette:nth-of-type(2) .color-square {
    background-color: #000000;
}
.pal-eighteen .card-palette:nth-of-type(3) .color-square {
    background-color: #FFFFFF;
}
.pal-eighteen .card-palette:nth-of-type(4) .color-square {
    background-color: #E0E0E0;
}
.pal-eighteen .card-palette:nth-of-type(5) .color-square {
    background-color: #9E9E9E;
}
.pal-eighteen .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1A1A;
}
/* LINE 7 */
/* PAL 19 */
.pal-nineteen .card-palette:nth-of-type(1) .color-square {
    background-color: #FF0000;
}
.pal-nineteen .card-palette:nth-of-type(2) .color-square {
    background-color: #0000FF;
}
.pal-nineteen .card-palette:nth-of-type(3) .color-square {
    background-color: #FFFF00;
}
.pal-nineteen .card-palette:nth-of-type(4) .color-square {
    background-color: #000000;
}
.pal-nineteen .card-palette:nth-of-type(5) .color-square {
    background-color: #FFFFFF;
}
.pal-nineteen .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1A1A;
}
/* PAL 20 */
.pal-twenty .card-palette:nth-of-type(1) .color-square {
    background-color: #0D0D0B;
}
.pal-twenty .card-palette:nth-of-type(2) .color-square {
    background-color: #0A1F14;
}
.pal-twenty .card-palette:nth-of-type(3) .color-square {
    background-color: #145C3A;
}
.pal-twenty .card-palette:nth-of-type(4) .color-square {
    background-color: #7CFF4F;
}
.pal-twenty .card-palette:nth-of-type(5) .color-square {
    background-color: #00E0C6;
}
.pal-twenty .card-palette:nth-of-type(6) .color-square {
    background-color: #F2FFE9;
}
/* PAL 21 */
.pal-twenty-one .card-palette:nth-of-type(1) .color-square {
    background-color: #0F0A06;
}
.pal-twenty-one .card-palette:nth-of-type(2) .color-square {
    background-color: #1A0F05;
}
.pal-twenty-one .card-palette:nth-of-type(3) .color-square {
    background-color: #4A2E12;
}
.pal-twenty-one .card-palette:nth-of-type(4) .color-square {
    background-color: #FF7A00;
}
.pal-twenty-one .card-palette:nth-of-type(5) .color-square {
    background-color: #FFD54A;
}
.pal-twenty-one .card-palette:nth-of-type(6) .color-square {
    background-color: #FFF7E3;
}
/* LINE 8 */
/* PAL 22 */
.pal-twenty-two .card-palette:nth-of-type(1) .color-square {
    background-color: #FDFBFF;
}
.pal-twenty-two .card-palette:nth-of-type(2) .color-square {
    background-color: #812dff;
}
.pal-twenty-two .card-palette:nth-of-type(3) .color-square {
    background-color: #ff1d7f;
}
.pal-twenty-two .card-palette:nth-of-type(4) .color-square {
    background-color: #1affa0;
}
.pal-twenty-two .card-palette:nth-of-type(5) .color-square {
    background-color: #24a0ff;
}
.pal-twenty-two .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1620;
}
/* PAL 23 */
.pal-twenty-three .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF8E6;
}
.pal-twenty-three .card-palette:nth-of-type(2) .color-square {
    background-color: #FF5EB8;
}
.pal-twenty-three .card-palette:nth-of-type(3) .color-square {
    background-color: #FFB400;
}
.pal-twenty-three .card-palette:nth-of-type(4) .color-square {
    background-color: #00CFFF;
}
.pal-twenty-three .card-palette:nth-of-type(5) .color-square {
    background-color: #7AFF4A;
}
.pal-twenty-three .card-palette:nth-of-type(6) .color-square {
    background-color: #1A0F12;
}
/* PAL 24 */
.pal-twenty-four .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF9F4;
}
.pal-twenty-four .card-palette:nth-of-type(2) .color-square {
    background-color: #ff003c;
}
.pal-twenty-four .card-palette:nth-of-type(3) .color-square {
    background-color: #ffbf00;
}
.pal-twenty-four .card-palette:nth-of-type(4) .color-square {
    background-color: #0088ff;
}
.pal-twenty-four .card-palette:nth-of-type(5) .color-square {
    background-color: #00ff51;
}
.pal-twenty-four .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1414;
}
/* LINE 9 */
/* PAL 25 */
.pal-twenty-five .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF9FF;
}
.pal-twenty-five .card-palette:nth-of-type(2) .color-square {
    background-color: #E8D7FF;
}
.pal-twenty-five .card-palette:nth-of-type(3) .color-square {
    background-color: #FFD9E6;
}
.pal-twenty-five .card-palette:nth-of-type(4) .color-square {
    background-color: #CFF7E8;
}
.pal-twenty-five .card-palette:nth-of-type(5) .color-square {
    background-color: #C7E3FF;
}
.pal-twenty-five .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1620;
}
/* PAL 26 */
.pal-twenty-six .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF7E4;
}
.pal-twenty-six .card-palette:nth-of-type(2) .color-square {
    background-color: #9b009d;
}
.pal-twenty-six .card-palette:nth-of-type(3) .color-square {
    background-color: #ae6e00;
}
.pal-twenty-six .card-palette:nth-of-type(4) .color-square {
    background-color: #007b9d;
}
.pal-twenty-six .card-palette:nth-of-type(5) .color-square {
    background-color: #6ec200;
}
.pal-twenty-six .card-palette:nth-of-type(6) .color-square {
    background-color: #1A0F12;
}
/* PAL 27 */
.pal-twenty-seven .card-palette:nth-of-type(1) .color-square {
    background-color: #FDFBF6;
}
.pal-twenty-seven .card-palette:nth-of-type(2) .color-square {
    background-color: #d8beff;
}
.pal-twenty-seven .card-palette:nth-of-type(3) .color-square {
    background-color: #FFC8F0;
}
.pal-twenty-seven .card-palette:nth-of-type(4) .color-square {
    background-color: #BEEAFF;
}
.pal-twenty-seven .card-palette:nth-of-type(5) .color-square {
    background-color: #ffd7ad;
}
.pal-twenty-seven .card-palette:nth-of-type(6) .color-square {
    background-color: #1A1A17;
}
/* LINE 10 */
/* PAL 28 */
.pal-twenty-eight .card-palette:nth-of-type(1) .color-square {
    background-color: #FFFDF3;
}
.pal-twenty-eight .card-palette:nth-of-type(2) .color-square {
    background-color: #FF00A8;
}
.pal-twenty-eight .card-palette:nth-of-type(3) .color-square {
    background-color: #00F0FF;
}
.pal-twenty-eight .card-palette:nth-of-type(4) .color-square {
    background-color: #FFEA00;
}
.pal-twenty-eight .card-palette:nth-of-type(5) .color-square {
    background-color: #7AFF00;
}
.pal-twenty-eight .card-palette:nth-of-type(6) .color-square {
    background-color: #0D0A0F;
}
/* PAL 29 */
.pal-twenty-nine .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF8F9;
}
.pal-twenty-nine .card-palette:nth-of-type(2) .color-square {
    background-color: #FF2EC4;
}
.pal-twenty-nine .card-palette:nth-of-type(3) .color-square {
    background-color: #FF6B00;
}
.pal-twenty-nine .card-palette:nth-of-type(4) .color-square {
    background-color: #00A8FF;
}
.pal-twenty-nine .card-palette:nth-of-type(5) .color-square {
    background-color: #0022FF;
}
.pal-twenty-nine .card-palette:nth-of-type(6) .color-square {
    background-color: #1A0E10;
}
/* PAL 30 */
.pal-thirty .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF8F9;
}
.pal-thirty .card-palette:nth-of-type(2) .color-square {
    background-color: #FF2EC4;
}
.pal-thirty .card-palette:nth-of-type(3) .color-square {
    background-color: #FF6B00;
}
.pal-thirty .card-palette:nth-of-type(4) .color-square {
    background-color: #FFE600;
}
.pal-thirty .card-palette:nth-of-type(5) .color-square {
    background-color: #00A8FF;
}
.pal-thirty .card-palette:nth-of-type(6) .color-square {
    background-color: #1A0E10;
}
/* LINE 11 */
/* PAL 31 */
.pal-thirty-one .card-palette:nth-of-type(1) .color-square {
    background-color: #F7FFF4;
}
.pal-thirty-one .card-palette:nth-of-type(2) .color-square {
    background-color: #00FF8C;
}
.pal-thirty-one .card-palette:nth-of-type(3) .color-square {
    background-color: #00E0FF;
}
.pal-thirty-one .card-palette:nth-of-type(4) .color-square {
    background-color: #FFE200;
}
.pal-thirty-one .card-palette:nth-of-type(5) .color-square {
    background-color: #0A0F0C;
}
.pal-thirty-one .card-palette:nth-of-type(6) .color-square {
    background-color: #1A0E10;
}
/* PAL 32 */
.pal-thirty-two .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF6F0;
}
.pal-thirty-two .card-palette:nth-of-type(2) .color-square {
    background-color: #FF005C;
}
.pal-thirty-two .card-palette:nth-of-type(3) .color-square {
    background-color: #FF7A00;
}
.pal-thirty-two .card-palette:nth-of-type(4) .color-square {
    background-color: #00FFD1;
}
.pal-thirty-two .card-palette:nth-of-type(5) .color-square {
    background-color: #006CFF;
}
.pal-thirty-two .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0A0C;
}
/* PAL 33 */
.pal-thirty-three .card-palette:nth-of-type(1) .color-square {
    background-color: #F8FFF9;
}
.pal-thirty-three .card-palette:nth-of-type(2) .color-square {
    background-color: #00FF9C;
}
.pal-thirty-three .card-palette:nth-of-type(3) .color-square {
    background-color: #FF007A;
}
.pal-thirty-three .card-palette:nth-of-type(4) .color-square {
    background-color: #FFE500;
}
.pal-thirty-three .card-palette:nth-of-type(5) .color-square {
    background-color: #0080FF;
}
.pal-thirty-three .card-palette:nth-of-type(6) .color-square {
    background-color: #0C0F0E;
}
/* LINE 12 */
/* PAL 34 */
.pal-thirty-four .card-palette:nth-of-type(1) .color-square {
    background-color: #F4FFFD;
}
.pal-thirty-four .card-palette:nth-of-type(2) .color-square {
    background-color: #00FFE1;
}
.pal-thirty-four .card-palette:nth-of-type(3) .color-square {
    background-color: #00A2FF;
}
.pal-thirty-four .card-palette:nth-of-type(4) .color-square {
    background-color: #7B00FF;
}
.pal-thirty-four .card-palette:nth-of-type(5) .color-square {
    background-color: #FF0099;
}
.pal-thirty-four .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0F11;
}
/* PAL 35 */
.pal-thirty-five .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF8F2;
}
.pal-thirty-five .card-palette:nth-of-type(2) .color-square {
    background-color: #FF005C;
}
.pal-thirty-five .card-palette:nth-of-type(3) .color-square {
    background-color: #FF7A00;
}
.pal-thirty-five .card-palette:nth-of-type(4) .color-square {
    background-color: #FFE200;
}
.pal-thirty-five .card-palette:nth-of-type(5) .color-square {
    background-color: #FF4FD1;
}
.pal-thirty-five .card-palette:nth-of-type(6) .color-square {
    background-color: #0F0A0A;
}
/* PAL 36 */
.pal-thirty-six .card-palette:nth-of-type(1) .color-square {
    background-color: #F6FBFF;
}
.pal-thirty-six .card-palette:nth-of-type(2) .color-square {
    background-color: #00E0FF;
}
.pal-thirty-six .card-palette:nth-of-type(3) .color-square {
    background-color: #00FF8C;
}
.pal-thirty-six .card-palette:nth-of-type(4) .color-square {
    background-color: #FF00A8;
}
.pal-thirty-six .card-palette:nth-of-type(5) .color-square {
    background-color: #7B00FF;
}
.pal-thirty-six .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0C12;
}
/* LINE 13 */
/* PAL 37 */
.pal-thirty-seven .card-palette:nth-of-type(1) .color-square {
    background-color: #F4FBFF;
}
.pal-thirty-seven .card-palette:nth-of-type(2) .color-square {
    background-color: #008CFF;
}
.pal-thirty-seven .card-palette:nth-of-type(3) .color-square {
    background-color: #00C8FF;
}
.pal-thirty-seven .card-palette:nth-of-type(4) .color-square {
    background-color: #FF7A00;
}
.pal-thirty-seven .card-palette:nth-of-type(5) .color-square {
    background-color: #FFE200;
}
.pal-thirty-seven .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0C12;
}
/* PAL 38 */
.pal-thirty-eight .card-palette:nth-of-type(1) .color-square {
    background-color: #F8F6FF;
}
.pal-thirty-eight .card-palette:nth-of-type(2) .color-square {
    background-color: #7B00FF;
}
.pal-thirty-eight .card-palette:nth-of-type(3) .color-square {
    background-color: #C000FF;
}
.pal-thirty-eight .card-palette:nth-of-type(4) .color-square {
    background-color: #00FFE1;
}
.pal-thirty-eight .card-palette:nth-of-type(5) .color-square {
    background-color: #FFE600;
}
.pal-thirty-eight .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0712;
}
/* PAL 39 */
.pal-thirty-nine .card-palette:nth-of-type(1) .color-square {
    background-color: #F6FFF9;
}
.pal-thirty-nine .card-palette:nth-of-type(2) .color-square {
    background-color: #00C2FF;
}
.pal-thirty-nine .card-palette:nth-of-type(3) .color-square {
    background-color: #0080FF;
}
.pal-thirty-nine .card-palette:nth-of-type(4) .color-square {
    background-color: #FFB200;
}
.pal-thirty-nine .card-palette:nth-of-type(5) .color-square {
    background-color: #FF6A00;
}
.pal-thirty-nine .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0F0E;
}
/* LINE 14 */
/* PAL 40 */
.pal-forty .card-palette:nth-of-type(1) .color-square {
    background-color: #F4F9FF;
}
.pal-forty .card-palette:nth-of-type(2) .color-square {
    background-color: #007BFF;
}
.pal-forty .card-palette:nth-of-type(3) .color-square {
    background-color: #00C8FF;
}
.pal-forty .card-palette:nth-of-type(4) .color-square {
    background-color: #FFE200;
}
.pal-forty .card-palette:nth-of-type(5) .color-square {
    background-color: #FF007A;
}
.pal-forty .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0C12;
}
/* PAL 41 */
.pal-forty-one .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF6FB;
}
.pal-forty-one .card-palette:nth-of-type(2) .color-square {
    background-color: #FF2EC4;
}
.pal-forty-one .card-palette:nth-of-type(3) .color-square {
    background-color: #FF6B00;
}
.pal-forty-one .card-palette:nth-of-type(4) .color-square {
    background-color: #FFE500;
}
.pal-forty-one .card-palette:nth-of-type(5) .color-square {
    background-color: #00E0FF;
}
.pal-forty-one .card-palette:nth-of-type(6) .color-square {
    background-color: #0F0A11;
}
/* PAL 42 */
.pal-forty-two .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF7EE;
}
.pal-forty-two .card-palette:nth-of-type(2) .color-square {
    background-color: #FF7A00;
}
.pal-forty-two .card-palette:nth-of-type(3) .color-square {
    background-color: #FFB800;
}
.pal-forty-two .card-palette:nth-of-type(4) .color-square {
    background-color: #FFE500;
}
.pal-forty-two .card-palette:nth-of-type(5) .color-square {
    background-color: #008CFF;
}
.pal-forty-two .card-palette:nth-of-type(6) .color-square {
    background-color: #0F0A0A;
}
/* LINE 15 */
/* PAL 43 */
.pal-forty-three .card-palette:nth-of-type(1) .color-square {
    background-color: #F4F7FF;
}
.pal-forty-three .card-palette:nth-of-type(2) .color-square {
    background-color: #006CFF;
}
.pal-forty-three .card-palette:nth-of-type(3) .color-square {
    background-color: #00E0FF;
}
.pal-forty-three .card-palette:nth-of-type(4) .color-square {
    background-color: #FF7A00;
}
.pal-forty-three .card-palette:nth-of-type(5) .color-square {
    background-color: #FFE200;
}
.pal-forty-three .card-palette:nth-of-type(6) .color-square {
    background-color: #F2FFE9;
}
/* PAL 44 */
.pal-forty-four .card-palette:nth-of-type(1) .color-square {
    background-color: #F6F4EE;
}
.pal-forty-four .card-palette:nth-of-type(2) .color-square {
    background-color: #0077B6;
}
.pal-forty-four .card-palette:nth-of-type(3) .color-square {
    background-color: #00A8E8;
}
.pal-forty-four .card-palette:nth-of-type(4) .color-square {
    background-color: #F4A261;
}
.pal-forty-four .card-palette:nth-of-type(5) .color-square {
    background-color: #E76F51;
}
.pal-forty-four .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0E0D;
}
/* PAL 45 */
.pal-forty-five .card-palette:nth-of-type(1) .color-square {
    background-color: #F4FAFF;
}
.pal-forty-five .card-palette:nth-of-type(2) .color-square {
    background-color: #005F99;
}
.pal-forty-five .card-palette:nth-of-type(3) .color-square {
    background-color: #008CBA;
}
.pal-forty-five .card-palette:nth-of-type(4) .color-square {
    background-color: #00D4C2;
}
.pal-forty-five .card-palette:nth-of-type(5) .color-square {
    background-color: #F2D399;
}
.pal-forty-five .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0C12;
}
/* LINE 16 */
/* PAL 46 */
.pal-forty-six .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF7FA;
}
.pal-forty-six .card-palette:nth-of-type(2) .color-square {
    background-color: #FF6F91;
}
.pal-forty-six .card-palette:nth-of-type(3) .color-square {
    background-color: #FFB997;
}
.pal-forty-six .card-palette:nth-of-type(4) .color-square {
    background-color: #FCECC9;
}
.pal-forty-six .card-palette:nth-of-type(5) .color-square {
    background-color: #7BC67E;
}
.pal-forty-six .card-palette:nth-of-type(6) .color-square {
    background-color: #0F0A0C;
}
/* PAL 47 */
.pal-forty-seven .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF4E6;
}
.pal-forty-seven .card-palette:nth-of-type(2) .color-square {
    background-color: #FF8C42;
}
.pal-forty-seven .card-palette:nth-of-type(3) .color-square {
    background-color: #FFB84C;
}
.pal-forty-seven .card-palette:nth-of-type(4) .color-square {
    background-color: #E36414;
}
.pal-forty-seven .card-palette:nth-of-type(5) .color-square {
    background-color: #006CFF;
}
.pal-forty-seven .card-palette:nth-of-type(6) .color-square {
    background-color: #0F0A0A;
}
/* PAL 48 */
.pal-forty-eight .card-palette:nth-of-type(1) .color-square {
    background-color: #F2F5FA;
}
.pal-forty-eight .card-palette:nth-of-type(2) .color-square {
    background-color: #2A4D7A;
}
.pal-forty-eight .card-palette:nth-of-type(3) .color-square {
    background-color: #4F7DBF;
}
.pal-forty-eight .card-palette:nth-of-type(4) .color-square {
    background-color: #FF8A00;
}
.pal-forty-eight .card-palette:nth-of-type(5) .color-square {
    background-color: #FFD500;
}
.pal-forty-eight .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0D12;
}
/* LINE 17 */
/* PAL 49 */
.pal-forty-nine .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF4EC;
}
.pal-forty-nine .card-palette:nth-of-type(2) .color-square {
    background-color: #FF8A3D;
}
.pal-forty-nine .card-palette:nth-of-type(3) .color-square {
    background-color: #FFB45A;
}
.pal-forty-nine .card-palette:nth-of-type(4) .color-square {
    background-color: #FFD978;
}
.pal-forty-nine .card-palette:nth-of-type(5) .color-square {
    background-color: #4FA8FF;
}
.pal-forty-nine .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0C0E;
}
/* PAL 50 */
.pal-fifty .card-palette:nth-of-type(1) .color-square {
    background-color: #F4FBFF;
}
.pal-fifty .card-palette:nth-of-type(2) .color-square {
    background-color: #A8D8FF;
}
.pal-fifty .card-palette:nth-of-type(3) .color-square {
    background-color: #4FB8FF;
}
.pal-fifty .card-palette:nth-of-type(4) .color-square {
    background-color: #00D4E6;
}
.pal-fifty .card-palette:nth-of-type(5) .color-square {
    background-color: #0077B6;
}
.pal-fifty .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0E12;
}
/* PAL 51 */
.pal-fifty-one .card-palette:nth-of-type(1) .color-square {
    background-color: #F6FFF8;
}
.pal-fifty-one .card-palette:nth-of-type(2) .color-square {
    background-color: #A8E6C2;
}
.pal-fifty-one .card-palette:nth-of-type(3) .color-square {
    background-color: #6BCF9B;
}
.pal-fifty-one .card-palette:nth-of-type(4) .color-square {
    background-color: #F4C27A;
}
.pal-fifty-one .card-palette:nth-of-type(5) .color-square {
    background-color: #E68A4F;
}
.pal-fifty-one .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0F0C;
}
/* LINE 18 */
/* PAL 52 */
.pal-fifty-two .card-palette:nth-of-type(1) .color-square {
    background-color: #FFF6E8;
}
.pal-fifty-two .card-palette:nth-of-type(2) .color-square {
    background-color: #47ff3d;
}
.pal-fifty-two .card-palette:nth-of-type(3) .color-square {
    background-color: #5cffa3;
}
.pal-fifty-two .card-palette:nth-of-type(4) .color-square {
    background-color: #78d4ff;
}
.pal-fifty-two .card-palette:nth-of-type(5) .color-square {
    background-color: #4f55ff;
}
.pal-fifty-two .card-palette:nth-of-type(6) .color-square {
    background-color: #0F0A0A;
}
/* PAL 53 */
.pal-fifty-three .card-palette:nth-of-type(1) .color-square {
    background-color: #F2F5FA;
}
.pal-fifty-three .card-palette:nth-of-type(2) .color-square {
    background-color: #bf4f9d;
}
.pal-fifty-three .card-palette:nth-of-type(3) .color-square {
    background-color: #4e7a2a;
}
.pal-fifty-three .card-palette:nth-of-type(4) .color-square {
    background-color: #8000ff;
}
.pal-fifty-three .card-palette:nth-of-type(5) .color-square {
    background-color: #00b3ff;
}
.pal-fifty-three .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0D12;
}
/* PAL 54 */
.pal-fifty-four .card-palette:nth-of-type(1) .color-square {
    background-color: #F4FBFF;
}
.pal-fifty-four .card-palette:nth-of-type(2) .color-square {
    background-color: #7BC9FF;
}
.pal-fifty-four .card-palette:nth-of-type(3) .color-square {
    background-color: #00A8E8;
}
.pal-fifty-four .card-palette:nth-of-type(4) .color-square {
    background-color: #d3f47a;
}
.pal-fifty-four .card-palette:nth-of-type(5) .color-square {
    background-color: #9de64f;
}
.pal-fifty-four .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0E0D;
}
/* LINE 19 */
/* PAL 55 */
.pal-fifty-five .card-palette:nth-of-type(1) .color-square {
    background-color: #F2F5F7;
}
.pal-fifty-five .card-palette:nth-of-type(2) .color-square {
    background-color: #A8B8C6;
}
.pal-fifty-five .card-palette:nth-of-type(3) .color-square {
    background-color: #6F7F8C;
}
.pal-fifty-five .card-palette:nth-of-type(4) .color-square {
    background-color: #4A5A66;
}
.pal-fifty-five .card-palette:nth-of-type(5) .color-square {
    background-color: #D9A15F;
}
.pal-fifty-five .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0C0E;
}
/* PAL 56 */
.pal-fifty-six .card-palette:nth-of-type(1) .color-square {
    background-color: #F6F4FF;
}
.pal-fifty-six .card-palette:nth-of-type(2) .color-square {
    background-color: #A8A0FF;
}
.pal-fifty-six .card-palette:nth-of-type(3) .color-square {
    background-color: #6B5BFF;
}
.pal-fifty-six .card-palette:nth-of-type(4) .color-square {
    background-color: #4FD4FF;
}
.pal-fifty-six .card-palette:nth-of-type(5) .color-square {
    background-color: #FFD978;
}
.pal-fifty-six .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0712;
}
/* PAL 57 */
.pal-fifty-seven .card-palette:nth-of-type(1) .color-square {
    background-color: #F4F4F4;
}
.pal-fifty-seven .card-palette:nth-of-type(2) .color-square {
    background-color: #8F664B;
}
.pal-fifty-seven .card-palette:nth-of-type(3) .color-square {
    background-color: #007BFF;
}
.pal-fifty-seven .card-palette:nth-of-type(4) .color-square {
    background-color: #FF8A3D;
}
.pal-fifty-seven .card-palette:nth-of-type(5) .color-square {
    background-color: #FFD500;
}
.pal-fifty-seven .card-palette:nth-of-type(6) .color-square {
    background-color: #0D0D0D;
}
/* LINE 20 */
/* PAL 58 */
.pal-fifty-eight .card-palette:nth-of-type(1) .color-square {
    background-color: #F4FFF9;
}
.pal-fifty-eight .card-palette:nth-of-type(2) .color-square {
    background-color: #00FFA6;
}
.pal-fifty-eight .card-palette:nth-of-type(3) .color-square {
    background-color: #00E6C4;
}
.pal-fifty-eight .card-palette:nth-of-type(4) .color-square {
    background-color: #00C8FF;
}
.pal-fifty-eight .card-palette:nth-of-type(5) .color-square {
    background-color: #4FA8FF;
}
.pal-fifty-eight .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0F0E;
}
/* PAL 59 */
.pal-fifty-nine .card-palette:nth-of-type(1) .color-square {
    background-color: #FFFCE6;
}
.pal-fifty-nine .card-palette:nth-of-type(2) .color-square {
    background-color: #FFEA00;
}
.pal-fifty-nine .card-palette:nth-of-type(3) .color-square {
    background-color: #FFD500;
}
.pal-fifty-nine .card-palette:nth-of-type(4) .color-square {
    background-color: #FF9A00;
}
.pal-fifty-nine .card-palette:nth-of-type(5) .color-square {
    background-color: #00C8FF;
}
.pal-fifty-nine .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0C0A;
}
/* PAL 60 */
.pal-sixty .card-palette:nth-of-type(1) .color-square {
    background-color: #F6F4FF;
}
.pal-sixty .card-palette:nth-of-type(2) .color-square {
    background-color: #7B5BFF;
}
.pal-sixty .card-palette:nth-of-type(3) .color-square {
    background-color: #4F8CFF;
}
.pal-sixty .card-palette:nth-of-type(4) .color-square {
    background-color: #00FFE1;
}
.pal-sixty .card-palette:nth-of-type(5) .color-square {
    background-color: #A8FFDA;
}
.pal-sixty .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0712;
}
/* LINE 21 */
/* PAL 61 */
.pal-sixty-one .card-palette:nth-of-type(1) .color-square {
    background-color: #F4FFFD;
}
.pal-sixty-one .card-palette:nth-of-type(2) .color-square {
    background-color: #00FFE1;
}
.pal-sixty-one .card-palette:nth-of-type(3) .color-square {
    background-color: #00E6FF;
}
.pal-sixty-one .card-palette:nth-of-type(4) .color-square {
    background-color: #7B5BFF;
}
.pal-sixty-one .card-palette:nth-of-type(5) .color-square {
    background-color: #FF2EC4;
}
.pal-sixty-one .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0F11;
}
/* PAL 62 */
.pal-sixty-two .card-palette:nth-of-type(1) .color-square {
    background-color: #F2FFFA;
}
.pal-sixty-two .card-palette:nth-of-type(2) .color-square {
    background-color: #00FFB8;
}
.pal-sixty-two .card-palette:nth-of-type(3) .color-square {
    background-color: #00E6D4;
}
.pal-sixty-two .card-palette:nth-of-type(4) .color-square {
    background-color: #4F8CFF;
}
.pal-sixty-two .card-palette:nth-of-type(5) .color-square {
    background-color: #C000FF;
}
.pal-sixty-two .card-palette:nth-of-type(6) .color-square {
    background-color: #0A0E0D;
}
/* PAL 63 */
.pal-sixty-three .card-palette:nth-of-type(1) .color-square {
    background-color: #FFC312;
}
.pal-sixty-three .card-palette:nth-of-type(2) .color-square {
    background-color: #C4E538;
}
.pal-sixty-three .card-palette:nth-of-type(3) .color-square {
    background-color: #12CBC4;
}
.pal-sixty-three .card-palette:nth-of-type(4) .color-square {
    background-color: #FDA7DF;
}
.pal-sixty-three .card-palette:nth-of-type(5) .color-square {
    background-color: #ED4C67;
}
.pal-sixty-three .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* LINE 22 */
/* PAL 64 */
.pal-sixty-four .card-palette:nth-of-type(1) .color-square {
    background-color: #F79F1F;
}
.pal-sixty-four .card-palette:nth-of-type(2) .color-square {
    background-color: #A3CB38;
}
.pal-sixty-four .card-palette:nth-of-type(3) .color-square {
    background-color: #1289A7;
}
.pal-sixty-four .card-palette:nth-of-type(4) .color-square {
    background-color: #D980FA;
}
.pal-sixty-four .card-palette:nth-of-type(5) .color-square {
    background-color: #B53471;
}
.pal-sixty-four .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* PAL 65 */
.pal-sixty-five .card-palette:nth-of-type(1) .color-square {
    background-color: #EE5A24;
}
.pal-sixty-five .card-palette:nth-of-type(2) .color-square {
    background-color: #009432;
}
.pal-sixty-five .card-palette:nth-of-type(3) .color-square {
    background-color: #0652DD;
}
.pal-sixty-five .card-palette:nth-of-type(4) .color-square {
    background-color: #9980FA;
}
.pal-sixty-five .card-palette:nth-of-type(5) .color-square {
    background-color: #833471;
}
.pal-sixty-five .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* PAL 66 */
.pal-sixty-six .card-palette:nth-of-type(1) .color-square {
    background-color: #EA2027;
}
.pal-sixty-six .card-palette:nth-of-type(2) .color-square {
    background-color: #006266;
}
.pal-sixty-six .card-palette:nth-of-type(3) .color-square {
    background-color: #1B1464;
}
.pal-sixty-six .card-palette:nth-of-type(4) .color-square {
    background-color: #5758BB;
}
.pal-sixty-six .card-palette:nth-of-type(5) .color-square {
    background-color: #6F1E51;
}
.pal-sixty-six .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* LINE 22 */
/* PAL 67 */
.pal-sixty-seven .card-palette:nth-of-type(1) .color-square {
    background-color: #E84118;
}
.pal-sixty-seven .card-palette:nth-of-type(2) .color-square {
    background-color: #F5F6FA;
}
.pal-sixty-seven .card-palette:nth-of-type(3) .color-square {
    background-color: #7F8FA6;
}
.pal-sixty-seven .card-palette:nth-of-type(4) .color-square {
    background-color: #273C75;
}
.pal-sixty-seven .card-palette:nth-of-type(5) .color-square {
    background-color: #353B48;
}
.pal-sixty-seven .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* PAL 68 */
.pal-sixty-eight .card-palette:nth-of-type(1) .color-square {
    background-color: #F97F51;
}
.pal-sixty-eight .card-palette:nth-of-type(2) .color-square {
    background-color: #1B9CFC;
}
.pal-sixty-eight .card-palette:nth-of-type(3) .color-square {
    background-color: #F8EFBA;
}
.pal-sixty-eight .card-palette:nth-of-type(4) .color-square {
    background-color: #58B19F;
}
.pal-sixty-eight .card-palette:nth-of-type(5) .color-square {
    background-color: #2C3A47;
}
.pal-sixty-eight .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* PAL 69 */
.pal-sixty-nine .card-palette:nth-of-type(1) .color-square {
    background-color: #FFC048;
}
.pal-sixty-nine .card-palette:nth-of-type(2) .color-square {
    background-color: #FFDD59;
}
.pal-sixty-nine .card-palette:nth-of-type(3) .color-square {
    background-color: #FF5E57;
}
.pal-sixty-nine .card-palette:nth-of-type(4) .color-square {
    background-color: #D2DAE2;
}
.pal-sixty-nine .card-palette:nth-of-type(5) .color-square {
    background-color: #485460;
}
.pal-sixty-nine .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* LINE 23 */
/* PAL 70 */
.pal-seventy .card-palette:nth-of-type(1) .color-square {
    background-color: #C56CF0;
}
.pal-seventy .card-palette:nth-of-type(2) .color-square {
    background-color: #FFB8B8;
}
.pal-seventy .card-palette:nth-of-type(3) .color-square {
    background-color: #FF3838;
}
.pal-seventy .card-palette:nth-of-type(4) .color-square {
    background-color: #FF9F1A;
}
.pal-seventy .card-palette:nth-of-type(5) .color-square {
    background-color: #FFF200;
}
.pal-seventy .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}
/* PAL 71 */
.pal-seventy-one .card-palette:nth-of-type(1) .color-square {
    background-color: #32FF7E;
}
.pal-seventy-one .card-palette:nth-of-type(2) .color-square {
    background-color: #7EFFF5;
}
.pal-seventy-one .card-palette:nth-of-type(3) .color-square {
    background-color: #18DCFF;
}
.pal-seventy-one .card-palette:nth-of-type(4) .color-square {
    background-color: #7D5FFF;
}
.pal-seventy-one .card-palette:nth-of-type(5) .color-square {
    background-color: #4B4B4B;
}
.pal-seventy-one .card-palette:nth-of-type(6) .color-square {
    background-color: #1C1D1C;
}


.footer { 
    grid-area: footer;
    padding: 4vh;
    font-family: var(--font-color);
}

/* LIGHTBOX */
#lightbox {
    display: none;
    position: fixed;
    top: 15%;
    left: 20%;
    width: 60%;
    height: 70%;
    background: #FFFFFF;
    justify-content: center;
    align-items: center;
    z-index: 999;
}
    #close {
        position: absolute;
        top: 20px;
        right: 40px;
        font-size: 8vh;
        color: #000000;
        cursor: pointer;
    }

/* TEMPLATE */
ui-template {
    height: 100%;
    width: 100%;
    border: 1vh solid var(--c2);
}
.container-template {
    font-family: var(--font-paraph);
    min-height: 100%;
    height: 100%;
    width: 100%;
    display: grid;
    grid:
        "template-header" auto
        "template-main" 1fr
        / 1fr;
}
.template-header { 
    width: 100%;
    grid-area: template-header;
    padding: 2vh;    
}
.template-main { 
    display: flex;
    grid-area: template-main;
    margin: 0 auto;
    width: 55vw;
    flex-direction: column;
    justify-content: space-between;
}
.template-footer { 
    grid-area: template-footer;
    padding: 2vh 4vh;
}
    .template-h1 {
        width: max-content;
        font-family: var(--font-title);
        padding: 3vh 2vh;   
        text-transform: uppercase;
    }
    .template-paraph {
        padding: 0vh 4vh;
        width: 55vw;
        text-align: left;
        font-weight: 200;
    }
.container-btn {
    padding: 2vh 0 4vh 0vh;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.template-btn {
    font-weight: bold;
    padding: 1vh 2vh;
    border-radius: 8px;
    font-size: 2vh;
}
.template-btn:nth-of-type(1) {
    margin: 0;
}
/* OUTLINE BUTTONS */
.outline-btn1 {
    border: 3px solid var(--c4);
    color: var(--c4);
    background-color: transparent;
}
.outline-btn2 {
    border: 3px solid var(--c3);
    color: var(--c3);
    background-color: transparent;
}
/* BACKGROUND BUTTONS */
.background-btn2 {
    background-color: var(--c3);
    border: 3px solid var(--c3);
    color: var(--black);
}
.background-btn3 {
    background-color: var(--c5);
    border: 3px solid var(--c5);
    color: var(--black);
}
.background-btn5 {
    background-color: var(--black);
    border: 3px solid var(--black);
    color: var(--c3);
}

.container-card {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}
.template-card {
    width: 20vw;
    padding: 2vh;
    width: 30%;
    border-radius: 8px;
}

/* CARDS */
.card-outline {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    background-color: var(--c5);
    border-color: var(--c5);
    color: var(--c1);
}
.card-cover1 {
    background-color: var(--c5);
    color: var(--black);
}
.background-btn1 {
    display: flex;
    justify-self: end;
    background-color: var(--c4);
    border: 3px solid var(--c4);
    color: var(--c5);
}
.card-cover2 {
    background-color: var(--c2);
    color: var(--black);
}
.background-btn4 {
    display: flex;
    justify-self: end;
    background-color: var(--c1);
    border: 3px solid var(--c1);
    color: var(--c5);
}

.card-title {
    font-weight: 700;
    font-size: 2vh;
    line-height: 1.25vh;
    margin-bottom: 1vh;   
}
.card-paraph {
    opacity: 0.7;
    font-size: 1.4vh;
    margin-bottom: 1vh;
}
.card-btn {
    display: flex;
    align-self: flex-end;
    background-color: var(--c2);
    border: 2px solid var(--c2);
    color: var(--c5);
    border-radius: 8px;
}