.header-main{
margin-top:0 !important;
display:flex;
justify-content:center;
}
.header-main .top-bar{
display:none;
}
:root{
--mtc-header-main-h:min(5.625vw, 90px);
--mtc-header-main-maxw:1560px;
--mtc-header-main-pl:20px;
--mtc-header-main-pr:20px;
}
.mtc-header-main{
display:flex;
justify-content:center;
align-items:center;
min-height:var(--mtc-header-main-h);
padding:0 var(--mtc-header-main-pr) 0 var(--mtc-header-main-pl);
--pl-nav:0;
--pr-actions:0;
--pr-logo-mt:0;
--pl-logo-mt:0;
--ptb-all:0;
--g-gx:30px;
--g-gy:0;
--logo-w:min(21.5vw, 343px);
--logo-mt-w:min(12.8vw, 204px);
--bb-ptb:2px;
--bb-plr:8px;
}
.mtc-header-main-container{
width:100%;
max-width:var(--mtc-header-main-maxw);
}
.mtc-header-main-grid{
display:grid;
grid-template-columns:auto 1fr auto auto;
grid-template-areas:"logo search actions logo-mt";
align-items:center;
gap:var(--g-gy) var(--g-gx);
}
.mtc-header-nav{
grid-area:nav;
justify-self:start;
display:none;
padding:var(--ptb-all) 0 var(--ptb-all) var(--pl-nav);
}
.nav-main-toggle-btn{
padding:var(--bb-ptb) var(--bb-plr);
}
.mtc-header-logo{
grid-area:logo;
justify-self:start;
padding:var(--ptb-all) 0 var(--ptb-all) 0;
}
.header-logo-main-img{
width:var(--logo-w);
max-width:343px;
aspect-ratio:343 / 59;
}
.mtc-header-search{
grid-area:search;
}
.mtc-header-actions{
grid-area:actions;
padding:var(--ptb-all) var(--pr-actions) var(--ptb-all) 0;
}
.mtc-header-actions .header-cart-name:after{
content:':';
display:inline-block;
margin-left:-0.2em;
}
.mtc-header-actions .header-cart-total{
color:black;
}
.mtc-header-logo-mt{
grid-area:logo-mt;
padding:var(--ptb-all) var(--pr-logo-mt) var(--ptb-all) var(--pl-logo-mt);
}
.mtc-header-logo-mt-img{
width:var(--logo-mt-w);
}
.main-navigation-menu .dropdown-menu .navigation-flyout-content .col,
.main-navigation-menu .col-3{
display:contents;
}
.nav-main{
background-color:hsl(76 60% 50%);
--ff-0:inter, sans-serif;
--fst-0:normal;
--fs-0:18px;
--fw-0:500;
--ff-n:inherit;
--fst-n:normal;
--fs-n:18px;
--fw-n:normal;
--pt:15px;
--plr:0px;
--g-gap-x:1em;
--g-gap-y:0.5em;
--g-cc:5;
--a-pr-0:16px;
--a-pl-0:20px;
--a-ptb:0.35em;
--a-pr:0.5em;
--a-pl:0.5em;
--a-color:black;
--a-color-hover:black;
--a-color-act:white;
--a-fill-hover:hsl(76 60% 80%);
--a-fill-act:var(--mtc-logo-green-dark);
--ic-fw:800;
--ic-color:var(--mtc-logo-green-light);
--b-w:1em;
--b-h:1em;
--b-mt:4px;
--b-color:var(--mtc-logo-green-light);
--b-fill:transparent;
--b-border:2px solid var(--b-color);
}
.main-navigation-menu .dropdown .nav-link.root{
color:black;
padding:0 var(--a-pr-0) 0 var(--a-pl-0) !important;
}
.main-navigation-menu .dropdown .nav-link.root.no-dropdown{
padding:0 var(--a-pl-0) 0 var(--a-pl-0) !important;
}
.main-navigation-menu-list{
justify-content:space-between !important;
}
.main-navigation-menu .nav-link.root{
font-family:var(--ff-0) !important;
font-weight:var(--fw-0);
font-size:var(--fs-0) !important;
font-stretch:var(--fst-0);
}
.main-navigation-link.home-link{
padding:0 12px 0 12px !important;
}
.main-navigation-menu .nav-link.root:hover,
.main-navigation-menu .nav-link.root.show
{
color:black !important;
background-color:white !important;
}
.main-navigation-menu .nav-link.root.active{
color:white;
background-color:var(--mtc-logo-green-dark);
font-weight:bold !important;
}
.main-navigation-menu .navigation-flyout-category-link a{
color:var(--mtc-logo-green-dark);
}
.main-navigation-menu .navigation-flyout-category-link a:before{
content:"\2039";
font-family:system-ui, -apple-system, sans-serif; 
font-variant-emoji:text; 
font-size:1.5em;
}
.main-navigation-menu .dropdown-menu{
box-shadow:4px 8px 20px hsl(0 0% 0% / 0.2);
--bc:hsl(0 0% 80%);
border-right-color:var(--bc);
border-bottom-color:var(--bc);
}
.main-navigation-menu .navigation-flyout-content{
margin:0;
padding:var(--pt) var(--plr) 0 var(--plr);
width:100%;
display:flex;
}
.main-navigation-menu .navigation-flyout-content .col > div{
flex:1;
}
.main-navigation-menu .navigation-flyout-categories{
position:relative;
margin:0;
display:grid;
gap:var(--g-gap-y) var(--g-gap-x);
grid-template-columns: repeat(auto-fit, minmax(32ch, 1fr));
}
.main-navigation-menu .navigation-flyout-col:before{
display:none !important;
}
.main-navigation-menu .navigation-flyout-categories .nav-link{
margin:0 !important;
padding:var(--a-ptb) var(--a-pr) var(--a-ptb) var(--a-pl) !important;
display:flex;
align-items:start;
gap:0.8em;
font-family:var(--ff-n);
font-stretch:var(--fst-n);
font-size:var(--fs-n);
font-weight:var(--fw-n);
border:1px solid hsl(0 0% 85%);
background:hsl(0 0% 95%);
border-radius:8px;
color:var(--a-color);
}
.main-navigation-menu .navigation-flyout-categories .nav-link:before{
content:var(--fa-ic-circle-chevron-right);
display:inline-block;
font-family:var(--fa-ff);
font-weight:var(--ic-fw);
color:var(--ic-color);
transform:scale(1.4) translateX(0.1em);
}
.main-navigation-menu .navigation-flyout-categories .nav-link:hover{
--ic-color:var(--mtc-logo-green-dark);
color:var(--a-color-hover);
background-color:var(--a-fill-hover);
}
.main-navigation-menu .navigation-flyout-categories .nav-link.active{
--b-fill:var(--b-color);
color:var(--a-color-act);
font-weight:600;
background-color:var(--a-fill-act);
border-color:var(--a-fill-act);
--ic-color:var(--mtc-logo-green-light);
}
:root{
--subcat-nav-ff:inherit;
--subcat-nav-fst:normal;
--subcat-nav-cc:4;
}
.cms-block-twt-listing-subcategories > .cms-block-container{
padding:1rem 0 1rem 0 !important;
}
.cms-block-twt-listing-subcategories > .cms-block-container > .cms-block-container-row{
margin:0;
}
.twt-listing-subcategories{
--gap-x:0.5rem;
--gap-y:0.5rem;
--ic-color:var(--mtc-logo-green-light);
--cc:var(--subcat-nav-cc);
--subcat-item-w:calc((100% - (var(--cc) - 1) * var(--gap-x)) / var(--cc));
}
.twt-listing-subcategories ul.row{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:var(--gap-y) var(--gap-x);
margin:0;
padding:0;
}
.twt-listing-subcategories li{
margin:0;
padding:0;
flex:0 0 var(--subcat-item-w);
max-width:var(--subcat-item-w);
min-width:0;
display:block;
}
.twt-listing-subcategories .btn{
text-align:left;
overflow:hidden !important;
text-overflow:ellipsis;
font-family:var(--subcat-nav-ff);
font-stretch:var(--subcat-nav-fst);
--bs-btn-bg:hsl(0 0% 95%);
--bs-btn-hover-bg:hsl(76 60% 80%);
--bs-btn-color:black;
--bs-btn-border-color:hsl(0 0% 85%);
--bs-btn-hover-border-color:hsl(0 0% 80%);
background:linear-gradient(180deg, hsl(0 0% 95%), hsl(0 0% 90%) );
}
.twt-listing-subcategories .btn:before{
content:var(--fa-ic-circle-chevron-right);
font-family:var(--fa-ff);
display:inline-block;
color:var(--ic-color);
transform:scale(1.5);
margin-right:0.5em;
}
.twt-listing-subcategories .btn:hover{
--bs-btn-hover-color:black;
--ic-color:var(--mtc-logo-green-dark);
background:linear-gradient(180deg, hsl(76 60% 90%), hsl(76 60% 80%) );
}
.cms-breadcrumb{
--fs:16px;
--ff:inherit;
--plr:var(--mtc-gutter-x);
padding-left:var(--plr);
padding-right:var(--plr);
--nav-ptb:10px;
--nav-plr:10px;
}
.cms-breadcrumb nav{
padding:var(--nav-ptb) var(--nav-plr) !important;
}
.cms-breadcrumb .breadcrumb-link{
font-size:var(--fs);
font-family:var(--ff);
}
.cms-breadcrumb .breadcrumb-link.is-active{
color:var(--mtc-logo-green-dark);
font-weight:800;
}
@media(max-width:1600px){
:root{
--mtc-gutter-x:10px;
--subcat-nav-ff:roc;
}
.mtc-header-main{
}
.header-wishlist-name{
display:none !important;
}
.header-account-name{
display:none !important;
}
.header-cart-name{
display:none !important;
}
.nav-main{
--a-pr-0:10px;
--a-pl-0:15px;
--ff-0:roc, sans-serif;
--fst-0:condensed;
--fw-0:400;
--ff-n:roc, sans-serif;
--fst-n:condensed;
--fw-n:400;
}
.main-navigation-menu-list{
justify-content:space-between !important;
}
.cms-breadcrumb{
--ff:roc, sans-serif;
}
}
@media(max-width:1350px){
:root{
--mtc-header-main-pl:10px;
--mtc-header-main-pr:10px;
}
.mtc-header-main{
--g-gx:20px;
}
.nav-main{
--a-pr-0:5px;
--a-pl-0:10px;
--fs-0:max(1.3333333vw, 15px);
--fs-n:16px;
}
}
@media(max-width:1200px){
:root{
--subcat-nav-cc:3;
}
}
@media(max-width:1180px){
.nav-main .main-navigation-menu-list > li:first-child{
display:none !important;
}
}
@media(max-width:991px){
.nav-main{
display:none;
}
.mtc-header-main{
padding:0;
--ptb-all:4px;
--pr-logo-mt:10px;
--g-gx:20px;
}
.mtc-header-main-grid{
grid-template-columns:auto 1fr auto auto;
grid-template-areas:
"nav logo actions logo-mt"
"search search search search";
}
.mtc-header-nav{
display:block;
}
.mtc-header-search{
padding:10px;
background-color:var(--mtc-logo-green-light);
}
.header-search{
margin:0;
}
.header-search-input{
border-style:hidden !important;
}
.header-search-btn{
background:var(--mtc-logo-green-dark) !important;
margin:0 !important;
border-style:hidden !important;
}
.mtc-header-search .header-close-icon .icon{
color:white;
}
.cms-breadcrumb{
--plr:10px;
--nav-plr:0;
--nav-ptb:5px;
}
}
@media(max-width:768px){
:root{
--subcat-nav-cc:2;
}
}
@media(max-width:767px){
.mtc-header-main{
--logo-mt-w:min(28vw, 110px);
--logo-w:max(172px, 10vw);
}
.header-cart-total{
display:none;
}
.header-cart-badge{
display:block;
}
.mtc-header-logo{
padding-bottom:1px;
}
.header-logo-main-img{
max-width:172px;
aspect-ratio:172 / 33;
}
}
@media(max-width:575px){
.mtc-header-main{
--g-gx:6px;
--logo-w:max(28vw, 80px);
--pr-logo-mt:6px;
--pl-logo-mt:12px;
}
.mtc-header-actions{
gap:3px !important;
padding-right:4px;
}
.mtc-header-main .header-actions-btn{
padding:2px 8px 2px 8px;
}
}
@media(max-width:480px){
.mtc-header-main{
--logo-w:max(28vw, 80px);
--logo-w:160px;
}
.mtc-header-logo{
padding-left:4px;
padding-right:4px;
}
.mtc-header-logo-mt{
display:none;
}
.mtc-header-main .header-actions-btn .icon{
width:1.75rem;
height:1.75rem;
}
}
@media(max-width:430px){
.mtc-header-main{
--pl-logo-mt:8px;
--g-gx:4px;
}
}
@media(max-width:360px){
.mtc-header-main{
--logo-w:100%;
}
.mtc-header-logo{
width:100%;
}
.header-logo-main-link{
display:block;
}
}