@charset "utf-8";
html{font-family:sans-serif;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
body,div,dl,dt,dd,p,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,blockquote,form{margin:0;padding:0;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;margin:0;padding:0;}
ul,ol{list-style:none;}
img,a img{border:none;display:block;}
a:link,a:visited{background:transparent;text-decoration:none;}
a:active,a:hover {outline:0;}
a[x-apple-data-detectors]{color:inherit !important; text-decoration: none !important; font-size: inherit !important; font-family: inherit !important; font-weight: inherit !important; line-height: inherit !important; }
table{border-collapse:collapse;border-spacing:0;}
label,button{cursor:pointer;}
input,textarea,select{font-family:inherit;font-size:inherit;padding:0;margin:0;vertical-align:middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
input, textarea, button, select, label, a { -webkit-tap-highlight-color: rgba(0,0,0,0); tap-highlight-color: transparent; }
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
input[type=number]{-webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0;}
button, input[type=submit], input[type=password] { -webkit-appearance: none;-moz-appearance: none; appearance: none; border-radius: 0; }
textarea, input[type=text], input[type=email], input[type=tel], input[type=url], input[type=search] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; }
input:focus, input:hover { outline-style: none; box-shadow: none; }
button:focus, button:hover { outline-style: none; box-shadow: none; }

strong { font-family: neue-haas-grotesk-text, sans-serif; font-weight: 500; }

::-moz-selection { background-color: #8FB5BC; color: #FFF; }
::selection { background-color: #8FB5BC; color: #FFF; }

* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
.fadein { opacity:0;-webkit-animation:fadeIn ease-in 1;-moz-animation:fadeIn ease-in 1;animation:fadeIn ease-in 1;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-duration:0.5s;-moz-animation-duration:0.5s;animation-duration:0.5s; }
.hidden { opacity: 0; }
.inview { opacity: 1; -webkit-transition: opacity 800ms; -o-transition: opacity 800ms; transition: opacity 800ms; }

html 			{ }
body 			{ background-color: #FFF; color: #111; font-family: neue-haas-grotesk-text, sans-serif; font-size: 16px; line-height: 1; }
body.noscroll 	{ overflow: hidden; }
.page-layout	{ padding-top: 82px; }
.page-content	{  }
.padding 		{ padding: 0 50px; }
.outer 			{ align-items: flex-start; justify-content: space-between; padding: 0 50px; }
.inner 			{ align-items: flex-start; justify-content: space-between; margin: 0 auto; max-width: 1080px; padding: 0 50px; }
.clear:after	{ clear: both; content: ""; display: table; }
.two-thirds		{ width: 66.66%; width: calc(); }
.half 			{ width: 50%; }
.third 			{ width: 33.33%; width: 66.66%; }
.quarter		{ width: 25%; }

/* CONTENT
-------------------------------------------------------------------------------------------------*/
h1 { color: #111; font-size: 40px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 400; line-height: 1.2; margin: 0 0 20px; }
h2 { color: #111; font-size: 30px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 400; line-height: 1.2; margin: 30px 0 10px; }
h3 { color: #111; font-size: 24px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 500; letter-spacing: 0.05em; line-height: 1.2; margin: 30px 0 10px; text-transform: uppercase; }
h4 { color: #111; font-size: 20px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 400; line-height: 1.4; margin: 30px 0 10px; }
h5 { color: #111; font-size: 14px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 500; letter-spacing: 0.1em; line-height: 1.2; margin: 30px 0 10px; text-transform: uppercase; }
h6 { color: #111; font-size: 12px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 400; letter-spacing: 0.15em; line-height: 1; margin: 0 0 10px; text-transform: uppercase; }

.page-heading { margin-top: 80px; margin-bottom: 60px; text-align: center; }
.page-heading-large { margin-top: 200px; margin-bottom: 200px; }
.page-heading h3 { margin-bottom: 20px; }
.page-heading h4 { margin: 0 auto 20px; max-width: 800px; }
.page-heading h4 a { color: #111; text-decoration: underline; }
.page-heading h4 a:hover { opacity: 0.7; transition: all .1s ease-out; }
.page-heading form { margin-top: 20px; }

.page-banner { background-color: #F5F4F0; background-repeat: no-repeat; background-position: center; background-size: cover; margin: 0; }
.page-banner .overlay { background: rgba(0,0,0,0.15); background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.25) 100%); display: flex; align-items: center; justify-content: center; height: 420px; }
.page-banner .overlay div {  }
.page-banner * { color: #FFF; }

.page-content p a,
.page-content ul a,
.page-content ol a { color: #111; text-decoration: underline; }
.page-content p a:hover,
.page-content ul a:hover,
.page-content ol a:hover { opacity: 0.7; transition: all .1s ease-out; }

.page-content p.button a { border: 2px solid #111; box-sizing: border-box; color: #111; display: inline-block; font-size: 13px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 500; letter-spacing: 0.1em; line-height: 20px; margin: 0 15px 15px 0; padding: 10px 20px; text-transform: uppercase; text-decoration: none; }
.page-content p.button a:hover { background-color: #111; border-color: #111; color: #FFF; text-decoration: none; opacity: 1; }

a.button { border: 2px solid #111; box-sizing: border-box; color: #111; display: inline-block; font-size: 13px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 500; letter-spacing: 0.1em; line-height: 20px; padding: 10px 20px; text-transform: uppercase; }
a.button:hover { background-color: #111; color: #FFF; transition: all .1s ease-out; }

nav.buttons { margin-top: 50px; text-align: center; }
nav.buttons a.button { margin: 0 8px 15px; }
nav.buttons a.active { background-color: #111; color: #FFF; }

a[href^="tel:"] { text-decoration: none !important; }

.page-content p				{ font-size: 16px; line-height: 1.5; margin: 0 0 20px; }
.page-content ul, 
.page-content ol			{ font-size: 16px; line-height: 1.5; margin: 0 0 20px 20px; }
.page-content ul ul,
.page-content ul ol,
.page-content ol ol,
.page-content ol ul 		{ font-size: 100%; margin: 5px 0 5px 20px; }
.page-content ul 			{ list-style-type: disc; }
.page-content ul ul 		{ list-style-type: circle; }
.page-content ul ul ul 		{ list-style-type: square; }
.page-content ol 			{ list-style-type: decimal; }
.page-content ol ol 		{ list-style-type: lower-alpha;	}
.page-content ol ol ol		{ list-style-type: lower-roman; }
.page-content li			{ margin-bottom: 10px; }

.page-content h1:last-child, .page-content h2:last-child, .page-content h3:last-child, .page-content h4:last-child, .page-content h5:last-child, .page-content h6:last-child, .page-content p:last-child, .page-content ol:last-child, .page-content ul:last-child, .page-content figure:last-child,
.page-content h1:only-child, .page-content h2:only-child, .page-content h3:only-child, .page-content h4:only-child, .page-content h5:only-child, .page-content h6:only-child, .page-content p:only-child, .page-content ol:only-child, .page-content ul:only-child, .page-content figure:only-child { margin-bottom: 0; }
.page-content h1:first-child, .page-content h2:first-child, .page-content h3:first-child, .page-content h4:first-child, .page-content h5:first-child, .page-content h6:first-child { margin-top: 0; }

.content-block { margin: 50px 0; }
.content-block figure { margin-bottom: 20px; }
.content-block img { height: auto; width: 100%; }
.content-block img.no-transform { margin: 0 auto; width: auto; max-width: 100%; }
.image-block {  }
.text-block .text { max-width: 1080px; margin: 0 auto; }
.article-content .text-block .text { max-width: 800px; }
.columns-block { display: flex; }
.columns-block .inner { display: flex; }
.columns-block .half { width: 46%; }
.blocks-block.content-block { margin: 0; }
.blocks-block>div { display: flex; }
.blocks-block .layout-textImage figure { order: 2; }
.blocks-block figure { margin: 0; }
.blocks-block .text { display: flex; justify-content: center; }
.blocks-block .text div { margin: 15%; width: 100%; }
.blocks-block .text-white * { color: #FFF; }
.blocks-block .text-white a { color: #FFF; }
.blocks-block .text-white p.button a { border-color: #FFF; color: #FFF; }
.blocks-block .text-white p.button a:hover { background-color: #FFF; border-color: #FFF; color: #111; }

.video-block.content-block { margin: 0; }
.video-block .layout-centre { margin: 50px 0; }

.embed-block .inner { max-width: 1200px; }
.embed-block iframe { width: 100%; }

.banner-block { text-align: center; position: relative; }
.banner-normal { max-width: 1200px; margin: 50px auto; }
.banner-block img { height: auto; width: 100%; }
.banner-block .overlay { background: rgba(0,0,0,0.15); background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.25) 100%);  display: flex; align-items: flex-end; justify-content: center; position: absolute; top: 0; left: 0; z-index: 2; height: 100%; width: 100%; }
.banner-block header { margin-bottom: 50px; }
.banner-block header * { color: #FFF; }
.banner-block header h2 { margin-bottom: 20px; }
.banner-block a.button { color: #FFF; border-color: #FFF; margin: 0 5px 10px; }
.banner-block a.button:hover { color: #111; background-color: #FFF; border-color: #FFF; }

.logos-block.content-block { background-color: #FFF; border-top: 2px solid #F5F4F0; border-left: 2px solid #F5F4F0; display: flex; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 0; }
.logos-block figure { border-right: 2px solid #F5F4F0; border-bottom: 2px solid #F5F4F0; box-sizing: border-box; display: block; width: 16.6666%; margin-bottom: 0; padding: 5%; }
.logos-block figure img { height: auto; max-width: 250px; margin: 0 auto; width: 100%; }

.testimonials-block.content-block { background-color: #F5F4F0; margin: 0; padding: 100px 0; }
.testimonials-block .cycle-slideshow { padding-bottom: 80px; }
.testimonials-block blockquote { font-size: 24px; line-height: 1.5; padding: 0 50px; text-align: center; }
.testimonials-block h5 { text-align: center; margin: 40px 0 10px; }
.testimonials-block h5.sub { color: rgba(0,0,0,0.5); margin: 0; }
.testimonials-pager { height: 20px; padding: 40px 0 0; text-align: center; width: 100%; z-index: 500; position: absolute; bottom: 0; overflow: hidden; z-index: 200; }
.testimonials-pager span { background-color: rgba(17,17,17,0.3); display: inline-block; height: 4px; margin: 0 4px; width: 50px; }
.testimonials-pager span:hover { background-color: #111; }
.testimonials-pager .cycle-pager-active { background-color: #111; }
.testimonials-pager > * { cursor: pointer; }
.testimonials-pager { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

input { font-family: neue-haas-grotesk-text, sans-serif; }
button.button { background-color: transparent; border: 2px solid #111; border-radius: 0; color: #111; font-family: neue-haas-grotesk-text, sans-serif; font-size: 14px; font-weight: 500; letter-spacing: 0.1em; padding: 0.75em 2.5em; text-transform: uppercase; }
button.button:hover { background-color: #111; border: 2px solid #111;  color: #FFF; }

form .fui-i { font-family: neue-haas-grotesk-text, sans-serif; }
form .fui-legend { color: #111; font-size: 12px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 500; letter-spacing: 0.05em; line-height: 20px; padding: 15px 0 0; text-transform: uppercase; }
form .fui-label { color: #111; font-size: 12px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 500; letter-spacing: 0.05em; line-height: 20px; margin: 10px 0 10px; text-transform: uppercase; }
form .fui-field-rows .fui-label { text-transform: none; letter-spacing: 0; font-weight: 400; }
form .fui-subfield-label-above-input .fui-legend { margin: 0; }
form .fui-input { background: transparent; border-radius: 0; border: 2px solid #111; font-family: neue-haas-grotesk-text, sans-serif; font-size: 16px; line-height: 30px; }
form .fui-input:hover,
form .fui-input:focus { background-color: rgba(255,255,255,0.05); border-color: #111; box-shadow: none !important; color: #FFF; }
form .fui-checkbox { padding: 20px 0 0; }
form .fui-checkbox label { font-size: 16px; padding-left: 32px; }
form .fui-checkbox label:before { background-color: transparent; border: 2px solid #111; border-radius: 0; box-shadow: none !important; top: 0; height: 22px; width: 22px; }
form .fui-checkbox input:checked+label:before { background-color: #111; border-color: #111; background-size: 12px; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%230F1F3D' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"); } 
form .fui-submit { background-color: #111; border: 2px solid #111; border-radius: 0; color: #111; font-family: neue-haas-grotesk-text, sans-serif; font-size: 14px; font-weight: 500; letter-spacing: 0.1em; padding: 0.75em 2.5em; text-transform: uppercase; }
form .fui-submit:hover,
form .fui-submit:focus { background-color: #111; color: #111; }

form .fui-input::-webkit-input-placeholder { color: rgba(255,255,255,0.9); }
form .fui-input::-moz-placeholder { color: rgba(255,255,255,0.9); }
form .fui-input:-ms-input-placeholder { color: rgba(255,255,255,0.9); }
form .fui-input:-moz-placeholder { color: rgba(255,255,255,0.9); opacity: 1; }
form .fui-input::placeholder { color: rgba(255,255,255,0.9); }

form .fui-input.fui-error { background-color: rgba(255,255,255,0.05); border-color: #D1A394; box-shadow: none; color: #FFF; }
form .fui-error-message { color: #D1A394; margin: 1em 0 1.5em; }
.fui-i .fui-alert { border-radius: 0; color: #FFF; border: none; font-style: 16px; }
.fui-i .fui-alert-error { border-radius: 0; background-color: rgba(255,255,255,0.15); }

/* HEADER
------------------------------------------------------------------------------------------------------------------------------------------------------*/
.page-header { border-bottom: 2px solid #111; color: #111; height: 80px; width: 100%; position: fixed; top: 0; left: 0; z-index: 999; }
.page-header .outer { display: flex; }
.page-header a { transition: all .1s ease-out; }
.page-header a.logo { display: inline-block; position: absolute; top: 30px; left: 0; right: 0; margin: 0 auto; height: 20px; width: 243px; }
.page-header a.logo svg { fill: #111; height: 100%; width: 100%; }
.page-header a.logo:hover { opacity: 0.7; }

.page-nav { height: 80px; }
.page-nav>div { display: inline-block; line-height: 80px; }
.nav-left>div { padding-right: 30px; }
.nav-right>div { padding-left: 30px; text-align: right; }
.page-nav .nav-link { color: #111; cursor: pointer; display: block; font-size: 12px; letter-spacing: 0.02em; text-transform: uppercase; }
.nav-right .nav-link { line-height: 24px; padding: 28px 0; }
.nav-right .nav-link svg { float: left; margin-right: 10px; }
.nav-right .nav-search svg { margin-right: 5px; }
.page-nav>div:hover .nav-link { opacity: 0.5; }

.page-sub-nav-bg { background-color: #FFF; display: none; position: absolute; top: 80px; left: 0; height: 320px; width: 100%; z-index: 997; transition: all .1s ease-out; }
.page-sub-nav { background-color: #FFF; border-bottom: 2px solid #111; box-sizing: border-box; display: none; padding: 20px 0; position: absolute; top: 80px; left: 0; min-height: 320px; width: 100%; z-index: 998; font-size: 14px; line-height: 1; }
.page-sub-nav .outer { justify-content: flex-start; flex-wrap: wrap; }
.page-sub-nav a { color: #111; }
.page-sub-nav a:hover { opacity: 0.7; }
.page-sub-nav .block { display: block; margin-bottom: 10px; margin-right: 3%; width: 14.15%; }
.page-sub-nav .block:nth-child(6n) { margin: 0; }
.page-sub-nav .block:last-child { margin: 0; }
.page-sub-nav img { height: auto; margin-bottom: 15px; width: 100%; }
.page-sub-nav strong { display: block; font-size: 12px; letter-spacing: 0.1em; line-height: 20px; margin-bottom: 10px; text-transform: uppercase; }
.nav-products .page-sub-nav strong { border-bottom: 2px solid #F5F4F0; padding-bottom: 2px; margin-bottom: 8px; }

.page-sub-nav .links { line-height: 20px; margin-bottom: 10px; }
.page-sub-nav .links a { display: inline-block; margin-bottom: 10px; }
.page-sub-nav .links strong a { display: block; margin: 0; }
.page-sub-nav .links strong+strong { margin-top: 40px; }
.page-sub-nav .links a:hover { text-decoration: underline; }

.nav-articles .outer { justify-content: space-between; }
.nav-articles .links { width: 31.3%; }
.nav-articles .article { display: block; width: 31.3%; }
.nav-articles .top { justify-content: space-between; margin-bottom: 10px; }
.nav-articles .top strong { width: 31.3%; }


.nav-search form { border-bottom: 2px solid #FFF; display: flex; justify-content: space-between; margin: 90px auto 0; width: 600px; }
.nav-search form input { background: transparent; border: none; color: #FFF; font-family: neue-haas-grotesk-text, sans-serif; font-size: 25px; flex-grow: 2; line-height: 60px; margin: 0; padding: 0; }
.nav-search form button { background: transparent; border: none; color: #FFF; display: flex; align-items: center; font-size: 14px; font-weight: 500; letter-spacing: 0.1em; line-height: 60px; margin: 0; padding: 0; }
.nav-search form button svg { fill: #FFF; margin: 0 0 2px 10px; }
.nav-search form button:hover { opacity: 0.7; }
.nav-search form input::-webkit-input-placeholder { color: rgba(255,255,255,0.5); }
.nav-search form input::-moz-placeholder { color: rgba(255,255,255,0.5); }
.nav-search form input:-ms-input-placeholder { color: rgba(255,255,255,0.5); }
.nav-search form input:-moz-placeholder { color: rgba(255,255,255,0.5); opacity: 1; }
.nav-search form input::placeholder { color: rgba(255,255,255,0.5); }
.nav-search form input:focus,
.nav-search form input:hover { color: #FFF; outline-style: none; box-shadow: none; }

.nav-quote .top { justify-content: space-between; margin-bottom: 10px; }
.nav-quote .top p { line-height: 20px; }
.nav-quote .top p a { text-decoration: underline; }
.nav-quote .recent-product { line-height: 20px; text-align: center; }
.nav-quote .recent-product figure { background-repeat: no-repeat; background-position: center; background-size: contain; }
.nav-quote .recent-product figure img { height: auto; margin: 0 auto 15px; width: 100%; }
.nav-quote .recent-product span { color: #111; display: block; font-weight: 500; }
.nav-quote .recent-product em { color: #999; display: block; font-style: normal; }
.nav-quote .recent-product a:hover { opacity: 0.7; }

.page-nav-active .page-header { background-color: #FFF; border-color: transparent; }
.page-nav-active .page-sub-nav-bg { display: block; }

.nav-toggle { position: absolute; top: 0; right: 0; display: none; line-height: 1; height: 20px; padding: 20px; }
.hamburger { background-color: transparent; border: 0; cursor: pointer; transition-property: opacity, filter; transition-duration: 0.15s; transition-timing-function: linear; font: inherit; color: inherit; text-transform: none; overflow: visible; } 
.hamburger-box { width: 25px; height: 20px; display: inline-block; position: relative; }
.hamburger-inner { display: block; top: 50%; }
.hamburger-inner, 
.hamburger-inner::before, 
.hamburger-inner::after { width: 25px; height: 2px; background-color: #111; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; }
.hamburger-inner::before,
.hamburger-inner::after { content: ""; display: block; }
.hamburger-inner::before { top: -8px; }
.hamburger-inner::after { bottom: -8px; }
.hamburger--squeeze .hamburger-inner { transition-duration: 0.075s; transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--squeeze .hamburger-inner::before { transition: top 0.075s 0.12s ease, opacity 0.075s ease; }
.hamburger--squeeze .hamburger-inner::after { transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger-active .hamburger-inner { transform: rotate(45deg);  transition-delay: 0.12s;  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger-active .hamburger-inner::before { top: 0; opacity: 0; transition: top 0.075s ease, opacity 0.075s 0.12s ease; }
.hamburger-active .hamburger-inner::after { bottom: 0; transform: rotate(-90deg); transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

body.header-no-line .page-header { border-color: transparent; }

body.body-scroll .page-header { background-color: #FFF; }
body.body-scroll .page-header .nav-link { color: #111; }
body.body-scroll .page-header svg { fill: #111; }
body.body-scroll.header-no-line .page-header {  border-color: #111; }

body.colour-white .page-header { border-color: #FFF; }
body.colour-white .page-header .nav-link { color: #FFF; }
body.colour-white .page-header svg { fill: #FFF; }
body.colour-white .page-header .hamburger-inner, 
body.colour-white .page-header .hamburger-inner::before, 
body.colour-white .page-header .hamburger-inner::after { background-color: #FFF; }

body.colour-black .page-header { border-color: #111; }

body.colour-navy .page-header { border-color: #0F1F3D; }
body.colour-navy .page-header .nav-link { color: #0F1F3D; }
body.colour-navy .page-header svg { fill: #0F1F3D; }
body.colour-navy .page-header .hamburger-inner, 
body.colour-navy .page-header .hamburger-inner::before, 
body.colour-navy .page-header .hamburger-inner::after { background-color: #0F1F3D; }

body.colour-teal .page-header { border-color: #8FB5BC; }
body.colour-teal .page-header .nav-link { color: #8FB5BC; }
body.colour-teal .page-header svg { fill: #8FB5BC; }
body.colour-teal .page-header .hamburger-inner, 
body.colour-teal .page-header .hamburger-inner::before, 
body.colour-teal .page-header .hamburger-inner::after { background-color: #8FB5BC; }

body.colour-pink .page-header { border-color: #D1A394; }
body.colour-pink .page-header .nav-link { color: #D1A394; }
body.colour-pink .page-header svg { fill: #D1A394; }
body.colour-pink .page-header .hamburger-inner, 
body.colour-pink .page-header .hamburger-inner::before, 
body.colour-pink .page-header .hamburger-inner::after { background-color: #D1A394; }

body.colour-cream .page-header { border-color: #111; }

body.header-hover .page-header { background-color: #FFF; border-color: #111; }
body.header-hover .page-header .nav-link { color: #111; }
body.header-hover .page-header svg { fill: #111; }
body.header-hover .page-header .hamburger-inner, 
body.header-hover .page-header .hamburger-inner::before, 
body.header-hover .page-header .hamburger-inner::after { background-color: #111; }

body.nav-active-search .page-header { background-color: #8FB5BC; }
body.nav-active-search .page-header .nav-link { color: #FFF; }
body.nav-active-search .page-header svg { fill: #FFF; }
body.nav-active-search .page-sub-nav-bg { background-color: #8FB5BC; }
body.nav-active-search .page-sub-nav { background-color: #8FB5BC; border-color: #7FAAB3; }

/* FOOTER
------------------------------------------------------------------------------------------------------------------------------------------------------*/
.page-footer { background-color: #D1A394; color: #FFF; line-height: 20px; padding: 0 0 50px; text-align: center; }
.page-footer .outer { display: flex; }
.page-footer p { color: #F5F4F0; font-size: 14px; }
.page-footer p a { color: #F5F4F0; text-decoration: none; }
.page-footer a:hover { color: #FFF; text-decoration: underline; transition: all .1s ease-out; }

.page-footer a.logo { display: inline-block; margin: 60px auto; }
.page-footer a.logo svg { fill: #F5F4F0; }
.page-footer a.logo:hover { opacity: 0.7; }

.footer-subscribe { margin: 0 auto 150px; max-width: 880px; padding: 0 30px; }
.footer-subscribe div { border-bottom: 2px solid #FFF; display: flex; justify-content: space-between; margin-bottom: 30px }
.footer-subscribe input { background: transparent; border: none; color: #FFF; font-size: 25px; flex-grow: 2; line-height: 60px; margin: 0; padding: 0; }
.footer-subscribe button { background: transparent; border: none; color: #FFF; display: flex; align-items: center; font-size: 14px; font-weight: 500; letter-spacing: 0.1em; line-height: 60px; margin: 0; padding: 0; }
.footer-subscribe button svg { fill: #F5F4F0; margin: 0 0 2px 10px; }
.footer-subscribe button:hover { opacity: 0.7; }
.footer-subscribe input::-webkit-input-placeholder { color: #F5F4F0; }
.footer-subscribe input::-moz-placeholder { color: #F5F4F0; }
.footer-subscribe input:-ms-input-placeholder { color: #F5F4F0; }
.footer-subscribe input:-moz-placeholder { color: #F5F4F0; opacity: 1; }
.footer-subscribe input::placeholder { color: #F5F4F0; }
.footer-subscribe input:focus,
.footer-subscribe input:hover { color: #FFF; }
.footer-subscribe p { font-size: 16px; }

.footer-text a { display: inline-block; margin: 0 8px; }
.footer-copy { text-align: left; width: 20%; }
.footer-social { text-align: right; width: 20%; }
.footer-social a { display: inline-block; height: 20px; width: 20px; margin-left: 20px; opacity: 0.6; }
.footer-social a:hover { opacity: 1; }

/* HOME
------------------------------------------------------------------------------------------------------------------------------------------------------*/
body.section-home .page-layout { padding-top: 0; }
body.section-home .page-header { border-color: transparent; }
body.section-home.body-scroll .page-header { border-color: #111; }

.home-banners { height: 100vh; text-align: center; }
.home-banners .banner { background-position: center; background-repeat: no-repeat; background-size: cover; height: 100vh; width: 100%; display: none; position: relative; }
.home-banners .banner:first-child { display: block; }
.home-banners .banner .overlay { background: rgba(0,0,0,0.05); position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 199; }
.home-banners .banner header { color: #FFF; position: absolute; bottom: 120px; left: 0; right: 0; z-index: 200; }
.home-banners .banner header * { color: #FFF; }
.home-banners .banner a.button { color: #FFF; border-color: #FFF; margin: 0 5px 10px; }
.home-banners .banner a.button:hover { color: #111; background-color: #FFF; border-color: #FFF; }

.home-banners .pager { height: 20px; padding: 40px 0; text-align: center; width: 100%; z-index: 500; position: absolute; bottom: 0; overflow: hidden; z-index: 200; }
.home-banners .pager span { background-color: rgba(255,255,255,0.3); display: inline-block; height: 4px; margin: 0 4px; width: 50px; }
.home-banners .pager span:hover { background-color: #FFF; }
.home-banners .pager .cycle-pager-active { background-color: #FFF; }
.home-banners .pager > * { cursor: pointer; }
.home-banners .pager { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.home-content .hidden { -webkit-transform: translate3d(0,120px,0); transform: translate3d(0,120px,0); }
.home-content .inview { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-transition: all 1000ms; -o-transition: all 1000ms; transition: all 1000ms; }

/* PRODUCTS
------------------------------------------------------------------------------------------------------------------------------------------------------*/
nav.prod-cats { display: flex; justify-content: center; flex-wrap: wrap; }
nav.prod-cats a { color: #111; display: block; line-height: 1.2; margin: 25px 25px 0; width: 130px; }
nav.prod-cats a figure { background-repeat: no-repeat; background-position: center; background-size: contain; }
nav.prod-cats a img { height: auto; width: 100%; margin-bottom: 15px; }
nav.prod-cats a:hover { opacity: 0.7; }
nav.prod-cats a.active { opacity: 0.7; text-decoration: underline; }
nav.prod-cats a.active img { opacity: 0.5; }

.products { background-color: #FFF; border-top: 2px solid #F5F4F0; border-left: 2px solid #F5F4F0; display: flex; justify-content: flex-start; flex-wrap: wrap; }
.products a { border-right: 2px solid #F5F4F0; border-bottom: 2px solid #F5F4F0; box-sizing: border-box; display: block; width: 25%; padding: 30px; font-size: 14px; line-height: 20px; text-align: center; text-decoration: none; }
.products a figure { background-repeat: no-repeat; background-position: center; background-size: contain; }
.products a img { height: auto; margin: 0 0 30px; width: 100%; }
.products a strong { color: #111; display: block; margin-bottom: 3px; }
.products a .colour { color: #111; display: block; margin-bottom: 3px; }
.products a .price { color: #999; display: block; margin-bottom: 3px; }
.products a:hover .price { color: #111; }
.products a:hover figure { opacity: 0.8;  }

body.base-search { background-color: #F5F4F0; }

.product-content { display: flex; }
.product-images { width: 50%; }
.product-images .cycle-slideshow { min-height: 100%; position: relative; }
.product-images img { cursor: pointer; display: none; object-fit: cover; height: 100%; width: 100%; }
.product-images img:first-child { display: block; }

.product-images .pager { height: 20px; padding: 20px 0; text-align: center; width: 100%; z-index: 500; position: absolute; bottom: 0; overflow: hidden; z-index: 200; }
.product-images .pager span { background-color: rgba(0,0,0,0.5); display: inline-block; height: 4px; margin: 0 4px; width: 50px; }
.product-images .pager span:hover { background-color: #111; }
.product-images .pager .cycle-pager-active { background-color: #111; }
.product-images .pager > * { cursor: pointer; }
.product-images .pager { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.product-images .cycle-prev,
.product-images .cycle-next { background: rgba(255,255,255,0.5) url('/assets/images/left.svg') center no-repeat; background-size: 18px; display: block; position: absolute; top: 50%; left: 20px; margin-top: -15px; height: 30px; width: 30px; z-index: 200; cursor: pointer; opacity: 0.5; }
.product-images .cycle-next { background-image: url('/assets/images/right.svg'); left: auto; right: 20px; }
.product-images .cycle-prev:hover,
.product-images .cycle-next:hover { background-color: rgba(255,255,255,1); opacity: 1; }

.product-details { display: flex; width: 50%; justify-content: center; }
.product-details header { margin-bottom: 25px; }
.product-details h1 { margin-bottom: 10px; }
.product-details h4 { margin: 0 0 10px; }
.product-details>div { color: #FFF; margin: 10% 15%; width: 100%; }
.product-details div *,
.product-details div a { color: #FFF; }
.product-details form { display: flex; margin-bottom: 5px; }
.product-details .quantity { background-color: transparent; border: 2px solid #FFF; box-sizing: border-box; color: #FFF; display: flex; justify-content: space-between; height: 50px; text-align: center; width: 50%; flex: 1; }
.product-details .quantity input { background-color: transparent; border: none; color: #FFF; height: 100%; text-align: center; width: calc(100% - 100px); }
.product-details .quantity button { background-color: transparent; border: none; color: #FFF; font-size: 25px; height: 100%; padding: 0; text-align: center; width: 50px; }
.product-details .add { background-color: #FFF; border: none; color: #111; font-size: 13px; font-weight: 500; letter-spacing: 0.1em; height: 50px; width: 50%; flex: 1; }
.product-details .remove { background-color: transparent; border: none; color: #FFF; font-size: 15px; font-weight: 400; padding: 10px 0; text-decoration: underline; }
.product-details button:hover { opacity: 0.8; }
.product-details .description div { border-bottom: 2px solid rgba(255,255,255,0.25); padding: 20px 0; }
.product-details .description div:last-child { border: none; }

.related-heading { padding: 60px 0; text-align: center; }
.related-products a:nth-child(5) { display: none; }

body.colour-black .product-content { border-bottom: 2px solid #111; }
body.colour-black .product-details { background-color: #111; }
body.colour-black .product-details .add { color: #111; }
body.colour-navy .product-content { border-bottom: 2px solid #0F1F3D; }
body.colour-navy .product-details { background-color: #0F1F3D; }
body.colour-navy .product-details .add { color: #0F1F3D; }
body.colour-teal .product-content { border-bottom: 2px solid #8FB5BC; }
body.colour-teal .product-details { background-color: #8FB5BC; }
body.colour-teal .product-details .add { color: #8FB5BC; }
body.colour-pink .product-content { border-bottom: 2px solid #D1A394; }
body.colour-pink .product-details { background-color: #D1A394; }
body.colour-pink .product-details .add { color: #D1A394; }
body.colour-cream .product-content { border-bottom: 2px solid #F5F4F0; }
body.colour-cream .product-details { background-color: #F5F4F0; }
body.colour-cream .product-details { color: #F5F4F0; }
body.colour-cream .product-details div,
body.colour-cream .product-details div *,
body.colour-cream .product-details div a { color: #111; }
body.colour-cream .product-details .quantity { border: 2px solid #111; }
body.colour-cream .product-details .quantity input { border-color: #111; color: #111; }
body.colour-cream .product-details .add { background-color: #111; color: #FFF; }
body.colour-cream .product-details .description div { border-color: rgba(0,0,0,0.05); }

/* ARTICLES
------------------------------------------------------------------------------------------------------------------------------------------------------*/
.articles .grid:after { display: block; content: ''; clear: both; }
.articles .grid-col { float: left; width: 50%; }
.articles article a { display: block; margin: 0 auto 100px; text-decoration: none; width: 80%; max-width: 800px; }
.articles article img { height: auto; margin: 0 auto; width: 100%; transition: all .1s ease-out; }
.articles article div { margin-top: 30px; }
.articles article h5 { margin: 0 0 15px; }
.articles article h2 { margin: 0 0 20px; }
.articles article h5.categories { color: #999; font-weight: 400; margin: 0; }
.articles article a:hover img { filter: grayscale(100%); opacity: 0.25; }

body.base-articles .bg-black { background: #111; }
body.base-articles .bg-navy { background: #0F1F3D; }
body.base-articles .bg-teal { background: #8FB5BC; }
body.base-articles .bg-pink { background: #D1A394; }

body.type-article .page-layout { padding-top: 0; }
body.type-article .page-banner { height: 600px; position: relative; }
body.type-article .page-banner figure { background-repeat: no-repeat; background-position: center; background-size: cover; filter: grayscale(100%); position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: 0.2; }
body.type-article .page-banner .overlay { background: transparent; position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
body.type-article .page-banner .padding { margin-top: 5%; }
body.type-article .page-banner h5 { color: #FFF; }
body.type-article .page-banner h5 a { color: #FFF; text-decoration: none; }
body.type-article .page-banner h5 a:hover { color: #FFF; text-decoration: underline; }
body.type-article .page-banner h1 { margin: 60px 0; }
body.type-article .page-banner h4 { color: #FFF; }

/* CONTACT
------------------------------------------------------------------------------------------------------------------------------------------------------*/
.contact-content { display: flex; }
.contact-details { background-color: #0F1F3D; display: flex; width: 50%; justify-content: center; }
.contact-form { background-color: #F5F4F0; display: flex; width: 50%; justify-content: center; }
.contact-details>div,
.contact-form>div { margin: 10% 15%; width: 100%; }
.contact-details *,
.contact-details a,
.contact-details p a { color: #F5F4F0; }

.contact-form * { color: #0F1F3D; }
.contact-form form { margin-top: 30px; }
.contact-form .fui-row { margin: 0; }
.contact-form .fui-row:not(:last-child) { margin: 0; }
.contact-form .fui-field { padding: 0; }
.contact-form .fui-label { display: none; }
.contact-form .fui-input { border: 2px solid #0F1F3D; margin-top: -2px; }
.contact-form .fui-select { background: transparent; border: 2px solid #0F1F3D; border-radius: 0; font-size: 16px; line-height: 30px; margin-top: -2px; }
.contact-form .fui-input:hover,
.contact-form .fui-input:focus,
.contact-form .fui-select:hover,
.contact-form .fui-select:focus { background-color: #FFF; border-color: #0F1F3D; color: #0F1F3D; }

.contact-form .fui-row .fui-field:nth-child(2) input { border-left-width: 1px; }
.contact-form textarea.fui-input { height: 120px; }
.contact-form .fui-checkbox { padding: 20px 0 0; }
.contact-form .fui-checkbox label { font-size: 16px; padding-left: 32px; }
.contact-form .fui-checkbox label:before { background-color: transparent; border: 2px solid #0F1F3D; border-radius: 0; box-shadow: none !important; top: 0; height: 22px; width: 22px; }
.contact-form .fui-checkbox input:checked+label:before { background-color: #0F1F3D; border-color: #0F1F3D; background-size: 12px; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23F5F4F0' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"); } 
.contact-form .fui-checkbox input:focus+label:before { border-color: #0F1F3D; }
.contact-form .fui-submit { background-color: #0F1F3D; border: 2px solid #0F1F3D; border-radius: 0; color: #F5F4F0; font-family: neue-haas-grotesk-text, sans-serif; font-size: 14px; font-weight: 500; letter-spacing: 0.1em; padding: 0.75em 2.5em; }
.contact-form .fui-submit:hover,
.contact-form .fui-submit:focus { background-color: #F5F4F0; color: #0F1F3D; }

.contact-form .fui-input::-webkit-input-placeholder { color: #0F1F3D; }
.contact-form .fui-input::-moz-placeholder { color: color: #0F1F3D; }
.contact-form .fui-input:-ms-input-placeholder { color: color: #0F1F3D; }
.contact-form .fui-input:-moz-placeholder { color: #0F1F3D; opacity: 1; }
.contact-form .fui-input::placeholder { color: #0F1F3D; }

.contact-form .fui-input.fui-error { border-color: #0F1F3D; color: #0F1F3D; }
.contact-form .fui-error-message { color: #0F1F3D; }
.contact-form .fui-alert { background-color: rgba(0,0,0,0.05); color: #0F1F3D; }

/* QUOTE
------------------------------------------------------------------------------------------------------------------------------------------------------*/
body.type-quote .page-layout { background-color: #F5F4F0; }
body.type-quote .page-heading * { color: #111111; }
body.type-quote .page-heading .button { border: 2px solid #111111; color: #111111; }
body.type-quote .page-heading .button:hover { background-color: #111111; border: 2px solid #111111;  color: #F5F4F0; }

.quote-items { border: 2px solid #111111; margin: 0 auto 60px; max-width: 1400px; }
.quote-item { border-bottom: 2px solid #111111; display: flex; justify-content: flex-start; }
.quote-item:last-child { border-bottom: none; }
.quote-item a { color: #111111; text-decoration: none; }
.quote-item * { color: #111111; }
.quote-item .left { border-right: 2px solid #111111; display: flex; padding: 20px 30px 20px 20px; width: 50%; align-items: center; justify-content: space-between; box-sizing: border-box; }
.quote-item .left a.item-product { display: flex; align-items: center; }
.quote-item .left a.item-product:hover figure { opacity: 0.8; }
.quote-item .left h4 { margin: 0 0 5px; }
.quote-item .left .item-remove { display: flex; }
.quote-item .left .item-remove button { background: none; border: none; font-family: sans-serif; font-size: 20px; line-height: 20px; padding: 10px; text-align: center; }
.quote-item .left .item-remove button:hover { opacity: 0.5; }
.quote-item figure { background-repeat: no-repeat; background-position: center; background-size: cover; margin-right: 20px; }
.quote-item img { height: auto; margin: 0 auto; width: 100px; }
.quote-item .right { display: flex; align-items: center; justify-content: space-between; width: 50%; padding: 40px; box-sizing: border-box; }
.quote-item .right>div { padding-top: 5px; }
.quote-item .right>div h6 { margin-bottom: 5px; }
.quote-item .right>div h4 { margin-top: 5px; }
.quote-item .item-subtotal { text-align: right; }
.quote-item .right form { display: flex; width: 220px; }
.quote-item .quantity { background-color: transparent; border: 2px solid #111111; box-sizing: border-box; color: #111111; display: flex; justify-content: space-between; height: 50px; text-align: center; width: 50%; flex: 1; }
.quote-item .quantity input { background-color: transparent; border: none; color: #111111; height: 100%; text-align: center; width: calc(100% - 60px); }
.quote-item .quantity button { background-color: transparent; border: none; color: #111111; font-size: 25px; height: 100%; padding: 0; text-align: center; width: 30px; }
.quote-item .update { background-color: #111111; border: none; color: #F5F4F0; font-size: 13px; font-weight: 500; letter-spacing: 0.1em; height: 50px; width: 50%; flex: 1; }
.quote-item button:hover { opacity: 0.8; }

.quote-end { display: flex; justify-content: space-between; margin: 0 auto 60px; max-width: 1400px; }
.quote-end a { color: #111111; }
.quote-end * { color: #111111; }
.quote-terms { max-width: 600px; }
.quote-total { text-align: right; padding-right: 40px; }
.quote-total h2 { margin-top: 15px; }

a.quote-link { display: inline-block; background-color: rgba(0,0,0,0.05); padding: 10px; text-decoration: none; }
a.quote-link:hover { background-color: rgba(0,0,0,0.1); text-decoration: none; opacity: 1; }

.quote-form { background-color: #111111; padding: 60px 0; }
.quote-form a { color: #F5F4F0; }
.quote-form * { color: #F5F4F0; }
.quote-form>.padding { margin: 0 auto; max-width: 1400px; display: flex; justify-content: flex-start; }
.quote-form .left { padding-right: 40px; }
.quote-form .right { padding-left: 40px; }

.quote-form a.quote-link { background-color: rgba(255,255,255,0.1); }
.quote-form a.quote-link:hover { background-color: rgba(255,255,255,0.3); }

.quote-form .row { display: flex; }
.quote-form form input { background: transparent; border-radius: 0; border: 2px solid #F5F4F0; font-family: neue-haas-grotesk-text, sans-serif; font-size: 16px; line-height: 30px; padding: .5rem .75rem; margin-top: -2px; width: 100%; }
.quote-form .row input { width: 50%; }
.quote-form .row input:nth-child(2) { border-left: none; }
.quote-form form input:hover,
.quote-form form input:focus { background-color: rgba(255,255,255,0.15); border-color: #F5F4F0; color: #F5F4F0; }
.quote-form form .button { background-color: #F5F4F0; border: 2px solid #F5F4F0; color: #111111; margin-top: 20px; }
.quote-form form .button:hover { background-color: #111111; color: #F5F4F0; }

.quote-form form input::-webkit-input-placeholder { color: #F5F4F0; }
.quote-form form input::-moz-placeholder { color: #F5F4F0; }
.quote-form form input:-ms-input-placeholder { color: #F5F4F0; }
.quote-form form input:-moz-placeholder { color: #F5F4F0; opacity: 1; }
.quote-form form input::placeholder { color: #F5F4F0; }

body.quote-event .page-layout { background-color: #FFF; }
.quote-event-content { display: flex; }
.quote-summary { background-color: #FFF; display: flex; width: 50%; justify-content: center; }
.event-form { background-color: #F5F4F0; display: flex; width: 50%; justify-content: center; }
.quote-summary>div,
.event-form>div { margin: 10% 15%; width: 100%; }

.quote-summary *,
.quote-summary a,
.quote-summary p a { color: #111111; }
.quote-summary a.button { border-color: #111111; }
.quote-summary a.button:hover { background-color: #111111; color: #F5F4F0; }
.quote-summary h4 { border-bottom: 2px solid #111111; padding-bottom: 14px; line-height: 1; margin: 40px 0 8px; }
.quote-summary p { line-height: 2; margin-bottom: 0; }
.quote-summary h4 span { float: right; }
.quote-summary h4 .sub { font-size: 12px; font-family: neue-haas-grotesk-text, sans-serif; font-weight: 400; letter-spacing: 0.15em; line-height: 1; margin: 10px 0 0; text-transform: uppercase; }
.quote-summary .cols { display: flex; justify-content: space-between; }
.quote-summary .cols .right { text-align: right; }
.quote-summary .product-cols span { width: 75%; }
.quote-summary .product-cols .right { width: 20%; }
.quote-summary .button { margin-top: 20px; }

.event-form *,
.event-form a,
.event-form p a { color: #111111; }

.event-form .fui-i *, .event-form .fui-i :after, .event-form .fui-i :before { border-color: #111111; }
.event-form .fui-row:not(:last-child) { margin-bottom: 0; }
.event-form .fui-label { color: #111111; }
.event-form .fui-label .fui-required { color: #111111; }
.event-form .fui-legend { color: #111111; }
.event-form .fui-legend .fui-required { color: #111111; }
.event-form .fui-input { border: 2px solid #111111; }
.event-form .fui-select { background: transparent; border: 2px solid #111111; border-radius: 0; font-size: 16px; line-height: 30px; }
.event-form .hidden-field { display:none; }
.event-form .fui-input:hover,
.event-form .fui-input:focus,
.event-form .fui-select:hover,
.event-form .fui-select:focus { background-color: #FFF; border-color: #111111; color: #111111; }
.event-form .fui-name-last-name input { border-left-width: 1px; }
.event-form textarea.fui-input { height: 120px; }
.event-form .fui-checkbox { padding: 20px 0 0; }
.event-form .fui-checkbox label { font-size: 16px; padding-left: 32px; }
.event-form .fui-checkbox label:before { background-color: transparent; border: 2px solid #111111; border-radius: 0; box-shadow: none !important; top: 0; height: 22px; width: 22px; }
.event-form .fui-checkbox input:checked+label:before { background-color: #111111; border-color: #111111; background-size: 12px; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23FFFFFF' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"); } 
.event-form .fui-checkbox input:focus+label:before { border-color: #111111; }
.event-form .fui-submit { background-color: #111111; border: 2px solid #111111; border-radius: 0; color: #FFF; font-family: neue-haas-grotesk-text, sans-serif; font-size: 14px; font-weight: 500; letter-spacing: 0.1em; padding: 0.75em 2.5em; }
.event-form .fui-submit:hover,
.event-form .fui-submit:focus { background-color: #F5F4F0; border-color: #111111; color: #111111; }

.event-form .fui-input::-webkit-input-placeholder { color: #111111; }
.event-form .fui-input::-moz-placeholder { color: color: #111111; }
.event-form .fui-input:-ms-input-placeholder { color: color: #111111; }
.event-form .fui-input:-moz-placeholder { color: #111111; opacity: 1; }
.event-form .fui-input::placeholder { color: #111111; }

.event-form input[type="time"]::-webkit-calendar-picker-indicator,
.event-form input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(50%); }

.event-form .fui-input.fui-error { border-color: #111111; }
.event-form .fui-error-message { color: #111111; }

/* MOB NAV
------------------------------------------------------------------------------------------------------------------------------------------------------*/
body.mob-nav-active	{ overflow: hidden; }
body.mob-nav-active .page-header { background-color: #F2F0E8; border-color: #111; }
body.mob-nav-active .page-header svg,
body.mob-nav-active .page-header .logo svg { fill: #111; }
body.mob-nav-active .page-header .hamburger-inner, 
body.mob-nav-active .page-header .hamburger-inner::before, 
body.mob-nav-active .page-header .hamburger-inner::after { background-color: #111; }

.mob-nav { display: none; background-color: #F2F0E8; font-size: 14px; overflow-y: auto; z-index: -1; padding-bottom: 60px; position: fixed; top: 62px; left: 0; bottom: 0; right: 0; width: 100%; z-index: 999; }
.mob-nav h5 { font-size: 12px; line-height: 30px; margin: 0; }
.mob-nav a { color: #111; display: block; }
.mob-nav .left { width: 50%; }
.mob-nav .right { width: 50%; text-align: right; display: flex; align-items: center; justify-content: flex-end; }
.mob-nav-item { border-bottom: 1px solid rgba(0,0,0,0.1); display: flex; padding: 10px 20px; }
.mob-nav-item:last-child { border-bottom: none; padding-bottom: 60px; }
.mob-nav-item svg { height: 24px; width: 24px; margin-left: 15px; }
.mob-nav-link { display: block; }

.mob-nav-item form { display: flex; justify-content: space-between; width: 100%; }
.mob-nav-item form input { background: transparent; border: none; color: rgba(0,0,0,0.5); font-family: neue-haas-grotesk-text, sans-serif; font-size: 14px; line-height: 30px; margin: 0; padding: 0; width: 80%; }
.mob-nav-item form button { background: transparent; border: none; margin: 0; padding: 0; }
.mob-nav-item form button svg { margin: 2px 0 0; }
.mob-nav-item form input::-webkit-input-placeholder { color: rgba(0,0,0,0.5); }
.mob-nav-item form input::-moz-placeholder { color: rgba(0,0,0,0.5); }
.mob-nav-item form input:-ms-input-placeholder { color: rgba(0,0,0,0.5); }
.mob-nav-item form input:-moz-placeholder { color: rgba(0,0,0,0.5); opacity: 1; }
.mob-nav-item form input::placeholder { color: rgba(0,0,0,0.5); }
.mob-nav-item form input:focus,
.mob-nav-item form input:hover { color: rgba(0,0,0,0.5); outline-style: none; box-shadow: none; }

.mob-parent ul { display: none; padding: 0 20px 10px; }
.mob-parent h5 { border-bottom: 1px solid rgba(0,0,0,0.1); padding: 10px 20px; }
.mob-parent .toggle>h5:after { content: '+'; font-family: sans-serif; font-size: 22px; float: right; opacity: 0.2; }
.mob-parent .toggle-active { border-bottom: 1px solid rgba(0,0,0,0.1); }
.mob-parent .toggle-active>h5 { border-color: transparent; }
.mob-parent .toggle-active>h5:after { content: '\2013'; }
.mob-parent .toggle-active ul { display: block; }

.mob-links li a { line-height: 20px; padding: 5px 0; }
.mob-links li.active a { text-decoration: underline; }


/* MEDIA QUERIES
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media (max-height:800px) {
	.section-home .home-content { height: auto; }
	.home-content .center { height: auto; display: block; padding: 250px 0 200px; }
	.section-home .page-footer { position: relative; }
}

@media (min-width:2000px) {
	.products a { width: 20%; }
	.related-products a:nth-child(5) { display: block; }
}

@media (max-width:1600px) {

	.nav-left>div { padding-right: 20px; }
	.nav-right>div { padding-left: 20px; }
	.page-sub-nav-bg { height: 280px; }
	.page-sub-nav { min-height: 280px; }
}

@media (max-width:1400px) {
	.outer { padding-left: 30px; padding-right: 30px; }
	.nav-left>div { padding-right: 15px; }
	.nav-right>div { padding-left: 15px; }
	nav.prod-cats a { font-size: 14px; margin: 25px 15px 0; width: 120px; }
	.products a { font-size: 13px; }
	body.type-article .page-banner { height: 500px; }
	body.type-article .page-banner .padding { margin-top: 60px; }
	body.type-article .page-banner h1 { margin: 40px 0; }
}

@media (max-width:1200px) {
	h1 { font-size: 35px; }
	h2 { font-size: 25px; }
	h3 { font-size: 20px; }
	h4 { font-size: 18px; }
	h5 { font-size: 13px; }
	h6 { font-size: 11px; }

	.page-layout { padding-top: 62px; }
	.outer,
	.padding,
	.inner { padding-left: 20px; padding-right: 20px; }
	.page-header { height: 60px; }
	.page-header a.logo { height: 14px; width: 170px; top: 23px; left: 20px; margin: 0; }
	.page-header .page-nav { display: none; }
	.nav-toggle { display: block; }

	.testimonials-block blockquote { font-size: 20px; }
	.logos-block figure { width: 20%; }

	.products a { padding: 20px; width: 33.33%; }
	.products-block a:nth-child(4) { display: none; }

}

@media (max-width:1100px) {
	.page-footer { padding-bottom: 20px; }
	.page-footer .outer { flex-direction: column; text-align: center; }
	.page-footer a.logo svg { height: 14px; width: 170px; }
	.page-footer p { font-size: 13px; }
	.footer-subscribe { margin-bottom: 80px; padding: 0 20px; }
	.footer-subscribe input { font-size: 22px; }
	.footer-subscribe p { font-size: 14px; }
	.footer-copy,
	.footer-text,
	.footer-social { margin: 15px 0; text-align: center; width: 100%; }
	.page-footer p a { padding: 5px; }
	.page-banner .overlay { height: 320px; }
	nav.buttons a.button { font-size: 12px; margin: 0 5px 15px; padding: 10px 15px; }
	.columns-block .half { width: 47.5%; }
	nav.prod-cats a { margin: 25px 10px 0; width: 100px; }

	.home-banners,
	.home-banners .banner { height: 80vh; }

	.blocks-block figure img { height: 100%; object-fit: cover; }
	.blocks-block .text div { margin: 40px; }

	.product-content { display: block; }
	.product-images { width: 100%; }
	.product-details { width: 100%; }
	.product-details>div { margin: 40px 20px; max-width: 800px; }

	.articles .grid-col--1 a { margin: 0 20px 50px 0; width: auto; }
	.articles .grid-col--2 a { margin: 0 0 50px 20px; width: auto; }
	body.type-article .page-banner { height: 420px; }
	body.type-article .page-banner .padding { margin-top: 50px; }
	body.type-article .page-banner h1 { margin: 30px 0; }

	.contact-content { display: block; }
	.contact-details { width: 100%; }
	.contact-form { width: 100%; }
	.contact-details>div,
	.contact-form>div { margin: 40px 20px; }
}

@media (max-width:800px) {
	h1 { font-size: 28px; }
	h2 { font-size: 20px; }
	h3 { font-size: 17px; }
	h4 { font-size: 15px; }
	h5 { font-size: 12px; }
	h6 { font-size: 11px; }

	.page-content p.button a {  font-size: 11px; line-height: 18px; margin: 0 8px 8px 0; padding: 8px 12px; }
	a.button { font-size: 11px; line-height: 18px; padding: 8px 12px; }
	.page-content p { font-size: 15px; }
	.page-content ul, 
	.page-content ol { font-size: 15px; }

	form .fui-input { font-size: 14px; }
	button.button { font-size: 12px; padding: 10px 12px; }


	.page-footer p { font-size: 12px; }
	.footer-subscribe input { font-size: 18px; }
	.footer-subscribe button span { display: none; }

	.page-heading { margin: 40px 20px; }
	.page-banner { margin: 0; }
	.page-banner .overlay { height: 260px; }
	nav.buttons a.button { font-size: 11px; margin: 0 4px 8px; padding: 8px 10px; }

	.content-block { margin: 40px 0; }
	.columns-block .inner { display: block; }
	.columns-block .half { width: 100%; }
	.columns-block .half:first-child { margin-bottom: 40px; }
	.blocks-block>div { display: block; }
	.blocks-block>div .half { width: 100%; }
	.blocks-block>div .text div { margin: 40px 20px; }
	.products-block a:nth-child(4) { display: block; }
	.banner-block header { margin-bottom: 25px; }
	.logos-block figure { padding: 2.5%; width: 25%; }
	.testimonials-block.content-block { padding: 50px 0; }
	.testimonials-block blockquote { font-size: 18px; padding: 0; }

	.home-banners,
	.home-banners .banner { height: 440px; }
	.home-banners .banner header { bottom: 80px; }
	.home-banners .pager { padding: 20px 0; }

	nav.prod-cats { margin-top: 50px; }
	nav.prod-cats a { border: 2px solid #111; box-sizing: border-box; color: #111; display: inline-block; font-size: 11px; font-weight: 500; letter-spacing: 0.1em; line-height: 20px; margin: 0 4px 8px; padding: 7px 10px; text-decoration: none; text-transform: uppercase; width: auto; }
	nav.prod-cats a figure { display: none; }
	nav.prod-cats a.active,
	nav.prod-cats a:hover { background-color: #111; color: #FFF; opacity: 1; text-decoration: none; }
	.products a { font-size: 12px; padding: 15px; width: 50%; }

	.product-details .add { font-size: 12px; }

	.articles .grid-col { float: none; width: 100%; }
	.articles .grid-col a { margin: 0 auto 50px; max-width: 600px; }
	.articles article div { margin-top: 20px; }
	.articles article h5,
	.articles article h2 { margin-bottom: 10px; }
	body.type-article .page-banner { height: 360px; }

	body.base-quote .padding { padding: 0; }

	body.base-quote p { font-size: 13px; }

	.quote-items { border-width: 2px 0; margin: 0; }
	.quote-item { display: block; }
	.quote-item .half { width: 100%; }
	.quote-item .left { border: none; align-items: flex-start; padding: 15px 15px 10px; }
	.quote-item .left a.item-product { align-items: flex-start; }
	.quote-item figure { margin-right: 15px; }
	.quote-item img { width: 80px; }
	.quote-item .left .item-title { padding-right: 15px; }
	.quote-item .left h4 { font-weight: 500; line-height: 1.3; }
	.quote-item .left .item-remove button { border: 1px solid #D1A394; font-size: 16px; line-height: 15px; padding: 5px; }
	.quote-item .right { padding: 0 15px 15px; justify-content: flex-start; }
	.quote-item .right form { width: 160px; margin-left: auto; order: 3; }
	.quote-item .quantity { height: 42px; }
	.quote-item .quantity button { display: none; }
	.quote-item .quantity input { width: 100%; }
	.quote-item .update { font-size: 12px; height: 42px; }
	.quote-item .right>div h4 { font-size: 14px; }
	.quote-item .item-price { width: 80px; padding-right: 15px; }
	.quote-item .item-subtotal { text-align: left; }

	.quote-end { padding: 30px 20px; flex-direction: column; margin: 0; }
	.quote-end .half { width: 100%; }
	.quote-end .quote-total { order: -1; padding: 10px 0 20px; text-align: left; }

	.quote-form { padding: 20px; }
	.quote-form>.padding { display: block; }
	.quote-form .half { width: 100%; padding: 0 0 20px; }
	.quote-form form input { font-size: 14px; }

	a.quote-link { font-size: 13px; }

	.quote-event-content { display: block; }
	.quote-summary { width: 100%; }
	.event-form { width: 100%; }
	.event-form .fui-submit { font-size: 12px; }
	.quote-summary h4 { line-height: 1; margin-top: 30px; padding-bottom: 5px; }
	.quote-summary h4 .sub { margin-top: 2px; }
	.quote-summary>div, .event-form>div { margin: 20px; }
}

@media (max-width:600px) {
	.logos-block figure { padding: 4%; }
	.articles article a { width: 90%; }
	.contact-form .fui-row { display: block; }
	.contact-form .fui-row .fui-field:nth-child(2) input { border-left-width: 2px; }
}

@media (max-width:400px) {
	.footer-subscribe input { font-size: 14px; }
	.footer-subscribe button svg { height: 15px; width: 15px; }
	.page-banner .overlay { height: 220px; }
	.products a { padding: 10px;}

	.quote-item .left { padding: 15px 10px 10px; }
	.quote-item .right { padding: 0 10px 15px; }
	.quote-item .right form { width: 140px; }
	.quote-item img { width: 60px; }
	.quote-item .item-price { width: 60px; }
	.quote-end { padding: 20px 10px; }
	.quote-form { padding: 15px; }

	.quote-summary>div, .event-form>div { margin: 20px 15px; }
}