@media screen and (prefers-color-scheme: dark) {
    .code {
        background-color: rgb(43, 47, 49);
        padding-top: 5px;
    }
    
    textarea#codeinput {
        background-color: #2e3440;
    }

    img#runbtnimg {
        filter: invert(100%);
    }

    input, select, button {
        background-color: #181a1b;
    }

    * {
        color: white;
    }
    
    body, main{
        background-color: rgb(24, 26, 27);
    }
    
    tr:nth-child(even) {
        background-color: rgb(34, 36, 38);
    }

    a {
        color: rgb(51, 156, 255);
    }

    #tutorials-submenu > li {
        color: rgb(51, 156, 255);
    }

    #toosmallwarn {
        background-color: rgb(46, 50, 52) !important;
        border: 1px solid white !important;
    }

    #toosmallwarn button {
        border: 1px solid white;
        border-radius: 5px;
    }
    
    @media screen and (min-width: 600px) {
        menu {
            background-color: rgb(46, 50, 52);
            border-right-color: rgb(134, 125, 110);
        }
    
        .menuexpand > * > li:hover, #menu > ul > li > a:hover {
            background: #52585C;
        }
    }
    
    @media screen and (max-width: 599px) {
        #menubtn {
            border: 1px solid white;
        }
    
        #menubtn img {
            filter: invert(100%);
        }
    
        #menuexitsvg {
            filter: invert(100%);
        }
    
        #menu {
            background-color: #484e51;
        }

        #currentpagebtn {
            color: green !important;
        }
    }
    
    
}