body {
    background-color: #6e5f8e;
    color: white;
    a {
        color: rgb(124 153 225)
    }
    a:hover {
        color: rgb(173 193 254)
    }
}

#navbar {
    background-color: #3b3b56;
    border-bottom: 0.4vw solid #ffffff;
    box-shadow: 0 -10vw 0 10vw #3b3b56, 0 0.3vw 0.5vw 0.5vw rgb(24 20 94 / 0.32);
}

#navbar a {
    color: #ffffff;
}

#navbar a:hover {
    background-color: #9ea6aa;
    color: black;
}

#navbar a.active {
    background-color: #88cdff;
    color: white;
}

.cardboard {
    box-shadow: 0 1vw 0 0 #131228, 0 1.25vw 0.5vw 0.5vw rgb(2 3 45 / 0.25);
}
.cardboard::before {
    background-color: #cea98a;
    filter: brightness(20%) hue-rotate(200deg) saturate(80%);
}
.cardboard .cardboard {
    box-shadow: 0 1vw 0 0 #131228, 0 1.25vw 1.5vw 1vw rgb(2 3 45 / 0.25);
}

h1 {
    color: rgb(255 255 255);
}

h2 {
    color: rgb(255 255 255);
}

p {
    color: rgb(255 255 255 / 0.82);
}