body {
	padding: 0;
    margin: 0;
    background-color: var(--dark-background);
    font-weight: normal;
	font-family: 'Inter', sans-serif;
    /*font-family: 'Unbounded';*/
    display: block;
    font-stretch: normal;
    font-style: normal;
    -webkit-font-smoothing: subpixel-antialiased;
}

a {
	color: var(--black);
	text-decoration: none;
}

.main-wrapper {
	max-width: 100%;
	margin: 0 auto;
	overflow: hidden;
	min-height: 400px;
}



.main-wrapper-blocks {
	padding: 0 0 0 32px;
}

@media (max-width: 767px) {
	.main-wrapper-blocks {
		padding: 0 0 0 16px;
	}
}

.backlight {
  	width: 100vw;
  	height: 80vw;
  	opacity: 0.8;
  	background-image: radial-gradient(circle at 50% 50%, #525252, rgba(18, 18, 18, 0) 64%);
    position: absolute;
    top: -50vw;
    left: -40vw;
    z-index: -1;
}

.logo-main {
	margin: 16px;
	margin-bottom: 64px;
	width: 16%;
	aspect-ratio: calc(216 / 32);
	background-image: url(/svg/logo.svg);
	background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 3;
}

.text-big-1 {
	margin: 64px 0 4px 16px;
    opacity: 0.64;
    font-size: 64px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    color: var(--gold);
}

.tags-inline-wrapper {
	margin-left: 16px;
	text-align: center;
}

.tag-inline-text {
	border: 1px solid #1a1a1a;
	background: #1a1a1a;
	padding: 8px 16px;
	color: white;
	font-size: 12px;
	font-weight: 400;
	border-radius: 4px;
	display: inline-block;
	margin: 4px 4px 4px 0;
	text-transform: uppercase;
	cursor: pointer;
	user-select: none;
}

.tag-inline-text.active {
	border: 1px solid var(--gold);
	color: white;
}

.tag-inline-text:hover {
	border-color: white;
}

.tag-inline-text:active {
	opacity: 0.8;
}

.index-page .block {
    float: left;
   	text-align: left;
   	position: relative;
   	cursor: pointer;
   	user-select: none;
   	overflow: hidden;
	margin-right: 16px; /* wd new */
	margin-bottom: 16px; /* wd new */
}

.index-page .block-img {
    position: relative;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 1s ease;
    background-repeat: no-repeat;
    background-position: 100% 100%;
    filter: brightness(103%) contrast(95%);
	opacity: 0.8;
	transform: scale3d(1, 1, 1);
}

.index-page .block-img:hover {
	filter: brightness(108%) contrast(105%);
 	transform: scale3d(1.05, 1.05, 1.05);
}

.index-page .block-over {
	width: 100%;
	height: 100%;
	background: linear-gradient(10deg, rgba(255,255,255,1) 10%, rgba(0,0,0,1) 45%);
    border-radius: 2px;
	position: relative;
}

.index-page .block-over:hover .block-img {
	filter: brightness(108%) contrast(105%);
 	transform: scale3d(1.05, 1.05, 1.05);
}

.index-page .block-over {
	width: 100%;
	height: 100%;
	background: linear-gradient(10deg, rgba(255,255,255,1) 10%, rgba(0,0,0,1) 45%);
	border-radius: 2px;
	position: relative;
	overflow: hidden;
}

.index-page .block .arrow {
	background-color: #000;
	opacity: 0.5;
	position: absolute;
	width: 64px;
	height: 64px;
	color: white;
	font-size: 52px;
	font-weight: bold;
	top: calc(50% - 33px);
	padding-left: 8px;
	border-radius: 2px;
}

.index-page .block .arrow.left {
	left: 16px;
}

.index-page .block .arrow.right {
	right: 16px;
}

@media (max-width: 767px) {
    .index-page .block .arrow {
    	width: 42px;
    	height: 42px;
    	color: white;
    	font-size: 32px;
    	top: 14px;
    	padding-left: 5px;
    	border-radius: 2px;
    }
	.index-page .block .arrow.left {
		left: 14px;
	}
	.index-page .block .arrow.right {
		right: 14px;
	}
}

.index-page .block .arrow:hover {
	opacity: 0.75;
}

.index-page .block .arrow:active {
	color: #aaa;
	opacity: 0.4;
}

.index-page .block .arrow.invisible {
	opacity: 0.08;
}

.index-page .block .arrow.invisible:active {
	color: white;
}

/*.block:active {
	opacity: 0.8;
}*/

.index-page .block[disabled] {
	opacity: 0.2;
}

.index-page .block.b1:hover {
	filter: none;
}

.index-page .block.1:active {
	opacity: 1;
}

.index-page .block.b1 {
	width: 100%;
	aspect-ratio: 2400/860; /* 1616/580 */
}

.index-page .block.b1 {
/*	margin-left: 16px;
	margin-right: 16px;
	width: calc(100% - 32px);*/
}

@media (max-width: 767px) {
	.index-page .block.b1 {
		width: 100vw;
		height: auto;
		margin-left: 0;
		margin-right: 0;
	}
}

.index-page .block.b2 {
	width: calc(50% - 24px);
	aspect-ratio: 824/544;
	border-radius: 2px;
}

.index-page .block.b3 {
	width: calc(33.33% - 21.6px);
	aspect-ratio: 1;
}

.clear {
	clear: both;
}

.index-page .block .text-wrapper {
	position: absolute;
	bottom: 8px;
	left: 8px;
	z-index: 2;
}

.index-page .block .tag {
	/*border: 1px solid var(--gold);*/
	background: rgba(18, 18, 18, 0.64);
	padding: 8px 12px;
	color: white;
	font-size: 12px;
	font-weight: 400;
	border-radius: 4px;
	display: inline-block;
	margin: 0 0 0 16px;
	text-transform: uppercase;
	user-select: none;
}

.index-page .block .header {
	color: white;
	font-size: 32px;
	font-weight: bold;
	margin: 4px 0 8px 16px;
	max-width: 80%;
	cursor: pointer;
	line-height: 0.88;
	text-shadow: 
	    0 0 10px rgba(0, 0, 0, 0.83),
	    0 0 20px rgba(0, 0, 0, 0.53),
	    0 0 30px rgba(0, 0, 0, 0.33),
	    0 0 40px rgba(0, 0, 0, 0.23);
}

.headmenu {
	position: absolute;
	top: 8px;
	right: 0;
}

.headlink {
	display: inline-block;
    height: 20px;
    margin: 0 16px;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    padding: 0;
    text-align: right;
    color: var(--gold);
    user-select: none;
    cursor: pointer;
}

.headlink:hover {
	color: white;
}

.headlink:active {
	opacity: 0.8;
}

.headlink[disabled] {
	opacity: 0.2;
}

.uppercolumns-container-one {
	clear: both;
	width: 100%;
	padding: 16px;
	padding-top: 32px;
	margin-bottom: 16px;
	height: var(--text-height);
	overflow: hidden;
	position: relative;
}

.uppercolumns-container-two {
	height: 180px;
	-webkit-mask-image: var(--text-shadow);
}

.uppercolumns {
	columns: auto 3;
	font-size: 16px;
	color: white;
	opacity: 0.8;
 }

.expander, .collapser {
    left: 50%;
    transform: translate(-50%, 0);
    color: var(--gold);
  	font-size: 20px;
  	cursor: pointer;
    animation: bannersMain linear infinite;
}

.dotted {
	border-bottom: 1px dashed var(--gold);
}

.undotted {
  	border: none;
}

.expander {
	position: absolute;
	bottom: 8px;
}

.collapser {
	margin-top: 16px;
	display: inline-block;
    position: relative;
}

.expander:hover, .collapser:hover {
	color: white;
}

.expander:active, .collapser:active {
	opacity: 0.8;
}

.expander[disabled], .collapser[disabled] {
	opacity: 0.2;
}


.separator {
    width: calc(100% - 32px);
    height: 1px;
    background-color: #3a3a3a;
    opacity: 0.32;
    margin: 0 8px;
}

.index-page .logo-blocks {
	width: 100%;
	display: flex;
	padding: 32px;
}

.index-page .hide {
	display: none !important;
}

@media (max-width: 767px) {
	.index-page .logo-blocks {
		width: 100%;
		display: block;
		padding: 16px;
	}
}

.index-page .logo-blocks .logo {
	margin-right: 16px;
	position: relative;
    aspect-ratio: 320/280;
    border-radius: 2px;
    user-select: none;
    cursor: pointer;
	width: calc(100% / 5);
}

.logo-blocks .logo:last-child {
	margin-right: 0;
}

.index-page .logo-blocks .logo img {
	position: absolute;
	width: 80%;
	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);	
}

