

/*************************************************************************


                        G   E   N   E   R   A   L


*************************************************************************/


/*************************************************************************

                              B A S I C S

*************************************************************************/


.body{
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	position: relative;
	z-index: 0;
	overflow: auto;
	height: 100vh;
}

.is-touch-device .body{
	min-height: 100vh;
	height: initial;
}

.body>*{
	position: relative;
	z-index: 0;
	flex-shrink: 0;
}



/*************************************************************************

                              H E A D E R

*************************************************************************/


.page-header{
	background: #fff;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	height: 95px;
	position: fixed;
	box-sizing: border-box;
	width: 100%;
	z-index: 1;
}

@media (max-width: 1250px){

.page-header{
	height: 70px;
}

}

.page-header>*{
	display: flex;
	flex-direction: row;
	/*align-items: center;*/
	justify-content: flex-start;
	align-items: stretch;
	flex-grow: 1;
	flex-basis: 0;
	max-width: 1760px;
	padding: 0 60px;
	box-sizing: border-box;
}

@media (max-width: 1250px){

.page-header>*{
	padding: 0 20px;
}

}

	.page-header .menu-button{
		display: none;
		font-size: 36px;
		height: 1em;
	}

@media (max-width: 1250px){

	.page-header .menu-button{
		display: block;
		order: 1;
	}

}

		.page-header .menu-button>*{
			position: relative;
			width: 1em;
			height: 1em;
		}

		.page-header .menu-button>*,
		.page-header .menu-button>* *{
			cursor: pointer;
		}

			.page-header .menu-button>*>*{
				position: absolute;
				width: .5em;
				height: 2px;
				background: #000;
				top: 17px;
				opacity: 1;
				-webkit-transform: none;
				-moz-transform: none;
				-ms-transform: none;
				transform: none;
				-webkit-transition:
					opacity 200ms ease,
					transform 200ms ease
				;
				-moz-transition:
					opacity 200ms ease,
					transform 200ms ease
				;
				-ms-transition:
					opacity 200ms ease,
					transform 200ms ease
				;
				transition:
					opacity 200ms ease,
					transform 200ms ease
				;
				will-change: opacity, transform;
			}

			.page-header .menu-button>*>*:nth-child(odd){
				left: 0;
				-webkit-transform-origin: right center;
				-moz-transform-origin: right center;
				-ms-transform-origin: right center;
				transform-origin: right center;
			}

			.page-header .menu-button>*>*:nth-child(even){
				right: 0;
				-webkit-transform-origin: left center;
				-moz-transform-origin: left center;
				-ms-transform-origin: left center;
				transform-origin: left center;
			}

			.page-header .menu-button>*>*:nth-child(1),
			.page-header .menu-button>*>*:nth-child(2){
				-webkit-transform: translate(0,-8px);
				-moz-transform: translate(0,-8px);
				-ms-transform: translate(0,-8px);
				transform: translate(0,-8px);
			}

			.page-header .menu-button>*>*:nth-child(5),
			.page-header .menu-button>*>*:nth-child(6){
				-webkit-transform: translate(0,8px);
				-moz-transform: translate(0,8px);
				-ms-transform: translate(0,8px);
				transform: translate(0,8px);
			}

			.page-header .menu-button.expanded>*>*:nth-child(1){
				-webkit-transform: rotate(45deg);
				-moz-transform: rotate(45deg);
				-ms-transform: rotate(45deg);
				transform: rotate(45deg);
			}

			.page-header .menu-button.expanded>*>*:nth-child(2){
				-webkit-transform: rotate(-45deg);
				-moz-transform: rotate(-45deg);
				-ms-transform: rotate(-45deg);
				transform: rotate(-45deg);
			}

			.page-header .menu-button.expanded>*>*:nth-child(3){
				-webkit-transform: translate(-16px,0);
				-moz-transform: translate(-16px,0);
				-ms-transform: translate(-16px,0);
				transform: translate(-16px,0);
				opacity: 0;
			}

			.page-header .menu-button.expanded>*>*:nth-child(4){
				-webkit-transform: translate(16px,0);
				-moz-transform: translate(16px,0);
				-ms-transform: translate(16px,0);
				transform: translate(16px,0);
				opacity: 0;
			}

			.page-header .menu-button.expanded>*>*:nth-child(5){
				-webkit-transform: rotate(-45deg);
				-moz-transform: rotate(-45deg);
				-ms-transform: rotate(-45deg);
				transform: rotate(-45deg);
			}

			.page-header .menu-button.expanded>*>*:nth-child(6){
				-webkit-transform: rotate(45deg);
				-moz-transform: rotate(45deg);
				-ms-transform: rotate(45deg);
				transform: rotate(45deg);
			}


	.page-header .logo{
		width: 290px;
		height: 48px;
		background: url(/assets/img/logo.svg) no-repeat center center/contain;
		-webkit-transition: opacity 200ms ease;
		-moz-transition: opacity 200ms ease;
		-ms-transition: opacity 200ms ease;
		transition: opacity 200ms ease;
		will-change: opacity;
	}

