/* html { scroll-behavior: smooth } */

#topbar { font-weight: 400 }
#topbar > .container { padding-top: 5px; padding-bottom: 5px }
#topbar > .container > div { padding-top: 0; padding-bottom: 0; height: 20px }
#topbar div.topbar { font-size: 9px }

.langselect label { font-weight: 400 }
.langselect label.shop { text-align: left }
.langselect label.lang { text-align: center }
.langselect input:checked + .dropdown { text-transform: none;
	text-align: left; top: 23px }
.langselect label.shop { width: 18em }
.langselect label.lang { width: 8em }
.langselect input:checked + .dropdown.shop { right: 8em; width: 18.5em }
.langselect input:checked + .dropdown.lang { right: 0; width: 9em }
.langselect img { width: 1.2em; height: 1.2em; vertical-align: -.2em }
.langselect label span { text-transform: none }

/* body.fixed-header #header, #header { position: relative } */

#header { padding-top: 5px; box-shadow: 0 2px 5px rgba(0, 0, 0, .15);
	border-bottom: none }
#header .logo-col img { max-width: 100px; max-height: 40px; height: auto }
#header .logo-col,
#header .search-col,
#header .menus-col { padding-top: 10px; padding-bottom: 10px }
#header .menus-col { float: right }
body.fixed-header #header, #header { height: auto }
#header .menus-col .menu-dropdowns > .btn-group > .btn,
#header .menus-col .btn { font-weight: 400 }

#header .menus-col { margin-top: 5px }
#header .menus-col img { vertical-align: bottom }
#header .service-menu .dropdown-menu { min-width: 120px }
#header .service-menu .flyoutBox li { white-space: nowrap }
#header .service-menu-box .btn-danger { background: #002c52;
	border-color: #002c52 }
#header .service-menu-box,
#header .service-menu-box .lead { font-weight: 400 }

#header .menus-col .menu-dropdowns > .btn-group {
	margin-left: 0 }
#header .menus-col .menu-dropdowns > .btn-group.minibasket-menu {
	margin-left: 20px }

#header .search-col form .input-group { box-shadow: none }
#header .search-col #searchParam { border-top-left-radius: .2em;
	border-bottom-left-radius: .2em;
	border-top: 1px solid #eee; border-bottom: 1px solid #eee;
	border-left: 1px solid #eee }
#header .search-col button { padding: 5px 7px 6px 7px;
	background: #002c52; color: white;
	border: 1px solid #002c52;
	border-top-right-radius: .2em;
	border-bottom-right-radius: .2em }

/* #header .prodcats-col { margin-top: 5px; font-weight: 400 } */
#header .prodcats-and-links > div {
	background: #002c52
	linear-gradient(to bottom, #002c52 0%, #005192 100%);
	color: white; font-weight: 400; font-size: 14px }
#header .prodcats-and-links > div::after { content: '';
	display: table; clear: both }
#header .prodcats-and-links a { color: white }
#header .prodcats { width: 100%;
	/* background: #002c52 linear-gradient(to bottom, #002c52 0%, #004a87 100%); */
	color: white; font-weight: 500; padding: 0;
	vertical-align: middle; margin-bottom: -1px }
#header .prodcats label { font-weight: 400; margin: 0; padding: 10px;
	width: 100% }
#header .prodcats label img { vertical-align: -.3em; width: 1.5em;
	height: 1.5em; margin-left: 5px; margin-right: 10px }
#header .prodcatslinks { padding: 10px; text-align: left }
#header .prodcatslinks a { margin-right: 10px; margin-left: 10px;
	text-decoration: none }
#header .prodcatslinks a img { margin-right: 5px }

#maincats { position: relative }
#maincats.alwaysopen { transition: opacity 400ms ease;
	opacity: 1; pointer-events: all }
