@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap');
@font-face {
	font-family: 'B52';
	src: url('/fonts/B52.eot');
	src: url('/fonts/B52.eot?#iefix') format('embedded-opentype'),
		 url('/fonts/B52.woff') format('woff'),
		 url('/fonts/B52.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
  }

@font-face {
    font-family: 'ProximaNova';
    font-display: block;
    src: url(/font/ProximaNova-Black.eot) format("eot"),
		 url(/font/ProximaNova-Black.ttf) format("ttf"),
		 url(/font/ProximaNova-Black.woff) format("woff");
    font-weight: 900;
    font-style: normal
}

@font-face {
    font-family: 'ProximaNova';
    font-display: block;
    src: url(/font/ProximaNova-Bold.eot) format("eot"),
		 url(/font/ProximaNova-Bold.ttf) format("ttf"),
		 url(/font/ProximaNova-Bold.woff) format("woff");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: 'ProximaNova';
    font-display: block;
    src: url(/font/ProximaNova-Regular.eot) format("eot"),
		 url(/font/ProximaNova-Regular.ttf) format("ttf"),
		 url(/font/ProximaNova-Regular.woff) format("woff");
    font-weight: 400;
    font-style: normal
}

body {
    margin: 0;
	background-color: #fff;
	font-family: 'ProximaNova', sans-serif;
	transition: background-color .3s;
}

body.active {
	background-color: rgba(0,0,0,0.6);
}

.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, .uk-heading-2xlarge, .uk-heading-large, .uk-heading-medium, .uk-heading-small, .uk-heading-xlarge, h1, h2, h3, h4, h5, h6 {
	font-family: 'ProximaNova', sans-serif;
}

.carousel {
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transform-style: preserve-3d;
		  transform-style: preserve-3d;
}
.carousel > * {
  display: block;
  position: absolute;
  width: 100%;
  height: 100vh;
  margin: 0;
  padding:0;
}

.carousel.backface > * {
  -webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
}
.carousel {
  -webkit-transition: -webkit-transform .3s;
		  transition: transform .3s;
}
.carousel > *{
  -webkit-transition: opacity 1s, -webkit-transform .3s,  top .3s, left .3s, width .3s, height .3s;
		  transition: opacity 1s, transform .3s, top .3s, left .3s, width .3s, height .3s; 
}
/**/
.floatleft{	float :left;}
.floatright{float :right;}
.textalignleft{	text-align:left;}
#ctrls {
	position:fixed;
	bottom:0;
	z-index: 2;
	position: relative;
}
figure {
	display: block;
	-webkit-margin-before: 0;
	-webkit-margin-after: 0;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
}
.wrapper{
	width: 100%;
    overflow: hidden;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
	position: relative;
}
.active .wrapper{
	z-index: 2;
}
#dots {
	width: 100%;
	float: left;
}
.dotOff {
	width: 15px;
	height:15px;
	background-color: gray;
	float: left; 
	border-radius: 100%;
	margin: 1%;
	position:relative;
}
.dotOn{background-color: blue;}
/* .container,#container{
	width: 80%; 
	position: relative;
	margin: 50px 10%;
	z-index: 1;
} */
.container, #container {
    width: 40%;
	/* height: 80%; */
	height: 48%;
    position: relative;
    /* margin: 50px 30%; */
    z-index: 1;
}

#container::after,.dotOff ::after{
	content:'';
	display:block;
	padding-top:55%;
}
.carousel > * {
	background-color: radial-gradient(rgb(240, 240, 240), rgb(190, 190, 190));
	width:90%;
	/* height:75%; */
	height:86%; 
	left:5%; 
	top:7%;
	/* transition: top .3s, left .3s, width .3s, height .3s; */
	/* transition: .3s; */
	/* -webkit-box-reflect: below 10px linear-gradient(transparent, transparent, #0005); */
}

.reflex-container {
	width: 100%;
    height: 100%;
    transform: scaleY(-1);
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    border-radius: 10px;
    overflow: hidden;

	transition: .2s;
}

