@media screen and (max-width: 992px){
    .nav{
        display: none;
    }
    .menu_bar {
        display: block;
        position: absolute;
        top: 12px;
        right: 20px;
    }   
    #nav {
        position: absolute;
        top: 60px;
        left: 0;
        background: var(--boxbg);
        width: 100%;
        padding: inherit;
        border-radius: 20px;
    }
    
    #nav a {
        padding: 10px;
        border-bottom: solid 1px var(--link);
    }
    header.header .logo {position: absolute;left: 20px;}
    header{
        height: 50px;
        max-width: 85vw !important;
        margin: 10px auto;
    }
    body{
        padding: 0 !important;
        margin: 0 !important;
    }
    table.courseTable {
        zoom: .8;
    }
    .arrow {
        rotate: 90deg;
        height: 140px;
    }
    
    .banner {
        padding: 20px 0;
    }
    
    .bannerText {padding: 0;}
    #courses {
        margin: 10px 0 !important;
    }
    .sidebar{
        height: auto;
        margin: 0 !important;
    }
    
    }