#maincats.alwaysopen.fadeout { opacity: 0; pointer-events: none }
#maincats.alwaysopen > ul.main { display: block }
#maincats > ul > li > ul { display: none }
#maincats > ul { left: 0; width: 320px; max-width: 100%;
	height: auto; max-height: none; padding: 0;
	box-shadow: 2px 2px 8px rgba(0, 0, 0, .3) }
#maincats > ul > li { display: block; width: 100%; margin: 0;
	padding: 5px 10px; white-space: nowrap;
	overflow: hidden; text-overflow: ellipsis }
#maincats > ul.sub1 { display: none }
#maincats > ul.sub2 { display: none }
#maincats a { color: black; text-decoration: none; display: block;
	padding: 10px 20px 10px 10px; position: relative; line-height: 20px }
#maincats > ul.main > li > a { padding-left: 40px }
#maincats > ul.main > li > a > img { position: absolute; left: 0; top: 6px;
	width: 30px; height: 30px }
#maincats li { position: relative; border-bottom: 1px solid #eee }
#maincats > ul > li > a { font-weight: 400 }
#maincats li.act > a { color: #004a87 }
#maincats li > i.fa { display: block; position: absolute;
	top: 50%; right: 10px; transform: translate3d(0, -50%, 0) }
#maincats li.act,
#maincats li:hover { background: #f2f2f2 }

body.c202204 #breadcrumbs { margin-bottom: 13px }
body.c202204 #breadcrumbs #breadcrumb { margin-bottom: 0 }

.page-header { border-bottom: 0 }
h1.page-header { font-size: 30px; font-weight: 500 }

.textinpic.catpic .textinpic-over { width: 90% }
.category-title { font-size: 22px; font-weight: 400;
	margin: .5em .2em 1em .2em }

h1.category-titles { font-size: 20px }
h1.category-titles a.inactive { color: #888 }
h1.category-titles a.inactive::after { content: ' | ' }
h1.category-titles a:hover,
h1.category-titles a:focus { text-decoration: none; color: inherit }

.locator-top { display: flex; justify-content: space-between; gap: 10px;
	margin-top: 2em; margin-bottom: 1em; flex-wrap: wrap }
/* .locator-top > * { flex: 1 1 auto } */
.locator-top { font-size: 12px }
.locator-top .btn-group .btn { border: none; padding: 0 }
.locator-top .btn-group .btn:hover, .locator-top .btn:focus { background: inherit }
.locator-top .btn-group.open .dropdown-toggle { background: inherit }
.locator-top .btn-group { width: auto }
.locator-top .toggle-filters { color: white; background: #002c52;
	padding: .5em 1em; border-radius: .3em; cursor: pointer }
.locator-top .toggle-filters:hover { text-decoration: none }
.locator-top .sellisttype { flex: 1 1 40%; text-align: right }
.sellisttype img { max-height: 20px; margin-left: 5px;
	vertical-align: middle }
#facettes { height: 0; overflow: hidden; font-size: 12px;
	position: relative }