#container.active .reflex-container {
	opacity: 0;
}

.reflex-gradient {
	position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background: linear-gradient(0deg, rgba(255,255,255,0.6), #fff 50%);
}

.reflex-image {
	object-fit: cover;
	width: 100%;
	height: 100%;
	/* filter: grayscale(100%); */
}

#container.active .carousel > * {
	-webkit-box-reflect: initial;
}
/* .carousel .uk-card-body {
	max-height: initial !important;
} */
.threeD{
	-webkit-perspective: 1000px;
			perspective: 1000px;
	/* -webkit-perspective: 1500px;
			perspective: 1500px; */
}
.twoD{
	border: 1px solid;
	overflow: hidden;
}
.twoD >*>*{
	width:100%;
	height:100%;
	left:0; 
	top:0; 
	border-radius: 	0;	
}
.custom-card {
	height: 100%;
	width: 100%;
	overflow: hidden;
	transition: .3s !important;
	border-radius: 10px;
	cursor: pointer;
	/* -webkit-overflow-scrolling: touch; */
}

.custom-card.active {
	transform: scale(1.3);
}

.custom-card .uk-card-header {
	position: relative;
}

.custom-card .uk-card-header > * {
	margin: 0;
}

.custom-card .close-button {
	position: absolute;
    right: 14px;
    top: 14px;
	z-index: 10;
    
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
	cursor: pointer;
	background: rgb(0 0 0 / 10%);
	color: rgb(0 0 0 / 80%);

	opacity: 0;
	pointer-events: none;

	transition: .3s;
}

.active .custom-card .close-button {
	opacity: 1;
	pointer-events: all;
}


.custom-card .close-button:hover {
	background: rgb(0 0 0 / 20%);
	color: rgb(0 0 0 / 100%);
}

.contacts-wrapper {
	margin-bottom: 10px;
    display: flex;
	align-items: center;
	position: relative;
    left: -45px;
}

.contacts-icon-wrapper {
	padding-right: 20px;
    display: flex;
    font-size: 26px;
}

.buttons-container {
	position: absolute;
    bottom: 15%;
    width: 300px;
    display: flex;
    justify-content: space-between;
    left: 50%;
    transform: translateX(-50%);
	z-index: 1;
}

.custom_arrow {
	cursor: pointer;
}

.left {
	transform: rotate(180deg);
}

.custom_button {
	width: 80px;
    background: transparent;
    border: 0;
	padding: 6px 15px;
	border-radius: 10px;
	cursor: pointer;
	outline: none;

	transition: .3s;
}

.custom_button:hover {
	background: rgba(255,255,255,0.1);
}

.custom_logo {
	position: fixed;
	top: 2%;
	left: 0;
	padding: 0 30px;
	display: flex;
    width: 100%;
    box-sizing: border-box;
    justify-content: space-between;
    align-items: center;
	/* transform: translateX(-50%); */
}

.custom_logo > img {
	width: 200px;
}

.custom_logo .back-to-home-container span {
	padding-right: 10px;
}

.custom_logo .back-to-home-container {
	color: #555;
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
}

.custom_logo .back-to-home-container img {
	width: 36px;
}

#container.active figure figure.active-slide {
	user-select: initial !important;
}

/* #container figure figure:not(.active-slide) {
	pointer-events: none;
} */

/* .simplebar-wrapper {
	z-index: 999 !important;
	-webkit-overflow-scrolling: touch;
}

.simplebar-mask {
	z-index: 999 !important;
	-webkit-overflow-scrolling: touch;
} */

.simplebar-content {
	height: 100%;
}

.card-inner {
	height: 100%;
}

.uk-card-body-custom {
	display: flex;
	flex-wrap: wrap;
    height: 100%;
}

.uk-card-body-custom > div {
	width: 100%;
	height: 100%;
}

#container.active .uk-card-body-custom > div {
	width: 50%;
}

.uk-card-body-custom > div.custom-card-flex-center {
	padding: 40px;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	display: none;
	overflow: hidden;
}

