/*

This file describes styles that are 1200px width and smaller

 */

@media  all and (max-width: 1200px) {

    h1{

        font-size: 5rem

    }

    .about .grid-2{

        grid-template-columns: 1fr

    }

   

    /* header mobile styles */

    .top-banner, #header {

        display: none

    }



    #header-mobile {

        display: block

    }



    #header-mobile .container {

        display: flex;

        justify-content: space-between;

        align-items: center

    }



    .menu-btn-open {

        width: 35px;

        height: 25px;

        display: flex;

        flex-direction: column;

        justify-content: space-between

    }



    .menu-btn-open > div {

        width: 100%;

        height: 2px;

        background-color: var(--white);

        border-radius: 5px

    }



    .menu-btn-close {

        

    }



    .menu-btns {

        z-index: 3

    }



    .menu-btns.open .menu-btn-open {

        display: flex

    }



    .menu-btns.open .menu-btn-close {

        display: none

    }



    .menu-btns:not(.open) .menu-btn-open {

        display: none

    }



    .menu-btns:not(.open) .menu-btn-close {

        display: block

    }



    .header-mobile-wrap {

        position: fixed;

        top: 0;

        left: 0;

        background-color: var(--white);

        /*width: calc(100vw - 60px);*/

        width: 100dvw;

        /*height: 100dvh;*/

        z-index: 2;

        padding: 15px 15px 30px;

        /*padding: 0 15px 30px;*/

        transition: 0.7s

    }



    .header-mobile-wrap .main-menu {

        padding-top: 30px

    }



    .header-mobile-wrap .main-menu ul {

        flex-direction: column;

        align-items: flex-start;

        gap: 0

    }



    .header-mobile-wrap .main-menu ul li a {

        line-height: 1;

        display: flex;

        font-size: 1.6rem

    }



    .header-mobile-wrap address a, .header-mobile-wrap address span{

        font-size: 1.6rem;

        width: fit-content;

        word-break: break-word

    }

    .header-mobile-wrap address{

        display: flex;

        flex-direction: column;

        align-items: flex-start;

        gap: 10px;

        margin-top: 30px

    }

   

    .header.menu-translate .header-mobile-wrap{

        transform: translateY(-100%);

        transition: 0.7s

    }

    .header:not(.menu-translate) .overlay{

        position: fixed;

        top: 0;

        right: 0;

        background: #20202047;

        backdrop-filter: blur(5px);

        width: 100vw;

        height: 100vh;

        transition: 0.1s

    }

    .header-mobile-wrap .main-menu nav >ul >li{

        flex-direction: column;

        gap: 20px

    }



    /* end of header mobile styles */



    .footer-top__items{

        grid-template-columns: 1fr 1fr

    }

    .footer-top__items .map{

        grid-column: 1/3

    }

    .footer-top .description .title{

        font-size: 4rem

    }

    .only-desktop{

        display: none

    }



}

@media all and (max-width: 1140px){

    .services__items-wrap .slider-nav{

        display: none!important

    }

    .services__item .img-container {

        height: 260px

    }

    .services__item h3 {

        margin-top: 20px

    }

    .services__item{

        padding: 0 20px

    }

    section.about .grid-2 {

        gap: var(--size-2);

        grid-template-columns: 1fr 1fr !important

    }

    .main-block .round-btn{

        display: none

    }

    .main-block .text-container{

        padding: 20px

    }

}