@media screen and (min-width: 1050px){
    .small-screen-nav{
        display: none;
    }
}
@media screen and (max-width: 1150px){
    /* top navigation section */
    .small-screen-nav{
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 1.7rem;
        padding: 0.5rem 2rem;
    }
    #openMenu{
        cursor: pointer;
    }
    #closeMenu{
        display: none;
        cursor: pointer;
    }

    .nav-container{
        width: 100%;
        position: relative;
        z-index: 999;
        left: 0;
        top: 0;
    }

    .top-navigation{
        padding: 0.1rem 1.5rem;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .top-nav-respo{
        display: none;
    }
     nav .navigation{
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
     }
     #navigation{
        display: none;
     }
     .service-list{
        text-align: start;
     }
 
     #logo-for-big{
        display: none;
     }
}
@media screen and (max-width: 729px){
    #animatedDiv{
        padding-top: 2rem;
    }

}
@media screen and (max-width: 400px){

    #animatedDiv h1{
        font-size: 3.1rem;
    }
}

/* heights */