@media (max-width: 1250px){

	.page-header .logo{
		width: 260px;
		height: 43px;
		order: 3;
	}

}

@media(max-width: 400px){
	
	.page-header .logo{
		width: 215px;
		height: 35px;
	}

}

	.page-header .logo:hover{
		opacity: .75;
	}

	.page-header .nav{
		display: flex;
		position: relative;
		right: -12px;
		flex-direction: row;
		align-self: stretch;
		flex-grow: 1;
		align-items: center;
		justify-content: flex-end;
		font-size: 16px;
		line-height: 1em;
		font-family: FuturaMediumC;
		letter-spacing: 2px;
		white-space: nowrap;
	}

@media(max-width: 1250px){
	
	.page-header .nav{
		display: none;
	}

}

		.page-header .nav>*{
			padding: 10px 20px;
			opacity: 1;
			-webkit-transition:
				opacity 200ms ease,
				color 200ms ease
			;
			-moz-transition:
				opacity 200ms ease,
				color 200ms ease
			;
			-ms-transition:
				opacity 200ms ease,
				color 200ms ease
			;
			transition:
				opacity 200ms ease,
				color 200ms ease
			;
			will-change: opacity,color;
		}

	@media(max-width: 1600px){
		
		.page-header .nav>*{
			padding: 10px 12px;
		}

	}

		.page-header .nav>*:hover{
			opacity: .75;
			color: #67b7b7;
		}
		
		.page-header .nav>*.active{
			color: #67b7b7;
		}
		
		.page-header .nav>*.active:hover{
			opacity: 1;
		}

	.page-header .lang{
		position: relative;
		top: 1px;
		font-size: 16px;
		line-height: 25px;
		align-self: flex-start;
		margin-left: 60px;
	}

@media (max-width: 1250px){

	.page-header .lang{
		top: -1px;
		order: 2;
		flex-grow: 1;
		margin-left: 10px;
	}

}

@media (max-width: 360px){

	.page-header .lang{
		margin-left: 0;
	}

}

		.page-header .lang>*{
			display: block;
			padding: 10px 12px;
			box-sizing: border-box;
		}

			.lang-ru .page-header .lang>*:before{
				content: 'EN';
			}

			.lang-en .page-header .lang>*:before{
				content: 'RU';
			}



/*************************************************************************

                             C O N T E N T

*************************************************************************/


.page-content-wrapper{
	display: flex;
	position: relative;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	padding-top: 95px;
	flex-grow: 1;
}

@media (max-width: 1250px){

.page-content-wrapper{
	padding-top: 70px;
}

}

.page-content{
	display: flex;
	position: relative;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	flex-grow: 1;
}

	.page-content>*{
		display: block;
		position: relative;
		z-index: 1;
	}

	.page-content>.section{
		padding: 0 60px;
		box-sizing: border-box;
		margin: 0 auto;
		max-width: 1760px;
		width: 100%
	}

@media (max-width: 1250px){

	.page-content>.section{
		padding: 0 20px;
	}

}

		.page-content>.section>.section-inner{
			position: relative;
			box-sizing: border-box;
		}



/*************************************************************************

                              F O O T E R

*************************************************************************/


.page-footer{
	display: flex;
	flex-direction: row;
	height: auto;
	align-items: stretch;
	justify-content: center;
	box-sizing: border-box;
	border-top: 1px solid #ebebeb;
	background: #fff;
}

.page-footer>*{
	display: flex;
	flex-direction: row;
	padding: 20px 60px 20px;
	/*flex-basis: 80px;*/
	align-items: center;
	justify-content: flex-start;
	/*box-sizing: border-box;*/
	flex-grow: 1;
	flex-basis: 0;
	max-width: 1640px;
}


@media (max-width: 1250px){

.page-footer>*{
	padding: 20px;
	flex-basis: 80px;
}

}

