/* Minification failed. Returning unminified contents.
(71,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(72,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(73,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(74,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(75,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(76,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(77,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(78,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(79,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(80,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(81,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(271,17): run-time error CSS1039: Token not allowed after unary operator: '-c-dark-gray'
(278,32): run-time error CSS1039: Token not allowed after unary operator: '-ico-xmark'
(294,36): run-time error CSS1039: Token not allowed after unary operator: '-ico-checkmark'
(306,28): run-time error CSS1039: Token not allowed after unary operator: '-ico-link-external'
(348,22): run-time error CSS1039: Token not allowed after unary operator: '-c-green'
(352,22): run-time error CSS1039: Token not allowed after unary operator: '-c-dark-gray'
(357,22): run-time error CSS1039: Token not allowed after unary operator: '-c-dark-gray'
(361,22): run-time error CSS1039: Token not allowed after unary operator: '-c-orange'
(365,17): run-time error CSS1039: Token not allowed after unary operator: '-c-green'
(369,17): run-time error CSS1039: Token not allowed after unary operator: '-c-dark-gray'
(374,17): run-time error CSS1039: Token not allowed after unary operator: '-c-dark-gray'
(379,17): run-time error CSS1039: Token not allowed after unary operator: '-c-orange'
(401,23): run-time error CSS1039: Token not allowed after unary operator: '-ico-arrow-down'
(425,28): run-time error CSS1039: Token not allowed after unary operator: '-c-white'
(426,28): run-time error CSS1039: Token not allowed after unary operator: '-c-gray'
(430,17): run-time error CSS1039: Token not allowed after unary operator: '-c-black'
(437,21): run-time error CSS1030: Expected identifier, found '~'
(437,39): run-time error CSS1031: Expected selector, found ')'
(437,39): run-time error CSS1025: Expected comma or open brace, found ')'
(442,23): run-time error CSS1039: Token not allowed after unary operator: '-ico-arrow-up'
(499,27): run-time error CSS1039: Token not allowed after unary operator: '-ico-arrow-down'
(503,23): run-time error CSS1039: Token not allowed after unary operator: '-ico-arrow-up'
(587,17): run-time error CSS1039: Token not allowed after unary operator: '-c-green'
*/
/**
* Featherlight - ultra slim jQuery lightbox
* Version 1.7.13 - http://noelboss.github.io/featherlight/
*
* Copyright 2018, Noël Raoul Bossart (http://www.noelboss.com)
* MIT Licensed.
**/
html.with-featherlight{overflow:hidden}.featherlight{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483647;text-align:center;white-space:nowrap;cursor:pointer;background:#333;background:rgba(0,0,0,0)}.featherlight:last-of-type{background:rgba(0,0,0,.8)}.featherlight:before{content:'';display:inline-block;height:100%;vertical-align:middle}.featherlight .featherlight-content{position:relative;text-align:left;vertical-align:middle;display:inline-block;overflow:auto;padding:25px 25px 0;border-bottom:25px solid transparent;margin-left:5%;margin-right:5%;max-height:95%;background:#fff;cursor:auto;white-space:normal}.featherlight .featherlight-inner{display:block}.featherlight link.featherlight-inner,.featherlight script.featherlight-inner,.featherlight style.featherlight-inner{display:none}.featherlight .featherlight-close-icon{position:absolute;z-index:9999;top:0;right:0;line-height:25px;width:25px;cursor:pointer;text-align:center;font-family:Arial,sans-serif;background:#fff;background:rgba(255,255,255,.3);color:#000;border:0;padding:0}.featherlight .featherlight-close-icon::-moz-focus-inner{border:0;padding:0}.featherlight .featherlight-image{width:100%}.featherlight-iframe .featherlight-content{border-bottom:0;padding:0;-webkit-overflow-scrolling:touch}.featherlight iframe{border:0}.featherlight *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}@media only screen and (max-width:1024px){.featherlight .featherlight-content{margin-left:0;margin-right:0;max-height:98%;padding:10px 10px 0;border-bottom:10px solid transparent}}@media print{html.with-featherlight>*>:not(.featherlight){display:none}}
/**
* Featherlight Gallery – an extension for the ultra slim jQuery lightbox
* Version 1.7.13 - http://noelboss.github.io/featherlight/
*
* Copyright 2018, Noël Raoul Bossart (http://www.noelboss.com)
* MIT Licensed.
**/
.featherlight-next,.featherlight-previous{display:block;position:absolute;top:25px;right:25px;bottom:0;left:80%;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background:rgba(0,0,0,0)}.featherlight-previous{left:25px;right:80%}.featherlight-next:hover,.featherlight-previous:hover{background:rgba(255,255,255,.25)}.featherlight-next span,.featherlight-previous span{display:none;position:absolute;top:50%;left:5%;width:82%;text-align:center;font-size:80px;line-height:80px;margin-top:-40px;text-shadow:0 0 5px #fff;color:#fff;font-style:normal;font-weight:400}.featherlight-next span{right:5%;left:auto}.featherlight-next:hover span,.featherlight-previous:hover span{display:inline-block}.featherlight-first-slide.featherlight-last-slide .featherlight-next,.featherlight-first-slide.featherlight-last-slide .featherlight-previous,.featherlight-loading .featherlight-next,.featherlight-loading .featherlight-previous,.featherlight-swipe-aware .featherlight-next,.featherlight-swipe-aware .featherlight-previous{display:none}@media only screen and (max-device-width:1024px){.featherlight-next:hover,.featherlight-previous:hover{background:0 0}.featherlight-next span,.featherlight-previous span{display:block}}@media only screen and (max-width:1024px){.featherlight-next,.featherlight-previous{top:10px;right:10px;left:85%}.featherlight-previous{left:10px;right:85%}.featherlight-next span,.featherlight-previous span{margin-top:-30px;font-size:40px}}
/*
* easy-autocomplete
* jQuery plugin for autocompletion
*
* @author Łukasz Pawełczak (http://github.com/pawelczak)
* @version 1.3.5
* Copyright License:
*/
.easy-autocomplete{position:relative}.easy-autocomplete input{border-color:#ccc;border-radius:4px;border-style:solid;border-width:1px;box-shadow:0 1px 2px rgba(0,0,0,0.1) inset;color:#555;float:none;padding:6px 12px}.easy-autocomplete input:hover,.easy-autocomplete input:focus{box-shadow:none}.easy-autocomplete a{display:block}.easy-autocomplete.eac-blue-light input:hover,.easy-autocomplete.eac-blue-light input:focus{border-color:#66afe9;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(102,175,233,0.6)}.easy-autocomplete.eac-blue-light ul{border-color:#66afe9;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(102,175,233,0.6)}.easy-autocomplete.eac-blue-light ul li,.easy-autocomplete.eac-blue-light ul .eac-category{border-color:#66afe9}.easy-autocomplete.eac-blue-light ul li.selected,.easy-autocomplete.eac-blue-light ul .eac-category.selected{background-color:#ecf5fc}.easy-autocomplete.eac-green-light input:hover,.easy-autocomplete.eac-green-light input:focus{border-color:#41DB00;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(146,237,107,0.6)}.easy-autocomplete.eac-green-light ul{border-color:#41DB00;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(146,237,107,0.6)}.easy-autocomplete.eac-green-light ul li,.easy-autocomplete.eac-green-light ul .eac-category{border-color:#41DB00}.easy-autocomplete.eac-green-light ul li.selected,.easy-autocomplete.eac-green-light ul .eac-category.selected{background-color:#9eff75}.easy-autocomplete.eac-red-light input:hover,.easy-autocomplete.eac-red-light input:focus{border-color:#ff5b5b;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(255,90,90,0.6)}.easy-autocomplete.eac-red-light ul{border-color:#ff5b5b;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(255,90,90,0.6)}.easy-autocomplete.eac-red-light ul li,.easy-autocomplete.eac-red-light ul .eac-category{border-color:#ff5b5b}.easy-autocomplete.eac-red-light ul li.selected,.easy-autocomplete.eac-red-light ul .eac-category.selected{background-color:#ff8e8e}.easy-autocomplete.eac-yellow-light input:hover,.easy-autocomplete.eac-yellow-light input:focus{border-color:#ffdb00;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(255,231,84,0.6)}.easy-autocomplete.eac-yellow-light ul{border-color:#ffdb00;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(255,231,84,0.6)}.easy-autocomplete.eac-yellow-light ul li,.easy-autocomplete.eac-yellow-light ul .eac-category{border-color:#ffdb00}.easy-autocomplete.eac-yellow-light ul li.selected,.easy-autocomplete.eac-yellow-light ul .eac-category.selected{background-color:#ffe233}.easy-autocomplete.eac-dark-light input:hover,.easy-autocomplete.eac-dark-light input:focus{border-color:#333;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(55,55,55,0.6)}.easy-autocomplete.eac-dark-light ul{border-color:#333;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(55,55,55,0.6)}.easy-autocomplete.eac-dark-light ul li,.easy-autocomplete.eac-dark-light ul .eac-category{border-color:#333}.easy-autocomplete.eac-dark-light ul li.selected,.easy-autocomplete.eac-dark-light ul .eac-category.selected{background-color:#4d4d4d;color:#fff}.easy-autocomplete.eac-dark{color:#fff}.easy-autocomplete.eac-dark input{background-color:#404040;border-radius:4px;box-shadow:0;color:#f6f6f6}.easy-autocomplete.eac-dark input:hover,.easy-autocomplete.eac-dark input:focus{border-color:#333;box-shadow:0}.easy-autocomplete.eac-dark ul{border-color:#333}.easy-autocomplete.eac-dark ul li,.easy-autocomplete.eac-dark ul .eac-category{background-color:#404040;border-color:#333}.easy-autocomplete.eac-dark ul li.selected,.easy-autocomplete.eac-dark ul .eac-category.selected{background-color:#737373;color:#f6f6f6}.easy-autocomplete.eac-dark-glass{color:#fff}.easy-autocomplete.eac-dark-glass input{background-color:rgba(0,0,0,0.8);border-radius:4px;box-shadow:0;color:#f6f6f6}.easy-autocomplete.eac-dark-glass input:hover,.easy-autocomplete.eac-dark-glass input:focus{border-color:rgba(0,0,0,0.8);box-shadow:0}.easy-autocomplete.eac-dark-glass ul{border-color:rgba(0,0,0,0.8)}.easy-autocomplete.eac-dark-glass ul li,.easy-autocomplete.eac-dark-glass ul .eac-category{background-color:rgba(0,0,0,0.8);border-color:rgba(0,0,0,0.8)}.easy-autocomplete.eac-dark-glass ul li.selected,.easy-autocomplete.eac-dark-glass ul .eac-category.selected{background-color:rgba(64,64,64,0.8);color:#f6f6f6}.easy-autocomplete.eac-dark-glass ul li:last-child,.easy-autocomplete.eac-dark-glass ul .eac-category:last-child{border-radius:0 0 4px 4px}.easy-autocomplete.eac-blue{color:#fff}.easy-autocomplete.eac-blue input{background-color:#6d9ed1;border-radius:4px;box-shadow:0;color:#f6f6f6}.easy-autocomplete.eac-blue input::-webkit-input-placeholder{color:#f6f6f6}.easy-autocomplete.eac-blue input:-moz-placeholder{color:#f6f6f6}.easy-autocomplete.eac-blue input::-moz-placeholder{color:#f6f6f6}.easy-autocomplete.eac-blue input:-ms-input-placeholder{color:#f6f6f6}.easy-autocomplete.eac-blue input:hover,.easy-autocomplete.eac-blue input:focus{border-color:#5A91CB;box-shadow:0}.easy-autocomplete.eac-blue ul{border-color:#5A91CB}.easy-autocomplete.eac-blue ul li,.easy-autocomplete.eac-blue ul .eac-category{background-color:#6d9ed1;border-color:#5A91CB}.easy-autocomplete.eac-blue ul li.selected,.easy-autocomplete.eac-blue ul .eac-category.selected{background-color:#94b8dd;color:#f6f6f6}.easy-autocomplete.eac-yellow{color:#333}.easy-autocomplete.eac-yellow input{background-color:#ffdb7e;border-color:#333;border-radius:4px;box-shadow:0;color:#333}.easy-autocomplete.eac-yellow input:hover,.easy-autocomplete.eac-yellow input:focus{border-color:#333;box-shadow:0}.easy-autocomplete.eac-yellow ul{border-color:#333}.easy-autocomplete.eac-yellow ul li,.easy-autocomplete.eac-yellow ul .eac-category{background-color:#ffdb7e;border-color:#333}.easy-autocomplete.eac-yellow ul li.selected,.easy-autocomplete.eac-yellow ul .eac-category.selected{background-color:#ffe9b1;color:#333}.easy-autocomplete.eac-purple{color:#333}.easy-autocomplete.eac-purple input{background-color:#d6d1e7;border-color:#b8afd5;box-shadow:0;color:#333}.easy-autocomplete.eac-purple input:hover,.easy-autocomplete.eac-purple input:focus{border-color:#333;box-shadow:0}.easy-autocomplete.eac-purple ul{border-color:#333}.easy-autocomplete.eac-purple ul li,.easy-autocomplete.eac-purple ul .eac-category{background-color:#d6d1e7;border-color:#333}.easy-autocomplete.eac-purple ul li.selected,.easy-autocomplete.eac-purple ul .eac-category.selected{background-color:#ebe8f3;color:#333}.easy-autocomplete.eac-bootstrap input{border-color:#ccc;border-radius:4px;border-style:solid;border-width:1px;color:#555;padding:6px 12px}.easy-autocomplete-container{left:0;position:absolute;width:100%;z-index:2}.easy-autocomplete-container ul{background:none repeat scroll 0 0 #ffffff;border-top:1px dotted #ccc;display:none;margin-top:0;padding-bottom:0;padding-left:0;position:relative;top:-1px}.easy-autocomplete-container ul li,.easy-autocomplete-container ul .eac-category{background:inherit;border-color:#ccc;border-image:none;border-style:solid;border-width:0 1px;display:block;font-size:14px;font-weight:normal;padding:4px 12px}.easy-autocomplete-container ul li:last-child{border-radius:0 0 2px 2px;border-width:0 1px 1px}.easy-autocomplete-container ul li.selected{background:none repeat scroll 0 0 #ebebeb;cursor:pointer}.easy-autocomplete-container ul li.selected div{font-weight:normal}.easy-autocomplete-container ul li div{display:block;font-weight:normal;word-break:break-all}.easy-autocomplete-container ul li b{font-weight:bold}.easy-autocomplete-container ul .eac-category{font-color:#aaa;font-style:italic}.eac-description .eac-item span{color:#aaa;font-style:italic;font-size:0.9em}.eac-icon-left .eac-item img{margin-right:4px;max-height:30px}.eac-icon-right .eac-item{margin-top:8px;min-height:24px;position:relative}.eac-icon-right .eac-item img{margin-left:4px;max-height:30px;position:absolute;right:-4px;top:-8px}
/*# sourceMappingURL=easy-autocomplete.min.css.map */
/* Custom */
div.easy-autocomplete {
width: auto !important;
}
.easy-autocomplete-container ul {
background: none repeat scroll 0 0 #f8f8f8;
top: -1px;
left: 0px;
-webkit-box-shadow: 0 4px 8px rgba(0,0,0,.15);
box-shadow: 0 4px 8px rgba(0,0,0,.15);
border: 0;
border: 1px solid #d7dde2;
}
.easy-autocomplete-container ul li, .easy-autocomplete-container ul .eac-category {
border: 0;
border-bottom: 1px dotted #d7dde2;
display: block;
font-size: .875rem;
font-weight: normal;
padding: .5rem 1rem;
color: #12141d;
}
.easy-autocomplete-container ul li:last-child, .easy-autocomplete-container ul .eac-category:last-child {
border-bottom: 0;
}
.easy-autocomplete-container ul li b, .easy-autocomplete-container ul .eac-category b {
font-weight: 700;
color: #12141d;
}
.easy-autocomplete-container ul li.selected {
background: none repeat scroll 0 0 rgba(0,0,0,.04);
cursor: pointer;
}
:root {
--ico-checkmark: url('data:image/svg+xml;utf8,');
--ico-link-external: url('data:image/svg+xml;utf8, ');
--ico-xmark: url('data:image/svg+xml;utf8, ');
--ico-arrow-down: url("data:image/svg+xml;utf8,");
--ico-arrow-up: url("data:image/svg+xml;utf8,");
--c-gray: #E2E6EA;
--c-dark-gray: #747F88;
--c-green: #47BF6F;
--c-black: #12141d;
--c-white: #FAFAFA;
--c-orange: #ff821e;
}
@media (min-width: 52em) {
#login-overlay2 {
max-width: 600px;
}
}
.text-right {
text-align: right;
}
.is-disabled {
color: gray;
}
.highlight {
background-color: #fff88a;
}
.cart-product-cell {
width: 100%
}
.inline-flex-center {
display: inline-flex;
align-items: center;
}
.cart-quantity-cell {
width: 55%
}
.cart-total-cell {
width: 45%
}
@media (min-width: 52em) {
.cart-product-cell {
width: 45%
}
.cart-quantity-cell {
width: 35%
}
.cart-total-cell {
width: 20%
}
}
@media (min-width: 76em) {
.cart-product-cell {
width: 45%
}
.cart-quantity-cell {
width: 35%
}
.cart-total-cell {
width: 20%
}
}
/* Validation / Messages */
.input.invalid, select.invalid, textarea.invalid,
.input.wpcf7-not-valid, select.wpcf7-not-valid, textarea.wpcf7-not-valid {
border-color: #c72222;
}
.input.valid, select.valid, textarea.valid {
border-color: #3c800f;
}
.msg, .wpcf7-not-valid-tip {
-webkit-box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
-webkit-border-radius: 4px;
border-radius: 4px;
background-color: #eff8ff;
color: #006ec4;
fill: #006ec4;
}
.msg.invalid, span.wpcf7-not-valid-tip {
background-color: #ffe8e8;
color: #c72222;
fill: #c72222;
}
span.wpcf7-not-valid-tip {
padding: .5rem 1rem;
margin-top: .5rem;
font-weight: 600;
font-size: .875rem;
display: inline-block;
}
.msg.valid {
background-color: #e9ffdb;
color: #3c800f;
fill: #3c800f;
}
div.wpcf7-validation-errors {
float: left;
width: 100%;
}
.password-progress {
height: 12px;
margin-top: 10px;
overflow: hidden;
background-color: #f5f5f5;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
max-width: 26rem;
}
.progress-bar {
float: left;
height: 100%;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
-webkit-transition: width .6s ease;
-o-transition: width .6s ease;
transition: width .6s ease;
}
.not-so-huge {
font-size: 2rem;
line-height: .875;
}
@media (min-width: 52em) {
.not-so-huge {
font-size: 3rem;
}
}
#specifications h3 {
margin: 20px 0 10px 0;
}
.drop-label {
height: 1.5rem;
line-height: 1.5rem;
}
.drop-select {
padding: 0 1em 0 0 !important;
height: 1.5rem !important;
}
label.required::after {
content: "*";
color: #c72222;
padding-left: 0.25rem;
font-weight: bold;
font-size: 1rem;
vertical-align: top;
}
.ico {
background-size: contain;
background-repeat: no-repeat;
background-position: left center;
display: inline-block;
width: 1.25rem;
height: 1.25rem;
}
.ico.ico-s {
width: 1rem;
height: 1rem;
}
.pwd-validator {
color: var(--c-dark-gray);
font-size: 13px;
display: inline-flex;
align-items: center;
}
.pwd-validator .ico {
background-image: var(--ico-xmark);
filter: invert(15%) sepia(54%) saturate(6866%) hue-rotate(8deg) brightness(103%) contrast(111%);
font-size: 0.8125rem;
display: inline-flex;
align-items: center;
}
.pwd-validator span {
padding-top: 1px;
}
.pwd-validator.valid {
color: #2FCF65;
}
.pwd-validator.valid .ico {
background-image: var(--ico-checkmark);
font-size: 0.8125rem;
display: inline-flex;
align-items: center;
filter: invert(65%) sepia(98%) saturate(386%) hue-rotate(81deg) brightness(88%) contrast(86%);
}
.icon-external-link {
background-size: contain;
background-repeat: no-repeat;
background-position: left center;
display: inline-block;
background-image: var(--ico-link-external);
margin-left: 5px;
width: 0.85rem;
height: 0.85rem;
filter: invert(30%) sepia(99%) saturate(1058%) hue-rotate(181deg) brightness(104%) contrast(111%);
}
.icon-small {
width: 1.125rem;
height: 1.125rem;
margin-bottom: .125rem;
margin-right: .25rem;
}
.float-right {
float: right;
}
.float-left {
float: left;
}
.underline {
text-decoration: underline;
}
.defaultfontsize {
font-size: 14px;
}
.circle {
width: 12px;
height: 12px;
border-radius: 9999px
}
.minimalistic .circle {
width: .5rem;
height: .5rem;
}
.onstock-indicator {
background: var(--c-green);
}
.nostock-indicator {
background: var(--c-dark-gray);
opacity: 0.5;
}
.incomingstock-indicator {
background: var(--c-dark-gray);
}
.minimalistic .incomingstock-indicator {
background: var(--c-orange);
}
.onstock-text {
color: var(--c-green);
}
.nostock-text {
color: var(--c-dark-gray);
opacity: 0.5;
}
.incomingstock-text {
color: var(--c-dark-gray);
text-wrap: nowrap;
}
.minimalistic .incomingstock-text {
color: var(--c-orange);
}
.stock-header {
display: grid;
grid-template-columns: auto 1fr;
column-gap: 8px;
}
.stockdata {
position: relative;
}
.stockdata .indicator-container,
.stockpopup .indicator-container {
justify-content: flex-start;
align-items: center;
gap: 3px;
display: flex;
}
.stockdata .stockpopup-icon {
content: var(--ico-arrow-down);
}
.stockdata.minimalistic .stockpopup-icon {
content: '';
}
.stockdata.minimalistic .stock-header {
display: grid;
grid-template-columns: auto;
column-gap: 8px;
row-gap: 4px;
justify-content: center;
align-items: center;
}
.stockdata.minimalistic .indicator-container {
justify-content: center;
align-items: center;
}
.stockpopup {
position: absolute;
display: none;
background-color: var(--c-white);
border: 1px solid var(--c-gray);
border-radius: 8px;
margin: -9px 0 0 -9px;
z-index: 99999;
color: var(--c-black);
}
.stockpopup.minimalistic {
text-align: left;
}
.stockpopup:has(~ .stockdata:hover), .stockpopup:hover {
display: block;
}
.stockpopup .stockpopup-icon {
content: var(--ico-arrow-up);
}
.stockpopup .stock-header {
padding: 8px;
}
.stockpopup .stockpopup-content {
display: grid;
grid-template-columns: auto auto;
column-gap: 0;
font-size: 12px;
}
.stockpopup .stockpopup-content div {
padding: 6px 0 0 0;
}
.stockpopup .stockpopup-content div:nth-child(odd) {
padding-left: 16px;
padding-right: 4px;
}
.stockpopup .stockpopup-content div:nth-child(even) {
padding-left: 4px;
padding-right: 16px;
text-align: right;
}
.stockpopup .stockpopup-content .stockpopup-header {
background: #F8F8F8;
border-top: 1px #E2E6EA solid;
border-bottom: 1px #E2E6EA solid;
font-weight: 600;
padding-bottom: 6px;
}
.stockpopup .stockpopup-content .stockpopup-data:nth-last-child(1),
.stockpopup .stockpopup-content .stockpopup-data:nth-last-child(2) {
padding-bottom: 6px;
}
#searchResults .tier-pricing {
width: fit-content;
margin-left: auto;
}
#searchResults .tier-pricing .tier-pricing-button {
color: #4087E8;
font-size: 14px;
display: flex;
justify-content: end;
cursor: pointer;
}
#searchResults .tier-pricing .tier-pricing-button img {
margin-left: 3px;
content: var(--ico-arrow-down);
}
#searchResults .tier-pricing:hover .tier-pricing-button img {
content: var(--ico-arrow-up);
}
#searchResults .tier-pricing .tier-pricing-popup {
display: none;
position: absolute;
right: -5px;
z-index: 999999;
background: #FAFAFA;
box-shadow: 0px 4px 16px -8px rgba(0, 0, 0, 0.15);
border-radius: 8px;
outline: 1px #E2E6EA solid;
outline-offset: -1px;
}
#searchResults .tier-pricing:hover .tier-pricing-popup {
display: block;
}
#searchResults .tier-pricing {
font-size: 14px;
}
#searchResults .tier-pricing-row {
display: flex;
align-items: stretch;
background: #fff;
border-top: 1.5px solid #e0e0e0;
}
#searchResults .tier-pricing-row > div {
flex: 1 1 0;
padding: 0.5em 0.25em;
display: flex;
align-items: center;
justify-content: flex-start;
white-space: nowrap;
}
#searchResults .tier-pricing-row > div:first-child {
padding-left: 1em;
justify-content: flex-start;
text-align: left;
}
#searchResults .tier-pricing-row > div:nth-child(2) {
justify-content: flex-end;
text-align: right;
padding-right: 1em;
}
#searchResults .tier-pricing-row > div:last-child {
padding-right: 1em;
justify-content: flex-end;
text-align: right;
}
#searchResults .tier-pricing-row:first-child {
border-top: none;
}
#searchResults .tier-pricing-row:last-child {
border-radius: 0 0 8px 8px;
}
#searchResults .tier-pricing-header {
border-radius: 8px 8px 0 0;
background: #f5f5f5;
color: #3a3a3a;
font-weight: 600;
gap: 24px;
}
#searchResults .tier-pricing-row-highlight {
background: #FF821E1A !important;
font-weight: 600;
color: #222;
}
#searchResults .tier-pricing-row-highlight > div {
color: #222;
}
#searchResults .tier-pricing-discount, .tier-pricing-suggestion {
color: var(--c-green);
}
/*
Theme Name: BassTheme
Author: Tim Hereijgers
Author URI: http://timhereijgers.nl
Description: Basic theme for stripped down responsive Wordpress site. Based on BassCss
Version: 1.0
*/
/* Reset */
img,
video {
height: auto; /* Make sure images are scaled correctly. */
max-width: 100%; /* Adhere to container width. */
}
embed,
iframe,
object {
margin-bottom: 1.5em;
max-width: 100%;
}
/*! Basscss core | http://basscss.com | MIT License */
h1, h2, h3, h4, h5, h6 {
margin-bottom: 1rem;
font-weight: 700;
}
h1, h2 {
font-family: "futura-pt", "proxima-nova", Helvetica, Arial, sans-serif;
}
h1, .h1 {
font-size: 2rem;
line-height: 1.1875;
letter-spacing: .01em;
}
h2, .h2 {
font-size: 1.5rem
}
h3, .h3 {
font-size: 1.25rem
}
@media (max-width: 40em) {
h1, .h1 {
font-size: 1.5rem
}
h2, .h2 {
font-size: 1.375rem
}
h3, .h3 {
font-size: 1.125rem
}
}
h4, .h4 {
font-size: .875rem
}
h5, .h5 {
font-size: .8125rem
}
h6, .h6 {
font-size: .75rem
}
.font-family-inherit {
font-family: inherit
}
.font-size-inherit {
font-size: inherit
}
.text-decoration-none, .text-decoration-none:hover {
text-decoration: none
}
.bold {
font-weight: 700
}
.semi-bold {
font-weight: 600
}
.medium {
font-weight: 500
}
.regular {
font-weight: 400
}
.italic {
font-style: italic
}
.uppercase {
text-transform: uppercase
}
.caps {
text-transform: uppercase;
letter-spacing: .05em;
}
.no-transform {
text-transform: none
}
.left-align {
text-align: left
}
.center {
text-align: center
}
.right-align {
text-align: right
}
.justify {
text-align: justify
}
@media (min-width: 40rem) {
.sm-left-align {
text-align: left
}
.sm-center {
text-align: center
}
.sm-right-align {
text-align: right
}
.sm-justify {
text-align: justify
}
}
@media (min-width: 52rem) {
.md-left-align {
text-align: left
}
.md-center {
text-align: center
}
.md-right-align {
text-align: right
}
.md-justify {
text-align: justify
}
}
@media (min-width: 64rem) {
.lg-left-align {
text-align: left
}
.lg-center {
text-align: center
}
.lg-right-align {
text-align: right
}
.lg-justify {
text-align: justify
}
}
.nowrap {
white-space: nowrap
}
.break-word {
word-wrap: break-word
}
.list-style-none {
list-style: none
}
.underline {
text-decoration: underline
}
.truncate {
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.list-reset {
list-style: none;
padding-left: 0;
}
.list-inline {
letter-spacing: -.31em;
}
.list-inline li {
letter-spacing: normal;
display: inline-block;
}
table, thead, tbody, tfoot, tr, th, td {
margin: 0;
padding: 0;
border-collapse: inherit;
border-spacing: 0;
border-color: inherit;
vertical-align: inherit;
text-align: left;
-webkit-border-horizontal-spacing: 0;
-webkit-border-vertical-spacing: 0;
}
table tr.border-bottom td {
border-bottom: 1px solid;
border-color: inherit;
}
/* Minified displays, floats & aligns */
.display-none {
display: none
}
.inline {
display: inline
}
.block {
display: block
}
.inline-block {
display: inline-block
}
.table {
display: table;
border-spacing: 0
}
.table-cell {
display: table-cell
}
.overflow-hidden {
overflow: hidden
}
.overflow-scroll {
overflow: scroll
}
.overflow-auto {
overflow: auto
}
.clearfix:after, .clearfix:before {
content: " ";
display: table
}
.clearfix:after {
clear: both
}
.left {
float: left
}
.right {
float: right
}
@media (min-width:40em) {
.sm-inline {
display: inline
}
.sm-block {
display: block
}
.sm-inline-block {
display: inline-block
}
.sm-table {
display: table
}
.sm-table-cell {
display: table-cell
}
.sm-overflow-hidden {
overflow: hidden
}
.sm-overflow-scroll {
overflow: scroll
}
.sm-overflow-auto {
overflow: auto
}
.sm-left {
float: left
}
.sm-right {
float: right
}
}
@media (min-width:52em) {
.md-inline {
display: inline
}
.md-block {
display: block
}
.md-inline-block {
display: inline-block
}
.md-table {
display: table
}
.md-table-cell {
display: table-cell
}
.md-overflow-hidden {
overflow: hidden
}
.md-overflow-scroll {
overflow: scroll
}
.md-overflow-auto {
overflow: auto
}
.md-left {
float: left
}
.md-right {
float: right
}
}
@media (min-width:64em) {
.lg-inline {
display: inline
}
.lg-block {
display: block
}
.lg-inline-block {
display: inline-block
}
.lg-table {
display: table
}
.lg-table-cell {
display: table-cell
}
.lg-overflow-hidden {
overflow: hidden
}
.lg-overflow-scroll {
overflow: scroll
}
.lg-overflow-auto {
overflow: auto
}
.lg-left {
float: left
}
.lg-right {
float: right
}
}
.fit {
max-width: 100%
}
.border-box {
box-sizing: border-box
}
.content-box {
box-sizing: content-box
}
.align-baseline {
vertical-align: baseline
}
.align-top {
vertical-align: top
}
.align-middle {
vertical-align: middle
}
.align-bottom {
vertical-align: bottom
}
.align-text-top {
vertical-align: text-top
}
.align-text-bottom {
vertical-align: text-bottom
}
.mxn1 {
margin-left: -.5rem;
margin-right: -.5rem;
}
.mxn2 {
margin-left: -1rem;
margin-right: -1rem;
}
.mxn3 {
margin-left: -2rem;
margin-right: -2rem;
}
.mxn4 {
margin-left: -4rem;
margin-right: -4rem;
}
/* Minified margins, paddings & cols */
.ml0, .mx0 {
margin-left: 0
}
.mr0, .mx0 {
margin-right: 0
}
.mt0, .my0 {
margin-top: 0
}
.mb0, .my0 {
margin-bottom: 0
}
.pl0, .px0 {
padding-left: 0
}
.pr0, .px0 {
padding-right: 0
}
.pt0, .py0 {
padding-top: 0
}
.pb0, .py0 {
padding-bottom: 0
}
.col, .col-right {
box-sizing: border-box
}
.m0 {
margin: 0
}
.ml1, .mx1 {
margin-left: .5rem
}
.mr1, .mx1 {
margin-right: .5rem
}
.mt1, .my1 {
margin-top: .5rem
}
.mb1, .my1 {
margin-bottom: .5rem
}
.m1 {
margin: .5rem
}
.ml2, .mx2 {
margin-left: 1rem
}
.mr2, .mx2 {
margin-right: 1rem
}
.mt2, .my2 {
margin-top: 1rem
}
.mb2, .my2 {
margin-bottom: 1rem
}
.m2 {
margin: 1rem
}
.ml3, .mx3 {
margin-left: 2rem
}
.mr3, .mx3 {
margin-right: 2rem
}
.mt3, .my3 {
margin-top: 2rem
}
.mb3, .my3 {
margin-bottom: 2rem
}
.m3 {
margin: 2rem
}
.ml4, .mx4 {
margin-left: 4rem
}
.mr4, .mx4 {
margin-right: 4rem
}
.mt4, .my4 {
margin-top: 4rem
}
.mb4, .my4 {
margin-bottom: 4rem
}
.m4 {
margin: 4rem
}
.ml-auto, .mx-auto {
margin-left: auto
}
.mr-auto, .mx-auto {
margin-right: auto
}
.p0 {
padding: 0
}
.pl1, .px1 {
padding-left: .5rem
}
.pr1, .px1 {
padding-right: .5rem
}
.pt1, .py1 {
padding-top: .5rem
}
.pb1, .py1 {
padding-bottom: .5rem
}
.p1 {
padding: .5rem
}
.pt2, .py2 {
padding-top: 1rem
}
.pb2, .py2 {
padding-bottom: 1rem
}
.pl2, .px2 {
padding-left: 1rem
}
.pr2, .px2 {
padding-right: 1rem
}
.p2 {
padding: 1rem
}
.pt3, .py3 {
padding-top: 2rem
}
.pb3, .py3 {
padding-bottom: 2rem
}
.pl3, .px3 {
padding-left: 2rem
}
.pr3, .px3 {
padding-right: 2rem
}
.p3 {
padding: 2rem
}
.pt4, .py4 {
padding-top: 4rem
}
.pb4, .py4 {
padding-bottom: 4rem
}
.pl4, .px4 {
padding-left: 4rem
}
.pr4, .px4 {
padding-right: 4rem
}
.p4 {
padding: 4rem
}
.pt25 {
padding-top: 25px
}
.col {
float: left
}
.col-right {
float: right
}
.col-1 {
width: 8.33333%
}
.col-2 {
width: 16.66667%
}
.col-3 {
width: 25%
}
.col-4 {
width: 33.33333%
}
.col-5 {
width: 41.66667%
}
.col-6 {
width: 50%
}
.col-7 {
width: 58.33333%
}
.col-8 {
width: 66.66667%
}
.col-9 {
width: 75%
}
.col-10 {
width: 83.33333%
}
.col-11 {
width: 91.66667%
}
.col-12 {
width: 100%
}
.col-auto {
width: auto
}
@media (min-width:40em) {
.sm-mt0, .sm-my0 {
margin-top: 0
}
.sm-mb0, .sm-my0 {
margin-bottom: 0
}
.sm-mxn1 {
margin-left: -.5rem;
margin-right: -.5rem
}
.sm-mxn2 {
margin-left: -1rem;
margin-right: -1rem
}
.sm-mxn3 {
margin-left: -2rem;
margin-right: -2rem
}
.sm-mxn4 {
margin-left: -4rem;
margin-right: -4rem
}
.sm-ml0, .sm-mx0 {
margin-left: 0
}
.sm-mr0, .sm-mx0 {
margin-right: 0
}
.sm-m0 {
margin: 0
}
.sm-ml1, .sm-mx1 {
margin-left: .5rem
}
.sm-mr1, .sm-mx1 {
margin-right: .5rem
}
.sm-mt1, .sm-my1 {
margin-top: .5rem
}
.sm-mb1, .sm-my1 {
margin-bottom: .5rem
}
.sm-m1 {
margin: .5rem
}
.sm-ml2, .sm-mx2 {
margin-left: 1rem
}
.sm-mr2, .sm-mx2 {
margin-right: 1rem
}
.sm-mt2, .sm-my2 {
margin-top: 1rem
}
.sm-mb2, .sm-my2 {
margin-bottom: 1rem
}
.sm-m2 {
margin: 1rem
}
.sm-ml3, .sm-mx3 {
margin-left: 2rem
}
.sm-mr3, .sm-mx3 {
margin-right: 2rem
}
.sm-mt3, .sm-my3 {
margin-top: 2rem
}
.sm-mb3, .sm-my3 {
margin-bottom: 2rem
}
.sm-m3 {
margin: 2rem
}
.sm-ml4, .sm-mx4 {
margin-left: 4rem
}
.sm-mr4, .sm-mx4 {
margin-right: 4rem
}
.sm-mt4, .sm-my4 {
margin-top: 4rem
}
.sm-mb4, .sm-my4 {
margin-bottom: 4rem
}
.sm-m4 {
margin: 4rem
}
.sm-ml-auto, .sm-mx-auto {
margin-left: auto
}
.sm-mr-auto, .sm-mx-auto {
margin-right: auto
}
.sm-pl0, .sm-px0 {
padding-left: 0
}
.sm-pr0, .sm-px0 {
padding-right: 0
}
.sm-pt0, .sm-py0 {
padding-top: 0
}
.sm-pb0, .sm-py0 {
padding-bottom: 0
}
.sm-p0 {
padding: 0
}
.sm-pl1, .sm-px1 {
padding-left: .5rem
}
.sm-pr1, .sm-px1 {
padding-right: .5rem
}
.sm-pt1, .sm-py1 {
padding-top: .5rem
}
.sm-pb1, .sm-py1 {
padding-bottom: .5rem
}
.sm-p1 {
padding: .5rem
}
.sm-pl2, .sm-px2 {
padding-left: 1rem
}
.sm-pr2, .sm-px2 {
padding-right: 1rem
}
.sm-pt2, .sm-py2 {
padding-top: 1rem
}
.sm-pb2, .sm-py2 {
padding-bottom: 1rem
}
.sm-p2 {
padding: 1rem
}
.sm-pl3, .sm-px3 {
padding-left: 2rem
}
.sm-pr3, .sm-px3 {
padding-right: 2rem
}
.sm-pt3, .sm-py3 {
padding-top: 2rem
}
.sm-pb3, .sm-py3 {
padding-bottom: 2rem
}
.sm-p3 {
padding: 2rem
}
.sm-pl4, .sm-px4 {
padding-left: 4rem
}
.sm-pr4, .sm-px4 {
padding-right: 4rem
}
.sm-pt4, .sm-py4 {
padding-top: 4rem
}
.sm-pb4, .sm-py4 {
padding-bottom: 4rem
}
.sm-p4 {
padding: 4rem
}
.sm-col, .sm-col-right {
box-sizing: border-box
}
.sm-col {
float: left
}
.sm-col-right {
float: right
}
.sm-col-1 {
width: 8.33333%
}
.sm-col-2 {
width: 16.66667%
}
.sm-col-3 {
width: 25%
}
.sm-col-4 {
width: 33.33333%
}
.sm-col-5 {
width: 41.66667%
}
.sm-col-6 {
width: 50%
}
.sm-col-7 {
width: 58.33333%
}
.sm-col-8 {
width: 66.66667%
}
.sm-col-9 {
width: 75%
}
.sm-col-10 {
width: 83.33333%
}
.sm-col-11 {
width: 91.66667%
}
.sm-col-12 {
width: 100%
}
.sm-col-auto {
width: auto
}
}
@media (min-width:52em) {
.md-mt0, .md-my0 {
margin-top: 0
}
.md-mb0, .md-my0 {
margin-bottom: 0
}
.md-mxn1 {
margin-left: -.5rem;
margin-right: -.5rem
}
.md-mxn2 {
margin-left: -1rem;
margin-right: -1rem
}
.md-mxn3 {
margin-left: -2rem;
margin-right: -2rem
}
.md-mxn4 {
margin-left: -4rem;
margin-right: -4rem
}
.md-ml0, .md-mx0 {
margin-left: 0
}
.md-mr0, .md-mx0 {
margin-right: 0
}
.md-m0 {
margin: 0
}
.md-ml1, .md-mx1 {
margin-left: .5rem
}
.md-mr1, .md-mx1 {
margin-right: .5rem
}
.md-mt1, .md-my1 {
margin-top: .5rem
}
.md-mb1, .md-my1 {
margin-bottom: .5rem
}
.md-m1 {
margin: .5rem
}
.md-ml2, .md-mx2 {
margin-left: 1rem
}
.md-mr2, .md-mx2 {
margin-right: 1rem
}
.md-mt2, .md-my2 {
margin-top: 1rem
}
.md-mb2, .md-my2 {
margin-bottom: 1rem
}
.md-m2 {
margin: 1rem
}
.md-ml3, .md-mx3 {
margin-left: 2rem
}
.md-mr3, .md-mx3 {
margin-right: 2rem
}
.md-mt3, .md-my3 {
margin-top: 2rem
}
.md-mb3, .md-my3 {
margin-bottom: 2rem
}
.md-m3 {
margin: 2rem
}
.md-ml4, .md-mx4 {
margin-left: 4rem
}
.md-mr4, .md-mx4 {
margin-right: 4rem
}
.md-mt4, .md-my4 {
margin-top: 4rem
}
.md-mb4, .md-my4 {
margin-bottom: 4rem
}
.md-m4 {
margin: 4rem
}
.md-ml-auto, .md-mx-auto {
margin-left: auto
}
.md-mr-auto, .md-mx-auto {
margin-right: auto
}
.md-pl0, .md-px0 {
padding-left: 0
}
.md-pr0, .md-px0 {
padding-right: 0
}
.md-pt0, .md-py0 {
padding-top: 0
}
.md-pb0, .md-py0 {
padding-bottom: 0
}
.md-p0 {
padding: 0
}
.md-pl1, .md-px1 {
padding-left: .5rem
}
.md-pr1, .md-px1 {
padding-right: .5rem
}
.md-pt1, .md-py1 {
padding-top: .5rem
}
.md-pb1, .md-py1 {
padding-bottom: .5rem
}
.md-p1 {
padding: .5rem
}
.md-pl2, .md-px2 {
padding-left: 1rem
}
.md-pr2, .md-px2 {
padding-right: 1rem
}
.md-pt2, .md-py2 {
padding-top: 1rem
}
.md-pb2, .md-py2 {
padding-bottom: 1rem
}
.md-p2 {
padding: 1rem
}
.md-pl3, .md-px3 {
padding-left: 2rem
}
.md-pr3, .md-px3 {
padding-right: 2rem
}
.md-pt3, .md-py3 {
padding-top: 2rem
}
.md-pb3, .md-py3 {
padding-bottom: 2rem
}
.md-p3 {
padding: 2rem
}
.md-pl4, .md-px4 {
padding-left: 4rem
}
.md-pr4, .md-px4 {
padding-right: 4rem
}
.md-pt4, .md-py4 {
padding-top: 4rem
}
.md-pb4, .md-py4 {
padding-bottom: 4rem
}
.md-p4 {
padding: 4rem
}
.md-col, .md-col-right {
box-sizing: border-box
}
.md-col {
float: left
}
.md-col-right {
float: right
}
.md-col-1 {
width: 8.33333%
}
.md-col-2 {
width: 16.66667%
}
.md-col-3 {
width: 25%
}
.md-col-4 {
width: 33.33333%
}
.md-col-5 {
width: 41.66667%
}
.md-col-6 {
width: 50%
}
.md-col-7 {
width: 58.33333%
}
.md-col-8 {
width: 66.66667%
}
.md-col-9 {
width: 75%
}
.md-col-10 {
width: 83.33333%
}
.md-col-11 {
width: 91.66667%
}
.md-col-12 {
width: 100%
}
.md-col-auto {
width: auto
}
}
@media (min-width:64em) {
.lg-mt0, .lg-my0 {
margin-top: 0
}
.lg-mb0, .lg-my0 {
margin-bottom: 0
}
.lg-mxn1 {
margin-left: -.5rem;
margin-right: -.5rem
}
.lg-mxn2 {
margin-left: -1rem;
margin-right: -1rem
}
.lg-mxn3 {
margin-left: -2rem;
margin-right: -2rem
}
.lg-mxn4 {
margin-left: -4rem;
margin-right: -4rem
}
.lg-ml0, .lg-mx0 {
margin-left: 0
}
.lg-mr0, .lg-mx0 {
margin-right: 0
}
.lg-m0 {
margin: 0
}
.lg-ml1, .lg-mx1 {
margin-left: .5rem
}
.lg-mr1, .lg-mx1 {
margin-right: .5rem
}
.lg-mt1, .lg-my1 {
margin-top: .5rem
}
.lg-mb1, .lg-my1 {
margin-bottom: .5rem
}
.lg-m1 {
margin: .5rem
}
.lg-ml2, .lg-mx2 {
margin-left: 1rem
}
.lg-mr2, .lg-mx2 {
margin-right: 1rem
}
.lg-mt2, .lg-my2 {
margin-top: 1rem
}
.lg-mb2, .lg-my2 {
margin-bottom: 1rem
}
.lg-m2 {
margin: 1rem
}
.lg-ml3, .lg-mx3 {
margin-left: 2rem
}
.lg-mr3, .lg-mx3 {
margin-right: 2rem
}
.lg-mt3, .lg-my3 {
margin-top: 2rem
}
.lg-mb3, .lg-my3 {
margin-bottom: 2rem
}
.lg-m3 {
margin: 2rem
}
.lg-ml4, .lg-mx4 {
margin-left: 4rem
}
.lg-mr4, .lg-mx4 {
margin-right: 4rem
}
.lg-mt4, .lg-my4 {
margin-top: 4rem
}
.lg-mb4, .lg-my4 {
margin-bottom: 4rem
}
.lg-m4 {
margin: 4rem
}
.lg-ml-auto, .lg-mx-auto {
margin-left: auto
}
.lg-mr-auto, .lg-mx-auto {
margin-right: auto
}
.lg-pl0, .lg-px0 {
padding-left: 0
}
.lg-pr0, .lg-px0 {
padding-right: 0
}
.lg-pt0, .lg-py0 {
padding-top: 0
}
.lg-pb0, .lg-py0 {
padding-bottom: 0
}
.lg-p0 {
padding: 0
}
.lg-pl1, .lg-px1 {
padding-left: .5rem
}
.lg-pr1, .lg-px1 {
padding-right: .5rem
}
.lg-pt1, .lg-py1 {
padding-top: .5rem
}
.lg-pb1, .lg-py1 {
padding-bottom: .5rem
}
.lg-p1 {
padding: .5rem
}
.lg-pl2, .lg-px2 {
padding-left: 1rem
}
.lg-pr2, .lg-px2 {
padding-right: 1rem
}
.lg-pt2, .lg-py2 {
padding-top: 1rem
}
.lg-pb2, .lg-py2 {
padding-bottom: 1rem
}
.lg-p2 {
padding: 1rem
}
.lg-pl3, .lg-px3 {
padding-left: 2rem
}
.lg-pr3, .lg-px3 {
padding-right: 2rem
}
.lg-pt3, .lg-py3 {
padding-top: 2rem
}
.lg-pb3, .lg-py3 {
padding-bottom: 2rem
}
.lg-p3 {
padding: 2rem
}
.lg-pl4, .lg-px4 {
padding-left: 4rem
}
.lg-pr4, .lg-px4 {
padding-right: 4rem
}
.lg-pt4, .lg-py4 {
padding-top: 4rem
}
.lg-pb4, .lg-py4 {
padding-bottom: 4rem
}
.lg-p4 {
padding: 4rem
}
.lg-col, .lg-col-right {
box-sizing: border-box
}
.lg-col {
float: left
}
.lg-col-right {
float: right
}
.lg-col-1 {
width: 8.33333%
}
.lg-col-2 {
width: 16.66667%
}
.lg-col-3 {
width: 25%
}
.lg-col-4 {
width: 33.33333%
}
.lg-col-5 {
width: 41.66667%
}
.lg-col-6 {
width: 50%
}
.lg-col-7 {
width: 58.33333%
}
.lg-col-8 {
width: 66.66667%
}
.lg-col-9 {
width: 75%
}
.lg-col-10 {
width: 83.33333%
}
.lg-col-11 {
width: 91.66667%
}
.lg-col-12 {
width: 100%
}
.lg-col-auto {
width: auto
}
}
/* Minified flexbox & positioning */
.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.flex-column {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column
}
.flex-wrap {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap
}
.items-start {
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
-ms-grid-row-align: flex-start;
align-items: flex-start
}
.items-end {
-webkit-box-align: end;
-webkit-align-items: flex-end;
-ms-flex-align: end;
-ms-grid-row-align: flex-end;
align-items: flex-end
}
.items-center {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
-ms-grid-row-align: center;
align-items: center
}
.items-baseline {
-webkit-box-align: baseline;
-webkit-align-items: baseline;
-ms-flex-align: baseline;
-ms-grid-row-align: baseline;
align-items: baseline
}
.items-stretch {
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
-ms-grid-row-align: stretch;
align-items: stretch
}
.self-start {
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start
}
.self-end {
-webkit-align-self: flex-end;
-ms-flex-item-align: end;
align-self: flex-end
}
.self-center {
-webkit-align-self: center;
-ms-flex-item-align: center;
align-self: center
}
.self-baseline {
-webkit-align-self: baseline;
-ms-flex-item-align: baseline;
align-self: baseline
}
.self-stretch {
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch
}
.justify-start {
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start
}
.justify-end {
-webkit-box-pack: end;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end
}
.justify-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
.justify-between {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between
}
.justify-around {
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around
}
.content-start {
-webkit-align-content: flex-start;
-ms-flex-line-pack: start;
align-content: flex-start
}
.content-end {
-webkit-align-content: flex-end;
-ms-flex-line-pack: end;
align-content: flex-end
}
.content-center {
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center
}
.content-between {
-webkit-align-content: space-between;
-ms-flex-line-pack: justify;
align-content: space-between
}
.content-around {
-webkit-align-content: space-around;
-ms-flex-line-pack: distribute;
align-content: space-around
}
.content-stretch {
-webkit-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch
}
.flex-auto {
-webkit-box-flex: 1;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
min-width: 0;
min-height: 0
}
.flex-none {
-webkit-box-flex: 0;
-webkit-flex: none;
-ms-flex: none;
flex: none
}
.order-0 {
-webkit-box-ordinal-group: 1;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0
}
.order-1 {
-webkit-box-ordinal-group: 2;
-webkit-order: 1;
-ms-flex-order: 1;
order: 1
}
.order-2 {
-webkit-box-ordinal-group: 3;
-webkit-order: 2;
-ms-flex-order: 2;
order: 2
}
.order-3 {
-webkit-box-ordinal-group: 4;
-webkit-order: 3;
-ms-flex-order: 3;
order: 3
}
.order-last {
-webkit-box-ordinal-group: 100000;
-webkit-order: 99999;
-ms-flex-order: 99999;
order: 99999
}
.relative {
position: relative
}
.absolute {
position: absolute
}
.fixed {
position: fixed
}
.top-0 {
top: 0
}
.right-0 {
right: 0
}
.bottom-0 {
bottom: 0
}
.left-0 {
left: 0
}
@media (min-width:40em) {
.sm-flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.sm-relative {
position: relative
}
.sm-absolute {
position: absolute
}
.sm-fixed {
position: fixed
}
.sm-top-0 {
top: 0
}
.sm-right-0 {
right: 0
}
.sm-bottom-0 {
bottom: 0
}
.sm-left-0 {
left: 0
}
}
@media (min-width:52em) {
.md-flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.md-relative {
position: relative
}
.md-absolute {
position: absolute
}
.md-fixed {
position: fixed
}
.md-top-0 {
top: 0
}
.md-right-0 {
right: 0
}
.md-bottom-0 {
bottom: 0
}
.md-left-0 {
left: 0
}
}
@media (min-width:64em) {
.lg-flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.lg-relative {
position: relative
}
.lg-absolute {
position: absolute
}
.lg-fixed {
position: fixed
}
.lg-top-0 {
top: 0
}
.lg-right-0 {
right: 0
}
.lg-bottom-0 {
bottom: 0
}
.lg-left-0 {
left: 0
}
}
@media (min-width: 40em) {
.sm-justify-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
}
@media (min-width: 52em) {
.md-justify-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
}
.z1 {
z-index: 1;
}
.z2 {
z-index: 2;
}
.z3 {
z-index: 3;
}
.z4 {
z-index: 4;
}
.z100 {
z-index: 100;
}
.z101 {
z-index: 101;
}
.z102 {
z-index: 102;
}
.z103 {
z-index: 103;
}
.z104 {
z-index: 104;
}
.z105 {
z-index: 105;
}
.border {
border-style: solid;
border-width: 1px;
}
.border-top {
border-top-style: solid;
border-top-width: 1px;
}
.border-right {
border-right-style: solid;
border-right-width: 1px;
}
.border-bottom {
border-bottom-style: solid;
border-bottom-width: 1px;
}
.border-left {
border-left-style: solid;
border-left-width: 1px;
}
@media (min-width: 52em) {
.md-border {
border-style: solid;
border-width: 1px;
}
.md-border-top {
border-top-style: solid;
border-top-width: 1px;
}
.md-border-right {
border-right-style: solid;
border-right-width: 1px;
}
.md-border-bottom {
border-bottom-style: solid;
border-bottom-width: 1px;
}
.md-border-left {
border-left-style: solid;
border-left-width: 1px;
}
}
.border-top-dashed {
border-top-style: dashed
}
.border-right-dashed {
border-right-style: dashed
}
.border-bottom-dashed {
border-bottom-style: dashed
}
.border-left-dashed {
border-left-style: dashed
}
hr {
border: 0;
height: 0;
border-bottom: 1px solid currentColor;
margin-top: 0;
margin-bottom: 0;
}
.border-none {
border: 0
}
.circle {
border-radius: 50%
}
.rounded {
border-radius: .5rem
}
.rounded-top {
border-radius: .5rem .5rem 0 0
}
.rounded-right {
border-radius: 0 .5rem .5rem 0
}
.rounded-bottom {
border-radius: 0 0 .5rem .5rem
}
.rounded-left {
border-radius: .5rem 0 0 .5rem
}
.not-rounded {
border-radius: 0
}
.hide {
position: absolute !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
@media (max-width: 52em) {
.mob-hide {
position: absolute !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
}
/* End Basscss core */
/* Minified show / hide */
.lg-show, .lg-show-inline-block, .md-show, .md-show-inline-block, .sm-show, .sm-show-inline-block {
display: none !important
}
@media (min-width:40em) {
.sm-show {
display: block !important
}
.sm-show-inline-block {
display: inline-block !important
}
}
@media (min-width:52em) {
.md-show {
display: block !important
}
.md-show-inline-block {
display: inline-block !important
}
}
@media (min-width:75em) {
.lg-show {
display: block !important
}
.lg-show-inline-block {
display: inline-block !important
}
.lg-hide {
display: none !important
}
}
@media (min-width:40em) {
.sm-hide {
display: none !important
}
}
@media (min-width:52em) {
.md-hide {
display: none !important
}
}
.lg-show-inline, .md-show-inline, .sm-show-inline {
display: none !important
}
@media (min-width:40em) {
.sm-show-inline {
display: inline !important
}
}
@media (min-width:52em) {
.md-show-inline {
display: inline !important
}
}
@media (min-width:64em) {
.lg-show-inline {
display: inline !important
}
}
.lg-show-flex, .md-show-flex, .sm-show-flex {
display: none !important
}
@media (min-width:40em) {
.sm-show-flex {
display: -webkit-box !important;
display: -webkit-flex !important;
display: -ms-flexbox !important;
display: flex !important
}
}
@media (min-width:52em) {
.md-show-flex {
display: -webkit-box !important;
display: -webkit-flex !important;
display: -ms-flexbox !important;
display: flex !important
}
}
@media (min-width:64em) {
.lg-show-flex {
display: -webkit-box !important;
display: -webkit-flex !important;
display: -ms-flexbox !important;
display: flex !important
}
}
/* Basscss Btn */
button {
font-size: inherit;
font-weight: inherit;
width: auto;
padding: 0;
margin: 0;
width: auto;
overflow: visible;
-webkit-appearance: none;
}
.btn {
text-decoration: none;
cursor: pointer;
display: inline-block;
line-height: 1.875;
padding: .5rem 1.25rem;
font-weight: 700;
text-align: center;
border: 0;
vertical-align: middle;
-webkit-appearance: none;
color: inherit;
background-color: transparent;
box-sizing: border-box;
}
.btn:hover {
text-decoration: none;
}
.btn:focus {
outline: none;
}
::-moz-focus-inner {
border: 0;
padding: 0;
}
/* Btn Primary */
.btn-primary {
color: #fff;
background-color: #54e083;
-webkit-transition: all 50ms ease-out;
transition: all 50ms ease-out;
-webkit-border-radius: 1.25rem;
border-radius: 1.25rem;
}
.btn-primary:hover {
color: #fff;
-webkit-box-shadow: 0 2px 4px rgba(0,0,0,.15);
box-shadow: 0 2px 4px rgba(0,0,0,.15);
-webkit-transform: translate3d(0, -1px, 0);
transform: translate3d(0, -1px, 0);
}
.btn-primary:active,
.btn-primary:focus {
-webkit-box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .125), inset 0 0 1px rgba(0, 0, 0, .125);
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .125), inset 0 0 1px rgba(0, 0, 0, .125);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
-webkit-transition: all 1ms ease-out;
transition: all 1ms ease-out;
}
.btn-primary:disabled,
.btn-primary.is-disabled {
opacity: .5;
pointer-events: none;
cursor: default;
}
/* Btn Outline */
.btn-outline {
color: #111;
background-color: transparent;
-webkit-border-radius: 1.5rem;
border-radius: 1.5rem;
-webkit-box-shadow: inset 0 0 0 1px #cad1d5;
box-shadow: inset 0 0 0 1px #cad1d5;
-webkit-transition: all 50ms ease-out;
transition: all 50ms ease-out;
}
.btn-outline:hover {
color: #111;
-webkit-transform: translate3d(0,-1px,0);
transform: translate3d(0,-1px,0);
-webkit-box-shadow: inset 0 0 0 1px #bcc6cb, 0 2px 4px rgba(0,0,0,.1);
box-shadow: inset 0 0 0 1px #bcc6cb, 0 2px 4px rgba(0,0,0,.1);
}
.btn-outline:active,
.btn-outline:focus {
-webkit-box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .15), inset 0 0 0 1px #bcc6cb;
box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .15), inset 0 0 0 1px #bcc6cb;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
/* Btn Circle */
.btn-circle {
position: relative;
padding: .5rem 3.125rem .5rem 1.25rem;
overflow: hidden;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.btn-circle:after {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(18, 165, 48, .4);
-webkit-border-radius: 1.25rem 0 0 1.25rem;
border-radius: 1.25rem 0 0 1.25rem;
-webkit-transform: translate3d(calc(100% - 2.5rem), 0, 0);
transform: translate3d(calc(100% - 2.5rem), 0, 0);
-webkit-transition: all 200ms cubic-bezier(.41,.2,.79,.26);
transition: all 200ms cubic-bezier(.41,.2,.79,.26);
}
.btn-circle.btn-orange:after {
background-color: rgba(206, 53, 0, .4);
}
.btn-circle .lbl {
-webkit-font-smoothing: antialiased;
position: relative;
z-index: 1;
display: block;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transition: all 150ms cubic-bezier(.41,.2,.79,.26);
transition: all 150ms cubic-bezier(.41,.2,.79,.26);
}
.btn-circle .icon {
width: 1.25rem;
height: 1.25rem;
position: absolute;
z-index: 1;
top: .675rem;
right: .675rem;
}
.btn-circle:hover {
-webkit-box-shadow: 0 2px 4px rgba(0,0,0,.1);
box-shadow: 0 2px 4px rgba(0,0,0,.1);
-webkit-transform: translate3d(0, -1px, 0);
transform: translate3d(0, -1px, 0);
}
.btn-circle:hover .lbl {
color: #fff;
-webkit-transform: translate3d(.375rem, 0, 0);
transform: translate3d(.375rem, 0, 0);
}
.btn-circle:hover:after {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.btn-circle:active,
.btn-circle:focus {
-webkit-box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .25), inset 0 0 1px rgba(0, 0, 0, .25);
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .25), inset 0 0 1px rgba(0, 0, 0, .25);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
/* Other Btns */
.btn-small {
font-size: .8125rem;
line-height: 1.5;
padding: .375rem .75rem;
-webkit-border-radius: 1rem;
border-radius: 1rem;
}
.btn-large {
line-height: 2;
padding: .75rem 1.25rem;
-webkit-border-radius: 1.75rem;
border-radius: 1.75rem;
min-width: 14rem;
}
.btn-large.btn-circle {
padding: .75rem 4rem .75rem 1.25rem;
min-width: 0;
}
.btn-large.btn-circle:after {
-webkit-border-radius: 1.75rem 0 0 1.75rem;
border-radius: 1.75rem 0 0 1.75rem;
-webkit-transform: translate3d(calc(100% - 3.25rem), 0, 0);
transform: translate3d(calc(100% - 3.25rem), 0, 0);
}
.btn-large.btn-circle:hover:after {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.btn-large.btn-circle .icon {
width: 1.5rem;
height: 1.5rem;
position: absolute;
z-index: 1;
top: .75rem;
right: .75rem;
}
.btn-orange {
background-color: #ff821e;
}
@media (max-width: 40rem) {
.btn-mobile {
width: 100%;
text-align: center;
}
}
/* End Basscss Btn */
/* Basscss Background Images */
.bg-cover {
background-size: cover
}
.bg-contain {
background-size: contain
}
.bg-center {
background-position: center
}
.bg-top {
background-position: top
}
.bg-right {
background-position: right
}
.bg-bottom {
background-position: bottom
}
.bg-left {
background-position: left
}
.bg-no-repeat {
background-repeat: no-repeat
}
.bg-repeat-x {
background-repeat: repeat-x
}
.bg-repeat-y {
background-repeat: repeat-y
}
/* End Basscss Background Images */
/* Colors */
.white {
color: #fff
}
.black {
color: #12141d
}
.green {
color: #54e083
}
.dark-green {
color: #2fcf65
}
.blue {
color: #0b8aed
}
.gray {
color: #dfe4e8
}
.gray-blue {
color: #747f88
}
.light-blue {
color: #98a5af
}
.red {
color: #e83838
}
.orange {
color: #ff821e
}
.light-orange {
color: #C96110
}
.bg-white {
background-color: #fff
}
.bg-black {
background-color: #12141d
}
.bg-dark-gray {
background-color: #ccd2d8
}
.bg-gray {
background-color: #f0f2f4
}
.bg-light-gray {
background-color: #f8f8f8
}
.bg-green {
background-color: #54e083
}
.bg-dark-green {
background-color: #2fcf65
}
.bg-blue {
background-color: #0b8aed
}
.bg-light-blue {
background-color: #f2f9ff
}
.bg-red {
background-color: #e83838
}
.bg-orange {
background-color: #ff821e
}
.bg-light-orange {
background-color: #fff6ef
}
.bg-yellow {
background-color: #ffcc00
}
.border-white {
border-color: #fff
}
.border-black {
border-color: #000
}
.border-medium-gray {
border-color: #c5ccd1
}
.border-gray {
border-color: #e2e6ea
}
.border-light-gray {
border-color: #e9edf0
}
.border-dark-green {
border-color: #55ce7c
}
.fill-white {
fill: #fff
}
.fill-black {
fill: #1a1e27
}
.fill-gray {
fill: #98a5af
}
.fill-light-gray {
fill: #dcdcdc
}
.fill-green {
fill: #54e083
}
.fill-dark-green {
fill: #2fcf65
}
.fill-blue {
fill: #0b8aed
}
.fill-light-blue {
fill: #a4adb5
}
.fill-gray-blue {
fill: #778894
}
.fill-red {
fill: #e83838
}
.fill-orange {
fill: #ff821e
}
.fill-yellow {
fill: #ffcc00
}
.fill-current {
fill: currentColor
}
/* Global */
body {
margin: 0;
font-family: "proxima-nova", Helvetica, Arial, sans-serif;
line-height: 1.5;
color: #1a1e27;
background-color: #fff;
overflow-x: hidden;
}
html {
overflow-x: hidden;
}
p {
margin-top: 0;
margin-bottom: 1.5rem;
}
a {
color: #0b8aed;
text-decoration: underline;
-webkit-transition: color 75ms;
transition: color 75ms;
}
a:hover {
color: currentColor;
text-decoration: underline;
}
header, main, section {
display: block;
}
.opac-0 {
opacity: 0
}
.opac-25 {
opacity: .25
}
.opac-50 {
opacity: .5
}
.opac-75 {
opacity: .75
}
.opac-100 {
opacity: 1
}
.pointer {
cursor: pointer
}
/* Custom Typography */
.body {
font-family: "proxima-nova", Helvetica, Arial, sans-serif;
}
.heading {
font-family: "futura-pt", "proxima-nova", Helvetica, Arial, sans-serif;
}
.huge {
font-size: 3rem;
line-height: .875;
}
@media (min-width: 52em) {
.huge {
font-size: 5rem;
}
}
.line-height-1 {
line-height: 1
}
.line-height-2 {
line-height: 1.25
}
.line-height-3 {
line-height: 1.5
}
.line-height-4 {
line-height: 1.75
}
.letter-spacing-25 {
letter-spacing: 0.025em
}
.letter-spacing-50 {
letter-spacing: 0.05em
}
.letter-spacing-75 {
letter-spacing: 0.075em
}
.letter-spacing-100 {
letter-spacing: 0.1em
}
/* End Custom Typography */
/* Link Styles */
a.underline-link,
.underline-link a {
text-decoration: none;
}
a.underline-link:hover,
.underline-link a:hover {
text-decoration: underline;
}
a.black-link, .black-link {
color: #12141d;
}
a.black-link:hover, .black-link:hover {
color: #2fcf65;
}
a.blue-link, .blue-link {
color: #0b8aed;
}
a.blue-link:hover, .blue-link:hover {
color: #12141d;
}
.lift-link {
-webkit-transition: transform 100ms ease-out;
transition: transform 100ms ease-out;
}
.lift-link:hover {
-webkit-transform: translateY(-.15rem);
transform: translateY(-.15rem);
}
.bounce-link:hover {
-webkit-animation: bounce 400ms forwards cubic-bezier(.1, 1.45, .35, 1);
animation: bounce 400ms forwards cubic-bezier(.1, 1.45, .35, 1);
}
@-webkit-keyframes bounce {
0% {
-webkit-transform: translateY(0);
}
50% {
-webkit-transform: translateY(.125rem);
}
100% {
-webkit-transform: translateY(0);
}
}
@keyframes bounce {
0% {
transform: translateY(0);
}
50% {
transform: translateY(.125rem);
}
100% {
transform: translateY(0);
}
}
.list-link {
text-decoration: none;
color: inherit;
}
.list-link:hover {
text-decoration: none;
background-color: rgba(0,0,0,.03);
}
.list-link:active {
background-color: #e6f4ff;
}
/* End Link Styles */
/* Containers */
.container, .sm-container, .md-container, .lg-container {
width: 100%;
box-sizing: border-box;
max-width: 64rem;
margin-left: auto;
margin-right: auto
}
.sm-container {
max-width: 40rem;
}
.md-container {
max-width: 52rem;
}
.lg-container {
max-width: 76rem;
}
.xl-container {
max-width: 94rem;
}
/* End Containers */
/* Icons */
.icon {
display: inline-block;
vertical-align: middle;
width: 1.5rem;
height: 1.5rem;
padding-bottom: 5px;
}
.xs-icon {
display: inline-block;
vertical-align: top;
width: .375rem;
height: .375rem;
}
.sm-icon {
display: inline-block;
vertical-align: top;
width: .675rem;
height: .675rem;
}
.md-icon {
display: inline-block;
vertical-align: top;
width: 1.5rem;
height: 1.5rem;
}
.lg-icon {
display: inline-block;
vertical-align: top;
width: 2rem;
height: 2rem;
}
.xl-icon {
display: inline-block;
vertical-align: top;
width: 2.375rem;
height: 2.375rem;
}
.xxl-icon {
display: inline-block;
vertical-align: top;
width: 2.875rem;
height: 2.875rem;
}
.xxxl-icon {
display: inline-block;
vertical-align: top;
width: 3.5rem;
height: 3.5rem;
}
.logo {
max-width: 9rem;
width: 100%;
vertical-align: middle;
}
@media (min-width: 60em) {
.logo {
max-width: 10rem;
}
}
@media (min-width: 65em) {
.logo {
max-width: 15rem;
}
}
.only-show-in-mobile {
display: none !important;
}
@media (max-width: 64em) {
.only-show-in-mobile {
display: block !important;
}
}
.flag {
display: inline-block;
vertical-align: top;
width: 1.5rem;
}
.icon svg,
.xs-icon svg,
.sm-icon svg,
.md-icon svg,
.lg-icon svg,
.logo svg {
vertical-align: top;
}
.icon-ml {
margin-left: .325rem
}
.icon-mr {
margin-right: .325rem
}
.icon-mt {
margin-top: .3rem
}
.icon-mb {
margin-bottom: .3rem
}
.icon-input-padding {
padding-left: 3.5rem;
}
/* End Icons */
/* Responsive Cover Images */
.cover-img-parent {
max-height: 100%;
overflow: hidden;
position: relative;
}
.cover-img-parent img {
position: relative;
height: auto;
left: 50%;
max-width: 200%;
min-height: 100%;
min-width: 100%;
width: auto;
top: 50%;
-ms-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.cover-img-parent img.small {
max-width: 150%;
}
/* For browsers that support 'object-fit' */
@supports ( object-fit: cover ) {
.cover-img-parent img {
height: 100%;
left: 0;
-o-object-fit: cover;
object-fit: cover;
top: 0;
-ms-transform: none;
-moz-transform: none;
-webkit-transform: none;
transform: none;
width: 100%;
}
}
/* Heights */
.vh100 {
height: 100vh
}
.full-height {
height: 100%
}
/* Minified responsive heights */
.h-5 {
height: 5rem
}
.h-10 {
height: 10rem
}
.h-13 {
height: 13rem
}
.h-15 {
height: 15rem
}
.h-20 {
height: 20rem
}
.h-25 {
height: 25rem
}
.h-30 {
height: 30rem
}
.h-35 {
height: 35rem
}
.h-40 {
height: 40rem
}
.h-50 {
height: 50rem
}
@media (min-width:40em) {
.sm-h-10 {
height: 10rem
}
.sm-h-13 {
height: 13rem
}
.sm-h-15 {
height: 15rem
}
.sm-h-20 {
height: 20rem
}
.sm-h-25 {
height: 25rem
}
.sm-h-30 {
height: 30rem
}
.sm-h-35 {
height: 35rem
}
.sm-h-40 {
height: 40rem
}
.sm-h-50 {
height: 50rem
}
}
@media (min-width:52em) {
.md-h-10 {
height: 10rem
}
.md-h-13 {
height: 13rem
}
.md-h-15 {
height: 15rem
}
.md-h-20 {
height: 20rem
}
.md-h-25 {
height: 25rem
}
.md-h-30 {
height: 30rem
}
.md-h-35 {
height: 35rem
}
.md-h-40 {
height: 40rem
}
.md-h-50 {
height: 50rem
}
}
@media (min-width:64em) {
.lg-h-10 {
height: 10rem
}
.lg-h-13 {
height: 13rem
}
.lg-h-15 {
height: 15rem
}
.lg-h-20 {
height: 20rem
}
.lg-h-25 {
height: 25rem
}
.lg-h-30 {
height: 30rem
}
.lg-h-35 {
height: 35rem
}
.lg-h-40 {
height: 40rem
}
.lg-h-50 {
height: 50rem
}
}
@media (min-width:76em) {
.xl-h-10 {
height: 10rem
}
.xl-h-13 {
height: 13rem
}
.xl-h-15 {
height: 15rem
}
.xl-h-20 {
height: 20rem
}
.xl-h-25 {
height: 25rem
}
.xl-h-30 {
height: 30rem
}
.xl-h-35 {
height: 35rem
}
.xl-h-40 {
height: 40rem
}
.xl-h-50 {
height: 50rem
}
}
@media (min-width:90em) {
.xxl-h-10 {
height: 10rem
}
.xxl-h-13 {
height: 13rem
}
.xxl-h-15 {
height: 15rem
}
.xxl-h-20 {
height: 20rem
}
.xxl-h-25 {
height: 25rem
}
.xxl-h-30 {
height: 30rem
}
.xxl-h-35 {
height: 35rem
}
.xxl-h-40 {
height: 40rem
}
.xxl-h-50 {
height: 50rem
}
}
.center-all {
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.center-y {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.center-x {
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
/* End Heights */
/* Lazyload / images */
.no-js .lazyload {
display: none;
}
.js .fade-in {
opacity: 0;
}
.fade-in.visible {
-webkit-transition: opacity 600ms ease-in;
transition: opacity 600ms ease-in;
opacity: 1;
}
.fade-in.lazyloaded {
-webkit-animation: fadein 750ms ease-in forwards;
animation: fadein 750ms ease-in forwards;
}
@-webkit-keyframes fadein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
/* End Lazyload / images */
/* Nav */
.header-nav > li > a {
text-decoration: none;
position: relative;
padding: .5rem .75rem;
}
@media (max-width: 52em) {
.header-nav > li > a {
padding: .5rem .25rem;
}
.header-nav > li .lg-icon {
width: 1.75rem;
height: 1.75rem;
}
}
.header-nav > li > a:hover {
color: #12141d;
}
.footer-nav a {
text-decoration: none;
color: #747f88;
display: block;
padding: .125rem 0;
}
.footer-nav a:hover {
color: #12141d;
text-decoration: underline;
}
.sitemap-nav a {
text-decoration: none;
display: block;
padding: .25rem 0;
line-height: 1.2em;
position: relative;
}
.sitemap-nav a:hover {
text-decoration: underline;
}
.sitemap-nav a:before {
content: '-';
position: absolute;
left: -1rem;
top: .2rem;
color: #12141d;
}
.bubble {
min-width: .875rem;
height: .875rem;
padding: .125rem;
text-align: center;
line-height: .9375rem;
position: absolute;
font-size: 11px;
top: .25rem;
right: .25rem;
-webkit-border-radius: 50%;
border-radius: 50%;
}
@media(max-width: 40em) {
.bubble {
top: .25rem;
right: -.25rem;
}
}
.main-nav > li {
position: relative;
}
.main-nav > li > a {
display: block;
padding: .5rem 1rem;
}
.main-nav > li > a.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.main-nav a,
.main-nav .fake-link {
color: #12141d;
position: relative;
text-decoration: none;
cursor: pointer;
}
.main-nav a:hover,
.main-nav .fake-link:hover,
.main-nav a.active,
.main-nav .fake-link.active {
color: #2fcf65;
text-decoration: underline;
}
@media (max-width: 52em) {
.main-nav > li {
display: block;
border-bottom: 1px solid #e2e6ea;
}
.main-nav > li > a,
.main-nav > li > .fake-link {
padding: .75rem 1rem;
}
}
.dropdown {
position: relative;
}
.dropdown .dd-content {
display: none;
}
li.dropdown:hover > a {
color: #2fcf65;
background-color: #fafafa;
-webkit-box-shadow: 0 1px 0 #fafafa, 0 0 0 1px #c5ccd1;
box-shadow: 0 1px 0 #fafafa, 0 0 0 1px #c5ccd1;
}
@media (min-width: 52rem) {
.dd-content a {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: .375rem 1rem;
}
.dd-content a:before {
content: "";
display: inline-block;
margin-right: .5rem;
background-color: #12141d;
height: 1px;
width: 4px;
margin-top: .675rem;
}
}
@media (max-width: 52rem) {
.main-nav > li > a, .main-nav > li > .fake-link {
font-weight: 700;
}
.dd-content a {
display: block;
width: 100%;
box-sizing: border-box;
padding: .75rem 2rem;
border-top: 1px solid #e2e6ea;
}
}
@media (min-width: 52em) {
/* Drop down sub nav */
.dropdown .dd-content, .subnav .sn-content {
display: none;
background-color: #fafafa;
position: absolute;
left: 0;
padding-top: .5rem;
padding-bottom: 2rem;
z-index: 10;
min-width: 16rem;
margin-top: 1px;
opacity: 0;
-webkit-transition: opacity 200ms;
transition: opacity 200ms;
-webkit-box-shadow: 0 0 0 1px #c5ccd1, 0px 4px 16px -8px rgba(0,0,0,0.15);
box-shadow: 0 0 0 1px #c5ccd1, 0px 4px 16px -8px rgba(0,0,0,0.15);
}
.dropdown .dd-content.wide {
min-width: 20rem;
}
.dropdown:hover > .dd-content, .dropdown.show > .dd-content {
display: block;
-webkit-animation: showsub 300ms forwards cubic-bezier(.1, 1.45, .35, 1);
animation: showsub 300ms forwards cubic-bezier(.1, 1.45, .35, 1);
-webkit-transform-origin: top left;
transform-origin: top left;
}
.dropdown:hover > a,
.dropdown.show > a {
z-index: 102;
}
.dropdown:hover > .dd-content {
z-index: 101;
opacity: 1;
}
/* Sub sub nav */
li.subnav {
position: relative;
}
.subnav .sn-content {
min-width: 20rem;
left: 16rem;
top: 0;
margin-top: 0;
margin-left: 1px;
z-index: -1;
}
.dropdown .dd-content.wide .subnav .sn-content {
left: 20rem;
}
li.subnav:hover {
position: relative;
z-index: 12;
-webkit-box-shadow: 1px 0 0 #fafafa, 0 0 0 1px #c5ccd1;
box-shadow: 1px 0 0 #fafafa, 0 0 0 1px #c5ccd1;
background-color: #fafafa;
}
li.subnav:hover > a {
background-color: #fafafa;
-webkit-box-shadow: 1px 0 0 #fafafa;
box-shadow: 1px 0 0 #fafafa;
padding-top: .75rem;
padding-bottom: .75rem;
}
.subnav:hover > .sn-content, .subnav.show > .sn-content {
opacity: 1;
display: block;
-webkit-animation: showsub 300ms forwards cubic-bezier(.1, 1.45, .35, 1);
animation: showsub 300ms forwards cubic-bezier(.1, 1.45, .35, 1);
-webkit-transform-origin: top left;
transform-origin: top left;
}
}
@media (max-width: 52em) {
.sn-content {
background-color: rgba(0,0,0,.03);
}
.sn-content a {
padding-left: 2.5rem;
padding-top: .5rem;
padding-bottom: .5rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.sn-content a:before {
content: "";
display: inline-block;
margin-right: .5rem;
border-left: 1px solid rgba(0,0,0,.5);
border-bottom: 1px solid rgba(0,0,0,.5);
height: 3px;
width: 6px;
margin-top: .5rem;
}
}
.dropdown .dd-content.expand {
display: block;
}
.foldout {
position: relative;
}
.foldout .fo-content {
display: none;
}
.ghost-click {
display: none;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9;
}
@media (max-width: 52em) {
.ghost-click {
background-color: rgba(0,0,0,.3);
}
}
.ghost-click.show {
display: block;
}
.foldout .fo-content {
display: none;
background-color: #fff;
position: absolute;
z-index: 10;
width: 17rem;
opacity: 0;
margin-top: 1px;
-webkit-transition: opacity 200ms;
transition: opacity 200ms;
-webkit-box-shadow: 0 0 0 1px #c5ccd1, 0px 8px 16px -8px rgba(0,0,0,0.15);
box-shadow: 0 0 0 1px #c5ccd1, 0px 8px 16px -8px rgba(0,0,0,0.15);
}
.foldout .fo-login {
right: -2.25rem;
}
@media (min-width: 52em) {
.foldout .fo-content {
width: 20rem;
}
.foldout .sm-fo-content {
width: 16rem;
}
.foldout .fo-login {
right: 0;
}
}
.foldout.show > .fo-content {
display: block;
z-index: 101;
opacity: 1;
-webkit-animation: showsub 300ms forwards cubic-bezier(.1, 1.45, .35, 1);
animation: showsub 300ms forwards cubic-bezier(.1, 1.45, .35, 1);
-webkit-transform-origin: top right;
transform-origin: top right;
}
.foldout.show > a {
z-index: 102;
color: #12141d;
background-color: #fff;
-webkit-box-shadow: 0 1px 0 #fff, 0 0 0 1px #c5ccd1;
box-shadow: 0 1px 0 #fff, 0 0 0 1px #c5ccd1;
}
@-webkit-keyframes showsub {
0% {
-webkit-transform: scale(.65);
}
50% {
-webkit-transform: scale(1.02);
}
100% {
-webkit-transform: scale(1);
}
}
@keyframes showsub {
0% {
transform: scale(.65);
}
50% {
transform: scale(1.02);
}
100% {
transform: scale(1);
}
}
.flags li a, .flags li label {
display: block;
position: relative;
cursor: pointer;
}
.flags li a:hover, .flags li label:hover {
-webkit-transform: translateY(-1px);
transform: translateY(-1px);
}
.flags li.active a {
padding-left: .25rem;
padding-right: .25rem;
-webkit-box-shadow: 0 0 0 1px #0b8aed;
box-shadow: 0 0 0 1px #0b8aed;
}
.flags-radio input[type="radio"] {
height: 1px;
width: 1px;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translate(-25%, -75%);
transform: translate(-25%, -75%);
z-index: -1;
opacity: 0;
}
.flags-radio input[type="radio"]:checked + img {
padding-left: .25rem;
padding-right: .25rem;
-webkit-box-shadow: 0 0 0 1px #0b8aed;
box-shadow: 0 0 0 1px #0b8aed;
}
input[type="checkbox"].side-nav-check, input[type="checkbox"].filters-popup-check {
height: 1px !important;
width: 1px !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
z-index: -1 !important;
opacity: 0 !important;
}
@media (max-width: 52em) {
.side-nav {
background-color: #fafafa;
border: 0;
z-index: 200;
position: fixed;
top: 0;
bottom: 0;
right: 0;
width: 100%;
-webkit-transform: translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
-o-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
-moz-transition: -moz-transform 200ms ease-in-out;
-webkit-transition: -webkit-transform 200ms ease-in-out;
-o-transition: -o-transform 200ms ease-in-out;
transition: transform 200ms ease-in-out;
}
input[type="checkbox"].side-nav-check:checked + .side-nav {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
overflow-x: hidden;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
html.menu-open, html.menu-open body {
overflow: hidden;
}
}
/* End Nav */
/* Common Layout Elements */
/* Header */
.header {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 103;
}
.header.stick {
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.1);
box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
@media (max-width: 52em) {
.header.stick {
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
}
.ghost-header {
height: 5rem;
}
@media (max-width: 52em) {
.ghost-header {
height: 7rem;
}
.search-bar {
padding: .5rem;
background-color: #fff;
width: 100%;
box-sizing: border-box;
}
}
@media (min-width: 52em) {
.search-bar {
position: absolute;
z-index: 104;
width: auto;
left: 50%;
top: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
}
}
/* Breadcrumb */
.breadcrumb a:after {
content: "-";
display: inline-block;
margin-left: .5rem;
margin-right: .5rem;
color: #12141d;
}
.breadcrumb .no-after:after {
display: none;
}
/* Popup message */
.popup-msg {
width: 20rem;
display: none;
opacity: 0;
}
.popup-msg.show {
display: block;
-webkit-animation: toast 250ms forwards cubic-bezier(.08,.54,.95,.56);
animation: toast 250ms forwards cubic-bezier(.08,.54,.95,.56);
-webkit-animation-delay: 200ms;
animation-delay: 200ms;
-webkit-transform-origin: top right;
transform-origin: top right;
}
.popup-msg .message {
background: #fafafa;
position: relative;
-webkit-border-radius: .25rem;
border-radius: .25rem;
border: 1px solid #e2e6ea;
-webkit-box-shadow: 0 4px 16px rgba(0,0,0,.1);
box-shadow: 0 4px 16px rgba(0,0,0,.1);
}
.popup-msg .message:after, .popup-msg .message:before {
bottom: 100%;
right: 1.5rem;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.popup-msg .message:after {
border-color: rgba(250, 250, 250, 0);
border-bottom-color: #fafafa;
border-width: 8px;
margin-right: -8px;
}
.popup-msg .message:before {
border-color: rgba(226, 230, 234, 0);
border-bottom-color: #e2e6ea;
border-width: 9px;
margin-right: -9px;
}
@media (max-width: 52em) {
.popup-msg .message:after, .popup-msg .message:before {
right: 1rem;
}
}
@-webkit-keyframes toast {
0% {
-webkit-transform: translate3d(0, 80%, 0);
opacity: 0;
}
50% {
-webkit-transform: translate3d(0, -5%, 0);
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes toast {
0% {
transform: translate3d(0, 80%, 0);
opacity: 0;
}
50% {
transform: translate3d(0, -5%, 0);
opacity: 1;
}
100% {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
/* Pagination */
.pagination {
line-height: 2rem;
}
.pagination a, .pagination span {
display: block;
min-width: 2rem;
height: 2rem;
box-sizing: border-box;
padding-left: .5rem;
padding-right: .5rem;
text-decoration: none;
text-align: center;
-webkit-border-radius: 1rem;
border-radius: 1rem;
}
.pagination a.active {
color: #12141d;
-webkit-box-shadow: inset 0 0 0 1px #e2e6ea;
box-shadow: inset 0 0 0 1px #e2e6ea;
margin-left: .5rem;
margin-right: .5rem;
}
.pagination li:first-child a.active {
margin-left: 0
}
.pagination li:last-child a.active {
margin-right: 0
}
/* List nav */
.list-nav li {
border-top: 1px solid #e9edf0;
}
.list-nav li:first-child {
border-top: 0;
}
.list-nav a {
display: block;
padding-top: .5rem;
padding-bottom: .5rem;
text-decoration: none;
-webkit-transition: all 100ms;
transition: all 100ms;
}
.list-nav a:hover {
text-decoration: underline;
-webkit-transform: translateX(.25em);
transform: translateX(.25em);
}
.list-nav .active a, .list-nav a.active {
text-decoration: underline;
color: #12141d;
}
/* Boxes */
.box-shadow {
-webkit-box-shadow: 0 2px 6px rgba(0,0,0,.05);
box-shadow: 0 2px 6px rgba(0,0,0,.05);
}
.border-box-shadow {
-webkit-box-shadow: 0 0 0 1px #e2e6ea;
box-shadow: 0 0 0 1px #e2e6ea;
}
/* End Common Layout Elements */
/* Lister Page */
.filters label.checkbox {
padding: .25rem 0 .25rem 1.5rem;
}
.filters label.checkbox .box {
height: 1rem;
width: 1rem;
padding: 2px;
left: 0;
top: .25rem;
}
.filters label.checkbox {
line-height: 1.375;
}
.filters label.checkbox:hover .lbl {
color: #0b8aed;
text-decoration: underline;
}
.filters label.checkbox input[type="checkbox"]:checked ~ .lbl {
font-weight: 700;
}
@media (min-width: 64em) {
.filters {
width: 10rem;
margin-right: 2rem;
}
}
@media (min-width: 76em) {
.filters {
width: 13rem;
margin-right: 4rem;
}
}
@media (max-width: 52em) {
.filters {
background-color: #fafafa;
border: 0;
z-index: 200;
position: fixed;
top: 0;
bottom: 0;
right: 0;
width: 100%;
-webkit-transform: translate3d(0, 100%, 0);
-moz-transform: translate3d(0, 100%, 0);
-o-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
-moz-transition: -moz-transform 300ms ease-in-out;
-webkit-transition: -webkit-transform 300ms ease-in-out;
-o-transition: -o-transform 300ms ease-in-out;
transition: transform 300ms ease-in-out;
}
input[type="checkbox"].filters-popup-check:checked + .filters {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
overflow: hidden;
}
.mobile-scrollable {
position: absolute;
z-index: 1;
top: 0;
right: 0;
left: 0;
height: 100%;
box-sizing: border-box;
overflow-y: auto;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
/* keep this in because of bugs */
-webkit-transform: translateZ(0px);
-webkit-transform: translate3d(0,0,0);
-webkit-perspective: 1000;
}
}
.product {
width: 100%;
background-color: #fff;
border-bottom: 1px solid #e2e6ea;
}
.dimensions-cell {
display: none;
}
.cta-cell {
flex-grow: 1;
}
.cta-cell .price {
text-align: right;
width: 8rem;
}
.cta-cell .btn-primary {
white-space: nowrap;
}
@media (min-width: 52em) {
.product .cell {
border-right: 1px dashed #e9edf0;
margin-right: -1px;
}
.product .cell:last-child {
border-right: 0;
margin-right: 0;
}
.product-cell {
width: 44%
}
.stock-cell {
width: 9%;
}
.stock-cell-edischaeffler {
width: 250px;
height:auto;
}
}
@media (min-width: 76em) {
.product-cell {
width: 32%
}
.dimensions-cell {
width: 21%;
display: flex;
}
.products-head .dimensions-cell {
display: block
}
}
@media(min-width: 52rem) and (max-width: 64rem){
.cta-cell > div {
flex-direction: column;
align-items: end;
}
.cta-cell > div .price {
height: 2.5rem;
margin-bottom: 2rem;
}
.cta-cell > div .price .vat {
bottom: 0;
}
}
.product-img {
width: 5rem;
max-width: initial;
}
.sm-product-img {
max-width: 3.5rem;
max-height: 3.5rem;
height: auto;
width: 100%;
}
.md-product-img {
max-width: 5rem;
max-height: 5rem;
height: auto;
width: 100%;
}
.lg-product-img {
max-width: 12.5rem;
max-height: 12.5rem;
height: auto;
width: 100%;
}
.stock {
list-style: none;
padding-left: 0;
letter-spacing: -.31em;
line-height: 1rem;
}
.stock li {
letter-spacing: normal;
display: inline-block;
width: .5rem;
height: .5rem;
margin-right: 3px;
-webkit-border-radius: 50%;
border-radius: 50%;
}
.stock li:last-child {
margin-right: 0;
}
.price {
display: inline-block;
font-size: 1.5rem;
line-height: 1;
font-weight: 700;
position: relative;
}
.price b {
font-size: .8125rem;
margin-right: -.125rem;
vertical-align: top;
line-height: 1.4;
}
.price em {
font-size: 1rem;
font-style: normal;
line-height: 1.15;
vertical-align: top;
}
.price .old, .price .vat {
-webkit-box-flex: 0;
-webkit-flex: none;
-ms-flex: none;
flex: none;
font-weight: 400;
font-size: .8125rem;
position: absolute;
}
.price .old {
left: -1rem;
top: -1rem;
text-decoration: line-through;
}
.price .vat {
right: 0;
bottom: -1rem;
}
.lg-price {
font-size: 3rem;
padding-right: 2.5rem;
}
.lg-price b {
font-size: 1.25rem;
margin-right: -.25rem;
line-height: 1.6;
}
.lg-price em {
font-size: 1.5rem;
line-height: 1.3;
}
.lg-price .old, .lg-price .vat {
font-size: .875rem;
}
.lg-price .vat {
bottom: .375rem;
}
@media (max-width: 52em) {
.price .old {
left: 0;
top: -1rem;
text-decoration: line-through;
}
}
.price.simple .old {
position: relative;
top: 0;
left: 0;
}
.feature-product {
max-width: 15rem;
}
.sticker {
width: 6rem;
height: 6rem;
text-align: center;
}
.sticker .price {
width: 100%;
}
.sticker .price .old {
-webkit-box-flex: 0;
-webkit-flex: none;
-ms-flex: none;
flex: none;
font-weight: 400;
font-size: .8125rem;
position: relative;
left: 0;
top: 0;
display: block;
margin-bottom: .25rem;
}
@media (min-width: 52em) {
.banner {
max-width: 50%;
width: 50%;
}
}
.results.blur {
position: relative;
-webkit-filter: blur(4px);
-moz-filter: blur(4px);
-o-filter: blur(4px);
-ms-filter: blur(4px);
filter: blur(4px);
opacity: .5;
position: relative;
}
.results.blur::after {
content: '';
display: block;
top: 0;
right: 0;
bottom: 0;
left: 0;
position: absolute;
z-index: 99;
}
/* End Lister Page */
/* Product Page */
.js .excerpted {
overflow: hidden;
max-height: 180px;
position: relative;
}
.js .excerpted::after {
content: '';
display: block;
height: 8rem;
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: #fff;
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 85%);
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 85%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 85%);
}
.js .expandable {
display: none;
}
@media (max-width: 52em) {
.js .mob-expandable {
display: none;
}
}
.specs li {
letter-spacing: -.31em;
margin-bottom: .5rem;
}
.specs .lbl {
display: inline-block;
letter-spacing: normal;
width: 45%;
vertical-align: top;
padding-right: 5%;
}
.specs .value {
display: inline-block;
letter-spacing: normal;
width: 50%;
font-size: .875rem;
color: #747f88;
}
@media (min-width: 40em) {
.specs .lbl {
width: 35%;
}
.specs .value {
width: 60%;
}
}
@media (min-width: 52em) {
.specs .lbl {
width: 25%;
}
.specs .value {
width: 70%;
}
}
.gallery li {
display: none;
}
.gallery li.visible {
display: block;
-webkit-animation: fadein 300ms ease-in forwards;
animation: fadein 300ms ease-in forwards;
}
.gallery img {
max-height: 20rem;
max-width: 100%;
}
@media (max-width: 52em) {
.gallery img {
max-height: 15rem;
}
}
.thumbnails li {
width: 3rem;
height: 3rem;
margin-right: .5rem;
margin-bottom: .5rem;
cursor: pointer;
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,.15);
box-shadow: 0 0 0 1px rgba(0,0,0,.15);
-webkit-transition: all 100ms;
transition: all 100ms;
}
.thumbnails li:hover, .thumbnails li.active {
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,.5);
box-shadow: 0 0 0 1px rgba(0,0,0,.5);
}
.thumbnails li:active {
-webkit-transform: translateY(1px);
transform: translateY(1px);
opacity: .6;
-webkit-transition: all 10ms;
transition: all 10ms;
}
.thumbnails li:last-child {
margin-right: 0;
}
.thumbnails img {
max-width: 100%;
max-height: 100%;
vertical-align: top;
}
@media (max-width: 52em) {
.thumbnails li {
-webkit-box-shadow: inset 0 0 0 20rem rgba(0,0,0,.15);
box-shadow: inset 0 0 0 20rem rgba(0,0,0,.15);
width: .5rem;
height: .5rem;
border-radius: 50%;
}
.thumbnails li:hover, .thumbnails li.active {
-webkit-box-shadow: inset 0 0 0 20rem rgba(0,0,0,.5);
box-shadow: inset 0 0 0 20rem rgba(0,0,0,.5);
}
.thumbnails img {
display: none;
}
.gallery-nav-prev, .gallery-nav-next {
position: absolute;
top: 48%;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
fill: #98a5af;
}
.gallery-nav-prev:hover, .gallery-nav-next:hover,
.gallery-nav-prev:active, .gallery-nav-next:active {
fill: #1a1e27;
}
.gallery-nav-prev {
left: -1rem;
}
.gallery-nav-next {
right: -1rem;
}
}
.rating {
list-style: none;
padding-left: 0;
letter-spacing: -.31em;
}
.rating li {
letter-spacing: normal;
display: inline-block;
margin-right: 4px;
}
.rating li:last-child {
margin-right: 0;
}
.plus-min {
-webkit-transition: all 100ms;
transition: all 100ms;
cursor: pointer;
user-select: none;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
}
.plus-min:hover {
fill: #12141d;
}
.plus-min:active, .plus-min:focus {
-webkit-transform: translateY(1px);
transform: translateY(1px);
}
/* End Product Page */
/* Cart / Checkout / Account Pages */
/*.cart-product-cell {
width: 100%
}
.cart-delivery-cell {
width: 100%
}
.cart-quantity-cell {
width: 55%
}
.cart-total-cell {
width: 45%
}
@media (min-width: 52em) {
.cart-product-cell {
width: 33%
}
.cart-delivery-cell {
width: 33%
}
.cart-quantity-cell {
width: 17%
}
.cart-total-cell {
width: 17%
}
}
@media (min-width: 76em) {
.cart-product-cell {
width: 37%
}
.cart-delivery-cell {
width: 25%
}
.cart-quantity-cell {
width: 25%
}
.cart-total-cell {
width: 13%
}
}*/
.wizard li {
position: relative;
background: #fff;
border: 1px solid #e2e6ea;
height: 36px;
line-height: 36px;
text-align: center;
width: 100%;
}
.wizard li:after, .wizard li:before {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index: 2;
}
.wizard li:after {
border-color: rgba(255, 255, 255, 0);
border-left-color: #fff;
border-width: 18px;
margin-top: -18px;
}
.wizard li:before {
border-color: rgba(226, 230, 234, 0);
border-left-color: #e2e6ea;
border-width: 19px;
margin-top: -19px;
}
.wizard li:last-child:after, .wizard li:last-child:before {
display: none;
}
.wizard .lbl {
opacity: .5;
}
.wizard li.active {
background-color: #e6f4ff;
border-color: #bfd9ee;
}
.wizard li.active:after {
border-color: rgba(240, 242, 244, 0);
border-left-color: #e6f4ff;
}
.wizard li.active:before {
border-color: rgba(240, 242, 244, 0);
border-left-color: #bfd9ee;
}
.wizard li.active .lbl {
font-weight: 700;
opacity: 1;
}
.wizard a.lbl {
color: #12141d;
text-decoration: none;
}
.wizard a.lbl:hover {
color: #12141d;
opacity: 1;
}
.checkout-header {
padding-left: 3rem;
padding-right: 1rem;
}
.checkout-option-cell {
width: 100%
}
.checkout-delivery-cell {
width: 100%
}
.checkout-costs-cell {
width: 100%
}
@media (min-width: 52em) {
.checkout-option-cell {
width: 40%
}
.checkout-delivery-cell {
width: 40%
}
.checkout-costs-cell {
width: 20%
}
}
.order-number-cell {
width: 100%
}
.order-date-cell {
width: 100%
}
.order-amount-cell {
width: 55%
}
.order-status-cell {
width: 45%
}
@media (min-width: 52em) {
.order-number-cell {
width: 30%
}
.order-date-cell {
width: 30%
}
.order-amount-cell {
width: 20%
}
.order-status-cell {
width: 20%
}
}
@media (min-width: 76em) {
.order-number-cell {
width: 30%
}
.order-date-cell {
width: 25%
}
.order-amount-cell {
width: 25%
}
.order-status-cell {
width: 20%
}
}
/* End Cart / Checkout / Account Pages */
/* Forms */
label {
vertical-align: middle;
}
input,
select,
textarea,
fieldset {
font-family: inherit;
font-size: 1em;
font-weight: 500;
box-sizing: border-box;
margin: 0;
}
input,
select,
textarea {
border: 0;
-webkit-border-radius: .5rem;
border-radius: .5rem;
-webkit-box-shadow: inset 0 0 0 1px #d2d7dd, inset 0 1px 3px -1px rgba(0,0,0,.15);
box-shadow: inset 0 0 0 1px #d2d7dd, inset 0 1px 3px -1px rgba(0,0,0,.15);
-webkit-transition: -webkit-box-shadow 300ms;
transition: box-shadow 300ms;
}
input:focus,
select:focus,
textarea:focus {
-webkit-box-shadow: inset 0 0 0 2px #0b8aed, 0 2px 8px rgba(0,0,0,.15);
box-shadow: inset 0 0 0 2px #0b8aed, 0 2px 8px rgba(0,0,0,.15);
outline: none;
}
input, select {
padding: .5em 1em;
vertical-align: middle;
-webkit-appearance: none;
max-width: 26rem;
}
input {
height: 2.75em;
}
.input-medium {
height: 3.375rem;
}
select {
padding-right: 1.675rem;
height: 2.75em;
background-image: linear-gradient(45deg, transparent 50%, #000 50%), linear-gradient(135deg, #000 50%, transparent 50%);
background-position: calc(100% - 16px) calc(1.25em + 2px), calc(100% - 12px) calc(1.25em + 2px);
background-size: 4px 4px, 4px 4px;
background-repeat: no-repeat;
}
select:focus {
background-image: linear-gradient(45deg, transparent 50%, #000 50%), linear-gradient(135deg, #000 50%, transparent 50%);
}
.sm-input {
height: 2rem;
width: 3rem;
-webkit-border-radius: .25rem;
border-radius: .25rem;
padding-left: .25rem;
padding-right: .25rem;
text-align: center;
}
@media (max-width: 52em) {
.sm-input {
font-size: 1rem;
}
}
.md-input {
max-width: 14rem !important;
height: 2rem;
-webkit-border-radius: .25rem;
border-radius: .25rem;
padding-left: .75rem;
padding-right: .25rem;
}
.lg-input {
height: 3.5rem;
max-width: 15rem !important;
}
textarea {
line-height: 1.75;
padding: .5em .5em;
min-height: 9em;
display: block;
}
::-webkit-input-placeholder {
color: rgba(26,30,39,.5);
font-weight: 400;
}
::-moz-placeholder {
color: rgba(26,30,39,.5);
font-weight: 400;
}
:-ms-input-placeholder {
color: rgba(26,30,39,.5);
font-weight: 400;
}
:-moz-placeholder {
color: rgba(26,30,39,.5);
font-weight: 400;
}
@media (max-width: 40em) {
.form-lbl {
margin-bottom: .5rem;
display: block;
font-weight: 700;
font-size: .875rem;
}
}
@media (min-width: 40em) {
.form li.form-item {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
-ms-grid-row-align: center;
align-items: center;
width: 100%;
}
.form-lbl {
width: 32%;
margin-bottom: 0;
}
.form-fields {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 68%;
}
.form-fields .radio {
min-width: 5rem;
}
.form-fields input, .form-fieldsselect {
max-width: none;
}
.small-form .form-lbl {
font-size: .875rem;
}
.small-form input {
height: 2.5em;
padding-left: .75rem;
-webkit-border-radius: .25rem;
border-radius: .25rem;
}
.small-form select {
height: 2.5em;
padding-left: .75rem;
-webkit-border-radius: .25rem;
border-radius: .25rem;
background-position: calc(100% - 16px) calc(1em + 2px), calc(100% - 12px) calc(1em + 2px);
}
.small-form .radio .lbl,
.small-form .checkbox .lbl {
font-size: .875rem;
}
}
/* Checkbox */
label.checkbox {
cursor: pointer;
position: relative;
line-height: 1.5;
padding-left: 1.75rem;
display: block;
}
label.checkbox input[type="checkbox"] {
height: 1px;
width: 1px;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translate(-25%, -75%);
transform: translate(-25%, -75%);
z-index: -1;
opacity: 0;
}
label.checkbox .box {
position: absolute;
top: .125rem;
left: 0;
display: inline-block;
box-sizing: border-box;
height: 1.25rem;
width: 1.25rem;
padding: .125rem;
background-color: #fff;
-webkit-box-shadow: inset 0 0 0 1px #d2d7dd, inset 0 2px 2px -1px rgba(0,0,0,.15);
box-shadow: inset 0 0 0 1px #d2d7dd, inset 0 2px 2px -1px rgba(0,0,0,.15);
-webkit-border-radius: 2px;
border-radius: 2px;
-webkit-transition: all 150ms;
transition: all 150ms;
}
label.checkbox .box .icon {
fill: #fff;
opacity: 0;
width: 100%;
height: 100%;
}
label.checkbox input[type="checkbox"]:checked + .box {
-webkit-box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
background-color: #0b8aed;
}
label.checkbox input[type="checkbox"]:checked + .box .icon {
opacity: 1;
}
/* Radio */
label.radio, label.radio-list {
cursor: pointer;
position: relative;
}
label.radio {
line-height: 1.5;
padding-left: 1.75rem;
display: inline-block;
}
label.radio input[type="radio"], label.radio-list input[type="radio"] {
height: 1px;
width: 1px;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translate(-25%, -75%);
transform: translate(-25%, -75%);
z-index: -1;
opacity: 0;
}
label.radio .dot, label.radio-list .dot {
position: absolute;
top: .125rem;
left: 0;
display: inline-block;
box-sizing: border-box;
height: 1.25rem;
width: 1.25rem;
background-color: #fff;
-webkit-box-shadow: inset 0 0 0 1px #c5ccd1, inset 0 2px 2px -1px rgba(0,0,0,.15);
box-shadow: inset 0 0 0 1px #c5ccd1, inset 0 2px 2px -1px rgba(0,0,0,.15);
-webkit-border-radius: 50%;
border-radius: 50%;
}
label.radio-list .dot {
top: 1.5rem;
left: .5rem;
}
@media (min-width: 52em) {
label.radio-list .dot {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: 1rem;
}
}
label.radio input[type="radio"]:checked + .dot, label.radio-list input[type="radio"]:checked + .dot {
-webkit-box-shadow: inset 0 0 0 1px #c5ccd1, inset 0 0 0 .25rem #fff;
box-shadow: inset 0 0 0 1px #c5ccd1, inset 0 0 0 .25rem #fff;
background-color: #0b8aed;
-webkit-transition: background 150ms;
transition: background 150ms;
}
.radio-list {
padding-left: 2.5rem;
padding-right: .5rem;
}
@media (min-width: 52em) {
.radio-list {
padding-left: 3rem;
padding-right: 1rem;
}
}
label.radio-list .state {
display: block;
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -1;
transition: background 100ms;
}
label.radio-list:hover .state {
background-color: rgba(0,0,0,.03);
}
label.radio-list input[type="radio"]:checked ~ .state {
background-color: #e6f4ff;
}
/* Form Specials */
input.search-input,
.easy-autocomplete input {
color: #12141d;
-webkit-box-shadow: 0 0 0 3px #54e083;
box-shadow: 0 0 0 3px #54e083;
padding-right: 0;
width: 26rem;
max-width: 100%;
-webkit-border-radius: .75rem;
border-radius: .75rem;
border: 0;
}
input.search-input:hover,
.easy-autocomplete input:hover {
border: 0;
-webkit-box-shadow: 0 0 0 3px #54e083;
box-shadow: 0 0 0 3px #54e083;
}
input.gray-search-input,
input.gray-search-input:hover {
-webkit-box-shadow: 0 0 0 3px #c5ccd1;
box-shadow: 0 0 0 3px #c5ccd1;
}
.header input.search-input,
.header .easy-autocomplete input
.header input.search-input:hover,
.header .easy-autocomplete input:hover {
-webkit-box-shadow: 0 0 0 4px rgba(0,0,0,.15);
box-shadow: 0 0 0 4px rgba(0,0,0,.15);
}
input.search-input:focus,
.easy-autocomplete input:focus,
.header input.search-input:focus,
.header .easy-autocomplete input:focus {
-webkit-box-shadow: 0 0 0 5px #0b8aed, 0 8px 10px rgba(0,0,0,.15);
box-shadow: 0 0 0 5px #0b8aed, 0 8px 10px rgba(0,0,0,.15);
}
@media (max-width: 52em) {
.header input.search-input,
.header .easy-autocomplete input,
.header input.search-input:hover,
.header .easy-autocomplete input:hover {
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,.2);
box-shadow: 0 0 0 1px rgba(0,0,0,.2);
padding-left: .5rem;
-webkit-border-radius: .25rem;
border-radius: .25rem;
height: 2.5rem;
width: 100%;
}
.header input.search-input:focus,
.header .easy-autocomplete input:focus {
-webkit-box-shadow: 0 0 0 2px #0b8aed, 0 5px 8px rgba(0,0,0,.15);
box-shadow: 0 0 0 2px #0b8aed, 0 5px 8px rgba(0,0,0,.15);
}
}
.search-btn, .input-btn {
width: 2.75rem;
height: 2.75rem;
padding: .575rem;
-webkit-border-radius: 0 .75rem .75rem 0;
border-radius: 0 .75rem .75rem 0;
border: 0;
border-left: 1px solid #e2e6ea;
cursor: pointer;
box-sizing: border-box;
}
.input-btn {
-webkit-border-radius: 0 .5rem .5rem 0;
border-radius: 0 .5rem .5rem 0;
height: 2.6rem;
right: 1px;
padding: .75rem;
}
.search-btn:focus, .search-btn:active,
.input-btn:focus, .input-btn:active {
-webkit-box-shadow: inset 0 0 0 20rem rgba(0,0,0,.1);
box-shadow: inset 0 0 0 20rem rgba(0,0,0,.1);
}
@media (max-width: 52em) {
.search-btn {
-webkit-border-radius: 0 .25rem .25rem 0;
border-radius: 0 .25rem .25rem 0;
height: 2.5rem;
width: 2.5rem;
}
}
select.select-link {
padding: .125rem .75rem 0 0;
height: 1.75em;
-webkit-box-shadow: none;
box-shadow: none;
background-color: transparent;
background-image: linear-gradient(45deg, transparent 50%, #0b8aed 50%), linear-gradient(135deg, #0b8aed 50%, transparent 50%);
background-position: calc(100% - 4px) 0.8em,100% .8em;
background-size: 4px 4px, 4px 4px;
background-repeat: no-repeat;
color: #0b8aed;
font-weight: 700;
-webkit-border-radius: 0;
border-radius: 0;
cursor: pointer;
}
select.select-link:focus {
background-image: linear-gradient(45deg, transparent 50%, #0b8aed 50%), linear-gradient(135deg, #0b8aed 50%, transparent 50%);
}
input.number {
width: 3rem;
height: 2.5rem;
text-align: center;
padding-left: 0;
padding-right: 0;
-webkit-border-radius: .5rem;
border-radius: .5rem;
}
input.number.lg-input {
height: 3rem;
width: 3.5rem;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
/* display: none; <- Crashes Chrome on hover */
-webkit-appearance: none;
margin: 0;
}
/* End Forms */
/* Item / Dimension search */
.ghost-header {
height: 6rem;
}
@media (min-width: 52em) {
.header {
padding-top: .75rem;
padding-bottom: .75rem;
}
.ghost-header {
height: 6.5rem;
}
.search-bar {
top: -.25rem;
bottom: -.25rem;
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
}
}
.search-by {
font-size: 12px;
color: #12141d;
margin-bottom: .25rem;
}
.search-by .option, .dimension .option {
font-size: 12px;
opacity: .5;
color: #12141d;
display: inline-block;
cursor: pointer;
padding: .25em 0;
}
.search-by .option:hover, .dimension .option:hover {
opacity: .75;
}
.search-by .option.active, .dimension .option.active {
font-weight: 700;
opacity: 1;
}
.search-by .option {
margin-right: 1rem;
}
.search-by .option .icon, .dimension .option .icon {
margin-right: .25rem;
width: .875rem;
height: .875rem;
margin-top: .15rem;
}
.dimension .option {
padding-left: .25rem;
padding-right: .25rem;
}
.dimension .option:after {
content: '/';
display: inline-block;
padding-left: .5rem;
margin-right: -.31rem;
font-weight: bold;
}
.dimension .option:last-child:after {
display: none;
content: '';
}
@media (min-width: 52em) {
input.search-input,
.easy-autocomplete input {
width: 28rem;
}
.item-search {
margin-bottom: .5rem;
}
}
@media (min-width: 64em) {
input.search-input,
.easy-autocomplete input {
width: 33.25rem;
}
}
.item-search {
display: none;
}
.item-search.active {
display: block;
}
.item-search select {
width: 7rem;
padding-right: 1rem;
height: 2.5rem;
background-color: #f0f2f4;
background-position: calc(100% - 10px) calc(1.25em + 2px), calc(100% - 6px) calc(1.25em + 2px);
font-size: 13px;
font-weight: 700;
-webkit-box-shadow: none;
box-shadow: none;
-webkit-border-radius: 2px 0 0 2px;
border-radius: 2px 0 0 2px;
border-right: 1px solid #e2e6ea;
text-overflow: ellipsis;
}
.header input.search-input, .header input.search-input:hover {
-webkit-box-shadow: 0 0 0 2px rgba(0,0,0,.15);
box-shadow: 0 0 0 2px rgba(0,0,0,.15);
-webkit-border-radius: 2px;
border-radius: 2px;
}
.header input.search-input:focus {
-webkit-box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
}
@media (min-width: 40em) {
.header .item-search .search-input {
padding-left: 7.5rem;
}
}
@media (min-width: 52em) {
.item-search select {
height: 2.75rem;
-webkit-border-radius: 2px 0 0 2px;
border-radius: 2px 0 0 2px;
background-position: calc(100% - 10px) calc(1.375em + 2px), calc(100% - 6px) calc(1.375em + 2px);
}
}
.header .search-btn {
-webkit-border-radius: 0 2px 2px 0;
border-radius: 0 2px 2px 0;
}
.dim-search {
display: none;
}
.dim-search.active {
display: block;
}
.dimension {
margin-right: .75rem;
}
.header input.dim-input {
width: auto;
max-width: 8rem;
padding: .125rem .25rem 0 .5rem;
height: 2.25rem;
-webkit-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0 0 0 2px rgba(0,0,0,.15);
box-shadow: 0 0 0 2px rgba(0,0,0,.15);
}
.header input.dim-input:hover {
-webkit-box-shadow: 0 0 0 2px rgba(0,0,0,.15);
box-shadow: 0 0 0 2px rgba(0,0,0,.15);
}
.header input.dim-input:focus {
-webkit-box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
}
.dim-measure select {
height: 2.25rem;
padding-left: .5rem;
padding-right: 4.5rem;
border: 0;
-webkit-box-shadow: 0 0 0 2px rgba(0,0,0,.15);
box-shadow: 0 0 0 2px rgba(0,0,0,.15);
-webkit-border-radius: 2px;
border-radius: 2px;
background-position: calc(100% - 3rem - 10px) calc(1em), calc(100% - 3rem - 6px) calc(1em);
}
.dim-measure select:focus {
-webkit-box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
}
.dim-measure .search-btn {
height: 2.25rem;
-webkit-border-radius: 0 2px 2px 0;
border-radius: 0 2px 2px 0;
padding: .5rem .75rem .75rem;
}
.single-input {
display: none;
}
.single-input.active {
display: block;
}
.double-input {
width: 100%;
max-width: 8rem;
display: none;
}
.double-input.active {
display: block;
}
.double-input input {
padding: .125rem .25rem 0 .5rem;
height: 2.25rem;
background: none transparent;
border: 0;
-webkit-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: -1px 0 0 rgba(0,0,0,.1);
box-shadow: -1px 0 0 rgba(0,0,0,.1);
width: 50%;
}
.double-input input:first-child {
-webkit-box-shadow: none;
box-shadow: none;
}
.double-input .fake-input {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -1;
background-color: #fff;
-webkit-box-shadow: 0 0 0 2px rgba(0,0,0,.15);
box-shadow: 0 0 0 2px rgba(0,0,0,.15);
-webkit-border-radius: 2px;
border-radius: 2px;
-webkit-transition: -webkit-box-shadow 300ms;
transition: box-shadow 300ms;
}
.double-input input:focus ~ .fake-input {
-webkit-box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
box-shadow: 0 0 0 3px #0b8aed, 0 6px 8px rgba(0,0,0,.15);
}
/* Sidebar */
.sidebar {
position: relative;
}
@media (min-width: 52em) {
.sidebar:after {
content: "";
display: block;
width: 500%;
position: absolute;
top: 0;
bottom: 0;
z-index: -1;
left: auto;
right: 0;
background: #f5f5f5;
-webkit-box-shadow: -1px 0 0 #dee0e4 inset;
box-shadow: -1px 0 0 #dee0e4 inset;
}
}
/* End Sidebar */
/* Featherlight */
.featherlight .featherlight-content > img[src$='.svg'] {
height: 75vh;
}
.featherlight .featherlight-close-icon {
background-color: #eee !important;
color: #000 !important;
width: 3rem !important;
height: 3rem !important;
font-size: 1.25rem !important;
line-height: 1rem !important;
padding: 1rem !important;
}
.featherlight-next {
left: auto !important;
right: 3.5rem !important;
opacity: .33;
}
.featherlight-previous {
right: auto !important;
left: 1rem !important;
opacity: .33;
}
.featherlight-next:hover, .featherlight-previous:hover {
background: transparent !important;
opacity: 1;
}
.featherlight-next span, .featherlight-previous span {
display: block !important;
}
.featherlight-next svg, .featherlight-previous svg {
width: 2.5rem;
height: 2.5rem;
fill: #111;
}
.featherlight-first-slide .featherlight-previous {
display: none;
}
.featherlight-last-slide .featherlight-next {
display: none;
}
/** End Featherlight */
/* Password reset */
.passwordinfo {
display: flex;
padding: 8px 16px;
flex-direction: column;
align-items: flex-start;
gap: 12px;
border-radius: 4px;
border: 1px solid #E2E6EA;
background: #FFF6EF;
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset;
margin-bottom: 20px;
}
.passwordheader {
align-self: stretch;
color: #C55700;
font-family: Helvetica;
font-size: 13px;
font-style: normal;
font-weight: 400;
line-height: 19.5px; /* 150% */
}
.passwordlink {
}
.passwordlink a {
color: #C55700;
font-family: Helvetica;
font-size: 13px;
font-style: normal;
font-weight: 700;
line-height: 19.5px; /* 150% */
text-decoration: none;
}
.passwordfooter {
margin-top: 10px;
color: #9E9E9E;
font-family: Open Sans;
font-size: 11px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 181.818% */
}
.tooltipster-sidetip.tooltipster-error .tooltipster-box{border-radius:3px; border:2px solid #e72d2d;background:#fff}.tooltipster-sidetip.tooltipster-error .tooltipster-content{color:#e72d2d;}.tooltipster-sidetip.tooltipster-error .tooltipster-arrow{height:9px;margin-left:-9px;width:18px}.tooltipster-sidetip.tooltipster-error.tooltipster-left .tooltipster-arrow,.tooltipster-sidetip.tooltipster-error.tooltipster-right .tooltipster-arrow{height:18px;margin-left:0;margin-top:-9px;width:9px}.tooltipster-sidetip.tooltipster-error .tooltipster-arrow-background{border:9px solid transparent}.tooltipster-sidetip.tooltipster-error.tooltipster-bottom .tooltipster-arrow-background{border-bottom-color:#e72d2d;top:1px}.tooltipster-sidetip.tooltipster-error.tooltipster-left .tooltipster-arrow-background{border-left-color:#e72d2d;left:-1px}.tooltipster-sidetip.tooltipster-error.tooltipster-right .tooltipster-arrow-background{border-right-color:#e72d2d;left:1px}.tooltipster-sidetip.tooltipster-error.tooltipster-top .tooltipster-arrow-background{border-top-color:#e72d2d;top:-1px}.tooltipster-sidetip.tooltipster-error .tooltipster-arrow-border{border:9px solid transparent}.tooltipster-sidetip.tooltipster-error.tooltipster-bottom .tooltipster-arrow-border{border-bottom-color:red}.tooltipster-sidetip.tooltipster-error.tooltipster-left .tooltipster-arrow-border{border-left-color:red}.tooltipster-sidetip.tooltipster-error.tooltipster-right .tooltipster-arrow-border{border-right-color:red}.tooltipster-sidetip.tooltipster-error.tooltipster-top .tooltipster-arrow-border{border-top-color:red}.tooltipster-sidetip.tooltipster-error.tooltipster-bottom .tooltipster-arrow-uncropped{top:-9px}.tooltipster-sidetip.tooltipster-error.tooltipster-right .tooltipster-arrow-uncropped{left:-9px}
.tooltipster-fall, .tooltipster-grow.tooltipster-show {
-webkit-transition-timing-function: cubic-bezier(.175,.885,.32,1);
-moz-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
-ms-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
-o-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
}
.tooltipster-base {
display: flex;
pointer-events: none;
position: absolute;
}
.tooltipster-box {
flex: 1 1 auto;
}
.tooltipster-content {
box-sizing: border-box;
max-height: 100%;
max-width: 100%;
overflow: auto;
}
.tooltipster-ruler {
bottom: 0;
left: 0;
overflow: hidden;
position: fixed;
right: 0;
top: 0;
visibility: hidden;
}
.tooltipster-fade {
opacity: 0;
-webkit-transition-property: opacity;
-moz-transition-property: opacity;
-o-transition-property: opacity;
-ms-transition-property: opacity;
transition-property: opacity;
}
.tooltipster-fade.tooltipster-show {
opacity: 1;
}
.tooltipster-grow {
-webkit-transform: scale(0,0);
-moz-transform: scale(0,0);
-o-transform: scale(0,0);
-ms-transform: scale(0,0);
transform: scale(0,0);
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
-webkit-backface-visibility: hidden;
}
.tooltipster-grow.tooltipster-show {
-webkit-transform: scale(1,1);
-moz-transform: scale(1,1);
-o-transform: scale(1,1);
-ms-transform: scale(1,1);
transform: scale(1,1);
-webkit-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
}
.tooltipster-swing {
opacity: 0;
-webkit-transform: rotateZ(4deg);
-moz-transform: rotateZ(4deg);
-o-transform: rotateZ(4deg);
-ms-transform: rotateZ(4deg);
transform: rotateZ(4deg);
-webkit-transition-property: -webkit-transform,opacity;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
}
.tooltipster-swing.tooltipster-show {
opacity: 1;
-webkit-transform: rotateZ(0);
-moz-transform: rotateZ(0);
-o-transform: rotateZ(0);
-ms-transform: rotateZ(0);
transform: rotateZ(0);
-webkit-transition-timing-function: cubic-bezier(.23,.635,.495,1);
-webkit-transition-timing-function: cubic-bezier(.23,.635,.495,2.4);
-moz-transition-timing-function: cubic-bezier(.23,.635,.495,2.4);
-ms-transition-timing-function: cubic-bezier(.23,.635,.495,2.4);
-o-transition-timing-function: cubic-bezier(.23,.635,.495,2.4);
transition-timing-function: cubic-bezier(.23,.635,.495,2.4);
}
.tooltipster-fall {
-webkit-transition-property: top;
-moz-transition-property: top;
-o-transition-property: top;
-ms-transition-property: top;
transition-property: top;
-webkit-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
}
.tooltipster-fall.tooltipster-initial {
top: 0 !important;
}
.tooltipster-fall.tooltipster-dying {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
-ms-transition-property: all;
transition-property: all;
top: 0 !important;
opacity: 0;
}
.tooltipster-slide {
-webkit-transition-property: left;
-moz-transition-property: left;
-o-transition-property: left;
-ms-transition-property: left;
transition-property: left;
-webkit-transition-timing-function: cubic-bezier(.175,.885,.32,1);
-webkit-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
-moz-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
-ms-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
-o-transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
transition-timing-function: cubic-bezier(.175,.885,.32,1.15);
}
.tooltipster-slide.tooltipster-initial {
left: -40px !important;
}
.tooltipster-slide.tooltipster-dying {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
-ms-transition-property: all;
transition-property: all;
left: 0 !important;
opacity: 0;
}
@keyframes tooltipster-fading {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.tooltipster-update-fade {
animation: tooltipster-fading .4s;
}
@keyframes tooltipster-rotating {
25% {
transform: rotate(-2deg);
}
75% {
transform: rotate(2deg);
}
100% {
transform: rotate(0);
}
}
.tooltipster-update-rotate {
animation: tooltipster-rotating .6s;
}
@keyframes tooltipster-scaling {
50% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}
.tooltipster-update-scale {
animation: tooltipster-scaling .6s;
}
.tooltipster-sidetip .tooltipster-box {
background: #565656;
border: 2px solid #000;
border-radius: 4px;
}
.tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
margin-top: 8px;
}
.tooltipster-sidetip.tooltipster-left .tooltipster-box {
margin-right: 8px;
}
.tooltipster-sidetip.tooltipster-right .tooltipster-box {
margin-left: 8px;
}
.tooltipster-sidetip.tooltipster-top .tooltipster-box {
margin-bottom: 8px;
}
.tooltipster-sidetip .tooltipster-content {
color: #fff;
line-height: 18px;
padding: 6px 14px;
}
.tooltipster-sidetip .tooltipster-arrow {
overflow: hidden;
position: absolute;
}
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
height: 10px;
margin-left: -10px;
top: 0;
width: 20px;
}
.tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
height: 20px;
margin-top: -10px;
right: 0;
top: 0;
width: 10px;
}
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
height: 20px;
margin-top: -10px;
left: 0;
top: 0;
width: 10px;
}
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
bottom: 0;
height: 10px;
margin-left: -10px;
width: 20px;
}
.tooltipster-sidetip .tooltipster-arrow-background, .tooltipster-sidetip .tooltipster-arrow-border {
height: 0;
position: absolute;
width: 0;
}
.tooltipster-sidetip .tooltipster-arrow-background {
border: 10px solid transparent;
}
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
border-bottom-color: #565656;
left: 0;
top: 3px;
}
.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
border-left-color: #565656;
left: -3px;
top: 0;
}
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
border-right-color: #565656;
left: 3px;
top: 0;
}
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
border-top-color: #565656;
left: 0;
top: -3px;
}
.tooltipster-sidetip .tooltipster-arrow-border {
border: 10px solid transparent;
left: 0;
top: 0;
}
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
border-bottom-color: #000;
}
.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
border-left-color: #000;
}
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
border-right-color: #000;
}
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
border-top-color: #000;
}
.tooltipster-sidetip .tooltipster-arrow-uncropped {
position: relative;
}
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
top: -10px;
}
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
left: -10px;
}