/* --------------------------------------
/* Responsive Menu style
----------------------------------------*/
.main-header #open-above-menu,.below-header #open-above-menu{
   display:none;
}
.open-shop-menu,.open-shop-menu li{
    list-style: none;
    margin: 0;
    padding: 0;      
}

.open-shop-menu > li {
    display: block;
    margin: 0;
    padding: 0;
    border: 0px;
   display: inline-block;
}
.open-shop-menu li a:hover,
.open-shop-menu .current-menu-item a{
    color:#ff0052;
}
.open-shop-menu > li > a {
    display: block;
    position: relative;
    margin: 0;
    border: 0px;
    font-size:14px;
    font-family: "Roboto-Bold", sans-serif;
  padding: 12px 20px 12px 0px;
        color:#1c1d1e;
}
 #open-above-menu.open-shop-menu > li > a{
font-size: 13px;
font-family: "Roboto-regular", sans-serif;
}
.open-shop-menu li a i {
    padding-right: 5px;
    font-size: 16px;
    text-shadow: none;
}
.open-shop-menu li ul.sub-menu li a i {
    padding-right: 10px;
}
.open-shop-menu li.on-section a {
    color:#111;
}
.open-shop-menu li ul.sub-menu li a:hover{
 background:#eee;
}
.open-shop-menu li .menu-active {
    position: relative;
}
.open-shop-menu > li > a > .arrow:before {  
    margin-left:5px;
    font-family: FontAwesome;
    height: auto;
    content: "\f107";
    font-weight: 300;
    text-shadow: none;
    width: 10px;
}
.open-shop-menu li ul.sub-menu li > a > .arrow:before {
    content: "\f105";
}

.open-shop-menu  ul.sub-menu {
position: absolute;
box-shadow: 0 4px 10px 0 rgba(3,3,3,.1);
list-style: none;
margin-bottom: 0;
line-height: 18px;
text-align: left;
min-width: 166px;
opacity: 0;
visibility: hidden;
z-index: 99;
background-color: #fff;
    margin: 0;
    -webkit-transition: -webkit-transform .3s ease,opacity .3s ease,visibility .3s ease;
    transition: transform .3s ease,opacity .3s ease,visibility .3s ease;
    -webkit-transform: translateY(14px);
    transform: translateY(14px);

}
.open-shop-menu ul.sub-menu.slide {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
.open-shop-menu li ul.sub-menu > li {
    width: 185px;
}
.open-shop-menu li ul.sub-menu li a {
    display: block;
    height: auto;
    min-height: 0 !important;
    line-height: 1.8;
    padding: 12px 15px;
    text-decoration: none;
    font-weight: normal;
    background: none;
}
.open-shop-menu > li > ul.sub-menu > li {
    position: relative;
    line-height: initial;
}
.open-shop-menu > li > ul.sub-menu li > a > .arrow:before {
    float: right;
    margin-right: 0px;
    display: inline;
    font-size: 16px;
    font-family: FontAwesome;
    height: auto;
    content: "\f105";
    text-shadow: none;
}
.open-shop-menu > li > ul.sub-menu > li ul.sub-menu {
    position: absolute;
    left: 100%;
    top: 0px;
    list-style: none;
    margin: 0;
}
.open-shop-menu > li > ul.sub-menu > li ul.sub-menu > li ul.sub-menu {
    position: absolute;
    left: 185px;
    top: 0px;
    list-style: none;
}
/* Menu Toggle Btn
----------------------------------------*/
.menu-toggle {
    display: none;
    width: 100%;
}
.menu-toggle h3,.bar-menu-toggle h3 {
    float: left;
    color: #FFF;
    padding: 0px 10px;
    font-weight: 600;
    font-size: 16px;
}
.menu-toggle .icon-bar{
    display: block !important;
    width: 25px;
    height: 2px;
    background-color:#242424;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    margin:6px;
}
.menu-toggle .menu-btn{
    float: right;
    background: transparent;
}

.open-shop-menu .hide-menu {
    display: none;
}
.menu-close-btn:hover{
    cursor:pointer;
}
.menu-toggle .menu-btn:focus,.bar-menu-toggle .menu-btn:focus{
outline:0;
}

/* Accordion Menu Styles
----------------------------------------*/

ul[data-menu-style="accordion"] {
    width: 250px;
}
ul[data-menu-style="accordion"] > li {    
    display: block;
    margin: 0;
    padding: 0;
    border: 0px;
    float: none !important;
}
ul[data-menu-style="accordion"] li ul.sub-menu > li {
    width: 100%;
}
ul[data-menu-style="accordion"] > li > a > .arrow:before {
    float: right;
    content: "\f105";
}
ul[data-menu-style="accordion"] li.menu-active > a > .arrow:before {
    content: "\f107" !important;
}
ul[data-menu-style="accordion"] > li > ul.sub-menu {
    position: static;
}
ul[data-menu-style="accordion"] > li > a i {
    padding-right: 10px;
    color: #FF5737;
}
ul[data-menu-style="accordion"] > li > ul.sub-menu > li ul.sub-menu {
    position: static;
}
ul[data-menu-style="accordion"] > li > ul.sub-menu > li ul.sub-menu > li ul.sub-menu {
    position: static;
}
ul[data-menu-style="accordion"] > li {
    border-bottom: 1px solid rgba(0,0,0,.1);
}
ul[data-menu-style="accordion"] ul.sub-menu li.menu-active > a > .arrow:before {
    content: "\f107";
}
body{
transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.23s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    left: 0;
}
/****************************/
/*end hamburger menu*/
/****************************/
@media screen and (max-width: 1024px){
    .open-shop-menu li,
    .open-shop-menu a{
        position: relative;
    }
.main-header #open-above-menu,.below-header #open-above-menu{
   display:block;
}
.abv-two .top-header-col1 .menu-toggle .menu-btn{
float:none;
}   
.mhdfull .top-header .menu-toggle,
.mhdfull .bottom-header .menu-toggle{
display:block!important;
}
.sticky-mobile-menu-active .left,
.mobile-menu-active .sider.open-shop-menu-hide.left,
.mobile-bottom-menu-active .sider.open-shop-menu-hide.left{
left: -300px;
right: auto;
transition: left 0.3s ease;
}
.sticky-mobile-menu-active .right,
.mobile-menu-active .sider.open-shop-menu-hide.right,
.mobile-bottom-menu-active .sider.open-shop-menu-hide.right{
left: auto;
right:-300px;
transition: right 0.3s ease;
}
.mobile-menu-active .open-shop-menu .searchfrom #searchform{
display:block;
position: relative;
}
.mobile-menu-active .open-shop-menu  .searchfrom .search-btn{
display:none;
}
.mobile-menu-active li.menu-item.zta-custom-item{
padding:18px 0px;
    border: none;
}
.mobile-menu-active .open-shop-menu .searchfrom{
float:left;
}
.main-header .menu-custom-search .content-social ul.social-icon li{

display: -webkit-inline-box;
}