@media (max-width: 1020px){

.page-footer>*{
	flex-wrap: wrap;
	flex-basis: 230px;
}

}

@media (max-width: 640px){

.page-footer>*{
	flex-direction: column;
	flex-basis: 250px;
	align-items: flex-start;
	flex-wrap: nowrap;
}

}

	.page-footer .app-links{
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		justify-content: flex-start;
	}

@media (max-width: 1020px){

	.page-footer .app-links{
		width: 100%;
		padding-bottom: 20px;
	}

}

		.page-footer .app-links>*{
			position: relative;
			width: 130px;
			height: 40px;
			box-sizing: border-box;
			border: 2px solid rgba(0,0,0,.1);
			border-radius: 2px;
			opacity: 1;
			-webkit-transition: opacity 200ms ease;
			-moz-transition: opacity 200ms ease;
			-ms-transition: opacity 200ms ease;
			transition: opacity 200ms ease;
			will-change: opacity;
		}

		.page-footer .app-links>*:hover{
			opacity: .75;
		}

		.page-footer .app-links>*+*{
			margin-left: 10px;
		}

			.page-footer .app-links>*:before{
				content: '';
				display: block;
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				opacity: .25;
				background-repeat: no-repeat;
				background-position: left 10px center;
			}

			.page-footer .app-links>*.apple:before{
				background-image: url(/assets/img/app-apple.svg);
			}

			.page-footer .app-links>*.google:before{
				background-image: url(/assets/img/app-google.svg);
			}

	.page-footer .socials{
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		justify-content: flex-start;
		margin-left: 70px;
	}

@media (max-width: 1020px){

	.page-footer .socials{
		width: 100%;
		margin-left: 0;
		margin-bottom: 25px;
	}

}

		.page-footer .socials>*{
			position: relative;
			font-size: 32px;
			width: 1em;
			height: 1em;
			border-radius: 1em;
			border: 2px solid rgba(0,0,0,.1);
			opacity: 1;
			-webkit-transition: opacity 200ms ease;
			-moz-transition: opacity 200ms ease;
			-ms-transition: opacity 200ms ease;
			transition: opacity 200ms ease;
			will-change: opacity;
			box-sizing: border-box;
		}

		.page-footer .socials>*:hover{
			opacity: .75;
		}

		.page-footer .socials>*+*{
			margin-left: 10px;
		}

			.page-footer .socials>*:before{
				content: '';
				display: block;
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				opacity: .25;
			}

			.page-footer .socials>*.instagram:before{
				background: url(/assets/img/instagram.svg) no-repeat center center;
			}

			.page-footer .socials>*.facebook:before{
				background: url(/assets/img/facebook.svg) no-repeat center center;
			}

			.page-footer .socials>*.flamp:before{
				background: url(/assets/img/flamp.svg) no-repeat center center;
			}

			.page-footer .socials>*.vkontakte:before{
				background: url(/assets/img/vkontakte.svg) no-repeat center center;
			}

			.page-footer .socials>*.twitter:before{
				background: url(/assets/img/twitter.svg) no-repeat center center;
			}
	
	.page-footer .subscribe{
		display: flex;
		position: relative;
		top: -12px;
		flex-direction: row;
		justify-content: flex-end;
		align-items: center;
		flex-grow: 1;
	}

