/* responsive header*/
@media (max-width:1200px) {
    html{
        font-size: 55%;
    }
    .home{
        padding: 1rem 4rem;
        top: -40%;
        margin: 200px 0px 0px 0px;
    }
    .about{
        margin-top: 400px;
    }
}

@media (max-width:991px) {
    header{
        left: -120%;
    }
    #menu{
        display: block;
    }
    header.toggle{
        left: 0%;
    }

    body{
        padding: 0%;
    }
}

@media (max-width:768px) {
    html{
       font-size: 50%;
    }
    
}

@media (max-width:400px) {
    header{
        width: 100vw;
    }
    .heading{
        margin: 0 3rem;
    }
    .about .row .counter .box{
        width: 100%;
    }
    .about .box img{
        height: 100px;
    }
    .education .box-container .box{
        width: 100%;
    }
    .portfolio .box-container .box {
        width: 100%;
    }
    .contact .row form{
        margin: 3rem 0;
    }.about{
        margin-top: 500px;
    }
    
}