﻿/* CSS RESET */

* {
	margin: 0;
	outline: none;
	padding: 0;
	text-decoration: none;
	box-sizing: border-box;
}
*:before,
*:after {
	box-sizing: border-box;
}
html {
	margin: 0 !important;
	-webkit-text-size-adjust: none;
}
ol,
ul {
	list-style: none;
}
a img {
	border: none;
}
a:active {
	outline: none;
}
button::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
	margin: 0;
	border: 0;
	padding: 0;
}
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
textarea,
button {
	border-radius: 0;
}
input[type="button"],
input[type="submit"],
input[type="reset"] {
	-webkit-appearance: none;
}
input::-moz-placeholder {
	opacity: 1;
}
input:-webkit-autofill {
	-webkit-box-shadow: inset 0 0 0 1000px #fff;
}
script {
	display: none !important;
}

/* GLOBAL STYLES */

body {
	max-width: 100%;
	background: #fff;
	overflow-x: hidden; /* responsive navigation & filters scroll bug fix*/
	font-style: normal;
	color: #888;
}
body.air-theme {
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	font-weight: 400;
}
body.earth-theme {
	font-family: "Oswald", sans-serif;
	font-size: 16px;
	font-weight: 300;
}

a {
	color: inherit;
	cursor: pointer;
}
img {
	max-width: 100%;
}
a img {
	opacity: 0.99; /*firefox scale bug fix*/
}
table {
	width: 100%;
	border-collapse: collapse;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
textarea,
select {
	height: 40px;
	border: 1px solid #eee;
	background-color: #fff;
	padding: 10px;
	vertical-align: middle;
	color: #888;
}
.air-theme input[type="text"],
.air-theme input[type="password"],
.air-theme input[type="email"],
.air-theme input[type="tel"],
.air-theme textarea,
.air-theme select {
	font-size: 12px;
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
}
.earth-theme input[type="text"],
.earth-theme input[type="password"],
.earth-theme input[type="email"],
.earth-theme input[type="tel"],
.earth-theme textarea,
.earth-theme select {
	font-size: 14px;
	font-family: "Oswald", sans-serif;
	font-weight: 300;
}
textarea {
	min-height: 150px;
	white-space: normal;
}
select {
	min-width: 50px;
	background-color: #fff;
	padding: 0 25px 0 10px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
select::-ms-expand {
	display: none;
}
input[type="checkbox"],
input[type="radio"],
input[type="checkbox"] + *,
input[type="radio"] + * {
	vertical-align: middle;
}
input[type="submit"],
input[type="button"],
button {
	border: none;
	cursor: pointer;
}
.air-theme button,
.air-theme .button-1,
.air-theme .button-2 {
	font-family: "Montserrat", sans-serif;
}
.earth-theme button,
.earth-theme .button-1,
.earth-theme .button-2 {
	font-family: "Oswald", sans-serif;
}
label,
label + * {
	vertical-align: middle;
}

.master-wrapper-content {
	position: relative;
	z-index: 0; /* giving priority to header and header-menu */
}
.master-column-wrapper {
	width: 94%;
	margin: auto;
}
.master-column-wrapper:after {
	content: "";
	display: block;
	clear: both;
}
.home-page-body .master-column-wrapper {
	width: 100%;
}
.center-1 {
	margin: 0 0 60px;
}
.center-2,
.side-2 {
	margin: 0 0 60px;
}
/* Wrapper (from _ColumnsTwo.cshtml) around the page title, category
   description + its read-more button and the subcategory / featured blocks.
   .center-2 and .side-2 are floated against each other at >=1025px; floating
   this header too makes it a sibling block of the same formatting context, so
   both columns start on a common line under it instead of being offset by the
   unfloated content above them. */
.catalog-page-header {
	float: left;
	width: 100%;
}

.page {
	min-height: 200px;
	text-align: center;
}
.page-title,
.home-page .title,
.product-grid .title,
.home-page .topic-block-title {
	margin: 50px 0 60px;
	text-align: center;
}
.product-grid + .product-grid .title {
	margin-top: 0;
}
.page-title h1,
.home-page .title strong,
.product-grid .title,
.home-page .topic-block-title h2,
.product-filter-level-values-box .title {
	display: block; /*prevents a bug with absolute pseudo elements inside the <strong>*/
	position: relative;
	color: #333;
	text-transform: uppercase;
}
.air-theme .page-title h1,
.air-theme .home-page .title strong,
.air-theme .product-grid .title strong,
.air-theme .home-page .topic-block-title h2,
.air-theme .product-filter-level-values-box .title {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 2px;
}
.earth-theme .page-title h1,
.earth-theme .home-page .title strong,
.earth-theme .product-grid .title strong,
.earth-theme .home-page .topic-block-title h2,
.earth-theme .product-filter-level-values-box .title {
	font-size: 24px;
	font-weight: 400;
}
.page-title h1:after,
.home-page .title strong:after,
.product-grid .title:after,
.home-page .topic-block-title h2:after,
.product-filter-level-values-box .title:after {
	content: "";
	position: absolute;
	bottom: -18px;
	left: 50%;
	width: 80px;
	height: 4px;
	margin: 0 0 0 -40px;
}
.air-theme .page-title h1:after,
.air-theme .home-page .title strong:after,
.air-theme .product-grid .title strong:after,
.air-theme .home-page .topic-block-title h2:after,
.air-theme .product-filter-level-values-box .title:after {
	background-color: #eda187;
}
.earth-theme .page-title h1:after,
.earth-theme .home-page .title strong:after,
.earth-theme .product-grid .title strong:after,
.earth-theme .home-page .topic-block-title h2:after,
.earth-theme .product-filter-level-values-box .title:after {
	background-color: #007c5a;
}
.page:after,
.page-title:after,
.page-body:after {
	content: "";
	display: block;
	clear: both;
}
.buttons {
	text-align: center;
}
.required {
	font-size: 14px;
	color: #ee2e56;
}
.link-rss {
	display: none;
	font-size: 0 !important;
}
.category-description ul,
.manufacturer-description ul,
.full-description ul,
.topic-html-content ul,
.topic-page ul,
.post-body ul,
.custom-tab ul {
	margin: 12px 0;
	padding: 0 0 0 36px;
	list-style: disc;
}
.category-description ol,
.manufacturer-description ol,
.full-description ol,
.topic-html-content ol,
.topic-page ol,
.post-body ol,
.custom-tab ol {
	margin: 12px 0;
	padding: 0 0 0 36px;
	list-style: decimal;
}
.category-description p,
.manufacturer-description p,
.vendor-description p,
.full-description p,
.topic-html-content p,
.topic-page p,
.post-body p,
.news-body p,
.custom-tab p {
	margin: 10px 0;
	word-wrap: break-word;
}

.category-description {
	overflow: hidden;
}
.button-readmore {
	display: inline-block;
	margin-top: 10px;
	padding: 0 25px;
	height: 40px;
	line-height: 40px;
	text-transform: uppercase;
	color: #fff;
	transition: opacity 0.2s ease;
}
.button-readmore:hover {
	opacity: 0.9;
}
.air-theme .button-readmore {
	background-color: #00a651;
	font-size: 12px;
}
.earth-theme .button-readmore {
	background-color: #007c5a;
	font-size: 13px;
	font-weight: 400;
}
.category-description + .button-readmore {
	margin-top: -30px;
	margin-bottom: 15px;
}

.master-loading-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	background: #fff url("../img/loading.gif") center no-repeat;
	opacity: 0.95;
}

.overlayOffCanvas {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 1030;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	transition: background-color 0.5s ease;
}
.scrollYRemove {
	overflow: hidden !important;
	-ms-touch-action: none !important;
	-webkit-overflow-scrolling: touch !important;
}
.ps-container > .ps-scrollbar-y-rail {
	visibility: hidden !important;
}

/* Product gallery thumbnail column: 1024.css / 1320.css cap it with
   `max-height` + `overflow-y: auto`, so a product with several images gets a
   native scrollbar next to the thumbs. It should still scroll (wheel, drag,
   keyboard) - only the scrollbar itself is hidden. Declared here rather than
   in the breakpoint files because it is the same in both and collides with
   nothing; note styles.css is the LOWEST-precedence sheet of the six (see
   the load-order note further down), which is fine as no other rule sets
   these properties. */
.gallery .picture-thumbs {
	scrollbar-width: none; /*Firefox*/
	-ms-overflow-style: none; /*legacy Edge/IE*/
}
.gallery .picture-thumbs::-webkit-scrollbar {
	width: 0;
	height: 0;
}

/* Vertical slider controls for that column. The wrapper and the two buttons
   are injected by buildGalleryThumbsSlider() in element.js, and only when the
   column really overflows vertically - so the mobile horizontal strip never
   gets them. */
.gallery .picture-thumbs-slider {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: stretch;
}
/* Load-bearing: 1024.css/1320.css give .picture-thumbs `flex: 0 0 92px`
   (98px at >=1321px). Its flex parent is `.picture-gallery`, which is
   `flex-direction: row-reverse`, so that basis resolves to a WIDTH. Inside
   this COLUMN wrapper the very same declaration would instead be read as a
   HEIGHT and crush the column to 92px. Reset the basis here and let
   max-height do the capping; the explicit `width` on .picture-thumbs still
   sizes the wrapper, which the buttons then stretch to. (0,3,0) beats the
   (0,2,0) originals, so this wins despite styles.css having the lowest
   precedence of the six sheets. */
.gallery .picture-thumbs-slider .picture-thumbs {
	flex: 0 1 auto;
	min-height: 0;
}
.picture-thumbs-nav {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	height: 26px;
	border: 1px solid #ececec;
	border-radius: 6px;
	background-color: #fff;
	padding: 0;
	color: #666;
	cursor: pointer;
	transition:
		background-color 0.15s ease,
		color 0.15s ease;
}
.picture-thumbs-nav.up {
	margin: 0 0 8px;
}
.picture-thumbs-nav.down {
	margin: 8px 0 0;
}
.picture-thumbs-nav:hover:not([disabled]) {
	background-color: #f6f6f6;
	color: var(--el-accent, #00a651);
}
.picture-thumbs-nav[disabled] {
	opacity: 0.35;
	cursor: default;
}
.picture-thumbs-nav:before {
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 12px;
	line-height: 1;
}
.picture-thumbs-nav.up:before {
	content: "\f077"; /*chevron-up*/
}
.picture-thumbs-nav.down:before {
	content: "\f078"; /*chevron-down*/
}

/* GLOBAL FORMS */

.fieldset,
.section {
	position: relative;
	margin: 0 0 40px;
}
.fieldset .title,
.section .title {
	margin: 0 0 15px;
	color: #555;
	text-transform: uppercase;
}
.fieldset .title strong,
.section .title strong {
	font-weight: 400;
}
.form-fields {
	position: relative;
}
.inputs {
	position: relative;
	width: 440px;
	max-width: 100%;
	margin: 0 auto 15px;
	text-align: center;
	white-space: nowrap; /*fix for 'required' elements*/
	font-size: 0;
}
.inputs:after {
	content: "";
	display: block;
	clear: both;
}
.inputs label {
	display: block;
	width: 100%;
	margin: 0 0 5px;
	text-align: center;
}
.air-theme .inputs label {
	font-size: 12px;
}
.earth-theme .inputs label {
	font-size: 15px;
}
.inputs input[type="text"],
.inputs input[type="password"],
.inputs input[type="email"],
.inputs input[type="tel"],
.inputs select,
.inputs textarea {
	width: 100%;
	vertical-align: middle;
}
.inputs input[type="text"]:focus,
.inputs input[type="password"]:focus,
.inputs input[type="email"]:focus,
.inputs input[type="tel"]:focus,
.inputs select:focus,
.inputs textarea:focus {
	border-color: #ddd;
}
.inputs textarea {
	min-height: 200px;
}
.inputs.reversed {
	margin-bottom: 25px;
}
.inputs .required {
	margin: 0 0 0 -8px;
	border-width: 0 8px 8px 0;
	border-style: dashed solid dashed;
	vertical-align: top;
	font-size: 0;
}
.air-theme .inputs .required {
	border-color: transparent #eda187 transparent;
}
.earth-theme .inputs .required {
	border-color: transparent #007c5a transparent;
}
.air-theme .message-error,
.air-theme .field-validation-error,
.air-theme .username-not-available-status,
.air-theme .poll-vote-error,
.password-error,
.air-theme .field-validation-valid,
.air-theme .username-available-status {
	display: block;
	font-size: 11px;
}
.earth-theme .message-error,
.earth-theme .field-validation-error,
.earth-theme .username-not-available-status,
.earth-theme .poll-vote-error,
.password-error,
.earth-theme .field-validation-valid,
.earth-theme .username-available-status {
	display: block;
	font-size: 13px;
	font-weight: 400;
}
.message-error,
.field-validation-error,
.username-not-available-status,
.poll-vote-error,
.password-error {
	color: #ee2e56;
}
.field-validation-valid,
.username-available-status,
.new-comment .result {
	color: #11a871;
}
.captcha-box {
	display: flex;
	justify-content: center;
	clear: both;
	margin: 30px 0 0;
}
.captcha-box iframe {
	margin: 0;
}
.captcha-box input {
	height: auto;
}
.fieldset + .buttons .button-1 {
	min-width: 150px;
	height: 50px;
	padding: 0 30px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .fieldset + .buttons .button-1 {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .fieldset + .buttons .button-1 {
	background-color: #007c5a;
	font-size: 15px;
	line-height: 51px; /*firefox line-height bug fix*/
}
.fieldset + .buttons .button-1:hover {
	opacity: 0.9;
}

/* GLOBAL TABLES */

.cart,
.data-table,
.forums-table-section table {
	border-bottom: 1px solid #eee;
}
.cart th,
.data-table th,
.forums-table-section th {
	border-bottom: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 15px;
	white-space: nowrap;
}
.air-theme .cart th,
.air-theme .data-table th,
.air-theme .forums-table-section th {
	font-size: 13px;
	font-weight: 400;
	color: #aaa;
}
.earth-theme .cart th,
.earth-theme .data-table th,
.earth-theme .forums-table-section th {
	font-size: 16px;
	font-weight: 300;
}
.cart td,
.data-table td,
.forums-table-section td {
	min-width: 50px;
	border: none;
	background-color: #fff;
	padding: 15px;
}

.cart .product,
.data-table .product,
.data-table .message,
.data-table .info,
.data-table .name,
.forum-table .forum-details,
.forum-table .topic-details {
	text-align: left;
}
.cart .remove-from-cart,
.cart .add-to-cart,
.data-table .select-boxes,
.data-table .order {
	text-align: center;
}

.cart .remove-from-cart {
	position: relative;
}
.cart .remove-from-cart button {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 22px;
	height: 22px;
	min-width: 0;
	margin: auto;
	border-radius: 50%;
	background-color: #ccc;
	padding: 0 !important;
	transition: all 0.2s ease;
}
.cart .remove-from-cart button:before {
	display: none;
}
.cart .remove-from-cart button:hover {
	background-color: #aaa;
}
.cart .product-picture,
.data-table .picture {
	text-align: center;
	font-size: 0;
}
.cart .product-picture a,
.data-table .picture a {
	display: inline-block;
}
.cart .product-picture img,
.data-table .picture img {
	min-width: 60px;
	max-width: 60px;
}
.cart .product-name {
	font-weight: 400;
	color: #555;
	text-transform: uppercase;
}
.cart .attributes,
.data-table .attributes {
	margin: 10px 0 !important;
	border: none;
	background-color: transparent;
	padding: 0;
}
.cart .edit-item a {
	font-weight: 400;
	color: #f74258;
}
.cart .edit-item a:hover {
	text-decoration: underline;
}
.cart .message-error {
	margin: 0 !important;
	text-align: left !important;
}
.cart td.unit-price {
	font-weight: 400;
	white-space: nowrap;
}

.cart .quantity {
	text-align: center;
	white-space: nowrap;
}
.cart .increase,
.cart .decrease {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #bbb;
	vertical-align: middle;
	font-size: 0;
	cursor: pointer;
}
.cart .increase {
	background-position: left center;
}
.cart .decrease {
	background-position: right center;
}
.cart .qty-input {
	width: 50px;
	height: 40px;
	margin: 0 8px;
	text-align: center;
	font-size: 14px !important;
	font-weight: 400;
	color: #333;
}
.cart .qty-dropdown {
	width: 60px;
	font-size: 14px !important;
	color: #333;
}

.cart td.subtotal {
	font-weight: 400;
	white-space: nowrap;
}
.air-theme .cart td.subtotal {
	color: #eda187;
}
.earth-theme .cart td.subtotal {
	color: #007c5a;
}
.cart .subtotal .discount span {
	display: block;
}
.cart .discount-additional-info {
	margin: 5px 0 0;
	white-space: normal;
	color: #888;
}
.air-theme .discount-additional-info {
	font-size: 12px;
}
.earth-theme .discount-additional-info {
	font-size: 14px;
	font-weight: 300;
}

/* RESPONSIVE TABLES */

.footable-first-column {
	text-align: center;
}
td.footable-first-column {
	position: relative;
	background: transparent !important; /*Firefox relative cell bug fix*/
}

.air-theme .footable-first-column .item-count {
	font-size: 11px !important;
}
.earth-theme .footable-first-column .item-count {
	font-size: 13px !important;
}

.footable.breakpoint > tbody > tr > td > span.footable-toggle {
	position: absolute;
	/*top: 50%;*/ /*doesn't work in IE*/
	left: 50%;
	width: 20px;
	height: 20px;
	/*margin: -10px 0 0 -10px;*/
	border-radius: 50%;
	overflow: hidden;
	background-color: #bbb;
}
.air-theme .footable.breakpoint > tbody > tr > td > span.footable-toggle {
	margin: -1px 0 0 -10px; /*IE hack*/
}
.earth-theme .footable.breakpoint > tbody > tr > td > span.footable-toggle {
	margin: 2px 0 0 -10px; /*IE hack*/
}
.footable-toggle {
	background-position: 0 center !important;
}
.footable-detail-show .footable-toggle {
	background-position: -20px center !important;
}
.footable-toggle:before {
	display: none !important;
}

.footable-row-detail {
	text-align: left;
}
.footable-row-detail-cell {
	border-width: 1px 0 !important;
	border-style: solid !important;
	border-color: #eee !important;
	text-align: left !important;
}
.footable-row-detail-row {
	margin: 0 0 10px;
	display: table-row;
}
.footable-row-detail-name {
	display: table-cell;
	padding: 10px;
}
.footable-row-detail-value {
	display: table-cell;
	padding: 10px;
}

/* NOTIFICATIONS & POPUPS  */

.bar-notification {
	display: none;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 1080;
	width: 100%;
	padding: 20px 50px 20px 20px;
	color: #fff;
	opacity: 0.95;
}
.bar-notification.success {
	/*background-color: #11a871;*/ /*default 'success' color*/
	background-color: #333;
}
.bar-notification.warning {
	background-color: #d66947;
}
.bar-notification.error {
	background-color: #ee2e56;
}
.bar-notification .content {
	float: left;
	margin: 0 10px 0 0;
}
.bar-notification .content a {
	color: #fff;
	text-decoration: underline;
}
.bar-notification .close {
	position: absolute;
	right: 15px;
	width: 22px;
	height: 22px;
	cursor: pointer;
	transition: opacity 0.2s ease;
}
.air-theme .bar-notification .close {
	top: 18px;
}
.earth-theme .bar-notification .close {
	top: 21px;
}
.bar-notification .close:hover {
	opacity: 0.9;
}

.noscript {
	background-color: #ff9;
	padding: 10px;
	text-align: center;
}

.ajax-loading-block-window {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100% !important;
	height: 100% !important;
	background: #fff url("../img/loading.gif") center no-repeat;
	opacity: 0.9;
}

/* Only jquery-ui.min.js is registered in _Root.Head.cshtml - never the
   jQuery UI stylesheet - so every structural rule its widgets rely on has to
   live here. For the dialog the two that matter are `position` and the
   content's `overflow`: without a position, jQuery UI's position utility finds
   the wrapper static and switches it to `relative`, so the computed offset
   (top: -1760px on a long topic) shoves the whole popup off the top of the
   page; and without overflow the content ignores the maxHeight the JS sets and
   grows past the viewport instead of scrolling. */
/* Pinned to the centre of the viewport rather than left to jQuery UI's own
   centring, which writes top/left inline from the height the dialog happened
   to have when it opened - hence !important here. Fixed, so it stays centred
   if the page behind scrolls. */
.ui-dialog {
	display: flex;
	flex-direction: column;
	position: fixed !important;
	top: 50% !important;
	left: 50% !important;
	right: auto !important;
	bottom: auto !important;
	transform: translate(-50%, -50%);
	margin: 0 !important;
	z-index: 1050;
	width: 500px !important;
	max-width: 95%;
	max-height: calc(100vh - 20px);
	overflow: hidden;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
	background-color: #fff;
	padding: 40px 20px;
	text-align: center;
}
/* A topic popup (terms of service, privacy notice) is a long document and reads
   far too narrow in the 500px box the short confirmation dialogs use. The
   wrapper carries no class of its own to hook onto - jQuery UI builds it - so
   the topic page inside it is the selector. Browsers without :has() simply keep
   the 500px width. max-width alone handles the breakpoint: below ~1230px the
   viewport-relative width wins, above it the 1200px cap does. */
.ui-dialog:has(.topic-page) {
	width: calc(100% - 30px) !important;
	max-width: 1200px;
}
/* unstyled without the jQuery UI sheet, and they would sit in the flex flow */
.ui-dialog .ui-resizable-handle {
	display: none !important;
}
.ui-widget-overlay {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1049;
	background-color: rgba(0, 0, 0, 0.5);
}
.ui-dialog-titlebar {
	flex: 0 0 auto;
	margin: 0 0 20px;
	padding: 0 30px;
	color: #333;
	text-transform: uppercase;
}
.air-theme .ui-dialog-titlebar {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 1px;
}
.earth-theme .ui-dialog-titlebar {
	font-size: 20px;
	font-weight: 400;
}
.ui-dialog-titlebar button {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background-color: #ccc;
	font-size: 0;
	transition: opacity 0.2s ease;
}
.ui-dialog-titlebar button:hover {
	opacity: 0.9;
}
.ui-dialog-titlebar button span {
	display: none;
}
.ui-dialog-content {
	flex: 1 1 auto;
	/* !important beats the inline width/height/max-height jQuery UI writes on
	   this element: the flex parent's max-height does the bounding now, and
	   overflow turns a long topic into a scroll area instead of an overflow. */
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	line-height: 20px;
}
.air-theme .ui-dialog-content {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
}
.ui-dialog .page {
	min-height: 0;
}
.ui-dialog .page-title {
	display: none;
}
.ui-dialog .page-body {
	text-align: center;
}
/* a topic popup (terms of service, privacy notice) is a long document, not the
   one-line message the centred default was written for */
.ui-dialog .topic-page .page-body {
	text-align: left;
}
.ui-dialog .topic-page .page-body h2,
.ui-dialog .topic-page .page-body p,
.ui-dialog .topic-page .page-body ul {
	margin: 0 0 12px;
}
.ui-dialog .topic-page .page-body ul {
	list-style: disc outside;
	padding-left: 20px;
}
.ui-dialog .topic-page .page-body img {
	max-width: 100%;
	height: auto;
}

.eu-cookie-bar-notification {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 1050;
	width: 100%;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
	overflow: hidden;
	padding: 30px 20px;
	text-align: center;
}
.air-theme .eu-cookie-bar-notification {
	background-color: #fff;
}
.earth-theme .eu-cookie-bar-notification {
	background-color: #222;
}
.eu-cookie-bar-notification .text {
	margin: 0 0 20px;
	line-height: 20px;
}
.air-theme .eu-cookie-bar-notification .text {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
}
.earth-theme .eu-cookie-bar-notification .text {
	font-size: 15px;
}
.eu-cookie-bar-notification a {
	display: block;
	margin: 10px 0 0;
}
.eu-cookie-bar-notification a:hover {
	text-decoration: underline;
}
.air-theme .eu-cookie-bar-notification a {
	color: #eda187;
}
.earth-theme .eu-cookie-bar-notification a {
	color: #007c5a;
}
.eu-cookie-bar-notification button {
	min-width: 100px;
	height: 40px;
	padding: 0 20px;
	color: #fff;
	transition: opacity 0.2s ease;
}
.air-theme .eu-cookie-bar-notification button {
	background-color: #eda187;
	font-size: 12px;
}
.earth-theme .eu-cookie-bar-notification button {
	background-color: #007c5a;
	font-size: 14px;
}
.eu-cookie-bar-notification button:hover {
	opacity: 0.9;
}

.scroll-back-button {
	display: none;
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 1010;
	width: 55px;
	height: 55px;
	border-radius: 50%;
	overflow: hidden;
	text-transform: uppercase;
	cursor: pointer;
	transition: opacity 0.3s ease;
}
.scroll-back-button:hover {
	opacity: 0.8;
}
.air-theme .scroll-back-button {
	background-color: #eda187;
}
.earth-theme .scroll-back-button {
	background-color: #007c5a;
}

/* HEADER */

.admin-header-links {
	position: relative;
	text-align: center;
}
.air-theme .admin-header-links {
	background-color: #333;
	color: #fff;
}
.earth-theme .admin-header-links {
	background-color: #fff;
	color: #222;
}
.admin-header-links .impersonate {
	display: inline-block;
}
.admin-header-links a,
.admin-header-links span {
	display: inline-block;
	margin: 0 10px;
	line-height: 40px;
	text-transform: lowercase;
}
.air-theme .admin-header-links a,
.air-theme .admin-header-links span {
	font-family: "Raleway", sans-serif;
}

.header {
	text-align: center;
}
.air-theme .header {
	background-color: #fff;
}
.earth-theme .header {
	background-color: #222;
}
.header-logo {
	padding: 20px 0;
}
.header-logo a {
	display: inline-block;
	max-width: 240px;
	line-height: 0; /*firefox line-height bug fix*/
}
.header-logo img {
	max-width: 100%;
}
.air-theme .header-logo img {
	background-color: #eda187;
}
.earth-theme .header-logo img {
	background-color: #007c5a;
}

.responsive-nav-wrapper div {
	display: inline-block;
	margin: 0 5px;
	overflow: hidden;
	vertical-align: middle;
}
.responsive-nav-wrapper span,
.responsive-nav-wrapper a {
	display: block;
	position: relative;
	height: 50px;
	width: 50px;
	font-size: 0;
	cursor: pointer;
}
.air-theme .responsive-nav-wrapper span,
.air-theme .responsive-nav-wrapper a {
	background-color: #eda187;
}
.earth-theme .responsive-nav-wrapper span,
.earth-theme .responsive-nav-wrapper a {
	background-color: #007c5a;
}
.responsive-nav-wrapper .menu-title span {
}
.responsive-nav-wrapper .search-wrap span {
}
.responsive-nav-wrapper .personal-button span {
}
.responsive-nav-wrapper .wishlist-opener a {
}
.responsive-nav-wrapper .shopping-cart-link a {
}

.store-search-box.active,
.header-options.active {
	display: block;
}

.store-search-box {
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	z-index: 1040;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
	text-align: center;
	background-color: #fff;
	padding: 30px 20px;
	font-size: 0;
	transition: all 0.3s ease;
}
.store-search-box .close {
	display: none;
	font-size: 0;
}
.search-box form {
	position: relative;
	z-index: 1;
	height: 60px;
	border: 1px solid #eee;
	background-color: #fff;
}
.search-box form:after {
	content: "";
	display: block;
	clear: both;
}
.search-box input.search-box-text {
	float: left;
	width: 100%;
	height: 100%;
	border: none;
	padding: 0 80px 0 20px;
	color: #bbb;
}
.air-theme .search-box input.search-box-text {
	font-size: 14px;
}
.earth-theme .search-box input.search-box-text {
	font-size: 18px;
}
.search-box input.search-box-text:focus {
	color: #555;
}
.search-box .search-box-button {
	position: absolute;
	top: 0;
	right: 0;
	width: 60px;
	height: 100%;
	border-width: 0 0 0 1px;
	border-style: solid;
	border-color: #eee;
	font-size: 0;
}
.air-theme .search-box .search-box-button {
	background-color: #eda187;
}
.earth-theme .search-box .search-box-button {
	background-color: #007c5a;
}
.ui-helper-hidden-accessible {
	display: none;
}
.ui-autocomplete {
	position: absolute;
	z-index: 0;
	width: calc(100% - 42px) !important;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
	overflow: hidden;
	background-color: #fff;
	padding: 15px 0;
	text-align: left;
}
.air-theme .ui-autocomplete li {
	font-size: 14px; /*reset zeroing*/
}
.earth-theme .ui-autocomplete li {
	font-size: 16px; /*reset zeroing*/
}
.ui-autocomplete li:first-child {
	border-top: none;
}
.ui-autocomplete .ui-state-active {
	background: #f6f6f6;
}
.ui-autocomplete a {
	display: block;
	padding: 10px 20px;
	color: #555;
	text-transform: uppercase;
}
.ui-autocomplete img {
	margin: 0 20px 0 0;
	vertical-align: middle;
}

.header-options {
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	z-index: 1040;
	background-color: #fff;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
	text-align: center;
	transition: all 0.3s ease;
}
.header-options #wishlistlink,
.header-options #topcartlink {
	display: none;
}
.header-selectors-wrapper {
	border-bottom: 1px solid #eee;
	background-color: #f6f6f6;
	padding: 30px 20px;
	font-size: 0;
}
.header-selectors-wrapper:empty {
	display: none;
}
.header-selectors-wrapper > div {
	display: inline-block;
	margin: 0 15px;
	vertical-align: middle;
}
.header-selectors-wrapper select {
	min-width: 110px;
	font-size: 13px !important;
	font-weight: 400 !important;
	text-transform: uppercase;
}
.header-selectors-wrapper .select-box {
	font-size: 13px !important;
	font-weight: 400 !important;
	text-transform: uppercase;
}
.language-list {
	max-width: 100%;
	font-size: 0;
}
.language-list li {
	display: inline-block;
	margin: 0 1px;
}
.language-list a {
	display: block;
	position: relative;
	width: 32px;
	height: 40px;
	line-height: 0;
}
.language-list img {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.header-links-wrapper {
	padding: 15px 20px;
}
.header-links li {
	font-size: 0;
}
.header-links li:before {
	content: "";
	display: inline-block;
	width: 25px;
	height: 25px;
	margin: 0 10px 0 0;
	vertical-align: middle;
}
.air-theme .header-links li:before {
	background-color: #eda187;
}
.earth-theme .header-links li:before {
	background-color: #007c5a;
}
.header-links #myaccountlink:before {
}
.header-links #registerlink:before {
}
.header-links #loginlink:before {
}
.header-links #logoutlink:before {
}
.header-links #inboxlink:before {
}
.header-links span,
.header-links a {
	display: inline-block;
	vertical-align: middle;
	line-height: 35px;
}
.air-theme .header-links span,
.air-theme .header-links a {
	font-size: 13px;
}
.earth-theme .header-links span,
.earth-theme .header-links a {
	font-size: 14px;
}
.header-links a:hover {
	color: #555;
}

