/*

z-index

1003: shop cart slideout, modal
1002: modal bg
1001: header slider layers, cookie decl
1000: top nav lang dropdown, main nav dropdown, mobile, nav, header slider, nav.footer-bar
999: main nav banner left, opened tab (sticky), shop category nav (sticky)
998: gallery slider next/prev

*/

:root {
    --red: #be0e26;
}

.wrapper { width:100%; }
nav { width:100%; }
header { width:100%; position:relative; overflow:hidden; }
header .header-slider-wrapper { margin-bottom:-5px; } /** for some reason, there's a gap beneath slider **/
.header-mobile { display:none; }

/** dropdown menus **/
/*
.dropdown { display: inline-block; }
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 12px 16px;
  z-index: 1;
}
.dropdown:hover .dropdown-content {
  display: block;
}
*/

/** lang selector **/
.lang-selector .lang-select { text-transform:uppercase; }
.lang-selector.dropdown { margin-left: 20px; }
.lang-selector.dropdown .lang-select {
  cursor: pointer;
  /*padding: 0 20px 0 0;*/
  /*position: relative;*/
}
.lang.selected {
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-ms-flex-align: center; -webkit-align-items: center; -webkit-box-align: center; align-items: center; 
}
.lang.selected .icon { margin-left: 7px; }
.submenu-container-lang {
  display: none;
  list-style: none;
  position: absolute;
  padding-top: 7px;
  background-color: #fff;
  min-width: 160px;
  box-shadow: 0px 8px 16px -16px rgba(0,0,0,0.2);  
  z-index: 1000;
  text-transform:capitalize;
}
.submenu-container-lang li {
	background-color: #f9f9f9;
	padding: 12px 16px;
	border-bottom:.5px solid #666;
}
.submenu-container-lang li:last-child { border:0px !important; }
.submenu-container-lang a { text-decoration: none; }
.lang-selector.dropdown:hover .submenu-container-lang {
  display: block; 
}

/** top nav **/
nav.top { width:100%; }
nav.top .center { padding:6px 0; margin:0 auto; }
nav.top .mobile-menu { display:none; }
nav.top .left { column-gap: 20px; }
nav.top .left .social {  }
nav.top .left svg { margin-right:5px; }
nav.top .links { }
nav.top .links .link { margin-left: 20px; }
nav.top .links .link a { text-transform: uppercase; text-decoration:none; }
nav.top .links .link a:hover { text-decoration:underline; }
nav.top .top-nav-text {  }
nav.top .top-nav-text a { text-transform: uppercase; text-decoration:none;  }
nav.top .top-nav-text a:hover { text-decoration:underline; }

/** mobile nav **/
nav.mobile { display:none; }

/** main nav **/
nav.main { width:100%; }
nav.main .center { padding:15px 0; position:relative; margin:0 auto; }

nav.main .links { }
nav.main .links .link { position:relative; margin-left: 20px; }
nav.main .anchor { cursor:pointer; }
nav.main .links .link a, nav.main .links .link .anchor { text-transform: uppercase; }