.main-header .menu-custom-search .content-social ul.social-icon{
    margin: 0;
    display: block;
}
.demo{
		width:96%;
		padding:2%;
    }
    ul[data-menu-style="vertical"] , ul[data-menu-style="accordion"],
    ul[data-menu-style="vertical"] li ul.sub-menu {
        width: 100% !important;
    } 
    .open-shop-menu {
        float: left;
        width:100%;
    }
    .open-shop-menu > li {
        position:relative;
       float: none;
    }       
    .open-shop-menu > li > a i {
        padding-right: 10px;
        color: #FF5737;
    }
    .open-shop-menu > li > a > .arrow:before {
        float: right;
        content: "\f107";
    }
.sider.left .open-shop-menu > li, .sider.right .open-shop-menu > li {
    float: none;
}
.open-shop-menu li ul.sub-menu li a {
    display: block;
    margin: 0px 0px;
    padding: 10px 40px 10px 0px!important;
    text-decoration: none;
    font-weight: normal;
    background: none;
    font-size: 12px;
}
    li.menu-active > a > .arrow:before {
        content: "\f106" !important;
    }
    .open-shop-menu li ul.sub-menu > li {
        width: 100%;
    }
    .open-shop-menu li ul.sub-menu li ul.sub-menu li a{
        padding-left: 30px;
    }  
    .open-shop-menu li ul.sub-menu li ul.sub-menu li ul.sub-menu li a  {
        padding-left: 50px;
    }  
    .open-shop-menu > li > ul.sub-menu {
        position: static;
    }
    .open-shop-menu > li > ul.sub-menu > li ul.sub-menu {
        position: static;
    }
    .open-shop-menu > li > ul.sub-menu > li ul.sub-menu > li ul.sub-menu {
        position: static;
    }
    .open-shop-menu li ul.sub-menu li.menu-active > a > .arrow:before {
        content: "\f106";
    }
  .open-shop-menu > li > a,.top-header-bar .open-shop-menu > li > a, 
    .bottom-header-bar .open-shop-menu > li > a {
    padding: 10px 40px 10px 0px!important;
   }   
