:root {
	--header-height: 65px;
	--font-family: 'Montserrat', Arial, Helvetica, sans-serif;
	--font_color_main: #000;
	--border-radius: 4px;
	--background-full-alternate:rgba(229,229,229,1);
	--font-size: 16px;
	--site-max-width: 1225px;
    font-family: var(--font-family);
    font-size: var(--font-size);
    @media screen and (max-width: 768px) {
      --header-height: 60px;
      
    }

}
html, body{
  font-family: var(--font-family);  
  font-size: var(--font-size);
  padding: 0;
  margin: 0;
 
}

.layout01-container{
	width: 100%;
	height: auto;
	padding: var(--header-height) 0 0 0;
	position: relative;
	display: flex;
    flex-direction: column;
    justify-content: top;

}
.full-width-content {
	
	padding: 0;
	margin: 0;
	/*background-color: rgb(155, 233, 30);*/
	height: auto;
	width: 100%;
	 
	
}
.centered-content {
	text-align: center;
	margin: 0 auto;
	max-width: var(--site-max-width);
	
	height: auto;
	box-sizing: border-box;
	
	@media screen and (max-width: 1267px) {
			padding: 0 1rem;
		
		}
	
}

.centered-content *{
	text-align: left;
}
header{
	width: 100%;
	height: var(--header-height);
	box-shadow: 0 8px 8px -8px rgba(0,0,0,0.3);
	background-image: linear-gradient(to bottom, #fff 90%, rgba(0,0,0,0.15) 100%);
	z-index:10;	
	position: fixed;
	top: 0;
	margin: 0;
    & *{box-sizing: border-box;}
	
}
 
main{
	
	width: 100%;
	margin: 0 auto;
	min-height: calc(100dvh );
	box-sizing: border-box;
	/*background-color: aqua;*/
	padding: 0;
	display: flex;
    flex-direction: column;
    justify-content: top;
	z-index:5;
	
}
footer{
	width: 100%;
	height: auto;
	/*background-color: #e4d3d3;*/
	background-color: #fff;
	position: relative;
	bottom: 0;
	margin: 0;
	/*text-align: center;
	color: white;
	line-height: 50px;
	font-size: 14px;*/
	z-index:3;
}

.flag {
    display: inline-block;
    width: 18px;
    height: 18px;
    background-image: url(/images/flags.webp);
    background-size: 288px 288px;
    margin-right: 4px;
    border-radius: 50%;
	
}
.cart-pre-holder{
  position: fixed !important;
  height: 100%;
  right: -100%;
  top: 0;
  z-index: 100;
  overflow-y: auto;
  box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.06);
  width:100%;
  border-left: solid 1px rgba(255,255,255,1);
  background-color: #fff;
  max-width: 450px;
}

.pre-cart-container{
	width: 92%;
	margin: auto;
	height: calc(100% - 18vh - 30px);
	& .pre-cart-title{
		height: 7vh;
		border-bottom: solid 1px rgba(0,0,0,1);
		font-size: 1.5rem;
		font-weight: 600;
		padding: 0px;
		display: flex;
		justify-content: left !important;
		align-items: flex-end !important;
		& .icon-x-circle{
			right: 30px;
			position: absolute;
			top: 20px;
		}
	}
	& .pre-cart-list{
		padding-top: 10px;
		& .pre-cart-item{
			animation-name: ani_fade_in;
			animation-duration: 0.2s;
			animation-fill-mode: forwards;
			font-size:1rem;
			color:#000;
			padding: 10px 0px 15px 0px;
			float:left;
			& .pre-cart-text-container{
			   width:75%;
			   float:left;
			   & .pre-cart-title-item{
				   & a{
					text-transform: uppercase;
					font-weight: 600;
					text-decoration:none;
					color:black;
				   }
			   }
			   & .pre-cart-title-item, 
			   & .pre-cart-artists-item, 
			   & .pre-cart-price-item, 
			   & .pre-cart-frame-item{
				  padding-bottom:3px;   
			   }
			   & .pre-cart-remove-item{
				   padding-top:7px;
				   text-decoration:underline !important;
				   cursor:pointer;
			   }
			}
			& .pre-cart-img-item{
			   width:25%;
			   aspect-ratio: 1/1.0;
			   overflow:hidden;
			   & img{
				  width: 100% !important;
				  height: 100% !important;
                  object-fit: cover !important;
				  max-width: 100% !important;
                  max-height: 100% !important;
                  vertical-align: middle;
                  border: none;  
			   }
			}
		}
	}
	
	
	
	& .pre-cart-total-container{
		padding: 15px;
		background-color: rgba(229,229,229,1);
		overflow-y: auto;
		height: 18vh;
		float: none;
		clear: both;
		margin: auto;
		font-weight:500;
		width: auto;
		& .pre-cart-total-area{
			width:92%;
			float: left;
			& .pre-cart-total{
				font-weight:600;
				font-size:1.2rem;
				float:left;
			}
			& .pre-cart-total-price{
				float:right;
				font-weight:700;
				font-size:1.2rem
			}
		}	
		& .pre-cart-button{
			width: 80%;
			margin: auto;
			padding-top: 50px;
		}
	}
}
& .pre-cart-total-container-text{
		width: 92%;
		margin: auto;
		padding-bottom:20px;
		& .pre-cart-total-area{
			width:92%;
			float: left;
			padding-bottom:20px;
			& .pre-cart-total{
				font-weight:600;
				font-size:1.2rem;
				float:left;
			}
			& .pre-cart-total-price{
				float:right;
				font-weight:700;
				font-size:1.2rem
			}
		}	
		& .pre-cart-button{
			width: 80%;
			margin: auto;
			padding-top: 50px;
		}
	}