@media (max-width: 767px) {
	.index-page .logo-blocks .logo {
		display: flex;
	    justify-content: center;
    	align-items: center;
	    width: auto;
	    aspect-ratio: 361/128;
		height: auto;
    	margin-top: 16px;
    	margin-right: 0;
    	border-radius: 2px;
		overflow: hidden;
   	}

	.index-page .logo-blocks .logo img {
		position: static;
		width: auto;
		object-fit: cover;
		transform: none;
		zoom: 0.88;
	}
}

.index-page .logo-blocks .logo:hover {
	filter: brightness(107%) contrast(95%);
}

.index-page .logo-blocks .logo:active {
	opacity: 0.8;
}

.index-page .logo-blocks .logo[disabled] {
	opacity: 0.2;
}

/*
.write-us-wrapper {
	width: 600px;
	max-width: calc(100% - 32px);
	min-height: 200px;
	margin-left: 16px;
	background-color: #323232;
	padding: 16px;
	border-radius: 16px;
}

.write-us-wrapper .header {
	font-size: 16px;
	color: white;
	margin: 8px 0 16px 2px;
}

.write-us-wrapper input[type="text"] {
	width: calc(50% - 16px);
	margin-bottom: 16px;
}

.write-us-wrapper input[type="text"]:first-of-type {
	margin-right: 12px;
}

.write-us-wrapper textarea {
	width: calc(100% - 16px);
	height: 212px;
}
*/

