/*Обнуление*/
*{padding:0;margin:0;border:0;}
*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
:focus,:active{outline:none;}
a:focus,a:active{outline:none;}
nav,footer,header,aside{display:block;}
html,body{height:100%;width:100%;font-size:100%;line-height:1;font-size:14px;-ms-text-size-adjust:100%;-moz-text-size-adjust:100%;-webkit-text-size-adjust:100%;}
input,button,textarea{font-family:inherit;}
input::-ms-clear{display:none;}
button{cursor:pointer;}
button::-moz-focus-inner{padding:0;border:0;}
a,a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
ul li{list-style:none;}
img{vertical-align:top;}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;}
/*--------------------*/



body {
	font-family: 'Roboto', sans-serif;
	color: #fff;
	position: relative;
	overflow-x:hidden;
	

}
.container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 15px;
}


.block-yellow {
	background: #ffd800;
	color: #060915;
	border-radius: 3px;
}


/*------------------Header------------------------*/

header {
	position: fixed;
	background-color: #0A0E15;
	width: 100%;
	border-top: 4px solid #ffd800;
	z-index: 100;
	padding: 5px 10px 4px;
	
}

.header-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: nowrap;
	margin: 0 auto;
	width: 90%;
	

}


.header-logo {
	font-size: 36px;
	line-height: 48px;
	font-weight: 500;
	color: #fff;
	text-transform: uppercase;
	white-space: nowrap;
}

.header-logo span {
	display: inline-block;
	font-size: 18px;
	padding: 7px;
	line-height: 1;
	margin-left: 8px;
}



.header-menu {

}

.header-menu-list {
	display: flex;
	transition: all 0.3s ease 0s;
}


.header-menu-list.active {
	right: 0;
}

.header-menu-list li {
	padding: 12px 15px;
	margin-right: 10px;
} 
.header-menu-link {
	font-size: 21px;
	font-weight: 500;
	text-transform: uppercase; 
	color: inherit;
	position: relative;
	white-space: nowrap;
} 


.header-menu-link::before {
	content: '';
	display: inline-block;
	opacity: 0;
	position: absolute;
	margin-top: 25px;
	left: -5%;
	width: 0%;
	height: 2px;
	background-color: #ffd800;
	transition: width 0.3s ease 0s,
	opacity 0.6s ease 0s;

}
.header-menu-link:hover::before {
	opacity: 1;
	width: 115%;
}



/*------------mobile menu-----------*/

.burger-menu {
	position: relative;
	height: 28px;
	width: 35px;
	z-index:200;
	display: none;
	cursor: pointer;

}
.burger-menu span {
	width: 100%;
	height: 3px;
	background: #fff;
	right: -7px;
	top:13px;
	position: absolute;
	transition: all 0.3s ease 0s;
}
.burger-menu:before,
.burger-menu:after {
	content: '';
	position: absolute;
	width: 100%;
	height: 3px;
	background: #fff;
	transition: all 0.4s ease 0s;
}
.burger-menu:before{
	top: 0;
}
.burger-menu:after{
	bottom: 0;
}



.burger-menu.active:before{
	transform: rotate(45deg);
	top: 12px;
	/*left: -13px;*/
}
.burger-menu.active:after{
	transform: rotate(-45deg);
	bottom: 13px;
	/*left: -13px;*/
}
.burger-menu.active span {
	transform: scale(0);
}


/*-------------------------MAIN-------------------------*/



.main {
	text-align: center;
	background: #0a0e15 url(../img/main/01.jpg) center/cover no-repeat;
	padding: 268px 0px 300px 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.main-title {
	font-size: 60px;
	line-height: 72px;
	font-weight: 100;
	letter-spacing: -0.025em;
	margin: 0px 0px 70px 0px;
}
.main-title span {
	font-weight: 500;
}
.main-form {
	display: flex;
	justify-content: center;
	
}

.main-input {
	height: 65px;
	line-height: 65px;
	opacity: 0.6;
	border: 1px solid #ffffff;
	border-radius: 3px;
	background-color: transparent;
	padding: 0px 20px;
	font-size: 18px;
	line-height: 1;
	font-weight: 700;
	color: #ffffff;
	margin-right: 15px;
	transition-duration: 0.2s;
}

.main-input:hover {
	box-shadow: 0 0 8px rgba(255,255,255,0.8);
	opacity: 0.7;
}

input::placeholder { 
	color: #fff;
	font-weight: 500;	
} 



.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	height: 66px;
	font-weight: 700;
	padding: 0px 43px 0px 43px;
	text-transform: uppercase;
	border-radius: 3px;
	position: relative;
	top: 0;
	transition: all 0.2s ease 0s;
}

.btn:hover {
	box-shadow: 0 0 8px rgba(255, 216, 0, 0.7);
}


.btn:active {
	top: 4px;
}


/*----------------about--------------------*/


.about {
	background-color: #191b29;
	padding: 110px 0px 110px 0px;
}
.about-row {
	position: relative;
	display: flex;
	justify-content: space-between;
}

.about-img {
	top: -250px;
	position: absolute;
	left: calc(50% - 223px);
}