@media (max-width: 1020px){

	.page-footer .subscribe{	
		justify-content: flex-start;
		top: 0;
	}

}

		.page-footer .subscribe>*{
			display: flex;
			position: relative;
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;
		}

			.page-footer .subscribe>*:before{
				content: 'ПОДПИСКА ОФОРМЛЕНА!';
				position: absolute;
				left: 0;
				bottom: 0;
				width: 100%;
				height: 35px;
				text-align: center;
				pointer-events: none;
				-webkit-transition: opacity 400ms ease;
				-moz-transition: opacity 400ms ease;
				-ms-transition: opacity 400ms ease;
				transition: opacity 400ms ease;
				will-change: opacity;
				opacity: 0;
				line-height: 35px;
				letter-spacing: 1px;
				font-size: 18px;
				z-index: 1;
			}

			.page-footer .subscribe.sent>*:before{
				opacity: 1;
			}

		@media (max-width: 1020px){

			.page-footer .subscribe>*:before{	
				text-align: left;
				bottom: 8px;
			}

		}

			.page-footer .subscribe .caption{
				font-size: 16px;
				line-height: 1em;
				white-space: nowrap;
				margin-bottom: 10px;
			}

		@media (max-width: 440px){
			
			.page-footer .subscribe .caption span{
				display: block;
			}

		}

			.page-footer .subscribe .form{
				display: flex;
				position: relative;
				flex-direction: row;
				justify-content: flex-start;
				align-items: center;
			}

				.page-footer .subscribe .form>*{
					height: 35px;
					opacity: 1;
					-webkit-transition: opacity 400ms ease;
					-moz-transition: opacity 400ms ease;
					-ms-transition: opacity 400ms ease;
					transition: opacity 400ms ease;
					will-change: opacity;
				}

				.page-footer .subscribe.sent .form>*{
					opacity: 0;
					pointer-events: none;
				}


				.page-footer .subscribe .email{
					line-height: 35px;
					border-color: #e6e6e6;
					color: #000;
				}

				.page-footer .subscribe .email.failed{
					border-color: rgba(255,5,0,1);
				}

				.page-footer .subscribe .follow{
					width: 53px;
					background: url(/assets/img/follow.svg) no-repeat left center/contain;
					-webkit-transition: opacity 200ms ease;
					-moz-transition: opacity 200ms ease;
					-ms-transition: opacity 200ms ease;
					transition: opacity 200ms ease;
					cursor: pointer;
					will-change: opacity;
					margin-left: 10px;
				}

				.page-footer .subscribe .follow:hover{
					opacity: .75;
				}

	.page-footer .author{
		display: flex;
		position: relative;
		flex-direction: row;
		align-items: center;
		justify-content: flex-end;
		margin-left: 20px;
	}

@media (max-width: 1020px){

	.page-footer .author{
		right: 2px;
		margin-left: 0;
		align-self: flex-end;
	}

}

@media (max-width: 640px){

	.page-footer .author{
		align-self: flex-start;
		margin-top: 10px;
	}

}

		.page-footer .author>*{
			position: relative;
			width: 50px;
			height: 25px;
			opacity: 1;
			-webkit-transition: opacity 200ms ease;
			-moz-transition: opacity 200ms ease;
			-ms-transition: opacity 200ms ease;
			transition: opacity 200ms ease;
			will-change: opacity;
		}

		.page-footer .author>*:hover{
			opacity: .75;
		}

			.page-footer .author>*:before{
				content: '';
				display: block;
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				opacity: .25;
				background: url(/assets/img/author.svg) no-repeat center center/contain;
			}



/*************************************************************************

                    P O P U P   N A V I G A T I O N

*************************************************************************/


.popup-nav{
	display: none;
	position: fixed;
	flex-direction: column;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 1;
	opacity: 0;
	-webkit-transition: opacity 200ms ease;
	-moz-transition: opacity 200ms ease;
	-ms-transition: opacity 200ms ease;
	transition: opacity 200ms ease;
	will-change: opacity;
	pointer-events: none;
}

@media (max-width: 1250px){

.popup-nav{
	display: flex;
}

}

.popup-nav.expanded{
	opacity: 1;
	pointer-events: initial;
}

	.popup-nav .page-header{
		position: relative;
	}

		.popup-nav .page-header:after{
			content: '';
			display: block;
			position: absolute;
			width: 100%;
			height: 0;
			bottom: 0;
			left: 0;
			border-bottom: 1px solid #ebebeb;
		}

		.popup-nav .page-header .lang{
			color: #000;
		}

.popup-nav .nav{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	font-family: GoodHeadlineProCondNews;
	margin-top: 25px;
}

	.popup-nav .nav>*{
		-webkit-transition: color 200ms ease;
		-moz-transition: color 200ms ease;
		-ms-transition: color 200ms ease;
		transition: color 200ms ease;
		will-change: color;
		font-size: 36px;
		line-height: 50px;
	}

	.popup-nav .nav>*:hover,
	.popup-nav .nav>*.active{
		color: #67b7b7;
	}

	.popup-nav .nav>*+*{}



/*************************************************************************

                     S U B S C R I B E   P O P U P

*************************************************************************/


.subscribe-popup{}

	.subscribe-popup .text{
		font-size: 16px;
		line-height: 1.5em;
		margin-bottom: 15px;
	}

	.lang-ru .subscribe-popup .field.time:before{
		content: 'ЭЛЕКТРОННАЯ ПОЧТА';
	}

	.lang-en .subscribe-popup .field.time:before{
		content: 'E-MAIL';
	}