.write-us-wrapper button {
	border: 1px solid var(--gold);
	padding: 8px 16px;
	font-size: 16px;
	font-weight: bold;
	border-radius: calc(1vw + 12px);
	display: inline-block;
	margin: 16px 0;
	text-transform: uppercase;
	cursor: pointer;
	user-select: none;
	background: var(--gold);
	color: white;
}

.one-collection-image {
	width: 50vw;
}

.one-collection-image {
	width: 50vw;
}

.fader {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2;
	background: black;
	opacity: 0.75;
	width: 100vw;
	height: 100%;
	display: none;
}

.collection-pad {
	width: 94vw;
	max-width: 1200px;
	aspect-ratio: 1616/960;
	position: fixed;
	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);	
	background: var(--dark-background);
	border-radius: 16px;
	display: none;
	overflow: hidden;
	z-index: 2;
	user-select: none;
}

.collection-pad .slideshow {
	position: absolute;
	left: 0;
	top: 0;
	width: 64%;
	height: 100%;
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    overflow: hidden;
}

.collection-pad .right-side {
	position: absolute;
	top: 0;
	left: 64%;
	background-color: var(--dark-background);
	padding: 16px 0 0 16px;
	height: 100%;
	width: 36%;
	vertical-align: top;
}

.collection-pad .header {
	color: white;
	font-size: 24px;
	max-width: 23vw;
	font-weight: bold;
	margin: 0 0 16px 0;
	line-height: 0.88;
}

.collection-pad .text {
	color: white;
	opacity: 0.64;
	font-size: 14px;
    width: 100%;
    padding: 0 32px 16px 0;
}

.collection-pad .tag {
	border: 1px solid var(--gold);
	background: rgba(18, 18, 18, 0.64);
	padding: 8px 12px;
	color: white;
	font-size: 16px;
	font-weight: bold;
	border-radius: 32px;
	display: inline-block;
	margin: 8px 0 8px 0;
	text-transform: uppercase;
	user-select: none;
}

.collection-pad .wheretobuy {
	position: absolute;
	bottom: 32px;
	left: 0;
	width: calc(100% - 16px);
}

.collection-pad .wheretobuy .header-where {
    position: relative;
    left: 16px;
    font-size: 32px;
    font-weight: bold;
    color: var(--gold);
}

.collection-pad .logo-blocks {
    position: relative;
    left: 16px;
	margin: 0;
}

.collection-pad .logo-blocks .logo {
    display: inline-block;
    width: calc(50% - 16px);
    height: auto;
    aspect-ratio: 256/64;
    margin: 8px 8px 0 0;
    border-radius: 8px;
    user-select: none;
    cursor: pointer;
}

.collection-pad .logo-blocks .logo img {
	width: 56%;
}

.collection-pad .arrow {
	color: white;
	font-size: 40px;
	cursor: pointer;
	position: absolute;
	top: calc(50% - 1.5vw - 4px);
	user-select: none;
	width: calc(3vw + 12px);
	max-width: 64px;
	height: calc(3vw + 12px);
	max-height: 64px;
	border-radius: calc(3vw + 12px);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    box-shadow: 3px 3px 10px rgba(0,0,0,0.5);
}

