@font-face { font-family: 'esco'; src: url('/_fonts/esco.eot?v3'); src: url('/_fonts/esco.eot?v3#iefix') format('embedded-opentype'), url('/_fonts/esco.woff?v3') format('woff'), url('/_fonts/esco.ttf?v3') format('truetype'), url('/_fonts/esco.svg?v3#esco') format('svg'); font-weight: normal; font-style: normal; }
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
/* = Reset
----------------------------------------------------------------------------------------------------------------- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, hr, a, a img, font, img, dd, dl, dt, li, ol, ul, blockquote, fieldset, form, label, legend, table, caption, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; }

/* = HTML5 Elements
----------------------------------------------------------------------------------------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
audio, canvas, video { display: inline-block; }
html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

/* = Body
----------------------------------------------------------------------------------------------------------------- */
body { color: #222; font-size: 15px; text-align: left; font-family: 'Open Sans', sans-serif; background: #f7f7f7; }

/* = Font icons
----------------------------------------------------------------------------------------------------------------- */
.icon:before,  
.icon:after,  
.ClosePopup:before,
.miniBasket .item:before,
#footer .footerMenu ul li:after,
.checkoutProgress .progressActive a:before,
.checkoutProgress .progressComplete a:before,
.colRemove .btn:after,
.coCCBtn:before,
.coChequeBtn:before,
blockquote:before,
.msgImp:before,
.msgError:before,
.msgSuccess:before,
blockquote p span:before,
.icon--chevdown:after,
.loginOptions .icon--person:after,
.lSAction > a:after,
.commentAdd .comments-label:after,
.leave-rating-stars .star:after,
.productList .ribbon:before,
.btn--toggle:after   { font-family: "esco"; font-style: normal; font-weight: normal; speak: none; display: inline-block; vertical-align: baseline; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* = Typography
----------------------------------------------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 { margin: 0 0 20px; color: #333; font-weight: 600; }
h1 { font-size: 1.714em; margin: 26px 0 24px; }
h2 { font-size: 1.429em; margin: 24px 0 22px; }
h3 { font-size: 1.286em; margin: 18px 0; }
h4 { font-size: 1.214em; margin: 15px 0; }
h5 { font-size: 1.143em; margin: 14px 0; }
h6 { font-size: 1.071em; margin: 12px 0; }
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0; }

p { margin: 0 0 18px; line-height: 1.5em; }

blockquote { margin: 30px 0; padding-left: 40px; padding-right: 35px; position: relative; }
blockquote p { margin: 0 0 15px 0; line-height: 1.65em; font-size: 1.286em; }
blockquote p:last-of-type { margin-bottom: 15px; }
blockquote cite { font-size: 0.9em; }
blockquote:before { content: '\f10d'; font-size: 22px; color: #222; position: absolute; top: 0; left: 0; }
blockquote p span { display: inline-block; width: 22px; height: 22px; margin-left: 15px; top: -2px; position: relative; }
blockquote p span:before { content: '\f10e'; font-size: 22px; color: #222; position: relative; top: 0; right: 0; }

a { color: #222; text-decoration: none; }
a:hover { color: #222; text-decoration: none; }
strong, b { font-weight: 600; }

#mainContent p > a:not(.btn),
#mainContent .passwordReset { color: #a8274c; }
#mainContent p > a:not(.btn):hover,
#mainContent .passwordReset:hover { text-decoration: underline; }

img { vertical-align: bottom; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; }
hr { margin: 35px 0; height: 1px; border: 0; border-top: 1px solid #ccc; }
small { font-size: 0.8em; }
address { margin: 0 0 20px; line-height: 1.5em; font-style: normal; }

sub, sup { line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
pre { margin: 0; }
pre code { font-size: 1.5em; white-space: pre-wrap; }

figure { margin: 0 0 20px; }
figure > img { max-width: 100%; }
figcaption { padding-top: 10px; color: #777; font-size: 0.8em; }

.floatLeft { float: left; }
.floatRight { float: right; }
.hide { display: none; }
.hideText { text-indent: 100%; white-space: nowrap; overflow: hidden; }
.clr { clear: both; }
.leader { font-size: 1.143em; }
.textLeft { text-align: left; }
.textCenter { text-align: center; }
.textRight { text-align: right; }
.highlight { color: #222; }
.marked { color: #fff; background: #222; }
.meta { color: #666; font-style: italic; font-size: 0.9em; margin-bottom: 10px; }
.lrgfont { font-size: 3em; }
.fixed { position: fixed; top: 20px; }

@media screen and (max-width: 480px) {
    h1 { font-size: 1.6em; margin-bottom: 22px; }
    h2 { margin-bottom: 20px; }
    hr { margin: 30px 0; }

    blockquote { padding-left: 35px; padding-right: 32px; }
    blockquote p { font-size: 1.143em; }
}

@media screen and (max-width: 380px) {
    h1 {  font-size: 1.5em; margin-bottom: 20px; }
    h2 { margin-bottom: 18px; }

    blockquote { padding-left: 32px; padding-right: 30px; }
    blockquote p { font-size: 1.071em; }

    blockquote:before,
    blockquote:after { font-size: 21px; }
}

/* = Buttons
----------------------------------------------------------------------------------------------------------------- */
.btn { display: inline-block; padding: 8px 20px; color: #fff; font-weight: 600; font-family: 'Open Sans', sans-serif; font-weight: 600; line-height: 1.5em; outline: none; cursor: pointer; border: 1px solid #222; background: #222; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -webkit-transition: background .3s ease, border-color .3s ease, color .3s ease; transition: background .3s ease, border-color .3s ease, color .3s ease; }
.btnImpact { background: #fff; color: #222; }

.btn:hover { color: #fff; background: #555; border-color: #555; }
.btnAccent { border-color: #a8274c; background: #a8274c; }
input.btn { font-size: 1em; line-height: 1.5em; white-space: normal; }

.btn--toggle:after { content: '\e807'; padding-left: 10px; }
.btn--toggle.on:after {transform: rotate(180deg); padding: 0 10px 0 0; }


.coCCBtn, .coChequeBtn, .coPaypalBtn { display: inline-block; vertical-align: middle; text-align: center; margin-left: 20px; position: relative; background: #fff; min-width: 195px; -webkit-transition: background .3s ease, border-color .3s ease, color .3s ease; transition: background .3s ease, border-color .3s ease, color .3s ease; }
.coCCBtn:hover, .coChequeBtn:hover { background: #555; border-color: #555; }
.coPaypalBtn:hover { background: none; border-color: #fff; }
.coPaypalBtn input { outline: none; }
.coCCBtn .btn, .coChequeBtn .btn, .coPaypalBtn .btn { padding-left: 45px; min-width: 195px; background: none; z-index: 1; position: relative; font-weight: 700; }

.coCCBtn .waitingImage, .coChequeBtn .waitingImage, .coPaypalBtn .waitingImage { min-width: 191px; }
.coCCBtn:before { content: '\e819'; position: absolute; top: 13px; left: 20px; color: #222; z-index: 0; }
.coChequeBtn:before { content: '\f0f6'; position: absolute; top: 12px; left: 20px; color: #222; font-size: 15px; z-index: 0; }
.coCCBtn:hover:before,
.coChequeBtn:hover:before { color: #fff; }
.coChequeBtn .chequeNote { display: none; }

.coCCBtn--dd:before { content: '\e82a';  }

.multiplePaymentWarning { margin: 15px 0 0; }

.hamburger { display: block; position: absolute; margin: 0; padding: 0; width: 26px; height: 26px; font-size: 0; background: none; text-indent: -9999px; appearance: none; box-shadow: none; border-radius: 0; border: none; cursor: pointer; -webkit-transition: background 0.2s; transition: background 0.2s; overflow: hidden; }
.hamburger:focus { outline: none; }
.hamburger span { display: block; position: absolute; top: 50%; margin-top: -1px; left: 1px; right: 1px; height: 2px; background: #222; -webkit-transition: background 0s 0.2s; transition: background 0s 0 }
.hamburger span::before,
.hamburger span::after { position: absolute; display: block; left: 0; width: 100%; height: 2px; background-color: #222; content: ""; -webkit-transition-duration: 0.2s, 0.2s; transition-duration: 0.2s, 0.2s; -webkit-transition-delay: 0.2s, 0s; transition-delay: 0.2s, 0s; }
.hamburger span::before { top: -8px; -webkit-transition-property: top, transform; transition-property: top, transform; }
.hamburger span::after { bottom: -8px; -webkit-transition-property: bottom, transform; transition-property: bottom, transform; }
.hamburger.is-active span { background: none; }
.hamburger.is-active span::before { top: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.hamburger.is-active span::after { bottom: 0; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.hamburger.is-active span::before,
.hamburger.is-active span::after { -webkit-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s; }

@media screen and (max-width: 800px) {
    .btn { display: inline-block; padding: 6px 18px; }

    .coCCBtn, .coChequeBtn, .coPaypalBtn { margin-left: 18px; }
    .coCCBtn .btn, .coChequeBtn .btn, .coPaypalBtn .btn { padding-left: 40px; }
    .coCCBtn:before { top: 11px; left: 16px; }
    .coChequeBtn:before { top: 10px; left: 16px; }
}


@media screen and (max-width: 750px) {
    .coPaypalBtn { display: block; margin-top: 25px; text-align: right; }
    .coChequeBtn { margin-right: 0; }
}

@media screen and (max-width: 700px) {
    .multiplePaymentWarning .btn { display: block; }
}

@media screen and (max-width: 650px) {
    .coCCBtn, .coChequeBtn {     margin: 0 0 15px; clear: both; float: right;  }
    .coCCBtn:last-child, .coChequeBtn:last-child {margin-bottom: 0;} 

    .coPaypalBtn { margin: 35px 0 0; text-align: left; }
}

@media screen and (max-width: 600px) {
    .hamburger {  width: 24px; height: 24px; }
    .hamburger span { margin-top:0;}
    .hamburger span,
    .hamburger span:before,
    .hamburger span:after {height: 2px; }
    .hamburger span:before {top: -7px;}
    .hamburger span:after {bottom: -7px;}
   
    .hamburger.is-active span::before { top: 0;  }
    .hamburger.is-active span::after { bottom: 0; }
   }
   

@media screen and (max-width: 520px) {
    .coCCBtn, .coChequeBtn { display: block; width: 100%; margin: 0 0 20px 0; }
    .coCCBtn .btn, .coChequeBtn .btn, .coPaypalBtn .btn { width: 100%; }
    .coCCBtn .waitingImage, .coChequeBtn .waitingImage, .coPaypalBtn .waitingImage { width: 100%; }

    .multiplePaymentWarning .btn { width: 100%; text-align: left; line-height: 1; padding: 10px 14px; opacity: 0.8; }
}


/* = Loader defaults
----------------------------------------------------------------------------------------------------------------- */
.waitingImage { display: inline-block; min-height: 39px; min-width: 75px; position: relative; }
.waitingImage > img { display: block; position: absolute; top: 50%; right: 50%; margin-top: -10px; margin-right: -10px; }

@media screen and (max-width: 800px) {
    .waitingImage { min-height: 35px; }
}

/* = Lists
----------------------------------------------------------------------------------------------------------------- */
ul { margin: 0 0 20px 25px; line-height: 1.5em; }
ul li { margin: 0 0 10px; }
ul li ul { margin-top: 20px; margin-left: 30px; list-style-type: circle; }

ol { margin: 0 0 20px 25px; line-height: 1.5em; }
ol li { margin: 0 0 10px; }
ol li ol { margin-top: 20px; margin-left: 30px; list-style-type: lower-latin; }

dl { margin: 0 0 20px; line-height: 1.5em; }
dt { color: #111; font-weight: 600; }
dd { margin: 0 0 20px; }

.inline { margin-left: 0; list-style: none; }
.inline li { display: inline; margin: 0 15px 0 0; }

.breadcrumb ul { margin-left: 0; list-style: none; }
.breadcrumb ul li { display: inline; margin: 0 10px 0 0; }

.paging { margin: 0 0 20px; }
.paging ul { margin: 0; list-style: none; }
.paging ul li { display: inline-block; margin-bottom: 8px; margin-right: 2px; }
.paging ul li.det { padding-right: 10px; }
.paging ul li a { display: inline-block; font-weight: 600; padding: 0; width: 28px; height: 28px; line-height: 28px; color: #fff; background: #666; border-radius: 50%; text-align: center; }
.paging ul li a:hover { background: #454545; }
.paging ul li a.on { background: #080808; }

@media screen and (max-width: 600px) {
    .paging { font-size: .9em; }
    .paging ul li a { font-weight: 400; width: 24px; height: 24px; line-height: 24px; }
}

/* = Tables
----------------------------------------------------------------------------------------------------------------- */
.tableScroll { overflow: auto; margin-bottom: 35px; }

table { width: 100%; margin: 0; border-spacing: 0; border-collapse: collapse; }
th { padding: 12px; color: #fff; border: 1px solid #888; background: #888; font-weight: 600; }
td { padding: 12px; border-bottom: 1px solid #e5e5e5; background: #fff; }
.rowItemStandout td { color: #fff; background: #a1c897; }

@media screen and (max-width: 800px) {
    table { font-size: .9em; }
    th, td { padding: 12px 10px; }
}

@media screen and (max-width: 600px) {
    th, td { padding: 10px 8px; }
}

@media screen and (max-width:560px) {
    tr:nth-child(1) { display: none; }
    tr { display: block; width: 100%; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 20px; position: relative; }
    tr:last-child { margin-bottom: 0; }
    tr td { display: block; width: 100%; padding: 0; border: 0; text-align: left; }

    .no-csstransforms3d tr td { float: left; }
}

@media screen and (max-width:480px) {
    .tableScroll { margin-bottom: 30px; }
}

/* = Screen Messages
----------------------------------------------------------------------------------------------------------------- */
.msg { margin: 35px 0; padding: 16px 18px; background: #f5f5f5; position: relative; }
.msg p { margin-bottom: 0; line-height: 1.25em; }
.msg p > img { width: 16px; height: auto; margin-right: 5px; }
.msg ul { margin-bottom: 0; }
.msg ul li { margin-bottom: 2px; }
.msg ul li:last-child { margin-bottom: 0; }

.msgImp { padding-left: 55px; color: #fff; background: #8ec3d9; }
.msgImp:before { content: '\f12a'; position: absolute; left: 18px; font-size: 22px; top: 50%; margin-top: -11px; }
.msgImp a { color: #fff; font-weight: 600; }
.msgError { padding-left: 55px; color: #fff; background: #e84d54; }
.msgError:before { content: '\e800'; position: absolute; left: 18px; font-size: 22px; top: 50%; margin-top: -11px; }
.msgError a { color: #fff; font-weight: 600; }
.msgSuccess { padding-left: 55px; color: #fff; background: #a1c897; }
.msgSuccess:before { content: '\e803'; position: absolute; left: 18px; font-size: 22px; top: 50%; margin-top: -11px; }
.msgSuccess h3 { color: #fff; margin: 0 0 10px; }
.msgSuccess a { color: #fff; font-weight: 600; }
.msgAssist { background-color: #fff0bc; }



#mainContent > .zoneOne > .msg,
#mainContent > .zoneOne > div > .msg { margin-top: 0; }

#pageWarning { padding: 15px 18px; top: 20px; margin-bottom: 5px; color: #fff; font-size: 1em; background-color: #e84d54; position: relative; }

.important-panel { font-size: 1em;  margin: 35px auto; padding:22px; max-width: 900px; border: 3px solid #a1a1a1; position: relative;}
.important-panel:before {content:none; }
.important-panel:first-child {margin-top:0; } 
.important-panel:last-child {margin-bottom:0; } 
.important-panel p { margin: 0 auto 18px;  max-width: 750px; } 
.important-panel p:last-child { margin-bottom:0; }
.important-panel .ip-close { position: absolute; cursor: pointer; top: -3px;  right: -3px; width: 20px; height: 20px;  background: #a1a1a1 url(/_img/icons/cross.svg) no-repeat center; background-size: 10px;}
.important-panel--js {display: none;}
.important-panel.msgDefault { background-color: #fffce1; } 
.important-panel.msgAssist,
.important-panel.msgImp,
.important-panel.msgError,
.important-panel.msgSuccess  { border:none; }
.important-panel.msgAssist .ip-close,
.important-panel.msgImp .ip-close,
.important-panel.msgError .ip-close,
.important-panel.msgSuccess .ip-close { top:0; right:0; background-color: rgba(0, 0, 0, 0.3); } 

@media screen and (max-width: 1024px) {
 .important-panel {  margin: 30px auto;  }
}

@media screen and (max-width: 600px) {
    #pageWarning { top: 35px; font-size: .9em;  }
    .important-panel { padding:20px;}
}

@media screen and (max-width: 480px) {
    .msg { margin: 30px 0; padding: 14px 16px; }
    .msgImp,
    .msgError,
    .msgSuccess { padding-left: 53px; }
    .msgImp:before,
    .msgError:before,
    .msgSuccess:before { left: 16px; }

    .important-panel { padding:20px; margin: 25px auto; text-align: left; font-size: .9em; border-width: 2px; }
    .important-panel .ip-close {  width: 18px; height: 18px; top: -2px;  right: -2px;  }
}

/* = Columns
----------------------------------------------------------------------------------------------------------------- */
.cols { margin-bottom: 30px; }
.cols:last-child {margin-bottom: 5px;}

.colsHalf .col { width: 48%; float: left; margin-right: 4%; }
.colsThird .col { width: 32%; float: left; margin-right: 2%; }
.colsFourth .col { width: 22%; float: left; margin-right: 4%; }
.cols .endCol { margin-right: 0; }


@media screen and (max-width: 1024px) {
    .colsThird .col { width: 100%; float: none; margin-right: 0; }
    .colsFourth .col { width: 48%; float: left; margin-right: 4%; margin-bottom: 2%; }
    .colsFourth .col:nth-last-child(-n+2) { margin-bottom: 0; }
    .colsFourth .col:nth-child(even) { margin-right: 0; }
}

@media screen and (max-width: 800px) {
    .colsHalf .col,
    .colsFourth .col { width: 100%; float: none; margin-right: 0; margin-bottom: 30px; }
    .colsHalf .endCol { margin-bottom: 0; }
}

/* = Modules
----------------------------------------------------------------------------------------------------------------- */
.module h3 { margin: 0 0 10px; }

/* = Tabs
----------------------------------------------------------------------------------------------------------------- */
.tabs { margin: 0 0 20px; }
.tabs ul { margin: 0; list-style: none; }
.tabs ul li { display: inline; margin: 0 20px 0 0; position: relative; }
.tabs ul li a { display: inline-block; color: #222; position: relative; }
.tabs ul li a:hover { color: #666; }
.tabs ul li a.on { color: #222; }
.tabs ul li a:hover:after { background: #666; -webkit-transform: scale(1); transform: scale(1); }
.tabs ul li a:after { content: ''; width: 100%; height: 1px; background: #fff; position: absolute; bottom: -3px; left: 0; transition: all .3s ease; -webkit-transform: scale(0); transform: scale(0); }
.tabs ul li a.on:after,
.tabs ul li a.on:hover:after { background: #222; -webkit-transform: scale(1); transform: scale(1); }

.tabs .panel { padding: 20px 0 0; }

.tabs .dropdownPrompt { background: #f7f7f7; border: 1px solid #ddd; color: #000; cursor: pointer; display: inline-block; margin-top: -4px; margin-bottom: 12px; padding: 4px 8px; padding-right: 25px; position: relative; min-width: 155px; text-transform: capitalize; font-size: .9em; }
.tabs .dropdownPrompt:after { content: ''; position: absolute; top: 0; width: 0; height: 0; right: 10px; bottom: 0; margin: auto; border-style: solid; border-width: 5px 4px 0px 4px; border-color: #444 transparent transparent transparent; pointer-events: none; }
.tabs .dropdown.showOptions { position: absolute; top: -5px; left: 0; border: 1px solid #ddd; display: none; width: 155px; font-size: .9em; }
.tabs .dropdown.showOptions li { display: block; margin: 0; text-transform: capitalize; }
.tabs .dropdown.showOptions li a:after { content: none; }
.tabs .dropdown.showOptions li a { display: block; padding: 6px 8px; }
.tabs .dropdown.showOptions li a:hover { color: #222; }
.tabs .dropdown.showOptions a:hover { background: #f7f7f7; }
.tabs .dropdown.showOptions a.on,
.tabs .dropdown.showOptions a.on:hover { background-color: #222; color: #fff; }

@media screen and (max-width: 800px) {
    .tabs ul li { display: block; width: 100%; margin-bottom: 16px; }
    .tabs .panel { padding: 15px 0 0; }
    .tabs .dropdownPrompt { margin-top: 5px; }
    .tabs .dropdown.showOptions { top: 5px; }
}

/* = Accordions
----------------------------------------------------------------------------------------------------------------- */
.accordion { margin: 0 0 20px; }
.accordion > h3 { display: block; text-align: center; margin: 0 0 10px; padding: 8px 16px; border: 1px solid #555; }
.accordion > h3:hover { cursor: pointer; background: #f3f3f3; border: 1px solid #555; }
.accordion > h3.on { color: #fff; background: #555; }
.accordion .content { display: none; margin-bottom: 20px; }
.accordion .content.contentopen { display: block; }

@media screen and (max-width: 800px) {
    .accordion > h3 { padding: 6px 14px; font-size: 1.214em; }
}

/* = Forms
----------------------------------------------------------------------------------------------------------------- */
.webForm { margin-bottom: 30px; }
.webForm:last-of-type { margin-bottom: 5px; }
.webForm div { margin: 0 0 16px; }
.webForm div em { display: block; margin-left: 25%; margin-top: 10px; }
.webForm div:last-child { margin-bottom: 0; }
.webForm .submitBtn label,
.survey .submitBtn label { display: none; }

.webForm  label { width: 25%; float: left; padding: 10px 0; }
input.text, textarea, select, input[type=text] { width: 75%; padding: 8px 12px; font-size: 1em; line-height: 1.5em; font-family: 'Open Sans', sans-serif; border: 1px solid #e5e5e5; background: #fff; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; outline: none; }
input.text:focus, textarea:focus, select:focus { outline: none; border-color: #ccc; }
input.file { margin: 8px 0; }

.webForm .g-recaptcha { padding-left: 25% }
@media screen and (max-width: 730px) {
    .webForm .g-recaptcha {
        padding-left: 0
    }
}

textarea { min-height: 150px; max-width: 100%; }

/*Cross browser & device select reset*/
.select { position: relative; width: 75%; float: left; }
.select:after { content: ''; position: absolute; top: 0; width: 0; height: 0; right: 13px; bottom: 0; margin: auto; border-style: solid; border-width: 5px 5px 0px 5px; border-color: #444 transparent transparent transparent; pointer-events: none; }
.select select { content: ''; height: 100%; width: 100%; height: 39px; cursor: pointer; outline: none; padding-right: 40px; -moz-appearance: none; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; border-radius: 0; }
.select select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #222; }
.select select::-ms-expand { display: none; }

/*IE9  and below disable custom dropdown icon*/
.no-csstransforms3d .select:after { content: none; }
.no-csstransforms3d .select select { padding-right: 12px; }

/*Cross browser & device input reset*/
textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
.input-checkbox { -webkit-appearance: none; border-radius: 0; }

/*Cross browser & device placeholder reset*/
::-webkit-input-placeholder { color: #222; }
::-moz-placeholder { color: #222; }
:-ms-input-placeholder { color: #222; }
:-moz-placeholder { color: #222; }

input.text:read-only { background-color: #eee; color: #666 }
input.text:-moz-read-only { background-color: #eee; color: #666 }

.formList { display: inline-block; padding: 4px 0; line-height: 1.5em; }
.formList label { width: auto; padding: 0 10px 0 0; float: none; }
.formList input { width: auto; margin: 0 10px 0 0; padding: 0; border: 0; }

.checkbox, .check { display: inline-block; padding: 0; margin: 8px 0; position: relative; }
.checkbox input, .check input { float: left; margin: 0; padding: 0; border: 0; position: relative; }

.check input { float: left; margin: 0; padding: 0; border: 0; }

/*Cross browser & device custom checkbox and radio lists*/
.formList input { opacity: 0; position: absolute; margin: 12px 10px 0 12px; }
.formList label { display: inline-block; vertical-align: middle; margin: 4px 0; cursor: pointer; position: relative }

.formList label:before,
.checkbox:before,
.check:before { content: ''; background: #fff; border: 1px solid #ddd; display: inline-block; vertical-align: middle; width: 16px; height: 16px; padding: 2px; margin-bottom: 4px; margin-right: 10px; text-align: center; cursor: pointer }

.radList label:before,
.formListRadio label:before { -webkit-border-radius: 16px; border-radius: 16px; }

.radList label.checked:after,
.formListRadio span.checked label:after,
.formListRadio label.checked:after { content: ''; position: absolute; left: 6px; top: 6px; width: 10px; height: 10px; border-radius: 10px; background: #333; }

.checkList label.checked:after,
.formList:not(.radList):not(.formListRadio) label.checked:after,
.checkbox.checked:after,
.check.checked:after { content: ''; position: absolute; left: 8px; top: 4px; width: 4px; height: 10px; border: solid #333; border-width: 0 2px 2px 0; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/* Single checboxes*/
.checkbox input,
.check input { position: absolute; top: 0; left: 0; opacity: 0; width: 21px; height: 21px; float: none; cursor: pointer; z-index: 1 }
.checkbox.checked:after,
.check.checked:after { left: auto; right: 18px; top: 4px; width: 4px; height: 10px; }

/* IE9 and below fallbacks */
.no-csstransforms3d .formList input,
.no-csstransforms3d .checkbox input,
.no-csstransforms3d .check input { opacity: 1; position: relative; margin: 0 10px 0 0; padding: 5px 0; width: auto; height: auto; display: inline-block; vertical-align: middle; }
.no-csstransforms3d .formList label { margin: 0; }
.no-csstransforms3d .formList label:before,
.no-csstransforms3d .checkbox input:before,
.no-csstransforms3d .checkList label.checked:after,
.no-csstransforms3d .checkbox input.checked:after,
.no-csstransforms3d .radList label.checked:after,
.no-csstransforms3d .formListRadio label.checked::after,
.no-csstransforms3d .checkList label.checked:after,
.no-csstransforms3d .formList:not(.radList):not(.formListRadio) label.checked:after,
.no-csstransforms3d .checkbox.checked:after,
.no-csstransforms3d .check.checked:after,
.no-csstransforms3d .formList label:before,
.no-csstransforms3d .checkbox:before,
.no-csstransforms3d .check:before { content: none; }

@media screen and (max-width: 1080px) {
    .colsHalf .col label,
    .colsHalf .col input.text, .colsHalf .col textarea, .colsHalf .col select, .colsHalf .col input[type=text],
    .colsHalf .col .select { width: 100%; float: none; }
    .colsHalf .col label { display: block; padding: 0; margin-bottom: 6px; }
    .colsHalf .col .webForm div em { margin-left: 0; }
    .colsHalf .col .radList br { display: none; }
}

@media screen and (max-width: 800px) {
    input.text, textarea, select, input[type=text], .select select { height: 35px; padding: 6px 10px; }
    .select select { padding-right: 32px; }
    .select:after { right: 12px; border-width: 5px 4px 0px 4px; }

    .webForm label,
    input.text, textarea, select, input[type=text],
    .select { width: 100%; float: none; }
    .webForm label { display: block; padding: 0; margin-bottom: 6px; }

    .webForm label.labelhide,
    label.labelhide,
    .labelNext,
    .webForm .nolabel { display: none; }

    .webForm .formList label { display: inline-block;  }

    .webForm div { margin: 0 0 15px; }
    .webForm div em { margin-left: 0; }
}

@media screen and (max-width: 480px) {
    .webForm div { margin: 0 0 12px; }
    .webForm div em { font-size: .9em; }
}

@media screen and (max-width: 360px) {
    .webForm div { margin: 0 0 10px; }
}

/* = Framework > Main wrappers
----------------------------------------------------------------------------------------------------------------- */
#wrap { width: 1280px; margin: 0 auto; padding: 0 35px; background: #fff; }
#mainContent { padding: 35px 0; }

.templateTwo .zoneOne { width: calc(100% - 360px); float: left; }
.templateTwo .zoneTwo { width: 320px; float: right; }

.templateTwo5050 .zoneOne,
.templateTwo5050 .zoneTwo { width: 48%; float: left; margin-right: 4%; }
.templateTwo5050 .zoneTwo { margin-right: 0; }

.inner-slim { max-width: 750px; margin:0 auto;}

@media screen and (max-width: 1300px) {
    #wrap { width: auto; margin: 0; }

    .templateTwo .zoneOne { width: calc(100% - 340px); }
    .templateTwo .zoneTwo { width: 300px; }
}

@media screen and (max-width: 1024px) {
    #mainContent { padding: 30px 0; }
}

@media screen and (max-width: 800px) {
    #mainContent { padding: 25px 0; }

    .templateTwo .zoneOne { margin-bottom: 35px; }
    .templateTwo .zoneOne,
    .templateTwo .zoneTwo,
    .templateTwo5050 .zoneOne,
    .templateTwo5050 .zoneTwo { width: 100%; float: none; }
}

@media screen and (max-width: 600px) {
    #wrap { padding: 0 30px; }
}

@media screen and (max-width: 480px) {
    #wrap { padding: 0 25px; }
}

@media screen and (max-width: 360px) {
    #wrap { padding: 0 20px; }
}

@media screen and (max-width: 340px) {
    #wrap { padding: 0 18px; }
}

/* = Start issue box
----------------------------------------------------------------------------------------------------------------- */
.msgStartIssue {padding: 30px; background: none; border:4px solid #666; }
.start-issue-dropdown { display: -ms-flexbox; display: -webkit-flex; display: flex; }
.start-issue-dropdown .sid-select-wrap {width: 100%; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; }
.start-issue-dropdown .select { margin:0; width: 100%; } 
.start-issue-dropdown select,
.start-issue-dropdown .select select { height: 100%;}
.start-issue-dropdown label { float: none; width: auto; padding:0; margin: 0 15px 0 0; min-width: 375px; -webkit-align-self: center; -ms-flex-item-align: center; align-self: center;  }
.start-issue-dropdown input.btn {font-size: 1em; border: none;} 

@media screen and (max-width: 900px) {
    .start-issue-dropdown { display: block; }
    .start-issue-dropdown label { display: block; min-width: 0; margin:0 0 10px; }
    .start-issue-dropdown input.btn {font-size: 1em; border: none; } 
}

@media screen and (max-width: 480px) {
    .msgStartIssue {padding: 25px;}
}

@media screen and (max-width: 400px) {
    .msgStartIssue {padding: 20px;}
}


/* = Framework > Header items
----------------------------------------------------------------------------------------------------------------- */
header { position: relative; }

.logo-actions-wrap { padding: 35px 0; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: relative; }
.no-flexbox .logo-actions-wrap { display: table; width: 100%; }

.logo { width: 40%; display: block; margin: 0; }
.no-flexbox .logo { display: table-cell; vertical-align: top; }

.logo > a { background: url(/_img/esco_logo_grey.svg) no-repeat 0 50%; background-size: contain; max-width: 100%; height: 100px; display: block; position: relative; }

.header-actions { width: 60%; }
.no-flexbox .header-actions { display: table-cell; vertical-align: top; }

.header-actions .headBanner,
.basket-geo-wrap { text-align: right; }

.header-actions .headBanner { margin-bottom: 20px; font-size: 14px; }

.header-actions .headBanner > div,
.basket-geo-wrap > div { display: inline-block; vertical-align: baseline; }

.loginOptions { margin-left: 20px; }
.loginOptions > span { font-size: 11px; display: inline-block; vertical-align: middle; margin-right: 5px; }

.miniBasket { margin-left: 20px;     height: 16px; }

#miniBasket { position: relative; }
#miniBasket .item { min-width: 20px; }
#miniBasket .no-items { display: none; position: absolute; top: calc(100% + 12px); left: 50%; width: 112px; text-align: center; padding: 3px; font-size: 10px; background: #222; color: #fff; -webkit-transform: translateX(-50%); transform: translateX(-50%); border-radius: 4px; z-index: 1; }
#miniBasket:hover .no-items { display: block; }
#miniBasket .no-items:before { content: ''; position: absolute; top: -5px; left: 50%; margin-left: -5px; width: 0; height: 0; border: 0 solid transparent; border-right-width: 5px; border-left-width: 5px; border-bottom: 5px solid #222; }
#miniBasket > a { position: absolute; left: 0; width: 100%; top: 0; height: 100%; }

.loginOptions .btn { padding: 3px 14px 5px; margin-left: 10px; }
.loginOptions .icon--person {  display: inline-block; vertical-align: middle; font-size: 0; width: 16px; height: 21px;  }
.loginOptions .icon--person:after { content: '\e821'; font-size: 17px; line-height: 21px; }

.miniBasket .item:before { content: '\f291';  font-size: 15px; width: 16px; color: #222; }
.miniBasket .qty {    margin-left: 8px; line-height: 1; display: inline-block; } 
.miniBasket .btn { margin-left: 10px; background: none; color: #222; border-color: #222; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.25s; transition-duration: 0.25s; }
.miniBasket .btn:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #555; -webkit-transform: scale(0); transform: scale(0); -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.25s; transition-duration: 0.25s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }
.miniBasket .btn:hover:before, .miniBasket .btn:focus:before, .miniBasket .btn:active:before { -webkit-transform: scale(1); transform: scale(1); }
.miniBasket .btn:hover, .miniBasket .btn:focus, .miniBasket .btn:active { color: #fff; border-color: #555; }

.no-csstransforms3d .miniBasket .btn:hover, .no-csstransforms3d .miniBasket .btn:focus, .no-csstransforms3d .miniBasket .btn:active { background: #555; border-color: #555; }

.geoSelect { font-size: 14px; }
.geoSelect .select,
.geoSelect span { float: none; width: auto; display: inline-block; vertical-align: baseline; }
.geoSelect .geoSwitcher > span { margin-right: 8px; }

.geoSelectMobile { display: none; font-size: .9em; }
.geoSelectMobile .geoSwitcher > span { display: block; margin-bottom: 5px; }

.loginOptions .loggedIn { display: none;}

@media screen and (min-width: 801px) {
    .loginOptions,
    .miniBasket { margin-left: 25px; }
}

@media screen and (max-width: 1080px) {
    .logo { width: 35%; }
    .header-actions { width: 65%; }
}

@media screen and (max-width: 1024px) {
    .logo { width: 42%; }
    .header-actions { width: 58%; }

    .logo-actions-wrap { padding: 30px 0; }

    .geoSelect { font-size: 13px; }
    .header-actions .geoSwitcher .select select { padding: 4px 10px; padding-right: 32px; height: auto; }
    .no-csstransforms3d .geoSwitcher .select select { padding-right: 10px; }
}

@media screen and (max-width: 900px) {
    .logo { width: 40%; }
    .header-actions { width: 60%; }

    .loginOptions .btn { margin-left: 10px; padding: 4px 14px; }

    .header-actions .headBanner { margin-bottom: 18px; }
}

@media screen and (max-width: 800px) {
    .logo,
    .header-actions { width: 100%; }

    .logo { margin-top: 50px; }
    .logo a { background-position: 50% 50%; margin: 0 auto; }

    .header-actions { margin-top: 0; }
    .header-actions .headBanner { top: 25px; left: 0; margin: 0; position: absolute; width: 100%; font-size: 13px; }

    .logo-actions-wrap { padding: 25px 0; }
    
    .loginOptions { margin: 4px 55px 0 20px; }

    .basket-geo-wrap .geoSelect { display: none; }
    .geoSelectMobile { display: block; position: absolute; bottom: 0; left: 0; padding: 15px; width: 100%; color: #fff; background: #4c4c4c; border-top: 1px solid #424242; }

    .shopHotline { float: left; padding: 3px 0; text-align: left; }

    .no-flexbox .logo-actions-wrap,
    .no-flexbox .header-actions,
    .no-flexbox .logo { display: block; }
}

@media screen and (max-width: 700px) {
    .shopHotline { padding: 0; }
    .shopHotline span { display: block; }
}

@media screen and (max-width: 600px) {
    .header-actions .headBanner { top: 40px; }

    .logo { margin-top: 55px; }

    .loginOptions { margin-top: 2px; }

    .loginOptions,
    .loginOptions > span { margin-left: 0; }

    .miniBasket { float: left; margin: 4px 0 0; }
    .miniBasket .item:before { font-size: 16px; }

    #miniBasket .no-items { left: -10px; -webkit-transform: none; transform: none; }
    #miniBasket .no-items:before { left: 14px; margin-left: 0; }
}

@media screen and (max-width: 480px) {
    .logo-actions-wrap { padding: 25px 0; }
    .geoSelect .geoSwitcher > span { margin-right: 5px; }

    .loginOptions { margin-top: 3px; margin-right: 52px; }
    .loginOptions > span {  font-size: 10px; }

    #miniBasket .no-items { width: 104px; padding: 2px; font-size: 9px; }
}


@media screen and (max-width: 360px) {
    .logo-actions-wrap { padding: 25px 0 20px; }
    .miniBasket { float: left; margin: 4px 0 0; }
}

@media screen and (max-width: 340px) {
    .basket-geo-wrap .geoSelect { text-align: left; }
    .geoSelect .geoSwitcher > span { display: block; margin-bottom: 6px; }
    .geoSelect .select { width: 100%; }

    .loginOptions { margin: 3px 50px 0 0; }
    .loginOptions > span { font-size: 9px; margin-right: 3px; }
 
    .miniBasket .btn { padding: 4px 12px; }

    .loginOptions .userName,
    .loginOptions .hello  { display: none; }

    .loginOptions .loggedIn { display: inline; }
}

/* = Login wizard
----------------------------------------------------------------------------------------------------------------- */
.loginWizard1 .msg:first-child,
.loginWizard2 .msg:first-child {margin-top:0; }

/* = Banners
----------------------------------------------------------------------------------------------------------------- */
.bannerHolder { margin:35px 0; }
.bannerHolder:first-child { margin-top: 0; }
.bannerHolder:last-child { margin-bottom: 0; }

@media screen and (max-width: 600px) {
    .bannerHolder { margin:30px 0; }
}

@media screen and (max-width: 400px) {
    .bannerHolder { margin:25px 0; }
}

/* = Footer
----------------------------------------------------------------------------------------------------------------- */
#footer { border-top: 1px solid #222; margin-top: 5px; padding-top: 20px; position: relative; }
#footer .footerMenu ul { list-style: none; margin: 0; padding: 0; }
#footer .footerMenu ul li { display: inline-block; }
#footer .footerMenu ul li:after { content: '\e822'; padding: 0 8px; }
#footer .footerMenu ul li:last-child:after { content: none; }
#footer .footerMenu ul li a:hover { text-decoration: underline; }
#footer .backToTop { position: absolute; top: 20px; right: 0; }
#footer .copyright { margin-top: 15px; }

@media screen and (max-width: 750px) {
    #footer .footerMenu ul { padding-right: 85px; margin: 0 0 20px; }
    #footer .footerMenu ul li { display: block; }
    #footer .footerMenu ul li:after { content: none; padding: 0; }
}

/* = Popup message
----------------------------------------------------------------------------------------------------------------- */
#fadeWrap { display: none; }
#fade { width: 100%; height: 100%; position: fixed; left: 0; background: url(/_img/lens-bg.png) repeat top left; z-index: 9998; }

#popup { display: none; width: 550px; max-width: 100%; padding: 30px; position: fixed; top: 20%; left: 50%; margin-left: -275px; z-index: 9999; background: #fff; -webkit-box-shadow: 0 2px 20px 2px rgba(0, 0, 0, 0.25); box-shadow: 0 2px 20px 2px rgba(0, 0, 0, 0.25); }
#popup .ClosePopup { display: block; position: absolute; top: 0; right: 0; width: 35px; height: 35px; background: #222; }
#popup .ClosePopup:before { content: '\e800'; color: #fff; font-size: 16px; width: 35px; line-height: 35px; }

#popup .ClosePopup:hover { background: #555; }
#popup .ClosePopup > img { max-width: 100%; }
#popup span { float: left; }

#popup .changeRegionWrap { position: relative; }
#popup .changeRegionWrap span { position: absolute; top: 0; left: 0; padding: 10px 0; }
#popup .changeRegionWrap > div { margin-left: 120px; text-align: right; }
#popup .changeRegionWrap .select { position: relative; width: calc(100% - 75px); display: inline-block; vertical-align: middle; float: none; }
#popup .changeRegionWrap input.btn { display: inline-block; vertical-align: middle; }

@media screen and (max-width: 640px) {
    #popup { width: auto; margin: 0 35px; left: 0; }
}

@media screen and (max-width: 600px) {
    #popup { margin: 0 30px; }
}

@media screen and (max-width: 480px) {
    #popup { margin: 0 25px; }
    #popup .changeRegionWrap span { position: relative; display: block; padding: 0 0 10px; }
    #popup .changeRegionWrap > div { margin-left: 0; text-align: left; }
}

@media screen and (max-width: 360px) {
    #popup { margin: 0 20px; padding: 35px 26px 26px; }
}

/* = Menu
----------------------------------------------------------------------------------------------------------------- */
.main-nav-wrap { min-height: 28px; position: relative; }
.hamburger { display: none; position: absolute; top: 0; right: 0; z-index: 3; }

#nav { background: #f7f7f7; }
#nav ul { margin: 0; padding: 0; list-style: none; }
#nav ul li { margin: 0; display: inline-block; font-weight: 600; }
#nav ul li a { padding: 12px 20px; display: block; -webkit-transition: background .25s ease, color .25s ease; transition: background .25s ease, color .25s ease; }
#nav ul li.liOn a { background: #222; color: #fff; }
#nav ul li a:hover { background: #555; color: #fff; }

@media screen and (max-width: 800px) {
    .hamburger { display: block; }

    .main-nav-wrap { position: fixed; top: 0; left: 0; right: auto; width: calc(100% - 80px); max-width: 400px; height: 100%; bottom: 0; background: #222; -webkit-transition: -webkit-transform 500ms ease; transition: transform 500ms ease; -ms-transform: translate3d(-105%, 0, 0); -webkit-transform: translate3d(-105%, 0, 0); transform: translate3d(-105%, 0, 0); -webkit-box-shadow: 5px 5px 5px rgba(0,0,0,0.15); box-shadow: 5px 5px 5px rgba(0,0,0,0.15); z-index: 5; }
    .no-csstransforms3d .main-nav-wrap { left: -100%; }

    .mainNav-on .main-nav-wrap { -ms-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
    .no-csstransforms3d .mainNav-on .main-nav-wrap { left: 0; }

    #nav { padding: 32px 16px; background: none; }
    #nav ul li { display: block; border-bottom: 1px solid #424242; }
    #nav ul li:last-child { border: 0; }
    #nav ul li a { color: #fff; }

    #menu { left: 0; top: 0; max-height: 100%; overflow: auto; height: calc(100% - 85px); overflow: auto; }
    .mainNav-on #menu { max-height: unset; }
}

@media screen and (min-width: 801px) and (max-width: 900px) {
    .custServiceLabel { display: none; }
}

@media screen and (max-width: 600px) {
    .shopHotline { left: 0; top: 0; right: 0; padding: 4px 0; display: block; float: none; position: fixed; background: #eaeaea; color: #222; text-align: center; font-size: .9em; z-index: 4; }
    .shopHotline span { display: inline-block; }
}

@media screen and (max-width: 480px) {
    .main-nav-wrap { width: calc(100% - 75px); }
}

@media screen and (max-width: 360px) {
    .main-nav-wrap { width: calc(100% - 70px) }
}

@media screen and (max-width: 340px) {
    .main-nav-wrap { width: calc(100% - 64px) }
    #nav { padding: 32px 12px; background: none; }
}

/* =  Menu > submenu
----------------------------------------------------------------------------------------------------------------- */
.sub-nav-wrap { position: relative; }

#subNav { background: #222; }
#subNav ul { margin: 0; padding: 0 20px; list-style: none; }
#subNav ul li { padding: 10px 12px; margin: 0; display: inline-block; font-size: 0.929em; }
#subNav ul li:first-child { padding-left: 0; }
#subNav ul li:last-child { padding-right: 0; }
#subNav ul li.liOn a,
#subNav ul li a:hover { text-decoration: underline; }
#subNav ul li a { color: #fff; }

.submenuTrigger { display: none; margin-bottom: 25px; padding: 10px 15px; color: #fff; background: #bbb; position: relative; font-weight: 300; }
.submenuTrigger span {width:100%; display: block; }
.submenuTrigger .icon  { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);  right: 15px; width: 22px; height: 22px; }
.submenuTrigger  .icon:after { content:'\f107';     font-size: 22px; transition:transform .3s ease;}
.submenuTrigger .icon.is-active:after {-webkit-transform:rotate(180deg);  transform:rotate(180deg); }

@media screen and (max-width: 900px) {
    .has5Plus #subMenu { position: absolute; top: 40px; right: 0; left: 0; z-index: 2; }
    .has5Plus .submenuTrigger { margin-bottom: 0; height: 40px; display: block; }
    .has5Plus #subNav { background: #ddd; max-height: 0; overflow: hidden; -webkit-transition: max-height .4s linear; transition: max-height .4s linear; }
    .subNav-on .has5Plus #subNav { max-height: 350px; }
    .has5Plus #subNav ul { padding: 24px; }
    .has5Plus #subNav ul li { padding: 0 0 10px 0px; display: block; }
    .has5Plus #subNav ul li:last-child { padding-bottom: 0; }
    .has5Plus #subNav ul li a { color: #222; }
    .has5Plus .hamburger { display: block; }
}

@media screen and (max-width: 800px) {
    #subMenu { position: absolute; top: 40px; right: 0; left: 0; z-index: 2; }

    .submenuTrigger,
    .has5Plus .submenuTrigger { height: 40px; display: block; }

    #subNav { background: #ddd; max-height: 0; overflow: hidden; -webkit-transition: max-height .4s linear; transition: max-height .4s linear; }
    .subNav-on #subNav { max-height: 350px; }

    #subNav ul { padding: 24px; }
    #subNav ul li { padding: 0 0 10px 0px; display: block; }
    #subNav ul li:last-child { padding-bottom: 0; }
    #subNav ul li a { color: #222; }
}

/* = Slider Defaults
----------------------------------------------------------------------------------------------------------------- */
.slider-wrap { margin:0; padding: 0; position: relative; }

.lSSlideOuter { overflow: hidden; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none }
.lightSlider:before, .lightSlider:after { content: " "; display: table; }
.lightSlider { overflow: hidden; margin: 0; }
.lSSlideWrapper { max-width: 100%; overflow: hidden; position: relative; }
.lSSlideWrapper > .lightSlider:after { clear: both; }
.lSSlideWrapper .lSSlide { -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); -webkit-transition: all 1s; -webkit-transition-property: -webkit-transform,height; -moz-transition-property: -moz-transform,height; transition-property: transform,height; -webkit-transition-duration: inherit !important; transition-duration: inherit !important; -webkit-transition-timing-function: inherit !important; transition-timing-function: inherit !important; }
.lSSlideWrapper .lSFade { position: relative; }
.lSSlideWrapper .lSFade > * { position: absolute !important; top: 0; left: 0; z-index: 0; margin-right: 0; width: 100%; }
.lSSlideWrapper.usingCss .lSFade > * { opacity: 0; -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transition-duration: inherit !important; transition-duration: inherit !important; -webkit-transition-property: opacity; transition-property: opacity; -webkit-transition-timing-function: inherit !important; transition-timing-function: inherit !important; }
.lSSlideWrapper .lSFade > *.active { z-index: 1; }
.lSSlideWrapper.usingCss .lSFade > *.active { opacity: 1; }

/* Pager */
.lSPager { list-style: none; margin: 0; padding: 0; }
.lSSlideOuter .lSPager.lSpg { margin: 10px 0 0; padding: 0; text-align: center; }
.lSSlideOuter .lSPager.lSpg > li { cursor: pointer; display: inline-block; padding: 0 5px; margin: 0 2px; }
.lSSlideOuter .lSPager.lSpg > li a { opacity: 0.8; background-color: transparent; display: inline-block; height: 12px; width: 12px; border: 1px solid #333; border-radius: 50%; overflow: hidden; text-indent: -999em; position: relative; -webkit-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s; z-index: 1; }
.lSSlideOuter .lSPager.lSpg > li.active a { background-color: #333; }

/* Slider actions */
.lSAction > a { position: absolute; color: #fff; background-color: #333; opacity: 0.2; width: 36px; height: 40px; line-height: 40px; font-size: 40px; top: 50%; margin-top: -20px; display: block; cursor: pointer;  -webkit-transition:opacity .3s ease; transition:opacity .3s ease; z-index: 1; }
.lSAction > a:hover { opacity: 0.45; color:#fff }
.lSAction > a:before { width: auto; vertical-align: top; }

.lSAction > .lSPrev { left: 0; }
.lSAction > .lSNext { right: 0; text-align: right; }
.lSAction > .lSPrev:after { content:'\F104'; width: 34px; line-height: 38px; } 
.lSAction > .lSNext:after { content:'\F105'; width: 34px; line-height: 38px; } 

/* Rtl */
.lSSlideOuter.lSrtl { direction: rtl; }
.lSSlideOuter .lightSlider, .lSSlideOuter .lSPager { padding-left: 0; list-style: none outside none; }
.lSSlideOuter.lSrtl .lightSlider, .lSSlideOuter.lSrtl .lSPager { padding-right: 0; }
.lSSlideOuter .lightSlider > *, .lSSlideOuter .lSGallery li { float: left; }
.lSSlideOuter.lSrtl .lightSlider > *, .lSSlideOuter.lSrtl .lSGallery li { float: right !important; }

@-webkit-keyframes rightEnd {
    0% { left: 0; }
    50% { left: -15px; }
    100% { left: 0; }
}

@keyframes rightEnd {
    0% { left: 0; }
    50% { left: -15px; }
    100% { left: 0; }
}

@-webkit-keyframes leftEnd {
    0% { left: 0; }
    50% { left: 15px; }
    100% { left: 0; }
}

@keyframes leftEnd {
    0% { left: 0; }
    50% { left: 15px; }
    100% { left: 0; }
}

.lSSlideOuter .rightEnd { -webkit-animation: rightEnd 0.3s; animation: rightEnd 0.3s; position: relative; }
.lSSlideOuter .leftEnd { -webkit-animation: leftEnd 0.3s; animation: leftEnd 0.3s; position: relative; }
.lSSlideOuter.lSrtl .rightEnd { -webkit-animation: leftEnd 0.3s; animation: leftEnd 0.3s; position: relative; }
.lSSlideOuter.lSrtl .leftEnd { -webkit-animation: rightEnd 0.3s; animation: rightEnd 0.3s; position: relative; }
.lightSlider.lsGrab > * { cursor: -webkit-grab; cursor: -moz-grab; cursor: -o-grab; cursor: -ms-grab; cursor: grab; }
.lightSlider.lsGrabbing > * { cursor: move; cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: -o-grabbing; cursor: -ms-grabbing; cursor: grabbing; }

@media screen and (max-width: 1320px) {
    .slider-wrap { padding: 0 50px; }
    .slide-prev { left: 0; }
    .slide-next { right: 0; }
}

@media screen and (max-width: 850px) {
    .slider-wrap { padding: 0 45px; }
    .slider-controls span,
    .lSAction > a { width: 32px; height: 34px; line-height: 34px; font-size: 34px; margin-top: -17px;  }
    .lSAction > .lSPrev:after,
    .lSAction > .lSNext:after  {width: 32px;  line-height: 32px; }

    .lSAction > a,
    .lSAction > a:hover { opacity: 0.15; }
}

@media screen and (max-width: 440px) {
    .lSAction > a,
    .lSAction > a:hover { opacity: 0.1; }

    .lSSlideOuter .lSPager.lSpg > li { padding: 0 4px; }
    .lSSlideOuter .lSPager.lSpg > li a {  height: 11px; width: 11px; }
}

/* = Product list
----------------------------------------------------------------------------------------------------------------- */
/* Products > Default (Three wide) */
.productList ul { list-style: none; margin: 25px 0 0; }

.productList ul li { float: left; width: 32%; margin: 3% 2% 0 0; }
.productList ul li:nth-child(3n+3) { margin-right: 0; clear: right; }
.productList ul li:nth-child(3n+1) { clear: left; }

.productList ul li header { display: inline-block; vertical-align: top; width: 125px; }
.productList ul li header > a { display: block;}
.productList ul li header img { max-width: 105px; height: auto; }
.productList ul li footer { display: inline-block; vertical-align: top; width: calc(100% - 135px); }
.productList ul li footer p:last-child { margin-bottom: 0; }
.productList ul li footer .longProdDesc p:last-child,
.productList ul li footer .shortProdDesc p:last-child { margin-bottom: 18px; }
.productList ul li .price { color: #a8274c; }

/* Products > Four wide wide*/
.productListFourWide ul li { float: left; width: 23.5%; margin: 3.5% 2% 0 0; }
.productListFourWide ul li:nth-child(3n+3) { margin-right: 2%; clear: none; }
.productListFourWide ul li:nth-child(3n+1) { clear: none; }
.productListFourWide ul li:nth-child(4n+4) { margin-right: 0; clear: right; }
.productListFourWide ul li:nth-child(4n+1) { clear: left; }

#mainContent .formQuestion { float: right; width: calc(100% - 410px); margin-bottom: 35px; }
#mainContent .formQuestion > div > span,
#mainContent .formQuestion > div > .select { margin-right: 10px; display: inline-block; vertical-align: baseline; }
#mainContent .formQuestion > div { overflow: auto; }
#mainContent .formQuestion > div > span { float: left; font-weight: 400; padding: 10px 0; width: 200px; }
#mainContent .formQuestion .select,
#mainContent .formQuestion select { width: 250px; border-color: #D1D3D4; float: none; font-weight: 600; }
#mainContent .formQuestion .select { float: left; }

@media screen and (max-width: 1080px) {
    #mainContent .formQuestion { width: calc(100% - 330px); }
}

@media screen and (max-width: 960px) {
    #mainContent .formQuestion { width: calc(100% - 270px); }
}

@media screen and (max-width: 900px) {
    #mainContent .formQuestion { width: calc(100% - 240px); }
}

@media screen and (max-width: 780px) {
    #mainContent .formQuestion > div > span, #mainContent .formQuestion .select { float: none; margin-right: 0; } 
    #mainContent .formQuestion > div > span { width: 100%; }
    #mainContent .formQuestion .select { width: auto; }
}

@media screen and (max-width: 600px) {
    #mainContent .formQuestion { margin: 30px 0 0; float: none; width: 100%; }
}

/* Products > Two wide*/
.productListTwoWide ul li { float: left; width: 49%; margin: 4% 2% 0 0; }
.productListTwoWide ul li:nth-child(3n+3) { margin-right: 2%; }
.productListTwoWide ul li:nth-child(2n+2) { margin-right: 0; clear: right; }
.productListTwoWide ul li:nth-child(odd) { clear: left; }
.productListTwoWide ul li:nth-child(even) { clear: right; }
.productListTwoWide ul li header { width: 230px; }
.productListTwoWide ul li header img { max-width: 210px; }
.productListTwoWide ul li footer { width: calc(100% - 240px); }
.productListTwoWide ul li h4 { font-size: 1.286em; }

/* Products > One wide*/
.productListOneWide ul li { float: none; width: 100%; margin: 0 0 35px 0; padding-bottom: 35px; border-bottom: 1px solid #efefef; }
.productListOneWide ul li:nth-child(3n+3),
.productListOneWide ul li:nth-child(2n+2) { margin-right: 0; clear: both; }
.productListOneWide ul li:last-child { border-bottom: 0; margin-bottom: 0; }
.productListOneWide ul li header { width: 240px; }
.productListOneWide ul li header img { max-width: 210px; }
.productListOneWide ul li footer { width: calc(100% - 250px); }
.productListOneWide ul li h4 { font-size: 1.429em; }

@media screen and (max-width: 1260px) {
    .productListFourWide ul li { width: 32%; margin: 3.5% 2% 0 0; }
    .productListFourWide ul li:nth-child(4n+4),
    .productListFourWide ul li:nth-child(4n+1) { clear: none; margin-right: 2%; }

    .productListFourWide ul li:nth-child(3n+3) { margin-right: 0; clear: right; }
    .productListFourWide ul li:nth-child(3n+1) { clear: left; }

    .productListTwoWide ul li header { width: 210px; }
    .productListTwoWide ul li header img { max-width: 190px; }
    .productListTwoWide ul li footer { width: calc(100% - 220px); }
}

@media screen and (min-width: 701px) {
    .productListTwoWide ul li:nth-child(-n+2) {  margin-top:0; }
}

@media screen and (min-width: 1025px) {
    .productList:not(.productListTwoWide) ul li:nth-child(-n+3) {  margin-top:0; }
}

@media screen and (min-width: 1261px) {
    .productListFourWide ul li:nth-child(-n+4) { margin-top:0; }
}

@media screen and (max-width: 1024px) {
    .productList ul li:nth-child(3n+3),
    .productList ul li:nth-child(3n+1) { clear: none; }

    .productList ul li { float: left; width: 49%; margin: 4% 2% 0 0; }
    .productList ul li:nth-child(3n+3) { margin-right: 2%; }
    .productList ul li:nth-child(2n+2) { margin-right: 0; clear: right; }
    .productList ul li:nth-child(odd) { clear: left; }
   

    .productListTwoWide ul li header { width: 125px; }
    .productListTwoWide ul li header img { max-width: 105px; }
    .productListTwoWide ul li footer { width: calc(100% - 135px); }
    .productListTwoWide ul li h4 { font-size: 1.214em; }

    .productListOneWide ul li { float: none; width: 100%; margin: 0 0 35px 0; padding-bottom: 35px; border-bottom: 1px solid #efefef; }
    .productListOneWide ul li h4 { font-size: 1.286em; }
}

@media screen and (max-width: 1024px) and (min-width: 701px) {
    .productList ul li:nth-child(-n+2) { margin-top:0; }
}

@media screen and (max-width: 700px) {
    .productList ul li { float: none; width: 100%; margin: 35px 0 0 0; }
    .productList ul li:nth-child(odd),
    .productList ul li:nth-child(even) { margin-right: 0; }
    .productList ul li:first-child { margin-top: 0; }

    .productListOneWide ul li { border-bottom: none; padding-bottom: 0; }
    .productListOneWide ul li header { width: 125px; }
    .productListOneWide ul li header img { max-width: 105px; }
    .productListOneWide ul li footer { width: calc(100% - 135px); }
    .productListOneWide ul li h4 { font-size: 1.214em; }
}

@media screen and (max-width: 480px) {
    .productList ul li header { width: 100px; }
    .productList ul li header img { max-width: 80px; }
    .productList ul li footer { width: calc(100% - 110px); }
}

@media screen and (max-width: 380px) {
    .productList ul li header { width: 90px; }
    .productList ul li header img { max-width: 75px; }
    .productList ul li footer { width: calc(100% - 100px); }
    .productList ul li h4 { margin-bottom: 12px; }
}


/* = Product list with contents 100% width
----------------------------------------------------------------------------------------------------------------- */
.productList--fullwidth ul li header,
.productList--fullwidth ul li footer { display: block; width: 100%; position: relative; text-align: center; }
.productList--fullwidth ul li footer {margin-top:20px;}
.productList--fullwidth ul li header img { width: 100%; max-width: 100%; margin: 0; }
.productList--fullwidth ul li .btn { width: 100%;  }

.productListThreeWide.productList--fullwidth ul li { float: left; width: 30.666%; margin: 4% 4% 0 0; clear:none;}
.productListFourWide.productList--fullwidth ul li { float: left; width: calc(25% - 22.5px); margin: 40px 30px 0 0; clear:none;}

/*Start - Flex alignments */
.productList--fullwidth ul { display: -ms-flexbox; display: -webkit-flex;  display: flex;   -webkit-flex-wrap: nowrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } 
.productList--fullwidth ul li { display: -ms-flexbox; display: -webkit-flex;  display: flex; -webkit-flex-direction: column; -ms-flex-direction: column;  flex-direction: column;  -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap;  flex-wrap: nowrap;  }
.productList--fullwidth ul li header,
.productList--fullwidth ul li footer { display: -ms-flexbox; display: -webkit-flex;  display: flex;  -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.productList--fullwidth ul li header a {width:100%; display: block; }
.productList--fullwidth ul li header {  -webkit-align-items: flex-start;   -ms-flex-align: start;   align-items: flex-start; }
.productList--fullwidth ul li footer  { -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto;  flex: 1 1 auto; -webkit-flex-direction: column;  -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: flex-end; -ms-flex-pack: end;  justify-content: flex-end;   } 
.productList--fullwidth ul li footer > a,
.productList--fullwidth ul li footer > p {width:100%;}
/*End - Flex alignments */

@media screen and (min-width: 701px) {
.productListThreeWide.productList--fullwidth ul li:nth-child(3n+3) { margin-right: 0; clear: right; }
.productListThreeWide.productList--fullwidth ul li:nth-child(3n+1) { clear: left; }
.productListThreeWide.productList--fullwidth ul li:nth-child(-n+3) { margin-top:0; }
}

@media screen and (min-width: 1025px) {
    .productListFourWide.productList--fullwidth ul li:nth-child(4n+4) { margin-right: 0; clear: right; }
    .productListFourWide.productList--fullwidth ul li:nth-child(4n+1) { clear: left; }
    .productListFourWide.productList--fullwidth ul li:nth-child(-n+4) { margin-top:0; }
}

@media screen and (max-width: 1024px) and (min-width: 701px) {
    .productListFourWide.productList--fullwidth ul li { width: 30.666%; margin: 4% 4% 0 0; clear:none;}
    .productListFourWide.productList--fullwidth ul li:nth-child(3n+3) { margin-right: 0; clear: right; }
    .productListFourWide.productList--fullwidth ul li:nth-child(3n+1) { clear: left; }
    .productListFourWide.productList--fullwidth ul li:nth-child(-n+3) { margin-top:0; }
}

@media screen and (max-width: 700px) and (min-width: 401px) {
    .productListThreeWide.productList--fullwidth ul li,
    .productListFourWide.productList--fullwidth ul li { width: 47%; margin: 6% 6% 0 0; clear:none;}

    .productListThreeWide.productList--fullwidth ul li:nth-child(even),
    .productListFourWide.productList--fullwidth ul li:nth-child(even) { margin-right: 0; clear: right; }

    .productListThreeWide.productList--fullwidth ul li:nth-child(odd),
    .productListFourWide.productList--fullwidth ul li:nth-child(odd) { clear: left; }

    .productListThreeWide.productList--fullwidth ul li:nth-child(-n+2),
    .productListFourWide.productList--fullwidth ul li:nth-child(-n+2) { margin-top:0; }
}

@media screen and (max-width: 400px)  {
    .productListThreeWide.productList--fullwidth ul li,
    .productListFourWide.productList--fullwidth ul li { display: block; width: 100%; margin: 35px 0 0; clear:both;}
    .productListThreeWide.productList--fullwidth ul li:first-child,
    .productListFourWide.productList--fullwidth ul li:first-child { margin-top:0; }
}

/* = Product Ribbon overlay
----------------------------------------------------------------------------------------------------------------- */
.productList .ribbon  {  position: absolute; bottom: 25px; left: -10px; font-size: .9em; padding: .4em 1em; color: #fff; background: #5d5d5d; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.125);  }
.productList .ribbon--top { bottom:auto; top:25px;}
.productList .ribbon--caps { font-size: .8em; text-transform: uppercase;} 
.productList .ribbon--bold {font-weight: bold;} 
.productList .ribbon--outline { background:#fff; color:#333; border:1px solid #333;} 
.productList .ribbon--alert { background-color: #f44336;} 
.productList .ribbon--green { background-color: #4caf50;} 

.productList .ribbon:before { padding-right: 6px;}  
.productList .ribbon--star:before { content:'\e829';}  
.productList .ribbon--cross:before { content:'\e800';}  
.productList .ribbon--excl:before { content:'\e813';}  
.productList .ribbon--info:before { content:'\e817';}  

@media screen and (max-width: 600px)  {
    .productList .ribbon  { bottom: 30px;  font-size: .85em;}
    .productList .ribbon--top { bottom:auto; top:30px;}
    .productList .ribbon--caps { font-size: .75em; }
}

@media screen and (max-width: 400px)  {
    .productList .ribbon  { bottom: 35px; font-size: .9em; }
    .productList .ribbon--top { bottom:auto; top:35px;}
    .productList .ribbon--caps { font-size: .8em; }
}

/* = Product view
----------------------------------------------------------------------------------------------------------------- */
.prodImages, .prodView { display: inline-block; vertical-align: top; }
.prodImages { width: 210px; position: relative; float: left; }
.prodImages img { width: 210px; max-width: 210px; height: auto; }

.prodView { float: right; width: calc(100% - 240px); margin-bottom: 40px; }
.prodView + *,
.prodDetail { clear: both; }

.prodView .prodText > h2 { display: none; }
.prodView .prodTextSummary { margin-bottom: 35px; }

.prodDetail { margin-top: 40px; padding-top: 30px; border-top: 1px solid #efefef; }
.prodDetail p:last-child { margin-bottom: 10px; }

.prodText + .prodDetail {border:none; padding-top: 0; }

.stockList { list-style: none; margin: 1px 0 0; padding: 0; }
.stockList li { padding: 0; margin: 0; display: table; width: 100%; border-top: 1px solid #fff; border-bottom: 1px solid #e5e5e5; }
.stockList li:first-child { border-top: 1px solid #e5e5e5; }

.stockList li .prodStock { display: table-row; width: 100%; }
.stockList li .prodStock > span,
.stockList li .prodStock > p { display: table-cell; vertical-align: middle; }

.stockList li .prodStock .prodStockTitle { width: calc(100% - 360px); padding-right: 20px; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; }
.stockList li .prodStock .prodStockAvailability { display: none; width: 20%; padding-right: 20px; }
.stockList li .prodStock .prodStockPricing { width: 130px; padding-right: 15px; font-size: 16px; font-weight: 700; }
.stockList li .prodStock .previousWas { display: none; }
.stockList li .prodStock .prodStockPreviousPrice { font-weight: 600; font-size: 0.8em; text-decoration: line-through; display: block; margin-bottom: -5px; }
.stockList li .prodStock .prodStockPricing .vat { font-size: .8em; font-weight: 600; }
.stockList li .prodStock .prodStockFormat { display: none; }
.prodStockFormat { display: none; }

.stockList li .prodStock .prodStockSelection { width: 230px; text-align: right; }

/*Loader*/
.stockList li .prodStock .prodStockSelection .waitingImage { display: block; min-height: 69px; width: 131px; position: relative; float: right; }
.stockList li .prodStock .prodStockSelection .waitingImage > img { display: block; position: absolute; vertical-align: middle; top: 50%; right: 50%; margin-top: -10px; margin-right: -10px; }

.stockList li .prodStock .prodStockClassification { display: none; }
.stockList li .prodStock .prodStockSelection .btn { margin: 15px 0 15px 5px; }
.stockList li .prodStock .prodStockSelection .select { display: inline-block; display: none; vertical-align: baseline; float: none; margin-top: 15px; width: auto; }
.stockList li .prodStock.prodStockDebit .prodStockTitle { min-height: 32px; padding-left: 45px; background: url(/_img/icons/direct-debit-logo.svg) no-repeat 0 50%; }
.stockList li .prodStock.prodStockSubscription .prodStockTitle { min-height: 32px; padding-left: 45px; background: url(/_img/icons/credit-card.svg) no-repeat 0 50%; background-size:28px 19px; }


.prodStock--dropdown,
.prodStock--dropdownQty { position: relative;} 

.prodStock--dropdown:after,
.prodStock--dropdownQty:after  { content: ""; display: table; clear: both; }

.prodStock--dropdown .ps-options { float:left; width:calc(100% - 180px); }

.prodStock--dropdownQty .ps-options { float:left;   width: calc(100% - 280px); }
.prodStock--dropdownQty .ps-qty {float:left;  width:80px; margin:0 20px; }

.prodStock--dropdown .ps-title,
.prodStock--dropdownQty .ps-title { margin:0 0 10px;}

.prodStock--dropdown .ps-options .select,
.prodStock--dropdownQty .ps-options .select,
.prodStock--dropdownQty .ps-qty .select  { float:none; width:100%; }

.prodStock--dropdown .ps-options .select select,
.prodStock--dropdownQty .ps-options .select select,
.prodStock--dropdownQty .ps-qty select  {height: auto;}

.prodStock--dropdown .ps-add,
.prodStock--dropdownQty .ps-add { position: absolute; bottom:0; right:0; width: 160px; }

.ps-add .waitingImage { display: block;  min-height: 40px;}

.prodStock--dropdown .btn,
.prodStock--dropdownQty .btn { width:100%; text-align: center; }

.zeroPrice4 { display: none; }
.related-products { border-top: 1px solid #e5e5e5; margin-top: 25px; padding-top: 25px;}

.prodColours {margin:30px 0; }
.prodColours:first-child {margin-top: 0;}
.prodColours:last-child {margin-bottom: 0;}
.prodColours + .prodDetail{ margin-top: 30px; } 

.prodColours p { margin: 0 0 10px; }
.prodColours ul { margin: 0; list-style: none; }
.prodColours ul li { display: inline-block;     margin: 0 10px 0 0; }
.prodColours ul li:last-child {margin:0; }
.prodColours ul li span { width: 22px; height: 22px; border: 2px solid #fff; display: inline-block; vertical-align: top; background: #fff; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; }
.prodColours ul li span.selected {  -webkit-box-shadow: 0 0 0 2px #444;; box-shadow: 0 0 0 2px #444; }
.prodColours ul li span:hover { cursor: pointer;  -webkit-box-shadow:  0 0 0 2px #000; box-shadow:  0 0 0 2px #000; }

.prodRating { margin:30px 0;  } 
.prodRating:first-child {margin-top: 0;}
.prodRating:last-child {margin-bottom: 0;}

.rating  p {margin:0; line-height: 1; }
.rating ul { margin: 0 0 10px; list-style: none; }
.rating ul li { display: inline; }
.rating ul li span { margin-right: 5px; }

.rating .msg { margin:30px 0; display: none; }
.rating .msg:first-child {margin-top:0; }
.rating .msg:last-child {margin-bottom: 0;}

.icoStars { margin: -2px 0 0 8px; background-image: url(/_img/stars.svg); width: 100px; height: 18px; vertical-align: middle;  }
.icoStars1 { background-position: 0 -18px; }
.icoStars2 { background-position: 0 -36px; }
.icoStars3 { background-position: 0 -54px; }
.icoStars4 { background-position: 0 -72px; }
.icoStars5 { background-position: 0 -90px; }
.icoStars05 { background-position: 0 -108px; }
.icoStars15 { background-position: 0 -126px; }
.icoStars25 { background-position: 0 -144px; }
.icoStars35 { background-position: 0 -162px; }
.icoStars45 { background-position: 0 -180px; }

@media screen and (max-width: 600px) {
    .prodImages { float: none; }
}

@media screen and (min-width: 601px) and (max-width: 750px) {
    .prodStock--dropdown .ps-options { float:none; width: 100%; margin-bottom: 15px;}
    .prodStock--dropdown .ps-add {  width: 50%; position: relative; }
}

@media screen and (min-width: 901px) {
    .prodImages { width:240px}
    .prodImages img {width: 240px; max-width: 240px; }
    .prodView {   width: calc(100% - 270px); }
}

@media screen and (min-width: 961px) {
    .prodImages { width:300px}
    .prodImages img {width: 300px; max-width: 300px; }
    .prodView {   width: calc(100% - 340px); }
}

@media screen and (min-width: 1081px) {
    .prodImages { width:340px}
    .prodImages img {width: 340px; max-width: 340px; }
    .prodView {   width: calc(100% - 380px); }
}

@media screen and (min-width: 1201px) {
    .prodImages { width:350px}
    .prodImages img {width: 350px; max-width: 350px; }
    .prodView {   width: calc(100% - 390px); }
}

@media screen and (min-width: 1301px) {
    .prodImages { width:380px}
    .prodImages img {width: 380px; max-width: 380px; }
    .prodView {   width: calc(100% - 420px); }
}


@media screen and (max-width: 1024px) {
    .stockList li .prodStock .prodStockTitle { width: calc(100% - 335px); padding-right: 15px; }
    .stockList li .prodStock .prodStockAvailability { padding-right: 15px; }
    .stockList li .prodStock .prodStockPricing { width: 115px; padding-right: 15px; }
}

@media screen and (max-width: 920px) {
    .stockList li { padding: 15px 0 16px; }
    .stockList li .prodStock .prodStockSelection .btn { margin-top: 12px; margin-bottom: 2px; }

    .stockList li .prodStock { display: block; position: relative; }
    .stockList li .prodStock > span,
    .stockList li .prodStock > p { display: block; }

    .stockList li .prodStock .prodStockTitle,
    .stockList li .prodStock .prodStockAvailability,
    .stockList li .prodStock .prodStockPricing,
    .stockList li .prodStock .prodStockSelection { width: 100%; padding: 0; }

    .stockList li .prodStock .prodStockTitle,
    .stockList li .prodStock .prodStockAvailability { margin-bottom: 5px; padding-right: 100px; }
    .stockList li .prodStock .prodStockPricing { position: absolute; top: -1px; right: 0; width: auto; }
    .stockList li .prodStock .prodStockSelection .waitingImage { min-height: 53px; }
    .stockList li .prodStock .prodStockSelection .waitingImage > img { margin-top: -5px; }
}

@media screen and (max-width: 800px) {
    .stockList li .prodStock .prodStockSelection .waitingImage { min-height: 49px; }

    .prodStock--dropdownQty .ps-options { float:none; width: 100%; margin-bottom: 15px;}
    .prodStock--dropdownQty .ps-qty {float:left;  width:80px; margin:0 20px 0 0; }
    .prodStock--dropdownQty .ps-add  { width: calc(100% - 100px); }
    .ps-add .waitingImage {  min-height: 36px;}
}

@media screen and (max-width: 600px) {
    .prodView { margin: 30px 0 0; float: none; width: 100%; }
          
    .prodImages { margin: 0 auto; display: block; width: 100%; }
    .prodImages br { display: none; }
    .prodImages img { width: 380px;  max-width: 100%; height: auto; display: block; margin: 0 auto; }
    

    .prodDetail { margin-top: 30px; padding-top: 0; border-top: none; }
    .stockList li .prodStock .prodStockPreviousPrice { font-size: 0.7em; }
}

@media screen  and (max-width: 440px) {
    .prodStock--dropdown .ps-options { float:none; width: 100%; margin-bottom: 15px;}
    .prodStock--dropdown .ps-add { position: relative; width: 100%; }
}

@media screen and (max-width: 360px) {
    .stockList li .prodStock.prodStockDebit .prodStockTitle { padding-left: 35px; background-size: 25px 25px; }
    .stockList li .prodStock.prodStockSubscription .prodStockTitle {padding-left: 35px; background-size: 24px auto; } 

    .stockList li .prodStock .prodStockTitle,
    .stockList li .prodStock .prodStockAvailability { padding-right: 80px; }

    .prodStock--dropdownQty .ps-qty { width:70px;  }
    .prodStock--dropdownQty .ps-add  {   width: calc(100% - 90px); }
}

/* = Product view images with slider and lightbox zoom
----------------------------------------------------------------------------------------------------------------- */
.product-images .slider { margin: 0; padding: 0; list-style: none; }
.product-images .slider li {margin:0; }
.product-images .pi-item a { cursor: zoom-in;} 

.product-images .lSSlideOuter .pi-item { width: 100%; height: 0; padding-top: 100%; position: relative; }
.product-images .lSSlideOuter .pi-item { border: 1px solid #e5e5e5; }
.product-images .lSSlideOuter .pi-item img { padding: 20px; position: absolute; top: 0; left: 0; width: 100%; height: 100%;  object-fit: scale-down; font-family: 'object-fit: scale-down;'; }

.product-images .lSGallery { overflow: hidden; margin-bottom: 1px; }
.product-images .lSGallery a { outline: none;  display: block; width: 100%; height: 0; padding-top: 100%; overflow: hidden; border: 1px solid #e5e5e5; position: relative; }
.product-images .lSGallery .active a { border-color: #333; }
.product-images .lSGallery li { margin: 0; padding-bottom: 2px; }
.product-images .lSGallery img { position: absolute; padding: 8px; top: 0; left: 0; width: 100%; height: 100%; object-fit: scale-down; font-family: 'object-fit: scale-down;'; }

@media screen and (max-width: 400px) {
    .product-images .lSSlideOuter .pi-item img { padding: 15px; }
    .product-images .lSGallery img { padding: 6px; }
}

/* = Product favourites
----------------------------------------------------------------------------------------------------------------- */
.icon--favourite {width:34px; height: 34px; line-height: 34px; text-align: center; outline: none; font-size: 16px; color:#333; background-color: rgba(0, 0, 0, 0.1); } 
.icon--favourite:hover { color:#333; }

.icon--favourite:after { content:'\e827'; line-height: 34px; }
.icon--favourite-liked:after { content:'\e826'; line-height: 34px; } 
.icon--favourite-disabled {color:#9a9a9a; }

.icon--favourite span { display: none; position: absolute;  color: #333;  top: 100%; left: 50%;  -webkit-transform: translateX(-50%);  transform: translateX(-50%);  width: 116px; padding: 5px;  font-size: .75em;  line-height: normal;  background: #fff; border: 1px solid #ececec;  z-index: 1;  }
.icon--favourite:hover span { display: block;}

.productList .icon--favourite { position: absolute; top:0; right: 0; }
.prodImages .icon--favourite { position: absolute; top:0; right: 0; z-index: 2; }

.productList--slider .icon--favourite span,
.prodImages .icon--favourite span  {left: auto; right:10px; -webkit-transform: none; transform: none;  }

.prodImages--slides .icon--favourite {border:1px solid #e5e5e5; background-color: rgba(255, 255, 255, 0.6); }
.prodImages--slides .icon--favourite span {right:0; }

.hdr-favourites { margin:0 5px 0 15px; display: inline-block; vertical-align: middle;}
.icon--heart:before {content:'\e827'; margin: 0;  display: inline-block; vertical-align: middle;  }
.icon--heart-liked:before { content:'\e826'; } 

@media screen and (min-width: 961px), screen and (min-width: 361px) and (max-width: 600px) {
    .prodImages .icon--favourite  { width:40px; height: 40px; line-height: 40px; }
    .prodImages .icon--favourite:after {  line-height: 40px; }
}

@media screen and (max-width: 1023px) {
    .icon--favourite span { left: auto; right: 8px; font-size: .7em; -webkit-transform:none;  transform:none;  } 
}

/* = Product - featured slider
----------------------------------------------------------------------------------------------------------------- */
.productList--slider {margin:40px 0; }
.productList--slider:first-child {margin-top:0;}
.productList--slider .lSSlideOuter ul li { clear: none; margin: 0; padding: 0; }
.productList--slider ul {margin:0; }
.productList--slider .lSSlideOuter .lSPager.lSpg > li  {width:auto; float:none;}

.productList--slider  ul li { padding: 0 15px 10px; }
.productList--slider  ul li header,
.productList--slider  ul li footer {display: block;width: 100%; position: relative; text-align: center;}
.productList--slider  ul li header img { width: 100%; max-width: 100%; margin-bottom: 20px; }
.productList--slider  ul li .price { display: none; }
.productList--slider  ul li .btn { width: 100%;   }

/* = Product Related list
----------------------------------------------------------------------------------------------------------------- */
.prodRelated ul { list-style: none; margin: 0; }
.prodRelated ul li { float: left; width: 22%; margin: 0 4% 3% 0; }
.prodRelated ul li:nth-child(4n+4) { margin-right: 0; clear: right; }
.prodRelated ul li:nth-child(4n+1) { clear: left; }

.prodRelated ul li img,
.prodRelated ul li span { display: inline-block; vertical-align: middle; }
.prodRelated ul li img { width: 60px; margin-right: 15px; }
.prodRelated ul li span { width: calc(100% - 80px); }

@media screen and (max-width: 800px) {
    .prodRelated ul li:nth-child(4n+4),
    .prodRelated ul li:nth-child(4n+1) { clear: none; }
    .prodRelated ul li { float: left; width: 32%; margin: 0 2% 4% 0; }
    .prodRelated ul li:nth-child(4n+4) { margin-right: 2%; }
    .prodRelated ul li:nth-child(3n+1) { clear: left; }
    .prodRelated ul li:nth-child(3n+3) { margin-right: 0; clear: right; }
    .prodRelated ul li img { margin-right: 10px; }
}

@media screen and (max-width: 600px) {
    .prodRelated ul li:nth-child(3n+1),
    .prodRelated ul li:nth-child(3n+3) { clear: none; }
    .prodRelated ul li { float: left; width: 49%; margin: 0 2% 4% 0; }
    .prodRelated ul li:nth-child(4n+4),
    .prodRelated ul li:nth-child(3n+3) { margin-right: 2%; }
    .prodRelated ul li:nth-child(even) { margin-right: 0; clear: right; }
    .prodRelated ul li:nth-child(odd) { clear: left; }
}

@media screen and (max-width: 480px) {
    .prodRelated ul li { float: none; width: 100%; margin: 0 0 25px 0; }
    .prodRelated ul li:nth-child(4n+4),
    .prodRelated ul li:nth-child(3n+3),
    .prodRelated ul li:nth-child(even) { margin-right: 0; }
}

/* = Product Promo
----------------------------------------------------------------------------------------------------------------- */
.prodStockPromo { padding: 25px 30px; margin-bottom: 40px; text-align: left; background: #f7f7f7; border: 1px solid #e5e5e5; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-align-items: center;  -ms-flex-align: center; align-items: center; }

.prodStockPromo > div,
.prodStockPromo > span { display: inline-block; vertical-align: middle; }

.prodStockPromo .prodStockPromoForm { margin: 0 0 0 10px; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto;}
.prodStockPromo .prodStockPromoForm > div { display: -ms-flexbox; display: -webkit-flex; display: flex; } 
.prodStockPromo .prodStockPromoForm input { max-width: 175px; width:auto; height: auto;}

.prodView .prodStockPromo {margin: 30px 0; }
.prodView .prodStockPromo:first-child { margin-top: 0; }
.prodView .prodStockPromo:last-child { margin-bottom: 0; }

@media screen and (max-width: 1080px) {
    .prodView .prodStockPromo .prodStockPromoForm {margin: 0 0 0 10px;  max-width: 280px; }
    .prodView .prodStockPromo .prodStockPromoForm input[type=text] { width:auto;  min-width: 0; }
}

@media screen and (max-width: 940px) {
    .prodView .prodStockPromo .prodStockPromoForm {  max-width: 240px; }
  }

@media screen and (max-width: 850px) {
    .prodStockPromo {  display: block; }
    .prodView .prodStockPromo .prodStockPromoForm { display: block;  margin: 10px 0 0; max-width: 300px; }
}

@media screen and (max-width: 600px) {
    .prodStockPromo { padding: 30px; text-align: left; }
}

@media screen and (max-width: 400px) {
    .prodStockPromo { padding: 25px; }
}


/* = Product Comments and leave rating
----------------------------------------------------------------------------------------------------------------- */
.commentAdd .comments-label { cursor: pointer; display: block; margin: 0; width: 100%; float:none;     padding: 14px 46px 14px 16px; color:#fff; background: #333;     position: relative; } 
.commentAdd .comments-label:after {content: "\E81D";  position: absolute; right: 15px;  top: 50%; -webkit-transform: translateY(-50%);  transform: translateY(-50%);}
.commentAdd.on .comments-label:after {-webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg);}

.commentAdd .comments-box { display: block;  margin: 0; padding: 20px; width: 100%;  resize: none; }

.commentAdd .lc-box {  display: none; }
.commentAdd.on .lc-box {  display: block;  margin:25px 0 0; width:100%;}

.commentAdd .lc-box label {float:none; display: block;  width: 100%; margin: 0 0 8px; padding: 0; font-weight: bold; }

.commentAdd .formSubmit {display: none;}
.commentAdd.on .formSubmit {display: block; }
.commentAdd .formSubmit label {display: none;}

.commentAdd .leave-rating { margin:25px 0; display: none;}
.commentAdd .leave-rating label  {  width: 100%; display: block; float:none;  margin: 0 0 8px; padding: 0; font-weight: bold; }
.commentAdd .leave-rating .select { width: 100%; display: block; float:none;  }

.commentAdd.on .leave-rating {display: block;}

.leave-rating-stars {overflow: hidden;}
.stars-wrap { display: inline-block; clear:both;} 
.stars-wrap a { float:left; padding:0 4px; } 
.stars-wrap a:first-child {padding-left:0; }
.stars-wrap a:last-child {padding-right:0; }
.stars-wrap .star { display: block; font-size: 0;}

.star:after { content: '\e829';  font-size: 22px;  } 
.star--on {color:#ffc107;}

.star--on:after,
.stars-wrap:hover .star:after { content: '\e828';  }

.stars-wrap a  { color: #b0b0b0; }
.stars-wrap:hover a  { color: #ffc107; }
.stars-wrap a:hover ~ a {   color: #b0b0b0;  }
.stars-wrap:hover a:hover ~ a .star:after { content: '\e829'; } 

.commentAdd .leave-rating-stars label  {margin-bottom: 10px;}

.prodComments {margin:40px 0;}
.prodComments:first-child {margin-top: 0;}
.prodComments:last-child {margin-bottom: 0;}
.prodComments .msg {margin-top:0; }
.prodComments .msg:last-child {margin-bottom: 0;}
.prodComments .commentList .lSSlideWrapper  {background: #f6f6f6;}
.prodComments .commentList ul {list-style: none; margin:0; padding:0; text-align: center;  }

.prodComments .commentList {margin:35px 0;}
.prodComments .commentList:first-child {margin-top: 0;}
.prodComments .commentList:last-child {margin-bottom: 0;}
.prodComments .commentList .medObjs .cont {padding: 45px;}
.prodComments .commentList .medObjs .cont p { max-width: 800px; font-size: 1.25em; margin: 0 auto 15px;}
.prodComments .commentList .medObjs .cont i { color:#666; display: block; font-size: .9em; }
.prodComments .commentList .medObjs  li {margin:0; }

.prodComments .commentList .msg {margin-bottom: 0; text-align: center;}
.prodComments  .lSAction > a  {opacity: 0.15;}

.commentAdd .leave-comment  {margin:25px 0; }
.leave-comment ::-webkit-input-placeholder { color: #a9a9a9; }
.leave-comment ::-moz-placeholder { color: #a9a9a9; }
.leave-comment :-ms-input-placeholder { color: #a9a9a9; }
.leave-comment :-moz-placeholder { color: #a9a9a9; }

@media screen and (min-width: 1201px) {
.prodComments .commentList .medObjs .cont p {font-size: 1.3em; }
}

@media screen and (max-width: 600px) {
    .prodComments {margin:35px 0; }
    .prodComments .commentList .medObjs .cont p {font-size: 1.2em; }
    .prodComments .commentList .medObjs .cont i {  font-size: .8em; }

    .prodComments .lSAction > a {  opacity: 0.1;  }
}

@media screen and (max-width: 400px) {
    .prodComments {margin:30px 0; }
    .prodComments .commentList .medObjs .cont { padding: 40px 45px;  } 
    .prodComments .commentList .medObjs .cont p {font-size: 1.15em; }

    .commentAdd .comments-box { padding:15px;  }
}


/* = Checkout proccess
----------------------------------------------------------------------------------------------------------------- */
span.hasError,
textarea.hasError,
select.hasError,
.hasError input,
input.hasError { border: 1px solid red }

span.hasError { padding-left: 10px; padding-top: 5px; }

.check.hasError,
.checkbox.hasError { border: 0; padding: 0; }
.check.hasError:before,
.checkbox.hasError:before { border: 1px solid red }

.msgChoosePath { max-width: 620px; margin: 35px auto; padding: 35px 30px; }
.msgChoosePath label, .msgChoosePath em { text-align: left; }

.checkoutProgress { margin: 0 0 35px; font-size: .9em; }
.checkoutProgress li a { min-width: 100px; padding: 8px 14px; position: relative; border: 0; margin-right: 15px; height: 34px; background: #e4e4e4; font-size: 1em; color: #222; }
.checkoutProgress li a:before { margin-right: 12px; content: ''; }
.checkoutProgress li a:after { content: ''; width: 0; height: 0; border-style: solid; border-width: 17px 0 17px 18px; right: -18px; top: 0; border-color: transparent transparent transparent #e4e4e4; position: absolute; -webkit-transition: border-color .3s ease; transition: border-color .3s ease; }
.checkoutProgress li a:hover:after { border-color: transparent transparent transparent #555; }
.checkoutProgress li a.btnDisabled:hover { background: #e4e4e4; color: #222; }
.checkoutProgress li a.btnDisabled:hover:after { border-color: transparent transparent transparent #e4e4e4; }

.checkoutProgress .progressActive a,
.checkoutProgress .progressComplete a { background: #222; color: #fff; }

.checkoutProgress .progressActive a:before { margin-right: 12px; content: '\e832'; vertical-align: middle; display: inline-block; }
.checkoutProgress .progressComplete a:before { margin-right: 12px; content: '\e803'; font-size: 16px; vertical-align: middle; }

.checkoutProgress .progressActive a:after,
.checkoutProgress .progressComplete a:after { border-color: transparent transparent transparent #222; }

.checkoutProgress .progressActive a:hover:after,
.checkoutProgress .progressComplete a:hover:after { border-color: transparent transparent transparent #222; }

.colImage,
.colRemove { text-align: center; }
.colRemove .btn { width: 16px; height: 16px; padding: 0; font-size: 0; vertical-align: middle; border: 0; background: url(/_img/remove.svg) no-repeat center center; outline: none; }

.colRemove .btn:hover,
.colQty .btn:hover { background-color: transparent; }

.colTotal { text-align: right; font-weight: 600; }
.colQty { min-width: 130px; width: 130px; text-align: center; }
.colQty input { width: 40px; padding: 6px 8px; text-align: center; }
.colQty .updqtyinput { margin: 0 4px; }
.colQty .btn { width: 20px; height: 20px; padding: 0; font-size: 0; vertical-align: middle; border: 0; background: url(/_img/loading.png) no-repeat center center; opacity: 0.4; }

.colQty .btn:hover,
.colQty .btn:focus,
.colQty .btn:active { background: url(/_img/loading.png) no-repeat center center; opacity: 1; }

.colQty > .waitingImage { width: 20px; height: 20px; min-width: 0; min-height: 0; padding: 0; font-size: 0; vertical-align: middle; display: inline-block; }

.colQty .qty-down { opacity: 0.7; margin:0 5px; border:0; padding: 0; width:20px; height: 20px; background: url(/_img/icons/qty-remove.svg) no-repeat center center; font-size: 0;  cursor: pointer;  display: inline-block;vertical-align: middle;  }
.colQty .qty-up { opacity: 0.7; margin:0 5px; border:0; padding: 0; width:20px; height: 20px; background: url(/_img/icons/qty-add.svg) no-repeat center center; font-size: 0;  cursor: pointer;  display: inline-block; vertical-align: middle;  }

.colQty .qty-up:focus,
.colQty .qty-down:focus { outline: none;} 

.colQty .qty-up:hover,
.colQty .qty-down:hover { opacity: 1;} 

.checkoutBackContinue .endCol { text-align: right; }

.colsHalf.checkoutBackContinue .col { width: 49%; float: left; margin:0; margin-right: 2%; }
.colsHalf.checkoutBackContinue .endCol { margin-right: 0; }

.colsHalf.colsSummary  .col { width: 100px; } 
.colsHalf.colsSummary .endCol {width: calc(98% - 100px); } 

.moveon { min-width: 105px; }

.checkoutBackContinue .col > .waitingImage,
.moveon > .waitingImage { height: 35px; display: inline-block; vertical-align: middle; text-align: center; position: relative; width: 105px; }

.checkoutBackContinue .col > .waitingImage > img,
.moveon > .waitingImage > img { display: block; position: absolute; vertical-align: middle; top: 50%; right: 50%; margin-top: -10px; margin-right: -10px; }

.colsAddressDetails .endCol div p { margin-bottom: 30px; position: relative; }
.colsAddressDetails .endCol div p:last-child { margin-bottom: 5px; }
.colsAddressDetails .endCol div p span { position: absolute; margin: 5px 0; top: 0; left: 0; }

.colsAddressDetails  .col .formList   { display: block; padding:0;  margin: 0 0 20px; }

.survey > div { margin-bottom: 16px; }
.survey > div > label { float: none; width: 100%; display: block; padding: 0; margin: 0 0 10px; }
.survey > div > input.text, .survey > div > textarea, .survey > div > select, .survey > div > input[type=text], .survey > div > .select { float: none; width: 100%; }

.survey .formList,
.survey .radList { display: block; margin-bottom: 20px; }

.survey .formList:last-child,
.survey .radList:last-child { margin-bottom: 0; }

.survey .formList br,
.survey .radList br { display: none; }

.no-csstransforms3d .survey .formList br,
.no-csstransforms3d .survey .radList br { display: block; }

.survey .formList label,
.survey .radList label { margin: 5px 0; display: block; }
.no-csstransforms3d .survey .formList label,
.no-csstransforms3d .survey .radList label { display: inline-block; width: auto; }

.acceptTerms > div > p:last-child { margin-bottom: 0; }
.acceptTerms .checkbox { margin-left: 10px; }

.coOrderSummary tbody tr:last-child { font-weight: 600; font-size: 1.2em; }
.colHasSummary .msg:last-child { margin-bottom: 10px; }

.deliverySummaryFree { display: none; }

.coCheckoutConfirmation .coOrderSummary tbody tr:last-child { font-weight: 400; font-size: 1em; }

.coDeliveryOptions { margin-top: 35px; }
.coDeliveryAddress { margin-bottom: 35px; }

.completedOrderInfo > div { padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px dotted #ececec; }
.completedOrderInfo > div:last-child { border-bottom: 0; }
.completedOrderInfo .orderInfoTitle { display: inline-block; min-width: 175px; font-weight: 600; }

.module.coTerms { margin-bottom: 30px; }
.module.coTerms > h2 { margin-bottom: 10px; }
.module.coTerms:last-child { margin-bottom: 0; }

.coDiscount { margin-bottom: 30px; }
.coDiscount .coPromoText  {margin-bottom: 10px;}
.coDiscount .coDiscountInner .webForm { display: -ms-flexbox; display: -webkit-flex; display: flex; overflow: hidden; }
.coDiscount .coDiscountInner .webForm > div { float: left; margin: 0; }
.coDiscount .coDiscountInner .webForm > div:first-child { max-width: 250px; -webkit-flex: 1 1 auto;  -ms-flex: 1 1 auto; flex: 1 1 auto;  }
.coDiscount .coDiscountInner .webForm > div:last-child { float: right; }
.coDiscount .coDiscountInner .webForm > div:first-child input { width: 100%; height: auto; }
.coDiscount .coDiscountInner .webForm > div:last-child .btn { white-space: nowrap; }

.cols--guest-checkout { margin: 50px 0; display: flex; flex-wrap: wrap;}
.cols--guest-checkout .webForm-toggle {     display: none; width:100%; margin-top: 25px;     margin-bottom: 0; padding: 30px;  border: 1px solid #e4e4e4; background: #fff;     text-align: left;  } 
.cols--guest-checkout .webForm-toggle label {display: none;}
.cols--guest-checkout .webForm-toggle .text {width:100%;}
.cols--guest-checkout .webForm-toggle .btn {text-align: center; min-width: 140px; }
.cols--guest-checkout .btn:first-letter {text-transform: uppercase; }
.cols--guest-checkout .webForm-toggle.on { display: block;}
.cols--guest-checkout .msgAssist { background: transparent; padding:0;}

.inLoginMode ::-webkit-input-placeholder { color: #ddd; opacity:1; }
.inLoginMode ::-moz-placeholder { color: #ddd; opacity:1; }
.inLoginMode :-ms-input-placeholder { color: #ddd; opacity:1; }
.inLoginMode :-moz-placeholder { color: #ddd;  opacity:1; }

.guest-checkout-mobile { display: none;}


.checkout-items-table .basketitem-previous { font-weight: 600; font-size: 0.8em; text-decoration:line-through;}


@media screen and (min-width: 801px) {
    .cols--guest-checkout .col {     display: flex; flex-direction: column; justify-content: flex-start;   align-items: flex-start;  padding:40px; background: #f6f6f6; border: 1px solid #f0f0f0;}
    .cols--guest-checkout .col h2 {align-self: flex-start;}
    .cols--guest-checkout .col--hastoggle .btn {margin: auto 0 0;}
    .cols--guest-checkout .msgAssist {margin: 0 0 30px; min-height: 36px;}
}

@media screen and (max-width: 900px) {
    .checkoutProgress li { display: none; }
    .checkoutProgress li a { margin-right: 18px; }

    .checkoutProgress li:first-child,
    .checkoutProgress li.progressActive + li { display: inline-block; width: calc(50% - 18px); }

    .checkoutProgress li:first-child a { margin-left: 0; margin-right: 0; }

    .checkoutProgress .progressActive:first-child a:after { border-color: #222; }

    .checkoutProgress li.progressComplete:first-child a:after,
    .checkoutProgress li.progressComplete:first-child a:hover:after { border-width: 17px 18px 17px 0; border-color: transparent #222 transparent transparent; left: -18px; right: auto; }

    .checkoutProgress .progressActive + li a,
    .checkoutProgress li:first-child a { width: 100%; text-align: center; }

    .checkoutProgress .progressComplete:first-child a { margin-left: 18px; }
    .checkoutProgress .progressComplete:first-child a:before { margin-right: 5px; content: 'Back to:'; font-size: inherit; font-family: 'Open Sans', sans-serif; font-weight: 600; width: auto; line-height: normal; vertical-align: baseline; }
}

@media screen and (max-width: 800px) {
    .coOrderSummary { font-size: 1em; }
    .completedOrderInfo .orderInfoTitle { display: block; margin-bottom: 6px; }

    .goBackFromSummary { float: none; }
    .paymentButtons { margin-top: 25px; }

    .colHasSummary .tableScroll { margin-bottom: 0; }

    .guest-checkout-mobile { display: block; text-align: center;}
    .cols--guest-checkout {max-width: 400px;     margin: 40px auto 10px;   text-align: center;}
    .cols--guest-checkout .msgAssist {display: none;}
    .cols--guest-checkout .col > h2 {display: none;}
    .cols--guest-checkout .col > .btn { width:100%; }
    .cols--guest-checkout .col:first-child:after {content:'Or...'; font-weight: 600; margin-top: 30px; display: block; position: relative;}
}

@media screen and (max-width: 650px) {
    .paymentButtons,
    .goBackFromSummary { display: block; float: none;  }
    .paymentButtons { margin-top: 40px; }
}

@media screen and (max-width: 560px) {
    .colImage, .colRemove { text-align: left; }
    .colImage { margin-top: 3px; width: 45px; display: inline-block; vertical-align: top; }
    .colImage img { max-width: 35px; }
    .colItem { display: inline-block; margin-bottom: 10px; width: calc(100% - 50px); vertical-align: top; font-size: 1.1em; }
    .colItem:before { content: 'Item:'; font-weight: 600; }

    .colNet:before { content: 'Net:'; font-weight: 600; }
    .colNet { margin-left: 45px; }

    .colAvailability:before { content: 'Availability:'; font-weight: 600; }
    .colAvailability,
    .coCheckoutConfirmation .colAvailability { margin-left: 45px; margin-bottom: 10px; display: block; width: auto; }

    .colNet,
    .colVat,
    .colPrice { display: inline-block; width: 100px; margin-bottom: 10px; }

    .colPrice { margin-left: 45px; }
    .colPrice:before { content: 'Price:'; font-weight: 600; }
    .colVat:before { content: 'Vat:'; font-weight: 600; }

    .colQty { width:150px; margin: 5px 0 13px 45px; display: block; text-align: left;}
    .coCheckoutConfirmation .colQty { margin: 5px 0 13px 45px; display: block; }

    .colQty:before { content: 'Qty:'; font-weight: 600; }
    .colQty .btn { margin-left: 2px; background-size: 16px; }
    .colQty .updqtyinput { margin: 0 6px; padding: 4px; height: auto; width: 30px; }

    .colTotal,
    .coCheckoutConfirmation .colTotal { display: block; margin: 13px 0 0 45px; padding-top: 12px; padding-right: 100px; width: auto; font-size: 1.1em; text-align: left; border-top: 1px dotted #e6e6e6; }
    .colTotal:before { content: 'Total:'; font-weight: 600; }

    .colRemove,
    .coCheckoutConfirmation .colRemove { margin-left: 45px; width: auto; text-align: right; position: absolute; bottom: 20px; right: 0; z-index: 1; }
    .colRemove:before { margin-right: 5px; content: 'Remove:'; font-weight: 600; display: inline-block; vertical-align: middle; }

    .coOrderSummary tr,
    .coOrderSummary tr:nth-child(1) th { display: block; }

    .coCheckoutConfirmation .coOrderSummary tr:first-child { display: none; }

    .coOrderSummary thead tr { padding: 0; }
    .coOrderSummary tbody tr { padding: 12px 8px; margin: 0; }

    .coOrderSummary tr td { width: 49%; display: inline-block; }
    .coOrderSummary tr td:last-child { text-align: right; }
    .coCheckoutConfirmation .coOrderSummary tr td:last-child { text-align: left; }
    .coCheckoutConfirmation .coOrderSummary tr td.colImage { width: 45px; }
    .coCheckoutConfirmation .coOrderSummary tr td.colItem { width: calc(100% - 50px); }

    .coCheckoutConfirmation .coOrderSummary tbody tr { padding: 0 0 20px 0; margin-bottom: 20px; }
    .coCheckoutConfirmation .coOrderSummary tbody tr:last-child { margin-bottom: 0; }

    .coCheckoutConfirmation .colNet,
    .coCheckoutConfirmation .colVat,
    .coCheckoutConfirmation .colPrice { display: inline-block; width: 100px; margin-bottom: 10px; }

    .no-csstransforms3d .colImage,
    .no-csstransforms3d .colItem { margin-top: 20px; }
    .no-csstransforms3d .colQty,
    .no-csstransforms3d .colTotal { clear: both; }
    .no-csstransforms3d .colTotal { margin-bottom: 20px; width: calc(100% - 45px); }
    .no-csstransforms3d .colRemove,
    .no-csstransforms3d .coCheckoutConfirmation .colRemove { position: relative; clear: both; bottom: 0; margin-bottom: 25px; float: right; }
}

@media screen and (max-width: 560px) {
    .colQty > .waitingImage { margin-left: 2px; width: 20px; height: 20px; }
    .colQty > .waitingImage > img { width: 16px; height: 16px; margin-top: -8px; margin-right: -8px; }
}

@media screen and (max-width: 480px) {
    .checkoutProgress { margin-bottom: 30px; }

    .colsHalf.checkoutBackContinue .col,
    .colsHalf.checkoutBackContinue .endCol { float: none; width: 100%; margin-bottom: 25px; text-align: left; }
    .colsHalf.checkoutBackContinue .endCol { margin-bottom: 0; }
    .colsHalf.checkoutBackContinue .btn { display: block; width: 100%; text-align: center; }

    .checkoutBackContinue .col > span,
    .moveon > span { display: block; width: 100%; }

    .coDeliveryOptions { margin-top: 30px; }
    .coDeliveryAddress { margin-bottom: 30px; }

    .colHasSummary .tableScroll { margin-bottom: 5px; }
    .colsHalf.checkoutBackContinue .waitingImage { width: 100%; }

    .survey > div { margin-bottom: 12px; }
}

@media screen and (max-width: 380px) {
    .checkoutProgress { margin-bottom: 25px; }

    .cols--guest-checkout .webForm-toggle { padding: 25px; } 
}

@media screen and (max-width: 360px) {
    .checkoutProgress li a { padding: 8px 10px; }
    .acceptTerms p { padding-right: 45px; position: relative; }
    .acceptTerms > div { font-size:14px; padding-right: 45px; position: relative; }
    .acceptTerms .checkbox { position: absolute; top: 0; right: 0; margin: 0; }
}

/* = Checkout > Direct Debit route
----------------------------------------------------------------------------------------------------------------- */
.directDebitWrap br { display: none; }
.ddColumnFull { margin: 35px 0; padding: 35px 30px; background: #f8f8f8; border: 1px solid #e6e6e6; }

.ddColumnFull.ddConfirm { margin-top: 0; }

.ddAddresAboutWrap .ddLeftCol { width: 57.5%; margin-right: 2.5%; float: left; padding: 35px 30px; background: #f8f8f8; border: 1px solid #e6e6e6; }
.ddAddresAboutWrap .ddRightCol { width: 40%; float: left; padding: 35px 30px; background: #f8f8f8; border: 1px solid #e6e6e6; }

.ddAddresAboutWrap .ddRightCol input,
.ddAddresAboutWrap .ddRightCol .select,
.ddAddresAboutWrap .ddRightCol textarea { width: 100%; float: none; }
.ddAddresAboutWrap .ddRightCol .ddAnswer { position: relative; }

.ddAnswer .survey > div > label,
.ddAssociation label,
.ddAddress label,
.ddGift label { font-weight: 600; }

.ddGift { margin-top: 35px; position: relative; }
.ddGift .giftCheckbox, .accountHolderConfirm { padding-left: 0; position: relative; margin-bottom: 20px; }
.ddGift .checkbox,
.accountHolderConfirm .checkbox { position: absolute; margin: 2px 0; top: 0; left: 0; }
.accountHolderConfirm { margin: 30px 0 5px; font-weight: 600; }
.accountHolderConfirm .checkbox { margin-top: 0; }
.ddGift h2 { margin-bottom: 15px; }

.ddAssocBulWrap,
.ddEnter, .ddConfirm { position: relative; }
.ddEnter > h3 { font-size: 160%; margin: 26px 0 24px; }
.ddAssocBulWrap .ddAssociation { float: left; width: 48%; margin-bottom: 30px; margin-right: 4%; }
.ddAssocBulWrap .ddBuilding { float: right; width: 48%; }
.ddAssocBulWrap .ddBuilding h3 { font-size: 130%; }

/* .ddEnter .ddLogo, */
.ddConfirm .ddLogo { position: absolute; top: 35px; right: 30px; }
.ddAssociation label,
.ddBuilding label,
.ddAssociation input,
.ddBuilding input { width: 100%; float: none; display: block; }

.ddBuilding h3 { margin-bottom: 0; }
.ddBuilding p { margin-bottom: 20px; }
.ddAssociation br { display: none; }

.ddGuarantee { margin: 35px 0; padding: 35px 30px; border: 5px solid #555; position: relative; }

.ddEnter .ddLogo,
.ddGuarantee .ddLogo { position: absolute; top: 35px; right: 30px; }

.ddAssociation .sortcode { width: 50px; float: left; margin-right: 5px; text-align: center; }

.checkbox--abs { position: relative; padding-left: 34px; }
.checkbox--abs span { position: absolute; top: 1px; left: 0; margin: 0; }

.banksBuildWarn { margin: 35px 0; }
.ddPrint a { text-decoration: underline; }

.webForm .pcSearchButtons,
.webForm .pcSearchButtons:last-child { margin-bottom: 15px; vertical-align: middle; }
.webForm .pcSearchButtons .waitingImage { vertical-align: middle; min-width: 88px; min-height: 36px; }

.btnDDReset { margin-right: 15px; }

@media screen and (max-width: 960px) {
    .ddAddresAboutWrap .ddLeftCol,
    .ddAddresAboutWrap .ddRightCol { width: 100%; float: none; }
    .ddAddresAboutWrap .ddRightCol { margin-top: 35px; }

    .ddEnter .ddLogo { max-width: 140px; float: none; position: relative; top: 0; left: 0; }
}

@media screen and (max-width: 800px) {
    .banksBuildWarn { margin-top: 20px; }
    .ddAssociation input { margin-bottom: 12px; }

    .ddColumnFull p:last-child { margin-bottom: 0; }

    .pcSearchButtons > label { display: none; }
    .webForm .pcSearchButtons .waitingImage { min-width: 84px; min-height: 32px; }
}

@media screen and (max-width: 750px) {
    .ddAssocBulWrap .ddAssociation,
    .ddAssocBulWrap .ddBuilding { float: none; width: 100%; margin-bottom: 30px; margin-right: 0; }

    .ddGuarantee .ddLogo { max-width: 140px; float: none; position: relative; top: 0; left: 0; }
}

@media screen and (max-width: 600px) {
    /*.ddEnter .ddLogo { max-width: 120px; } */
    .ddConfirm .ddLogo { max-width: 120px; float: none; position: relative; top: 0; left: 0; }
}

@media screen and (max-width: 480px) {
    .ddColumnFull { margin: 30px 0; padding: 32px 25px; }

    .ddGuarantee { margin: 30px 0 15px; padding: 32px 25px; }

    .ddAddresAboutWrap .ddLeftCol,
    .ddAddresAboutWrap .ddRightCol { padding: 32px 25px; }
    .ddAddresAboutWrap .ddRightCol { margin-top: 30px; }

    /*.ddEnter .ddLogo { float: none; position: relative; top: 0; left: 0; }*/

    .ddAnswer .acceptTerms p { position: relative; padding-left: 36px; padding-right: 0; }
    .ddAnswer .acceptTerms p .checkbox { position: absolute; top: 0; left: 0; right: auto; margin: 0; }
}

@media screen and (max-width: 420px) {
    .pcSearchButtons .btn { width: 100%; }
    .webForm .pcSearchButtons .waitingImage { min-height: 35px; min-width: 100%; }
}

@media screen and (max-width: 380px) {
    .ddColumnFull { margin: 25px 0; padding: 30px 20px; }

    .ddAddresAboutWrap .ddLeftCol,
    .ddAddresAboutWrap .ddRightCol,
    .ddGuarantee { padding: 30px 20px; }
    .ddGuarantee { margin-top: 25px; }

    .ddAddresAboutWrap .ddRightCol { margin-top: 25px; }
}

/* = Checkout > Upgrade options
----------------------------------------------------------------------------------------------------------------- */
.upgrade-options {margin-bottom:40px}
.upgrade-options:last-child {margin-bottom:0; }

.upgrade-option {margin-bottom: 35px;}
.upgrade-option:last-child {margin-bottom: 0;}

.upgrade-from {margin-bottom: 30px;}

.upgrade-image { float:left; width: 210px; margin-right: 30px; position: relative; }
.upgrade-image img { width: 100%; height: auto; }

.upgrade-detail { float: left; width: calc(100% - 470px);  }

.upgrade-actions {float: right; width: 200px; margin-left: 30px; }
.upgrade-actions .btn {min-width: 100%; max-width: 200px; text-align: center;}
.upgrade-price { margin-bottom: 15px; padding: 8px 20px;  font-size: 1em;  text-align: center; }

    @media screen and (max-width: 900px) {
        .upgrade-detail { width: calc(100% - 240px); }
        .upgrade-actions { width: calc(100% - 240px); margin: 0; }
    }

    @media screen and (max-width: 800px) {
        .upgrade-price { padding: 6px 18px; }
    }

    @media screen and (max-width: 600px) {
        .upgrade-image { width: 150px; margin-right: 20px; }
        .upgrade-detail { width: calc(100% - 170px); }
        .upgrade-actions { width: calc(100% - 170px);  }
    }

    @media screen and (max-width: 400px) {
        .upgrade-image { float:none; width:100%; margin: 0 0 25px; }
        .upgrade-detail { float:none; width:100%; margin: 0 0 25px; }
        .upgrade-actions { float:none; width:100%; margin: 0;  }
    }

/* = User area > enter address manually
----------------------------------------------------------------------------------------------------------------- */
.enter-address-manually {
    margin: 30px 0 0;
}

.enter-address-manually input,
.btn--edit-address{ margin-left:25%; }

@media screen and (max-width: 1080px) {
    .enter-address-manually input { margin-left: 0;}
    .btn--edit-address  { margin:10px 0 0; }

    .pcSearchButtons label:first-child { display: none; }
}


/* = User area > my account
----------------------------------------------------------------------------------------------------------------- */
.myAccount {margin:0 auto; padding:40px; max-width:800px; background:#f7f7f7;}
.myAccount .webForm { margin-bottom:30px; }
.myAccount--details label { margin:0 0 10px; display:inline-block; min-width:250px; font-weight:bold;  }
.myAccount--details span {   margin:0 0 10px; display: inline-block;   }
.myAccount--details .btn {margin:10px 0 0;}
@media screen and (max-width: 650px) {
    .myAccount--details label { min-width:200px;  }
}
@media screen and (max-width: 540px) {
    .myAccount {padding:30px; }
    .myAccount--details  br {display:none;}
    .myAccount--details label { display:block; margin:0 0 2px;   }
    .myAccount--details span {   display: block;  margin:0 0 14px; min-height:20px;    }
}	
	
	
/* = User area > previous orders
----------------------------------------------------------------------------------------------------------------- */
.subWrap { margin: 30px 0; padding-bottom: 30px; border-bottom: 1px dotted #e4e4e4; overflow: hidden; }
.subWrap:last-child { margin-bottom: 0; border: 0; }
.subWrap br { display: none; }

.mysubsOrder { margin: 0; }
.mysubsOrder > .col { width: 120px; display: inline-block; vertical-align: top; }
.mysubsOrder > .col > img { max-width: 105px; }
.mysubsOrder > .endCol { width: calc(100% - 130px); float: right; }

.mysubsOrder .col .colsTwoOne { margin-bottom: 0; }
.mysubsOrder .col .colsTwoOne > .col { width: calc(100% - 340px); display: inline-block; vertical-align: top; }
.mysubsOrder .col .colsTwoOne > .endCol { width: 330px; float: right; text-align: right; }
.mysubsOrder .col .colsTwoOne > .endCol .emptyLabel label { display: none; }

.mysubsOrder .col .colsTwoOne > .col:first-child label { min-width: 110px; }
.mysubsOrder .col .colsTwoOne .webForm div { margin: 0; }
.mysubsOrder .col .colsTwoOne .webForm div label { padding: 6px 0; font-weight: 600; }
.mysubsOrder .col .colsTwoOne .webForm div em { margin-top: 0; padding: 6px 0; }
.mysubsOrder .col .colsTwoOne .webForm div:first-child label,
.mysubsOrder .col .colsTwoOne .webForm div:first-child em { padding-top: 0; }
.mysubsOrder .col .colsTwoOne > .endCol .renewal label { padding: 10px 0; width: auto; }
.mysubsOrder .col .colsTwoOne .webForm .renewal + .renewal--option { margin-top: 25px; }
.mysubsOrder .col .colsTwoOne .webForm .renewal-price { margin: 0 0 10px; }
.renewal--optionStock h6 { margin-bottom: 5px; }

.mysubsOrder .col .colsTwoOne .webForm .renewal { margin-bottom: 15px; }
.mysubsOrder .col .colsTwoOne .webForm .renewal:last-child { margin-bottom: 0; }
.mysubsOrder .col .colsTwoOne .webForm .renewal .btn { min-width: 192px; }

.promoCode.mysubPromo { margin: 25px 0 0; }
.promoCode.mysubPromo div label { width: 250px; float: left; padding: 10px 0; }
.promoCode.mysubPromo div input.text { width: calc(100% - 345px); float: left; }
.promoCode.mysubPromo div input.btn { float: right; }

@media screen and (max-width: 800px) {
    .mysubsOrder .col .colsTwoOne .webForm div label,
    .mysubsOrder .col .colsTwoOne .webForm div em { padding: 0 0 5px; margin-bottom: 0; }
    .mysubsOrder .col .colsTwoOne > .col { width: calc(100% - 250px); }
    .mysubsOrder .col .colsTwoOne > .endCol { width: 240px; }
    .mysubsOrder .col .colsTwoOne > .endCol .renewal label { display: block; margin-bottom: 10px; }

    .promoCode.mysubPromo div label { padding: 8px 0; }
}

@media screen and (max-width: 600px) {
    .promoCode.mysubPromo { width: 100%; }
    .promoCode.mysubPromo div label { width: 100%; float: none; padding: 0 0 10px; display: block; }
    .promoCode.mysubPromo div input.text { width: calc(100% - 100px); float: left; }
    .mysubsOrder .col .colsTwoOne .webForm .renewal .btn { min-width: 0; }
}

@media screen and (max-width: 520px) {
    .mysubsOrder .col .colsTwoOne > .col { width: 100%; }
    .mysubsOrder .col .colsTwoOne > .endCol { margin-top: 10px; width: 100%; text-align: left; }
}

@media screen and (max-width: 480px) {
    .mysubsOrder > .col { width: 100px; }
    .mysubsOrder > .col > img { max-width: 80px; }
    .mysubsOrder > .endCol { width: calc(100% - 100px); }

    .subWrap:last-child { padding-bottom: 15px; }
}

@media screen and (max-width: 420px) {
    .mysubsOrder > .col { width: 70px; }
    .mysubsOrder > .col > img { max-width: 100%; }
    .mysubsOrder > .endCol { width: calc(100% - 90px); }
}

@media screen and (max-width: 380px) {
    .mysubsOrder > .col { width: 50px; }
    .mysubsOrder > .col > img { max-width: 100%; }
    .mysubsOrder > .endCol { width: calc(100% - 65px); }
}

@media screen and (max-width: 360px) {
    .mysubsOrder .col .colsTwoOne > .endCol .btn { padding: 6px 14px; }
}

@media screen and (max-width: 330px) {
    .mysubsOrder .col .colsTwoOne > .endCol .btn { font-size: .95em; text-align: center; }
}

/* = Payment request summary block
----------------------------------------------------------------------------------------------------------------- */
.payment-request-summary { margin:25px 0; padding:25px; background-color: #fdfdfd;   border: 5px solid #d9d9d9; }
.payment-request-summary:last-child {margin-bottom: 0;}
.payment-request-summary p { font-size: 1.15em; margin: 0 0 10px; }
.payment-request-summary p b {display: inline-block; min-width: 175px;}
.payment-request-summary p:last-child {margin-bottom: 0;}

@media screen and (max-width: 480px) {
    .payment-request-summary { margin:25px 0; padding:20px;  }
    .payment-request-summary p { font-size: 1.05em; margin: 0 0 8px; }
    .payment-request-summary p b { min-width: 170px;}
}

@media screen and (max-width: 400px) {
    .payment-request-summary p { margin: 0 0 10px; }
    .payment-request-summary p b { display: block; margin:0 0 2px;}
}

/* = Book and iframe embeds
----------------------------------------------------------------------------------------------------------------- */
.issuuembed, iframe { max-width: 100%; }

/* = Cookie
----------------------------------------------------------------------------------------------------------------- */
.cookie { display: none; padding: 30px 0 0; color: #fff; text-align: left; font-size: 0.9em; }
.cookie .container { background: #444; padding: 15px 20px; }
.cookie p { margin: 0; }
.cookie p a { color: #fff; text-decoration: underline; font-weight: 600; }
.cookie p .btn,
.cookie .btn { padding: 4px 14px; text-decoration: none; }

@media screen and (max-width: 1060px) {
    .cookie { text-align: left; }
}

@media screen and (max-width: 600px) {
    .cookie { padding-top: 50px; margin-bottom: -10px; }
}

@media screen and (max-width: 480px) {
    .cookie { padding-top: 45px; margin-bottom: -15px; }
}

@media screen and (max-width: 360px) {
    .cookie { padding-top: 40px; }
}

/* = Clearing
----------------------------------------------------------------------------------------------------------------- */
.clearFix,
.container, .cols, .progress, .logo-actions-wrap, .productList ul, .zoneOne, .webForm > div, .survey > div, .templateTwo, .templateTwo5050, .mysubsOrder, .mysubsOrder .col .colsTwoOne, .ddAddresAboutWrap, .ddAssocBulWrap, .webForm div, .prodRelated ul { zoom: 1; }

.clearFix:after,
.container:after, .cols:after, .progress:after, .logo-actions-wrap:after, .productList ul:after, .zoneOne:after, .webForm > div:after, .survey > div:after, .templateTwo:after, .templateTwo5050:after, .mysubsOrder:after, .mysubsOrder .col .colsTwoOne:after, .ddAddresAboutWrap:after, .ddAssocBulWrap:after, .webForm div:after, .prodRelated ul:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; overflow: hidden; }
.webForm div:after { visibility: visible; }

/* = Captcha
----------------------------------------------------------------------------------------------------------------- */
.captcha-container { margin-bottom: 32px; }

/* = Footer Payment Icons
------------------------------------------------------------------------------------------------------------------ */
.paymentCardIcons {
    margin: 0 2% 0 0;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    width: 74%;
}

.paymentCardIcons .inline {
    margin-bottom: 0;
}

.paymentCardIcons ul li {
    margin: 0 15px 15px 0;
    display: inline-block;
}


/* = Form IP Range selector*/

.ip-range-wrap {
    margin:35px 0;
}

.ip-range-wrap:first-child {
    margin-top: 0;
} 

.ip-range-wrap:last-child {
    margin-bottom: 0;
} 

.ip-range {
    margin:32px 0;
}

.ip-range:first-child {
    margin-top: 0;
} 

.ip-range:last-child {
    margin-bottom: 0;
} 

h1 + .ip-range { margin-top: 15px; }
h2 + .ip-range { margin-top: 15px; }
h3 + .ip-range { margin-top: 15px; }

.ip-input {
    display: flex;
}

.ip-input input {
    max-width: 70px;
    height: auto;
    text-align: center;
}

.ip-input .ip-dot {
    display: flex;
    align-items: center;
    margin: 0 5px;
    font-weight: bold;
    font-size: 1.1rem;
}

.ip-range .add-ip-range  {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin: 0 12px;
}


.add-ip-range label {
    width: auto;
    white-space: nowrap;
    font-size: 12px;
    padding:0;
    margin:0;
}

.add-ip-range input {
    margin: 5px 10px;
}

.ip-range .ip-row-add-remove {
    margin-top: 28px;
}

.ip-row-add-remove .btn + .btn {
    margin-left: 12px;
}

.ip-row-add-remove .btn {
    text-align: center;
    min-width: 130px;
}

.range-input-box:before {
    content:'\2013';
    margin-right:5px;
}

.ip-input .range-input-box {
    width: 100%;
    margin-left: 10px;
}

.IpErrorMessage {
    padding: 5px 10px;
    border: 2px solid #e93939;
    color: #e93939;
    font-weight: bold;
    font-size: 14px;
}

@media screen and (max-width: 600px) {
    .ip-input input {
        max-width: 50px;
        padding: 5px;
    }

    .add-ip-range label {
        font-size: 11px;
    }

    .IpErrorMessage {
        font-size: 13px;
    }
    
}


@media screen and (max-width: 400px) {
    .ip-input input {
        max-width: 45px;
        padding: 4px;
        font-size: 14px;
    }

    .ip-row-add-remove .btn {
        text-align: center;
        min-width: 120px;
    } 

}