nav.main .links .link.dropdown .anchor { /*padding-right: 30px;*/ }
nav.main .link.dropdown .menu {
	display: none;
	position: absolute;
	min-width: 160px;
	box-shadow: 0px 8px 16px -16px rgba(0,0,0,0.8);
	z-index: 1000;
	width:min-content; min-width:200px;
	white-space: nowrap; 
	padding-top:15px;
}
nav.main .link.dropdown .menu .menu-content { background: #f2f2f2; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; }
nav.main .link.dropdown .menu .menu-content .item {
	padding: 16px 45px 16px 16px;  display: block; border-top: 1px solid #dedede; cursor:pointer;
}
nav.main .link.dropdown .menu .menu-content .item:first-child { border:0; }
nav.main .link.dropdown .menu .menu-content a {
  color: black;  
  text-decoration: none; 
}
/*nav.main .link.dropdown:hover .menu {display: block;}*/
nav.main .link.dropdown.on .menu {display: block;}
nav.main .link.dropdown:hover .menu .menu-content .item:hover { background: #ccc; }

/** main **/
main { width:100%; padding-top: 20px; }
main > h1 { margin: 20px auto; }

/** cart icon in any nav **/
nav .cart-icon { display:none; position:relative; width:24px; height:24px; margin-left:20px; cursor:pointer; }
nav .cart-icon .icon {
	width:24px; height:24px;
	display: inline-block;
	position: absolute;
	top: 0;
	right: 0;
}
nav .cart-icon .count {
	visibility:hidden;
	align-items: center;
    background-color: red;
    border-radius: 50%;
    color: #fff;
    display: flex;
    font-size: .5rem;
    font-weight: 600;
    height: 0.8rem;
    justify-content: center;
    left: 0.375rem;
    position: absolute;
    top: -0.125rem;
    width: 0.8rem;
}

/** footer **/
footer { width:100%; padding: 0 0 10px; }
footer .site-maps { justify-content: center; padding:20px 0; margin:0 auto; }
footer .site-maps .site-map { margin: 0 0 0 100px; }
footer .site-maps .site-map:first-child { margin-left: 0px; }
footer .site-maps .site-map h3 { font-size: 14px; font-weight:bold; margin: 0 0 5px; }
footer .site-maps .site-map .link { margin: 0 0 7px; } /** added extra spacing for wcag touch targets **/
footer .site-maps .site-map .link a { font-size: 11px; text-decoration:none; }
footer .credits { padding: 10px 0; text-align: center; font-size: 11px; /*color: #fff;*/ }

/** back to top **/
.backtop { position: fixed; bottom:55px; /** so it's above mobile footer bar **/ left:calc(50% - 23px); }
.backtop > div { background-color: rgba(245, 246, 247, 0.8); border-radius:100%; width:50px; height:50px; cursor:pointer; }
.backtop > div:hover { background-color: rgba(245, 246, 247, 0.9); }
.backtop svg { width:46px; height:35px; }

/** banners **/
nav.main .banner-zone { margin:0 20px 0 0; }
nav.main .banner-zone img.align-top, nav.main .banner-zone img.align-bottom { position:absolute; left:0px; z-index: 999; }


/** header image **/
@keyframes fadeBottom{
	0% {opacity:0;-webkit-transform:translateY(10%);transform:translateY(10%)} to {opacity:1;-webkit-transform:translateY(0);transform:translateY(0) }
}

.header-slider-wrapper {   }
.header-slider-wrapper .header-slider { display:none; }
.header-slider-wrapper.init {  }
.header-slider-wrapper.init .header-slider { display:block; }
.header-slider-wrapper.init .header-cover { display:none; }
.header-slider-wrapper .slick-arrow { opacity:0; }
.header-slider-wrapper .slide { position:relative; background-size:cover; background-position: center; background-repeat:no-repeat; max-width:100%; opacity:0; }
.header-slider-wrapper .slide-bg { position:absolute; width:100%; top:0; left:0; z-index:1000; }
.header-slider-wrapper .slide-bg img { object-fit: cover; width:100%; height:100%; }
.header-slider-wrapper .slide-bg.none img { object-fit: none; width:auto; height:auto; margin:0 auto }
.header-slider-wrapper .header-layers { 
	position:absolute; width:100%; top:0; left:0; z-index:1001; background:transparent;	
}
.header-slider-wrapper .slick-slide > div { width:100%; flex:0 0 100%; }
.header-slider-wrapper .slick-track {
  display: flex;
}
.header-slider-wrapper .slick-track .slick-slide {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.header-slider-wrapper .header-cover {
  display: flex;
}
.header-slider-wrapper .header-cover img {
	margin:0 auto;
}
.header-slider-wrapper .header-cover.none img {
	object-fit: none; width:auto; height:auto;
}
.header-slider-wrapper .header-layers .layer { 
	position:absolute; text-align:left; 	
}

.header-slider-wrapper .slick-current .layer {
	animation-duration: .7s;
	animation-delay: .9s;
	animation-timing-function: ease-in-out;
	animation-fill-mode: both;
	animation-name: fadeBottom;
}

/** breadcrumbs **/
.breadcrumbs { margin: 0 0 30px; color: #666; }

/** cookie declaration **/
.wrapper-cookie-decl { position:fixed; bottom:0px; left:0px; background: #000; color:#fff; width:100%; z-index:1001; padding: 30px; }
.wrapper-cookie-decl > .flexbox { -webkit-justify-content: space-between; justify-content:space-between; }
.wrapper-cookie-decl > .flexbox > div:nth-child(1) { flex:1; }
.wrapper-cookie-decl > .flexbox > div:nth-child(2) { flex:0 0 150px; width:150px; text-align:right; }
.wrapper-cookie-decl a, .wrapper-cookie-decl a:visited, .wrapper-cookie-decl a:hover, .wrapper-cookie-decl a:visited:hover { color:#31a8f0; text-decoration:underline; }
.wrapper-cookie-decl input { padding: 5px; width:100px; border-radius:5px; background:yellow; border:1px solid #000; cursor:pointer; }

/** cookie consent **/
.cookie-consent { text-align:left; line-height:140%; }
.cookie-consent img { max-width:100%; }
.cookie-consent a { text-decoration:underline; }
.cookie-consent input { 
	background: #DA2128;
	border:1px solid #DA2128;
	color:#fff;
	margin: 20px 0;
	/*
	border-radius: 5px; background: #DA2128; color:#fff; text-transform:uppercase; cursor:pointer; padding: 10px; font-weight:bold; 
	font-size: 1.4em !important; 	border:1px solid #333; margin: 20px 0 0 0;
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none;
	*/
}
.cookie-consent-terms { text-align:left; padding-top:15px !important; }
.cookie-consent-terms ul { list-style-type: square; margin-left:20px; }
.cookie-consent-terms a {word-break: break-all;} /* break long urls */

/** drawer **/
.drawer {
  display: none;
  position: fixed;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  top: 0;
  bottom: 0;
  padding: 0 15px 15px;
  max-width: 95%;
  z-index: 1003;
  color: #040432;
  background-color: #F8F8F8;
  box-shadow: 0 0 150px #0000001a;
  transition: -webkit-transform .25s cubic-bezier(.165,.84,.44,1);
  transition: transform .25s cubic-bezier(.165,.84,.44,1);
  transition: transform .25s cubic-bezier(.165,.84,.44,1),-webkit-transform .25s cubic-bezier(.165,.84,.44,1);
    transition-duration: 0.25s, 0.25s;
}


/** modal **/
.blocker {
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  width: 100%; height: 100%;
  overflow: auto;
  z-index: 1002;
  padding: 20px;
  box-sizing: border-box;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0,0.50);
  text-align: center;
}
.blocker:before{
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.05em;
}
.blocker.behind {
  background-color: transparent;
}
.modal {
  display: none;
  vertical-align: middle;
  position: relative;
  z-index: 1003;
  max-width: 500px;
  box-sizing: border-box;
  width: 90%;
  background: #fff;
  padding: 15px 30px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-shadow: 0 0 10px #666;
  -moz-box-shadow: 0 0 10px #666;
  -o-box-shadow: 0 0 10px #666;
  -ms-box-shadow: 0 0 10px #666;
  box-shadow: 0 0 10px #666;
  text-align: left;
}

.modal a.close-modal {
  position: absolute;
  top: -12.5px;
  right: -12.5px;
  display: block;
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==');

}

.modal-spinner {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  padding: 12px 16px;
  border-radius: 5px;
  background-color: #111;
  height: 20px;
}

.modal-spinner > div {
  border-radius: 100px;
  background-color: #fff;
  height: 20px;
  width: 2px;
  margin: 0 1px;
  display: inline-block;

  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.modal-spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.modal-spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.modal-spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.5) }
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
  0%, 40%, 100% {
    transform: scaleY(0.5);
    -webkit-transform: scaleY(0.5);
  }  20% {
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}

/** tablet **/
@media (min-width: 901px) and (max-width: 1250px) {

	nav.top, .banner-zone.top { padding-left:15px; padding-right:15px; }

}

/* mobile portrait, mobile landscape, some tablet portrait */
@media (max-width: 900px) {

	nav.top .center,
	nav.main .center,
	footer .site-maps,
	.site-width
	{ width:100% !important; max-width:100%; }

	header:not(.mobile-show) { display:none; }
	.header-mobile { display:block;  }
	.header-mobile.margin-bottom { margin: 0 0 15px; }
	.header-mobile img { max-width:100%; }

	nav.top { padding-left:5px; padding-right:5px; } 
	nav.top .links { display:none; }
	nav.top .mobile-menu { display:block; margin-left:20px; cursor:pointer; }
	nav.top .top-nav-text { display:none; }
	.lang-selector.dropdown:hover .submenu-container-lang { display: none; }

	nav.mobile { width:100%; position:relative;  }
	nav.mobile.open { display:block; }
	nav.mobile .links { display:block; position:absolute; width:100%; z-index:1000; }
	nav.mobile .links .link {
		position:relative;
		background-color: #f9f9f9;
		padding: 12px 16px;
		border-bottom:.5px solid #666;
		cursor:pointer;
		text-transform: uppercase;
	}

	nav.mobile .links .link .anchor { position:relative; }
	nav.mobile .links .link a { text-decoration:none; text-transform: uppercase; }
	nav.mobile.open .submenu-container-lang { width:100%; display: block; }
	nav.mobile.open .submenu-container-lang li { cursor:pointer; }

	nav.mobile .links .link.dropdown .anchor { z-index:1; position:relative; } /** layer over svg so .link:hover a works **/
	nav.mobile .links .link.dropdown .svg { position:absolute; top:11px; right:16px; z-index:0; } /** absolute position so size does not affect link height **/
	nav.mobile .links .link.dropdown .svg .close { display:none; } /** use inline svg so we can dynamically set fill in customcss.php **/
	nav.mobile .links .link.dropdown.open .svg .open { display:none; }
	nav.mobile .links .link.dropdown.open .svg .close { display:block; }

	/*
	nav.mobile .links .link.dropdown .anchor::after {
		content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path d='M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z' /></svg>");
		width:24px; height:24px;
		display: inline-block;
		position: absolute;
		right: 0;
		top: 0;
	}
	nav.mobile .links .link.dropdown.open .anchor::after {	
		content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z' /></svg>");
	}
	*/

	nav.mobile .menu {
		display: none;
		width:100%;
	}
	nav.mobile .menu .menu-content { background-color: #f9f9f9; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; }
	nav.mobile .menu .menu-content .item {
		padding: 12px 16px;  display: block; border-bottom:.5px solid #666; cursor:pointer;
	}
	nav.mobile .menu .menu-content .item:first-child {}
	nav.mobile .menu .menu-content a {
	  text-decoration: none; text-transform: uppercase;
	}
	nav.mobile .menu.open {display: block;}


	.banner-zone.top { display:none; }

	nav.main { display:none; }

	main { padding-bottom: 20px; } /** to accommodate footer bar **/
	main > h1.mobile-padding { padding-left: 10px; padding-right:10px; }

	footer .site-maps { display:block; padding:20px; }
	footer .site-maps .site-map { margin: 0 0 20px 0; }

	footer .site-maps .site-map.text .bswanky-newsletter-signup { width:100% !important; margin: 0 auto !important; }


	nav.footer-bar {
	  display:block;
	  position: fixed;
	  width: 100%;
	  min-height: 50px;
	  background-color: rgb(204, 204, 204);
	  left: 0px;
	  bottom: 0px;
	  padding: 15px 10px;
	  border-top: 1px solid #999;
	  z-index: 1000;
	}

	nav.footer-bar .link { margin-left:20px; }
	nav.footer-bar .link:first-child { margin-left:0px; }
	nav.footer-bar a { text-transform:uppercase; font-weight:bold; font-size:1em; }



}

/** animations **/
@-webkit-keyframes overlay-on {
  from {
    opacity: 0; }

  to {
    opacity: 0.6; } }

@keyframes overlay-on {
  from {
    opacity: 0; }

  to {
    opacity: 0.6; } }

@-webkit-keyframes overlay-off {
  from {
    opacity: 0.6; }

  to {
    opacity: 0; } }

@keyframes overlay-off {
  from {
    opacity: 0.6; }

  to {
    opacity: 0; } }

@-webkit-keyframes full-overlay-on {
  from {
    opacity: 0; }

  to {
    opacity: 1; } }

@keyframes full-overlay-on {
  from {
    opacity: 0; }

  to {
    opacity: 1; } }

@-webkit-keyframes full-overlay-off {
  from {
    opacity: 1; }

  to {
    opacity: 0; } }

@keyframes full-overlay-off {
  from {
    opacity: 1; }

  to {
    opacity: 0; } }

@-webkit-keyframes modal-open {
  from {
    opacity: 0;
    -webkit-transform: translateY(30px);
    transform: translateY(30px); }

  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

@keyframes modal-open {
  from {
    opacity: 0;
    -webkit-transform: translateY(30px);
    transform: translateY(30px); }

  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

@-webkit-keyframes modal-closing {
  from {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); }

  to {
    opacity: 0;
    -webkit-transform: scale(0.9);
    transform: scale(0.9); } }

@keyframes modal-closing {
  from {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); }

  to {
    opacity: 0;
    -webkit-transform: scale(0.9);
    transform: scale(0.9); } }

@-webkit-keyframes rise-up {
  from {
    opacity: 1;
    -webkit-transform: translateY(120%);
    transform: translateY(120%); }

  to {
    opacity: 1;
    -webkit-transform: translateY(0%);
    transform: translateY(0%); } }

@keyframes rise-up {
  from {
    opacity: 1;
    -webkit-transform: translateY(120%);
    transform: translateY(120%); }

  to {
    opacity: 1;
    -webkit-transform: translateY(0%);
    transform: translateY(0%); } }

@-webkit-keyframes rise-up-out {
  from {
    opacity: 1;
    -webkit-transform: translateY(0%);
    transform: translateY(0%); }

  to {
    opacity: 1;
    -webkit-transform: translateY(-120%);
    transform: translateY(-120%); } }

@keyframes rise-up-out {
  from {
    opacity: 1;
    -webkit-transform: translateY(0%);
    transform: translateY(0%); }

  to {
    opacity: 1;
    -webkit-transform: translateY(-120%);
    transform: translateY(-120%); } }

