@media (max-width:260.98px){
    .project-sm-title ul {
        line-height: 11px !important;
    }
}
@media (max-width:340.98px){

    /* .menu__btn {
        width: 30px;
    } */
    .learn-btn a {
        padding: 8px 28px;
        font-size: 14px;
    }
    .why-bg h1 {
        font-size: 45px !important;
    }
    .shape-title{
        top: 238px;
    }
    .menu__box li a{
        padding-right: 10px !important;
    }
    ul.inner_menu .sm_sub_title a .arrow-down::before, ul.inner_menu .sm_sub_title a .arrow-up::before{
        right: 8%;
    }
        /* .sub-menu .yellow_title .arrow-down::before, .md_sub_menu .arrow-up:before {
        right: 25px !important;
    } */
    .project-sm-title ul {
        padding-left: 4px !important;
    }
    ul.xs_menu_title li {
        padding-left: 15px !important;
    }

}

@media (max-width:575.98px){
   
    
    .brand a img {
        /* max-height: 70px; */
        width: 130px;
    }
    #desktop-menu{
        display: none;
    }
    .hamburger-menu{
        z-index: 5;
        width: 100%;
        display: flex;
        align-items: center;
        height: 71px;
        /* position: fixed; */
        background-color: #fff;
    }
    .brand{
        /* margin-top: 19px; */
    }
   .menu-nav-bar .menu-title{
    display: none;
   }
    ul.menu__box li {
        border-bottom: 2px solid #fff !important;
        padding: 29px 0px;
        width: 100%;
        list-style-type: none;
    }
    .menu__box li .fa{
        text-align: right;
        width: 100%;
        margin-top: 0;
        position: absolute;
        right: 0px;
    }
    .menu__box li a{
        color: #fff;
        font-family: 'Oxygen';
        padding: 0px 130px 0px 30px;
    }
    .menu__box li a:hover{
        text-decoration: none !important;
    }
    .hamburger-menu .sub-menu ul{
        padding-left: 0px;
        position: relative;
        bottom: -30px;
    }
    li.sm_sub_title a {
        padding: 0px 35px 0px 30px;
        color: #fff !important;
    }
    .sm_sub_title{
        background: #E6C3A1 !important;
        padding: 0px !important;
        border-bottom: 1px solid #fff !important;
    }
    
    .colorfaq{
        color: #fff !important;
        z-index: 2;
    position: relative;
    }
    .lift_up{
        margin-top: -51px !important;
    }
    .sub-menu img{
        width: 110px;
        margin-right: 18px;
    }
    .sm_sub_title a{
        padding-left: 0px !important;
    }
    .menu__box{
        padding:0px;
        height: 110vh;
        background-color: #806D5A;
        position: fixed;
        overflow-y: scroll;
    top: 40px ;
    z-index:11;
    }
    .yellow_title .arrow-down::before {
    right: 64px;
    top: 9px  !important;
    }
    .active_color{
            background-color: #4D4136 !important;
    }
    .active_color a {
        color: #fff !important;
    }
    .xs_menu_title{
        bottom: -1px !important;
    }
    .xs_menu_title li{
        background-color: #806D5A;
    }
   .sm_sub_title .title_color{
    color: #4D4136;
    position: absolute;
    transform: translateY(23px);
   }
   ul.xs_menu_title li {
    padding: 16px 30px;
    font-size: 13px;
    }
    ul.xs_menu_title li:nth-child(1){
        border-bottom: 1px solid #fff;
    }
    .xs_menu_title img{
        width:unset;
        float: right;
        margin-right: -3px;
        position: relative;
        top: 4px;
    }
    /* .xs_menu_title a{
        padding-right: 110px !important;
    } */
    .sm_sub_title a{
        font-size: 13px;
    }
    .yellow_title .arrow-up:before{
        content: '';
        background-image: url(../img/menu/up-arrow1.png) !important;
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 21%;
        background-repeat: no-repeat;
        top: 6px;
    }
    .yellow_title .arrow-down:before{
        content: '';
        background-image: url(../img/menu/down-arrow.png) !important;
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 21%;
        background-repeat: no-repeat;
        top: 6px;
    }
   .md_sub_menu .arrow-up:before{
        content: '';
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
    .md_sub_menu .arrow-down::before{
        content: '';
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
    ul.inner_menu .sm_sub_title a .arrow-down::before {
        top: 30px !important;
    }  
    ul.inner_menu .sm_sub_title a .arrow-up::before {
        top: 30px !important;
    }   
    .yellow_title{
        background-color: #EED003 !important;
    }
    .sub-menu span::before {
        content: '';
        position: absolute;
        right: 18%;
        height: 82px;
        margin-top: -29px;
    }
    .label_color a{
        color: #fff !important;
    } 
    .inner_menu #menu_color_1{
        background: #fdf9f5  !important;
    }
    .inner_menu #menu_color_2{
            background: #faf3ec !important;
    }
    #menu_color_1{
        background: #fdf9f5 ;
    }
    #menu_color_1 a{
        color: #4D4136;
    }
    #menu_color_2 a{
        color: #4D4136 ;
    }
    #menu_color_2{
    background:#faf3ec;
    }
    .main_title_three a{
        color: #4D4136 !important;
    }
    ul.md_sub_menu li {
        border-bottom: 0px;
    }
    .menu-scroll  .menu__btn{
        /*top:24px; */
    }
    #menu__toggle:checked~.menu__box{
            top: 0px;
    }
    .menu__btn{
        top:20px;
        width: 43px;
        z-index: 12;
        /* position: fixed; */
   
    }
    .menu__btn>span{
        height:2px;
    }
    .menu-nav-bar {
        margin-top: 22px;
    }
    li.sub-menu.yellow_title a {
        color: #806D5A;
    }
    .visual_text{
        color: #806D5A;
    font-weight: 600;
    }
    .label_color{
        background-color:#4D4136 !important;
        color: #fff !important;
     }
    .label_before #md_title .arrow-down::before {
        content: '';
        background-image: url(../img/menu/white_down_arrow.png) !important;
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
     .menu_grey{
        background-color: #806D5A;
     }
    
      .bounceInDown{
        animation-name: none;
      }
     
      .brand-logo {
        top: 2px;
        /* transform: translateY(0px); */
    }
}




