@media (max-width: 1166px){

    :root {
        --wrap: 90%; 
    }

    .work_desc {padding: 0 20px 20px;}
    .work_desc span {display: none; }
    .work.wide span.work_txt {display: block; }
    .work h3 {margin: 0; }
    .work.wide h3 {margin-bottom: 10px; }

    .s1 {font-size: calc(80px * .7); }
    .s2 {font-size: calc(130px * .7);  }
    .s3 {font-size: calc(93px * .7); padding: 30px 0 0 60px;  }
    .s4 {font-size: calc(64px * .7);  }
    .s5 {font-size: calc(104px * .7);  }

    .footer .flex {flex-wrap: wrap; gap: 50px; }
    .fcol { width: 45% !important; order: 3;}
    .fcol:first-child {order: 1; }
    .fcol:last-child {order: 2; margin-top: 27px; }

    .title_txt {max-width: 50%;}

    form .flex {flex-wrap: wrap; }
    
}
/* end 1166 */





@media (min-width: 768px) and (max-width: 1100px){
    .work_desc {position: static; padding: 15px 0 30px; }
    .work:after {display: none; }
    .work:hover img {transform: scale(1);}  
    .work_txt {padding-right: 30px; }
}






@media (max-width: 767px){

    .trigger, .trigger:focus {display: block; background-color: transparent;}
    .menu_holder.open .trigger {display: block; background-image: url(../img/x.svg); background-position: center center; }

    .menu {
        position: fixed; z-index: 5; width: 100%; height: 100vh; top: 0; left: 100%; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; 
        background: rgba(8, 11, 23, 0.7); display: flex; align-items: flex-start; justify-content: center; backdrop-filter: blur(10px); overflow: auto; 
        padding: 30px 0; 
    }

    .menu ul, .menu ul ul {width: 300px; display: flex; flex-direction: column; background: transparent; }

    .menu li a { font-size: 32px; padding: 32px; display: block; text-align: center; }
    .menu li li a { font-size: 24px; padding: 12px 32px; }

    
    .menu.open {left: 0;  }

    .menu ul ul, 
    .menu ul li:hover ul {display: none; position: static; width: 100%; padding: 0; max-height: 0; overflow: hidden; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}

    .menu ul li.open ul {display: block !important; max-height: 999px; padding-bottom: 15px; height: auto !important; opacity: 1 !important; visibility: visible;  }

    .menu li.hasSub > a:before {
        right: -10px; top: 30px; background-size: 26px auto; 
        filter: brightness(0) saturate(100%) invert(35%) sepia(7%) saturate(1942%) hue-rotate(172deg) brightness(92%) contrast(84%);
    }




    .title_wrap {flex-direction: column; align-items: flex-start; gap: 30px; }

    .title_txt {max-width: 100%;}

    .work {width: 100%;}

    /* .work_txt {display: none !important; } */

    .work h3 {margin: 0 !important; font-size: 24px !important; }




    .s1 {font-size: calc(80px * .6); }
    .s2 {font-size: calc(130px * .6);  }
    .s3 {font-size: calc(93px * .6); padding: 30px 0 0 0;  }
    .s4 {font-size: calc(64px * .6);  }
    .s5 {font-size: calc(104px * .6);  }



    #tabs {flex-direction: column; gap: 50px; }

    .tab_nav,
    .tab_content {width: 100%; }

    #tabs ul {display: flex; flex-wrap: wrap;}
    #tabs li {width: 50%; }

    .fullwidth #tabs li {width: 50%;}

    .beliefs {flex-direction: column; }

    .belief {  width: 100%; }

    .contact {flex-direction: column; gap: 50px; }

    .contact > div {width: 100%; }


    .article {flex-direction: column; gap: 30px; }

    .article > div, 
    .article .img img {width: 100%; }


    
}
/* end 767 */






@media (max-width: 600px){

    .s1 {font-size: calc(80px * .4); }
    .s2 {font-size: calc(130px * .4);  }
    .s3 {font-size: calc(93px * .4); padding: 30px 0 0 0;  }
    .s4 {font-size: calc(64px * .4);  }
    .s5 {font-size: calc(104px * .4);  }
    .aligned {padding-left: 120px; margin-left: 0; }

    .counter {flex-wrap: wrap; gap: 50px 0; }
    .citem {flex-basis: 48%;}

    .fcol {width: 100% !important; }

    .fbottom {flex-direction: column;}

    .fright, .fleft {justify-content: flex-start; flex-wrap: wrap; width: 100%; }

    .work .h3 {font-size: 26px; margin-bottom: 5px; } 
    
}
/* end 600 */






@media (max-width: 500px){

    #tabs li {width: 100%; }

    h1, .h1 {font-size: 50px; }
    h2, .h2 {font-size: 35px; }
    h3, .h3 {font-size: 30px; }
    h4, .h4 {font-size: 20px; }
    h5, .h5 {font-size: 16px; }
    h6, .h6 {font-size: 16px; }

    .fullwidth #tabs li {width: 100%;}

    .work_desc {position: static; padding: 10px 0 30px; }
    .work:after {display: none; }
    .work:hover img {transform: scale(1);}  
    
}
/* end 500 */







@media (max-width: 370px){

    .menu_holder .buttlike {display: none; }

    .aligned {padding-left: 60px;  }

    .citem {flex-basis: 100%;} 
}
/* end 400 */