.top-header-bar.abv-two .top-header-col1 .menu-toggle .menu-btn,
.top-header-bar.abv-three .top-header-col1 .menu-toggle .menu-btn,
.bottom-header-bar.btm-two .bottom-header-col1 .menu-toggle .menu-btn,
.bottom-header-bar.btm-three .bottom-header-col1 .menu-toggle .menu-btn{
float:left;
}
/*menu-advance-style*/
.logged-in.admin-bar .sider{
top:32px;
}
.sider.left {
    display: block;
    position: fixed;
    top: 0;
    height: 100vh;
    z-index: 999999;
    width: 280px;
    padding: 2em 1.5em;
    max-width: 100%;
    -webkit-box-shadow: 0 0 12px 0 rgba(0,0,0,.4);
    box-shadow: 0 0 12px 0 rgba(0,0,0,.4);
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    background-color: #fff;
    -webkit-touch-callout: none;
    user-select: none;
    -webkit-overflow-scrolling: touch;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.sider.left {
    left:-100%;
}
.sider.left .open-shop-menu > li,
.sider.right .open-shop-menu > li {
    float: none;
    line-height: initial;
    width: 100%;
    text-align: left;
}
.mobile-menu-active .sider::-webkit-scrollbar,.sider.overcenter ul#open-shop-menu::-webkit-scrollbar {
    width: 5px;
}
.mobile-menu-active .sider.left,
.sticky-mobile-menu-active .sider.left,
.mobile-bottom-menu-active .sider.left{
    left:0px;
}
body{
transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.23s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    left: 0;
}
/*right-menu*/
.sider.right {
    display: block;
    position: fixed;
    top: 0;
        height: 100vh;
    z-index: 999999;
    width: 280px;
    padding: 3em 1.5em;
    max-width: 100%;
    border-right: 1px solid rgba(0,0,0,.1);
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    background-color: #fff;
-webkit-box-shadow: 0 0 12px 0 rgba(0,0,0,.4);
    box-shadow: 0 0 12px 0 rgba(0,0,0,.4);
    -webkit-touch-callout: none;
    user-select: none;
    -webkit-overflow-scrolling: touch;
       -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.sider.right {
    right:-100%;
    left: auto;
}
.mobile-menu-active .sider.right,
.sticky-mobile-menu-active .sider.right,
.mobile-bottom-menu-active .sider.right {
    left:auto;
    right:0;
    transition: right 0.3s ease;
}
 /*center over menu*/
.sticky-mobile-menu-active .overcenter,
.mobile-menu-active .sider.open-shop-menu-hide.overcenter,
.mobile-bottom-menu-active .sider.open-shop-menu-hide.overcenter{
display:none;
}
 .mobile-menu-active .sider.overcenter,
 .sticky-mobile-menu-active .sider.overcenter,
 .mobile-bottom-menu-active .sider.overcenter{
  position:fixed;
  left:0px;
  right:0;
  top:0;
  bottom:0;
  margin:0 auto;
  height: 100vh;
background: rgba(16,18,19,.95);
  display:block;
  z-index: 9999;
      -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
        -webkit-animation: bodyfadeIn .3s;
    -moz-animation: bodyfadeIn .3s;
    -ms-animation: bodyfadeIn .3s;
    -o-animation: bodyfadeIn .3s;
    animation: bodyfadeIn .3s;
}
.mobile-menu-active .sider.overcenter{
    padding: 90px 0 90px 0px!important;
}
.mobile-menu-active .sider.overcenter .open-shop-menu,
.sticky-mobile-menu-active .sider.overcenter .open-shop-menu,
 .mobile-bottom-menu-active .sider.overcenter .open-shop-menu{
  float: none;
  max-width: 800px;
    margin: 0 auto;
  margin:auto;
}
.sticky-mobile-menu-active .sider.overcenter .menu-close-btn,
.mobile-bottom-menu-active .sider.overcenter .menu-close-btn{
  margin-top:40px;
  margin-left:40px;
}
.sider.overcenter{
   -webkit-animation: bodyfadeIn .3s;
    -moz-animation: bodyfadeIn .3s;
    -ms-animation: bodyfadeIn .3s;
    -o-animation: bodyfadeIn .3s;
    animation: bodyfadeIn .3s;  
}
.overcenter{
  display:none;  
}
 /*close button css*/
 .menu-close-btn {
    -webkit-transform: rotateZ(0deg);
    -moz-transform: rotateZ(0deg);
    transform: rotateZ(0deg);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.left .menu-close,.right .menu-close{
background:#111;
}
.menu-close a:hover{
color:#fff;
}
.menu-close-btn{
    margin: 10px;
    width: 14px;
    display: block;
    text-decoration: none;
    top: .75em;
    right: 1em;
    min-width: 1em;
    min-height: 1em;
    transform-origin: center;
    transition: all .3s linear;
    transition-property: transform;
    font-size: 20px;
    color:#fff;
}
.menu-close-btn:before {
    -webkit-transform: rotateZ(-45deg);
    -moz-transform: rotateZ(-45deg);
    transform: rotateZ(-45deg);
    
}
.menu-close-btn:before,.menu-close-btn:after{
    content: '';
    display: block;
    border-top: 1px solid;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
}
.menu-close-btn:after{
-webkit-transform: rotateZ(45deg);
    -moz-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
}
.menu-close-btn:hover{
-webkit-transform: rotateZ(90deg);
    -moz-transform: rotateZ(90deg);
    transform: rotateZ(90deg);
}
/*left pan*/
.mhdrleftpan .sider{
left:0;
position: inherit;
}
header.mhdrleftpan .container,
header.mhdrrightpan .container{
    width:100%;
    max-width: 100%;
    padding:0;
    margin:0;
}
.mhdrleft .open-shop-menu {
    padding-left:0!important;
}
.mhdrleftpan .sider .hide-menu,.mhdrrightpan .sider .hide-menu{
display:block;
}
.mhdrleftpan .menu-toggle,
.mhdrrightpan .menu-toggle{
display:none!important;
}
.mhdrleftpan .sider .menu-close-btn,
.mhdrrightpan .sider .menu-close-btn{
display:none;
}
.mhdrleftpan .sider.left,
.mhdrleftpan .sider.right,
.mhdrrightpan .sider.left,
.mhdrrightpan .sider.right{
width: 100%;
max-width: 100%;
padding-bottom:0;
    height: auto;
}
.mhdrleftpan .sider.overcenter,
.mhdrrightpan .sider.overcenter{
    display: block;
}
body.mobile-pan-active{overflow-x: hidden;}
/*right pan*/
.mhdrrightpan .sider{
right:0;
left:auto;
position: inherit;
}
.mhdrright .open-shop-menu {
    padding-right:0!important;
}
.mhdrrightpan .container{
    width:100%;
    max-width: 100%;
    padding:0;
    margin:0;
}
.menu-toggle .menu-btn{
display:flex;
}
.menu-toggle .menu-btn span{
color:#fff;
}
.menu-toggle .menu-btn .text span,.bar-menu-toggle .menu-btn .text span{
margin-left:5px;
}
.open-shop-menu.collapse span.arrow{
 position: absolute;
    right: 20px;
    height: 20px;
    width: 40px;
    line-height: 20px
}
.open-shop-menu.collapse li a .arrow:before{
margin-right: 12px;
font-size: 13px;
}
.open-shop-menu.collapse > li > ul.sub-menu li > a > .arrow:before{
    margin-right: 10px;
    font-size: 12px;
    content: "\f107";

}
.sider .sider-inner ul#open-shop-menu,.open-shop-menu li ul.sub-menu{
    background:transparent;
}
.sider  .sider-inner ul#open-shop-menu.open-shop-menu > li > a:hover{
   background:transparent;
}
.right .menu-close{
    width: 40px;
    height: 40px;
    top: 0;
    position: absolute;
    left: 0;
}
.left .menu-close{
    width: 40px;
    height: 40px;
    top: 0;
    position: absolute;
    right: 0;
}
.main-header .sider-inner ul.open-shop-menu li ul.sub-menu,.sider-inner #open-above-menu.open-shop-menu > li > a:hover,
.sider-inner #open-above-menu.open-shop-menu li ul.sub-menu,.sider-inner #open-above-menu.open-shop-menu li ul.sub-menu li a:hover,
.sider-inner #open-above-menu.open-shop-menu li ul.sub-menu li:hover,.main-header .main-header-container nav{
    background:transparent!important;
}
.two .main-header-col2 {
    order: 3;
    flex: none!important;
  }