.flag.af { background-position: 0.00% 0.00%;}
.flag.ax { background-position: 6.67% 0.00%;}
.flag.al { background-position: 13.33% 0.00%;}
.flag.dz { background-position: 20.00% 0.00%;}
.flag.aw { background-position: 80.00% 0.00%;}
.flag.as { background-position: 26.67% 0.00%;}
.flag.ad { background-position: 33.33% 0.00%;}
.flag.ao { background-position: 40.00% 0.00%;}
.flag.ai { background-position: 46.67% 0.00%;}
.flag.aq { background-position: 53.33% 0.00%;}
.flag.ag { background-position: 60.00% 0.00%;}
.flag.ar { background-position: 66.67% 0.00%;}
.flag.am { background-position: 73.33% 0.00%;}
.flag.au { background-position: 86.67% 0.00%;}
.flag.at { background-position: 93.33% 0.00%;}
.flag.az { background-position: 100.00% 0.00%;}
.flag.bs { background-position: 0.00% 6.67%;}
.flag.bh { background-position: 6.67% 6.67%;}
.flag.bd { background-position: 13.33% 6.67%;}
.flag.bb { background-position: 20.00% 6.67%;}
.flag.by { background-position: 26.67% 6.67%;}
.flag.be { background-position: 33.33% 6.67%;}
.flag.bz { background-position: 40.00% 6.67%;}
.flag.bj { background-position: 46.67% 6.67%;}
.flag.bm { background-position: 53.33% 6.67%;}
.flag.bt { background-position: 60.00% 6.67%;}
.flag.bo { background-position: 66.67% 6.67%;}
.flag.ba { background-position: 73.33% 6.67%;}
.flag.bw { background-position: 80.00% 6.67%;}
.flag.bv { background-position: 86.67% 6.67%;}
.flag.br { background-position: 93.33% 6.67%;}
.flag.io { background-position: 100.00% 6.67%;}
.flag.bn { background-position: 0.00% 13.33%;}
.flag.bg { background-position: 6.67% 13.33%;}
.flag.bf { background-position: 13.33% 13.33%;}
.flag.bi { background-position: 20.00% 13.33%;}
.flag.kh { background-position: 26.67% 13.33%;}
.flag.cm { background-position: 33.33% 13.33%;}
.flag.ca { background-position: 40.00% 13.33%;}
.flag.cv { background-position: 46.67% 13.33%;}
.flag.ky { background-position: 53.33% 13.33%;}
.flag.cf { background-position: 60.00% 13.33%;}
.flag.td { background-position: 66.67% 13.33%;}
.flag.cl { background-position: 73.33% 13.33%;}
.flag.cn { background-position: 80.00% 13.33%;}
.flag.cx { background-position: 86.67% 13.33%;}
.flag.cc { background-position: 93.33% 13.33%;}
.flag.co { background-position: 100.00% 13.33%;}
.flag.km { background-position: 0.00% 20.00%;}
.flag.cg { background-position: 6.67% 20.00%;}
.flag.cd { background-position: 13.33% 20.00%;}
.flag.ck { background-position: 20.00% 20.00%;}
.flag.cr { background-position: 26.67% 20.00%;}
.flag.ci { background-position: 33.33% 20.00%;}
.flag.hr { background-position: 40.00% 20.00%;}
.flag.cu { background-position: 46.67% 20.00%;}
.flag.cy { background-position: 53.33% 20.00%;}
.flag.cz { background-position: 60.00% 20.00%;}
.flag.dk { background-position: 66.67% 20.00%;}
.flag.dj { background-position: 73.33% 20.00%;}
.flag.dm { background-position: 80.00% 20.00%;}
.flag.do { background-position: 86.67% 20.00%;}
.flag.tl { background-position: 93.33% 20.00%;}
.flag.ec { background-position: 100.00% 20.00%;}
.flag.eg { background-position: 0.00% 26.67%;}
.flag.sv { background-position: 6.67% 26.67%;}
.flag.gq { background-position: 13.33% 26.67%;}
.flag.er { background-position: 20.00% 26.67%;}
.flag.ee { background-position: 26.67% 26.67%;}
.flag.et { background-position: 33.33% 26.67%;}
.flag.fk { background-position: 40.00% 26.67%;}
.flag.fo { background-position: 46.67% 26.67%;}
.flag.fj { background-position: 53.33% 26.67%;}
.flag.fi { background-position: 60.00% 26.67%;}
.flag.fr { background-position: 66.67% 26.67%;}
.flag.gf { background-position: 73.33% 26.67%;}
.flag.pf { background-position: 80.00% 26.67%;}
.flag.tf { background-position: 86.67% 26.67%;}
.flag.ga { background-position: 93.33% 26.67%;}
.flag.gm { background-position: 100.00% 26.67%;}
.flag.ge { background-position: 0.00% 33.33%;}
.flag.de { background-position: 6.67% 33.33%;}
.flag.gh { background-position: 13.33% 33.33%;}
.flag.gi { background-position: 20.00% 33.33%;}
.flag.gr { background-position: 26.67% 33.33%;}
.flag.gl { background-position: 33.33% 33.33%;}
.flag.gd { background-position: 40.00% 33.33%;}
.flag.gp { background-position: 46.67% 33.33%;}
.flag.gu { background-position: 53.33% 33.33%;}
.flag.gt { background-position: 60.00% 33.33%;}
.flag.gg { background-position: 66.67% 33.33%;}
.flag.gn { background-position: 73.33% 33.33%;}
.flag.gw { background-position: 80.00% 33.33%;}
.flag.gy { background-position: 86.67% 33.33%;}
.flag.ht { background-position: 93.33% 33.33%;}
.flag.hm { background-position: 100.00% 33.33%;}
.flag.hn { background-position: 0.00% 40.00%;}
.flag.hk { background-position: 6.67% 40.00%;}
.flag.hu { background-position: 13.33% 40.00%;}
.flag.is { background-position: 20.00% 40.00%;}
.flag.in { background-position: 26.67% 40.00%;}
.flag.id { background-position: 33.33% 40.00%;}
.flag.ir { background-position: 40.00% 40.00%;}
.flag.iq { background-position: 46.67% 40.00%;}
.flag.ie { background-position: 53.33% 40.00%;}
.flag.il { background-position: 60.00% 40.00%;}
.flag.it { background-position: 66.67% 40.00%;}
.flag.jm { background-position: 73.33% 40.00%;}
.flag.jp { background-position: 80.00% 40.00%;}
.flag.je { background-position: 86.67% 40.00%;}
.flag.jo { background-position: 93.33% 40.00%;}
.flag.kz { background-position: 100.00% 40.00%;}
.flag.ke { background-position: 0.00% 46.67%;}
.flag.ki { background-position: 6.67% 46.67%;}
.flag.kp { background-position: 13.33% 46.67%;}
.flag.kr { background-position: 20.00% 46.67%;}
.flag.kw { background-position: 26.67% 46.67%;}
.flag.kg { background-position: 33.33% 46.67%;}
.flag.la { background-position: 40.00% 46.67%;}
.flag.lv { background-position: 46.67% 46.67%;}
.flag.lb { background-position: 53.33% 46.67%;}
.flag.ls { background-position: 60.00% 46.67%;}
.flag.lr { background-position: 66.67% 46.67%;}
.flag.ly { background-position: 73.33% 46.67%;}
.flag.li { background-position: 80.00% 46.67%;}
.flag.lt { background-position: 86.67% 46.67%;}
.flag.lu { background-position: 93.33% 46.67%;}
.flag.mo { background-position: 100.00% 46.67%;}
.flag.mk { background-position: 0.00% 53.33%;}
.flag.mg { background-position: 6.67% 53.33%;}
.flag.mw { background-position: 13.33% 53.33%;}
.flag.my { background-position: 20.00% 53.33%;}
.flag.mv { background-position: 26.67% 53.33%;}
.flag.ml { background-position: 33.33% 53.33%;}
.flag.mt { background-position: 40.00% 53.33%;}
.flag.im { background-position: 46.67% 53.33%;}
.flag.mh { background-position: 53.33% 53.33%;}
.flag.mq { background-position: 60.00% 53.33%;}
.flag.mr { background-position: 66.67% 53.33%;}
.flag.mu { background-position: 73.33% 53.33%;}
.flag.yt { background-position: 80.00% 53.33%;}
.flag.mx { background-position: 86.67% 53.33%;}
.flag.fm { background-position: 93.33% 53.33%;}
.flag.md { background-position: 100.00% 53.33%;}
.flag.mc { background-position: 0.00% 60.00%;}
.flag.mn { background-position: 6.67% 60.00%;}
.flag.me { background-position: 13.33% 60.00%;}
.flag.ms { background-position: 20.00% 60.00%;}
.flag.ma { background-position: 26.67% 60.00%;}
.flag.mz { background-position: 33.33% 60.00%;}
.flag.mm { background-position: 40.00% 60.00%;}
.flag.na { background-position: 46.67% 60.00%;}
.flag.nr { background-position: 53.33% 60.00%;}
.flag.np { background-position: 60.00% 60.00%;}
.flag.an { background-position: 66.67% 60.00%;}
.flag.nl { background-position: 73.33% 60.00%;}
.flag.nc { background-position: 80.00% 60.00%;}
.flag.nz { background-position: 86.67% 60.00%;}
.flag.ni { background-position: 93.33% 60.00%;}
.flag.ne { background-position: 100.00% 60.00%;}
.flag.ng { background-position: 0.00% 66.67%;}
.flag.nu { background-position: 6.67% 66.67%;}
.flag.nf { background-position: 13.33% 66.67%;}
.flag.mp { background-position: 20.00% 66.67%;}
.flag.no { background-position: 26.67% 66.67%;}
.flag.om { background-position: 33.33% 66.67%;}
.flag.pk { background-position: 40.00% 66.67%;}
.flag.pw { background-position: 46.67% 66.67%;}
.flag.ps { background-position: 53.33% 66.67%;}
.flag.pa { background-position: 60.00% 66.67%;}
.flag.pg { background-position: 66.67% 66.67%;}
.flag.py { background-position: 73.33% 66.67%;}
.flag.pe { background-position: 80.00% 66.67%;}
.flag.ph { background-position: 86.67% 66.67%;}
.flag.pn { background-position: 93.33% 66.67%;}
.flag.pl { background-position: 100.00% 66.67%;}
.flag.pt { background-position: 0.00% 73.33%;}
.flag.pr { background-position: 6.67% 73.33%;}
.flag.qa { background-position: 13.33% 73.33%;}
.flag.re { background-position: 20.00% 73.33%;}
.flag.ro { background-position: 26.67% 73.33%;}
.flag.ru { background-position: 33.33% 73.33%;}
.flag.rw { background-position: 40.00% 73.33%;}
.flag.sh { background-position: 46.67% 73.33%;}
.flag.kn { background-position: 53.33% 73.33%;}
.flag.lc { background-position: 60.00% 73.33%;}
.flag.pm { background-position: 66.67% 73.33%;}
.flag.vc { background-position: 73.33% 73.33%;}
.flag.bl { background-position: 80.00% 73.33%;}
.flag.mf { background-position: 86.67% 73.33%;}
.flag.ws { background-position: 93.33% 73.33%;}
.flag.sm { background-position: 100.00% 73.33%;}
.flag.st { background-position: 0.00% 80.00%;}
.flag.sa { background-position: 6.67% 80.00%;}
.flag.sn { background-position: 13.33% 80.00%;}
.flag.rs { background-position: 20.00% 80.00%;}
.flag.sc { background-position: 26.67% 80.00%;}
.flag.sl { background-position: 33.33% 80.00%;}
.flag.sg { background-position: 40.00% 80.00%;}
.flag.sk { background-position: 46.67% 80.00%;}
.flag.si { background-position: 53.33% 80.00%;}
.flag.sb { background-position: 60.00% 80.00%;}
.flag.so { background-position: 66.67% 80.00%;}
.flag.za { background-position: 73.33% 80.00%;}
.flag.gs { background-position: 80.00% 80.00%;}
.flag.ss { background-position: 86.67% 80.00%;}
.flag.es { background-position: 93.33% 80.00%;}
.flag.lk { background-position: 100.00% 80.00%;}
.flag.sd { background-position: 0.00% 86.67%;}
.flag.sr { background-position: 6.67% 86.67%;}
.flag.sj { background-position: 13.33% 86.67%;}
.flag.sz { background-position: 20.00% 86.67%;}
.flag.se { background-position: 26.67% 86.67%;}
.flag.ch { background-position: 33.33% 86.67%;}
.flag.sy { background-position: 40.00% 86.67%;}
.flag.tw { background-position: 46.67% 86.67%;}
.flag.tj { background-position: 53.33% 86.67%;}
.flag.tz { background-position: 60.00% 86.67%;}
.flag.th { background-position: 66.67% 86.67%;}
.flag.tg { background-position: 73.33% 86.67%;}
.flag.tk { background-position: 80.00% 86.67%;}
.flag.to { background-position: 86.67% 86.67%;}
.flag.tt { background-position: 93.33% 86.67%;}
.flag.tn { background-position: 100.00% 86.67%;}
.flag.tr { background-position: 0.00% 93.33%;}
.flag.tm { background-position: 6.67% 93.33%;}
.flag.tc { background-position: 13.33% 93.33%;}
.flag.tv { background-position: 20.00% 93.33%;}
.flag.ug { background-position: 26.67% 93.33%;}
.flag.ua { background-position: 33.33% 93.33%;}
.flag.ae { background-position: 40.00% 93.33%;}
.flag.gb { background-position: 46.67% 93.33%;}
.flag.us { background-position: 53.33% 93.33%;}
.flag.um { background-position: 60.00% 93.33%;}
.flag.uy { background-position: 66.67% 93.33%;}
.flag.uz { background-position: 73.33% 93.33%;}
.flag.vu { background-position: 80.00% 93.33%;}
.flag.va { background-position: 86.67% 93.33%;}
.flag.ve { background-position: 93.33% 93.33%;}
.flag.vn { background-position: 100.00% 93.33%;}
.flag.vg { background-position: 0.00% 100.00%;}
.flag.vi { background-position: 6.67% 100.00%;}
.flag.wf { background-position: 13.33% 100.00%;}
.flag.eh { background-position: 20.00% 100.00%;}
.flag.ye { background-position: 26.67% 100.00%;}
.flag.zm { background-position: 33.33% 100.00%;}
.flag.zw { background-position: 40.00% 100.00%;}