#container.active .uk-card-body-custom > div.custom-card-flex-center {
	display: flex;
}

.hidden-title {
	/* position: absolute;
    top: 50%;
    left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
    font-size: 32px;
    font-weight: bold;
    color: #fff; */
	font-family: B52, 'Arial Narrow', Arial, sans-serif;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scaleX(0.8);
    letter-spacing: 2px;
    text-align: center;
    font-size: 39px;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
}

#container.active .hidden-title {
	display: none;
}

.zoom-icon-container {
	position: absolute;
	top: 10px;
	right: 10px;
	padding: 6px;
	border-radius: 5px;
	color: #fff;
	font-size: 24px;
	width: auto !important;
    height: auto !important;
    display: flex;
	z-index: 1;
	

	transition: .3s;
}

.zoom-icon-container:hover {
	background: rgba(255,255,255,0.2);
}

.custom-card:hover .zoom-icon-container {
	animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
}

#container.active .zoom-icon-container {
	display: none;
}

@keyframes shake {
	10%, 90% {
	  transform: rotate(-5deg);
	}
	
	20%, 80% {
	  transform: rotate(12deg);
	}
  
	30%, 50%, 70% {
	  transform: rotate(-20deg);
	}
  
	40%, 60% {
	  transform: rotate(20deg);
	}
  }

.uk-card-body-custom > div > img {
	height: 100%;
    width: 100%;
    object-fit: cover;
	object-position: center;
	filter: brightness(0.5) /* grayscale(100%) */;
	transition: .3s;
}

.uk-card-body-custom > div > iframe {
	display: none;
	height: 100%;
    width: 100%;
}

#container.active .uk-card-body-custom > div > img {
	filter: brightness(1);
}

#container.active .uk-card-body-custom > div > img.cover-image {
	display: none;
}

#container.active .uk-card-body-custom > div > iframe {
	display: block;
}

.uk-card-body-custom > div.custom-card-flex-center .custom-card-centered-content {
	max-width: 450px;
	font-size: 22px;
	
	transform: translateX(-200%);
	transition: 1s;
	transition-delay: 1s;
}

.uk-card-body-custom > div.custom-card-flex-center .custom-card-centered-content h2 {
	font-family: B52, 'Arial Narrow', Arial, sans-serif;
	font-size: 38px;
}

#container.active .uk-card-body-custom > div.custom-card-flex-center .custom-card-centered-content {
	transform: translateX(0%);
}







@media (min-width: 640px) {
	#container .uk-child-width-1-2\@s>* {
		width: 100%;
	}

	#container .uk-child-width-1-2\@s > .uk-cover-container {
		min-height: 200px;
	}

	#container.active .active-slide .uk-child-width-1-2\@s>*:first-child {
		width: 33.3333333%;
	}
	
	#container.active .active-slide .uk-child-width-1-2\@s>*:last-child {
		width: 66.6666666%;
	}

	
}

@media (max-width: 530px) {
	.custom_logo .back-to-home-container span {
		display: none;
	}

	.uk-card-body-custom > div.custom-card-flex-center {
		align-items: flex-start;
		overflow: auto;
	}
}



@media (max-width: 420px) {
	.container, #container {
		width: 60%;
		/* height: 80%; */
		height: 64%;
		position: relative;
		/* margin: 50px 30%; */
		z-index: 1;
	}

	.buttons-container {
		bottom: 10%;
	}

	.hidden-title {
		font-size: 32px;
	}

	#container.active .uk-card-body-custom > div {
		width: 100%;
		height: 50%;
	}

	.uk-card-body-custom > div.custom-card-flex-center {
		padding: 20px;
	}

	.uk-card-body-custom > div.custom-card-flex-center .custom-card-centered-content {
		font-size: 14px;
	}

	.custom-card .close-button {
		background: #fff;
		color: #333;
	}
	
	.custom-card .close-button:hover {
		background: #fff;
		color: #333;
	}
}

@media (max-width: 340px) {
	.hidden-title {
		font-size: 26px;
	}
}