/********************
Overcenter Mobile Menu 
*************************/
.sider.overcenter .sider-inner .open-shop-menu li{
width:100%!important;
}
.sider.overcenter .sider-inner ul.open-shop-menu li a{
font-size:20px;
color:#fff;
font-family: 'Roboto-Bold';
line-height: initial;
padding: 10px 0px 10px 0px!important;

}
.sider.overcenter .open-shop-menu ul.sub-menu{
opacity: inherit;
display:none;
float: none;
text-align: center;
-webkit-transform: inherit;
transform: inherit;
transition: inherit;
}
.sider.overcenter .sider-inner ul.open-shop-menu li a:hover {
 background:none;
color:#ff0052;
}
.sider.overcenter .open-shop-menu.collapse span.arrow{
right:auto;
}

.overcenter .menu-close .menu-close-btn{
    position: absolute;

}
.overcenter .menu-close-btn{
    min-width:1.5em;
    min-height:1.5em;
top: 1em;
}
.overcenter .menu-close-btn:before, .overcenter .menu-close-btn:after{
border-top:2px solid;
}
/*Left and right pan*/
.left .menu-item-has-children ul,.right .menu-item-has-children ul{
display:none;
}
.open-shop-menu li ul.sub-menu li a:hover{
    background:none;
}
.open-shop-menu ul.sub-menu{
 opacity: inherit;
display:none;
float: none;
-webkit-transform: inherit;
transform: inherit;
transition: inherit;   
}
.open-shop-menu ul.sub-menu.slide{
   -webkit-transform: inherit;
transform: inherit;
transition: inherit; 
}
/*mobile menu wrapper*/
.open-shop-mobile-menu-wrapper {
    width: 100%;
    top: 0;
    position: fixed;
    height: 100%;
    background: rgba(0,0,0,.4);
    z-index: 99;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    z-index: 1001;
}
.mobile-menu-active .open-shop-mobile-menu-wrapper,.sticky-mobile-menu-active .open-shop-mobile-menu-wrapper  {
    visibility: visible;
    opacity: 1;
}
@-webkit-keyframes bodyfadeIn {
            0% {opacity: 0;}
            100% {opacity: 1;}
}
         
         @keyframes bodyfadeIn{
            0% {opacity: 0;}
            100% {opacity: 1;}
 }
}
@media screen and (max-width: 768px){
/*mobile pan style*/
.header-pan-icon{
    display: block;
}
.mhdrleftpan .header-pan-icon span{
    position: fixed;
    top: 10%;
    left: 0;
    background-color: #008ec2;
    color: #fff;
    font-size: 1.2em;
    width:30px;
    height:50px;
    line-height:50px;
    text-align: center;
    z-index: 10000;
    -webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}
.mhdrrightpan .header-pan-icon span{
left:auto;
right:0;
position: fixed;
    top: 10%;
    background-color: #008ec2;
    color: #fff;
    font-size: 1.2em;
    width:30px;
    height:50px;
    line-height:50px;
    text-align: center;
    z-index: 10000;
    -webkit-transition: right .2s ease-in-out;
    -moz-transition: right .2s ease-in-out;
    transition: right .2s ease-in-out;
}
.mobile-pan-active .mhdrleftpan .header-pan-icon span {
    left: 270px;
}
.mobile-pan-active .mhdrrightpan .header-pan-icon span {
    left: auto;
    right:270px;
}
.mhdrleftpan #page.open-site{
margin-left:auto!important;
}
.mhdrrightpan #page.open-site{
margin-right:auto!important;
}
 header.mhdrleftpan{
left: -270px!important;
right: auto;
-webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}
header.mhdrrightpan{
right: -270px!important;
left: auto;
-webkit-transition: right .2s ease-in-out;
    -moz-transition: right .2s ease-in-out;
    transition: right .2s ease-in-out;
}
.mobile-pan-active header.mhdrleftpan{
left: 0px!important;
right: auto;
-webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}
.mobile-pan-active header.mhdrrightpan{
right: 0px!important;
left: auto;
-webkit-transition: right .2s ease-in-out;
    -moz-transition: right .2s ease-in-out;
    transition: right .2s ease-in-out;
}
.mhdrleftpan #page.open-site {
left:0px!important;
-webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}
.mhdrrightpan #page.open-site {
right:0px!important;
-webkit-transition:  right .2s ease-in-out;
    -moz-transition:  right .2s ease-in-out;
    transition:  right .2s ease-in-out;
}
.mobile-pan-active.mhdrleftpan #page.open-site {
left:270px!important;
-webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}
.mobile-pan-active.mhdrrightpan #page.open-site {
right:270px!important;
-webkit-transition: right .2s ease-in-out;
    -moz-transition: right .2s ease-in-out;
    transition: right .2s ease-in-out;
}
.open-site .mhdrleftpan .pan-icon:before{
content: "\f101";
font-family:FontAwesome;
}
.mobile-pan-active .open-site .mhdrleftpan .pan-icon:before{
content: "\f100";
font-family:FontAwesome;
}
.open-site .mhdrrightpan .pan-icon:before{
content: "\f100";
font-family:FontAwesome;
}
.mobile-pan-active .open-site .mhdrrightpan .pan-icon:before{
content: "\f101";
font-family:FontAwesome;
}
.mhdrleftpan .site-content #primary,
.mhdrrightpan .site-content #primary {
    margin: 0px;
}
 header.mhdrleftpan .open-cart{
left: -270px!important;
right: auto;
-webkit-transition: left .2s ease-in-out;
    -moz-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}
