/* Fonts Settings */

/* DINNextCYR-Regular */
@font-face {
	font-family: 'DINNextCYR-Regular';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/DINNextCYR-Regular.eot'); /* IE9 Compat Modes */
	src: local('DINNextCYR Regular'), local('DINNextCYR-Regular'),
	url('../fonts/DINNextCYR-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('../fonts/DINNextCYR-Regular.woff2') format('woff2'), /* Super Modern Browsers */
	url('../fonts/DINNextCYR-Regular.woff') format('woff'), /* Modern Browsers */
	url('../fonts/DINNextCYR-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
	url('../fonts/DINNextCYR-Regular.svg#DINNextCYR-Regular') format('svg'); /* Legacy iOS */
}

/* DINNextCYR-Medium */
@font-face {
	font-family: 'DINNextCYR-Medium';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/DINNextCYR-Medium.eot'); /* IE9 Compat Modes */
	src: local('DINNextCYR Medium'), local('DINNextCYR-Medium'),
	url('../fonts/DINNextCYR-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('../fonts/DINNextCYR-Medium.woff2') format('woff2'), /* Super Modern Browsers */
	url('../fonts/DINNextCYR-Medium.woff') format('woff'), /* Modern Browsers */
	url('../fonts/DINNextCYR-Medium.ttf') format('truetype'), /* Safari, Android, iOS */
	url('../fonts/DINNextCYR-Medium.svg#DINNextCYR-Medium') format('svg'); /* Legacy iOS */
}

/* DINNextCYR-Light */
@font-face {
	font-family: 'DINNextCYR-Light';
	font-style: normal;
	font-weight: lighter;
	src: url('../fonts/DINNextCYR-Light.eot'); /* IE9 Compat Modes */
	src: local('DINNextCYR Light'), local('DINNextCYR-Light'),
	url('../fonts/DINNextCYR-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('../fonts/DINNextCYR-Light.woff') format('woff'), /* Modern Browsers */
	url('../fonts/DINNextCYR-Light.ttf') format('truetype'), /* Safari, Android, iOS */
	url('../fonts/DINNextCYR-Light.svg#DINNextCYR-Light') format('svg'); /* Legacy iOS */
}


/* DINNextCYR-Bold */
@font-face {
	font-family: 'DINNextCYR-Bold';
	font-style: normal;
	font-weight: bold;
	src: url('../fonts/DINNextCYR-Bold.eot'); /* IE9 Compat Modes */
	src: local('DINNextCYR Bold'), local('DINNextCYR-Bold'),
	url('../fonts/DINNextCYR-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('../fonts/DINNextCYR-Bold.woff2') format('woff2'), /* Super Modern Browsers */
	url('../fonts/DINNextCYR-Bold.woff') format('woff'), /* Modern Browsers */
	url('../fonts/DINNextCYR-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
	url('../fonts/DINNextCYR-Bold.svg#DINNextCYR-Bold') format('svg'); /* Legacy iOS */
}


a {
	text-decoration: none;
}

a:hover {
	color: rgba(0,0,0,.5);
}

button:focus {
    outline: none;
}

nav {
	z-index: 999;
}

.z-index, .cke_focus {
	z-index: 99999999 !important;
}

.videodetector {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	z-index: 999999;
	margin-bottom: 20px;
}

.videodetector iframe, .videodetector object, .videodetector embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.videodetector input {
	display: none;
}

/* Animation */

.rellax {
	
}

.nav-img {
	width: 20%;
	height: auto;
	z-index: -2;
	transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
}

.img-left-arrow {
	width: 120px;
	height: auto;
	position: absolute;
	
}

.img-footer {
	width: 20%;
	height: auto;
	float: right;
}


/* Nav Style */


.navbar-toggler {
    padding: .75rem .75rem;
	border-color: transparent !important;
}


.animated-icon2 {
	width: 30px;
	height: 20px;
	position: relative;
	margin: 0px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
}

.animated-icon2 span {
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	border-radius: 9px;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

.animated-icon2 span {
	background: rgb(0,0,0);
}

.animated-icon2 span:nth-child(1) {
	top: 0px;
}

.animated-icon2 span:nth-child(2), .animated-icon2 span:nth-child(3) {
	top: 10px;
}

.animated-icon2 span:nth-child(4) {
	top: 20px;
}

.animated-icon2.open span:nth-child(1) {
	top: 11px;
	width: 0%;
	left: 50%;
}

.animated-icon2.open span:nth-child(2) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

.animated-icon2.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.animated-icon2.open span:nth-child(4) {
	top: 11px;
	width: 0%;
	left: 50%;
}


.navbar-brand img, #sidebar img {
	width: 85%;
}

.navbar_bg {
	position: absolute;
	width: 100%;
	height: 100%;
	right: 0%;
	background-image: url('../images/7.png');
	background-repeat: no-repeat;
	background-position: 35% center;
	background-size: auto 100%;
	z-index: -1;
}

.navbar-light .navbar-nav .active > .nav-link {
	border-bottom: solid 2px black;
}

.navbar-light .navbar-nav .nav-link  {
	color: rgba(0,0,0,.9);
	font-size: 16px;
	font-family: 'DINNextCYR-Medium', sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 0.3rem;
}

.navbar-light .navbar-nav .nav-link:hover {
	color: rgba(0,0,0,.5);
}



/* Main Style */
.box {
	width: 5em;
	height: 5em;
	background: linear-gradient(135deg, #3cdddd, #ff1ac6);
	transform: translateX(var(--tx)) rotate(var(--r));
	transition: transform .1s linear;
	will-change: transform;
}

#sidebar {
	position: fixed;
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
	opacity: 0;
	z-index: 999;
}




.f-1, .f-2, .f-1_1  {
	position: relative;
	overflow: hidden;
}



.s-1 {
	color: rgba(0,0,0,.9);
	font-family: 'DINNextCYR-Bold', sans-serif;
	font-size: 30px;
}

.s-2 {
	color: rgba(0,0,0,.9);
	font-family: 'DINNextCYR-Light';
	font-size: 18px;
}

.footer_text {
	color: rgba(0,0,0,.9);
	font-family: 'DINNextCYR-Bold', sans-serif;
	font-size: 24px;
	text-transform: uppercase;
}

.social a {
	color: rgba(0,0,0,.9);
	font-family: 'DINNextCYR-Light';
	font-size: 18px;
	border-bottom: solid 2px black;
	display: inline-block;
	margin-right: 55px;
}

.social a:hover {
	text-decoration: none;
}

.work-block {
	width: 100%;
	overflow: hidden;
}

.image {
	overflow: hidden;
	height: 360px;
	margin-bottom: 20px;
}

.image img {
	-moz-transition: all 1s ease-out;
	-o-transition: all 1s ease-out;
	-webkit-transition: all 1s ease-out;
}

.image img:hover{
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
}

.works_block_2 img {
    margin: 15px 0 5px 0;
	width: 100% !important;
	height: auto !important;
}

.w-title {
	color: rgba(0,0,0,.9);
	font-size: 20px;
	font-family: 'DINNextCYR-Medium', sans-serif;
	text-decoration: none;
}

.w-img {
	height: 360px;
	object-fit: cover;
	object-position: center;
    opacity: 1;	
}


.w-title:hover {
	color: rgba(0,0,0,.9);
	color: rgba(0,0,0,.5);
	text-decoration: none;
}

.w-company {
	color: rgba(0,0,0,.9);
	font-family: 'DINNextCYR-Light';
	font-size: 16px;
}

.page p {
	font-family: 'DINNextCYR-Regular';
}

.page p strong {
	color: rgba(0,0,0,.9);
	font-family: 'DINNextCYR-Medium', sans-serif;
}

.page a, .page a:hover {
	color: rgba(0,0,0,.9);;
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
	
	body {
		overflow-x: hidden;
	}
	
	
	.second-button {
		position: relative;
	}
	
	.navbar-collapse  {
		background-color: rgba(0,0,0,.3);
		z-index: 100;
	}
	
	
}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) { 
	
	
	
	.second-button {
		position: relative;
	}
	
	.navbar-collapse  {
		background-color: rgba(0,0,0,.3);
		z-index: 100;
	}
	
	
	
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) { 
	
	
	.second-button {
		position: relative;
	}
	
	.navbar-collapse  {
		background-color: rgba(0,0,0,.3);
		z-index: 100;
	}
	
	
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) { 
	
	#sidebar.visible {
		display: none;
	}
	
	
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
	
	body {
		overflow-x: hidden;
	}
	
	
	
	.ff-1 {
		float: left;
		width: 100%;
		height: 100%;
		top: 200px;
		left: 2%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/5.png');
		background-repeat: no-repeat;
		background-position: left center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.f-2_1 {
		width: 100%;
		height: 100%;
		top: 600px;
		left: 93%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/2103.png');
		background-repeat: no-repeat;
		background-position: auto center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	
	.ff-1_1 {
		width: 150px;
		height: 100%;
		top: 50px;
		left: 2%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/5.png');
		background-repeat: no-repeat;
		background-position: left center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.f-2_1_1 {
		width: 100%;
		height: 100%;
		top: 350px;
		left: 93%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/2103.png');
		background-repeat: no-repeat;
		background-position: auto center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.ff-2_1 {
		width: 100%;
		height: 200px;
		top: -20%;
		bottom: 0;
		left: 90%;
		right: 0;
		z-index: 999;
		position: relative;
		background-image: url('../images/2.png');
		background-repeat: no-repeat;
		background-size: auto 200px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.works_block_2 .ff-2 {
		width: 100%;
		height: 200px;
		top: -20%;
		bottom: 0;
		left: 90%;
		right: 0;
		z-index: 999;
		position: relative;
		background-image: url('../images/2.png');
		background-repeat: no-repeat;
		background-size: auto 200px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.f-1_1::before {
		content: "";
		width: 100%;
		height: 100%;
		top: 0%;
		left: 0%;
		z-index: -1;
		position: absolute;
		background-image: url('../images/5.png');
		background-repeat: no-repeat;
		background-position: left center;
		background-size: auto 50%;
	}
	
	
	
}	


@media (min-width: 2000px) { 
	
	body {
		overflow-x: hidden;
	}
	
	
	.ff-1 {
		float: left;
		width: 100%;
		height: 100%;
		top: 200px;
		left: 15%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/5.png');
		background-repeat: no-repeat;
		background-position: left center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.f-2_1 {
		width: 100%;
		height: 100%;
		top: 600px;
		left: 83%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/2103.png');
		background-repeat: no-repeat;
		background-position: auto center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.ff-1_1 {
		width: 150px;
		height: 100%;
		top: 50px;
		left: 15%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/5.png');
		background-repeat: no-repeat;
		background-position: left center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.f-2_1_1 {
		width: 100%;
		height: 100%;
		top: 350px;
		left: 83%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/2103.png');
		background-repeat: no-repeat;
		background-position: auto center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
}

@media (min-width: 2500px) { 
	
	body {
		overflow-x: hidden;
	}
	
	
	.ff-1 {
		float: left;
		width: 100%;
		height: 100%;
		top: 200px;
		left: 25%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/5.png');
		background-repeat: no-repeat;
		background-position: left center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.f-2_1 {
		width: 100%;
		height: 100%;
		top: 600px;
		left: 73%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/2103.png');
		background-repeat: no-repeat;
		background-position: auto center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.ff-1_1 {
		width: 150px;
		height: 100%;
		top: 50px;
		left: 25%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/5.png');
		background-repeat: no-repeat;
		background-position: left center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
	.f-2_1_1 {
		width: 100%;
		height: 100%;
		top: 350px;
		left: 73%;
		position: absolute;
		z-index: 99999;
		background-image: url('../images/2103.png');
		background-repeat: no-repeat;
		background-position: auto center;
		background-size: auto 150px;
		transition: transform 1.25s cubic-bezier(.34,.5,.04,.99);
	}
	
}