@font-face { font-family: 'ElegantIcons'; src: url('../../../../system/admin/fonts/ElegantIcons.eot'); src: url('../../../../system/admin/fonts/ElegantIcons.eot?#iefix') format('embedded-opentype'), url('../../../../system/admin/fonts/ElegantIcons.woff') format('woff'), url('../../../../system/admin/fonts/ElegantIcons.ttf') format('truetype'), url('../../../../system/admin/fonts/ElegantIcons.svg#ElegantIcons') format('svg'); font-weight: normal; font-style: normal; }

.shopButton { font-size: 16px; color: #FF2800; text-decoration: none; margin: 0; padding: 10px 20px; border: 1px solid #FF2800; border-radius: 2px; background: #fff url(../images/shop_cart_range.svg) no-repeat 20px center; transition: color 0.3s, background 0.3s; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; -webkit-transition: color 0.3s, background 0.3s; -moz-transition: color 0.3s, background 0.3s; -ms-transition: color 0.3s, background 0.3s; -o-transition: color 0.3s, background 0.3s; }
.shopButton:hover { color: #fff; background: #FF2800 url(../images/shop_cart_white.svg) no-repeat 20px center; text-decoration: none; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; }

/* ----- HEADER ----- */
.shoppingCart { width: 200px; height: 40px; line-height: 40px; font-size: 14px; color: #202124; cursor: pointer; border: 1px solid #D8D8D8; background: url(../images/right_grey.svg) 95% center no-repeat; display: flex; flex-direction: row; align-items: center; }
.shoppingCart img { vertical-align: middle; }
.shoppingCart a { text-decoration: none; }
.shoppingCart a:hover { color: #202124; }
.shoppingCart a:first-child { margin-right: 5px; margin-left: 10px; }
.shoppingCart a:last-child { margin-left: 5px; }
.cart-num { color: #000; text-decoration: none; }
.shoppingCart:hover .cart-num { }
.siteSearch, .siteSearchM { height: 40px; width: 200px; border: 1px solid #D8D8D8; position: relative; }
.siteSearch a, .siteSearchM a { position: absolute; right: 0; top: 0; display: block; height: 100%; width: 40px; display: flex; align-items: center; justify-content: center; text-decoration: none; }
.siteSearch a img, .siteSearchM a img { vertical-align: middle; text-decoration: none; }
.siteSearch input, .siteSearchM input { width: 100%; height: 100%; font-size: 14px; color: #4E4F53; border: 0; outline: 0; margin: 0; padding: 0; text-indent: 10px; background: none; }
.siteSearchM { display: none; }

/* -------------------------------------------------------------------- */

/* ----- SEARCH PAGE ----- */

.search_title { height: 80px; font-size: 28px; font-family: 'Playfair Display'; line-height: 38px; color: #202124; display: flex; flex-direction: row; align-items: center; justify-content: space-between; border-bottom: 1px dashed #D8D8D8; margin-bottom: 20px; }
.search_results_found { font-size: 16px; width: 300px; line-height: 24px; text-align: right; margin: 10px 0; }
select.sys_sortsearchby { border: none; color: #4E4F53; width: 200px; -webkit-appearance: none; background: url(../images/chevron_down.svg) no-repeat 95% center; }
.catHeader { text-align: center; margin-bottom: 30px; }
.search_results { clear: both; }

/* -------------------------------------------------------------------- */

/* ----- PRODUCT BLOCK ----- */

.product_box { margin-bottom: 20px; font-size: 15px; position: relative; }
.product_box:hover .product_title a { text-decoration: underline; }
.product_box:hover .product_buttons a { background: #FF2800; color: #fff; text-decoration: none; }
.product_box:hover .product_image img { opacity: 0.58; }
.product_image { width: 280px; height: 280px; text-align:center; margin: 0; border: 1px solid #D8D8D8; box-sizing: border-box; position: relative; }
.product_image img { max-width: 100%; max-height: 100%; transition: opacity 0.3s; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; 
    -ms-transition: opacity 0.3s; -o-transition: opacity 0.3s; }
.product_image .saleTitle { width: 70px; height: 50px; line-height: 50px; position: absolute; left: -2px; top: 5px; background: url(../images/sale-sticker.svg) center center no-repeat; align-items: center; text-align: center; justify-content: center; font-size: 20px; font-weight: bold; color: #fff; font-family: 'Playfair Display'; }
.product_title { font-family: 'Playfair Display'; font-weight: bold; height: 42px; max-width: 80%; overflow: hidden; text-align: center; margin: 10px auto; }
.product_title a { line-height: 20px; font-size: 16px; color: #202124; text-decoration: none; transition: text-decoration 0.3s; -webkit-transition:; -moz-transition:; -ms-transition:; -o-transition:; }
.product_price { line-height: 20px; text-align: center; height: 20px; margin-bottom: 10px; display: flex; flex-direction: row; align-items: center; 
    justify-content: center; }
.product_price .nowprice { font-size: 16px; color: #202124; }
.product_price .nowprice.discounted { color: #FF2800; }
.product_price .wasprice { font-size: 16px; color: #202124; text-decoration: line-through; margin-right: 10px; }
.product_buttons { text-align: center; }
.product_buttons a { display: inline-block; border: 1px solid #FF2800; border-radius: 2px; color: #FF2800; background: #fff; text-decoration: none; font-family: 'Playfair Display'; text-decoration: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; 
transition: color 0.3s, background 0.3s; -webkit-transition: color 0.3s, background 0.3s; -moz-transition: color 0.3s, background 0.3s; -ms-transition: color 0.3s, background 0.3s; -o-transition: color 0.3s, background 0.3s; }

/* -------------------------------------------------------------------- */

/* ----- CATEGORY BLOCK ----- */

.catBlock { height: 280px; width: 280px; position: relative; font-family: 'Playfair Display'; cursor: pointer; margin-bottom: 20px; }
.catBlock .catoverlay { display: block; transition: background 0.3s; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; -ms-transition: background 0.3s; -o-transition: background 0.3s; }
.catBlock:hover .catoverlay { background: rgba(255, 255, 255, 0.5); z-index: 10; position: absolute; width: 100%; height: 100%; }
.catBlock:hover a img { margin-left: 5px; text-decoration: none; }
.catBlock a { position: absolute; bottom: 0; width: 100%; display: block; text-decoration: none; background: rgba(255, 40, 0, 0.85); text-align: left; padding-left: 10px; color: #fff; font-size: 18px; line-height: 46px; z-index: 11; box-sizing: border-box; }
.catBlock a img { vertical-align: middle; text-decoration: none; transition: margin 0.5s; -webkit-transition: margin 0.5s; -moz-transition: margin 0.5s; -ms-transition: margin 0.5s; -o-transition: margin 0.5s; }
.catBlock a:hover { text-decoration: none; }

/* -------------------------------------------------------------------- */

/* ----- PAGER -----  */

.search_pager { float: right; margin: 5px 10px; }
.pager_link { float: left; font-size: 22px; color: #202124; line-height: 30px; padding: 0 4px; margin: 0 2px; font-family: 'Playfair Display'; padding-bottom: 5px; }
.pager_link a { color: inherit; text-decoration: none; }
.pager_current_page a { color: #FF2800; text-decoration: underline; }
.pager_next_button, .pager_prev_button { background: #FF2800; }
.viewall { color: #000; }

/* -------------------------------------------------------------------- */

/* ----- DETAILS PAGE ----- */

.details_header { height: 60px; display: flex; align-items: center; border-bottom: 1px dashed #D8D8D8; margin-bottom: 20px; }
.details_header a:not(:first-child) { display: none; }
.details_header a { color: #000; font-size: 16px; text-decoration: none; padding-left: 15px; position: relative; }
.details_header a:after { content: ""; position: absolute; left: 0px; top: 10px; border: solid #000000; border-width: 0 0 2px 2px; transform: rotate(45deg); 
height: 6px; width: 6px; }
.details_header a img { margin-right: 10px; text-decoration: none; }
.productImage { width: 584px; height: 584px; position: relative; text-align: center; border: 1px solid #D8D8D8; }
.productImage img { max-width: 100%; max-height: 100%; width:auto;}
.productImage .saleTitle { width: 70px; height: 50px; line-height: 50px; position: absolute; left: -2px; top: 5px; background: url(../images/sale-sticker.svg) center center no-repeat; text-align: center; align-items: center; justify-content: center; font-size: 20px; font-weight: bold; color: #fff; font-family: 'Playfair Display'; }
.productImages {height: 90px; position: relative; margin:10px 0; display:flex;}
.smallImage { display: block; height: 90px; width: 90px; margin: 0 5px 0 0; text-align: center; cursor: pointer; border: 1px solid #D8D8D8; }
.smallImage img { max-width: 100%; max-height: 100%; }
.details { }
h1.p_title { color: #202124; font-size: 32px; line-height: 42px; text-transform: capitalize; }
.plainText { font-size: 16px; padding: 10px 0px; color: #FF2800; }
.saleTitleDetails { font-size: 20px; font-weight: bold; font-family: 'Playfair Display'; line-height: 40px; color: #FF2800; margin-bottom: 10px; }
.nowPrice, .mainPrice { color: #4A4A4A; font-weight: bold; line-height: 28px; font-size: 20px; margin-bottom: 20px; }
.nowPrice { color: #FF2800; }
.wasPrice { font-size: 16px; color: #4E4F53; text-decoration: line-through }
.details .label { width: 100%; color: #4E4F53; text-indent: 0; font-size: 16px; line-height: 28px; font-weight: bold; }
.variations { font-size: 16px; line-height: 28px; }
.variations select { border: 1px solid #D8D8D8; width: 95%; height: 47px; font-weight: normal; line-height: 47px; -webkit-appearance: none; 
    background: url(../images/chevron_down.svg) no-repeat 98% center; }
.quantity .label { width: 100%; color: #4E4F53; text-indent: 0; font-size: 16px; line-height: 28px; font-weight: bold; }
.number-input { display: flex; flex-direction: row; }
.number-input button { border: 1px solid #DCDCDC; }
.number-input input { height: 46px; width: 46px; font-size: 15px; margin: 0; text-align: center; border: 0; border-top: 1px solid #DCDCDC; 
    border-bottom: 1px solid #DCDCDC; -moz-appearance: textfield; }
.number-input input::-webkit-outer-spin-button, .number-input input::-webkit-inner-spin-button { -webkit-appearance: none; }
.btn-add-quantity, .btn-remove-quantity { background-color: #FBF6EF; cursor: pointer; }
.btn-remove-quantity img { padding-bottom: 3px; }
.change-quantity { float: left; margin-right: 10px; }
.addToCartBox { float: left; }
.addToCartBox a { color: #FF2800; font-size: 14px; line-height: 20px; display: block; text-decoration: none; }
a.addToCart.shopButton { display: block; font-size: 16px; padding: 12px 20px 13px 50px; text-decoration: none; }
a.disabled { color: #999; text-decoration: none; }
a.addedtocartButton { float: left; margin: 10px 20px 0 0; padding: 12px 20px 13px 50px !important; display: inline-block; text-decoration: none; }
.sharing_links { float: left; width: 300px; }
a.delivery { color: #000; font-size: 13px; line-height: 40px; text-decoration: none; }
.productDescription { margin: 30px 0; border-top: 1px dashed #D8D8D8; font-size: 16px; line-height: 28px; color: #4E4F53; }
.productDescription h3 { color: #202124; font-size: 18px; line-height: 30px; padding: 20px 0 20px; font-family: 'Playfair Display'; }
.greybox { background: #f0f0f0; padding: 5px 10px; margin-bottom: 10px; }
.priceBox { float: left; width: 280px; }
.associations { margin: 10px 0px; padding: 20px 0; }
.associations h2 { margin-bottom: 20px; text-align: center; }

/* -------------------------------------------------------------------- */

/* ----- LARGE CART ----- */

div.cartRow { line-height: 30px; margin: 5px 0; padding: 10px; border: 1px solid #e1e1e1; }
div.cartCell { width: 45px; float: left; }
.cartCell .shopButton { float: left; margin: 2px; }
.prodTitle { font-size: 1.2em; width: 548px !important; }
.prodPrice { width: 115px !important; font-size: 1.2em; text-align: right; font-weight: bold; line-height: 36px; }
.prodPriceExVat {  font-weight: normal; color: #75767A; font-size: 15px; line-height: 16px;}
div.cartRow .quantity { width: 100px !important; font-size: 14px; font-weight: bold; line-height: 24px; }
div.cartRow .quantity input { width: 40px; height: 40px; text-align: center; border: 1px solid #e1e1e1; }
div.remove { float: right; width: 160px; line-height: 24px; }
div.update { line-height: 36px; }
div.remove a, div.update a { color: #030104; font-size: 12px; line-height: 24px; text-decoration: none; }
a.cart_delete span:first-child, div.update a { text-decoration: underline; }
a.cart_delete span:nth-child(2) { font-family: "ElegantIcons"; color: #bbbaba; font-size: 14px; padding-left: 5px; }
a.cart_delete:hover span { color: #000; }
.cartTitle { font-size: 1.2em; width: 678px !important; }
.cartPrice { width: 150px !important; font-size: 1.2em; font-weight: bold; text-align: right; }
.cartPrice.total, .cartPrice.cartTotal { font-size: 1.15em; }
.discPrice { color: #FF2800; }

/* .discPrice {color: #990000;} */

/* -------------------------------------------------------------------- */

/* ----- CHECKOUT ----- */

.features { border: 1px solid #000; border-width: 1px 0; padding: 10px 0; }
.promocode { height: 50px; float: right; }
.promocode h2 { line-height: 24px; border: 0; padding: 0; margin: 0; font-size: 1.2em; text-align: right; font-weight: normal; }
.promocode .applyPromo.shopButton { float: right; margin: 0 0 0 10px; padding: 5px 20px 5px 50px; }
.promocode input { width: 250px; float: right; height: 28px; font-size: 14px; vertical-align: middle; margin-left: 46px; }
.promocode div { text-align: right; }
.deliverybox { float: left; width: 45%; }
.deliverybox div { font-weight: bold; font-size: 1.2em; line-height: 24px; }
.deliverybox div a { font-size: 14px; font-weight: normal; text-decoration: none; }
.deliverybox select.deliverySelector { margin-left: 0px; height: 27px; max-width: 200px; box-sizing: border-box; }
div.checkoutRow { line-height: 30px; margin: 2px 0; color: #434344; }
div.checkoutCell { width: 98%; float: left; margin: 0 1%; font-size: 1.4em; }
div.checkoutCell:firsth-child { margin: 0 }
div.checkoutCell:nth-child(2) { margin-bottom: 10px; }
div.checkoutCell input[type=text], div.checkoutCell input[type=email], div.checkoutCell select { width: 100%; height: 32px; font-size: 1.1em; text-indent: 10px; 
    border-radius: 2px; line-height: 32px; color: #434344; border: 1px solid #aaa; box-sizing: border-box; padding: 0; margin: 0; }
div.checkoutCell select{font-size: 16px;}
div.checkoutCell input[type=checkbox] { width: auto; }
span.required { color: #f00; }
.paymentOptions { margin: 10px auto; }
.paymentOption { background: #eee; height: 40px; cursor: pointer; margin: 5px 0; line-height: 40px; }
.paymentTitle { font-size: 1.4em; text-align: left; height: 40px; float: left; width: 700px; }
.paymentDescription { display: none; }
.paymentLogo { float: left; width: 100px; }
.paymentIcons { float: left; width: 100px; }
.paymentOption img { vertical-align: middle; }
div.paymentRow { line-height: 20px; margin: 2px 0; }
div.paymentCell { width: 48%; float: left; margin: 0 1%; }
.paymentOptionSelected { background: #b3d9b9; }
.continueButton.shopButton { float: right; margin: 20px 0; }
.paymentButton { border: 0; width: 200px; margin: 5px auto; background-image: none !important; display: block; cursor: pointer; }
.shopButton.continueButton, .shopButton.applyPromo { padding: 12px 20px 13px 50px; }


div.cartVatNo { background: #FEF8F2; display: flex;}
div.cartVatNo div.cartCell { width: auto;}
.cartVatField {margin-left: auto; display: flex; align-items: center;  line-height: 22px;}
.cartVatNoTitle span { font-size: 18px; line-height: 30px; font-family: 'Playfair Display';}
.cartVatNoTitle { font-size: 14px; line-height: 22px;}
.cartVatField input { border: 1px solid #DFDEDE; background: #fff; line-height: 38px; margin-right: 10px; padding:0 10px; width: 300px;}
div.cartVatNo .shopButton { float: none; line-height: 40px; margin:0; background-image:none; padding-top: 0; padding-bottom: 0; box-sizing: border-box;}

.cartValidVat { margin:25px 0 15px 0; padding-left: 30px; line-height: 24px; background-image: url(../images/check.svg); background-repeat: no-repeat; background-position: 3px 2px; display: flex; flex-wrap: wrap; align-items: center; column-gap: 5px;}
.cartValidVat a { color: #000000; width: 100%;}

/* -------------------------------------------------------------------- */

/* ----- DASHBOARD ----- */

.tabs { }
.tab_titles { width: 150px; text-indent: 10px; float: left; text-align: left; text-transform: uppercase; font-size: 1.2em; line-height: 35px; color: #323232; position: relative; cursor: pointer; z-index: 2; padding-top: 10px; }
.tab_titles div { margin: 5px 0; cursor: pointer; }
.tab_active { background: #f4f4f4; color: #3E5A8B; z-index: 2; border: 1px solid #aaa; border-width: 1px 0 1px 1px; border-radius: 5px 0 0 5px; font-weight: bold; }
.tab_details { float: left; background: #f4f4f4; width: 760px; border: 1px solid #aaa; position: relative; left: -1px; z-index: 1; padding: 0 10px; 
    margin-bottom: 20px; border-radius: 5px; display: none; min-height: 200px; }
.orderRow { font-size: 1.2em; line-height: 30px; clear: both; }
.orderCell { float: left; width: 150px; }
.label { float: left; width: 30%; text-indent: 2%; line-height: 30px; font-size: 1.2em; margin: 5px 0; }
.value { float: left; width: 70%; text-indent: 2%; overflow: hidden; line-height: 30px; font-size: 1.2em; margin: 5px 0; }
.value input[type=text], .value input[type=password], .value select { height: 30px; width: 97%; border: 1px solid #aaa; }
.saveDetails.shopButton, .updatePassword.shopButton { float: right; background: #fff; }
.saveDetails.shopButton:hover, .updatePassword.shopButton:hover { background: #FF2800; }

/* .dashboardSave {border-radius: 5px; display: block; float: right; padding: 0 20px; line-height: 40px; margin: 10px 0; background-color: #da1252; color: #fff; font-size: 15px; font-weight: bold;} */
.dashboardSave { float: right; font-size: 16px; color: #FF2800; margin: 0; padding: 10px 20px; border: 1px solid #FF2800; border-radius: 2px; background: #fff; 
    transition: color 0.3s, background 0.3s; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; 
    -webkit-transition: color 0.3s, background 0.3s; -moz-transition: color 0.3s, background 0.3s; -ms-transition: color 0.3s, background 0.3s; 
    -o-transition: color 0.3s, background 0.3s; }
.dashboardSave:hover { color: #fff; background: #FF2800; text-decoration: none; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; 
    -ms-border-radius: 2px; -o-border-radius: 2px; }
.login_error { text-align: center; font-size: 16px; color: #990000; line-height: 40px; }
.login_form { margin-bottom: 20px; }
.login_form input { width: 50%; height: 40px; padding-left: 10px; }

/* -------------------------------------------------------------------- */

/* ----- CUSTOMISE ----- */

.cust-area { width: 500px; height: 800px; border: 0px solid #aaa; position: relative; overflow: hidden; background-position: 0 0; background-repeat: no-repeat; margin: 0 auto; white-space: pre-wrap; }
.areaicon { text-align: center; }
.area { position: absolute; text-align: center; }
.areaTitle { font-size: 1.6em; color: #d81921; line-height: 20px; }
.areaIcon { display: none; }
.areaText, .areaFont { margin: 1px; position: relative; height: 25px; line-height: 25px; border: 1px solid #d7d7d7; padding: 0 0 0 5px; font-size: 1.2em; }
.areaFont { padding: 0; width: 98%; }
.area-select { margin: 1px; position: relative; height: 25px; line-height: 25px; border: 1px solid #d7d7d7; padding: 0 0 0 5px; font-size: 1.2em; }
.area-select-arrow { float: right; background: url(../images/select-arrow.png) no-repeat; width: 17px; height: 25px; cursor: pointer; }
.area-select-list { position: absolute; top: 25px; left: 0; width: 155px; height: 220px; overflow-y: scroll; border: 1px solid #d7d7d7; display: none; background: #fff; padding-top: 15px; z-index: 100; }
.area-select-listitem { height: auto; margin: 5px auto; text-align: center; width: 50px; cursor: pointer; }
.area-select-note { font: 12px Arial; text-align: center; color: #6e6e6e; position: absolute; top: 0; width: 100%; line-height: 16px; }
.cust-price { float: left; width: 100px; font-size: 2em; color: #011b61; line-height: 35px; }
.cust-add { float: left; width: 220px; }
.confirmButton { }
.previewCustom { font-size: 1em; color: #d81921; }

/* -------------------------------------------------------------------- */

/* ----- SWIPE ----- */

.swipe { overflow: hidden; visibility: hidden; position: relative; }
.swipe-wrap { overflow: hidden; position: relative; }
.swipe-wrap>div { float: left; width: 100%; position: relative; }
.slideLeft { position: absolute; top: 50%; left: 10px; z-index: 100; }
.slideRight { position: absolute; top: 50%; right: 10px; z-index: 100; }
nav #position { text-align: center; list-style: none outside none; margin: 0px; padding: 0px; line-height: auto; }
nav #position li { display: inline-block; width: 10px; height: 10px; border-radius: 10px; background: none repeat scroll 0% 0% #333; box-shadow: 0px 1px 2px #333 inset, 0px 0px 1px 1px #ccc; margin: 0px 2px; cursor: pointer; padding: 0; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
nav #position li.on { box-shadow: 0px 1px 3px -1px #28B4EA inset, 0px 1px 2px rgba(0, 0, 0, 0.5); background-color: #1293DC; background-image: -moz-linear-gradient(center top, #1293DC, #0F6297); }
.groupArea, .iconGroupArea { border: 1px solid #aaa; margin: 5px 0; padding: 2px; }
.step { float: left; width: 26px; margin: 5px 2px; line-height: 26px; width: 200px; }
.step div:nth-child(1) { float: left; background: url(../images/redcircle.png) no-repeat; height: 26px; width: 26px; margin: 0 2px; text-align: center; font-size: 22px; color: #fff; font-weight: bold; }
.step div:nth-child(2) { float: left; color: #000080; font-size: 12px; }
.saleBox { color: #d81921; font-size: 1.6em; line-height: 30px; }

/* -------------------------------------------------------------------- */