header.mhdrrightpan .open-cart{
right: -270px!important;
left: auto;
-webkit-transition: right .2s ease-in-out;
    -moz-transition: right .2s ease-in-out;
    transition: right .2s ease-in-out;
}
.cart-pan-active header.mhdrleftpan .open-cart{
left: 0px!important;
right:auto;
}
.cart-pan-active header.mhdrrightpan .open-cart{
right: 0px!important;
left: auto;
}
}
@media screen and (max-width:544px) {
/*inline menu*/
.inline .open-logo img{
height:auto;
 }
.inline .two .main-header-container {
    flex-wrap: nowrap;
}
 .mhdrcenter.inline .two .main-header-container {
    flex-wrap: wrap;
}
.stack .two .main-header-col1,
.stack .two .main-header-col2{
justify-content: center;
text-align:center;
width:100%;
}
.stack .open-shop-menu .menu-custom-search{
text-align:left;    
}
.main-header.mhdrright.stack .two .main-header-col1{
text-align:center;
}
.main-header.mhdrright .two .main-header-col2{
justify-content: center;
}
}

.mobile-menu-active .open-shop-menu ul.sub-menu,
.sticky-mobile-menu-active .open-shop-menu ul.sub-menu{
box-shadow:none;
}
/************************/
/*menu description style*/
/************************/
#open-above-menu .menu-item-description,
#open-footer-menu  .menu-item-description{
display:none;
}
nav .menu-item-description{
    position: absolute;
    top: -3px;
    left: calc(100% - 25px);
    background-color:#111;
    font-size: 11px;
    padding: 3px 5px;
    line-height: 10px;
    color: #fff;
}
nav .menu-item-description:after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-left: 0px solid transparent;
    border-right: 6px solid transparent;
    left: 3px;
    bottom: -4px;
}
/*red*/
.open-shop-menu > li:nth-child(4n+1) .menu-item-description{
background:rgb(233, 102, 86);
}
.open-shop-menu > li:nth-child(4n+1) .menu-item-description:after{
border-top: 4px solid rgb(233, 102, 86);
}
/*yellow*/
.open-shop-menu > li:nth-child(4n-2) .menu-item-description{
background:rgb(243, 200, 36);
}
.open-shop-menu > li:nth-child(4n+2) .menu-item-description:after{
border-top: 4px solid rgb(243, 200, 36);
}
/*green*/
.open-shop-menu > li:nth-child(4n-1) .menu-item-description{
background:rgb(52, 210, 147);
}
.open-shop-menu > li:nth-child(4n-1) .menu-item-description:after{
border-top: 4px solid rgb(52, 210, 147);
}
/*blue*/
.open-shop-menu > li:nth-child(4n) .menu-item-description{
background:rgb(58, 176, 226);
}
.open-shop-menu > li:nth-child(4n) .menu-item-description:after{
border-top: 4px solid rgb(58, 176, 226);
}
.mobile-menu-active nav .menu-item-description,
.sticky-mobile-menu-active nav .menu-item-description,
.pan-content nav .menu-item-description{
    position: relative;
    top: 0;
    left: auto;
    background-color: #111;
    font-size: 11px;
    padding: 3px 5px;
    line-height: 10px;
    color: #fff;
    display: inline-block;
    margin-left: 10px;
}
/*===========LOGO SITE CENTRAT PE DESKTOP====*/
@media (min-width: 768px) {
  .custom-logo {
    width: 620px !important;
    height: 70px !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    object-fit: contain !important;
    display: block !important;
  }

  .thunk-logo {
    transform: translate(-100px,-20px) !important;
  }

  .site-description p {
    font-size: 14px !important;
    margin-left:10px !important;
    color:black !important;
    line-height: 1 !important;
    margin-bottom: -40px !important;
    margin-top: -20px !important;
  }
}
/*=====descriere produs si recenzii doar pe desktop====*/
@media (min-width: 1024px) {
#tab-title-reviews > a {
  color: #28a745 !important; /* verde primitor */
}
#tab-title-description > a {
  color: #dd9933 !important;
}
}
/*====Contul Meu pe desktop iconita+text===*/
@media (min-width: 1024px) {
  .thunk-icon .header-icon a.account {
    position: relative;
    display: inline-flex;
    align-items: center;
  }

  .thunk-icon .header-icon a.account::after {
    content: "Contul\AMeu";
    white-space: pre;
    font-size: 11px;
    line-height: 1;
    color: #333;
    font-weight: bold;
    display: block;
    margin-left: 4px;
    transition: color 0.3s ease;
  }

  .thunk-icon .header-icon a.account:hover::after {
    color: #dd9933;
  }
}
/*==========================================================*/
/*=====================Puncte Disponibile Puncte revendicate centrare desktop==*/
@media screen and (min-width: 1024px) {
  #wlr_currency_list {
    font-size: 12px !important;
    padding: 4px 6px !important;
    margin: 6px auto !important;
    width: auto !important;
    display: block !important;
    text-align: center !important;
  }

  /* Asigură-te că toate containerele părinți permit alinierea */
  .wlr-box-container,
  .wlr-container,
  .wlr-section,
  .wlr-points-wrapper {
    text-align: center !important;
  }

  /* Titlurile: centrate, afișate bloc */
  #wlr-available-points-heading,
  #wlr-used-rewards-heading,
  #wlr-redeemed-points-heading {
    font-size: 18px !important;
    font-weight: bold !important;
    margin-bottom: 4px !important;
    line-height: 1.2 !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #wlr-available-points-heading { color: #8e44ad !important; }
  #wlr-used-rewards-heading { color: red !important; }
  #wlr-redeemed-points-heading { color: #27ae60 !important; }

  /* Valori puncte */
  #wlr-available-point-value,
  #wlr-used-reward-value-count,
  #wlr-redeemed-point-value {
    font-size: 20px !important;
    font-weight: bold !important;
    line-height: 1 !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
  }

  #wlr-available-point-value { color: #27ae60 !important; }
  #wlr-used-reward-value-count { color: #b39494 !important; }
  #wlr-redeemed-point-value { color: red !important; }

  /* Text explicativ sub puncte */
  #wlr-used-reward-value {
    font-size: 15px !important;
    color: #27ae60 !important;
    margin: 0 !important;
    line-height: 1 !important;
    text-align: center !important;
    width: 100% !important;
  }

  #wlr-available-point-value + .wlr-text-color p {
    font-size: 15px !important;
    color: #dd9933 !important;
    margin: 4px 0 0 !important;
    line-height: 1 !important;
    text-align: center !important;
    width: 100% !important;
  }

  #wlr-redeemed-point-value + .wlr-text-color p {
    font-size: 15px !important;
    color: #8e44ad !important;
    margin: 4px 0 0 !important;
    line-height: 1 !important;
    text-align: center !important;
    width: 100% !important;
  }
}
/*==============trage la stanga pagina contul meu face full screen=====*/
@media screen and (min-width: 1024px) {
  .woocommerce {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }

  .woocommerce-MyAccount-navigation,
  .woocommerce-MyAccount-content {
    float: none !important;
    text-align: left !important;
    margin-left: 0 !important;
  }

  .woocommerce-MyAccount-content {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .woocommerce table.shop_table {
    margin-left: 0 !important;
  }
}
/*=====Ascunde sticky pe desktop=====*/
@media screen and (min-width: 1024px) {
  .sticky-header-bar {
    display: none !important;
  }
}
/*============Ajustare partea de sus finalizare======*/
.woocommerce-info {
    background-color: #d7f0d2 !important; /* un verde deschis */
    border-color: #b3ddb0 !important;
    color: #2d6027 !important;
    padding: 15px;
    border-radius: 6px;
    font-weight: 500;
}
.woocommerce-info a {
    color: #dd9933 !important;
    font-weight: 600;
    text-decoration: underline;
}
/*============Top pagina finalizare puncte cupon doar pe mobil====*/
@media screen and (max-width: 768px) {
    /* ✅ Modifică marginile (spațiile exterioare) doar pentru sus și jos pe mobil */
    .wlr-message-info.wlr_points_rewards_earn_points {
        margin-top: -40px !important;   /* Ridică elementul mai sus pe mobil */
        margin-bottom: -10px !important; /* Apropie de ce urmează după el */
        padding: 4px 28px !important;    /* Spațiu interior compact */
    }

    /* ✅ Ajustează marginile pentru mesajul "Ai un cupon?" doar pe mobil */
    .woocommerce-info {
        margin-top: 0px !important;   /* Ridică mai aproape de conținutul anterior */
        margin-bottom: 0px !important;  /* Elimină spațiul de jos */
        padding: 0px 20px !important;   /* Spațiu interior pe laterale */
    }
}
/*========Top pagina finalizare puncte cupon doar pe desktop====*/
@media screen and (min-width: 1024px) {
    /* ✅ Modifică marginile (spațiile exterioare) doar pentru sus și jos pe desktop */
    .wlr-message-info.wlr_points_rewards_earn_points {
        margin-top: -30px !important;   /* Ridică elementul mai sus */
        margin-bottom: -10px !important; /* Reduce spațiul de jos */
        padding: 4px 28px !important;    /* Spațiu interior (padding) păstrat sau ajustat */
    }

    /* ✅ Ajustează marginile pentru mesajul "Ai un cupon?" doar pe desktop */
    .woocommerce-info {
        margin-top: 0px !important;   /* Ridică mai aproape de conținutul anterior */
        margin-bottom: 0px !important;  /* Elimină spațiul de jos */
        padding: 0px 20px !important;   /* Spațiu interior lateral mai compact */
    }
}
/*==============borduri checkout finalizare chenare====*/
/* Modifică culoarea bordurii pentru toate câmpurile de input din WooCommerce care sunt într-un span */
#username {
    border: 1px solid #dd9933 !important;
}

