/*!JUST PAGE-SPECIFIC STUFF!*/

body {
    background: black;
}

#menu {
    color: white;
}

.lang {
    color: #8FD1E9;
}

details p {
    color: white;
}

/*all the different buttons (everyone has their own id, cause of different colors and rotations)*/

.buttons > :nth-child(5n+1) {
    --background-color: #8FD1E9;
    --color: black;
    --transform: rotate(-1deg);
}

.buttons > :nth-child(5n+2) {
    --background-color: #1d7441;
    --color: white;
    --transform: rotate(3deg)
}

.buttons > :nth-child(5n+3) {
    --background-color: #8FD1E9;
    --color: black;
    --transform: rotate(-2deg)
}

.buttons > :nth-child(5n+4) {
    --background-color: white;
    --color: black;
    --transform: rotate(1deg);
}

.buttons > :nth-child(5) {
    --background-color: white;
    --color: black;
    --transform: rotate(-1deg);
}

.some {
    color: white;
}

@media (prefers-color-scheme: light) {
    body {
        background: #8FD1E9;
    }
    
    #menu {
        color: black;
    }
    
    .lang {
    color: #1d7441;
    }
    
    #logo {
        filter: invert();
    }
    
    .buttons > :nth-child(4n+1) {
        --background-color: black;
        --color: white;
    }
    
    .buttons > :nth-child(4n+3) {
        --background-color: black;
        --color: white;
    }
    
    .some {
        color: black;
    }
    
    details p {
        color: black;
    }
}