/* Minification failed. Returning unminified contents.
(3056,27): run-time error CSS1046: Expect comma, found '0'
(3056,31): run-time error CSS1046: Expect comma, found '/'
(7131,28): run-time error CSS1034:
(7131,28): run-time error CSS1042: Expected function, found ','
(7131,33): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
*/
@import url("//hello.myfonts.net/count/37780d");
@font-face {font-family: 'CoreSansCR-35Light';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_2_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_2_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_2_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_2_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_2_0.ttf') format('truetype');font-display: swap;}
@font-face {font-family: 'CoreSansCR-35LightIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_7_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_7_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_7_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_7_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_7_0.ttf') format('truetype');font-display: swap;}
@font-face {font-family: 'CoreSansCR-55Medium';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_8_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_8_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_8_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_8_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_8_0.ttf') format('truetype');font-display: swap;}
@font-face {font-family: 'CoreSansCR-55MediumIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_B_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_B_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_B_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_B_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_B_0.ttf') format('truetype');font-display: swap;}
@font-face {font-family: 'CoreSansCR-65Bold';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_E_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_E_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_E_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_E_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_E_0.ttf') format('truetype');font-display: swap;}
/* NOT USED
@font-face {font-family: 'CoreSansCR-25ExtraLight';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_0_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_0_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_0_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_0_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_0_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-45RegularIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_1_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_1_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_1_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_1_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_1_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-45Regular';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_3_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_3_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_3_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_3_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_3_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-25ExtraLightIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_4_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_4_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_4_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_4_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_4_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-15Thin';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_5_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_5_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_5_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_5_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_5_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-15ThinIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_6_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_6_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_6_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_6_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_6_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-85HeavyIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_9_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_9_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_9_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_9_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_9_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-95BlackIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_A_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_A_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_A_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_A_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_A_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-85Heavy';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_C_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_C_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_C_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_C_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_C_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-95Black';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_D_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_D_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_D_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_D_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_D_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-65BoldIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_F_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_F_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_F_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_F_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_F_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-75ExtraBoldIt';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_10_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_10_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_10_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_10_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_10_0.ttf') format('truetype');}
@font-face {font-family: 'CoreSansCR-75ExtraBold';src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_11_0.eot');src: url('/skin/MyFontsWebfontsKit/webfonts/37780D_11_0.eot?#iefix') format('embedded-opentype'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_11_0.woff2') format('woff2'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_11_0.woff') format('woff'),url('/skin/MyFontsWebfontsKit/webfonts/37780D_11_0.ttf') format('truetype');}*/
/**
* @license
* MyFonts Webfont Build ID 3635213, 2018-09-05T06:40:19-0400
*
* The fonts listed in this notice are subject to the End User License
* Agreement(s) entered into by the website owner. All other parties are
* explicitly restricted from using the Licensed Webfonts(s).
*
* You may obtain a valid license at the URLs below.
*
* Webfont: CoreSansCR-25ExtraLight by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/extra-light/
*
* Webfont: CoreSansCR-45RegularIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/regular-italic/
*
* Webfont: CoreSansCR-35Light by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/light/
*
* Webfont: CoreSansCR-45Regular by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/regular/
*
* Webfont: CoreSansCR-25ExtraLightIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/extra-light-italic/
*
* Webfont: CoreSansCR-15Thin by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/thin/
*
* Webfont: CoreSansCR-15ThinIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/thin-italic/
*
* Webfont: CoreSansCR-35LightIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/light-italic/
*
* Webfont: CoreSansCR-55Medium by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/medium/
*
* Webfont: CoreSansCR-85HeavyIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/heavy-italic/
*
* Webfont: CoreSansCR-95BlackIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/black-italic/
*
* Webfont: CoreSansCR-55MediumIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/medium-italic/
*
* Webfont: CoreSansCR-85Heavy by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/heavy/
*
* Webfont: CoreSansCR-95Black by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/black/
*
* Webfont: CoreSansCR-65Bold by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/bold/
*
* Webfont: CoreSansCR-65BoldIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/bold-italic/
*
* Webfont: CoreSansCR-75ExtraBoldIt by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/extra-bold-italic/
*
* Webfont: CoreSansCR-75ExtraBold by S-Core
* URL: https://www.myfonts.com/fonts/s-core/core-sans-cr/extra-bold/
*
*
* License: https://www.myfonts.com/viewlicense?type=web&buildid=3635213
* Licensed pageviews: 10,000
* Webfonts copyright: Copyright (c) 2016 by S-Core Co., Ltd.. All rights reserved.
*
* © 2018 MyFonts Inc
*/
@charset "UTF-8";
/* COLOURS
Primary
#011F26 Midnight
#f8f8f8 Grey
Secondary
#C7C4BA Cotton
#CDB8AF Orchid
#BEBFCB Lavender
#E6CBC2 Peach
Tertiary
#1E454B Forest
#EB5D4D Coral
*/
/* FONTS
font-family:'Jazmin Alt W05 SemiBold';
font-family:'Morn W01 Light';
font-family:'Morn W01 Light Oblique';
font-family:'Morn W01 Medium';
font-family:'Morn W01 Medium Oblique';
font-family:'Morn W01 DemiBold';
font-family:'Morn W01 DemiBold Oblique';
*/
/* RESET ---------------------------------------------------------------------------------------------------------------*/
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.aspNetHidden {
display: none;
}
html {
font-size: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
line-height: 1;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, select, textarea, textfield, button {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, fieldset, img, summary {
display: block;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
ol, ul, li {
list-style-type: none;
list-style-image: none;
list-style-position: outside;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
a img {
border: none;
}
img {
border: none;
-ms-interpolation-mode: bicubic;
}
img, embed, object, video {
height: auto;
max-width: 100%;
}
iframe {
max-width: 100%;
}
svg:not(:root) {
overflow: hidden;
}
button, input {
line-height: normal;
}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
-moz-appearance: button;
-webkit-appearance: button;
cursor: pointer;
*overflow: visible;
}
button[disabled], input[disabled] {
cursor: default;
}
input[type="checkbox"], input[type="radio"] {
box-sizing: border-box;
padding: 0;
*height: 1.25rem;
*width: 1.25rem;
}
input[type="search"] {
-moz-appearance: textfield;
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
-moz-appearance: none;
-webkit-appearance: none;
}
button::-moz-focus-inner, input::-moz-focus-inner {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
vertical-align: top;
}
iframe[src^="//assets.pinterest"] {
display: none;
}
iframe[class*='PIN_'], iframe[class^='PIN_'] {
display: none !important;
}
.breadcrumb span.noBreadcrumb {
position: absolute;
left: 0;
top: -999em;
width: 1px;
height: 1px;
overflow: hidden;
}
.home .breadcrumb {
display: none;
}
.y36ul5 {
display: none;
height: 1px;
}
acronym, abbr {
border-bottom: 1px dotted;
cursor: help;
}
.analyticRemarket iframe {
height: 0;
}
.btn {
text-decoration: none;
}
/* fixes */
.offscreen {
position: absolute !important;
left: 0 !important;
top: -999em !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
}
/*screen reader*/
li.offscreen:focus-within {
position: relative !important;
width: auto !important;
height: auto !important;
overflow: visible !important;
left: unset !important;
top: unset !important;
color: #011F26;
z-index: 100;
}
li.offscreen a:focus {
background: yellow;
}
.hide {
display: none;
}
.clear {
clear: both;
}
.clearfix {
*zoom: 1;
}
.clearfix:before {
content: "";
display: table;
}
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}
.alertContainer {
position: absolute !important;
left: 0 !important;
top: -999em !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
}
.alertContainer {
position: relative !important;
left: auto !important;
top: auto !important;
width: auto !important;
height: auto !important;
overflow: hidden !important;
border: none !important;
margin-top: 1.5rem !important;
margin-bottom: 1.5rem !important;
text-align: center !important;
padding: 0 1rem 1.5rem !important;
}
.alertContainer div {
text-transform: capitalize !important;
font-size: 1rem;
}
.alertContainer button {
width: 2rem;
height: 2rem;
padding: 0;
border: 0.125rem solid #011F26;
font-size: 1.5rem;
position: absolute;
right: 1rem;
top: 1rem;
background: none;
}
.shopItem .imageItem .alertContainer {
position: absolute !important;
top: 50% !important;
left: 50% !important;
z-index: 8;
width: 80% !important;
transform: translate(-50%, -50%);
padding: 0 !important;
margin: 0 !important;
max-width: 12rem;
}
.shopItem .imageItem .alertContainer .successDetails, .shopItem .imageItem .alertContainer .errorDetails {
font-size: 0.8rem;
line-height: 1.1rem;
display: block;
background-color: rgba(255, 255, 255, 0.9);
padding: 1rem 0.5rem;
width: 100%;
height: 100%;
border: 2px solid transparent;
}
.shopItem .imageItem .alertContainer .errorDetails {
border-color: #ff0000;
}
.singleProductView .actionsWrap .alertContainer {
border: 2px solid #011F26 !important;
padding: 0.5rem !important;
border-radius: 0.5rem;
}
.singleProductView .actionsWrap .alertContainer .successDetails, .singleProductView .actionsWrap .alertContainer .errorDetails {
font-size: 0.8rem;
line-height: 1.1rem;
display: block;
}
.shopItem .imageItem .modal-body .alertContainer .errorDetails {
display: none !important
}
.caption {
position: absolute;
bottom: 0;
left: 0;
font-family: 'Morn W01 Light';
color: #fff;
text-shadow: 0 0 16px #011f27;
padding: 1.5rem;
font-size: 0.8rem;
}
.captionContainer div ul {
text-transform: none !important;
font-size: 1rem;
padding-top: 0.5rem;
}
.alertContainer div ul li {
padding: 0.125rem 0;
}
/* UNSUPPORTED BROWSER WARNING */
.ie6Warning {
background: #fff;
border: 0.125rem solid #e6e6e6;
padding: 1.25rem 1.25rem 1.875rem;
position: absolute;
top: 10%;
width: 80%;
left: 10%;
z-index: 99999999;
text-align: center;
}
.ie6Warning .pageHeader, .ie6Warning .introduction {
padding-bottom: 1.25rem;
}
.ie6Warning p {
max-width: 620px;
}
.ie6Warning ul {
border: 0.125 dashed #ccc;
padding: 1.25rem 1.25rem 0.625rem;
margin: 0.375rem auto 0;
display: inline-block;
}
.ie6Warning li {
display: inline-block;
margin: 0 0.25rem 0.5rem;
}
.ie6Warning li a {
display: block;
padding: 0.375rem 1rem;
font-size: 1.125rem;
background: #e6e6e6;
font-family: arial, sans-serif;
text-decoration: none;
}
.ie6Warning li a:hover, .ie6Warning li a:focus, .ie6Warning li a:active {
background: #ccc;
color: #011F26;
}
li.offscreen:focus-within {
position: relative !important;
width: auto !important;
height: auto !important;
overflow: visible !important;
left: unset !important;
top: unset !important;
color: #011F26;
z-index: 100;
}
li.offscreen a:focus {
background: yellow;
}
/* END RESET -----------------------------------------------------------------------------------------------------------*/
/* FONTS ---------------------------------------------------------------------------------------------------------------*/
/* style */
body {
font-family: 'Morn W01 Light', arial, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
}
h1, .pseudoH1, h2, h3, h4, h5 {
font-style: normal;
font-variant: normal;
font-weight: normal;
line-height: 1.2;
font-family: 'Jazmin Alt W05 SemiBold';
}
/* size */
h1, .pseudoH1 {
font-family: 'Jazmin Alt W05 SemiBold';
font-size: 1.7rem;
text-align: center;
}
h2 {
font-size: 1.4rem;
font-family: 'Jazmin Alt W05 SemiBold';
}
@media(min-width:768px) {
h2 {
font-size: 1.5rem
}
}
/* form inputs */
input, textarea, select {
font-family: 'Morn W01 Light';
font-style: normal;
font-weight: normal;
}
/* bold */
strong, b {
font-family: 'Morn W01 Medium';
font-style: normal;
font-weight: normal;
}
/* italic */
em, i {
font-family: 'Morn W01 Light Oblique';
font-style: normal;
font-weight: normal;
}
/* bold italic */
strong em, b em, strong i, b i, em strong, em b, i strong, i b {
font-family: 'Morn W01 Medium Oblique';
font-style: normal;
font-weight: normal;
}
/* small */
small {
font-size: 0.7rem;
line-height: 1.1rem;
display: block;
}
/* placeholders */ ::-webkit-input-placeholder {
text-transform: none;
font-size: 0.9rem;
color: #011F26;
}
:-moz-placeholder {
text-transform: none;
font-size: 0.9rem;
color: #011F26;
}
::-moz-placeholder {
text-transform: none;
font-size: 0.9rem;
color: #011F26;
}
:-ms-input-placeholder {
text-transform: none;
font-size: 0.9rem;
color: #011F26;
}
:focus::-webkit-input-placeholder {
opacity: 0.2;
filter: alpha(opacity=20);
}
:focus:-moz-placeholder {
opacity: 0.2;
filter: alpha(opacity=20);
}
:focus::-moz-placeholder {
opacity: 0.2;
filter: alpha(opacity=20);
}
:focus:-ms-input-placeholder {
opacity: 0.2;
filter: alpha(opacity=20);
}
.error ::-webkit-input-placeholder {
color: #011F26;
}
.error :-moz-placeholder {
color: #011F26;
}
.error ::-moz-placeholder {
color: #011F26;
}
.error :-ms-input-placeholder {
color: #011F26;
}
/* lists */
.contentWrap ol {
margin-bottom: 1rem;
display: block;
text-align: left;
width: auto;
}
.contentWrap ol li {
list-style: none;
margin-left: 0;
margin-bottom: 0.5rem;
}
.contentWrap ol li ul, .contentWrap ol li ol {
margin-top: 0.5rem;
}
.contentWrap ol li ol li {
list-style: none;
margin-left: 1.1rem;
}
.contentWrap ol li ol li ol li {
margin-left: 1.5rem;
}
.contentWrap ul {
margin-bottom: 1rem;
display: block;
text-align: left;
width: auto;
}
.contentWrap ul li {
list-style-type: '\2014';
padding-left: 0.5rem;
margin-left: 1rem;
margin-bottom: 0.5rem;
}
.contentWrap ul li ul, .contentWrap ul li ol {
margin-top: 0.5rem;
}
/* content spacing */
.pageHeader h1, .pseudoH1 {
padding: 3rem 1rem 1.5rem;
text-transform: capitalize;
}
h2, h3, h4, h5, p {
margin-bottom: 1rem;
margin-left: auto;
margin-right: auto;
color: #011F26;
}
p:last-of-type {
margin-bottom: 0.5rem;
}
p + h1, p + h2, p + h3, p + h4, p + h5, h1 + h2, h2 + h3, h3 + h4, h4 + h5, ul + h1, ul + h2, ul + h3, ul + h4, ul + h5, ol + h1, ol + h2, ol + h3, ol + h4, ol + h5 {
padding-top: 0.5rem;
}
/* SITE STRUCTURE (sitewide) -----------------------------------------------------------------------------------------*/
html {
/* SET BASE PX FONT SIZE & LINE HEIGHT for REM */
font-size: 20px;
line-height: 1.4;
background: #fff;
position: relative;
}
body {
color: #011F26;
position: relative;
background: #fff;
opacity: 1;
}
.siteContainer {
background: #fff;
overflow: hidden;
padding-top: 3rem;
}
.outerWrapper {
min-width: 290px;
margin: 0 auto;
box-shadow: 0 0 4rem 0 rgba(0, 0, 0, 0.1);
display: block;
padding: 0;
background: #fff;
}
#form1 {
background: #f8f8f8;
}
@media(min-width:500px) {
.siteContainer {
padding-top: 3.5rem;
}
}
@media(min-width:768px) {
.siteContainer {
padding-top: 4rem;
}
}
@media(min-width:1024px) {
.siteContainer {
padding-top: 8rem;
}
}
/* LINKS (sitewide) ----------------------------------------------------------------------------------------------------*/
a:not(.btn), .nogo {
transition: all 0.2s linear 0s;
background: none;
border: none;
text-decoration: underline;
}
/* BUTTONS (sitewide) --------------------------------------------------------------------------------------------------*/
.btn, .more a, .go {
padding: 0.75rem 1.25rem 0.75rem 0;
margin: 1rem 0 0;
border-radius: 2rem;
display: inline-block;
text-align: center;
text-decoration: none;
vertical-align: middle;
cursor: pointer;
white-space: nowrap;
-webkit-appearance: none;
-moz-appearance: none;
-o-appearance: none;
background-color: transparent;
color: #eb5d4d;
line-height: 1.3;
font-family: 'Morn W01 Medium';
font-style: normal;
font-weight: normal;
letter-spacing: 0.2pt;
position: relative;
padding-left: 2.4rem;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23eb5d4d' stroke-width='4'/%3E%3C/svg%3E") 0.8rem center/0.6rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 1rem center/0rem;
background-repeat: no-repeat;
transition: 0.2s ease-in-out;
margin-left: 0;
width: auto !important;
border: none !important;
}
.btn:hover {
color: #011F26;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 0.8rem center/0.6rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0rem center/2rem;
background-repeat: no-repeat;
transition: 0.2s ease-in-out;
}
.addButton .btn {
width: auto;
padding-left: 2.5rem;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 59.78 59.78' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='48.89' cy='10.74' fill='%23eb5d4d' r='10.28'/%3E%3Cg fill='none' stroke='%23fff' stroke-width='2.74'%3E%3Cpath d='m48.89 4.06v13.37'/%3E%3Cpath d='m42.21 10.46h13.37'/%3E%3C/g%3E%3C/svg%3E") 2rem center/0rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 59.78 59.78' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m43.54 42.06-1.16-16.98-.02-.16c-.18-.97-.67-1.85-1.4-2.52-.75-.53-1.61-.86-2.52-.97h-1.75c-.01-.43-.06-.85-.13-1.27-.78-4.04-3.15-6.27-6.67-6.27s-5.9 2.23-6.68 6.28c-.07.42-.11.84-.13 1.27h-1.74c-.91.12-1.78.45-2.52.98-.73.67-1.22 1.55-1.4 2.52l-1.19 17.13c-.02.24-.12 2.37 1.48 3.28.51.33 1.1.51 1.71.54h20.87c.62-.02 1.23-.21 1.75-.54 1.6-.92 1.5-3.04 1.49-3.28m-17.96-21.44c.84-4.33 3.45-4.33 4.3-4.33s3.47 0 4.3 4.33c.05.27.07.55.09.82h-8.78c.01-.27.04-.55.08-.82m15.17 22.5c-.14.09-.29.15-.45.19h-20.83c-.16-.04-.31-.11-.45-.19-.15-.27-.22-.57-.19-.88l1.16-16.88c.07-.34.23-.67.45-.93.35-.22.74-.36 1.15-.41h1.48c.03 1.33.11 2.5.12 2.74.04.63.57 1.12 1.2 1.12h.08c.66-.04 1.17-.61 1.13-1.27 0 0 0 0 0-.01-.05-.71-.09-1.65-.11-2.59h8.8c-.03 1.04-.08 2.04-.12 2.59-.02.67.5 1.23 1.16 1.25.64.02 1.19-.46 1.25-1.1.02-.24.09-1.41.12-2.74h1.48c.41.05.8.2 1.15.41.23.27.38.59.45.93l1.16 16.87c.03.31-.04.62-.19.89' fill='%23eb5d4d'/%3E%3C/svg%3E") 0 center/2rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 1rem center/0rem;
background-repeat: no-repeat;
border-radius: 0;
transition: 0.2s ease-in-out;
margin-left: 0;
}
.addButton .btn:hover {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 59.78 59.78' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='48.89' cy='10.74' fill='%23eb5d4d' r='10.28'/%3E%3Cg fill='none' stroke='%23fff' stroke-width='2.74'%3E%3Cpath d='m48.89 4.06v13.37'/%3E%3Cpath d='m42.21 10.46h13.37'/%3E%3C/g%3E%3C/svg%3E") 0 center/2rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 59.78 59.78' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m43.54 42.06-1.16-16.98-.02-.16c-.18-.97-.67-1.85-1.4-2.52-.75-.53-1.61-.86-2.52-.97h-1.75c-.01-.43-.06-.85-.13-1.27-.78-4.04-3.15-6.27-6.67-6.27s-5.9 2.23-6.68 6.28c-.07.42-.11.84-.13 1.27h-1.74c-.91.12-1.78.45-2.52.98-.73.67-1.22 1.55-1.4 2.52l-1.19 17.13c-.02.24-.12 2.37 1.48 3.28.51.33 1.1.51 1.71.54h20.87c.62-.02 1.23-.21 1.75-.54 1.6-.92 1.5-3.04 1.49-3.28m-17.96-21.44c.84-4.33 3.45-4.33 4.3-4.33s3.47 0 4.3 4.33c.05.27.07.55.09.82h-8.78c.01-.27.04-.55.08-.82m15.17 22.5c-.14.09-.29.15-.45.19h-20.83c-.16-.04-.31-.11-.45-.19-.15-.27-.22-.57-.19-.88l1.16-16.88c.07-.34.23-.67.45-.93.35-.22.74-.36 1.15-.41h1.48c.03 1.33.11 2.5.12 2.74.04.63.57 1.12 1.2 1.12h.08c.66-.04 1.17-.61 1.13-1.27 0 0 0 0 0-.01-.05-.71-.09-1.65-.11-2.59h8.8c-.03 1.04-.08 2.04-.12 2.59-.02.67.5 1.23 1.16 1.25.64.02 1.19-.46 1.25-1.1.02-.24.09-1.41.12-2.74h1.48c.41.05.8.2 1.15.41.23.27.38.59.45.93l1.16 16.87c.03.31-.04.62-.19.89' fill='%23fff'/%3E%3C/svg%3E") 0 center/2rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0rem center/2rem;
background-repeat: no-repeat;
transition: 0.2s ease-in-out;
}
/*Nav shop button */
.shopBtn {
display: none;
}
@media(min-width:1024px) {
.shopBtn {
position: absolute;
top: 0;
right: 0;
width: calc(100vw/4 - 5px);
background-color: #011F26;
text-align: center;
border-radius: 36px 0 0 0;
height: 4rem;
display: flex;
align-items: center;
justify-content: center;
transition: 0.2s ease-in-out
}
.shopBtn a {
color: #fff !important;
font-size: 1.2rem;
text-decoration: none;
font-family: 'Morn W01 Medium';
text-transform: uppercase;
display: flex;
flex-direction: row-reverse;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.shopBtn a span {
display: block;
font-size: 0.6rem;
text-transform: capitalize;
font-family: 'Morn W01 Light';
width: 50%;
padding-right: 1rem;
position: relative;
}
.shopBtn a span:after {
content: '';
right: 14px;
top: 2px;
position: absolute;
display: block;
height: 90%;
width: 2px;
background: #427278;
opacity: 0.4;
}
.shopBtn:hover {
background-color: #eb5d4d;
transition: 0.2s ease-in-out
}
.shopBtn a:hover {
opacity: 1;
;
}
.shopBtn:hover a span:after {
background: #fff
}
}
/* FORM ELEMENTS ----------------------------------------------------------------------------------------------------*/
/* Form validation ----------------------------------------------------------------------------------------------------*/
/* alert + message */
.alertContainer div, div.error span.requiredFieldInfo {
color: #011F26;
text-transform: lowercase;
}
.form {
display: block;
padding: 0 1.5rem 3rem;
margin: 0 auto;
width: 100%;
}
.form h2 {
padding: 1rem 1rem 0 0;
}
.contact .form {
background-color: #f8f8f8;
padding-top: 2rem;
width: 85% !important;
}
/* highlight input */
div.error input, div.error select, div.error textarea, div.error input[type="text"], div.error input[type="password"], .modal-body .error .input-group .form-control {
border-left: 0.5rem solid #eb5d4d;
}
.mailingListInclude label, .checkboxStyled label {
position: relative;
left: auto;
top: auto;
width: auto;
height: auto;
overflow: visible;
}
legend {
position: absolute;
left: 0;
top: -999em;
width: 1px;
height: 1px;
overflow: hidden;
}
legend span {
display: block;
width: 100%;
text-align: center;
text-transform: uppercase;
padding: 0.5rem;
color: #555;
}
fieldset {
position: relative;
display: inline-flex;
width: 96%;
flex-direction: column;
vertical-align: top;
background-color: #f8f8f8;
padding: 1rem;
margin: 0.5rem 2%;
}
label {
font-weight: normal;
text-transform: none;
padding: 0;
margin-bottom: 0.5rem;
display: block;
text-align: left;
font-family: 'Morn W01 Medium';
font-size: 0.9rem;
}
input, textarea, select {
width: 100%;
display: block;
border: 2px solid #ddd;
background-color: #fff;
padding: 1rem;
margin-bottom: 1rem;
font-size: 0.9rem !important;
border-radius: 0.2rem;
}
.form-group .iti--inline-dropdown {
margin-bottom: 1rem;
}
.mailingListInclude label, .mailingListInclude input {
display: inline-block;
}
select {
-o-appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding-right: 3rem;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1 14h16.84l14.12 16.95 14.12-16.95h16.93l-31.04 35.91z' fill='%23000000'/%3E%3C/svg%3E");
background-position: 95% 50%;
background-size: 1rem;
width: 100%;
}
select::-ms-expand {
display: none;
}
/* remove inner shadow from inputs on mobile iOS */
textarea, input[type="text"], input[type="password"], select {
-webkit-appearance: none;
}
.form p.privacyStatement {
padding: 1rem 0 1rem;
font-size: 0.85rem;
margin: 0 auto;
text-align: left;
}
/* checkbox or radio group */
input[type=checkbox], input[type=radio] {
width: 1rem !important;
height: 1rem !important;
border-radius: 0.125rem !important;
border: 0.125rem solid #bbb !important;
background: #fff !important;
padding: 0 !important;
}
input[type=radio] {
border-radius: 0.5rem !important;
padding: 0 !important;
margin-top: 0.2rem !important;
}
.options {
display: block;
text-align: left;
}
.options input, .options input:hover, .options input:active, .options input:focus {
display: inline-block;
vertical-align: baseline;
margin: 0.2rem 0 0 0 !important;
padding: 0 !important;
}
.options label {
display: inline-block;
text-transform: none;
max-width: 90%;
vertical-align: top;
padding: 0 0 1rem;
margin: 0;
width: auto;
height: auto;
position: relative;
overflow: visible;
top: 0;
left: 0;
}
.buttonContainer {
text-align: left;
}
.buttonContainer input {
width: auto !important;
}
/* capture address */
.postCodeLookup {
width: auto;
display: inline;
}
.pcalogo, .pcafooter {
display: none !important;
}
@media(min-width:768px) {
fieldset {
width: 45%;
padding: 1.5rem;
margin: 0 2%;
}
}
@media(min-width:1024px) {
.form.threeCol fieldset {
width: 33%
}
.form.threeCol fieldset.checkboxField {
width: 100%;
align-items: flex-start;
}
.form.threeCol fieldset.checkboxField .options label {
max-width: 100%
}
.form.threeCol h2 {
text-align: left;
}
}
/* HEADER ----------------------------------------------------------------------------------------------------------*/
.phoneTop, .favTrigger {
display: none;
}
/* header and nav */
.siteHeader {
z-index: 99;
width: 100%;
min-width: 290px;
display: block;
position: absolute;
top: 0;
left: 0;
background-color: #fff;
height: 3rem;
}
.navbar-collapse {
display: none;
}
.navbar-collapse .HeaderNav {
display: flex;
padding-top: 0.5rem;
}
.navbar-collapse .HeaderNav li {
padding: 0.6rem;
position: relative
}
.navbar-collapse .HeaderNav li:hover a {
opacity: 1;
}
.navbar-collapse .HeaderNav li::after {
content: '';
height: 2px;
width: 0;
background-color: #eb5d4d;
position: absolute;
bottom: 0;
left: 0.6rem;
transition: 0.2s ease-in-out;
}
.navbar-collapse .HeaderNav li:hover::after {
width: calc(100% - 1.2rem);
transition: 0.4s ease-in-out;
}
.navbar-collapse .HeaderNav li:first-child {
margin-left: -0.6rem;
}
.navbar-collapse .HeaderNav li a {
text-transform: uppercase;
letter-spacing: 0.3pt;
text-decoration: none;
font-size: 0.7rem;
font-family: 'Morn W01 Medium';
}
.navbar-collapse .HeaderNav li.highlight a {
background-color: #eb5d4d;
color: #fff;
padding: 0.3rem 0.7rem;
border-radius: 1rem;
font-family: 'Morn W01 Light';
transition: 0.2s ease-in-out;
}
.navbar-collapse .HeaderNav li.highlight::after {
content: none;
}
.navbar-collapse .HeaderNav li.highlight:hover a {
background-color: #011F26;
transition: 0.2s ease-in-out;
}
@media(min-width:1024px) {
.burgerMenu {
display: none !important;
}
.navbar-collapse {
display: flex;
position: absolute;
top: 4rem;
left: 0;
width: 100%;
padding-left: 2rem;
height: 4rem;
}
.fixup .navbar-collapse {
position: fixed;
top: 3.5rem;
height: 80px
}
.navbar-collapseInner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4rem;
padding-left: 1.5rem;
background-color: #fff;
}
.fix .navbar-collapseInner {
top: -4rem;
}
.fixup .navbar-collapseInner {
top: 0.5rem;
transition: all 0.5s ease-in-out 0s;
}
}
@media(min-width:1100px) {
.navbar-collapse .HeaderNav li a {
font-size: 0.8rem;
}
}
.upperHeader {
position: fixed;
width: 100%;
top: 0;
right: 0;
height: 3rem;
z-index: 99997;
}
.upperHeaderInner {
position: fixed;
width: 100%;
top: 0;
right: 0;
height: 3rem;
background: #fff;
}
@media(min-width:500px) {
.upperHeader {
height: 3.5rem
}
.upperHeaderInner {
height: 3.5rem;
}
}
@media(min-width:768px) {
.upperHeader {
height: 4rem
}
.upperHeaderInner {
height: 4rem;
}
}
/* scrolling header actions */
@media(min-width:1024px) {
.upperHeader {
position: absolute;
}
.fix .upperHeader {
position: fixed;
top: -4rem;
height: 3.5rem;
}
.upperHeaderInner {
position: absolute;
}
.fix .upperHeaderInner {
top: 4rem;
height: 3.5rem;
transition: all 0.5s ease-in-out 0.05s;
}
.fix.fixup .upperHeaderInner {
height: 4rem;
transition: all 0.5s ease-in-out 0.05s;
}
}
/* logo */
.logoElements {
z-index: 9998;
width: 7rem;
height: 1.55rem;
display: block;
position: absolute;
top: 0.7rem;
left: 2rem;
}
.logoElements a {
width: 100%;
height: auto;
display: block;
}
.logoElements a img {
width: 100%;
height: auto;
margin-top: 0;
}
/* search bar */
.searchBar {
display: flex;
height: 3.5rem;
padding: 0.75rem 1rem;
z-index: 999;
}
.searchBar .searchWrapper {
display: inline-block;
overflow: hidden;
position: relative;
}
.searchBar .searchWrapper .customStyleSelectBox {
display: none;
}
.searchBar .searchWrapper .searchTerms, .searchBar .searchWrapper .go {
display: inline;
vertical-align: top;
text-align: left;
margin: 0;
}
.searchBar .searchWrapper .searchTerms {
height: 2rem;
font-size: 1rem;
background: #fff;
color: #1d1d1b;
line-height: 2.5rem;
margin: 0 1.5rem 0 0;
padding: 0.25rem 0.75rem;
width: 200px;
border-radius: 1.25rem 0 0 1.25rem;
}
.searchBar .searchWrapper .go {
width: 2rem;
height: 2rem;
background-color: #ffffff;
background-image: url('data:image/svg+xml,%3C?xml%20version%3D%221.0%22%20?%3E%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22%23404040%22%20d%3D%22M39.3,35.3l-5-5c-0.6-0.6-1.6-0.8-2.4-0.4l-1.5-1.5c3.8-5,3-12.1-2-15.9s-12.1-3-15.9,2s-3,12.1,2,15.9c4.1,3.2,9.8,3.2,13.9,0l1.5,1.5c-0.4,0.8-0.2,1.8,0.4,2.4l5,5c0.8,0.8,2.2,0.8,3,0l1-1C40.1,37.5,40.1,36.1,39.3,35.3z%20M21.4,29.9c-4.7,0-8.5-3.8-8.5-8.5s3.8-8.5,8.5-8.5s8.5,3.8,8.5,8.5l0,0C29.9,26.1,26.1,29.9,21.4,29.9z%22/%3E%3C/svg%3E');
background-repeat: no-repeat;
background-position: center center;
border-radius: 2rem;
position: absolute;
top: 0;
right: 0;
margin-left: -1rem;
text-inde: -999em;
font-size: 0;
}
@media(min-width: 370px) {
.logoElements {
width: 8.5rem;
top: 0.5rem;
}
}
@media(min-width: 400px) {
.logoElements {
width: 8rem;
top: 0.5rem;
left: 2.7rem;
}
}
@media(min-width: 500px) {
.logoElements {
width: 10rem;
top: 0.6rem;
}
}
@media(min-width: 768px) {
.logoElements {
width: 10.5rem;
top: 0.8rem;
}
}
@media(min-width: 900px) {
.logoElements {
width: 12rem;
top: 0.6rem;
}
}
@media(min-width: 1024px) {
.logoElements, .fix.fixup .logoElements {
width: 13rem;
top: 1.2rem;
left: 1.5rem;
transition: all 0.5s ease-in-out 0.05s;
}
.fix .logoElements {
top: 0.5rem;
width: 10.7rem;
height: 2.4rem;
}
.searchBar {
position: absolute;
top: -3.5rem;
left: 50%;
margin-left: -8rem;
opacity: 0;
transition: top 0s linear 0s, opacity 0.2s linear 0.2s;
}
.showNav + .searchBar {
top: 3.5rem;
opacity: 1;
transition: top 0s linear 0.2s, opacity 0.2s linear 0s;
}
}
/* burger nav */
.burgerMenu {
position: fixed;
top: 0;
left: 0;
width: 2rem;
height: 2.95rem;
cursor: pointer;
z-index: 99999;
padding: 0 0.5rem 0 0.5rem;
text-transform: uppercase;
font-size: 0.5rem;
line-height: 1;
text-align: center;
color: #001F26;
text-decoration: none !important;
margin: auto 0;
display: block;
}
@media(min-width: 400px) {
.burgerMenu {
left: 0.4rem;
}
}
@media(min-width: 500px) {
.burgerMenu {
top: 0.3rem;
}
}
@media(min-width: 768px) {
.burgerMenu {
top: 0.5rem;
}
}
.burgerMenu:not(.navShow) {}
.burgerMenu .burger-btn {
position: relative;
width: 18px;
height: 2px;
top: 1.4rem;
left: 2px;
background: #001F26;
border-radius: 0.125rem;
z-index: 99;
text-indent: -999em;
display: block;
transition: top 0.2s linear 0.2s, bottom 0.2s linear 0.2s, transform 0.2s linear 0s, background 0s linear 0.2s;
}
.burgerMenu .burger-btn:before {
content: "";
position: absolute;
width: 18px;
height: 2px;
top: -6px;
left: 0;
background: #001F26;
border-radius: 0.125rem;
transition: top 0.2s linear 0.2s, bottom 0.2s linear 0.2s, transform 0.2s linear 0s, background 0s linear 0.2s;
}
.burgerMenu .burger-btn:after {
content: "";
position: absolute;
width: 18px;
height: 2px;
bottom: -6px;
left: 0;
background: #001F26;
border-radius: 0.125rem;
transition: top 0.2s linear 0.2s, bottom 0.2s linear 0.2s, transform 0.2s linear 0s, background 0s linear 0.2s;
}
@media(min-width: 400px) {
.burgerMenu .burger-btn {
width: 1rem;
height: 0.15rem;
left: 0;
}
.burgerMenu .burger-btn:before {
width: 1rem;
height: 0.15rem;
top: -0.35rem;
}
.burgerMenu .burger-btn:after {
width: 1rem;
height: 0.15rem;
bottom: -0.35rem;
}
}
.burgerMenu .burger-btn.navShow {
background: none;
transition: top 0.2s linear 0s, bottom 0.2s linear 0s, transform 0.2s linear 0.2s, background 0s linear 0.2s;
}
.burgerMenu .burger-btn.navShow:before {
top: 0;
transform: rotate(45deg);
transition: top 0.2s linear 0s, bottom 0.2s linear 0s, transform 0.2s linear 0.2s, background 0s linear 0.2s;
}
.burgerMenu .burger-btn.navShow:after {
bottom: 0;
transform: rotate(-45deg);
transition: top 0.2s linear 0s, bottom 0.2s linear 0s, transform 0.2s linear 0.2s, background 0s linear 0.2s;
}
.burgerMenu:hover .burger-btn.navShow:before {
top: 0;
transform: rotate(45deg) scale(1.2);
}
.burgerMenu:hover .burger-btn.navShow:after {
bottom: 0;
transform: rotate(-45deg) scale(1.2);
}
.burgerMenu.hover:hover + .mobileNav {
right: 0;
width: 100%;
height: 100vh;
transition: opacity 0.3s linear 0.1s, right 0s linear 0s;
opacity: 1;
}
.navCollapse.hover:hover + .mobileNav .mobileNav li {
opacity: 1;
}
/* mobile nav*/
.mobileNav {
display: flex;
flex-direction: row;
justify-content: center;
align-items: flex-start;
align-content: flex-start;
overflow-x: hidden;
overflow-y: auto;
position: absolute;
padding: 1rem 1rem 4rem;
width: 100vw;
height: 100vh;
top: 3rem;
right: 0;
background: #ffffff;
}
.mobileNav li {
float: none;
width: 100%;
display: block;
text-align: center;
position: relative;
right: 0;
margin: 0 0 0.4rem;
}
.mobileNav li a {
font-family: 'Morn W01 Medium';
font-size: 0.95rem;
display: block;
width: 100%;
text-transform: uppercase;
text-decoration: none;
color: #404040;
font-style: normal;
font-weight: normal;
padding: 0.5rem;
}
.mobileNav li.shop {
background-color: #001f26;
border-radius: 1rem;
}
.mobileNav li.shop a {
color: #fff;
padding: 0.6rem 3rem 0.8rem;
font-size: 0.6rem;
}
.mobileNav li.shop a::before {
content: 'SHOP';
display: block;
padding-bottom: 0.2rem;
font-size: 1rem;
}
@media (min-width: 560px) {
.mobileNav {
top: 3.5rem;
}
.mobileNav li a {
font-size: 1rem;
}
}
@media (min-width: 768px) {
.mobileNav {
top: 4rem;
padding-top: 1.5rem;
padding-bottom: 5rem;
}
}
.mobileNav li a:hover {
background: none;
}
.mobileNav.showNav {
opacity: 1;
right: 0;
height: 100vh;
width: 100%;
transition: opacity 0.2s linear 0s, height 0s linear 0s, width 0s linear 0s;
}
.mobileNav.hideNav {
opacity: 0;
right: 0;
padding: 0;
height: 0;
width: 0;
transition: opacity 0.2s linear 0s, height 0s linear 0.2s, width 0s linear 0.2s;
}
.mobileNav.hover:hover {
opacity: 1;
right: 0;
width: 100%;
height: 100vh;
transition: opacity 0.3s linear 0.1s, right 0s linear 0s;
}
.mobileNav.hover:hover .mobileNav li {
opacity: 1;
}
.mobileNav.hover:hover .searchBar {
opacity: 1;
}
.mobileNav.hover:hover .quickNav {
opacity: 1;
}
.mobileNav:empty {
display: none;
}
.mobileNav:empty + .navCollapse {
display: none;
}
.headerAccountNav, .contactHeadNav {
position: absolute;
z-index: 100;
top: 0;
right: 7rem;
height: 100%;
align-items: center;
display: none;
}
.contactHeadNav {
right: 14rem;
}
.headerAccountNav a, .contactHeadNav a {
color: #011F26;
text-decoration: none;
font-size: 0.75rem;
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.3pt;
display: block;
line-height: 4rem;
}
.headerAccountNav a:hover, .contactHeadNav a:hover, .headerAccountNav a:active, .contactHeadNav a:active {
opacity: 1;
color: #eb5d4d !important;
}
.headerAccountNav a:visited, .contactHeadNav a:visited {
color: #011F26;
}
.basket.basketInclude {
display: block;
width: 2.2rem;
height: 100%;
position: absolute;
top: -2px;
right: 0;
z-index: 100;
background-size: 1.5rem 1.5rem !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
text-indent: -99999em;
cursor: pointer;
}
.basket.basketInclude .basketIncludeWrapper, .basket.basketInclude .basketIncludeWrapper a {
display: block;
width: 100%;
height: 100%;
}
.basket.basketInclude {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 35 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m31.96 32.91-1.16-16.98-.02-.16c-.18-.97-.67-1.85-1.4-2.52-.75-.53-1.61-.86-2.52-.97h-1.75c-.01-.43-.06-.85-.13-1.27-.78-4.04-3.15-6.27-6.67-6.27s-5.9 2.23-6.68 6.28c-.07.42-.11.84-.13 1.27h-1.74c-.91.12-1.78.45-2.52.98-.73.67-1.22 1.55-1.4 2.52l-1.19 17.13c-.02.24-.12 2.37 1.48 3.28.51.33 1.1.51 1.71.54h20.87c.62-.02 1.23-.21 1.75-.54 1.6-.92 1.5-3.04 1.49-3.28m-17.94-21.45c.84-4.33 3.45-4.33 4.3-4.33s3.47 0 4.3 4.33c.05.27.07.55.09.82h-8.78c.01-.27.04-.55.08-.82m15.17 22.5c-.14.09-.29.15-.45.19h-20.82c-.16-.04-.31-.11-.45-.19-.15-.27-.22-.57-.19-.88l1.16-16.88c.07-.34.23-.67.45-.93.35-.22.74-.36 1.15-.41h1.48c.03 1.33.11 2.5.12 2.74.04.63.57 1.12 1.2 1.12h.08c.66-.04 1.17-.61 1.13-1.27 0 0 0 0 0-.01-.05-.71-.09-1.65-.11-2.59h8.8c-.03 1.04-.08 2.04-.12 2.59-.02.67.5 1.23 1.16 1.25.64.02 1.19-.46 1.25-1.1.02-.24.09-1.41.12-2.74h1.48c.41.05.8.2 1.15.41.23.27.38.59.45.93l1.16 16.87c.03.31-.04.62-.19.89' fill='%23001f26'/%3E%3Cpath d='m3.39 3.12h29.42v34.67h-29.42z' fill='none'/%3E%3C/svg%3E");
}
.basketInclude .BasketCount {
display: block;
padding: 0 6px;
width: 0.8rem;
height: 0.8rem;
line-height: 24px;
text-align: center;
border-radius: 1rem;
background: #eb5d4d;
color: #fff;
position: absolute;
font-size: 12px;
top: 0.6rem;
right: 0.3rem;
}
div.currency {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.14'%3E%3Cpath d='m35.68 20.86c0 7.99-6.48 14.46-14.46 14.46s-14.46-6.48-14.46-14.46 6.48-14.46 14.46-14.46 14.46 6.48 14.46 14.46z'/%3E%3Cpath d='m6.76 20.86h28.93'/%3E%3Cpath d='m21.22 6.39c3.39 4.07 5.28 9.17 5.36 14.46-.08 5.29-1.97 10.4-5.36 14.46-3.39-4.07-5.28-9.17-5.36-14.46.08-5.29 1.97-10.4 5.36-14.46z'/%3E%3C/g%3E%3C/svg%3E");
right: 4.4rem;
display: block;
width: 2.2rem;
height: 100%;
position: absolute;
top: 0;
z-index: 999;
background-size: 1.5rem 1.5rem !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
text-indent: -99999em;
cursor: pointer;
}
div.currency.currencypopup .currencyIntro {
display: none !important;
}
div.currency .currencyPound, div.currency .currencyEuro, div.currency .currencyDollar {
display: block;
width: 2.5rem;
border-radius: 50%;
right: 4px;
z-index: 100;
background-size: 1.5rem 1.5rem !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
text-indent: -99999em;
cursor: pointer;
background-color: #f8f8f8 !important;
box-shadow: 0 1px 2px -1px #011F26;
opacity: 0;
transition: 0.4s ease-in-out;
position: absolute;
top: 90px;
height: 0;
}
div.currency .currencyPound a, div.currency .currencyEuro a, div.currency .currencyDollar a {
display: block;
width: 2.5rem !important;
height: 2.5rem !important;
font-family: 'Jazmin Alt W05 SemiBold' !important;
}
div.currency:hover .currencyPound, div.currency:hover .currencyEuro, div.currency:hover .currencyDollar, div.currency:active .currencyPound, div.currency:active .currencyEuro, div.currency:active .currencyDollar {
opacity: 1;
transition: 0.4s ease-in-out;
top: 55px;
transform: scale(1);
height: 2.5rem;
}
div.currency .currencyPound {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12.58 31.75v-3.55h2.37v-5.28h-2.37v-2.88h2.37v-3.94c0-1.98.71-3.67 2.13-5.07s3.12-2.1 5.1-2.1 3.65.7 5.06 2.1 2.11 3.09 2.11 5.07h-3.78c0-.96-.33-1.78-.99-2.46s-1.46-1.02-2.4-1.02-1.77.34-2.43 1.02-.99 1.5-.99 2.46v3.94l7.78-.03v2.91h-7.78v5.28h10.59v3.55z' fill='%23001f26'/%3E%3C/svg%3E");
}
div.currency .currencyPound.active {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12.58 31.75v-3.55h2.37v-5.28h-2.37v-2.88h2.37v-3.94c0-1.98.71-3.67 2.13-5.07s3.12-2.1 5.1-2.1 3.65.7 5.06 2.1 2.11 3.09 2.11 5.07h-3.78c0-.96-.33-1.78-.99-2.46s-1.46-1.02-2.4-1.02-1.77.34-2.43 1.02-.99 1.5-.99 2.46v3.94l7.78-.03v2.91h-7.78v5.28h10.59v3.55z' fill='%23eb5d4d'/%3E%3C/svg%3E");
}
div.currency:hover .currencyPound, div.currency:active .currencyPound {
right: 62px;
}
div.currency .currencyEuro {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m22.07 30.71c-2.52 0-4.7-.7-6.53-2.09s-3.05-3.29-3.67-5.69h-2.95v-2.01h2.6c-.06-.45-.09-.94-.09-1.46s.03-.98.09-1.46h-2.6v-2.01h2.95c.62-2.42 1.84-4.31 3.66-5.69 1.82-1.37 4-2.06 6.54-2.06 2.15 0 4.05.51 5.7 1.52s2.9 2.43 3.75 4.25l-3.13 1.8c-.54-1.32-1.36-2.36-2.48-3.1s-2.4-1.12-3.84-1.12-2.77.39-3.86 1.18c-1.08.79-1.84 1.86-2.28 3.22h6.14v2.01h-6.91c-.08.41-.12.9-.12 1.46s.04 1.04.12 1.46h6.91v2.01h-6.14c.43 1.39 1.19 2.46 2.28 3.24 1.08.77 2.37 1.16 3.86 1.16s2.73-.37 3.84-1.12c1.12-.74 1.94-1.78 2.48-3.1l3.13 1.83c-.87 1.82-2.12 3.23-3.77 4.25s-3.54 1.52-5.69 1.52z' fill='%23001f26'/%3E%3C/svg%3E");
}
div.currency .currencyEuro.active {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m22.07 30.71c-2.52 0-4.7-.7-6.53-2.09s-3.05-3.29-3.67-5.69h-2.95v-2.01h2.6c-.06-.45-.09-.94-.09-1.46s.03-.98.09-1.46h-2.6v-2.01h2.95c.62-2.42 1.84-4.31 3.66-5.69 1.82-1.37 4-2.06 6.54-2.06 2.15 0 4.05.51 5.7 1.52s2.9 2.43 3.75 4.25l-3.13 1.8c-.54-1.32-1.36-2.36-2.48-3.1s-2.4-1.12-3.84-1.12-2.77.39-3.86 1.18c-1.08.79-1.84 1.86-2.28 3.22h6.14v2.01h-6.91c-.08.41-.12.9-.12 1.46s.04 1.04.12 1.46h6.91v2.01h-6.14c.43 1.39 1.19 2.46 2.28 3.24 1.08.77 2.37 1.16 3.86 1.16s2.73-.37 3.84-1.12c1.12-.74 1.94-1.78 2.48-3.1l3.13 1.83c-.87 1.82-2.12 3.23-3.77 4.25s-3.54 1.52-5.69 1.52z' fill='%23eb5d4d'/%3E%3C/svg%3E");
}
div.currency:hover .currencyEuro, div.currency:active .currencyEuro {
right: 4px;
}
div.currency .currencyDollar {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m19.85 34.73v-2.46c-1.45-.17-2.76-.62-3.92-1.34s-2.05-1.72-2.67-2.98l2.5-2.24c.53 1.05 1.34 1.88 2.42 2.51s2.2.93 3.38.91c1.22 0 2.22-.28 3.01-.83s1.18-1.29 1.18-2.21c0-1.39-1.12-2.41-3.36-3.07l-3.71-1.15c-1.43-.45-2.6-1.18-3.52-2.21-.92-1.02-1.38-2.26-1.38-3.71 0-1.73.57-3.16 1.71-4.3s2.6-1.84 4.37-2.1v-2.53h3.23v2.5c2.41.26 4.33 1.38 5.76 3.36l-2.69 2.21c-1.15-1.62-2.72-2.43-4.7-2.43-.98 0-1.86.27-2.62.82-.77.54-1.15 1.31-1.15 2.29 0 1.37.83 2.29 2.5 2.78l4.35 1.34c1.6.49 2.86 1.23 3.78 2.21s1.38 2.17 1.38 3.55c0 1.71-.61 3.16-1.82 4.35-1.22 1.2-2.81 1.95-4.77 2.27v2.46h-3.23z' fill='%23001f26'/%3E%3C/svg%3E");
}
div.currency .currencyDollar.active {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m19.85 34.73v-2.46c-1.45-.17-2.76-.62-3.92-1.34s-2.05-1.72-2.67-2.98l2.5-2.24c.53 1.05 1.34 1.88 2.42 2.51s2.2.93 3.38.91c1.22 0 2.22-.28 3.01-.83s1.18-1.29 1.18-2.21c0-1.39-1.12-2.41-3.36-3.07l-3.71-1.15c-1.43-.45-2.6-1.18-3.52-2.21-.92-1.02-1.38-2.26-1.38-3.71 0-1.73.57-3.16 1.71-4.3s2.6-1.84 4.37-2.1v-2.53h3.23v2.5c2.41.26 4.33 1.38 5.76 3.36l-2.69 2.21c-1.15-1.62-2.72-2.43-4.7-2.43-.98 0-1.86.27-2.62.82-.77.54-1.15 1.31-1.15 2.29 0 1.37.83 2.29 2.5 2.78l4.35 1.34c1.6.49 2.86 1.23 3.78 2.21s1.38 2.17 1.38 3.55c0 1.71-.61 3.16-1.82 4.35-1.22 1.2-2.81 1.95-4.77 2.27v2.46h-3.23z' fill='%23eb5d4d'/%3E%3C/svg%3E");
}
div.currency:hover .currencyDollar, div.currency:active .currencyDollar {
right: -54px;
}
div.currency.currencypopup {
position: fixed;
margin: 0 auto;
top: 50% !important;
left: 50%;
width: 15rem !important;
height: 14rem;
z-index: 100000;
right: auto;
background-image: none;
background-color: white;
border: 2px solid #f8f8f8;
transform: translate(-7.5rem, -6rem);
text-indent: 0 !important;
-webkit-box-shadow: 1px 10px 16px -10px rgba(0, 0, 0, 0.75);
-moz-box-shadow: 1px 10px 16px -10px rgba(0, 0, 0, 0.75);
box-shadow: 1px 10px 16px -10px rgba(0, 0, 0, 0.75);
}
div.currency.currencypopup .currencyIntro {
display: block !important;
text-align: center;
padding: 1.5rem 1.5rem 0;
}
div.currency.currencypopup .currencyIntro p {
font-size: 0.75rem;
}
div.currency.currencypopup .currencyIntro p.popupHeader {
font-family: 'Jazmin Alt W05 SemiBold';
font-size: 1.1rem;
padding-bottom: 0.5rem;
margin-bottom: 0;
}
div.currency.currencypopup .currencyPound, div.currency.currencypopup .currencyEuro, div.currency.currencypopup .currencyDollar {
width: 3rem;
height: 3rem;
background-color: #f8f8f8 !important;
display: block;
border-radius: 50%;
top: 9.5rem;
right: auto;
left: 1.75rem;
z-index: 100;
background-size: 2rem 2rem !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
text-indent: -99999em;
cursor: pointer;
box-shadow: none;
opacity: 1;
transition: 0.4s ease-in-out;
position: absolute;
}
div.currency.currencypopup .currencyEuro {
left: 5.85rem;
}
div.currency.currencypopup .currencyDollar {
left: 10rem;
}
div.currency.currencypopup .currencyPound a, div.currency.currencypopup .currencyEuro a, div.currency.currencypopup .currencyDollar a {
display: block;
width: 3rem !important;
height: 3rem !important;
}
@media(min-width:500px) {
.basketInclude .BasketCount {
top: 0.85rem;
right: 0.55rem;
}
div.currency:hover .currencyPound, div.currency:hover .currencyEuro, div.currency:hover .currencyDollar, div.currency:active .currencyPound, div.currency:active .currencyEuro, div.currency:active .currencyDollar {
top: 65px;
}
}
@media(min-width:768px) {
div.currency {
right: 360px;
}
.headerAccountNav, .contactHeadNav {
display: block;
}
@media(min-width:500px) {
.basketInclude .BasketCount {
top: 1.1rem;
}
}
}
@media(min-width:840px) {
.basket.basketInclude, div.currency {
width: 4rem;
}
div.currency {
top: 0 !important;
}
div.currency .currencyPound, div.currency .currencyEuro, div.currency .currencyDollar, div.currency:hover .currencyPound, div.currency:hover .currencyEuro, div.currency:hover .currencyDollar, div.currency:active .currencyPound, div.currency:active .currencyEuro, div.currency:active .currencyDollar {
background-color: #fff !important;
border-radius: 0;
position: absolute;
top: 0;
display: block;
opacity: 1;
background-size: 1.4rem 1.4rem !important;
box-shadow: none;
height: 100%;
}
div.currency .currencyPound, div.currency:hover .currencyPound {
right: 5rem;
}
div.currency .currencyEuro, div.currency:hover .currencyEuro {
right: 2.5rem
}
div.currency .currencyDollar, div.currency:hover .currencyDollar {
right: 0;
}
div.currency .currencyPound a, div.currency .currencyEuro a, div.currency .currencyDollar a {
height: 100% !important;
}
div.currency.currencypopup .currencyPound, div.currency.currencypopup .currencyEuro, div.currency.currencypopup .currencyDollar, div.currency.currencypopup:hover .currencyPound, div.currency.currencypopup:hover .currencyEuro, div.currency.currencypopup:hover .currencyDollar, div.currency.currencypopup:active .currencyPound, div.currency.currencypopup:active .currencyEuro, div.currency.currencypopup:active .currencyDollar {
background-color: #f8f8f8 !important;
border-radius: 50%;
height: 3rem;
top: 9.5rem;
background-size: 2rem 2rem !important;
}
}
div.currency.currencypopup .currencyPound:hover, div.currency.currencypopup .currencyEuro:hover, div.currency.currencypopup .currencyDollar:hover {
background-size: 2.4rem 2.4rem !important;
}
@media(min-width:1024px) {
.fix .headerAccountNav a, .fix .contactHeadNav a {
line-height: 3.4rem;
transition: all 0.5s ease-in-out 0.05s;
}
.fix.fixup .headerAccountNav a, .fix.fixup .contactHeadNav a {
line-height: 4rem;
transition: all 0.5s ease-in-out 0.05s;
}
}
/* GOOGLE SEARCH ----------------------------------------------------------------------------------------------------------*/
/* search button */
.searchTrigger {
width: 2.2rem;
height: 100%;
position: absolute;
top: 0;
right: 2.2rem;
z-index: 100;
}
.searchTrigger .searchInner {
width: 2.2rem;
height: 100%;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m33.69 30.22-5.6-5.6c1.33-1.87 2.12-4.16 2.12-6.63 0-6.33-5.15-11.48-11.48-11.48s-11.48 5.15-11.48 11.48 5.15 11.48 11.48 11.48c2.57 0 4.93-.86 6.85-2.29l5.57 5.57c.35.35.81.53 1.27.53s.92-.18 1.27-.53c.7-.7.7-1.84 0-2.54zm-23.66-12.23c0-4.8 3.9-8.7 8.7-8.7s8.7 3.9 8.7 8.7-3.9 8.7-8.7 8.7-8.7-3.9-8.7-8.7z' fill='%23001f26'/%3E%3C/svg%3E");
;
background-size: 1.6rem 1.6rem !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
text-indent: -99999em;
cursor: pointer;
}
@media(min-width:400px) {
.basket.basketInclude, .searchTrigger, .searchTrigger .searchInner, div.currency {
width: 2.5rem !important;
}
.searchTrigger {
right: 2.5rem;
}
div.currency {
right: 5rem;
}
}
@media(min-width:500px) {
.basket.basketInclude, .searchTrigger, .searchTrigger .searchInner, div.currency {
width: 3rem !important;
}
.searchTrigger {
right: 3rem;
}
div.currency {
right: 6rem;
}
}
@media(min-width:768px) {
div.currency {
right: 19rem;
}
}
/* search overlay */
.modal {
background-color: #fff;
}
.modal, .modal-header, .modal-header .close {
background-color: #f8f8f8;
}
.modal {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 99999;
display: none;
overflow: auto;
-webkit-overflow-scrolling: touch;
outline: 0;
text-align: center;
width: 100%
}
.modal-backdrop.in {
filter: alpha(opacity=50);
opacity: .5
}
.modal-backdrop.fade {
filter: alpha(opacity=0);
opacity: 0
}
.fade.in {
opacity: 1
}
.modal-backdrop {
position: absolute;
top: 0;
right: 0;
left: 0;
background-color: none;
}
.modal-dialog {
width: 100%;
margin: 0;
}
.modal-content {
width: 100%;
margin: 0 auto;
position: relative;
z-index: 99999;
}
.modal-header {
min-height: 3.5rem;
padding: 0;
padding-bottom: 2rem;
}
.modal-footer {
padding: 1.5rem 2.5rem 2rem;
text-align: center;
border-top: none;
}
.modal-footer .deliveryTerms, .shippingCalculator .deliveryTerms {
font-size: 0.7rem;
}
.modal-body {
width: 100%;
padding: 2rem 2.5rem 0;
margin: 0 auto;
}
.modal-body .deliveryInformation .contentHeader h3 {
border: 2px solid #011F26;
padding: 1rem;
font-family: 'Morn W01 DemiBold';
margin-top: 1rem;
margin-bottom: 1rem;
font-size: 1rem;
}
.modal-body .titleWrap h1, .modal-body .titleWrap {
padding-bottom: 1rem;
}
.modal-body .titleWrap h1 {
text-align: center;
font-size: 1.6rem;
text-transform: capitalize;
}
.modal-header .close, .video-embed_component .close, .videoPopup.open .close {
background-image: url(data:image/svg+xml,%3Csvg%20fill%3D%22%23000000%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z%22/%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22/%3E%0A%3C/svg%3E);
width: 3rem;
height: 3rem;
text-indent: -9999em;
background-position: 50% !important;
background-size: 2rem 2rem !important;
background-repeat: no-repeat !important;
float: right;
border: none;
margin: 1rem;
background-color: #fff;
border-radius: 2rem;
}
.modal-header .close:hover {}
.modal-body .form-control {
margin-top: -0.125rem;
padding: 0.5rem 1rem;
height: 3rem;
border: none;
border-radius: 0.4rem !important;
box-shadow: none;
font-size: 1.25rem;
}
.modal-body .viewPrev {
padding-top: 1.5rem;
text-align: center;
text-decoration: underline;
cursor: pointer;
color: #011F26;
font-size: 0.8rem;
}
.modal-body label {
text-align: center;
}
.basketTotals .shippingCalculator .modal-body .btn {
font-size: 0.9rem !important;
}
.modal-body .button {
border: none;
color: #fff;
height: 3rem;
line-height: 1.5rem;
text-align: center;
font-size: 1.5rem;
border-radius: 0 0.4rem 0.4rem 0;
margin-top: -0.125rem;
padding: 0 1rem 0;
background: #011F26;
width: 3.5rem;
background-position: 50% !important;
background-repeat: no-repeat !important;
background-size: 30px 30px !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 48'%3E%3Cpath fill='%23ffffff' d='M6.94,32.11A17.09,17.09,0,0,1,31.11,7.94a16.75,16.75,0,0,1,2.57,20.62.71.71,0,0,0,.1.86l8.72,8.72c1.73,1.73,2.14,4.16.61,5.7l-.27.27c-1.54,1.53-4,1.12-5.7-.61l-8.7-8.7a.74.74,0,0,0-.88-.12A16.75,16.75,0,0,1,6.94,32.11ZM28,29a12.63,12.63,0,1,0-17.86,0A12.63,12.63,0,0,0,28,29Z'/%3E%3C/svg%3E");
transition: all 0.2s linear 0s;
}
.modal-body .button:hover {
opacity: 0.8;
transition: all 0.2s linear 0s;
}
.productNotification .modal-body .button {
background-image: none;
width: 6rem
}
.modal-body .infoBlock {
padding-top: 2.5rem;
}
.modal-body .infoBlock p {
background: #D6D6D6;
padding: 1rem 2rem;
text-align: center;
max-width: none;
border-radius: 0.25rem;
color: #011F26;
font-size: 1rem;
margin-bottom: 1rem;
display: inline-block;
width: auto;
}
.modal-body .productsInclude {
background: none;
border: none;
padding: 0
}
.modal-body .infoBlock a {
text-decoration: underline !important
}
.modal-body .form-group {
margin-bottom: 1rem;
max-width: 600px;
margin: 0 auto;
position: relative
}
.modal-body .input-group {
position: relative;
display: table;
border-collapse: separate;
max-width: 700px;
margin: 0 auto;
width: 100%;
}
.modal-body .input-group .form-control, .modal-body .input-group-btn {
display: table-cell
}
.modal-body .input-group .form-control {
position: relative;
z-index: 2;
float: left;
width: 100%;
margin-bottom: 0;
border-radius: 0.4rem 0 0 0.4rem !important;
}
.modal-body .input-group-btn {
position: relative;
font-size: 1rem;
white-space: nowrap;
width: 1%;
vertical-align: middle
}
.modal-body .input-group-btn:last-child > .button {
margin-left: -0.1rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0
}
.fade {
opacity: 0;
-webkit-transition: opacity .15s linear;
-o-transition: opacity .15s linear;
transition: opacity .15s linear
}
.fade.in {
opacity: 1
}
/* search results */
.modal-body .productView .row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
align-content: flex-start;
}
.modal-body .productView .shopItem {
background: #fff;
margin: 1rem auto;
width: 300px;
padding: 1.5rem;
}
.modal-body .productView .shopItem h3.SearchResultTitle {
margin: 0 0 1rem;
}
.modal-body .productView .shopItem .SearchResultText {
padding: 0;
font-size: 1rem;
min-height: 0;
line-height: 1.4
}
.modal-body .productView .shopItem a.SearchResultLink {
text-decoration: none;
text-transform: none;
font-family: 'Morn W01 Light';
}
.shipCalculator .modal-body {
max-width: 870px !important;
margin-left: auto;
margin-right: auto;
}
.shipCalculator .modal-footer {
max-width: 820px !important;
margin-left: auto;
margin-right: auto;
}
@media (min-width: 640px) {
.modal-body .productView .row {
align-items: stretch;
}
.modal-body .productView .shopItem {
margin: 1rem;
}
}
@media (min-width: 768px) {
.modal-body {
padding: 2rem 5rem 1rem 5rem;
}
.modal-footer {
padding-left: 5rem;
padding-right: 5rem;
}
.modal-body .form-control {
height: 3.5rem;
padding: 0.5rem 1.5rem;
}
.modal-body .button {
height: 3.5rem;
font-size: 2rem;
width: 4.5rem;
cursor: pointer
}
}
/* COMPONENTS ----------------------------------------------------------------------------------------------------------*/
/* structure */
.components {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: stretch;
align-content: flex-start;
text-align: center;
height: auto;
-ms-flex: 0 0 auto !important;
}
/* parent */
.wrap {
flex-direction: column;
position: relative;
width: 100%;
text-align: center;
height: auto;
-ms-flex: 0 0 auto !important;
}
.remove-space-above {
padding-top: 1px !important;
margin-top: 0 !important;
}
.remove-space-below {
padding-bottom: 1px !important;
margin-bottom: 0 !important;
}
.page-header_component.compact + .component-group-begin_component.two-column.remove-space-above, .page-header_component.condensed + .component-group-begin_component.two-column.remove-space-above {
padding-top: 0 !important;
margin-top: -3px !important;
}
@media (min-width: 768px) {
.page-header_component.compact + .component-group-begin_component.two-column.remove-space-above, .page-header_component.condensed + .component-group-begin_component.two-column.remove-space-above {
margin-top: -1px !important;
}
}
/* inner + standard elements */
.wrapInner {
width: 100%;
margin: 0 auto;
position: relative;
text-align: left;
display: block;
z-index: 2;
-ms-flex: 0 0 auto;
}
.wrapInner .titleWrap {
padding: 0 0 1.5rem 0;
}
.wrapInner .titleWrap .sectionTitle {
margin-bottom: 0;
}
.wrapInner .introWrap {
padding: 0 0 1.5rem 0;
}
.wrapInner .introWrap .sectionIntro {
margin: 0;
font-size: 1.2rem;
}
.wrapInner .contentWrap {
padding: 0 0 0.5rem;
}
.wrapInner .imageWrap .singleImage, .full .wrapInner .imageWrap .multiImage {
max-width: none;
height: 100%;
width: 100%;
min-height: calc(100vw/2);
}
.wrapInner .imageWrap .multiImageContainer + .singleImageWrap {
display: none;
}
/* button */
.wrapInner .linkWrap {
padding: 0 0 1rem;
}
.wrapInner .linkWrap .btn {
white-space: normal;
text-align: center;
position: relative;
}
/* download */
.wrapInner .documentWrap {
padding: 0 0 1rem;
text-align: left;
}
.wrapInner .documentWrap .icon {
display: block;
font-size: 1rem;
padding: 1rem 4rem 1rem 1.5rem;
border-radius: 3rem;
text-decoration: none;
background-repeat: no-repeat;
background-position: 95% 50%;
background-size: 2.5rem;
margin-bottom: 0.5rem;
color: rgba(0, 0, 0, 1);
border: 2px solid #011F26;
background-image: url('data:image/svg+xml,%3C?xml%20version%3D%221.0%22%20?%3E%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22%23011F26%22%20d%3D%22M35,29.7v4H15v-4c0-1.1-0.9-2-2-2l0,0c-1.1,0-2,0.9-2,2v6c0,1.1,0.9,2,2,2h24c1.1,0,2-0.9,2-2v-6c0-1.1-0.9-2-2-2l0,0C35.9,27.7,35,28.6,35,29.7z%20M27,21.4v-8c0-1-0.9-1.9-1.9-1.9h-0.2c-1,0-1.9,0.9-1.9,1.9v8.1h-3.9c-0.6,0-1,0.4-1,1c0,0.2,0.1,0.4,0.2,0.6l5.9,7.4c0.3,0.4,1,0.5,1.4,0.2c0.1-0.1,0.1-0.1,0.2-0.2l5.9-7.4c0.3-0.4,0.2-1.1-0.2-1.4c-0.2-0.1-0.4-0.2-0.6-0.2H27V21.4z%22/%3E%3C/svg%3E');
}
@media (min-width: 768px) {
.wrapInner .documentWrap .icon {
background-position: 98% 50%;
}
}
/* embedded */
.wrapInner .embedded {
height: 0;
position: relative;
max-width: 1200px;
margin: 0 auto;
padding-top: 56%;
width: 90%;
}
.wrapInner .embedded iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
/* WYSIWYG Video */
.embedVideo {
position: relative;
height: 0;
padding-bottom: 56%;
margin-bottom: 1.5rem !important;
margin-top: 2.5rem !important;
display: block;
}
.embedVideo iframe {
position: absolute;
width: 100%;
height: 100%;
left: 0;
max-width: 100%;
}
/* WIDTHS ----------------------------------------------------------------------------------------------------------*/
.half {
width: 100%;
padding: 0.5rem 2rem;
}
.third {
width: 100%;
padding: 0.5rem 2rem;
}
@media (min-width: 768px) {
.half {
width: 50%;
padding: 0;
}
.third {
width: 50%;
padding: 0;
}
}
@media (min-width: 1024px) {
.half {
padding: 1.5rem;
}
.third {
width: 33.333333%;
padding: 1.5rem;
}
}
/* COLUMNS ----------------------------------------------------------------------------------------------------------*/
.columnWrap {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
align-content: center;
text-align: center;
padding: 0;
height: auto;
-ms-flex: 0 0 auto !important;
}
.columnWrap .column {
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
text-align: left;
padding: 0;
height: auto;
-ms-flex: 0 0 auto !important;
width: 100%;
}
.grey .columnWrap {
align-items: center;
}
.full .columnWrap .column {
margin: 0 auto;
}
.wrapInner .textWrap, .wrapInner .contentContainer {
margin: 0 auto;
padding: 0;
}
/*Needed for content images left-right */
@media (min-width: 768px) {
.full .columnWrap .column {
width: 50%;
}
}
@media (min-width: 1024px) {
.columnWrap {
align-items: center;
}
}
@media (min-width: 1180px) {
.columnWrap .innerContentWrapper {
max-width: 390px;
margin-left: auto;
margin-right: auto;
}
}
.content-images_component.full.text-only .columnWrap .innerContentWrapper {
max-width: none;
}
/* TEXT ALIGN ---------------------------------------------------------------------------------------------------------*/
.columnWrap .column * {
-ms-flex: 0 0 auto;
}
.columnWrap * {
-ms-flex: 0 0 auto;
}
.align-left .wrapInner {
text-align: left;
}
.align-left .columnWrap .column {
text-align: left;
}
.align-center .wrapInner {
text-align: center;
}
.align-center .columnWrap .column {
text-align: center;
}
/* TEXT POSITION -------------------------------------------------------------------------------------------------------*/
/* display full width media first on mobile */
.full.position-left .columnWrap .textWrap {
order: 2;
}
.full.position-left .columnWrap .imageWrap, .full.position-left .columnWrap .embedWrap {
order: 1;
}
/* now display as per CMS for full width block */
@media (min-width: 768px) {
.full.position-left .columnWrap .textWrap {
order: 1;
}
.full.position-left .columnWrap .imageWrap, .full.position-left .columnWrap .embedWrap {
order: 2;
}
}
/* right text */
.position-right .columnWrap .textWrap {
order: 2;
}
.position-right .columnWrap .imageWrap, .position-right .columnWrap .embedWrap {
order: 1;
}
@media (min-width: 768px) {
.full.position-right .columnWrap .textWrap {
order: 2;
}
.full.position-right .columnWrap .imageWrap, .full.position-right .columnWrap .embedWrap {
order: 1;
}
}
/* IMAGES --------------------------------------------------------------------------------------------------------------*/
.wrapInner .imageWrap .imageContainer .singleImageWrap img {
object-fit: cover
}
.wrapInner .imageWrap .imageContainer .multiImageContainer .multiImageWrap img {
object-fit: cover;
}
/* multi-image slide */
.wrapInner .imageWrap .imageContainer .multiImageContainer .slide {
opacity: 0;
transition: opacity 0.15s ease-out;
}
.wrapInner .imageWrap .imageContainer .multiImageContainer .slide.active {
opacity: 1;
transition: opacity 0.4s ease-in 0.3s;
}
/* no image */
.text-only .columnWrap .imageWrap, .page-title.text-only .imageContainer {
display: none !important;
}
/*PAGE HEADER ------------------------------------------------------------------------------------------ */
.page-header_component {
margin: 1px 0;
}
.page-header_component .wrapInner {
display: grid !important;
grid-template-areas:
"title title ."
"intro intro intro"
"image image image"
"content content content";
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(4);
position: relative;
overflow: hidden;
padding: 0 !important;
grid-gap: 2px;
}
/* sections */
.page-header_component .wrapInner .titleWrap {
grid-area: title;
padding: 3rem 1rem 0.75rem 2rem;
background-color: #001F26;
display: flex;
align-items: center;
justify-content: flex-start;
min-height: 9rem;
}
.page-header_component .wrapInner .titleWrap h1 {
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.2rem;
font-size: 0.95rem;
line-height: 1.5;
margin: 0;
color: #fff;
text-align: left;
}
.page-header_component .wrapInner .introWrap {
grid-area: intro;
padding: 2rem 2rem 2.5rem;
display: flex;
align-items: center;
}
.page-header_component .wrapInner .contentWrap {
grid-area: content;
padding: 2.5rem;
display: flex;
align-items: center;
}
.page-header_component .wrapInner .imageWrap {
grid-area: image;
position: relative;
}
.page-header_component .wrapInner .imageWrap span {
position: absolute;
display: block;
height: 100%;
width: 2px;
background: #fff;
z-index: 2;
}
.page-header_component .wrapInner .imageWrap .lineOne {
left: 33.2%;
}
.page-header_component .wrapInner .imageWrap .lineTwo {
left: 66.6666666%;
}
.page-header_component .wrapInner .imageWrap .lineThree {
width: 100%;
height: 2px;
display: block;
top: calc(100vw/3);
}
.page-header_component .wrapInner .imageWrap .singleImageWrap {
height: calc(100vw /3*2);
width: 100%;
}
/*No image*/
.page-header_component.no-image .wrapInner {
display: block !important;
}
.page-header_component.no-image .wrapInner .titleWrap {
background-color: #f8f8f8;
padding-top: 0 !important;
padding-bottom: 0 !important;
width: 100%;
}
.page-header_component.no-image .wrapInner .titleWrap h1 {
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.2rem;
line-height: 1.5;
margin: 0;
text-align: center !important;
color: #011f26;
width: 100%;
}
/* end of no image */
@media(min-width:420px) {
.page-header_component .wrapInner .titleWrap {
padding: 0 2rem 1.5rem;
}
.page-header_component .wrapInner .titleWrap h1 {
font-size: 1.2rem;
}
.page-header_component .wrapInner {
grid-template-areas:
"title title ."
"intro intro ."
"image image image"
"content content content";
}
}
@media(min-width:768px) {
.page-header_component .wrapInner {
grid-template-areas:
"title intro intro"
"image image image"
"image image image"
"content content content";
}
.page-header_component .wrapInner .titleWrap {
height: calc(100vw /3);
min-height: none;
}
.page-header_component.no-image .wrapInner .titleWrap {
height: auto;
}
}
@media(min-width:1024px) {
.page-header_component .wrapInner {
grid-template-areas:
"intro image image image"
"intro image image image"
"intro title content content";
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(3, calc(100vw /4));
}
/* compact */
.page-header_component.compact .wrapInner {
grid-template-areas:
"title image image intro"
"title image image intro";
grid-template-rows: repeat(2, calc(100vw /4));
}
.page-header_component.condensed .wrapInner {
grid-template-areas:
"title image image intro";
grid-template-rows: repeat(1, calc(100vw /4));
}
.page-header_component.compact .wrapInner .imageWrap .imageContainer .singleImageWrap img {
aspect-ratio: 1 / 1.1;
}
.page-header_component.compact .wrapInner .imageWrap .lineOne, .page-header_component.condensed .wrapInner .imageWrap .lineOne {
left: 50% !important;
}
.page-header_component.compact .wrapInner .imageWrap .lineTwo, .page-header_component.condensed .wrapInner .imageWrap .lineTwo {
display: none !important;
}
.page-header_component .wrapInner .imageWrap .lineThree {
top: calc(100vw/4);
}
.page-header_component .wrapInner .titleWrap {
height: auto;
padding-top: 0;
margin-top: -3px;
padding-bottom: 3.5rem;
}
.page-header_component .wrapInner .introWrap {
padding: 2rem 1.5rem 2rem;
max-width: 14rem;
margin: 0 auto;
}
}
/* BULLETBULLET-POINT-BLOCK ------------------------------------------------------------------------------------------*/
.bullet-point-block_component {
margin: 2px 0;
}
.bullet-point-block_component .wrapInner {}
.bullet-point-block_component .wrapInner .contentWrap {
padding: 1rem 1rem 0.4rem;
grid-area: content;
background-color: #f8f8f8;
overflow: hidden;
}
.bullet-point-block_component .wrapInner .contentWrap ul {
display: flex;
flex-wrap: wrap;
}
.bullet-point-block_component .wrapInner .contentWrap ul li {
background-color: #fff;
padding: 0.8rem 1.2rem 0.8rem 1.6rem;
list-style: none;
position: relative;
border-radius: 2rem;
margin: 0.4rem 0;
width: 100%;
}
@media(min-width:680px) {
.bullet-point-block_component .wrapInner .contentWrap ul li {
width: 46%;
margin-left: 2%;
margin-right: 2%;
}
}
@media(min-width:1024px) {
.bullet-point-block_component .wrapInner {
display: grid !important;
grid-template-areas:
"content content content .";
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(1, calc(100vw /4));
position: relative;
overflow: hidden;
padding: 0 !important;
grid-gap: 2px;
}
.bullet-point-block_component .wrapInner ul {
width: 72vw;
}
.bullet-point-block_component .wrapInner .contentWrap ul li {
width: 48%;
margin-left: 1%;
margin-right: 1%;
font-size: 0.9rem;
padding: 0.7rem 1.1rem 0.7rem 1.4rem
}
}
@media(min-width:1350px) {
.bullet-point-block_component .wrapInner .contentWrap ul li {
width: 44%;
margin-left: 3%;
margin-right: 3%;
font-size: 1.05rem;
}
}
/* CONTENT IMAGES -----------------------------------------------------------------------------------------------*/
.content-images_component {
overflow-wrap: break-word;
}
.content-images_component {
margin: 2px 0;
margin-bottom: 3rem;
}
.content-images_component.text-only.full {
padding: 1rem 0 !important;
margin-bottom: 0;
}
.content-images_component.text-only.full .textWrap {
padding-left: 1rem !important;
padding-right: 1rem !important;
margin-left: auto;
margin-right: auto;
width: 90%;
}
.content-images_component.text-only.full.align-center .contentWrap {
max-width: 85vw;
margin: 0 auto;
}
.content-images_component.text-only.full.align-center .textWrap {
margin-left: auto;
}
.content-images_component.text-only .textWrap {
max-width: none;
}
.content-images_component .wrapInner .linkWrap a {
margin-top: 0.5rem;
margin-left: -0.8rem;
width: 100%;
text-align: left !important;
}
.component-group-begin_component .content-images_component {
margin-bottom: 0;
}
.content-images_component.third .wrapInner .imageWrap, .content-images_component.half .wrapInner .imageWrap {
margin-bottom: 2rem;
}
.content-images_component.half.icon .wrapInner .imageWrap {
margin-bottom: 1rem;
}
.content-images_component.third .wrapInner .titleWrap h2.sectionTitle, .content-images_component.third .wrapInner .contentWrap h2 {
font-size: 1.3rem !important
}
.content-images_component.third .wrapInner .contentWrap h3 {
font-size: 1.1rem !important
}
.content-images_component.half .wrapInner .titleWrap h2.sectionTitle, .content-images_component.half .wrapInner .contentWrap h2 {
font-size: 1.5rem !important
}
.content-images_component.half .wrapInner .contentWrap h3 {
font-size: 1.3rem !important
}
.content-images_component.third .wrapInner .imageWrap img.singleImage, .content-images_component.half .wrapInner .imageWrap img.singleImage {
aspect-ratio: 1;
width: 100%;
min-height: auto;
}
.content-images_component.half .wrapInner .imageWrap img.singleImage {
aspect-ratio: 1.5/1;
}
.content-images_component.icon.third .wrapInner .imageWrap img.singleImage {
max-width: 7rem;
margin-left: auto;
margin-right: auto;
}
.content-images_component.icon.half .wrapInner .imageWrap img.singleImage {
max-width: 15rem;
margin-left: auto;
margin-right: auto;
}
.content-images_component.icon .wrapInner .titleWrap h2.sectionTitle {
font-family: 'Morn W01 Medium';
letter-spacing: 0.2rem;
text-align: center;
text-transform: uppercase;
font-size: 1.05rem !important;
}
.content-images_component.full .wrapInner .textWrap {
padding: 1.5rem;
}
.component-group-begin_component .call-to-action_component .contentContainer {
width: auto !important;
max-width: none;
}
.call-to-action_component.compact + .content-images_component.full.text-only {
margin-top: 3rem !important;
}
@media (min-width: 480px) {
.singleProductView .bomProducts .content-images_component.full .wrapInner .textWrap, .call-to-action_component .contentContainer {
padding: 2.5rem;
}
}
@media (min-width: 768px) {
.content-images_component.full .wrapInner .textWrap, .call-to-action_component .contentContainer {
padding: 1.5rem 2.5rem;
}
.content-images_component.third, .content-images_component.half {
padding: 0 2rem 2rem;
}
.content-images_component.full + .content-images_component.full {
margin-top: 3rem !important;
}
.content-images_component.full + .content-images_component.full.remove-space-above {
margin-top: 0 !important;
}
}
@media (min-width: 786px) {
.content-images_component.full + .content-images_component.full {
margin-top: -3rem !important;
}
}
@media (min-width: 1024px) {
.gallery_component + .component-group-begin_component .call-to-action_component .contentContainer {
margin: 0;
margin-top: calc(100vw/7 + 2px);
}
.content-images_component.third, .content-images_component.half {
padding: 0 2rem 2rem;
}
.content-images_component.icon .wrapInner .imageWrap img.singleImage {
max-width: 7rem;
}
}
/* SLIDER NAV ------------------------------------------------------------------------- */
.sliderNav, .navigation_component {
display: flex;
flex-direction: row;
justify-content: center;
margin-top: 2rem;
align-items: flex-end;
}
.sliderNav .prev a, .sliderNav .next a, .navigation_component .prev a, .navigation_component .next a {
cursor: pointer;
text-indent: -99999em;
display: block;
height: 38px;
background-color: transparent;
padding: 20px;
background-size: 1.7rem;
background-position: center;
background-repeat: no-repeat;
position: relative;
margin-left: 0.2rem;
}
.sliderNav .prev a, .navigation_component .prev a {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m26.59 29.41-13.03-8.99 13.03-8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 1rem center/0rem;
margin-left: 0;
margin-right: 0.2rem;
transition: 0.2s ease-in-out;
background-repeat: no-repeat;
}
.sliderNav .next a, .navigation_component .next a {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m14.58 11.43 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 1rem center/0rem;
transition: 0.2s ease-in-out;
background-repeat: no-repeat;
}
.navigation_component {
position: absolute;
top: 0;
left: 0;
z-index: 10;
padding: 1.5rem 0 0 0;
height: 5.5rem;
margin-top: 0;
align-items: flex-start;
}
.navigation_component .prev a:hover, .testimonial-block_component + .navigation_component .imageButton .prev a:hover {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m26.59 29.41-13.03-8.99 13.03-8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0rem center/2rem;
transition: 0.2s ease-in-out;
background-repeat: no-repeat;
}
.navigation_component .next a:hover, .testimonial-block_component + .navigation_component .imageButton .next a:hover {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m14.58 11.43 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0rem center/2rem;
transition: 0.2s ease-in-out;
background-repeat: no-repeat;
}
@media(min-width:480px) {
.navigation_component {
padding-top: 1.5rem;
}
}
@media(min-width:640px) {
.navigation_component {
padding-top: 1.5rem;
}
}
/* BLOCK LINK ---------------------------------------------------------------------------------------------------- */
.block-link_component {
width: 100%;
padding: 0 0 1rem;
}
.block-link_component a {
padding: 0;
margin: 0;
background: none !important;
white-space: inherit;
font-family: inherit;
text-transform: none;
}
.block-link_component .wrapInner {
padding: 1.4rem;
border: 4px solid #f8f8f8;
transition: 0.5s ease;
background: #fff;
}
.block-link_component .wrapInner .contentWrap {
padding: 0;
}
.block-link_component a:hover .wrapInner {
background: #f8f8f8;
transition: 0.5s ease;
}
.block-link_component a .wrapInner h2 {
font-size: 1.5rem;
}
@media (min-width: 480px) {
.block-link_component {
padding: 1rem;
}
}
@media (min-width: 768px) {
.block-link_component {
width: 50%;
}
}
@media (min-width: 1024px) {
.block-link_component {
width: 33.333333%;
}
}
/* GALLERY ---------------------------------------------------------------------------------------------------- */
.gallery_component {
margin: 2px 0;
z-index: 0;
}
.gallery_component .wrapInner .imageContainer .multiImageContainer {
display: grid !important;
grid-template-areas:
"one one one"
"one one one"
"one one one"
"two two three"
"two two four"
"five six seven";
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(6, calc(100vw /3));
position: relative;
overflow: hidden;
padding: 0 !important;
grid-gap: 2px;
justify-content: start;
}
.gallery_component.small-images-top .wrapInner .imageContainer .multiImageContainer {
grid-template-areas:
"five six seven"
"two two three"
"two two four"
"one one one"
"one one one"
"one one one";
}
.gallery_component.half-width .wrapInner .imageContainer .multiImageContainer {
display: grid !important;
grid-template-areas:
"one one two"
"one one three";
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, calc(100vw /3));
position: relative;
overflow: hidden;
padding: 0 !important;
grid-gap: 2px;
}
.gallery_component .wrapInner .imageContainer .singleImageWrap {
display: none;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap, .gallery_component .wrapInner .imageContainer .multiImageWrap img {
width: 100%;
height: 100%;
object-fit: cover;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap:nth-child(1) {
grid-area: one;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap:nth-child(2) {
grid-area: two;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap:nth-child(3) {
grid-area: three;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap:nth-child(4) {
grid-area: four;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap:nth-child(5) {
grid-area: five;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap:nth-child(6) {
grid-area: six;
}
.gallery_component .wrapInner .imageContainer .multiImageWrap:nth-child(7) {
grid-area: seven;
}
/*stops additional uploaded images from being displayed*/
.gallery_component.half-width .wrapInner .imageContainer .multiImageWrap:nth-child(n + 8), .gallery_component.half-width .wrapInner .imageContainer .multiImageWrap:nth-child(n + 4) {
display: none;
}
@media(min-width:600px) {
.gallery_component .wrapInner .imageContainer .multiImageContainer, .gallery_component.small-images-top .wrapInner .imageContainer .multiImageContainer {
grid-template-areas:
"one one one two three"
"one one one four five"
"one one one six seven";
grid-template-columns: repeat(5, 1fr);
grid-template-rows: repeat(3, calc(100vw /5));
}
}
@media(min-width:1024px) {
.gallery_component .wrapInner .imageContainer .multiImageContainer {
grid-template-areas:
"one one one two two three three"
"one one one two two three three"
"one one one four five six seven";
grid-template-columns: repeat(7, 1fr);
grid-template-rows: repeat(3, calc(100vw /7));
}
.gallery_component.small-images-top .wrapInner .imageContainer .multiImageContainer {
grid-template-areas:
"one one one four five six seven"
"one one one two two three three"
"one one one two two three three";
grid-template-columns: repeat(7, 1fr);
grid-template-rows: repeat(3, calc(100vw /7));
}
.gallery_component.half-width .wrapInner .imageContainer .multiImageContainer {
grid-template-areas:
"one two"
"three .";
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(2, calc(100vw /4));
positon: relative;
}
.gallery_component.half-width .wrapInner .imageContainer .multiImageContainer::before {
content: '';
position: absolute;
right: 0;
bottom: 0;
width: calc(100vw /4 - 2px);
height: calc(100vw /4);
background-color: #f8f8f8;
}
/*Overlaps*/
.gallery_component + #Full_promotion-content-group-start .content-images_component.text-only, .gallery_component + #Full_content-promotion-group-start .content-images_component.text-only {
margin-top: calc(100vw/7 + 2px) !important;
}
}
/* VIDEO EMBED -----------------------------------------------------------------------------------------------*/
.video-embed_component {
width: calc(100vw);
height: auto;
background-color: #f8f8f8;
padding: 2rem 0;
margin-right: 0;
margin-left: auto;
z-index: 90;
}
.video-embed_component .wrapInner {
padding: 1rem 2rem;
display: flex;
flex-direction: column;
}
.home .video-embed_component .wrapInner {
padding: 0.5rem 1.5rem;
}
.video-embed_component .wrapInner .titleWrap {
padding-bottom: 0.5rem;
}
.video-embed_component .wrapInner .titleWrap h2 {
text-align: center;
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.2rem;
font-size: 1.2rem;
line-height: 1.4;
}
.video-embed_component .wrapInner .introWrap {
padding: 0;
}
.video-embed_component .wrapInner .introWrap .sectionIntro {
text-align: center;
font-size: 0.75rem;
max-width: 18rem;
margin: 0 auto;
}
.video-embed_component .wrapInner .linkWrap {
text-align: center;
padding-bottom: 0;
}
.video-embed_component .wrapInner .linkWrap .btn {
margin-top: 0.4rem;
padding-right: 0 !important;
text-align: center;
background-image: none !important;
padding-left: 0 !important;
font-size: 0.9rem;
}
.videoPopup.open {
position: fixed;
width: 100%;
top: 0;
left: 0;
background-color: rgb(0 0 0 / 80%);
height: 100%;
padding: 2.5rem 1.5rem;
cursor: pointer;
z-index: 999;
}
.videoPopup.closed {
display: none;
}
.videoPopup.open .close {
width: 2rem;
height: 2rem;
background-size: 1.4rem 1.4rem !important;
margin: -2rem -1rem;
}
.videoPopup.open .embedded {
text-align: center;
padding-bottom: 56%;
position: relative;
height: 0;
}
.videoPopup.open .videoEmbedWrap {
width: 100%;
max-width: 850px;
margin: 0 auto;
margin-top: 0.5rem;
}
.videoPopup.open .embedded iframe {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
}
.videoPopup.open .linkWrap {
text-align: center;
}
.videoPopup.open .linkWrap .btn {
color: #fff;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 1.1rem center/0.6rem, #eb5d5d;
background-repeat: no-repeat;
transition: 0.2s ease-in-out;
font-size: 0.7rem;
}
.videoPopup.open .linkWrap .btn:hover {
transition: 0.2s ease-in-out;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 1.1rem center/0.6rem, #011F26;
background-repeat: no-repeat;
}
@media(min-width:400px) {
.videoPopup.open .linkWrap .btn {
font-size: 1rem;
}
}
@media(min-width:500px) {
.home .video-embed_component {
width: calc(100vw /3*2);
}
}
@media(min-width:640px) {
.home .video-embed_component {
width: calc(100vw /3);
height: 50vw;
margin-right: 0;
margin-left: auto;
margin-bottom: -50vw;
background-color: transparent;
}
}
@media(min-width:768px) {
.home .video-embed_component {
width: calc(100vw /4);
height: 25vw;
margin-bottom: -25vw;
}
.videoPopup.open {
padding: 3rem;
}
.videoPopup.open .close {
margin: -2rem;
}
.video-embed_component .wrapInner .titleWrap h2 {
font-size: 1.2rem;
}
}
@media(min-width:1024px) {
.home .video-embed_component {
width: calc(100vw/4);
height: calc(100vw/4);
padding: 0;
}
.video-embed_component {
width: calc(100vw/2);
height: auto;
padding: 0;
background-color: transparent;
}
.home .video-embed_component .wrapInner {
max-width: 15rem;
}
.video-embed_component .wrapInner .titleWrap h2 {
font-size: 1.3rem;
}
}
/* SMALL TESTIMONIAL -----------------------------------------------------------------------------------------------*/
body.testimonials .component-group-begin_component.three-column {
margin-top: -2px !important;
}
.small-testimonial_component, .small-testimonial_component.quarter {
width: 100vw;
margin: 0;
padding: 0;
}
.small-testimonial_component .contentWrap p:last-of-type {
font-size: 0.75rem;
}
.small-testimonial_component .wrapInner .contentWrap {
padding: 1.5rem;
width: 100%;
}
@media(min-width:420px) {
.small-testimonial_component .wrapInner .contentWrap {
padding: 2rem;
}
}
@media(min-width:600px) {
.small-testimonial_component, .small-testimonial_component.quarter {
width: 50vw;
border: 1px solid #fff;
}
}
@media(min-width:768px) {
.small-testimonial_component .wrapInner .contentWrap {
padding: 1.5rem;
}
}
@media(min-width:960px) {
.small-testimonial_component, .small-testimonial_component.quarter {
width: calc(100vw/3);
}
}
@media(min-width:1024px) {
body.testimonials .component-group-begin_component.three-column {
margin-top: 0 !important;
}
.small-testimonial_component, .small-testimonial_component.quarter {
width: 25vw;
}
}
.small-testimonial_component.no-image .imageContainer {
display: none !important;
}
.small-testimonial_component .wrapInner .imageContainer .singleImageWrap img {
width: 100%;
object-fit: cover;
aspect-ratio: 1 / 1;
}
#Full_testimonial-group-start, #Full_testimonials-group-start {
margin-top: 4vw !important;
margin-bottom: 4vw !important;
}
/* HOMEPAGE HEADER -------------------------------------------------------------------------------------------- */
.homepage-header_component {
margin: 2px 0 4px;
}
.homepage-header_component .wrapInner {
display: grid !important;
grid-template-areas:
"image image image"
"image image image"
"intro intro intro"
"statement statement statement";
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(4);
position: relative;
overflow: hidden;
padding: 0 !important;
grid-gap: 2px;
}
.homepage-header_component .wrapInner .titleWrap {
grid-area: intro;
padding: 2rem;
display: flex;
align-items: center;
}
.homepage-header_component .wrapInner .titleWrap h1 {
font-size: 1.2rem;
font-family: 'Morn W01 Light', arial, sans-serif;
text-align: center;
line-height: 1.4;
max-width: 19rem;
margin: 0;
}
.homepage-header_component .wrapInner .introWrap {
grid-area: statement;
padding: 0 2rem 2rem;
display: flex;
align-items: center;
}
.homepage-header_component .wrapInner .introWrap p {
font-size: 1.6rem;
font-family: 'Jazmin Alt W05 SemiBold';
text-align: center;
max-width: 19rem;
}
.homepage-header_component .wrapInner .imageWrap {
grid-area: image;
position: relative;
}
.homepage-header_component .wrapInner .imageWrap .multiImageContainer {
display: grid !important;
grid-template-areas:
"one two three"
"four five six";
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, calc(100vw /3));
position: relative;
overflow: hidden;
padding: 0 !important;
grid-gap: 2px;
}
/* determin grid areas */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(6n+1) {
grid-area: one;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(6n+2) {
grid-area: two;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(6n+3) {
grid-area: three;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(6n+4) {
grid-area: four;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(6n+5) {
grid-area: five;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(6n+6) {
grid-area: six;
opacity: 0;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageContainer .multiImageWrap {
display: flex;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageContainer .multiImageWrap img {
width: 100%;
height: 100%;
object-fit: fill;
display: flex;
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap {
width: 100%;
height: 100%;
}
/* ------ Block 4 (left) ------- */
/*1st - 4 */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(4) {
justify-content: flex-start;
animation: four-LeftWidthShrink-Fix 15s linear infinite;
}
@keyframes four-LeftWidthShrink-Fix {
16.67% {
justify-content: flex-start;
}
17.33% {
justify-content: flex-end;
}
73.34% {
justify-content: flex-end;
}
74.01% {
justify-content: flex-start;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(4) img {
width: 100%;
animation: four-LeftWidthShrink 15s linear infinite;
}
@keyframes four-LeftWidthShrink {
13.33% {
width: 100%;
}
16.00% {
width: 0%;
}
70.00% {
width: 0%;
}
72.67% {
width: 100%;
}
}
/*6th - 10*/
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(10) {
justify-content: flex-end;
animation: ten-PositionFix 15s linear infinite;
}
@keyframes ten-PositionFix {
16.67% {
justify-content: flex-end;
}
17.33% {
justify-content: flex-start;
}
43.33% {
justify-content: flex-start;
}
44.00% {
justify-content: flex-end;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(10) img {
width: 0%;
animation: ten-FourLeftWidthGrow-TenLeftWidthShrink 15s linear infinite;
}
@keyframes ten-FourLeftWidthGrow-TenLeftWidthShrink {
13.33% {
width: 0%;
}
16.00% {
width: 100%;
}
40.00% {
width: 100%;
}
42.67% {
width: 0%;
}
}
/*11th - 16*/
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(16) {
justify-content: flex-end;
animation: sixteen-PositionFix 15s linear infinite;
}
@keyframes sixteen-PositionFix {
43.33% {
justify-content: flex-end;
}
44.00% {
justify-content: flex-start;
}
73.34% {
justify-content: flex-start;
}
74.01% {
justify-content: flex-end;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(16) img {
width: 0%;
animation: sixteen-LeftWidthGrown 15s linear infinite;
}
@keyframes sixteen-LeftWidthGrown {
40.00% {
width: 0%;
}
42.67% {
width: 100%;
}
70.00% {
width: 100%;
}
72.67% {
width: 0%;
}
}
/* ------ Block 2 ( down) -------- */
/*2nd - two */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(2) {
align-items: flex-start;
animation: two-PositionFix 15s linear infinite;
}
@keyframes two-PositionFix {
23.33% {
align-items: flex-start
}
24.00% {
align-items: flex-end
}
80.01% {
align-items: flex-end
}
80.68% {
align-items: flex-start
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(2) img {
height: 100%;
animation: two-DownHeightShrink 15s linear infinite;
}
@keyframes two-DownHeightShrink {
20.00% {
height: 100%;
}
22.67% {
height: 0%;
}
76.67% {
height: 0%;
}
79.34% {
height: 100%
}
}
/* 7th - 8*/
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(8) {
align-items: flex-end;
animation: eight-PositionFix 15s linear infinite;
}
@keyframes eight-PositionFix {
23.33% {
align-items: flex-end;
}
24.00% {
align-items: flex-start;
}
48.67% {
align-items: flex-start;
}
49.33% {
align-items: flex-end;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(8) img {
height: 0%;
animation: two-HeightGrowShrink 15s linear infinite;
}
@keyframes two-HeightGrowShrink {
20.00% {
height: 0%;
}
22.67% {
height: 100%;
}
45.33% {
height: 100%;
}
48.00% {
height: 0%;
}
}
/* 12th - 14) */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(14) {
align-items: flex-end;
animation: fourteen-PositionFix 15s linear infinite;
}
@keyframes fourteen-PositionFix {
48.67% {
align-items: flex-end
}
49.33% {
align-items: flex-start
}
80.01% {
align-items: flex-start
}
80.68% {
align-items: flex-end
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(14) img {
height: 0%;
animation: sevenTwoDownHeightGrow 15s linear infinite;
}
@keyframes sevenTwoDownHeightGrow {
45.33% {
height: 0%;
}
48.00% {
height: 100%
}
76.67% {
height: 100%
}
79.34% {
height: 0%
}
}
/* ------- Block 3 ( right) ------ */
/* 3rd - 3*/
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(3) {
justify-content: flex-end;
animation: three-RightWidthShrink-Fix 15s linear infinite;
}
@keyframes three-RightWidthShrink-Fix {
27.33% {
justify-content: flex-end
}
28.00% {
justify-content: flex-start
}
84.01% {
justify-content: flex-start
}
84.68% {
justify-content: flex-end
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(3) img {
width: 100%;
animation: threeThreeRightWidthShrink 15s linear infinite;
}
@keyframes threeThreeRightWidthShrink {
24.00% {
width: 100%;
}
26.67% {
width: 0%;
}
80.67% {
width: 0%;
}
83.34% {
width: 100%;
}
}
/* 8th - 9 */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(9) {
justify-content: flex-start;
animation: nine-PositionFix 15s linear infinite;
}
@keyframes nine-PositionFix {
27.33% {
justify-content: flex-start;
}
28.00% {
justify-content: flex-end;
}
50.00% {
justify-content: flex-end;
}
50.67% {
justify-content: flex-start;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(9) img {
width: 0%;
animation: threeThreeRightGrowShrink 15s linear infinite;
}
@keyframes threeThreeRightGrowShrink {
24.00% {
width: 0%;
}
26.67% {
width: 100%;
}
46.67% {
width: 100%;
}
49.33% {
width: 0%;
}
}
/*Step Eight (3 right) */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(15) {
justify-content: flex-start;
animation: eight-RightWidthShrink-Fix 15s linear infinite;
}
@keyframes eight-RightWidthShrink-Fix {
50.00% {
justify-content: flex-start;
}
50.67% {
justify-content: flex-end;
}
84.01% {
justify-content: flex-end;
}
84.68% {
justify-content: flex-start;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(15) img {
width: 0%;
animation: eightThreeRightWidthGrow 15s linear infinite;
}
@keyframes eightThreeRightWidthGrow {
46.67% {
width: 0%;
}
49.33% {
width: 100%;
}
80.67% {
width: 100%
}
83.34% {
width: 0%
}
}
/* ------ Block One (up) --------- */
/* 4th - 1 */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(1) {
align-items: flex-end;
animation: four-PositionFix 15s linear infinite;
}
@keyframes four-PositionFix {
28.67% {
align-items: flex-end
}
29.33% {
align-items: flex-start
}
88.68% {
align-items: flex-start
}
89.35% {
align-items: flex-end
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(1) img {
height: 100%;
animation: fourOneUpHeightShrink 15s linear infinite;
}
@keyframes fourOneUpHeightShrink {
25.33% {
height: 100%;
}
28.00% {
height: 0%;
}
85.34% {
height: 0%;
}
88.01% {
height: 100%;
}
}
/* 9th - 7*/
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(7) {
align-items: flex-start;
animation: fourOneUpHeightShrinkFix 15s linear infinite;
}
@keyframes fourOneUpHeightShrinkFix {
28.67% {
align-items: flex-start;
}
29.33% {
align-items: flex-end;
}
55.33% {
align-items: flex-end
}
56.00% {
align-items: flex-start
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(7) img {
height: 0%;
animation: fourOneUpHeightGrowShrink 15s linear infinite;
}
@keyframes fourOneUpHeightGrowShrink {
25.33% {
height: 0%;
}
28.00% {
height: 100%
}
52.00% {
height: 100%
}
54.67% {
height: 0%;
}
}
/* 14th - 13 */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(13) {
align-items: flex-start;
animation: thirteenPositionFix 15s linear infinite;
}
@keyframes thirteenPositionFix {
55.33% {
align-items: flex-start
}
56.00% {
align-items: flex-end
}
88.68% {
align-items: flex-end
}
89.35% {
align-items: flex-start
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(13) img {
height: 0%;
animation: nineOneUpHeightGrow 15s linear infinite;
}
@keyframes nineOneUpHeightGrow {
52.00% {
height: 0%;
}
54.67% {
height: 100%
}
85.34% {
height: 100%
}
88.01% {
height: 0%
}
}
/* ------- Block Five (right) ---------- */
/* 5th - 5 */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(5) {
justify-content: flex-end;
animation: five-RightWidthShrink-Fix 15s linear infinite;
}
@keyframes five-RightWidthShrink-Fix {
30.67% {
justify-content: flex-end;
}
31.33% {
justify-content: flex-start;
}
90.68% {
justify-content: flex-start;
}
91.35% {
justify-content: flex-end;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(5) img {
width: 100%;
animation: fiveFiveRightWidthShrink 15s linear infinite;
}
@keyframes fiveFiveRightWidthShrink {
27.33% {
width: 100%;
}
30.00% {
width: 0%;
}
87.34% {
width: 0%;
}
90.01% {
width: 100%;
}
}
/* 10th - 11 */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(11) {
justify-content: flex-start;
animation: fiveFiveRightWidthShrinkFix 15s linear infinite;
}
@keyframes fiveFiveRightWidthShrinkFix {
30.67% {
justify-content: flex-start;
}
31.33% {
justify-content: flex-end;
}
57.33% {
justify-content: flex-end;
}
58.00% {
justify-content: flex-start;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(11) img {
width: 0%;
animation: fiveFiveRightWidthGrowShrink 15s linear infinite;
}
@keyframes fiveFiveRightWidthGrowShrink {
27.33% {
width: 0%;
}
30.00% {
width: 100%;
}
54.00% {
width: 100%;
}
56.67% {
width: 0%;
}
}
/*15th - 17 */
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap:nth-child(17) {
justify-content: flex-start;
animation: seventeen-PositionFix 15s linear infinite;
}
@keyframes seventeen-PositionFix {
57.33% {
justify-content: flex-start;
}
58.00% {
justify-content: flex-end;
}
90.68% {
justify-content: flex-end;
}
91.35% {
justify-content: flex-start;
}
}
.homepage-header_component .wrapInner .imageWrap .imageContainer .multiImageWrap.showTime:nth-child(17) img {
width: 0%;
animation: tenFiveRightWidthGrow 15s linear infinite;
}
@keyframes tenFiveRightWidthGrow {
54.00% {
width: 0%;
}
56.67% {
width: 100%;
}
87.34% {
width: 100%;
}
90.01% {
width: 0%;
}
}
.homepage-header_component .wrapInner .imageWrap span {
position: absolute;
display: block;
height: 100%;
width: 2px;
background: #fff;
z-index: 2;
}
@media(min-width:1024px) {
.homepage-header_component .wrapInner {
grid-template-areas:
"intro image image image"
"statement image image image";
grid-template-rows: repeat(2, calc(100vw /4));
grid-template-columns: repeat(4, 1fr);
}
.homepage-header_component .wrapInner .imageWrap .multiImageContainer {
grid-template-columns: repeat(3, calc(100vw /4));
grid-template-rows: repeat(2, calc(100vw /4));
}
.homepage-header_component .wrapInner .titleWrap {
grid-area: intro;
padding: 2rem 1.5rem 2rem;
max-width: 14rem;
margin: 0 auto;
}
.homepage-header_component .wrapInner .introWrap {
grid-area: statement;
padding: 0 1.5rem 2rem;
max-width: 14rem;
margin: 0 auto;
}
}
/* CASE STUDY -------------------------------------------------------------------------------------------- */
.case-study_component {
width: 33%;
}
.case-study_component .wrapInner {
padding: 1.4rem;
}
.case-study_component .wrapInner .titleWrap {
padding: 1.5rem 0 0.6rem 0;
}
.case-study_component .wrapInner .titleWrap h2 {
font-size: 1.5rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.case-study_component .wrapInner .introWrap {
padding: 0 0 1rem 0;
}
.case-study_component .wrapInner .introWrap p {
font-family: 'Morn W01 Medium';
font-size: 1rem;
}
.case-study_component .wrapInner .contentWrap {
padding: 0;
}
.case-study_component .wrapInner .linkWrap .btn {
margin-left: -0.8rem;
;
}
.case-study_component .wrapInner .imageContainer .singleImageWrap img {
aspect-ratio: 1;
height: 100%;
width: 100%;
object-fit: cover;
}
/* IMAGE BANNER -------------------------------------------------------------------------------------------- */
.image-banner_component {
margin: 2px 0;
}
/* Intro version */
.image-banner_component .wrapInner {
display: grid !important;
grid-template-areas:
"intro intro intro"
"intro intro intro"
"intro intro intro"
"image image image"
"image image image";
grid-template-rows: repeat(5, calc(100vw /3));
grid-template-columns: repeat(3, 1fr);
position: relative;
overflow: hidden;
padding: 0 !important;
grid-gap: 2px;
}
/* sections */
.image-banner_component .wrapInner .contentWrap {
grid-area: intro;
padding: 1rem 1.5rem 1.2rem !important;
background-color: #011F26;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.image-banner_component .wrapInner .contentWrap h2 {
color: #fff;
text-align: center;
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.2rem;
font-size: 1rem;
line-height: 1.4;
padding-bottom: 1.2rem;
margin: 0;
}
.image-banner_component .wrapInner .contentWrap ul {
margin-bottom: 0;
text-align: center !important;
}
.image-banner_component .wrapInner .contentWrap li {
color: #fff;
font-size: 0.9rem;
margin-left: 0;
font-family: 'Morn W01 Light', arial, sans-serif;
margin-bottom: 0.6rem;
list-style-type: none;
padding-left: 0;
line-height: 1.2;
}
.image-banner_component .wrapInner .imageWrap {
grid-area: image;
position: relative;
}
.image-banner_component .wrapInner .imageWrap span {
position: absolute;
display: block;
height: 100%;
width: 2px;
background: #fff;
z-index: 2;
}
.image-banner_component .wrapInner .imageWrap .lineOne, .image-banner_component .wrapInner .imageWrap .lineTwo, .image-banner_component .wrapInner .imageWrap .lineThree, .image-banner_component.image-only .contentWrap {
display: none;
}
.image-banner_component.image-only .wrapInner .imageWrap .lineOne {
left: 33.333333%;
display: block;
}
.image-banner_component.image-only .wrapInner .imageWrap .lineTwo {
left: 66.6666666%;
display: block;
}
.image-banner_component.image-only .wrapInner .imageWrap .lineThree {
width: 100%;
height: 2px;
display: block;
top: calc(100vw/3);
}
.image-banner_component .wrapInner .imageWrap .singleImageWrap {
height: 100%;
width: 100%;
}
/* image only */
.image-banner_component.image-only .wrapInner {
grid-template-areas:
"image image image"
"image image image";
grid-template-rows: repeat(2, calc(100vw /3));
}
@media(min-width:320px) {
.image-banner_component .wrapInner .contentWrap {
padding: 1.5rem 2rem 2rem !important;
}
}
@media(min-width:340px) {
.image-banner_component .wrapInner .contentWrap {
padding: 2.8rem 2rem 2rem !important;
}
.image-banner_component .wrapInner .contentWrap li {
margin-bottom: 0.8rem;
}
}
@media(min-width:500px) {
.image-banner_component .wrapInner {
grid-template-areas:
"intro intro ."
"intro intro ."
"intro intro ."
"image image image"
"image image image";
}
}
@media(min-width:600px) {
.image-banner_component .wrapInner {
grid-template-areas:
"intro intro ."
"intro intro ."
"image image image"
"image image image";
grid-template-rows: repeat(4, calc(100vw /3));
}
}
@media(min-width:768px) {
.image-banner_component .wrapInner {
grid-template-areas:
"image image intro ."
"image image intro .";
grid-template-rows: repeat(2, calc(100vw /4));
grid-template-columns: repeat(4, 1fr);
grid-gap: 0;
}
.image-banner_component.image-only .wrapInner .imageWrap .lineOne {
left: 33.2%;
display: block;
}
.image-banner_component.image-only .wrapInner .imageWrap .lineTwo {
left: 66.6666666%;
display: block;
}
.image-banner_component.image-only .wrapInner .imageWrap .lineThree {
width: 100%;
height: 2px;
display: block;
top: calc(100vw/4);
}
.image-banner_component .wrapInner .contentWrap {
padding: 1rem 1rem 0.5rem !important;
justify-content: flex-end;
width: 25vw;
}
.image-banner_component.intro .wrapInner .imageWrap {
width: 50vw;
border-right: 2px solid #fff;
}
.image-banner_component .wrapInner .contentWrap h2 {
padding-bottom: 0.75rem;
}
.image-banner_component .wrapInner .contentWrap li {
font-size: 0.85rem;
}
/* image only */
.image-banner_component.image-only .wrapInner {
grid-template-areas:
". image image image"
". image image image";
grid-template-rows: repeat(2, calc(100vw /4));
}
}
@media(min-width:1024px) {
.image-banner_component .wrapInner .contentWrap {
padding: 1.5rem 1.5rem 1rem !important;
}
.image-banner_component.overlap {
margin-top: calc(((100vw/4) + 2px) * -1);
z-index: 1;
}
.home .image-banner_component.overlap {
margin-left: 2px;
}
.image-banner_component.overlap + .image-banner_component.overlap.overlap {
z-index: 0;
}
.video-embed_component .wrapInner .introWrap .sectionIntro {
display: block;
}
.video-embed_component .wrapInner {
padding-top: 2rem;
}
.home .video-embed_component .wrapInner {
padding-top: 1rem;
}
.image-banner_component .wrapInner .contentWrap li {
font-size: 0.95rem;
}
}
@media(min-width:960px) {
.video-embed_component .wrapInner {
padding-top: 0;
}
.video-embed_component .wrapInner .introWrap .sectionIntro {
display: block;
}
}
@media(min-width:1100px) {
.video-embed_component .wrapInner {
padding-top: 2rem;
}
.home .video-embed_component .wrapInner {
padding-top: 2rem;
}
.image-banner_component .wrapInner .contentWrap li {
margin-bottom: 1rem;
}
.image-banner_component .wrapInner .contentWrap h2 {
padding-bottom: 1.2rem;
}
}
@media(min-width:1200px) {
.home .video-embed_component .wrapInner {
padding-top: 3rem;
}
}
/* STEPS --------------------------------------------------------------------------------------------- */
.steps_component {
background-color: transparent !important;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
border-left: 2px solid #fff;
border-right: 2px solid #fff;
}
.steps_component .wrapInner {
display: grid;
position: relative;
grid-gap: 2px;
}
.steps_component.headline {
width: 92vw;
margin-left: 4vw;
}
.steps_component.headline.space-above {
margin-top: 4vw;
}
.steps_component.headline.space-below {
margin-bottom: 4vw;
}
.steps_component.info .wrapInner, .steps_component.headline .wrapInner {
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(4, calc(100vw/3));
}
.steps_component.headline .wrapInner {
grid-template-areas:
"number title title"
"graphic graphic graphic"
"graphic graphic graphic"
"graphic graphic graphic";
}
.steps_component.info .wrapInner {
grid-template-areas:
"number title title"
"graphic graphic graphic"
"graphic graphic graphic"
"graphic graphic graphic"
"info info info";
}
.steps_component.cotton .wrapInner .titleWrap, .steps_component.cotton .wrapInner .introWrap {
background-color: #C7C4BA;
}
.steps_component.orchid .wrapInner .titleWrap, .steps_component.orchid .wrapInner .introWrap {
background-color: #CDB8AF;
}
.steps_component.lavender .wrapInner .titleWrap, .steps_component.lavender .wrapInner .introWrap {
background-color: #BEBFCB;
}
.steps_component.peach .wrapInner .titleWrap, .steps_component.peach .wrapInner .introWrap {
background-color: #E6CBC2;
}
.steps_component .wrapInner .titleWrap, .steps_component .wrapInner .introWrap {
display: flex;
justify-content: center;
align-items: center;
padding: 2rem;
}
.steps_component .wrapInner .contentContainer {
padding: 2rem;
}
.steps_component .wrapInner h2, .steps_component .wrapInner .introWrap p {
;
color: #fff;
text-align: center;
}
.steps_component .wrapInner .contentWrap p {
font-size: 0.9rem;
}
/* sections */
.steps_component .wrapInner .introWrap {
grid-area: number;
}
.steps_component .wrapInner .introWrap p {
font-family: 'Morn W01 Light';
font-size: 4.5rem;
}
.steps_component .wrapInner .contentContainer {
grid-area: info;
flex-direction: column;
align-items: flex-start;
}
.steps_component .wrapInner .contentContainer .contentWrap {
padding: 0;
}
.steps_component .wrapInner .imageContainer {
grid-area: graphic;
}
.steps_component .wrapInner .titleWrap {
grid-area: title;
}
.steps_component .wrapInner .titleWrap h2 {
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.2rem;
font-size: 0.9rem;
line-height: 1.6;
}
/* .button version */
.steps_component.headline .wrapInner .contentContainer {
display: none;
}
.steps_component.headline .wrapInner .imageContainer {
background-color: #001F26;
}
/* .info */
.steps_component.info .wrapInner .imageContainer {
background-color: #f8f8f8;
}
@media(min-width:500px) {
.steps_component .wrapInner .titleWrap {
padding: 3rem;
}
.steps_component .wrapInner .introWrap, .steps_component .wrapInner .contentContainer {
padding: 2rem;
}
.steps_component .wrapInner .titleWrap h2 {
font-size: 1rem;
}
}
@media(min-width:600px) {
.steps_component.headline .wrapInner {
grid-template-rows: repeat(2, calc(100vw/3));
grid-template-areas: "number graphic graphic"
"title graphic graphic"
;
}
.steps_component.headline.position-right .wrapInner {
grid-template-areas: "graphic graphic number"
"graphic graphic title"
;
}
.steps_component .wrapInner .titleWrap {
padding: 1.5rem;
}
.steps_component.info .wrapInner {
grid-template-rows: repeat(3, calc(100vw/3));
grid-template-areas: ". graphic graphic"
"number graphic graphic"
"info info title"
;
}
.steps_component.headline {
width: 86vw;
margin-left: 6vw;
}
.steps_component.headline.space-above {
margin-top: 6vw;
}
.steps_component.headline.space-below {
margin-bottom: 6vw;
}
}
@media(min-width:768px) {
.steps_component .wrapInner .contentWrap p {
font-size: 0.95rem;
}
}
@media(min-width:800px) {
.steps_component.headline .wrapInner {
grid-template-rows: repeat(1, calc(100vw/3));
}
.steps_component.headline.position-left .wrapInner {
grid-template-areas:
"number title graphic";
}
.steps_component.headline.position-right .wrapInner {
grid-template-areas:
"graphic number title";
}
.steps_component.info .wrapInner {
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, calc(100vw /4));
}
.steps_component.info.position-left .wrapInner {
grid-template-areas:
"number title graphic graphic "
"info info graphic graphic";
}
.steps_component.info.position-right .wrapInner {
grid-template-areas: "graphic graphic number title"
"graphic graphic info info";
}
.steps_component .wrapInner .titleWrap {
padding: 1rem;
}
.steps_component .wrapInner .contentContainer {
padding: 1.5rem;
}
}
@media(min-width:960px) {
.steps_component .wrapInner .contentContainer {
padding: 2rem;
}
}
@media(min-width:1024px) {
.steps_component .wrapInner .contentWrap p {
font-size: 1rem;
}
.steps_component .wrapInner .contentContainer {
padding: 2.8rem 3rem;
}
.steps_component .wrapInner .titleWrap {
padding: 2rem;
}
.steps_component.headline {
width: 90vw;
margin-left: 5vw;
}
.steps_component.headline.space-above {
margin-top: 10vw;
}
.steps_component.headline.space-below {
margin-bottom: 10vw;
}
}
/* TESTIMONIAL -----------------------------------------------------------------------------------------------*/
.extraInfo {
display: none !important;
} /* TEMPORARY */
.component-group-begin_component.slider {
height: 307vw;
}
.testimonial-block_component {
margin: 2px 0;
flex-direction: column;
position: relative;
width: 100%;
text-align: center;
height: auto;
-ms-flex: 0 0 auto !important;
}
.testimonial-block_component {
width: 92vw;
margin: 0 4vw;
}
.testimonial-block_component .columnWrap {
align-content: flex-start;
text-align: left;
}
.testimonial-block_component .contentWrap {
background-color: #011F26;
padding: 1.5rem 1.5rem 1.5rem;
}
.testimonial-block_component .contentWrap p {
color: #fff !important;
}
.testimonial-block_component .authorWrap p {
font-size: 0.75rem !important;
text-transform: uppercase;
padding-top: 1rem;
}
.testimonial-block_component .imageContainer {
height: 89vw;
width: 100vw;
}
.testimonial-block_component .imageContainer .singleImageWrap {
width: 100%;
height: 100%;
}
.testimonial-block_component .imageContainer .singleImageWrap img {
width: 100%;
height: 100%;
object-fit: cover;
}
/*slider*/
.component-group-begin_component.slider .testimonial-block_component {
position: absolute;
left: 0;
top: 0;
opacity: 1;
overflow: hidden;
height: 100%;
background-color: #011F26;
color: #fff !important;
}
.component-group-begin_component.slider .testimonial-block_component.prev {
z-index: 8;
display: block;
}
.component-group-begin_component.slider .testimonial-block_component.current {
z-index: 10;
display: block;
}
.component-group-begin_component.slider .testimonial-block_component.next {
z-index: 9;
display: block;
}
.component-group-begin_component.slider .testimonial-block_component {
z-index: 1;
display: none;
}
.component-group-begin_component.slider .testimonial-block_component .JScomponent {
height: 100%;
}
.testimonial-block_component.prev {
opacity: 0 !important;
transition: 1s 0s ease-out;
}
.testimonial-block_component.current {
opacity: 1;
transition: 1s 0s ease-out;
}
.testimonial-block_component.current .wrapInner {
opacity: 1;
transition: 1s 0s ease-out;
height: 100%;
}
.testimonial-block_component.next {
opacity: 0 !important;
transition: 1s 0s ease-out;
}
.testimonial-block_component + .navigation_component {
right: auto;
left: auto;
bottom: 0;
top: 72vw;
width: 100%;
padding: 0;
height: 2.5rem;
}
@media(min-width:320px) {
.component-group-begin_component.slider {
height: 277vw;
}
.testimonial-block_component .contentWrap {
height: 606px;
}
}
@media(min-width:345px) {
.component-group-begin_component.slider {
height: 225vw;
}
.testimonial-block_component .contentWrap {
height: 578px;
}
}
@media(min-width:375px) {
.component-group-begin_component.slider {
height: 220vw;
}
.testimonial-block_component .contentWrap {
height: 522px;
}
}
@media(min-width:390px) {
.testimonial-block_component + .navigation_component {
top: 70vw;
}
.testimonial-block_component .imageContainer {
height: 85vw;
}
}
@media(min-width:410px) {
.component-group-begin_component.slider {
height: 200vw;
}
.testimonial-block_component .contentWrap {
height: 495px;
}
}
@media(min-width:450px) {
.testimonial-block_component + .navigation_component {
top: 72vw;
}
.testimonial-block_component .imageContainer {
height: 85vw;
}
.component-group-begin_component.slider {
height: 182vw;
}
.testimonial-block_component .contentWrap {
height: 455px;
}
}
@media(min-width:510px) {
.component-group-begin_component.slider {
height: 162vw;
}
.testimonial-block_component .contentWrap {
height: 390px;
}
}
@media(min-width:560px) {
.component-group-begin_component.slider {
height: 148vw;
}
.testimonial-block_component + .navigation_component {
top: 76vw;
}
}
@media(min-width:610px) {
.component-group-begin_component.slider {
height: 142vw;
}
.testimonial-block_component .contentWrap {
height: 355px;
}
}
@media(min-width:660px) {
.testimonial-block_component + .navigation_component {
top: 75vw;
}
}
@media(min-width:700px) {
.component-group-begin_component.slider {
height: 132vw;
}
}
@media(min-width:768px) {
.testimonial-block_component .wrapInner {
display: flex;
height: 100%;
background-color: #011F26;
align-items: stretch;
}
.component-group-begin_component.slider {
height: 70vw
}
.testimonial-block_component + .navigation_component {
left: 2.5rem;
right: auto;
width: auto;
margin-top: 0;
top: 1rem;
bottom: auto;
}
.testimonial-block_component .contentWrap {
height: auto;
width: 50%;
}
.component-group-begin_component.slider .testimonial-block_component .imageContainer {
width: 50%;
height: 100%;
}
.testimonial-block_component .imageContainer {
width: 50%;
height: auto;
}
}
@media(min-width:790px) {
.component-group-begin_component.slider {
height: 70vw
}
}
@media(min-width:806px) {
.component-group-begin_component.slider {
height: 66vw
}
}
@media(min-width:840px) {
.component-group-begin_component.slider {
height: 59vw;
}
}
@media(min-width:890px) {
.component-group-begin_component.slider {
height: 52vw;
}
}
@media(min-width:930px) {
.component-group-begin_component.slider {
height: 47vw
}
}
@media(min-width:960px) {
.testimonial-block_component .contentWrap {
padding: 3rem;
}
.component-group-begin_component.slider {
height: 53vw;
}
}
@media(min-width:1000px) {
.component-group-begin_component.slider {
height: 48vw;
}
.testimonial-block_component + .navigation_component {
left: 3.2rem;
top: 1rem;
}
}
@media(min-width:1072px) {
.component-group-begin_component.slider {
height: 42vw;
}
}
@media(min-width:1125px) {
.testimonial-block_component .contentWrap {
padding: 4rem;
}
.testimonial-block_component .contentWrap p {
font-size: 1.15rem;
}
.component-group-begin_component.slider {
height: 53vw;
}
}
@media(min-width:1200px) {
.component-group-begin_component.slider {
height: 47vw;
}
}
@media(min-width:1260px) {
.component-group-begin_component.slider {
height: 56vw;
}
}
@media(min-width:1300px) {
.component-group-begin_component.slider {
height: 52vw;
}
}
@media(min-width:1400px) {
.component-group-begin_component.slider {
height: 46vw;
}
}
/* PROMOTION ---------------------------------------------------------------------------------------------*/
.slider .promotion_component .wrapInner {
opacity: 0;
}
.promotion_component {
flex-direction: column;
position: relative;
width: 100%;
text-align: center;
height: auto;
-ms-flex: 0 0 auto !important;
}
.promotion_component .wrapInner {
display: flex;
flex-direction: column;
max-width: 1440px;
align-content: flex-start !important;
overflow: hidden;
}
.slider .promotion_component .wrapInner {
overflow: visible;
}
.promotion_component::before {
content: '';
position: absolute;
height: 100%;
width: 100%;
bottom: 0;
right: 0;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 996.13 643.04' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m996.13 12.37c-430.95-75.72-833.8 205.74-996.13 582.46 17.44 16.47 35.19 32.62 53.4 48.21 183.03-347.85 566.01-542.72 873.07-451.48 8.84 2.76 17.36 5.75 25.64 8.92 17.48-61.94 30.9-125.01 44.01-188.11z' fill='%23fff'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: bottom -3rem right -4rem;
}
.promotion_component .wrapInner .contentContainer .contentWrap {
max-width: 260px;
}
.promotion_component .wrapInner .contentContainer .titleWrap h2 {
font-family: 'Morn W01 Medium';
color: #fff;
text-transform: uppercase;
letter-spacing: 0.15rem;
}
.promotion_component .wrapInner .contentContainer .titleWrap h2 span {
font-size: 0.8rem;
padding-top: 0.6rem;
display: block;
}
.promotion_component .wrapInner .titleWrap {
padding: 0 0 1.5rem 0;
}
.promotion_component .wrapInner .contentContainer .introWrap {
padding: 0 0 0.5rem 0;
}
.promotion_component .wrapInner .contentContainer .introWrap p {
font-family: 'Jazmin Alt W05 SemiBold';
}
.promotion_component .wrapInner .contentContainer .linkWrap a {
color: #fff;
text-transform: uppercase;
font-size: 0.75rem;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 1.2rem center/0.6rem, #011F26;
background-repeat: no-repeat;
}
.promotion_component .wrapInner .contentContainer .linkWrap a:hover {
color: #011f26;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23011F26' stroke-width='4'/%3E%3C/svg%3E") 1.2rem center/0.6rem, #f8f8f8;
background-repeat: no-repeat;
}
.promotion_component.prev .wrapInner {
transform: translateX(-100vw);
opacity: 0 !important;
transition: 1s 0.4s;
}
.promotion_component {
background-color: transparent !important;
transition: 1s 0.4s;
}
.promotion_component.current .wrapInner {
transform: translateX(0);
opacity: 1 !important;
transition: 1s 0.4s;
}
.component-group-begin_component.slider .promotion_component.current.cotton, .component-group-begin_component.two-column .promotion_component.current.cotton, body.sample-boxes .component-group-begin_component.two-column .promotion_component.cotton {
background-color: #C7C4BA !important;
}
.component-group-begin_component.slider .promotion_component.current.orchid, .component-group-begin_component.two-column .promotion_component.current.orchid, body.sample-boxes .component-group-begin_component.two-column .promotion_component.orchid {
background-color: #CDB8AF !important;
}
.component-group-begin_component.slider .promotion_component.current.lavender, .component-group-begin_component.two-column .promotion_component.current.lavender, body.sample-boxes .component-group-begin_component.two-column .promotion_component.lavender {
background-color: #BEBFCB !important;
}
.component-group-begin_component.slider .promotion_component.current.peach, .component-group-begin_component.two-column .promotion_component.current.peach, body.sample-boxes .component-group-begin_component.two-column .promotion_component.peach {
background-color: #E6CBC2 !important;
}
.promotion_component.next .wrapInner {
transform: translateX(100vw);
opacity: 0 !important;
transition: 1s 0.4s;
}
.component-group-begin_component.two-column .component-group-begin_component.slider {
background-color: #fff;
}
/* CALL TO ACTION ---------------------------------------------------------------------------------------------*/
.call-to-action_component {
position: relative;
margin: 2px 0;
}
.component-group-begin_component + .call-to-action_component.full-width-centered, .component-group-begin_component + .call-to-action_component.half-width, .component-group-begin_component + .call-to-action_component.full-width-offset, .spacer_component + .call-to-action_component.full-width-offset, .spacer_component + .call-to-action_component.full-width-centered, .spacer_component + .call-to-action_component.full-width {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 92 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m6 6h80' fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='9.25'/%3E%3C/svg%3E");
background-position: 50% 0 !important;
background-size: 80px 10px !important;
background-repeat: no-repeat !important;
padding-top: 3rem;
margin-top: 3rem;
}
.component-group-begin_component + .call-to-action_component.full-width-centered .contentContainer {
text-align: center;
}
.call-to-action_component .wrapInner {
display: flex;
align-items: center;
flex-direction: column;
text-align: center;
position: inherit;
}
.call-to-action_component .wrapInner .titleWrap .sectionTitle {
font-size: 2rem !important
}
.call-to-action_component .wrapInner .introWrap .sectionIntro {
font-size: 1.1rem;
}
.call-to-action_component .wrapInner .contentContainer .linkWrap {
padding-bottom: 1.5rem;
}
.call-to-action_component .wrapInner .contentContainer .linkWrap .btn {
width: auto !important;
border: none;
color: #fff;
border-radius: 1.5rem;
padding: 1rem 1.25rem;
text-transform: uppercase;
background-color: #EB5D4D !important;
background-image: none !important;
margin-left: 0;
letter-spacing: 0.5pt;
font-size: 0.85rem;
}
.call-to-action_component .wrapInner .contentContainer .linkWrap .btn:hover {
background-color: #011F26 !important;
background-image: none !important;
}
.call-to-action_component .wrapInner .contentContainer .contentWrap p {
font-size: 0.9rem;
}
.call-to-action_component .wrapInner .contentContainer .contentWrap a {
color: #011F26;
}
.call-to-action_component .wrapInner .contentContainer .contentWrap a:hover {
color: #eb5d4d;
opacity: 1;
}
/*compact*/
.call-to-action_component.compact {
background-color: #EB5D4D;
margin-top: 2vw;
margin-bottom: 6vw;
}
.call-to-action_component.compact .titleWrap, .call-to-action_component.compact .contentWrap {
display: none;
}
.call-to-action_component.compact .wrapInner .contentContainer .introWrap {
text-align: center;
}
.call-to-action_component.compact .wrapInner .introWrap .sectionIntro {
color: #fff !important;
}
.call-to-action_component.compact .wrapInner .contentContainer .linkWrap .btn {
background: #011F26 !important;
color: #fff !important;
padding-left: 1.25rem !important;
text-align: left;
}
.call-to-action_component.compact .wrapInner .contentContainer .linkWrap .btn:hover {
background: #fff !important;
color: #eb5d4d !important;
}
.call-to-action_component .wrapInner .contentContainer {
max-width: 23rem !important;
padding: 2rem;
}
.call-to-action_component.full-width-centered .wrapInner .contentContainer {
padding-top: 4rem;
}
.call-to-action_component.compact .wrapInner .contentContainer {
max-width: none !important;
}
@media(min-width:560px) {
.call-to-action_component.compact .wrapInner {
max-width: 90% !important;
margin-left: auto !important;
margin-right: auto !important;
}
}
@media(min-width:768px) {
.call-to-action_component.compact .wrapInner .contentContainer {
display: flex;
align-items: flex-end;
}
.call-to-action_component.compact .wrapInner .contentContainer .introWrap {
text-align: left;
padding-right: 4rem;
}
.call-to-action_component.compact .wrapInner .contentContainer .linkWrap {
min-width: 33%;
}
.call-to-action_component.compact .wrapInner .contentContainer .linkWrap .btn {
max-width: 10rem !important;
}
.call-to-action_component .wrapInner .contentContainer {
max-width: 33rem !important;
}
}
@media(min-width:1024px) {
.call-to-action_component.compact .wrapInner {
max-width: calc(100vw/2);
margin-left: 0;
}
.call-to-action_component.full-width-offset .wrapInner {
margin-left: 0;
text-align: left;
}
.call-to-action_component.full-width-offset .wrapInner::before {
content: '';
width: calc((100vw/4) - 1px);
height: calc((100vw/4) - 1px);
background-color: #f8f8f8;
position: absolute;
top: 0;
right: 0;
}
.call-to-action_component.full-width-offset .wrapInner .contentContainer {
margin-left: 2rem;
}
.call-to-action_component.full-width-offset .wrapInner {
max-width: 75%;
}
.component-group-begin_component .call-to-action_component .wrapInner {
max-width: 100%;
text-align: left;
}
.call-to-action_component {
margin-bottom: 3rem;
}
.call-to-action_component.compact .wrapInner .contentContainer .linkWrap .btn {
max-width: none !important;
}
.call-to-action_component.half-width, .call-to-action_component.full-width-offset {
background-image: none !important;
padding-top: 2rem;
margin-top: 0;
}
.call-to-action_component.half-width .wrapInner .contentContainer {
max-width: 19rem !important;
padding-top: 3rem;
padding-left: 0;
}
.call-to-action_component.half-width .wrapInner .introWrap {
padding-bottom: 0.5rem;
}
}
@media(min-width:1920px) {
.call-to-action_component.half-width .wrapInner .contentContainer {
max-width: 30rem !important;
}
}
/* FULL WIDTH IMAGE / TEXT ------------------------------------------------------------------------------*/
.map_component {
margin: 6rem 0 3rem;
position: relative;
}
.home .map_component {
margin-bottom: -3rem;
}
.map_component img {
width: 100%;
}
.map_component .imageCaption {
padding: 0.8rem 1.5rem;
background: #1d454b;
text-shadow: none;
text-align: center;
font-size: 0.8rem;
top: -3.5rem;
}
@media(min-width:560px) {
.map_component .imageCaption {
font-size: 1rem;
}
}
@media(min-width:1024px) {
.map_component .imageCaption {
font-size: 1.2rem;
top: -3rem;
}
}
/* SEPARATOR ------------------------------------------------------------------------------------------------------------*/
.content-separator_component {
display: none !important
}
@media (min-width: 1024px) {
.content-separator_component {
padding: 0 !important;
height: 1px !important;
display: block !important;
max-width: none !important
}
}
/* SPACER ----------------------------------------------------------------------------------------------------------------*/
.spacer_component {
padding: 2rem;
}
@media (min-width: 480px) {
.spacer_component {
padding: 3rem;
}
}
@media (min-width: 768px) {
.spacer_component {
padding: 3.5rem;
}
}
@media (min-width: 1024px) {
.spacer_component {
padding: 4rem;
}
}
.accordion_component + .spacer_component {
padding-top: 0 !important;
}
/* COMPONENT GROUP WRAPPER -------------------------------------------------------------------------------------------------*/
.component-group-begin_component {
width: 100%;
margin: 2px 0 !important;
position: relative;
overflow: hidden;
}
.component-group-begin_component.three-column, .component-group-begin_component.two-column, .component-group-begin_component.testimonials {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
}
.component-group-begin_component.two-column#Full_two-column-promotion {
flex-wrap: wrap;
justify-content: flex-start;
}
@media(min-width:768px) {
.component-group-begin_component.two-column.yes {
justify-content: flex-end !important;
}
.component-group-begin_component.normal-padding {
padding: 2rem;
}
}
.component-group-begin_component.testimonials.position-left {
justify-content: flex-start;
}
.component-group-begin_component.testimonials.position-right {
justify-content: flex-end;
}
.component-group-begin_component.testimonials.position-right .small-testimonial_component {
margin: 0;
}
.component-group-begin_component.top-bottom-padding {
padding: 2rem 0;
}
@media(min-width:1024px) {
/* Making two columns on what's inside sit side by side */
.component-group-begin_component.two-column > .main {
width: 50%;
}
.component-group-begin_component.two-column .component-group-begin_component.slider {
z-index: 1;
}
.component-group-begin_component .content-images_component.third .textWrap {
padding: 0 !important;
}
/* padding fixes - white space vs edge to edge */
.component-group-begin_component.normal-padding {
padding: 4rem !important;
}
.component-group-begin_component.normal-padding.remove-space-above, .component-group-begin_component.top-bottom-padding.remove-space-above {
padding-top: 0 !important;
}
.component-group-begin_component.normal-padding.remove-space-below, .component-group-begin_component.top-bottom-padding.remove-space-below {
padding-bottom: 0 !important;
}
.component-group-begin_component.top-bottom-padding {
padding: 4rem 0;
}
.component-group-begin_component.top-bottom-padding {
padding: 4rem 0 !important;
}
}
@media(min-width:1300px) {
.component-group-begin_component.two-column .component-group-begin_component.slider {
width: 65.5%;
}
}
@media(min-width:1500px) {
.component-group-begin_component.two-column .component-group-begin_component.slider {
width: 65.7%;
}
}
/* BACK LINK ----------------------------------------------------------------------------------------------------------------*/
.back-link_component .breadcrumb {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.back-link_component .breadcrumb .introd {
margin: 0 !important;
}
.back-link_component p, .back-link_component span {
margin: 0 !important;
}
.back-link_component a {
text-decoration: none;
}
.back-link_component a:hover {
opacity: 0.8;
}
/* ACCORDION ----------------------------------------------------------------------------------------------------------------- */
.accordion_component.wrap {
display: block;
padding: 8px 2rem;
}
.singleProductView .accordion_component.wrap {
padding: 0 1.8rem;
}
@media (min-width: 560px) {
.singleProductView .accordion_component.wrap {
padding: 0 2.4rem;
}
}
.accordion_component .wrapInner {
width: 90%;
margin-left: auto;
margin-right: auto;
}
.singleProductView .accordion_component .wrapInner {
width: 100%;
}
.accordion_component .titleWrap {
text-align: left;
padding: 0.8rem !important;
cursor: pointer;
}
.accordion_component .wrapInner .titleWrap::before, .accordion_component .wrapInner .titleWrap.open::before {
content: '';
background-repeat: no-repeat;
height: 0.8rem;
width: 0.8rem;
display: inline-block;
position: absolute;
left: -0.8rem;
top: 1.15rem;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23011F26' stroke-width='4'/%3E%3C/svg%3E");
opacity: 1;
transition: 0.4s ease-in-out;
transform: scale(0.6);
}
.accordion_component .wrapInner:hover .titleWrap::before, .accordion_component .wrapInner .titleWrap.open::before {
opacity: 1;
left: -0.7rem;
transform: scale(1);
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23eb5d4d' stroke-width='4'/%3E%3C/svg%3E");
transition: 0.4s ease-in-out;
}
.accordion_component .wrapInner .sectionTitle {
margin: 0;
padding-top: 0;
font-size: 1.05rem;
line-height: 1.4;
font-family: 'Morn W01 Light';
transition: 0.4s ease-in-out;
}
.accordion_component .wrapInner:hover .sectionTitle, .accordion_component .wrapInner .titleWrap.open .sectionTitle {
color: #eb5d4d;
padding-left: 0;
padding-right: 0;
transition: 0.4s ease-in-out;
}
.accordion_component .contentWrap {
font-size: 0.8rem;
padding: 0 !important;
}
.accordion_component .JSaccordianCollapse {
text-align: left;
padding: 0 0.6rem 1rem;
display: none;
color: #011F26;
}
.accordion_component .JSaccordianCollapse p, .accordion_component .JSaccordianCollapse li {
max-width: none;
margin-left: 0.2rem;
font-size: 0.85rem;
line-height: 1.5;
}
.accordion_component .JSaccordianCollapse .sectionDetails ul {
padding-left: 0.6rem;
}
.accordion_component .JSaccordianCollapse .sectionDetails ul li {
line-height: 1.3;
list-style-type: '\2014';
list-style-position: outside;
padding-bottom: 0.5rem;
padding-left: 0.5rem;
}
@media (min-width: 768px) {
.accordion_component .wrapInner .sectionTitle {
font-size: 1.15rem;
}
.singleProductView .accordion_component.wrap {
padding: 0 2.2rem;
}
}
@media (min-width: 1024px) {
.accordion_component.main + .accordion_component.main {
margin-top: 0
}
.singleProductView .accordion_component.wrap {
padding: 0 1.3rem;
}
}
/* BACKGROUNDS ----------------------------------------------------------------------------------------------------------------*/
.transparent {
background-color: none !important
}
.white {
background-color: rgba(255, 255, 255, 1);
}
.grey {
background-color: #f8f8f8;
}
.midnight {
background-color: #001F26;
}
.midnight h1, .midnight h2, .midnight h3, .midnight h4, .midnight p, .midnight a, .midnight li {
color: #fff;
}
.cotton {
background-color: #C7C4BA;
}
.orchid {
background-color: #CDB8AF;
}
.lavender {
background-color: #BEBFCB;
}
.peach {
background-color: #E6CBC2;
}
/* BLACK */
.black {
background-color: rgba(0, 0, 0, 1);
color: rgba(255, 255, 255, 1);
}
/* text links */
.black a:not(.btn), .black .nogo {
color: rgba(255, 255, 255, 1);
}
/* header */
.black .wrapInner .sectionTitle {
color: rgba(255, 255, 255, 1);
}
/* button */
.black .wrapInner .btn {
background-color: rgba(255, 255, 255, 1);
border-color: rgba(0, 0, 0, 1);
color: rgba(0, 0, 0, 1);
}
/* download */
.black .wrapInner .documentWrap .icon {
background-color: rgba(255, 255, 255, 0.3);
color: rgba(255, 255, 255, 1);
background-image: url('data:image/svg+xml,%3C?xml%20version%3D%221.0%22%20?%3E%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M35,29.7v4H15v-4c0-1.1-0.9-2-2-2l0,0c-1.1,0-2,0.9-2,2v6c0,1.1,0.9,2,2,2h24c1.1,0,2-0.9,2-2v-6c0-1.1-0.9-2-2-2l0,0C35.9,27.7,35,28.6,35,29.7z%20M27,21.4v-8c0-1-0.9-1.9-1.9-1.9h-0.2c-1,0-1.9,0.9-1.9,1.9v8.1h-3.9c-0.6,0-1,0.4-1,1c0,0.2,0.1,0.4,0.2,0.6l5.9,7.4c0.3,0.4,1,0.5,1.4,0.2c0.1-0.1,0.1-0.1,0.2-0.2l5.9-7.4c0.3-0.4,0.2-1.1-0.2-1.4c-0.2-0.1-0.4-0.2-0.6-0.2H27V21.4z%22/%3E%3C/svg%3E');
}
/* COLOUR END */
/* SLIDE GALLERIES ----------------------------------------------------------------------------------------------------------------*/
.JSslider {
display: block;
position: relative;
overflow: hidden;
height: 100%;
width: 100%;
}
.JSslider .slideWrapper {
position: relative;
width: 100%;
height: 100%;
display: flex;
flex-wrap: nowrap;
align-items: center;
flex-direction: row;
}
.JSslider .slideWrapper .slide {
display: flex;
flex-shrink: 0;
flex-basis: 100%;
width: 100%;
align-self: stretch;
align-content: center;
justify-content: center;
align-items: self-start;
overflow: hidden;
}
.JSslider .slideWrapper .slide img {
max-width: none;
width: 100%;
height: auto;
position: relative;
}
.JSslider .slideNavWrapper {
display: none;
}
.JSslider .slideNavWrapper .slideNav.prev, .JSslider .slideNavWrapper .slideNav.next {
display: inline-block;
height: 2.5rem;
width: 2.5rem;
margin: 0 0 -2.5rem;
text-indent: -999em;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.55 19.63-13.03-8.99 13.03-8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center center;
cursor: pointer;
background-size: 2rem;
vertical-align: middle;
position: absolute;
left: 1rem;
bottom: 50%;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 50%;
}
.JSslider .slideNavWrapper .slideNav.next {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E");
left: auto;
right: 1rem;
background-position: center center;
}
.JSslider .slideNavWrapper .slideJumpNav {
display: inline-block;
height: 2.5rem;
line-height: 2.5rem;
padding: 0;
vertical-align: middle;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
text-align: center;
}
.JSslider .slideNavWrapper .slideJumpNav .jumpNav {
display: inline-block;
height: 0.5rem;
width: 0.5rem;
border-radius: 50%;
background: #fff;
margin: 0 0.15rem;
opacity: 0.5;
cursor: pointer;
box-shadow: 0 0 0.125rem 0 rgba(0, 0, 0, 0.4);
}
.JSslider .slideNavWrapper .slideJumpNav .jumpNav.active {
opacity: 1;
}
/* BLOG ---------------------------------------------------------------------------------------------------------------- */
.blogOuterWrapper {
width: 100%;
margin: 0 auto;
padding: 0;
}
.blogModule .pageHeader {
display: flex;
align-items: center;
justify-content: flex-start;
min-height: 9rem;
background-color: #f8f8f8;
padding-top: 0 !important;
padding-bottom: 0 !important;
width: 100%;
}
.blogModule .pageHeader h1 {
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.2rem;
font-size: 1.2rem;
line-height: 1.5;
margin: 0;
text-align: center !important;
color: #011f26;
width: 100%;
padding: 0;
}
.blogOuterWrapper .leftColumn {
width: 100%;
margin: 0 auto;
padding-top: 1rem;
}
.blogOuterWrapper .rightColumn {
width: 100%;
margin: 0 auto;
padding: 0 1rem 1rem;
text-align: center;
}
.blogOuterWrapper .rightColumn .buttonWrapper .btn {
margin: 0 0 2rem;
}
.blogOuterWrapper .rightColumn .blogMenuWrap {
padding: 1.5rem 0;
}
.blogOuterWrapper .rightColumn .blogMenuWrap .blogMenuTitle h2 {
padding-bottom: 1rem;
}
.blogOuterWrapper .rightColumn .blogMenuWrap .menuItem a {
text-decoration: none;
font-size: 1.5rem;
padding-bottom: 0.5rem;
display: block;
text-transform: none;
}
.blogOuterWrapper .rightColumn .archiveMenu {
display: none !important
}
.blogOuterWrapper .rightColumn .blogsTags .blogMenuTitle {
display: none;
}
.blogOuterWrapper .rightColumn .blogsTags ul li {
display: inline-block;
margin: 4px;
}
.blogOuterWrapper .rightColumn .blogsTags ul li a {
text-decoration: none;
background: #f6f6f6;
padding: 0.5rem 1rem;
font-size: 1rem;
color: #011F26 !important;
display: block;
text-transform: lowercase;
}
/* blog landing blocks */
.blogOuterWrapper .blogLanding .columnWrap {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
}
.blogOuterWrapper .blogLanding .column {
width: 90vw;
padding: 0;
margin: 0 auto 5vw;
background: #f8f8f8;
justify-content: flex-start;
}
.blogOuterWrapper .blogLanding .column .textWrap {
padding: 1.5rem 1.5rem 1rem;
}
.blogOuterWrapper .blogLanding .column .textWrap .blogDate {
display: block;
padding-top: 0.5rem;
padding-bottom: 0;
}
.blogOuterWrapper .blogLanding .column .textWrap .snippet p {
display: inline;
}
.blogOuterWrapper .blogLanding .column .textWrap .interact .btn {
margin-top: 1.5rem;
}
/* single blog post */
.blogModule .blogImages .imageContainer img {
width: 100%;
aspect-ratio: 1 / 1;
object-fit: cover;
}
.blogModule .singleBlogPost {
padding: 4rem 2rem;
}
.blogModule .singleBlogPost .footerNav {
text-align: left;
padding-top: 1rem;
}
.blogModule .singleBlogPost .footerNav .newerPost {
float: right;
text-align: right;
}
@media (min-width: 560px) {
.blogModule .blogImages .imageContainer img {
aspect-ratio: 2 / 1;
}
}
@media (min-width: 768px) {
.blogModule .blogImages .imageContainer img {
aspect-ratio: 3 / 1;
}
.blogOuterWrapper .blogLanding .columnWrap {
padding-left: 3vw;
}
.blogOuterWrapper .blogLanding .column {
width: 46vw;
margin: 0px 2vw 2vw 0;
}
}
@media (min-width: 1024px) {
.blogOuterWrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
}
.blogOuterWrapper .leftColumn {
width: 72vw;
margin: 0;
}
.blogOuterWrapper .rightColumn {
width: 28vw;
margin: 0;
padding-top: 4rem;
}
.blogOuterWrapper .blogLanding .column {
margin-bottom: 3vw;
}
.blogModule .blogImages .imageContainer img {
aspect-ratio: 16 / 5;
}
.blogModule .singleBlogPost {
padding: 4rem 2rem 2rem;
max-width: 800px;
margin: -4rem auto 4rem;
background: #fff;
border: 2px solid #011F26;
}
}
/* paging */
.pagingNavigation {
margin: 0;
text-align: center;
padding: 1rem 0;
}
.pagingNavigation ul {
display: block;
}
.pagingNavigation ul li {
display: inline-block;
margin: 0 0.25rem;
}
.pagingNavigation ul li a {
display: block;
border: 0.125rem solid #fff;
text-decoration: none;
color: #011F26;
width: 2rem;
height: 2rem;
line-height: 2rem;
border-radius: 1rem;
}
.pagingNavigation ul li a:hover, .pagingNavigation ul li a:focus, .pagingNavigation ul li a:active {
background: #fff;
color: #011F26;
}
.pagingNavigation ul li a.next {
position: relative;
text-indent: -999em;
width: 2.5rem;
background-image: url('data:image/svg+xml,%3C?xml%20version%3D%221.0%22%20?%3E%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M33.3,24.2c-0.1-0.2-0.2-0.5-0.4-0.6L21.5,12.3c-0.7-0.7-1.9-0.7-2.7,0l0,0c-0.7,0.7-0.7,1.9,0,2.7l10,10l-10,10c-0.7,0.7-0.7,1.9,0,2.7l0,0c0.7,0.7,1.9,0.7,2.7,0l11.3-11.3C33.4,25.8,33.5,24.9,33.3,24.2z%22/%3E%3C/svg%3E');
background-repeat: no-repeat !important;
background-position: 50% 50% !important;
background-size: 80% !important;
}
.pagingNavigation ul li a.previous {
position: relative;
text-indent: -999em;
width: 2.5rem;
background-image: url('data:image/svg+xml,%3C?xml%20version%3D%221.0%22%20?%3E%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M31.2,35l-10-10l10-10c0.7-0.7,0.7-1.9,0-2.7l0,0c-0.7-0.7-1.9-0.7-2.7,0L17.2,23.5c-0.4,0.4-0.6,1-0.5,1.5c0,0.5,0.2,1,0.6,1.4l11.3,11.3c0.7,0.7,1.9,0.7,2.7,0l0,0C31.9,37,31.9,35.8,31.2,35z%22/%3E%3C/svg%3E');
background-repeat: no-repeat !important;
background-position: 50% 50% !important;
background-size: 80% !important;
}
.pagingNavigation ul li .preBefore, .pagingNavigation ul li .postAfter {
display: inline-block;
margin: 0;
text-decoration: none;
color: #fff;
font-size: 2rem;
overflow: hidden;
padding: 0 0.5rem 0 0.125rem;
vertical-align: bottom;
}
.imageCaption {
position: absolute;
top: 0;
width: 100%;
text-align: left;
padding: 0.5rem;
font-size: 0.75rem;
text-shadow: 0 0 0.125rem #011F26;
color: #fff;
}
/* FAQs section header ----------------------------------------------------------------------------------------------------------------- */
.faqs-section-header_component {
padding: 3rem 0 1.5rem !important;
}
.faqs-section-header_component .wrapInner {
margin-left: auto;
margin-right: auto;
padding: 0 1rem;
width: 90%;
}
.faqs-section-header_component .wrapInner .titleWrap {
padding: 0;
}
.faqs-section-header_component .sectionTitle {
font-family: 'Morn W01 Medium';
}
/* CONTACT PAGE ---------------------------------------------------------------------------------------------------------------*/
.enquiriesModule {
padding: 0;
}
.enquiriesModule .formContainer {
margin-top: 0;
}
.enquiriesModule.userSubmissionForm .pageHeader h2 {
padding-top: 0 !important;
}
/* MAILING LIST ----------------------------------------------------------------------------------------------------------------*/
.mailingListSubscribe {
padding: 0;
}
.mailingListSubscribe .form {
padding: 0;
padding-bottom: 2rem;
}
.mailingListSubscribe label {
display: none;
}
.mailingListSubscribe fieldset {
width: auto;
padding-left: 0;
padding-top: 0;
}
.mailingListSubscribe h2 {
padding: 0;
font-size: 1.3rem;
}
.mailingListSubscribe p {
font-size: 0.9rem;
}
.mailingListSubscribe .buttonContainer {
width: 100%;
text-align: center;
vertical-align: middle;
display: inline-block;
margin-top: 0;
}
.mailingListSubscribe a {
color: #233652;
}
.input-group-btn a {
color: #fff;
text-transform: uppercase;
padding-left: 2.5rem;
font-size: 0.8rem;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 1.2rem center/0.6rem, #011F26;
background-repeat: no-repeat;
margin-left: 0;
}
.input-group-btn a:hover {
color: #fff;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 1.2rem center/0.6rem, #eb5d4d;
background-repeat: no-repeat;
}
@media (min-width: 400px) {
.mailingListSubscribe .buttonContainer {
width: auto;
margin-top: 1rem;
}
.mailingListSubscribe .buttonContainer .go {
margin: 0;
width: auto;
}
.mailingListSubscribe .titleWrap {
margin-right: 0.5rem;
margin-top: 1rem;
}
.mailingListSubscribe fieldset .fieldWrap {
margin-right: 0.5rem;
margin-top: 0.4rem;
}
}
.mailingListSubscribe .buttonContainer .go {
text-align: center;
background-color: #011F26;
color: #fff;
}
.mailingListSubscribe .titleWrap {
vertical-align: middle;
display: block;
margin-right: 0;
margin-top: 1rem;
}
.mailingListSubscribe .titleWrap h2 {
font-size: 1.5rem;
margin-bottom: 0;
}
.mailingListSubscribe fieldset {
vertical-align: middle;
display: block;
padding: 0 !important;
margin: 0 !important;
}
.mailingListSubscribe fieldset .fieldWrap {
vertical-align: middle;
display: block;
margin-right: 0;
margin-top: 0.5em;
}
.mailingListSubscribe fieldset .fieldWrap input {
width: 100%;
max-width: 472px;
border: 2px solid #e2e2e2;
;
border-radius: 0.4rem;
margin: 0;
background-color: #fff;
}
.mailingListSubscribe .small.privacyStatement {
width: 100%;
font-size: 0.7rem;
margin: 0.8rem 0 0;
display: block;
padding-left: 0;
padding-rtight: 0;
max-width: none;
}
.mailingListSubscribe .small.privacyStatement a {
font-size: 0.7rem;
}
.mailingListSubscribe .noThanks {
display: none;
}
.mailingListSubscribe.fix {
display: block;
position: fixed;
top: 50%;
left: 50%;
width: 90%;
max-width: 600px;
height: auto;
z-index: 1000;
transform: translate(-50%, -50%);
}
.mailingListSubscribe.fix + .mailingListCover {
display: block;
opacity: 0.5;
}
.mailingListSubscribe.fix fieldset .fieldWrap input {
width: 100%;
}
.mailingListSubscribe.fix .buttonContainer {
width: 100%;
}
.mailingListSubscribe.fix .buttonContainer .noThanks {
display: inline-block;
margin: 0;
}
.mailingListCover {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #011F26;
z-index: 999;
display: none;
transition: all 0.5s 0s 0.2s linear 0s;
}
/* FOOTER ----------------------------------------------------------------------------------------------------------------*/
.siteFooter {
position: relative;
padding: 2rem;
background: #f8f8f8 !important;
text-align: left;
margin-top: 3rem;
display: flex;
flex-direction: column;
}
.basket.basketInclude .FooterNav li {
padding: 0.4rem 0;
}
.siteFooter .FooterNav li a {
text-decoration: none;
display: block;
padding: 0.25rem 0;
}
.siteFooter a, .siteFooter li, .siteFooter p, .siteFooter span {
font-size: 0.8rem;
}
.footerLogo {
display: none;
}
.siteFooter .subscribeBox {
order: 1;
}
.siteFooter .footerSocial {
order: 4;
}
.siteFooter .footerNav {
order: 2;
}
.siteFooter .contactDetails {
order: 3;
}
/* contact details */
.siteFooter .contactDetails {
padding: 2rem 0;
}
.siteFooter .contactDetails .org {
font-family: 'Morn W01 Medium';
padding: 0.6rem 0 0.5rem;
display: block;
}
.siteFooter .contactDetails .contactAddress, .siteFooter .contactDetails .contactAddress span {
display: block;
}
.siteFooter .contactDetails .contactAddress span {
padding: 0.1rem 0;
}
.siteFooter .contactDetails .contactEmail, .siteFooter .contactDetails .sectionTitle, .siteFooter .contactDetails span.footLabel {
display: none;
}
@media (min-width: 1024px) {
.siteFooter {
padding-bottom: 0;
}
.mailingListSubscribe .form {
padding-bottom: 1rem;
}
}
.siteInfo {
display: block;
padding: 2rem 1.5rem;
font-size: 0.75rem;
}
/* social follow links */
.socialFollow {
display: inline-block;
vertical-align: top;
margin: 0 4px 8px;
width: 48px;
height: 48px;
background: #001F26;
border-radius: 50%
}
.socialFollow a {
display: block;
width: 100%;
height: 100%;
text-indent: -999em;
background-position: 50% 50% !important;
background-repeat: no-repeat !important;
background-size: 40px 40px !important
}
.socialFollow:hover {
background: #ea5d4c;
}
.socialFollow:hover, .socialFollow a:hover {
opacity: 1 !important;
}
/* shared icon SVGs */
.youtubeIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cpath%20d%3D%22M64%2C30.4a7.2%2C7.2%2C0%2C0%2C0-7.2-7.2H23.2A7.2%2C7.2%2C0%2C0%2C0%2C16%2C30.4V49.6a7.2%2C7.2%2C0%2C0%2C0%2C7.2%2C7.2H56.8A7.2%2C7.2%2C0%2C0%2C0%2C64%2C49.6ZM35.2%2C48.1V30l13.7%2C9Zm0%2C0%22%20style%3D%22fill%3A%23ffffff%3Bfill-rule%3Aevenodd%22/%3E%3C/svg%3E);
}
.instagramIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20id%3D%22Layer_1%22%20data-name%3D%22Layer%201%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20150%20150%22%3E%3Cpath%20style%3D%22fill%3A%23ffffff%22%20d%3D%22M74.79%2C60.89A14.32%2C14.32%2C0%2C1%2C1%2C60.47%2C75.21c.42-8%2C6.74-14.32%2C14.32-14.32m0-8.42A22.92%2C22.92%2C0%2C0%2C0%2C52.05%2C75.21%2C22.74%2C22.74%2C0%2C1%2C0%2C74.79%2C52.47Zm18.95-13a16.89%2C16.89%2C0%2C0%2C1%2C16.84%2C16.84V93.74a16.89%2C16.89%2C0%2C0%2C1-16.84%2C16.84H56.26A16.89%2C16.89%2C0%2C0%2C1%2C39.42%2C93.74V56.26A16.89%2C16.89%2C0%2C0%2C1%2C56.26%2C39.42H93.74m0-8.42H56.26A25.34%2C25.34%2C0%2C0%2C0%2C31%2C56.26V93.74A25.34%2C25.34%2C0%2C0%2C0%2C56.26%2C119H93.74A25.34%2C25.34%2C0%2C0%2C0%2C119%2C93.74V56.26A25.34%2C25.34%2C0%2C0%2C0%2C93.74%2C31Zm3.79%2C16a5.06%2C5.06%2C0%2C1%2C0%2C5%2C5A4.87%2C4.87%2C0%2C0%2C0%2C97.53%2C47Z%22/%3E%3C/svg%3E);
}
.googleplusIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cpath%20d%3D%22M30.7%2C37.7v5.6h9.2c-.4%2C2.4-2.8%2C7-9.2%2C7a10.3%2C10.3%2C0%2C0%2C1%2C0-20.5%2C9.1%2C9.1%2C0%2C0%2C1%2C6.5%2C2.5L41.6%2C28a15.6%2C15.6%2C0%2C0%2C0-10.9-4.2%2C16.3%2C16.3%2C0%2C0%2C0%2C0%2C32.5c9.4%2C0%2C15.6-6.6%2C15.6-15.9a15%2C15%2C0%2C0%2C0-.3-2.7Z%22%20style%3D%22fill%3A%23ffffff%22/%3E%3Cpath%20d%3D%22M65.5%2C37.7H60.9V33H56.3v4.6H51.6v4.6h4.6V47h4.6V42.3h4.6Z%22%20style%3D%22fill%3A%23ffffff%22/%3E%3C/svg%3E);
}
.linkedinIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cpath%20d%3D%22M61.6%2C44.7v16H52.4V45.7c0-3.7-1.3-6.3-4.7-6.3a5.1%2C5.1%2C0%2C0%2C0-4.8%2C3.4%2C6.4%2C6.4%2C0%2C0%2C0-.3%2C2.3V60.7H33.3s.1-25.3%2C0-27.9h9.3v4h0A9.2%2C9.2%2C0%2C0%2C1%2C51%2C32.1c6.1%2C0%2C10.7%2C4%2C10.7%2C12.6Zm-38-25.4c-3.2%2C0-5.3%2C2.1-5.3%2C4.8A4.8%2C4.8%2C0%2C0%2C0%2C23.5%2C29h.1c3.2%2C0%2C5.2-2.1%2C5.2-4.8a4.8%2C4.8%2C0%2C0%2C0-5.2-4.8ZM18.9%2C60.7h9.3V32.8H18.9Zm0%2C0%22%20style%3D%22fill%3A%23ffffff%22/%3E%3C/svg%3E);
}
.pinterestIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cpath%20d%3D%22M43.1%2C50.9c-2.9-.2-4.2-1.7-6.5-3.1-1.3%2C6.7-2.8%2C13-7.4%2C16.4-1.4-10.1%2C2.1-17.6%2C3.7-25.6-2.8-4.7.3-14.1%2C6.2-11.7S32.9%2C44.1%2C41.9%2C46s13.2-16.3%2C7.4-22.2c-8.4-8.6-24.5-.2-22.5%2C12%2C.5%2C3%2C3.6%2C3.9%2C1.2%2C8-5.4-1.2-7-5.4-6.8-11.1.3-9.3%2C8.3-15.8%2C16.4-16.7%2C10.2-1.1%2C19.7%2C3.7%2C21%2C13.3S54%2C51.7%2C43.1%2C50.9Zm0%2C0%22%20style%3D%22fill%3A%23ffffff%22/%3E%3C/svg%3E);
}
.twitterIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cpath%20d%3D%22M64.8%2C24.6A20.3%2C20.3%2C0%2C0%2C1%2C59%2C26.2a10.2%2C10.2%2C0%2C0%2C0%2C4.5-5.6A20.4%2C20.4%2C0%2C0%2C1%2C57%2C23a10.2%2C10.2%2C0%2C0%2C0-17.4%2C9.3%2C28.9%2C28.9%2C0%2C0%2C1-21-10.6%2C10.2%2C10.2%2C0%2C0%2C0%2C3.2%2C13.6A10.1%2C10.1%2C0%2C0%2C1%2C17.2%2C34h0a10.2%2C10.2%2C0%2C0%2C0%2C8.2%2C10%2C10.2%2C10.2%2C0%2C0%2C1-2.7.4l-1.9-.2a10.2%2C10.2%2C0%2C0%2C0%2C9.5%2C7.1%2C20.4%2C20.4%2C0%2C0%2C1-12.6%2C4.4H15.2a28.8%2C28.8%2C0%2C0%2C0%2C15.6%2C4.6c18.7%2C0%2C29-15.5%2C29-29q0-.7%2C0-1.3a20.7%2C20.7%2C0%2C0%2C0%2C5.1-5.3Zm0%2C0%22%20style%3D%22fill%3A%23ffffff%22/%3E%3C/svg%3E);
}
.vimeoIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cpath%20d%3D%22M56%2C21.8c4.4.1%2C6.5%2C2.6%2C6.6%2C7.4%2C0%2C.3%2C0%2C.7%2C0%2C1q-.3%2C6.2-9.2%2C16.8T37.8%2C58.2q-4%2C0-6.6-6.8l-1.9-6.2-1.8-6.2q-2-6.8-4.3-6.8a14.1%2C14.1%2C0%2C0%2C0-3.5%2C2l-2.1-2.5%2C3.3-2.8%2C3.3-2.7c2.9-2.3%2C5.1-3.6%2C6.7-3.8h.6c3.1%2C0%2C5.1%2C2.2%2C5.8%2C6.8l1.1%2C6.3c.3%2C1.6.5%2C2.7.7%2C3.4q1.6%2C6.4%2C3.3%2C6.4c.9%2C0%2C2.3-1.4%2C4.3-4.2s2.9-5%2C3-6.3a7%2C7%2C0%2C0%2C0%2C.1-.8c0-1.9-1-2.8-3.1-2.8a9.7%2C9.7%2C0%2C0%2C0-3.3.7q3.2-9.8%2C12.2-9.8Zm0%2C0%22%20style%3D%22fill%3A%23ffffff%22/%3E%3C/svg%3E);
}
.facebookIcon a {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cpath%20d%3D%22M50.2%2C40H43.5V63.8H33.6V40H28.9V31.6h4.7V26.2c0-3.9%2C1.8-10%2C10-10h7.3v8.1H45.6a2%2C2%2C0%2C0%2C0-2.1%2C2.3v4.9h7.5Zm0%2C0%22%20style%3D%22fill%3A%23ffffff%22/%3E%3C/svg%3E);
}
@media(min-width:1024px) {
.siteFooter {
flex-direction: row;
}
.siteFooter .subscribeBox, .siteFooter .footerNav, .siteFooter .contactDetails {
padding: 1rem;
}
.siteFooter .subscribeBox {
order: 1;
width: 30%;
padding-right: 2rem;
}
.siteFooter .footerSocial {
order: 3;
position: absolute;
left: 32%;
top: 290px;
}
.siteFooter .footerNav {
order: 4;
width: 45%;
}
.siteFooter .footerNav ul {
display: flex;
flex-wrap: wrap;
}
.siteFooter .footerNav ul li {
padding: 0.3rem;
width: 50%;
}
.siteFooter .contactDetails {
order: 2;
width: 30%;
}
}
@media(min-width:1450px) {
.siteFooter .footerSocial {
left: 31%;
}
}
/* SUPPORTING LOGOS ----------------------------------------------------------------------------------------------------------------*/
.supportingLogos {
padding: 1rem;
display: none;
}
.supportingLogos .logoContainer {
background: #fff;
padding: 0;
margin: 0 1.5rem 0.5rem 0;
display: inline-block;
position: relative;
height: 3rem;
}
.supportingLogos a {
display: block;
width: 100%;
height: 100%;
}
.supportingLogos a img {
height: 100%;
}
/* SMALL PRINT ----------------------------------------------------------------------------------------------------------------*/
.smallprintWrap {
position: relative;
padding: 1rem;
color: #011F26;
width: 100%;
max-width: none;
margin: 0 auto;
opacity: 1;
}
.smallprintWrap a {
color: #011F26;
}
.smallprintWrap .smallPrint {
font-size: 0.75rem;
}
.smallprintWrap .smallPrint .smallPrintLink {
display: inline;
padding: 0 1rem 0 0;
}
.smallprintWrap .smallPrint .smallPrintLink a {
letter-spacing: 0;
text-transform: none;
}
.smallprintWrap .siteInfo {
font-size: 0.75rem;
padding: 0 1rem 1rem;
}
.smallprintWrap .legalDetails {
font-size: 0.75rem;
margin-bottom: 0.5rem;
}
.smallprintWrap .siteAuthor {
font-size: 0.75rem;
letter-spacing: 0;
text-transform: none;
}
/* SOCIAL SHARE ----------------------------------------------------------------------------------------------------------------*/
.socialButtons {
text-align: center;
margin-top: 0;
padding: 1rem;
width: 100%;
clear: both;
}
.socialButtons .socialItem {
display: inline-block;
vertical-align: top;
margin: 0 0.125rem 0.5rem 0;
width: 2rem;
height: 2rem;
}
.socialButtons .socialItem a {
display: block;
width: 100%;
height: 100%;
text-indent: -999em;
background-position: 0 0 !important;
background-repeat: no-repeat !important;
background-size: 2rem !important;
}
.socialButtons .shareTitle {
margin-bottom: 0.5rem;
}
.socialButtons .fb-share-button {
position: absolute;
left: 0;
opacity: 0;
}
/* COOKIE POLICY ----------------------------------------------------------------------------------------------------------------*/
.ckMessageOuter {
position: fixed;
bottom: 0;
left: 0;
right: auto;
width: 100%;
margin-left: 0;
z-index: 9999999;
font-family: Helvetica, Arial, "sans-serif" !important;
}
.ckContainer {
position: relative;
background: #011F26;
color: #fff;
padding: 1rem 1rem 1.25rem;
font-size: 0.8rem;
min-height: 3.75rem;
}
@media (min-width: 560px) {
.ckContainer {
padding: 0.75rem 12.5rem 12.25rem 1rem;
}
.ckContainer .btn.closeMessage {
position: absolute;
top: 1rem;
right: 1rem;
width: auto;
}
.ckContainer .ckNotice {
padding: 0.25rem 0 0;
}
}
.ckContainer .btn.closeMessage {
margin: 0;
display: block;
width: 100%;
height: auto;
font-size: 0.8rem;
text-decoration: none;
background-color: #27880d !important;
color: #fff;
border-radius: 1.5rem;
font-family: Helvetica, Arial, "sans-serif" !important;
font-weight: bold;
}
.ckContainer .ckNotice {
padding: 1rem 0.25rem 0;
}
.ckContainer .ckNotice a {
text-decoration: underline;
color: inherit;
}
/* POPUP CONTACT FORM ----------------------------------------------------------------------------------------------------------------*/
.JScontact {
display: none;
}
.JScontact.fix {
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 99999999;
background: rgba(0, 0, 0, 0.5);
max-width: 1600px;
overflow-x: hidden;
overflow-y: auto;
}
@media (min-width: 1440px) {
.JScontact.fix {
left: 50%;
margin-left: -720px;
}
}
.JScontact.fix .enquiryInclude {
width: 90%;
max-width: 400px;
position: relative;
top: 50%;
margin: 0 auto;
transform: translate(0, -50%);
background: #ffffff;
padding: 1rem;
text-align: center;
}
@media (min-width: 380px) {
.JScontact.fix .enquiryInclude {
padding: 2rem;
}
.JScontact.fix .enquiryInclude h2 {
font-size: 2rem;
padding: 0 1rem;
}
.JScontact.fix .enquiryInclude .introduction {
display: block;
}
.JScontact.fix .enquiryInclude.form .mailingListInclude {
display: block;
}
}
.JScontact.fix .enquiryInclude h2 {
font-size: 1.5rem;
padding: 0 0.5rem;
}
.JScontact.fix .enquiryInclude .introduction {
padding: 0 0.5rem 0.5rem;
display: none;
}
@media (min-width: 480px) {
.JScontact.fix .enquiryInclude .introduction {
padding: 0 1rem 1rem;
}
}
.JScontact.fix .enquiryInclude .close {
display: block;
position: absolute;
top: 0.5rem;
right: 0.5rem;
width: 1.5rem;
height: 1.5rem;
background-color: #ffffff;
background-image: url('data:image/svg+xml,%3C?xml%20version%3D%221.0%22%20?%3E%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M27.9,25l7.1-7.1c0.8-0.8,0.8-2,0-2.8c-0.8-0.8-2-0.8-2.8,0L25,22.2l-7.1-7.1c-0.8-0.8-2-0.8-2.8,0c-0.8,0.8-0.8,2,0,2.8l7.1,7.1l-7.1,7.1c-0.8,0.8-0.8,2,0,2.8c0.8,0.8,2,0.8,2.8,0l7.1-7.1l7,7c0.8,0.8,2,0.8,2.8,0c0.8-0.8,0.8-2,0-2.8L27.9,25z%22/%3E%3C/svg%3E');
background-repeat: no-repeat;
background-size: 1.5rem;
background-position: center center;
border-radius: 1rem;
text-indent: -999em;
}
.JScontact.fix .enquiryInclude.form .column {
width: 100%;
padding: 0.125rem 0.5rem 0;
}
.JScontact.fix .enquiryInclude.form .columnWrap {
padding: 0;
}
.JScontact.fix .enquiryInclude.form label {
text-align: left;
}
.JScontact.fix .enquiryInclude.form input, .JScontact.fix .enquiryInclude.form textarea, .JScontact.fix .enquiryInclude.form select {
width: 100%;
}
.JScontact.fix .enquiryInclude.form .mailingListInclude {
font-size: 1rem;
padding: 0 0.5rem;
display: none;
}
.JScontact.fix .enquiryInclude.form .mailingListInclude .options input {
margin: 0 0.5rem 0 0 !important;
vertical-align: inherit;
}
.JScontact.fix .enquiryInclude.form .mailingListInclude .options label {
font-size: 0.75rem;
}
.JScontact.fix .enquiryInclude input.go {
margin: 0;
}
/* SHOPPING AND ACCOUNT ----------------------------------------------------------------------------------------------------------------------------------*/
.shopModule .shopContainer .titleWrap {
background-color: #f8f8f8;
padding-top: 0 !important;
padding-bottom: 0 !important;
width: 100%;
height: auto;
min-height: 9rem;
}
.shopModule .shopContainer .titleWrap h1 {
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.2rem;
line-height: 1.5;
margin: 0;
text-align: center !important;
color: #011f26;
width: 100%;
font-size: 1.2rem;
}
.shopModule .shopContainer .introWrap {
padding: 2.5rem 2.5rem 0;
}
.shopModule .shopContainer .productCount {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
}
.shopModule .shopContainer .productCount .productCounter {
font-size: 0.75rem;
font-family: 'Morn W01 Medium';
padding: 1rem 0;
flex-basis: 50%;
text-align: left;
}
.shopModule .shopContainer .productCount ul.navbar-right {
font-size: 0.75rem;
flex-basis: 50%;
text-align: right;
padding: 1rem 0;
}
.shopModule .shopContainer .productCount ul.navbar-right .dropdown-toggle, .shopModule .shopContainer .productCount ul.navbar-right ul, .shopModule .shopContainer .productCount ul.navbar-right li {
display: inline-block;
}
.shopModule .shopContainer .productCount ul.navbar-right .dropdown-toggle {
text-decoration: none;
color: #001F26 !important;
}
.shopModule .shopContainer .productCount ul.navbar-right li a {
padding-left: 0.25rem;
text-decoration: none;
}
/* product page */
.shopContainer .productCount {}
.productView .gridView .row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
}
.shopItem {
width: 80%;
margin: 0 auto 10%;
background: #fff;
position: relative;
padding: 0;
border: 4px solid #f8f8f8;
overflow: hidden;
max-width: 260px;
}
.singleProductView .bomProducts .shopItem {
margin: 0.25rem !important;
}
.imageItem .contentWrapper span.price {
text-wrap: nowrap;
}
.singleProductView .bomProducts .content-images_component.full .wrapInner .textWrap {
width: 49% !important;
max-width: 8.5rem;
}
.shopContainerInner p.introduction {
padding: 3rem;
}
.shopContainer .pagingNavigation {
display: flex;
justify-content: center;
}
.shopContainer .pagingNavigation li {
padding: 0.2rem;
min-width: 48px;
min-height: 48px;
display: flex;
justify-content: center;
align-items: center;
}
.shopContainer .pagingNavigation li a {
text-decoration: none;
}
.shopContainer .pagingNavigation li a:hover {
text-decoration: underline;
}
@media(min-width:460px) {
.productView .gridView .row {
padding-left: 4%;
}
.shopItem {
width: 46%;
margin: 0 1% 2%;
max-width: none;
}
}
@media(min-width:560px) {
.productView .gridView .row {
justify-content: flex-start;
}
.singleProductView .bomProducts .shopItem {
width: 30% !important;
}
.shopContainer .pageHeader .introWrap {
padding: 1.5rem 2.5rem 1rem;
}
}
@media(min-width:768px) {
.shopModule .shopContainerInner {
display: flex;
align-items: flex-start
}
.singleProductView .bomProducts .shopItem {
width: 23% !important;
}
.shopModule .shopContainerInner .shopNav {
width: 30vw !important;
}
.shopModule .shopContainerInner .productView {
width: 70vw !important;
}
.productView .gridView .row {
padding-left: 0;
}
}
@media(min-width:1024px) {
.shopItem {
width: 30%;
}
.singleProductView .bomProducts .shopItem {
width: 19% !important;
}
}
.shopItem .imageItem .productDetails {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
}
.shopItem .productDetails .productPrice {
padding-left: 0.8rem !important;
}
.shopItem .productDetails .productPrice .contentWrapper {
white-space: nowrap;
}
/* Single Product */
.singleProductView .imageWrapper .productThumbs ul {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
padding: 0.5rem;
}
.singleProductView .imageWrapper .productThumbs ul li.thumbContainer {
flex-basis: 25%;
margin: 0;
background-color: #f8f8f8;
padding: 0.4rem;
border: 2px solid #fff;
cursor: pointer;
}
.singleProductView .imageWrapper .productThumbs ul li.thumbContainer .photoBorder {
background-color: #fff !important;
display: block;
}
.singleProductView .imageWrapper .productThumbs ul li.thumbContainer img {
aspect-ratio: 1;
width: 100%;
}
.singleProductView .imageWrapper .easyzoom.is-ready img {
cursor: zoom-in !important;
}
.singleProductView .imageWrapper .easyzoom-flyout {
z-index: 1;
}
.singleProductView .easyzoom:before {
content: '';
position: absolute;
bottom: 1rem;
right: 1rem;
width: 2.2rem;
height: 2.2rem;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m33.69 30.22-5.6-5.6c1.33-1.87 2.12-4.16 2.12-6.63 0-6.33-5.15-11.48-11.48-11.48s-11.48 5.15-11.48 11.48 5.15 11.48 11.48 11.48c2.57 0 4.93-.86 6.85-2.29l5.57 5.57c.35.35.81.53 1.27.53s.92-.18 1.27-.53c.7-.7.7-1.84 0-2.54zm-23.66-12.23c0-4.8 3.9-8.7 8.7-8.7s8.7 3.9 8.7 8.7-3.9 8.7-8.7 8.7-8.7-3.9-8.7-8.7z' fill='%23001f26'/%3E%3C/svg%3E");
background-size: 1.6rem 1.6rem !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
background-color: #fff;
border-radius: 50%;
}
/* admin CSS */
.singleProductView .imageWrapper {
width: 100%;
}
.singleProductView .imageWrapper .productImage {
width: 100%;
}
.singleProductView .imageWrapper .productImage img {
aspect-ratio: 1;
width: 100%;
}
.sample-box .singleProductView .imageWrapper {
width: 100%;
}
.sample-box .singleProductView .imageWrapper .productImage img {
aspect-ratio: 2.5/1;
}
.singleProductView .contentDetail h1 {
text-align: left;
font-family: 'Morn W01 Medium';
padding-bottom: 1.4rem;
font-size: 1.4rem;
}
.singleProductView .contentDetail .shortDesc {
font-size: 1rem;
padding-bottom: 0.9rem;
}
.singleProductView .contentDetail .optionsList li {
font-size: 0.85rem;
}
.singleProductView .contentDetail .pdfBible {
font-size: 0.85rem;
padding: 1rem 0 0;
}
.singleProductView .contentWrapper {
padding: 1rem 1.5rem;
}
@media(min-width:560px) {
.singleProductView .contentWrapper {
padding: 2rem 2.5rem;
}
}
@media(min-width:768px) {
.singleProductView .contentDetail h1 {
font-size: 1.5rem;
}
.singleProductView .contentDetail .optionsList li {
font-size: 0.9rem;
}
}
@media(min-width:1024px) {
.singleProductView .contentDetail h1 {
font-size: 1.6rem;
}
}
.singleProductView .contentDetail .icons {
padding: 0.75rem 0 1.25rem;
}
.singleProductView .contentDetail .icons li {
width: 3rem;
height: 3rem;
text-indent: -9999em;
background-size: 3rem;
background-position: 50% 50%;
background-repeat: no-repeat;
display: inline-block;
margin: 0.5rem 0.5rem 0 0;
}
/* icon KEY */
.singleProductView .iconKey {
width: 100%;
border-top: 1px dashed #ddd;
padding: 2rem 1.8rem 0;
margin-top: 2rem;
}
.singleProductView .iconKey h2 {
font-size: 1rem !important;
}
.singleProductView .iconKey p {
padding: 0;
margin: 0 !important;
}
.singleProductView .iconKey p span {
display: block;
padding: 0 0.5rem 0 2rem;
background-position: 0 50% !important;
background-size: 1.8rem 1.8rem !important;
background-repeat: no-repeat !important;
font-size: 0.7rem;
line-height: 1.8rem;
margin: 0 0 -1.4rem;
vertical-align: top;
}
@media (min-width: 560px) {
.singleProductView .iconKey {
padding-left: 2.5rem;
padding-right: 2.5rem;
}
.singleProductView .iconKey p {
column-count: 2;
max-width: 600px;
}
}
@media (min-width: 768px) {
.singleProductView .iconKey {
padding-left: 3.2rem;
padding-right: 3.2rem;
}
.singleProductView .iconKey p {
column-count: 3;
max-width: 800px;
}
}
@media (min-width: 1024px) {
.singleProductView .iconKey {
padding-left: 2.4rem;
padding-right: 2.4rem;
}
.singleProductView .iconKey p {
column-count: 4;
max-width: 960px;
}
}
.singleProductView .contentDetail .icons li.prcru, .singleProductView .iconKey span.prcru {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='m70.59 121.43c10.34-1.35 19.82 5.95 21.16 16.29.1.8.16 1.61.16 2.42 0 1.19-.11 2.38-.33 3.55h12.03c3.81 0 6.91 3.09 6.91 6.91s-3.09 6.91-6.91 6.91h-30.46'/%3E%3Cpath d='m138.51 86.34c0 1.59-1.29 2.88-2.88 2.88s-2.88-1.29-2.88-2.88 1.29-2.88 2.88-2.88 2.88 1.29 2.88 2.88z'/%3E%3Cpath d='m98.38 47.67c-.56-8.2.82-14.1 4.07-15.05 5.2-1.52 13.2 10.22 17.87 26.22.79 2.7 1.43 5.35 1.93 7.89'/%3E%3Cpath d='m73.15 157.5c-17.73 0-32.11-14.38-32.11-32.11s14.38-32.11 32.11-32.11h33.33c-3.2-3.37-3.47-11.54-2.24-14.89-3.42-2.54-6.65-5.34-9.66-8.36-11.78-11.78-18.24-24.43-14.41-28.26s16.48 2.62 28.27 14.41c3.09 3.07 5.94 6.37 8.52 9.87 39.12 3.12 48.89 38.09 26.79 44.76 5 10.59 4.22 23-2.07 32.88h11.07c3.82.05 6.87 3.18 6.83 6.99-.05 3.75-3.07 6.78-6.83 6.83h-49.14'/%3E%3Cpath d='m45.42 141.58c-4.93 2.67-11.09.85-13.76-4.08s-.85-11.09 4.08-13.76c1.49-.81 3.15-1.23 4.84-1.23.2 0 .4 0 .6.02'/%3E%3C/g%3E%3C/svg%3E");
}
.singleProductView .contentDetail .icons li.prpar, .singleProductView .iconKey span.prpar {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='m119.22 94.81c0 28.77-24.47 52.1-24.47 52.1s-24.47-23.32-24.47-52.1 24.47-52.1 24.47-52.1 24.47 23.33 24.47 52.1z'/%3E%3Cpath d='m94.75 146.91v-64.2'/%3E%3Cpath d='m149.23 127.08c-20.34 20.34-54.14 19.54-54.14 19.54s-.81-33.8 19.53-54.14 54.14-19.53 54.14-19.53.81 33.79-19.54 54.14z'/%3E%3Cpath d='m95.09 146.61 45.4-45.39'/%3E%3Cpath d='m75.37 93.14c20.34 20.35 19.54 54.14 19.54 54.14s-33.8.81-54.14-19.53-19.54-54.14-19.54-54.14 33.8-.81 54.14 19.53z'/%3E%3Cpath d='m94.91 147.28-45.4-45.39'/%3E%3C/g%3E%3C/svg%3E");
}
.singleProductView .contentDetail .icons li.prsul, .singleProductView .iconKey span.prsul {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cellipse cx='95' cy='95' rx='29.2' ry='56.75'/%3E%3Cpath d='m80.4 69.71c27.14-15.67 55.68-17.05 63.75-3.08s-7.4 38-34.55 53.67-55.68 17.05-63.75 3.08 7.4-37.99 34.55-53.67z'/%3E%3Cpath d='m80.4 120.29c-27.14-15.67-42.61-39.7-34.55-53.67s36.61-12.59 63.75 3.08 42.61 39.7 34.54 53.67c-8.06 13.97-36.61 12.59-63.75-3.08z'/%3E%3C/g%3E%3C/svg%3E");
}
.singleProductView .contentDetail .icons li.prmuk, .singleProductView .iconKey span.prmuk {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3CclipPath id='a'%3E%3Cpath d='m22.71 44.43h144.59v101.15h-144.59z'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23a)' fill='none' stroke='%23001f26' stroke-width='4'%3E%3Cpath d='m23.68 45.4h142.63v99.19h-142.63z' stroke-miterlimit='10'/%3E%3Cpath d='m102.68 144.6v-41.92h63.64' stroke-miterlimit='10'/%3E%3Cpath d='m23.68 102.68h63.64v41.92' stroke-miterlimit='10'/%3E%3Cpath d='m87.32 45.4v41.92h-63.64' stroke-miterlimit='10'/%3E%3Cpath d='m166.32 87.32h-63.64v-41.92' stroke-miterlimit='10'/%3E%3Cg stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m112.57 45.4v32.03l53.74-26.13'/%3E%3Cpath d='m166.32 61.41-32.95 16.02h32.95'/%3E%3Cpath d='m77.48 45.4v32.03l-53.74-26.13'/%3E%3Cpath d='m23.73 61.41 32.95 16.02h-32.59'/%3E%3Cpath d='m77.48 144.6v-32.02l-53.74 26.13'/%3E%3Cpath d='m23.73 128.59 32.95-16.02h-32.95'/%3E%3Cpath d='m112.57 144.6v-32.02l53.74 26.13'/%3E%3Cpath d='m166.32 128.59-32.95-16.02h32.95'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.singleProductView .contentDetail .icons li.prveg, .singleProductView .iconKey span.prveg {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m132.87 59.02c-10.39 8.47-40.78 43.48-42.32 64.25-3.46-22.32-22.7-62.72-52.33-74.26 21.55 28.09 33.47 53.87 42.32 101.19h19.31c3.46-12.7 6.02-32.78 14.1-49.33 8.08-16.54 26.49-7.98 35.19-28.76 4.12-9.84 2.2-32.34 2.2-32.34-27.82.77-54.08 1.84-47.8 53.7' fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'/%3E%3C/svg%3E");
}
.singleProductView .contentDetail .icons li.prres, .singleProductView .iconKey span.prres {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='m29.28 75.72h31.43l17.4 28.15-12.15-7.38-11 19.02h34.5l.04 31.94h-26.78c-1.78.05-3.54-.26-5.2-.9-3.67-1.21-6.67-3.9-8.27-7.42-.42-.74-.77-1.53-1.02-2.35l-16.8-31.6c-.44-.93-.73-1.92-.85-2.94-.37-2.23.07-4.51 1.24-6.44l8.14-13.73-10.66-6.36z'/%3E%3Cpath d='m31.42 105.19c4.05 7.62 6.67 10.32 23.54 10.32'/%3E%3Cpath d='m113.19 158.64-15.71-27.22 15.67-29.14-.31 14.22 21.97.02-17.25-29.88 27.64-16.01 13.39 23.19c.93 1.51 1.55 3.2 1.83 4.95.79 3.79-.04 7.73-2.29 10.88-.43.74-.94 1.43-1.52 2.06l-18.96 30.35c-.59.84-1.3 1.59-2.12 2.21-1.74 1.43-3.94 2.19-6.19 2.15l-15.97-.18-.17 12.41z'/%3E%3Cpath d='m137.65 142.06c4.58-7.32 5.6-10.94-2.83-25.55'/%3E%3Cpath d='m143.59 45.85-15.71 27.22-33.08 1 12.47-6.84-10.97-19.04-17.25 29.88-27.68-15.94 13.39-23.19c.84-1.57 1.99-2.95 3.38-4.06 2.88-2.58 6.71-3.83 10.56-3.45.86 0 1.71.1 2.54.29l35.77 1.25c1.02.09 2.03.33 2.97.73 2.11.8 3.87 2.32 4.96 4.29l7.82 13.92z'/%3E%3Cpath d='m117 32.96c-8.63-.3-12.27.62-20.71 15.23'/%3E%3C/g%3E%3C/svg%3E");
}
.singleProductView .contentDetail .icons li.prallsk, .singleProductView .iconKey span.prallsk {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='m112.57 67.14 2.74-10.13c.94-3.46 4.48-5.65 8-4.8 1.82.45 3.27 1.6 4.14 3.08.85 1.45 1.13 3.21.66 4.96'/%3E%3Cpath d='m148.81 82.64 6.58-24.29c.44-1.62 1.5-2.91 2.85-3.68 1.36-.78 3.01-1.04 4.65-.6 3.27.87 5.21 4.19 4.33 7.42l-11.67 43.1c-.27 1 .86 1.64 1.16 1.23 0 0 7.94-10.16 14.59-12.37 5.18-1.42 9.51 1.69 8.52 5.34-.4 1.93-1.61 4.62-3.66 7.12-5.51 6.72-8.76 10.81-15.45 19.75 0 0-17.29 23.47-39.06 17.7-13.45-3.56-18.6-11.95-20.34-19.66'/%3E%3Cpath d='m122.62 80.51 7.87-29.06c.93-3.44 4.5-5.47 7.97-4.55 3.47.92 5.53 4.45 4.6 7.89'/%3E%3Cpath d='m155.39 58.34 1.25-4.61c.92-3.39-1.11-6.87-4.54-7.77-3.42-.91-6.94 1.1-7.86 4.49l-7.83 28.9'/%3E%3Cpath d='m88.69 123.69c-1.73 7.71-6.89 16.09-20.34 19.66-21.77 5.77-39.06-17.7-39.06-17.7-6.7-8.94-9.94-13.03-15.46-19.75-2.05-2.51-3.26-5.19-3.66-7.12-.99-3.65 3.34-6.76 8.52-5.34 6.65 2.21 14.59 12.37 14.59 12.37.31.41 1.43-.22 1.16-1.23l-11.67-43.1c-.88-3.24 1.06-6.56 4.33-7.42 1.63-.44 3.29-.17 4.65.6 1.36.78 2.42 2.06 2.86 3.68s6.58 24.3 6.58 24.3'/%3E%3Cpath d='m61.89 60.25c-.47-1.74-.19-3.51.66-4.96.87-1.48 2.32-2.63 4.14-3.08 3.52-.86 7.06 1.34 7.99 4.8l2.74 10.13'/%3E%3Cpath d='m67.38 80.51-7.87-29.06c-.93-3.44-4.5-5.47-7.97-4.55-3.47.92-5.53 4.45-4.6 7.89'/%3E%3Cpath d='m53.58 79.35-7.83-28.9c-.92-3.39-4.44-5.4-7.86-4.49-3.42.91-5.45 4.39-4.54 7.77l1.25 4.61'/%3E%3Cpath d='m111.41 94.98c0 9.16-7.35 16.58-16.41 16.58s-16.41-7.42-16.41-16.58 16.41-30.56 16.41-30.56 16.41 21.4 16.41 30.56z'/%3E%3C/g%3E%3C/svg%3E");
}
.singleProductView .contentDetail .icons li.prevus, .singleProductView .iconKey span.prevus {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 190 190' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23001f26' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='m65.17 78.41 30.21 37 40.23-60.92-40.63 39.32z'/%3E%3Ccircle cx='95' cy='95' r='66.23'/%3E%3Cpath d='m95 28.77v11.38'/%3E%3Cpath d='m28.77 95h11.38'/%3E%3Cpath d='m95 161.23v-11.38'/%3E%3Cpath d='m161.23 95h-11.38'/%3E%3C/g%3E%3C/svg%3E");
}
.singleProductView .contentDetail .productCode, .singleProductView .contentDetail p:first-of-type.productCode {
font-size: 0.8rem;
font-family: 'Morn W01 Light Oblique' !important;
}
.singleProductView .actionsWrap .ctaBox {
text-align: left !important;
font-family: 'Morn W01 Medium';
}
.singleProductView .actionsWrap .itemPrice, .singleProductView .itemPrice.poaBranded {
font-size: 2rem;
font-family: 'Morn W01 Medium';
line-height: 1;
}
.singleProductView .actionsWrap .stockValue {
padding-top: 1rem;
color: #EB5D4D;
}
@media(min-width:768px) {
.singleProductView .actionsWrap .itemPrice, .singleProductView .itemPrice.poaBranded {
font-size: 2.2rem;
}
}
@media(min-width:1024px) {
.singleProductView .actionsWrap .itemPrice, .singleProductView .itemPrice.poaBranded {
font-size: 2.4rem;
}
}
.shopItem .imageItem .contentWrapper span.price {
font-size: 1rem;
font-family: 'Morn W01 Medium';
line-height: 1;
}
.singleProductView .itemPrice.poaBranded {
padding: 0.5rem 0 1rem;
}
.singleProductView .productDesc, .sample-box .singleProductView .SampleChildProductView {
padding: 0 0.5rem;
}
.singleProductView .accordion_component.wrapInner {
max-width: none;
width: 98%;
}
.singleProductView .accordion_component.JSaccordianCollapse {
padding-right: 0;
}
.singleProductView .meetTheProducts .accordion_component.wrap {
padding-right: 0 !important;
}
.singleProductView .bomListItem a {
color: #011F26;
text-decoration: none;
padding: 0.2rem 0;
display: block;
}
.singleProductView .bomListItem a:hover, .singleProductView .bomListItem a:focus, .singleProductView .bomListItem a:active {
color: #eb5d4d;
}
.singleProductView .meetTheProducts .bomProducts, .sampleProducts ul.row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: flex-start;
}
.shopItem .productImageWrapper {
padding: 0;
background-color: #fff !important;
}
.shopItem .productImageWrapper img {
aspect-ratio: 1;
width: 100%;
}
.shopItem .imageItem .productDetails {
padding: 0.6rem 0.9rem 2.5rem !important;
}
.singleProductView .bomProducts .shopItem .imageItem .contentWrapper {
padding: 0rem 0.7rem 0.7rem !important;
}
.singleProductView .bomProducts .shopItem .imageItem .contentWrapper {
width: 100%;
}
.shopItem .imageItem .actionWrapper {
padding: 0 0.7rem !important;
}
.shopItem .imageItem .productTitle {
width: 100% !important;
}
.shopItem .imageItem .contentWrapper h3 {
font-size: 0.75rem;
font-family: 'Morn W01 Light';
margin-bottom: 0;
padding-top: 0.2rem;
}
.shopItem .imageItem .contentWrapper h3 a {
color: #001F26;
text-decoration: none;
}
.shopItem .imageItem .contentWrapper h3 a:hover {
color: #eb5d4d;
}
.shopItem .imageItem .actionWrapper {
position: absolute;
bottom: 0;
left: 6%;
width: 94%;
height: 2.8rem;
}
.shopItem .imageItem .actionWrapper a.btn {
display: block;
margin-top: 0 !important;
font-size: 0.75rem !important;
padding-left: 1.4rem !important;
}
.singleProductView .OtherSampleBoxes .shopItem {
width: 100%;
background: none;
padding: 0 !important;
}
.singleProductView .OtherSampleBoxes .shopItem .imageItem {
width: 100%;
background-color: transparent;
margin-top: 1rem;
border-radius: 0;
}
.singleProductView .OtherSampleBoxes .shopItem .imageItem a {
text-decoration: none;
color: #eb5d4d !important;
background-color: #fff !important;
display: block;
padding: 0;
border-radius: 0;
}
.singleProductView .OtherSampleBoxes .shopItem .imageItem a h3 {
color: #eb5d4d !important;
}
.singleProductView .OtherSampleBoxes .shopItem .imageItem .contentWrapper {
padding: 0;
}
.singleProductView .OtherSampleBoxes .shopItem .imageItem a:hover, .singleProductView .OtherSampleBoxes .shopItem .imageItem a:focus, .singleProductView .OtherSampleBoxes .shopItem .imageItem a:active {
transition: all 0.2s linear 0s;
text-decoration: underline;
}
.singleProductView .OtherSampleBoxes .shopItem .imageItem .contentWrapper {
width: 100%;
padding: 0.5rem 0 0 !important;
text-align: center;
}
.singleProductView .OtherSampleBoxes .shopItem .imageItem .contentWrapper h3 {
font-size: 0.9rem;
}
.singleProductView .purchaseTools .input-group {
padding-top: 1rem;
}
.singleProductView .actionsWrap .quantitySelect {
width: 11rem;
}
.singleProductView .actionsWrap .addButton input.btn {
padding-right: 0 !important;
font-size: 1.1rem !important;
margin-top: 0 !important;
border: none !important;
}
.shopModule .shopContainerInner .shopNav {
padding: 0 1rem 2rem 0.75rem;
}
.shopModule .shopContainerInner .shopNav li a {
display: block;
text-decoration: none;
color: #001F26;
font-size: 0.8rem;
padding: 0.75rem 0 0;
text-align: center;
}
.shopModule .shopContainerInner .shopNav li a:hover, .shopModule .shopContainerInner .shopNav li a.activePage {
color: #eb5d4d
}
.shopModule .shopContainerInner .shopNav h2 {
font-size: 0.75rem;
font-family: 'Morn W01 Medium';
text-align: center;
}
@media (min-width: 560px) {
.singleProductView .productDesc, .sample-box .singleProductView .SampleChildProductView {
padding: 0 1rem;
}
}
@media (min-width: 768px) {
.shopModule .shopContainerInner .shopNav {
padding: 0 1rem 1rem;
}
.singleProductView .topSection {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: stretch;
align-content: flex-start;
}
.singleProductView .imageWrapper {
width: 50%;
}
.sample-box .singleProductView .topSection {
display: block;
}
.singleProductView .contentWrapper {
width: 50%;
padding: 2rem 2.5rem;
}
.singleProductView .productDesc, .sample-box .singleProductView .SampleChildProductView {
padding: 0 1.5rem;
width: 100%;
}
.sample-box .singleProductView .contentWrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: stretch;
align-content: flex-start;
padding: 2.5rem 3rem;
width: 100%;
}
.sample-box .singleProductView .contentDetail {
width: 70%;
padding-right: 2rem;
}
.singleProductView .actionsWrap {
text-align: right;
padding-left: 0;
}
.sample-box .singleProductView .actionsWrap {
width: 40%;
}
.singleProductView .actionsWrap .quantitySelect {
float: right;
}
.singleProductView .actionsWrap .addButton input.btn {
font-size: 1.2rem !important;
}
.singleProductView .SampleChildProductView ul.bomList {
column-count: 2;
column-gap: 2rem;
}
}
@media (min-width: 1024px) {
.singleProductView .imageWrapper {
width: 55%;
}
.singleProductView .contentWrapper {
width: 45%;
padding: 3rem 3.5rem 1rem;
}
.singleProductView .productDesc, .sample-box .singleProductView .SampleChildProductView {
padding: 0 2.5rem;
}
.singleProductView .SampleChildProductView ul.bomList {
column-count: 3;
column-gap: 2rem;
}
}
/* end */
.productView .gridView .row .purchaseWrap {
justify-content: flex-start;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2.2rem;
padding-left: 0.8rem;
}
.shopItem .imageItem .addButton .btn, .shopItem .imageItem .backInStockModule .btn {
font-size: 0.8rem !important;
margin-top: 0;
padding: 0.5rem;
padding-left: 1.9rem !important;
margin-left: -0.4rem;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 59.78 59.78' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='48.89' cy='10.74' fill='%23eb5d4d' r='10.28'/%3E%3Cg fill='none' stroke='%23fff' stroke-width='2.74'%3E%3Cpath d='m48.89 4.06v13.37'/%3E%3Cpath d='m42.21 10.46h13.37'/%3E%3C/g%3E%3C/svg%3E") 1.6rem center/0rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 59.78 59.78' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m43.54 42.06-1.16-16.98-.02-.16c-.18-.97-.67-1.85-1.4-2.52-.75-.53-1.61-.86-2.52-.97h-1.75c-.01-.43-.06-.85-.13-1.27-.78-4.04-3.15-6.27-6.67-6.27s-5.9 2.23-6.68 6.28c-.07.42-.11.84-.13 1.27h-1.74c-.91.12-1.78.45-2.52.98-.73.67-1.22 1.55-1.4 2.52l-1.19 17.13c-.02.24-.12 2.37 1.48 3.28.51.33 1.1.51 1.71.54h20.87c.62-.02 1.23-.21 1.75-.54 1.6-.92 1.5-3.04 1.49-3.28m-17.96-21.44c.84-4.33 3.45-4.33 4.3-4.33s3.47 0 4.3 4.33c.05.27.07.55.09.82h-8.78c.01-.27.04-.55.08-.82m15.17 22.5c-.14.09-.29.15-.45.19h-20.83c-.16-.04-.31-.11-.45-.19-.15-.27-.22-.57-.19-.88l1.16-16.88c.07-.34.23-.67.45-.93.35-.22.74-.36 1.15-.41h1.48c.03 1.33.11 2.5.12 2.74.04.63.57 1.12 1.2 1.12h.08c.66-.04 1.17-.61 1.13-1.27 0 0 0 0 0-.01-.05-.71-.09-1.65-.11-2.59h8.8c-.03 1.04-.08 2.04-.12 2.59-.02.67.5 1.23 1.16 1.25.64.02 1.19-.46 1.25-1.1.02-.24.09-1.41.12-2.74h1.48c.41.05.8.2 1.15.41.23.27.38.59.45.93l1.16 16.87c.03.31-.04.62-.19.89' fill='%23eb5d4d'/%3E%3C/svg%3E") 0 10%/1.9rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0.7rem center/0rem;
background-repeat: no-repeat;
}
.shopItem .imageItem .addButton .btn:hover {
color: #eb5d4d;
}
.shopItem .imageItem .backInStockModule .btn, .input-group-btn a.notifyBtn {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 35 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Cpath d='m2.79 3.16h29.42v34.67h-29.42z'/%3E%3Cg stroke='%23001f26' stroke-linejoin='round' stroke-width='2.5'%3E%3Crect height='22.87' rx='2' width='27.32' x='3.84' y='9.03'/%3E%3Cpath d='m3.84 9.03 13.55 12.54 13.77-12.54'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") 0 center/1.3rem !important;
background-repeat: no-repeat !important;
color: #001F26;
text-transform: none;
margin-left: 0;
padding-left: 1.7rem !important;
font-size: 1rem;
padding-right: 0;
}
@media(min-width:420px) {
.shopItem .imageItem .backInStockModule .btn, .input-group-btn a.notifyBtn {
font-size: 1.2rem;
}
}
.input-group-btn a.notifyBtn {
padding-left: 1.8rem !important;
}
/* shopping basket page */
.basketWrapper {
margin: 0 1rem 0
}
.basketContainer .productRow {
border-bottom: 2px solid #eee;
padding: 1.2rem 0
}
.basketContainer .productRow.alert-danger {
border: 2px solid #eb5d4d !important;
border-left: 8px solid #eb5d4d !important;
padding-left: 1rem;
padding-right: 1rem;
margin-top: -2px;
}
.basketContainer .productDetails {
padding: 0 16px 0 0;
font-size: 0
}
.basketContainer .pageHeader h1, .checkoutContainer .pageHeader h1 {
background-color: #f8f8f8;
font-family: 'Morn W01 Medium';
padding: 3rem 2rem;
text-transform: uppercase;
text-align: center;
font-size: 1.2rem;
letter-spacing: 0.2rem;
line-height: 1.5;
}
.checkoutContainer .pageHeader h1 {
margin-bottom: 1.5rem;
}
.basketContainer .productDetails, .basketContainer .productDetailWrapper {
display: inline-block;
vertical-align: top
}
.basketContainer .basketimg {
width: 140px;
}
.basketContainer .productDetailWrapper {
padding: 7px 16px 0 0
}
.basketContainer .productDetailWrapper h2 {
font-size: 0.9rem;
margin: 0;
max-width: 100%;
width: 140px
}
.basketContainer .productDetailWrapper a {
text-decoration: none;
color: #1E454B;
text-transform: uppercase;
font-family: 'Morn W01 Medium';
}
.basketContainer .productDetailWrapper a.trimButton {
padding: 8px 16px;
background: #eb5d4d;
color: #fff !important;
font-size: 15px;
margin-top: 8px
}
.basketContainer .productDetailWrapper .productCode {
font-size: 10px
}
.basketContainer .productDetailWrapper .backorder {
font-size: 0.7rem;
color: #ea5d4c;
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.3pt;
padding-top: 1rem;
}
.basketContainer .itemPrice {
font-size: 14px;
float: right
}
.basketContainer .itemQuantity {
padding: 12px 0
}
.basketContainer .itemQuantity .quantityTotal {
padding-right: 0.5rem;
}
.basketContainer .itemQuantity .qtyBtn {
display: inline-block;
width: 30px;
height: 30px;
vertical-align: middle;
background-color: #f8f8f8;
border-radius: 15px;
background-position: 50% 50% !important;
background-size: 24px 24px !important;
background-repeat: no-repeat !important;
text-indent: -999em;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23011F26' viewBox='0 0 491.236 491.236'%3E%3Cpath d='M55.89,262.818c-3-26-0.5-51.1,6.3-74.3c22.6-77.1,93.5-133.8,177.6-134.8v-50.4c0-2.8,3.5-4.3,5.8-2.6l103.7,76.2 c1.7,1.3,1.7,3.9,0,5.1l-103.6,76.2c-2.4,1.7-5.8,0.2-5.8-2.6v-50.3c-55.3,0.9-102.5,35-122.8,83.2c-7.7,18.2-11.6,38.3-10.5,59.4 c1.5,29,12.4,55.7,29.6,77.3c9.2,11.5,7,28.3-4.9,37c-11.3,8.3-27.1,6-35.8-5C74.19,330.618,59.99,298.218,55.89,262.818z M355.29,166.018c17.3,21.5,28.2,48.3,29.6,77.3c1.1,21.2-2.9,41.3-10.5,59.4c-20.3,48.2-67.5,82.4-122.8,83.2v-50.3 c0-2.8-3.5-4.3-5.8-2.6l-103.7,76.2c-1.7,1.3-1.7,3.9,0,5.1l103.6,76.2c2.4,1.7,5.8,0.2,5.8-2.6v-50.4 c84.1-0.9,155.1-57.6,177.6-134.8c6.8-23.2,9.2-48.3,6.3-74.3c-4-35.4-18.2-67.8-39.5-94.4c-8.8-11-24.5-13.3-35.8-5 C348.29,137.718,346.09,154.518,355.29,166.018z'/%3E%3C/svg%3E");
transition: 0.2s ease-in-out;
}
.basketContainer .itemQuantity .qtyBtn:hover {
transform: rotate(180deg);
transition: 0.2s ease-in-out;
}
.basketContainer .itemQuantity .btn-group {
display: flex;
}
.basketContainer .itemQuantity .quantityTotal input {
border: 2px solid #f8f8f8;
height: 32px;
line-height: 32px;
padding: 0 4px;
font-size: 14px !important;
width: 60px;
margin: 0
}
.basketContainer .itemSubTotal {
font-size: 0.8rem;
float: right;
margin-top: -30px;
}
.basketContainer .itemDelete {
padding-top: 10px
}
.basketContainer .itemDelete a {
display: block;
width: auto;
height: auto;
padding-top: 0;
font-size: 0.6rem;
text-decoration: none;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23011F26' stroke-width='4'%3E%3Cpath d='m12.65 11.28 18.31 18.3'/%3E%3Cpath d='m12.26 29.19 18.31-18.31'/%3E%3C/g%3E%3C/svg%3E") 0 center/0rem;
background-repeat: no-repeat;
transition: 0.2s ease-in-out;
color: #011F26;
}
.basketContainer .itemDelete a:hover {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23011F26' stroke-width='4'%3E%3Cpath d='m12.65 11.28 18.31 18.3'/%3E%3Cpath d='m12.26 29.19 18.31-18.31'/%3E%3C/g%3E%3C/svg%3E") 0 0.01rem/0.8rem;
background-repeat: no-repeat;
padding-left: 1rem;
transition: 0.2s ease-in-out;
}
.basketContainer .itemDelete a:hover, .basketContainer .itemDelete a:focus, .basketContainer .itemDelete a:active {
text-decoration: underline
}
.basketContainer .productInfo {
display: none
}
.basketContainer .productRow.first .productDetails:before, .basketContainer .productRow.first .productDetailWrapper:before, .basketContainer .productRow.first .itemPrice:before, .basketContainer .productRow.first .itemQuantity:before, .basketContainer .productRow.first .itemSubTotal:before {}
.basketContainer .itemSubTotal {
text-align: right
}
.basketContainer .productRow {
display: block;
}
.basketContainer .productRow > div {
position: relative;
}
.basketContainer .emptyBasket {
text-align: center;
padding: 1rem 0 3rem;
}
.basketContainer .emptyBasket p {
padding-top: 1rem;
}
@media(min-width:768px) {
.basketContainer .productRow {
display: flex;
flex-direction: row;
}
.basketContainer .productRow.first .productDetails:before, .basketContainer .productRow.first .productDetailWrapper:before, .basketContainer .productRow.first .itemPrice:before, .basketContainer .productRow.first .itemQuantity:before, .basketContainer .productRow.first .itemSubTotal:before {
position: absolute;
top: -54px;
left: 0;
width: 100%;
content: "Item";
text-align: left;
font-size: 15px;
font-family: 'Morn W01 Medium';
}
.basketContainer .productRow.first .productDetailWrapper:before {
content: "Details"
}
.basketContainer .productRow.first .itemPrice:before {
content: "Price";
text-align: left;
}
.basketContainer .productRow.first .itemQuantity:before {
content: "Quantity";
text-align: left;
}
.basketContainer .productRow.first .itemSubTotal:before {
content: "Total";
text-align: right;
}
.basketContainer .productRow > div {
width: 100%;
}
.basketWrapper {
margin: 0 2rem 0;
}
.basketContainer .productRow.first {
border-top: 2px solid #eee;
}
}
@media(min-width:1024px) {
.basketContainer {
margin: 0 auto;
padding-bottom: 4rem;
}
.basketContainer h1 {
text-align: left;
}
}
/* voucher + basket totals */
.basketFooter {
border-bottom: 2px solid #eee;
justify-content: space-between;
margin-bottom: 1.5rem;
}
.couponCodeEntry {
padding: 1rem 0 1rem 0;
}
@media(min-width:768px) {
.couponCodeEntry {
padding-right: 1rem;
}
}
.couponCodeEntry label {
font-size: 0.8rem;
}
.couponCodeEntry .couponInput, .couponCodeEntry .input-group {
display: flex;
vertical-align: top;
height: 40px;
}
.couponCodeEntry .couponInput {
width: 160px;
}
.couponCodeEntry .input-group .input-group-btn {
padding: 0;
width: 100%;
text-transform: uppercase;
margin: 0;
height: 2rem;
}
.couponCodeEntry .input-group .input-group-btn input {
margin-top: 0;
padding: 0.4rem 2rem;
border: none;
margin-left: 0.8rem;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23eb5d4d' stroke-width='4'%3E%3Cpath d='m20.5 9.48v22.04'/%3E%3Cpath d='m9.48 20.03h22.04'/%3E%3C/g%3E%3C/svg%3E") 0rem center/1.6rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 1rem center/0rem;
background-repeat: no-repeat;
color: #eb5d4d;
text-align: left;
}
.couponCodeEntry .input-group .input-group-btn input:hover {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 41' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23fff' stroke-width='4'%3E%3Cpath d='m20.5 9.48v22.04'/%3E%3Cpath d='m9.48 20.03h22.04'/%3E%3C/g%3E%3C/svg%3E") 0rem center/1.6rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0rem center/1.6rem;
background-repeat: no-repeat;
color: #011F26;
}
.couponCodeEntry .requiredFieldInfo {
font-size: 14px;
padding: 8px 16px;
background: #f3f3f3;
margin-top: 0.5rem;
}
.basketTotals {
margin-top: -1px
}
.basketTotals table {
width: 100%;
border: 2px solid #eee;
border-bottom: none;
padding-top: 6px
}
.basketTotals table th, .basketTotals table td {
padding: 0.6rem 1rem;
border-bottom: 2px solid #eee;
font-weight: normal;
text-align: left;
font-size: 0.8rem;
}
.basketTotals table tr#showDelivery th {
text-transform: lowercase
}
.basketTotals table td {
text-align: right
}
.basketTotals table th.total, .basketTotals table td.total {
border-bottom: none;
background: #f4f4f4;
padding-top: 12px;
padding-bottom: 12px
}
.basketTotals .shippingCalculator .btn {
padding: 0.4rem 1.2rem;
background: rgb(1, 31, 38);
color: #fff;
margin-top: 0.4rem;
width: auto;
font-size: 0.7rem !important;
border: none;
}
.basketTotals .shippingCalculator .btn:hover {
background: rgb(1, 31, 38, 0.5);
}
.basketTotals .shippingCalculator .btn.showMore, .step-2 .checkoutContainer .options .btn.showMore {
background: none;
border-radius: 0;
text-decoration: underline;
padding: 0 0 2rem;
width: 100%;
text-align: center;
}
.step-2 .checkoutContainer .options .btn.showMore {
text-align: left;
}
.basketTotals .shippingCalculator .deliverName {
padding-top: 8px;
font-size: 14px
}
.myAccountModule .page-header {
padding: 2rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-direction: column;
}
.myAccountModule .page-header h1 {
padding: 0;
}
.myAccountModule .page-header p {
margin-left: 0;
margin-top: 1rem;
}
.myAccountModule .page-header p a {
text-align: right;
display: flex;
justify-content: flex-end;
flex-direction: column;
padding: 0.4rem 1rem;
background-color: #eb5d4d;
color: #fff;
border-radius: 2rem;
text-decoration: none;
}
.myAccountModule .reviewDetails .couponCodeEntry {
display: none
}
.myAccountModule .reviewDetails .basketFooter .basketTotals {
width: 100%
}
.myAccountModule .reviewDetails .orderSummary {
margin: 0% 4% 8px;
width: 92%;
max-width: none
}
.orderSummary .contentHeader {
display: none;
}
.orderSummary .billingAddressSummary .contentHeader, .orderSummary .deliveryAddressSummary .contentHeader, .orderSummary .additionalInformationSummary .contentHeader {
display: block
}
.orderSummary .contentHeader h3 {
font-size: 1.3rem;
margin-bottom: 0.7rem
}
.userAddressesLoggedin .contentHeader h3 {
font-size: 1.3rem;
}
.myAccountModule .reviewDetails .orderSummary .contentHeader {
display: none
}
.myAccountModule .reviewDetails .orderSummary .billingAddressSummary .contentHeader, .reviewDetails .orderSummary .deliveryAddressSummary .contentHeader {
display: block
}
.myAccountModule .reviewDetails .fieldContainer.orderSummary {
padding: 0 !important
}
.myAccountModule .reviewDetails .orderSummary .billingAddressSummary, .reviewDetails .orderSummary .deliveryAddressSummary {
margin: 0;
border: none
}
.myAccountModule .reviewDetails .orderSummary .billingAddressSummary {
padding-bottom: 0
}
.myAccountModule .reviewDetails .orderSummary .deliveryAddressSummary {
padding-top: 8px
}
/* checkout buttons */
.shoppingActions {
padding: 1rem;
}
.basketWrapper .shoppingActions, .fieldContainer .shoppingActions {
width: 100%;
padding-left: 0;
padding-right: 0;
}
.shoppingActions a {
display: block;
padding-bottom: 24px;
font-size: 15px;
color: #011F26 !important;
}
.shoppingActions .buttonContainer {
float: right
}
.shoppingActions .buttonContainer .btn {
border: none;
font-size: 1.1rem !important;
padding-right: 0.5rem;
margin-top: 0;
}
.myAccountModule .shoppingActions .buttonContainer .btn {
padding-left: 2.3rem;
padding-right: 0rem;
}
.productWrapper .stockTotal {
padding: 0
}
.productWrapper .stockTotal .stockName, .productWrapper .stockTotal .stockValue, .product Wrapper .stockTotal .needMore {
display: inline-block;
vertical-align: top;
font-size: 16px;
color: #d20000
}
.productWrapper .stockTotal .advisoryNotice {
padding-top: 6px
}
@media (min-width: 768px) {
.basketTotals table {
border-top: none
}
.basketWrapper {
padding-top: 42px;
}
.basketContainer .itemPrice, .basketContainer .itemSubTotal {
float: none;
margin: 0;
}
.basketContainer .itemQuantity {
padding: 0 8px
}
.basketContainer .productDetailWrapper {
padding: 0 16px 0 0
}
.shoppingActions a {
float: left
}
.basketFooter {
display: flex;
}
.basketItemsSummary .basketFooter {
justify-content: flex-end;
}
}
@media (min-width: 960px) {
.step-3 .billingAddressSummary, .deliveryAddressSummary {
width: 38%;
}
.step-3 .orderSummary.fieldContainer .clearfix {
display: flex;
}
.step-3 .additionalInformationSummary {
margin-top: 1rem;
width: 24%;
}
}
/* Checkout */
.checkoutInnerContainer, .loginContainer .formContainer, .registrationModule .formContainer, .myAccountModule .form, .LostPasswordContainer {
margin: 0 auto
}
.checkoutContainer .container {
padding: 12px 30px 30px;
background: #f3f3f3;
margin: 0 auto 16px;
width: 94%
}
.checkoutContainer .container h2 {
font-size: 1.4rem;
}
.checkoutContainer .pageHeader h2 {
padding-top: 0;
font-size: 1.2rem;
}
.checkoutContainer .container + .container {
background: none;
border: none;
padding: 0;
}
.checkoutContainer .container .form-control {
width: 90%
}
.checkoutContainer .container .form-group {
margin-bottom: 0
}
.checkoutContainer .container a, .checkoutContainer .container input.btn {
width: auto;
display: block
}
.checkoutContainer .container .login fieldset {
padding: 0;
margin: 0;
background: none;
border: none;
width: 100% !important
}
.checkoutContainer .container .login, .checkoutContainer .container .notLogin {
width: 100%
}
.checkoutContainer .container .login p {
display: none
}
.checkoutContainer .container .notLogin p {
margin-bottom: 14px
}
.checkoutContainer .container .notGuest {
padding-top: 32px
}
.transferUser {
display: none
} /* NOT REQUIRED*/
@media (min-width: 620px) {
.checkoutContainer .container {
width: 48%;
float: left;
margin-left: 2%
}
.checkoutContainer .container + .container {
margin-left: 6%;
width: 40%
}
}
/* progress */
.checkoutProgressBar {
padding: 64px 8px 24px;
}
.checkoutProgressBar .stepNo {
position: relative;
border-top: 2px solid #eee;
display: inline-block;
vertical-align: top;
font-size: 14px;
width: 25%;
text-align: center;
margin-right: -6px;
padding-top: 28px;
color: #f8f8f8
}
.checkoutProgressBar .stepNo.active .fullDetails {
color: #1E454B;
}
.checkoutProgressBar .multiLine {
display: none
}
.checkoutProgressBar .stepNo:before {
position: absolute;
top: -23px;
left: 50%;
margin-left: -22px;
content: "";
width: 44px;
height: 44px;
background: #f8f8f8;
border-radius: 22px;
text-align: center;
color: #fff;
line-height: 44px;
font-size: 18px
}
.checkoutProgressBar .stepNo.one:before {
content: "1"
}
.checkoutProgressBar .stepNo.two:before {
content: "2"
}
.checkoutProgressBar .stepNo.three:before {
content: "3"
}
.checkoutProgressBar .stepNo.four:before {
content: "4"
}
.checkoutProgressBar .stepNo.active:before {
background: #1E454B
}
/* Login */
.loginContainer {
width: 100%;
margin-top: 2rem;
}
.loginContainer h1 {
padding: 2rem 1.5rem 1.5rem 0;
text-align: left;
max-width: 340px;
margin: 0 auto;
}
.loginContainer .formContainer .form fieldset {
width: 100% !important;
}
.loginContainer .formContainer .form fieldset .form-group {
padding-left: 0;
}
.loginContainer .formContainer .form fieldset .form-group input.btn {
width: auto !important;
border: none;
background-color: transparent;
padding: 0.4rem 0 0.4rem 2.5rem !important;
margin-left: -0.7rem;
text-transform: uppercase;
font-size: 1.1rem !important;
}
.loginContainer .formContainer .form fieldset .form-group input.btn:hover {
background-color: transparent !important;
}
@media(min-width:768px) {
.loginContainer {
width: 50%;
}
.loginContainer h1 {
padding: 3rem 1.5rem 1.5rem 0;
}
}
/* checkout / account form */
.addressLineTwo label {
position: absolute !important;
left: 0 !important;
top: -999em !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important
}
.checkoutContainer select, .registrationModule input, .registrationModule select, .loginContainer input, .loginContainer select, .myAccountModule input, .myAccountModule select {
width: 100%;
border-radius: 0.3rem;
padding: 0.6rem 0.8rem;
border: 2px solid #f8f8f8;
background-color: #fff;
}
.checkoutContainer select {
padding-right: 3rem
}
.checkoutContainer .form-inline {
padding-bottom: 12px
}
.checkoutContainer .form-inline input, .checkoutContainer .form-inline select, .checkoutContainer .form-inline .btn {
display: inline-block;
vertical-align: top
}
.checkoutContainer .form-inline .btn {
margin-top: 4px
}
.checkoutContainer .deliveryAddress p {
margin-left: 0;
margin-right: 0;
}
.checkoutContainer .deliveryAddress .btn-group {
padding-bottom: 24px
}
.checkoutContainer .deliveryAddress .btn-group input.btn {
width: 100px;
margin-right: 4px
}
.checkoutContainer .container a.btn, .loginContainer a.btn {
background: none !important;
border-radius: 0;
font-size: 0.75rem;
width: 100%;
max-width: 380px;
padding-left: 1rem;
text-align: left;
color: #011F26;
text-decoration: underline;
padding: 0;
display: block;
}
.checkoutContainer .buttonContainer input.btn {
width: auto !important;
border: none !important;
font-size: 1.1rem !important;
margin-top: 0;
padding-right: 0 !important;
margin-left: -0.7rem;
}
.checkoutContainer .deliveryAddress .btn-group span {
display: inline-block;
margin-right: 32px
}
.checkoutContainer .deliveryAddress .btn-group span input {
width: 24px;
height: 24px;
padding: 0;
margin: 0;
display: inline-block;
vertical-align: top;
background: none
}
.checkoutContainer .deliveryAddress .btn-group span label {
padding: 0 0 0 9px;
margin: 0;
display: inline-block;
vertical-align: top;
max-width: none;
text-align: left
}
.loginContainer .formIntroduction, .addressManagement .formIntroduction, .set-password .formIntroduction {
padding-bottom: 24px;
text-align: center
}
.set-password .formIntroduction {
width: 90%;
margin: 0 auto
}
.addressManagement .formIntroduction {
padding-bottom: 0
}
.myAccountModule .info, .registrationModule .info {
padding: 24px 0 4%;
font-size: 14px;
margin: 0
}
.myAccountModule .legendMargin + .info, .registrationModule .legendMargin + .info {
padding-top: 0
}
p.editDetails {
padding-top: 8px
}
p.editDetails a {
font-size: 0.8rem;
}
.billingAddressSummary, .deliveryAddressSummary, .altDeliveryAddressSummary {
padding: 2rem;
margin-bottom: 24px
}
.AddressSummary {
background-color: #f8f8f8;
}
.userAddressesLoggedin .addressOptionsWrap {
padding-bottom: 0
}
.userAddressesLoggedin .addressOptionsWrap .deliveryAddressFirst, .userAddressesLoggedin .addressOptionsWrap .deliveryAddressSecond {
padding: 12px 36px 8px 12px;
background: #f8f8f8;
border: 2px solid #fff;
margin: 0 0 8px 0;
position: relative;
min-width: 200px
}
.userAddressesLoggedin .addressSelectorWrap {
position: absolute;
top: 4px;
right: 4px;
width: 24px;
height: 24px;
overflow: hidden
}
.userAddressesLoggedin .addressSelectorWrap label {
position: absolute !important;
left: 0 !important;
top: -999em !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important
}
.checkoutInnerContainer .leftColumn {
padding-top: 0;
margin-bottom: 3%
}
.forgottenEmail {
font-size: 14px
}
.userSubmissionForm.LostPasswordContainer .introduction {
padding: 0 0 2rem;
text-align: center;
background: none;
width: 90%;
margin: 0 auto
}
.enquiriesModule.LostPasswordContainer .pageHeader h1 {
display: block !important;
background-color: #f8f8f8;
font-family: 'Morn W01 Medium';
padding: 5rem 2rem 2rem;
text-transform: uppercase;
text-align: left;
font-size: 1.2rem;
letter-spacing: 0.2rem;
line-height: 1.5;
margin-bottom: 1.5rem;
}
/* delivery */
.checkoutInnerContainer .form .shippingCalculator {
padding: 1rem;
background-color: #f8f8f8;
}
.checkoutInnerContainer .form .shippingCalculator a {
margin-left: 0;
}
.checkoutInnerContainer .form .shippingCalculator .btn {
margin-top: 0;
margin-left: -0.8rem !important;
border: none !important;
}
.checkoutInnerContainer .form .shippingCalculator .close {
display: none;
}
.checkoutInnerContainer .specialInstructions .form-control {
width: 100%;
height: 100px;
margin-top: 16px;
max-width: 800px
}
.checkoutInnerContainer .eoriNumberField .form-control {
margin-top: 16px
}
.checkoutInnerContainer .specialInstructions label, .checkoutInnerContainer .orderReference label {
max-width: 560px;
font-size: 15px
}
.checkoutInnerContainer .options li {
padding-bottom: 10px
}
.checkoutInnerContainer .options input {
width: 24px;
height: 24px;
padding: 0;
margin: 0;
display: inline;
vertical-align: top;
background: none
}
.checkoutInnerContainer .options label {
padding: 0 0 0 1rem;
margin: 0;
display: inline-block;
vertical-align: top;
text-align: left
}
.form .options label {
padding: 0 0 0 1rem;
font-family: 'Morn W01 Light';
}
.form input.btn {
font-size: 1.5rem !important;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23eb5d4d' stroke-width='4'/%3E%3C/svg%3E") 0.8rem center/0.9rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 1rem center/0rem;
background-repeat: no-repeat;
padding-left: 2.6rem;
}
.form input.btn:hover {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 0.8rem center/0.9rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0rem center/2.2rem;
background-repeat: no-repeat;
}
small.privacyStatement {
padding: 0.5rem 1rem 1rem;
max-width: 560px;
}
.checkoutInnerContainer .options label span {
display: block;
font-size: 85%
}
.checkoutInnerContainer .agreeTerms .options label, .checkoutInnerContainer .mailingList .options label {
max-width: 200px
}
.checkoutInnerContainer .agreeTerms input, .checkoutInnerContainer .agreeTerms label, .checkoutInnerContainer .mailingList input, .checkoutInnerContainer .mailingList label {
vertical-align: text-top
}
.checkoutInnerContainer .leftColumn h2 {
font-size: 20px;
padding-bottom: 3%
}
.checkoutInnerContainer .leftColumn .deliveryInformation {
display: block;
}
.checkoutInnerContainer .leftColumn .deliveryInformation h3 {
font-family: 'Morn W01 Medium';
}
.checkoutInnerContainer .agreeTerms .options label, .checkoutInnerContainer .mailingList .options label {
max-width: 350px
}
.billingAddressSummary, .deliveryAddressSummary, .altDeliveryAddressSummary {
background-color: #f8f8f8;
padding: 1.5rem;
margin: 1rem;
}
.billingAddressSummary, .deliveryAddressSummary {
margin: 0 0 1rem !important
}
.myAccountModule .billingAddressSummary {
padding: 1.5rem 1.5rem 1rem !important;
}
.myAccountModule .billingAddressSummary h3 {
margin-bottom: 0.5rem !important;
font-size: 1.3rem;
}
.myAccountModule .billingAddressSummary + .billingAddressSummary {
padding-top: 0 !important;
}
.userAddressesLoggedin .addressOptionsWrap .deliveryAddressFirst, .userAddressesLoggedin .addressOptionsWrap .deliveryAddressSecond {
padding: 24px 64px 16px 24px;
margin: 0 24px 16px 0
}
.userAddressesLoggedin .addressSelectorWrap {
top: 8px;
right: 8px
}
.userAddressesLoggedin .addressSelectorWrap input {}
.paymentSmallprint {
padding: 0.5rem 1.5rem 1rem;
}
.paymentSmallprint label {
font-family: 'Morn W01 Light';
font-size: 0.8rem;
max-width: 900px;
}
.paymentSmallprint .contentHeader {
display: none;
}
.paymentSmallprint .agreeTerms {
border: 2px solid #011F26;
padding: 1rem;
margin-top: 1.5rem;
}
.paymentSmallprint .agreeTerms.error {
border: 4px solid #eb5d4d;
}
.step-1 .shoppingActions {
padding: 1rem 0.5rem;
}
.step-2 .shoppingActions {
padding: 1rem 0;
}
.step-3 .shoppingActions {
padding: 1rem 1.5rem;
}
.basketFooter + .shoppingActions {
padding: 0 0.2rem !important;
}
.step-3 .checkoutContainer .orderSummary {
padding-left: 1.2rem;
padding-right: 1.2rem;
}
.step-3 .additionalInformationSummary {
background: #f8f8f8;
padding: 1.5rem 1.2rem;
margin-bottom: 1rem;
}
.braintreePop {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
z-index: 99999999;
}
.braintreePop .makePaymentInner {
width: 90%;
max-width: 29rem;
margin: 0 auto;
background-color: #fff;
padding: 1.5rem;
position: relative;
top: 2rem;
max-height: 90vh;
overflow-y: auto;
}
.braintreePop .btn {
margin: 1rem 0 1rem -0.7rem !important;
}
.braintreePop .makePaymentInner .cancel.btn-text {
display: block !important;
background-color: #fff !important;
}
@media(min-width:640px) {
.braintreePop .makePaymentInner {
top: 50%;
transform: translate(0, -50%);
padding: 2rem;
}
}
@media(min-width:768px) {
.step-1 .shoppingActions {
padding: 1.5rem 1rem;
}
.step-2 .shoppingActions {
padding: 1rem;
}
.step-3 .additionalInformationSummary {
margin-left: 0.5rem;
margin-right: 0.5rem;
padding: 1.5rem;
}
.checkoutInnerContainer .form .shippingCalculator {
padding: 2rem;
margin: 0 0.5rem;
}
.checkoutInnerContainer .specialInstructions {
margin: 0 1rem;
}
.orderSummary {
padding-left: 1.2rem;
padding-right: 1.2rem;
}
.paymentSmallprint, .step-3 .shoppingActions {
padding-left: 2.2rem;
padding-right: 2.2rem;
}
.myAccountModule .billingAddressSummary + .billingAddressSummary {
padding-top: 1.5rem !important;
}
}
@media(min-width:768px) {
.userAddressesLoggedin, .myAccountModule .AddressSummary {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
}
.userAddressesLoggedin .contentHeader {
width: 100%;
}
.billingAddressSummary, .deliveryAddressSummary {
margin: 1rem 0.5rem !important;
}
.myAccountModule .AddressSummary {
margin-bottom: 1.5rem;
}
}
/* order complete */
.shopComplete .main.introduction {
background: #eb5d4d;
text-align: center !important;
font-size: 20px;
color: #fff;
padding: 1rem;
margin-bottom: 2rem;
}
.shopComplete .main.contentWrapper {
text-align: center !important;
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.shopComplete .main.contentWrapper .backHome {
padding-top: 6%
}
@media (min-width: 768px) {
.shopComplete .main.introduction {
font-size: 24px;
}
}
/* account */
.SaleHeaderWrapper {
text-align: center;
width: 94%;
margin: 0 auto;
}
.accountNav {
padding: 0 0 2.5rem;
text-align: center;
margin-right: 0;
}
.accountNav ol {
display: flex;
flex-wrap: wrap;
}
.accountNav ol li {
background-color: #011F26;
margin: 1px;
}
.accountNav ol li:hover {
background-color: #ea5d4c;
}
.accountNav li a {
display: flex;
padding: 1rem;
text-decoration: none;
color: #fff;
width: calc(100vw /2 - 2px);
height: calc(100vw /2 - 2px);
align-items: flex-end;
justify-content: flex-start;
font-family: 'Morn W01 Medium';
text-transform: uppercase;
letter-spacing: 0.1rem;
font-size: 0.9rem;
line-height: 1.5;
margin: 0;
text-align: left;
max-width: 170px;
max-height: 170px;
}
.accountNav li a:hover, .accountNav li a:focus, .accountNav li a:active {
opacity: 1
}
.myAccountModule .moduleContainer {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.myAccountModule .addressType input, .myAccountModule .addressDefault input {
margin: 0.25rem;
display: inline-block;
vertical-align: top;
background: none
}
.myAccountModule .addressType label, .myAccountModule .addressDefault label {
padding: 0 0 0 6px;
margin: 0;
display: inline-block;
vertical-align: top;
max-width: 200px
}
.myAccountModule .addressType label.sectionTitle {
padding-top: 16px
}
.myAccountModule .addressType .addressOptionWrap {
display: block;
padding: 10px 0 14px
}
.myAccountModule .addressType .addressOption {
display: block;
padding: 4px 0
}
@media (min-width: 600px) {
.accountNav li:first-child a {
border-left: none
}
.accountNav li:last-child a {
border-right: none
}
}
@media(min-width:768px) {
.accountNav li a {
width: calc(100vw /5);
height: calc(100vw /5);
}
}
/* order history */
.myAccountModule .orderHeaderWrapper {
text-align: center
}
.myAccountModule .orderSummary {
width: 94%;
max-width: 700px;
margin: 0 auto
}
.myAccountModule .orderSummary ul {
margin-bottom: 0
}
.myAccountModule .orderSummary .list-group-item {
background: #f8f8f8;
padding: 1.5rem;
margin-bottom: 1rem;
}
.myAccountModule .orderSummary .list-group-item .col-lg-3 {
padding: 0.2rem 0;
}
.myAccountModule .orderSummary .list-group-item .col-lg-3 span.th {
font-family: 'Morn W01 Medium';
}
.myAccountModule .orderSummary .list-group-item .last {
margin-top: 12px;
color: #fff;
display: inline-block
}
.myAccountModule .orderSummary .list-group-item .last .th {
display: none
}
.myAccountModule .orderSummary .list-group-item .td a {
color: #fff !important;
display: inline-block;
padding: 0.6rem 1.4rem;
text-decoration: none;
background-color: #1E454B;
border-radius: 2rem;
margin-right: 0.4rem;
margin-top: 0.4rem;
}
.myAccountModule .orderSummary .list-group-item .td a.reorderButton {
background-color: #ea5d4c !important;
}
/* details page */
.myAccountModule .reviewDetails .orderDetails {
margin-bottom: 24px;
background: #51B960;
margin: 0 4% 8px;
width: 92%;
max-width: none;
color: #fff;
padding: 20px 24px
}
.myAccountModule .reviewDetails .orderDetails .form-group {
padding: 4px 0
}
/* force long emails to wrap on small screens */
.wrapInner .contentContainer {
max-width: 100%;
overflow: hidden;
overflow-wrap: break-word;
}
/* steps scroller header spacing */
.scrollmagic-pin-spacer .component-group-begin_component.inView {
padding-top: 3rem;
padding-bottom: 0;
transition: padding-top 1s ease-out;
}
@media(min-width:500px) {
.scrollmagic-pin-spacer .component-group-begin_component.inView {
padding-top: 3.5rem;
}
}
@media(min-width:768px) {
.scrollmagic-pin-spacer .component-group-begin_component.inView {
padding-top: 4rem;
}
}
@media(min-width:1024px) {
.scrollmagic-pin-spacer .component-group-begin_component.inView {
padding-top: 3.5rem;
}
.fix.fixup .scrollmagic-pin-spacer .component-group-begin_component.inView {
padding-top: 8rem;
}
}
/* DEAR offline error message */
.shopContainer {
position: relative;
}
.shopContainer .warningMessage {
padding: 1rem;
font-size: 0.8rem;
background-color: #fff;
border: 2px solid #001F26;
position: absolute;
top: 1rem;
left: 1rem;
width: 8rem;
}
.shopContainer .warningMessage .close {
display: none !important;
}
.shopContainerInner .introduction {
padding: 1rem;
font-size: 0.8rem;
background-color: #f8f8f8;
}
/* coupon code */
.couponCodeEntry .codeSummary {
font-size: 14px;
padding: 8px 16px;
margin-top: 0.5rem;
background-color: #f8f8f8;
}
.couponCodeEntry .codeSummary span {
font-family: 'Morn W01 DemiBold';
}
.couponCodeEntry .codeSummary input.btn {
font-size: 0.7rem !important;
padding: 0 0 0 0.5rem;
margin: 0;
vertical-align: top;
background-image: none !important;
}
/* EORI */
.eoriQuestion, .eoriTooltip, .eorilink {
font-size: 0.7rem;
}
.eoriQuestion {
font-family: 'Morn W01 DemiBold';
}
.eorilink {
padding: 0.5rem 0;
}
/* admin CSS */
.form .titleWrap, .includeTitleWrap, .closeMenu, .subpagesInclude, .quickContact, .breadcrumbContainer, .socialBlock {
display: none !important
}
/* RELATED PRODUCTS */
.SampleProductView {
padding: 2rem 0 0 4%;
}
body.sample-box .SampleProductView {
display: none !important;
}
@media(min-width:560px) {
.SampleProductView {
padding-top: 4rem;
}
}
@media(min-width:640px) {
.SampleProductView {
padding-top: 5rem;
}
.SampleProductView .shopItem {
width: 30%;
}
}
@media(min-width:1024px) {
.SampleProductView {
padding-top: 5rem;
}
.SampleProductView .shopItem {
width: 22%;
}
}
.SampleProductView .contentHeader {
text-align: center;
}
.SampleProductView .contentHeader h2 {
font-size: 1rem;
line-height: 1.4;
font-family: 'Morn W01 Light Oblique';
padding-bottom: 1rem;
}
.sample-box .singleProductView .SampleProductView .contentWrapper, .singleProductView .SampleProductView .contentWrapper {
display: block !important;
padding: 0 !important;
width: 100% !important;
}
.SampleProductView .imageItem .purchaseWrap {
justify-content: flex-start;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2.2rem;
padding-left: 0.8rem;
}
/* PROMOTIONS */
.yes .component-group-begin_component, .promotion_component {
position: relative;
height: auto;
overflow: hidden;
}
.promotion_component {
border: 1px solid #fff;
}
.promotion_component .wrapInner .contentContainer {
position: relative;
text-align: left;
width: 100vw !important;
max-width: 405px;
padding: 2rem 1.5rem 12rem;
height: auto;
z-index: 1;
justify-content: flex-start;
}
.promotion_component .wrapInner .imageContainer {
height: 100vw;
width: 100vw;
position: absolute;
bottom: 0;
right: 0;
max-width: 16rem;
}
.promotion_component .wrapInner .imageContainer .singleImageWrap img {
max-width: 20rem;
}
.slider .promotion_component {
position: absolute;
}
.yes .slider.component-group-begin_component, .slider .promotion_component, .slider .promotion_component .wrapInner .contentContainer {
height: 35.5rem;
padding-bottom: 0;
}
.slider .promotion_component {
border: none;
}
.slider .promotion_component .wrapInner .contentContainer {
padding-top: 5rem;
}
@media(min-width:420px) {
.promotion_component .wrapInner .imageContainer {
max-width: 14rem;
}
.yes .slider.component-group-begin_component, .slider .promotion_component, .slider .promotion_component .wrapInner .contentContainer {
height: 29rem;
}
.promotion_component .wrapInner .contentContainer {
padding-bottom: 8rem;
}
}
@media(min-width:480px) {
.yes .slider.component-group-begin_component, .slider .promotion_component, .slider .promotion_component .wrapInner .contentContainer {
height: 24rem;
}
.promotion_component .wrapInner .contentContainer {
padding-left: 2rem;
padding-right: 2rem;
padding-bottom: 1.5rem;
justify-content: center;
}
.promotion_component .wrapInner .imageContainer {
width: 50vw;
max-width: none;
}
.promotion_component .wrapInner .imageContainer .singleImageWrap img {
width: 360px;
position: absolute;
bottom: -35px;
right: -100px;
max-width: none;
}
}
@media(min-width:580px) {
.promotion_component .wrapInner .imageContainer .singleImageWrap img {
width: 400px;
right: -55px;
}
}
@media(min-width:768px) {
.promotion_component .wrapInner .contentContainer {
padding-left: 3rem;
padding-right: 3rem;
max-width: 490px;
}
.slider .promotion_component .wrapInner .contentContainer {
padding-top: 3.5rem;
}
.promotion_component .wrapInner .imageContainer .singleImageWrap img {
width: 480px;
right: 0;
}
}
@media(min-width:1024px) {
.yes .component-group-begin_component.two-column .promotion_component.half-width {
width: 50vw;
height: 20rem;
}
.yes .component-group-begin_component.two-column .promotion_component.half-width h2 {
font-size: 1.4rem !important;
}
.component-group-begin_component.two-column .promotion_component .wrapInner .contentContainer, .yes .component-group-begin_component.two-column .promotion_component.half-width .wrapInner .contentContainer {
padding-left: 2rem;
padding-right: 2rem;
max-width: 445px;
height: 20rem;
justify-content: flex-start;
}
.component-group-begin_component.two-column .slider .promotion_component .wrapInner .contentContainer {
padding-top: 4.5rem;
}
.component-group-begin_component.two-column .promotion_component .wrapInner .imageContainer .singleImageWrap img {
position: absolute;
bottom: 20px;
right: -70px;
width: 430px;
}
body.sample-boxes .component-group-begin_component.two-column .promotion_component .wrapInner .imageContainer .singleImageWrap img {
bottom: 10px;
right: -70px;
width: 300px;
}
.component-group-begin_component.two-column.yes > .main.slider.component-group-begin_component {
width: calc(100vw/7 * 4) !important;
height: 62vw !important;
max-height: 816px !important;
}
.component-group-begin_component.two-column.yes > .main.slider.component-group-begin_component, .component-group-begin_component.two-column.yes > .main.slider.component-group-begin_component .promotion_component, .component-group-begin_component.two-column.yes > .main.slider.component-group-begin_component .promotion_component .wrapInner .contentContainer, .component-group-begin_component.two-column.yes > .main.slider.component-group-begin_component .promotion_component .wrapInner .imageContainer {
height: 62vw !important;
max-height: 816px !important;
}
.component-group-begin_component.two-column.yes > .main.slider.component-group-begin_component .promotion_component .wrapInner .contentContainer {
padding-left: 4rem;
max-width: 490px;
padding-top: 7rem;
}
.component-group-begin_component.two-column > .main.call-to-action_component {
width: 41vw !important;
padding-top: 0;
margin-bottom: 0 !important;
}
.component-group-begin_component.two-column + .gallery_component, .gallery_component + .component-group-begin_component.two-column {
margin-top: calc(-100vw / 7 - 4px) !important;
}
}
@media(min-width:1120px) {
.yes .component-group-begin_component.two-column .promotion_component.half-width h2 {
font-size: 1.5rem !important;
}
.component-group-begin_component.two-column .promotion_component .wrapInner .imageContainer .singleImageWrap img {
width: 480px;
bottom: 50px;
right: -50px;
}
body.sample-boxes .component-group-begin_component.two-column .promotion_component .wrapInner .imageContainer .singleImageWrap img {
bottom: -40px;
right: -70px;
width: 400px;
}
}
/* sample box product cta */
.singleProductView .actionsWrap .ctaBox {
text-align: center !important;
font-family: 'Morn W01 Medium';
padding: 1rem;
background: #f8f8f8;
margin: 1.5rem 0 0;
border-radius: 0.5rem;
position: relative;
font-size: 0.9rem;
}
.singleProductView .actionsWrap .ctaBox:after {
top: 100%;
left: 50%;
border: solid transparent;
content: "";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(242, 243, 244, 0);
border-top-color: #f8f8f8;
border-width: 20px;
margin-left: -20px;
}
.singleProductView .OtherSampleBoxes .OtherSampleBoxesInner li.shopItem {
border: none !important;
}
.mailingListSubscribe p, .mailingListSubscribe h2 {
text-align: center;
}
.SampleProductView .sampleProducts li.shopItem .productImageWrapper img {
aspect-ratio: 2 / 1;
width: 168%;
max-width: none;
}
.SampleProductView .sampleProducts.relatedProducts li.shopItem .productImageWrapper img {
aspect-ratio: 1 / 1;
width: 100%;
}
@media(min-width:1024px) {
.mailingListSubscribe p, .mailingListSubscribe h2 {
text-align: left;
}
}
.shopCallToAction {
margin-top: 1.5rem;
}
@media(min-width:560px) {
.shopCallToAction {
margin-top: 2rem;
}
}
@media(min-width:768px) {
.shopCallToAction {
margin-top: 3rem;
}
}
.shopCallToAction .wrapInner .linkWrap .btn {
color: #011F26 !important;
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23011F26' stroke-width='4'/%3E%3C/svg%3E") 0.8rem center/0.6rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 1rem center/0rem;
background-repeat: no-repeat;
}
.shopCallToAction .wrapInner .linkWrap .btn:hover, .shopCallToAction .wrapInner .linkWrap .btn:focus, .shopCallToAction .wrapInner .linkWrap .btn:active {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 17.68 21.28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1.14 1.65 13.03 8.99-13.03 8.99' fill='none' stroke='%23fff' stroke-width='4'/%3E%3C/svg%3E") 0.8rem center/0.6rem, url("data:image/svg+xml,%3Csvg viewBox='0 0 52.66 52.66' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='26.33' cy='26.33' fill='%23011f26' r='25.73'/%3E%3C/svg%3E") 0rem center/2rem;
background-repeat: no-repeat;
}
.page-header_component .wrapInner .imageWrap .singleImage {
min-height: 0 !important;
height: auto !important;
}
/* BLOG */
.blogOuterWrapper .rightColumn .blogMenuWrap .blogMenuTitle h2 {
font-size: 1.4rem;
font-family: 'Morn W01 Medium' !important;
}
.blogOuterWrapper .rightColumn .blogMenuWrap .menuItem a {
font-size: 1rem;
}
.blogOuterWrapper .rightColumn .blogsTagInclude ul li {
display: inline-block;
margin: 4px;
}
.blogOuterWrapper .rightColumn .blogsTagInclude ul li a {
text-decoration: none;
background: #f8f8f8;
padding: 8px 16px;
font-size: 0.8rem;
color: #011F26 !important;
display: block;
}
.blogsTags ul li {
display: inline-block;
margin: 4px;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .textWrap h2.sectionTitle {
font-size: 1.4rem;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .textWrap .blogContent {
font-size: 0.9rem;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .textWrap .blogDate {
font-size: 0.7rem;
font-family: 'Morn W01 DemiBold';
}
.blogOuterWrapper .blogLanding .column .textWrap .interact .btn {
margin-top: 0.5rem;
margin-left: -0.7rem;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage {
position: relative;
overflow: hidden;
aspect-ratio: 2 / 1;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage img {
object-fit: cover;
aspect-ratio: 2 / 1;
width: 100%;
}
@media(min-width:768px) {
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage {
aspect-ratio: 1.5 / 1;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage img {
aspect-ratio: 1.5 / 1;
}
}
@media(min-width:1024px) {
.blogOuterWrapper .blogLanding .wrapInner .columnWrap {
display: block;
}
.blogOuterWrapper .blogLanding .wrapInner .column {
max-width: none;
width: 69vw;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage {
aspect-ratio: 2.5 / 1;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage img {
aspect-ratio: 2.5 / 1;
}
.blogOuterWrapper .blogLanding .wrapInner .column.noImages {
display: block;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column.noImages .blogImage, .blogOuterWrapper .blogLanding .wrapInner .columnWrap .column.noImages .textWrap {
width: 100%;
max-width: none;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .textWrap {
padding-left: 2rem;
padding-right: 2rem;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column.noImages .textWrap {
padding-left: 1rem;
padding-right: 1rem;
}
}
@media(min-width:1200px) {
.blogOuterWrapper .blogLanding .wrapInner .columnWrap {
display: flex;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage {
aspect-ratio: 1.5 / 1;
}
.blogOuterWrapper .blogLanding .wrapInner .columnWrap .column .blogImage img {
aspect-ratio: 1.5 / 1;
}
.blogOuterWrapper .blogLanding .columnWrap {
padding-left: 3vw;
}
.blogOuterWrapper .blogLanding .wrapInner .column {
width: 32vw;
margin: 0px 2vw 2vw 0;
}
}
/* single blog */
.blogOuterWrapper .blogsModule h1 {
padding-bottom: 2rem !important;
}
.blogOuterWrapper .blogsModule .blogContent h2 {
font-size: 1.4rem;
}
.blogOuterWrapper .blogsModule .blogContent h3 {
font-size: 1.25rem;
}
.blogOuterWrapper .singleBlogPost .fullPost .contentWrap img {
padding: 0;
width: 100%;
margin: 0 auto;
}
.blogOuterWrapper .singleBlogPost .fullPost .contentWrap blockquote {
margin: 1.5rem 0;
text-align: center;
position: relative;
padding: 2.5rem 1.5rem;
border-radius: 0;
font-size: 1.1rem;
font-family: 'Morn W01 Light';
;
}
.blogOuterWrapper .singleBlogPost .fullPost .contentWrap .author {
text-align: center;
margin-top: -3rem;
margin-bottom: 3rem;
font-family: 'Morn W01 DemiBold';
font-size: 0.9rem;
}
.blogOuterWrapper .singleBlogPost .fullPost .contentWrap .author cite {
font-style: normal;
}
@media (min-width: 768px) {
.blogOuterWrapper .singleBlogPost .fullPost .contentWrap .half-width-image {
width: 49%;
display: inline-flex;
padding: 0.5rem;
margin: 0 auto;
margin-bottom: 0px;
margin-bottom: 1rem;
}
.blogOuterWrapper .singleBlogPost .fullPost .contentWrap blockquote {
padding: 2.5rem 3rem;
}
}
.blogOuterWrapper .singleBlogPost {
padding-top: 3rem !important;
}
@media (min-width: 1024px) {
.blogOuterWrapper .singleBlogPost {
border: 4px solid #fff;
background: #f8f8f8;
}
.blogModule .blogOuterWrapper .singleBlogPost.noImages {
margin-top: 2rem !important;
}
}
/* order history */
.myAccountModule .orderSummary {
width: 100%;
max-width: none;
padding-left: 0 !important;
padding-right: 0 !important;
}
.myAccountModule .reviewDetails .orderDetails {
background: #f8f8f8;
color: #011F26;
margin: 0 0 1rem;
width: 100%;
max-width: none;
padding: 1rem 1.5rem;
}
.myAccountModule .reviewDetails .orderSummary {
margin: 0 0 0.5rem;
width: 100%;
}
.reviewDetails .basketItemsSummary .quantityTotal {
padding: 0.4rem;
background: #fff;
border-radius: 0.5rem;
border: 2px solid #ddd;
min-width: 3rem;
font-size: 0.8rem;
}