/*
	x
	@media (max-width: 575px) {}

	sm
	@media (min-width: 576px) and (max-width: 767px) {}

	md
	@media (min-width: 768px) and (max-width: 991px) {}

	lg
	@media (min-width: 992px) and (max-width: 1199px) {}

	xl
	@media (min-width: 1200px) and (max-width: 1919px) {}

	xxl
	@media (min-width: 1920px) {}
*/

:root {
	--font-brand: 'Geometria';
	--border-radius: 2.5px;
	--color-brand: #FD0C37;/*#D81439*/
	--color-second: #4EC913;
	--color-dark: #1C1E22;
	--color-gray: #E5E5E5;
	--color-gray-dark: #73878D;
}

/* Fonts */
	@font-face {
		font-family: 'Geometria';
		src: url('../fonts/Geometria-Bold.eot');
		src: local('Geometria Bold'), local('Geometria-Bold'),
			url('../fonts/Geometria-Bold.eot?#iefix') format('embedded-opentype'),
			url('../fonts/Geometria-Bold.woff') format('woff'),
			url('../fonts/Geometria-Bold.ttf') format('truetype');
		font-weight: bold;
		font-style: normal;
	}

	@font-face {
		font-family: 'Geometria';
		src: url('../fonts/Geometria.eot');
		src: local('Geometria'),
			url('../fonts/Geometria.eot?#iefix') format('embedded-opentype'),
			url('../fonts/Geometria.woff') format('woff'),
			url('../fonts/Geometria.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}
/* Fonts */

/* General */
	* { outline: 0 !important; }

	html, body {
		position: relative;
		font-family: var(--font-brand);
		font-size: 14px;
		line-height: 1.6;
		letter-spacing: 0.1px;
		font-weight: normal;
		font-style: normal;
		color: #152D49;
	}


	h1, h2, h3, h4, h5,
	.h1, .h2, .h3, .h4, .h5 {
		font-weight: bold
	}

	h1.xl, .h1.xl {
		font-size: 5rem;
		line-height: 5rem;
	}
	@media (min-width: 576px) and (max-width: 767px) {
		h1.xl, .h1.xl {
			font-size: 3.6rem;
			line-height: 4.2rem;
		}
	}
	@media (max-width: 575px) {
		h1.xl, .h1.xl {
			font-size: 2.6rem;
			line-height: 3.2rem;
		}
	}

	h2.xl, .h2.xl {
		font-size: 4rem;
		line-height: 4rem;
	}

	p {
		margin: 0;
		padding: 0;
	}

	a {
		color: #1d3752;
		text-decoration: underline;

		-webkit-transition: color .5s;
		transition: color .5s;
	}
	a:hover, a:active {
		color: var(--color-brand);
		text-decoration: none;
	}

	@media (max-width: 576px) {
		.col-xs-6 {
		    -ms-flex: 0 0 50%;
		    flex: 0 0 50%;
		    max-width: 50%;
		}
		.col-xs-8 {
		    -ms-flex: 0 0 66.666667%;
		    flex: 0 0 66.666667%;
		    max-width: 66.666667%;
		}
		.col-xs-12 {
		    -ms-flex: 0 0 100%;
		    flex: 0 0 100%;
		    max-width: 100%;
		}
	}
/* General */

/* Sections */
	/* General */
		section, .section {
			display: block;
			position: relative;
			box-sizing: border-box;
			overflow: hidden;
		}
		section .container, .section .container,
		section .container-fluid, .section .container-fluid {
			position: relative;
			z-index: 500;
		}
		section .container, .section .container,
		section .container-fluid, .section .container-fluid,
		section .row, .section .row {
			height: 100%;
		}

		section.background::before, .section.background::before {
			content: ' ';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: #05080d;
			opacity: .5;
			z-index: 0;
		}

		/* Titles */
			section .title {
				position: relative;
			}
			section .title::after {
				content: ' ';
				position: absolute;
				bottom: -1.5rem;
				margin: auto;
				width: 50px;
				height: 2px;
				background-color: var(--color-brand);
			}

			section .title.center {
				text-align: center;
			}
			section .title.center::after {
				left: 0;
				right: 0;
			}

			section .title.bottom {
				text-align: left;
			}
			section .title.bottom::after {
				left: 0;
			}

			section .title.default::after {
				top: 0;
				bottom: 0;
				left: -5rem;
			}

			section .title.note {
				position: relative;
				font-size: 3.2rem;
			}
			@media (max-width: 575px) {
				section .title.note {
					position: relative;
					font-size: 2.2rem;
				}
			}
			section .title.note::after {
				content: ' ';
				position: absolute;
				top: 0;
				left: -2.5rem;
				width: 2px;
				height: 100%;
				background-color: var(--color-brand);
				z-index: 0;
			}


			section .title.quote {
				text-align: center;
			}
			section .title.quote::before {
				content: ' ';
				position: absolute;
				top: -45px;
				left: 0;
				right: 0;
				margin: auto;
				width: 32px;
				height: 32px;
				
				background: url(/uploads/quotes.png) no-repeat center center scroll;
				-webkit-background-size: contain;
				-moz-background-size: contain;
				-o-background-size: contain;
				background-size: contain;
			}
			section .title.quote::after {
				left: 0;
				right: 0;
			}
		/* Titles */

		/* Markers */
			section .marker, .section .marker {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: row;

				position: absolute;
				bottom: -3.25rem;
				left: 0;
				width: 20%;
				height: auto;
				box-sizing: border-box;
				margin: auto;
    			padding: 1rem 0;
				z-index: 200;

				-webkit-transform-origin: 0% 0%;
				transform-origin: 0% 0%;

				-webkit-transform: rotate(-90deg);
				transform: rotate(-90deg);
			}
			@media (min-width: 1200px) and (max-width: 1299px) {
				section .marker, .section .marker {
					display: none;
				}
			}
			@media (max-width: 767px) {
				section .marker, .section .marker {
					display: none;
				}
			}

			section .marker span, .section .marker span {
				display: inline-block;
				position: relative;
				box-sizing: border-box;
				padding-left: 3rem;

				font-size: .8rem;
				font-weight: bold;
				color: var(--color-dark);
				text-transform: uppercase;
			}
			section .marker.inverse span, .section .marker.inverse span {
				color: white;
			}
			section .marker span::before, .section .marker span::before {
				content: ' ';
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				margin: auto;
				width: 25px;
				height: 2px;
				background-color: var(--color-brand);
			}
		/* Markers */
	/* General */

	/* About */
		section.about::after {
			content: ' ';
			position: absolute;
			top: -140px;
			right: -140px;
			width: 400px;
			height: 500px;
			z-index: 1;

			background: url(/uploads/branding.png) no-repeat center center scroll;
			-webkit-background-size: contain;
			-moz-background-size: contain;
			-o-background-size: contain;
			background-size: contain;
		}
	/* About */

	/* Cases */
		/* Top */
			.cases.top {
				margin-bottom: -8rem;
				z-index: 100;
			}

			.cases.top::before {
				content: ' ';
				display: block;
				position: absolute;
				top: 0;
				bottom: 0;
				right: 0;
				width: 65%;
				height: 100%;
				z-index: 0;
				background-color: #f7f7f8;

				-webkit-transition: transform 3s;
				transition: transform 3s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			.cases.top[data-view="active"]::before {
				-webkit-transform: translateX(30px);
				transform: translateX(30px);
			}

			.cases.top .images {
				position: absolute;
				top: 0;
				bottom: 0;
				right: 0;
				width: 800px;
				height: 100%;

			}
			.cases.top .images .slick-list {
				-webkit-transition: transform 3s;
				transition: transform 3s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			.cases.top[data-view="active"] .images .slick-list {
				-webkit-transform: translateX(-60px);
				transform: translateX(-60px);
			}
			@media (min-width: 992px) and (max-width: 1199px) {
				.cases.top .images {
					width: 600px;
					height: 600px;
				}
			}
			@media (min-width: 768px) and (max-width: 991px) {
				.cases.top .images {
					position: relative;
					width: 100%;
					height: 400px;
				}
			}
			@media (max-width: 767px) {
				.cases.top .images {
					position: relative;
					width: 100%;
					height: 350px;
				}
			}
			.cases.top .images .image {
				display: block;
				width: 800px;
				height: 500px;
			}
			@media (min-width: 992px) and (max-width: 1199px) {
				.cases.top .images .image {
					width: 600px;
					height: 600px;
				}
			}
			@media (min-width: 768px) and (max-width: 991px) {
				.cases.top .images .image {
					width: 100%;
					height: 400px;
				}
			}
			@media (max-width: 767px) {
				.cases.top .images .image {
					width: 100%;
					height: 350px;
				}
			}
		/* Top */

		/* Middle */
			.cases.middle {
				background-color: var(--color-dark);
				z-index: 0;
				color: white;
			}

			@media (max-width: 991px) {
				.cases.middle .title::after {
					display: none;
				}
			}

			.cases.middle .images {
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				width: 800px;
				height: auto;
			}
			.cases.middle .images .slick-list {
				-webkit-transition: transform 2s 1s;
				transition: transform 2s 1s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			.cases.middle[data-view="active"] .images .slick-list {
				-webkit-transform: translateX(60px);
				transform: translateX(60px);
			}
			@media (min-width: 992px) and (max-width: 1199px) {
				.cases.middle .images {
					width: 600px;
					height: 600px;
				}
			}
			@media (min-width: 768px) and (max-width: 991px) {
				.cases.middle .images {
					position: relative;
					width: 100%;
					height: 400px;
				}
			}
			@media (max-width: 767px) {
				.cases.middle .images {
					position: relative;
					width: 100%;
					height: 300px;
				}
			}
			.cases.middle .images .image {
				display: block;
				width: 800px;
				height: 500px;
			}
			@media (min-width: 992px) and (max-width: 1199px) {
				.cases.middle .images .image {
					width: 600px;
					height: 600px;
				}
			}
			@media (min-width: 768px) and (max-width: 991px) {
				.cases.middle .images .image {
					width: 100%;
					height: 400px;
				}
			}
			@media (max-width: 767px) {
				.cases.middle .images .image {
					width: 100%;
					height: 350px;
				}
			}

			.cases.middle::after {
				content: ' ';
				position: absolute;
				top: 0px;
				left: -200px;
				width: 400px;
				height: 500px;
				z-index: 1;

				background: url(/uploads/branding.png) no-repeat center center scroll;
				-webkit-background-size: contain;
				-moz-background-size: contain;
				-o-background-size: contain;
				background-size: contain;
			}
		/* Middle */

		/* Bottom */
			.cases.bottom {
				margin-top: -8rem;
				z-index: 100;
			}

			.cases.bottom::before {
				content: ' ';
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				width: 30%;
				height: 100%;
				z-index: 0;
				background-color: #f7f7f8;

				-webkit-transition: transform 3s;
				transition: transform 3s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			.cases.bottom[data-view="active"]::before {
				-webkit-transform: translateX(-30px);
				transform: translateX(-30px);
			}

			.cases.bottom .images {
				position: absolute;
				top: 0;
				bottom: 0;
				right: 0;
				width: 800px;
				height: 525px;
			}
			.cases.bottom .images .slick-list {
				-webkit-transition: transform 3s;
				transition: transform 3s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			.cases.bottom[data-view="active"] .images .slick-list {
				-webkit-transform: translateX(-60px);
				transform: translateX(-60px);
			}
			@media (min-width: 992px) and (max-width: 1199px) {
				.cases.bottom .images {
					width: 600px;
					height: 600px;
				}
			}
			@media (min-width: 768px) and (max-width: 991px) {
				.cases.bottom .images {
					position: relative;
					width: 100%;
					height: 400px;
				}
			}
			@media (max-width: 767px) {
				.cases.bottom .images {
					position: relative;
					width: 100%;
					height: 300px;
				}
			}
			.cases.bottom .images .image {
				display: block;
				width: 800px;
				height: 500px;
			}
			@media (min-width: 992px) and (max-width: 1199px) {
				.cases.bottom .images .image {
					width: 600px;
					height: 600px;
				}
			}
			@media (min-width: 768px) and (max-width: 991px) {
				.cases.bottom .images .image {
					width: 100%;
					height: 400px;
				}
			}
			@media (max-width: 767px) {
				.cases.bottom .images .image {
					width: 100%;
					height: 350px;
				}
			}
		/* Bottom */

		/* Slick */
			section.cases .slick-prev,
			section.cases .slick-next {
				top: auto;
				bottom: 0;
				left: auto;
				right: 0px;
				width: 48px;
				height: 48px;
				background-color: var(--color-gray);
				z-index: 100;
			}
			section.cases .slick-prev {
				right: 48px;
			}

			section.cases.middle .slick-prev,
			section.cases.middle .slick-next {
				left: 0px;
				right: auto;
			}
			section.cases.middle .slick-next {
				left: 48px;
			}

			section.cases .slick-prev::before {
				content: ' ';
				position: absolute;
				top: 0;
				bottom: 0;
				left: 13px;
				margin: auto;
				width: 20px;
				height: 5px;

				background: url(/uploads/svg/arrow-left.svg) no-repeat center center scroll;
				-webkit-background-size: contain;
				-moz-background-size: contain;
				-o-background-size: contain;
				background-size: contain;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			section.cases .slick-prev:hover::before {
				-webkit-transform: translateX(-15px);
				transform: translateX(-15px);
			}

			section.cases .slick-next::before {
				content: ' ';
				position: absolute;
				top: 0;
				bottom: 0;
				right: 13px;
				margin: auto;
				width: 20px;
				height: 5px;

				background: url(/uploads/svg/arrow-right.svg) no-repeat center center scroll;
				-webkit-background-size: contain;
				-moz-background-size: contain;
				-o-background-size: contain;
				background-size: contain;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: translateX(0) ;
				transform: translateX(0) ;
			}
			section.cases .slick-next:hover::before {
				-webkit-transform: translateX(15px);
				transform: translateX(15px);
			}
		/* Slick */
	/* Cases */

	/* Advantages */
		section.advantages {
			margin-bottom: -15rem;
			z-index: 100;
			overflow: hidden;
			color: white;
		}
		@media (min-width: 768px) and (max-width: 991px) {
			section.advantages {
				margin-bottom: -10rem;
			}
		}
		@media (max-width: 767px) {
			section.advantages {
				margin-bottom: -10rem;
			}
		}

		section.advantages .overlay {
			display: block;
			position: absolute;
			top: 0;
			left: 4rem;
			width: 100%;
			height: 100%;
			z-index: 0;

			-webkit-transition: transform 6s;
			transition: transform 6s;

			-webkit-transform: scale(1.3,1.3);
			transform: scale(1.3,1.3);
		}
		section.advantages[data-view="active"] .overlay {
			-webkit-transform: scale(1,1);
			transform: scale(1,1);
		}
		@media (min-width: 1200px) and (max-width: 1299px) {
			section.advantages .overlay {
				left: 0rem;
			}
		}
		@media (max-width: 767px) {
			section.advantages .overlay {
				left: 0rem;
			}
		}

		section.advantages .overlay::after {
			content: ' ';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: var(--color-dark);
			opacity: .8;
			z-index: 0;
		}

		section.advantages h2 {
			font-size: 4rem;
		}
		section.advantages h2 span {
			display: block;
			box-sizing: border-box;
			padding: 1rem;
			border: 1px solid white;

			font-size: 2rem;
			font-weight: normal;
		}
	/* Advantages */

	/* Offer */
		section.offer {
			z-index: 10;
		}

		section.offer::before, section.offer::after {
			content: ' ';
			position: absolute;
			width: 400px;
			height: 500px;
			z-index: 1;

			background: url(/uploads/branding.png) no-repeat center center scroll;
			-webkit-background-size: contain;
			-moz-background-size: contain;
			-o-background-size: contain;
			background-size: contain;
		}
		section.offer::before {
			top: 90px;
			left: -200px;
		}
		section.offer::after {
			top: -60px;
			right: -60px;
		}
		@media (max-width: 575px) {
			section.offer::after {
				display: none;
			}
		}
	/* Offer */

	/* Carousel */
		section.carousel {
			box-sizing: border-box;
			padding: 0 0 0 10rem;
			margin-top: -25rem;
			z-index: 20;
		}
		@media (min-width: 768px) and (max-width: 991px) {
			section.carousel {
				padding: 0 0 0 6rem;
				margin-top: -20rem;
				z-index: 20;
			}
		}
		@media (max-width: 767px) {
			section.carousel .title {
				margin-left: 15px;
			}
			section.carousel {
				padding: 0;
				margin-top: -20rem;
				z-index: 20;
			}
		}
		@media (max-width: 575px) {
			section.carousel {
				padding: 0;
				margin-top: -15rem;
				z-index: 20;
			}
		}

		section.carousel .item {
			display: block;
			width: 100%;
			height: auto;
			box-sizing: border-box;
			background-color: #fcfcfc;
			margin: 1rem;
			padding: 0;

			text-align: center;

			-webkit-box-shadow: 0 0 1rem rgba(0, 0, 0, 0);
			box-shadow: 0 0 1rem rgba(0, 0, 0, 0);

			-webkit-transition: box-shadow 1s;
			transition: box-shadow 1s;
		}
		@media (min-width: 1200px) and (max-width: 1299px) {
			section.carousel .item {
				margin: 1rem .5rem;
			}
		}
		section.carousel .item:hover {
			-webkit-box-shadow: 0 0 1rem rgba(0, 0, 0, .15);
			box-shadow: 0 0 1rem rgba(0, 0, 0, .15);
		}
		section.carousel .item .photo {
			display: block;
			margin: auto;
			width: 100%;
			height: 200px;
			border-radius: 6px 6px 0px 0px;
			overflow: hidden;
		}
		section.carousel .item h3 {
			box-sizing: border-box;
			padding: 0 2rem;
		}
		@media (min-width: 1200px) and (max-width: 1299px) {
			section.carousel .item h3 {
				padding: 0 1rem;
			}
		}
		section.carousel .item span {
			display: block;
			width: 100%;
			height: auto;
			box-sizing: border-box;
			padding: 0 15px;
		}

		/* Slick */
			section.carousel .slick-prev {
				left: -60px;
				width: 48px;
				height: 48px;
				background-color: #f4f5f7;
			}

			section.carousel .slick-prev::before {
				content: ' ';
				position: absolute;
				top: 0;
				bottom: 0;
				left: 35px;
				margin: auto;
				width: 20px;
				height: 5px;

				background: url(/uploads/svg/arrow-left.svg) no-repeat center center scroll;
				-webkit-background-size: contain;
				-moz-background-size: contain;
				-o-background-size: contain;
				background-size: contain;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			section.carousel .slick-prev:hover::before {
				-webkit-transform: translateX(-1rem);
				transform: translateX(-1rem);
			}
		/* Slick */
	/* Carousel */

	/* Contacts */
		.contacts {
			overflow: visible;
		}
		.contacts .overlay {
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 55%;
			height: 450px;
			background-color: #FFFFFF;
			z-index: 10;
		}
		@media (max-width: 767px) {
			.contacts .overlay {
				width: 100%;
				height: auto;
			}
		}
		.contacts .body > .row {
			margin: 0;
			padding: 0;
		}
		.contacts .body > .row > div {
			padding: 0;
		}

		.contacts .solid {
			position: relative;
			width: 100%;
			height: 450px;
			box-sizing: border-box;
			padding: 0 2rem;
		}
		@media (min-width: 768px) and (max-width: 991px) {
			.contacts .solid {
				height: 400px;
				padding: 0 1rem;
			}
		}
		@media (max-width: 767px) {
			.contacts .solid {
				display: none;
			}
		}
		.contacts .solid::before {
			content: ' ';
			position: absolute;
			top: 0px;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: var(--color-brand);
			z-index: 0;

			-webkit-transition: transform 3s;
			transition: transform 3s;

			-webkit-transform: translateY(-50px);
			transform: translateY(-50px);
		}
		.contacts[data-view="active"] .solid::before {
			-webkit-transform: translateY(-125px);
			transform: translateY(-125px);
		}
		@media (max-width: 767px) {
			.contacts .solid::before,
			.contacts[data-view="active"] .solid::before {
				-webkit-transform: translateY(0px);
				transform: translateY(0px);
			}
		}

		.contacts .background {
			width: 100%;
			height: 450px;

			-webkit-transition: transform 3s;
			transition: transform 3s;

			-webkit-transform: translateY(-50px);
			transform: translateY(-50px);
		}
		@media (min-width: 768px) and (max-width: 991px) {
			.contacts .background {
				height: 400px;
			}
		}
		@media (max-width: 767px) {
			.contacts .background {
				display: none;
			}
		}
		.contacts[data-view="active"] .background {
			-webkit-transform: translateY(0px);
			transform: translateY(0px);
		}

		#ya-map {
			width: 100%;
			height: 800px;
			margin-top: -250px;
			background-color: var(--color-gray-light);
			z-index: 0;
		}
		@media (max-width: 767px) {
			#ya-map {
				height: 400px;
				margin-top: 0px;
			}
		}

		#ya-map canvas {
			-webkit-filter: grayscale(100%);
			filter: grayscale(100%);
		}
	/* Contacts */
/* Sections */

/* Components */
	/* Message */
		.message {
			position: fixed;
			top: 0px;
			left: 0px;
			display: none;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			align-content: center;
			opacity: 0;
			width: 100%;
			height: 100%;
			z-index: 10000;
		}

		.message .layout {
			display: block;
			position: absolute;
			top: 0px;
			left: 0px;
			width: 100%;
			height: 100%;
			background-color: rgba(24,24,24,.5);
			z-index: 1;
		}

		.message .body {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			align-content: center;
			position: relative;
			width: 300px;
			height: auto;
			box-sizing: border-box;
			padding: 15px;
			background-color: white;
			-webkit-box-shadow: 0 0 0 0.2rem rgba(26, 26, 24, .5);
		    box-shadow: 0 0 0 0.2rem rgba(26, 26, 24, .5);
			z-index: 100;

			text-align: center;
		}

		.message .body span {
			color: #000000;
		}

		.message button {
			display: block;
			position: absolute;
			top: -30px;
			right: 0px;
			width: 20px;
			height: 20px;
			background-color: transparent;
			border: none;
			cursor: pointer;
			z-index: 100;
			opacity: 1;

			-webkit-transition: opacity .25s;
			-moz-transition: opacity .25s;
			-ms-transition: opacity .25s;
			-o-transition: opacity .25s;
			transition: opacity .25s;
		}

		.message button:hover {
			opacity: .5;
		}

		.message button:before {
			content: ' ';
			position: absolute;
			top: 0px;
			left: 10px;
			width: 1px;
			height: 20px;
			background-color: white;

			-webkit-transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			-o-transform: rotate(45deg);
			transform: rotate(45deg);
		}

		.message button:after {
			content: ' ';
			position: absolute;
			top: 0px;
			left: 10px;
			width: 1px;
			height: 20px;
			background-color: white;

			-webkit-transform: rotate(-45deg);
			-moz-transform: rotate(-45deg);
			-ms-transform: rotate(-45deg);
			-o-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
	/* Message */

	/* Header default */
		.header-default {
			display: block;
			position: relative;
			width: 100%;
			height: 100px;
		}
		.header-default::after {
			content: ' ';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: var(--color-dark);
			opacity: .8;
			z-index: 0;
		}
	/* Header default */

	/* Header */
		header {
			position: fixed;
			top: 1.75rem;
			width: 100%;
			height: auto;
			box-sizing: border-box;
			padding: 0 4rem;
			background-color: transparent;
			z-index: 1000;

			-webkit-transition: transform 1s, background-color 1s;
			transition: transform 1s, background-color 1s;

			-webkit-transform: translateY(0);
			transform: translateY(0);
		}
		header[data-view="filled"] {
			background-color: var(--color-dark);

			-webkit-transform: translateY(-1.75rem);
			transform: translateY(-1.75rem);
		}
		@media (min-width: 768px) and (max-width: 991px) {
			header {
				padding: 1rem 4rem;
			}
		}
		@media (max-width: 767px) {
			header {
				padding: .5rem 1rem;
			}
		}

		.header {
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: row;

			
			box-sizing: border-box;
			padding: 0;
		}

		@media (max-width: 767px) {
			.header {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;

				
				box-sizing: border-box;
				padding: 1rem 0;
			}
		}
		@media (min-width: 768px) and (max-width: 1299px) {
			.header {
				padding-right: 5rem;
			}
		}

		.header > div {
			display: inline-flex;
			align-items: flex-start;
			justify-content: flex-start;
			flex-direction: row;

			position: relative;
			height: auto;
			box-sizing: border-box;
		}
		@media (max-width: 767px) {
			.header > div {
				width: 100%;
			}
		}

		/* logo*/
			.header > div:nth-child(1) {
				width: 25%;
			}
			@media (max-width: 767px) {
				.header > div:nth-child(1) {
					align-items: center;
					justify-content: center;
					width: 100%;
				}
			}

			.header > div:nth-child(1) a {
				display: block;
				width: 155px;
				height: 45px;
				margin: 0;

				background: url(/uploads/logo.png) no-repeat center center scroll;
				-webkit-background-size: contain;
				-moz-background-size: contain;
				-o-background-size: contain;
				background-size: contain;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: scale(1,1);
				transform: scale(1,1);
			}
			@media (max-width: 767px) {
				.header > div:nth-child(1) a {
					width: 125px;
					height: 35px;
				}
			}
			header[data-view="filled"] .header > div:nth-child(1) a {
				-webkit-transform: scale(0.8,0.8);
				transform: scale(0.8,0.8);
			}
		/* logo*/

		/* Menu */
			.header > div:nth-child(2) {
				width: 75%;
			}
			@media (max-width: 767px) {
				.header > div:nth-child(2) {
					justify-content: flex-start;
					align-items: center;
				}
			}

			.header > div:nth-child(2) a,
			.header > div:nth-child(2) a:hover {
				display: block;
				position: relative;
				margin: 0 2rem;
				padding: 1.25rem 0;
				overflow: hidden;

				font-size: 1rem;
				color: white;
				text-decoration: none;

				-webkit-transition: color .5s;
				transition: color .5s;
			}
			@media (min-width: 992px) and (max-width: 1199px) {
				.header > div:nth-child(2) a,
				.header > div:nth-child(2) a:hover {
					margin: 0 1rem;
				}
			}
			@media (max-width: 991px) {
				.header > div:nth-child(2) a,
				.header > div:nth-child(2) a:hover {
					display: none;
				}
			}
			.header > div:nth-child(2) a::after {
				content: ' ';
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 2px;
				background-color: var(--color-brand);
				z-index: 100;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: translateX(-110%);
				transform: translateX(-110%);
			}
			.header > div:nth-child(2) a:hover::after {
				-webkit-transform: translateX(0%);
				transform: translateX(0%);
			}
			@media (max-width: 767px) {
				.header > div:nth-child(2) a,
				.header > div:nth-child(2) a:hover {
					margin-right: 2rem;
					margin-left: 0;
				}
			}
		/* Menu*/

		/* Call */
			@media (min-width: 992px) {
				header .call {
					display: none;
				}
			}

			header .call {
				position: absolute;
				top: 14px;
				left: 15px;
				width: 45px;
				height: 45px;
				border-radius: 45px;
				box-sizing: border-box;
				padding: 11px;
				background-color: var(--color-brand);
				z-index: 100;
			}
			header .call i {
				position: relative;
				top: 2px;
				width: 1.5rem;
				height: 1.5rem;
			}
			header .call i svg * {
				fill: white;
			}
		/* Call */
	/* Header */

	/* Menu */
		menu {
			position: fixed;
			top: 0;
			right: 0;
			display: block;
			width: auto;
			height: auto;
			z-index: 1010;
		}

		/* Toggle */
			menu .toggle {
				position: absolute;
				top: 1.5rem;
				right: 4rem;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				width: 35px;
				height: 36px;
				z-index: 200;

				background-color: transparent;
				border: none;
				overflow: hidden;

				-webkit-transition: transform 1s;
				transition: transform 1s;
			}
			menu .toggle[data-view="fixed"] {
				-webkit-transform: translateY(-1.75rem);
				transform: translateY(-1.75rem);
			}
			@media (min-width: 768px) and (max-width: 991px) {
				menu .toggle[data-view="fixed"] {
					-webkit-transform: translateY(-1.35rem);
					transform: translateY(-1.35rem);
				}
			}
			@media (max-width: 767px) {
				menu .toggle {
					top: 2rem;
					right: 2rem;
				}
				menu .toggle[data-view="fixed"] {
					-webkit-transform: translateY(-1.5rem);
					transform: translateY(-1.5rem);
				}
			}

			menu .toggle span {
				display: block;
				width: 35px;
				height: 2px;
				background-color: white;
				margin: 4px;
				opacity: 1;

				-webkit-transition: transform .35s, opacity .35s, background-color .35s;
				transition: transform .35s, opacity .35s, background-color .35s;

				-webkit-transform: rotate(0deg); 
				transform: rotate(0deg); 

				-webkit-transform-origin: 3px 1px;
				transform-origin: 3px 1px;
			}
			menu[data-view="active"] .toggle span {
				background-color: white;
			}

			menu[data-view="active"] .toggle span:nth-child(1) {
				-webkit-transform: rotate(45deg); 
				transform: rotate(45deg); 
			}
			menu .toggle span:nth-child(2) {
				-webkit-transform: translateX(.5rem); 
				transform: translateX(.5rem); 
			}
			menu .toggle:hover span:nth-child(2) {
				-webkit-transform: translateX(0rem); 
				transform: translateX(0rem); 
			}
			menu[data-view="active"] .toggle span:nth-child(2) {
				opacity: 0;

				-webkit-transform: translateX(-1rem); 
				transform: translateX(-1rem); 
			}
			menu[data-view="active"] .toggle span:nth-child(3) {
				-webkit-transform: rotate(-45deg); 
				transform: rotate(-45deg); 
			}
		/* Toggle */

		/* Body */
			menu .body {
				position: absolute;
				top: -1rem;
				bottom: 0;
				right: 0;
				width: 70vw;
				height: 100vh;
				z-index: 100;

				display: flex;
				justify-content: center;
				align-items: flex-start;
				flex-direction: column;
				box-sizing: border-box;
				padding: 4rem 0;
				opacity: 0;

				-webkit-transition: transform .75s, opacity .75s;
				transition: transform .75s, opacity .75s;

				-webkit-transform: translateX(100%); 
				transform: translateX(100%); 

				-webkit-transform-origin: 0 0;
				transform-origin: 0 0;
			}
			@media (max-width: 575px) {
				menu .body {
					width: 90vw;
				}
			}
			menu[data-view="active"] .body {
				opacity: 1;
				-webkit-transform: translateX(0%); 
				transform: translateX(0%); 
			}

			menu .body .list a {
				display: block;
				position: relative;
				box-sizing: border-box;
				margin: 1rem 0;
				padding: .5rem 0;
				width: 100%;
			    height: auto;
			    overflow: hidden;

			    font-size: 1.6rem;
				font-weight: normal;
				color: white;
				text-transform: uppercase;
				text-decoration: none;
			    white-space: nowrap;
			}
			menu .body .list a::before,
			menu .body .list a::after {
				content: ' ';
				top: 0rem;
				right: 0;
				position: absolute;
				width: 50px;
				height: 2px;
				background-color: white;
				z-index: 100;

				-webkit-transition: transform .5s;
				transition: transform .5s;

				-webkit-transform: translateX(100%);
				transform: translateX(100%);
			}
			menu .body .list a::after {
				top: auto;
				bottom: 0rem;
				right: auto;
				left: 0;

				-webkit-transform: translateX(-100%);
				transform: translateX(-100%);
			}
			menu .body .list a:hover::before,
			menu .body .list a:hover::after {
				-webkit-transform: translateX(0%);
				transform: translateX(0%);
			}
		/* Body */

		/* Overlay */
			menu .overlay {
				content: ' ';
				position: absolute;
				top: -1rem;
				right: 0;
				width: 100vw;
				height: 100vh;
				background-color: var(--color-brand);
				z-index: 0;
				opacity: 1;
				overflow: hidden;

				-webkit-transition: transform .25s, opacity 2s;
				transition: transform .25s, opacity 2s;

				-webkit-transform: translateX(100%); 
				transform: translateX(100%); 

				-webkit-transform-origin: 0 0;
				transform-origin: 0 0;
			}

			menu[data-view="active"] .overlay {
				-webkit-transform: translateX(0%); 
				transform: translateX(0%); 
			}


			menu .overlay::before {
				content: ' ';
				position: absolute;
				top: 0;
				right: -210px;
				width: 435px;
				height: 100%;
				z-index: 1;

				background: url(/uploads/branding.jpg) no-repeat center center scroll;
				-webkit-background-size: cover;
				-moz-background-size: cover;
				-o-background-size: cover;
				background-size: cover;
			}
			@media (max-width: 767px) {
				menu .overlay::before {
					right: -210px;
					width: 340px;
					height: 100%;
				}
			}
		/* Overlay */
	/* Menu */

	/* Hero */
		/* Item */
			.hero .item {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;

				position: relative;
				width: 100%;
				height: auto;
				min-height: 750px;
				box-sizing: border-box;
				padding: 8rem 0 4rem;
				background-color: var(--color-dark);

				color: white;
			}
			@media (min-width: 576px) and (max-width: 767px) {
				.hero .item {
					padding: 8rem 4rem 4rem;
				}
			}
			@media (max-width: 575px) {
				.hero .item {
					padding: 8rem 2rem 4rem;
				}
			}
			.hero .item::after {
				content: ' ';
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background-color: var(--color-dark);
				opacity: .7;
				z-index: 1;
			}

			.hero .item h1 {
				position: relative;
				font-size: 4rem;
			}
			@media (max-width: 575px) {
				.hero .item h1 {
					font-size: 2.2rem;
				}
			}
			.hero .item h1::before {
				content: ' ';
				position: absolute;
				top: 0;
				left: -2.5rem;
				width: 2px;
				height: 100%;
				background-color: var(--color-brand);
				z-index: 0;
			}
			@media (max-width: 767px) {
				.hero .item h1::before {
					display: none;
				}
			}
		/* Item */
		
		/* Images */
			.hero .images {
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				z-index: 0;
			}
			.hero .images .image {
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				opacity: 0;

				-webkit-transition: transform 9s, opacity 1.5s;
				transition: transform 9s, opacity 1.5s;

				-webkit-transform: scale(1.2,1.2);
				transform: scale(1.2,1.2);
			}
			.hero .images .image[data-view="active"] {
				opacity: 1;

				-webkit-transform: scale(1,1);
				transform: scale(1,1);
			}
		/* Images */

		/* Markers */
			.hero .markers {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;

				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				width: auto;
				height: auto;
				z-index: 100;
			}

			.hero .markers span {
				display: block;
				width: 10px;
				height: 10px;
				background-color: var(--color-gray-dark);
				margin: 1rem;

				-webkit-transition: background-color 1s;
				transition: background-color 1s;
			}
			.hero .markers span[data-view="active"] {
				background-color: white;
			}
		/* Markers */

		/* Progress */
			.hero .progress {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: row;

				position: absolute;
				bottom: 2rem;
				right: 4rem;
				width: auto;
				height: auto;
				background-color: transparent;
				z-index: 100;
			}

			.hero .progress p {
				display: block;
				margin: 0 1rem;
				font-size: 1rem;
				color: white;
			}

			.hero .progress div {
				display: block;
				position: relative;
				width: 90px;
				height: 2px;
				border-radius: 2px;
				background-color: var(--color-gray-dark);
				overflow: hidden;
			}
			.hero .progress div::after {
				content: '';
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background-color: var(--color-brand);
				z-index: 0;

				-webkit-transition: transform 9s;
				transition: transform 9s;

				-webkit-transform: translateX(-100%);
				transform: translateX(-100%);
			}
			.hero .progress[data-marker="1"] div::after{
				-webkit-transform: translateX(-66.333333%);
				transform: translateX(-66.333333%);
			}
			.hero .progress[data-marker="2"] div::after{
				-webkit-transform: translateX(-33.333333%);
				transform: translateX(-33.333333%);
			}
			.hero .progress[data-marker="3"] div::after{
				-webkit-transform: translateX(0%);
				transform: translateX(0%);
			}
		/* Progress */
	/* Hero */

	/* Footer */
		footer {
			box-sizing: border-box;
			background-color: var(--color-dark);
			color: white;
		}

		@media (max-width: 767px) {
			footer {
				padding: 2rem 0;
			}
		}

		footer p, footer span, footer a {
			font-size: .8rem;
			color: white;
		}
	/* Footer */

	/* Social */
		.social {
			display: block;
			list-style: none;
			margin-left: -10px;
			margin-right: -10px;
			padding: 0;
		}

		.social li {
			display: inline-block;
		}

		.social li a {
			display: inline-flex;
			justify-content: flex-start;
			align-items: center;
			flex-direction: row;
			margin-right: 10px;
			margin-bottom: 10px;
			text-decoration: none;
		}
		.social.inverse li a {
			margin-left: 10px;
		}

		.social li a i {
			display: inline-flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;

			width: 32px;
			height: 32px;
			border-radius: 32px;
			box-sizing: border-box;
			margin-right: 10px;
			border: 1px solid white;
			background-color: transparent;

			-webkit-transition: background-color .5s, border-color .5s;
			transition: background-color .5s, border-color .5s;
		}
		.social li a:hover i {
			background-color: var(--color-brand);
			border-color: var(--color-brand);
		}
		.social.inverse li a:hover i {
			background-color: var(--color-dark);
			border-color: var(--color-dark);
		}

		.social li a i svg {
			width: 14px;
			height: 14px;
		}

		.social li a i svg * {
			fill: white;
		}

		.social li a span {
			font-size: 1rem;
			color: white;
		}
		@media (max-width: 767px) {
			.social li a span {
				display: none;
			}
		}
	/* Social */

	/* Btn */
		.btn {
			display: inline-flex;
			justify-content: center;
			align-items: center;
			flex-direction: row;

			position: relative;
			width: auto;
			height: auto;
			border: none;
			border-radius: 0;
			padding: 1rem 2.5rem;
			overflow: hidden;

			font-size: 1rem;
			font-weight: normal;
			color: #000000;
			text-decoration: none !important;

			-webkit-transition: transform .5s;
			transition: transform .5s;
		}
		.btn span {
			position: relative;
			z-index: 10;
		}

		/* Primary */
			.btn.btn-primary,
			.btn.btn-primary:active,
			.btn.btn-primary:focus {
				border: none;
				background-color: var(--color-brand) !important;

				color: white;

				-webkit-box-shadow: none !important;
				box-shadow: none !important;

				-webkit-transform: translateY(0);
				transform: translateY(0);
			}

			.btn.btn-primary:hover, .btn.btn-primary:focus {
				-webkit-box-shadow: none;
				box-shadow: none;
			}

			.btn.btn-primary::before {
				content: ' ';
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background-color: var(--color-dark);
				z-index: 0;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: translateX(-205%);
				transform: translateX(-205%);
			}
			.btn.btn-primary:hover::before {
				-webkit-transform: translateX(0%);
				transform: translateX(0%);
			}	}
		/* Primary */

		/* Default */
			.btn.btn-default,
			.btn.btn-default:active,
			.btn.btn-default:focus {
				border: 2px solid white;
				background-color: transparent !important;

				color: white;

				-webkit-box-shadow: none !important;
				box-shadow: none !important;

				-webkit-transition: border-color .5s;
				transition: border-color .5s;
			}

			.btn.btn-default:hover, .btn.btn-default:focus {
				border-color: var(--color-brand);
				-webkit-box-shadow: none;
				box-shadow: none;
			}

			.btn.btn-default::before {
				content: ' ';
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background-color: var(--color-brand);
				z-index: 0;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: translateX(-205%);
				transform: translateX(-205%);
			}
			.btn.btn-default:hover::before {
				-webkit-transform: translateX(0%);
				transform: translateX(0%);
			}
		/* Default */

		/* Link */
			.btn.btn-link:hover {
				text-decoration: none;
				color: #C20101;
			}
			.btn.btn-link.simple {
				width: 3rem;
				height: 3rem;
				border: 1px solid #EEEEEE;

				-webkit-box-shadow: none;
				box-shadow: none;
			}
			.btn.btn-link.simple:hover {
				-webkit-box-shadow: none;
				box-shadow: none;
			}
		/* Link */

		/* Arrow */
			.btn .arrow {
				display: block;
				position: relative;
				width: 20px;
				height: 5px;
				margin-left: 1rem;
				z-index: 10;

				-webkit-transition: transform 1s;
				transition: transform 1s;

				-webkit-transform: translateX(0);
				transform: translateX(0);
			}
			.btn:hover .arrow {
				-webkit-transform: translateX(.5rem);
				transform: translateX(.5rem);
			}

			.btn .arrow svg {
				display: block;
				width: 100%;
				height: auto;
			}

			.btn.btn-primary .arrow svg * {
				fill: white;
			}
			.btn.btn-default .arrow svg * {
				fill: white;
			}
		/* Arrow */
	/* Btn */

	/* Forms */
		.form-control,
		.form-control:hover,
		.form-control:focus {
			position: relative;
			padding: 2rem 2rem;
			border: none;
			border-radius: 0;
			background-color: #f5f5f6;
			z-index: 0;

			-webkit-box-shadow: none;
			box-shadow: none;

			font-size: 1rem;
			line-height: 1rem;
			color: #404a56;

			-webkit-transition: border-color 1s;
			transition: border-color 1s;
		}
		.input {
			position: relative;
			border: 1px solid transparent;
			overflow: hidden;

			-webkit-transition: border-color 1s;
			transition: border-color 1s;
		}
		.input.error {
			border-color: var(--color-brand);
		}
		.input::before {
			content: ' ';
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 2px;
			background-color: var(--color-brand);
			z-index: 10;

			-webkit-transition: transform 1s;
			transition: transform 1s;

			-webkit-transform: translateY(2px);
			transform: translateY(2px);
		}
		.input:hover::before {
			-webkit-transform: translateY(0%);
			transform: translateY(0%);
		}

		form .privacy {
			overflow: hidden;
		}

		form .privacy > input {
			float: left;
			margin-top: 7px;
			margin-right: 5px;
		}

		form .privacy > span {
			margin: 0px;
			padding: 0px;

			font-size: .8rem;
			line-height: 1rem;
			color: #777777;
		}
		form .privacy.light > span {
			color: #c3c1d0;
		}

		form .privacy > span a {
			text-decoration: underline;
		}
		form .privacy.light > span a {
			color: #c3c1d0;
		}
	/* Forms */

	/* Modal */
		.modal .modal-content {
		    background-color: transparent;
		    border: none
		}
		.modal .modal-header {
			padding: 1rem 0;
		}
		.modal .modal-header {
			display: -ms-flexbox;
		    display: flex;
		    -ms-flex-align: center;
		    align-items: center;
		    -ms-flex-pack: flex-end;
		    justify-content: flex-end;
		    border: none;
		    z-index: 100;
		}
		.modal .modal-header .close {
			display: block;
			margin: 0;
			opacity: 1;
			width: 18px;
			height: 18px;
			padding: 0;
		}
		.modal .modal-header .close > i,
		.modal .modal-header .close svg {
			display: block;
			width: 100%;
			height: 100%;
		}
		.modal .modal-header .close svg * {
			fill: white;
		}

		.modal .modal-body {
			background-color: white;
			padding: 0;
			border-radius: var(--border-radius);
			overflow: hidden;
		}

		.modal .modal-body .row,
		.modal .modal-body .row > div {
			margin: 0;
			padding: 0;
		}
		.modal .modal-body .body {
			min-height: inherit;
			box-sizing: border-box;
			padding: 30px;
		}
		.modal .modal-body .media {
			display: block;
			position: relative;
			width: 100%;
			min-height: inherit;
		}
		.modal .modal-body .media .image {
			display: block;
			width: 100%;
			height: 455px;
			z-index: 10;
		}
		@media (min-width: 768px) and (max-width: 991px) {
			.modal .modal-body .media .image {
				height: 445px;
			}
		}

		.modal-backdrop.show {
		    opacity: .75;
		}
	/* Modal */

	/* Svg */
		.svg {
			display: inline-flex;
			width: 2rem;
			height: 2rem;
		}
		.svg.md {
			width: 4rem;
			height: 4rem;
		}
		.svg.lg {
			width: 6rem;
			height: 6rem;
		}
		.svg.xl {
			width: 12rem;
			height: 12rem;
		}
		.svg svg {
			width: 100%;
			height: 100%;
		}

		.svg.ruble svg * {
			fill: #1d3752;
		}
		.svg.ruble.white svg * {
			fill: white;
		}
	/* Svg */

	/* Quiz */
		/* Body */
			.quiz-form .body {
				position: relative;
				box-sizing: border-box;
				padding: 30px;
				height: 400px;
				overflow: hidden;
			}
			@media (max-width: 991px) {
				.quiz-form .body {
					height: auto;
					padding: 15px;
				}
			}
			.quiz-form .body .step {
				position: absolute;
				top: 0px;
				left: 0px;
				width: 100%;
				height: auto;
				box-sizing: border-box;
				padding: 30px;
				opacity: 0;
				z-index: 0;

				-webkit-transform-origin: 50% 50%;
				transform-origin: 50% 50%;

				-webkit-transition: opacity .5s, transform .25s;
				transition: opacity .5s, transform .25s;

				-webkit-transform: scale(1.1,1.1);
				transform: scale(1.1,1.1);
			}
			@media (max-width: 991px) {
				.quiz-form .body .step {
					padding: 0px;
				}
			}
			.quiz-form .body .step[data-view="active"] {
				position: relative;
				opacity: 1;
				z-index: 1;

				-webkit-transform: scale(1,1);
				transform: scale(1,1);
			}
			.quiz-form .body .step .row {
				margin-left: -15px;
				margin-right: -15px;
			}
			.quiz-form .body .step .row > div {
				padding-left: 15px;
				padding-right: 15px;
			}

			/* Variants */
				.quiz-form .variants {
					display: -ms-flexbox;
				    display: flex;
				    -ms-flex-wrap: wrap;
				    flex-wrap: wrap;
				}
				.quiz-form .variants .item {
					display: block;
					position: relative;
					-ms-flex: 0 0 25%;
				    flex: 0 0 25%;
				    max-width: 25%;
				    box-sizing: border-box;
				    padding: 5px;
				    cursor: pointer;
				}
				.quiz-form .variants .item.xl {
					-ms-flex: 0 0 50%;
				    flex: 0 0 50%;
				    max-width: 50%;
				}
				@media (min-width: 768px) and (max-width: 991px) {
					.quiz-form .variants .item,
					.quiz-form .variants .item.xl {
						-ms-flex: 0 0 50%;
					    flex: 0 0 50%;
					    max-width: 50%;
					}
				}
				@media (min-width: 576px) and (max-width: 767px) {
					.quiz-form .variants .item,
					.quiz-form .variants .item.xl {
						-ms-flex: 0 0 50%;
					    flex: 0 0 50%;
					    max-width: 50%;
					}
				}
				@media (max-width: 575px) {
					.quiz-form .variants .item,
					.quiz-form .variants .item.xl {
						-ms-flex: 0 0 100%;
					    flex: 0 0 100%;
					    max-width: 100%;
					}
				}
				.quiz-form .variants .item .content {
					display: block;
					width: 100%;
					height: auto;
					border: 1px solid var(--color-gray);
					border-radius: var(--border-radius);
				}
				.quiz-form .variants .item .content .image {
					display: block;
					width: 100%;
					height: 150px;
				}
				.quiz-form .variants .item .content span {
					display: block;
					box-sizing: border-box;
					padding: 15px 10px;

					font-size: 11px;
					line-height: 14px;
					font-weight: bold;
					text-align: center;
				}
				.quiz-form .variants .item .check {
					display: block;
					position: absolute;
					top: 0;
					bottom: 0;
					left: 0;
					right: 0;
					margin: auto;
					width: 28px;
					height: 28px;
					border-radius: 28px;
					border: 2px solid var(--color-gray);
					background-color: white;
					z-index: 100;
					opacity: 0;

					-webkit-transition: opacity .5s, transform .5s;
					transition: opacity .5s, transform .5s;

					-webkit-transform: scale(.5,.5);
					transform: scale(.5,.5);
				}
				.quiz-form .variants .item[data-view="active"] .check {
					opacity: 1;

					-webkit-transform: scale(1,1);
					transform: scale(1,1);
				}
				.quiz-form .variants .item .check::before,
				.quiz-form .variants .item .check::after {
					content: '';
					position: absolute;
					top: 0;
					bottom: 0;
					left: 0;
					right: 0;
					margin: auto;
					background-color: var(--color-brand);
				}
				.quiz-form .variants .item .check::before {
					width: 6px;
					height: 2px;

					-webkit-transform: translate(-3px,2px) rotate(45deg);
					transform: translate(-3px,2px) rotate(45deg);
				}
				.quiz-form .variants .item .check::after {
					width: 10px;
					height: 2px;

					-webkit-transform: translate(2px,1px) rotate(-45deg);
					transform: translate(2px,1px) rotate(-45deg);
				}
			/* Variants */

			/* Discount */
				.quiz-form  .discount {
					display: block;
					position: relative;
					width: 100%;
					height: auto;
					box-sizing: border-box;
					padding:  15px;
					background-color: var(--color-second);
					border-radius: var(--border-radius);
					color: white;
					text-align: center;
				}

				.quiz-form  .discount .value {
					display: block;
					font-size: 34px;
					line-height: 34px;
					font-weight: bold;
				}
				.quiz-form  .discount .value .svg {
					width: 28px;
					height: 24px;
				}
				.quiz-form  .discount .value .svg svg * {
					fill: white;
				}
			/* Discount */
		/* Body */

		/* Control */
			.quiz-form .control {
				box-sizing: border-box;
				padding: 0 15px;
				border-top: 2px solid var(--color-gray);
			}
		/* Control */
	/* Quiz */
/* Components */

/* Animation */
	/* slide-up-in */
		@-webkit-keyframes slide-up-in {
		  0%   { opacity: 0; -webkit-transform: translateY(10px);}
		  100% { opacity: 1; -webkit-transform: translateY(0px); }
		}
		@-moz-keyframes slide-up-in {
		  0%   { opacity: 0; -moz-transform: translateY(10px); }
		  100% { opacity: 1; -moz-transform: translateY(0px); }
		}
		@-o-keyframes slide-up-in {
		  0%   { opacity: 0; -o-transform: translateY(10px); }
		  100% { opacity: 1; -o-transform: translateY(0px); }
		}
		@keyframes slide-up-in {
		  0%   { opacity: 0; transform: translateY(10px); }
		  100% { opacity: 1; transform: translateY(0px); }
		}
	/* --- */

	/* slide-down-in */
		@-webkit-keyframes slide-down-in {
		  0%   { opacity: 0; -webkit-transform: translateY(-10px);}
		  100% { opacity: 1; -webkit-transform: translateY(0px); }
		}
		@-moz-keyframes slide-down-in {
		  0%   { opacity: 0; -moz-transform: translateY(-10px); }
		  100% { opacity: 1; -moz-transform: translateY(0px); }
		}
		@-o-keyframes slide-down-in {
		  0%   { opacity: 0; -o-transform: translateY(-10px); }
		  100% { opacity: 1; -o-transform: translateY(0px); }
		}
		@keyframes slide-down-in {
		  0%   { opacity: 0; transform: translateY(-10px); }
		  100% { opacity: 1; transform: translateY(0px); }
		}
	/* --- */

	/* slide-left-in */
		@-webkit-keyframes slide-left-in {
		  0%   { opacity: 0; -webkit-transform: translateX(10px); }
		  100% { opacity: 1; -webkit-transform: translateX(0px); }
		}
		@-moz-keyframes slide-left-in {
		  0%   { opacity: 0; -moz-transform: translateX(10px); }
		  100% { opacity: 1; -moz-transform: translateX(0px); }
		}
		@-o-keyframes slide-left-in {
		  0%   { opacity: 0; -o-transform: translateX(10px); }
		  100% { opacity: 1; -o-transform: translateX(0px); }
		}
		@keyframes slide-left-in {
		  0%   { opacity: 0; transform: translateX(10px); }
		  100% { opacity: 1; transform: translateX(0px); }
		}
	/* --- */

	/* slide-down-out */
		@-webkit-keyframes slide-down-out {
		  0%   { opacity: 1; -webkit-transform: translateY(0px);}
		  100% { opacity: 0; -webkit-transform: translateY(10px); }
		}
		@-moz-keyframes slide-down-out {
		  0%   { opacity: 1; -moz-transform: translateY(0px); }
		  100% { opacity: 0; -moz-transform: translateY(10px); }
		}
		@-o-keyframes slide-down-out {
		  0%   { opacity: 1; -o-transform: translateY(0px); }
		  100% { opacity: 0; -o-transform: translateY(10px); }
		}
		@keyframes slide-down-out {
		  0%   { opacity: 1; transform: translateY(0px); }
		  100% { opacity: 0; transform: translateY(10px); }
		}
	/* --- */

	/* slide-up-out */
		@-webkit-keyframes slide-up-out {
		  0%   { opacity: 1; -webkit-transform: translateY(0px);}
		  100% { opacity: 0; -webkit-transform: translateY(-10px); }
		}
		@-moz-keyframes slide-up-out {
		  0%   { opacity: 1; -moz-transform: translateY(0px); }
		  100% { opacity: 0; -moz-transform: translateY(-10px); }
		}
		@-o-keyframes slide-up-out {
		  0%   { opacity: 1; -o-transform: translateY(0px); }
		  100% { opacity: 0; -o-transform: translateY(-10px); }
		}
		@keyframes slide-up-out {
		  0%   { opacity: 1; transform: translateY(0px); }
		  100% { opacity: 0; transform: translateY(-10px); }
		}
	/* --- */


	/* scale-in */
		.scale-in {
			opacity: 0;
			-webkit-animation: slide-up-in .5s forwards;
			animation: slide-up-in .5s forwards;
		}

		@-webkit-keyframes scale-in {
		  0%   { opacity: 0; -webkit-transform: scale(0.98,0.98);}
		  100% { opacity: 1; -webkit-transform: scale(1,1); }
		}
		@-moz-keyframes scale-in {
		  0%   { opacity: 0; -moz-transform: scale(0.98,0.98); }
		  100% { opacity: 1; -moz-transform: scale(1,1); }
		}
		@-o-keyframes scale-in {
		  0%   { opacity: 0; -o-transform: scale(0.98,0.98); }
		  100% { opacity: 1; -o-transform: scale(1,1); }
		}
		@keyframes scale-in {
		  0%   { opacity: 0; transform: scale(0.98,0.98); }
		  100% { opacity: 1; transform: scale(1,1); }
		}
	/* --- */

	/* scale-out */
		.scale-out {
			opacity: 1;

			-webkit-animation: slide-up-out .5s forwards;
			animation: slide-up-out .5s forwards;
		}

		@-webkit-keyframes scale-out {
		  0%   { opacity: 1; -webkit-transform: scale(1,1);}
		  100% { opacity: 0; -webkit-transform: scale(0.98,0.98); }
		}
		@-moz-keyframes scale-out {
		  0%   { opacity: 1; -moz-transform: scale(1,1); }
		  100% { opacity: 0; -moz-transform: scale(0.98,0.98); }
		}
		@-o-keyframes scale-out {
		  0%   { opacity: 1; -o-transform: scale(1,1); }
		  100% { opacity: 0; -o-transform: scale(0.98,0.98); }
		}
		@keyframes scale-out {
		  0%   { opacity: 1; transform: scale(1,1); }
		  100% { opacity: 0; transform: scale(0.98,0.98); }
		}
	/* --- */
/* Animation */

/* Helper classes */
    .text-color-white { color: white !important; }
    .text-color-gray { color: var(--color-gray-dark) !important; }
    .text-color-brand { color: var(--color-brand) !important; }

    .background-color-white { background-color: white; }
    .background-color-gray { background-color: #AAAAAA; }
    .background-color-black { background-color: #414141; }
    .background-color-red { background-color: #C40A52; }	 	 	
    .background-color-blue { background-color: #0057FF; }

    .text-align-left { text-align: left; }
    .text-align-right { text-align: right; }
    .text-align-center { text-align: center; }

    .text-upper { text-transform: uppercase; }

    .text-size-xs { font-size: .8rem; }
    .text-size-sm { font-size: 1rem; }
    .text-size-md { font-size: 1.5rem; }
    .text-size-lg { font-size: 2rem; }
    .text-size-xl { font-size: 4rem; }
    
    .block{ display: block !important; }
    .inline{ display: inline !important; }
    .inline-block{ display: inline-block !important; }
    .justify{ width: 100% !important; }


    .padding{ box-sizing: border-box; }
    .padding.xxs{ padding: 0 5px; }
    .padding.xs{ padding: 0 1rem; }
    .padding.sm{ padding: 0 1.5rem; }
    .padding.md{ padding: 0 2rem; }
    .padding.lg{ padding: 0 2.5rem; }
    .padding.xl{ padding: 0 3rem; }
    .padding.xxl{ padding: 0 3.5rem; }
    .padding.no{ padding: 0px !important; }
    .margin.no{ margin: 0px !important; }



    hr {
    	display: block;
    	position: relative;
    	margin: 0;
    	padding: 0;
    	width: 100%;
    	height: 1px;
    	border: none;
    	border-bottom: 1px solid #ebebeb;
    }
    hr.inverse {
    	border-bottom: 1px solid #56667a;
    }

    hr.indent{ border: none; background: transparent; margin: 0; padding: 0; width: 100%; }
    hr.indent.xxs{ height: .5rem; }
    hr.indent.xs{ height: 1rem; }
    hr.indent.sm{ height: 2rem; }
    hr.indent.md{ height: 3rem; }
    hr.indent.lg{ height: 4rem; }
    hr.indent.xl{ height: 5rem; }

    hr.brand {
		display: block;
		width: 100%;
		height: 100px;
		background-color: #C20101;
		border: none;
	}

    @media (min-width: 992px) and (max-width: 1199px) {
    	.text-align-left-lg { text-align: left !important; }
	    .text-align-right-lg { text-align: right !important; }
	    .text-align-center-lg { text-align: center !important; }
    }

    @media (min-width: 768px) and (max-width: 991px) {
    	.text-align-left-md { text-align: left !important; }
	    .text-align-right-md { text-align: right !important; }
	    .text-align-center-md { text-align: center !important; }

	    hr.indent.xxs{ height: .2rem; }
	    hr.indent.xs{ height: .8rem; }
	    hr.indent.sm{ height: 1rem; }
	    hr.indent.md{ height: 2rem; }
	    hr.indent.lg{ height: 3rem; }
	    hr.indent.xl{ height: 4rem; }
    }

    @media (min-width: 576px) and (max-width: 767px) {
    	.text-align-left-sm { text-align: left !important; }
	    .text-align-right-sm { text-align: right !important; }
	    .text-align-center-sm { text-align: center !important; }

	    hr.indent.xxs{ height: .2rem; }
	    hr.indent.xs{ height: .8rem; }
	    hr.indent.sm{ height: 1rem; }
	    hr.indent.md{ height: 2rem; }
	    hr.indent.lg{ height: 3rem; }
	    hr.indent.xl{ height: 4rem; }
    }

    @media (max-width: 575px) {
    	.text-align-left-xs { text-align: left !important; }
	    .text-align-right-xs { text-align: right !important; }
	    .text-align-center-xs { text-align: center !important; }

	    hr.indent.xxs{ height: .2rem; }
	    hr.indent.xs{ height: .8rem; }
	    hr.indent.sm{ height: 1rem; }
	    hr.indent.md{ height: 2rem; }
	    hr.indent.lg{ height: 3rem; }
	    hr.indent.xl{ height: 4rem; }

	    .padding{ box-sizing: border-box; }
	    .padding.xxs{ padding: 0 .25rem; }
	    .padding.xs{ padding: 0 .5rem; }
	    .padding.sm{ padding: 0 .75rem; }
	    .padding.md{ padding: 0 1.5rem; }
	    .padding.lg{ padding: 0 2rem; }
	    .padding.xl{ padding: 0 2.5rem; }
	    .padding.xxl{ padding: 0 3rem; }
    }
/* Helper classes 