.wishlist-opener,
.shopping-cart-link {
	text-align: right;
}
.air-theme .wishlist-opener small,
.air-theme .shopping-cart-link small {
	font-size: 12px;
	color: #eda187;
}
.earth-theme .wishlist-opener small,
.earth-theme .shopping-cart-link small {
	font-size: 12px;
	font-weight: 400;
	color: #007c5a;
}

/* FOOTER */

.footer-wrapper {
	overflow: hidden;
	padding: 90px 0 0;
}
.footer {
	background-color: #f3f3f3;
	padding: 20px 20px 30px;
	text-align: center;
}
.footer .title {
	margin: 0 0 10px;
	color: #333;
	text-transform: uppercase;
}
.air-theme .footer .title strong {
	font-size: 16px;
	font-weight: 700;
}
.earth-theme .footer .title strong {
	font-size: 18px;
	font-weight: 400;
}

.air-theme .newsletter {
	margin: -85px 0 20px;
}
.earth-theme .newsletter {
	margin: -90px 0 20px;
}
.newsletter-email {
	position: relative;
	z-index: 1;
	height: 70px;
	border: 1px solid #eee;
	overflow: hidden;
	background-color: #fff;
	padding: 0 70px 0 0;
}
.newsletter-subscribe {
	display: block !important; /* form should be always visible due to disign specifics */
}
.newsletter-email .newsletter-subscribe-text {
	float: left;
	width: 100%;
	height: 100%;
	border: none;
	padding: 0 20px;
	color: #bbb;
}
.air-theme .newsletter-email input.newsletter-subscribe-text {
	font-size: 14px;
}
.earth-theme .newsletter-email input.newsletter-subscribe-text {
	font-size: 18px;
}
.newsletter-email .newsletter-subscribe-text:focus {
	color: #555;
}
.newsletter-email .newsletter-subscribe-button {
	position: absolute;
	top: 0;
	right: 0;
	width: 70px;
	height: 100%;
	border-width: 0 0 0 1px;
	border-style: solid;
	border-color: #eee;
	font-size: 0;
}
.air-theme .newsletter-email .newsletter-subscribe-button {
	background-color: #eda187;
}
.earth-theme .newsletter-email .newsletter-subscribe-button {
	background-color: #007c5a;
}
.newsletter-email .options {
	clear: both;
	line-height: 32px;
	text-transform: lowercase;
	opacity: 0;
}
.newsletter-validation,
.newsletter-result {
	margin: 16px 0 0;
}
.air-theme .newsletter-validation,
.air-theme .newsletter-result {
	font-size: 13px;
}
.earth-theme .newsletter-validation,
.earth-theme .newsletter-result {
	font-size: 15px;
}
.newsletter-validation .please-wait {
	display: none !important;
}

.footer-middle {
	margin: 0 0 30px;
}
.footer-columns {
	display: grid;
	grid-template-columns: 1fr repeat(3, 1fr);
	gap: 30px;
	background-color: #fff;
	padding: 40px 30px;
	text-align: left;
}
.footer-company .logo img {
	max-width: 160px;
	height: auto;
	margin: 0 0 15px;
}
.footer-company__contacts {
	list-style: none;
	margin: 15px 0;
	padding: 0;
}
.footer-company__contacts li {
	margin: 0 0 6px;
	color: #777;
	font-size: 13px;
	line-height: 1.6;
}
.footer-company__contacts a {
	color: #777;
	transition: color 0.2s ease;
}
.footer-company__address {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.footer-company__map-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 8px 0 0;
	color: var(--el-accent, #00a651) !important;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-decoration: none;
}
.footer-company__map-link:hover {
	text-decoration: underline;
}
.footer-company__map-icon:before {
	content: "\f3c5";
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-size: 12px;
	line-height: 1;
}
.footer-company__icon-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.footer-company__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	color: var(--el-accent, #00a651);
}
.footer-company__icon:before {
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-size: 13px;
	line-height: 1;
}
.footer-company__icon--phone:before {
	content: "\f095";
}
.footer-company__icon--email:before {
	content: "\f0e0";
}
.footer-company__contacts a:hover {
	color: #333;
}
.footer-company__hours {
	font-size: 13px;
	color: #777;
	line-height: 1.6;
}
.footer-company__hours strong {
	display: block;
	margin: 0 0 4px;
	color: #333;
	text-transform: uppercase;
}
.footer-company__hours span {
	display: block;
}

@media all and (max-width: 1024px) {
	.footer-columns {
		grid-template-columns: 1fr 1fr;
	}
}
@media all and (max-width: 600px) {
	.footer-columns {
		grid-template-columns: 1fr;
		padding: 30px 20px;
	}
}

.footer-socials {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
	padding: 25px 0 0;
}
.footer-socials .title {
	margin: 0;
}
.social-sharing ul {
	font-size: 0;
}
.social-sharing li {
	display: inline-block;
	margin: 0 3px;
}
.social-sharing a {
	display: block;
	width: 35px;
	height: 35px;
	border-radius: 50%;
}
.air-theme .social-sharing a {
	background-color: #eda187;
}
.earth-theme .social-sharing a {
	background-color: #007c5a;
}

.footer-block .list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.footer-block .list a {
	display: inline-block;
	padding: 6px 0;
	color: #777;
	transition: color 0.2s ease;
}
.footer-block .list a:hover {
	color: #333;
}

.footer-lower {
	border-top: 1px solid #e5e5e5;
	padding: 15px 20px 0;
}
.footer-text {
	display: inline;
	margin: 3px;
	color: #aaa;
}
.air-theme .footer-text {
	font-size: 11px;
}
.earth-theme .footer-text {
	font-size: 13px;
}
.footer-text:after {
	content: "|";
	display: inline-block;
	margin: 0 0 0 9px;
}
.footer-text a {
	color: #777;
	transition: color 0.2s ease;
}
.footer-text a:hover {
	color: #444;
}
.footer-text:last-of-type:after {
	display: none;
}
.theme-selector {
	margin: 25px 0 0;
}
.theme-selector select {
	min-width: 130px;
}

/* STORE LOCATION MAP MODAL */

body.map-modal-open {
	overflow: hidden;
}
.map-modal {
	display: none;
	position: fixed;
	z-index: 10000;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.map-modal--open {
	display: block;
}
.map-modal__overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.75);
}
.map-modal__dialog {
	position: absolute;
	top: 3vh;
	left: 3vw;
	width: 94vw;
	height: 94vh;
	background-color: #fff;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}
.map-modal__iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}
.map-modal__close {
	position: absolute;
	top: -18px;
	right: -18px;
	z-index: 1;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	background-color: #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
	color: #333;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	transition: color 0.2s ease;
}
.map-modal__close:hover {
	color: var(--el-accent, #00a651);
}
@media all and (max-width: 600px) {
	.map-modal__dialog {
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
	}
	.map-modal__close {
		top: 10px;
		right: 10px;
	}
}

/* LEFT/RIGHT COLUMN */

.block {
	margin: 0 0 10px;
	text-align: left;
}
.block .title {
	position: relative;
	background-color: #f6f6f6;
	padding: 15px 10px;
	color: #555;
	text-transform: uppercase;
	cursor: pointer;
}
.block .title:before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	margin: 0 5px 0 0;
	vertical-align: middle;
}
.air-theme .block .title:before {
	background-color: #eda187;
}
.earth-theme .block .title:before {
	background-color: #007c5a;
}
.block-category-navigation .title:before {
}
.block-manufacturer-navigation .title:before {
}
.block-vendor-navigation .title:before {
}
.block-recently-viewed-products .title:before {
}
.block-popular-tags .title:before {
}
.block-poll .title:before {
}
.block .title:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 18px;
	height: 18px;
	margin: -9px 0 0;
	border-radius: 50%;
	background-color: #ccc;
	vertical-align: middle;
}
.block .title strong {
	vertical-align: middle;
	font-weight: 400;
}

.block .listbox {
	display: none;
	padding: 10px 0;
}
.block .listbox:after {
	content: "";
	display: block;
	clear: both;
}
.block .list a {
	display: block;
	position: relative;
	padding: 10px 25px 10px 20px;
	color: #555;
}
.air-theme .block .list a {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
}
.earth-theme .block .list a {
	font-size: 15px;
}
.block .list a:hover {
	color: #000;
}
.block .list a.with-subcategories:after {
	content: "";
	position: absolute;
	right: 14px;
	width: 6px;
	height: 9px;
	transition: all 0.2s ease;
}
.air-theme .block .list a.with-subcategories:after {
	top: 14px;
}
.earth-theme .block .list a.with-subcategories:after {
	top: 17px;
}
.block .list a.with-subcategories.opened:after {
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}

.block .sublist {
	display: none;
	margin: 0 0 0 20px;
}
.block .sublist a {
	color: #888;
}

.block .view-all a {
	display: block;
	padding: 10px 20px;
}
.air-theme .block .view-all a {
	font-size: 13px;
	color: #eda187;
}
.earth-theme .block .view-all a {
	font-size: 15px;
	color: #007c5a;
}
.block .view-all a span {
	vertical-align: middle;
}
.block .view-all a:after {
	content: "";
	display: inline-block;
	width: 6px;
	height: 9px;
	margin: 0 0 0 10px;
	vertical-align: middle;
}
.air-theme .block .view-all a:after {
	margin-bottom: -1px;
	background-color: #fff;
}
.earth-theme .block .view-all a:after {
	margin-bottom: -3px;
	background-color: #fff;
}

.block .list .product-picture {
	display: none;
}

.block .tags {
	padding: 0 15px;
}
.block .tags ul {
	font-size: 0;
}
.block .tags li,
.product-tags-all-page li {
	display: inline-block;
	position: relative;
	margin: 0 10px;
	overflow: hidden;
}
.air-theme .block .tags li,
.air-theme .product-tags-all-page li {
	font-family: "Raleway", sans-serif;
	font-size: 16px !important; /*setting base size*/
	color: #555;
}
.earth-theme .block .tags li,
.earth-theme .product-tags-all-page li {
	font-size: 18px !important; /*setting base size*/
}
.block .tags li a,
.product-tags-all-page li a {
	line-height: 36px;
}
.block .tags li a:hover,
.product-tags-all-page li a:hover {
	color: #555;
}

.poll {
	padding: 10px 20px;
	color: #555;
}
.poll strong {
	display: block;
	margin: 0 0 15px;
	font-weight: 400;
}
.poll-options,
.poll-results {
	margin: 0 0 20px;
	overflow: hidden;
	padding: 0 0 0 1px;
}
.air-theme .poll-options,
.air-theme .poll-results {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
	color: #555;
}
.earth-theme .air-theme .poll-options,
.earth-theme .poll-results {
	font-size: 15px;
}
.poll-options li,
.poll-results li {
	display: inline-block;
	padding: 6px 0;
}
.poll-options li label {
	display: inline-block;
	margin: 0 0 0 3px;
	cursor: pointer;
}
.poll .vote-poll-button {
	min-width: 80px;
	height: 40px;
	padding: 0 20px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .poll .vote-poll-button {
	background-color: #eda187;
	font-size: 12px;
}
.earth-theme .poll .vote-poll-button {
	background-color: #007c5a;
	font-size: 14px;
}
.poll .vote-poll-button:hover {
	opacity: 0.9;
}
.poll-total-votes {
	display: block;
}

.home-page-polls {
	width: 94%;
	margin: auto;
	text-align: center;
}
.home-page-polls .poll {
	padding: 0;
}
.home-page-polls .poll strong {
	margin-top: -10px;
}
.home-page-polls .poll-options li,
.home-page-polls .poll-results li {
	margin: 0 5px;
}

.product-filter {
	margin: 10px 0 0;
	padding: 0 20px;
	color: #555;
}
.price-range-filter {
	margin-bottom: 30px;
}
.air-theme .product-filter {
	font-size: 13px;
}
.earth-theme .product-filter {
	font-size: 15px;
}
.filters input {
	position: absolute;
	opacity: 0;
}
.filters label {
	display: block;
	position: relative;
	padding: 10px 10px 10px 25px;
	cursor: pointer;
}
.filters label:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	width: 18px;
	height: 18px;
	border: 2px solid #e3e3e3;
	border-radius: 50%;
	margin: auto;
}
.filters input:checked + label:before {
	border-color: #ccc;
	background-color: #fff;
}
.filter-title strong {
	display: block;
	margin: 0 0 5px;
	text-transform: uppercase;
	font-weight: normal;
}
.filter-content strong {
	display: block;
	margin: 10px 0 5px;
	font-weight: normal;
}
.selected-price-range {
	margin: 6px 0 12px;
	overflow: hidden;
	font-weight: 400;
}
.selected-price-range .from {
	float: left;
}
.selected-price-range .to {
	float: right;
}
.filters .ui-slider {
	position: relative;
	width: auto;
	height: 6px;
	margin: 0 8px 12px;
	background-color: #eee;
}
.filters .ui-slider-range {
	position: absolute;
	height: 6px;
}
.air-theme .filters .ui-slider-range {
	background-color: #eda187;
}
.earth-theme .filters .ui-slider-range {
	background-color: #007c5a;
}
.filters .ui-slider-handle {
	position: absolute;
	top: -5px;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	border-width: 3px;
	border-style: solid;
	border-radius: 50%;
	background-color: #fff;
}
.air-theme .filters .ui-slider-handle {
	border-color: #eda187;
}
.earth-theme .filters .ui-slider-handle {
	border-color: #007c5a;
}
.air-theme .filters .attribute-squares {
	margin: 0;
	font-size: 13px; /*reset zeroing*/
}
.earth-theme .filters .attribute-squares {
	margin: 0;
	font-size: 15px; /*reset zeroing*/
}
.filters .attribute-squares:before {
	left: 2px;
	width: 14px;
	height: 14px;
	border: none;
}
.filters .attribute-square {
	position: absolute !important;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 18px !important;
	height: 18px !important;
	box-shadow: none !important;
}

/* CATEGORY PAGE */

.breadcrumb {
	margin: 0 0 30px;
	text-align: left;
}
.breadcrumb ul {
	font-size: 0;
}
.breadcrumb li {
	display: inline-block;
}
.breadcrumb a,
.breadcrumb strong,
.breadcrumb .delimiter {
	display: inline-block;
	margin: 0 6px;
}
.air-theme .breadcrumb a,
.air-theme .breadcrumb strong,
.air-theme .breadcrumb .delimiter {
	font-size: 12px;
	color: #aaa;
}
.earth-theme .breadcrumb a,
.earth-theme .breadcrumb strong,
.earth-theme .breadcrumb .delimiter {
	font-size: 14px;
	color: #666;
}
.breadcrumb strong {
	font-weight: normal;
	color: #333 !important;
}

.category-description,
.manufacturer-description,
.vendor-description {
	margin: 0 0 50px;
	text-align: center;
	line-height: 28px;
}
/* category copy reads as body text rather than a centred intro blurb; the
   manufacturer and vendor descriptions above keep the centred treatment */
