/* Global */

html, body, ul, li, h1, h2, h3, h4, h5, h6, form, a, img {margin: 0; padding: 0; border: 0;} /* reset browser prefs */
input, textarea {outline: none}
body {color: #404040; font: 300 15px/19px Arial,Helvetica; overflow-y: scroll;}

H1 {font-size: 1.7em; font-weight: bold; margin-bottom: .5em;}
H2 {font-size: 1.2em; margin: 1em 0;}
H3 {font-size: 1.1em; margin: 1em 0;}
H4 {margin: 1em 0;}
A {color: #404040; text-decoration: underline;}
A:hover {text-decoration: underline;}
P {margin: 0 0 1em 0;}
FORM {display: inline;}
b {font-weight: bold;}
strong {font-weight: 600}
#content {width: 100%; border-collapse: collapse;}
.alert {color: red}
.success {color: green}


.spacer {height: 1em;  clear: both;}
#loginTable {display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px}
@media screen and (max-width: 1280px) {#loginTable {grid-template-columns: 1fr; grid-gap: 5px}}
#loginTable > DIV {border: 1px solid #34495E; padding: 10px;}

#loginTable H2 {font-size: 1.6em; margin: 5px 0 1.5em;}
#pswForgot {display: none}
#pswForgot INPUT {width: 20em; font-size: 1.3em;}

/* INPUT BOX */

.inputBox {display: grid; grid-template-columns: max-content max-content; grid-gap: 10px; font-size: 16px; align-items: center;}
@media screen and (max-width: 1280px) {.inputBox {grid-template-columns: max-content auto}}
.inputBox DIV:nth-child(odd) {font-weight: bold;}
.inputBox INPUT[type="text"], .inputBox INPUT[type="email"], .inputBox INPUT[type="password"], .inputBox SELECT  {height: 2em; font-size: 16px;}

textarea, select, input[type="text"], input[type="email"], input[type="password"] {
  background-color: rgb(255, 255, 255);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
  transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
  border: 1px solid rgba(0,0,0,.5);
  padding: 4px 6px;
  margin: 0;
}

textarea:focus, input[type="text"]:focus, input[type="password"]:focus {
  background-color: rgb(253, 253, 253);
  border-color: #A6717E;
  color: black;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 5px #CCA1AC;
}

@media screen and (max-width: 400px) {textarea, select, input[type="text"], input[type="email"], input[type="password"] {
  width: 6em
}}

@media screen and (max-height: 400px) {.showboxWrapper > div > div:first-child:has(div.inputBox) {height: 300px; }}


.btnRightBlock {float: right; margin: 1em 0}
.addressBookActions {
  clear: both !important;
  display: flex !important;
  align-items: center !important;
  gap: 1em !important;
  margin: 4em 0 2em !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.addressBookActionsLeft {display: block !important}
.addressBookActionsRight {display: block !important; margin-left: auto !important; text-align: right !important}
.addressBookActionsRight .showbox {display: inline-block !important}
.infoBoxContent {overflow: hidden; padding: 5px;}

BUTTON.xl {padding: 12px 60px}
#searchResults .advice_var {font-size: 1.2em; line-height: 1.5em;}
TABLE#addressBookTbl {border-collapse: collapse}
TABLE#addressBookTbl TR {border: 1px solid #34495E;}
TABLE#addressBookTbl TR TD {padding: 10px;}

#addressBookTbl TR TD:nth-child(4) {display: none}
#addAddressBookEntry {display: none}
/*#addressBookTbl TR TD:nth-child(4) DIV.inputBox TABLE TR TD:first-child {display: none !important;} */
#addressBookTbl TR TD:nth-child(3) BUTTON {margin-right: 2em}
#addressBookAllowed {clear: both; margin: 2em 0 1em}

/* New */

.center {text-align: center;}
.marginTop {margin-top: 1em}
.marginBottom {margin-bottom: 1em}
.smallerText {font-size: 0.8em}
.buttonSet {margin-top: 2em}

/* Cart */
#cartTable {width: 100%}
#cartTable TR TD:nth-child(1) {width: 10%}
#cartTable TR TD:nth-child(2) {width: 60%}
#cartTable TR TD:nth-child(3) {width: 5%}
#cartTable TR TD:nth-child(4) {width: 5%}
#cartTable TR TD:nth-child(4) {width: 20%}
.cartTotal {float: right; margin-top: 2em;}
.cartTotal TR TD:nth-child(1) {width: 10em;}
.cartTotal TR TD:nth-child(2) {text-align: right;}
.spanBtn {padding: 2px 5px; border: 1px solid #34495E; cursor: pointer}
.removeProduct {cursor: pointer; text-decoration: underline}
#shoppingCartContents {width: 100%;}
#shoppingCartContents > TBODY > TR:first-child > TD:first-child {border: 1px solid #34495E; }
#cartTable TBODY TR TD:nth-child(5) {text-align: right}
#checkoutBtn {float: right; margin-top: 2em;}
#applyCouponBtn {margin-left: 2em}
#cartTotal {font-size: 150%}
.oldPrice {text-decoration: line-through}
.newPrice {color: red}
#checkoutForm {padding-top: 1em;}
#checkoutForm textarea {width: 50%; height: 5em; border: 1px solid rgba(147, 147, 147, 0.5); padding: 0}
#checkoutForm DIV.filterItem DIV DIV.myRadioBox {vertical-align: middle; line-height: 1.6em;}
@media screen and (max-width: 1280px) {#checkoutForm textarea {width: 100%;}}
#emptyCart {padding: 1em;}
#submitBtn {text-align: right}
#submitBtn button {margin-top: 2em}
.shippingAddress {font-style: italic;}
.shippingAddrChange {font-size: small}
#checkoutForm .checkboxArea li label {white-space: break-spaces}
.shoppingCartBoxTotal {margin-top: 1em; border-top: 1px solid #000;}

/* Contact Us */

#contactUsForm textarea {width: 95%; height: 10em;} @media screen and (min-width: 1280px) {#contactUsForm textarea {width: 60em}}

/* Account */

#accInfo {display: none}
.ordersTable {border: 1px solid #DBDBDB;}
.ordersTable TH, .ordersTable TD {border: 1px solid #DBDBDB; padding: 4px;}
.orderTotalTitle {width: 90%;}
.orderTotalValue {width: 10%;}
.bestSellersList {margin: 0; padding-left: 1.5em;}
.tagCloudSize1 {font-size: .6em;}
.tagCloudSize2 {font-size: .7em;}
.tagCloudSize3 {font-size: .8em;}
.tagCloudSize4 {font-size: .9em;}
.tagCloudSize5 {font-size: 1em;}
.tagCloudSize6 {font-size: 1.1em;}
.tagCloudSize7 {font-size: 1.2em;}
.tagCloudSize8 {font-size: 1.3em;}
.tagCloudSize9 {font-size: 1.4em;}
.tagCloudSize10 {font-size: 1.5em;}
.boxSpecialsTeaser {text-align: center;}
.manufacturerInfoIntro {margin-bottom: 1em;}
.manufacturerInfoOtherTable {border-collapse: collapse;}
.manufacturerInfoOtherTable .manufacturerInfoThumbCell {padding-right: 5px;}
.boxReviewsTeaser {text-align: center;}
.manufacturersBoxList {list-style: none; margin: 0; padding: 0;}
.manufacturersBoxSelect {width: 100%;}
.currenciesBoxSelect {width: 100%;}
.categoriesTagsTree {overflow: auto; height: 25em;}

/* Search (legacy column box) */
.searchBoxKeywords {width: 70%; max-width: 100%; box-sizing: border-box;}
#columnSearchAdvice {position: relative; z-index: 2;}

/* Pages */

#reviewsTbl {width: 100%}
#reviewsTbl TR TD {border-bottom: 1px solid #DBDBDB;}
#reviewsTbl TR TD:nth-child(1) {width: 5%}
#reviewsTbl TR TD:nth-child(2) {width: 5%}
#reviewsTbl TR TD:nth-child(3) {width: 90%}
.priceList {width: 100%; line-height: 1;}

/* SVG Icons */

.svgIcon {
  width: 1em;
  height: 1em;
  cursor: pointer;
  border: 1px solid #696969;
  padding: 3px;
  margin-left: 3px;
  fill: #34495E;
}

.svgIcon.checked {
  border: 2px solid #838383;
}

#bmShoppingCartTotal .ic {fill: black; height: 16px; width: 16px; vertical-align: middle;}
#personalInfoChange .ic {fill: black; height: 24px; width: 24px; vertical-align: middle;}
.productInfoPlatform .ic {fill: #484848; height: 14px; width: 14px; vertical-align: bottom;}
button.cart .ic {fill: #ffffff; height: 10px; width: 10px; vertical-align: bottom;}
button.cart * {pointer-events: none}
.prListingBuy button.cart .ic {fill: #ffffff; height: 10px; width: 10px; vertical-align: text-bottom;}
.productTags .ic {fill: #484848; height: 12px; width: 12px; vertical-align: middle;}

/* Log-in */

/*.tick {display: inline-block; width: 16px; height: 16px; margin-left: 5px; background-image: url(images/icons/tick.gif);}

 */

.tick:after {padding-left: 5px; content: '✔'; color: green}


#noteEmailExist {color:red}
.loginAlreadyLogged,
.formErrorHint,
.passwordForgotLink {margin-top: 2em;}

/* Product */

.prListingPCMAC {padding-left: 5px; color: #6c6c6c; font-size: 12px;}
.prListingPCMAC .ic {margin-right: 3px}
[data-redirect-link] {cursor: pointer; text-decoration: underline}

/* Forms */

form[name=create_account] input:valid, form[name=login] input:valid, form[name=edit_account] input:valid, #contactUsForm input:valid, #contactUsForm textarea:valid {background-color: #f1fff1 }

/* Spoiler */

.sp2.closed DIV {display: none; }
.sp2.closed:before {content: "🠟 Read more..."; cursor: pointer}
.sp2:before {content: "🠝 Hide"; cursor: pointer}

/* Icons */
.ic {width: 10px; height: 10px; padding: 3px; fill: #6c6c6c; vertical-align: text-bottom;}
.ic.border {border: solid 1px #e0e0e0}

/* Tabs */

.tabWrapper {--border: 1px solid #c5c5c5; --padding: 5px}

.tabWrapper ul {padding: 0; margin: 0; list-style-type: none}
.tabWrapper li {display: inline-block; padding: var(--padding); border: var(--border); cursor: pointer; margin: 0 5px -1px 0;}
.tabWrapper li[data-tab-active="1"] {border-bottom: 1px solid #fff; font-weight: bold}
.tabWrapper section {border: var(--border); padding: var(--padding)}
.tabWrapper section:not([data-tab-active="1"]) {display: none}
.tabWrapper :is(h1, h2, h3, h4, h5, h6) {margin: 0; font-size: 13px; font-weight: normal; pointer-events: none;}