@font-face {
	font-family: 'Prata';
	src: url('../fonts/hinted-Prata-Regular.eot');
	src: url('../fonts/hinted-Prata-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/hinted-Prata-Regular.woff') format('woff'),
		url('../fonts/hinted-Prata-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'PTSans';
	src: url('../fonts/hinted-PTSans-Regular.eot');
	src: url('../fonts/hinted-PTSans-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/hinted-PTSans-Regular.woff') format('woff'),
		url('../fonts/hinted-PTSans-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'CormorantGaramond';
	src: url('../fonts/hinted-CormorantGaramond-Medium.eot');
	src: url('../fonts/hinted-CormorantGaramond-Medium.eot?#iefix') format('embedded-opentype'),
		url('../fonts/hinted-CormorantGaramond-Medium.woff') format('woff'),
		url('../fonts/hinted-CormorantGaramond-Medium.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
}

::selection {
	background: rgba(255, 255, 255, 1);
	color: #000000;
}
::-moz-selection {
	background: rgba(255, 255, 255, 1);
	color: #000000;
}
.bright ::selection {
	background: rgba(0, 0, 0, 1);
	color: #ffffff;
}
.bright ::-moz-selection {
	background: rgba(0, 0, 0, 1);
	color: #ffffff;
}

* {
	margin: 0;
	padding: 0;
	border: none;
}
/*.no-touchevents.cssfilters * {
	cursor: none !important;
}*/
.no-cursor * {
	cursor: none !important;
}

li {
	list-style: none outside none;
}
a {
	text-decoration: none;
}
html, body {
	border: 0 none;
}
html {
	height: 100%;
	-webkit-text-size-adjust: none;
}
body {
	font-size: 18px;
	color: #eeeff2;
	background: #131316;
	height: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: transparent;
	font-family: 'CormorantGaramond', serif;
}
body.prevent-scroll {
	overflow: hidden;
}


.bright {
	color: #525258;
}
body.prevent-scroll {
	overflow: hidden;
}

input {
	-webkit-appearance: none;
}
input[type='number'] {
    -moz-appearance:textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s; /*dirty hack*/
    -webkit-text-fill-color: #131316 !important;
}

button {
	display: inline-block;
	background: none;
	border: none;
	list-style: none outside none;
	margin: 0;
	padding: 0;
/*	cursor: pointer;*/
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
section {
	position: relative;
}
section .wrapper {
	position: relative;
	z-index: 1;
}
section .bg .wrapper {
	position: relative;
	height: 100%;
}

.page-wrapper {
	display: block;
	position: relative;
	overflow: hidden;
	min-width: 320px;
}
.wrapper {
	position: relative;
	width: calc(100% - 50px);
	max-width: 1400px;
	margin: 0 auto;
}
@media screen and (min-width: 1000px) {
	.wrapper {
		position: relative;
		width: calc(100% - 170px - 85px);
		left: 42px;
/*		outline: 1px solid;*/
	}
}

h1,
.full-text-slider .hd {
	font-size: 34px;
	line-height: 1.3;
	letter-spacing: 0.05em;
	font-weight: 400;
	font-family: 'Prata', serif;
	color: #ffffff;
}
.bright h1 {
	color: #131316;
}
@media screen and (min-width: 1000px) {
	h1,
	.full-text-slider .hd {
		font-size: 46px;
	}
}
h3,
h6 {
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	line-height: 2;
	font-weight: 400;
	color: #89898e;
}
p {
	line-height: 1.95;
	margin-bottom: 35px;
	letter-spacing: 0.015em;
}

header .header-top {
	position: fixed;
	left: 0;
	right: 0;
	height: 0;
	z-index: 150;
}
.title {
	position: absolute;
	left: 0;
	top: 70px;
}
@media screen and (min-width: 1000px) {
	.title {
		top: 75px;
	}
}

.logo {
	position: fixed;
	left: 7px;
	top: 6px;
	width: 42px;
	height: 46px;
/*	background: url(../images/logo.svg);*/
	z-index: 150;
}
.logo path {
	fill: #a0a0a4;
	fill-rule: evenodd;
	transition: all 0.4s;
}
.no-touchevents .logo:not(.active):hover path {
	fill: #ed1c24;
}
@media screen and (min-width: 640px) {
	.logo {
		left: 25px;
	}
}
@media screen and (min-width: 1000px) {
	.logo {
		left: calc(85px - 21px);
		top: 60px;
	}
}
.logo.active {
/*	cursor: default;*/
	pointer-events: none;
}

.menu-btn,
.close-button {
	position: fixed;
	width: 44px;
	height: 44px;
	left: calc(50% - 22px);
	top: 11px;
	z-index: 100;
}
@media screen and (min-width: 1000px) {
	.menu-btn {
		left: calc(85px - 22px);
		top: calc(50% - 22px);
	}
	.close-button {
		top: 64px;
	}
}
.menu-btn .bar,
.close-button .bar {
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 30px;
	height: 2px;
	background: #a0a0a4;
}
.menu-btn .bar.b1 {
	top: 11px;
}
.menu-btn .bar.b2,
.menu-btn .bar.b4,
.menu-btn .bar.b5,
.close-button .bar.b1,
.close-button .bar.b2 {
	top: 21px;
}
.menu-btn .bar.b3 {
	top: 31px;
}
.close-button .bar.b1 {
	transform: rotate(45deg);
}
.close-button .bar.b2 {
	transform: rotate(-45deg);
}
.menu-btn .bar.b4 {
	transform: rotate(45deg) scaleX(0.3);
}
.menu-btn .bar.b5 {
	transform: rotate(-45deg) scaleX(0.3);
}
.menu-btn .b1,
.menu-btn .b2,
.menu-btn .b3 {
	transition: all 1.2s;
}
.menu-btn .bar.b4,
.menu-btn .bar.b5 {
	opacity: 0;
	transition: all 0.2s;
}
.no-touchevents .menu-btn:hover .b1,
.no-touchevents .menu-btn:hover .b2,
.no-touchevents .menu-btn:hover .b3 {
	transform: scaleX(0.9);
}
.menu-btn.active .bar.b1,
.menu-btn.active .bar.b2,
.menu-btn.active .bar.b3 {
	transition: all 0.3s;
	opacity: 0;
}
.menu-btn.active .bar.b4,
.menu-btn.active .bar.b5 {
	transition: all 0.4s ease 0.1s;
	opacity: 1;
}
.menu-btn.active .bar.b4 {
	transform: scaleX(1) rotate(45deg);
}
.menu-btn.active .bar.b5 {
	transform: scaleX(1) rotate(-45deg);
}

.audio-btn {
	position: fixed;
	left: calc(35px - 13px);
	bottom: 67px;
	width: 24px;
	height: 40px;
	z-index: 250;
	opacity: 0;
	transition: opacity 1.2s;
	transform: translateZ(0px);
}
@media screen and (min-width: 1000px) {
	.audio-btn {
		left: calc(85px - 13px);
	}
}
.mobile .audio-btn {
	display: none;
}
.page-wrapper.page-load-ready .audio-btn {
	opacity: 1;
}
.audio-btn .bar {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 2px;
	height: 10px;
	background: #6d6d6d;
}
.audio-btn .bar.b1  {
	left: 0;
}
.audio-btn .bar.b2 {
	left: 7px;
}
.audio-btn .bar.b3 {
	left: 14px;
}
.audio-btn .bar.b4 {
	left: 21px;
}
.audio-btn .bar.b5 {
	left: 28px;
}

.full-height {
	height: 100vh;
}
.full-min-height {
	min-height: 100vh;
	box-sizing: border-box;
}
.center-inner {
	display: flex;
	align-items: center;
}

.cursor-interactive,
button {
	user-select: none;
}

.l {
	width: 100%;
}
.r {
	width: 100%;
}
@media screen and (min-width: 640px) {
	.l {
		float: left;
		width: calc(50% - 20px);
	}
	.r {
		float: right;
		width: calc(50% + 20px);
	}
}
@media screen and (min-width: 1000px) {
	.l {
		/*42 = 85/2 (from margin) + 10 = 20/2 (from grid) === 50% - 52px*/
		width: calc(50% - 52px);
	}
	.r {
		/*100% - l + 10px*/
		width: calc(50% + 32px);
	}
}
.tx p {
	margin-right: 0%;
}
@media screen and (min-width: 640px) {
	.tx p {
		margin-right: 10%;
	}
	.tx h1 {
		margin-right: 10%;
	}
}
@media screen and (min-width: 1000px) {
	.tx p {
		margin-right: 25%;
	}
	.tx h1 {
		margin-right: 25%;
	}
}

.tx a {
	color: #ffffff;
}
.tx a:hover {
	color: #ed1c24;
}

.tx {
	display: block;
}
.tx .word {
	white-space: nowrap;
	display: inline-block;
	transition: all 1.2s;
}
.tx .word.hidden {
	opacity: 0;
	transform: translateY(25px);
}

.csstransitions .s-t {
	opacity: 0;
}
.csstransitions .s-t.up {
	transform: translateY(25px);
}
.csstransitions .s-t.visible {
	transition: all 1.2s;
	opacity: 1;
	transform: translateY(0px);
}


.text-logo {
	width: 190px;
	height: 32px;
	background: url(../images/text-logo.svg);
	background-size: 100%;
	background-repeat: no-repeat;
}
.bright .text-logo {
	background: url(../images/text-logo.svg);
	background-size: 100%;
	background-repeat: no-repeat;
}
@media screen and (min-width: 1000px) {
	.text-logo {
		width: 250px;
		height: 45px;
	}
}

.menu-popup .wrapper {
	height: calc(100% - 170px);
}
.menu-popup nav {
	text-align: center;
}
@media screen and (min-height: 500px) {
	.menu-popup nav {
		display: flex;
		height: calc(100vh - 210px);
		justify-content: center;
		align-items: center;
		flex-flow: column;
	}
}
@media screen and (min-width: 1000px) {
	.menu-popup .wrapper {
		height: 100%;
	}
}
.menu-popup nav a,
.menu-popup nav popup-toggle {
	display: inline-block;
	margin: 8px 0;
	color: #eeeff2;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	line-height: 2;
	letter-spacing: 0.175em;
	text-transform: uppercase;
	transition: all 0.6s;
}
.no-touchevents .menu-popup nav a:hover,
.no-touchevents .menu-popup nav popup-toggle:hover {
	color: #ed1c24;
	transition: all 0.3s;
}
.menu-popup nav a.active {
	color: #ed1c24;
/*	cursor: default;*/
}
@media screen and (min-width: 1000px) {
	.menu-popup nav {
		height: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-flow: row;
		text-align: left;
	}
}
.menu-popup .cnt {
	position: relative;
	padding-top: 21px;
	margin-top: 0;
	margin-bottom: 21px;
}
.menu-popup .cnt a {
	margin: 12px 0;
	text-transform: none;
	font-size: 14px;
	color: #86868a;
	line-height: 1.2;
	letter-spacing: 0.03em;
	border-bottom: 1px solid #565659;
}
.menu-popup .cnt a:hover {
	border-bottom: 1px solid #ed1c24;
}
.menu-popup .cnt a.tel {
	border-bottom: none;
}

@media screen and (min-width: 1000px) {
	.menu-popup .cnt {
		position: relative;
		padding-top: 41px;
		margin-bottom: 0;
	}
	.menu-popup .cnt:before {
		content: "";
		left: 0;
		top: 10px;
		position: absolute;
		width: 15px;
		height: 2px;
		background: #ed1c24;
	}
}

.menu-popup .text-logo {
	margin: 80px auto 30px;
	display: block;
}
@media screen and (min-width: 1000px) {
	.menu-popup .text-logo {
		position: absolute;
		margin: 0;
		left: 0;
		right: auto;
		top: 67px;
	}
}
.menu-popup .cr {
	margin-top: 20px;
	font-family: 'PTSans', sans-serif;
	color: #626368;
	font-size: 14px;
	text-align: center;
	display: none;
}
.menu-popup .dev {
	position: absolute;
	bottom: 80px;
	right: 0;
	color: #626368;
	display: none;
}
.menu-popup .lang {
	position: absolute;
	right: 0px;
	top: -60px;
}
.menu-popup .lang a {
	text-transform: uppercase;
	color: #eeeff2;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	line-height: 2;
	letter-spacing: 0.175em;
	text-transform: uppercase;
	transition: all 0.6s;
}
.menu-popup .lang a:hover {
	color: #ed1c24;
}
@media screen and (min-height: 500px) {
	.menu-popup .cr {
		display: block;
	}
}
@media screen and (min-width: 1000px) {
	.menu-popup .lang {
		right: 0px;
		top: 80px;
	}
	.menu-popup .cr {
		margin-top: 0;
		position: absolute;
		left: 0;
		right: auto;
		bottom: 80px;
	}
	.menu-popup .dev {
		display: block;
	}
}

.menu-popup nav .item,
.menu-popup nav .cnt,
.menu-popup .text-logo,
.menu-popup .cr,
.menu-popup .dev,
.menu-popup .lang {
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.3s, transform 0s ease 0.3s;
}
.menu-popup .lang {
	transform: translateY(0px);
}
.menu-popup.active nav .item,
.menu-popup.active nav .cnt,
.menu-popup.active .text-logo,
.menu-popup.active .cr,
.menu-popup.active .dev,
.menu-popup.active .lang {
	opacity: 1;
	transform: translateX(0);
	transition: all 0.6s;
}
.menu-popup.active .text-logo {
	transition-delay: 0.3s;
}
.menu-popup.active nav .item {
	transition-delay: 0.35s;
}
.menu-popup.active nav .cnt {
	transition-delay: 0.5s;
}
.menu-popup.active .cr,
.menu-popup.active .dev,
.menu-popup.active .lang {
	transition-delay: 0.65s;
}



@media screen and (min-width: 1000px) {
	.menu-popup nav .item,
	.menu-popup nav .cnt,
	.menu-popup .text-logo,
	.menu-popup .cr,
	.menu-popup .dev,
	.menu-popup .lang {
		opacity: 0;
		transform: translateX(15px);
		transition: opacity 0.3s, transform 0s ease 0.3;
	}
	.menu-popup.active nav .item,
	.menu-popup.active nav .cnt,
	.menu-popup.active .text-logo,
	.menu-popup.active .cr,
	.menu-popup.active .dev,
	.menu-popup.active .lang {
		opacity: 1;
		transform: translateX(0);
		transition: all 0.6s;
	}
	.menu-popup.active nav .item:nth-child(1) {
		transition-delay: 0.2s;
	}
	.menu-popup.active nav .item:nth-child(2) {
		transition-delay: 0.35s;
	}
	.menu-popup.active nav .item:nth-child(3) {
		transition-delay: 0.5s;
	}
	.menu-popup.active nav .item:nth-child(4) {
		transition-delay: 0.65s;
	}
	.menu-popup.active nav .cnt {
		transition-delay: 0.7s;
	}
	.menu-popup.active .text-logo {
		transition-delay: 0.2s;
	}
	.menu-popup.active .cr {
		transition-delay: 0.2s;
	}
	.menu-popup.active .dev,
	.menu-popup.active .lang {
		transition-delay: 0.7s;
	}
}



.video-popup {}
.video-popup video-component,
.video-popup video {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
.video-popup video-component {
	opacity: 0;
	transition: opacity 0.4s;
}
.video-popup.active video-component {
	opacity: 1;
	transition: opacity 0.4s ease 0.9s;
}

.slider-popup .close-button {
	display: none;
}
.slider-popup .controls {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 1;
	display: none;
}
.slider-popup .controls .l,
.slider-popup .controls .r {
	position: absolute;
	width: 50%;
	height: 100%;
	top: 0;
}
.slider-popup .controls .l {
	left: 0;
}
.slider-popup .controls .r {
	right: 0;
}
@media screen and (min-width: 1000px) {
	.slider-popup .controls {
		display: block;
	}
	.slider-popup {
		z-index: 110;
	}
	.slider-popup .close-button {
		display: block;
	}
}

.slider-popup .slider {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 0;
}
.slider-popup:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 200px;
	left: 0;
	top: 0;
	background: linear-gradient(to bottom, rgba(38, 38, 38, 1) 0%, rgba(0, 0, 0, 0) 100%);
	z-index: 2;
	opacity: 0;
	transition: opacity 0.6s ease 0s;
}
.slider-popup.active:after {
	opacity: 1;
	transition: opacity 0.6s ease 0.8s;
}


.slider-popup .slider {
	opacity: 0;
	transition: opacity 0.4s;
}
.slider-popup.active .slider {
	opacity: 1;
	transition: opacity 0.5s ease 0.7s;
}
.slider-popup .close-button {
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.5s, transform 0s ease 0.5s;
}
.slider-popup.active .close-button {
	opacity: 1;
	transform: translateY(0px);
	transition: all 0.5s ease 0.9s;
}

.clear {
	clear: both;
}


.poly-button {
	display: block;
	position: relative;
	font-size: 12px;
	font-family: 'PTSans', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	color: #d7d7d7;
	height: 64px;
	padding: 0 25px;
	line-height: 64px;
	text-align: center;
	margin: 0 -8px;
	min-width: 100px;
}
.bright .poly-button {
	color: #28292c;
}
.poly-button span {
	display: inline-block;
	position: relative;
	z-index: 3;
}
.poly-button svg,
.arr svg {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	pointer-events: none;
/*	transition: all 0.2s cubic-bezier(0.65, 0.12, 0.25, 1);*/
}
.poly-button polyline,
.arr polyline {
	stroke-width: 1.5px;
	stroke: #eeeff2;
	fill: none;
	shape-rendering: auto;
}
.poly-button polyline.red,
.arr polyline.red {
	stroke: #ed1c24;
	position: relative;
	z-index: 1;
	/*fill: #131316;*/
}
.no-touchevents .poly-button:hover polyline.white {
	opacity: 0;
	transition: opacity 0.3s ease 0.6s;
}
.no-touchevents .arr:not(.inactive):hover polyline.white {
	opacity: 0;
	transition: opacity 0.3s ease 0.4s;
}
.bright .poly-button polyline,
.bright .arr polyline {
	stroke: #2d2e31;
}
.bright .poly-button polyline.red,
.bright .arr polyline.red  {
	/*fill: #ffffff;*/
	stroke: #ed1c24;
}

.preloader-start {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #ffffff;
}
.csstransitions .preloader-start {
	display: block;
	z-index: 200;
}
.preloader-start canvas {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 1;
}

.preloader-start .bg-net,
.preloader-start .bg-render {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-image: url(../images/main-net.jpg);
	background-size: cover;
	background-position: center;
}
.csstransitions .preloader-start .bg-net,
.csstransitions .preloader-start .bg-render {
	display: none;
}
.preloader-start .bg-render {
	background-image: url(../images/main-render.jpg);
}
.preloader-start .mask {
	display: none;
}
.preloader-start .wrapper {
	height: 100%;
	z-index: 3;
}
@media screen and (min-width: 1000px) {
	.preloader-start .wrapper.central {
		width: calc(100% - 170px);
		left: 0px;
	}
}
.preloader-start .preloader-button {
	position: absolute;
	width: 82px;
	height: 82px;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 45px;
	color: #28292c;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	text-align: center;
}
.preloader-start .preloader-button.disabled {
/*	cursor: default;*/
}
.preloader-start .preloader-button .v,
.preloader-start .preloader-button .h {
	position: absolute;
	width: 100%;
	left: 0;
	top: 50%;
	z-index: 1;
	text-align: center;
	transform: translateY(-50%);
}
.preloader-start .preloader-button .h {
	opacity: 0;
}
.preloader-start .preloader-button svg,
.preloader-start .preloader-button .svg {
	position: absolute;
	width: 82px;
	height: 82px;
	left: 0;
	top: 0;
}
.preloader-start .preloader-button svg {
	transition: all 0.3s, transform 0.3s;
	transform: rotate(-120deg);
}
.preloader-start .preloader-button svg path {
	stroke: #2d2e31;
	stroke-width: 2px;
	fill: none;
	fill-rule: evenodd;
	transition: all 0.3s, stroke 0.3s;
	stroke-dasharray: 0px 0px 258px 0px 0px;
}
.no-touchevents .preloader-start .preloader-button:hover svg {
	transition: all 0.3s, transform 0.45s;
	transform: rotate(-120deg) scale(1.08);
}
.no-touchevents .preloader-start .preloader-button:hover svg path {
	stroke: #ed1c24;
	transition: all 0.3s, stroke 0.45s;

}
.preloader-start .preloader-button.hold svg path {
	transition: all 1s, stroke 0.45s !important;
	stroke-dasharray: 0px 121px 18px 121px 0px;
}
.preloader-start .preloader-button .v,
.preloader-start .preloader-button .h {
	transition: opacity 0.2s;
}
.preloader-start .preloader-button.release .v {
	opacity: 0;
}
.preloader-start .preloader-button.release .h {
	opacity: 0;
}

.preloader-start .preloader-button {
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none;
}
.preloader-start.ready .preloader-button {
	opacity: 1;
	transform: translateY(0px);
	pointer-events: auto;
	transition: all 2s ease 2.4s;
}

.preloader-start .logo {
	position: absolute;
	width: 300px;
	height: 187px;
	left: 0;
	right: 0;
	top: 15%;
	margin: auto;
	background-size: 100%;
    background: url(../images/preloader-logo.gif) no-repeat center center / cover;
*/
}
.preloader-start .logo-text {
	position: absolute;
	width: 166px;
	height: 7px;
	left: -50px;
	right: -50px;
	top: calc(18% + 105px);
	margin: auto;
	background: url(../images/logo-text.svg);
	background-size: 100%;
}
@media screen and (min-width: 640px) {
	.preloader-start .logo-text {
		width: 166px;
		height: 8px;
	}
}
.preloader-start .logo {
	transition: all 0.4s ease-in 0s;
	transform: translateY(-50px);
	opacity: 0;
}
.preloader-start .logo-text {
	transition: all 0.4s ease-in 0s;
	transform: translateY(-30px);
	opacity: 0;
}
.preloader-start.ready .logo {
	transition: all 1s ease-out 0.5s;
	transform: translateY(0px);
	opacity: 1;
}
.preloader-start.ready .logo-text {
	transition: all 1s ease-out 0.3s;
	transform: translateY(0px);
	opacity: 1;
}
.preloader-start.ready.hold-cancel .logo {
	transition: all 0.5s ease-out 0s;
	transform: translateY(0px);
	opacity: 1;
}
.preloader-start.ready.hold-cancel .logo-text {
	transition: all 0.5s ease-out 0s;
	transform: translateY(0px);
	opacity: 1;
}
.preloader-start.hold .logo {
	transition: all 1.5s ease-in 0s;
	transform: translateY(-20px);
	opacity: 0;
}
.preloader-start.hold .logo-text {
	transition: all 2s ease-in 0s;
	transform: translateY(-10px);
	opacity: 0;
}

/*some pro responsive staff here*/
.preloader-start .mid {
	position: absolute;
	width: 100%;
	top: calc(50% - 15px);
	left: 0;
	transform: scale(0.45);
}
@media screen and (min-width: 640px) {
	.preloader-start .mid {
		transform: scale(0.9);
	}
}
@media screen and (min-width: 1000px) {
	.preloader-start .mid {
		transform: scale(1);
	}
}

.preloader-start .mid-text {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
}
.preloader-start .mid-text svg {
	position: absolute;
	left: -1000px;
	right: -1000px;
	margin: auto;
	height: 31px;
	backface-visibility: hidden;
}

@media (max-width: 991px) {
	.preloader-start .mid-text svg {
		height: 24px;
	}
}
.preloader-start .mid-text svg path {
	opacity: 0;
	fill: #3a3c45;
}
.preloader-footer {
	position: absolute;
	left: 0;
	bottom: 79px;
	width: 100%;
	z-index: 3;
	pointer-events: none;
	opacity: 0;
	transform: translateX(10px);
	display: none;
}
@media screen and (min-width: 1000px) {
	.preloader-footer {
		display: block;
	}	
}
.preloader-start.ready .preloader-footer {
	opacity: 1;
	transition: all 1.2s ease 2s;
	transform: translateX(0px);
}
.preloader-start.release-ready .preloader-footer {
	opacity: 0;
	transition: all 1.2s ease 0s;
	transform: translateX(10px);
}
.preloader-footer nav {
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	z-index: 1;
}
.preloader-footer nav .item {
	pointer-events: auto;
	display: inline-block;
	margin-right: 10px;
}
.preloader-footer nav a {
	display: inline-block;
	color: #28292c;
}
.no-touchevents .preloader-footer nav a:hover {
	color: #ed1c24;
}
.preloader-footer nav .soc {
	position: relative;
	top: 15px;
	margin-right: 0;
}
.preloader-footer nav .soc svg {
	fill: #9fa1a5;
	transition: all 0.2s;
}
.no-touchevents .preloader-footer nav .soc:hover svg {
	fill: #ed1c24;
}

.full-height {
	transition: height 0.6s;
}

.home {
	position: relative;
	overflow: hidden;
	background: #131316;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.home webgl-img {
	background: #131316;
	transform: translateZ(0px);
}
.home .bg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
}
.home .bg:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 3;
	background: #131316;
	opacity: 0.3;
}
.home .bg:after {
	content: "";
	position: absolute;
	width: 400px;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 3;
	background: linear-gradient(to right, rgba(19,18,22,1) 0%, rgba(19,18,22,0) 100%);
	opacity: 0.6;
}

.home .bg.about-bg:before,
.home .bg.about-bg:after,
.home .bg.p404-bg:before,
.home .bg.p404-bg:after {
	content: none;
}
.home .text {
	position: relative;
	width: calc(50% - 52px);
	z-index: 2;
}
/*.home h3,
.contacts h3 {
	position: absolute;
	left: 0;
	top: 70px;
	z-index: 3;
}*/
.home .hd {
	position: relative;
	z-index: 2;
	pointer-events: none;
}
.home .tx {
	width: 100%;
	display: block;
	position: relative;
}

.home .n {
	position: absolute;
	bottom: -40px;
	color: #ed1c24;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	z-index: 1;
}
@media screen and (min-width: 1000px) {
/*	.home h3 {
		top: 75px;
	}*/
	.home .n {
		bottom: -70px;
	}
}

.home scroll-indicator {
	position: absolute;
	width: 1px;
	height: 50px;
	left: 0;
	bottom: 0;
	display: none;
	z-index: 1;
}
.home scroll-indicator .line {
	position: absolute;
	width: 1px;
	top: 0;
	bottom: 0;
	left: 0;
	background: #6a6a6e;
}
.home scroll-indicator .bar {
	position: absolute;
	width: 2px;
	bottom: 27px;
	top: 0px;
	background: #ed1c24;
}

@media screen and (min-width: 1000px) {
	.home scroll-indicator {
		display: block;
	}
}

.home .big-logo {
	position: absolute;
	width: 343px;
	height: 385px;
	right: -53%;
	top: 0;
	bottom: 0px;
	margin: auto;
	background: url(../images/logo-big.svg);
	background-size: 100%;
	background-repeat: no-repeat;
}
.home .p404-img {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
@media screen and (min-width: 1000px) {
	
}
@media screen and (min-width: 640px) {
	.home .big-logo {
		width: 401px;
		height: 449px;
		left: auto;
		right: 9%;
		top: 0;
		bottom: 30px;
	}
}
.csstransitions .home .big-logo {
	opacity: 0;
}
.csstransitions .home .big-logo.visible {
	opacity: 1;
	transition: opacity 1.2s;
}

.home .look-btn {
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 87px;
	width: 145px;
	text-align: center;
	z-index: 3;
}
@media screen and (min-width: 1000px) {
	.home .look-btn {
		bottom: 57px;
	}
}

.home .poly-btn {
	min-width: 74px;
}

.home .slider-number {
	position: absolute;
	right: 0;
	top: 18px;
}
@media screen and (min-width: 1000px) {
	.home .slider-number {
		top: 74px;
	}
}

text-slider .data,
.text-slider .data,
paragraph-slider .data {
	display: none;
}
text-slider .word,
.text-slider .word,
paragraph-slider .word {
	white-space: nowrap;
}

main-slider {
	position: relative;
	display: block;
	z-index: 1;
	transform: rotate(0.0001deg);
/*	cursor: move;*/
}
main-slider .canvas-wrapper {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #131316;
}
main-slider .mask {
	display: none;
}
main-slider canvas {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
main-slider .slides-wrapper {
	position: absolute;
	left: -1000px;
	right: -1000px;
	min-width: 1600px;
	width: 100%;
	margin: auto;
	top: 80px;
	bottom: 160px;
}
.webgl main-slider .slides-wrapper {
	display: none;
}
main-slider .wrapper {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	pointer-events: none;
}
main-slider .slide {
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	margin: auto;
/*	transition: transform 0.6s;*/
}
main-slider img {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

projects-slider canvas {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
projects-slider .wrapper {
	pointer-events: none;
}

slider-previews {
	position: absolute;
	z-index: 2;
	bottom: 107px;
	left: 0;
	width: 100%;
	pointer-events: none;
}
@media screen and (min-width: 1000px) {
	slider-previews {
		bottom: 77px;
	}
}
slider-previews .item {
	pointer-events: auto;
}
slider-previews .wrapper {
	height: 25px;
}
slider-previews .previews-left,
slider-previews .previews-right {
	overflow: hidden;
	position: absolute;
	height: 100%;
	min-width: 310px;
}
slider-previews .previews-left {
	right: calc(50% + 75px);
	width: calc(50% - 75px);
}
slider-previews .previews-right {
	left: calc(50% + 75px);
	width: calc(50% - 75px);
}
@media screen and (min-width: 1000px) {
	slider-previews .previews-left {
		right: calc(50% + 132px);
		width: calc(50% - 132px);
	}
	slider-previews .previews-right {
		left: calc(50% + 48px);
		width: calc(50% + 42px - 90px);
	}
}
slider-previews .previews-left .previews-wrapper {
	display: inline-block;
	white-space: nowrap;
}
slider-previews .previews-right .previews-wrapper {
	display: inline-block;
	white-space: nowrap;
}
slider-previews .item {
	display: inline-block;
	position: relative;
	padding-right: 19px;
	/*margin: 0 55px 0 67px;*/
	font-size: 12px;
	font-family: 'PTSans', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	line-height: 2;
	color: #858589;
/*	cursor: pointer;*/
}
slider-previews .item .ln {
	position: absolute;
	top: 12px;
	right: calc(100% + 10px);
	width: 95px;
	height: 1px;
	background: #424246;
	pointer-events: none;
}
/*slider-previews .item:before {
	content: "";
	position: absolute;
	top: 12px;
	right: calc(100% + 10px);
	width: 95px;
	height: 1px;
	background: #424246;
}*/
/*slider-previews .item:first-child:before {
	content: none;
}*/
slider-previews .item:after {
	content: "";
	position: absolute;
	top: 10px;
	right: 6px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #eeeff2;
}
slider-previews .item {
	transition: color 0.3s;
}
.no-touchevents slider-previews .item:hover {
	color: #ed1c24;
}

.csstransitions .home .look-btn,
.csstransitions slider-previews {
	opacity: 0;
	transform: translateY(10px);
}
.csstransitions slider-previews {
	transform: translateY(5px);
}
.home .look-btn.visible {
	transition: all 0.5s;
	opacity: 1;
	transform: translateY(0);
}
.home .look-btn.visible,
.csstransitions slider-previews.visible {
	transition: all 0.5s ease 1.5s;
	opacity: 1;
	transform: translateY(0);
}
.csstransitions slider-previews.visible {
	transition: all 0.5s ease 1.8s;
}

hover-parallax {
	display: block;
	transform: translateZ(0px);
}
/*hover-parallax .p-h-item {
	will-change: transform;
}
*/
.make {
	padding-top: 78px;
	padding-bottom: 120px;
	color: #9c9c9f;
}
.make h1 {
	margin-bottom: 25px;
	color: #eeeff2;
}
/*.make .l {
	padding-top: 300px;
}
.make .r {
	padding-top: 308px;
}*/
@media screen and (min-width: 640px) {
	.make {
		padding-bottom: 350px;
		padding-top: 100px;
	}
	.make .r {
		padding-top: 8px;
	}
}
@media screen and (min-width: 1000px) {
	.make {
		padding-top: 300px;
	}
	.make .r {
		padding-top: 22px;
	}
}

.office {
	background: #ffffff;
	padding-bottom: 55px;
}
@media screen and (min-width: 640px) {
	.office {
		padding-bottom: 150px;
	}
}
.office .tp {
	position: relative;
	margin-bottom: 72px;
	top: -105px;
	margin-bottom: calc(-87px + 30px);
}
@media screen and (min-width: 640px) {
	.office .tp {
		top: -135px;
		margin-bottom: calc(-117px + 72px);
	}
}
@media screen and (min-width: 1000px) {
	.office .tp {
		top: -175px;
		margin-bottom: calc(-157px + 72px);
	}
}

.note {
	display: block;
	position: relative;
	color: #626267;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	line-height: 2;
	width: 175px;
}
.note .word {
	white-space: nowrap;
}
.bright .note {
	color: #75757a;
}
.note:before {
	content: "";
	position: absolute;
	top: -25px;
	width: 35px;
	height: 2px;
	background: #ed1c24;
}
.s-t-custom.note:before {
	transform-origin: 0 0;
	transform: scaleX(0);
}
.s-t-custom.note.visible:before {
	transition: transform 0.9s;
	transform: scaleX(1);
}
.note.note-link:before {
	content: none;
}
.note.note-link .arrow {
    position: absolute;
    top: -25px;
    left: 0;
    transition: all 0.3s;
}
/*.no-touchevents .note.note-link:hover .arrow {
	width: 0px;
	transform: translateX(20px);
}*/
.no-touchevents .note.note-link {
	transition: color 0.3s;
}
.no-touchevents .note.note-link:hover {
	color: #ed1c24;
}
.no-touchevents .bright .note.note-link:hover {
	color: #ed1c24;
}
.note .nt {
	margin-top: 25px;
	color: #ed1c24;
}


@media screen and (min-width: 640px) {
	.office .note {
		position: absolute;
		bottom: -8px;
		left: 0;
	}
}
@media screen and (min-width: 1000px) {
	.office .note {
		left: 105px;
	}
}
.office .img {
	position: relative;
	margin-right: -25px;
	width: auto;
	margin-bottom: 55px;
}
@media screen and (min-width: 640px) {
	.office .img {
		margin-right: 0;
		margin-left: calc(50px + 16.6%);
	}
}
@media screen and (min-width: 1000px) {
	.office .img {
		margin-left: calc(125px + 16.6%);
	}
}

.office img {
	display: block;
	width: 100%;
}

webgl-img,
basic-img {
	position: relative;
	display: block;
	overflow: hidden;
	transform: translateZ(0px);
}
webgl-img img.src,
basic-img img.src {
	display: block;
}
webgl-img div.src,
basic-img div.src {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-size: cover;
	background-position: center;
}
webgl-img .mask,
basic-img .mask {
	display: none;
}
/*.webgl webgl-img img {
	visibility: hidden;
}*/
webgl-img canvas {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.projects {
	padding-top: 50px;
	padding-bottom: 50px;
}
@media screen and (min-width: 1000px) {
	.projects {
		padding-top: 130px;
		padding-bottom: 130px;
	}
}
.projects .wrapper {
	position: relative;
	z-index: 2;
	pointer-events: none;
}
/*.projects .line-controls {
	pointer-events: auto;
}*/

.projects .line-controls {
	display: block;
	padding-top: 60px;
	padding-bottom: 60px;
	float: left;
}
.projects .ln {
	position: relative;
	display: inline-block;
	padding-left: 40px;
	padding-top: 18px;
	padding-bottom: 32px;
	padding-right: 50px;
	font-size: 18px;
	letter-spacing: 0.025em;
	font-family: 'Prata', sans-serif;
/*	cursor: pointer;*/
	color: #eeeff2;
	line-height: 1.3;
	pointer-events: auto;
}
@media screen and (min-width: 1000px) {
	.projects .line-controls {
		padding: 0;
		margin-top: 100px;
		margin-bottom: 110px;
		height: 352px;
	}
	.projects .ln {
		padding-left: 95px;
		font-size: 21px;
	}
	.projects .ln.line-active {
		font-size: 30px;
		padding-bottom: 133px;
		margin-bottom: 0px;
		letter-spacing: 0.05em;
	}
}
.no-touchevents .projects .ln {
	transition: color 0.6s;
}
.no-touchevents .projects .ln:hover,
.no-touchevents .projects .ln.hover {
	color: #ed1c24;
	transition: color 0.3s;
}
.projects .ln .t {
	transform-origin: 0 50%;
}

.projects .ln .arrow {
	position: absolute;
	left: 0;
	top: 33px;
	width: 0;
}
.projects .ln .underline {
	position: absolute;
	width: 100%;
	height: 2px;
	background: #ed1c24;
	bottom: 15px;
	left: 0;
	transform-origin: 0 50%;
	transform: scaleX(0);
	transition: transform 0.2s;
}
@media screen and (min-width: 1000px) {
	.projects .ln .arrow {
		transform: translateX(20px);
		background: #b9b9ba;
		transition: all 0.3s;
	}
	.projects .ln .arrow:before,
	.projects .ln .arrow:after {
		background: #b9b9ba;
		transition: all 0.3s;
	}
	.projects .ln.line-active .arrow {
/*		width: 32px;
		background: #ed1c24;
		width: 0;
		transform: translateX(20px);*/
	}
	.projects .ln:hover .arrow,
	.projects .ln.hover .arrow {
		background: #ed1c24;
	}

	.no-touchevents .projects .ln:hover .arrow:before,
	.no-touchevents .projects .ln:hover .arrow:after,
	.no-touchevents .projects .ln.hover .arrow:before,
	.no-touchevents .projects .ln.hover .arrow:after  {
		background: #ed1c24;
	}
	.projects .ln .underline {
		/*width: 155%;*/
		width: 115%;
		bottom: 60px;
	}
	.no-touchevents .projects .ln:hover .arrow,
	.no-touchevents .projects .ln.hover .arrow {
		width: 32px;
		transform: translateX(0px);
	}
	.projects .ln.line-active .underline {
		transform: scaleX(1);
		transition: transform 0.3s ease 0.2s;
	}
}

.csstransitions .projects .ln .underline {
	transform-origin: 0 0;
	transform: scaleX(0);
}
.csstransitions .projects .visible .ln .underline {
	transition: all 1.2s;
	transform: scaleX(1);
}
.csstransitions .projects .ln .arrow {
	left: -10px;
	opacity: 0;
}
.csstransitions .projects .visible .ln .arrow {
	left: 0;
	opacity: 1;
	transition: all 0.3s, left 1.2s;
}

.projects .slider {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	max-width: 1000px;
}
.projects .slider {
	opacity: 0.75;
	transition: opacity 0.45s;
	transform: rotate(0.0001deg);
}
.projects .slider.hover {
	opacity: 1;
}
@media screen and (min-width: 1000px) {
	.projects .slider {
		top: 80px;
		bottom: 130px;
		width: 50%;
		left: 50%;
	}
}
.projects .slider .slide {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	background-size: cover;
	background-position: center;
}

.projects-display {
	position: absolute;
	right: 0;
	top: 9px;
	width: 100px;
	height: 45px;
}
@media screen and (min-width: 640px) {
	.projects-display {
		right: 115px;
		top: 9px;
	}
}
@media screen and (min-width: 1000px) {
	.projects-display {
		right: 115px;
		top: 65px;
	}
}
.projects-display:after {
	content: "";
	position: absolute;
	width: 1px;
	height: 30px;
	background: #424246;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}
.projects-display .item {
	position: absolute;
	top: 0;
	width: 45px;
	height: 45px;
}
.projects-display .item .b {
	position: absolute;
	background: #424246;
	margin: auto;
	transition: all 0.6s;
}
.projects-display .item.active .b,
.no-touchevents .projects-display .item:hover .b {
	background: #ed1c24;
	transition: all 0.3s;
}
.projects-display .item.sl {
	left: 0;
}
.projects-display .item.ls {
	right: 0;
}
.projects-display .item.ls .b {
	left: 0;
	right: 0;
	height: 2px;
	width: 23px;
}
.projects-display .item.ls .b1 {
	top: 15px;
}
.projects-display .item.ls .b2 {
	top: 22px;
}
.projects-display .item.ls .b3 {
	top: 29px;
}
.projects-display .item.sl .b1,
.projects-display .item.sl .b3 {
	width: 22px;
	height: 2px;
	left: 0;
	right: 0;
}
.projects-display .item.sl .b1 {
	top: 15px;
}
.projects-display .item.sl .b3 {
	top: 29px;
}
.projects-display .item.sl .b2,
.projects-display .item.sl .b4 {
	top: 0;
	bottom: 0;
	width: 2px;
	height: 15px;
}
.projects-display .item.sl .b2 {
	left: 11px;
}
.projects-display .item.sl .b4 {
	right: 11px;
}

.projects-overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	background: #131316;
	z-index: 4;
	opacity: 0;
	pointer-events: none;
	width: 0;
	transition: opacity 0.3s linear 0.3s, transform 0.2s ease 0.3s, width 0s ease 0.6s;
}
.projects-overlay.active {
	width: 100%;
	pointer-events: auto;
	opacity: 1;
	transition: opacity 0.3s linear 0s, transform 0.3s ease 0s, width 0s ease 0s;
}
.projects-overlay .wrapper {
	transform: translateX(10px);
	opacity: 0;
	transition: transform 0.3s ease 0s, opacity 0.3s ease 0s;
}
.projects-overlay.active .wrapper {
	transform: translateX(0px);
	opacity: 1;
	transition: transform 0.6s ease 0.3s, opacity 0.6s ease 0.3s;
}

.projects-overlay:before {
	content: "";
	position: fixed;
	width: 100%;
	height: 190px;
	left: 0;
	top: 0;
	z-index: 2;
	background: linear-gradient(to bottom, rgba(19,19,22,1) 0%, rgba(19,19,22,1) 75%, rgba(19,19,22,0) 100%);
	pointer-events: none;
}
.projects-overlay .wrapper {
	position: relative;
	padding-top: 200px;
	padding-bottom: 150px;
}
@media screen and (min-width: 640px) {
	.projects-overlay .wrapper {
		padding-top: calc(50vh - 21px);
		padding-bottom: calc(50vh - 21px);
	}
}
.projects-overlay .item {
	position: relative;
	margin-bottom: 50px;
	transition: opacity 0.2s;
}
@media screen and (min-width: 640px) {
	.projects-overlay .item {
		margin-bottom: 80px;
	}
}
.projects-overlay .item.hidden {
	opacity: 0;
}

.projects-overlay .item:last-child {
	margin-bottom: 0;
}
.projects-overlay .tx {
	line-height: 1.3;
	letter-spacing: 0.035em;
	font-weight: 400;
	font-family: 'Prata', serif;
	font-size: 24px;
	margin-right: 30%;
	color: #ffffff;
	transition: color 0.3s;
}
@media screen and (min-width: 640px) {
	.projects-overlay .tx {
		font-size: 31px;
	}
}
.no-touchevents .projects-overlay .tx:hover {
	color: #ed1c24;
}
.projects-overlay .nm {
	position: absolute;
	right: 0;
	top: 5px;
	color: #ffffff;
	font-family: 'Prata';
	font-size: 14px;
	line-height: 40px;
}


.team {
	position: relative;
}
.team .wrapper {
	min-height: 560px;
}
@media screen and (min-width: 1000px) {
	.team {
		margin-top: 90px;
	}
	.team .wrapper {
		min-height: 682px;
	}
}
.team .bg {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background: url(../images/Diane.jpg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}
.team-slider {
	position: absolute;
	height: 80%;
	left: -25px;
	right: -25px;
	bottom: 0;
}
.team-slider .slide .overlay {
	display: none !important;
}
@media screen and (min-width: 1000px) {
	.team-slider {
		height: 100%;
	}
}
.team-slider .slide {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-position: 50% 100%;
	background-size: cover;
	background-repeat: no-repeat;
}
.team-slider .slide:before {
	display: none;
}
@media screen and (min-width: 1000px) {
	.team-slider {
		left: -85px;
		right: -85px;
	}
	.team-slider .slide {
		background-size: contain;
	}
}

webgl-slider {
	position: relative;
	transform: translateZ(0px);
}
webgl-slider .mask {
	display: none;
}
webgl-slider canvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.team-inner {
	text-align: right;
	margin-right: 80px;
	padding-top: 100px;
	padding-bottom: 100px;
}
.team-inner .group {
	margin-bottom: 33px;
}
.team-inner .group:last-child {
	margin-bottom: 0;
}
.team-inner h6 {
	margin-bottom: 12px;
}
.team-inner .nm {
	font-size: 18px;
	margin-bottom: 11px;
/*	cursor: pointer;*/
	color: #757579;
	transition: all 1.2s, color 0.3s !important;
}

.no-touchevents .team-inner .nm:hover {
	color: #ed1c24;
}
.team-inner .nm.active,
.no-touchevents .team-inner .nm.active  {
	color: #eeeff2;
}

.team-overlay {
	position: relative;
	z-index: 1;
	pointer-events: none;
}
@media screen and (min-width: 1000px) {
	.team-overlay {
		pointer-events: auto;
	}
}
.team-overlay .arrows {
	position: absolute;
	left: 0;
	top: 75px;
	width: 32px;
	height: 77px;
	pointer-events: auto;
}
.team-overlay .arrows .arr-t {
	top: 0;
	left: 0;
}
.team-overlay .arrows .arr-b {
	bottom: 0;
	left: 0
}
.team-overlay .l {
	height: 100%;
}
.team-overlay .r {
	display: none;
	position: relative;
	justify-content: flex-end;
	align-items: center;
	height: 100%;
	min-height: 700px;
}
@media screen and (min-width: 1000px) {
	.team-overlay .r {
		display: flex;
	}
}

.team-overlay .tx {
	padding-top: 350px;
	padding-bottom: 50px;
	pointer-events: none;
}
@media screen and (min-width: 1000px) {
	.team-overlay .tx {
		padding-top: 0px;
		margin-top: 320px;
	}
}
.team-overlay .name {
	font-size: 28px;
	font-family: 'Prata', serif;
	letter-spacing: 0.03em;
	margin-bottom: 17px;
}
.team-overlay .job {
	padding-left: 55px;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	color: #6a6a6e;
	margin-bottom: 17px;
	line-height: 1.7;
}
@media screen and (min-width: 1000px) {
	.team-overlay .name {
		font-size: 30px;
		letter-spacing: 0.05em;
	}
	.team-overlay .job {
		padding-left: 105px;
	}
}

.arrow {
	position: relative;
	width: 35px;
	height: 2px;
	background: #ed1c24;
	transition: width 0.6s;
}
.arrow:before,
.arrow:after {
	content: "";
	right: -1px;
	top: 0;
	width: 6px;
	height: 2px;
	background: #ed1c24;
	position: absolute;
	transform-origin: 100% 50%;
}
.arrow:before {
	transform: rotate(-50deg);
}
.arrow:after {
	transform: rotate(50deg);
}
.arrow.small {
	width: 0;
}

.arr {
	position: absolute;
	width: 32px;
	height: 32px;
	transition: opacity 0.3s;
}
.arr.inactive {
	opacity: 0.5;
}
/*.no-touchevents .arr:hover {
	opacity: 1;
	transition: opacity 0.3s;
}*/
.arr .c {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
.arr .i {
	position: absolute;
	width: 2px;
	height: 2px;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.arr .c:before {
	content: "";
	position: absolute;
	width: 32px;
	height: 32px;
	background: url(../images/arr-polygon.svg);
	background-size: 100%;
	opacity: 0.6;
	transition: opacity 0.6s;
}
.no-touchevents .arr:hover .c:before {
	opacity: 1;
	transition: opacity 0.3s;
}
.arr-t .i {
	transform: rotate(-90deg);
}
.arr-b .i {
	transform: rotate(90deg);
}
.arr-l .i {
	transform: scaleX(-1);
}
.arr .i:before,
.arr .i:after {
	content: "";
	right: -1px;
	top: 0;
	width: 6px;
	height: 2px;
	background: #ffffff;
	position: absolute;
	transform-origin: 100% 50%;
}
.arr .i:before {
	transform: rotate(-50deg);
}
.arr .i:after {
	transform: rotate(50deg);
}

.hd-big {
	display: block;
	color: #eeeff2;
	font-size: 32px;
	letter-spacing: 0.01em;
	line-height: 2;
	font-family: 'Prata', serif;
}
.bright .hd-big {
	color: #131316;
}
@media screen and (min-width: 1000px) {
	.hd-big {
		font-size: 80px;
		line-height: 1;
		letter-spacing: 0.05em;
		margin-right: 30%;
	}
}
@media screen and (min-width: 1500px) {
	.hd-big {
		margin-right: 40%;
	}
}
.hd-big .line {
	position: relative;
	white-space: nowrap;
}
.hd-big .line:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 3px;
	width: 100%;
	height: 1px;
	background: #89898e;
	z-index: -1;
	transform-origin: 0 0;
	transform: scaleX(0);
	transition: all 1.4s;
}
.hd-big .line.animated:after {
	transform: scaleX(1);
}
.hd-big .line:last-child:after {
	content: none;
}
@media screen and (min-width: 1000px) {
	.hd-big .line:after {
		width: 143%;
	}
}
@media screen and (min-width: 1500px) {
	.hd-big .line:after {
		width: 166.5%;
	}
}

.about {
	padding-top: 90px;
}
.about .num {
	position: relative;
	font-size: 80px;
	font-family: 'Prata', sans-serif;
	color: #ed1c24;
	z-index: 1;
}
.about .num:after {
	position: relative;
	content: '.';
	margin-left: 15px;
}
@media screen and (min-width: 1000px) {
	.about p {
		margin-right: 10%;
	}
}
.about .color-group {
	padding-top: 85px;
	padding-bottom: 45px;
}
.about .color-group.bright {
	padding-top: 130px;
	background: #ffffff;
}
.about .color-group p {
	color: #9c9c9f;
}
.about .color-group.bright p {
	color: #525258;
}

.about .item {
	clear: both;
	margin-bottom: 35px;
}
.about .item:after {
	content: "";
	clear: both;
	display: table;;
}
@media screen and (min-width: 1000px) {
	.about .item {
		margin-bottom: 55px;
	}
}

@media screen and (min-width: 1000px) {
	.about .item.p-full .num {
		float: left;
		width: 20%;
	}
	.about .item.p-full .text {
		padding-top: 60px;
		float: right;
		width: 53%;
	}
}

.about .item.p-img .num {
	margin-bottom: 27px;
}
.about .item.p-img .img {
	margin-right: -25px;
	margin-bottom: 10px;
}
.about .item.p-img .img-inner {
	position: relative;
	margin-bottom: 30px;
}
.about .item.p-img webgl-img {
	opacity: 0.5;
	transition: opacity 0.45s;
	transform: rotate(0.0001deg);
}
.about .item.p-img webgl-img.hover {
	opacity: 1;
}
.about .item.p-img img {
	display: block;
	width: 100%;
}
.about .item.p-img .img-text {
	margin-left: 45%;
}
.about .item.p-img .note {
	position: relative;
	margin-top: 60px;
}
@media screen and (min-width: 1000px) {
	.about .item.p-img .img {
		position: relative;
		margin-left: -85px;
		margin-right: auto;
		margin-bottom: -110px;
	}
	.about .item.p-img .img-inner {
		width: 66%;
		margin-bottom: 0;
	}
	.about .item.p-img .img-text {
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		right: 0;
		top: 0;
		height: 100%;
		width: 34%;
	}
	.about .item.p-img .note {
		position: relative;
		margin-top: 30px;
	}
}
.about .item.p-img .hd-big {
	margin-bottom: 45px;
}
@media screen and (min-width: 640px) {
	.about .item.p-img .text {
		margin-left: 46.5%;
		width: 40%;
	}
}


.about .item.p-l .num,
.about .item.p-r .num {
	margin-bottom: 30px;
}

@media screen and (min-width: 640px) {
	.about .item.p-l,
	.about .item.p-r {
		clear: none;
		margin-bottom: 120px;
	}
	.about .item.p-l {
		float: left;
		width: calc(43.5% - 20px);
	}
	.about .item.p-r {
		float: right;
		width: calc(56.5% - 20px);
	}
}
@media screen and (min-width: 1000px) {
	.about .item.p-l {
		float: left;
		width: 30%;
	}
	.about .item.p-r {
		float: right;
		width: 53%;
	}
}

.create {
	padding-top: 75px;
	padding-bottom: 75px;
}
.create .slider {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0;
	transition: opacity 0.45s;
}
.create .slider.slider-shown {
	opacity: 0.3;
	transition: opacity 0.3s;
}
.create .slider .mask {
	display: none;
}
.create h3 {
	color: #d7d7db;
}
@media screen and (min-width: 1000px) {
	.create {
		padding-top: 135px;
		padding-bottom: 135px;
	}
}
.create {
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	line-height: 2;
}
/*.create .table {
	margin-top: 25px;
}
@media screen and (min-width: 1000px) {
	.create .table {
		margin-top: 75px;
	}
}*/
.table {
	display: block;
	margin-left: 25px;
	margin-right: 25px;
}
.table:after {
	content: "";
	display: table;
	width: 100%;
	clear: both;
}
.table .item {
	width: 50%;
	float: left;
	height: 70px;
	line-height: 70px;
}
@media screen and (min-width: 640px) {
	.table .item {
		width: 25%;
		float: left;
		height: 140px;
		line-height: 140px;
		box-sizing: border-box;
		padding-left: 30px;
	}
}
@media screen and (min-width: 1000px) {
	.table {
		margin-left: 75px;
		margin-right: 105px;
	}
}

.general {
	background: #131316;
	color: #9c9c9f;
	padding-top: 75px;
	padding-bottom: 75px;
}
.general.overflow-hidden {
	overflow: hidden;
}
.general h1 {
	color: #ffffff;
}
h1 .word {
	white-space: nowrap;
}
.general.bright {
	background: #ffffff;
	color: #525258;
}
@media screen and (min-width: 1000px) {
	.general {
		padding-top: 160px;
		padding-bottom: 110px;
	}
}

.general .hd-big {
	margin-bottom: 45px;
	color: #d7d7db;
}
.general.bright .hd-big {
	color: #131316;
}
@media screen and (min-width: 640px) {
	h1 {
		margin-right: 10%;
	}
	.general .text p {
		margin-right: 10%;
	}
}
@media screen and (min-width: 1000px) {
	h1 {
		margin-right: 25%;
	}
	.general .text p {
		margin-right: 25%;
	}
}

.general h3 {
	margin-bottom: 27px;
}

.general .note {
	position: relative;
	margin-top: 60px;
	margin-left: 45%;
	z-index: 2;
}
.general .l .note {
	margin-left: 0;
	margin-top: 37px;
}
@media screen and (min-width: 1000px) {
	.general .note,
	.general .l .note {
		margin-left: 105px;
	}
}

.general button {
	margin-top: 35px;
}
.general .poly-button {
	display: inline-block;
	margin-top: 35px;
}

.general .furniture-img {
	display: block;
	position: relative;
	margin-top: 100px;
	margin-left: 0;
	width: 575px;
	height: 255px;
	max-width: 100%;
}
.general .furniture-img .net {
	content: "";
	top: -153px;
	left: -105px;
	position: absolute;
	width: 401px;
	height: 401px;
	background: url(../images/pattern-grey.svg);
}
.general .furniture-img img,
.general .furniture-img webgl-img {
	position: absolute;
	left: -200px;
	right: -200px;
	margin: auto;
	display: block;
	z-index: 1;
}
@media screen and (min-width: 640px) {
	.general .furniture-img {
		left: 0;
		margin-left: 105px;
	}
}

.general .design-img,
.general .building-img {
	position: relative;
	width: 100%;
	height: 455px;
	padding-top: 130px;
}
.general .design-img img,
.general .design-img webgl-img,
.general .building-img img,
.general .building-img webgl-img {
	position: absolute;
	left: -200px;
	right: -200px;
	top: 130px;
	margin: auto;
	display: block;
	z-index: 1;
}
.general .design-img img {
	left: 0;
	right: 0;
	max-width: calc(200vw - 80px);
}
.general .building-img img,
.general .building-img webgl-img {
	top: 200px;
}
.general .design-img .net,
.general .building-img .net {
	left: -300px;
	right: -300px;
	top: 30px;
	margin: auto;
	position: absolute;
	width: 401px;
	height: 401px;
	background: url(../images/pattern-grey.svg);
	background-position: -80px 0;
	opacity: 0.1;
}
.general .design-img .note,
.general .building-img .note {
	position: absolute;
	margin-left: 0;
	left: 45%;
	top: 0;
	z-index: 2;
}
/*.general .design-img .p-h-item,
.general .building-img .p-h-item {
	will-change: transform;
}*/
.general .building-img img {
	height: 420px;
}

@media screen and (min-width: 640px) {
	.general .design-img,
	.general .building-img {
		width: auto;
		padding-top: 0;
		position: relative;
		display: inline-block;
		margin-left: -70px;
		margin-top: 20px;
	}
	.general .building-img {
		margin-left: 100px;
	}
	.general .design-img img,
	.general .design-img webgl-img,
	.general .building-img img,
	.general .building-img webgl-img {
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		display: block;
		z-index: 1;
	}
	.general .building-img img,
	.general .building-img webgl-img {
		top: -50px;
	}
	.general .design-img:before,
	.general .building-img:before {
		top: 30px;
	}
	.general .design-img .note,
	.general .building-img .note {
		left: auto;
		right: -25px;
		top: 155px;
	}
	.general .building-img .note {
		right: -200px;
	}
}
@media screen and (min-width: 1000px) {
	.general .design-img,
	.general .building-img {
		margin-left: -140px;
	}
	.general .building-img {
		margin-left: 0;
	}
}

.general h1 {
	margin-bottom: 45px;
}
.general .shift-img {
	position: relative;
	margin-top: -75px;
	margin-bottom: 75px;
	margin-left: -25px;
	margin-right: -25px;
}
.general .shift-img img,
.general .shift-img webgl-img,
.general .shift-img basic-img {
	display: block;
	width: 100%;
}
@media screen and (min-width: 1000px) {
	.general .shift-img {
		margin-left: 0;
		margin-right: 0;
		margin-top: -160px;
		margin-bottom: 100px;
	}
	.general .shift-img img,
	.general .shift-img webgl-img,
	.general .shift-img basic-img {
		padding-top: 55px;
	}
	.general .shift-img:before {
		content: "";
		position: absolute;
		top: 0;
		width: 100%;
		height: calc(50% - 25px);
		background: #ffffff;
	}
}

.general .general-flower {
	position: absolute;
	left: 45px;
	top: 120px;
/*	max-height: calc(100% - 120px);*/
	pointer-events: none;
	display: none;
	width: 174px;
	height: 916px;
}
.general .general-flower .src {
	background-size: contain;
}
@media screen and (min-width: 640px) {
	.general .general-flower {
		display: block;
	}
}
@media screen and (min-width: 1000px) {
	.general .general-flower {
		display: block;
/*		height: calc(100% + 75px);*/
		left: 0;
		top: -75px;
	}
}

.project-tp1 {
	background: #ffffff;
	padding-bottom: 75px;
}
.project-tp1 .img {
	margin-bottom: 30px;
}
.project-tp1 .img img,
.project-tp1 .img webgl-img,
.project-tp1 .img basic-img {
	display: block;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
}
.project-tp1 .r img,
.project-tp1 .r webgl-img,
.project-tp1 .r basic-img {
	width: 100%;
	display: block;
}
.project-tp1 .r {
	margin-bottom: 50px;
}
@media screen and (min-width: 640px) {
	.project-tp1 {
		padding-bottom: 170px;
	}
	.project-tp1 .img {
		margin-bottom: 0;
	}
	.project-tp1 .l {
		position: absolute;
		bottom: 75px;
		left: 0;
	}
	.project-tp1 .r {
		margin-top: -80px;
		margin-bottom: 0;
	}
}

.project-tp2 {
	background: #ffffff;
	padding-bottom: 75px;
}
.project-tp2 .img {
	margin-bottom: 70px;
}
.project-tp2 .img img,
.project-tp2 .img-2 img,
.project-tp2 .img webgl-img,
.project-tp2 .img-2 webgl-img,
.project-tp2 .img basic-img,
.project-tp2 .img-2 basic-img {
	display: block;
}
.project-tp2 img,
.project-tp2 webgl-img,
.project-tp2 basic-img {
	width: 100%;
}
.project-tp2 .l {
	position: relative;
}
.project-tp2 .l:after {
	content: none;
	position: absolute;
	left: 0;
	top: 19px;
	width: 35px;
	height: 2px;
	background: #ed1c24;
}
.project-tp2 .r {
	margin-bottom: 35px;
}
@media screen and (min-width: 640px) {
	.project-tp2 .l:after {
		content: "";
	}
	.project-tp2 .r {
		margin-bottom: 120px;
	}
	.project-tp2 {
		padding-bottom: 100px;
	}
}


.slider-number {
	position: absolute;
	font-family: 'Prata', serif;
	font-size: 14px;
	color: #eaebef;
}
.slider-number div {
	display: inline-block;
	height: 19px;
	line-height: 19px;
}
.slider-number .bar {
	width: 30px;
	position: relative;
	margin: 0 10px;
}
.slider-number .bar:before {
	content: "";
	position: absolute;
	top: 13px;
	left: 0;
	height: 2px;
	width: 30px;
	background: #424246;
	z-index: 0;
}
.slider-number .bar .b1,
.slider-number .bar .b2 {
	position: absolute;
	top: 13px;
	left: 0;
	height: 2px;
	right: 20px;
	background: #ed1c24;
	z-index: 1;
}

.full-slider {
	padding-bottom: 75px;
}

.full-slider img {
	width: 100%;
	display: block;
}
.full-slider webgl-slider,
.full-slider basic-slider {
	display: block;
}
.full-slider .mask {
	display: none;
}
.full-slider canvas {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 2;
}
.full-slider .slider-number {
	position: absolute;
	right: 0;
	top: 62px;
}
.full-slider .bg-1,
.full-slider .bg-2 {
	position: absolute;
	width: 100%;
	height: 50%;
}
.full-slider .bg-1 {
	top: 0;
	background: #131316;
}
.full-slider .bg-2 {
	top: 50%;
	background: #ffffff;
}
.full-slider .arrows {
	position: absolute;
	top: 60px;
	left: 0;
	height: 32px;
	width: 77px;
}
.full-slider .arrows .arr-l {
	position: absolute;
	left: 0;
	top: 0;
}
.full-slider .arrows .arr-r {
	position: absolute;
	right: 0;
	top: 0;
}
.full-slider .tp {
	position: relative;
	padding-top: 65px;
	height: 65px;
}
.full-slider .slider-name {
	position: absolute;
	left: 110px;
	display: none;
}
.full-slider .slider-number {
	position: absolute;
}
@media screen and (min-width: 640px) {
	.full-slider {
		padding-bottom: 130px;
	}
	.full-slider .slider-name {
		display: block;
	}
}

.case {
	padding-top: 135px;
	color: #9c9c9f;
}
.case .wrapper {
	position: relative;
	z-index: 1;
	min-height: 350px;
	padding-bottom: 1px;
	pointer-events: none;
}
.case .l,
.case .link {
	pointer-events: auto;
}
.case .text {
	margin-bottom: 270px;
	overflow: hidden;
}
@media screen and (min-width: 640px) {
	.case .text p {
		margin-right: 10%;
	}
}
@media screen and (min-width: 1000px) {
	.case {
		padding-top: 185px;
	}
	.case .text {
		height: 320px;
	}
	.case .text p {
		margin-right: 25%;
	}
}

.case .arrows {
	position: absolute;
	left: 0;
	top: -70px;
	width: 77px;
	height: 32px;
}
.case .arrows .arr-l {
	left: 0;
}
.case .arrows .arr-r {
	right: 0;
}
@media screen and (min-width: 1000px) {
	.case .arrows {
		top: -100px;
	}
}

.case .slider-number {
	position: absolute;
	right: 0;
	top: -67px;
}
@media screen and (min-width: 1000px) {
	.case .slider-number {
		top: -93px;
	}
}

.case .slider {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	display: none;
/*	pointer-events: none;*/
	opacity: 0.75;
	transition: opacity 0.45s;
	transform: rotate(0.0001deg);
}
.case .slider.hover {
	opacity: 1;
}
@media screen and (min-width: 1000px) {
	.case .slider {
		display: block;
		left: 50%;
		width: 50%;
	}
}
.case .link {
	position: absolute;
	bottom: 80px;
	width: 100%;
	padding-bottom: 67px;
	padding-left: 40px;
	font-size: 28px;
	line-height: 1.3;
	font-family: 'Prata', sans-serif;
	box-sizing: border-box;
	letter-spacing: 0.05em;
	color: #ffffff;
}
.case .link:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: 0;
	left: 0;
	background: #ed1c24;
}
.case .link .arrow {
	position: absolute;
	left: 0;
	top: 15px;
	left: 15px;
	display: none;
	transition: all 0.3s;
}
.case .link .arrow.small {
	display: block;
	left: 15px;
}
@media screen and (min-width: 1000px) {
	.case .link {
		font-size: 30px;
		bottom: 80px;
		width: 63%;
		padding-left: 95px;
		padding-bottom: 75px;
		max-width: 1100px;		
	}
	.case .link .arrow {
		top: 15px;
		left: 0;
		display: block;
	}
	.case .link .arrow.small {
		display: none;
	}
}
.no-touchevents .case .link {
	transition: color 0.6s;
}
.no-touchevents .case .link:hover,
.no-touchevents .case .link.hover {
	color: #ed1c24;
	transition: color 0.3s;
}
.no-touchevents .case .link:hover .arrow,
.no-touchevents .case .link.hover .arrow {
	width: 0;
	transform: translateX(20px)
}

.csstransitions .case .link:after {
	transform: scaleX(0);
	transform-origin: 0 0;
}
.csstransitions .case .link.visible:after {
	transform: scaleX(1);
	transition: all 1.2s;
}
.csstransitions .case .link .arrow {
	left: -10px;
	opacity: 0;
}
.csstransitions .case .link.visible .arrow {
	left: 0px;
	opacity: 1;
	transition: all 0.3s, left 1.2s;
}

.contacts {
	background: #ffffff;
}
.contacts .wrapper {
	padding-top: 173px;
}
.contacts .l {
	margin-bottom: 95px;
}
.contacts .img {
	height: 500px;
	width: 100%;
	background-size: cover;
	background-position: center;
}
@media screen and (min-width: 640px) {
	.contacts .wrapper {
		padding-top: 0px;
	}
	.contacts .l {
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 100vh;
		margin-bottom: 0px;
	}
	.contacts .l > *:last-child {
		margin-bottom: 0;
	}
	.contacts .img {
		position: absolute;
		height: 100%;
		width: auto;
		top: 0;
		left: 50%;
		right: 0;
	}
}

.contacts .t-t {
	opacity: 0;
	transform: translateY(10px);
	transition: all 0.6s;
}
.contacts .t-t.visible {
	opacity: 1;
	transform: translateY(0px);
}
.contacts .soc a {
	margin-right: 10px;
	border-bottom: 1px solid #828285;
	transition: all 0.6s;
}
.contacts .soc a:hover {
	color: #ed1c24;
	border-bottom: 1px solid #ed1c24;
	transition: all 0.3s;
}

.video-section {
	position: relative;
	color: #d7d7db;
	overflow: hidden;
}
.video-section .bg {
	position: absolute;
	width: 100%;
	height: 400px;
	left: 0;
	top: 0;
	opacity: 0.35;
	transform: rotate(0.0001deg);
}
.video-section .l {
	position: relative;
	height: 400px;
}
@media screen and (min-width: 1000px) {
	.video-section {
		display: flex;
		align-items: center;
		padding-top: 75px;
		padding-bottom: 75px;
	}
	.video-section .tx p:last-child {
		margin-bottom: 0;
	}
	.video-section .l {
		position: absolute;
		top: 0;
		height: 100%;
		left: 0;
		z-index: 1;
	}
	.video-section .bg {
		height: 100%;
	}
}
.video-section .video-btn {
	position: absolute;
	width: 63px;
	height: 63px;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto;
	min-width: 0;
	z-index: 2;
	transform: translateZ(0px);
}
.video-section .video-btn:after {
	content: "";
	position: absolute;
	top: 0;
	left: 5px;
	right: 0;
	bottom: 0;
	width: 10px;
	height: 13px;
	margin: auto;
	background: url(../images/play.svg);
}
.video-section .r {
	padding-top: 50px;
	padding-bottom: 100px;
}
@media screen and (min-width: 640px) {
	.video-section .r {
		padding-top: 115px;
		padding-bottom: 115px;
	}
}

.form-section {
	position: relative;
	background: #ffffff;
	z-index: 1;
	padding-top: 75px;
	padding-bottom: 75px;
}
.form-section .r {
	position: relative;
}
.form-section h3 {
	color: #ed1c24;
	margin-bottom: 50px;
}
.form-section h1 {
	margin-bottom: 50px;
}

.form-section .ln {
	position: relative;
	padding-bottom: 3px;
	margin-bottom: 42px;
}
.form-section .ln.chb {
	height: 34px;
	line-height: 34px;
}
.form-section .ln:last-child {
	margin-bottom: 0;
}
.form-section .ln input {
	line-height: 35px;
	font-family: 'CormorantGaramond', serif;
	font-size: 18px;
	color: #131316;
}
.form-section .ln.chb input {
	visibility: hidden;
	opacity: 0;
}
.form-section .ln label {
	display: block;
}
.form-section .ln .placeholder {
	position: absolute;
	left: 0;
	top: 0;
	line-height: 35px;
	font-size: 18px;
	transition: all 0.2s;
	color: #5f5f65;
}
.form-section .ln.chb .placeholder {
	left: 40px;
	right: 0;
	line-height: 25px;
	padding-top: 5px;
	padding-bottom: 5px;
}
.form-section .ln.chb .input-wrapper {
/*	cursor: pointer;*/
	transition: all 0.6s;
}
.no-touchevents .form-section .ln.chb label:hover .placeholder {
	color: #ed1c24;
	transition: all 0.3s;
}
.form-section .ln.chb .fake {
	position: absolute;
	top: 6px;
	left: 0;
	width: 20px;
	height: 20px;
	border: 1px solid #89898e;
	transition: all 0.3s;
}
.form-section .ln.chb .error .fake {
	border: 1px solid #ed1c24;
}
.form-section .ln.chb .fake:after {
	content: "";
	position: absolute;
	width: 16px;
	height: 16px;
	background: #c2c2c7;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	opacity: 0;
	transform: scale(0.8);
	transition: all 0.25s;
}

.form-section .ln.chb input:checked + .fake:after {
	opacity: 1;
	transform: scale(1);
}
.form-section .ln .underline {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: #89898e;
}
.form-section .ln .underline:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	left: 0;
	bottom: 0;
	background: #ed1c24;
	transform-origin: 0 0;
	transform: scaleX(0);
	transition: all 0.6s;
}
.form-section label.focus .placeholder,
.form-section label.not-empty .placeholder {
	opacity: 0;
}
.form-section label.focus .underline:before {
	transform: scaleX(1);
	transition: all 0.3s;
}
.form-section .submit-line {
	margin-top: 55px;
}

@media screen and (min-width: 640px) {
	.form-section {
		display: flex;
		align-items: center;
	}
	.form-section h3 {
		color: #ed1c24;
		margin-bottom: 150px;
	}
	.form-section form,
	.form-section .form-response {
		margin-top: 8px;
	}
}
@media screen and (min-width: 1000px) {
	.form-section form,
	.form-section .form-response {
		margin-left: 90px;
	}
}


.form-section .form-response {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	transform: translateX(-10px);
	transition: all 0.6s;
}
.form-section .form-response.active {
	opacity: 1;
	transform: translateX(0px);
	transition: all 0.6s ease 0.3s;
}
.form-section form {
	transition: all 0.6s;
}
.form-section form.hidden {
	opacity: 0;
	transform: translateX(10px);
	pointer-events: none;
	transition: all 0.6s ease 0.3s;
}

.addr {
	margin-bottom: 60px;
}
.addr .hd {
	position: relative;
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	line-height: 2;
	color: #101011;
	padding-bottom: 30px;
	margin-bottom: 25px;
}
.addr .hd:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 30px;
	height: 2px;
	background: #ed1c24;
}
.addr .ln {
	margin-bottom: 12px;
	color: #4d4c52;
}

.cnt {
	margin-bottom: 60px;
}
.cnt .ln {
	margin-bottom: 16px;
}
.cnt a {
	font-family: 'PTSans', sans-serif;
	color: #101011;
	letter-spacing: 0.025em;
	font-size: 14px;
	transition: color 0.6s;
}
.cnt a:hover {
	color: #ed1c24;
	transition: color 0.3s;
}

.home .projects-top {
	position: relative;
	z-index: 5;
}
.sort-popup {
	position: absolute;
	width: 100%;
	left: 0;
	top: 70px;
	padding-top: 20px;
	bottom: 0;
	z-index: 10;
	overflow: auto;
}
@media screen and (min-width: 1000px) {
	.sort-popup {
		padding-top: 0;
		top: 135px;
	}
}
.sort-popup .inner {
	position: relative;
	padding-bottom: 80px;
}
.sort-popup .inner:before {
	content: "";
	position: absolute;
	width: calc(100% - 25px);
	left: 0;
	top: -20px;
	bottom: 0;
	background: #131316;
}
.sort-popup .item {
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
}
@media screen and (min-width: 640px) {
	.sort-popup .item {
		line-height: 80px;
		height: 80px;
	}
}
.sort-popup .item span {
	transition: color 0.3s;
	color: #d7d7db;
}
.sort-popup .item.active span {
	color: #ed1c24;
}
.sort-popup {
	opacity: 0;
	pointer-events: none;
	transition: all 0.6s ease 0.2s;
}
.sort-popup.active {
	opacity: 1;
	pointer-events: auto;
	transition: all 0.3s;
}
.sort-popup .item {
	opacity: 0;
	transition: all 0.6s;
	transform: translateY(0px);
}
.sort-popup.active .item {
	opacity: 1;
	transition: all 0.3s;
	transform: translateY(5px);
}

.text-button {
	font-family: 'PTSans', sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.175em;
	color: #ed1c24;
	line-height: 2;
}
.text-button span {
	display: inline-block;
	white-space: nowrap;
}

.csstransitions .all-projects .sort-btn-wrap,
.csstransitions .page-wrapper.popup-active .all-projects .sort-btn-wrap {
	opacity: 0;
	transform: translateX(10px);
}
.csstransitions .page-wrapper:not(.popup-active) .all-projects .sort-btn-wrap.visible {
	transition: all 0.6s ease 0.8s;
	opacity: 1;
	transform: translateX(0px);
}
.all-projects .slider-number {
	z-index: 10;
	display: none;
}
@media screen and (min-width: 640px) {
	.all-projects .slider-number {
		display: block;
	}
}
.all-projects .sort-btn-wrap {
	position: absolute;
	top: 75px;
	left: 197px;
	z-index: 3;
}
.all-projects .sort-btn-wrap:before {
	content: "";
	position: absolute;
	background: #424246;
	width: 94px;
	height: 1px;
	top: 12px;
	right: calc(100% + 20px);
	pointer-events: none;
}
.all-projects .sort-btn-wrap{
	display: none;
}
.all-projects .sort-btn-wrap .x {
	position: absolute;
	right: -30px;
	top: 2px;
	width: 20px;
	height: 20px;
	opacity: 0;
	pointer-events: none;
	/*transition: opacity 0.2s;*/
}
.all-projects .sort-btn-wrap .x:before,
.all-projects .sort-btn-wrap .x:after {
	content: "";
	position: absolute;
	width: 12px;
	height: 2px;
	background: #ed1c24;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}
.all-projects .sort-btn-wrap .x:before {
	transform: rotate(-45deg);
}
.all-projects .sort-btn-wrap .x:after {
	transform: rotate(45deg);
}
.all-projects .sort-btn-wrap.active .x {
	pointer-events: auto;
	opacity: 1;
}

@media screen and (min-width: 1000px) {
	.all-projects .sort-btn-wrap {
		display: block;
	}
}
.home .sort-button {
	position: absolute;
	left: calc(25% - 13px);
	top: 20px;
	width: 25px;
	height: 25px;
	background: url(../images/sort.svg);
	background-size: 100%;
}
@media screen and (min-width: 1000px) {
	.home .sort-button {
		display: none;
	}
}

/*.csstransitions .home .sort-button {
	opacity: 0;
}
.csstransitions .home .sort-button.visible {
	transition: all 0.6s;
	opacity: 1;
}*/

.all-projects h3 {
	display: none;
}
@media screen and (min-width: 1000px) {
	.all-projects h3 {
		display: block;
	}
}

.all-projects .text-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.all-projects .text-overlay {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.all-projects .all-projects-slider {
	position: absolute;
	top: 70px;
	bottom: 89px;
	left: 25px;
	right: 0px;
	opacity: 0.5;
	transition: opacity 1.2s;
	transform: rotate(0.0001deg);
}
.all-projects .all-projects-slider.hover {
	opacity: 0.75;
	transition: opacity 1.2s;
}
@media screen and (min-width: 640px) {
	.all-projects .all-projects-slider {
		top: 150px;
		left: 0;
		bottom: 89px;
		left: 105px;
		right: 85px;
	}
}
.csstransitions .all-projects .all-projects-wrapper {
	opacity: 0;
	transform: translateX(100px);
}
.csstransitions .all-projects .all-projects-wrapper.visible {
	transition: opacity 1.5s ease 0.3s, transform 1.5s ease 0.3s;
	opacity: 1;
	transform: translateX(0px);
}

.all-projects .hd {
	pointer-events: auto;
	width: 85%;
}

.full-text-slider {
	position: absolute;
	height: 100%;
	left: 0px;
	right: -25px;
	top: 0;
	transition: opacity 0.6s;
}
.full-text-slider .word,
.full-text-slider .line {
	white-space: nowrap;
}
.full-text-slider.hidden {
	opacity: 0;
	transition: opacity 0.3s;
}
.full-text-slider .slide {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
}
.full-text-slider .slide.disabled {
	display: none;
}
.full-text-slider .hd {
	opacity: 1;
	transform: translateX(0px);
	transition: all 0.6s;
}
.full-text-slider .hd.hidden {
	opacity: 0;
	transform: translateX(10px);
	transition: all 0s;
}
@media screen and (min-width: 640px) {
	.full-text-slider {
		left: 0;
		right: 0;
	}
	.full-text-slider .hd {
		width: 90%;
		margin-right: 0%;
	}
}
@media screen and (min-width: 1000px) {
	.full-text-slider .hd {
		width: 75%;
		margin-right: 0%;
	}
}

webgl-slider {
	overflow: hidden;
}
slider-component .slide,
webgl-slider .slide,
basic-slider .slide {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-position: center;
	background-size: cover;
	z-index: 0;
	transition-property: transform;
}

slider-component .fake,
webgl-slider .fake,
basic-slider .fake {
	display: block;
	visibility: hidden;
}
slider-component img,
webgl-slider img,
basic-slider img {
	display: block;
}


/*webgl-slider .slide.to-left:before,
basic-slider .slide.to-left:before,
webgl-slider .slide.to-right:before,
basic-slider .slide.to-right:before {
	opacity: 0.5;
}
webgl-slider .slide.to-center:before,
basic-slider .slide.to-center:before {
	opacity: 0;
}
webgl-slider .slide.moving:before,
basic-slider .slide.moving:before {
	opacity: 0.2;
}
webgl-slider .slide.lower-moving:before,
basic-slider .slide.lower-moving:before {
	opacity: 0.3;
}*/

webgl-slider .img-wrap,
basic-slider .img-wrap {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	overflow: hidden;
	backface-visibility: hidden;
}
webgl-slider .img,
basic-slider .img {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-size: cover;
	background-position: center;
}
webgl-slider .slide .overlay,
basic-slider .slide .overlay {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #000000;
	z-index: 1;
	opacity: 0;
	transition: all 0.6s;
}
webgl-slider .img-wrap,
basic-slider .img-wrap {
	transition: all 0.6s;
}
webgl-slider .img-wrap .img,
basic-slider .img-wrap .img {
	transition: all 0.6s;
}
webgl-slider .slide .overlay,
basic-slider .slide .overlay {
	transition: all 0.6s;
}
webgl-slider .slide.to-left .overlay,
basic-slider .slide.to-left .overlay {
	opacity: 0.7;
}
webgl-slider .slide.to-right .overlay,
basic-slider .slide.to-right .overlay {
	opacity: 0.7;
}
webgl-slider .slide.to-center .overlay,
basic-slider .slide.to-center .overlay {
	opacity: 0;
}
webgl-slider .slide.moving .overlay,
basic-slider .slide.moving .overlay {
	opacity: 0.2;
}
webgl-slider .slide.lower-moving .overlay,
basic-slider .slide.lower-moving .overlay {
	opacity: 0.3;
}
webgl-slider .slide.lower-moving .text,
basic-slider .slide.lower-moving .text {
	opacity: 0.5;
}

footer {
	position: relative;
	background: #ffffff;
	padding-top: 100px;
	z-index: 1;
}
@media screen and (min-width: 1000px) {
	footer {
		padding-top: 230px;
	}
}

@media screen and (min-width: 1000px) {
	footer .text-logo {
		position: absolute;
		top: 0;
		left: 0;
	}
}

footer .address {
	margin-top: 62px;
	padding-bottom: 75px;
}
@media screen and (min-width: 1000px) {
	footer .address {
		margin-top: 0px;
		margin-left: 36.5%;
		padding-top: 32px;
		padding-bottom: 220px;
	}
}
footer .a {
	padding-top: 28px;
	position: relative;
	margin-bottom: 60px;
}
footer .a:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 30px;
	height: 2px;
	background: #ed1c24;
}
@media screen and (min-width: 1000px) {
	footer .l {
		width: 45%;
	}
	footer .r {
		width: 55%;
	}
}
footer .ln {
	margin-bottom: 12px;
}
footer a {
	color: #5f5f65;
	font-family: 'PTSans', sans-serif;
	font-size: 14px;
	letter-spacing: 0.03em;
	border-bottom: 1px solid #828285;
	transition: all 0.6s;
}
.no-touchevents footer a:hover {
	color: #ed1c24;
	border-color: #ed1c24;
	transition: all 0.3s;
}
footer a.tel {
	border-bottom: none;
}

footer .dev {
	position: absolute;
	bottom: 25px;
	right: 0px;
}
@media screen and (min-width: 1000px) {
	footer .dev {
		right: 40px;
		bottom: 53px;
	}
}

.dev {
	font-family: 'PTSans', sans-serif;
	font-size: 14px;
}
.dev a {
	position: relative;
	color: #b71a23;
	border-bottom: none;
	letter-spacing: 0;
}
.dev a:before {
	content: "";
	position: absolute;
	top: 4px;
	left: -115px;
	width: 31px;
	height: 11px;
	background: url(../images/rc.svg);
}
html[lang="ru"] .dev a:before {
	left: -108px;
}

cursor-dot {
	position: fixed;
	width: 5px;
	height: 5px;
	left: -2px;
	top: -2px;
	pointer-events: none;
	z-index: 1100;
	display: none;
	backface-visibility: hidden;
}
cursor-dot .dot {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #ed1c24;
	transition: all 0.3s;
}
cursor-dot .a {
	position: absolute;
	width: 1px;
	height: 1px;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
cursor-dot .a:before,
cursor-dot .a:after {
	content: "";
	right: -2px;
	top: -1px;
	width: 6px;
	height: 2px;
	background: #ed1c24;
	position: absolute;
	transform-origin: 100% 50%;
	transition: transform 0.2s;
}
cursor-dot .a:after {
	top: 0px;
}
cursor-dot .a:before {
	transform: scaleX(0) rotate(-50deg);
}
cursor-dot .a:after {
	transform: scaleX(0) rotate(50deg);
}
cursor-dot.cursor-arrow-right .dot,
cursor-dot.cursor-arrow-left .dot {
	background: transparent;
}
cursor-dot.cursor-arrow-right .a:before {
	right: -2px;
	transform: scaleX(1) rotate(-50deg);
}
cursor-dot.cursor-arrow-right .a:after {
	right: -2px;
	transform: scaleX(1) rotate(50deg);
}
cursor-dot.cursor-arrow-left .a:before {
	right: -2px;
	transform-origin: 0% 50%;
	transform: scaleX(1) rotate(-50deg);
}
cursor-dot.cursor-arrow-left .a:after {
	right: -2px;
	transform-origin: 0% 50%;
	transform: scaleX(1) rotate(50deg);
}
cursor-dot.cursor-arrow-left .a:after {
	top: -1px;
}


cursor-dot.mousedown .dot,
cursor-dot.hover .dot {
	transition: all 0.1s;
	transform: scale(1.5);
}
.no-touchevents cursor-dot {
	display: block;
}

cursor-component {
	display: none;
	position: fixed;
	width: 51px;
	height: 51px;
	left: -25px;
	top: -25px;
	z-index: 1000;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s;
	backface-visibility: hidden;
}
.no-touchevents cursor-component {
	display: block;
}
cursor-component .global {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	transition: all 0.6s;
}
cursor-component.mousedown .global {
	transform: scale(0.9);
	transition: all 0.2s;
}

cursor-component.hidden .global {
	transition: all 0.2s;
	opacity: 0 !important;
	transform: scale(3) !important;
}
cursor-component.hover .global {
	transition: all 0.4s;
	opacity: 0;
	transform: scale(1.2);
}


cursor-component .outer-circle {
	position: absolute;
	border: 1px solid #ed1c24;
	border-radius: 50%;
	width: 21px;
	height: 21px;
	left: -200px;
	top: -200px;
	right: -200px;
	bottom: -200px;
	margin: auto;
	transition: width 0.3s, height 0.3s;
	backface-visibility: hidden;
}
cursor-component .inner-circle {
	position: absolute;
	width: 13px;
	height: 13px;
	background: #ed1c24;
	border-radius: 50%;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	transition: all 0.3s;
	backface-visibility: hidden;
}

cursor-component .inner-circle {
	transform: scale(0);
}
cursor-component.dot .outer-circle {
	transform: scale(1.5);
	transition: all 0.3s ease;
	opacity: 0;
}
cursor-component.dot .inner-circle {
	transition: all 0.2s ease;
	transform: scale(0.45);
}

cursor-component .bar {
	position: absolute;
	width: 6px;
	height: 2px;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: #ed1c24;
	margin: auto;
	opacity: 0;
	transition: all 0s ease 0.2s, opacity 0.2s;
}
cursor-component.right .bar,
cursor-component.left .bar {
	transition: all 0s ease 0s, opacity 0.2s;
}
cursor-component.right .bar.b1 {
	transform-origin: 100% 50%;
	transform: rotate(-50deg);
	opacity: 1;
	right: 1px;
}
cursor-component.right .bar.b2 {
	transform-origin: 100% 50%;
	transform: rotate(50deg);
	opacity: 1;
	right: 1px;
}
cursor-component.left .bar.b1 {
	transform-origin: 0% 50%;
	transform: rotate(-50deg);
	opacity: 1;
	left: 1px;
}
cursor-component.left .bar.b2 {
	transform-origin: 0% 50%;
	transform: rotate(50deg);
	opacity: 1;
	left: 1px;
}
cursor-component .arr {
	position: absolute;
	top: 0px;
	bottom: 0px;
	margin: auto;
}
cursor-component .arr .i {
	height: 1px;
	transition: transform 0.4s, opacity 0.6s;
	opacity: 0;
}
cursor-component.drag .arr .i {
	opacity: 1;
	transition: transform 1.2s, opacity 0.6s;
}
cursor-component .arr .i:before,
cursor-component .arr .i:after {
	background: #ed1c24;
}
cursor-component.mousedown .arr .i {
	transition: transform 0.3s, opacity 0.6s;
}
cursor-component .arr-l {
	left: -8px;
}
cursor-component .arr-r {
	right: -8px;
}
cursor-component .arr-l .i,
cursor-component.drag.mousedown .arr-l .i {
	transform:  translateX(-30px) scaleX(-1);
}
cursor-component .arr-r .i,
cursor-component.drag.mousedown .arr-r .i {
	transform:  translateX(30px);
}
cursor-component.drag .arr-l .i {
	transform:  scaleX(-1);
}
cursor-component.drag .arr-r .i {
	transform:  translateX(0);
}
cursor-component.hover .arr-l .i {
	opacity: 0;
	transform:  translateX(-30px) scaleX(-1);
	transition: all 0.3s;
}
cursor-component.hover .arr-r .i {
	opacity: 0;
	transform:  translateX(30px);
	transition: all 0.3s;
}

drag-help {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 300;
	background: rgba(19, 19, 22, 0.9);
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.6s;
}
drag-help.active {
	opacity: 1;
}
drag-help .in {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 154px;
	margin: auto;
}
drag-help .anim {
	position: absolute;
	left: -20px;
	right: 0;
	top: 73px;
	margin: auto;
	width: 213px;
	height: 3px;
}
drag-help .dots-container,
drag-help .dots {
	width: 453px;
	height: 3px;
	position: absolute;
	left: 0;
	top: 5px;
}
drag-help .dots-container {
	left: 4px;
}
drag-help .circ { 
	position: absolute;
	width: 33px;
	height: 33px;
	top: -14px;
	left: -15px;
	transform: scale(2);
	opacity: 0;
}
drag-help .circ .c {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 23px;
	height: 23px;
	border: 1px solid #ed1c24;
	border-radius: 50%;
	transform: scale(1);
}
drag-help .dots {
	position: absolute;
	overflow: hidden;
	width: 221px;
	height: 11px;
	top: -4px;
	left: -4px;
}
drag-help .d {
	width: 3px;
	height: 3px;
	margin-right: 27px;
	background: #ffffff;
	float: left;
	border-radius: 50%;
	opacity: 0;
}
drag-help .d.red {
	background: #ed1c24;
}
drag-help .d:last-child {
	margin-right: 0;
}
drag-help .tx {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	font-size: 18px;
	color: #ffffff;
	text-align: center;
	letter-spacing: 0.05em;
	opacity: 0;
	transform: translateY(15px);
	transition: all 0s ease 0.6s;
}
drag-help.active .tx {
	opacity: 1;
	transform: translateY(0px);
	transition: all 0.5s ease 0.7s;
}

popup-component {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 100%;
	z-index: 50;
	transform: translateZ(0px);
	overflow: hidden;
/*	background: #131316;*/
}
popup-component {
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s linear 0s, transform 0.5s ease 0s, bottom 0s ease 0.5s;
}
popup-component.active {
	bottom: 0;
	opacity: 1;
	pointer-events: auto;
	overflow-y: auto;
	transition: opacity 0s linear 0s, transform 0s ease 0s, bottom 0s ease 0s;
}
/*page-transition {
	display: none;
}*/
page-transition,
overlay-component {
	position: fixed;
	height: 100%;
	left: 0;
	right: 0;
	top: 0;
	z-index: 90;
	pointer-events: none;
}
overlay-component.bottom {
	z-index: 40;
}
overlay-component.top {
	z-index: 90;
}
page-transition.active,
overlay-component.active {
	pointer-events: auto;
}
page-transition .fake-img {
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
	transition: opacity 0.1s, all 0.5s;
	z-index: 1;
	background-position: center;
	background-size: cover;
	width: auto;
	height: auto;
}
page-transition .fake-img.active {
	opacity: 1;
	transition: opacity 0.3s, all 0.5s;
}
page-transition .fake {
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
	transition: opacity 0.6s;
	z-index: 2;
}
page-transition .fake.active {
	transition: opacity 0s;
	opacity: 1;
}
page-transition canvas,
overlay-component canvas {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}