.category-description {
	text-align: left;
}
.category-description p,
.manufacturer-description p,
.vendor-description p {
	margin-top: 0;
}
.air-theme .category-description,
.air-theme .manufacturer-description,
.air-theme .vendor-description {
	font-family: "Raleway", sans-serif;
}
.vendor-description {
	margin: 0 0 40px;
}
.contact-vendor {
	margin: 40px 0 50px;
	text-align: center;
}
.contact-vendor-button {
	height: 40px;
	padding: 0 20px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .contact-vendor-button {
	background-color: #eda187;
	font-size: 12px;
}
.earth-theme .contact-vendor-button {
	background-color: #007c5a;
	font-size: 14px;
}
.contact-vendor-button:hover {
	opacity: 0.9;
}

.product-selectors {
	margin: 0 0 20px;
	text-align: center;
}
.product-selectors:after {
	content: "";
	display: block;
	clear: both;
}
.product-sorting,
.product-page-size {
	display: inline-block;
	margin: 5px;
	vertical-align: top;
}
.product-sorting > span,
.product-page-size > span {
	display: block;
	margin: 0 0 5px;
	text-transform: uppercase;
}
.air-theme .product-sorting > span,
.air-theme .product-page-size > span {
	font-size: 10px;
	font-weight: 700;
}
.earth-theme .product-sorting > span,
.earth-theme .product-page-size > span {
	font-size: 12px;
}
.product-page-size > span:last-child {
	display: none;
}
.product-selectors select {
	min-width: 100px;
}
.product-selectors .select-box {
	color: #333;
}
.product-viewmode,
.product-viewmode span {
	display: none;
	font-size: 0;
}

.item-grid:after,
.product-grid:after,
.product-list:after,
.manufacturer-grid:after {
	content: "";
	display: block;
	clear: both;
}

.item-box {
	position: relative;
	float: left;
	width: 49%; /*two per row*/
	margin-bottom: 10%;
	margin-left: 2%;
}
.item-box:nth-child(2n + 1) {
	clear: both;
	margin-left: 0;
}
/* ---------------------------------------------------------------------
   MODERN CARD SHELL - applies at every breakpoint, independent of the
   air-theme/earth-theme skin split. .item-box keeps owning the grid
   column math (width/float/margin, set in styles.css above and in the
   1320/1024/720/480/mobile breakpoint files) - only the inner
   .product-item gets the card treatment, so none of that column layout
   is touched.
   --------------------------------------------------------------------- */
.item-box .product-item {
	display: flex;
	flex-direction: column;
	height: 100%;
	box-sizing: border-box;
	border: 1px solid #ececec;
	border-radius: 12px;
	background-color: #fff;
	/* Percentages in padding resolve against the CARD's own width, so clamp()
	   gives container-relative padding without container queries: a ~200px
	   card in the QuickView popup or an SPC tab gets 10px, a full-width grid
	   card gets the full 16px. Keeps narrow cards from losing their content
	   width to fixed padding. */
	padding: clamp(10px, 4%, 16px);
	padding-bottom: clamp(14px, 5%, 20px);
	transition: border-color 0.2s ease;
}
/* The card does not move or lift on hover - only the border tightens. */
.item-box .product-item:hover {
	border-color: #ddd;
}
.item-box .details {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0; /*lets text-bearing children shrink instead of forcing overflow*/
	text-align: center;
}
.item-box .picture {
	position: relative;
	margin: 0 0 14px;
	overflow: hidden;
	border-radius: 8px;
	-webkit-backface-visibility: hidden; /*fixes a rendering bug in Chrome's current version*/
}
.item-box .picture a {
	display: block;
	position: relative;
	overflow: hidden;
	padding-top: 100%;
}
.item-box .picture img {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	max-width: 100%;
	margin: auto;
}
.item-box .product-title {
	margin: 0 0 4px;
	overflow: hidden;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	color: #333;
	text-transform: none;
}
.air-theme .item-box .product-title,
.earth-theme .item-box .product-title {
	height: 38px;
	font-size: 14px;
	font-weight: 600;
}
.item-box .product-title.no-reserved-height {
	height: auto !important;
}
/* !important because several plugin grids (SmartProductCollections, JCarousel)
   ship their own higher-specificity title-link colour.
   The clamp lives on the <a> (which holds the text), not the h2 - the h2's
   fixed height keeps rows aligned, and clamping here means a title too long
   for the box ends in an ellipsis instead of being sliced mid-line, which is
   what looked broken in narrow contexts. */
.item-box .product-title a {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	word-break: break-word; /*long unbroken product codes*/
	color: #333 !important;
}
.item-box .product-title a:hover {
	color: var(--el-accent, #00a651) !important;
}
/* the SKU under the product name, shown when "Show SKU on catalog pages" is on
   in the catalog settings (_ProductBox.cshtml gates the markup on it). It used
   to be hidden here; the bare value is wanted now. */
.item-box .product-title + .sku {
	margin: 0 0 8px;
	font-size: 12px;
	color: #999;
}
.item-box .product-rating-box {
	margin: 0 0 10px;
	font-size: 0;
}
.item-box .rating {
	display: inline-block;
	width: 80px;
	height: 16px;
}
.item-box .rating div {
	height: 16px;
}
.air-theme .item-box .rating div,
.earth-theme .item-box .rating div {
	background-color: var(--el-accent, #00a651);
}
.item-box .description {
	margin: 0 0 10px;
}
.item-box .product-rating-box,
.item-box .description {
	display: none;
}
.item-box .add-info {
	margin-top: auto;
}
/* price line reads "14,70 € brez DDV   brez dostave" on one row, with the
   unit-price / part-number lines forced onto their own rows beneath it */
.item-box .prices {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: center;
	gap: 2px 8px;
	margin: 0 0 12px;
}
.item-box .base-price-pangv,
.item-box .manufacturer-part-number {
	flex: 0 0 100%;
}
.item-box .old-price {
	position: relative;
	margin: 0 8px 0 0;
	font-size: 13px;
	font-weight: 400;
	color: #aaa;
	text-decoration: line-through;
}
.item-box .old-price:after {
	content: none; /*replaced by the text-decoration strikethrough above*/
}
.air-theme .item-box .actual-price,
.earth-theme .item-box .actual-price {
	font-size: 19px;
	font-weight: 700;
	color: var(--el-accent, #00a651);
}
.air-theme .item-box .tax-shipping-info,
.earth-theme .item-box .tax-shipping-info {
	margin: 0;
	font-size: 12px;
	color: #999;
}
.item-box .base-price-pangv,
.item-box .manufacturer-part-number {
	margin: 2px 0 0;
	font-size: 12px;
	color: #999;
}
/* the unit / part-number value itself is emphasised - accent green and bold -
   while its "Enota:" label stays muted */
.item-box .manufacturer-part-number .value {
	font-weight: 700;
	color: var(--el-accent, #00a651);
}
.item-box .buttons {
	margin: 0;
	font-size: 0;
}

.air-theme .swiper-pagination-bullet-active {
	background-color: #eda187;
}
.earth-theme .swiper-pagination-bullet-active {
	background-color: #007c5a;
}

.home-page-category-grid {
	width: 94%;
	margin: 0 auto 60px;
}
.home-page .product-grid {
	width: 94%;
	margin: 0 auto 40px;
}

.sub-category-grid {
	margin: 0 0 60px;
}
.home-page-category-grid .item-box,
.sub-category-grid .item-box,
.manufacturer-grid .item-box,
.vendor-grid .item-box {
	width: 100%;
	margin-bottom: 3%;
	margin-left: 0;
}
.home-page-category-grid .picture,
.sub-category-grid .picture,
.manufacturer-grid .picture,
.vendor-grid .picture {
	margin: 0;
}
.home-page-category-grid .picture a,
.sub-category-grid .picture a {
	padding-top: 65%;
}
.home-page-category-grid .title,
.sub-category-grid .title {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: auto;
	margin: 0;
	text-align: center;
	font-size: 0;
	color: #fff;
	text-transform: uppercase;
}
.air-theme .home-page-category-grid .title,
.air-theme .sub-category-grid .title {
	font-size: 18px;
	font-weight: 700;
}
.earth-theme .home-page-category-grid .title,
.earth-theme .sub-category-grid .title {
	font-size: 20px;
	font-weight: 400;
}
.manufacturer-grid .title,
.vendor-grid .title {
	height: auto;
	margin: 0;
	text-align: center;
	font-size: 0;
	font-weight: 400;
	color: #fff;
	text-transform: uppercase;
}
.air-theme .manufacturer-grid .title,
.air-theme .vendor-grid .title {
	font-size: 14px;
}
.earth-theme .manufacturer-grid .title,
.earth-theme .vendor-grid .title {
	font-size: 16px;
}
.home-page-category-grid .title a,
.sub-category-grid .title a {
	display: block;
	background-color: rgba(0, 0, 0, 0.7);
	padding: 15px 30px;
	transition: all 0.5s ease;
}
.manufacturer-grid .title a,
.vendor-grid .title a {
	display: block;
	background-color: rgba(0, 0, 0, 0.7);
	padding: 15px 30px;
	transition: all 0.5s ease;
}
.air-theme .home-page-category-grid .item-box:hover .title a,
.air-theme .sub-category-grid .item-box:hover .title a,
.air-theme .manufacturer-grid .item-box:hover .title a,
.air-theme .vendor-grid .item-box:hover .title a {
	background-color: #333;
}
.earth-theme .home-page-category-grid .item-box:hover .title a,
.earth-theme .sub-category-grid .item-box:hover .title a,
.earth-theme .manufacturer-grid .item-box:hover .title a,
.earth-theme .vendor-grid .item-box:hover .title a {
	background-color: #222;
}

.pager {
	margin: 0 0 20px;
}
.pager ul {
	text-align: center;
	font-size: 0;
}
.pager li {
	display: inline-block;
	vertical-align: middle;
}
.pager li a,
.pager li span {
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	text-align: center;
	font-size: 14px;
	line-height: 30px;
	cursor: pointer;
	transition: color 0.3s ease;
}
.pager li span,
.pager li a:hover {
	color: #333;
}
.pager .previous-page a,
.pager .next-page a,
.pager .first-page a,
.pager .last-page a {
	font-size: 0;
}
.pager .previous-page {
	margin: 0 5px;
}
.pager .next-page {
	margin: 0 5px;
}
.pager .previous-page a {
	background-position: 0 center;
}
.pager .next-page a {
	background-position: -30px center;
}
.air-theme .pager .previous-page a,
.air-theme .pager .next-page a {
	background-color: #eda187;
}
.earth-theme .pager .previous-page a,
.earth-theme .pager .next-page a {
	background-color: #007c5a;
}
.pager .first-page a {
	background-color: #bbb;
	background-position: -60px center;
}
.pager .last-page a {
	background-color: #bbb;
	background-position: -90px center;
}

/* PRODUCT PAGE */

.product-essential {
	margin: 0 0 50px;
}
.product-essential:after {
	content: "";
	display: block;
	clear: both;
}
.product-name-heading {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 16px;
	margin: 0 0 14px;
	text-align: left;
}
.product-name-heading h1 {
	position: static;
	display: block;
	flex: 1 1 auto;
	width: auto;
	margin: 0;
	color: #333;
	text-transform: none;
	letter-spacing: normal;
}
.air-theme .product-name-heading h1 {
	font-size: 26px;
	font-weight: 700;
}
.earth-theme .product-name-heading h1 {
	font-size: 28px;
	font-weight: 400;
}
.product-name-heading .manufacturers {
	flex: 0 0 auto;
	margin: 0;
	font-size: 13px;
	color: #999;
}
.product-name-heading .manufacturers .value a {
	font-weight: 600;
}
.gallery {
	margin: 0 0 40px;
}
.gallery .picture {
	position: relative;
	width: 600px;
	max-width: 100%;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;
	font-size: 0;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
}
.gallery .picture a {
	display: inline-block;
	max-width: 100%; /*Ie fix*/
}
.gallery .picture-thumbs {
	margin: 5px 0 0;
	overflow: hidden;
	text-align: center;
	font-size: 0;
}
.gallery .picture-thumbs > li,
.gallery .picture-thumbs > .picture-thumb {
	display: inline-block;
	border: 1px solid transparent;
	transition: all 0.3s ease;
}
.gallery .picture-thumbs > li:hover,
.gallery .picture-thumbs > .picture-thumb:hover {
	border-color: #ddd;
}
.gallery .picture-thumbs a {
	display: block;
	position: relative;
	width: 98px;
	height: 98px;
	border: 1px solid #e5e5e5;
	border-radius: 4px;
	overflow: hidden;
	transition: border-color 0.2s ease;
}
.gallery .picture-thumbs a:hover {
	border-color: #bbb;
}
.gallery .picture-thumbs img {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
.video-gallery .video-thumbs {
	max-width: 600px;
	margin: 10px auto 0;
	font-size: 0;
}
.video-gallery .thumb-item {
	width: 100%;
	height: 315px;
	margin: 10px 0 0;
}

.mfp-bg {
	/*default zoom*/
	z-index: 1080 !important;
}
.mfp-gallery {
	/*default zoom*/
	z-index: 1090 !important;
}

.overview {
	position: relative;
	margin: 0 0 40px;
	text-align: left;
}
.air-theme .overview {
	font-size: 13px;
}
.earth-theme .overview {
	font-size: 16px;
}
.air-theme .overview button {
	font-size: 13px;
	color: #555;
}
.earth-theme .overview button {
	font-size: 16px;
	font-weight: 300;
	color: #666;
}
.earth-theme .overview button:hover {
	color: #555;
}
.discontinued-product {
	margin: 0 0 20px;
	font-weight: 700;
	color: #ee2e56;
}
.air-theme .discontinued-product {
	font-size: 18px;
}
.earth-theme .discontinued-product {
	font-size: 20px;
}
.product-reviews-overview {
	margin: 0 0 25px;
}
.product-review-box .rating {
	display: inline-block;
	font-size: 0;
}
.product-review-box .rating,
.product-list .item-box .rating {
	width: 80px;
	height: 16px;
}
.product-review-box .rating div,
.product-list .item-box .rating div {
	height: 16px;
}
.air-theme .product-review-box .rating div,
.air-theme .product-list .item-box .rating div {
	background-color: #eda187;
}
.earth-theme .product-review-box .rating div,
.earth-theme .product-list .item-box .rating div {
	background-color: #007c5a;
}
.product-no-reviews a {
	padding: 0 !important;
}
.product-no-reviews a:before {
	display: none !important;
}
.air-theme .product-no-reviews a {
	font-size: 13px !important;
	color: #eda187;
}
.earth-theme .product-no-reviews a {
	font-size: 16px !important;
	line-height: normal !important;
	color: #007c5a;
}
.product-review-links {
	display: inline-block;
}
.product-review-links a {
	position: relative;
	margin: 0 10px;
	padding: 0 0 0 30px;
	line-height: 30px;
	color: #666;
}
.product-review-links a:hover {
	color: #555;
}
.air-theme .product-review-links a {
	font-size: 12px;
}
.earth-theme .product-review-links a {
	font-size: 14px;
}
.product-review-links .separator {
	display: none;
}
/*.product-review-links a:first-child:before*/
.product-review-links:first-child a:before {
}
/*.product-review-links a:last-child:before*/
.product-review-links:last-child a:before {
}
.product-review-links a:before,
.delivery .free-shipping:before,
.download-sample a:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 30px;
	height: 30px;
	margin: -15px 0 0;
}
.air-theme .product-review-links a:before,
.air-theme .delivery .free-shipping:before,
.air-theme .download-sample a:before {
	background-color: #eda187;
}
.earth-theme .product-review-links a:before,
.earth-theme .delivery .free-shipping:before,
.earth-theme .download-sample a:before {
	background-color: #007c5a;
}

.overview .short-description {
	margin: 0 0 30px;
	border-width: 0 0 1px;
	border-style: solid;
	border-color: #eee;
	padding: 0 0 30px;
	line-height: 26px;
}
.air-theme .overview .short-description {
	font-family: "Raleway", sans-serif;
}
.overview .value,
.variant-overview .value {
	font-weight: 400;
	color: #555;
}
.air-theme .overview .value a,
.air-theme .variant-overview .value a {
	color: #eda187;
}
.earth-theme .overview .value a,
.earth-theme .variant-overview .value a {
	color: #007c5a;
}

.overview .manufacturers,
.overview .availability,
.overview .additional-details,
.overview .delivery {
	margin: 0 0 30px;
}
.overview .subscribe-button,
.variant-overview .subscribe-button {
	height: 33px;
	padding: 0 0 0 35px;
}
.air-theme .overview .subscribe-button,
.air-theme .variant-overview .subscribe-button {
	background-color: #eda187;
}
.earth-theme .overview .subscribe-button,
.earth-theme .variant-overview .subscribe-button {
	background-color: #007c5a;
}
.overview .additional-details div,
.variant-overview .additional-details div {
	margin: 5px 0;
}
.overview .additional-details .label,
.overview .additional-details .value {
	font-size: 13px;
	color: #999;
}
.overview .free-shipping,
.variant-overview .free-shipping {
	display: inline-block;
	position: relative;
	padding: 0 0 0 35px;
	line-height: 30px;
}
.overview .free-shipping:before,
.variant-overview .free-shipping:before {
}
.overview-buttons {
	margin: 0 0 30px;
	border-width: 1px 0;
	border-style: solid;
	border-color: #eee;
	padding: 20px 0;
	font-size: 0;
}
.overview-buttons div {
	display: inline-block;
	margin: 5px 10px;
}
.overview-buttons button {
	height: 35px;
	background-color: transparent;
	padding: 0 0 0 35px;
}
.air-theme .overview-buttons button {
	background-color: #eda187;
}
.earth-theme .overview-buttons button {
	background-color: #007c5a;
}
.overview-buttons .add-to-wishlist-button {
}
.overview-buttons .add-to-compare-list-button {
}
.overview-buttons .email-a-friend-button {
}
.download-sample {
	margin: 0 0 30px;
}
.download-sample a {
	position: relative;
	padding: 0 0 0 35px;
}
.download-sample a:before {
}

.attributes {
	margin: 0 0 -1px !important;
	border-width: 1px 0;
	border-style: solid;
	border-color: #eee;
	background-color: #f9f9f9;
	padding: 25px;
}
.air-theme .attributes {
	font-size: 13px;
}
.earth-theme .attributes {
	font-size: 16px;
}
table .attributes {
	border: none;
	background-color: transparent;
}
.attributes dl {
	overflow: hidden;
}
.attributes dt {
	display: block;
	margin: 6px 0 12px;
	color: #333;
	white-space: nowrap;
}
.attributes dd {
	margin: 0 0 20px;
}
.attributes dd:last-child {
	margin: 0 0 10px;
}
.attributes li {
	margin: 10px 0;
}
.attributes li.disabled {
	pointer-events: none;
	opacity: 0.5;
}
.attributes li.disabled label {
	text-decoration: line-through;
}
.attributes li label {
	margin: 0 5px;
}
.attributes .qty-box {
	margin: 0 0 0 10px;
}
.attributes .qty-box label {
	display: none;
}
.attributes .qty-box input {
	width: 50px;
}
.attributes select {
	width: auto;
	min-width: 100px;
	max-width: 100%;
}
.attributes option.disabled {
	color: #ddd;
}
.attributes .attribute-dropdown {
	display: inline-block;
	max-width: 100%;
}
.rental-attributes {
	margin: 0 0 -20px !important;
	border: none;
	background-color: transparent;
	padding: 25px 0;
}
.rental-attributes .attribute-item:first-child {
	margin: 0 0 10px;
}
.rental-attributes .attribute-label {
	margin: 0 0 10px;
	color: #333;
}
.rental-attributes .attribute-data span {
	display: inline-block;
	position: relative;
}
.rental-attributes .attribute-data span:after {
	content: "";
	position: absolute;
	top: 14px;
	right: 10px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #ccc;
}
.rental-attributes .datepicker {
	width: 280px;
	text-align: center;
}
.ui-datepicker {
	width: 280px;
	outline: 1px solid #fff;
	background-color: #fff;
	text-align: center;
	font-size: 12px;
}
.air-theme .ui-datepicker {
	font-size: 12px;
}
.earth-theme .ui-datepicker {
	font-size: 13px;
}
.ui-datepicker-header {
	position: relative;
	height: 40px;
	margin: 0 0 -1px;
	border: 1px solid #eee;
	background-color: #f9f9f9;
	color: #333;
}
.ui-datepicker-header a {
	position: absolute;
	top: 12px;
	z-index: 1;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #ccc;
	font-size: 0;
}
.ui-datepicker-header a.ui-datepicker-prev {
	left: 10px;
}
.ui-datepicker-header a.ui-datepicker-next {
	right: 10px;
}
.ui-datepicker-title {
	position: relative;
	z-index: 0;
	line-height: 40px;
	font-weight: bold;
	text-transform: uppercase;
}
.ui-datepicker-calendar th {
	color: #333;
}
.ui-datepicker-calendar th,
.ui-datepicker-calendar td {
	width: 14.285%;
	border: 1px solid #eee;
	background-color: #fff;
	transition: all 0.2s ease;
}
.ui-datepicker-calendar th span,
.ui-datepicker-calendar td a {
	display: block;
	line-height: 35px;
}
.ui-datepicker-calendar td a:hover {
	background-color: #eee;
	color: #333;
}
.air-theme .ui-datepicker-calendar a.ui-state-active,
.air-theme .ui-datepicker-calendar a.ui-state-active:hover {
	background-color: #eda187;
	color: #fff;
}
.earth-theme .ui-datepicker-calendar a.ui-state-active,
.earth-theme .ui-datepicker-calendar a.ui-state-active:hover {
	background-color: #007c5a;
	color: #fff;
}

.attribute-squares {
	margin: -5px 0;
	font-size: 0;
}
.attribute-squares li {
	display: inline-block;
	margin: 2px;
}
.attribute-squares label {
	display: block;
	position: relative;
	margin: 0 !important;
	overflow: hidden;
}
.attribute-squares input {
	position: absolute;
	z-index: -1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.attribute-square-container {
	display: block;
	border: 2px solid transparent;
	border-radius: 50%;
	padding: 4px;
}
.attribute-squares .attribute-square {
	display: block;
	position: relative;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	box-shadow: 0 0 0 1px #ddd;
	cursor: pointer;
}
.selected-value .attribute-square-container {
	border-color: #ddd;
}
.selected-value .attribute-square:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.selected-value .attribute-square-container[title~="White"] .attribute-square:after {
}
.image-squares .selected-value .attribute-square:after {
	display: none;
}
.attribute-squares li.disabled {
	position: relative;
	opacity: 1;
}
.attribute-squares li.disabled:after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 10px;
	height: 10px;
	margin: auto;
	border-radius: 50%;
	box-shadow: 0 0 0 11px #fff;
	background-color: #fff;
}
.attribute-squares .tooltip-container {
	display: none;
}

.giftcard > div {
	margin: 0 0 10px;
}
.giftcard label {
	display: block;
	margin: 0 0 5px;
}
.giftcard input,
.giftcard textarea {
	width: 350px;
	max-width: 100%;
}

.product-details-page .prices {
	overflow: hidden;
	font-weight: 400;
}
.product-details-page .prices > div {
	display: inline-block;
	margin: 0 5px;
}
.product-details-page .prices label {
	display: none;
}
.product-details-page .old-product-price,
.product-details-page .non-discounted-price {
	font-size: 20px;
	color: #bbb;
}
.product-details-page .old-product-price span,
.product-details-page .non-discounted-price span {
	position: relative;
}
.product-details-page .old-product-price span:after,
.product-details-page .non-discounted-price span:after {
	content: "";
	position: absolute;
	width: 70px;
	max-width: 120%;
	height: 18px;
	background: url("../img/line-through-big.png") center no-repeat;
	opacity: 0.3;
}
.air-theme .product-details-page .old-product-price span:after,
.air-theme .product-details-page .non-discounted-price span:after {
	top: 4px;
	left: 0;
}
.earth-theme .product-details-page .old-product-price span:after,
.earth-theme .product-details-page .non-discounted-price span:after {
	top: 6px;
	left: -5px;
}

.product-details-page .product-price {
	font-size: 24px;
}
.air-theme .product-details-page .product-price {
	color: #eda187;
	font-weight: 700;
}
.earth-theme .product-details-page .product-price {
	color: #007c5a;
}
.product-details-page .rental-price {
	vertical-align: middle;
	font-size: 16px;
	color: #bbb;
}
.product-details-page .rental-price + .product-price,
.product-details-page .rental-price ~ .tax-shipping-info {
	vertical-align: middle;
}
.product-details-page .prices .tax-shipping-info,
.product-details-page .prices .base-price-pangv {
	color: #aaa;
}
.earth-theme .product-details-page .prices .tax-shipping-info,
.earth-theme .product-details-page .prices .base-price-pangv {
	font-weight: 300;
}

.tier-prices {
	margin: 0 0 30px;
}
.tier-prices .title {
	display: none;
}
.tier-prices .prices-table {
	border: 1px solid #eee;
	overflow: hidden;
}
.air-theme .tier-prices .prices-table {
	font-size: 12px;
}
.earth-theme .tier-prices .prices-table {
	font-size: 14px;
}
.tier-prices .prices-row {
	float: left;
	width: 50%;
}
.tier-prices .prices-row > div {
	border-top: 1px solid #eee;
	padding: 10px;
}
.tier-prices .prices-row.thead > div {
	border-right: 1px solid #eee;
}
.tier-prices .field-header {
	border-top: none !important;
	background-color: #f9f9f9;
}
.tier-prices .item-price {
	color: #000;
}
.customer-entered-price {
	margin: 0 0 30px;
	overflow: hidden;
	background: #f6f6f6;
	padding: 10px;
}
.overview .customer-entered-price {
	margin-top: -30px;
}
.customer-entered-price .price-input,
.customer-entered-price .price-range {
	display: inline-block;
	vertical-align: middle;
	margin: 0 10px;
}
.customer-entered-price .enter-price-input {
	width: 70px;
	text-align: center;
}
.customer-entered-price .price-range {
	margin: 10px;
}

.overview .prices,
.variant-overview .prices {
	margin: 30px 0;
}
.overview .add-to-cart {
	margin: 0 0 40px;
}
.overview .min-qty-notification,
.variant-overview .min-qty-notification {
	margin: 0 0 10px;
}
.overview .add-to-cart-panel,
.variant-overview .add-to-cart-panel {
	display: flex;
	position: relative;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
}
.overview .quantity,
.variant-overview .quantity {
	display: inline-block;
	margin: 0;
}
.overview .qty-label,
.variant-overview .qty-label {
	display: none;
}
.overview .quantity .increase,
.variant-overview .quantity .increase,
.overview .quantity .decrease,
.variant-overview .quantity .decrease {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: 0 10px;
	border-radius: 50%;
	background-color: #bbb;
	vertical-align: middle;
	font-size: 0;
	cursor: pointer;
}
.overview .quantity .increase,
.variant-overview .quantity .increase {
	background-position: left center;
}
.overview .quantity .decrease,
.variant-overview .quantity .decrease {
	background-position: right center;
}
.overview .qty-input,
.variant-overview .qty-input {
	width: 50px;
	height: 40px;
	text-align: center;
	font-size: 14px !important;
	font-weight: 400;
	color: #333;
}
.overview .qty-dropdown,
.variant-overview .qty-dropdown {
	width: 60px;
	height: 40px;
	text-align: left;
	font-size: 14px;
	font-weight: 400;
	color: #333;
}
.overview .select-box,
.variant-overview .select-box {
	font-size: 14px !important;
	color: #333;
}
.overview .add-to-cart-button,
.variant-overview .add-to-cart-button {
	height: 55px;
	min-width: 220px;
	padding: 0 35px;
	border-radius: 4px;
	font-weight: 400 !important;
	color: #fff !important;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .overview .add-to-cart-button,
.air-theme .variant-overview .add-to-cart-button {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .overview .add-to-cart-button,
.earth-theme .variant-overview .add-to-cart-button {
	background-color: #007c5a;
	font-size: 15px;
}
.overview .add-to-cart-button:before,
.variant-overview .add-to-cart-button:before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 40px;
	vertical-align: middle;
}
.overview .add-to-cart-button span,
.variant-overview .add-to-cart-button span {
	margin: 0 10px;
	vertical-align: middle;
}
.overview .add-to-cart-button:hover,
.variant-overview .add-to-cart-button:hover {
	opacity: 0.9;
}
.overview .pre-order-availability-date,
.variant-overview .pre-order-availability-date {
	margin: 10px 0 0;
}

.product-estimate-shipping {
	margin: 30px 0;
}
.product-estimate-shipping a {
	display: inline-block;
}
.product-estimate-shipping i {
	display: inline-block;
	transform: rotate(45deg);
	border: solid black;
	border-width: 0 1px 1px 0;
	padding: 3px 3px;
}
.air-theme .product-estimate-shipping i {
	margin: 0 0 3px 12px;
}
.earth-theme .product-estimate-shipping i {
	margin: 0 0 4px 12px;
}
.product-estimate-shipping .shipping-loading {
	display: none !important; /*disable preloader*/
}
.product-estimate-shipping .shipping-title {
	margin: 0 0 5px;
}
.product-estimate-shipping .shipping-price {
	position: relative;
	bottom: -1px;
	margin: 0 0 0 5px;
	font-weight: 400;
	color: #555;
}
.product-estimate-shipping .shipping-date {
	margin: 15px 0 0;
}

.product-social-buttons {
	margin: 0 0 25px;
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 15px;
	font-size: 0;
}
.product-social-buttons label {
	display: none;
	vertical-align: middle;
}
.air-theme .product-social-buttons label {
	font-size: 12px;
}
.earth-theme .product-social-buttons label {
	font-size: 14px;
}
.product-social-buttons ul {
	display: inline-block;
	vertical-align: middle;
}
.product-social-buttons li {
	display: inline-block;
	margin: 0 2px;
}
.product-social-buttons li a {
	display: block;
	width: 30px;
	height: 30px;
	outline: 1px solid transparent;
	transition: opacity 0.2s ease;
}
.product-social-buttons .twitter a {
	background-position: 0 center;
}
.product-social-buttons .facebook a {
	background-position: -30px center;
}
.product-social-buttons .pinterest a {
	background-position: -60px center;
}
.product-social-buttons .google a {
	background-position: -90px center;
}

.full-description {
	clear: both;
	line-height: 26px;
}
.air-theme .full-description {
	font-family: "Raleway", sans-serif;
}
.full-description a {
	text-decoration: underline;
}
.product-collateral {
	margin: 0 0 80px;
}
.product-collateral > div {
	margin: 0 0 40px;
}
.product-collateral .title {
	margin: 0 0 20px;
	color: #555;
	text-transform: uppercase;
}
.product-collateral .title strong {
	font-weight: 400;
}

.product-specs-box .data-table td {
	border-top: 1px solid #eee;
	padding: 10px 15px;
	text-align: left;
}
.product-specs-box .data-table td:first-child {
	background-color: #f9f9f9;
}
.product-specs-box .data-table .spec-group-name {
	display: none !important;
}
.product-specs-box .data-table .attribute-squares {
	display: inline-block;
	vertical-align: middle;
	margin: 0 3px 1px 0;
}
.product-specs-box .data-table .attribute-square-container {
	border: none;
	padding: 0;
}
.product-specs-box .data-table .attribute-square {
	width: 24px;
	height: 24px;
	border-radius: 0;
}

.product-tags-list li {
	display: inline-block;
}
.product-tags-list li.separator {
	margin: 0 5px 0 3px;
}
.product-tags-list a:hover {
	color: #555;
}

.product-variant-list {
	margin: 0 0 60px !important;
}
.product-variant-line {
	margin: 0 0 80px;
}
.product-variant-line:after {
	content: "";
	display: block;
	clear: both;
}
.variant-picture {
	position: relative;
	width: 300px;
	max-width: 100%;
	height: 300px;
	margin: 0 auto 30px;
	overflow: hidden;
	text-align: center;
}
.variant-overview {
	width: 100%;
}
.variant-overview .variant-name {
	margin: 0 0 15px;
	font-weight: 400;
	color: #555;
	text-transform: uppercase;
}
.air-theme .variant-overview .variant-name {
	font-size: 16px;
}
.earth-theme .variant-overview .variant-name {
	font-size: 18px;
}
.variant-overview .variant-description {
	margin: 0 0 20px;
	line-height: 26px;
}
.air-theme .variant-overview .variant-description {
	font-family: "Raleway", sans-serif;
}
.variant-overview .availability,
.variant-overview .additional-details,
.variant-overview .delivery {
	margin: 0 0 30px;
}
.variant-overview .attributes li {
	display: inline-block;
	margin: 5px 20px 5px 0;
}
.variant-overview .add-to-wishlist-button {
	display: none;
	width: 55px;
	height: 55px;
	margin: 20px 0 0;
	font-size: 0;
}
.air-theme .variant-overview .add-to-wishlist-button {
	background-color: #eda187;
}
.earth-theme .variant-overview .add-to-wishlist-button {
	background-color: #007c5a;
}

.ui-tabs {
	margin: 0 0 60px;
}
.ui-tabs .ui-tabs-nav {
	border-top: 1px solid #eee;
	text-align: center;
}
.ui-tabs .ui-tabs-nav li {
	display: inline-block;
	margin: 0 5px;
}
.ui-tabs .ui-tabs-nav li a {
	display: block;
	position: relative;
	padding: 20px;
	font-size: 16px;
	font-weight: 400;
	text-transform: uppercase;
	transition: all 0.2s ease;
}
.ui-tabs .ui-tabs-nav li a:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: transparent;
	transition: all 0.3s ease;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a,
.ui-tabs .ui-state-active.ui-tabs-active a {
	color: #333;
}
.air-theme .ui-tabs .ui-tabs-nav li.ui-state-hover a:after,
.air-theme .ui-tabs .ui-tabs-nav li.ui-tabs-selected a:after,
.air-theme .ui-tabs .ui-state-active.ui-tabs-active a:after {
	background-color: #eda187;
}
.earth-theme .ui-tabs .ui-tabs-nav li.ui-state-hover a:after,
.earth-theme .ui-tabs .ui-tabs-nav li.ui-tabs-selected a:after,
.earth-theme .ui-tabs .ui-state-active.ui-tabs-active a:after {
	background-color: #007c5a;
}
.ui-tabs .ui-tabs-panel {
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 30px 20px;
}
.ui-tabs .ui-tabs-panel p {
	margin: 0;
	line-height: 26px;
}
.ui-tabs .ui-tabs-hide {
	display: none;
}

.back-in-stock-subscription-page .tooltip {
	margin: 0 0 20px;
}
.back-in-stock-subscription-page .notify-me-button {
	min-width: 80px;
	height: 40px;
	background-color: #555;
	padding: 0 20px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.back-in-stock-subscription-page .notify-me-button:hover {
	opacity: 0.9;
}

.short-description + .overview-buttons,
.overview-buttons + .product-social-buttons {
	margin-top: -31px; /*unwanted gaps & double borders fix*/
}
.product-details-page .product-grid + .product-grid {
	margin: 40px 0 0;
}

/* ESTIMATE SHIPPING */

.estimate-shipping-popup {
	position: relative;
	max-width: 800px;
	margin: auto;
	background-color: #fff;
	padding: 25px;
	transform: scale(0.8);
	transition: all 0.2s ease;
	opacity: 0;
}
.estimate-shipping-popup strong {
	visibility: hidden;
}
.mfp-ready .estimate-shipping-popup {
	transform: scale(1);
	opacity: 1;
}
.mfp-removing .estimate-shipping-popup {
	transform: scale(0.8);
	opacity: 0;
}
.estimate-shipping-popup-zoom-in {
	z-index: 1090 !important;
}
.estimate-shipping-popup-zoom-in.mfp-removing {
	transition: all 0.3s ease;
	opacity: 0;
}

.estimate-shipping-popup .mfp-close {
	position: absolute;
	top: 10px !important;
	right: 10px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	overflow: hidden;
	background-color: #ccc;
	font-size: 0;
	opacity: 1;
	transition: opacity 0.2s ease;
}
.estimate-shipping-popup .mfp-close:hover {
	opacity: 0.9;
}

.estimate-shipping-row {
	display: flex;
	display: -webkit-flex;
	align-items: center;
	position: relative;
}
.estimate-shipping-row-item {
	flex: 0 1 100%;
}

.mfp-container .address-item {
	margin: 10px 0 0;
}
.mfp-container .address-item + div {
	padding: 0 0 0 15px;
}
.estimate-shipping-address-control {
	width: 100%;
	height: 40px;
}
.mfp-container .address-item .required {
	position: absolute;
	top: 0;
	right: 0;
	border-width: 0 8px 8px 0;
	border-style: dashed solid dashed;
	vertical-align: top;
	font-size: 0;
}
.air-theme .estimate-shipping-popup .required {
	border-color: transparent #eda187 transparent;
}
.earth-theme .estimate-shipping-popup .required {
	border-color: transparent #007c5a transparent;
}
.mfp-container .shipping-options {
	position: relative; /*preloader referrence*/
	margin: 10px 0 30px;
}
.mfp-container .shipping-header-item {
	align-self: flex-end;
	border: none !important;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.mfp-container .shipping-options-body {
	display: table;
	table-layout: fixed;
	width: 100%;
	border: 1px solid #eee;
	border-collapse: collapse;
}
.mfp-container .shipping-option {
	display: table-row;
	cursor: pointer;
}
.mfp-container .shipping-option.active {
	font-weight: 400;
	color: #444;
}
.mfp-container .shipping-option > div {
	display: table-cell;
	border-top: 1px solid #eee;
	padding: 11px;
}
.mfp-container .shipping-item {
	border-right: 1px solid #eee;
	overflow: hidden;
	padding: 8px 0;
	overflow-wrap: break-word;
}
.estimate-shipping-row-item-radio {
	flex: 0 0 30px;
	width: 24px;
}
.estimate-shipping-radio {
	display: none;
}
.estimate-shipping-radio + label {
	display: inline-block;
	position: relative;
	bottom: 1px;
	width: 14px;
	height: 14px;
	border: 1px solid #444;
	border-radius: 50%;
	font-size: 0;
}
.estimate-shipping-radio:checked + label:after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #444;
}

.apply-shipping-button-container {
	text-align: center;
}
.apply-shipping-button {
	min-width: 180px;
	height: 40px;
	margin: 5px auto;
	padding: 0 20px;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .apply-shipping-button {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .apply-shipping-button {
	background-color: #007c5a;
	font-size: 15px;
	letter-spacing: 0.5px;
}
.apply-shipping-button:hover {
	opacity: 0.9;
}

.mfp-container .no-shipping-options {
	padding: 30px 15px;
	text-align: center;
}
.mfp-container .message-failure {
	margin: 10px 0 -5px;
}

@media all and (max-width: 600px) {
	.estimate-shipping-popup {
		padding: 25px 3%;
	}
	.mfp-container .shipping-address {
		flex-flow: column;
	}
	.mfp-container .address-item {
		width: 100%;
	}
	.mfp-container .address-item + div {
		padding: 0;
	}
}

/* PRODUCT REVIEWS */

.product-reviews > .result {
	/*min-height: 100px;*/
	margin: 40px 0;
	text-align: center;
}
.product-reviews .message-error {
	margin: 0 0 20px;
	text-align: center;
}
.product-reviews .write-review {
	margin: 30px 0 80px;
}
.product-reviews .write-review form {
	/*width: 600px;
	max-width: 100%;
	margin: auto;*/
	background-color: #f9f9f9;
	padding: 40px 20px;
}
.air-theme .write-review label {
	font-size: 13px;
	color: #555;
}
.earth-theme .write-review label {
	font-size: 15px;
	color: #555;
}
.write-review .review-rating {
	text-align: center;
}
.write-review .review-rating > label {
	display: block;
	margin: 0 0 5px;
}
.write-review .review-rating ul {
	font-size: 0;
	vertical-align: middle;
}
.write-review .review-rating li {
	display: inline-block;
	margin: 0 5px;
	cursor: default;
	vertical-align: middle;
}
.air-theme .write-review .review-rating li.first,
.air-theme .write-review .review-rating li.last {
	font-size: 13px;
	color: #555;
}
.earth-theme .write-review .review-rating li.first,
.earth-theme .write-review .review-rating li.last {
	font-size: 14px;
	font-weight: 400;
	color: #555;
}
.write-review .rating-options label {
	display: inline-block;
	width: 16px;
	height: 16px;
	font-size: 0;
	cursor: pointer;
}
.air-theme .write-review .rating-options label {
	background-color: #eda187;
}
.earth-theme .write-review .rating-options label {
	background-color: #007c5a;
}
.write-review .rating-options input {
	position: absolute;
	z-index: -1;
	margin: 1px 0 0 1px;
	opacity: 0;
}
/* the sprite's two frames are reproduced on the label's :before further down
   (see "write-review star rating"), so this state rule has nothing left to set */
.write-review .review-rating + .review-rating {
	margin: 10px 0 0;
}
.write-review .review-rating .tooltip-text {
	display: none;
}
/*form toggle*/
.write-review .fieldset {
	display: none;
}
.write-review .buttons {
	position: relative;
}
.write-review .trigger {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	cursor: pointer;
} /**/

.product-review-list {
	margin: 0 0 -30px;
}
.product-review-item {
	border-bottom: 1px solid #eee;
	overflow: hidden;
	padding: 25px 20px 35px;
}
.product-review-item:first-child {
	padding-top: 0;
}
.product-review-item .review-item-head {
	margin: 0 0 20px;
}
.product-review-item .review-info {
	margin: 0 0 10px;
}
.product-review-item .review-info > span {
	display: block;
	margin: 0 0 5px;
}
.product-review-item .review-info .avatar {
	margin: 10px 0;
	font-size: 0;
}
.product-review-item .review-info .avatar a {
	display: inline-block;
}
.product-review-item .review-info .avatar img {
	width: 180px;
}
.air-theme .product-review-item .review-info a {
	color: #eda187;
}
.earth-theme .product-review-item .review-info a {
	color: #007c5a;
}
.air-theme .product-review-item .review-info .date {
	font-size: 12px;
}
.earth-theme .product-review-item .review-info .date {
	font-size: 14px;
}
.product-review-item .product-review-box {
	padding: 5px 0;
	font-size: 0;
}
.review-type-rating-ext .review-title {
	margin: 5px 0 3px !important;
	color: #888;
}
.product-review-item .review-title {
	margin: 0 0 20px;
	color: #555;
}
.air-theme .product-review-item .review-title strong {
	font-weight: 700;
}
.earth-theme .product-review-item .review-title strong {
	font-weight: 400;
}
.product-review-item .review-text {
	margin: 0 0 20px;
	line-height: 26px;
}
.product-review-helpfulness > span {
	vertical-align: middle;
}
.product-review-helpfulness .question,
.product-review-helpfulness .vote-options {
	margin: 0 5px 0 0;
}
.product-review-helpfulness .vote-options > span {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: 0 2px;
	vertical-align: middle;
	font-size: 0;
	cursor: pointer;
	opacity: 0.5;
	transition: opacity 0.2s ease;
}
.product-review-helpfulness .vote-options > span:first-child {
	background-position: left center;
}
.product-review-helpfulness .vote-options > span:last-child {
	background-position: right center;
}
.product-review-helpfulness .vote-options > span:hover {
	opacity: 0.8;
}
.product-review-helpfulness .result {
	margin: 0 0 0 10px;
}

.product-review-item .reply {
	margin: 30px 0 0;
	padding: 20px 25px;
	background: #f9f9f9;
}
.product-review-item .reply-header {
	margin: 0 0 10px;
	color: #555;
}
.air-theme .product-review-item .reply-header {
	font-weight: 700;
}
.earth-theme .product-review-item .reply-header {
	font-weight: 400;
}

/* WISHLIST & COMPARE LIST */

.wishlist-content {
	margin: 30px 0;
}
.wishlist-content .message-error {
	margin: 0 0 20px;
	text-align: center;
}
.wishlist-content .cart .sku {
	display: none !important;
}
.wishlist-content .buttons {
	overflow: hidden;
	background-color: #f9f9f9;
	padding: 15px 20px;
	font-size: 0;
}
.wishlist-content button {
	display: block;
	width: 90%;
	max-width: 300px;
	height: 55px;
	margin: 5px auto;
	background-color: #aaa;
	padding: 0 20px;
	text-align: left;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.wishlist-content button:hover {
	opacity: 0.9;
}
.air-theme .wishlist-content button {
	font-size: 14px;
}
.earth-theme .wishlist-content button {
	font-size: 15px;
	letter-spacing: 0.5px;
}
.air-theme .wishlist-add-to-cart-button {
	background-color: #eda187;
}
.earth-theme .wishlist-add-to-cart-button {
	background-color: #007c5a;
}
.wishlist-content button:before {
	content: "";
	display: inline-block;
	width: 35px;
	height: 35px;
	margin: 0 10px 0 -5px;
	vertical-align: middle;
}
.wishlist-content .update-wishlist-button:before {
}
.wishlist-content .wishlist-add-to-cart-button:before {
}
.wishlist-content .email-a-friend-wishlist-button:before {
}
.wishlist-content button span {
	vertical-align: middle;
}
.wishlist-content .tax-shipping-info {
	margin: 30px 0;
	text-align: center;
}
.wishlist-page .share-info {
	text-align: center;
}
.wishlist-page .share-info a {
	display: block;
	margin: 10px 0 0;
	font-weight: 400;
}
.air-theme .wishlist-page .share-info a {
	color: #eda187;
}
.earth-theme .wishlist-page .share-info a {
	color: #007c5a;
}

.compare-products-page {
	overflow: hidden;
}
.compare-products-page .button-wrapper {
	margin: 0 0 30px;
}
.compare-products-page .clear-list {
	display: inline-block;
	min-width: 150px;
	height: 50px;
	padding: 0 30px;
	text-align: center;
	line-height: 50px;
	color: #fff;
	font-weight: 400;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .compare-products-page .clear-list {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .compare-products-page .clear-list {
	background-color: #007c5a;
	font-size: 15px;
}
.compare-products-page .clear-list:hover {
	opacity: 0.9;
}
.compare-products-table {
	display: none;
}
.compare-products-page .remove-button {
	display: inline-block;
	height: 40px;
	background-color: #fff;
	padding: 0 15px;
	line-height: 20px;
	color: #555;
}
.air-theme .compare-products-page .remove-button {
	font-size: 13px;
	text-transform: lowercase;
}
.earth-theme .compare-products-page .remove-button {
	font-size: 15px;
	font-weight: 300;
}
.compare-products-page .remove-button:before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 3px solid #ccc;
	border-radius: 50%;
	background-color: #ccc;
	vertical-align: middle;
}
.compare-products-page .remove-button span {
	vertical-align: middle;
}
.compare-products-page .attribute-squares {
	display: inline-block;
	vertical-align: middle;
}
.compare-products-page .empty {
	color: #aaa;
}

/* TOPICS */

.topic-block {
	margin: 0 0 40px;
	text-align: center;
}
.topic-block-title {
	margin: 0 0 20px;
	color: #555;
	text-transform: uppercase;
}
.air-theme .topic-block-title h2 {
	font-size: 16px;
	font-weight: 400;
}
.earth-theme .topic-block-title h2 {
	font-size: 18px;
	font-weight: 400;
}
.topic-block-body,
.topic-page .page-body {
	line-height: 26px;
}
.air-theme .topic-block-body,
.air-theme .topic-page .page-body {
	font-family: "Raleway", sans-serif;
}
.topic-block-body strong,
.topic-page .page-body strong {
	color: #555;
}
.topic-block-body a,
.topic-page .page-body a {
	text-decoration: underline;
}

.home-page .topic-block {
	width: 94%;
	margin: 50px auto 60px;
}
.not-found-page p {
	margin: 30px 0;
}
.not-found-page strong {
	color: #333;
}

.topic-password {
	background-color: #f9f9f9;
	padding: 40px 20px;
	text-align: center;
}
.enter-password-title {
	margin: 0 0 15px;
	color: #555;
}
.enter-password-form {
	max-width: 440px;
	margin: auto;
}
.enter-password-form #password {
	width: 100%;
	margin: 0 0 30px;
}
.enter-password-form #button-password {
	min-width: 150px;
	height: 50px;
	padding: 0 30px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .enter-password-form #button-password {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .enter-password-form #button-password {
	background-color: #007c5a;
	font-size: 15px;
}
.enter-password-form #button-password:hover {
	opacity: 0.9;
}
.topic-password .password-error {
	margin: 15px 0 -15px;
}

/* CONTACT & EMAIL A FRIEND */

.contact-page,
.apply-vendor-page {
	margin: 0 0 80px;
}
.email-a-friend-page {
	margin: 20px 0 80px;
}
.contact-page .topic-block,
.apply-vendor-page .topic-block {
	padding: 0 10px;
	text-align: center;
}
.contact-page .topic-block-title,
.apply-vendor-page .topic-block-title {
	display: none;
}
.contact-page .page-body > .result,
.email-a-friend-page .page-body > .result,
.apply-vendor-page .page-body > .result {
	min-height: 100px;
	margin: 40px 0;
	text-align: center;
}
.contact-page form,
.email-a-friend-page form,
.apply-vendor-page form {
	width: 600px;
	max-width: 100%;
	margin: auto;
	background-color: #f9f9f9;
	padding: 40px 20px;
}
.contact-page .message-error,
.email-a-friend-page .message-error,
.apply-vendor-page .message-error {
	margin: 0 0 20px;
	text-align: center;
}
.email-a-friend-page .title {
	margin: 0 0 40px;
	padding: 0 10px;
	text-align: center;
	text-transform: uppercase;
}
.air-theme .email-a-friend-page .title h2 {
	font-size: 16px;
	font-weight: 400;
	color: #eda187;
}
.earth-theme .email-a-friend-page .title h2 {
	font-size: 18px;
	font-weight: 400;
	color: #007c5a;
}
.apply-vendor-page .terms-of-service {
	margin-top: 30px;
}

/* REGISTRATION & LOGIN (+ ACCOUNT global)  */

.registration-page,
.account-page {
	margin: 0 0 80px;
}
.registration-page .form-fields,
.account-page .form-fields,
.account-page .edit-address {
	max-width: 1000px;
	margin: auto;
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 25px 10px 20px;
}
.registration-page .option-list + .required,
.account-page .option-list + .required {
	position: relative;
}
.gender > span,
.custom-attributes li,
.vendor-attributes li {
	display: inline-block;
	position: relative;
	width: 49%;
}
.gender > span,
.custom-attributes li:nth-child(odd),
.vendor-attributes li:nth-child(odd) {
	margin: 0 2% 0 0;
}
.gender > span > input,
.custom-attributes li > input,
.vendor-attributes li > input {
	position: absolute;
	top: 14px;
	left: 12px;
}
.gender > span > label,
.custom-attributes li > label,
.vendor-attributes li > label {
	display: block;
	height: 40px;
	border: 1px solid #eee;
	overflow: hidden;
	background-color: #fff;
	padding: 0 10px 0 30px;
	text-align: left;
	line-height: 39px;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.date-of-birth > div {
	display: inline-block;
	width: 100%;
}
.date-of-birth > div + .required {
	position: relative;
}
.date-of-birth select {
	width: 32% !important;
	margin: 0 0 0 2%;
}
.date-of-birth select:first-of-type {
	margin: 0;
}
#check-availability-button {
	margin: 10px 0 0;
	background-color: transparent;
	text-transform: uppercase;
}
.air-theme #check-availability-button {
	color: #eda187;
}
.earth-theme #check-availability-button {
	color: #007c5a;
}
#check-availability-button:before {
	content: "";
	display: inline-block;
	width: 25px;
	height: 25px;
	margin: 0 1px;
	vertical-align: middle;
}
.air-theme #check-availability-button:before {
	background-color: #eda187;
}
.earth-theme #check-availability-button:before {
	background-color: #007c5a;
}
#check-availability-button span {
	margin: 0 1px;
	vertical-align: middle;
}
#username-availabilty {
	display: block;
}
#username-availabilty:empty {
	display: none;
}
.custom-attributes .option-list,
.vendor-attributes .option-list {
	display: inline-block; /*should be inline-block, otherwise the "required" symbol will drop on a new line*/
	width: 100%;
	text-align: left;
	white-space: normal;
}
.newsletter-input {
	padding: 5px 0 0;
}
.newsletter-input label {
	display: inline;
	width: auto;
	margin: 0 0 0 5px;
}
.vat-status,
.vat-note {
	display: block;
	margin: 5px 0 0;
	text-align: center;
	font-size: 12px; /*reset zeroing*/
	white-space: normal;
}
.accept-privacy-policy {
	margin: -10px 0 30px;
	text-align: center;
}
.air-theme .accept-privacy-policy {
	font-size: 13px;
}
.earth-theme .accept-privacy-policy {
	font-size: 15px;
}
.accept-privacy-policy input {
	margin: 0 5px 0 0;
}
.accept-privacy-policy .read {
	margin: 0 0 0 2px;
	cursor: pointer;
}
.air-theme .accept-privacy-policy .read {
	color: #eda187;
}
.earth-theme .accept-privacy-policy .read {
	color: #007c5a;
}
.accept-consent + .accept-consent {
	margin-top: -15px;
}
.registration-page .button-1,
.login-page .button-1,
.account-page .button-1,
.registration-result-page .button-1,
.user-agreement-page .button-1 {
	min-width: 150px;
	height: 50px;
	padding: 0 30px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .registration-page .button-1,
.air-theme .login-page .button-1,
.air-theme .account-page .button-1,
.air-theme .registration-result-page .button-1,
.air-theme .user-agreement-page .button-1 {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .registration-page .button-1,
.earth-theme .login-page .button-1,
.earth-theme .account-page .button-1,
.earth-theme .registration-result-page .button-1,
.earth-theme .user-agreement-page .button-1 {
	background-color: #007c5a;
	font-size: 15px;
}
.registration-page .button-1:hover,
.login-page .button-1:hover,
.account-page .button-1:hover,
.registration-result-page .button-1:hover,
.user-agreement-page .button-1:hover {
	opacity: 0.9;
}
.registration-result-page .result,
.account-activation-page .result {
	min-height: 50px;
	margin: 40px 0;
	text-align: center;
}

.login-page .customer-blocks {
	margin: 40px 0 80px;
	overflow: hidden;
	text-align: center;
}
.login-page .fieldset {
	margin: 0 0 60px;
}
.login-page .title {
	margin: 0 0 15px;
	color: #555;
	text-transform: uppercase;
}
.air-theme .login-page .title {
	font-size: 16px;
}
.earth-theme .login-page .title {
	font-size: 18px;
	font-weight: 400;
}
.login-page .title strong {
	font-weight: 400;
}
.login-page .inner-wrapper {
	background-color: #f9f9f9;
	padding: 25px 20px 30px;
}
.login-page .stay-logged,
.login-page .forgot-password {
	margin: 0 5px;
	vertical-align: middle;
}
.login-page .stay-logged label {
	display: inline;
	margin: 0 0 0 5px;
}
.air-theme .login-page .forgot-password {
	font-size: 12px;
}
.earth-theme .login-page .forgot-password {
	font-size: 15px;
}
.login-page .forgot-password a:hover {
	color: #555;
}
.login-page .buttons {
	margin: 25px 0 0;
}
.checkout-as-guest-button {
	display: block;
	margin: -10px auto 20px;
}
.login-page .button-1:before {
	content: "";
	display: inline-block;
	width: 25px;
	height: 25px;
	margin: 0 10px 0 -5px;
	vertical-align: middle;
}
.login-page .login-button:before {
}
.login-page .register-button:before {
}
.checkout-as-guest-button:before {
}
.login-page .button-1 span {
	vertical-align: middle;
}
.air-theme .login-page .text {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
	line-height: 26px;
}
.earth-theme .login-page .text {
	line-height: 26px;
}
.external-authentication {
	margin: 40px 0 80px;
	overflow: hidden;
	text-align: center;
}
.external-authentication .title {
	display: none;
}
.external-authentication fieldset {
	float: none !important;
}
.password-recovery-page form {
	margin: 0 0 80px;
}
.password-recovery-page .tooltip,
.password-recovery-page .result {
	min-height: 50px;
	margin: 40px 0;
	text-align: center;
}

/* ACCOUNT PAGES  */

.block-account-navigation {
	float: none !important;
	min-width: 300px;
	margin: 50px auto -10px !important;
}

.add-more-external-records {
	text-align: center;
}
.add-more-external-records a {
	display: block;
	margin: 5px 0;
	font-weight: 400;
}
.air-theme .add-more-external-records a {
	color: #eda187;
}
.earth-theme .add-more-external-records a {
	color: #007c5a;
}

.email-to-revalidate,
.email-to-revalidate-note {
	margin: 0 5px;
	vertical-align: middle;
}
.air-theme .email-to-revalidate,
.air-theme .email-to-revalidate-note {
	font-size: 12px;
}
.earth-theme .email-to-revalidate,
.earth-theme .email-to-revalidate-note {
	font-size: 15px;
}

.account-page .address-list .section,
.account-page .order-list .section {
	max-width: 500px;
	margin: 0 auto 40px;
	background-color: #f9f9f9;
	padding: 30px 20px 20px;
	text-align: center;
}
.account-page .address-list .info,
.account-page .order-list .info {
	margin: 0 0 30px;
	line-height: 30px;
	color: #555;
}
.account-page .address-list .info label,
.account-page .order-list .info label {
	vertical-align: baseline;
}
.account-page .address-list .buttons,
.account-page .order-list .buttons {
	border-top: 1px solid #eee;
	padding: 20px 0 0;
}
.account-page .address-list .button-2,
.account-page .order-list .button-2 {
	height: 30px;
	margin: 0 15px;
	padding: 0 0 0 30px;
	font-weight: 400;
}
/* background-color used to paint the sprite gutter; the icon is now a :before
   with its own #f9f9f9 plate, so painting the whole button in the accent left
   the accent-coloured label invisible on it. Transparent button, accent text.
   !important because theme.custom-2.css (generated by the accent picker, loads
   after every other sheet) hands these same four selectors BOTH
   "background-color: #00a651" and "color: #00a651" - accent on accent, so the
   label disappears again no matter what plain declaration we write here. */
.air-theme .account-page .address-list .button-2,
.air-theme .account-page .order-list .button-2 {
	background-color: transparent !important;
	font-size: 13px;
	color: #eda187;
}
.earth-theme .account-page .address-list .button-2,
.earth-theme .account-page .order-list .button-2 {
	background-color: transparent !important;
	font-size: 15px;
	color: #007c5a;
}
.account-page .edit-address-button {
}
.account-page .delete-address-button {
}
.account-page .order-details-button {
}
.account-page .return-items-button {
}
.account-page .add-button {
	text-align: center;
}
.account-page .edit-address {
	margin: 0 0 40px;
}

.account-page .data-table {
	border: none;
}
.account-page .data-table th {
	padding: 15px 20px;
	/*text-align: left;*/ /*Ie fix*/
}
.account-page .data-table td {
	border-bottom: 1px solid #eee;
	padding: 20px;
}

.recurring-payments .button-2 {
	padding: 5px 20px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .recurring-payments .button-2 {
	background-color: #eda187;
	font-size: 12px;
}
.earth-theme .recurring-payments .button-2 {
	background-color: #007c5a;
	font-size: 13px;
}
.recurring-payments .button-2:hover {
	opacity: 0.9;
}

.return-request-list-page .section,
.price-match-requests-page .section {
	max-width: 500px;
	margin: 0 auto 40px;
	background-color: #f9f9f9;
	padding: 30px 20px;
	text-align: center;
}
.return-request-list-page a,
.price-match-requests-page a {
	margin: 0 5px;
}
.return-request-list-page a + span {
	vertical-align: middle;
}
.air-theme .return-request-list-page a,
.air-theme .price-match-requests-page a {
	color: #eda187;
}
.earth-theme .return-request-list-page a,
.earth-theme .price-match-requests-page a {
	font-weight: 400;
	color: #007c5a;
}
.return-request-list-page .comments {
	margin: 15px 0 0;
}

.downloadable-products-page .data-table {
	margin: 20px 0 0;
}
.air-theme .downloadable-products-page .product a {
	color: #eda187;
}
.earth-theme .downloadable-products-page .product a {
	font-weight: 400;
	color: #007c5a;
}
.air-theme .downloadable-products-page .download a {
	color: #eda187;
}
.earth-theme .downloadable-products-page .download a {
	font-weight: 400;
	color: #007c5a;
}
.user-agreement-page .page-body {
	max-width: 500px;
	margin: 20px auto 0;
	background-color: #f9f9f9;
	padding: 20px;
}
.user-agreement-page .terms-of-agreement {
	margin: 0 0 20px;
	text-align: center;
}
.user-agreement-page .terms-of-agreement input {
	margin: 0 5px 0 0;
	vertical-align: baseline;
}
.user-agreement-page .buttons {
	border-top: 1px solid #eee;
	padding: 20px 0 0;
}

.back-in-stock-subscription-list-page .description,
.forum-subscriptions-page .description {
	margin: 0 0 35px;
	text-align: center;
}
.back-in-stock-subscription-list-page .data-table,
.forum-subscriptions-page .data-table {
	margin: 0 0 40px;
}
.back-in-stock-subscription-list-page .buttons,
.forum-subscriptions-page .buttons {
	margin: 40px 0 0;
}

.reward-points-overview {
	margin: 0 0 35px;
	text-align: center;
}
.reward-points-history {
	margin: 0 0 80px;
}
.reward-points-history .title {
	margin: 0 0 30px;
}
.reward-points-history .date {
	/*white-space: nowrap;*/
	text-align: left;
}

.change-password-page .page-body,
.check-gift-card-balance-page .page-body,
.vendorinfo-page .page-body {
	width: 600px;
	max-width: 100%;
	margin: auto;
	background-color: #f9f9f9;
	padding: 40px 20px;
}
.change-password-page .form-fields,
.check-gift-card-balance-page .form-fields,
.vendorinfo-page .form-fields {
	border: none;
	padding: 0 !important;
}

.avatar-page .message-error {
	margin: 0 0 15px;
}
.avatar-page .image {
	margin: 0 0 15px;
}
.avatar-page input[type="file"] {
	width: 175px;
	overflow: hidden;
}
.avatar-page .buttons {
	margin: 30px 0;
	font-size: 0;
}
.avatar-page .upload-avatar-button,
.avatar-page .remove-avatar-button {
	min-width: 140px !important;
	margin: 0 5px;
}
.avatar-page .remove-avatar-button {
	height: 50px;
	background-color: #aaa;
	padding: 0 20px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .avatar-page .remove-avatar-button {
	font-size: 14px;
}
.earth-theme .avatar-page .remove-avatar-button {
	font-size: 15px;
	line-height: 51px;
}
.avatar-page .remove-avatar-button:hover {
	opacity: 0.9;
}

.gdpr-tools-page .form-fields {
	margin: 0 0 25px;
}

.check-gift-card-balance-page .result {
	margin: 0 0 20px;
	text-align: center;
	font-weight: 400;
	color: #333;
}
.check-gift-card-balance-page .message-error {
	margin: 0 0 20px;
	text-align: center;
}

.multi-factor-authentication-page .description {
	margin: 0 0 40px;
}
.multi-factor-authentication-page .method-list {
	margin-bottom: 0 !important;
}
.multi-factor-authentication-page ul button {
	background: none !important;
	margin: 0 0 -10px;
}
.air-theme .save-customer-info-button {
	color: #eda187;
}
.earth-theme .save-customer-info-button {
	color: #007c5a;
}
.configure-provider table {
	margin: 15px 0;
	text-align: left;
}
.configure-provider table td {
	vertical-align: top;
}
.configure-provider .card-body {
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 25px 2% 20px;
}
.configure-provider .inputs {
	width: 100% !important;
}
.configure-provider .button-1 {
	color: #fff !important;
}

.vendorinfo-page .vendor-picture {
	margin: 15px 0 -15px;
	text-align: center;
}
.vendorinfo-page .vendor-picture button {
	display: none;
}

.account-page .no-data {
	text-align: center;
}

/* SHOPPING CART */

.order-progress {
	margin: 45px 0 -10px;
	font-size: 0;
}
.order-progress .active-step a {
	cursor: pointer;
}
.air-theme .order-progress .active-step a {
	background-color: #eda187;
}
.earth-theme .order-progress .active-step a {
	background-color: #007c5a;
}
.order-progress .inactive-step a {
	cursor: default;
}

.shopping-cart-page {
	margin: 30px 0 60px;
}
.shopping-cart-page .message-error {
	margin: 0 0 30px;
	text-align: center;
}

.shopping-cart-page .button-1,
.shopping-cart-page .button-2 {
	display: block;
	width: 100%;
	max-width: 290px;
	height: 55px;
	margin: 5px auto;
	padding: 0 20px;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.shopping-cart-page .button-1:hover,
.shopping-cart-page .button-2:hover {
	opacity: 0.9;
}
.air-theme .shopping-cart-page .button-1,
.air-theme .shopping-cart-page .button-2 {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .shopping-cart-page .button-1,
.earth-theme .shopping-cart-page .button-2 {
	background-color: #007c5a;
	font-size: 15px;
	letter-spacing: 0.5px;
}
.shopping-cart-page .continue-shopping-button {
	background-color: #aaa !important;
}
.shopping-cart-page button:before {
	content: "";
	display: inline-block;
	width: 35px;
	height: 35px;
	margin: 0 10px 0 -20px;
	vertical-align: middle;
}
.shopping-cart-page .update-cart-button:before {
}
.shopping-cart-page .continue-shopping-button:before {
}
.shopping-cart-page .estimate-shipping-button:before {
}
.shopping-cart-page .checkout-button:before {
}
.shopping-cart-page button span {
	vertical-align: middle;
}

.shopping-cart-page .tax-shipping-info {
	padding: 15px 20px;
}
.shopping-cart-page .item-box .tax-shipping-info {
	padding: 0;
}
.air-theme .shopping-cart-page .tax-shipping-info {
	font-size: 13px;
}

.cart-options {
	margin: 0 0 50px;
}
.cart-options .common-buttons {
	overflow: hidden;
	background-color: #f9f9f9;
	padding: 15px 20px;
	font-size: 0;
}
.cart-options .update-cart-button,
.cart-options .continue-shopping-button {
	text-align: left;
}
.cart-options .update-cart-button:before,
.cart-options .continue-shopping-button:before {
	margin: 0 10px 0 -5px;
}
.cart-options .checkout-attributes {
	margin: 40px 0;
}
.cart-options .checkout-attributes dt {
	margin: 0 0 5px;
	font-weight: 400;
	color: #555;
}
.cart-options .checkout-attributes dd + dt {
	margin-top: 15px;
}
.cart-options .checkout-attributes dd li {
	display: inline-block;
	margin: 5px;
}
.cart-options .checkout-attributes select,
.cart-options .checkout-attributes input[type="text"] {
	min-width: 200px;
	max-width: 94%;
	margin: 5px 0;
}
.cart-options .checkout-attributes .attribute-squares li {
	margin: 5px 0;
}
.cart-options .selected-checkout-attributes {
	margin: 20px 0;
}
.shopping-cart-page .selected-checkout-attributes {
	display: none;
}
.cart-estimate-shipping {
	margin: 40px 0;
}
.cart-estimate-shipping label {
	display: block;
	margin: 0 0 5px;
	font-weight: 400;
	color: #555;
}
.cart-estimate-shipping > a {
	display: inline-block;
	min-width: 200px;
	max-width: 94%;
	height: 40px;
	margin: 5px 0px;
	border: 1px solid #eee;
	background-color: #fff;
	padding: 0 25px 0 10px;
	text-align: left;
	line-height: 38px;
	color: #888;
}
.air-theme .cart-estimate-shipping > a {
	font-size: 12px;
}
.earth-theme .cart-estimate-shipping > a {
	font-size: 14px;
}

.cart-collaterals {
	max-width: 500px;
	margin: 0 auto 10px;
}
.cart-collaterals .title {
	margin: 0 0 15px;
	color: #333;
	text-transform: uppercase;
}
.cart-collaterals .hint {
	margin: 0 0 5px;
}
.cart-collaterals .coupon-code {
	overflow: hidden;
	font-size: 0;
}
.cart-collaterals .coupon-code input {
	display: block;
	width: 100%;
	max-width: 400px;
	margin: 0 auto 15px;
}
.cart-collaterals .coupon-code input:focus {
	border-color: #ddd;
}
.cart-collaterals .coupon-code button {
	width: auto;
	min-width: 180px;
	height: 40px;
}
.cart-collaterals .message-failure,
.cart-collaterals .message-success {
	margin: 5px 0 0;
}
.air-theme .cart-collaterals .message-failure,
.air-theme .cart-collaterals .message-success {
	font-size: 13px;
}
.earth-theme .cart-collaterals .message-failure,
.earth-theme .cart-collaterals .message-success {
	font-size: 15px;
}
.cart-collaterals .message-failure:before,
.cart-collaterals .message-success:before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 10px;
	margin: 0 5px 0 -10px;
}
.cart-collaterals .message-success:before {
}
.cart-collaterals .message-failure:before {
}
.cart-collaterals .current-code {
	margin: 5px 0 0;
}
.cart-collaterals .current-code span {
	vertical-align: middle;
}
.remove-discount-button,
.remove-gift-card-button {
	width: 22px;
	height: 22px;
	margin: 0 -5px 0 5px;
	border: none;
	border-radius: 50% !important;
	vertical-align: middle;
	cursor: pointer;
}
.air-theme .remove-discount-button,
.air-theme .remove-gift-card-button {
	background-color: #eda187;
}
.earth-theme .remove-discount-button,
.earth-theme .remove-gift-card-button {
	background-color: #007c5a;
}
.cart-collaterals .shipping-options {
	margin: 20px 0 0;
}
.cart-collaterals .shipping-options .buttons {
	margin: 25px 0 0;
}
.cart-collaterals .shipping-results {
	max-width: 440px;
	margin: 30px auto 0;
}
.cart-collaterals .shipping-results li {
	margin: 15px 0;
}
.cart-collaterals .shipping-results strong {
	display: block;
	margin: 0 10px 0 0;
	font-size: 15px;
	color: #555;
}

.cart-footer .totals {
	max-width: 500px;
	margin: 0 auto 30px;
	background-color: #f9f9f9;
	padding: 25px 20px;
}
.cart-footer .total-info {
	margin: 0 0 30px;
}
/* table-layout: fixed is what actually enforces the 50/50 split - without it
   the browser sizes columns to content, so a long shipping-method label eats
   the space the amount needs. Breakpoint files only set cell padding, never
   width or font-size, so these are safe in styles.css despite it having the
   lowest precedence of the six sheets. */
.cart-total {
	width: 100%;
	table-layout: fixed;
}
.cart-total .cart-total-left {
	width: 50%;
	padding: 5px 0;
	text-align: left;
	font-size: 13px;
	word-wrap: break-word;
}
.cart-total .cart-total-right {
	width: 50%;
	padding: 5px 0;
	text-align: right;
	font-size: 14px;
	font-weight: 400;
	color: #333;
	word-wrap: break-word;
}
.cart-total .remove-discount-button,
.cart-total .remove-gift-card-button {
	margin: 0 5px;
}
.cart-total .giftcard-remaining {
	display: none;
}
.cart-total .order-total td {
	position: relative;
	padding-top: 40px;
}
.cart-total .order-total td:before {
	content: "";
	position: absolute;
	top: 15px;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: #eee;
}
.air-theme .cart-total .order-total {
	font-size: 18px;
}
.earth-theme .cart-total .order-total {
	font-size: 20px;
}
.air-theme .cart-total .order-total strong {
	font-size: 22px;
	font-weight: 700;
}
.earth-theme .cart-total .order-total strong {
	font-size: 24px;
	font-weight: 700;
}
.terms-of-service {
	max-width: 350px;
	margin: 0 auto 30px;
	text-align: center;
}
.terms-of-service input {
	margin: 0 5px 0 0;
}
.air-theme .terms-of-service a {
	margin: 0 0 0 3px;
	color: #eda187;
}
.earth-theme .terms-of-service a {
	margin: 0 0 0 3px;
	color: #007c5a;
}
.cart-footer .addon-buttons {
	margin: 30px 0 0;
	text-align: center;
}
.product-grid.cross-sells {
	margin-top: 80px;
}

/* CHECKOUT */

.checkout-page .order-summary {
	margin: 80px 0 0;
}
.checkout-page .button-1 {
	min-width: 150px;
	height: 55px;
	padding: 0 20px;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.checkout-page .button-1:hover {
	opacity: 0.9;
}
.air-theme .checkout-page .button-1 {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .checkout-page .button-1 {
	background-color: #007c5a;
	font-size: 15px;
	letter-spacing: 0.5px;
}

.checkout-page .min-amount-warning {
	display: block;
	margin: 0 0 20px;
	text-align: center;
}
.checkout-page .address-list-page {
	display: none !important; /*currently unavailable*/
}

.checkout-page .address-item {
	max-width: 440px;
	margin: 0 auto 10px;
	padding: 25px 20px;
	background-color: #f9f9f9;
	text-align: center;
}
.checkout-page .address-box {
	margin: 0 0 25px;
	border-bottom: 1px solid #eee;
	padding: 0 0 30px;
}
.checkout-page .address-item li {
	padding: 2px 0;
	color: #555;
}
.air-theme .checkout-page .address-item {
	font-size: 13px;
}
.air-theme .checkout-page .address-item li.name {
	margin: 0 0 5px;
	font-size: 16px;
	font-weight: 700;
}
.earth-theme .checkout-page .address-item li.name {
	margin: 0 0 5px;
	font-size: 18px;
	font-weight: 400;
}
.checkout-page .address-item .select-button button {
	width: 100%;
	max-width: 290px;
}
.checkout-page .enter-address {
	max-width: 1000px;
	margin: 0 auto 20px;
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 25px 10px 20px;
}
.checkout-page .section:first-child .enter-address {
	border-top: none !important;
}

.checkout-page .pickup-in-store,
.checkout-page .ship-to-same-address {
	text-align: center;
}
.checkout-page .pickup-in-store input,
.checkout-page .ship-to-same-address input {
	margin: 0 5px 0 -10px;
}
.checkout-page .pickup-in-store label,
.checkout-page .ship-to-same-address label {
	color: #555;
	cursor: pointer;
}
.checkout-page .pickup-in-store .description {
	margin: 5px 0 0;
}
.air-theme .checkout-page .pickup-in-store .description {
	font-size: 13px;
}

.checkout-page .select-pickup-point {
	margin: -10px 0 0;
	border-top: 1px solid #eee;
	padding: 30px 20px;
	text-align: center;
}
.checkout-page .select-pickup-point label {
	display: block;
	margin: 0 0 15px;
	font-weight: 400;
	color: #555;
	text-transform: uppercase;
}
.checkout-page .select-pickup-point select {
	width: 100%;
	min-width: 280px;
}
.checkout-page .pickup-points-map {
	height: 350px;
	margin: 25px 0 0;
}

.shipping-method,
.payment-method {
	max-width: 640px;
	margin: auto;
	padding: 15px 20px 30px;
	background-color: #f9f9f9;
}
.shipping-method .method-list,
.payment-method .method-list {
	margin: 0 0 30px;
}
.shipping-method .method-list li,
.payment-method .method-list li {
	border-bottom: 1px solid #eee;
	padding: 20px 20px 25px;
}
.shipping-method .method-list li label,
.payment-method .method-list li label {
	margin: 0 0 0 5px;
	font-weight: 400;
	color: #555;
	text-transform: uppercase;
	cursor: pointer;
}
.shipping-method .method-description {
	margin: 5px 0 0 20px;
}
/*.payment-method .payment-description {
	display: none;
}*/
.payment-method .use-reward-points {
	margin: 0 0 30px;
	outline: 20px solid #fff;
	background-color: #fff;
	text-align: center;
}
.payment-method .use-reward-points input {
	margin: 0 5px 0 0;
	vertical-align: baseline;
}
.payment-info {
	max-width: 640px;
	margin: auto;
	padding: 15px 20px 30px;
	background-color: #f9f9f9;
}
.payment-info .info {
	margin: 0 0 30px;
	border-bottom: 1px solid #eee;
	padding: 15px 20px 30px;
	line-height: 25px;
}
.payment-info .info td {
	display: block;
	width: 100%;
	padding: 5px;
}
.payment-info .info td select,
.payment-info .info td input {
	min-width: 70px;
}
.payment-info #CreditCardType,
.payment-info #PurchaseOrderNumber {
	min-width: 230px;
}
.payment-info #CardholderName,
.payment-info #CardNumber {
	width: 100% !important;
}
.air-theme .payment-info .info p {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
}

.confirm-order .terms-of-service {
	width: 94%;
}
.confirm-order + .order-summary {
	margin: 60px 0 0;
}

.order-completed {
	max-width: 640px;
	margin: auto;
	padding: 30px 20px;
	background-color: #f9f9f9;
}
.order-completed .details {
	margin: 0 0 30px;
	border-bottom: 1px solid #eee;
	padding: 0 20px 30px;
	text-align: center;
}
.order-completed .details-link {
	display: block;
	margin: 15px 0 0;
}
.air-theme .order-completed .details a {
	color: #eda187;
}
.earth-theme .order-completed .details a {
	color: #007c5a;
	font-weight: 400;
}

.opc {
	width: 94%;
	margin: 30px auto 80px;
}
.opc > li {
	margin: 10px 0;
	background-color: #f9f9f9;
	padding: 20px;
}
.opc .step-title {
}
.opc .allow .step-title {
	cursor: pointer;
}
.opc .active .step-title {
}
.opc .step-title .number {
	display: none;
	width: 30px;
	height: 30px;
	margin: 0 10px 0 -5px;
	border-radius: 50%;
	text-align: center;
	vertical-align: middle;
	line-height: 30px;
	color: #fff;
	opacity: 0.5;
}
.air-theme .opc .step-title .number {
	background-color: #eda187;
	font-size: 13px;
}
.earth-theme .opc .step-title .number {
	background-color: #007c5a;
	font-size: 14px;
}
.opc .step-title .title {
	display: inline-block;
	vertical-align: middle;
	font-weight: 400;
	text-transform: uppercase;
	color: #333;
	opacity: 0.5;
}
.air-theme .opc .step-title .title {
	font-size: 14px;
}
.earth-theme .opc .step-title .title {
	font-size: 16px;
}
.opc .allow .step-title .number,
.opc .allow .step-title .title {
	opacity: 1;
}
.opc .step {
	margin: 20px 0 0;
	border-top: 1px solid #eee;
	padding: 20px 0 0;
	text-align: center;
}
.opc .section {
	margin: 0 auto 30px;
}
.opc .section > label {
	display: block;
	margin: 0 0 10px;
}
.air-theme .opc .section > label {
	font-size: 13px;
}
.opc input,
.opc select {
	max-width: 100%;
}
.opc .buttons {
	border-top: 1px solid #eee;
	padding: 25px 0 0;
}
.opc .button-1[style] {
	display: none !important;
}
.opc .back-link {
	margin: 0 0 15px;
	text-transform: uppercase;
}
.opc .back-link small {
	display: none;
}
.air-theme .opc .back-link a {
	color: #eda187;
}
.earth-theme .opc .back-link a {
	font-weight: 400;
	color: #007c5a;
}
.opc .please-wait {
	display: block;
	margin: 10px 0 0;
}

.opc .description {
	display: none;
}
.opc .shipping-method,
.opc .payment-method {
	padding: 0;
}
.opc .shipping-method ul,
.opc .payment-method ul {
	display: inline-block;
	margin: 0;
}
.opc .shipping-method li,
.opc .payment-method li {
	border: none;
	padding: 10px 0;
}
.opc .shipping-method li {
	text-align: center;
}
.opc .payment-method li {
	text-align: left;
}
.opc .payment-logo,
.opc .payment-details {
	display: inline-block;
	margin: 0 5px;
	vertical-align: middle;
}
.checkout-data .payment-logo {
	max-width: 60px;
}
.earth-theme .opc .shipping-method label,
.earth-theme .opc .payment-method label {
	font-weight: 300;
}
.opc .shipping-method .method-description {
	margin: 5px 0 0;
}
.opc .payment-method .use-reward-points {
	margin: 10px 0 20px;
	outline: none;
	background-color: transparent;
}
.opc .payment-info {
	max-width: none;
	padding: 0;
}
.opc .payment-info .info {
	margin: 0;
	border: none;
	padding: 0;
}
.opc .payment-info .info p {
	text-align: center !important;
}
.opc .order-review-data {
	margin: 0 0 30px;
}
.opc .order-review-data ul {
	outline: none;
	border-bottom: 1px solid #eee;
	background-color: #fff;
}
.opc .order-review-data li {
	background-color: #fff;
}
.opc .table-wrapper {
	background-color: #fff;
}
.opc .selected-checkout-attributes {
	text-align: center;
}
.opc .cart-footer .totals {
	float: none;
	border-bottom: 1px solid #eee;
	background-color: #fff;
}
.opc .captcha-box {
	margin-bottom: 30px;
}

/* ORDER DETAILS & RETURN REQUEST */

.order-review-data,
.order-details-area,
.shipment-details-area {
	margin: 0 0 60px;
	overflow: hidden;
}
.order-review-data ul,
.order-details-area ul,
.shipment-details-area ul {
	max-width: 440px;
	margin: 0 auto 10px;
	background-color: #f9f9f9;
	padding: 25px 20px;
	text-align: center;
}
.order-review-data li,
.order-details-area li,
.shipment-details-area li {
	padding: 2px 0;
	color: #555;
}
.air-theme .order-review-data li,
.air-theme .order-details-area li,
.air-theme .shipment-details-area li {
	font-size: 13px;
}
.order-review-data .title,
.order-details-area .title,
.shipment-details-area .title {
	margin: 20px 0 5px;
}
.order-review-data .title:first-child,
.order-details-area .title:first-child,
.shipment-details-area .title:first-child {
	margin-top: 0;
}
.air-theme .order-review-data li.title,
.air-theme .order-details-area li.title,
.air-theme .shipment-details-area li.title {
	font-size: 16px;
	font-weight: 700;
}
.earth-theme .order-review-data li.title,
.earth-theme .order-details-area li.title,
.earth-theme .shipment-details-area li.title {
	font-size: 18px;
	font-weight: 400;
}

.order-details-page .button-1,
.order-details-page .button-2 {
	min-width: 150px;
	height: 55px;
	margin: 5px;
	background-color: #aaa;
	padding: 0 20px;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.order-details-page .button-1:hover,
.order-details-page .button-2:hover {
	opacity: 0.9;
}
.air-theme .order-details-page .button-1,
.air-theme .order-details-page .button-2 {
	font-size: 14px;
}
.earth-theme .order-details-page .button-1,
.earth-theme .order-details-page .button-2 {
	font-size: 15px;
	letter-spacing: 0.5px;
}
.air-theme .order-details-page .button-1 {
	background-color: #eda187;
}
.earth-theme .order-details-page .button-1 {
	background-color: #007c5a;
}

.order-details-page,
.shipment-details-page {
	margin: 0 0 80px;
}
.order-details-page .buttons {
	margin: 50px 0 -20px;
	font-size: 0;
}
.order-details-page .buttons a {
	display: inline-block;
	min-width: 120px;
	height: 45px;
	padding: 0 20px;
	line-height: 45px;
}
.order-details-page .order-overview {
	margin: 0 0 40px;
	line-height: 26px;
}
.air-theme .order-overview > div {
	font-size: 13px;
}
.order-details-page .order-number {
	margin: 0 0 10px;
	text-transform: uppercase;
	color: #333;
}
.air-theme .order-details-page .order-number strong {
	font-size: 16px;
}
.earth-theme .order-details-page .order-number strong {
	font-size: 17px;
	font-weight: 400;
}
.earth-theme .order-details-page .order-total {
	margin: 10px 0 0;
}
.air-theme .order-details-page .order-total strong {
	color: #eda187;
}
.earth-theme .order-details-page .order-total strong {
	color: #007c5a;
}
.order-details-page .data-table th,
.shipment-details-page .data-table th {
	/*text-align: left;*/ /*Ie fix*/
}
.order-details-page .data-table a,
.shipment-details-page .data-table a {
	font-style: normal;
}
/* Keep each amount on a single line. The cart table already does this for
   `.cart td.unit-price` / `.cart td.subtotal`; the order-details product
   table never got it, so "5,25 € brez DDV" wrapped inside its own column
   even though the <col width="1"> means the column is shrink-to-fit. */
.order-details-page .data-table td.unit-price,
.order-details-page .data-table td.quantity,
.order-details-page .data-table td.total {
	white-space: nowrap;
}
.air-theme .order-details-page .shipments a {
	color: #eda187;
}
.earth-theme .order-details-page .shipments a {
	color: #007c5a;
}
.order-details-page .tax-shipping-info {
	margin: 0 0 10px;
}
.air-theme .order-details-page .options {
	font-size: 13px;
}
.order-details-page .totals {
	max-width: 500px;
	margin: 0 auto 30px;
	background-color: #f9f9f9;
	padding: 25px 20px;
}
.order-details-page .totals strong {
	color: #333 !important;
}
.order-details-page .actions {
	margin: 35px 0 0;
	overflow: hidden;
	font-size: 0;
}

.return-request-page {
	margin: 20px 0 80px;
}
.return-request-page .data-table a {
	font-weight: 400;
	color: #555;
}
.return-request-page .data-table select {
	min-width: 80px;
}
.return-request-page .section {
	margin: 0 0 60px;
}
.return-request-page .fieldset {
	margin: 0 0 30px;
}
.return-request-page .form-fields {
	max-width: 600px;
	margin: auto;
	background-color: #f9f9f9;
	padding: 20px;
}
.return-request-page .qq-upload-button {
	width: auto;
	height: 40px;
	border: 1px solid #eee;
	background-color: #fff;
	padding: 10px;
}

/* SEARCH & SITEMAP */

.search-page .search-input,
.forum-search-page .search-input {
	width: 600px;
	max-width: 100%;
	margin: auto;
	background-color: #f9f9f9;
	padding: 30px 20px;
}
.search-input .fieldset {
	margin: 0 0 30px;
}
.search-input input[type="checkbox"] {
	margin: 0 8px 0 -10px;
}
.search-input input + label {
	display: inline;
	margin: 0;
}
.advanced-search {
	margin: 30px 0 0;
	border-top: 1px solid #eee;
	padding: 30px 0 0;
}
.advanced-search .price-range {
	display: block;
}
.advanced-search .price-from,
.advanced-search .price-to {
	width: 49% !important;
	max-width: 150px;
}
.advanced-search .price-from {
	margin: 0 2% 0 0;
}
.search-results .warning,
.search-results .no-result {
	display: block;
	margin: 10px 0 0;
	text-align: center;
}
.search-results .warning {
	color: #ee2e56;
}
.search-results .no-result {
	color: #555;
}
.search-results {
	margin: 80px 0 0;
}

.sitemap-page {
	margin: 10px 0 70px;
}
.sitemap-page .description {
	margin: 0 0 40px;
}
.sitemap-page .entity {
	margin: 0 0 50px;
}
.sitemap-page .entity-title {
	margin: 0 0 15px;
	text-transform: uppercase;
	color: #333;
}
.air-theme .sitemap-page .entity-title h2 {
	font-size: 14px;
}
.earth-theme .sitemap-page .entity-title h2 {
	font-size: 16px;
	font-weight: 400;
}
.sitemap-page .entity-body {
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 15px;
}
.sitemap-page ul {
	font-size: 0;
}
.sitemap-page li {
	display: inline-block;
}
.sitemap-page li:after {
	content: "";
	display: inline-block;
	width: 1px;
	height: 18px;
	vertical-align: middle;
	background-color: #ddd;
}
.sitemap-page li:last-child:after {
	display: none;
}
.sitemap-page a {
	display: inline-block;
	margin: 0 10px;
	padding: 10px;
	vertical-align: middle;
}
.air-theme .sitemap-page a {
	font-size: 13px; /*reset zeroing*/
}
.earth-theme .sitemap-page a {
	font-size: 16px; /*reset zeroing*/
}
.sitemap-page a:hover {
	color: #333;
}

/* BLOG & NEWS */

.year strong {
	display: block;
	position: relative;
	padding: 10px 25px 10px 20px;
	font-weight: 400;
	color: #555;
	cursor: pointer;
}
.air-theme .year strong {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
}
.earth-theme .year strong {
	font-size: 15px;
}
.year strong.with-subcategories:after {
	content: "";
	position: absolute;
	right: 14px;
	width: 6px;
	height: 9px;
	transition: all 0.2s ease;
}
.air-theme .year strong.with-subcategories:after {
	top: 14px;
}
.earth-theme .year strong.with-subcategories:after {
	top: 17px;
}
.year strong.with-subcategories.opened:after {
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
.year .sublist li:last-child {
	margin: 0 0 5px;
}

.blog-page .post,
.news-items .news-item {
	margin: 0 auto 60px;
}
.post-head .post-title,
.news-head .news-title,
.blogpost-page .post-date,
.news-item-page .news-date {
	display: block;
	margin: 0 0 20px;
	/*border-bottom: 1px solid #eee;*/
	background-color: #f6f6f6;
	padding: 15px 10px;
	font-weight: 400;
	text-transform: uppercase;
	color: #555;
}
.post-head .post-date,
.news-head .news-date {
	display: block;
	margin: 0 0 10px;
	padding: 0 20px;
	color: #bbb;
}
.air-theme .post-head .post-date,
.air-theme .news-head .news-date {
	font-size: 12px;
}
.earth-theme .post-head .post-date,
.earth-theme .news-head .news-date {
	font-size: 14px;
	font-weight: 400;
}
.post-body,
.news-body {
	margin: 0 0 25px;
	padding: 0 20px;
	line-height: 26px;
}
.air-theme .post-body,
.air-theme .news-body {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
}
.air-theme .post-body a,
.air-theme .news-body a {
	color: #eda187;
}
.earth-theme .post-body a,
.earth-theme .news-body a {
	color: #007c5a;
}

.blog-links {
	margin: 0 0 30px;
	border-width: 1px 0;
	border-style: solid;
	border-color: #eee;
	padding: 10px 20px;
}
.blog-links .comments a,
.blog-links .tags ul {
	display: inline-block;
	position: relative;
	margin: 5px 15px;
	padding: 0 0 0 25px;
	vertical-align: middle;
}
.blog-links .comments a:before,
.blog-links .tags ul:before {
	content: "";
	position: absolute;
	left: 0;
	width: 20px;
	height: 20px;
}
.air-theme .blog-links .comments a:before,
.air-theme .blog-links .tags ul:before {
	top: -1px;
	background-color: #eda187;
}
.earth-theme .blog-links .comments a:before,
.earth-theme .blog-links .tags ul:before {
	top: 3px;
	background-color: #007c5a;
}
.blog-links .comments a:before {
}
.blog-links .tags ul:before {
}

.blog-page .tags label,
.blogpost-page .tags label {
	display: none;
}
.blog-page .tags ul,
.blogpost-page .tags ul {
	text-align: left;
	font-size: 0;
}
.blog-page .tags li,
.blogpost-page .tags li {
	display: inline-block;
}
.air-theme .blog-page .tags li,
.air-theme .blogpost-page .tags li {
	font-size: 13px;
}
.earth-theme .blog-page .tags li,
.earth-theme .blogpost-page .tags li {
	font-size: 16px;
}
.blog-page .tags li.separator,
.blogpost-page .tags li.separator {
	margin: 0 8px 0 2px;
}

.blog-posts .buttons,
.news-items .buttons {
	overflow: hidden;
	padding: 0 20px;
}
.blog-posts .read-more,
.news-items .read-more {
	display: inline-block;
	height: 40px;
	padding: 0 25px;
	line-height: 40px;
	text-transform: uppercase;
	color: #fff;
	transition: opacity 0.2s ease;
}
.air-theme .blog-posts .read-more,
.air-theme .news-items .read-more {
	background-color: #eda187;
	font-size: 12px;
}
.earth-theme .blog-posts .read-more,
.earth-theme .news-items .read-more {
	background-color: #007c5a;
	font-size: 13px;
	font-weight: 400;
}
.blog-posts .read-more:hover,
.news-items .read-more:hover {
	opacity: 0.9;
}

.new-comment {
	margin: 60px 0 80px;
}
.new-comment .notifications {
	margin: 0 0 15px;
	text-align: center;
}
.new-comment form {
	width: 600px;
	max-width: 100%;
	margin: auto;
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 40px 20px;
}
.new-comment .form-fields {
	margin: 0 0 40px;
}
.new-comment .button-1 {
	min-width: 150px;
	height: 50px;
	padding: 0 30px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .new-comment .button-1 {
	background-color: #eda187;
	font-size: 14px;
}
.earth-theme .new-comment .button-1 {
	background-color: #007c5a;
	font-size: 15px;
	line-height: 51px; /*firefox line-height bug fix*/
}
.new-comment .button-1:hover {
	opacity: 0.9;
}

.comment-list {
	margin: 0 0 80px;
}
.comment-list .title {
	margin: 0 0 15px;
	color: #555;
	text-transform: uppercase;
}
.comment-list .title strong {
	font-weight: 400;
}
.blog-comment,
.news-comment {
	margin: 0 0 -1px;
	border-width: 1px 0;
	border-style: solid;
	border-color: #eee;
	padding: 20px;
}
.comment-info {
	width: 200px;
	margin: 0 auto 10px;
}
.comment-info .username {
	display: block;
	margin: 0 0 15px;
	text-align: center;
	color: #555;
	text-transform: uppercase;
}
.air-theme .comment-info .username {
	font-size: 12px;
}
.earth-theme .comment-info .username {
	font-size: 14px;
	font-weight: 400;
}
.comment-info .avatar {
	position: relative;
	overflow: hidden;
	padding-top: 100%;
}
.comment-info .avatar a {
	display: block;
}
.comment-info .avatar img {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
.comment-time {
	margin: 0 0 10px;
	font-size: 0;
	color: #bbb;
}
.comment-time label {
	display: none;
}
.air-theme .comment-time span {
	font-size: 12px;
}
.earth-theme .comment-time span {
	font-size: 14px;
}
.comment-title {
	display: none;
	margin: 0 0 10px;
	color: #555;
}
.air-theme .comment-title strong {
	font-weight: 700;
}
.earth-theme .comment-title strong {
	font-weight: 400;
}
.air-theme .comment-body {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
	line-height: 26px;
}
.earth-theme .comment-body {
	line-height: 26px;
}

.news-list-homepage {
	margin: 0 0 60px;
	padding: 50px 0;
}
.air-theme .news-list-homepage {
	background: url("../img/news-banner-1.jpg") center top repeat-y;
}
.earth-theme .news-list-homepage {
	background: url("../img/news-banner-2.jpg") center top repeat-y;
}
.news-list-homepage .title {
	margin: 0 0 60px;
}
.news-list-homepage .title strong {
	color: #fff;
}
.news-list-homepage .news-items {
	width: 94%;
	margin: auto;
}
.news-list-homepage .news-item {
	display: none;
	margin: 0 auto 50px;
	border: 15px solid #fff;
	background-color: #f6f6f6;
	padding: 40px 20px;
	text-align: left;
}
.news-list-homepage .news-item:first-child {
	display: block;
}
.news-list-homepage .news-title {
	padding: 0 !important;
	color: #333;
}
.news-list-homepage .news-date {
	padding: 0 !important;
}
.news-list-homepage .news-body {
	max-height: 130px;
	overflow: hidden;
	padding: 0 !important;
}
.news-list-homepage .buttons {
	padding: 0 !important;
	text-align: left;
}
/* .news-items .read-more (styles.css:5977, unrelated/pre-existing) also
   matches this exact element via ancestor overlap and gives it button
   styling - height:40px, uppercase, accent background. The user wants a
   plain text link + icon here, not a button, so background/height/padding/
   text-transform are explicitly reset. !important because .news-items'
   air/earth-scoped background-color and theme.custom-2.css's accent text
   colour are both equal-or-higher specificity. */
.news-list-homepage .read-more {
	height: auto;
	padding: 0 110px 0 0;
	line-height: normal;
	text-transform: none;
	background-color: transparent !important;
}
.air-theme .news-list-homepage .read-more,
.earth-theme .news-list-homepage .read-more {
	background-color: transparent !important;
	color: var(--el-accent, #00a651) !important;
}
.news-list-homepage .view-all {
	text-align: center;
}
.news-list-homepage .view-all a {
	padding: 0 16px;
	font-weight: 400;
	color: #fff;
}
.air-theme .news-list-homepage .view-all a {
}
.earth-theme .news-list-homepage .view-all a {
}

/* FORUM & PROFILE */

.forum-page .forum-name,
.forum-topic-page .topic-name,
.forums-main-page .topic-block-title,
.forum-group-page .forums-table-section-title,
.active-discussions-page .forums-table-section-title {
	margin: 50px 0 60px;
	text-align: center;
}
.forum-page .forum-name h1,
.forum-topic-page .topic-name h1,
.forums-main-page .topic-block-title h2,
.forum-group-page .forums-table-section-title a,
.active-discussions-page .forums-table-section-title strong {
	display: block; /*prevents a bug with absolute pseudo elements inside inline elements*/
	position: relative;
	color: #333;
	text-transform: uppercase;
}
.air-theme .forum-page .forum-name h1,
.air-theme .forum-topic-page .topic-name h1,
.air-theme .forums-main-page .topic-block-title h2,
.air-theme .forum-group-page .forums-table-section-title a,
.air-theme .active-discussions-page .forums-table-section-title strong {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 2px;
}
.earth-theme .forum-page .forum-name h1,
.earth-theme .forum-topic-page .topic-name h1,
.earth-theme .forums-main-page .topic-block-title h2,
.earth-theme .forum-group-page .forums-table-section-title a,
.earth-theme .active-discussions-page .forums-table-section-title strong {
	font-size: 24px;
	font-weight: 400;
}
.forum-page .forum-name h1:after,
.forum-topic-page .topic-name h1:after,
.forums-main-page .topic-block-title h2:after,
.forum-group-page .forums-table-section-title a:after,
.active-discussions-page .forums-table-section-title strong:after {
	content: "";
	position: absolute;
	bottom: -18px;
	left: 50%;
	width: 80px;
	height: 4px;
	margin: 0 0 0 -40px;
}
.air-theme .forum-page .forum-name h1:after,
.air-theme .forum-topic-page .topic-name h1:after,
.air-theme .forums-main-page .topic-block-title h2:after,
.air-theme .forum-group-page .forums-table-section-title a:after,
.air-theme .active-discussions-page .forums-table-section-title strong:after {
	background-color: #eda187;
}
.earth-theme .forum-page .forum-name h1:after,
.earth-theme .forum-topic-page .topic-name h1:after,
.earth-theme .forums-main-page .topic-block-title h2:after,
.earth-theme .forum-group-page .forums-table-section-title a:after,
.earth-theme .active-discussions-page .forums-table-section-title strong:after {
	background-color: #007c5a;
}

/* forum header */

.forums-header {
	margin: 0 0 80px;
}
.current-time {
	margin: 0 0 15px;
	text-align: center;
	color: #555;
	text-transform: uppercase;
}
.air-theme .current-time {
	font-size: 13px;
}
.earth-theme .current-time {
	font-size: 15px;
}
.forum-search-box form {
	width: 90%;
	max-width: 400px;
	height: 50px;
	margin: auto;
	border-width: 2px 0;
	padding: 0 50px 0 0;
}
.forum-search-box .basic {
	height: 100%;
}
.forum-search-box .search-box-text {
	padding: 0 10px !important;
}
.air-theme .forum-search-box .search-box-text {
	font-size: 15px !important;
}
.earth-theme .forum-search-box .search-box-text {
	font-size: 17px !important;
}
.forum-search-box .search-box-button {
	width: 50px;
	border: none;
}
.forum-search-box .advanced {
	position: absolute;
	top: 60px;
	left: 0;
	width: 100%;
	text-align: center;
}
.air-theme .forum-search-box .advanced {
	color: #eda187;
}
.earth-theme .forum-search-box .advanced {
	font-weight: 400;
	color: #007c5a;
	text-transform: lowercase;
}

/* forum group */

.forums-table-section {
	margin: 0 0 50px;
}
.forums-table-section-title {
	margin: 0 0 15px;
	text-align: center;
	color: #555;
	text-transform: uppercase;
}
.air-theme .forums-table-section-title > a,
.air-theme .forums-table-section-title strong {
	font-size: 16px;
}
.earth-theme .forums-table-section-title > a,
.earth-theme .forums-table-section-title strong {
	font-size: 18px;
	font-weight: 400;
}
.forums-table-section th.forum-details {
	padding: 15px 20px;
}
.forums-table-section td {
	border-bottom: 1px solid #eee;
	text-align: center;
}
.air-theme .forums-table-section td {
	font-size: 13px;
}
.forums-table-section .image div {
	width: 50px;
	height: 35px;
	margin: auto;
}
.forums-table-section .image div.sticky {
}
.forums-table-section .image div.announcement {
}
.forums-table-section .forum-title,
.forums-table-section .topic-title {
	font-weight: 400;
	text-transform: uppercase;
	color: #555;
}
.air-theme .forums-table-section .forum-title,
.air-theme .forums-table-section .topic-title {
	margin: 0 0 5px;
	font-size: 14px;
}
.forums-table-section .topic-type {
	display: none;
}
.forums-table-section .latest-post {
	white-space: nowrap;
}
.forums-table-section .view-all {
	background-color: #f9f9f9;
	padding: 15px;
	text-align: center;
}
.forums-table-section .view-all a {
	display: inline-block;
	min-width: 80px;
	height: 40px;
	padding: 0 20px;
	line-height: 40px;
	font-weight: 400;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .forums-table-section .view-all a {
	background-color: #eda187;
	font-size: 12px;
}
.earth-theme .forums-table-section .view-all a {
	background-color: #007c5a;
	font-size: 14px;
}
.forums-table-section .view-all a:hover {
	opacity: 0.9;
}
.active-discussions .pager.upper {
	display: none;
}

/* forum-page, topic-page */

.forum-page .forum-description {
	margin: -20px 0 40px;
	text-align: center;
}
.forum-actions,
.topic-actions {
	margin: 0 0 20px;
	text-align: center;
	font-size: 0;
}
.forum-actions .actions a,
.topic-actions .actions a {
	display: inline-block;
	min-width: 120px;
	height: 40px;
	margin: 0 5px 10px;
	padding: 0 20px;
	font-size: 14px;
	line-height: 40px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .forum-actions .actions a,
.air-theme .topic-actions .actions a {
	background-color: #eda187;
}
.earth-theme .forum-actions .actions a,
.earth-theme .topic-actions .actions a {
	background-color: #007c5a;
	font-weight: 400;
}
.forum-actions .actions a:hover,
.topic-actions .actions a:hover {
	opacity: 0.9;
}
.forum-actions .pager.upper,
.topic-actions .pager.upper {
	display: none;
}
.topic-actions.lower .actions {
	display: none;
}

/* topic post */

.topic-post {
	margin: 0 0 50px;
}
.topic-post .post-info {
	margin: 0 0 30px;
}
.topic-post .username {
	display: block;
	border-bottom: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 10px 0;
	line-height: 25px;
	font-weight: 400;
	color: #555;
}
.topic-post .avatar {
	position: relative;
	width: 150px;
	height: 150px;
	margin: 20px auto;
	overflow: hidden;
}
.topic-post .avatar img {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
.topic-post .user-stats li {
	display: inline-block;
	margin: 0 10px;
}
.air-theme .topic-post .user-stats li {
	font-size: 12px;
	line-height: 20px;
}
.topic-post .pm-button,
.profile-info-box .pm-button {
	display: inline-block;
	margin: 5px 0 0;
	padding: 0 20px;
	font-size: 14px;
	text-transform: uppercase;
	color: #fff;
	transition: opacity 0.2s ease;
}
.air-theme .topic-post .pm-button,
.air-theme .profile-info-box .pm-button {
	color: #eda187;
}
.earth-theme .topic-post .pm-button,
.earth-theme .profile-info-box .pm-button {
	color: #007c5a;
	font-weight: 400;
}
.topic-post .pm-button:hover,
.profile-info-box .pm-button:hover {
	opacity: 0.9;
}
.topic-post .pm-button:before,
.profile-info-box .pm-button:before {
	content: "";
	display: inline-block;
	width: 25px;
	height: 25px;
	margin: 0 5px 0 -5px;
	vertical-align: middle;
}
.air-theme .topic-post .pm-button:before,
.air-theme .profile-info-box .pm-button:before {
	background-color: #eda187;
}
.earth-theme .topic-post .pm-button:before,
.earth-theme .profile-info-box .pm-button:before {
	background-color: #007c5a;
}
.topic-post .pm-button span,
.profile-info-box .pm-button span {
	vertical-align: middle;
	line-height: 40px;
}

.topic-post .post-head {
	border-bottom: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 10px 0;
}
.topic-post .post-time {
	display: none;
	line-height: 25px;
}
.topic-post .post-time label,
.topic-post .post-time span {
	vertical-align: baseline;
}
.topic-post .post-actions {
	font-size: 0;
}
.topic-post .post-actions > div {
	display: inline-block;
}
.topic-post .post-actions a {
	display: inline-block;
	margin: 0 5px;
}
.topic-post .post-actions a:before {
	content: "";
	display: inline-block;
	width: 25px;
	height: 25px;
	margin: 0 5px 0 0;
	vertical-align: middle;
}
.air-theme .topic-post .post-actions a:before {
	background-color: #eda187;
}
.earth-theme .topic-post .post-actions a:before {
	background-color: #007c5a;
}
.topic-post .post-actions .edit-post-button:before {
}
.topic-post .post-actions .delete-post-button:before {
}
.topic-post .post-actions .quote-post-button:before {
}
.topic-post .post-actions .post-link-button {
	vertical-align: middle;
}
.air-theme .topic-post .post-actions .post-link-button {
	font-size: 13px; /*reset zeroing*/
	color: #eda187;
}
.earth-theme .topic-post .post-actions .post-link-button {
	font-size: 15px; /*reset zeroing*/
	color: #007c5a;
}
.topic-post .post-actions .post-link-button:before {
	display: none !important;
}
.topic-post .post-actions a span {
	display: inline-block;
	height: 25px;
	vertical-align: middle;
	line-height: 25px;
	color: #555;
}
.air-theme .topic-post .post-actions a span {
	font-size: 13px; /*reset zeroing*/
}
.earth-theme .topic-post .post-actions a span {
	font-size: 15px; /*reset zeroing*/
}

.topic-post .post-body {
	/*topic post-body also gets style from blog post-body*/
	margin: 0;
	padding: 20px 20px 0;
}
.topic-post .post-body b,
.topic-post .post-body strong {
	color: #555;
}
.topic-post .user-posted-image,
.latest-posts .user-posted-image {
	max-width: 100%;
	height: auto;
}
.topic-post .quote,
.latest-posts .quote {
	margin: 10px 0 0;
	border-bottom: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 20px;
}
.topic-post .post-vote {
	margin: 20px 0 0;
	overflow: hidden;
}
.topic-post .post-vote span {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #aaa;
	vertical-align: middle;
}
.topic-post .post-vote .vote.up {
}
.topic-post .post-vote .vote.down {
}
.topic-post .post-vote strong {
	margin: 0 10px;
	vertical-align: middle;
	font-weight: 400;
}
.air-theme .topic-post .post-vote strong {
	color: #eda187;
}
.earth-theme .topic-post .post-vote strong {
	color: #007c5a;
}
.topic-post .signature {
	margin: 25px 0 0;
	border-top: 1px solid #eee;
	padding: 15px 0 0;
	font-style: italic;
	color: #aaa;
}

/* forum edit & send message */

.forum-edit-page .page-body,
.move-topic-page .page-body,
.private-message-send-page .page-body {
	width: 600px;
	max-width: 100%;
	margin: auto;
	background-color: #f9f9f9;
	padding: 30px 20px;
}
.forum-edit-page .inputs:first-child {
	display: none;
}
.forum-edit-page strong {
	display: block;
	border-bottom: 1px solid #eee;
	padding: 0 0 10px;
}
.forum-edit-page strong,
.private-message-send-page a {
	font-size: 18px;
	font-weight: 400;
	color: #555;
	text-transform: uppercase;
}
.forum-edit-page .buttons,
.move-topic-page .buttons,
.private-message-send-page .buttons {
	margin: -10px 0 0;
	text-align: center;
	font-size: 0;
}
.forum-edit-page .buttons button,
.move-topic-page .buttons button,
.private-messages .buttons button {
	display: block;
	width: 90%;
	max-width: 300px;
	height: 50px;
	margin: 5px auto;
	background-color: #aaa;
	padding: 0 20px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}
.air-theme .forum-edit-page .buttons button,
.air-theme .move-topic-page .buttons button,
.air-theme .private-messages .buttons button {
	font-size: 14px;
}
.earth-theme .forum-edit-page .buttons button,
.earth-theme .move-topic-page .buttons button,
.earth-theme .private-messages .buttons button {
	font-size: 15px;
	line-height: 51px;
}
.forum-edit-page .buttons button:hover,
.move-topic-page .buttons button:hover,
.private-messages .buttons button:hover {
	opacity: 0.9;
}
.forum-edit-page .toolbar,
.private-message-send-page .toolbar {
	margin: 0 0 12px;
}
.forum-edit-page .inputs.reversed label {
	margin: 5px 0 0;
	white-space: normal;
}

/* inbox & view message */

.private-messages-page {
	margin: 20px 0 80px;
}
.private-messages-page .ui-tabs-panel {
	background-color: transparent;
	padding: 0 !important;
}
.private-messages-page th {
	/*text-align: left;*/ /*Ie fix*/
}
.air-theme .private-messages-page td.date {
	font-size: 13px;
	white-space: nowrap;
}
.earth-theme .private-messages-page td.date {
	font-size: 15px;
	white-space: nowrap;
}
.air-theme .private-messages-page .pm-unread {
	color: #eda187;
}
.earth-theme .private-messages-page .pm-unread {
	font-weight: 400;
	color: #007c5a;
}
.private-messages-page .buttons {
	background-color: #f9f9f9;
	padding: 15px 20px;
	font-size: 0;
}
.air-theme .private-messages-page button.button-1 {
	background-color: #eda187;
}
.earth-theme .private-messages-page button.button-1 {
	background-color: #007c5a;
}

.private-message-send-page .inputs:first-child label {
	display: none;
}

.private-message-view-page .message-head {
	border-bottom: 1px solid #eee;
	padding: 0 0 30px;
	text-align: center;
}
.private-message-view-page .message-head li {
	margin: 5px 0;
}
.private-message-view-page .message-head .sender span,
.private-message-view-page .message-head .recipient span {
	color: #333;
}
.private-message-view-page .message-body {
	padding: 30px 15px;
	text-align: justify;
	line-height: 26px;
}
.private-message-view-page .buttons {
	border-top: 1px solid #eee;
	background-color: #f9f9f9;
	padding: 20px;
	font-size: 0;
}
.air-theme .private-message-view-page button.reply-pm-button {
	background-color: #eda187;
}
.earth-theme .private-message-view-page button.reply-pm-button {
	background-color: #007c5a;
}
.private-message-view-page button.back-pm-button {
	margin: 20px auto 0;
	background-color: transparent;
	padding: 0;
	color: #888;
}

/* profile page  */

.profile-page {
	margin: 20px 0 80px;
}
.profile-page .ui-tabs-panel {
	background-color: transparent;
	padding: 0 !important;
}
.profile-info-box {
	overflow: hidden;
	text-align: center;
}
.profile-info-box .avatar {
	margin: 0 0 15px;
}
.profile-info-box .title {
	margin: 0 0 10px;
	text-transform: uppercase;
	color: #555;
}
.profile-info-box .pm-button {
	margin: 15px 0 0;
}
.profile-page .topic {
	margin: 0 0 40px;
}
.profile-page .topic-title {
	margin: 0 0 10px;
	border-bottom: 1px solid #eee;
	background: #f9f9f9;
	padding: 15px 20px;
	text-transform: uppercase;
}
.profile-page .topic-title a {
	margin: 0 0 0 3px;
	color: #555;
}
.air-theme .profile-page .topic-title a {
	font-weight: 700;
}
.earth-theme .profile-page .topic-title a {
	font-weight: 400;
}
.profile-page .topic-body {
	padding: 10px 20px;
	line-height: 26px;
}
.air-theme .profile-page .topic-body {
	font-family: "Raleway", sans-serif;
	font-size: 13px;
}
.profile-page .topic-data {
	padding: 10px 20px;
}
.profile-page .topic-data span {
	color: #555;
}

/*Upraded CSS */
.wishlist-page .button-row {
	display: flex;
	flex-wrap: wrap;
	gap: 15px 10px;
}
.wishlist-page .button-row .button-2 {
	min-width: 150px;
	height: 50px;
	padding: 0 25px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
	font-size: 14px;
	background-color: #eda187;
}
.add-wishlist-content .wishlist-add-custom-button {
	height: 40px;
	padding: 0 25px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
	font-size: 14px;
	background-color: #eda187;
}
.wishlist-page .no-data {
	margin: 20px 0;
	text-align: center;
}
.block .title {
	font-weight: 400;
}
.order-filters .order-filters__label {
	margin-right: 5px;
}
.custom-wishlist {
	margin-top: 5px;
}
.custom-wishlist .td-title {
	margin-bottom: 5px;
}
.custom-wishlist .custom-wishlist-dropdown {
	width: 100px;
}
.html-account-page .block .list li#newTicket {
	border: 0;
	margin: 2px 1px 0;
	padding-top: 0;
}
.change-password-recovery-link {
	margin-top: 5px;
}
.earth-theme .change-password-recovery-link {
	font-size: 15px;
}
.air-theme .change-password-recovery-link {
	font-size: 12px;
}
.change-password-recovery-link a:hover {
	color: #555;
}
.home-page-search-filter .page-title,
.home-page-search-filter .page-title h1 {
	position: initial;
	background: transparent !important;
	color: #333;
	height: auto;
}
.home-page-search-filter .page-title {
	margin-bottom: 60px;
}
.home-page-search-filter .page-title h1 {
	position: relative;
	bottom: 0;
}
.home-page-search-filter .advanced-search {
	background: #f9f9f9;
	padding: 30px;
	border: 0;
}
.home-page-search-filter .advanced-search-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 15px 10px;
	align-items: end;
}
.home-page-search-filter .search-button-flv,
.search-by-filter-wrapper .buttons .search-button-flv {
	min-width: 150px;
	height: 50px;
	padding: 0 30px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
	font-size: 14px;
	background-color: #eda187;
}
.home-page-search-filter .search-input .buttons {
	border: 0;
	padding: 0;
}
.filter-advanced-search .advanced-search {
	padding: 0;
	border: 0;
	margin: 0 0 30px 0;
}
.product-filter-level-values-box .title {
	text-align: center;
	margin-bottom: 60px;
}
.product-filter-level-values-box .sub-title {
	font-size: 16px;
	margin-bottom: 15px;
	font-weight: 400;
	color: #333;
}
.order-filters {
	margin-bottom: 15px;
}
/* RFQ CSS */
.html-rfq-requests-page .request-list-page .section {
	max-width: 500px;
	margin: 0 auto 40px;
	background-color: #f9f9f9;
	padding: 30px 20px 20px;
	text-align: center;
}
.html-rfq-requests-page .request-list-page .info {
	margin: 0 0 30px;
	line-height: 30px;
	color: #555;
	background: transparent;
	border: 0;
	padding: 0;
}
.html-rfq-requests-page .request-list-page .section .title {
	font-weight: 400;
	font-size: 16px;
	margin-bottom: 20px;
}
.html-rfq-requests-page .request-list-page .section .buttons {
	position: initial;
	border-top: 1px solid #eee;
	padding: 20px 0 0;
}
/* same invisible-label case as the account list buttons above */
.html-rfq-requests-page .request-list-page .buttons .button-2 {
	height: 30px;
	margin: 0 15px;
	padding: 0 0 0 30px;
	font-weight: 400;
	background-color: transparent;
	font-size: 15px;
	color: #007c5a;
}
.html-shopping-cart-page .rfq-button-2 {
	min-width: 150px;
	height: 50px;
	padding: 0 30px;
	color: #fff;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
	background-color: #007c5a;
	font-size: 15px;
	line-height: 51px;
}
.html-shopping-cart-page .rfq-button-2:hover {
	opacity: 0.9;
	background-color: #007c5a;
}
.html-rfq-request-page .request-page .data-table th:first-child {
	width: auto;
}
.html-rfq-request-page .request-page .form-fields {
	border-top: 0;
}
.html-rfq-request-page .request-page .fieldset .title {
	font-size: 18px;
	font-weight: 400;
}
.html-shopping-cart-page .totals .checkout-buttons:last-child {
	text-align: center;
}
.shopping-cart-page .rfq-button-2,
.checkout-page .rfq-button-2 {
	width: 100%;
	min-width: 150px;
	max-width: 290px;
	height: 55px;
	margin: 5px auto;
	padding: 0 20px 0 20px;
	line-height: 50px;
	text-transform: uppercase;
	white-space: nowrap;
	transition: all 0.2s ease;
	color: #555;
	font-size: 15px;
	letter-spacing: 0.5px;
	font-weight: 400;
	margin: 0;
}
.shopping-cart-page .rfq-button-2 {
	background-color: #fff;
}
.checkout-page .rfq-button-2 {
	background-color: #f9f9f9;
}
.shopping-cart-page .rfq-button-2:hover,
.checkout-page .rfq-button-2:hover {
	background-color: #007c5a;
	color: #fff;
	opacity: 1;
}
.nop-jcarousel .item-box .product-title,
.earth-theme.variant-1 .spc-categories .item-box .product-title {
	z-index: 1;
}

/* ====================================================================== */
/* PRODUCT DETAILS FACELIFT                                               */
/* Override layer appended on top of the legacy product page rules above.  */
/* The accent token is fed by the theme preset                             */
/* (Plugins/SevenSpikes.Theme.Element/Styles/Less/preset.less).            */
/* ====================================================================== */

.product-details-page {
	--pd-accent: var(--el-accent, #007c5a);
	--pd-accent-soft: #eef8f1;
	--pd-ink: #111827;
	--pd-ink-2: #4b5563;
	--pd-ink-3: #6b7684;
	--pd-line: #e3e7ec;
	--pd-line-strong: #cfd7e2;
	--pd-surface: #fff;
	--pd-surface-2: #f8fafc;
	--pd-radius: 12px;
	--pd-radius-sm: 8px;
	--pd-shadow: 0 6px 20px rgba(22, 32, 51, 0.07);
	--pd-shadow-lift: 0 14px 34px rgba(22, 32, 51, 0.12);
	--pd-danger: #d0342c;
}
/* Intrinsic sizing for the inline SVGs/markers added to the shared product partials
   (_SKU_Man_GTIN_Ven, _DeliveryInfo, _AddToWishlist, _Availability,
   _ProductReviewOverview). These partials are also rendered by QuickView, AjaxCart's
   mini product details and the compare page - i.e. OUTSIDE .product-details-page - so
   the sizing must not be scoped to it, or the SVGs fall back to their default
   intrinsic size and render enormous. Colours stay tokenised with literal fallbacks. */
.pd-icon {
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	vertical-align: -3px;
	color: var(--pd-ink-3, #6b7684);
}
.pd-icon svg,
.es-icon svg {
	width: 100%;
	height: 100%;
}
.es-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
}
.product-review-box .rating-star {
	display: inline-flex;
	width: 17px;
	height: 17px;
}
.product-review-box .rating-star svg {
	width: 100%;
	height: 100%;
}
.availability .stock-dot {
	display: inline-block;
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: currentColor;
}
img.manufacturer-logo {
	width: auto;
	height: auto;
	max-width: 120px;
	max-height: 48px;
}
/* QuickView reuses _ProductManufacturers, but the popup has no room for a brand
   logo - show the manufacturer name only there (.quickView is the popup wrapper) */
.quickView .manufacturers img.manufacturer-logo {
	display: none;
}

/* --- hero ------------------------------------------------------------- */

.product-details-page .product-essential {
	margin: 0 0 40px;
}
.product-details-page .gallery {
	margin: 0 0 28px;
}
.product-details-page .gallery .picture,
.product-details-page .gallery .picture-wrapper .picture {
	width: 100%;
	border: 1px solid var(--pd-line);
	border-radius: var(--pd-radius);
	background-color: var(--pd-surface);
}
.product-details-page .gallery .picture-thumbs > li,
.product-details-page .gallery .picture-thumbs > .picture-thumb {
	border: 0;
}
.product-details-page .gallery .picture-thumbs a,
.product-details-page .gallery .picture-thumbs .thumb-item {
	border: 1px solid var(--pd-line);
	border-radius: var(--pd-radius-sm);
	background-color: var(--pd-surface);
}
.product-details-page .gallery .picture-thumbs a:hover,
.product-details-page .gallery .picture-thumbs .thumb-item:hover,
.product-details-page .gallery .picture-thumbs .cloudzoom-gallery-active {
	border-color: var(--pd-accent);
	box-shadow: 0 0 0 1px var(--pd-accent);
}
.product-details-page .overview {
	margin: 0 0 28px;
	text-align: left;
	font-size: 15px;
	line-height: 1.55;
}
.air-theme .product-details-page .overview,
.earth-theme .product-details-page .overview {
	font-size: 15px;
}

/* --- headline: title + manufacturer logo ------------------------------ */

.product-details-page .product-name-heading {
	align-items: flex-start;
	gap: 12px 24px;
	margin: 0 0 12px;
}
.product-details-page .product-name-heading h1 {
	font-size: 30px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--pd-ink);
}
.air-theme .product-details-page .product-name-heading h1 {
	font-size: 28px;
}
.product-details-page .product-name-heading .manufacturers {
	display: flex;
	align-items: center;
	margin: 0;
	font-size: 13px;
}
.product-details-page .product-name-heading .manufacturers .label {
	display: none;
}
.product-details-page .product-name-heading .manufacturers .value {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 16px;
}
/* logo on the left, manufacturer name on its right */
.product-details-page .manufacturer-item {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	transition: opacity 0.2s ease;
}
.product-details-page .manufacturer-item:hover {
	opacity: 0.8;
}
.product-details-page img.manufacturer-logo {
	display: block;
	width: auto;
	height: auto;
	max-width: 120px;
	max-height: 48px;
}
.product-details-page .manufacturer-name {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--pd-ink-2) !important;
}

/* --- headline meta row: rating + article number ----------------------- */

/* the review/rating line gets a row of its own, the SKU/unit details sit below it */
.product-details-page .product-headline-meta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	margin: 0 0 18px;
}
.product-details-page .product-headline-meta .product-reviews-overview,
.product-details-page .product-headline-meta .additional-details {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px 16px;
	margin: 0;
}
.product-details-page .product-headline-meta .additional-details div {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	font-size: 13px;
}
.product-details-page .product-headline-meta .additional-details .label,
.product-details-page .product-headline-meta .additional-details .value {
	font-size: 13px;
	color: var(--pd-ink-3);
}
.product-details-page .product-headline-meta .additional-details .value {
	font-weight: 600;
	color: var(--pd-ink-2);
}
.product-details-page .product-review-box {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #f5a623;
}
.product-details-page .product-review-box .rating-star {
	display: inline-flex;
	width: 17px;
	height: 17px;
}
.product-details-page .product-review-box .rating-star svg {
	width: 100%;
	height: 100%;
}
.product-details-page .rating-average {
	font-size: 14px;
	font-weight: 700;
	color: var(--pd-ink);
}
.product-details-page .product-review-links {
	display: inline-block;
}
.product-details-page .product-review-links a {
	margin: 0;
	padding: 0;
	line-height: 1.4;
	font-size: 13px !important;
	color: var(--pd-ink-3);
}
.product-details-page .product-review-links a:hover {
	color: var(--pd-accent);
	text-decoration: underline;
}
.product-details-page .product-review-links a:before {
	display: none;
}

/* --- short description ------------------------------------------------ */

.product-details-page .overview .short-description {
	margin: 0 0 22px;
	padding: 0;
	border: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--pd-ink-2);
}

/* --- purchase panel --------------------------------------------------- */

.product-details-page .product-purchase-box {
	margin: 0 0 24px;
	padding: 20px;
	border: 1px solid var(--pd-line);
	border-radius: var(--pd-radius);
	background-color: var(--pd-surface);
	box-shadow: var(--pd-shadow);
}
.product-details-page .product-purchase-box .prices {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px 12px;
	margin: 0 0 12px;
	overflow: visible;
}
.product-details-page .prices > div {
	margin: 0;
}
.product-details-page .product-price {
	font-size: 32px;
	line-height: 1.1;
	font-weight: 800;
}
.air-theme .product-details-page .product-price,
.earth-theme .product-details-page .product-price {
	color: var(--pd-accent);
	font-weight: 800;
}
.product-details-page .old-product-price,
.product-details-page .non-discounted-price {
	font-size: 17px;
	color: var(--pd-ink-3);
}
.product-details-page .old-product-price span:after,
.product-details-page .non-discounted-price span:after {
	display: none;
}
.product-details-page .old-product-price span,
.product-details-page .non-discounted-price span {
	text-decoration: line-through;
}
.product-details-page .prices .base-price-pangv,
.product-details-page .prices .tax-shipping-info {
	flex: 0 0 auto;
	font-size: 13px;
	font-weight: 400;
	color: var(--pd-ink-3);
}
.product-details-page .prices .tax-shipping-info {
	flex-basis: 100%;
}
.product-details-page .prices .tax-shipping-info a {
	color: var(--pd-ink-3);
	text-decoration: underline;
}
.product-details-page .purchase-box-availability {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 18px;
	margin: 0 0 16px;
}
.product-details-page .overview .availability,
.product-details-page .overview .delivery {
	margin: 0;
}
.product-details-page .availability .stock {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 5px 12px 5px 10px;
	border-radius: 999px;
	background-color: var(--pd-accent-soft);
	font-size: 13px;
	font-weight: 700;
	color: var(--pd-accent);
}
.product-details-page .availability .stock .label {
	display: none;
}
.product-details-page .availability .stock .value {
	color: inherit;
	font-weight: 700;
}
.product-details-page .availability .stock-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: currentColor;
}
.product-details-page .availability .stock.out-of-stock {
	background-color: #fdeceb;
	color: var(--pd-danger);
}
.product-details-page .delivery .delivery-date {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 13px;
	color: var(--pd-ink-3);
}
.product-details-page .delivery .delivery-date .value {
	font-weight: 600;
	color: var(--pd-ink-2);
}
.product-details-page .delivery .free-shipping {
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	border-radius: 999px;
	background-color: var(--pd-accent-soft);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--pd-accent);
}
.product-details-page .delivery .free-shipping:before {
	display: none;
}

/* --- quantity stepper + add to cart ----------------------------------- */

.product-details-page .overview .add-to-cart {
	margin: 0;
}
.product-details-page .overview .add-to-cart-panel {
	gap: 12px;
}
.product-details-page .overview .quantity {
	display: inline-flex;
	align-items: center;
	height: 52px;
	border: 1px solid var(--pd-line-strong);
	border-radius: var(--pd-radius-sm);
	background-color: var(--pd-surface);
	overflow: hidden;
}
.product-details-page .overview .quantity .increase,
.product-details-page .overview .quantity .decrease {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 100%;
	margin: 0;
	border-radius: 0;
	background: transparent;
	font-size: 20px;
	line-height: 1;
	color: var(--pd-ink-2);
	user-select: none;
	transition:
		background-color 0.15s ease,
		color 0.15s ease;
}
.product-details-page .overview .quantity .increase:hover,
.product-details-page .overview .quantity .decrease:hover {
	background-color: var(--pd-surface-2);
	color: var(--pd-accent);
}
.product-details-page .overview .qty-input {
	width: 46px;
	height: 100%;
	border: 0;
	border-left: 1px solid var(--pd-line);
	border-right: 1px solid var(--pd-line);
	background: transparent;
	font-size: 15px !important;
	font-weight: 700;
	color: var(--pd-ink);
}
.product-details-page .overview .qty-dropdown {
	height: 52px;
	min-width: 74px;
	border: 1px solid var(--pd-line-strong);
	border-radius: var(--pd-radius-sm);
	padding: 0 10px;
}
.product-details-page .overview .add-to-cart-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 52px;
	min-width: 210px;
	padding: 0 28px;
	border-radius: var(--pd-radius-sm);
	font-size: 15px !important;
	font-weight: 700 !important;
	letter-spacing: 0.3px;
	transition:
		transform 0.15s ease,
		box-shadow 0.15s ease,
		opacity 0.15s ease;
}
.air-theme .product-details-page .overview .add-to-cart-button,
.earth-theme .product-details-page .overview .add-to-cart-button {
	background-color: var(--pd-accent);
	color: #fff !important;
}
.product-details-page .overview .add-to-cart-button:hover {
	opacity: 1;
	box-shadow: var(--pd-shadow-lift);
	transform: translateY(-1px);
}
/* product-box-sprite.png is a 160x80 sheet: 4 icons across (cart, wishlist, compare,
   zoom) x 2 rows. Scaling the whole sheet to the button size would show all four, so
   the background is scaled proportionally (160x80 -> 136x68) and pinned to the cart */
.product-details-page .overview .add-to-cart-button:before {
	width: 34px;
	height: 34px;
	background-size: 136px 68px;
	background-position: left top;
}
.product-details-page .overview .add-to-cart-button span {
	margin: 0;
}
.product-details-page .min-qty-notification {
	margin: 0 0 10px;
	font-size: 13px;
	color: var(--pd-ink-3);
}

/* --- wishlist / secondary buttons ------------------------------------- */

.product-details-page .product-purchase-box .overview-buttons {
	margin: 14px 0 0;
	padding: 14px 0 0;
	border-width: 1px 0 0;
	border-color: var(--pd-line);
	font-size: inherit;
}
.product-details-page .overview-buttons div {
	display: block;
	margin: 0;
}
/* Scoped to .overview-buttons on purpose. A bare
   `.product-details-page .add-to-wishlist-button` also matches the wishlist
   buttons inside the also-purchased / related / cross-sell product grids that
   sit further down this same page, turning their icon circle into a bordered
   white box. The overview wishlist button is always inside .overview-buttons
   (ProductTemplate.Simple.cshtml:148), so the narrower scope loses nothing. */
.product-details-page .overview-buttons button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	height: 46px;
	padding: 0 18px;
	border: 1px solid var(--pd-line-strong);
	border-radius: var(--pd-radius-sm);
	background-color: var(--pd-surface) !important;
	background-image: none;
	font-size: 14px;
	font-weight: 600;
	color: var(--pd-ink-2) !important;
	transition:
		border-color 0.15s ease,
		color 0.15s ease,
		background-color 0.15s ease;
}
.product-details-page .overview-buttons button:hover {
	border-color: var(--pd-accent);
	color: var(--pd-accent) !important;
	background-color: var(--pd-accent-soft) !important;
}
.product-details-page .overview-buttons button:hover .pd-icon {
	color: var(--pd-accent);
}
/* this button already has its own icon - an inline <svg class="pd-icon">
   heart, see _AddToWishlist.cshtml - so the FA glyph pseudo added below
   for .overview-buttons .add-to-wishlist-button:before must not render here,
   or the heart shows twice. Must stay scoped to .overview-buttons: unscoped it
   also killed the icon (and its accent circle) on every wishlist button in the
   product grids further down this page. */
.product-details-page .overview-buttons .add-to-wishlist-button:before {
	content: none !important;
	display: none !important;
}

/* --- attributes ------------------------------------------------------- */

.product-details-page .overview .attributes {
	margin: 0 0 22px !important;
	border: 1px solid var(--pd-line);
	border-radius: var(--pd-radius);
	background-color: var(--pd-surface-2);
	padding: 18px 20px;
	font-size: 14px;
}
.product-details-page .overview .attributes dt {
	margin: 0 0 8px;
	font-weight: 700;
	color: var(--pd-ink);
	white-space: normal;
}
.product-details-page .overview .attributes dd {
	margin: 0 0 16px;
}
.product-details-page .overview .attributes dd:last-child {
	margin: 0;
}
.product-details-page .overview .attributes .option-list li {
	display: inline-block;
	margin: 0 8px 8px 0;
}
.product-details-page .overview .attributes select,
.product-details-page .overview .attributes input.textbox {
	min-height: 42px;
	border: 1px solid var(--pd-line-strong);
	border-radius: var(--pd-radius-sm);
	padding: 0 10px;
}
.product-details-page .overview .attributes .attribute-square {
	border-radius: 6px;
}

/* --- misc ------------------------------------------------------------- */

/* --- estimate shipping card ------------------------------------------- */

.product-details-page .product-estimate-shipping {
	margin: 0 0 24px;
	border: 1px solid var(--pd-line);
	border-radius: var(--pd-radius);
	background-color: var(--pd-surface-2);
	padding: 0;
	font-size: 14px;
	overflow: hidden;
}
.product-details-page .product-estimate-shipping .open-estimate-shipping-popup {
	display: block;
	padding: 14px 16px;
	color: var(--pd-ink-2);
	transition: background-color 0.15s ease;
}
.product-details-page .product-estimate-shipping .open-estimate-shipping-popup:hover {
	background-color: #fff;
}
.product-details-page .product-estimate-shipping .es-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	color: var(--pd-accent);
}
.product-details-page .product-estimate-shipping .es-icon svg {
	width: 100%;
	height: 100%;
}
.product-details-page .product-estimate-shipping .shipping-title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px 8px;
	margin: 0;
	padding: 0 0 10px;
	border-bottom: 1px solid var(--pd-line);
}
.product-details-page .product-estimate-shipping .shipping-price-title {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.2px;
	text-transform: uppercase;
	color: var(--pd-ink-3);
}
.product-details-page .product-estimate-shipping .shipping-price {
	position: static;
	bottom: auto;
	margin: 0 0 0 auto;
	font-size: 17px;
	font-weight: 800;
	color: var(--pd-ink);
}
.product-details-page .product-estimate-shipping .estimated-delivery {
	display: grid;
	gap: 8px;
	margin: 10px 0 0;
}
.product-details-page .product-estimate-shipping .shipping-address,
.product-details-page .product-estimate-shipping .shipping-date {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	line-height: 1.4;
}
.product-details-page .product-estimate-shipping .shipping-address-text {
	flex: 1 1 auto;
	min-width: 0;
	color: var(--pd-ink-2);
}
.product-details-page .product-estimate-shipping .shipping-date {
	font-weight: 600;
	color: var(--pd-ink);
}
/* the chevron sits at the end of the address row and hints the popup */
.product-details-page .product-estimate-shipping i.arrow-down {
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	margin: 4px 0 0;
	padding: 0;
	border: solid var(--pd-ink-3);
	border-width: 0 1.5px 1.5px 0;
	transform: rotate(45deg);
	transition: border-color 0.15s ease;
}
.product-details-page .product-estimate-shipping:hover i.arrow-down {
	border-color: var(--pd-accent);
}
.air-theme .product-details-page .product-estimate-shipping i.arrow-down,
.earth-theme .product-details-page .product-estimate-shipping i.arrow-down {
	margin: 4px 0 0;
}

.product-details-page .tier-prices {
	margin: 0 0 16px;
}
.product-details-page .tier-prices .prices-table {
	border-color: var(--pd-line);
	border-radius: var(--pd-radius-sm);
}

/* --- full width variant section (grouped products) -------------------- */

/* the wrapper always renders, so the spacing hangs off its content instead -
   that way a grouped product without variations leaves no empty gap */
.product-details-page .product-variants-section {
	clear: both;
	margin: 0;
}
.product-details-page .product-variants-section > * {
	margin-bottom: 40px;
}

/* --- full description + collateral ------------------------------------ */

.product-details-page .full-description {
	clear: both;
	margin: 0 0 40px;
	padding: 26px 28px;
	border: 1px solid var(--pd-line);
	border-radius: var(--pd-radius);
	background-color: var(--pd-surface);
	line-height: 1.7;
	color: var(--pd-ink-2);
}
.product-details-page .product-collateral > div {
	margin: 0 0 28px;
	padding: 24px 26px;
	border: 1px solid var(--pd-line);
	border-radius: var(--pd-radius);
	background-color: var(--pd-surface);
}
.product-details-page .product-collateral .title {
	margin: 0 0 18px;
	color: var(--pd-ink);
	font-size: 16px;
	letter-spacing: 0.4px;
}
.product-details-page .product-collateral .title strong {
	font-weight: 700;
}
.product-details-page .product-specs-box .data-table td {
	border-top: 1px solid var(--pd-line);
	padding: 11px 14px;
	font-size: 14px;
	color: var(--pd-ink-2);
}
.product-details-page .product-specs-box .data-table tr:first-child td {
	border-top: 0;
}
.product-details-page .product-specs-box .data-table td:first-child {
	background-color: var(--pd-surface-2);
	font-weight: 600;
	color: var(--pd-ink-3);
}
.product-details-page .product-specs-box .data-table td:last-child {
	color: var(--pd-ink);
	font-weight: 600;
}
.product-details-page .product-tags-list a {
	display: inline-block;
	margin: 0 6px 6px 0;
	padding: 5px 12px;
	border: 1px solid var(--pd-line-strong);
	border-radius: 999px;
	font-size: 13px;
	color: var(--pd-ink-2);
}
.product-details-page .product-tags-list a:hover {
	border-color: var(--pd-accent);
	color: var(--pd-accent);
}
.product-details-page .product-tags-list li.separator {
	display: none;
}

/* ==========================================================================
   ICON GLYPHS (Font Awesome 7) — replaces the PNG sprite sheets in ../img/
   --------------------------------------------------------------------------
   Each rule reproduces its sprite tile exactly. The sheets came in three
   kinds, measured from the actual pixels:

     PLATE     fully opaque tile - the background-color underneath was never
               visible, so the pseudo carries the plate colour itself
     KNOCKOUT  opaque plate with the icon punched out as transparency, so the
               accent showed THROUGH the icon - plate on the pseudo, glyph in
               the accent
     GLYPH     genuinely transparent - no background on the pseudo

   Element hosts get an absolutely positioned, centred :before covering the
   same area the sprite covered. That behaves exactly like a background-image:
   it adds no layout, so labels, cart counts and quantity text stay put.

   IMPORTANT: never set font-size on the host element. Many of these hosts use
   font-size: 0 to hide their own literal text (the +/- characters, "Grid",
   "Previous", "Yes"/"No"...). font-size belongs on the pseudo only.
   ========================================================================== */

/* shared painter for every element-hosted sprite */
.scroll-back-button:before,
.responsive-nav-wrapper span:before,
.responsive-nav-wrapper a:before,
.search-box .search-box-button:before,
.newsletter-email .newsletter-subscribe-button:before,
.social-sharing a:before,
.bar-notification .close:before,
.ui-dialog-titlebar button:before,
.estimate-shipping-popup .mfp-close:before,
.pager .previous-page a:before,
.pager .next-page a:before,
.pager .first-page a:before,
.pager .last-page a:before,
.ui-datepicker-header a:before,
.overview .subscribe-button:before,
.variant-overview .subscribe-button:before,
.overview-buttons button:before,
.variant-overview .add-to-wishlist-button:before,
.product-review-helpfulness .vote-options > span:before,
.remove-discount-button:before,
.remove-gift-card-button:before,
.account-page .address-list .button-2:before,
.account-page .order-list .button-2:before,
.html-rfq-requests-page .request-list-page .buttons .button-2:before,
.forums-table-section .image div:before,
.topic-post .post-vote span:before,
.cart-estimate-shipping > a:before,
.news-list-homepage .read-more:before,
.news-list-homepage .view-all a:before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
}
/* hosts that were static need a containing block for the absolute pseudo.
   NOTE: .footable-toggle span, .bar-notification .close, .ui-dialog-titlebar
   button, .ui-datepicker-header a, .search-box .search-box-button and
   .newsletter-email .newsletter-subscribe-button are deliberately NOT in this
   list - they already have `position: absolute` of their own in the baseline
   (self-pinned to an edge/corner of a parent), and adding `position: relative`
   here would silently overwrite that, dropping them into normal flow. */
.responsive-nav-wrapper span,
.responsive-nav-wrapper a,
.social-sharing a,
.pager .previous-page a,
.pager .next-page a,
.pager .first-page a,
.pager .last-page a,
.overview .subscribe-button,
.variant-overview .subscribe-button,
.overview-buttons button,
.variant-overview .add-to-wishlist-button,
.product-review-helpfulness .vote-options > span,
.remove-discount-button,
.remove-gift-card-button,
.account-page .address-list .button-2,
.account-page .order-list .button-2,
.html-rfq-requests-page .request-list-page .buttons .button-2,
.forums-table-section .image div,
.topic-post .post-vote span,
.cart-estimate-shipping > a,
.news-list-homepage .read-more,
.news-list-homepage .view-all a {
	position: relative;
}
/* --- scroll back to top -------------- GLYPH, white arrow on the accent --- */
.scroll-back-button:before {
	content: "\f077";
	font-size: 15px;
	color: #fff;
}

/* --- header nav tiles ---------------- PLATE #fff, black icons ------------
   header-navigation-sprite.png is fully opaque, so the accent underneath was
   never visible. The pseudo carries the white plate. The >=1025px earth-theme
   swap to the near-black sheet lives in 1024.css. */
.responsive-nav-wrapper span:before,
.responsive-nav-wrapper a:before {
	background-color: #fff;
	font-size: 20px;
	color: #000;
	transition: color 0.2s ease;
}
/* hover: only the glyph takes the accent, the plate stays put. Ties on
   specificity with 1024.css's earth-theme override (which repaints these white
   on the near-black plate at >=1025px) but styles.css is registered last in
   Head.cshtml, so the hover colour wins in both themes and at every width. */
.responsive-nav-wrapper span:hover:before,
.responsive-nav-wrapper a:hover:before {
	color: var(--el-accent, #00a651);
}
.responsive-nav-wrapper .menu-title span:before {
	content: "\f0c9";
}
.responsive-nav-wrapper .search-wrap span:before {
	content: "\f002";
}
.responsive-nav-wrapper .personal-button span:before {
	content: "\f007";
	font-weight: 400;
}
.responsive-nav-wrapper .wishlist-opener a:before {
	content: "\f004";
	font-weight: 900;
}
.responsive-nav-wrapper .shopping-cart-link a:before {
	content: "\f07a";
}
/* keep the cart / wishlist counters above the plate */
.responsive-nav-wrapper .cart-qty,
.responsive-nav-wrapper .wishlist-qty {
	position: relative;
	z-index: 1;
}

/* --- header search submit ------------ PLATE #fff, black icon ------------ */
.search-box .search-box-button:before {
	content: "\f002";
	background-color: #fff;
	font-size: 18px;
	color: #000;
}

/* --- header links -------------------- PLATE #fff, black icons ----------- */
.header-links li:before {
	content: "\f007";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-family: "Font Awesome 7 Free";
	font-weight: 400;
	font-style: normal;
	font-size: 13px;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	color: #000;
	-webkit-font-smoothing: antialiased;
}
.header-links #myaccountlink:before {
	content: "\f007";
}
.header-links #registerlink:before {
	content: "\f234";
	font-weight: 900;
}
.header-links #loginlink:before {
	content: "\f2f6";
	font-weight: 900;
}
.header-links #logoutlink:before {
	content: "\f2f5";
	font-weight: 900;
}
.header-links #inboxlink:before {
	content: "\f0e0";
}