.collection-pad .arrow.left {
	left: 16px;
	background-image: url(/img/l-arrow.png);
}

.collection-pad .arrow.right {
	right: 16px;
	background-image: url(/img/r-arrow.png);
}

.collection-pad .arrow.right:hover {
	background-image: url(/img/r-arrow-hover.png);
}

.collection-pad .arrow.left:hover {
	background-image: url(/img/l-arrow-hover.png);
}

.collection-pad .arrow:active {
	opacity: 0.8;
}

.collection-pad .arrow[disabled] {
	opacity: 0.2;
}

.collection-pad .slider-points {
	position: absolute;
	left: calc(50% - 175px);
	width: 350px;
	bottom: 16px;
	color: white;
	text-align: center;
	user-select: none;
}

.collection-pad .slider-image {
	width: 100%;
	height: 100%;
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    left: 0;
    top: 0;
}

.collection-pad .bullet {
	width: 16px;
	height: 16px;
	border-radius: 16px;
	background-color: white;
	margin-right: 8px;
	display: inline-block;
	cursor: pointer;
	opacity: 0.32;
}

.collection-pad .bullet.active {
	opacity: 1;
}

.collection-pad .close {
	cursor: pointer;
	position: absolute;
	top: 16px;
	right: 16px;
	user-select: none;
	width: calc(1vw + 8px);
	height: calc(1vw + 8px);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
	background-image: url(/img/cross-close-pad.png);
}

.collection-pad .close:hover {
	background-image: url(/img/cross-close-pad-hover.png);
}

.collection-pad .close:active {
	opacity: 0.8;
}

.collection-pad .close[disabled] {
	opacity: 0.2;
}

.mob-menu-stripes {
	position: absolute;
	top: 8px;
	right: 16px;
	width: 24px;
	height: 24px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
	background-image: url(/img/three-stripes.png);
	display: none;
}

.mob-menu-stripes.open {
	background-image: url(/img/cross-close-pad.png);
}

.footer {
	width: 100%;
	margin: 32px 0 0 0;
	position: relative;
    height: 200px;
    color: #525252;
    font-size: 16px;
    background-color: #000;
}

.footer .logo {
	position: absolute;
	left: 16px;
	top: 16px;
	width: 162px;
	aspect-ratio: calc(216 / 32);
	background-image: url(/svg/logo.svg);
	background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
    filter: grayscale(1);
    filter: gray;
    opacity: 0.32;
}

.footer .text {
	position: absolute;
	left: 16px;
	top: 56px;
}

.footer .right {
	position: absolute;
	right: 64px;
	top: 16px;
}

@media (min-width: 760px) and (max-width: 1180px) {
    .collection-pad .header {
    	font-size: 16px;
    }
    .block .tag {
    	font-size: 12px;
    }
    .block .header {
    	font-size: 16px;
		margin: 4px 0 8px 0;
    }
    .collection-pad .text {
    	font-size: 12px;
    }
    .collection-pad .wheretobuy .header-where {
    	font-size: 20px;
    }
	.block .tag {
		margin: 0;
	}
	.uppercolumns {	
		columns: auto 2;
	}
}

@media (min-width: 760px) and (max-width: 980px) {
	.collection-pad .tag {
        display: none;
    }
    .collection-pad .slideshow {
    	width: 50%;
    }
    .collection-pad .right-side {
    	width: 50%;
    	left: 50%;
    }
    .collection-pad .wheretobuy {
    	bottom: 8px;
    }
    .collection-pad .text {
    	font-size: 11px;
    }
}

