@media (prefers-color-scheme: light) {
    .backgrund {
        background: rgb(240, 240, 240);
    }

    .backgrund-card {
        background: rgb(240, 240, 240);
    }

    body {
        background: rgb(240, 240, 240);
    }

    :root {
        --color-bg: rgb(240, 240, 240);
        --color-bg2: rgb(218, 218, 218);
        --color-bg2-border: rgba(209, 209, 209, 0.1);
        --color-bg2-odd: rgb(230, 230, 230);
        --color-bg2-even: rgb(215, 215, 215);
        --color-bg2-hover: rgb(255, 255, 255);
        --color-bg3: rgb(228, 228, 228);
        --color-text: #777777;
        --color-text2: #686868;
    }

    .copyright {
        color: var(--color-text2);
    }
}

@media (prefers-color-scheme: dark) {
    .backgrund {
        background: rgb(110, 110, 110);
    }

    .backgrund-card {
        background: rgb(117, 117, 117);
    }

    body {
        background: rgb(110, 110, 110);
    }
    
    :root {
        --color-bg: rgb(110, 110, 110);
        --color-bg2: rgb(83, 83, 83);
        --color-bg2-border: rgba(88, 88, 88, 0.1);
        --color-bg2-odd: rgb(132, 132, 132);
        --color-bg2-even: rgb(117, 117, 117);
        --color-bg2-hover: rgb(161, 161, 161);
        --color-bg3: rgb(139, 139, 139);
        --color-text: rgb(248, 248, 248);
        --color-text2: rgb(218, 218, 218);
    }

    .copyright {
        color: var(--color-text2);
    }
}