/*-----HEADER-----*/
/* #header_sticky{position: sticky;z-index: 11;width: 100%;top:0;} */

.header-top{background: #626ABB;padding: 14px 0;}
.head-wrapper{display: flex;flex-wrap: wrap;justify-content: space-between;width: 100%;}

.head-call {display: flex;margin:0 -35px;}
.head-call li{padding: 0 35px;position: relative;}
.head-call li:first-child:before{content: "";position: absolute;top:0;width: 7px;height: 7px;background:rgb(255 255 255 / 50%);border-radius: 100%; right:0;bottom: 0;margin:auto 0;}
.head-call li a{font-size: 20px;color: #fff;line-height: 100%;font-weight: 500;}
.head-call li a span{margin-right: 10px;}
.head-social, .head-login{display: flex;}
.head-social li a i.fa-facebook{font-size: 16px;}
.head-social li a{color: #fff;font-size: 18px;}
.head-social li{padding: 0 15px;}
.head-login li a{font-size: 20px;color: #fff;line-height: 100%;letter-spacing: 0.2px;}
.head-login{margin:0 -23px;}
.head-login li{padding: 0 23px;}
.head-login li a span{display: none;}

/* .head-center{display: flex;flex-wrap: wrap;justify-content: space-between;margin: 22px 0;} */
.search-bar{margin: auto;max-width: 500px; box-shadow: inset 3px 3px 5px rgb(0 0 0 / 10%), 3px 3px 5px rgb(0 0 0 / 10%);}
form.search-input input[type=text] {padding: 10px;font-size: 18px;border: 1px solid transparent;float: right;min-width: 440px;background: #fff;min-height: 56px;}
form.search-input button {float: left;width: 60px;padding: 10px 20px;background: #fff;color: #767787;font-size: 17px;min-height: 56px;border: 1px solid transparent;border-left: none;cursor: pointer;position: relative;}
form.search-input button:after{content: "";position: absolute;top: 0;right: 0;bottom: 0;width: 1px;height: 36px;background: rgb(118 119 135 / 30%);margin: auto 0;}
form.search-input input::-webkit-input-placeholder {font-weight: 300;}
form.search-input input::-moz-placeholder {font-weight: 300;}
form.search-input input:-ms-input-placeholder {font-weight: 300;}

.search-input{max-width: 500px;border-radius: 5px;background: #fff;width: 100%;height: 56px;box-shadow: 0 0 10px rgb(0 0 0 / 5%);}
.search-input-mobile {
    max-width: 90%;
    /* border-radius: 5px; */
    background: #fff !important;
    width: 100%;
    height: 40px;
    border: 0;
    box-shadow: 0 0 10px rgb(0 0 0 / 5%);
}
.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999999 !important;
    display: none;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0;
}

.cart-bar{font-size: 30px;color: #000000;line-height: 100%;text-align: center;justify-content:center;font-weight: normal;position: relative;display: flex;align-items: center;max-width: 175px;}
.cart-bar span img{margin-right: 8px;}
.cart-count{position: absolute;width: 23px;height: 23px;border-radius: 100%;background: #009DEE; top:-10px;left: 25px;border: 3px solid #fff;font-size: 9px;color: #fff;display: flex;align-items: center;justify-content: center;}
.menu-icon-text {line-height: 30px;color: #005071;font-family: 'Jost';font-style: normal;font-weight: 400;font-size: 14px;}
.wrap{display: flex;flex-wrap: wrap;}
.mainheader{position: relative;transition: all 0.5s ease-in-out 0s;-webkit-transition: all 0.5s ease-in-out 0s;-ms-transition: all 0.5s ease-in-out 0s;background: #fff;}
.logo-left{width: 233px;}
.head-right{width: calc(100% - 233px);}
.hidden, .menu_link nav>ul > li.hidden, .togglebtn {display: none;}
.menu_link nav{position: relative;}
.menu_link >nav>ul {font-size: 0;text-align: center;line-height: 100%;display: flex;justify-content: space-between;flex-wrap: wrap;}

.menu_link nav>ul > li {display: inline-block;text-align: center;vertical-align: middle;margin: 0 15px;}
.menu_link nav>ul > li > a{	font-family: 'Jost';	font-style: normal;	font-weight: 400;	font-size: 18px;	line-height: 18px;	color: #fff;	padding:25px 0;display: block;position: relative;line-height: 100%;letter-spacing: 0.2px;z-index: 1; text-transform: capitalize;}
/* .menu_link nav>ul > li:first-child, .bottom_head .menu_link nav>ul > li:first-child{margin-left: 0;} */
.menu_link nav>ul > li:last-child, .bottom_head .menu_link nav>ul > li:last-child{margin-right: 0;}
.menu_link .fa-angle-down.menudrop{font-size: 16px;padding-left: 8px;top: 2px;position: relative;line-height:0;}



/*
.fixed-header .mainheader {position: fixed;box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.23);-webkit-animation-duration: 0.7s;-webkit-animation-name: headfadeIn;animation-name: headfadeIn;animation-duration: 0.7s;-webkit-animation-fill-mode: both;animation-fill-mode: both;top: 0;width: 100%;z-index: 111;background:#fff;}
@-webkit-keyframes headfadeIn { 0% { opacity: 0;-webkit-transform: translateY(-50px);transform: translateY(-50px);} 100% {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes headfadeIn {0% { opacity: 0; -webkit-transform: translateY(-50px);transform: translateY(-50px);}100% {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}
*/

/*  header on scroll */
/*
.fixed-header .bottom_head .menu_link nav>ul > li > a{padding: 25px 0;}
.fixed-header .logo-left a.disblock{width: 65px;display: block;}
*/

.menu_link .mega-menu {-webkit-transition: all 200ms linear;-moz-transition: all 200ms linear;-ms-transition: all 200ms linear;-o-transition: all 200ms linear;transition: all 200ms linear;left: 0;position: absolute;top: 100%;width: 100%;text-align: left;border-radius: 0;z-index: 10;opacity: 0;visibility: hidden;pointer-events: none;min-width: 400px;background-color: #fff;padding:30px 40px;box-shadow: 0 0 6px rgb(0 0 0 / 16%);}
.menu_link li:hover .mega-menu {-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-ms-transition: all 300ms linear;-o-transition: all 300ms linear;transition: all 300ms linear;opacity: 1;visibility: visible;pointer-events: auto;}
.menu-wrap{display: flex;flex-wrap: wrap;}
.menu-wrap .col4{width:25%;}
.menu-title{font-size: 18px;line-height: 100%;color:#626ABB;font-weight: 500;display: block;width: 100%;margin-bottom: 10px;}
.menu-col:not(:last-child){margin-bottom: 15px;}

.mega-menu li a{font-size: 14px;font-weight: normal;color:#121533;display: block;padding:5px 0 5px 18px;position: relative;width: 100%;line-height:100%;letter-spacing: 0.2px;text-transform: capitalize;}
.mega-menu li a:before{position: absolute;content: "";background-color: #4C4C4C;height: 2px;left: 0;width: 5px;top: 9px;}
.mega-menu li a:hover, .mega-menu li.active a, .menu_link nav>ul > li > a:hover, .menu_link nav>ul > li.active > a{color: #fff;}
.mega-menu li a:hover:before, .mega-menu li.active a:before{background-color: #626ABB;}
.menu-title:hover{text-decoration: underline;}



/* Start Media query */
@media screen and (max-width: 1800px){
    .bottom_head .menu_link nav>ul > li{margin: 0 15px;}
}
@media screen and (max-width: 1700px){

}
@media screen and (max-width: 1599px){
    .head-call li a, .head-login li a {font-size: 16px;}
    .head-login{margin: 0 -10px;}
    .head-login li, .head-social li {padding: 0 10px;}
    .head-call li a span {margin-right: 3px;}
    .head-call{margin:0 -25px;}
    .head-call li {padding: 0 25px;}
    .menu_link nav>ul > li > a{font-size: 16px;}
    .cart-bar {font-size: 22px;}
}
@media screen and (max-width: 1439px){

}
@media screen and (max-width: 1366px){
    .search-input{max-width: 400px;}
    form.search-input input[type=text]{min-width: 330px;}
}
@media screen and (max-width: 1280px){
    .head-ecom .btn-list li .btn_call .icon-call{width: auto;height: auto;color:#000000;background: transparent;}
    .head-ecom .btn-list .btn_black {font-size: 12px;}
    .head-ecom .btn-list{margin: 0 -4px;}
    .head-ecom .btn-list li{padding: 0 4px;}
    .head-ecom .e_comlist {padding-left: 12px;}
    .bottom_head .menu_link nav>ul > li {margin: 0 6px;}
}
@media screen and (max-width: 1199px){

}

@media screen and (max-width: 991px){
    /*HEADER*/
    .language-box-section{
        display: none !important;
    }
    .overlay {position: fixed;top: 0;right: 0;z-index: 1;width: 100%;height: 100%;display: none;background-color: rgb(0 0 0 / 80%);cursor: pointer;}
    html.menuhidden {position: fixed;overflow-y: hidden}
    .overlay.active {visibility: visible;opacity: 1;}
    .togglebtn span {position: relative;display: inline-block;margin-top: 6px;vertical-align: top;left: 0;}
    .togglebtn span::before {top: -6px;}
    .togglebtn span::after {top: 6px}
    .togglebtn span::before,.togglebtn span::after {content: "";position: absolute;left: 0;}
    .togglebtn span,.togglebtn span::before,.togglebtn span::after {transition: all 0g345.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;width: 25px;height: 2px;}
    .togglebtn {display: block;width: 50px;height: 40px;cursor: pointer;z-index: 1001;padding: 11px;background: transparent;}
    .togglebtn.active span::before {transform: rotate(-135deg);-webkit-transform: rotate(-135deg);-moz-transform: rotate(-135deg);-o-transform: rotate(-135deg);-ms-transform: rotate(-135deg);top: 0;}
    .togglebtn.active span::after {-webkit-transition-delay: 0.09s;top: 0;-moz-transition-delay: 0.09s;-o-transition-delay: 0.09s;-ms-transition-delay: 0.09s;transition-delay: 0.09s;transform: rotate(135deg);-webkit-transform: rotate(135deg);-moz-transform: rotate(135deg);
        -o-transform: rotate(135deg);-ms-transform: rotate(135deg);}
    .togglebtn.active span { background: transparent;}
    .togglebtn.active {
        right: auto;top: 0;
        left: 45px;
        border-radius: 0;
        padding:12px;
        background: #fff;
    }
    .togglebtn.active:before {content: none;}
    .togglebtn span,.togglebtn span::before,.togglebtn span::after {background-color:#009DEE;}

    .menu_link {float: none;padding: 50px 0 0 0;position: fixed;top: 0;height: 100%;width: 375px;margin: 0;transition: all 0.6s ease;-webkit-transition: all 0.6s ease;-ms-transition: all 0.6s ease;overflow-y: auto;left: 0;z-index: 1000;transform: translateY(-101%);-webkit-transform: translateY(-101%);background: #fff;}
    .menu_link nav > ul > li > a {padding:18px 20px;height: auto;text-transform: capitalize;text-align: left;}
    .menu_link .mega-menu:before{content: none;}
    .menu_link.active {transform: translateY(0%);-webkit-transform: translateY(0%);}
    .menu_link nav > ul > li {display: block;text-align: left;width: 100%;height: auto;border-bottom: 1px solid #efefef;margin:0;}
    .menu_link >nav>ul{padding-right: 0;width: 100%;}
    .menu_link nav>ul > li > a:hover, .menu_link nav>ul > li.active > a{background: #fff;color: #000;}
    .menu_link .fa-angle-down.menudrop {display: block;top: 0;font-size: 18px;height: 46px;width: 60px;border-radius: 0;line-height: 50px;right: 0;bottom: 0;margin: auto;position: absolute;background: transparent;text-align: center;}
    .menu_link li:hover .mega-menu {display: none;-webkit-transform: none;transform: none;opacity: inherit;}
    .menu_link .mega-menu {-webkit-transform: none;transform: none;display: none;visibility: unset;opacity: unset;border-top:1px solid #efefef; width: 100%;padding:10px 30px;position: relative;left: auto;top:0; -webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;min-width: inherit;max-width: 100%;}
    li.has-sub > a >.menudrop{transition: all 0.3s linear;-webkit-transition: all 0.3s linear;-o-transition: all 0.3s linear;-moz-transition: all 0.3s linear;}
    .mainheader{background: #fff;}
    .head_country select.form-control{width: 90px;}
    li.has-sub > a >.menudrop.openedmenu:before {content: "\f105";}
    .mega-menu.three_colmenu li{width: 100%;}
    .menu_link nav>ul > li > a, .mega-menu li a{letter-spacing: 0.4px;}
    header .otrixcontainer{width: 100% !important;}
    .menu-col{margin-bottom: 15px;}
    .menu-title {font-size: 16px;}
    .menu-wrap .col4{width: 100%;}
    .head-call li a span{width: 15px;display: inline-block;}
    .head-call li a{font-size: 0;display: inline-block;}
    .head-call li:first-child:before{content: none;}
    .head-call{margin:0 -8px;}
    .head-call li {padding: 0 8px;display: flex;align-items: center;}
    .header-top{padding: 6px 0;}
    .head-social{display: none;}
    .e-cart{padding-right: 62px;}
    .logo-left {width: 160px;}
    .cart-bar {font-size: 16px;}
    .cart-bar span img{width: 30px;}
    .cart-count{width: 20px;height: 20px;border: 2px solid #fff;font-size: 8px;top: -6px;left: 17px;}
    form.search-input input[type=text], form.search-input button{min-height: 40px;}
    .search-input{height: 40px;}
    form.search-input button:after{height: 20px;}
    form.search-input button{width: 40px;padding: 0px 10px;}
    form.search-input input[type=text]{font-size: 14px;}
    .head-login li a.create-account{font-size: 0;}
    .head-login li a span{display: inline-block;font-size: 18px;}
    .head-login{margin: 0 -5px;}
    .head-login li{padding: 0 5px;}
    .menu_link >nav>ul{
        border-top: 0;
        background: #009DEE !important;
        /*background: #21a72f !important;*/
    }



}
@media screen and (max-width: 767px){
    .search-input {max-width: 100%;}
    .search-bar {max-width: 100%;width: 100%;order: 3;margin-top: 10px;}
    form.search-input input[type=text] {min-width: 85%;}
    form.search-input button {min-width: calc(100% - 85%);width: calc(100% - 85%);}
    .head-login {display: none;}
}

@media screen and (max-width: 575px){
    .head-login {display: none;}

}
@media screen and (min-device-width: 320px){
    .mobile-header .cart-count {
        left: 10px !important;
    }
}
@media screen and (min-device-width: 375px){
    .mobile-header .cart-count {
        left: 10px !important;
    }
}
@media screen and (min-device-width: 425px){
    .mobile-header .cart-count {
        left: 10px !important;
    }
}
@media screen and (min-device-width: 768px) {
    .mobile-header .cart-count {
        left: 10px !important;
    }
}
@media screen and (max-width: 480px){
    .head-login {display: none;}
    .logo-left a.disblock, .fixed-header .logo-left a.disblock{width: auto;}
    .menu_link{width: 100%;}
    .togglebtn.active{left:inherit;top: 10px;}
}
@media screen and (max-width: 375px){
    .cart-bar span img {width: 20px;}
    .cart-bar {font-size: 12px;}
    .cart-bar{min-height: 40px;}
    .cart-count{top: -10px;left: 10px;}
    .logo-left {width: 130px;}
    .head-login {display: none;}

}
@media screen and (max-width: 360px){
}




.togglebtn{
    position: absolute;
    top: 4px !important;
}
