:root {
	--main-bg: #34495E;
	--border1: 1px solid var(--main-bg);
}

/* Own CSS styles */

.box {border: 1px solid #6F6F6F;}
.box .boxHeader {background-color: #6F6F6F; color: white; height: 1.5em; line-height: 1.5em;}
.boxHeader H3 {margin: 0 0 0 6px; font-size: 1em;}
.box .boxContent {padding: .5em;}
#bmSearchSubmit {cursor: pointer; border-radius: 0; border: 0; height: 26px; background-color: #939393; color: white;}

/* Grid Template */

#pageWrapper {margin-left: auto; margin-right: auto; width: 99%; background: #EEE; display: grid; grid-template-areas: "header" "content" "footer"; grid-gap: 10px; /*grid-template-columns: 220px auto 220px; */}
@media screen and (max-width: 1024px) {#pageWrapper {grid-gap: 5px;}}

#contentWrapper, #headerWrapper, #footerWrapper {margin-left: auto; margin-right: auto;} @media screen and (min-width: 1300px) { #contentWrapper, #headerWrapper, #footerWrapper {width: 1280px}}
@media screen and (max-width: 1299px) { #contentWrapper, #headerWrapper, #footerWrapper {width: 100%}}
#headerWrapper {display: grid; grid-template-areas: "logo searchBox account"; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; align-items: center;  height: 70px;} @media screen and (max-width: 640px) {#headerWrapper {grid-template-columns: repeat(2, 1fr); grid-template-areas: "logo searchBox" "account account"}}
#contentWrapper {grid-area: content; display: grid; grid-template-columns: 220px auto; grid-template-areas: "columnLeft columnCenter"; grid-gap: 5px; background: #fff;} @media screen and (max-width: 640px) {#contentWrapper {grid-template-columns: repeat(1, 1fr); grid-template-areas: "columnCenter" "columnLeft"; }}

#footerWrapper {color: #fff}
#footerWrapper A {color: #fff; text-decoration: none}
#storeLogo {grid-area: logo; /*justify-self: left;*/ padding-left: 5px; position: relative;}

.productDesc iframe {width: 100%;} @media screen and (min-width: 1400px) {.productDesc iframe {width: 50%;}}


header {grid-area: header; background-color: #000;}
footer {grid-area: footer; background-color: #000;}
.footerBlock {text-transform: uppercase; font-size: 12px; display: inline-block; vertical-align: top; width: 25%; padding: 10px 0;}
.footerBlock UL LI {list-style-type: none; line-height: 1.8em;}
.footerBlock UL LI:first-child {font-weight: 800; color: #a20052;}
nav#columnLeft {grid-area: columnLeft;}
nav#columnRight {grid-area: columnRight}
main#columnCenter {grid-area: columnCenter; padding: 0 5px;} @media screen and (max-width: 640px) {main#columnCenter {padding: 0 }}

/* Product Listing */

.productInfo .border {border: none}
.productInfo .productContent {padding: 0}
.productListingList {display: grid; grid-gap: 10px; padding: 5px; grid-template-columns: max-content auto max-content max-content; align-items: center; grid-auto-columns: max-content;}
.productListingList.noImage {grid-template-columns: auto max-content max-content; }

@media screen and (min-width: 1024px) {.productListingList.date {grid-template-columns: max-content max-content auto max-content max-content; }}
@media screen and (min-width: 1024px) {.productListingList.date.noImage {grid-template-columns: max-content auto max-content max-content; }}

/*.prListingRow {display: grid; grid-template-columns: max-content auto min-content max-content; grid-gap: 10px; grid-auto-flow: column; align-items:center} */

@media screen and (max-width: 1024px) {.prListingShortDesc {display: none;}}
@media screen and (max-width: 1024px) {.prListingDate {display: none;}}
@media screen and (max-width: 1024px) {.prListingBuy BUTTON SPAN {display: none;}}

/*.prListingImage {grid-column-start: 2}*/
.prListingTitle {}
.prListingPrice {justify-self: end;}
.prListingBuy {justify-self: end;}
@media screen and (max-width: 1024px) {.prListingBuy BUTTON {padding: 5px !important;}}
.prListingBuy BUTTON span {margin-left: 5px}
.prListingTitle A {font-weight: bold}
.prListingShortDesc {font-size: .8em; line-height: 1.1em; text-align: left; margin-top: 3px;}

.categoriesMenu A.dropRight:after {padding-left: 1px; content: '\25BF';}
.categoriesMenu UL UL {list-style-type: none; margin-left: 1em; font-weight: 300;}
.categoriesMenu UL LI UL LI A:before {content: "▫"; margin-right: 2px;}
.categoriesMenu UL LI UL LI A:hover:before {content: "▪"; margin-right: 2px; text-decoration: none !important}

.border {border: 1px solid #34495E;}

.selected {font-weight: bold}

.product H3 {font-weight: normal; margin:0; font-size: 0.9em;}
.product img {width: 80px;}
.productContent {padding: 5px; margin-bottom: 1em}
.tagsMenu, #brandFilter {overflow-y: auto; max-height: 25em;}
.tagsMenu LI, .categoriesMenu LI, .headerNav LI, #bmCartContents LI {list-style-type: none;}

.infobox {padding: 5px}
.infoBoxHeader {height: 1.5em; line-height: 1.5em;}
.infoBoxHeaderColored {background-color: var(--main-bg); color: white;}
.infoBoxHeader H1, .infoBoxHeader H2 {padding-left: .3em; font-weight: bold; margin-top: 0; font-size: .9em;}

/* Box */

.box {border: 1px solid #6F6F6F; --padding: 5px;}
.box H3 {margin: 0; padding: 2px 5px; font-size: 1em; background-color: #6F6F6F;; color: #fff;}
.box>div {padding: var(--padding)}

.pageContent H1 {margin-left: -2px; margin-bottom: 1em;}

.newSign {
	font-size: .7em;
	background-color: red;
	color: white;
	margin-left: 1em;
	padding: 0 .45em;
	vertical-align: 2px;
}
span.specialPrice {color: #ff0000;}

/* HEADER */

header {color: #fff}
header A {color: #fff; text-decoration: none}
header INPUT {border: none !important;}

#storeLogoText {font-size: 40px;} @media screen and (max-width: 640px) {#storeLogoText {font-size: 20px;}} @media screen and (max-width: 1024px) {#storeLogoText {font-size: 28px;}}

header nav {justify-self: end;} @media screen and (max-width: 470px) {header nav {grid-template-columns: auto}}
#headerSearch {grid-area: searchBox; justify-self: center; position: relative}
@media screen and (max-width: 470px) {#breadcrumb {display: none;}}
#breadcrumb OL {padding-left: 0; margin: 0; display: inline}
#breadcrumb LI {display: inline}
#accountNav {grid-area: account; justify-self: end; padding-right: 5px}

.headerMenu {margin-left: auto; width: fit-content;}

.spanLink {cursor: pointer; text-decoration: underline}

.shape {
	stroke-dasharray: 337 677;
	stroke-dashoffset: -777;
	stroke-width: 8px;
	fill: transparent;
	stroke: #ca0066;
	transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
}

.logoText {position: absolute; top: -13px; left: 12px;}

#storeLogo svg {position: absolute; top: -31px;}

#storeLogo:hover .shape {
	stroke-width: 2px;
	stroke-dashoffset: 0;
	stroke-dasharray: 1000;
}

.pagesResults {margin: 1em 0 .5em 0; display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; grid-gap: 5px;}
@media screen and (max-width: 1024px) {.pagesResults {grid-template-columns: 1fr}}

@media screen and (max-width: 1024px) {.splitPages {justify-self: end;}}
.pagesResults DIV:nth-child(2) {justify-self: end;}
.splitPages SELECT {padding: 2px; margin-left: .5em}
.pageLinks {justify-self: end;}

.pageLinks A, .pageLinks span.selected {
	text-decoration: none;
	width: 1.2em;
	height: 1.2em;
	display: inline-block;
	border: 1px solid rgb(105, 105, 105);
	margin-left: .3em;
	text-align: center;
	padding: .07em;
}

#catPagesCopy {float: right; margin-top: 5px;}

.seoText {border: 1px solid #34495E; color: #0000009e; padding: 7px; margin-top: 1em;}
.seoText UL {padding-left: 2em;}


/* BUTTONS */

BUTTON {
	white-space: nowrap;
	cursor: pointer ;
	color: white;
	font-weight: bold;
	padding: 8px 40px;
	background-color: #7e0140;
	outline: none;
	border: 1px solid black;
}

BUTTON.cart {border: 1px solid #7e0140; background-color: #7e0140; color: #fff;}

BUTTON.small {font-weight: normal; padding: 0.1em .5em;}
BUTTON.medium {padding: 8px 40px; font-weight: bold;}
.buttonSet {height: 2.5em}

#searchBox {display: grid; grid-gap: 10px;}
FORM#poisk > DIV {display: grid; grid-template-columns: auto max-content;}
#poisk BUTTON {padding: 5px; border: none; background-color: rgba(0,0,0,.5); justify-self: end;}
#poisk INPUT {width: 162px;} @media screen and (max-width: 560px) {#poisk INPUT {width: auto;}}

/* PRODUCT */

.product {text-align: center; padding: 5px; border: 1px solid #fff}
.product:hover {border: 1px solid #000; transition: border 1s, background-color 1s ; color: #fff; background-color: #6F6F6F}
.product:hover img {opacity: .6}
.product:hover a {color: #fff}

.productInfo {padding: 5px; border: var(--border1)}
.productContent LI {margin-left: 2em}
.productContent UL {margin-bottom: 1em;}
.productInfo A {text-decoration: underline;}
TABLE.productParams {background-color: #0000000a; margin-bottom: 5px; width:100%}
TABLE.productParams TD:first-child {width: 99%; vertical-align: top;}
TABLE.productParams IMG {width: 80px}
.productParams UL {list-style-type: none}
.productParams UL LI {margin: 0}
.productInfoText {text-align: center; font-size: .8em;}
.pImgLink IMG {width: 80px}
.productAdvice {display: grid; grid-template-columns: repeat(6, 1fr)} @media screen and (max-width: 1260px) {.productAdvice {grid-template-columns: repeat(3, 1fr)}} @media screen and (max-width: 940px) {.productAdvice {grid-template-columns: repeat(2, 1fr)}}

.reviewHeader SPAN:nth-child(1) {font-weight: bold; margin-right: 1em}
.reviewHeader SPAN:nth-child(3) {float: right}
.reviewText {background-color: #DBDBDB82; padding: 7px; margin-bottom: 1em;}
#productReviews textarea {width:50em; height: 10em;}

/* Categories and tags */
.tagsMenu A, .categoriesMenu A, #bmCartContents A, A#storeLogoText, .headerNav A, .product A, .noUL {text-decoration: none}
.myCheckbox {cursor: pointer}
.myCheckbox > span {margin: 0 4px 3px 0; width: 9px; height: 9px; display: inline-block; vertical-align: middle; border: 1px solid #666;}
.myCheckbox input {display: none}
.filterItem > DIV:first-child {padding-bottom: 3px; text-transform: uppercase; font-size: 10px; font-weight: bold;}
.filterItem > DIV:nth-child(2) {border: 1px solid #DBDBDB; padding: 5px;}
DIV.pageHeading {display: grid; grid-template-columns: auto max-content; grid-gap: 10px;}
DIV.pageHeading DIV:nth-child(1) {}
DIV.pageHeading DIV:nth-child(2) {justify-self: end;}
DIV.pageHeading DIV:nth-child(2) {justify-self: end;}
DIV.pageHeading DIV:nth-child(2) SPAN {font-size: 1.7em; font-weight: bold;}

.productListing {}
TABLE.productListingList {width: 100%;}
.productListing .product {width: 23%; display: inline-block; margin-bottom: 1em; vertical-align: top;}
@media screen and (max-width: 940px) {.productListing .product {width: 50%;}}

.productListing IMG {width: 80px; height: 80px}
TABLE.productListing {border-collapse: collapse;}
TABLE.productListing TR {border-bottom: 1px dotted #282828;}
.productListing TD.price {white-space: nowrap; padding-right: 1em;}

.productListingList TR TD:nth-child(1) {white-space: nowrap; padding: 0 .5em;}

.pDisplay H2, .infoBoxHeader H2 {margin: 0; font-size: 1em;}

/* FILTER */

.filterItem {padding: 5px; margin: 0 0 .5em; min-width: 0;}
.filterItem legend {text-transform: uppercase; font-size: 11px; font-weight: bold;}

.checkboxArea li {list-style-type: none; overflow-x: clip;}
.checkboxArea li label {white-space: nowrap;}
.checkboxArea label {cursor: pointer}
.checkboxArea input {appearance: none; cursor: pointer; color: #666; border: 1px solid #666; width: 11px; height: 11px; margin: 0 4px 0 0;}
.checkboxArea input:checked {background-color: #666}

/*

.myCheckbox, .myRadiobox {cursor: pointer;}
.myCheckbox input, .myRadiobox input {display: none;}
.myCheckbox > span:first-child, .myRadiobox > span:first-child {display: inline-block; vertical-align: middle; border: 1px solid #666;}
SPAN.checked {background-color: rgb(102, 102, 102);}

 */

.cbSizeS {margin: 0 4px 3px 0; width: 9px; height: 9px;}
#advice_group {font-size: .8em; padding: 10px; z-index: 999; background-color:  #6A6A6A;}
#columnCenter #advice_group {background-color:  #fff;}
#searchAdvice {position: absolute}
.selPart {background-color: #FFF; color: #000}
#columnCenter .selPart {background-color: #6A6A6A; color: #fff}

/* CART */
#bmShoppingCartTotal {display: flex; flex-flow: row wrap; align-items: start;}
#bmShoppingCartTotal DIV:nth-child(1) {flex: 1}
#bmShoppingCartTotal DIV:nth-child(2) {flex: 2; text-align: right; white-space: nowrap;}
#bmShoppingCartTotal DIV:nth-child(2) SPAN {text-decoration: underline; cursor: pointer}
#bmCartContents UL {border-bottom: 1px solid black; margin-bottom: 3px; padding-bottom: 5px;}

/* Account */

@media screen and (max-width: 1024px) {.ordersTable TBODY TR TD:nth-child(4), .ordersTable TBODY TR TH:nth-child(4), .ordersTable TBODY TR TD:nth-child(5), .ordersTable TBODY TR TH:nth-child(5) {display: none;}}
@media screen and (max-width: 1024px) {#loginTable .inputBox {font-size: 13px;}}


/* TABS */

.tabWrapper {--border: var(--border1)}