price {
	display: none;
}

.USD price[currency=USD] {
	display: block;
}

.EUR price[currency=EUR] {
	display: block;
}

.GBP price[currency=GBP] {
	display: block;
}

div#curcurrency {
	display: none;
}

.USD div#curcurrency[currency=USD] {
	display: block;
}

.EUR div#curcurrency[currency=EUR] {
	display: block;
}

.GBP div#curcurrency[currency=GBP] {
	display: block;
}

price {
	font-weight: bold;
}
.login-overlay {
  display: none;
}
#breadcrumbs-container{
    margin-bottom: 20px;
	margin: 0;
	font-size: 0.8rem;
	& ol {
		list-style: none;
		margin: 0px;
		padding: 20px 0px 0px 0px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		position: relative;
		& li {
			display: inline;;
			& a{
				text-decoration:none;
				color:#000;
				text-transform: uppercase;
				& .divider {
				  margin: 0 5px;
				}
			}
		}
	}
}

.bg-gray{
	background-color: var(--background-full-alternate);
}

.caret {
  width: 0.9rem;   
  height: 0.9rem;
  fill: currentColor;   
  vertical-align: middle;
  transition: transform 160ms ease, fill 160ms ease, opacity 160ms ease;
  cursor: pointer;
}

.caret:hover { 
  transform: translateY(-1px);
}

.caret:active {
  transform: translateY(-2px);
}

.custom-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0;
    flex-wrap: wrap;
	gap:0px;
	& a {
		text-decoration: none;
		color: black;
		font-size: 16px;
		margin: 5px;
		padding: 12px;
		border-radius: 50%;
		border: 2px solid black;
		min-width: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: white;
		aspect-ratio: 1 / 1;
		font-size: 1.1rem;
		&.text-link {
			border: none;
			background: none;
			padding: 0 10px;
			aspect-ratio: auto;
			color: black;
			font-weight: bold;
			text-decoration: underline;
			
	
		}
		@media (max-width: 500px) {
		 	font-size: .9em;
        	padding:6px;
        	
		}
	}
};
.color-bg-red {
  background-color: rgba(187,0,0,1) !important;
}