@media (max-width: 760px) {
	.logo-main {
		width: 216px;
		height: 32px;
		margin-bottom: 32px;
		position: relative;
		z-index: 3;
	}

	.logo-text {
		font-size: 32px;
	}

	h1 {
		font-size: 24px;
		min-width: 80%;
		text-align: left;
		height: 64px;
		margin: 4px 16px;
		display: block;
	}

	.headlink {
		font-size: 24px;
		min-width: 80%;
		text-align: left;
		float: left;
		height: 32px;
		margin: 4px 0;
		display: block;
	}

	.headmenu {
		position: relative;
		top: auto;
		right: auto;
		margin: 32px 0 8px 16px;
		display: none;
		height: calc(100vh - 100px);
	}

	.tag-inline-text {
		padding: calc(0.32vw + 4px) calc(0.32vw + 8px);
		font-size: 12px;
	}

	.uppercolumns {
		font-size: 12px;
		columns: auto 1;
	}

	.index-page .block {
		border-radius: 4px;
	}

	.index-page .block.b2 {
		width: calc(100% - 16px);
		aspect-ratio: 361/280;
	}

	.index-page .block.b3 {
		width: calc(100% - 16px);
		aspect-ratio: 361/280;
	}

	.index-page .block .tag {
		margin: 0 0 0 4px;
		font-size: 12px;
		font-family: 'Unbounded' !important;
	}

	.index-page .block .header {
		margin: 4px 0 8px 4px;
	}

	.text-big-1 {
		font-size: 24px;		
	}

	.logo-blocks .logo {
	    width: 21vw;
    	height: calc(21vw / 760 * 440);
    	margin-top: 8px;
		border-radius: 4px;
	}

	.collection-pad {
		position: absolute;
		width: 100vw;
		height: calc(128vw + 500px);
		transform: none;
		top: 64px;
		left: 0;
		overflow: visible; /* for close */
	}

	.collection-pad .slideshow {
		width: 100%;
		height: 92vw;
	}

	.collection-pad .right-side {
		width: 100%;
		height: auto;
		top: 94vw;
		left: 4px;
		background: var(--dark-background);
		padding-bottom: 16px;
		padding-left: 0;
	}

	.collection-pad .tag {
		font-size: calc(3vw + 6px);
		border-radius: calc(3vw + 18px);
		padding: 8px 16px;
	}

	.collection-pad .close {
		background-image: url(/img/cross-close-pad.png);
		position: absolute;
		top: -56px;
		right: 16px;
		width: 24px;
		height: 24px;
	}

	.collection-pad .header {
		font-size: calc(4vw + 12px);
		max-width: 88vw;
	}

	.collection-pad .text {
		font-size: calc(2vw + 8px);
		max-width: 88vw;
	}

	.collection-pad .arrow {
		width: 48px;
		height: 48px;
		border-radius: 48px;
	}

	.collection-pad .bullet {
		font-size: 48px;
	}

	.collection-pad .wheretobuy {
		position: relative;
		bottom: auto;
	}

	.collection-pad .wheretobuy .header-where {
		left: 0;
		font-size: calc(4vw + 12px);
	}

	.collection-pad .logo-blocks {
		left: 0;
		width: 100%;
	}

	.collection-pad .logo-blocks .logo {
		width: 43.5vw;
	}

	.mob-menu-stripes {
		display: block;
	}

	.fader {
		opacity: 1;
	}

	.footer .right {
		position: absolute;
		right: auto;
		left: 16px;
		top: 88px;
	}
}


@keyframes bannersMain {
    0% {
        opacity: 0;
    }
    7% {
        opacity: 1;
    }
    83% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.banners-main-points {
	position: absolute;
	bottom: 16px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
}

.banners-main-point {
	width: 8px;
	height: 8px;
	background-color: #e5e5e5;
	opacity: 0.6;
	border-radius: 2px;
	flex-shrink: 0;
	box-shadow: 3px 3px 10px rgba(0,0,0,0.4);
}

.banners-main-point.active {
	opacity: 1;
}

.banners-main {
    animation: bannersMain linear infinite;
    animation-duration: 5s;
    cursor: auto;
	background-size: cover;
	position: relative;
}

@media (max-width: 767px) {
	.banners-main-points {
		bottom: 8px;
	}
}

@keyframes slideRightCurrent {
    0% {
        left: 0;
    }
    100% {
        left: -100%;
    }
}

@keyframes slideRightNext {
    0% {
        left: 100%;
    }
    100% {
        left: 0;
    }
}

@keyframes slideLeftCurrent {
    0% {
        left: 0;
    }
    100% {
        left: 100%;
    }
}

@keyframes slideLeftNext {
    0% {
        left: -100%;
    }
    100% {
        left: 0%;
    }
}

@keyframes expandText0 {
	0% {
		height: var(--text-height);
	}
	100% {
		height: var(--expander-height);
	}
}

@keyframes expandText1 {
	0% {
		-webkit-mask-image: var(--text-shadow);
	}
	100% {
		-webkit-mask-image: none;
	}
}

@keyframes collapseText0 {
	0% {
		height: var(--expander-height);
	}
	100% {
		height: var(--text-height);
	}
}

@keyframes collapseText1 {
	0% {
		-webkit-mask-image: none;
	}
	100% {
		-webkit-mask-image: var(--text-shadow);
	}
}