body.woocommerce .woocommerce-input-wrapper input[type="text"],
body.woocommerce .woocommerce-input-wrapper input[type="email"],
body.woocommerce .woocommerce-input-wrapper input[type="tel"],
body.woocommerce .woocommerce-input-wrapper input[type="number"],
body.woocommerce .woocommerce-input-wrapper input[type="password"],
body.woocommerce .woocommerce-input-wrapper textarea {
    border: 1px solid #dd9933 !important;
}
/* Modifică bordura select2 */
body.woocommerce .select2-selection {
    border: 1px solid #dd9933 !important;
    border-radius: 4px; /* Optional pentru a rotunji colțurile */
}

/* Modifică bordura când selectul este activ (focus) */
body.woocommerce .select2-selection:focus {
    border: 1px solid #dd9933 !important;
    outline: none; /* Elimină bordura implicită focus */
}

/*==============livrare estimata finalizare comanda doar mobil=========*/
@media (max-width: 768px) {
    /* Flex pe containerul <dl> */
    dl.variation {
        display: flex;
        align-items: center;
        flex-wrap: nowrap; /* sau nowrap dacă vrei forțat pe o singură linie */
        gap: 10px;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Stil pentru <dt> */
    dl.variation dt.variation-Livrareestimat {
        font-family: Arial, sans-serif !important;
        color: #28a745 !important;
        font-weight: bold !important;
        margin: 0 !important;
        white-space: nowrap;
        display: flex;
        align-items: center;
    }

    /* Stil pentru <dd> */
    dl.variation dd.variation-Livrareestimat {
        margin: 0 !important;
        padding: 0 !important;
        font-family: Arial, sans-serif !important;
        color: #28a745 !important;
        font-weight: bold !important;
        display: flex;
        align-items: center;
        white-space: nowrap;
    }

    /* Elimină marginile din <p> din <dd> */
    dl.variation dd.variation-Livrareestimat p {
        margin: 0 !important;
    }
}
/*==============livrare estimata finalizare comanda doar desktop=========*/
@media (min-width: 1024px) {
  /* Flex pe containerul <dl> */
  dl.variation {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Stil pt <dt> */
  dl.variation dt.variation-Livrareestimat {
    display: inline-flex;
    align-items: center;
    font-family: Arial, sans-serif !important;
    color: #28a745 !important;
    font-weight: bold !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap;
    line-height: 1 !important;
  }

  /* Stil pt <dd> */
  dl.variation dd.variation-Livrareestimat {
    display: inline-flex;
    align-items: center;
    font-family: Arial, sans-serif !important;
    color: #28a745 !important;
    font-weight: bold !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap;
    line-height: 1 !important;
  }

  /* Eliminăm complet spațiile din <p> */
  dl.variation dd.variation-Livrareestimat p {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
  }
}
/* ============== Livrare estimată pe mobil ============= */
@media (max-width: 1023px) {
  dl.variation {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 4px !important;
    margin: 0 0 0 -10% !important; /* trage blocul la stânga */
    padding: 0 !important;
  }

  dl.variation dt.variation-Livrareestimat,
  dl.variation dd.variation-Livrareestimat {
    display: inline !important;
    font-family: Arial, sans-serif !important;
    color: #28a745 !important;
    font-weight: bold !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    text-align: left !important;
    font-size: 12px !important; /* ajustează aici după preferință */
  }

  dl.variation dd.variation-Livrareestimat p {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    text-align: left !important;
    font-size: 12px !important; /* ajustează mărimea textului */
  }
}


/*========Creare cont autentificare casete portocalii====*/
#username.woocommerce-Input,
#password.woocommerce-Input,
#reg_username.woocommerce-Input,
#reg_email.woocommerce-Input,
#reg_password.woocommerce-Input {
    border: 1px solid #dd9933;
}
/*==============Spatiere creare cont autentificare=====*/
/* Reducerea spațiului de sus și de jos pentru coloane */
.u-column1,
.u-column2 {
    margin-top: -10px;  /* Ajustează valoarea pentru a reduce sau crește spațiul de sus */
    margin-bottom: -10px;  /* Ajustează valoarea pentru a reduce sau crește spațiul de jos */
}
/* Media query pentru mobil - ajustare margini pentru etichete */
@media (max-width: 768px) {  /* Aceasta vizează dispozitivele cu lățimea maximă de 768px (mobil) */
    
    label[for="username"],
    label[for="password"],
    label[for="reg_username"],
    label[for="reg_email"],
    label[for="reg_password"] {
        margin-top: -10px;  /* Ajustează valoarea pentru marginea de sus */
        margin-bottom: -4px;  /* Ajustează valoarea pentru marginea de jos */
    }
        .woocommerce-LostPassword.lost_password {
        margin-top: 0px;  /* Ajustează marginea de sus */
        margin-bottom: -40px;  /* Ajustează marginea de jos */
    }
    .woocommerce-button {
        margin-top: 0px !important;  /* Ajustează spațiul de sus al butonului */
        margin-bottom: 0px !important;  /* Ajustează spațiul de jos al butonului */
    }
    .woocommerce-form__input {
        padding-top: 0 !important;  /* Elimină padding-ul de sus din câmpurile de input */
        padding-bottom: 0 !important;  /* Elimină padding-ul de jos din câmpurile de input */
    }
        .woocommerce-form-login__rememberme {
        margin-top: 0px !important;  /* Muta eticheta și checkbox-ul mai sus */
        margin-bottom: 0px !important;  /* Poți ajusta și spațiul de jos dacă este necesar */
    }

    .woocommerce-form__label-for-checkbox {
        margin-top: 0px !important;  /* Muta eticheta mai sus */
    }

    .woocommerce-form__input-checkbox {
        margin-top: 0px !important;  /* Muta checkbox-ul mai sus */
    }
}
/*=====pentru finalizare reducere spatiu dintre produse pe mobil===*/
/* Reducerea spațiului vertical între produsele din checkout pe mobil */
@media only screen and (max-width: 767px) {
    /* Reducem marginile între produsele din cart */
    .cart_item {
        margin-bottom: -10px !important; /* Ajustează această valoare în funcție de necesități */
    }

    /* Reducem padding-ul din celulele tabelului de produse */
    .cart_item td {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

    /* Reducerea spațiului dintre imagini și textul produsului */
    .cart_item .product-name {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }
}
/*==========Ascunde mesajul administreaza consimtamant====*/
#cmplz-header-1-optin {
  display: none !important;
}
/*====Tabel puncte expirare PE MOBIL MAI JOS =====*/
/* Aplica doar pe mobil */
@media (max-width: 768px) {
    .wlr-expire-point-blog {
        margin-top: 65px !important;  /* Ajustează valoarea negativă pentru a muta mai jos elementul pe mobil */
    }
}
/*====Tabel puncte expirare TOATE DISPOZITIVELE SCRIS SI COLOANE =====*/
/*TABELUL DE EXPIRARE PUNCTE*/
/* Centrarea textului în antetul tabelului */
.wlr-expire-point-table th {
    text-align: center;
}

/* Centrarea textului în celulele tabelului */
.wlr-expire-point-table td {
    text-align: center;
}
/* Stil pentru tabel pe mobil */
@media (max-width: 768px) {
    .wlr-expire-point-table {
        width: 113% !important; /* Lățimea tabelului pe mobil va fi 110% */
        margin-left: -7%; /* Ajustăm marginile pentru a compensa lățimea mai mare */
    }
}
/* ===============================
   🧱 TABEL Puncte care urmează să expire – stil general pe mobil
=============================== */
.wlr-expire-point-table {
    border-collapse: separate !important; /* 🧩 Celulele nu sunt lipite între ele */
    border-spacing: 0 !important;       /* 📏 Fără spații între celule */
    font-family: 'Segoe UI', sans-serif !important; /* ✍️ Font modern, clar */
    background-color: #fff !important;  /* 🧼 Fundal alb */
    border-radius: 12px !important;     /* 🟩 Colțuri rotunjite */
    overflow: hidden !important;        /* 🔒 Taie tot ce iese din colțuri */
    box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important; /* ☁️ Umbră discretă */
    table-layout: fixed !important;     /* 🔒 Fiecare coloană are o lățime fixă */
    word-wrap: break-word !important;   /* 🪓 Textul lung se rupe pe linii */
}

/* ===============================
   🧠 HEADERS – capul de tabel pe mobil
=============================== */
table.wlr-expire-point-table thead.wlr-table-header th {
    background-color: red !important;  /* 🔴 Fundal roșu pentru header */
    color: #ffffff !important;             /* ✍️ Text alb */
    font-weight: 600 !important;           /* 💪 Bold */
    font-size: 14px !important;             /* ✅ Font mic (dar vizibil) pe mobil */
    padding: 10px 2px !important;           /* 📦 Spațiu mic între margini */
    text-align: center !important;           /* ↔️ Aliniere pe stânga */
    vertical-align: middle !important;     /* ↕️ Centrat vertical */
    border-bottom: 2px solid #0056b3 !important; /* 🔽 Linie groasă sub header */
}

/* ===============================
   📥 CELULE BODY – conținutul tabelului
=============================== */
.wlr-expire-point-table td {
    font-size: 14px !important;             /* 🔠 Font mic și lizibil */
    color: #212529 !important;             /* ⚫ Gri închis – text clar */
    padding: 6px 2px !important;           /* 📦 Spațiu decent în celulă */
    border-bottom: 1px solid #dee2e6 !important; /* 📏 Linie de separare între rânduri */
    text-align: center !important;         /* ⬅️ Aliniere text pe centru */
    vertical-align: middle !important;     /* ↕️ Centrare verticală */
}

/* ===============================
   🌈 ALTERNARE PE RÂNDURI – pentru lizibilitate
=============================== */
.wlr-expire-point-table tbody tr:nth-child(even) {
    background-color: #f8f9fa !important;  /* ⚪ Gri deschis pe rândurile pare */
}

.wlr-expire-point-table tbody tr:nth-child(odd) {
    background-color: #ffffff !important;  /* ⚪ Alb pe rândurile impare */
}

/* ===============================
   👆 HOVER PE RÂNDURI
=============================== */
.wlr-expire-point-table tbody tr:hover {
    background-color: #e2f0ff !important; /* 🔵 Albastru foarte deschis la hover */
    transition: background-color 0.2s ease-in-out !important; /* 🎞️ Tranziție lină */
}

/* ===============================
   🌐 RESPONSIVITATE PE MOBIL – ajustarea fontului și paddingului
=============================== */
@media (max-width: 768px) {
    .wlr-expire-point-table td {
        font-size: 12px !important; /* 🔠 Font mic pe mobil */
        padding: 4px 2px !important; /* 📦 Micșorare padding pe mobil */
    }

    table.wlr-expire-point-table thead.wlr-table-header th {
        font-size: 12px !important;  /* 🔠 Font mai mic în header pe mobil */
        padding: 4px 2px !important; /* 📦 Micșorare padding pe mobil */
    }
}