@font-face {
    font-family: 'citrfontbold';
    src: url('/font/poppins-regular-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'citrfontreg';
    src: url('/font/OpenSans-Regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/* -- global  -- */
.container {background: #f6f6f6;}
.containerWhite {background: #fff;}
.innerWidth {max-width: 1440px;margin: auto;}


html, body {background: #f6f6f6;font-family: 'citrfontreg'; color: #444}
.NodeLevel0 > a.active:before, .NodeLevel0 > a.active:after, .noUi-connect, .noUi-tooltip, .basketPip, a.flex-active, .noUi-tooltip, .noUi-connect, .facetSelectedff.checked, .wsPrice, a.flex-active, .social a {background: #cadb36;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .current, .bannerTitle, .NodeLevel0>a>span, .NodeLevel0>a, .mainFont, .ctaTitle, .boldfont {}
h1, h2, .h1, .h2 {letter-spacing:-1px; color: #222}
.NodeLevel0>a {font-family: 'citrfontbold';letter-spacing: inherit;}
.NodeLevel0 > a:before, .NodeLevel0 > a:after { height: 1px}
.fixed, .NodeLevel0>.CSSFacetNavModules, .fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: 100%;}
.ctaIcon {color: #cadb36;}
.fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: max-width: 100%;}
@media screen and (max-width : 320px){.fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: 100%;}}
@media screen and (min-width : 321px) and (max-width : 414px){.fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: 100%;}}
@media screen and (min-width : 415px) and (max-width : 767px){.fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: 100%;}}
@media screen and (min-width : 768px) and (max-width : 1024px){.fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: 100%;}}
@media screen and (min-width : 1025px) and (max-width : 1440px){.fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: 100%;}}
@media screen and (min-width : 1441px) and (max-width : 1920px){.fixed, .NodeLevel0>.CSSFacetNavModules  {max-width: 100%;}}
@media screen and (min-width : 1920.1px){}




/* -- header basket  -- */
.logo {max-width: 120px;}
.navIcons {border-bottom: none; padding:0 16px}
.masthead, .masthead .container, .ctrNavigation > .CSSFacetNavModules {background: #212121;color: #fff;}
.masthead input {background: #fafafa;}
.logoContainer {padding:0}
.navIcons [class*="icon-"] {text-align: right;color: #ffffff;}
.navIcons [class*="icon-"]:active {color: #cadb36;}
.loginCtr a { color:#b4d0fe}
@media screen and (max-width: 1023px) {
	.logoContainer {padding-left: 16px;width: 150px;}
	.navIcons *[class*="icon-"] {text-align: center;}
	.navIcons {padding:0}
}
.NodeLevel0[data-nodename*='Sale'] > a  {color: #EC0028;}
.NodeLevel0[data-nodename*='Sale'] > a.active  {color: #EC0028 !important;} 
@media screen and (min-width : 1441px) and (max-width : 1920px){.navIcons {padding: 0 32px;}}
@media screen and (min-width : 1920.1px){.navIcons {padding: 0 32px;}}
@media screen and (max-width: 1023px) and (min-width: 768px){
    .logo {min-height: 40px;top: 2px;}
    body {padding-top: 48px}
}
@media screen and (max-width: 1024px){
	.NodeLevel0 > a {background: #fafafa;border-bottom: none;/* border-top: 1px solid #e9e9e9; */}
}
.basketPip {background: #cadb36;right: 10px;}
@media screen and (max-width:1024px)
{
	.basketPip {right: 50%;}
}



/* Invert Cover*/
.masthead .container, .masthead .NodeLevel0>.CSSFacetNavModules, .ctrNavigation, .NodeLevel0 > a {background: #212121;color: white;text-transform: uppercase;/* font-size: 12px; */}
@media screen and (max-width: 767px) {.NodeLevel0>a {color: #FFF;border-bottom: 1px solid #363636;}}
@media screen and (min-width : 768px) and (max-width : 1023.99px) {.NodeLevel0>a {color: #FFF;}}
.social a {background-color: #212121 !important;}
.navIcons { border-bottom:none}
.fafbackground { background: #fff}
.srchCtr.tbcnt .searchBoxForm, .srchCtr.tbcnt .searchBoxForm:focus {color: #b5e5ff;background: #212121;}
.NodeLevel0>a.active:before, .NodeLevel0>a.active:after, .basketPip {background: #cadb36}
#basket, .basketPip { color: #000}


/* -- header Dropdown nav  -- */
.NodeLevel1>a {font-size: 16px;letter-spacing: 0;opacity: 1;width: 100%;display: block;margin-bottom: 16px;font-family: 'citrfontbold';text-transform: initial;border-bottom: 1px solid #ababab26;}
.NodeLevel2 > a {position:relative;overflow: hidden;display: block;float: left;margin: 0 0 1em 0;line-height: 150% !important;opacity: 0.6;}
.NodeLevel2 > a:before {background: #cadb36;}
.NodeLevel0[data-nodename*='Sale'] .NodeLevel2 > a:before {background: #EC0028;}

.NodeLevel2 > a:hover {opacity:1;}
.NodeLevel0 > .CSSFacetNavModules.active {position: fixed;}
.NodeLevel0 > a {border-bottom: 1px solid #2e2e2e;}
.NodeLevel0 > a.active {color: #fff !important;border-bottom: 1px solid #cadb36}
.ctaGridHeader .container * {background: #2e2e2e;color: #fff;margin: 0;}
.ctaHeader p { padding:0; margin:0; display:inline-block}
.ctaHeader a:before{display:inline-block;font-family:feather;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;speak:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscalel;font-size:smaller;margin-right: 8px;color: #bcb2b2;position: relative;bottom: 2px;}
.ctaHeader a:nth-child(1):before{ content:"\e085";}
.ctaHeader a:nth-child(2):before{ content:"\e058";} 
.ctaHeader a:nth-child(3):before{ content:"\e093";}


.ctaHeader { text-align:center}
.ctaHeader a {display:inline-block;margin: 12px !important;}
@media screen and (max-width: 1023px) {
	.NodeLevel0 > .CSSFacetNavModules.active {position: relative;}
}
@media screen and (min-width : 1441px) and (max-width : 1920px){
	.NodeLevel0>a {font-size: 14px;}
	.NodeLevel1>a, .NodeLevel2>a {font-size: 14px;;}
}
@media screen and (min-width : 1920px){
	.NodeLevel0>a {font-size: 14px;}
	.NodeLevel1>a, .NodeLevel2>a {font-size: 14px;;}
}


/* -- forms buttons  -- */
button, .button, .dark .button, .dark button, .col-1 .dropdownA2B .a2bButtonGo {
    background-color: #cadb36;
    background: #cadb36;
    background: -moz-linear-gradient(top, #4b91e0 0%, #4b91e0 65%, #4488d5 100%);
    background: -webkit-linear-gradient(top, #cadb36 0%,#cadb36 65%,#adbe20 100%);
    background: linear-gradient(to bottom, #cadb36 0%,#cadb36 65%,#adbe20 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 );
    box-shadow: 0 3px 0 0 rgba(22, 29, 37, 0.1);
    color: #fff;
    }
button:hover, .button:hover, .a2bButtonGo:hover {
    background-color: #cadb36;
    background: #cadb36;
    background: -moz-linear-gradient(top, #4b91e0 0%, #4b91e0 65%, #4488d5 100%);
    background: -webkit-linear-gradient(top, #cadb36 0%,#cadb36 65%,#adbe20 100%);
    background: linear-gradient(to top, #cadb36 0%,#cadb36 65%,#adbe20 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 );
    box-shadow: 0 3px 0 0 rgba(22, 29, 37, 0.1);
    color: #fff;
    }
button.ghost-button, a.ghost-button {background: transparent;border: 1px solid #d6d3d3;color: #333;}
button.ghost-button:hover, a.ghost-button:hover {color: white;background: #999;border: 1px solid #999;}
.NodeLevel0>a.active, .NodeLevel0 > a.active > span:after, .footer a:hover, .footer a:hover p, a, .checkList li:before {color: initial;}.NodeLevel0 > a.active:before, .NodeLevel0 > a.active:after, .noUi-connect, .noUi-tooltip, .basketPip, a.flex-active, .noUi-tooltip, .noUi-connect, .facetSelectedff.checked, .wsPrice, a.flex-active, .social a {}
.open-slide-menu .NodeLevel0>a:not(.active) {opacity: 0.3;}
.open-slide-menu .NodeLevel0>a:hover {}
@media screen and (max-width: 1023px) {
	.open-slide-menu .NodeLevel0>a:not(.active) {opacity: 1}
}

/* -- accordian  -- */
.accordianHeader > span.fa-unsorted:before, .accordianHeader > span.fa-unsorted:after {height: 3px;border-radius: 3px;}
.active .accordianHeader > span.fa-unsorted:before, .active .accordianHeader > span.fa-unsorted:after {background: #3e5b3e;}



/* -- Footer  -- */
.footer, .footer .container { background:#212121 !important; color:#fff}
.footer a:hover, .footer a:hover p  { color:#5e94ed}
.cards {background: #1e1e1e;color: #939393;opacity: 1;}
.footer .mainFont { font-size:larger; }
.social a{background-color: #00000000 !important;}
.social a:hover{filter: invert(0);}
input:active, input:focus, textarea:active, textarea:focus, select:active, select:focus {border: 1px solid #585858;}
.disabled, :disabled, .a2bButtonInactive {opacity: 0.3;cursor: not-allowed !important;background: #bcbcbc !important;color: #fff !important;}
.footer img {max-width: 100%;height: 100%;}
.gutter64 {margin: 0 -32px;}
.gutter64 >li, .gutter64 >a, .gutter64 >div, .gutter64 >span, .gutter64 > img {padding: 0 32px;}

@media screen and (max-width: 767px)
{
	.footer .mainFont:after {margin: 16px auto}
	.footerBrands a { width:50%}
}
.fafbackground {background: #ffffff;}


/* -- Logo Overides  -- */
.logo {max-width: 225px;min-width: 225px;}
@media screen and (max-width: 767px){.logo {max-width: 155px;min-width: 55px;}}
@media screen and (min-width : 768px) and (max-width : 1024px){.logo {max-width: 225px;min-width: 140px;}}
@media screen and (min-width : 1025px) and (max-width : 1440px){.logo {max-width: 175px;min-width: 175px;}}
@media screen and (max-width: 1913px) and (min-width: 1440px){.logoContainer {width: 230px;}}


/* -- Hide Add to basket button  -- */
.a2bButtonGo { display:none  !important}


/* hide price and stock and change position of FAF   */
.productPrices, .pricingRepeater, .facetPricing, .fafqvdd-details-price, .a2bStockArea, .a2bStockCheck { display:none !important}
[class*="stockStatus"] {order: -1;}
 .facetItemDetails a {font-family: 'citrfontbold';}