@media screen and (max-width: 499px){
    .oldimgs{
        flex-wrap: wrap;
    }
    .col{
        flex-basis: 90%;
    }
    .logo{
        left: 25%;
        top: 34%;
    }
    .slide_wrap{
        display: none !important;
    }
}
@media screen and (max-width: 814px){
    form{
        width: 80%;
        transition: width 0.7s;
    }
    #about, #services{
        flex-wrap: wrap;
        justify-content: center;
        height: auto;
        margin: 15px 0;
    }
    .slide_wrap, .text_wrap{
        flex-basis: 80%;
        width: 100%;
        height: 80%;
    }
    nav{
        position: fixed;
        z-index: 2;
        width: 100%;
    }
    nav ul{
        margin: 0;
        background: rgba(0, 0, 0, 0.5);
        display: none;
    }
    .nshow{
        display: block !important;
    }
    nav li{
        text-align: center;
        color: #fff !important;
    }
    #menubtn{
        position: absolute;
        z-index: 3;
        top: 20px;
        right: 20px;
    }
    #toggleBtn{
        position: absolute;
        z-index: 3;
        top: 20px;
        right: 70px;
    }
}


@media screen and (min-width: 500px){
    .oldimgs{
        flex-wrap: wrap;
    }
    .col{
        flex-basis: 49%;
    }
    .logo{
        left: 28%;
        top: 34%;
    }
} 

@media screen and (min-width: 815px){
    nav{
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
    }
    nav ul{
        margin: 25px 0;
    }
    nav li{
        display: inline;
    }
    #togglebtn{
        position: absolute;
        top: 40%;
        right: 80px;
    }
    #menubtn{
        display: none;
    }
    form{
        width: 60%;
        transition: width 0.7s;
    }
    .slide_wrap, .text_wrap{
        flex-basis: 49%;
        width: 100%;
        height: 80%;
    }
    #about, #services{
        flex-wrap: nowrap;
        justify-content: space-between;
        height: 100vh;
    }
    .slide_wrap{
        border-right: 2px solid var(--trymid);
    }
    .ssection{
        border-right: 2px solid var(--trymid);
    }
    .slide_container{
        width: 100%;
    }
    .new_slider, .oldimgs{
        width: 90%;
        margin: 10px auto;
    }
    .oldimgs{
        flex-wrap: nowrap;
    }
    .col{
        flex-basis: 25%;
    }
    .logo{
        left: 42%;
        top: 34%;
    }
}

@media screen and (min-width: 1091px){
    form{
        width: 40%;
        transition: width 0.7s;
    }
    .new_slider, .oldimgs{
        width: 80%;
        margin: 10px auto;
    }
}