@font-face {
	font-family: "CircularXXWeb-Book";
	src: url("../fonts/CircularXXWeb-Book.woff2") format("woff2");
}

:root {
	--font-family: Helvetica LT W05 Bold, Arial, sans-serif;
}

body {
	font-family: var(--font-family);
}

.text-size-80 {
	font-size: 80px;
	line-height: 80px;
	font-weight: 700;
	letter-spacing: -4px;
}

.text-black {
	color: #000000 !important;
}

#layouts.owl-carousel .owl-item {
	background-color: #000000;
	background-image: url(../images/bkg-layouts.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	height: var(--setHeight);
}

	#layouts.owl-carousel .owl-item img {
		object-fit: contain;
		aspect-ratio: 1;
	}

@media (min-width: 992px) {

	#layouts.owl-carousel .owl-item {
		height: initial;
	}

		#layouts.owl-carousel .owl-item img {
			object-fit: initial;
			aspect-ratio: initial;
		}
}

#layouts.owl-carousel .owl-item div[data-type="elem"] {
	position: relative;
}

#layouts.owl-carousel .radio-group {
	color: #FFFFFF;
	position: absolute;
	top: 105px;
	left: 0;
	width: 100%;
	height: calc(100% - 150px);
	letter-spacing: 0px;
	z-index: 5;
	font-size: 40px;
}

	#layouts.owl-carousel .radio-group .form-check-inline {
		display: block;
		margin-left: 80px;
		line-height: 20px;
		margin-top: 60px;
	}

@media (min-width: 992px) {

	#layouts.owl-carousel .radio-group {
		width: initial;
		height: initial;
		top: initial;
		bottom: 5%;
		left: 5%;
		z-index: initial;
		font-size: 14px;
	}

		#layouts.owl-carousel .radio-group .form-check-inline {
			display: inline-flex;
			margin-left: initial;
			margin-top: initial;
			line-height: initial;
		}
}

#layouts.owl-carousel .owl-nav {
	text-align: center;
	position: relative;
}

	#layouts.owl-carousel .owl-nav .disabled {
		opacity: 0.2;
	}

#layouts.owl-carousel .owl-prev,
#layouts.owl-carousel .owl-next {
	background-image: url(../images/arrow.svg);
	background-size: cover;
	width: 160px;
	height: 160px;
	position: relative;
	z-index: 999;
	top: -40px;
	outline: none;
}

#layouts.owl-carousel .owl-next {
	margin-left: 10px
}

#layouts.owl-carousel .owl-prev {
	margin-right: 10px;
	transform: rotate(180deg);
}

@media (min-width: 992px) {

	#layouts.owl-carousel .owl-prev,
	#layouts.owl-carousel .owl-next {
		position: absolute;
		top: calc(var(--setTop) * -1);
		width: 80px;
		height: 80px;
	}

	#layouts.owl-carousel .owl-next {
		left: var(--setRight);
	}

	#layouts.owl-carousel .owl-prev {
		left: var(--setLeft);
	}
}

#layouts.owl-carousel .form-check-input {
	width: 40px;
	height: 40px;
}

.navigation-group {
	font-family: "CircularXXWeb-Book";
	font-size: 36px;
	color: #5A5A5A;
	margin-bottom: 1.5rem;
}

	.navigation-group a,
	.navigation-group a:visited {
		margin: 0 10px;
		color: inherit;
	}

		.navigation-group a.active {
			color: #4021FF;
			/*text-decoration: underline;*/
		}

@media (min-width: 992px) {

	.navigation-group {
		font-size: 18px;
	}

	#layouts.owl-carousel .form-check-input {
		width: 20px;
		height: 20px;
	}

}

.name-group {
	position: absolute;
	left: 75px;
	top: 60px;
	padding-right: 70px;
}

	.name-group.show ~ .radio-group {
		display: block !important;
	}

	.name-group.show ~ img {
		opacity: 0.5;
		z-index: -1;
		position: relative;
	}

.layout-name {
	color: #FFFFFF;
	font-size: 60px;
	line-height: 50px;
	font-weight: 700;
	letter-spacing: -1px;
	display: inline-block;
}

	.layout-name.chevron::after {
		content: "";
		background-image: url(../images/chevron.svg);
		background-size: cover;
		width: 32px;
		height: 20px;
		display: block;
		position: absolute;
		top: 20px;
		right: 5px;
	}

@media (min-width: 992px) {

	.name-group {
		left: 25px;
		top: 15px;
	}

}

.name-group.show .layout-name.chevron::after {
	transform: rotate(180deg);
}

@media (min-width: 992px) {

	.layout-name {
		font-size: 50px;
		letter-spacing: -3px;
	}
}