/* --- newsletter subscribe ------------ PLATE #fff, black icon ------------ */
.newsletter-email .newsletter-subscribe-button:before {
	content: "\f1d8";
	background-color: #fff;
	font-size: 20px;
	color: #000;
	transition: color 0.2s ease;
}
.newsletter-email .newsletter-subscribe-button:hover:before {
	color: var(--el-accent, #00a651);
}

/* --- footer social discs ------------- PLATE #fff, black brand marks ----- */
.social-sharing a:before {
	background-color: #fff;
	border-radius: 50%;
	font-family: "Font Awesome 7 Brands";
	font-weight: 400;
	font-size: 16px;
	color: #000;
	transition: color 0.2s ease;
}
.social-sharing a:hover:before {
	color: var(--el-accent, #00a651);
}
.social-sharing .facebook:before {
	content: "\f39e";
}
.social-sharing .twitter:before {
	content: "\f099";
}
.social-sharing .pinterest:before {
	content: "\f231";
}
.social-sharing .instagram:before {
	content: "\f16d";
}
.social-sharing .vimeo:before {
	content: "\f27d";
}
.social-sharing .google:before {
	content: "\f0d5";
}
.social-sharing .youtube:before {
	content: "\f167";
}
.social-sharing .rss:before {
	content: "\f09e";
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
}

/* --- side block titles --------------- PLATE #fff, black icons ----------- */
.block .title:before {
	content: "\f03a";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	color: #000;
	-webkit-font-smoothing: antialiased;
}
.block-category-navigation .title:before {
	content: "\f03a";
}
.block-manufacturer-navigation .title:before {
	content: "\f275";
}
.block-vendor-navigation .title:before {
	content: "\f54e";
}
.block-recently-viewed-products .title:before {
	content: "\f1da";
}
.block-popular-tags .title:before {
	content: "\f02c";
}
.block-poll .title:before {
	content: "\f681";
}
/* The collapse chevron is a GLYPH (white) on its own #ccc disc. Deliberately
   NOT in the shared painter list above: that list pins its members with
   top/right/bottom/left: 0, but this disc positions itself with
   `top: 50%; right: 10px; width: 18px; height: 18px; margin: -9px 0 0`
   (styles.css:1536) to sit vertically centred at the right edge of the title
   bar. With left AND right both 0 and an 18px width the box is over-constrained,
   `right` is dropped, and the disc jumps to the top-left corner - then the
   -9px margin lifts it clear out of the title box. So this rule contributes
   only the glyph and the centring inside the existing disc. */
.block .title:after {
	content: "\f078";
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 8px;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}

/* --- bare chevrons ------------------- GLYPH #bbb, no plate -------------- */
.block .list a.with-subcategories:after,
.year strong.with-subcategories:after {
	content: "\f105";
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 9px;
	line-height: 1;
	letter-spacing: 0;
	color: #bbb;
	-webkit-font-smoothing: antialiased;
}
/* --- "view all" chevron -------------- KNOCKOUT #fff plate, accent arrow - */
.block .view-all a:after {
	content: "\f105";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #fff !important; /* theme.custom-2.css re-applies the accent bg at equal specificity but later load order */
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 9px;
	line-height: 1;
	letter-spacing: 0;
	color: var(--el-accent, #00a651);
	-webkit-font-smoothing: antialiased;
}

/* --- filter tick --------------------- GLYPH #aaa on a white box --------- */
.filters input:checked + label:before {
	content: "\f00c";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 9px;
	line-height: 1;
	color: #aaa;
	-webkit-font-smoothing: antialiased;
}

/* --- close buttons ------------------- GLYPH white on the #ccc discs ----- */
.ui-dialog-titlebar button:before,
.estimate-shipping-popup .mfp-close:before {
	content: "\f00d";
	font-size: 10px;
	color: #fff;
}
/* The cart/wishlist remove button (.remove-btn) is a 22px disc, itself
   absolutely positioned inside its <td>. It uses :after, not :before - the
   baseline explicitly sets `.cart .remove-from-cart button:before { display:
   none; }`, so reusing :before would just re-enable a suppressed pseudo.

   The pseudo is made its own 22x22 flex container pinned to the button's
   origin, rather than relying on flex centring *by the button*. A <button>
   lays its content out inside an engine-generated anonymous box, so
   align-items/justify-content declared on the button itself are not a
   dependable way to place a pseudo; a plain absolutely-positioned box with
   explicit width/height has no such ambiguity. Explicit 22x22 rather than
   inset 0 for the same reason - it does not depend on how right/bottom
   resolve against the button's own absolute positioning.

   Scoped to .remove-btn, not a bare `button`: ROPC renders its own
   <button class="remove-product"> inside this very same td
   (RealOnePageCheckout/OrderSummary.cshtml:54) and already draws an X on its
   :before, so a bare `button:after` gave the checkout row two X icons. */
.cart .remove-from-cart .remove-btn:after {
	content: "\f00d";
	position: absolute;
	top: 0;
	/* -1px optical nudge: geometrically the box is centred, but the glyph reads
	   a touch right in the disc, so it is pulled back by a pixel by hand */
	left: -1px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	/* FA's xmark has an advance of 384/512 = 0.75em, so a round font-size gives
	   a fractional glyph box: at 10px it is 7.5px wide inside the 22px button,
	   leaving 7.25px gutters. The glyph origin then lands mid-pixel and a thin
	   symmetric X rasterises lopsided. Sizing it so the advance is exactly 8px
	   puts the origin on a whole pixel with 7px gutters - and 8px is also the
	   exact width of the X in close-sprite.png's lower frame, the artwork this
	   replaces. */
	font-size: calc(8px / 0.75);
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}
/* the notification bar close is a KNOCKOUT: white plate, bar colour through */
.bar-notification .close:before {
	content: "\f00d";
	font-size: 11px;
	color: #fff;
}
/* remove discount / gift card: GLYPH white on the accent disc */
.remove-discount-button:before,
.remove-gift-card-button:before {
	content: "\f00d";
	font-size: 10px;
	color: #fff;
}

/* --- steppers -------------------------------------------------------------
   No pseudo-element icon here: the markup already renders literal "+" and "-"
   characters (_AddToCart.cshtml, OrderSummary.cshtml, Wishlist.cshtml). The
   baseline hid that text with `font-size: 0` on the host because the old
   sprite drew the glyph instead; with the sprite gone, un-hide the real text
   and centre it on the disc rather than painting a duplicate over it. */
.cart .increase,
.cart .decrease,
.overview .quantity .increase,
.variant-overview .quantity .increase,
.overview .quantity .decrease,
.variant-overview .quantity .decrease {
	font-size: 13px;
	line-height: 20px;
	text-align: center;
	color: #fff;
}

/* footable's own CSS forces `.footable-toggle:before { display: none !important; }`
   (see line ~748 and tables.css), so a pseudo-element icon here is a dead end -
   use a plain background-image instead, exactly like the original sprite did.
   The two state selectors already carried `!important` position overrides in
   the original file; matched here so the glyph isn't pushed off-box. */
.footable-toggle {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23fff' d='M4 0h2v4h4v2H6v4H4V6H0V4h4z'/%3E%3C/svg%3E") !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-size: 10px 10px !important;
}
.footable-detail-show .footable-toggle {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23fff' d='M0 4h10v2H0z'/%3E%3C/svg%3E") !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-size: 10px 10px !important;
}

/* --- pager --------------------------- GLYPH white on the discs ---------- */
.pager .previous-page a:before {
	content: "\f104";
	font-size: 12px;
	color: #fff;
}
.pager .next-page a:before {
	content: "\f105";
	font-size: 12px;
	color: #fff;
}
.pager .first-page a:before {
	content: "\f100";
	font-size: 12px;
	color: #fff;
}
.pager .last-page a:before {
	content: "\f101";
	font-size: 12px;
	color: #fff;
}

/* --- datepicker nav ------------------ GLYPH white on the #ccc discs ----- */
.ui-datepicker-header a.ui-datepicker-prev:before {
	content: "\f104";
	font-size: 8px;
	color: #fff;
}
.ui-datepicker-header a.ui-datepicker-next:before {
	content: "\f105";
	font-size: 8px;
	color: #fff;
}

/* --- product page links -------------- PLATE #fff, black icons ----------- */
.product-review-links a:before,
.delivery .free-shipping:before,
.download-sample a:before {
	content: "\f075";
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0;
	color: #000;
	-webkit-font-smoothing: antialiased;
}
.product-review-links:first-child a:before {
	content: "\f075";
	font-weight: 400;
}
.product-review-links:last-child a:before {
	content: "\f044";
	font-weight: 400;
}
.overview .free-shipping:before,
.variant-overview .free-shipping:before {
	content: "\f0d1";
}
.download-sample a:before {
	content: "\f019";
}

/* --- back-in-stock / wishlist / compare / email --- KNOCKOUT #fff plate,
   accent icon (product-page-sprite-2.png punched the icon out of the plate) */
.overview .subscribe-button:before,
.variant-overview .subscribe-button:before,
.overview-buttons button:before {
	right: auto;
	width: 35px;
	background-color: #fff;
	font-size: 16px;
	color: var(--el-accent, #00a651);
}
.overview .subscribe-button:before,
.variant-overview .subscribe-button:before {
	content: "\f0f3";
	font-weight: 400;
}
.overview-buttons .add-to-wishlist-button:before {
	content: "\f004";
	font-weight: 900;
}
.overview-buttons .add-to-compare-list-button:before {
	content: "\f0ec";
}
.overview-buttons .email-a-friend-button:before {
	content: "\f0e0";
	font-weight: 400;
}

/* --- variant wishlist tile ----------- PLATE #fff, black heart ----------- */
.variant-overview .add-to-wishlist-button:before {
	content: "\f004";
	background-color: #fff;
	font-weight: 900;
	font-size: 22px;
	color: #000;
}

/* --- add to cart --------------------- GLYPH white on the accent button -- */
.overview .add-to-cart-button:before,
.variant-overview .add-to-cart-button:before {
	content: "\f07a";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 22px;
	line-height: 1;
	letter-spacing: 0;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}

/* item-box wishlist/compare glyphs, unconditional on breakpoint or .product-list -
   the original sprite-position overrides for these were only ever declared for
   .product-list at 721-1024px and unconditionally at >=1025px, leaving grid/
   carousel views in that gap always showing the first (cart) sprite frame. This
   rule applies everywhere so the correct icon shows regardless of layout/width. */
.item-box .add-to-wishlist-button:before {
	content: "\f004";
	font-weight: 900;
}
.item-box .add-to-compare-list-button:before {
	content: "\f0ec";
	font-weight: 900;
}

/* --- product social share ------------ the anchor already holds .flip and
   .flop sprite layers, so the glyph goes on those, not a third pseudo ----- */
.product-social-buttons li a .flip,
.product-social-buttons li a .flop {
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Brands";
	font-weight: 400;
	font-style: normal;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 0;
	color: #000;
	-webkit-font-smoothing: antialiased;
}
.product-social-buttons .twitter a .flip:before,
.product-social-buttons .twitter a .flop:before {
	content: "\f099";
}
.product-social-buttons .facebook a .flip:before,
.product-social-buttons .facebook a .flop:before {
	content: "\f39e";
}
.product-social-buttons .pinterest a .flip:before,
.product-social-buttons .pinterest a .flop:before {
	content: "\f231";
}
.product-social-buttons .google a .flip:before,
.product-social-buttons .google a .flop:before {
	content: "\f0d5";
}

/* --- attribute square ticks ---------- GLYPH, no plate ------------------- */
.selected-value .attribute-square:after {
	content: "\f00c";
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 10px;
	line-height: 1;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}
.selected-value .attribute-square-container[title~="White"] .attribute-square:after {
	color: #aaa;
}
.attribute-squares li.disabled:after {
	content: "\f00d";
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 8px;
	line-height: 1;
	color: #333;
	-webkit-font-smoothing: antialiased;
}

/* --- write-review star rating -------- KNOCKOUT #fff plate, accent star ---
   rating-sprite.png is 16x32: the top frame is a solid opaque white square
   (the "off" state) and the bottom frame is the same white square with a
   star-shaped transparent knockout, so the label's accent background showed
   through as the star. The label keeps its accent background (set by the
   air/earth rules and by theme.custom-2.css); the pseudo lays the white plate
   over it and draws the star in the accent, reproducing the sprite exactly.
   The baseline default is the bottom frame - every star lit - and
   `input:checked + label ~ label` switches the ones AFTER the chosen rating to
   the plain top frame, so the "off" rule just drops the glyph. */
.write-review .rating-options label {
	position: relative;
}
.write-review .rating-options label:before {
	content: "\f005";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 13px;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	color: var(--el-accent, #00a651);
	-webkit-font-smoothing: antialiased;
}
.write-review .rating-options input:checked + label ~ label:before {
	content: "";
}

/* --- review helpfulness -------------- GLYPH black thumbs, no plate ------ */
.product-review-helpfulness .vote-options > span:before {
	font-weight: 400;
	font-size: 14px;
	color: #000;
}
.product-review-helpfulness .vote-options > span:first-child:before {
	content: "\f164";
}
.product-review-helpfulness .vote-options > span:last-child:before {
	content: "\f165";
}

/* --- wishlist page buttons ----------- PLATE #1e1e1e, white icons -------- */
.wishlist-content button:before {
	content: "\f021";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 0;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}
.wishlist-content .update-wishlist-button:before {
	content: "\f021";
}
.wishlist-content .wishlist-add-to-cart-button:before {
	content: "\f07a";
}
.wishlist-content .email-a-friend-wishlist-button:before {
	content: "\f0e0";
	font-weight: 400;
}

/* --- compare remove ------------------ GLYPH white on the #ccc disc ------ */
.compare-products-page .remove-button:before {
	content: "\f00d";
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 9px;
	line-height: 1;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}

/* --- check availability -------------- PLATE #fff, black icon ------------ */
#check-availability-button:before {
	content: "\f3c5";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0;
	color: #000;
	-webkit-font-smoothing: antialiased;
}

/* --- login page buttons -------------- GLYPH white icon, no plate -------- */
.login-page .button-1:before {
	content: "\f2f6";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}
.login-page .login-button:before {
	content: "\f2f6";
}
.login-page .register-button:before {
	content: "\f234";
}
.checkout-as-guest-button:before {
	content: "\f007";
	font-weight: 400;
}

/* --- account / order / RFQ list buttons --- PLATE #f9f9f9, black icons ---
   The sprite sat in the 30px left padding gutter. */
.account-page .address-list .button-2:before,
.account-page .order-list .button-2:before,
.html-rfq-requests-page .request-list-page .buttons .button-2:before {
	right: auto;
	width: 30px;
	background-color: #f9f9f9;
	font-size: 13px;
	color: #000;
}
.account-page .edit-address-button:before {
	content: "\f044";
	font-weight: 400;
}
.account-page .delete-address-button:before {
	content: "\f2ed";
	font-weight: 400;
}
.account-page .order-details-button:before {
	content: "\f15c";
	font-weight: 400;
}
.account-page .return-items-button:before {
	content: "\f2ea";
}
.html-rfq-requests-page .request-list-page .buttons .button-2:before {
	content: "\f15c";
	font-weight: 400;
}

/* --- shopping cart buttons ----------- GLYPH white icon, no plate -------- */
.shopping-cart-page button:before {
	content: "\f021";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 0;
	color: #fff;
	-webkit-font-smoothing: antialiased;
}
.shopping-cart-page .update-cart-button:before {
	content: "\f021";
}
.shopping-cart-page .continue-shopping-button:before {
	content: "\f060";
}
.shopping-cart-page .estimate-shipping-button:before {
	content: "\f0d1";
}
.shopping-cart-page .checkout-button:before {
	content: "\f09d";
}

/* --- cart messages ------------------- GLYPH #333, no plate -------------- */
.cart-collaterals .message-failure:before,
.cart-collaterals .message-success:before {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-style: normal;
	font-size: 10px;
	line-height: 1;
	color: #333;
	-webkit-font-smoothing: antialiased;
}
.cart-collaterals .message-success:before {
	content: "\f00c";
}
.cart-collaterals .message-failure:before {
	content: "\f00d";
}

/* --- cart estimate-shipping dropdown --- GLYPH grey chevron -------------- */
.cart-estimate-shipping > a:before {
	content: "\f078";
	left: auto;
	right: 8px;
	width: 12px;
	font-size: 9px;
	color: #999;
}

/* --- blog links ---------------------- PLATE #fff, black icons ----------- */
.blog-links .comments a:before,
.blog-links .tags ul:before {
	content: "\f075";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-family: "Font Awesome 7 Free";
	font-weight: 400;
	font-style: normal;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0;
	color: #000;
	-webkit-font-smoothing: antialiased;
}
.blog-links .comments a:before {
	content: "\f075";
}
.blog-links .tags ul:before {
	content: "\f02c";
	font-weight: 900;
}

/* --- news list arrows ---------------- GLYPH, no plate ------------------- */
.news-list-homepage .read-more:before {
	content: "\f178";
	left: auto;
	right: 0;
	width: 100px;
	font-size: 14px;
	color: var(--el-accent, #00a651) !important;
}
.news-list-homepage .view-all a:before {
	content: "\f105";
	left: auto;
	right: 4px;
	width: 12px;
	font-size: 11px;
	color: #fff;
}
.earth-theme .news-list-homepage .view-all a:before {
	right: 8px;
}

/* --- forum --------------------------- folder GLYPH #ddd, actions PLATE -- */
.forums-table-section .image div:before {
	content: "\f07b";
	font-size: 24px;
	color: #ddd;
}
.forums-table-section .image div.sticky:before {
	content: "\f08d";
}
.forums-table-section .image div.announcement:before {
	content: "\f0a1";
}
.topic-post .pm-button:before,
.profile-info-box .pm-button:before,
.topic-post .post-actions a:before {
	content: "\f0e0";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: #f9f9f9;
	font-family: "Font Awesome 7 Free";
	font-weight: 400;
	font-style: normal;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0;
	color: #000;
	-webkit-font-smoothing: antialiased;
}
.topic-post .post-actions .edit-post-button:before {
	content: "\f044";
}
.topic-post .post-actions .delete-post-button:before {
	content: "\f2ed";
}
.topic-post .post-actions .quote-post-button:before {
	content: "\f10e";
	font-weight: 900;
}
.topic-post .post-vote .vote.up:before {
	content: "\f077";
	font-size: 8px;
	color: #fff;
}
.topic-post .post-vote .vote.down:before {
	content: "\f078";
	font-size: 8px;
	color: #fff;
}

/* --- select> and other non-pseudo hosts ----------------------------------
   A select cannot host a pseudo-element, so its arrow stays a background
   image - but as an SVG with EXPLICIT width/height plus a pinned
   background-size. Without those an SVG has no intrinsic size and stretches
   to fill the whole control - this was the giant grey dropdown-arrow bug. */
select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23999' d='M1.4 0 6 4.6 10.6 0 12 1.4 6 7.4 0 1.4z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 8px center;
	background-size: 12px 8px;
}

/* =========================================================================
   LAYOUT FIXES (2026-08) - appended last, so equal-specificity rules here
   beat 1320/1024/720/480/mobile.css. theme.custom-2.css loads AFTER this
   file, so anything competing with it needs !important (see header links).
   ========================================================================= */

/* --- product title: never clip the name ----------------------------------
   Replaces the reserved height at ~line 2039. min-height keeps short titles
   aligned; the theme prefix also out-specifies the QuickView / AjaxCart
   max-height clamps in the plugin stylesheets. */
.air-theme .item-box .product-title,
.earth-theme .item-box .product-title {
	height: auto;
	max-height: none;
	overflow: visible;
}
.air-theme .item-box .product-title {
	min-height: 38px;
}
.earth-theme .item-box .product-title {
	min-height: 50px;
}

/* --- header links: kill the accent plate behind the icons -----------------
   theme.custom-2.css repaints .{air,earth}-theme .header-links li:before at
   equal specificity but later load order, so !important is required - same
   pattern as .mini-shopping-cart .count a:before in 1024.css. */
.air-theme .header-links li:before,
.earth-theme .header-links li:before {
	background-color: transparent !important;
}

/* --- home page category grid: 4 up on desktop, uniform image-filled boxes */
.home-page-category-grid > .item-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
/* !important because of the load order noted at the end of this file: 720.css
   still hands these boxes width: 49% and a 2% left margin, which inside a grid
   track leaves every tile half-width and shoved sideways. */
.home-page-category-grid .item-box,
.home-page-category-grid .item-box:nth-child(n) {
	float: none;
	clear: none;
	width: auto !important;
	margin: 0 !important;
}
.home-page-category-grid .category-item {
	position: relative;
	height: 100%;
	overflow: hidden;
}
.home-page-category-grid .picture {
	margin: 0;
}
.home-page-category-grid .picture a {
	padding-top: 100%; /*square box - all tiles identical*/
}
.home-page-category-grid .picture img {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	transition: transform 0.5s ease;
}
.home-page-category-grid .item-box:hover .picture img {
	transform: scale(1.04);
}
.home-page-category-grid .title {
	text-align: center !important; /*1024.css right-aligns it and loads later*/
}
.air-theme .home-page-category-grid .title,
.earth-theme .home-page-category-grid .title {
	font-size: 16px;
}
.home-page-category-grid .title a {
	display: block !important; /*1024.css makes it inline-block and loads later*/
	background-color: rgba(0, 0, 0, 0.65);
	padding: 14px 12px;
}
@media all and (min-width: 1025px) {
	.home-page-category-grid > .item-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* --- instant search dropdown ---------------------------------------------
   max-width caps the used width regardless of the width:...!important
   declarations in styles.css / 1024.css / 480.css. */
.ui-autocomplete {
	max-width: 320px;
	padding: 8px 0;
}
.ui-autocomplete a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	text-transform: none;
}
.ui-autocomplete img {
	flex: 0 0 auto;
	margin: 0;
}
.ui-autocomplete a span {
	font-size: 12px;
	line-height: 1.35;
}

/* --- product grids: equal-height cards ------------------------------------
   Flex-wrap on the .item-grid only. The float widths and nth-child margins
   from the breakpoint files (49% / 32% / 24.25% + gutters) still decide the
   layout - float and clear are simply ignored inside a flex container - but
   the cards in a row now stretch to the tallest one, so every white plate
   ends level and the price/action lanes line up straight across the row.
   The clearfix :after would become a stray flex item, so switch it off.

   .details is a flex column with .add-info pinned by margin-top: auto (see
   the card shell block), which is what holds the price and buttons on a
   shared baseline no matter how many lines the product name runs to. */
.product-grid > .item-grid,
.home-page-product-grid.alternate-products > .item-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}
.product-grid > .item-grid:after,
.home-page-product-grid.alternate-products > .item-grid:after {
	display: none;
}
.product-grid > .item-grid > .item-box,
.home-page-product-grid.alternate-products > .item-grid > .item-box {
	display: flex;
	flex-direction: column;
}
.product-grid > .item-grid > .item-box > .product-item {
	flex: 1 1 auto;
}

/* carousels lay their slides out with floats + a transformed track, so the
   slides need the same treatment to stop being ragged (JCarousel, and the
   SmartProductCollections tabs when "show items in carousel" is on) */
.nop-jcarousel .slick-track,
.spc-wrapper .slick-track {
	display: flex;
	align-items: stretch;
}
.nop-jcarousel .slick-slide,
.spc-wrapper .slick-slide {
	height: auto;
}
.spc-wrapper .slick-item,
.spc-wrapper .slick-item > .item-box {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

/* --- top bar above the header --------------------------------------------
   Thin utility strip rendered by _TopBar.cshtml as the first child of
   .master-header-wrapper, holding the tax display type selector that used to
   be buried in .header-selectors-wrapper inside the personal dropdown. */
.top-bar {
	position: relative;
	z-index: 1021; /*above .desktop-nav-wrapper (1020)*/
	border-bottom: 1px solid #eee;
	background-color: #f6f6f6;
}
/* the header row is .desktop-nav-wrapper: full width with 15px side padding
   and its right-hand icons flush against it, so match that inset instead of
   centring a fixed-width container */
.top-bar-inner {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 15px;
	width: 100%;
	min-height: 34px;
	padding: 0 15px;
}
.top-bar .tax-display-type-selector {
	margin: 0;
}
.top-bar .tax-display-type-selector select {
	height: 28px;
	min-width: 0;
	border: none;
	background-color: transparent;
	padding: 0 18px 0 4px;
	background-position: right 2px center;
	font-size: 12px;
	color: #555;
	cursor: pointer;
}
.top-bar .tax-display-type-selector select:hover {
	color: #000;
}
/* >=1321px the header icons carry a 5px side margin - follow them out */
@media all and (min-width: 1321px) {
	.top-bar-inner {
		padding-right: 20px;
	}
}

/* --- instant search dropdown: hover / keyboard highlight -----------------
   jQuery UI puts .ui-state-active on the focused row (mouse or arrow keys),
   but the theme only gave it a background, and the row inherited the plain
   #555 link colour with no pointer cursor. */
.ui-autocomplete li {
	cursor: pointer;
}
.ui-autocomplete a {
	transition:
		background-color 0.15s ease,
		color 0.15s ease;
}
.ui-autocomplete li:hover > a,
.ui-autocomplete li > a:hover,
.ui-autocomplete li > a.ui-state-active,
.ui-autocomplete li.ui-state-active > a {
	background-color: #f6f6f6;
	color: var(--el-accent, #00a651);
}

/* --- instant search dropdown inside the desktop header -------------------
   The dropdown is appended to .search-box, which at >=1025px lives inside
   .responsive-nav-wrapper .store-search-box - and the reset there (1024.css)
   flattens every <a> with "cursor: auto !important" plus
   "background-color: transparent !important". That reset is meant for the
   search toggle, not for the result rows, so undo it for them. */
.responsive-nav-wrapper .store-search-box .ui-autocomplete a {
	cursor: pointer !important;
}
/* the same reset also catches every <span> - which is the product name, i.e.
   the whole middle of a row - so it kept an arrow cursor there and threw away
   the 12px size */
.responsive-nav-wrapper .store-search-box .ui-autocomplete a span,
.responsive-nav-wrapper .store-search-box .ui-autocomplete a img {
	cursor: pointer !important;
	font-size: 12px !important;
}
.responsive-nav-wrapper .store-search-box .ui-autocomplete li:hover > a,
.responsive-nav-wrapper .store-search-box .ui-autocomplete li > a:hover,
.responsive-nav-wrapper .store-search-box .ui-autocomplete li > a.ui-state-active,
.responsive-nav-wrapper .store-search-box .ui-autocomplete li.ui-state-active > a {
	background-color: #f6f6f6 !important;
	color: var(--el-accent, #00a651);
}

/* NOTE ON LOAD ORDER: Head.cshtml uses NopHtml.AppendCssFileParts, which does
   _cssParts.Insert(0, ...) - so the render order is the REVERSE of the calls:
   styles.css first, then mobile, 480, 720, 1024, 1320. The breakpoint files
   therefore OVERRIDE this one at equal specificity. Anything here that
   competes with a declaration in 720/1024/1320.css must either be fixed in
   that file or carry !important. */

/* --- manufacturer filter: search + show more -----------------------------
   Ported from the AjaxFilters manufacturer panel onto the default nop filter
   markup (Element/Views/Catalog/_FilterManufacturerBox.cshtml). The extra
   items past the tenth are hidden until the toggle is used; the search box
   reveals matches regardless of that. */
.manufacturer-filter-search {
	position: relative;
	margin: 0 0 10px;
}
.manufacturer-filter-search-icon {
	position: absolute;
	top: 50%;
	left: 9px;
	width: 14px;
	height: 14px;
	transform: translateY(-50%);
	fill: #6b6b6b;
	pointer-events: none;
}
/* ".filters input" is the checkbox reset - position: absolute; opacity: 0 -
   and it would swallow this text field whole, so put it back on screen. */
.filters .manufacturer-filter-search-input {
	position: static;
	opacity: 1;
	width: 100%;
	height: 34px;
	margin-top: 5px;
	padding: 0 10px 0 30px;
}
.product-manufacturer-filter .product-manufacturer-group .extra-item {
	display: none;
}
.product-manufacturer-filter .product-manufacturer-group.expanded .extra-item {
	display: list-item;
}
.product-manufacturer-filter .product-manufacturer-group.expanded {
	overflow-y: auto;
	padding-right: 6px;
	scrollbar-width: thin;
	scrollbar-color: #c7c7c7 transparent;
}
.product-manufacturer-filter .product-manufacturer-group.expanded::-webkit-scrollbar {
	width: 6px;
}
.product-manufacturer-filter .product-manufacturer-group.expanded::-webkit-scrollbar-track {
	background: transparent;
}
.product-manufacturer-filter .product-manufacturer-group.expanded::-webkit-scrollbar-thumb {
	border-radius: 3px;
	background-color: #c7c7c7;
}
.product-manufacturer-filter .product-manufacturer-group.expanded::-webkit-scrollbar-thumb:hover {
	background-color: #a6a6a6;
}
/* search wins over the collapsed state: a match is shown even if it is one of
   the extra items, a miss is hidden even if it is one of the first ten */
.product-manufacturer-filter .product-manufacturer-group .item.search-hidden {
	display: none;
}
.product-manufacturer-filter .product-manufacturer-group .item.search-match {
	display: list-item;
}
.manufacturer-filter-toggle {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin: 16px 0 0;
	padding: 0 0 0 25px;
	color: var(--el-accent, #00a651);
	cursor: pointer;
}
.manufacturer-filter-toggle:hover {
	color: #333;
	text-decoration: underline;
}
.manufacturer-filter-toggle:after {
	content: "\f078"; /*chevron-down*/
	font-family: "Font Awesome 7 Free";
	font-weight: 900;
	font-size: 8px;
	transition: transform 0.15s ease;
}
.manufacturer-filter-toggle.expanded:after {
	transform: rotate(180deg);
}

/* =======================================================================
   MODERN PRODUCT CARD ACTIONS  (CSS only - _ProductBox.cshtml is untouched)

   The template renders the action buttons TWICE:
     .picture > .buttons.desktop  - the old hover-revealed overlay lane
     .add-info > .buttons.mobile  - in flow, last thing in the card
   so the bottom row is built entirely from the second one and the overlay
   is switched off. Nothing floats over the image.

   The !important flags here are load-bearing. `.buttons` is targeted by a
   decade of theme rules that would otherwise win outright:
     720.css   .item-box .buttons          accent bar, block layout
     1024.css  .item-box .buttons          position: absolute, bottom: -100px,
                                           height: 100px  (the hover lane)
     1024.css  .item-box .buttons.mobile   display: none  at >=1025px
     1024.css  .item-box:hover .buttons    bottom: 0      (the reveal)
     1024.css  .category-page .products-wrapper .product-grid .item-box
                 .buttons button           opacity: 0     -> (0,5,1), beats
                                           every selector in this block
     theme.custom-2.css  .air-theme/.earth-theme .item-box .buttons
                                           accent background, injected by the
                                           theme DLL after every other sheet
   This block is unguarded by any @media, so one layout applies at every
   viewport instead of the old desktop-hover / mobile-bar split.

   NOTE: the QuickView trigger is injected by the plugin into
   .product-item > .picture, which CSS cannot reparent, so element.js moves
   it into .buttons.mobile - see handleQuickViewButtonPlacement(). Its own
   styling lives in the plugin's QuickView.css.
   ======================================================================= */

/* the overlay lane in .picture - off everywhere, both breakpoints */
.item-box .buttons.desktop {
	display: none !important;
}

/* one row: cart button on the left, quick view on the right, both centred on
   the same axis. No separator rule - align-items: center is what keeps the
   two controls level, so neither carries a top border or offset margin. */
.item-box .buttons.mobile {
	display: flex !important;
	/* wrap, not nowrap: in a narrow card (QuickView popup, SPC tab, small
	   screens) the cart button and quick view cannot both fit on one line, and
	   nowrap made them squash into each other. The cart's flex-basis below is
	   what decides when the quick view drops to its own line. */
	flex-wrap: wrap !important;
	align-items: center;
	justify-content: center;
	gap: 8px 10px;
	position: static !important;
	width: auto !important;
	height: auto !important;
	margin: 4px 0 0 !important;
	background: none !important;
	padding: 0 !important;
	opacity: 1 !important;
	transition: none !important; /*kills the 0.4s slide of the old hover lane*/
}

/* --- primary: cart button, takes the free space on the left ----------- */
.item-box .buttons.mobile .product-box-add-to-cart-button {
	order: 1;
	/* Grows to fill whatever the icon buttons leave. min-width is what forces a
	   clean wrap instead of a cramped sliver: without it flex would shrink this
	   button to its min-content ("košarico" plus the cart glyph) and keep all
	   four controls crammed on one line. At this floor, a narrow card wraps the
	   icon row underneath the full-width button instead. */
	flex: 1 1 130px !important;
	min-width: 115px;
	box-sizing: border-box;
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: auto !important;
	height: auto !important;
	border: none !important;
	border-radius: 8px;
	background-color: var(--el-accent, #00a651) !important;
	margin: 0 !important;
	padding: 11px 12px !important;
	font-size: 13px !important;
	font-weight: 600;
	line-height: 1.2;
	color: #fff !important;
	text-transform: none !important;
	letter-spacing: 0;
	opacity: 1 !important;
	cursor: pointer;
	transition: background-color 0.2s ease !important;
}
.item-box .buttons.mobile .product-box-add-to-cart-button:hover {
	background-color: #333 !important;
}
.item-box .buttons.mobile .product-box-add-to-cart-button:before {
	content: "\f07a" !important; /*shopping cart*/
	box-sizing: content-box !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	flex: none;
	width: auto !important;
	height: auto !important;
	margin: 0 8px 0 0 !important;
	border: none !important;
	border-radius: 0 !important;
	background: none !important;
	font-family: "Font Awesome 7 Free" !important;
	font-weight: 900 !important;
	font-style: normal !important;
	font-size: 15px !important;
	line-height: 1 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	color: #fff !important;
	-webkit-font-smoothing: antialiased;
}
/* the label span was an absolutely positioned hover tooltip in the old lane
   (.product-grid .item-box button span, opacity: 0) - it is plain text now */
.item-box .buttons.mobile .product-box-add-to-cart-button span {
	position: static !important;
	display: inline !important;
	margin: 0 !important;
	background: none !important;
	padding: 0 !important;
	opacity: 1 !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
	color: inherit !important;
	text-transform: none !important;
	white-space: normal !important;
}

/* --- secondary: icon-only buttons beside the cart button ---------------
   Wishlist, quick view (styled in the QuickView plugin's own CSS) and
   compare all render as square icon buttons, so three controls fit on the
   row next to the cart button. Their <span> labels are visually hidden
   rather than removed: the resource strings ("Dodaj na seznam primerjav")
   are far too wide for this row, and the template already puts the same
   text in a `title` attribute, which supplies the accessible name and the
   hover tooltip. */
.item-box .buttons.mobile .add-to-wishlist-button,
.item-box .buttons.mobile .add-to-compare-list-button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	box-sizing: border-box;
	width: 36px !important;
	height: 36px !important;
	margin: 0 !important;
	border: 1px solid #ececec !important;
	border-radius: 8px !important;
	background: none !important;
	padding: 0 !important;
	font-size: 0;
	line-height: 1;
	opacity: 1 !important;
	cursor: pointer;
	transition:
		border-color 0.15s ease,
		background-color 0.15s ease;
}
.item-box .buttons.mobile .add-to-compare-list-button {
	order: 3;
}

/* The product box carries exactly three controls: add to cart (1), quick view
   (2, styled in the QuickView plugin's CSS) and compare (3). Wishlist is not
   one of them - hidden here rather than stripped from _ProductBox.cshtml so
   the AjaxCart wiring, the move-to-wishlist modal and the wishlist page all
   stay intact. Delete this rule to bring it back as a fourth icon; it is
   already styled by the rules above. */
.item-box .buttons.mobile .add-to-wishlist-button {
	display: none !important;
}

.item-box .buttons.mobile .add-to-wishlist-button:before,
.item-box .buttons.mobile .add-to-compare-list-button:before {
	box-sizing: content-box !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	flex: none;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	background: none !important;
	font-family: "Font Awesome 7 Free" !important;
	font-style: normal !important;
	font-size: 14px !important;
	line-height: 1 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	color: #777 !important;
	-webkit-font-smoothing: antialiased;
}
.item-box .buttons.mobile .add-to-wishlist-button:before {
	content: "\f004" !important; /*heart, regular weight = outline*/
	font-weight: 400 !important;
}
.item-box .buttons.mobile .add-to-compare-list-button:before {
	content: "\f0ec" !important; /*right-left arrows*/
	font-weight: 900 !important;
}
/* visually hidden, still exposed to assistive tech; `title` on the button is
   what names it. Not display:none - that would drop it from the a11y tree. */
.item-box .buttons.mobile .add-to-wishlist-button span,
.item-box .buttons.mobile .add-to-compare-list-button span {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: hidden !important;
	clip-path: inset(50%);
	white-space: nowrap !important;
}
.item-box .buttons.mobile .add-to-wishlist-button:hover,
.item-box .buttons.mobile .add-to-compare-list-button:hover {
	border-color: var(--el-accent, #00a651) !important;
	background-color: #f6fbf8 !important;
}
.item-box .buttons.mobile .add-to-wishlist-button:hover:before,
.item-box .buttons.mobile .add-to-compare-list-button:hover:before {
	color: var(--el-accent, #00a651) !important;
}

/* =======================================================================
   RESTORED BLOCK
   The five rule-sets below were lost when this file's card-actions block was
   rewritten wholesale (the rewrite truncated the file at a fixed line and
   re-appended only the actions rules, discarding everything after it). They
   are unrelated to the card actions and are kept together here so a future
   rewrite of that block cannot take them out again.
   ======================================================================= */

/* --- 1. hover pseudo over the card ------------------------------------- */
/* The old hover lane slid a white pseudo-element up from the bottom of
   .buttons to sit behind the icons (1024.css:1312, :hover -> height: 50% at
   1024.css:1348). The lane is gone, so all it does now is flash a white
   block over the card on hover. `content: none` removes the box outright
   instead of leaving a zero-height one; !important because the
   .alternate-products selector is (0,3,0) and this one is only (0,2,0). */
.item-box .buttons:before,
.item-box .buttons:after {
	content: none !important;
	display: none !important;
}

/* --- 2. .alternate-products (home page featured grid) ------------------ */
/* This grid styles .item-box ITSELF as the card - white plate, a 20px
   box-shadow and its own padding (1024.css:1290) - which now sits behind the
   real card drawn on .product-item and reads as a double border. The plate
   belongs to .product-item alone, so strip it from the wrapper.

   !important IS required: Head.cshtml registers the sheets with
   NopHtml.AppendCssFileParts, and nopCommerce's Append* INSERTS AT INDEX 0,
   so the call order 1320 -> 1024 -> 720 -> 480 -> mobile -> styles RENDERS in
   reverse - styles.css first, then mobile, 480, 720, 1024, 1320. That is
   deliberate (it is how 1320.css outranks 1024.css on a wide screen) but it
   leaves styles.css with the LOWEST precedence of the six, so an
   equal-specificity rule added here loses to the breakpoint files. */
.alternate-products .item-box {
	box-shadow: none !important;
	background: none !important;
	padding: 0 !important;
}
.alternate-products .item-box .details {
	padding: 0 !important; /*.product-item already provides the inner padding*/
}

/* --- 3. product list (view mode "list") -------------------------------- */
/* 720.css turns .product-item into `display: table-row` (0,3,0), and a
   table-row cannot render the card's border-radius or padding - which is why
   the list view had no card at all. So the plate moves outward onto
   .item-box, which 720.css makes the `display: table`, and the row itself is
   stripped bare. 720.css only sets display/table-layout/float/width/margin
   there, never border/background/padding, so these do not collide. */
.product-list .item-box {
	box-sizing: border-box;
	border: 1px solid #ececec;
	border-radius: 12px;
	background-color: #fff;
	padding: 16px;
	transition: border-color 0.2s ease;
}
.product-list .item-box:hover {
	border-color: #ddd;
}
.product-list .item-box .product-item {
	border: none;
	border-radius: 0;
	background: none;
	padding: 0;
}
/* the details column is left-aligned in list view (720.css), so the price row
   must not keep the grid card's centred flex alignment */
.product-list .item-box .prices {
	justify-content: flex-start;
}
/* (0,5,0) - out-specifies 720.css's
   `.product-list .item-box .details .buttons { display: block !important }`
   at (0,4,0), which would otherwise drop the row out of flex layout and
   leave the cart button and the icons unaligned. 720.css positions this row
   absolutely at the bottom-left of .details, which is kept. */
.product-list .item-box .details .buttons.mobile {
	display: flex !important;
	align-items: center;
	justify-content: flex-start;
	gap: 16px;
}

/* --- 4. catalog AJAX busy overlay (paging / sorting / view mode) ------- */
/* _CatalogProducts.cshtml already renders <div class="ajax-products-busy">
   inside .products-container, and nop's public.catalogproducts.js show()s and
   hide()s it around every fetch. The Element theme simply never styled it, so
   nothing was ever visible - this is what makes it appear. */
.products-container {
	position: relative;
}
.products-container .ajax-products-busy {
	display: none; /*inline display:block from the script's .show() reveals it*/
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
	/* offset from the top rather than dead-centre: the grid can be several
	   screens tall, and a vertically centred spinner would sit below the fold
	   exactly when the user is waiting for it */
	background: rgba(255, 255, 255, 0.75) url("../img/loading.gif") center 120px no-repeat;
}
