/* ========= LAYOUT DETAILS COMPONENT ========= */ @import url(framework.css); article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary, div, ul, ol, li, p, dl, dd, dt, tr, th, td, h1, h2, h3, h4, h5, a, span { border: 0 dashed #a0a0a0; border-radius: 0; } * { letter-spacing: 1.2px; } @font-face { font-family: "vegur"; src: url(vegur-regular-webfont.eot); src: url(vegur-regular-webfont.eot?#iefix) format("embedded-opentype"), url(vegur-regular-webfont.woff) format("woff"), url(vegur-regular-webfont.ttf) format("truetype"), url(vegur-regular-webfont.svg#vegur) format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "vegur"; src: url(vegur-light-webfont.eot); src: url(vegur-light-webfont.eot?#iefix) format("embedded-opentype"), url(vegur-light-webfont.woff) format("woff"), url(vegur-light-webfont.ttf) format("truetype"), url(vegur-light-webfont.svg#vegur) format("svg"); font-weight: 300; font-style: normal; } @font-face { font-family: "vegur"; src: url(vegur-bold-webfont.eot); src: url(vegur-bold-webfont.eot?#iefix) format("embedded-opentype"), url(vegur-bold-webfont.woff) format("woff"), url(vegur-bold-webfont.ttf) format("truetype"), url(vegur-bold-webfont.svg#vegur) format("svg"); font-weight: bold; font-style: normal; } ol, ul { list-style: none; padding-left: 0; } .collapse.in { display: block !important; } .cart-total .freight-provider { display: none; } /***** TOOLTIP *****/ .tooltip-inner { padding: 6px 12px; } .tooltip.right .tooltip-arrow { margin-top: -10px; border-width: 9px 7px 10px 0; } /***** PRICING *****/ .price { color: #444545; } .price.was { text-decoration: line-through; padding-right: 10px; color: #444545; margin-bottom: 0; } .price.was:before { display: inline-block; } .price.now { color: #961b48; } .price.was, .price.now { display: inline-block; } .price.save { color: #961b48; display: none; } .price.tax { display: none; } .price.special .price-display:before { content: " "; } /* POPOVER */ *[data-toggle=popover] { cursor: pointer; } .popover { color: #e7f2d9; border-radius: 0; min-width: 200px; font-size: 12px; max-width: inherit; padding: 0; } .popover.top > .arrow:after { border-top-color: #f0f0f0 !important; } .popover-content { text-align: left; padding: 10px 12px; white-space: pre-line; background-color: #fff; } .popover-title { background-color: #fff; border-bottom: 0; padding: 13px 12px 0 22px; color: #444545; font-weight: normal; } /*** OVERLAYS ***/ figure { position: relative; } .overlay { display: flex; justify-content: space-between; position: absolute; left: 50%; transform: translate(-50%, 0); } .overlay span { max-width: 80px; width: 35%; } .overlay span.sold-out { max-width: 100px; } .overlay span.special-offer { margin: 10px; margin-left: auto; } .overlay span.on-sale { margin: 10px; margin-left: auto; } .overlay img { width: 100%; } .left-vertical, .right-vertical { width: 33%; top: 0; } .item figure .overlay.left-vertical img, .item figure .overlay.right-vertical img { width: 100%; } .left-vertical { left: 0; } .right-vertical { right: 0; } .top-horizontal { top: 0; width: 100%; } .bottom-horizontal { left: 0; bottom: 0; width: 100%; } .product-detail .overlay span { max-width: 200px; } .product-detail .left-vertical, .product-detail .right-vertical { width: 20%; } /**** FORM ELEMENTS ****/ ::-webkit-input-placeholder { color: #e7f2d9; text-transform: capitalize; } :-moz-placeholder { color: #e7f2d9; text-transform: capitalize; } ::-moz-placeholder { color: #e7f2d9; text-transform: capitalize; } :-ms-input-placeholder { color: #e7f2d9; text-transform: capitalize; } *:focus { outline: 0 none; } /* Fix number input spinner */ input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } input[type="radio"], input[type="checkbox"] { margin: 4px 5px 0 0; } form input[type="file"] { height: auto; } form textarea, form input[type="text"], form input[type="password"], form input[type="email"], form input[type="number"], form input[type="tel"], form input[type="time"], form input[type="date"] { -webkit-appearance: none; outline: none; } form fieldset { margin-top: 20px; } form label { display: block; } form input:not([type="checkbox"], [type="radio"]), form select { height: 40px !important; } form input + label { display: inline-block; width: 90%; } form .details textarea, form .comment textarea { height: 100px; vertical-align: top; } form .security-code input { width: 40%; } form .telephone input { display: inline-block; } form em, .note em { color: #961b48; } fieldset .note { margin-top: 5px; } .note { font-size: 12px; } /* MAIN BUTTONS */ .btn, button, .map-link a, .post-link a, .reply-link a, .options a { background-color: #05703b; color: #fff; transition: background-color 200ms; border: 0 dashed transparent; border-radius: 20px; text-transform: lowercase; padding: 10px 30px; width: 100%; height: 40px; font-size: 16px; } .btn:hover, button:hover, .map-link a:hover, .post-link a:hover, .reply-link a:hover { background-color: #04582e; } .options a { display: inline-block; text-align: center; } /* SECONDARY BUTTONS */ .btn.prev, button.prev, .map-link a.prev, .post-link a.prev, .reply-link a.prev, .additional-options a.prev, button.add-wishlist, .map-link a.add-wishlist, .post-link a.add-wishlist, .reply-link a.add-wishlist, .autocomplete li > a, .summary-block .modify a, .login #sign-in .options a, .additional-options button, .promo-code button, .update button, .reply-link a { background: none; padding-left: 0; padding-right: 0; text-decoration: underline; font-weight: bold; color: #444545; } .btn.prev:hover, button.prev:hover, .map-link a.prev:hover, .post-link a.prev:hover, .reply-link a.prev:hover, .additional-options a.prev:hover, button.add-wishlist:hover, .map-link a.add-wishlist:hover, .post-link a.add-wishlist:hover, .reply-link a.add-wishlist:hover, .autocomplete li > a:hover, .summary-block .modify a:hover, .login #sign-in .options a:hover, .additional-options button:hover, .promo-code button:hover, .update button:hover, .reply-link a:hover { text-decoration: none; } .add-wishlist { width: auto; padding: 0; } .added-to-wishlist { font-weight: bold; font-size: 16px; text-transform: lowercase; padding-top: 8px; } .added-to-wishlist:before { background: url(sprite.png) -9px -703px no-repeat; } .add-wishlist:before { background: url(sprite.png) -9px -639px no-repeat; } .add-wishlist:before, .added-to-wishlist:before { content: ''; display: inline-block; background-size: 40px; width: 31px; height: 25px; vertical-align: middle; margin-top: -5px; } .inline-error { width: 100%; display: inline-block; margin: 10px 0 0 0; } .inline-error .error { margin-bottom: 5px; } .error { clear: both; } .error li:only-child { margin-bottom: 0; } .message.incentive { padding: 0; } /*** Main Content ***/ .main-container { position: relative; z-index: 1; padding: 10px 15px; } .main-container h1 { font-size: 36px; margin: 0; text-align: center; padding: 15px 0 25px; } .main-content { padding: 0; } main .content ul, .additional-info .info-container ul { list-style: disc outside; } main .content ol, .additional-info .info-container ol { list-style: decimal outside; } main .content ol, main .content ul, .additional-info .info-container ol, .additional-info .info-container ul { padding-left: 40px; } /*** Popups ***/ .touchdevice.modal-open { position: fixed; } .modal .modal-content { border-radius: 0; } .modal .modal-content .modal-header button { width: auto; } .modal .modal-content .modal-header button { height: auto; } .modal .modal-content .modal-header button:hover { background: none; } .modal .modal-content .modal-body video { width: 100%; } .modal .modal-content .modal-footer { clear: both; display: none; } /*CrossSell*/ #main .cross-sell, #main .featured, .modal .cross-sell { clear: both; } #main .cross-sell .products, #main .featured .products, .modal .cross-sell .products { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; } #main .cross-sell .products .item, #main .featured .products .item, .modal .cross-sell .products .item { width: 100%; } #main .cross-sell .slide-item, #main .featured .slide-item, .modal .cross-sell .slide-item { margin: 0 1%; } #main .cross-sell > div, #main .featured { padding-top: 10px; margin-top: 40px; } .modal .cross-sell { display: none; } .popup-data:not(.collapse):not(.collapsing) { display: none; } /*** BACK TO TOP LINK ***/ #back-top { right: 10px; opacity: 0; display: block !important; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; } .scrolled-down #back-top { position: fixed; bottom: 0; background: #05703b; opacity: .9; z-index: 999; border-radius: 30px 30px 0 0; } .scrolled-down #back-top a { display: block; padding: 10px 15px 15px; color: #fff; } /*** HOMEPAGE ***/ .homepage .main-container { width: 100%; padding: 0; } .homepage .main-container .container-fluid { padding: 0; } .homepage #page-content { width: 100%; } .homepage .featured { border-bottom: 0; } .homepage #left-nav { display: none; } /*** INFOPAGES/ General page structure ***/ .profile .change-password { width: 100% !important; } .infopage #page-content a { text-decoration: underline; } .postcode .note { text-align: right; } .postcode .note a { text-decoration: underline; text-transform: lowercase; margin-top: 5px; } .infopage main .content table td, .infopage main .content table th { padding: 5px; } .infopage main .content table tr:nth-of-type(2n) td { background-color: #f0f0f0; } .ESO_number_wrapper { padding: 0 20%; width: 100%; } .ESO_number_wrapper input { margin: 0 auto; } .form-item.quantity { float: left; width: 35%; } .form-item.quantity label { width: 100%; } .ESO_number_wrapper { width: 100%; position: relative; display: inline-block; padding: 0 20%; text-align: center; } .ESO_number_wrapper input { height: 40px; } .ESO_number_wrapper a { position: absolute; height: 40px; width: 44%; line-height: 35px; text-align: center; font-size: 26px; border-radius: 20px; border-width: 1px; top: 0; color: #444545; transition: background-color 200ms; } .ESO_number_wrapper a:hover { text-decoration: none; background-color: #ccc; } .ESO_number_wrapper a.minus { left: 0; } .ESO_number_wrapper a.plus { right: 0; } .ESO_number_wrapper input { border-radius: 0; border-left: none; border-right: none; } .ESO_number_wrapper .plus { border: solid 1px #a0a0a0; border-radius: 0 20px 20px 0; border-left: none; text-align: right; padding-right: 20px; } .ESO_number_wrapper .plus:focus { text-decoration: none; } .ESO_number_wrapper .minus { border: solid 1px #a0a0a0; border-radius: 20px 0 0 20px; border-right: none; text-align: left; padding-left: 20px; } .ESO_number_wrapper .minus:focus { text-decoration: none; } /*** review stars ***/ .stars-container { margin-bottom: 15px; } .stars-container span { vertical-align: middle; display: inline-block; } .stars-container span.full, .stars-container span.half, .stars-container span.empty { width: 15px; height: 15px; margin-right: 2px; background: url(sprite.png) center -1021px no-repeat; background-size: 40px; } .stars-container span.half { background-position: center -1084px; } .stars-container span.empty { background-position: center -1146px; } /*** Fake Select ***/ .fake-select { position: relative; width: 100%; float: left; } .fake-select li.disabled { color: #a6a5a5; } .fake-select li.disabled label span:after { content: " - sold out online"; } .fake-select label { font-weight: normal; } .fake-select .selected { border: 1px solid #a0a0a0; border-radius: 20px; z-index: 5; position: relative; background: url(sprite.png) no-repeat 100% -440px #fff; background-size: 35px; cursor: pointer; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 8px 36px 8px 16px; height: 40px; font-size: 16px; text-align: left; text-transform: lowercase; } .fake-select .selected span:first-child { margin-right: 5px; } .fake-select .selected span:first-child:empty { display: none; } .fake-select .dummy { margin-top: 15px; } .fake-select ul { position: absolute; z-index: 4; margin-top: -2px; height: 0; width: 100%; background: #fff; overflow: hidden; left: 0; display: block !important; } .fake-select li { background-color: #fff; margin: 0; } .fake-select li.on { visibility: hidden; height: 0; } .fake-select li img, .fake-select .selected img { height: 30px; margin-right: 5px; border: 1px solid #a0a0a0; border-radius: 15px; } .fake-select li span { vertical-align: -webkit-baseline-middle; } .fake-select label:hover, .fake-select li > a:hover { background-color: #fff; text-decoration: none; } .fake-select label, .fake-select li > a, .fake-select li > span { cursor: pointer; padding: 6px 12px; background-color: #fff; position: relative; z-index: 2; margin: 0; width: 100% !important; } .fake-select label:hover, .fake-select li > a:hover, .fake-select li > span:hover { background-color: #e7f2d9; } .fake-select label, .fake-select li > a { display: block; } .fake-select input { position: absolute; z-index: 1; left: 10px; top: 0; } .fake-select.open { z-index: 10; } .fake-select.open ul { height: auto; text-align: left; border-width: 0 1px 1px 1px; border-radius: 0 0 4px 4px; border-style: solid; top: 24px; padding-top: 18px; } .fake-select.single { border-width: 1px; border-radius: 20px; border-style: solid; } .fake-select.single .selected { cursor: default; background-image: none; background-color: #f0f0f0; border-width: 0; padding: 4px 15px; } .fake-select.single ul { border: 0; } .actions .remove a, .wishlist-products .cartbutton a, .subscriptions-table .actions a { color: #444545; font-size: 0; } .actions .remove a:before, .wishlist-products .cartbutton a:before, .subscriptions-table .actions a:before { content: "X"; font-size: 19px; font-weight: bold; width: 20px; height: 20px; display: inline-block; text-align: center; line-height: 17px; } .actions .remove a:hover, .wishlist-products .cartbutton a:hover, .subscriptions-table .actions a:hover { opacity: 0.5; filter: alpha(opacity=50); /*IE8*/ } /**** accordion basic styling ****/ .eso-accordion-indicator { display: inline-block; padding-left: 6px; position: absolute; top: 18px; right: 0; width: 28px; height: 25px; background: url(sprite.png); background-size: 30px; cursor: pointer; } .eso-accordion-indicator + .eso-accordion-indicator { display: none; } .eso-accordion-trigger.collapsed .eso-accordion-indicator { background-position: 0 -906px; } .eso-accordion-trigger .eso-accordion-indicator { background-position: 0 -952px; } /**** Slick Slider ****/ .product-img .slick-slider .slick-prev:before { background-position: -14px -433px; } .product-img .slick-slider .slick-next:before { background-position: -11px -371px; } .product-img .slick-slider button { width: 16px; color: transparent; } .product-img .slick-slider button:before { background-color: transparent; } .product-img .slick-slider .slick-list { width: 90%; margin: 0 auto; } .slick-slider { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; margin-bottom: 30px; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slick-loading .slick-list { background: #fff url("ajax-loader.gif") center center no-repeat; } /* Arrows */ .slick-prev, .slick-next { overflow: hidden; position: absolute; display: block; height: 40px; width: 40px; line-height: 0px; cursor: pointer; background: transparent; color: transparent; top: 50%; margin-top: -10px; padding: 0; border: none; outline: none; z-index: 2; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; } .slick-prev:before, .slick-next:before { line-height: 1; color: white; opacity: 0.75; background: url(sprite.png) #e7f2d9; background-size: 40px; padding: 20px; } .slick-prev { left: 0px; } [dir="rtl"] .slick-prev { left: auto; right: 0px; } .slick-prev:before { content: ""; border-radius: 0 30px 30px 0; background-position: 0 -433px; } [dir="rtl"] .slick-prev:before { content: ""; border-radius: 0 30px 30px 0; background-position: 0 -433px; } .slick-next { right: 0px; } [dir="rtl"] .slick-next { left: 0px; right: auto; } .slick-next:before { content: ""; border-radius: 30px 0 0 30px; background-position: 0 -371px; } [dir="rtl"] .slick-next:before { border-radius: 30px 0 0 30px; background-position: 0 -371px; } /* Dots */ .slick-dots { position: absolute; bottom: -45px; list-style: none; display: block; text-align: center; padding: 0; width: 100%; } .slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0px; font-size: 0px; color: transparent; padding: 5px; cursor: pointer; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } .slick-dots li button:before { position: absolute; top: 0; left: 0; content: "\00b7"; width: 20px; height: 20px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { color: black; opacity: 0.75; } .homeslider { margin-bottom: 10px; } .homeslider .slick-prev, .homeslider .slick-next { overflow: visible; } .homeslider .slick-next:before { background-position: 4px -372px; } .homeslider .slick-prev:before { background-position: -4px -433px; } .homeslider span.glyphicon:hover:before { background: #fff; } .errorpage .redirect-message { font-weight: bold; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { .product-img .medium-image > img { display: block !important; } .product-img .medium-image .top-horizontal { width: 100%; } .product-img .slick-slider .slick-prev:before { background-position: -14px -433px; } .product-img .slick-slider .slick-next:before { background-position: 12px -372px; } .product-img .slick-slider button { width: 40px; } .product-img .slick-slider .slick-list { width: 100%; } .btn, button, .map-link a, .post-link a, .reply-link a { font-size: 16px; } .options a, .quickview a { font-size: 14px; } .buy-now form button { font-size: 12px; } .errorpage #page-header { height: 160px; } .btn, button, .map-link a, .post-link a, .reply-link a { width: auto; } #sign-in .customer.new { width: 100%; } .cataloguepage .page-container, .homepage .page-container, .productpage .page-container, .accountpage .page-container, .blogpage .page-container { margin-top: 0; } .cataloguepage h1, .productpage h1, .blogpage h1, .accountpage h1 { margin-top: 0; margin-bottom: 30px; } #main .cross-sell .item button, #main .featured .item button { min-width: inherit; } #page-content { width: 75%; float: left; margin-left: auto; margin-right: auto; } .fake-select .selected span + span { padding-right: 8px; margin-right: 3px; } } /*** DESKTOP ***/ @media (min-width: 1150px) { #breadcrumbs { display: block; } body:not(.cataloguepage):not(.productpage):not(.blogpage):not(.homepage) .page-container { margin-top: 88px; } body:not(.cataloguepage):not(.productpage):not(.blogpage) .main-container h1 { position: absolute; left: 0px; padding: 0; margin-top: -88px; } .main-container { padding: 0; } .main-container:before, .main-container:after { content: ""; display: table; } .main-container:after { clear: both; } .page-container { padding: 0; } form .telephone input[type="tel"], form .security-code input { margin-right: 1.25%; } .accountpage h1, .sitemap h1, .productpage h1, .blogpage h1 { position: inherit; text-align: left; } } /*! * Datepicker for Bootstrap * * Copyright 2012 Stefan Petre * Licensed under the Apache License v2.0 * http://www.apache.org/licenses/LICENSE-2.0 * */ .datepicker { top: 0; left: 0; padding: 4px; margin-top: 1px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .datepicker:before { content: ''; display: inline-block; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #ccc; border-bottom-color: rgba(0, 0, 0, 0.2); position: absolute; top: -7px; left: 6px; } .datepicker:after { content: ''; display: inline-block; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #ffffff; position: absolute; top: -6px; left: 7px; } .datepicker > div { display: none; } .datepicker table { width: 100%; margin: 0; } .datepicker td, .datepicker th { text-align: center; width: 20px; height: 20px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .datepicker td.day:hover { background: #eeeeee; cursor: pointer; } .datepicker td.day.disabled { color: #eeeeee; } .datepicker td.old, .datepicker td.new { color: #999999; } .datepicker td.active, .datepicker td.active:hover { color: #ffffff; background-color: #04582e; background-image: linear-gradient(to bottom, #04582e, #05703b); background-repeat: repeat-x; border-color: #05703b #05703b #04582e; } .datepicker td.active:hover, .datepicker td.active:hover:hover, .datepicker td.active:focus, .datepicker td.active:hover:focus, .datepicker td.active:active, .datepicker td.active:hover:active, .datepicker td.active.active, .datepicker td.active:hover.active, .datepicker td.active.disabled, .datepicker td.active:hover.disabled, .datepicker td.active[disabled], .datepicker td.active:hover[disabled] { color: #ffffff; background-color: #05703b; } .datepicker td.active:active, .datepicker td.active:hover:active, .datepicker td.active.active, .datepicker td.active:hover.active { background-color: #04582e \9; } .datepicker td span { display: block; width: 47px; height: 54px; line-height: 54px; float: left; margin: 2px; cursor: pointer; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .datepicker td span:hover { background: #eeeeee; } .datepicker td span.active { color: #ffffff; background-color: #04582e; background-image: linear-gradient(to bottom, #04582e, #05703b); background-repeat: repeat-x; border-color: #05703b #05703b #04582e; } .datepicker td span.active:hover, .datepicker td span.active:focus, .datepicker td span.active:active, .datepicker td span.active.active, .datepicker td span.active.disabled, .datepicker td span.active[disabled] { color: #ffffff; background-color: #05703b; } .datepicker td span.active:active, .datepicker td span.active.active { background-color: #04582e; } .datepicker td span.old { color: #999999; } .datepicker th.switch { width: 145px; } .datepicker th.next, .datepicker th.prev { font-size: 21px; } .datepicker thead tr:first-child th { cursor: pointer; } .datepicker thead tr:first-child th:hover { background: #eeeeee; } .input-append.date .add-on i, .input-prepend.date .add-on i { display: block; cursor: pointer; width: 16px; height: 16px; } /* ========= LAYOUT DETAILS COMPONENT END ========= */ /* ========= HEADER COMPONENT ========= */ #page-header { background: #05703b; z-index: 10; position: relative; } #page-header a:hover { text-decoration: none; } #page-header .content.header-top { display: none; } .page-header-container { position: relative; padding: 15px; } .logo a { margin: 0 auto; max-width: 400px; display: block; height: 45px; background: url(/images/assetimages/logo.png) no-repeat center; background-size: 65%; } /* MOBILE TRIGGERS - HEADER ICONS */ .mobile-triggers { float: left; } .mobile-triggers a { float: left; height: 40px; background: url(sprite.png) 0 -4px no-repeat; background-size: 40px; width: 44px; margin: 0; display: block; position: absolute; } .mobile-triggers a.icon-search { background-position: 0 -190px; } .mobile-triggers a.icon-currency { background-position: 0 -317px; } .mobile-triggers a.icon-menu { top: 15px; } .mobile-triggers a.icon-cart { background-position: 0 -64px; right: 15px; top: 15px; } .mobile-triggers .badge { position: absolute; right: 0; top: 0; } /* MOBILE TRIGGER - SUB MENU */ .mobile-trigger { position: absolute; right: 0px; width: 40px; top: 0; height: 40px; color: #fff; cursor: pointer; z-index: 5; background: url(sprite.png); background-size: 40px; background-position: 13px -1195px; } li.active > a + .mobile-trigger { background-position: 13px -1260px; } #header-nav { display: none; } #header-nav .header-nav-container { z-index: 10; padding: 0; text-align: center; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-wrap: wrap; flex-direction: row; -webkit-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); -moz-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); } #header-nav .header-nav-container > ul { padding: 0; text-align: left; margin: 0; width: 100%; order: 5; } #header-nav .header-nav-container > ul > li.on > a { color: #7cc244; } #header-nav .header-nav-container > ul > li { position: relative; margin: 0 15px; border-top: 1px dashed #a0a0a0; } #header-nav .header-nav-container li.with-children > ul { display: none; } #header-nav .header-nav-container li.active > ul { display: block; } #header-nav .header-nav-container ul > li ul > li > a, #header-nav .header-nav-container ul > li ul > li > .structural { color: #444545; display: block; padding: 10px 0; font-size: 16px; } #header-nav .header-nav-container .submenu { display: none; } #header-nav .header-nav-container .submenu li { display: block; padding: 0; } #header-nav .header-nav-container .active .submenu { display: block; border: 0; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s; display: inherit; } #header-nav .header-nav-container > ul > li.on > a, #header-nav .header-nav-container > ul > li:hover > a { border-bottom: 3px solid #444545; } #header-nav.dropdown.in { display: block; background: #e7f2d9; position: absolute; width: 100%; z-index: 999; top: 70px; } #header-nav .submenu-content { padding-bottom: 10px; } #header-nav .submenu-content .nav-flyout { width: 34%; display: none; float: right; overflow: hidden; } #header-nav .submenu-content .nav-flyout img { height: 100%; } #header-nav .header-nav-container > ul > li > a, .m-nav-links a, #header-nav .header-nav-container > ul > li > .structural { padding: 12px 0; text-transform: uppercase; display: block; font-size: 16px; } #header-nav .header-nav-container > ul > li > a:hover, .m-nav-links a:hover, #header-nav .header-nav-container > ul > li > .structural:hover { color: #7cc244; } .loggedin .m-nav-links a { padding: 20px 0; } > .loggedin .m-nav-links:first-of-type :before, .loggedin .m-nav-links:nth-of-type(2) :before { content: ""; width: 20px; height: 20px; margin: auto; margin-bottom: 8px; display: block; } .loggedin .m-nav-links:last-of-type { width: 100%; border-top-width: 1px; margin: 0 15px; } .loggedin .m-nav-links:last-of-type a { padding: 12px 0; text-align: left; text-transform: uppercase; } .loggedin .m-nav-links:nth-of-type(2) :before { background: url(sprite.png) 50% -1887px no-repeat; background-size: 50px; } .m-nav-links { margin: 8px 0; width: 49.8%; float: left; } .m-nav-links:first-of-type :before, .m-nav-links:nth-of-type(2) :before { content: ""; width: 20px; height: 20px; margin: auto; margin-bottom: 8px; display: block; } .m-nav-links:first-of-type :before { background: url(sprite.png) 50% -1813px no-repeat; background-size: 50px; } .m-nav-links:nth-of-type(2) :before { background: url(sprite.png) 50% -1959px no-repeat; background-size: 50px; } .m-nav-links:first-of-type { border-right-width: 1px; } .m-nav-links a { color: #444545; padding: 28px 0; text-align: center; text-transform: lowercase; } .icon-menu, .icon-link { float: none; cursor: pointer; } .navbar { margin-bottom: 0; } .header-account span { display: none; } .header-account ul { display: none; padding-left: 0; } .header-cart { clear: both; } .header-account, .header-compare, .header-cart, .currency-estimator, .search { position: relative; } .header-account, .header-compare, .search { float: left; } .header-account .currency-estimator { display: none; } .header-account .icon-link, .header-cart .icon-link, .currency-estimator .icon-link, .header-search .icon-link, .header-cart-summary, .header-compare.empty, .header-cart-summary .ajax-content { display: none; } /* Currency Menu */ #currency-menu ul { display: none; border: 0; } #currency-menu .selected { padding: 6px 18px; margin-top: 4px; height: 48px; background-position: 100% -657px; text-transform: uppercase; } #currency-menu .selected span { color: #444545; } #currency-menu .selected span:first-child { margin: 0; } #currency-menu li { position: relative; } #currency-menu form > label { display: none; padding-top: 4px; float: left; width: auto; margin-right: 5px; } #currency-menu .open ul { display: block; float: left; padding-left: 0; width: 100%; -webkit-box-shadow: 0px 5px 16px 0px rgba(204, 204, 207, 0.31); -moz-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); box-shadow: 0px 5px 16px 0px rgba(163, 163, 163, 0.31); } .login:after { content: "|"; margin-left: 20px; color: #fff; } .login #sign-in { display: none; font-size: 14px; background: #fff; width: 350px; position: absolute; z-index: 999; top: 43px; border-top: 0; left: 0; padding: 25px; -webkit-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); -moz-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); } .login #sign-in button, .login #sign-in .btn { width: 100%; padding: 0; } .login #sign-in a:hover:not(.btn) { color: #e7f2d9; } .login #sign-in #header-retrieve-password { display: none; } .login #sign-in h2 { font-size: 24px; margin-top: 0; } .login #sign-in li.forgotten { margin-bottom: 0; padding: 10px; } .login #sign-in li.forgotten a { font-size: 11px; text-decoration: underline; line-height: normal; display: inherit; text-align: center; } .login #sign-in .signup { border-top-width: 1px; padding-top: 25px; margin-top: 15px; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; justify-content: space-between; height: 50px; } .login #sign-in .signup p:first-child { text-align: left; display: inline-block; } .login #sign-in .note { display: none; } .login.on #sign-in { display: block; } .nav-trigger { display: inline-block; height: 10px; width: 10px; background-color: #ccc; } /*ajax cart*/ .header-cart-summary .badge { border-radius: 12px; padding: 5px 8px 4px 9px; font-size: 14px; position: absolute; top: 8px; right: 0; } .header-cart-summary .ajax-content { z-index: 999; width: 400px; position: absolute; top: 60px; right: 0; font-size: 14px; background: #fff; clear: both; padding: 40px; -webkit-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); -moz-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); } .header-cart-summary .ajax-content h4 { margin-top: 0; text-decoration: none; margin-bottom: 10px; } .header-cart-summary .ajax-content .next-previous a { width: 100%; margin-bottom: 0; } .header-cart-summary .ajax-content h3 { margin-top: 0; padding-bottom: 10px; margin-bottom: 20px; border-bottom: 1px dashed #a0a0a0; } .header-cart-summary .ajax-content .empty + .next-previous .prev { background-color: #05703b; color: #fff; text-decoration: none; border-radius: 20px; font-weight: normal; } .header-cart-summary .summary-table .style-number { display: none; } .header-cart-summary .summary-table p { margin-bottom: 0; } .header-cart-summary .summary-table td.pricing { margin-top: 0; } .header-cart-summary .summary-table td.pricing:before { content: "Price: "; } .header-cart-summary .summary-table .total:before { content: "Item Sub Total: "; } .header-cart-summary .summary-table .total { margin-bottom: 10px; font-weight: bold; } .header-cart-summary .summary-table .item-detail, .header-cart-summary .summary-table .qty, .header-cart-summary .summary-table .pricing, .header-cart-summary .summary-table .total { float: right; clear: right; width: 67%; max-width: none; text-align: left; } .header-cart-summary .summary-table p.price.save { display: none; } .header-cart-summary .summary-table p.price { display: inline; } .header-cart-summary .summary-table p.price.was { padding-right: 4px; } .header-cart-summary .summary-table p.price.was:before { margin-right: 4px; } .header-cart-summary .summary-table p.now:before { content: none; } .header-cart-summary .summary-table .item-detail span, .header-cart-summary .summary-table p.price, .header-cart-summary .summary-table td { font-size: 12px; } .header-cart-summary .summary-table .click-and-collect { padding: 10px 0; } .header-cart-summary .summary-table .click-and-collect h4 { margin-bottom: 0; font-size: 18px; text-transform: uppercase; } .header-cart-summary .summary-table .click-and-collect p { text-transform: none; } .header-cart-summary .summary-table .click-and-collect .popover-title { background-color: #fff; border-bottom: 0; padding: 13px 12px 0 22px; color: #444545; font-weight: normal; } .header-cart-summary .summary-table #main .cc-delivery-method .tab-content li { width: 100%; } .header-cart-summary > h3 { border-bottom-width: 1px; padding-bottom: 10px; margin-top: 10px; } .header-cart-summary h4 { margin-top: 0; } .header-cart-summary h4 a { color: #444545; font-size: 14px; display: inline-block; } .header-cart-summary h4 a:hover { text-decoration: underline !important; } .header-cart-summary table { width: 100%; } .header-cart-summary thead { display: none; } .header-cart-summary tr { border-bottom-width: 1px; padding-right: 8%; display: block; position: relative; padding-bottom: 10px; margin-bottom: 10px; } .header-cart-summary tr:before, .header-cart-summary tr:after { content: ""; display: table; } .header-cart-summary tr:after { clear: both; } .header-cart-summary td { border: 0; padding: 0; } .header-cart-summary .item { width: 100%; display: block; } .header-cart-summary .item figure { margin-right: 10px; width: 80px; } .header-cart-summary .next-previous a { width: 100%; margin: 10px 0 5px; } .header-cart-summary .qty:before { content: "Qty: "; } .header-cart-summary td.actions li.remove { position: absolute; top: 5px; right: 0; width: 20px; } .header-cart-summary .cart-total { margin-top: 0; padding: 15px 0; width: 100%; } .header-cart-summary .cart-total span.hint { display: none; } .header-cart-summary .cart-total .hint { font-size: 12px; } .header-cart-summary .loading, .login #sign-in.loading { min-height: 40px; background: #fff url(ajax-loader.gif) center no-repeat; display: block; position: absolute; } .header-cart-summary.on .ajax-content { display: block; } .loggedin .logout, .loggedin .account, .loggedin .history { padding-top: 0px; } .m-nav-links a .badge { color: #444545; } .m-nav-links a .badge:before { background: none !important; display: inline; } #account-menu .wishlist .badge, .m-nav-links a .badge { background-color: transparent; vertical-align: baseline; font-weight: normal; font-size: 14px; } #account-menu .wishlist .badge:before, .m-nav-links a .badge:before { content: "("; } #account-menu .wishlist .badge:after, .m-nav-links a .badge:after { content: ")"; } .header-account a { color: #444545; } #header-nav .header-nav-container li.active.with-children > a { border-bottom: none; } #header-nav .header-nav-container > ul > li.on > a, #header-nav .header-nav-container > ul > li:hover > a { border-bottom: none; } /* Header Search */ .header-search { position: relative; float: right; width: 100%; margin: 15px 0 5px 0; } #search-menu { padding: 2px 0; background: #307d4b; border-radius: 26px; } #search-menu .autocomplete .articles a { background-color: #e7f2d9; padding: 20px; text-align: center; color: #444545; } #search-menu .autocomplete a { width: 100%; margin-bottom: 0; } #search-menu .autocomplete a h4 { margin: 0; } #search-menu .autocomplete a h4:hover { text-decoration: underline; } #search-menu .item-detail { width: 100%; } #search-menu label { display: none; } #search-menu input { border-radius: 20px; padding-left: 20px; width: 70%; height: 40px; font-weight: bold; border: 0; border-radius: 20px; background: transparent; font-weight: normal; color: #fff; } #search-menu button { width: 20px; background: url(sprite.png) 4px -140px no-repeat; background-size: 30px; text-indent: -9999px; padding: 10px 20px; float: right; } #search-menu.in { margin-bottom: 15px; } .autocomplete { position: absolute; width: 100%; top: 60px; left: 0; background: #fff; z-index: 999; border-top-weight: 1px; -webkit-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); -moz-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); display: none; } .autocomplete .description { width: 250px; } .autocomplete .item { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; width: 100%; } .autocomplete .item .options { display: none !important; } .autocomplete .item h4 { margin-top: 0; width: 100%; } .autocomplete .item h4 a { font-size: 14px; } .autocomplete .offer, .autocomplete .buy-now, .autocomplete .colours, .autocomplete .reviews, .autocomplete .options, .autocomplete .quickview { display: none; } .autocomplete .item figure, .autocomplete h4, .autocomplete .reviews, .autocomplete .pricing { display: block; } .autocomplete .item { margin-top: 0; } .autocomplete .item figure > a > img { width: 100px; } .autocomplete .item figure > a .overlay span { max-width: 25px; } .autocomplete .item figure > a .overlay span.on-sale { margin: 5px 5px 5px auto; } .autocomplete .item-detail { float: right; padding-left: 25px; justify-content: center; } .autocomplete h4 a { margin: 0; color: #444545; } .autocomplete h4 a:hover { text-decoration: underline !important; } .autocomplete li { margin-bottom: 0; } .autocomplete li:before, .autocomplete li:after { content: ""; display: table; } .autocomplete li:after { clear: both; } .autocomplete li h3, .autocomplete li p { margin: 0; } .autocomplete li li { border-bottom-width: 1px; margin: 25px 25px 0 25px; padding-bottom: 25px; } .autocomplete .thumbnail { float: left; margin: 0 10px 0 0; } .autocomplete .thumbnail img { width: 30px; } .autocomplete .view-all a { text-align: center; display: block; padding: 10px 20px; background: #05703b; border-radius: 20px; color: #fff; text-decoration: none; font-weight: normal; } .autocomplete .articles h4 { width: auto; float: none; font-size: 14px; } .autocomplete .products { padding-bottom: 0; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { #page-header { border-width: 0; } #page-header:before { content: " "; height: 43px; display: block; width: 100%; position: absolute; } #page-header .content.header-top { display: inline-block; position: absolute; left: 0; max-width: 50%; max-height: 43px; color: #fff; } #page-header .content.header-bottom:before { content: "."; background: #e7f2d9; height: 71px; display: block; width: 100%; position: absolute; left: 0; border-bottom: 1px dashed #a0a0a0; } #page-header .content.header-middle { clear: both; } #page-header .mobile-triggers, #page-header .mobile-trigger { display: none; } .page-header-container { padding: 0 15px; position: relative; font-size: 14px; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; } .logo { order: 2; width: 46%; } .logo a { width: 395px; height: 54px; background: url(/images/assetimages/logo.png) no-repeat center; background-size: 395px 54px; margin-left: 0; } .header-account { order: 1; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; width: 100%; margin-top: 10px; } .header-account > span:first-of-type { padding-top: 12px; color: #fff; text-transform: uppercase; } .header-account > span:first-of-type:after { content: "|"; margin-left: 20px; } .header-account .currency-estimator { display: block; } .header-account ul#account-menu { display: inline-flex; flex-grow: 1; } .header-account ul#account-menu .logout { margin-left: 20px; flex-grow: 1; } .header-account ul#account-menu li.account > a:after { content: "|"; margin-left: 20px; } .header-account ul#account-menu li.account > a:before, .header-account ul#account-menu li.wishlist > a:before { content: ""; width: 20px; height: 20px; margin-right: 6px; vertical-align: text-bottom; display: inline-block; } .header-account ul#account-menu li.account > a:before { background: url(sprite.png) 50% -1663px no-repeat; background-size: 50px; } .header-account ul#account-menu li.wishlist > a:before { background: url(sprite.png) 50% -1738px no-repeat; background-size: 50px; } .header-account span { display: inherit; } #header-nav { display: block; background: #126135; border-radius: 0; } #header-nav .container ul ul { display: none; } #header-nav .header-nav-container > ul { text-align: center; position: relative; z-index: 3; } #header-nav .header-nav-container { box-shadow: none; padding: 8px 0 0; } #header-nav .header-nav-container ul > li.active > a { color: #7cc244; } #header-nav .header-nav-container ul > li { position: static; border: 0; display: inline-block; float: none; padding: 0; } #header-nav .header-nav-container ul > li > a, #header-nav .header-nav-container ul > li > .structural { color: #fff; text-transform: uppercase; padding: 10px 20px; font-size: 16px; } #header-nav .header-nav-container ul > li ul { padding: 25px; width: 66%; position: relative; -moz-column-count: 2; -moz-column-gap: 20px; -webkit-column-count: 2; -webkit-column-gap: 20px; column-count: 2; column-gap: 20px; } #header-nav .header-nav-container .active .submenu { -webkit-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); -moz-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); position: absolute; left: 0; background: #fff; width: 100%; text-align: left; z-index: 10; } #header-nav .header-nav-container ul > li ul > li > a, #header-nav .header-nav-container ul > li ul > li > .structural { color: #444545; padding: 10px; border: 0; font-size: 14px; } #header-nav .header-nav-container ul > li ul > li > a:hover, #header-nav .header-nav-container ul > li ul > li.on > a { color: #7cc244; } #header-nav.dropdown.in { background: none; } #header-nav .submenu-content { padding-bottom: 0; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; } #header-nav .submenu-content .nav-flyout { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; } #sign-in input { width: 100%; } .page-header-container a { color: #fff; } .page-header-container .forgotten a { color: #444545; } .page-header-container .forgotten a:hover { color: #e7f2d9; text-decoration: underline; } .header-cart { float: right; clear: none; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-direction: column; order: 3; } .header-cart .currency-estimator { display: block; } .header-cart-summary { display: block; float: right; margin-left: 10px; opacity: 1; } .header-cart-summary > a { height: 60px; padding: 20px 56px 0 10px; background: url(sprite.png) 72px -78px no-repeat; background-size: 50px; display: block; text-transform: uppercase; position: relative; } .header-cart-summary.on { margin-top: 0; } .header-cart-summary.on .loading .ajax-content { display: none; } .header-account ul, #header-nav ul, #currency-menu, #search-menu { display: block; visibility: visible; } .header-account a:hover { color: #ccc; } .header-account ul#account-menu { padding-top: 0; } .header-account ul#account-menu li > a { line-height: 43px; } .header-account ul#account-menu .password label, .header-account ul#account-menu .email label { width: 100%; } .header-account > ul > li, .header-options > ul > li { margin-right: 20px; text-transform: lowercase; } .header-cart > a { float: right; margin-left: 20px; } .nav-trigger, .m-nav-links { display: none; } #search-menu { float: none; } #search-menu input { width: 340px; } #search-menu button { width: 20px; background: url(sprite.png) -4px -194px no-repeat; background-size: 40px; text-indent: -9999px; padding: 10px 20px; } .header-search { width: 380px; margin-bottom: 30px; width: 100%; order: 4; } .autocomplete { display: block; } /* Currency Menu */ #currency-menu .fake-select { width: 80px; float: right; } #currency-menu .selected { border-width: 0; padding: 6px 18px; height: auto; background-position: 100% -222px; background-color: #116137; } #currency-menu .selected span { color: #fff; } #currency-menu .open ul { top: 50px; padding: 0; float: left; padding-left: 0; border: 0; width: 80px; -webkit-box-shadow: 0px 5px 16px 0px rgba(204, 204, 207, 0.31); -moz-box-shadow: 0px 5px 16px 0px rgba(50, 50, 51, 0.31); box-shadow: 0px 5px 16px 0px rgba(163, 163, 163, 0.31); } #currency-menu .open ul :hover { background-color: #e7f2d9; } .currency-estimator { float: right; } .summary-table .item-detail .click-and-collect h4 { text-transform: uppercase; font-size: 14px; } } /*** DESKTOP ***/ @media (min-width: 1150px) { .page-header-container { padding: 0; } #header-nav .header-nav-container .submenu li a { padding: 10px 15px; } .header-search { width: auto; order: 3; margin-top: 8px; } .header-cart { order: 4; } } @media (min-width: 1200px) { .page-header-container .logo { width: 55%; } } /* ========= HEADER COMPONENT END ========= */ /* ========= BREADCRUMB COMPONENT ========= */ #breadcrumbs { display: none; } .breadcrumb-container { padding: 0; } .breadcrumb-container .sort-by { float: right; margin-top: 11px; } .breadcrumb-container .sort-by .filter { display: inline-block; } .breadcrumb-container .sort-by ul { padding-left: 10px; } .breadcrumb-container .sort-by li { padding: 0 10px; border-left: 1px solid white; } .breadcrumb-container .sort-by li:nth-of-type(1n+4) { display: none; } .breadcrumb-container .sort-by li.on a { color: #444545; } .breadcrumb-container .sort-by li, .breadcrumb-container .sort-by h2 { border-bottom: 0; display: inline-block; text-transform: uppercase; font-size: 12px; margin: 0; } .breadcrumb-container .breadcrumb { margin-bottom: 0; list-style: none; float: left; } .breadcrumb-container .breadcrumb a { text-decoration: underline; } .breadcrumb-container .breadcrumb a:hover { color: #444545; text-decoration: none; } .breadcrumb-container .breadcrumb > li { font-size: 11px; display: inline-block; text-transform: lowercase; } .breadcrumb-container .breadcrumb > li + li:before { content: "/ "; padding: 0 3px 0 10px; color: #a6a5a5; } .breadcrumb-container .breadcrumb > .active * { color: #a6a5a5; } .breadcrumb-container .breadcrumb li, .breadcrumb-container .breadcrumb a { color: #a6a5a5; } /* Cart pages */ .cartpage.loggedin #breadcrumbs .login { display: none; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { #breadcrumbs { display: block; } #breadcrumbs .breadcrumb { padding: 20px 15px; } } @media (min-width: 1150px) { #breadcrumbs .breadcrumb { padding: 25px 0; } } /* ========= BREADCRUMB COMPONENT END ========= */ /* ========= LEFT NAV COMPONENT ========= */ .cataloguepage #left-nav .menu.dynamic li, .searchpage #left-nav .menu.dynamic li, .infopage #left-nav .menu.dynamic li { display: none; } .cataloguepage #left-nav .sort-by h2, .cataloguepage #left-nav .filter-by h2, .cataloguepage #left-nav .left-nav-container .menu > ul > li.on > a, .cataloguepage #left-nav .left-nav-container .menu li.on > span, .searchpage #left-nav .sort-by h2, .searchpage #left-nav .filter-by h2, .searchpage #left-nav .left-nav-container .menu > ul > li.on > a, .searchpage #left-nav .left-nav-container .menu li.on > span, .infopage #left-nav .sort-by h2, .infopage #left-nav .filter-by h2, .infopage #left-nav .left-nav-container .menu > ul > li.on > a, .infopage #left-nav .left-nav-container .menu li.on > span { padding-bottom: 10px; display: none; color: #444545; font-size: 36px; text-transform: capitalize; } .cataloguepage #left-nav .menu li.on, .cataloguepage #left-nav .menu li.on li, .searchpage #left-nav .menu li.on, .searchpage #left-nav .menu li.on li, .infopage #left-nav .menu li.on, .infopage #left-nav .menu li.on li { display: block; } body:not(.cataloguepage) #left-nav .menu { padding: 68px 20px 0 0; } #left-nav { padding: 0; font-size: 16px; } #left-nav .content { margin-bottom: 10px; } #left-nav .menu:not(.collapsing):not(.collapsed) { display: none; } #left-nav .menu > ul { padding: 0; line-height: 2; text-transform: lowercase; } #left-nav .menu ul ul li > ul { margin-left: 15px; } #left-nav .menu ul li li.on > a { color: #7cc244; } #left-nav .menu li { padding: 5px 0 0; } #left-nav .sort-by { padding-bottom: 20px; } #left-nav .filter-by { margin-top: 10px; } #left-nav .filter-by h2 { margin-bottom: 0; border-bottom: 0; padding-bottom: 15px; } #left-nav .filter-by .filter h3 { margin: 0; padding: 18px 0; border-top-width: 1px; cursor: pointer; font-size: 14px; } #left-nav .filter-by .filter > li { padding: 10px 0; } #left-nav .filter-by .filter ul li { padding: 6px 0; } #left-nav .filter-by .filter ul li:first-child { padding-top: 0px; } #left-nav .filter-by .filter ul li a { color: #444545; } #left-nav .filters { display: none; border-width: 1px; border-style: solid; border-radius: 20px; margin-top: 5px; margin-bottom: 20px; padding: 0 15px; position: relative; } #left-nav .filters .sort-by { display: none; } #left-nav .filters:before, #left-nav .filters:after { content: ""; display: table; } #left-nav .filters:after { clear: both; } #left-nav .filters li { padding: 5px 0; } #left-nav .filters h2, #left-nav .filters h3:not(:first-child), #left-nav .filters li, #left-nav .filters > h3 { font-size: 14px; } #left-nav .filters > h3 { padding: 13px 0; margin: 0; text-transform: none; cursor: pointer; } #left-nav .filters .filter { margin-bottom: 0; position: relative; } #left-nav .filters .filter h3 { cursor: pointer; text-transform: uppercase; } #left-nav .filters .filter li a:hover { text-decoration: none; } #left-nav .filters .filter li > a:before, #left-nav .filters .filter-by li.on .title:before { content: " "; display: inline-block; width: 12px; height: 12px; margin-right: 7px; background-color: #e7f2d9; } #left-nav .filters .filter li.on .title:before, #left-nav .filters .filter li.on > a:before, #left-nav .filters .filter li > a:hover:before { background-color: #7cc244; } #left-nav .filters .filter-by { display: block; clear: both; } #left-nav .filters .filter-title { display: block; cursor: pointer; } #left-nav .filters .fake-select, #left-nav .filters .fake-select ul { width: 100%; } #left-nav .filters .fake-select { float: none; } #left-nav .filters .fake-select .selected { background: url(sprite.png) no-repeat 96% -338px; background-size: 20px; } #left-nav .filters .filter-by .filter ul li:last-child { padding-bottom: 15px; } li.on > .count { visibility: hidden; } li.on > .count :after { content: "X"; visibility: visible; margin-left: -30px; font-weight: bold; text-transform: uppercase; } .count { display: inline-block; padding-left: 5px; } .count:before { content: "("; } .count:after { content: ")"; } .accountpage #left-nav li.on > a { font-weight: bold; color: #444545; } /*** DESKTOP ***/ @media (min-width: 768px) { #left-nav { width: 18%; float: left; margin-left: 0; margin-right: 7%; font-size: 16px; } #left-nav .menu:not(.collapsing):not(.collapsed) { display: block; } #left-nav .menu { display: block; margin-bottom: 30px; } .filter-by .filter:last-child { border-bottom-width: 1px; } #left-nav .filters { display: block; border: none; margin-bottom: 20px; padding: 0; } #left-nav .filters > .collapse { display: block; visibility: visible; height: auto !important; } #left-nav .filters > h3, #left-nav .filters .sort-by { display: none; } #left-nav .filters .filter-by > h2, #left-nav .filters .filter-by h3 { font-size: 14px; } #left-nav .filters .filter-by .filter ul li:last-child { padding-bottom: 10px; } .left-nav-container { padding: 0; } .left-nav-container .filters.filter > h3 > .eso-accordion-indicator:first-of-type { position: absolute; top: 18px; right: 0px; } } /* ========= LEFT NAV COMPONENT END ========= */ /* ========= FOOTER COMPONENT ========= */ #page-footer { margin-top: 40px; background: url(ampersand.png); background-repeat: no-repeat; background-position: left -30px bottom 80px; font-size: 16px; background-color: #e7f2d9; } #page-footer .currency-estimator .open ul { padding: 0; margin-top: 18px; } #page-footer .currency-estimator .open ul label { padding-left: 15px; } #page-footer .currency-estimator .fake-select { background-color: transparent; border-bottom-width: 1px; border-style: solid; border-color: #ccc; } #page-footer .currency-estimator .fake-select .dummy { display: none; } #page-footer .currency-estimator .fake-select .selected { margin-top: 0; border: none; background-position: 99% -435px; padding: 14px 20px 14px 16px; background-color: transparent; } #page-footer .content { clear: both; } #page-footer .content h2 { font-size: 16px; font-weight: bold; text-transform: uppercase; margin: 0; } .footer-nav-container #currecncy-form-footer label { margin: 5px 0; text-transform: uppercase; } .footer-nav-container #currecncy-form-footer .info-container li { margin-bottom: 0; } .footer-nav-container #currecncy-form-footer .info-container li span { font-weight: normal; font-size: 14px; } .footer-nav-container #currecncy-form-footer .info-container li input[type="radio"] { display: none; } .footer-nav-container > ul { border-top-width: 1px; } .footer-nav-container > ul > li { padding: 10px 0; position: relative; border-bottom-width: 1px; } .footer-nav-container > ul > li > a, .footer-nav-container > ul > li > span { text-transform: uppercase; } .footer-nav-container li a, .footer-nav-container li span { display: inline-block; padding: 5px 0; color: #444545; } .footer-nav-container li span { cursor: pointer; } .footer-nav-container .eso-accordion-indicator { display: inline-block; padding-left: 6px; position: absolute; right: -15px; top: 1px; height: 50px; width: 50px; background: url(sprite.png); background-size: 40px; background-position: 9px -1257px; } .footer-nav-container .eso-accordion-trigger.collapsed .eso-accordion-indicator { background-position: 9px -1194px; } .footer-nav-container .eso-accordion > li > span, .footer-nav-container .eso-accordion > li > a { font-weight: bold; width: 100%; } .footer-nav-container .eso-accordion li ul li a { color: #444545; text-transform: lowercase; } .estar { background-color: #fff; } .estar #paymentOptions { width: 150px; margin: 0 auto; margin-bottom: 20px; } .estar #paymentOptions img { margin: 0 5px; width: 40px; } .estar .container { text-align: center; padding: 20px 0; font-size: 14px; } .estar .container a { color: #444545; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { #footer-nav { float: left; width: 65%; } #page-footer { background: #e7f2d9 url(ampersand.png) -5% 110px no-repeat; } #page-footer .currency-estimator { display: none; } #page-footer .content h2 { text-align: left; } #page-footer .page-footer-container { padding: 50px 0; } .footer-nav-container #currecncy-form-footer { display: none; } .footer-nav-container > ul { border-top-width: 0; margin: 0; } .footer-nav-container .eso-accordion li ul li a { color: #444545; } .footer-nav-container .eso-accordion li ul li a:hover { color: #444545; } .footer-nav-container .collapse.eso-accordion { display: block; visibility: visible; height: auto !important; } .footer-nav-container .collapsing.eso-accordion { height: auto !important; } .footer-nav-container > ul > li { width: 33%; float: left; border: 0; padding: 0; } .footer-nav-container > ul > li span { cursor: default; } .footer-nav-container > ul > li span.eso-accordion-indicator { display: none; } .estar .container a { float: left; margin-top: 5px; } .estar .container #paymentOptions { float: right; padding-top: 0; } } /*** DESKTOP ***/ @media (min-width: 1150px) { .footer-nav-container, #page-footer .content { padding: 0; } #footer-nav { width: 60%; } #page-footer { background: #e7f2d9 url(ampersand.png) 10% -30px no-repeat; } } /* ========= FOOTER COMPONENT END ========= */ /* ========= CATALOGUE LISTING COMPONENT ========= */ /*** tool bar filters ***/ .bottom { display: none; } .toolbar h4 { font-size: 14px; font-weight: bold; margin: 10px 10px 0 0; text-decoration: none; text-transform: lowercase; } .toolbar .count { visibility: hidden; } .toolbar .count :after { content: "X" !important; visibility: visible; margin-left: -40px; font-weight: bold; text-transform: uppercase; } .toolbar .active-filters { display: none; justify-content: flex-end; } .toolbar .active-filters h4:before { content: "Active "; text-transform: lowercase; } .toolbar .active-filters div:last-of-type { margin-top: 5px; text-decoration: underline; } .toolbar .active-filters li { display: inline-flex; margin-right: 10px; background-color: #e7f2d9; border-radius: 16px; padding: 6px 18px; } .toolbar .menu { display: none; } .toolbar:before, .toolbar:after { content: ""; display: table; } .toolbar:after { clear: both; } .toolbar .filters { display: block; margin-bottom: 10px; font-size: 12px; } .toolbar .filters .selected { padding: 9px 0 9px 78px; text-transform: uppercase; } .toolbar .filters .filter { width: 100%; position: relative; } .toolbar .filters .filter-by { border-width: 1px; border-style: solid; border-radius: 20px; margin-top: 10px; padding: 10px 15px; } .toolbar .filters .filter-by ul { margin-top: 15px; text-transform: uppercase; } .toolbar .filters .filter-by ul > .info-container > div { border-top-width: 1px; padding: 12px 0; } .toolbar .filters .filter-by ul > .info-container > div .eso-accordion-indicator { right: -5px; } .toolbar .filters .filter-by ul > .info-container > div ul li.on:before { background-color: #7cc244; } .toolbar .filters .filter-by ul > .info-container > div ul li { text-transform: lowercase; font-size: 14px; padding: 6px 0; } .toolbar .filters .filter-by ul > .info-container > div ul li .count { visibility: hidden; } .toolbar .filters .filter-by ul > .info-container > div ul li .count :after { content: "X"; visibility: visible; margin-left: -40px; font-weight: bold; text-transform: uppercase; } .toolbar .filters .filter-by ul > .info-container > div ul li:before { content: " "; display: inline-block; width: 12px; height: 12px; margin-right: 7px; background-color: #e7f2d9; } .toolbar .filters .filter-by ul > .info-container > div:last-of-type { border-bottom-width: 1px; } .toolbar .filters .filter-by ul h2 { display: none; } .toolbar .filters .filter-by .eso-accordion-indicator { top: 11px; right: 6px; } .toolbar .filters .filter-by h3 { font-size: 16px; margin: 0; } .toolbar .filters .sort-by .filter, .toolbar .filters .sort-by h2 { display: inline-block; vertical-align: middle; } .toolbar .filters .sort-by h2 { padding: 0 5px 0 0; margin: 4px 0 0; font-size: 16px; position: absolute; z-index: 99; padding: 0 5px 0 16px; margin: 12px 0 0; font-size: 16px; position: absolute; z-index: 99; } .result-summary { width: 100%; text-align: center; margin: 20px 0; } .result-summary .showing { display: none; } .featured { clear: both; margin-top: 15px; padding-top: 15px; border-bottom-width: 1px; border-top-width: 1px; } .featured .item { margin-top: 0; } .featured h2 { font-size: 18px; } .cataloguepage h4 { width: 100%; order: 1; } .loggedin .item .options { display: block; } .loggedin .item-detail h4 { width: 84%; } .item .item-detail { position: relative; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-direction: column; } .item .item-detail .offer { order: 2; } .item .item-detail .colours { order: 4; } .item .item-detail .pricing { order: 3; } .item figure img { width: 100%; } .item h4 { margin: 20px 0 20px 0; } .item h4 a { font-size: 16px; color: #444545; } .item .item-brand { position: absolute; right: 0; top: -45px; height: 30px; text-indent: -9999px; } .item .item-brand img { height: 100%; display: block; } .item .options { display: none; clear: both; position: absolute; bottom: 0; right: 0; top: 18px; } .item .options:before, .item .options:after { content: ""; display: table; } .item .options:after { clear: both; } .item .options .add-wishlist { text-decoration: none; background: url(sprite.png) no-repeat -11px -722px; background-size: 45px; width: 23px; height: 23px; position: relative; text-indent: -9999px; padding: 0; border-radius: 0; } .item .options .selected, .item .options .added { background: url(sprite.png) no-repeat -11px -793px; background-size: 45px; } .item .options a + a { margin-left: 10px; } .item .item-asset { clear: both; } .item .quickview, .item .buy-now { margin: 0 0 10px 0; } .item .buy-now button, .item .quickview .btn, .item .options a { width: 100%; } .item .colours:before, .item .colours:after { content: ""; display: table; } .item .colours:after { clear: both; } .item .colours li { display: none; float: left; margin: 0 3px 3px 0; } .item .colours li.on { border-color: #444545; } .item .colours li span { display: none; } .item .colours li img { width: 20px; height: 20px; display: block; display: none; border: 1px solid #a0a0a0; border-radius: 0; } .item .colours li.no-image { display: none; } .item .price { font-size: 14px; font-weight: bold; } #main .products { padding-bottom: 20px; margin-bottom: 20px; } #main .products:before, #main .products:after { content: ""; display: table; } #main .products:after { clear: both; } #main .products .item { width: 45%; float: left; margin-left: 10%; margin-bottom: 30px; } #main .products .item:nth-of-type(2n+1) { clear: both; margin-left: 0%; } #main .products .next_link { clear: both; } .loading-message { text-align: center; width: 100%; clear: both; display: none; } .loading-message span { display: inline-block; padding-left: 30px; background: url("ajax-loader.gif") 0 0 no-repeat; } .next_link + .loading_message { display: block; } .page-numbers { display: block; text-transform: uppercase; color: #e7f2d9; margin-bottom: 10px; position: relative; } .page-numbers:before, .page-numbers:after { content: ""; display: table; } .page-numbers:after { clear: both; } .page-numbers li.next-prev.prev { display: none; } .page-numbers ul + .view-all { float: right; margin: 5px 0; } .page-numbers .view-all { margin: 5px; float: left; } .page-numbers p { margin-top: 5px; } .page-numbers p, .page-numbers ul { float: left; } .page-numbers ul { padding: 0; margin-left: 5px; margin-bottom: 0; } .page-numbers li { float: left; margin-right: 10px; padding: 4px 0; vertical-align: middle; text-align: center; } .page-numbers .on { color: #fff; background: #e7f2d9; padding: 4px 10px; border-radius: 16px; } .page-numbers li.next-prev.next { display: none; } .autoscroll .page_numbers { display: none; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { button.load-more { display: block; margin: 0 auto; min-width: 200px; clear: both; } .cataloguepage main .content, .cataloguepage .toolbar { margin-bottom: 20px; } .cataloguepage main .content:before, .cataloguepage main .content:after, .cataloguepage .toolbar:before, .cataloguepage .toolbar:after { content: ""; display: table; } .cataloguepage main .content:after, .cataloguepage .toolbar:after { clear: both; } .top { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; } .toolbar .result-summary { width: auto; margin: 10px 0 0 0; order: 2; } .toolbar .active-filters { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; justify-content: flex-end; order: 3; } .toolbar .active-filters .resetall { text-transform: lowercase; } .toolbar .active-filters div:last-of-type { margin-top: 5px; text-decoration: underline; } .toolbar .active-filters li { display: inline-flex; margin-right: 10px; background-color: #e7f2d9; border-radius: 16px; padding: 6px 18px; } .toolbar .filters { order: 1; width: 100%; display: block; float: right; margin-bottom: 0; text-align: right; margin-bottom: 30px; } .toolbar .filters .filter-by { display: none; } .toolbar .filters > h3 { display: none; } .toolbar .filters .sort-by { display: flex; justify-content: flex-end; } .toolbar .filters .sort-by h2 { position: relative; margin: 0; margin-top: 12px; } .toolbar .filters .filter { width: auto; min-width: 150px; } .toolbar .filters .filter .selected { padding: 8px 50px 8px 20px; } .page-numbers { float: right; font-size: 11px; padding: 0; position: relative; margin-bottom: 0; } .page-numbers ul { position: relative; left: 0; padding: 0 0 0 15px; } .page-numbers li { padding: 5px 0; } .page-numbers .on { padding: 5px 10px; } .page-numbers .view-all { margin-left: 10px; float: left; } } /*** Desktop ***/ @media (min-width: 1150px) { .cataloguepage .main-container h1 { text-align: left; margin: 0; } #main .products .item { margin-left: 5%; border: 1px solid #fff; border-radius: 0; width: 30%; } #main .products .item:nth-of-type(2n+1) { clear: none; margin-left: 5%; } #main .products .item:nth-of-type(3n+1) { clear: both; margin-left: 0%; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .cataloguepage .filter-by li.on, .searchpage .filter-by li.on { display: inline-flex; } .cataloguepage .active-filters .count, .cataloguepage .filter-by .count, .searchpage .filter-by .count { visibility: visible; font-size: 0px; } .cataloguepage .active-filters .count a:after, .cataloguepage .filter-by .count a:after, .searchpage .filter-by .count a:after { font-size: 14px; float: right; margin-left: 8px; } .complete .cart { display: inherit; } /*** IPAD + DESKTOP ***/ } @media screen and (-ms-high-contrast: active) and (min-width: 768px), (-ms-high-contrast: none) and (min-width: 768px) { .alternate-images .slick-next, .alternate-images .slick-prev { position: relative; top: 0; } } /* ========= CATALOGUE LISTING COMPONENT END ========= */ /* ========= SEARCH COMPONENT ========= */ .searchpage .nav-tabs > li.active > a { color: #444545; } .searchpage p.related a:first-child { padding-left: 8px; } .searchpage .did-you-mean { font-weight: bold; } .searchpage .zero-results ul a { padding-top: 15px; display: inline-block; } .searchpage .nav-tabs { border-bottom-style: dashed; } .searchpage .nav-tabs li.active { border-bottom: solid 1px white; } .searchpage .nav-tabs li { margin-right: 6px; background-color: #e7f2d9; } .searchpage .nav-tabs li :hover { border-color: transparent; background-color: #e7f2d9; } .searchpage .nav-tabs li a { border-radius: 0; margin: 0; border-style: dashed; } .searchpage .nav-tabs li a:focus { border-style: dashed; } .searchpage .search-info { font-size: 18px; margin-bottom: 20px; } .searchpage .popular { margin-bottom: 20px; } .searchpage .popular a { text-decoration: underline; } .searchpage .toolbar { display: none; } .searchpage .alphabet-links { border-bottom-width: 1px; padding-bottom: 10px; margin-bottom: 10px; } .searchpage .alphabet-links a { display: inline-block; padding: 6px; } .searchpage .articles .item a { width: 100%; display: block; padding: 10px; margin: 5px auto; font-weight: bold; text-align: center; background-color: #e7f2d9; } .searchpage .articles .item a h4 { font-size: 14px; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { .searchpage #left-nav { display: none; } .searchpage .tab-content #left-nav, .searchpage #left-nav .filters .sort-by { display: block; } .searchpage #page-content { padding-bottom: 30px; } .searchpage .toolbar .page-numbers { position: absolute; right: 0; } .searchpage .toolbar.top .page-numbers { top: 30px; } .searchpage .toolbar.bottom .page-numbers { bottom: 8px; } .searchpage .articles { padding: 20px 0; } .searchpage .articles .item { width: 24%; margin: .5%; vertical-align: top; display: inline-block; } .searchpage .articles .item:nth-child(4n) { clear: left; } .searchpage #page-content { width: 100%; } .searchpage .toolbar.top { width: 17%; float: left; margin-left: 0; margin-right: 8%; } .searchpage .products { width: 75%; float: right; margin-top: 20px; } .searchpage .related { margin-bottom: 25px; } } /*** IPAD + DESKTOP ***/ @media (min-width: 992px) { .searchpage .popular { float: right; } } /* ========= SEARCH COMPONENT END ========= */ /* ========= PRODUCT DETAIL COMPONENT ========= */ select:focus::-ms-value { background-color: white; color: #444545; } .product:before, .product:after, .alternate-images:before, .alternate-images:after, .reviews:before, .reviews:after, .product-detail .review:before, .product-detail .review:after, .review-group:before, .review-group:after, .cart-options:before, .cart-options:after, .additional-info-links:before, .additional-info-links:after { content: ""; display: table; } .product:after, .alternate-images:after, .reviews:after, .product-detail .review:after, .review-group:after, .cart-options:after, .additional-info-links:after { clear: both; } .productpage #page-content { width: 100%; } .productpage #left-nav { display: none; } .productpage #breadcrumbs .breadcrumb-container { border: none; } .productpage .childproducts { width: 100%; } .productpage .childproducts .video a { background-size: cover; display: block; margin: 0 auto; position: relative; } .productpage .childproducts .video .indicator { background: url(video_play.png) no-repeat center center; top: 0; position: absolute; width: 100%; height: 100%; } .productpage .childproducts h2 { margin-top: 5px; } .productpage .childproducts .product-selector { display: none; } .productpage .childproducts .product-content { margin-top: 0; } .productpage .childproducts .product-content .form-item.colour .fake-select { padding: 0; border: none; } .productpage .childproducts .product-content .form-item.colour .fake-select .selected { padding: 4px; } .productpage .childproducts .product-content .form-item.colour .single { border: 1px solid #a0a0a0; } .productpage .childproducts .product-content .form-item.colour .single .selected { padding: 5px; } .productpage .childproducts .product-img { width: 100%; margin-right: 10%; } .productpage .childproducts .product-img:empty { display: none; } .productpage .childproducts .product-content { width: 100%; float: left; } .productpage .childproducts .product-content .colour .fake-select { padding: 10px; } .productpage .childproducts .product-content .additional-options .add-wishlist { width: 100%; } .productpage .childproducts .product-content h2 a, .productpage .childproducts .product-content h2 { color: #444545; font-size: 20px; } .productpage .childproducts .product-img:empty + .product-content { width: 100%; } .productpage .childproducts .product { border: 1px solid #a0a0a0; margin: 5px 0 20px 0; padding: 20px; } .productpage .childproducts header { font-size: 22px; font-weight: bold; } .productpage .childproducts .reviews .links a { margin: 0 10px 0 0; } .productpage .childproducts .reviews p { width: 100%; } .productpage .childproducts .slick-prev, .productpage .childproducts .slick-next { top: 44%; } .productpage .childproducts .product-selector label { display: inline-block; } .productpage .childproducts .product-selector input { float: left; } .product-content { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-direction: column; clear: both; margin-top: 20px; } .product-content .pricing { order: 2; font-weight: bold; } .product-content .long-description { order: 5; } .product-content .aspects { order: 6; display: none; } .product-content .aspects dl { display: flex; } .product-content h1 { display: none; order: 1; } .product-content .style-number { color: #ccc; display: none; } .product-content .form-item.size ul, .product-content .form-item.colour ul { margin-bottom: 0; } .product-content .form-item { margin-bottom: 18px; } .product-content .form-item:before, .product-content .form-item:after { content: ""; display: table; } .product-content .form-item:after { clear: both; } .product-content .form-item ul { display: none; } .product-content .form-item .open ul { display: block; } .product-content .form-item.quantity input { text-align: center; } .product-content .form-item.cartbutton { margin-top: 22px; float: left; } .product-content .form-item.cartbutton button.loading { background-image: url(button-ajax-loader.gif); background-repeat: no-repeat; background-position: 90% center; background-size: 25px; } .product-content .form-item.cartbutton, .product-content .additional-options { display: inline-block; margin: 0; width: 100%; } .product-content .brand { float: right; } .product-content .brand span { display: none; } .product-content .prices { display: inline-block; } .product-content .prices .price { font-size: 20px; font-weight: normal; } .product-content .afterpay-widget { margin-bottom: 15px; display: none; } .product-content .afterpay-widget p { display: inline-block; margin: 0; padding: 0; } .product-content .afterpay-widget .afterpay-range { display: none; } .product-content .afterpay-widget .afterpay-price { display: none; } .product-content .afterpay-widget .afterpay-moreinfo { display: block; } .product-content .afterpay-widget.afterpay-show-range, .product-content .afterpay-widget.afterpay-show-price { display: block; } .product-content .afterpay-widget.afterpay-show-range .afterpay-moreinfo, .product-content .afterpay-widget.afterpay-show-price .afterpay-moreinfo { display: block; } .product-content .afterpay-widget.afterpay-show-range .afterpay-range { display: inline-block; } .product-content .afterpay-widget.afterpay-show-price .afterpay-price { display: inline-block; } .product-content .afterpay-widget.afterpay-out-of-range { display: none; } .product-content .ESO_number_wrapper { width: 100%; position: relative; display: inline-block; padding: 0 20%; text-align: center; } .product-content .ESO_number_wrapper input { height: 40px; } .product-content .ESO_number_wrapper a { position: absolute; height: 40px; width: 44%; line-height: 35px; text-align: center; font-size: 26px; border-radius: 20px; border-width: 1px; top: 0; color: #444545; transition: background-color 200ms; } .product-content .ESO_number_wrapper a:hover { text-decoration: none; background-color: #ccc; } .product-content .ESO_number_wrapper a.minus { left: 0; } .product-content .ESO_number_wrapper a.plus { right: 0; } .product-detail h1 { font-size: 28px; padding-bottom: 15px; } .product-detail .review .date { color: #ccc; } .product-detail .reviewer strong { margin-left: 5px; } .product-detail .review { margin-top: 25px; padding-top: 25px; border-top-width: 1px; } .product-detail .additional-options { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; align-items: center; } .product-detail .additional-options .add-wishlist { text-decoration: underline; } .product-detail .additional-options .add-wishlist:hover { text-decoration: none; } .product-detail .additional-options .wishlist-tooltip-wrapper { width: auto; line-height: 40px; position: relative; } .product-detail .additional-options .wishlist-tooltip-wrapper span { margin-left: 6px; font-size: 13px; color: #7cc244; text-decoration: none; display: inline-block; cursor: pointer; } .product-detail .additional-options .wishlist-tooltip-wrapper .tooltip { min-width: 120px; } .product-detail .additional-options .add-registry { margin-top: 15px; } .product-detail .reviews { margin: 10px 0 20px 0; order: 3; } .product-detail .reviews .write-review.popup-link { display: none; } .product-detail .reviews .no-reviews ~ .links .write-review.popup-link { display: block; } .product-detail .reviews .links a { margin-left: 10px !important; } .product-detail .reviews > h3 { display: none; } .product-detail .reviews .avg { float: left; } .product-detail .reviews .reviewer { float: left; margin-right: 5px; } .product-detail .reviews .comment { clear: both; } .product-detail .reviews .stars-container { float: left; clear: both; } .product-detail .reviews .stars-container .review-count { display: none; } .product-detail .reviews .links, .product-detail .reviews .no-reviews { text-decoration: underline; text-transform: lowercase; float: left; margin: 4px 0 0; } .product-detail .reviews .no-reviews { margin-right: 5px; text-decoration: none; } .product-detail .reviews .no-reviews + .links a { margin-left: 0; } .product-detail .reviews .review-group { clear: both; } .product-detail .additional-info-content .reviews .stars-container { float: none; } .product-detail .additional-info-content .reviews .avg + .btn { float: right; } .product-detail .product-title h2 { text-transform: uppercase; font-size: 36px; } .product-detail .form-item.cartbutton:before, .product-detail .form-item.cartbutton:after { content: ""; display: table; } .product-detail .form-item.cartbutton:after { clear: both; } .product-detail .social-media { margin: 6px 0 0 auto; } .product-detail .social-media:before, .product-detail .social-media:after { content: ""; display: table; } .product-detail .social-media:after { clear: both; } .product-detail .social-media > div { float: left; } #body-wrapper .product-detail .links a { margin-left: 20px; } .childproducts a#write-a-review-9 { margin-left: 0 !important; } .click-and-collect a[data-toggle=popover] { color: #961b48; font-size: 11px; vertical-align: super; text-decoration: none; cursor: pointer; } .click-and-collect h4 { display: inline-block; position: relative; text-transform: uppercase; margin: 0; padding: 0; } .click-and-collect .popover { min-width: 270px; } .additional-info-links { text-transform: lowercase; font-weight: bold; width: 90px; margin-left: auto; padding-left: 20px; } .additional-info-links li { float: right; } .additional-info-links li a { text-decoration: underline; } .additional-info { padding-top: 12px; clear: both; } .additional-info .nav { display: none; margin-bottom: 15px; } .additional-info .info-item { display: block; visibility: visible; margin: 0px 0; } .additional-info .info-item h2 { position: relative; font-size: 14px; font-weight: bold; text-transform: uppercase; margin: 0; padding: 15px 30px 15px 0; border-top-width: 1px; cursor: pointer; } .additional-info .info-item .info-content { padding-bottom: 15px; display: none; } .additional-info .info-item .animated-content { margin: 20px 0; } .additional-info .info-item.open .animated-content { display: block !important; } .additional-info .info-item.open h2 { background: url(sprite.png) 102% -994px no-repeat; background-size: 40px; } .additional-info .additional-info-content { border-bottom-width: 1px; } .additional-info .additional-info-content > div { padding: 0; } .add-to-cart { position: relative; border-top: dashed 1px #a0a0a0; padding-top: 30px; order: 4; } .add-to-cart .availability { font-size: 12px; } .add-to-cart .cart-options { display: flex; flex-wrap: wrap; position: relative; padding: 10px 0; } .add-to-cart .cart-options .colour { width: 100%; order: 1; } .add-to-cart .cart-options .size { width: 100%; flex-grow: 1; order: 2; } .add-to-cart .cart-options .quantity { max-width: 180px; flex-grow: 1; order: 3; } .add-to-cart .cart-options .additional-info-links { order: 4; } .add-to-cart .cart-options .cartbutton { order: 5; } .add-to-cart .cart-options .additional-options { order: 6; } .add-to-cart .cart-options .ESO_number_wrapper input { border-radius: 0; border-left: none; border-right: none; } .add-to-cart .cart-options .ESO_number_wrapper .plus { border: solid 1px #a0a0a0; border-radius: 0 20px 20px 0; border-left: none; text-align: right; padding-right: 20px; } .add-to-cart .cart-options .ESO_number_wrapper .plus:focus { text-decoration: none; } .add-to-cart .cart-options .ESO_number_wrapper .minus { border: solid 1px #a0a0a0; border-radius: 20px 0 0 20px; border-right: none; text-align: left; padding-left: 20px; } .add-to-cart .cart-options .ESO_number_wrapper .minus:focus { text-decoration: none; } .add-to-cart .cart-options .form-item > label { text-transform: uppercase; display: none; } .add-to-cart .cart-options .form-item.cartbutton button { margin-bottom: 30px; } .add-to-cart .cart-options .form-item.colour .single { border-width: 1px; border-style: solid; } .add-to-cart .cart-options .form-item.colour .fake-select { border-radius: 20px; } .add-to-cart .cart-options .form-item.colour .fake-select label { padding-left: 5px; } .add-to-cart .cart-options .form-item.colour .fake-select .selected { padding: 5px; } .add-to-cart .cart-options .form-item.colour .fake-select .selected span { vertical-align: middle; } .add-to-cart .cart-options .form-item.colour .fake-select .selected img { height: 30px; border-radius: 15px; } .add-to-cart .cart-options .form-item.size .selected span:first-child { display: none; } .add-to-cart .cart-options .form-item.size .selected span { text-transform: capitalize; } .add-to-cart .cart-options .form-item.size .single .selected span { vertical-align: -webkit-baseline-middle; } .cross-sell > div h2 { font-size: 18px; margin-bottom: 20px; } .cross-sell .related .products.slick-slider { align-items: center; display: flex; flex-direction: row; } .cross-sell .related .products.slick-slider .item { margin-bottom: 0 !important; } .cross-sell .related .products.slick-slider .slick-list.draggable { width: 90%; } .cross-sell .related .products.slick-slider .slick-prev:before { background-position: -12px -433px; } .cross-sell .related .products.slick-slider .slick-next:before { background-position: -10px -371px; } .cross-sell .related .products.slick-slider .slick-arrow { position: inherit; width: 16px; color: transparent; } .cross-sell .related .products.slick-slider .slick-arrow:before { background-color: transparent; } .alternate-images { margin: 10px auto; padding: 0; width: 100%; } .alternate-images img { width: 80px; } .alternate-images li { float: left; } .alternate-images .video a { position: relative; } .alternate-images .video .indicator { background: url(video_play.png) no-repeat center center; position: absolute; height: 100%; width: 100%; left: 0; top: 0; } .alternate-images a { background-size: cover; display: block; margin: 0 auto; } .alternate-images a img { visibility: hidden; margin: 0 auto; } .long-description.has-content:before { content: 'Product Description'; display: block; font-weight: bold; padding: 15px 0; border-bottom-width: 1px; text-transform: uppercase; margin-bottom: 20px; } .product-img { position: relative; } .product-img .medium-image > img { display: none; } .product-img .medium-image .overlay { width: 90%; z-index: 99; } .product-img a > img { position: relative; width: 100%; } .modal .email-a-friend .image, .modal .rating-form .image { margin-bottom: 10px; text-align: center; } .modal .email-a-friend .image img, .modal .rating-form .image img { width: 100%; } .modal .email-a-friend form, .modal .rating-form form { clear: both; padding-top: 10px; } .availability { text-align: left; padding-bottom: 5px; } .not-for-sale .availability { display: block; } /*Search aspects*/ .aspects { margin: 30px 0; } .aspects dt:nth-child(1), .aspects dd:nth-child(2) { border-top-width: 1px; } .aspects dl { margin-bottom: 0; } .aspects dl:before, .aspects dl:after { content: ""; display: table; } .aspects dl:after { clear: both; } .aspects dt, .aspects dd { float: left; border-bottom-width: 1px; padding: 15px 0; } .aspects dt { clear: left; width: 30%; } .aspects dd { width: 70%; } /*Pricing Matrix*/ .full-pricing { margin-bottom: 15px; order: 2; } .full-pricing a { text-decoration: underline; text-transform: lowercase; } .modal .price-matrix .matrix .pricing h4 span:first-of-type:after { content: ":"; } .modal .price-matrix .matrix th, .modal .price-matrix .matrix td { border-bottom-width: 1px; } .modal .price-matrix .matrix .available .pricing { cursor: pointer; } .modal .price-matrix th img, .modal .price-matrix .selection img { border: 1px solid #a0a0a0; border-radius: 0; } .modal .price-matrix h4 { float: left; clear: left; } .modal .price-matrix .selection span:first-child, .modal .price-matrix .selection img { margin-right: 5px; } .modal .price-matrix .selection span:first-child { display: inline-block; width: 50px; } .modal .price-matrix .selection img { width: 20px; border-radius: 10px; vertical-align: text-bottom; } .modal .price-matrix thead img + span { display: none; } .modal .price-matrix .row { margin: 0; } .modal .price-matrix table, .modal .price-matrix tbody, .modal .price-matrix tr, .modal .price-matrix td { display: block; } .modal .price-matrix td:before, .modal .price-matrix td:after { content: ""; display: table; } .modal .price-matrix td:after { clear: both; } .modal .price-matrix th, .modal .price-matrix td { padding: 8px 10px; } .modal .price-matrix th, .modal .price-matrix thead { display: none; } .modal .price-matrix p { margin-bottom: 0; } .modal .price-matrix .unavailable .pricing, .modal .price-matrix .unavailable .price { color: #ccc; } .modal .price-matrix .pricing h4 { font-size: 14px; } .modal .price-matrix .pricing h4 span + span { margin-left: 5px; } .modal .price-matrix .price { float: right; } .modal .price-matrix .availabilitykey { margin-top: 20px; } .productpage .additional-options { border-top: dashed 1px #a0a0a0; padding-top: 20px; } /*Quickview Modal Popup*/ .modal-dialog .product-content .form-item, .modal-dialog .product-detail .additional-options { width: 100% !important; } .modal-dialog .popup-data.collapse, .modal-dialog .popup-data.collapsing { border-width: 1px 0; border-style: solid; border-color: #a0a0a0; padding: 0; } .modal-dialog .popup-data.collapse > *, .modal-dialog .popup-data.collapsing > * { padding: 10px 0; } .modal-dialog .popup-data.collapse img, .modal-dialog .popup-data.collapsing img { max-width: 100%; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { .modal .price-matrix .matrix th, .modal .price-matrix .matrix td { border-bottom: none; } .cross-sell .related .products.slick-slider .slick-list.draggable { width: 100%; } #main h4 button.btn { top: -15px; right: 168px; } .productpage .cart-options .additional-options { float: right; } .product-detail > h1 { display: none; } .product-detail .social-media { order: 1; margin: 6px 30px 0 0; } .product-detail .form-item.cartbutton { float: right; } .product-detail .form-item.cartbutton button { width: 100%; } .product-detail .additional-options { justify-content: flex-start; width: 100%; } .product-detail .additional-options .add-wishlist, .product-detail .additional-options .added-to-wishlist { width: auto; order: 2; } .product-detail .additional-options .wishlist-tooltip-wrapper { order: 2; } .product-detail .additional-options .add-registry-form { float: right; width: 47%; } .product-detail .additional-options .add-registry { margin-top: 0px; } .product-detail .additional-options button { width: 100%; } #modal-popup .product-detail .links a { margin-right: 5px; } .additional-info-links { margin-top: 10px; } .product-img { float: left; width: 60%; } .product-content { margin-top: 0; clear: none; float: right; width: 36%; } .product-content h1 { display: block; } .product-content h1 { margin-bottom: 20px; padding: 0; } .product-content .reviews { clear: both; } .product-content .form-item.colour, .product-content .form-item.size { display: inline-block; color: #444545; width: 100%; } .product-content .form-item.size { width: 70%; } .product-content .ESO_number_wrapper { padding: 0 20%; width: 100%; } .product-content .ESO_number_wrapper input { margin: 0 auto; } .product-content .form-item.quantity { float: left; width: 35%; } .product-content .form-item.quantity label { width: 100%; } .product-detail figure { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; } .product-detail figure .medium-image { display: block; width: 81%; order: 2; margin-left: auto; position: relative; max-width: 566px; } .product-detail figure .medium-image .overlay { width: 100%; } .alternate-images { width: 16%; margin: 0; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; align-items: center; flex-direction: column; order: 1; } .alternate-images .slick-next:before, .alternate-images .slick-prev:before { background-color: transparent; } .alternate-images .slick-next, .alternate-images .slick-prev { transform: rotate(90deg); position: initial; top: initial; margin-top: 0; overflow: hidden; } .alternate-images a { background: none !important; padding-top: 0; } .alternate-images a > img { display: inline-block; visibility: visible; } .alternate-images a > img .on { opacity: 0.5; } .alternate-images li { padding: 5px 0; text-align: center; float: left; } .alternate-images li:first-of-type { padding-top: 0; } .alternate-images .video .indicator { background: url(video_play.png) no-repeat center center; background-size: 80%; height: 100%; width: 100%; left: 0; top: 0; } .alternate-images .slick-slide.on a { opacity: 0.5; } .modal .rating-form .image, .modal .email-a-friend .image { float: left; width: 40%; } .modal .rating-form .pricing, .modal .rating-form .long-description, .modal .email-a-friend .pricing, .modal .email-a-friend .long-description { width: 55%; float: right; } .form-item.quantity input { width: 70px; } /*Pricing Matrix*/ .modal .price-matrix h4 { display: none; } .modal .price-matrix thead { display: table-header-group; } .modal .price-matrix tbody { display: table-row-group; } .modal .price-matrix tbody > tr th { border-right: 1px solid #a0a0a0; } .modal .price-matrix tr { display: table-row; } .modal .price-matrix th, .modal .price-matrix td { display: table-cell; } .modal .price-matrix .price { font-size: 14px; } .modal .price-matrix .price-display { margin-left: 5px; } .modal .price-matrix .matrix { margin: 0 auto; } .modal .price-matrix .matrix th, .modal .price-matrix .matrix td { text-align: center; } .modal .price-matrix .matrix td.available:hover { background-color: #ccc; } .modal .price-matrix table { display: table; } .modal .price-matrix table.matrix { display: block; overflow-x: auto; } .modal .price-matrix .price { float: none; } .modal .price-matrix th img { max-width: 30px; border-radius: 15px; } .additional-info { padding-top: 50px; } .additional-info .additional-info-content { border-bottom: none; } .additional-info .nav-tabs { margin-bottom: 0; display: block; border-bottom: dashed 1px #a0a0a0; } .additional-info .nav-tabs > li a { background-color: #e7f2d9; border-radius: 0; border-bottom: dashed 1px #a0a0a0; margin-right: 6px; text-transform: uppercase; } .additional-info .nav-tabs > li a:hover { border-color: transparent; border-bottom: black; } .additional-info .nav-tabs > li.active > a { border: dashed 1px #a0a0a0; border-bottom-color: transparent; color: #444545; } .additional-info .nav-tabs > li.active > a:hover { border-style: dashed; } .additional-info .nav-tabs > li.active > a:focus { border-style: dashed; } .additional-info .info-container { padding: 40px; border-width: 1px; border-top: none; } .additional-info .info-item h2 { display: none; } .additional-info .info-item .info-content { display: none; } } @media (min-width: 992px) { .productpage .product-content .cart-options .quantity { width: 140px; flex-grow: 0; margin-right: 20px; } .productpage .product-content .cart-options .additional-info-links { order: 3; } .productpage .product-content .cart-options .cartbutton { width: auto; flex-grow: 1; } } /*** TABLETS ***/ @media (min-width: 768px) and (max-width: 1150px) { .product-group .childproducts .additional-options .add-wishlist, .added-to-wishlist { font-size: 12px; } } /*** DESKTOP ***/ @media (min-width: 1150px) { .alternate-images .video { position: relative; display: block; } .alternate-images .video .indicator { position: absolute; background: url(video_play.png) no-repeat center center; background-size: 80%; height: 100%; width: 100%; left: 0; top: 0; } .productpage .main-container { padding-top: 0; } .productpage .product.product-top .magnify-holder { display: block; } .productpage .childproducts .product-img { width: 35%; margin-right: 5%; } .productpage .childproducts .product-content { width: 60%; } } /* ========= PRODUCT DETAIL COMPONENT END ========= */ /* ========= ONLINE BOOKS COMPONENT ========= */ .onlinebooks .social-media { display: none; } .onlinebooks .modal-content .magnify-zoomed { display: none; } .onlinebooks .modal-content .product-content .additional-info-links { display: none; } .onlinebooks .modal-content .product-content .pricing { order: 1; } .onlinebooks .modal-content .product-content .full-pricing { order: 2; } .onlinebooks .modal-content .product-content .reviews { order: 3; } .onlinebooks .modal-content .product-content .reviews .links { margin-left: 20px; } .onlinebooks .modal-content .product-content .add-to-cart { order: 4; } .onlinebooks .modal-content .product-content .additional-info { display: none; } .onlinebooks #left-nav { display: none; } .onlinebooks #page-content { width: 100%; float: none; } .onlinebooks .book-list img { max-width: 100%; width: 100%; display: block; } .onlinebooks .book-list ul { margin: 0 -15px; padding: 0; } .onlinebooks .book-list ul:after { content: ""; height: 0; display: block; clear: left; } .onlinebooks .book-list ul li { float: left; width: 50%; padding: 0 15px; margin-bottom: 20px; } .onlinebooks .book-list ul a { display: block; text-align: center; } .onlinebooks .book-list ul .cover-image + a { margin: 10px 0; } @media (min-width: 480px) { .onlinebooks .book-list ul li { width: 33.333333%; } } @media (min-width: 768px) { .onlinebooks .book-list ul li { width: 25%; } } @media (min-width: 992px) { .onlinebooks .book-list ul li { width: 20%; } } .onlinebooks #page-content { width: 100%; float: none; } .onlinebooks #main .products { display: none; margin-top: 30px; } .onlinebooks .print-onlinebook { margin-bottom: 10px; } .onlinebooks .download-onlinebook { display: none; margin-bottom: 10px; } .onlinebooks .download-onlinebook:disabled { background-color: #ccc; cursor: default; color: #a6a5a5; } .onlinebooks .book-detail { position: relative; border-bottom: 1px dashed #a0a0a0; margin-bottom: 30px; } .onlinebooks .book-detail button { min-width: 0; } .onlinebooks .book-detail.loading { display: block; visibility: visible; width: 100%; min-height: 160px; background: url("/Assets/ajax-loader.gif") no-repeat center #FFF; } .onlinebooks .slick-slide img { max-width: 100%; width: 100%; } .onlinebooks .slick-active .slick-loading { width: 100%; visibility: visible; min-height: 160px; background: url("/Assets/ajax-loader.gif") no-repeat center #fff; } .onlinebooks .top-navigation { border-top: 1px dashed #a0a0a0; } .onlinebooks .top-navigation ul { text-align: center; margin: 10px 0; } .onlinebooks .top-navigation li { display: inline-block; vertical-align: middle; } .onlinebooks .top-navigation label { width: auto; margin: 0; } .onlinebooks .top-navigation .slick-prev, .onlinebooks .top-navigation .slick-next { position: relative; min-width: 0; } .onlinebooks .top-navigation .slick-prev:before, .onlinebooks .top-navigation .slick-next:before { display: block; color: white; padding: 30px 20px; background-color: transparent; } .onlinebooks .top-navigation .slick-start, .onlinebooks .top-navigation .slick-end { display: block; height: 40px; width: 40px; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; padding: 0; outline: none; z-index: 2; min-width: 0; text-indent: -999999px; border-radius: 0; outline: none; } .onlinebooks .top-navigation .slick-start:before, .onlinebooks .top-navigation .slick-end:before { display: block; content: ""; color: white; opacity: 0.75; padding: 30px 20px; background-repeat: no-repeat; background-size: 40px; background-image: url(/Assets/sprite.png), url(/Assets/sprite.png); } .onlinebooks .top-navigation .slick-start:hover:before, .onlinebooks .top-navigation .slick-end:hover:before { opacity: 1; } .onlinebooks .top-navigation .slick-start.slick-disabled:before, .onlinebooks .top-navigation .slick-end.slick-disabled:before { opacity: 0.25; } .onlinebooks .top-navigation .slick-start:before { background-position: -5px -442px, 5px -442px; } .onlinebooks .top-navigation .slick-end:before { background-position: -5px -380px, 5px -380px; } .onlinebooks .bottom-navigation ul { text-align: right; margin: 10px 0; } .onlinebooks .bottom-navigation li { display: inline-block; vertical-align: middle; } .onlinebooks .slick-slider .slick-prev { left: 0; border-radius: 0 30px 30px 0; } .onlinebooks .slick-slider .slick-next { right: 0; border-radius: 30px 0 0 30px; } .onlinebooks .catalouge-slider { border-bottom: 3px solid #e5e5e5; border-top: 3px solid #e5e5e5; } .onlinebooks .catalouge-slider button { border: 1px solid #e5e5e5; } .onlinebooks .catalouge-slider-thumbs { border-bottom: 3px solid #e5e5e5; border-top: 3px solid #e5e5e5; } .onlinebooks .catalouge-slider-thumbs button { border: 1px solid #e5e5e5; } .onlinebooks .slick-slide { position: relative; } .onlinebooks .catalouge-nav-slider .slick-track { margin: 0 auto; } .onlinebooks .catalouge-nav-slider .slick-slide > img { cursor: pointer; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; } .onlinebooks .slick-slide .slider-hotspots a { text-indent: -99999px; position: absolute; cursor: pointer; } .onlinebooks .add-slides ul { text-align: center; margin: 0 0 30px; padding: 0; list-style: none; } .onlinebooks .onlinebooks .tooltip { font-size: smaller; padding: 5px; position: absolute; width: 100px; min-height: 160px; height: auto; border: 1px solid #e5e5e5; background: #fff; z-index: 99; opacity: 1; } .onlinebooks .onlinebooks .tooltip.alignLHS { right: 120%; } .onlinebooks .onlinebooks .tooltip.alignRHS { left: 120%; } .onlinebooks .onlinebooks .tooltip .tooltipHeading { text-indent: initial; } .onlinebooks .onlinebooks .tooltip img { border: 0; max-width: 100%; width: 100%; height: auto; display: block; } .onlinebooks .onlinebooks .tooltip.loading { display: block; visibility: visible; width: 100px; min-height: 160px; background: url("/Assets/ajax-loader.gif") no-repeat center #FFF; } @media (min-width: 768px) { .onlinebooks .modal-dialog { width: 800px; } .onlinebooks .product-img .alternate-images div { height: auto !important; } .onlinebooks .product-img .alternate-images div li { width: auto !important; } .onlinebooks .tooltip { width: 150px; min-height: 210px; } .onlinebooks .tooltip img { max-width: 100%; width: 100%; height: auto; } .onlinebook-buttons { text-align: right; } .onlinebook-buttons button { min-width: 160px; } .print-onlinebook { margin-left: 10px; margin-bottom: 0; } } @media print { .onlinebooks #main .products { page-break-before: always; display: block; } .onlinebooks img { max-width: 100% !important; } .onlinebooks .book-detail .slick-track { width: 100% !important; transform: none !important; } .onlinebooks .book-detail .slick-slide { display: none; } .onlinebooks .book-detail .slick-active { width: 50% !important; display: block !important; } .onlinebooks .book-detail .top-navigation, .onlinebooks .book-detail .catalouge-nav-slider, .onlinebooks .book-detail .slider-hotspots, .onlinebooks .book-detail .slick-loading { display: none; } .onlinebooks .onlinebook-buttons { display: none; } .onlinebooks footer, .onlinebooks header, .onlinebooks .back-top { display: none; } } /* ========= ONLINE BOOKS COMPONENT ========= */ /* ========= SITEMAP COMPONENT ========= */ .sitemap.infopage .sitemap-content ul li ul { margin-top: 20px; } .sitemap.infopage .sitemap-content ul li ul li ul { margin-left: 10px; } .sitemap.infopage .sitemap-content ul li ul li ul li a { font-weight: normal; } .sitemap.infopage .sitemap-content ul li ul li a { text-transform: lowercase; } .sitemap.infopage .sitemap-content a { color: #444545; text-transform: uppercase; font-weight: normal; } .sitemap.infopage .sitemap-content > ul > li { border-top-width: 1px; padding: 15px 0 0; margin: 15px 0 0; font-size: 20px; } .sitemap.infopage .sitemap-content ul li, .sitemap.infopage .sitemap-content > ul > li > ul > li { text-transform: uppercase; font-weight: normal; } .sitemap.infopage .sitemap-content ul li li { font-weight: normal; font-size: 14px; } .sitemap.infopage .sitemap-content > ul > li > ul > li { margin-bottom: 10px; } .sitemap.infopage #left-nav { display: none; } .sitemap.infopage #page-content { width: 100%; } @media (min-width: 768px) { .sitemap.infopage .sitemap-content > ul > li { float: left; width: 33%; } .sitemap.infopage .sitemap-content > ul > li:nth-child(3n+1) { clear: both; } } @media (min-width: 1150px) { .sitemap.infopage .sitemap-content > ul > li { width: 25%; } .sitemap.infopage .sitemap-content > ul > li:nth-child(3n+1) { clear: none; } .sitemap.infopage .sitemap-content > ul > li:nth-child(4n+1) { clear: both; } } /* ========= SITEMAP COMPONENT END ========= */ /* ========= CUSTOMER COMPONENT ========= */ .accountpage .cart-summary .summary-block:first-of-type h2 { margin-top: 0; } .accountpage .cart-summary .summary-block .confirm-summary tr td:nth-of-type(2) { text-align: right; } .accountpage .cart-summary .summary-block .confirm-summary tr td { padding-bottom: 5px; } .accountpage .cart-summary .confirm-summary { width: 100%; } .accountpage .cart-summary h2 { font-weight: bold; } .accountpage .cart-summary .summary-block p { margin: 0; } .accountpage h1 { text-align: left; } .accountpage #left-nav { margin: 0; width: 100%; } .accountpage #left-nav .icon-menu { float: right; width: 40px; height: 40px; margin-right: 0; background: url(sprite.png) 0 -169px no-repeat; background-size: 50px; padding: 0; } .accountpage #left-nav .menu.dynamic { text-align: right; margin: 0; padding: 0; } .accountpage #left-nav .menu.dynamic li { display: flex; padding-right: 30px; } .accountpage #left-nav .menu.dynamic li .on > a { font-weight: normal; } .accountpage #left-nav .menu.dynamic li:last-child { padding-right: 0; } .accountpage #page-content { width: 100%; } .login.accountpage fieldset .note { margin-left: 0; } .history main .order-summary tr { border-style: solid; border-color: #e5e5e5; } .accountpage .next-previous:first-of-type { display: none; } .customer.existing li input, #sign-in li input { padding-left: 20px; } .customer.existing li > label, #sign-in li > label { display: none; } .history main .order-summary .total { text-align: right; } .history main .selections .error { display: none; } /*Interest Groups*/ form .interest-groups .column { float: left; max-width: 300px; width: 45%; } form .interest-groups .column-1 { margin-right: 3%; } form .interest-groups label + .note { margin: 0 0 25px 0; } form .interest-groups p + ol > li { border-bottom-width: 1px; margin-bottom: 15px; } form .interest-groups p + ol > li:before, form .interest-groups p + ol > li:after { content: ""; display: table; } form .interest-groups p + ol > li:after { clear: both; } form .interest-groups input + label { width: 90%; } form .interest-groups .column input + label { width: 75%; } @media (min-width: 768px) { .accountpage h1 { margin-bottom: 90px; } .accountpage #left-nav { padding-bottom: 8px; margin-top: 50px; border-bottom: 1px dashed #a0a0a0; position: absolute; padding-bottom: 16px; } .accountpage #left-nav .menu.dynamic { margin-top: 5px; text-align: left; } .accountpage #left-nav .menu.dynamic li { display: inline; } .login.accountpage #page-content { width: 100%; float: none; } .login.accountpage #left-nav { display: none; } .accountpage .birthday, .accountpage .Birthday { width: 100%; } .accountpage .Birthday input { width: 47%; } .accountpage #main .customer.existing { width: 45%; float: left; margin-right: 10%; } .accountpage #main .customer.new { float: left; padding: 20px; text-align: left; } .accountpage #main .customer.new .new-cust { width: 100%; padding: 10px; } .history td.order-no { width: 20%; } .history td.ship-to { width: 50%; } .history td.date { width: 30%; } .history .order-summary .order-no a { color: #7cc244; } .history .order-summary .order-no a:hover { text-decoration: none; } .history .rebuild { text-align: right; } .history .rebuild-options { text-align: right; padding: 10px 0; border-bottom-width: 1px; } .history .rebuild-options a { margin-left: 10px; } } @media (min-width: 992px) { .accountpage h1 { margin-bottom: 50px; } .accountpage #left-nav { padding-bottom: 16px; margin-top: 0; } .accountpage #left-nav .menu.dynamic { text-align: right; } } @media (min-width: 1150px) { .accountpage .Birthday input { width: 40%; } } /* ========= CUSTOMER COMPONENT END ========= */ /* ========= SHOPPING CART COMPONENT ========= */ .loggedin.cartpage #breadcrumbs .breadcrumb-container .breadcrumb li { width: 25%; } .loggedin.cartpage #breadcrumbs .breadcrumb-container .breadcrumb .homelink { display: none; } .loggedin.cartpage #breadcrumbs .breadcrumb-container .breadcrumb .review span:before { content: "1."; } .loggedin.cartpage #breadcrumbs .breadcrumb-container .breadcrumb .delivery span:before { content: "2."; } .loggedin.cartpage #breadcrumbs .breadcrumb-container .breadcrumb .payment span:before { content: "3."; } .loggedin.cartpage #breadcrumbs .breadcrumb-container .breadcrumb .complete span:before { content: "4."; } .cart { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-direction: column; } .cart .update { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center; } .cart .update span { font-size: 15px; width: 60%; } .cart .update button { width: auto; padding-right: 0; } .cart .summary-table .item h4 a { font-size: 14px; } .cart .summary-table .pricing .approx { font-size: 14px; letter-spacing: normal; text-transform: capitalize; } .cart .summary-table .pricing p { font-size: 0px; letter-spacing: -1px; } .cart .summary-table .pricing p span { font-size: 14px; } .cart .summary-table p { margin: 5px 0; } .cart .summary-table .item h4 { margin: 0; } .cart .next-previous .prev { padding-left: 0; padding-right: 0; min-width: 0px !important; } .cartpage #breadcrumbs { display: block; } .cartpage #breadcrumbs .breadcrumb-container { padding: 0 15px; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb { text-align: center; padding: 0; background-color: #e7f2d9; margin-top: 30px; width: 100%; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .login:after { display: none; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb li:before { content: ""; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb > li + li:hover:before { color: #000; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb li:hover a { color: #000; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .on { border: solid 1px; border-radius: 30px; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb li { width: 20%; padding: 10px 0; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb > li + li:before { font-size: 15px; padding: 0; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .homelink { display: none; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .review span:before { content: "1."; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .login span:before { content: "2."; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .delivery span:before { content: "3."; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .payment span:before { content: "4."; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .complete span:before { content: "5."; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb span:before { font-size: 16px; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb span { font-size: 1px; letter-spacing: -1px; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb a { text-decoration: none; } .cartpage .next-previous, .cartpage .accountpage .next-previous { clear: both; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-direction: column; } .cartpage .next-previous .prev, .cartpage .accountpage .next-previous .prev { order: 2; } .cartpage .next-previous .next, .cartpage .accountpage .next-previous .next { order: 1; } .cartpage .next-previous .btn, .cartpage .accountpage .next-previous .btn { margin-bottom: 15px; } .cartpage .next-previous:first-of-type, .cartpage .accountpage .next-previous:first-of-type { display: none; } .cartpage #page-content { width: 100%; } .cartpage #left-nav { display: none; } .cartpage .page-container .hint { font-size: 15px; margin-bottom: 5px; display: inline-block; font-weight: normal; } .cartpage .page-container .hint.popup-link { display: inline-block; padding-left: 5px; } .cartpage .empty + .next-previous .prev { background-color: #05703b; color: #fff; text-decoration: none; border-radius: 20px; font-weight: normal; padding: 8px 40px; } .cartpage .empty { margin: 10px 0; } .cartpage #page-content .customer { margin-top: 15px; background-color: #e7f2d9; padding: 25px; } .cartpage .new h3 { text-align: center; margin-bottom: 20px; } .cartpage .cart-summary-panel .item-summary .total { text-align: right; } .cartpage .fake-select li { width: 100% !important; } .cartpage .gift-info li.text-field input + label { width: 80px; } .cartpage .card-expiry select { width: 48%; display: inline-block; } .cartpage .card-expiry select + select { margin-left: 4%; } .cartpage .card-expiry select .main-container .customer.existing p.note { display: none; } .cartpage .cart-total .freight-provider { padding-left: 10px; display: none; } .cartpage .cart-summary.eso-accordion .btn { text-align: left; } .cartpage .cart-summary.eso-accordion .cart-total { border-bottom: none; margin: 0; padding: 0; } .cartpage .cart-summary.eso-accordion .cart-total li span { font-size: 14px; } .cartpage .cart-summary .modify a { width: auto; padding: 0; margin-top: 25px; width: 100%; } .cartpage .cart-summary .info-container { margin-top: 30px; } .cartpage .cart-summary .summary-block { padding-bottom: 15px; border-top-width: 1px; } .cartpage .cart-summary .summary-block .confirm-summary tr td { padding-bottom: 5px; } .cartpage .cart-summary .summary-block .confirm-summary tr td:first-child { padding-right: 10px; } .cartpage .cart-summary .summary-block .summary-block p { margin-bottom: 5px; } .cartpage .cart-summary .summary-block:last-child { border-bottom-width: 1px; margin-bottom: 15px; } .cartpage .cart-summary .summary-block h2 { font-size: 18px; position: relative; padding: 15px 0 0; margin: 0 0 5px; } .cartpage .cart-summary .summary-block h2.eso-accordion-trigger { cursor: pointer; } .cartpage .cart-summary .item-summary { width: 100%; } .cartpage .cart-summary #zipRepayCalc { margin-bottom: 10px; } .history .cart-summary h2 { font-size: 18px; } .cart .content h2 { font-size: 16px; } .cart .masterpass-express, .cart .afterpay { display: block; margin-top: 15px; } .cart .item-detail .click-and-collect { padding: 10px 0; } .item .cart-summary:nth-child(n+2) td { padding-top: 15px; } .cart-extras { clear: both; padding: 25px 0 15px; text-align: center; } .cart-extras a:first-child { margin-right: 1em; } .postcode button { width: auto; } main table.summary-table, #cart-item-added table, .order-summary { width: 100%; } main table.summary-table tr, #cart-item-added table tr, .order-summary tr { position: relative; display: block; margin-bottom: 20px; padding-bottom: 20px; border-bottom-width: 1px; } main table.summary-table tr:before, main table.summary-table tr:after { content: ""; display: table; } main table.summary-table .item-detail, main table.summary-table .qty, main table.summary-table .pricing, main table.summary-table .total { float: right; clear: right; width: 57%; } main table.summary-table .actions ul, main table.summary-table .actions li { margin-bottom: 0; } main table.summary-table #cart-item-added table .item-detail, main table.summary-table #cart-item-added table .qty, main table.summary-table #cart-item-added table .pricing, main table.summary-table #cart-item-added table .total { float: right; clear: right; width: 57%; } main table.summary-table .order-summary .item-detail, main table.summary-table .order-summary .qty, main table.summary-table .order-summary .pricing, main table.summary-table .order-summary .total { float: right; clear: right; width: 57%; } main table.summary-table main table.summary-table .total, main table.summary-table main table.summary-table .pricing, main table.summary-table main table.summary-table .qty { margin-top: 10px; } main table.summary-table #cart-item-added table .actions ul, main table.summary-table #cart-item-added table .actions li { margin-bottom: 0; } main table.summary-table #cart-item-added table .total, main table.summary-table #cart-item-added table .pricing, main table.summary-table #cart-item-added table .qty { margin-top: 10px; } main table.summary-table .order-summary .actions ul, main table.summary-table .order-summary .actions li { margin-bottom: 0; } main table.summary-table .order-summary .total, main table.summary-table .order-summary .pricing, main table.summary-table .order-summary .qty { margin-top: 10px; } main table.summary-table .pricing p, main table.summary-table #cart-item-added table .pricing p, main table.summary-table .order-summary .pricing p { margin-bottom: 0; } main table.summary-table .total span:before, main table.summary-table #cart-item-added table .total span:before, main table.summary-table .order-summary .total span:before { content: "Total: "; } main table.summary-table .qty input, main table.summary-table #cart-item-added table .qty input, main table.summary-table .order-summary .qty input { text-align: center; } main table.summary-table .actions, main table.summary-table #cart-item-added table .actions, main table.summary-table .order-summary .actions { clear: right; width: 55%; float: right; } main table.summary-table .actions .remove, main table.summary-table #cart-item-added table .actions .remove, main table.summary-table .order-summary .actions .remove { position: absolute; right: 0; top: 0; } main table.summary-table .item-detail { padding-right: 8%; } main table.summary-table .item-detail .style-number { display: none; } main table.summary-table .qty input { width: 50%; display: inline; margin-bottom: 8px; border-left: none; border-right: none; border-radius: 0; } #cart-item-added table tr:before, #cart-item-added table tr:after { content: ""; display: table; } .order-summary tr:before, .order-summary tr:after { content: ""; display: table; } main table.summary-table tr:after, #cart-item-added table tr:after, .order-summary tr:after { clear: both; } main table.summary-table td, #cart-item-added table td, .order-summary td { display: block; } main table.summary-table th, #cart-item-added table th, .order-summary th { display: none; } main table.summary-table .item figure, #cart-item-added table .item figure, .order-summary .item figure { width: 35%; margin-right: 10px; } main table.summary-table .item-detail h4, #cart-item-added table .item-detail h4, .order-summary .item-detail h4 { margin-top: 0; } table.summary-table td.item figure, #cart-item-added table td.item figure { float: left; } table.summary-table td.item .brand, #cart-item-added table td.item .brand { margin-top: 0; } table.summary-table td.item .brand span, #cart-item-added table td.item .brand span { display: none; } table.summary-table td.item .selections p, #cart-item-added table td.item .selections p { margin-bottom: 0; } main .cart .promo-code { padding: 25px 0; border-width: 1px 0; margin: 25px 0; width: 100%; } main .cart .promo-code button { width: auto; float: right; text-align: right; padding: 0; } main .cart .promo-code label, main .cart .promo-code .hint { display: none; } main .cart .promo-code input, main .cart .promo-code label { width: 100%; } main .cart .promo-code ul { margin-bottom: 0; display: flex; } main .cart .promo-code ul li { display: inline-block; margin-bottom: 0; } main .cart .promo-code ul li:first-child { flex-grow: 1; margin-right: 30px; float: left; } .cart-total { margin-top: 30px; padding-bottom: 30px; border-bottom-width: 1px; } .cart-total .hint { font-size: 14px; } .cart-total:before { content: ""; display: table; } .cart-total:after { content: ""; display: table; clear: both; } .cart-total span { float: left; font-size: 16px; } .cart-total span + span { float: right; } .cart-total li { padding-bottom: 5px; margin-bottom: 5px; clear: both; } .cart-total li:before { content: ""; display: table; } .cart-total li:after { content: ""; display: table; clear: both; } .cart-total .total { font-size: 18px; text-transform: uppercase; font-weight: bold; } .cart_summary_panel table { width: 100%; } .cart_summary_panel table.totals { margin-bottom: 10px; } .cart_summary_panel p.qty { margin-bottom: 0; } .cart_summary_panel td { vertical-align: bottom; border-bottom-width: 1px; padding: 2px 0; } .cart_summary_panel td.total { text-align: right; } .total { vertical-align: top; } #retrieve-password, #header-retrieve-password, #billing-form { display: none; } .complete .cart h2, .history .cart h2 { font-size: 18px; font-weight: bold; } .complete .cart .summary-table .qty:before, .history .cart .summary-table .qty:before, .review .cart .summary-table .qty:before { content: "Qty: "; } .security-logos { margin-bottom: 40px; margin-top: 20px; -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-flow: wrap; justify-content: space-between; } .security-logos > span { width: 30%; } .security-logos > span img { width: 100%; max-width: 130px; height: auto; display: block; margin: auto; } .security-logos span { max-height: 60px; display: inline-block; } .security-logos span img { width: 100%; } .security-logos span.dpsexpress img { max-width: 130px; } .hint-content:before { content: ""; display: table; } .hint-content:after { content: ""; display: table; clear: both; } .print .main-container .cart-summary { width: 100%; } .print .cart-summary { float: none; } .print .cart-summary .summary-block { float: left; width: 32%; margin-left: 2%; } .print .cart-summary .summary-block td { padding-right: 15px; } .print .cart-summary .summary-block:first-child { margin-left: 0; } .print .cart-summary p, .print .cart-summary td { margin-bottom: 0; padding-bottom: 5px; } .print .cart { clear: both; width: 100%; margin: 15px auto; float: none; } .print .cart-summary { width: 100%; margin: 15px auto; float: none; } .cartpage .account-details .updateship { width: 100%; } .cartpage .account-details .delivery-method label { display: block; margin-left: 20px; margin-bottom: 0; } .cartpage .account-details .delivery-method input[type="radio"] { float: left; margin-top: 1px; } .cartpage .cart .account-details input[type="checkbox"], .accountpage .account-details input[type="checkbox"], .login.accountpage input[type="checkbox"], .wishlist .page-container input[type="checkbox"] { vertical-align: top; } .login.cartpage .error { margin-bottom: 20px; } .login.cartpage #main .cart-summary { display: none; } .delivery.cartpage .summary-block .modify a { width: 100%; } .cartpage .cart .customer.existing li.email > label, .cartpage .cart .customer.existing li.password > label { display: none; } #sign-in li.email > label, #sign-in li.password > label { display: none; } .accountpage .customer.existing li.email > label, .accountpage .customer.existing li.password > label { display: none; } /*Style for AccountPage*/ .cartpage .main-container .customer.new { width: 100%; } .cartpage .main-container .customer.new .options span { display: inline-block; padding: 5px 0; text-align: center; font-size: 12px; } .cartpage.login #main li.email, .cartpage.login #main li.password, .cartpage.login #main .options .btn, .cartpage.login .options span { width: 100%; } .modify { display: block; } /* Additional Style for Paypal */ .payment.loggedin .cart .account-details .payment-options .paypal-method { margin-right: 15px; } .payment.loggedin .cart .account-details .payment-method ol li:first-of-type ul { display: none; } .payment.loggedin .cart .account-details .payment-method ol li:first-of-type .fake-select { display: inline-block; float: none; } .page-container .sameas label, .payment-method label, .delivery-method li label { width: 90%; } /*** Shopping cart CLICK AND COLLECT ***/ .cartpage.review .cc-delivery-method { width: 100%; } .cartpage.review .cc-delivery-method .delivery-type li { width: 47.5% !important; text-align: center; padding-bottom: 10px; } .cartpage.review .cc-delivery-method .delivery-type a[data-toggle=popover] { text-align: center; display: inline-block; margin-left: 5px; } .cartpage.review .cc-delivery-method legend { display: none; } .cartpage.review .cc-delivery-method.storeselected .selected-store { display: block; } .cartpage.review .cc-delivery-method.storeselected .changestore { display: block; } .cartpage.review .delivery-type { border-bottom: 1px solid #a0a0a0; } .cartpage.review .delivery-type p { text-align: center; } .cartpage.review .delivery-type a[data-toggle=popover] { padding: 0; display: block; border: none; margin: 0; border-radius: 0; background: none; cursor: pointer; font-weight: normal; outline: none; } .cartpage.review .delivery-type .selected-store { display: none; font-weight: 600; } .cartpage.review .delivery-type .selected-store .storename, .cartpage.review .delivery-type .selected-store .storeaddress { display: block; } .cartpage.review .delivery-type .selected-store.loading { min-height: 40px; background: url("ajax-loader.gif") center no-repeat; } .cartpage #clickandcollectlayer { display: none; } .cartpage #clickandcollectlayer.active { display: block; } .cartpage .cc-delivery-method .delivery-type { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; } .cartpage .cc-delivery-method .delivery-type:before, .cartpage .cc-delivery-method .delivery-type:after { display: none; } .cartpage .cc-delivery-method .delivery-type li { width: 47.5% !important; } .cartpage .cc-delivery-method .delivery-type li label { position: relative; background: #a6a5a5; width: 100%; vertical-align: middle; color: #fff; font-weight: normal; text-transform: uppercase; margin: 0 0 9px; cursor: pointer; text-align: center; line-height: 40px; } .cartpage .cc-delivery-method .delivery-type li a { padding-left: 6.5%; } .cartpage .cc-delivery-method .delivery-type li a, .cartpage .cc-delivery-method .delivery-type li.active a { border: 0; cursor: pointer; border-radius: 0; padding: 0; } .cartpage .cc-delivery-method .delivery-type li a:hover, .cartpage .cc-delivery-method .delivery-type li.active a:hover { text-decoration: none; } .cartpage .cc-delivery-method .delivery-type input[type="radio"] { vertical-align: middle; position: absolute; left: -999em; } .cartpage .cc-delivery-method .delivery-type input[type="radio"] + span:before { content: ''; display: inline-block; width: 14px; height: 14px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; background-color: #fff; border: 4px solid #fff; margin-right: 5px; vertical-align: sub; } .cartpage .cc-delivery-method .delivery-type .active input[type="radio"] + span:before { background-color: #e7f2d9; } .cartpage .cc-delivery-method .delivery-type .store-availability { display: inline-block; font-weight: normal; } .cartpage .cc-delivery-method .delivery-type .store-availability-selected { display: none; font-weight: normal; } .cartpage .cc-delivery-method .delivery-type .changestore { display: none; text-decoration: underline; } .cartpage .cc-delivery-method.storeselected .store-availability { display: none; } .cartpage .cc-delivery-method.storeselected .store-availability-selected { display: inline-block; } .cartpage .cc-search ul { -webkit-flex-direction: column; flex-direction: column; } .cartpage .cc-search .postcode { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; justify-content: space-between; -webkit-justify-content: space-between; } .cartpage .cc-search label { display: none; } .cartpage .cc-search input { padding: 6px 6px 6px 18px; max-width: 73%; } .cartpage .cc-search button { margin: 0; } .cartpage .cc-search .opening-hours { text-decoration: underline; margin-top: 5px; display: none; } .cartpage .cc-search .store-location.selected .opening-hours { display: inline-block; } .cartpage .cc-search-info { margin: -25px 0 0 0; } .cartpage.delivery #main .delivery-info .btn { width: 100%; } .cartpage.delivery .cc-delivery-method { margin-bottom: 0; margin-top: 20px; } .cartpage.delivery .cc-delivery-method .nav.nav-tabs { border: none; } .cartpage.delivery .cc-delivery-method .selected-store, .cartpage.delivery .cc-delivery-method .changestore, .cartpage.delivery .cc-delivery-method .no-store-selected { display: none; } .cartpage.delivery .cc-delivery-method .delivery-type > li, .cartpage.delivery .cc-delivery-method .delivery-type label { margin: 0; } .cartpage.delivery .cc-delivery-method .delivery-type p { display: none; } .cartpage.delivery .ccNominate { width: 100%; } .cartpage.delivery .ccNominate label { width: 90%; } .cartpage.delivery .delivery-store-details { margin: 0; width: 100%; display: none; } .cartpage.delivery .delivery-store-details.active { display: initial; } .cartpage.delivery .delivery-store-details.loading > label { min-height: 40px; display: inline-block; background: url("ajax-loader.gif") center no-repeat; } .cartpage.delivery .delivery-store-details.storeselected > label { display: inline-block; } .cartpage.delivery .delivery-store-details label { position: relative; display: none; padding: 0; margin: 0; } .cartpage.delivery .delivery-store-details #delivery-store input { display: none; } .cartpage.delivery .delivery-store-details label p { display: inline; font-weight: normal; margin: 0; } .cartpage.delivery .delivery-store-details label .no-store-selected { display: inline; } .cartpage.delivery .delivery-store-details label .selected-store { display: none; } .cartpage.delivery .delivery-store-details label.itemsCollasped span { display: inline; } .cartpage.delivery .delivery-store-details p { font-weight: bold; } .cartpage.delivery .delivery-store-details .no-store-selected { font-weight: normal; margin: 0; } .cartpage.delivery .delivery-store-details .changestore { display: none; text-decoration: underline; white-space: nowrap; font-size: 11px; font-weight: normal; padding-left: 5px; } .cartpage.delivery .delivery-store-details.storeselected label { padding: 10px 5px 10px 0; } .cartpage.delivery .delivery-store-details.storeselected #delivery-store.collapsed .changestore { display: inline; } .cartpage.delivery .delivery-store-details.storeselected #delivery-store input { display: inline-block; } .cartpage.delivery .delivery-store-details.storeselected #delivery-store .selected-store { display: inline; } .cartpage.delivery .delivery-store-details.storeselected .no-store-selected { display: none; } .cartpage.delivery .delivery-store-details label, .cartpage.delivery .ccNominate label { cursor: pointer; } .cartpage.delivery fieldset.cc-search-info { margin-top: 0; } .cartpage .selected-store span:after { content: ', '; } .cartpage .selected-store span.storepostcode:after { content: ''; } .cartpage .selected-store span.storecity, .cartpage .selected-store span.storecountry, .cartpage .selected-store span.storephone { display: none; } /* click and collect pop up - store selection and map */ #clickandcollect .modal-body { min-height: 290px; } .clickandcollect { position: relative; } .clickandcollect:before, .clickandcollect:after { content: ""; display: table; } .clickandcollect:after { clear: both; } .clickandcollect .puis div.form-item-search button { margin: 12px 0; } .clickandcollect .store > .images { display: none; } .clickandcollect .store-links h2 { font-size: 16px; margin: 0 0 10px; border-bottom: 2px solid #000; line-height: 2em; } .clickandcollect .store-links li { font-size: 12px; } .clickandcollect .store-links li:before, .clickandcollect .store-links li:after { content: ""; display: table; } .clickandcollect .store-links li:after { clear: both; } .clickandcollect .store-links h3 { position: relative; padding-left: 40px; margin-top: 0; float: left; width: 63.5%; font-size: 14px; font-weight: normal; } .clickandcollect .store-links h3 img { position: absolute; left: 0; } .clickandcollect .store-links .store-name { font-weight: 600; } .clickandcollect .store-links .store-details, .clickandcollect .store-links .store-name, .clickandcollect .store-links .store-address { display: block; } .clickandcollect .store-links .store-details a, .clickandcollect .store-links .store-details a:hover, .clickandcollect .store-links .store-name a, .clickandcollect .store-links .store-name a:hover, .clickandcollect .store-links .store-address a, .clickandcollect .store-links .store-address a:hover { text-decoration: underline; } .clickandcollect .store-links .store-select { display: block; } .clickandcollect .store-links .store-select a { font-weight: normal; text-transform: none; padding: 10px; white-space: normal; line-height: 20px; height: auto; width: 100%; } .clickandcollect .stores { display: none; position: relative; } .clickandcollect .stores h3 { font-size: 16px; padding-left: 40px; } .clickandcollect .stores h3 img { position: absolute; left: 0; } .clickandcollect .stores .back.btn { margin-top: 20px; } .clickandcollect .stores .store .directions { width: 100%; float: none; } .clickandcollect .stores .store h4 { font-size: 16px; } .clickandcollect .stores .store .store-name { position: relative; margin: 0px 0 10px; padding: 0 0 10px; font-weight: 500; } .clickandcollect .stores .store .store-name span.distance { font-size: 14px; text-align: right; } .clickandcollect .stores .store .store-name img { margin-right: 10px; width: 15px; } .clickandcollect .stores .store .store-info { display: none; } .clickandcollect .stores .store .store-info .store-address { padding-bottom: 10px; } .clickandcollect .stores .store .store-info .store-address ul { padding-left: 40px; } .clickandcollect .stores .store .store-info .store-address ul li.storecountry, .clickandcollect .stores .store .store-info .store-address ul li.storephone, .clickandcollect .stores .store .store-info .store-address ul li.storeaddress { display: block; } .clickandcollect .stores .store .store-details { display: none; } .clickandcollect .stores .store .store-details ul { margin-bottom: 20px; list-style: none; padding: 0; } .clickandcollect .stores .store .store-details ul li { margin-bottom: 5px; } .clickandcollect .stores .store .store-details .store-select { display: block; padding-top: 20px; } .clickandcollect .stores.showstore .store h3 { display: none; } .clickandcollect .stores.showstore .store .store-info, .clickandcollect .stores.showstore .store .store-details { display: block; } .clickandcollect .stores.showstore .store .store-address ul { padding-left: 0; } .clickandcollect .stores.showstore .store .store-address ul li { margin-bottom: 0; display: inline; } .clickandcollect .stores.showstore .store .store-address ul li label { display: inline; } .clickandcollect .map-link a { display: block; text-align: center; } .clickandcollect .map-container { position: relative; padding-top: 60%; display: none; } .clickandcollect .ajax-content.storedetails form.puis > p, .clickandcollect .ajax-content.storedetails form.puis .form-item-search { display: none; } .modal#storedetail .storedetail .store > h1 { display: none; } .modal#storedetail .storedetail .address { border: 0; padding: 0; } .modal#storedetail .storedetail .address, .modal#storedetail .storedetail .opening-hours, .modal#storedetail .storedetail .directions { width: 100%; } .modal#storedetail .storedetail .map-link a { display: inline-block; width: auto; } .suburb-select .clickandcollect .map-container, .stores-display .clickandcollect .map-container { display: block; } .suburb-select .clickandcollect .results, .stores-display .clickandcollect .results { margin-bottom: 30px; } .delivery .customer-info .tel, .delivery .nominated-person .tel, .delivery .delivery-info .tel, .accountpage .customer-info .tel, .accountpage .nominated-person .tel, .accountpage .delivery-info .tel { width: 100%; } .delivery .nominated-person ol li:nth-child(2), .accountpage .nominated-person ol li:nth-child(2) { display: block; width: 100% !important; } /*** Frieght Estimator ***/ .shipping-calculator .delivery-method.loading { height: 40px; background: url("ajax-loader.gif") center no-repeat; } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { .review.cartpage #page-content { width: 100%; float: none; } .review.cartpage #page-content .cart { width: 100%; } .review.loggedin.cartpage #page-content .summary-block { display: none; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb { margin-bottom: 20px; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb span { display: inline-block; font-size: 15px; letter-spacing: 1px; } .cartpage #breadcrumbs .breadcrumb-container .breadcrumb .review span { letter-spacing: normal; } .cartpage.review .cc-delivery-method { width: 50%; clear: right; float: right; } .cartpage.login #main li.email, .cartpage.login #main li.password, .cartpage.login #main .options .btn, .cartpage.login .options span { max-width: 400px; margin-left: auto; margin-right: auto; } .login.cartpage .cart { width: 100%; flex-direction: row; flex-wrap: wrap; justify-content: space-between; } .login.cartpage .cart .next-previous { margin-top: 25px; width: 100%; flex-direction: row; } .cartpage .main-container .customer { float: left; } .cartpage .main-container .customer.existing { text-align: center; width: 48%; } .cartpage .main-container .customer.existing .forgotten { text-decoration: underline; text-transform: lowercase; } .cartpage .main-container .customer.new { width: 48%; } .cartpage .main-container .customer.new p.options { padding-top: 42px; text-align: center; } .cartpage .main-container .customer.new .btn { width: 100%; } .new + .next-previous { justify-content: flex-end !important; } .security-logos { justify-content: flex-start; } .security-logos > span { width: 110px; } .security-logos .estarsecure { margin: 0 15px; } main .cart { width: 70%; float: left; } main .cart .promo-code { border-top: 0; margin: 0; } main .cart .promo-code button { min-width: inherit; width: 100%; } main .cart .promo-code ul li { margin-bottom: 0; } main .cart .promo-code ul li:last-child { width: auto; } .review .main-container .cart-summary { display: none; } .main-container .cart-summary { width: 23%; float: right; padding-top: 67px; } main .cart .promo-code { width: 50%; clear: right; float: right; text-align: right; } main .cart-extras { float: right; } main .cart .cart-total { width: 50%; clear: right; float: right; margin-left: auto; } main .cart .masterpass-express, main .cart .afterpay { display: inline-block; margin-right: 1em; } main table.summary-table .total span:before { content: ""; } main table.summary-table tr { border: 0; margin: 0; padding: 0; display: table-row; } main .order-summary tr { margin: 0; padding: 0; display: table-row; } main table.summary-table .total { text-align: right; } main table.summary-table .pricing, main table.summary-table .total { width: 18%; } main table.summary-table .qty { min-width: 70px; } main table.summary-table .item-detail, main table.summary-table .qty, main table.summary-table .pricing, main table.summary-table .total { float: none; clear: none; width: auto; } main table.summary-table td, main table.summary-table th { font-weight: normal; display: table-cell; text-transform: uppercase; border-bottom-width: 1px; padding: 25px 0; } main table.summary-table th { font-size: 16px; } main .order-summary .item-detail, main .order-summary .qty, main .order-summary .pricing, main .order-summary .total { float: none; clear: none; width: auto; } main .order-summary th, main .order-summary td { display: table-cell; } main .order-summary td, main .order-summary th { border-bottom-width: 1px; padding: 15px 0; } main .order-summary .pricing, main .order-summary .total { width: 18%; } main .order-summary .total, main .order-summary .actions { text-align: right; } main table.summary-table td, main .order-summary td { padding-right: 5px; vertical-align: middle; width: 50%; } main table.summary-table tr:after, main .order-summary tr:after { content: ""; display: none; clear: none; } main table.summary-table .item .item-detail, main .order-summary .item .item-detail { float: left; width: 72%; text-transform: capitalize; } main table.summary-table .actions, main .order-summary .actions { /* clear: none; */ width: 10px; /* float: none; */ position: absolute; right: 10px; border: none; } main table.summary-table .actions .remove, main .order-summary .actions .remove { position: relative; } main table.summary-table .qty, main .order-summary .qty { text-align: center; } main table.summary-table .qty input, main .order-summary .qty input { width: 50px; } main table.summary-table .price.now, main .order-summary .price.now { padding-left: 0; } main table.summary-table .price.was { text-decoration: none; } main table.summary-table .price.was span { text-decoration: line-through; } .review #main .next-previous:first-of-type { display: block; width: 100%; padding: 0; } .cartpage .cart .summary-table .qty { display: table-cell; } .cartpage .ESO_number_wrapper { padding: 0; max-width: 140px; } .cartpage .ESO_number_wrapper a { width: 32%; } .cartpage .payment { float: none; } .cartpage #main .next-previous { flex-direction: row-reverse; justify-content: space-between; width: 100%; float: right; } .cartpage #main .next-previous .prev { float: left; } .cartpage .cart-extras + .next-previous { width: 50% !important; } .cartpage .clickandcollect .puis:before, .cartpage .clickandcollect .puis:after { content: ""; display: table; } .cartpage .clickandcollect .puis:after { clear: both; } .cartpage .clickandcollect .puis .form-item-search { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; justify-content: space-between; } .cartpage .clickandcollect .puis .form-item-search input { width: 60%; } .cartpage .clickandcollect .puis .form-item-search button { margin: 0; } .cartpage .clickandcollect .store .store-select { float: right; } .cartpage .clickandcollect .store .store-select a { width: auto; } .cartpage .clickandcollect .map-holder { width: 42.5%; position: absolute; right: 0; top: 0; } .cartpage .clickandcollect .map-container { padding-top: 80%; } .cartpage .clickandcollect .store-info.content p, .cartpage .clickandcollect .store-info.content li:not(.storecountry), .cartpage .clickandcollect .store-info.content a { margin: 0; } .cartpage .clickandcollect .store-info.content label { display: inline-block; } .cartpage .clickandcollect .store-info.content h4 { font-size: 15px; font-weight: bold; margin: 0 0 3px; } .cartpage .clickandcollect a.back.btn { margin: 15px 0; } .cartpage.review .cc-search ul li.postcode button { margin: 0; } .suburb-select .clickandcollect form.puis > p, .suburb-select .clickandcollect form.puis > div, .stores-display .clickandcollect form.puis > p, .stores-display .clickandcollect form.puis > div { width: 50%; float: left; clear: left; } .modal.single-store .clickandcollect .map-holder { width: 50%; position: absolute; right: 0; top: 0; } .accountpage #main .next-previous { padding: 40px 0 20px; } .cartpage #main .next-previous .next, .accountpage #main .next-previous .next { float: right; } .cartpage #main .next-previous .btn, .cartpage #main .next-previous .next { min-width: 190px; } .accountpage #main .next-previous:before, .accountpage #main .next-previous:after { content: ""; display: table; } .cartpage #main .next-previous:after, .accountpage #main .next-previous:after { clear: both; } .cart-total span:not(.hint):last-child { margin-left: 10px; } .cart-extras:before { content: ""; display: table; text-align: right; } .cart-extras:after { content: ""; display: table; clear: both; } .update { border-bottom-width: 1px; margin: 15px 0 0; padding-bottom: 15px; float: right; width: 50%; } .update span { margin-right: 5px; } .hint-content .csc-type { float: left; width: 45%; } .hint-content .csc-type + .csc-type { margin-left: 10%; } .complete .cart .summary-table .qty:before, .history .cart .summary-table .qty:before, .review .cart .summary-table .qty:before { content: ""; } .complete .cart-total { border: none; margin-left: auto; } .complete .selections .error { display: none; } /*** Frieght Estimator ***/ .shipping-calculator { width: 50%; float: left; } .shipping-calculator fieldset ul { display: block !important; } .shipping-calculator label { text-align: left; display: block; width: auto; } .shipping-calculator ul li { display: inline-block; margin: 0 5px 10px 0; } .shipping-calculator .postcode-btn { width: 100%; min-width: 0; } .shipping-calculator .calculator-label { display: block; width: 100%; } .shipping-calculator .calculator-input input, .shipping-calculator .country select, .shipping-calculator .state select { width: 100%; vertical-align: middle; display: inline-block; } .shipping-calculator .country { float: left; } .shipping-calculator .delivery-method li { margin: 0; } .shipping-calculator .delivery-method li label { width: auto; display: inline-block; } .review .cc-delivery-method { width: 50%; } .accountpage:not(.login):not(.wishlist) main form fieldset:not(.interest-groups):not(.payment-method):not(.masterpass-account) ul, .accountpage:not(.login):not(.wishlist) main form fieldset:not(.interest-groups):not(.payment-method):not(.masterpass-account) ol, .cartpage:not(.login) main form fieldset:not(.interest-groups):not(.payment-method) ul, .cartpage:not(.login) main form fieldset:not(.interest-groups):not(.payment-method) ol, .accountpage:not(.login):not(.wishlist) main form fieldset:not(.interest-groups):not(.masterpass-account) ul, .accountpage:not(.login):not(.wishlist) main form fieldset:not(.interest-groups):not(.masterpass-account) ol, .cartpage:not(.login) main form fieldset:not(.interest-groups) ul, .cartpage:not(.login) main form fieldset:not(.interest-groups) ol { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; -webkit-justify-content: space-between; } .cartpage main form fieldset:not(.interest-groups):not(.payment-method) ul, .cartpage main form fieldset:not(.interest-groups) ul { flex-direction: column; -webkit-flex-direction: column; } .delivery main form fieldset:not(.interest-groups) li:not(.sameas):not(.birthday):not(.Birthday):not(.ccNominate):not(.delivery-store-details), .accountpage:not(.login):not(.wishlist) main form fieldset:not(.interest-groups) li:not(.sameas):not(.birthday):not(.Birthday):not(.ccNominate):not(.delivery-store-details), .payment main form fieldset:not(.interest-groups) li:not(.sameas):not(.birthday):not(.Birthday):not(.ccNominate):not(.delivery-store-details) { width: 47%; } .delivery main form fieldset:not(.interest-groups) li.sameas, .accountpage:not(.login):not(.wishlist) main form fieldset:not(.interest-groups) li.sameas, .payment main form fieldset:not(.interest-groups) li.sameas { width: 100%; } .account-details .updateship { width: 100% !important; } main table.summary-table .item figure, #cart-item-added table .item figure, .order-summary .item figure { width: 20%; } } @media (max-width: 1150px) { .cart li.text-field label { width: 100%; } } @media (min-width: 1150px) { .cartpage #breadcrumbs .breadcrumb-container { padding: 0; } } /*** DESKTOP ***/ @media (min-width: 1200px) { main .cart table.summary-table .item .item-detail { vertical-align: middle; } main .cart table.summary-table .item figure, main .cart table.summary-table .item .item-detail { float: none; display: inline-block; } .cartpage .main-container .customer.new .btn { display: inline-block; width: auto; } .cartpage .card-expiry select { width: 34%; } .cartpage .card-expiry select + select { margin-left: 2%; } /*** Frieght Estimator ***/ main #page-content .shipping-calculator .postcode-btn { width: auto; min-width: 0; } .accountpage:not(.login):not(.wishlist) main form fieldset:not(.interest-groups) li:not(.sameas):not(.birthday):not(.Birthday):not(.ccNominate):not(.delivery-store-details) { width: 40%; } .cartpage main form fieldset:not(.interest-groups) li.sameas, .accountpage:not(.login) main form fieldset:not(.interest-groups) li.sameas { width: 100%; } } /* Gift Card specific styles on the payment page */ .payment main form .gift-card-options .price-amount { margin-right: 5px; } .payment main form .gift-card-options > div { margin-bottom: 15px; } .payment main form .gift-card-options .giftcard-amount > label { margin-bottom: 15px; } .payment main form .gift-card-options .giftcard-amount ol { display: block; } .payment main form .gift-card-options .giftcard-amount ol:before { content: ""; display: table; } .payment main form .gift-card-options .giftcard-amount ol:after { content: ""; display: table; clear: both; } .payment main form .gift-card-options .giftcard-amount ol li { display: inline-block; float: left; width: 16%; margin: 0 2% 0 0; } .payment main form .gift-card-options .giftcard-amount ol li:last-of-type { margin-right: 0; } .payment main form .gift-card-options .giftcard-amount ol li label, .payment main form .gift-card-options .giftcard-amount ol li p { font-size: 12px; font-weight: bold; display: block; margin-bottom: 5px; max-width: 100%; } .payment main form .gift-card-options .giftcard-amount ol .giftcard-number, .payment main form .gift-card-options .giftcard-amount ol .giftcard-security, .payment main form .gift-card-options .giftcard-amount ol .giftcard-number-label, .payment main form .gift-card-options .giftcard-amount ol .giftcard-security-label { width: 28%; margin-right: 4%; } .payment main form .gift-card-options .giftcard-another { display: none; } @media (min-width: 480px) { .payment main .account-details .gift-card-options .giftcard-amount ol li { width: 14%; margin: 0 2% 0 0; } .payment main .account-details .gift-card-options .giftcard-amount ol li:nth-of-type(2n) { margin-right: 2%; } .payment main .account-details .gift-card-options .giftcard-amount ol li:last-of-type { margin-right: 0; } .payment main .account-details .gift-card-options .giftcard-amount ol li label, .payment main .account-details .gift-card-options .giftcard-amount ol li p { font-size: 14px; } .payment main .account-details .gift-card-options .giftcard-amount ol .giftcard-number, .payment main .account-details .gift-card-options .giftcard-amount ol .giftcard-security, .payment main .account-details .gift-card-options .giftcard-amount ol .giftcard-number-label, .payment main .account-details .gift-card-options .giftcard-amount ol .giftcard-security-label { width: 32%; } } /*** TABLETS ***/ @media (min-width: 768px) and (max-width: 1150px) { .cartpage .info-container .modify a { font-size: 11px; } .login .email, .login .password { width: 100%; } } /* ========= SHOPPING CART COMPONENT END ========= */ /* ========= WISHLIST COMPONENT ========= */ .wishlist .left-nav-container .menu.dynamic:nth-of-type(2) { display: none !important; } .wishlist .email-note { border-bottom: 1px dashed #a0a0a0; padding-bottom: 20px; margin-bottom: 20px; } .wishlist .email-note a { text-decoration: underline; } .wishlist .make-public { margin-top: 0; } .wishlist .wishlist-summary { clear: both; } .wishlist .wishlist-summary:before, .wishlist .wishlist-summary:after { content: ""; display: table; } .wishlist .wishlist-summary:after { clear: both; } .wishlist .form-item:not(.quantity):not(.update-quantity):not(.cartbutton) { margin-bottom: 0; } .wishlist .add-to-cart { padding-top: 0; border-top: none; position: inherit; } .wishlist .add-to-cart .cart-options { padding: 0; } .wishlist .product { clear: both; position: relative; margin-bottom: 30px; padding-bottom: 30px; border-bottom-width: 1px; } .wishlist .childproducts .product-content { width: auto; float: none; clear: both; } .wishlist .product-img { width: 40%; float: left; } .wishlist .product-content { width: 55%; float: right; margin: 0; clear: none; } .wishlist .product-content .form-item ul { display: inline-block; } .wishlist .product-content h2 { margin: 0 20px 0 0; font-size: 16px; margin-bottom: 10px; } .wishlist .product-content h2 a { color: #444545; } .wishlist .details-occassion { margin-top: 0; } .wishlist .details-occassion legend { display: none; } .wishlist .add-to-cart .cartbutton button { margin-bottom: 0 !important; } .wishlist .add-to-cart .cartbutton a { position: absolute; right: 0; width: 15px; top: 0; } .wishlist .add-to-cart .cart-options .form-item > label { display: inline-block; } .wishlist .add-to-cart .cart-options { display: flex; line-height: normal; position: inherit; } .wishlist .add-to-cart .cart-options .form-item { margin-bottom: 10px; } .wishlist .add-to-cart .cart-options .form-item li { margin-bottom: 0; } .wishlist .add-to-cart .cart-options .update-quantity { order: 4; width: 100%; } .wishlist .add-to-cart .cart-options .colour { order: 1; } .wishlist .add-to-cart .cart-options .colour label { text-transform: lowercase; font-weight: normal; margin-right: 6px; } .wishlist .add-to-cart .cart-options .colour label:after { content: ":"; } .wishlist .add-to-cart .cart-options .size { order: 2; } .wishlist .add-to-cart .cart-options .size label { text-transform: lowercase; font-weight: normal; margin-right: 8px; } .wishlist .add-to-cart .cart-options .size label:after { content: ":"; } .wishlist .add-to-cart .cart-options .quantity { order: 3; margin-top: 10px; max-width: none; } .wishlist .add-to-cart .cart-options .cartbutton { order: 5; position: inherit; } .wishlist .add-to-cart button[disabled] { display: none; } .wishlist .note { display: block; margin-bottom: 5px; } .wishlist-public.accountpage h1 { margin-bottom: 20px; } .wishlist-public #left-nav { border-bottom: none; display: none; } .wishlist-public .details-occassion + .next-previous { display: none; } .wishlist-public .add-to-cart .cart-options .quantity { margin-right: 0 !important; } .wishlist-public .details-occassion { border-bottom-width: 1px; padding-bottom: 20px; margin-bottom: 30px; } @media (min-width: 590px) { .wishlist .add-to-cart .cart-options .update-quantity { width: 48%; margin-top: 10px; } .wishlist .add-to-cart .cart-options .quantity { width: 48%; margin-right: 4%; } } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { .wishlist .details-occassion + button { width: 20%; } .wishlist .form-item.cartbutton { width: 100%; } .wishlist .quantity { margin-bottom: 0; } .wishlist .update-quantity { width: 60%; float: right; } .wishlist #page-content { width: 100%; } .wishlist .childproducts .product-content { width: 100%; } .wishlist button { width: 100%; } .wishlist-public.accountpage .next-previous button { width: auto; } } /*** DESKTOP ***/ @media (min-width: 1150px) { .wishlist .details-occassion + button { width: 100%; } .wishlist button { width: 100%; } .wishlist .page-container > form { width: 30%; float: right; } .wishlist .page-container .wishlist-summary { float: left; width: 65%; clear: none; } .wishlist-public .page-container .wishlist-summary { width: 100%; } .wishlist-public .wishlist-products .product-img { width: 25%; } .wishlist-public .wishlist-products .product-content { width: 72%; } .wishlist-public .wishlist-products .cart-options { width: 40%; } } /* ========= WISHLIST COMPONENT END ========= */ /******** GIFT VOUCHERS COMPONENT: START ********/ .gift-voucher #deliverydatepicker { padding-top: 8px; } .gift-voucher .dropdown-menu { padding: 20px; } .giftvoucher #main .instructions .intro { font-weight: bold; font-style: italic; } .giftvoucher #main .gift-voucher:not(:-moz-handler-blocked) fieldset { display: table-cell; } .giftvoucher #main .gift-voucher .voucher-carousel { position: relative; margin-bottom: 0; } .giftvoucher #main .gift-voucher .voucher-carousel li { margin-bottom: 0; position: relative; } .giftvoucher #main .gift-voucher .voucher-carousel li input[type=radio] { position: absolute; z-index: -2; margin: 0; } .giftvoucher #main .gift-voucher .voucher-carousel li label { width: 100%; } .giftvoucher #main .gift-voucher .voucher-carousel li label img { width: 100%; } .giftvoucher #main .gift-voucher .value input { width: 40%; margin-left: 5px; display: inline-block; } .giftvoucher #main .gift-voucher figure { margin: 15px 0; } .giftvoucher #main .gift-voucher figure img { width: 100%; max-width: 530px; } .giftvoucher #main .next-previous button { margin-bottom: 15px; white-space: nowrap; } .giftvoucher #main .next-previous .preview { border-radius: 0; } @media (min-width: 768px) { .giftvoucher #main .gift-voucher .value input { width: 30%; } .giftvoucher #main .next-previous .next { float: right; } .giftvoucher #main .next-previous .prev { float: left; } } @media (min-width: 1150px) { .giftvoucher #main .instructions { float: right; width: 35%; margin-top: 80px; } .giftvoucher #main .instructions + form { float: left; width: 55%; } } body.edge .gift-voucher #deliverydatepicker { line-height: inherit; } @supports (-ms-accelerator: true) { .gift-voucher #deliverydatepicker { padding: 0 12px; line-height: inherit; } } /******** GIFT VOUCHERS COMPONENT: END ********/ /* ========= CUSTOM FORM CONTACT COMPONENT ========= */ .contact-form-holder { border-top-width: 1px; padding-top: 10px; margin-top: 10px; } .contact-form-holder input[type="tel"] { width: 30%; display: inline-block; } .contact-form-holder input[type="tel"]:last-of-type { margin-right: 0; } .customform #main form .telephone input[type="tel"] { width: 100%; } .customform #main li input, .customform #main li textarea { font-size: 12px; } .customform #main h3 { margin-top: 4px; font-size: 18px; color: #b0b0b0; } .customform #main #contact-form .error { color: #d9534f; } @media (min-width: 320px) { .contact-form-holder input[type="tel"] { width: 32%; margin-right: 2%; } } @media (min-width: 768px) { .contact-form-holder input[type="tel"] { width: 32%; margin-right: 2%; } } /*** DESKTOP ***/ @media (min-width: 1150px) { .customform #main:before, .customform #main:after { content: ""; display: table; } .customform #main:after { clear: both; } .customform #main .main-container h1 { margin-bottom: 20px; } .customform #main .page-container .content { float: left; width: 45%; } .contact-form-holder { float: right; width: 50%; margin-left: 5%; border-top-width: 0; padding-top: 0; margin-top: 0; } .contact-form-holder fieldset { margin-top: 0; } .contact-form-holder input[type="tel"] { width: 22.5%; margin-right: 1.25%; } .contact-form-holder .security-message label, .contact-form-holder .security-code label { width: 75%; } .contact-form-holder .security-code input, .contact-form-holder .security-message .security-code img { width: 20%; } } /* ========= CUSTOM FORM COMPONENT END ========= */ /* ========= STORE LOCATOR COMPONENT ========= */ .storelocator #page-content { float: none; width: 100%; } .storelocator #left-nav { display: none; } .storelocator .page-container ul li { position: relative; } .storelocator .page-container ul ul li a, .storelocator li.location li a { padding-left: 15px; } .storelocator .page-container li.location ul li { border: 0; } .storelocator .page-container ul ul ul { padding-left: 0px !important; } .storelocator .page-container ul li > a { color: #444545; width: 100%; display: block; padding: 15px 0; } .storelocator .store-locator > li > a { text-transform: uppercase; } .storelocator .store-locator > li > a, .storelocator .store-locator > li > ul > li > a { font-weight: bold; } .storelocator .store-locator > li, .storelocator .store-locator > li > ul > li { border-bottom-width: 1px; } .storelocator .store-locator { padding-left: 0; border-top-width: 1px; } .storelocator .store-map-holder { background: antiquewhite; position: relative; margin-top: 0; padding-top: 100%; width: 100%; min-height: 450px; } .storedetail .store { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; } .storedetail .store .store-map-holder { order: 1; } .storedetail .store .images { padding-top: 25px; width: 100%; order: 5; } .storedetail .store .images ul { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; flex-flow: row wrap; } .storedetail .store .images ul li { flex: auto; width: 200px; margin: 1%; } .storedetail .store .images ul li img { width: 100%; } .storedetail .store .address { order: 2; width: 100%; } .storedetail .store .opening-hours { order: 4; border-top-width: 1px; width: 100%; } .storedetail .store .directions { order: 3; } .storedetail .store .images ul:before, .storedetail .store .images ul:after { content: ""; display: table; } .storedetail .store .images ul:after { clear: both; } .storedetail .store .address, .storedetail .store .opening-hours, .storedetail .store .directions { margin-bottom: 25px; } @media (min-width: 769px) { .storelocator ul.store-locator { padding: 0; width: 35%; float: left; } .storelocator .store-map-holder { width: 60%; float: right; padding-top: 45%; } .storelocator #store-map { margin-top: 0px; } .storedetail .store .store-map-holder { width: 100%; margin-bottom: 25px; min-height: 320px; } .storedetail .store .images { border-top-width: 1px; } .storedetail .store .address { width: 40%; padding-right: 30px; } .storedetail .store .opening-hours { border: none; width: 40%; padding-right: 30px; } .storedetail .store .directions { margin-top: 25px; order: 4; } } @media (min-width: 1150px) { .storelocator .store-map-holder { padding-top: 40%; } .storedetail .store { justify-content: flex-start; } .storedetail .store .address { width: 26%; } .storedetail .store .opening-hours { width: 26%; } .storedetail .store .directions { width: 48%; } .storedetail .store .directions > div { float: right; } } @media (min-width: 1150px) { .storedetail .store .store-map-holder { min-height: 460px; } } /* ========= STORE LOCATOR COMPONENT END ========= */ /* ========= BLOG COMPONENT ========= */ .blogpage #main .entry a { color: aqua; } .blogpage #main .blog-sidebar { display: none; } .blogpage #main .blog-sidebar.blog-menu { display: block; width: 100%; margin-bottom: 10px; padding: 25px 15px 5px 0; float: none; } .blogpage #main .blog-menu ul { display: none; } .blogpage #main .blog-sidebar.blog-menu > h3 { background: url("/Assets/sprite.png") 100% -101px no-repeat; background-size: 30px; padding-left: 35px; margin-top: 0; padding: 3px 35px 0 0; font-size: 16px; cursor: pointer; text-align: right; } .blogpage #main .blog-sidebar.blog-menu > ul { padding: 20px; } .blogpage #main .post-link a { margin: 10px 0; display: inline-block; width: auto; } .blogpage #main .blog-content .blogger-name, .blogpage #main .blogpage #main .feat-post .blogger-name { color: #111; text-decoration: underline; } @media (min-width: 768px) { .blogpage #main .blog-sidebar.blog-menu.active { height: 97%; z-index: 2; background: rgba(247, 247, 247, 0.7); } .blogpage #main .blog-sidebar.blog-menu { width: 100%; position: absolute; top: 20px; right: 0; padding: 0 15px; transition: background-color 0.5s ease; margin-bottom: 0; } .blogpage #main .blog-sidebar.blog-menu > h3 { position: relative; z-index: 100000; } .blogpage #main .blog-sidebar.blog-menu .sidebar-section h3 { border-top: 0; } .blogpage #main .blog-sidebar.blog-menu > ul { background: #FFFFFF; position: relative; z-index: 9999; -webkit-box-shadow: 0px 0px 33px -6px #5e5e5e; -moz-box-shadow: 0px 0px 33px -6px #5e5e5e; box-shadow: 0px 0px 33px -6px #5e5e5e; float: right; width: 40%; border: 1px solid #F7F7F7; } } .blogpage #main .main-container { padding: 0; } .blogpage #main .page-container > h1:first-of-type { padding: 20px 0px 0 20px; padding: 20px; text-align: left; margin: 0; position: absolute; top: 0px; } .blogpage #main #page-content { width: 100%; } .blogpage #main article.blog-post { padding: 0 15px 15px; border-top: 1px solid #E2E2E2; } .blogpage #main article.blog-post .post-navigation { display: flex; justify-content: space-between; } .blogpage #main article.blog-post .post-navigation .next { margin-top: 0; padding-left: 10px; } .blogpage #main article.blog-post .post-navigation .previous { padding-right: 10px; } .blogpage #main #left-nav { display: none; } .blogpage #main .blog-header { margin-bottom: 20px; position: relative; z-index: 0; float: left; } .blogpage #main span.security-code { display: block; } .blogpage #main .blog-content h1 { border-top-width: 1px; border-color: #a0a0a0; padding: 20px; margin-bottom: 0; text-align: left; } .blogpage #main span.tag-links a { color: #0f82a9; } .blogpage #main .profile { border-top: 1px solid #E2E2E2; } .blogpage #main .sidebar-section.blog-recent ul li > a { color: #444545; } .blogpage #main .blog-sidebar { float: right; margin-bottom: 20px; padding: 20px 20px 0 0; } .blogpage #main .blog-sidebar ul { margin-bottom: 15px; } .blogpage #main .blog-sidebar ul li { margin-top: 15px; } .blogpage #main .blog-sidebar ul li:before { content: ""; display: table; } .blogpage #main .blog-sidebar ul li:after { content: ""; display: table; clear: both; } .blogpage #main .blog-sidebar ul li a, .blogpage #main .blog-sidebar ul li span { margin-right: 3px; color: #111; font-size: 16px; } .blogpage #main .blog-sidebar ul li .post-date, .blogpage #main .blog-sidebar ul li .post-author { font-size: 12px; } .blogpage #main .blog-sidebar ul li a.post-author { margin-bottom: 10px; text-decoration: underline; } .blogpage #main .blog-sidebar ul li a.post-author:before { content: "By "; } .blogpage #main .blog-sidebar ul li a.post-name { display: block; color: #111; } .blogpage #main .blog-sidebar ul li a.post-name:hover { text-decoration: underline; } .blogpage #main .blog-sidebar .sidebar-section:before, .blogpage #main .blog-sidebar .sidebar-section:after { content: ""; display: table; } .blogpage #main .blog-sidebar .sidebar-section:after { clear: both; } .blogpage #main .blog-sidebar .blog-aside { display: none; } .blogpage #main .blog-sidebar .blog-archive .more-set > li > ul, .blogpage #main .blog-sidebar .blog-tags .more-set > li > ul { display: none; } .blogpage #main .blog-sidebar .blog-subscribe { padding: 30px; background: #e7f2d9; } .blogpage #main .blog-sidebar .blog-subscribe h3 { border: none; padding: 0 0 10px 0 !important; } .blogpage #main .blog-sidebar .sidebar-section { position: relative; } .blogpage #main .blog-sidebar .sidebar-section h3 { cursor: pointer; margin: 0; padding: 20px 0 0; border-top-width: 1px; font-size: 26px; } .blogpage #main .blog-sidebar .sidebar-section h4 { margin: 0; padding: 5px 0; } .blogpage #main .blog-sidebar .blogger-profile .blogger-link { display: none; } .blogpage #main .blog-sidebar .blogger-profile figure { float: left; } .blogpage #main .blog-sidebar .blogger-profile figure img { width: 50px; border-radius: 40px; } .blogpage #main .blog-sidebar .blogger-profile h4 { float: right; width: 75%; font-weight: normal; font-size: 14px; margin-top: 10px; } .blogpage #main .feat-post { padding: 0 20px; } .blogpage #main .feat-post .post-link a { margin: 10px 0; } .blogpage #main .featured-post { font-size: 20px; } .blogpage #main .blog-content .blog-list-item { background: #f1f2f2; position: relative; padding: 20px; } .blogpage #main .blog-content, .blogpage #main .feat-post { width: 100%; float: left; } .blogpage #main .blog-content h2, .blogpage #main .feat-post h2 { font-size: 26px; margin: 15px 0; font-weight: 300; } .blogpage #main .blog-content h2 a, .blogpage #main .feat-post h2 a { color: #111; } .blogpage #main .blog-content .entry p img, .blogpage #main .feat-post .entry p img { width: 100%; } .blogpage #main .blog-content .blogger-name, .blogpage #main .feat-post .blogger-name { margin-left: 5px; } .blogpage #main .blog-content .blogger-name a, .blogpage #main .feat-post .blogger-name a { color: #111; } .blogpage #main .blog-content figure img, .blogpage #main .feat-post figure img { display: none; } .blogpage #main .blog-content .meta-data p, .blogpage #main .feat-post .meta-data p { margin-right: 10px; } .blogpage #main .blog-content .meta-data a, .blogpage #main .blog-content .meta-data span, .blogpage #main .feat-post .meta-data a, .blogpage #main .feat-post .meta-data span { margin-right: 5px; } .blogpage #main .blog-content .post-date, .blogpage #main .blog-content .post-author, .blogpage #main .feat-post .post-date, .blogpage #main .feat-post .post-author { display: inline-block; margin-right: 10px; } .blogpage #main .blog-content .blog-list-item, .blogpage #main .feat-post .blog-list-item { margin: 0 0 20px 0; float: left; .post-author: after; .post-author-clear: both; } .blogpage #main .blog-content .blog-list-item h2 a, .blogpage #main .feat-post .blog-list-item h2 a { color: #111; } .blogpage #main .blog-content .blog-list-item .post-author:before, .blogpage #main .blog-content .blog-list-item .post-author:after, .blogpage #main .feat-post .blog-list-item .post-author:before, .blogpage #main .feat-post .blog-list-item .post-author:after { content: ""; display: table; } .blogpage #main .blog-content .blog-list-item:first-child, .blogpage #main .feat-post .blog-list-item:first-child { border-top-width: 1px; margin-top: 20px; padding-top: 10px; } .blogpage #main .blog-content .post-navigation, .blogpage #main .feat-post .post-navigation { text-align: left; padding: 10px 0; } .blogpage #main .blog-content .post-navigation > div, .blogpage #main .feat-post .post-navigation > div { display: inline-block; width: 100%; } .blogpage #main .blog-content .post-navigation span, .blogpage #main .feat-post .post-navigation span { font-size: 16px; } .blogpage #main .blog-content .post-navigation span:first-of-type, .blogpage #main .feat-post .post-navigation span:first-of-type { display: inline-block; margin-right: 6px; } .blogpage #main .blog-content .post-navigation span:last-of-type, .blogpage #main .feat-post .post-navigation span:last-of-type { display: none; } .blogpage #main .blog-content .post-navigation .previous a, .blogpage #main .blog-content .post-navigation .next a, .blogpage #main .feat-post .post-navigation .previous a, .blogpage #main .feat-post .post-navigation .next a { color: #359fb2; } .blogpage #main .blog-content .post-navigation .next, .blogpage #main .feat-post .post-navigation .next { margin-top: 10px; text-align: right; } .blogpage #main .blog-content .blog-comments, .blogpage #main .blog-content .blog-reply, .blogpage #main .feat-post .blog-comments, .blogpage #main .feat-post .blog-reply { padding: 0 20px; } .blogpage #main .blog-content .blog-comments .reply-link, .blogpage #main .feat-post .blog-comments .reply-link { margin-top: 20px; } .blogpage #main .blog-content .blog-comments .reply-link a, .blogpage #main .feat-post .blog-comments .reply-link a { background: #05703b; padding-left: 20px; padding-right: 20px; color: white; text-decoration: none; font-weight: normal; } .blogpage #main .blog-content .blog-reply, .blogpage #main .feat-post .blog-reply { margin-bottom: 50px; } .blogpage #main .blog-content .blog-reply h3, .blogpage #main .feat-post .blog-reply h3 { font-size: 20px; } .blogpage #main .blog-content .blog-reply button, .blogpage #main .feat-post .blog-reply button { float: left; } .blogpage #main .blog-content .blog-reply li.notify label, .blogpage #main .blog-content .blog-reply li.updates label, .blogpage #main .feat-post .blog-reply li.notify label, .blogpage #main .feat-post .blog-reply li.updates label { vertical-align: sub; font-size: 12px; font-weight: normal; } .blogpage #main .blog-content .blog-reply form .security-code input, .blogpage #main .feat-post .blog-reply form .security-code input { width: 100%; } .blogpage #main .blog-content .blog-reply:before, .blogpage #main .blog-content .blog-reply:after, .blogpage #main .feat-post .blog-reply:before, .blogpage #main .feat-post .blog-reply:after { content: ""; display: table; } .blogpage #main .blog-content .blog-reply:after, .blogpage #main .feat-post .blog-reply:after { clear: both; } .blogpage #main .blog-content input[type=checkbox], .blogpage #main .feat-post input[type=checkbox] { margin-top: 0; vertical-align: middle; } .blogpage #main .blog-content .reply-link, .blogpage #main .feat-post .reply-link { text-align: right; } .blogpage #main .subscriptions-table { width: 100%; margin-bottom: 20px; } .blogpage #main .subscriptions-table thead { display: none; } .blogpage #main .subscriptions-table tr { border-bottom-width: 1px; margin: 0; padding: 10px 0 15px; position: relative; display: block; } .blogpage #main .subscriptions-table td { padding: 5px 0; display: block; } .blogpage #main .subscriptions-table td.subscription { font-weight: bold; } .blogpage #main .subscriptions-table td.actions { position: absolute; top: 10px; right: 0; } .blogpage #main .subscriptions-table select { width: 100%; } .blogpage #main button.btn.subscribe { margin-bottom: 10px; width: 100%; } .blogpage #main .blog-comment { display: block; margin: 20px 0; background-color: #f1f2f2; padding: 15px; position: relative; } .blogpage #main .blog-comment:before, .blogpage #main .blog-comment:after { content: ""; display: table; } .blogpage #main .blog-comment:after { clear: both; } .blogpage #main .blog-comment .blog-comment { padding: 0; } .blogpage #main .blog-comment .blog-reply { display: none; } .blogpage #main .blog-comment .author { text-transform: uppercase; display: inline-block; margin-right: 5px; font-size: 18px; } .blogpage #main .blog-comment .comment-date { display: inline-block; color: #a6a5a5; margin-left: 10px; } .blogpage #main .blog-comment .comment-body { clear: both; margin-bottom: 15px; } .blogpage #main .profile h1 { padding: 15px 0 8px; font-size: 28px; } .blogpage #main .profile .blogger-description { margin-top: 0; width: 100%; margin: 20px 0; } .blogpage #main .profile .blogger-profile { background: #f1f2f2; margin: 15px; padding: 20px; } .blogpage #main .profile .blogger-profile:before, .blogpage #main .profile .blogger-profile:after { content: ""; display: table; } .blogpage #main .profile .blogger-profile:after { clear: both; } .blogpage #main .profile .blogger-profile h2 { margin-top: 0; width: 100%; text-align: center; } .blogpage #main .profile .blogger-profile h3 { font-size: 18px; margin-top: 0; } .blogpage #main .profile .blogger-profile figure { width: 100%; text-align: center; } .blogpage #main .profile .blogger-profile figure img { width: 70%; border-radius: 210px; } .blogpage #main .profile .blogger-profile .blog-recent { margin-top: 0; } .blogpage #main .profile .blogger-profile .blog-recent ul { margin: 0 0 10px 0; } .blogpage #main .profile .blogger-profile .blog-recent li { padding-bottom: 5px; } .blogpage #main .profile .blogger-profile .blog-recent li:before, .blogpage #main .profile .blogger-profile .blog-recent li:after { content: ""; display: table; } .blogpage #main .profile .blogger-profile .blog-recent li:after { clear: both; } .blogpage #main .profile .blogger-profile .blog-recent a { color: #359fb2; display: block; margin-top: 10px; } .blogpage #main .profile .blogger-profile .blog-recent a, .blogpage #main .profile .blogger-profile .blog-recent span { padding: 0px 5px 0 0px; } .blogpage .blog-content textarea { outline: none; } @media (min-width: 500px) { .blogpage #main .profile .blogger-profile h2, .blogpage #main .profile .blogger-description, .blogpage #main .profile .blog-recent { margin-top: 0; float: right; width: 65%; } .blogpage #main .profile .blogger-profile h2 { text-align: left; } .blogpage #main .profile .blogger-profile figure { float: left; max-width: 210px; width: 30%; } .blogpage #main .profile .blogger-profile figure img { width: 100%; border-radius: 210px; max-width: 210px; } } /*** IPAD + DESKTOP ***/ @media (min-width: 768px) { .blogpage #main .main-container { padding: 10px 15px; } .blogpage #main .blog-sidebar ul.collapse { display: block !important; } .blogpage #main .blog-sidebar .sidebar-section h3 .eso-accordion-indicator { background: none; } .blogpage #main .blogger-description, .blogpage #main .profile .blogger-profile .blog-recent a { font-size: 16px; } .blogpage #main .blog-content h2, .blogpage #main .feat-post h2 { font-size: 26px; margin: 0 0 10px; } .blogpage #main .blog-content .post-navigation span, .blogpage #main .feat-post .post-navigation span { margin: 0; } .blogpage #main .blog-content .post-navigation .previous a, .blogpage #main .blog-content .post-navigation .next a, .blogpage #main .feat-post .post-navigation .previous a, .blogpage #main .feat-post .post-navigation .next a { font-size: 16px; } .blogpage #main .blog-content .blog-list-item { padding: 0; background: #f1f2f2; position: relative; margin-bottom: 50px; width: 100%; } .blogpage #main .blog-content .blog-list-item .post-link a { margin: 20px; } .blogpage #main .blog-content .blog-list-item .entry { overflow: hidden; min-height: 300px; } .blogpage #main .blog-content .blog-list-item .entry p { margin-bottom: 0; } .blogpage #main .blog-content .blog-list-item .entry p img { height: 300px; width: auto; margin-left: 50%; transform: translate(-50%); } .blogpage #main .blog-content .blog-list-item:nth-child(even) .blog-wrap { width: 40%; float: left; padding: 20px 0 0 20px; } .blogpage #main .blog-content .blog-list-item:nth-child(even) .entry { width: 57%; float: right; padding-left: 3%; } .blogpage #main .blog-content .blog-list-item:nth-child(odd) .blog-wrap { width: 40%; float: right; padding: 20px 20px 0 0; } .blogpage #main .blog-content .blog-list-item:nth-child(odd) .entry { width: 57%; float: left; padding-right: 3%; } .blogpage #main .blog-content h1 { margin: 10px 0 20px 0; padding: 10px 0; border: 0; } .blogpage #main .blog-content .post-navigation:before, .blogpage #main .blog-content .post-navigation:after { content: ""; display: table; } .blogpage #main .blog-content .post-navigation:after { clear: both; } .blogpage #main .blog-content .post-navigation .next { float: right; } .blogpage #main .blog-content .blog-comments, .blogpage #main .blog-content .blog-reply { padding: 0; } .blogpage #main .blog-content .blog-reply form .security-code input { width: 30%; } .blogpage #main .page-container > h1:first-of-type { padding: 0; text-align: left; left: 0; margin-bottom: 20px; position: relative; top: auto; width: 80%; z-index: 2; } .blogpage #main .feat-post { position: absolute; top: 20px; right: 20px; background-color: rgba(255, 255, 255, 0.9); width: 48%; padding: 15px; } .blogpage #main article.blog-post, .blogpage #main .profile { margin-top: 20px; padding: 0; border-top: 0; } .blogpage #main .meta-data { float: left; width: 85%; } .blogpage #main .blog-sidebar { width: 25%; float: right; } .blogpage #main .blog-sidebar .collapse.in { display: block; } .blogpage #main .blog-sidebar .blog-subscribe { padding: 15px; border-radius: 4px; margin-top: 20px; } .blogpage #main .blog-sidebar .blog-subscribe h3 { border: 0; padding-top: 0; } .blogpage #main .blog-sidebar .blog-subscribe label { display: block; width: 100%; } .blogpage #main .blog-sidebar .blog-subscribe input, .blogpage #main .blog-sidebar .blog-subscribe button { width: 100%; min-width: 100%; } .blogpage #main .blog-comment button { float: right; } .blogpage #main .blog-content .blog-reply li.notify label, .blogpage #main .blog-content .blog-reply li.updates label { font-size: 14px; color: #000; } .blogpage #main .profile .blogpage .profile .blogger-profile .blogger-description:empty { display: none; } .blogpage #main .profile .blogger-profile { margin-left: 0; margin-right: 0; } .blogpage #main .profile .blogger-profile figure { float: left; max-width: 210px; } .blogpage #main .subscriptions-table thead { display: table-header-group; background: #F5F6F6; } .blogpage #main .subscriptions-table thead th { padding: 5px 10px; } .blogpage #main .subscriptions-table tbody td { border-bottom-width: 1px; } .blogpage #main .subscriptions-table tr { display: table-row; padding: 0; border: 0; } .blogpage #main .subscriptions-table td { padding: 10px; width: 25%; display: table-cell; } .blogpage #main .subscriptions-table td.subscription { font-weight: normal; } .blogpage #main .subscriptions-table td.actions { text-align: right; width: 10%; position: relative; top: 0; } .blogpage #main .subscriptions-table select { width: 100%; } } @media (min-width: 992px) { .blogpage #main .profile { width: 70%; float: left; } .blogpage #main .page-container > h1:first-of-type { margin-bottom: 10px; } .blogpage #main .blog-sidebar { display: inline-block; } .blogpage #main .blog-sidebar.blog-menu { display: none; } .blogpage #main .blog-header { width: 100%; } .blogpage #main .blog-header > p { height: 370px; overflow: hidden; } .blogpage #main .feat-post { top: 30px; right: 30px; width: 35%; height: auto; } .blogpage #main .blog-content, .blogpage #main .blog.subscriptions { width: 70%; float: left; padding-right: 30px; background: #FFFFFF; } .blogpage #main .page-container fieldset ol li.comment, .blogpage #main .page-container fieldset ol li.security-message { width: 100%; } .blogpage #main .blog-content .blog-reply form .security-code input { width: 100%; } } /*** DESKTOP ***/ @media (min-width: 1150px) { .blogpage #main .main-container { padding: 0; } .blogpage #main .blog-reply li.notify, .blogpage #main .blogpage #main li.updates { width: 48%; display: inline-block; } .blogpage #main .blog-reply li.notify label, .blogpage #main .blogpage #main li.updates label { width: 90%; margin: 0; } } .competition .progress{display: none;} .competition .promo img {width: 100%;} @media (min-width: 768px) { .competition h1{margin-top: -60px;} } /* ========= CAREERS COMPONENT ========= */ .career .customer-info #uploadCV { border: none; padding: 10px 0; box-shadow: none; } .career .career-item { border-bottom-width: 1px; padding-bottom: 25px; margin-bottom: 15px; } .career .career-item .btn { margin: 15px 0; } .career .career-item:first-of-type { border-top-width: 1px; } .career .list-date .open { margin-right: 20px; } .career .list-date .open:before { content: "date opened: "; } .career .list-date .closing:before { content: "date closing: "; } .career .list-date .open:before, .career .list-date .closing:before, .career .list-status { font-weight: bold; } .career .list-status { text-transform: uppercase; } .career .list-date, .career .list-status { margin-bottom: 15px; } .career .list-description { clear: both; } .career .cv textarea { height: 100px; } @media (min-width: 769px) { .career .list-date { float: right; } .career .cv textarea { height: 200px; } .career .security-code + security-code { margin-left: 29%; } .career .next-previous button { float: right; } } @media (min-width: 1150px) { .career form .telephone input[type="tel"] { width: 100%; } } /* ========= CAREERS COMPONENT END ========= */