#facettes .col-xs-12 { margin-bottom: 15px }
#facettes.anim { transition: height 200ms }
#facettes.open { height: auto }
#facettes .title { font-weight: 700 }
#facettes .option.odd { background: #eee }
#facettes .values { margin-bottom: 1em }
#facettes .values input { margin-right: .5em }
#facettes .values { font-size: 11px }
.umremovefiltercontainer { display: block }
.umremovefacettedetail-info { border-right: 0;
	border-top: 1px solid #002c52;
	border-left: 1px solid #002c52;
	border-bottom: 1px solid #002c52 }
.umremovefacettedetail-btn { background: white; color: black;
	border-left: 0;
	border-top: 1px solid #002c52;
	border-right: 1px solid #002c52;
	border-bottom: 1px solid #002c52 }
.umremovefacettedetail-btn:hover { background: white;
	border-left: 0;
	border-top: 1px solid #002c52;
	border-right: 1px solid #002c52;
	border-bottom: 1px solid #002c52 }
.umremoveallfacettes .umremovefacettedetail-info,
.umremoveallfacettes .umremovefacettedetail-btn {
	background: #002c52; color: white }

.umremovefiltercontainer { position: relative }
#facettes .filterblocker,
.umremovefiltercontainer .filterblocker { position: absolute; top: 0; left: 0;
	width: 100%; height: 100%; pointer-events: none;
	/* transition: opacity 200ms ease; */
	opacity: 0; background: white }
#facettes .filterblocker.blocking,
.umremovefiltercontainer .filterblocker.blocking { pointer-events: all;
	opacity: .4; animation: blocking-in 500ms 200ms both }
@keyframes blocking-in {
	from { opacity: 0 }
	to { opacity: .4 }
}

.boxwrapper .lineView .productBox form {
	padding: 10px; margin-top: 10px; margin-bottom: 10px }
.boxwrapper .list-container .lineView .productBox form {
	border: 1px solid #f2f2f2 }
/* override */
.boxwrapper .list-container .lineView + .lineView
.productBox:first-child form { padding-top: 10px;
	border-top: 1px solid #f2f2f2 }
/* .boxwrapper .lineView .productBox .row { display: flex; height: 100%;
	flex-wrap: wrap } */
.boxwrapper .lineView .productBox .pricebasket.hasprice { margin-top: 15px }
.boxwrapper .lineView .productBox .pricebasket .row { display: flex;
	gap: 10px; flex-wrap: wrap; padding: 0 15px }
.boxwrapper .lineView .productBox .pricebasket .row::before,
.boxwrapper .lineView .productBox .pricebasket .row::after { display: none }
.boxwrapper .lineView .productBox .pricebasket .row > * { flex: 1 0 45%;
	flex-basis: calc(50% - 5px); white-space: nowrap;
	font-weight: normal; color: black; text-align: left; padding: .5em }
@media (min-width: 992px) {
	.boxwrapper .lineView .productBox .pricebasket
	.row { flex-wrap: nowrap }
	.boxwrapper .lineView .productBox .pricebasket
	.row::before { display: table }
	.boxwrapper .lineView .productBox .pricebasket
	.row > * { flex: 1 1 25% }
}
.boxwrapper .lineView .productBox .pricebasket .boxtitle { font-weight: bold;
	padding-top: 1em }
.boxwrapper .lineView .productBox .pricebasket .artnum.col-md-12 {
	padding-bottom: 1em }
.boxwrapper .lineView .productBox .pricebasket .artnum,
.boxwrapper .lineView .productBox .pricebasket .price,
.boxwrapper .lineView .productBox .pricebasket .availability {
	background: #eee }
.boxwrapper .lineView .productBox .pricebasket .price {
	font-size: inherit }
/* override */
.boxwrapper .lineView .productBox .pricebasket { border-left: 0 }
.boxwrapper .lineView .productBox .pricebasket .artnum {
	margin-bottom: 0 }
.boxwrapper .lineView .productBox .pricebasket .availability {
	line-height: inherit; height: auto }
.boxwrapper .lineView .productBox .pricebasket .tobasket {
	padding-top: 0; padding-bottom: 0 }
.gridView .productBox .pricebasket .tobasket input,
.gridView .productBox .pricebasket .tobasket button,
.gridView .productBox .pricebasket .tobasket button:hover,
.boxwrapper .lineView .productBox .pricebasket .tobasket input,
.boxwrapper .lineView .productBox .pricebasket .tobasket button,
.boxwrapper .lineView .productBox .pricebasket .tobasket button:hover {
	height: 2.2em; border: 1px solid #002c52; background: white;
	color: #002c52; border-radius: 0; display: inline-block;
	line-height: 1.2em; padding: .5em; font-size: 12px }
.gridView .productBox .pricebasket .tobasket input,
.boxwrapper .lineView .productBox .pricebasket .tobasket input {
	max-width: 2em; margin-right: 5px }
.gridView .productBox .pricebasket .tobasket button,
.boxwrapper .lineView .productBox .pricebasket .tobasket button {
	max-width: none; width: auto }
.boxwrapper .lineView .removeButton { position: absolute;
	bottom: 5px; right: 10px; width: auto }

/* grid view */
.gridView .productBox > form { border: 1px solid #e8e8e8; padding: 5px }
body .boxwrapper .list-container
.gridView .productBox .title { font-size: 14px; font-weight: normal }
.gridView .productBox .title a { font-weight: inherit }
.gridView .productBox .product-details .row.even { background: #eee }
.gridView .productBox .product-details { padding: 10px 15px 5px 15px;
	font-size: 12px }
.gridView .productBox .product-details .tobasket { display: flex;
	margin-top: 10px; margin-left: -15px; margin-right: -15px }
.gridView .productBox .product-details .tobasket button { flex: 1 1 auto }

/* product details */
p.proddetail-moreinfo { margin: 2em 0 1em 0 }
a.proddetail-moreinfo { color: #002c52; text-transform: uppercase;
	font-weight: bold }
#detailsMain
p.proddetail-moreinfo + div.information
.vendormatrix-buttons { padding-top: 10px; padding-bottom: 0 }
#detailsMain .prodinfo-open { margin: .5em 0 0 0; padding: 0 }
#detailsMain .prodinfo-open a { color: #002c52 }
#detailsMain .prodinfo-openable { position: relative }
#detailsMain .prodinfo-openable.start { max-height: 210px;
	overflow: hidden }
#detailsMain .prodinfo-openable.anim { transition: height 300ms ease-out }
#detailsMain .prodinfo-openable.start::after,
#detailsMain .prodinfo-openable.unexpanded::after {
	content: ''; display: block; width: 100%; height: 20px;
	position: absolute; bottom: 0; left: 0;
	background: transparent
		linear-gradient(to bottom, #ffffff00 0%, #ffffffff 100%) }
#detailsRelated h3 > span { font-size: 14px; text-transform: uppercase;
	font-weight: bold }
#relprods h3.relprods::before, #detailsRelated h3::before { display: none }
#detailsRelated h3 { position: relative; margin-top: 30px; margin-bottom: 20px }
#detailsRelated h3 + * { overflow: hidden }
#detailsRelated h3 + .closed { height: 0 }
#detailsRelated h3 + .anim { transition: height 200ms }
#detailsRelated h3 .openclose { position: absolute; top: 0; right: 0;
	width: 1.3em; height: 1.3em; line-height: 1.3em; text-align: center;
	font-weight: normal; font-size: 14px }
#detailsRelated h3 .openclose::before { content: '+'; display: inline }
#detailsRelated h3 .openclose.open::before { content: '-' }
#detailsRelated .details-block { border-bottom: 1px solid #eee;
	padding-bottom: 20px }
.cl-details .more-pics { margin-top: -1px; border-top: 1px solid #e0e0e0;
	border-bottom: 1px solid #e0e0e0; position: relative }
.cl-details .more-pics.js { overflow: hidden }
.cl-details .more-pics img { width: 340px; height: 227px; object-fit: contain;
	border-right: 1px solid #e0e0e0 }
.cl-details .more-pics.js .more-pics-slider { display: flex;
	transition: left 200ms }
.cl-details .more-pics.js .more-pics-slider a { flex: 0 }
.cl-details .more-pics.js .slide-left,
.cl-details .more-pics.js .slide-right { display: block; position: absolute; top: 0;
	height: 100%; width: 30px; background: #f2f2f2; color: black;
	text-align: center; cursor: pointer }
.cl-details .more-pics.js .slide-left { left: 0 }
.cl-details .more-pics.js .slide-right { right: 0 }
.cl-details .more-pics.js .slide-left::before { content: '<' }
.cl-details .more-pics.js .slide-right::before { content: '>' }
.cl-details .more-pics.js .slide-left::before,
.cl-details .more-pics.js .slide-right::before { display: block;
	position: absolute; top: 50%; font-size: 14px; left: calc(50% - 4px);
	font-weight: bold }
.cl-details .more-pics.js .slide-left.inact::before,
.cl-details .more-pics.js .slide-right.inact::before { opacity: .3 }

#account_menu .list-group-item:first-child { border-radius: 0 }
#account_menu .list-group-item:last-child { border-radius: 0 }
#account_menu .list-group-item { background: #f2f2f2; color: #5a5a5a;
	font-weight: 500 }
#account_menu .list-group-item.active { background: #f2f2f2;
	color: #002c52; border-color: #ddd }
#account_menu .list-group-item a { color: inherit }

.account-form label.control-label { text-align: left;
	color: #444; font-weight: 500 }
.account-form button[type='submit'] { text-transform: uppercase;
	font-size: 12px; font-weight: 500; padding-left: 2em;
	padding-right: 2em }
.account-form .form-group { margin-bottom: 0 }
.account-form .form-group p.note { font-weight: 500; margin: .5em 0 1.5em 0;
	color: #444 }

.panel-heading { font-weight: 500; color: #444 }
.panel-body { font-weight: 400; color: #444 }
.panel-body.nopad { padding: 0 }
/* .flex-row { display: flex; flex-wrap: wrap } */
.flex-col { flex: 1 1 auto }
.flex-col.pad { padding: 10px 20px }
.flex-col.sep { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;
	margin-right: -1px; margin-bottom: -1px }
table.data-table th, table.data-table td { font-size: 11px }
table.data-table th { text-align: left; vertical-align: top; padding-right: 10px }
table.data-table td { text-align: left; vertical-align: bottom }

.popup { z-index: 11 }

@media (min-width: 640px) {
	/* #header .prodcats-col { display: flex; flex-direction: row-reverse;
		justify-content: left } */
	#header .logo-col img { max-width: 192px; max-height: 70px; height: auto }
	#header .menus-col .menu-dropdowns > .btn-group {
		margin-left: 20px }
	#topbar div.topbar { font-size: 12px }
	.locator-top .sellisttype { flex: 0 0 auto }
}
@media (min-width: 992px) {
	.langselect { border-left: 1px solid #e0e0e0 }
	#header .prodcats-and-links > div {
		background: #002c52
		linear-gradient(to right, #002c52 0%, #005192 100%) }
	#pagenav-top { top: 0 }
	.row.amws-local-navigation-row { top: 0 }
	#header .logo-col { width: 170px }
	#header .menus-col { min-width: 450px }
	#header .menus-col,
	#header .search-col { margin-top: 15px }
	#header .prodcatslinks { text-align: right }
	#maincats > ul.sub1 { display: block; left: 315px;
		width: 300px }
	#maincats > ul.sub2 { display: block; left: 610px;
		width: 300px }
	.twocols { column-count: 2 }
	#startslider .dd-hero-inner { padding: 100px 50px }
}
@media (min-width: 1200px) {
	#header .logo-col { width: 300px }
	.panel-body .flex-row { flex-wrap: nowrap }
}
/*
@media(min-width: 1300px) {
	body .container { width: 100%; padding-left: 45px; padding-right: 45px;
		max-width: 1690px }
}
*/

html[lang='ru'] #header .menus-col,
html[lang='ru'] #header .menus-col .btn,
html[lang='pl'] #header .menus-col,
html[lang='pl'] #header .menus-col .btn { font-size: 11px }
html[lang='ru'] #header .menus-col .btn span,
html[lang='pl'] #header .menus-col .btn span { white-space: normal;
	display: inline-block; width: 7em }
html[lang='hu'] #header .menus-col,
html[lang='hu'] #header .menus-col .btn { font-size: 12px }
html[lang='fr'] #header .menus-col,
html[lang='fr'] #header .menus-col .btn,
html[lang='nl'] #header .menus-col,
html[lang='nl'] #header .menus-col .btn { font-size: 12px }