@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-Regular/OpenSansRegular.eot');
	src: local('Open Sans Regular'), local('OpenSans-Regular'),
		url('../fonts/OpenSans-Regular/OpenSansRegular.eot?#iefix') format("embedded-opentype"),
		url('../fonts/OpenSans-Regular/OpenSansRegular.woff') format("woff"), 
		url('../fonts/OpenSans-Regular/OpenSansRegular.woff2') format("woff2"), 
		url('../fonts/OpenSans-Regular/OpenSansRegular.ttf') format("truetype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-Light/OpenSansLight.eot');
	src: local('Open Sans Light'), local('OpenSans-Light'),
		url('../fonts/OpenSans-Light/OpenSansLight.eot?#iefix') format("embedded-opentype"),
		url('../fonts/OpenSans-Light/OpenSansLight.woff') format("woff"), 
		url('../fonts/OpenSans-Light/OpenSansLight.woff2') format("woff2"), 
		url('../fonts/OpenSans-Light/OpenSansLight.ttf') format("truetype");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-Bold/OpenSansBold.eot');
	src: local('Open Sans Bold'), local('OpenSans-Bold'),
		url('../fonts/OpenSans-Bold/OpenSansBold.eot?#iefix') format("embedded-opentype"),
		url('../fonts/OpenSans-Bold/OpenSansBold.woff') format("woff"), 
		url('../fonts/OpenSans-Bold/OpenSansBold.woff2') format("woff2"), 
		url('../fonts/OpenSans-Bold/OpenSansBold.ttf') format("truetype");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-ExtraBold/OpenSansExtraBold.eot');
	src: local('Open Sans Extrabold'), local('OpenSans-Extrabold'),
		url('../fonts/OpenSans-ExtraBold/OpenSansExtraBold.eot?#iefix') format("embedded-opentype"),
		url('../fonts/OpenSans-ExtraBold/OpenSansExtraBold.woff') format("woff"), 
		url('../fonts/OpenSans-ExtraBold/OpenSansExtraBold.woff2') format("woff2"), 
		url('../fonts/OpenSans-ExtraBold/OpenSansExtraBold.ttf') format("truetype");
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Roboto Condensed';
	src: url('../fonts/RobotoCondensed-Bold/RobotoCondensedBold.eot');
	src: local('Roboto Condensed Bold'), local('RobotoCondensed-Bold'),
		url('../fonts/RobotoCondensed-Bold/RobotoCondensedBold.eot?#iefix') format("embedded-opentype"),
		url('../fonts/RobotoCondensed-Bold/RobotoCondensedBold.woff') format("woff"), 
		url('../fonts/RobotoCondensed-Bold/RobotoCondensedBold.woff2') format("woff2"), 
		url('../fonts/RobotoCondensed-Bold/RobotoCondensedBold.ttf') format("truetype");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Roboto Condensed';
	src: url('../fonts/RobotoCondensed-Regular/RobotoCondensedRegular.eot');
	src: local('Roboto Condensed Regular'), local('RobotoCondensed-Regular'),
		url('../fonts/RobotoCondensed-Regular/RobotoCondensedRegular.eot?#iefix') format("embedded-opentype"),
		url('../fonts/RobotoCondensed-Regular/RobotoCondensedRegular.woff') format("woff"), 
		url('../fonts/RobotoCondensed-Regular/RobotoCondensedRegular.woff2') format("woff2"), 
		url('../fonts/RobotoCondensed-Regular/RobotoCondensedRegular.ttf') format("truetype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

body {
	width: 100%;
    height: auto;
    background: #fff;
	font-family: 'Open Sans', 'Arial', sans-serif;
	font-size: 15px;
	font-weight: 300;
    color: #000;
    overflow-x: hidden;
}

p, li {
	font: inherit;
	line-height: 1.7;
}

p + p,
li + li {
	margin-top: 25px;
}

ol {
	margin-top: 35px;
}

ul {
	margin-top: 25px;
}

li {
	position: relative;
	padding-left: 40px;
}

ol > li {
	counter-increment: ol;
}

ol > li:before {
	content: counter(ol);
	display: inline-block;
	font-weight: 800;
	color: #000;
	position: absolute;
	top: 0;
	left: 0px;
}

ul > li:before {
	content: '';
	display: block;
	background-color: #000;
	width: 20px;
	height: 3px;
	position: absolute;
	left: 0;
	top: 10px;
}

nav ul > li:before {
	display: none;
}

nav ul,
nav ul > li {
	margin-top: 0;
	padding-left: 0;
}

h1, h2 {
	font-family: 'Roboto Condensed', 'Arial', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
}

h1 {
	font-size: 70px;
	color: #fff;
}

h2 {
	font-size: 50px;
	line-height: 1.1;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 20px;
}

h3, h4 {
	font: inherit;
	font-weight: 700;
	line-height: 1;
	font-size: 30px;
	padding: 6px 0;
	margin-top: 20px;
	margin-bottom: 20px;
}

.wrapper {
	max-width: 1140px;
	width: 100%;
	padding: 0 15px;
	margin: 0 auto;
}

.btn {
	display: inline-block;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
	text-align: center;
	-webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
	padding: 18px 0;
}

.btn:hover {
	-moz-transform: scale(1.04); 
    -ms-transform: scale(1.04);
    -webkit-transform: scale(1.04);
    -o-transform: scale(1.04);
    transform: scale(1.04);
}
/* ___________________HEADER______________________ */
.header {
	padding: 15px 0;
}

.header__item {
	width: 33%;
	display: inline-block;
	vertical-align: middle;
}

.header__item:first-child {
	width: 27%;
}

.header__item:last-child {
	text-align: right;
	width: 44%;
}

.header__text {
	font-size: 20px;
	width: 28%;
}

.header__link,
.header__bonus {
	font-weight: 700;
	color: #000;
	text-transform: uppercase;
	display: inline-block;
	margin-right: 20px;
}

.header__link:hover,
.header__bonus:hover {
	text-shadow: 0 0 1px #ff4949;
}

.header__bonus:before {
	content: '';
	display: inline-block;
	width: 23px;
	height: 25px;
	margin-right: 5px;
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2229.91%22%20height%3D%2232.5%22%20viewBox%3D%220%200%2029.91%2032.5%22%3E%0A%20%20%0A%3Cdefs%3E%3Cstyle%3E%0A%20%20%20%20%20%20.cls-1%20%7B%0A%20%20%20%20%20%20%20%20fill%3A%20%230ea7b5%3B%0A%20%20%20%20%20%20%20%20fill-rule%3A%20evenodd%3B%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20id%3D%22IMG%22%20class%3D%22cls-1%22%20d%3D%22M1189.02%2C39.2c-1.48%2C2.883-6.64%2C1.279-6.64%2C5.525%2C0%2C8.284%2C7.04%2C9.027%2C7.04%2C9.027h-15.83s7.03-.743%2C7.03-9.027c0-4.252-5.16-2.643-6.63-5.535-3.33-.547-7.44-6.5-7.44-9.826%2C0-3.489%2C1-6.318%2C4.4-6.318a5.98%2C5.98%2C0%2C0%2C1%2C2.64.629V21.248h15.83v2.441a5.939%2C5.939%2C0%2C0%2C1%2C2.66-.648c3.38%2C0%2C4.37%2C2.829%2C4.37%2C6.318C1196.45%2C32.7%2C1192.34%2C38.694%2C1189.02%2C39.2Zm-18.09-14.35c-2.43%2C0-2.64%2C2.022-2.64%2C4.514%2C0%2C2.214%2C2.94%2C6.883%2C5.3%2C7.9V25.786A4.3%2C4.3%2C0%2C0%2C0%2C1170.93%2C24.845Zm21.17%2C0a4.258%2C4.258%2C0%2C0%2C0-2.68.971V37.273c2.36-.987%2C5.31-5.688%2C5.31-7.914C1194.73%2C26.867%2C1194.52%2C24.845%2C1192.1%2C24.845Z%22%20transform%3D%22translate(-1166.56%20-21.25)%22%2F%3E%3C%2Fsvg%3E");
	background-repeat: no-repeat no-repeat;
	background-position: center center;
	background-size: contain;
	vertical-align: middle;
}

.header__btn {
	min-width: 100px;
}

.header__signup {
	background-color: #2daf55;
	margin-right: 15px;
}

.header__login {
	background-color: #0ea7b5;
}

/* _______________MAIN-BANNER_________________ */
.main-banner {
	background: url('../img/mainBaner.jpg') no-repeat center center / cover;
	padding: 6vh 0 14vh;
	position: relative;
	text-align: center;
}
/* _________________MENU_____________________ */
.main-menu {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(25, 35, 36, .7);
	z-index: 100;
}

.main-menu__list {
	text-align: center;
}

.main-menu__item {
	display: inline-block;
	width: 20%;
	border-right: 2px solid #0ea7b5;
}

.main-menu__item + .main-menu__item {
	margin-left: -5px;
}

.main-menu__item:first-child {
	border-left: 2px solid #0ea7b5;
}

.main-menu__link {
	color: #fff;
	text-transform: uppercase;
	font-weight: 400;
	display: block;
	padding: 17px 0;
}

.main-menu__link:hover {
	background: -webkit-linear-gradient(90deg, rgba(255, 73, 73, .5), rgba(14, 167, 181, .5));
    background: -moz-linear-gradient(90deg, rgba(255, 73, 73, .5), rgba(14, 167, 181, .5));
    background: -ms-linear-gradient(90deg, rgba(255, 73, 73, .5), rgba(14, 167, 181, .5));
    background:  -o-linear-gradient(90deg, rgba(255, 73, 73, .5), rgba(14, 167, 181, .5));
    background: linear-gradient(90deg, rgba(255, 73, 73, .5), rgba(14, 167, 181, .5));
}

.main-menu__link:before {
	content: '';
	display: inline-block;
	background-image: url('../img/spritesheet.png');
	background-repeat: no-repeat;
	height: 31px;
	background-color: transparent;
	vertical-align: middle;
	margin-right: 25px;
}

.main-menu__item:first-child .main-menu__link:before {
	background-position: -45px -47px;
	width: 30px;
} 

.main-menu__item:nth-child(2) .main-menu__link:before {
	background-position: -79px -47px;
	width: 30px;
} 

.main-menu__item:nth-child(3) .main-menu__link:before {
	background-position: -95px -2px;
	width: 34px;
} 

.main-menu__item:nth-child(4) .main-menu__link:before {
	background-position: -113px -37px;
	width: 30px;
} 

.main-menu__item:nth-child(5) .main-menu__link:before {
	background-position: -79px -81px;
	width: 46px;
} 

.btn-mobile {
	display: none;
}
/* _____________________CONTENT-PARAGR______________________ */
.main__content {
	padding: 20px 0 20px;
}
/* _________________BONUS-BANNER__________________ */
.bonus-banner {
	background: url('../img/bonus-banner.jpg') no-repeat center center / cover;	
	text-align: center;
	padding-top: 25px;
}

.bonus-banner__box {
	background-color: #262626;
	position: relative;
	padding: 5.5vw 30vw 3vw 2vw;
}

.bonus-banner__title {
	font-family: 'Roboto Condensed', 'Arial', sans-serif;
	font-size: 55px;
	color: #fff;
	margin-bottom: 0;
	margin-bottom: 40px;
	position: relative;
	z-index: 1;
}

.bonus-banner__title .color_red {
	color: #ff4949;
}

.bonus-banner__title .color_blue {
	color: #0ea7b5;
}

.bonus-banner__img {
	position: absolute;
    right: 3vw;
    bottom: -4vw;
	max-height: none;
}

.bonus-banner__list {
	margin-top: 80px;
}

.bonus-banner__item {
	font-weight: 700;
	font-size: 16px;
	display: inline-block;
	text-transform: uppercase;
	vertical-align: middle;
	padding-left: 50px;
}

.bonus-banner__item + .bonus-banner__item {
	margin-left: 5%;
	margin-top: 0;
}

.bonus-banner__item:before {
	height: 41px;
	background-color: transparent;
	background-image: url('../img/spritesheet.png');
	background-repeat: no-repeat;
	top: 0;
    bottom: 0;
    margin: auto;
}

.bonus-banner__item:first-child:before {
	background-position: -2px -2px;
	width: 44px;
}

.bonus-banner__item:nth-child(2):before {
	background-position: -50px -2px;
	width: 41px;
}

.bonus-banner__item:last-child:before {
	background-position: -2px -47px;
	width: 39px;
}

.bonus-banner__item:nth-child(-n+2):after {
	content: '';
	display: inline-block;
	height: 110px;
	width: 90px;
	background: url('../img/saperate.png') no-repeat center center / cover;
	vertical-align: middle;
	margin-left: 35px;
}

.join-btn {
	min-width: 160px;
	background: -webkit-linear-gradient(0deg, #c53737, #ff4949);
    background: -moz-linear-gradient(0deg, #c53737, #ff4949);
    background: -ms-linear-gradient(0deg, #c53737, #ff4949);
    background:  -o-linear-gradient(0deg, #c53737, #ff4949);
    background: linear-gradient(0deg, #c53737, #ff4949);
}
/* _________________CONTENT-BOX___________________ */
.content__btn-box {
	margin-top: 20px;
	text-align: center;
	margin-bottom: 20px;
}
/* ___________________RATING_______________________ */
.rating__box {
	background-color: #344345;
	color: #fff;
	padding: 40px 20px 50px;
}

.rating__box-title {
	font-size: 30px;
	margin-bottom: 45px;
}

.rating__item + .rating__item{
	margin-top: 25px;
}

.rating__item-title {
	display: inline-block;
	font-size: 22px;
	font-weight: 400;
	width: 49%;
}

.rating__item-value {
	font-size: 22px;
	display: inline-block;
	width: 50%;
	text-align: right;
}

.rating__progress-bar {
	display: block;
	width: 100%;
	height: 20px;
	background-color: #1a1a1a;
	margin-top: 15px;
}

.rating__progress-layer {
	display: block;
	height: 100%;
	background: -webkit-linear-gradient(90deg, #0ea7b5, #ff4949);
    background: -moz-linear-gradient(90deg, #0ea7b5, #ff4949);
    background: -ms-linear-gradient(90deg, #0ea7b5, #ff4949);
    background:  -o-linear-gradient(90deg, #0ea7b5, #ff4949);
    background: linear-gradient(90deg, #0ea7b5, #ff4949);
}
/* _____________________FAQ_______________________ */
.faq {
	padding: 50px 0;
}

.faq__box + .faq__box {
	margin-top: 15px;
}

.faq__box-title {
	background: -webkit-linear-gradient(90deg, #c53737, #ff4949);
    background: -moz-linear-gradient(90deg, #c53737, #ff4949);
    background: -ms-linear-gradient(90deg, #c53737, #ff4949);
    background:  -o-linear-gradient(90deg, #c53737, #ff4949);
    background: linear-gradient(90deg, #c53737, #ff4949);
	padding: 25px 25px;
	-webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	cursor: pointer;
	color: #fff;
}

.faq__box-title:hover {
	background: -webkit-linear-gradient(90deg, #ff4949, #0ea7b5);
    background: -moz-linear-gradient(90deg, #ff4949, #0ea7b5);
    background: -ms-linear-gradient(90deg, #ff4949, #0ea7b5);
    background:  -o-linear-gradient(90deg, #ff4949, #0ea7b5);
    background: linear-gradient(90deg, #ff4949, #0ea7b5);
}

.faq__box-text {
	padding: 10px 50px 20px 25px;
	display: none;
}
/* ____________________FOOTER_____________________ */
.footer {
	background-color: #262626;
	padding: 50px 0;
}

.footer__item {
	display: inline-block;
	vertical-align: top;
}

.footer__logo {
	display: block;
	margin: 20px 0 40px;
	text-align: left;
}

.footer__text {
	color: rgba(255, 255, 255, .7);
	width: 100%;
}

.footer__copy {
	color: #0ea7b5;
}
/* ______________________BTN-UP___________________ */
.btn-up {
	display: none;
	width: 50px;
	height: 50px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	position: fixed;
	right: 5%;
	bottom: 15%;
	border: 4px solid #e24040;
}

.btn-up:hover {
	background-color: #f14545;
}

.btn-up:before {
	content: '';
	display: block;
	width: 14px;
	height: 14px;
	border-top: 4px solid #e24040;
	border-left: 4px solid #e24040;
	-moz-transform: rotate(45deg); 
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	top: 40%;
}

/* BONUS-PAGE */

.bonus-page .main-banner {
	padding: 5vh 0 80px;
}

/* _______________BREADCRUMBS__________________ */
.breadcrumbs {
	margin-bottom: 1vh;
	color: #fff;
}

.breadcrumbs__link {
	color: #fff;
	font-weight: 700;
	display: inline-block;
}

.breadcrumbs__link:hover {
	color: #0ea7b5;
}

.breadcrumbs__separator {
	display: inline-block;
	width: 2px;
	height: 15px;
	background-color: #fff;
	vertical-align: middle;
	margin: 0 10px;
}
/* _________________BONUS-BOX__________________ */
.bonus__box {
	padding: 35px 0;
}

.bonus__box:nth-child(odd) {
	background-color: #262626;
	color: #fff;
}

.bonus__box:nth-child(even) {
	background-color: #d9d9d9;
}

.bonus__item {
	display: inline-block;
	vertical-align: middle;
}

.bonus__item:first-child {
	width: 32%;
}

.bonus__item:last-child {
	width: 64%;
	margin-left: 3%;
}

.bonus__title {
	text-align: left;
}

.bonus__item:first-child img {
	display: inline-block;
}

.bonus__btn {
	margin-top: 25px;
}