@media (min-width: 576px) and (max-width:767.98px){
    
    .brand a img {
        /* max-height: 70px; */
        width: 130px;
    }
    .brand-logo{
        top: 0px;
    }
    #desktop-menu{
        display: none;
    }
    .hamburger-menu{
        z-index: 5;
        width: 100%;
        display: flex;
        align-items: center;
        height: 71px;
        /* position: fixed; */
        background-color: #fff;
    }
    .brand{
        /* margin-top: 19px; */
    }
   .menu-nav-bar .menu-title{
    display: none;
   }
    ul.menu__box li {
        border-bottom: 2px solid #fff !important;
        padding: 29px 0px;
        width: 100%;
        list-style-type: none;
    }
    .menu__box li .fa{
        text-align: right;
        width: 100%;
        margin-top: 0;
        position: absolute;
        right: 0px;
    }
    .menu__box li a{
        color: #fff;
        font-family: 'Oxygen';
        padding: 0px 130px 0px 30px;
    }
    .menu__box li a:hover{
        text-decoration: none !important;
    }
    .hamburger-menu .sub-menu ul{
        padding-left: 0px;
        position: relative;
        bottom: -30px;
    }
    li.sm_sub_title a {
        padding: 0px 75px 0px 30px;
        color: #fff !important;
    }
    .sm_sub_title{
        background: #E6C3A1 !important;
        padding: 0px !important;
        border-bottom: 1px solid #fff !important;
    }
    
    .colorfaq{
        color: #fff !important;
        z-index: 2;
    position: relative;
    }
    .lift_up{
        margin-top: -51px !important;
    }
    .sub-menu img{
        width: 110px;
        margin-right: 18px;
    }
    .sm_sub_title a{
        padding-left: 0px !important;
    }
    .menu__box{
        padding:0px;
        top: 0px;
        height: 100vh;
        background-color: #806D5A;
        position: fixed;
        overflow-x: scroll;
        z-index:12;
    }
    .active_color{
            background-color: #4D4136 !important;
    }
    .active_color a {
        color: #fff !important;
    }
    .xs_menu_title{
        bottom: -1px !important;
    }
    .xs_menu_title li{
        background-color: #806D5A;
    }
   .sm_sub_title .title_color{
    color: #4D4136;
    position: absolute;
    transform: translateY(23px);
   }
   ul.xs_menu_title li {
    padding: 16px 30px;
    font-size: 13px;
    }
    ul.xs_menu_title li:nth-child(1){
        border-bottom: 1px solid #fff;
    }
    .xs_menu_title img{
        width:unset;
        float: right;
        margin-right: -3px;
        position: relative;
        top: 4px;
    }
    .xs_menu_title a{
        padding-right: 110px !important;
    }
    .sm_sub_title a{
        font-size: 13px;
    }
    .yellow_title .arrow-up:before{
        content: '';
        background-image: url(../img/menu/up-arrow1.png) !important;
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
    .yellow_title .arrow-down:before{
        content: '';
        background-image: url(../img/menu/down-arrow.png) !important;
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
   .md_sub_menu .arrow-up:before{
        content: '';
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
    .md_sub_menu .arrow-down::before{
        content: '';
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
    ul.inner_menu .sm_sub_title a .arrow-down::before {
        top: 30px !important;
    }  
    ul.inner_menu .sm_sub_title a .arrow-up::before {
        top: 30px !important;
    }   
    .yellow_title{
        background-color: #EED003 !important;
    }
    .sub-menu span::before {
        content: '';
        position: absolute;
        right: 18%;
        height: 82px;
        margin-top: -29px;
    }
    .label_color a{
        color: #fff !important;
    } 
    .inner_menu #menu_color_1{
        background: #fdf9f5  !important;
    }
    .inner_menu #menu_color_2{
            background: #faf3ec !important;
    }
    #menu_color_1{
        background: #fdf9f5 ;
    }
    #menu_color_1 a{
        color: #4D4136;
    }
    #menu_color_2 a{
        color: #4D4136 ;
    }
    #menu_color_2{
    background:#faf3ec;
    }
    .main_title_three a{
        color: #4D4136 !important;
    }
    ul.md_sub_menu li {
        border-bottom: 0px;
    }
    .menu__btn{
        left: 93%;
        width: 43px;
        z-index: 13;
    }
    .menu__btn>span{
        height:2px;
    }
    .menu-nav-bar {
        margin-top: 22px;
    }
    li.sub-menu.yellow_title a {
        color: #806D5A;
    }
    .visual_text{
        color: #806D5A;
    font-weight: 600;
    }
    .label_color{
        background-color:#4D4136 !important;
        color: #fff !important;
     }
    .label_before #md_title .arrow-down::before {
        content: '';
        background-image: url(../img/menu/white_down_arrow.png) !important;
        background-size: contain;
        width: 16px;
        height: 22px;
        position: absolute;
        right: 20%;
        background-repeat: no-repeat;
        top: 6px;
    }
     .menu_grey{
        background-color: #806D5A;
     }
    
      .bounceInDown{
        animation-name: none;
      }
     
      .brand-logo {
        transform: translateY(0px);
    }
}