.about-columns{
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.about-item {
	display: flex;
	flex-direction: column;
	margin: 0px 0px 78px 0px;
	width: 320px;
}


.about-item__title {
	font-family: Roboto;
	font-size: 36px;
	line-height: 58px;
	font-weight: 300;
	color: #ffffff;
	padding-left: 80px;
	margin-bottom: 17px;
	/*flex: 1 1 100%;*/
}

.title-icon1 {
	background: url(../img/about/icon1.png) 0 0/ 58px 58px no-repeat;
}
.title-icon2 {
	background: url(../img/about/icon2.png) 0 0/ 58px 58px no-repeat;
}
.title-icon3 {
	background: url(../img/about/icon3.png) 0 0/ 58px 58px no-repeat;
}
.title-icon4 {
	background: url(../img/about/icon4.png) 0 0/ 58px 58px no-repeat;
}


.about-item__text {
	font-size: 16px;
	line-height: 30px;
	font-weight: 300;
	color: #9d9fbf;

}



/*----------------------TEAM*---------------------*/

.team {
	background-color: #ffd800;
	color: #191b29;
	padding: 137px 0 96px 0;
}

.team-row {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
h2 {
	font-size: 60px;
	line-height: 48px;
	font-weight: 100;
	text-align: center;
}
h2 span {
	font-size: 36px;
	font-weight: 700;
}
.team__title {
	margin-bottom: 90px;
}
.team-colums {
	display: flex;
	justify-content: space-between;
}
.team-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 0 1 25%;
	margin: 0 15px;
	transition: all 0.5s ease 0s;


}

.team-item:hover {
	transform: translate(0, -18px);
}


.team-item__photo {
	max-width: 130px;
	height: 130px;
	border-radius: 50%;
	object-fit: cover;
	border: 10px solid #191b29;
	background-color: #191b29;
	margin-bottom: 43px;
}
.team-item__name {
	font-size: 30px;
	line-height: 1;
	height: 35px;
	overflow: hidden;
	font-weight: 500;
	margin-bottom: 26px;
	text-align: center;
}
.team-item__description {
	opacity: 0.7;
	font-size: 18px;
	line-height: 1;
	font-weight: 300;
	text-align: center;
}

/*-------------------------ACTIVITY-------------------------*/

.activity {
	color: #191b29;
	position: relative;
}


.activity-row {

}
.activity-part-awesome {
	background-color: #ffe347;
	padding: 70px 0 20px 0;
	padding-left: 15px;

}


.activity-title {
	font-size: 30px;
	line-height: 38px;
	font-weight: 700;
	margin-bottom: 31px;
	max-width: 500px;
}
.activity-text {
	font-size: 16px;
	line-height: 30px;	
	font-weight: 300;
	margin-bottom: 50px;
	max-width: 500px;
}
.activity-part-like {
	padding: 70px 0 0 0;
	padding-left: 15px;
}

.activity-btn {
	color: #ffffff;
	background-color: #191b29;
	margin-bottom: 150px;
}

.activity-btn:hover {
	box-shadow: 0 0 8px rgba(25, 27, 41, 0.4),
	0 0 16px rgba(25, 27, 41, 0.4);
}


.activity-img-wrapper {
	width: auto;
	position: absolute;
	right: 0;
	top: 0;
	overflow: hidden;
}


.activity-img {
	height: 750px;
	width: 1000px;

	background: url(../img/activity/app01.png) 0 0 / auto 750px no-repeat;
}



/*-----------------------FEATURES--------------------*/


.features {
	background: #0a0e15 url(../img/features/bg-01.jpg) top center/cover no-repeat;
	padding: 84px 0px 98px 0px;
}
.features-row {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.features__title {
	margin-bottom: 97px;

}
.features-colums {
	display: flex;
	justify-content: space-between;
	margin-bottom: 84px;
}
.features-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 0 1 25%;
	height: 100%;
	margin: 0 15px;

}
.features-item__img {
	/*width: 100%;*/
	height: 90px;
	object-fit: contain;
	margin-bottom: 49px;

}
.features-item__title {
	font-size: 30px;
	line-height: 1;
	font-weight: 700;
	margin-bottom: 26px;
	text-align: center;
	/*height: 100%;*/

}
.features-item__description {
	opacity: 0.7;
	font-size: 18px;
	line-height: 1;
	font-weight: 300;
	text-align: center;

}

/*-----------------------FOOTER--------------------*/

footer {
	background-color: #191b29;
	padding: 80px 0;
}


.footer-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 100px;
}
.footer-nav-list {
	display: inline-flex;
	justify-content: space-between;
	flex: 0 1 60%;

}
.footer__link {
	font-size: 15px;
	font-weight: 500;
	text-transform: uppercase;
	color: inherit;
	letter-spacing: 1px;
	padding: 8px 6px;
	opacity: 0.6;
	white-space: nowrap;
}

.footer__link:hover {
	border-bottom: 2px solid #ffd800;
	opacity: 1;
}

.footer-rights {
	opacity: 0.7;
	font-size: 15px;
	line-height: 1;
	font-weight: 300;

}



/*-----------------ВОЗВРАТ К ВЕРХУ----------------------*/

#back-top {
	position: fixed;
	bottom: 20px;
	right: 30px;  
	z-index:90;

}

#back-top a{
	display: block;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.25);
}

#back-top a::after {
	content: "";
	display: block;
	background: url(../img/back-top/chevron-up-solid.svg) 0 0/ 22px no-repeat;
	width: 22px;
	height: 22px;
	position: absolute;
	top: 8px;
	left: 12px;
	opacity: 0.25;

	-webkit-transition: all linear 0.15s; 
	-moz-transition: all linear 0.15s;
	-ms-transition: all linear 0.15s;
	-o-transition: all linear 0.15s;
	transition: all linear 0.15s;

}

#back-top a:hover::after {
	top: 5px;
	opacity: 0.6;
}

