/*!
Theme Name: totrender
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: totrender
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

totrender is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.



 */




 @font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-Black.eot');
	src: local('Raleway Black'), local('Raleway-Black'),
		url('fonts/raleway/Raleway-Black.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-Black.woff') format('woff'),
		url('fonts/raleway/Raleway-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-ExtraLight.eot');
	src: local('Raleway ExtraLight'), local('Raleway-ExtraLight'),
		url('fonts/raleway/Raleway-ExtraLight.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-ExtraLight.woff') format('woff'),
		url('fonts/raleway/Raleway-ExtraLight.ttf') format('truetype');
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-Medium.eot');
	src: local('Raleway Medium'), local('Raleway-Medium'),
		url('fonts/raleway/Raleway-Medium.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-Medium.woff') format('woff'),
		url('fonts/raleway/Raleway-Medium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-LightItalic.eot');
	src: local('Raleway Light Italic'), local('Raleway-LightItalic'),
		url('fonts/raleway/Raleway-LightItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-LightItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-LightItalic.ttf') format('truetype');
	font-weight: 300;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-Regular.eot');
	src: local('Raleway'), local('Raleway-Regular'),
		url('fonts/raleway/Raleway-Regular.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-Regular.woff') format('woff'),
		url('fonts/raleway/Raleway-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-Light.eot');
	src: local('Raleway Light'), local('Raleway-Light'),
		url('fonts/raleway/Raleway-Light.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-Light.woff') format('woff'),
		url('fonts/raleway/Raleway-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-Thin.eot');
	src: local('Raleway Thin'), local('Raleway-Thin'),
		url('fonts/raleway/Raleway-Thin.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-Thin.woff') format('woff'),
		url('fonts/raleway/Raleway-Thin.ttf') format('truetype');
	font-weight: 100;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-ExtraBoldItalic.eot');
	src: local('Raleway ExtraBold Italic'), local('Raleway-ExtraBoldItalic'),
		url('fonts/raleway/Raleway-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-ExtraBoldItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-ExtraBoldItalic.ttf') format('truetype');
	font-weight: 800;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-ExtraLightItalic.eot');
	src: local('Raleway ExtraLight Italic'), local('Raleway-ExtraLightItalic'),
		url('fonts/raleway/Raleway-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-ExtraLightItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-ExtraLightItalic.ttf') format('truetype');
	font-weight: 200;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-MediumItalic.eot');
	src: local('Raleway Medium Italic'), local('Raleway-MediumItalic'),
		url('fonts/raleway/Raleway-MediumItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-MediumItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-MediumItalic.ttf') format('truetype');
	font-weight: 500;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-BoldItalic.eot');
	src: local('Raleway Bold Italic'), local('Raleway-BoldItalic'),
		url('fonts/raleway/Raleway-BoldItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-BoldItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-BoldItalic.ttf') format('truetype');
	font-weight: bold;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-ThinItalic.eot');
	src: local('Raleway Thin Italic'), local('Raleway-ThinItalic'),
		url('fonts/raleway/Raleway-ThinItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-ThinItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-ThinItalic.ttf') format('truetype');
	font-weight: 100;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-SemiBoldItalic.eot');
	src: local('Raleway SemiBold Italic'), local('Raleway-SemiBoldItalic'),
		url('fonts/raleway/Raleway-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-SemiBoldItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-SemiBoldItalic.ttf') format('truetype');
	font-weight: 600;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-SemiBold.eot');
	src: local('Raleway SemiBold'), local('Raleway-SemiBold'),
		url('fonts/raleway/Raleway-SemiBold.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-SemiBold.woff') format('woff'),
		url('fonts/raleway/Raleway-SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-Italic.eot');
	src: local('Raleway Italic'), local('Raleway-Italic'),
		url('fonts/raleway/Raleway-Italic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-Italic.woff') format('woff'),
		url('fonts/raleway/Raleway-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-Bold.eot');
	src: local('Raleway Bold'), local('Raleway-Bold'),
		url('fonts/raleway/Raleway-Bold.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-Bold.woff') format('woff'),
		url('fonts/raleway/Raleway-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-ExtraBold.eot');
	src: local('Raleway ExtraBold'), local('Raleway-ExtraBold'),
		url('fonts/raleway/Raleway-ExtraBold.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-ExtraBold.woff') format('woff'),
		url('fonts/raleway/Raleway-ExtraBold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
}

@font-face {
	font-family: 'Raleway';
	src: url('fonts/raleway/Raleway-BlackItalic.eot');
	src: local('Raleway Black Italic'), local('Raleway-BlackItalic'),
		url('fonts/raleway/Raleway-BlackItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/raleway/Raleway-BlackItalic.woff') format('woff'),
		url('fonts/raleway/Raleway-BlackItalic.ttf') format('truetype');
	font-weight: 900;
	font-style: italic;
}



@font-face {
	font-family: 'Optima Cyr';
	src: url('fonts/optimusgang/Optima.eot');
	src: local('Optima Cyr'), local('Optima'),
		url('fonts/optimusgang/Optima.eot?#iefix') format('embedded-opentype'),
		url('fonts/optimusgang/Optima.woff') format('woff'),
		url('fonts/optimusgang/Optima.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Optima';
	src: url('fonts/optimusgang/AGOptimaBoldItalic.eot');
	src: local('Optima Bold Italic'), local('AGOptimaBoldItalic'),
		url('fonts/optimusgang/AGOptimaBoldItalic.eot?#iefix') format('embedded-opentype'),
		url('fonts/optimusgang/AGOptimaBoldItalic.woff') format('woff'),
		url('fonts/optimusgang/AGOptimaBoldItalic.ttf') format('truetype');
	font-weight: bold;
	font-style: italic;
}

@font-face {
	font-family: 'Optima';
	src: url('fonts/optimusgang/Optima-Italic.eot');
	src: local('Optima Italic'), local('Optima-Italic'),
		url('fonts/optimusgang/Optima-Italic.eot?#iefix') format('embedded-opentype'),
		url('fonts/optimusgang/Optima-Italic.woff') format('woff'),
		url('fonts/optimusgang/Optima-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: 'Optima';
	src: url('fonts/optimusgang/Optima-Bold.eot');
	src: local('Optima Bold'), local('Optima-Bold'),
		url('fonts/optimusgang/Optima-Bold.eot?#iefix') format('embedded-opentype'),
		url('fonts/optimusgang/Optima-Bold.woff') format('woff'),
		url('fonts/optimusgang/Optima-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

*{
	margin: 0;
	padding: 0;
	outline: none;
	text-decoration: none;
	font-family: Optima cyr;
}

#masthead .site-branding{
	background: #D2CBC1;
	display: flex;justify-content: center;
	padding: 0 20px;
}
#masthead .site-branding img{
	width: 100%;
    max-width: 1810px;
    padding: 20px 0px;
}
.menu-menu-1-container{
	
	padding: 0 15px ;
	    position: absolute;
	    text-align: center;
	   width: calc(100% - 30px);
	       z-index: 2;
}
.menu-menu-1-container ul{
	        max-width: 1807px;
	        margin: 0 auto;
	        display: flex;
	            list-style: none;
}
.menu-menu-1-container ul li{
	transform: rotate(-90deg);
	    width: 46px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
	    margin-left: 4px;
}
.menu-menu-1-container ul li a{
	font-family: Optima cyr;
font-style: normal;
font-weight: normal;
font-size: 28px;
line-height: 34px;
/* identical to box height */

text-align: right;
letter-spacing: 6px;
text-transform: uppercase;

/* beige */
    padding: 8px 13px;
color: #D2CBC1;
padding-right: 4px;
}
.menu-menu-1-container ul li.current_page_item a{
	color: #000000;
    background: #d2cbc2;
}
section.main-banner .video{
	height: calc(100vh - 100px);
    display: flex;
    flex-direction: column;
}

section.colobarate-2.animated {
	position: absolute;
    top: calc(100% - 170px);
    z-index: 999;
    background: #6484aabd;
    padding: 5px 10px 0px 150px;
    font-size: 38px;
    cursor: pointer;
    font-weight: 200;
    margin-left: 70px;
	letter-spacing: 10px;
}
section.colobarate-2.animated:hover {
background: #6484aa;
}
@media (max-width: 899px) {
	section.colobarate-2.animated{
    top: calc(100% - 170px);
    padding: 5px 10px 5px 100px;
    font-size: 24px;
    margin-left: 30px;
	}
}
.link.active {
    display: none;
}

section.main-banner .video video{
	    object-fit: cover;
}
section.main-banner .video .container{
	   max-width: 1810px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    padding: 0 20px;
    position: relative;
}


section.main-banner .video .container .content{
	position: absolute;
	top: 10vh;
	    z-index: 1;
	    right: 60px;
}
section.main-banner .video .container a{
	position: absolute;
       bottom: -70vh;
    font-family: Optima Cyr;
    line-height: 56px;
    letter-spacing: 6px;
    text-transform: uppercase;
    color: #D2CBC1;
    transform: rotate(-90deg);
    font-size: 46px;
    height: 51px;
    width: 260px;
    margin-right: -150px;
        z-index: 2;
}
.home{
	background: #F5F3EF;
}
.about .block{
	background: url(img/about.jpg) no-repeat;
	background-size: cover;
	background-position: center;
	display: flex;
}
.about .block > div{
	flex: 1;
	max-width: 50%;
}
.about .container{
	  max-width: 1300px;
	  padding: 0 15px;
	  margin: 0 auto;
}
.main-banner{
	    margin-bottom: 242px;
}
.about .container .block .right{
	    text-align: right;
}
.about .container .block .right p {
    font-family: Raleway;
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 144%;
    padding: 33px 36px;
    text-align: left;
    color: #2D261F;
    text-transform: uppercase;
    margin-top: 74px;
    margin-left: 60px;
    margin-right: 30px;
    background: #ffffff66;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    margin-bottom: 41px;
}
.about .container .block .right .more{
	border: 1px solid #2D261F;
    font-family: Optima cyr;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 4px;
    text-transform: uppercase;
    padding: 14px 17px;
    color: #d2cbc1;
    display: inline-block;
    margin-bottom: 50px;
    margin-right: 100px;
    background: #2d261f;

}

.about .container .block .right .mobile_button{
	border: 1px solid #2D261F;
	font-family: Optima cyr;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 22px;
/* identical to box height */

text-align: center;
letter-spacing: 4px;
text-transform: uppercase;

/* brown */
padding: 14px 17px;

color: #2D261F;
display: inline-block;
    margin-bottom: 50px;
    margin-right: 100px;

}

.about .container .block .left{
	display: flex;
    align-items: flex-end;
}
.about .container .block .left .coll{
	background: #2D261F;
	font-family: Optima cyr;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 22px;
/* identical to box height */

text-align: center;
letter-spacing: 4px;
text-transform: uppercase;

/* beige */
    margin-bottom: 50px;
    margin-left: 100px;
    padding: 18px 28px;
color: #D2CBC1;
}

.about .container .block .left .mobile_button{
	background: #2D261F;
	font-family: Optima cyr;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 22px;
/* identical to box height */

text-align: center;
letter-spacing: 4px;
text-transform: uppercase;

/* beige */
    margin-bottom: 50px;
    margin-left: 100px;
    padding: 18px 28px;
color: #D2CBC1;
}



.about .container .h1{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 90px;
line-height: 109px;
letter-spacing: 8px;
text-transform: uppercase;

/* brown */

color: #2D261F;
text-align: right;
margin-bottom: -50px;
}
#colophon .site-info .flex > div.form input{
	padding-left: 10px;
}

.clients .container{
	 max-width: 981px;
	  padding: 0 15px;
	  margin: 0 auto;
}

.clients .container .flex{
	display: flex;
	justify-content: space-between;
}
.clients .container .flex div{
	text-align: center;
}
.clients .container .flex div p{

font-style: normal;
font-weight: normal;
font-size: 40px;
line-height: 48px;
letter-spacing: 6px;
text-transform: uppercase;

/* beige */

color: #D2CBC1;
}
.clients .container .flex div .number{

font-style: normal;
font-weight: normal;
font-size: 60px;
line-height: 73px;
/* identical to box height */

text-align: center;
text-transform: uppercase;

/* brown */

color: #2D261F;
}
section.about{
	margin-bottom: 70px;
}
section.clients{
	margin-bottom: 113px;
    margin-top: 78px;
}
section.services .container{
	max-width: 1300px;
	padding: 0 5px;
	margin: 0 auto;
}
section.services .h1{
	    font-family: Optima;
    font-style: normal;
    font-weight: bold;
    font-size: 90px;
    line-height: 109px;
    text-align: center;
    letter-spacing: 8px;
    text-transform: uppercase;
    text-align: right;
    padding-right: 14%;
    color: #2D261F;
    max-width: 1100px;
    margin: 0 auto;
}
section.services .flex{
	display: flex;
}
section.services .flex > div{
	height: 560px;
	margin-right: 40px;
	flex: 1;
	display: flex;
    align-items: center;
    justify-content: center;
}
section.services .flex > div.ext{
	background: url(img/service1.png);
}
section.services .flex > div.int{
	background: url(img/service2.png);
}
section.services .flex > div.anm{
	background: url(img/service3.png);
}
section.services .flex > div.vrt{
	background: url(img/service4.png);
	margin: 0;
}
section.services .flex > div p{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 48px;
line-height: 58px;
text-align: center;
letter-spacing: 6px;
text-transform: uppercase;

/* brown */

color: #2D261F;

transform: rotate(-90deg);
}
section.colobarate .container{

}
section.colobarate{
	background: url(img/background_coll.png);
	background-size: cover;
	background-position: center;
	margin-top: 200px;
}
section.colobarate .h1{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 90px;
line-height: 109px;
letter-spacing: 8px;
text-transform: uppercase;

/* brown */

color: #2D261F;

    margin: 0 auto;
    max-width: 524px;
    position: relative;
    top: -42px;
    line-height: 56px;
}
section.colobarate .container{

	margin: 0 auto;
	max-width: 900px;
	    padding-bottom: 30px;
}
section.colobarate .container p{
	font-style: normal;
font-weight: normal;
font-size: 38px;
line-height: 46px;
/* identical to box height */

text-align: center;
letter-spacing: 4px;
text-transform: uppercase;

/* brown */

color: #2D261F;
}
#upbutton{
	position: fixed;
	background: url(img/upArrow.svg) no-repeat;
	background-position: center;
	width: 60px;
	height: 60px;
	bottom: 20px;
	right: 20px;
	cursor: pointer;
}

#upbutton:hover{
	background: url(img/upArrow_a.svg) no-repeat;
	background-position: center;
}


span.wpcf7-not-valid-tip{
	display: none !important;
}

.wpcf7-not-valid{
	border: 1px solid red !important;
}
div.wpcf7-mail-sent-ok{
	border: none !important;
	text-transform: uppercase;
}
div.wpcf7-validation-errors{
	display: none !important;
}
section.colobarate .container p.left{
	text-align: left;
	    margin-bottom: 9px;
}

section.colobarate .container p.right{
	text-align: right;
}

section.colobarate .container .collaborate{
	    font-family: Optima Cyr;
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: #D2CBC1;
    background: #2D261F;
    display: table;
    padding: 16px 28px;
    margin: 24px auto 1px;
    transition: all 500ms cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */

	transition-timing-function: cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */
	cursor: pointer;
}
section.colobarate .container .collaborate:hover{
	background: #D2CBC1;
	color: #2D261F;
}
#colophon .site-info .flex > div.form input.wpcf7-submit{
 transition: all 500ms cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */

	transition-timing-function: cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */
	cursor: pointer;
	border-radius: 0 !important;
}
#colophon .site-info .flex > div.form input.wpcf7-submit:hover{
	background: #D2CBC1;
	color: #2D261F;
}
.about .container .block .left .coll{
	transition: all 500ms cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */

	transition-timing-function: cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */
	cursor: pointer;
}
.about .container .block .left .coll:hover{
	background: #D2CBC1;
	color: #2D261F;
}

.about .container .block .left .mobile_button{
	transition: all 500ms cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */

	transition-timing-function: cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */
	cursor: pointer;
}
.about .container .block .left .mobile_button:hover{
	background: #D2CBC1;
	color: #2D261F;
}


.about .container .block .right .more{
	cursor: pointer;
	transition: all 500ms cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */

	transition-timing-function: cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */
}
.about .container .block .right .more:hover{
	background: #D2CBC1;
	color: #2D261F;
}

.about .container .block .right .mobile_button{
	cursor: pointer;
	transition: all 500ms cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */

	transition-timing-function: cubic-bezier(0.040, 0.335, 0.035, 0.995); /* custom */
}
.about .container .block .right .mobile_button:hover{
	background: #D2CBC1;
	color: #2D261F;
}


#colophon .site-info .h1{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 90px;
line-height: 109px;
letter-spacing: 8px;
text-transform: uppercase;

/* brown */
max-width: 100%;
text-align: left;
color: #2D261F;
}

#colophon .site-info{
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 15px;
}
#colophon{
	    padding-top: 180px;
}
#colophon .site-info > p.descr{
    font-family: Optima cyr;
    font-style: normal;
    font-weight: normal;
    font-size: 33px;
    line-height: 41px;
    letter-spacing: 8px;
    text-transform: uppercase;
    max-width: 622px;
    color: #75706A;
    margin: 14px auto;
        margin-bottom: 47px;
}
#colophon .site-info .flex{
	display: flex;
}
#colophon .site-info .flex > div{
	flex: 1;
    max-width: calc(50% - 120px);
    min-width: calc(50% - 120px);
    padding: 0 60px;
}
#colophon .site-info .flex > div.contacts{
	border-right: 2px solid #75706A;
}
#colophon .site-info .flex > div.contacts p{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 32px;
line-height: 39px;
/* identical to box height */

text-align: center;
letter-spacing: 4px;
text-transform: uppercase;

/* brown */

color: #2D261F;
}
#colophon .site-info .flex > div.contacts a{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 28px;
line-height: 34px;
/* identical to box height */

text-align: center;
letter-spacing: 4px;

/* brown */

color: #2D261F;
    display: block;
    margin-bottom: 60px;

}
#colophon .site-info .flex > div.form > p{
	font-family: Optima cyr;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 29px;
	text-align: center;
	letter-spacing: 4px;
	text-transform: uppercase;

	color: #000000;
}
#colophon .site-info .flex > div.form input{
	border: 1px solid #75706A;
box-sizing: border-box;
width: 100%;
border-radius: 0;
background: none;
height: 44px;
margin-bottom: 23px;
    margin-top: 3px;
}
#colophon .site-info .flex > div.form label{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 22px;
/* identical to box height */

letter-spacing: 4px;
text-transform: uppercase;

/* brown */

color: #2D261F;
}

#colophon .site-info .flex > div.form textarea{
	border: 1px solid #75706A;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 100%;
	border-radius: 0;
	background: none;
	min-height: 44px;
	margin-bottom: 23px;
    margin-top: 3px;
    max-height: 300px;
    height: 88px;
}
#colophon .site-info .flex > div.form input.wpcf7-submit{
	    background: #2D261F;
    font-family: Optima cyr;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: #D2CBC1;
    display: inline-block;
    width: auto;
    padding: 0 19px;
    border-radius: 0;
    -webkit-appearance: none;
}
input{
	padding: 10px;
}
textarea{
	padding: 10px;
}
#colophon .site-info .copyright .flex{
	justify-content: center;
	width: 50%;
	position: relative;
}
#colophon .site-info .copyright .flex p{
	font-family: 'Raleway';
}
#colophon .site-info .copyright .flex img{
	width: 78px;
}
.page-template-about{
	    background: #F5F3EF;
}
.page-template-services{
	    background: #F5F3EF;
}
.page-template-about .menu-menu-1-container ul li a{
	color: #2D261F;
}
.page-template-about section.main-banner .video .container{
	    overflow: hidden;
}
.page-template-about section.main-banner .video .container a{
	height: 180px;
    width: 170px;
    margin-right: -140px;
    z-index: 2;
    font-family: Optima Cyr;
    line-height: 34px;
    text-align: right;
    letter-spacing: 6px;
    text-transform: uppercase;
    color: #2D261F;
    transform: rotate(-90deg);
    font-size: 28px;
    position: inherit;
}

.page-template-services section.main-banner .video .container a{
	height: 180px;
    width: 170px;
    margin-right: -140px;
    z-index: 2;
    font-family: Optima Cyr;
    line-height: 34px;
    text-align: right;
    letter-spacing: 6px;
    text-transform: uppercase;
    color: #2D261F;
    transform: rotate(-90deg);
    font-size: 28px;
    position: inherit;
    top: 0;
}
.page-template-about  section.main-banner .video{
	height: auto;
	
}
.page-template-about section.main-banner{
	margin-bottom: 0;
}

.page-template-services  section.main-banner .video{
	height: auto;
	
}
.page-template-services section.main-banner{
	margin-bottom: 0;
}
.page-template-about .about .container{
	background: url(img/title.svg) no-repeat;

	background-size: 29%;

	max-width: 994px;
	background-position: 12% center;
	    margin-top: -100px;
}
.page-template-about .about .container p{
	padding-left: 42%;
	font-family: Raleway;
font-style: normal;
font-weight: 500;
font-size: 22px;
line-height: 144%;
/* or 32px */

text-transform: uppercase;

/* silver */

color: #75706A;

}
.page-template-about section.colobarate .h1{
	    text-align: right;
    max-width: 1140px;
    padding: 0 15px;
}
.about_partners .container{
    max-width: 1240px;
        margin: 0 auto;
}
.about_partners .container .h1{
	text-align: center;
    font-family: Optima;
    font-style: normal;
    font-weight: bold;
    font-size: 90px;
    line-height: 109px;
    letter-spacing: 8px;
    text-transform: uppercase;
    color: #2D261F;
    margin-top: 180px;
    padding-left: 10%;
}
.about_partners .container .flex_parnters{
	display: flex;

}
.about_partners .container .flex_parnters a{
	margin: 10px;
	width: calc(33.333% - 20px);
}
.about_partners .container .flex_parnters a img{
	width: 100%;
	    border: 4px solid transparent;
}
.about_partners .container .flex_parnters a img:hover{
	    border: 4px solid grey;
}
.advantages_about{
	background: url(img/advantages.png);
	    padding-top: 1px;
    margin-top: 160px;
}
.advantages_about .container{
	max-width: 1240px;
    margin: 0 auto;
}
.advantages_about .h1{
	    text-align: left;
    font-family: Optima;
    font-style: normal;
    font-weight: bold;
    font-size: 90px;
    line-height: 109px;
    letter-spacing: 8px;
    text-transform: uppercase;
    color: #2D261F;
    margin-top: -49px;
    padding-left: 20%;
}
.advantages_about .flex_adv{
	display: flex;
	    padding-bottom: 62px;
}
.advantages_about .flex_adv div p{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 24px;
line-height: 29px;
letter-spacing: 8px;
text-transform: uppercase;

/* brown */

color: #2D261F;
}
.advantages_about .flex_adv div span{
	font-family: Raleway;
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 144%;
/* or 26px */


/* brown */

color: #2D261F;
    margin-bottom: 8px;
}
.advantages_about .flex_adv div {
	margin: 20px;
}
.videoasdasddsa .slick-next.slick-arrow{
background: url(img/next_arrow.svg) no-repeat;
	background-position: center;
	width: 138px;
height: 20px;
right: auto;
    left: calc(13% + 85px);
    bottom: 35px;
    top: auto;
    transition: all 500ms cubic-bezier(0.055, 0.325, 0.010, 1.010); /* custom */

transition-timing-function: cubic-bezier(0.055, 0.325, 0.010, 1.010); /* custom */
}
.videoasdasddsa .slick-next.slick-arrow:hover{
	background: url(img/next_arrow_a.svg) no-repeat;
	background-position: center;
}
.videoasdasddsa .slick-next.slick-arrow::before, .videoasdasddsa .slick-prev.slick-arrow::before{
	content: none;

}
.videoasdasddsa .slick-prev.slick-arrow:hover{
	background: url(img/prew_arrow_a.svg) no-repeat;
	background-position: center;
}

.videoasdasddsa .slick-prev.slick-arrow{
background: url(img/prev_arrow.svg) no-repeat;
    background-position: center;
    width: 138px;
    height: 20px;
    right: auto;
        left: calc(13% - 85px);

    bottom: 35px;
    top: auto;
    transition: all 500ms cubic-bezier(0.055, 0.325, 0.010, 1.010);
    transition-timing-function: cubic-bezier(0.055, 0.325, 0.010, 1.010);
    z-index: 9;

}
.page-template-services section.services{
	    max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;
    margin-bottom: 180px;
}
.main-banner .video{
	    overflow-x: hidden;
}

.page-template-services section.services .block > div{
	display: flex;
	height: 200px;
	align-items: center;
	justify-content: center;
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 48px;
line-height: 58px;
text-align: center;
letter-spacing: 6px;
text-transform: uppercase;

/* brown */

color: #2D261F;
margin-bottom: 40px;

}
.page-template-services section.services .block > div.ext{
	background: url(img/ext.png) no-repeat;
	background-position: center;
	background-size: cover;
}


.page-template-services section.services .block > div.int{
	background: url(img/int.png) no-repeat;
	background-position: center;
	background-size: cover;
}
.page-template-services section.services .block > div.anm{
	background: url(img/anm.png) no-repeat;
	background-position: center;
	background-size: cover;
}
.page-template-services section.services .block > div.vrt{
	background: url(img/vrt.png) no-repeat;
	background-position: center;
	background-size: cover;
}
#portfolito{
	 max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;

}
#portfolito p.h1{
	font-family: Optima;
    font-style: normal;
    font-weight: bold;
    font-size: 90px;
    line-height: 109px;
    text-align: center;
    letter-spacing: 8px;
    text-transform: uppercase;
    text-align: left;
   
    color: #2D261F;
   
  
}
#portfolito .examples{
	display: flex;
}
.about .container .block .right .mobile_button{
	display: none;
}
#portfolito > div > .examples > div:nth-child(2){
	padding: 0 26px;
}
#portfolito > div > .examples > div{
	flex: 1;
	max-width: 33%;
}
#mobile_navigation{
	display: none;
}

#portfolito > div > .examples > div img{
	width: 100%;

    margin-bottom: 18px;

}

body.page-template-services section.services .block.active.first .ext + section{
height: auto;
    padding-bottom: 40px;
}

body.page-template-services section.services .block.active > div{
	    height: 91px;
    background: #D2CBC1;
    margin-bottom: 14px;
}
body.page-template-services section.services .block > div{
	transition: all 900ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
}
body.page-template-services section.services .block > div + section iframe:nth-child(2){
	margin: 0 20px;
}

body.page-template-services section.services .block > div.active{
	transition: all 900ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
border: 1px solid #2D261F;

}
body.page-template-services section.services .block > div.active + section{
	height: 522px;
	padding-bottom: 40px;
	opacity: 1;
}
.page-template-services .menu-menu-1-container ul li a {
    color: #2D261F;
}
.menu-menu-1-container ul li a{
	transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
	background: #6484aaab;

}
.menu-menu-1-container ul li a:hover{
background: #D2CBC1;
color: black;
}
section.main-banner .video .container a{
	transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
}
section.main-banner .video .container a:hover{
	color: black;
}
.page-template-services section.main-banner .video .container a{
	transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
}
.page-template-services section.main-banner .video .container a:hover{
	opacity: 0.7;
}
body.page-template-services section.services .block > div + section{
	height: 0;
	overflow: hidden;
	opacity: 0;
	display: flex;
	transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

}
body.page-template-services section.services .block > div + section > *{
	flex: 1;
	max-width: 64%
	}
	
body.page-template-services section.services .block > div + section > img:nth-child(2){
	margin: 0 20px;

}
body.page-template-services section.services .block > div + section p{
	font-family: Raleway;
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 144%;
/* or 26px */

text-transform: uppercase;

/* silver */

color: #75706A;
}
section.services .flex.active > div{
	max-width: 110px;
	margin-right: 10px;
	background: #D2CBC1;
	transition: all 900ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

}
section.services .flex > div.active{
border: 1px solid #2D261F;

}

section.services .flex section {
	opacity: 0;
	max-width: 0;
    flex: 1;
    margin-right: 10px;
    overflow: hidden;
    transition: all 900ms cubic-bezier(0.250, 0.250, 0.015, 0.990);
    transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990);
}

section.services .flex video {
	opacity: 0;
	max-width: 0;
    flex: 1;
    margin-right: 10px;
    overflow: hidden;
    transition: all 900ms cubic-bezier(0.250, 0.250, 0.015, 0.990);
    transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990);
}
section.services .flex  div.active + section {
	max-width: 100%;
	opacity: 1;
}
section.services .flex  div.active + section video {
	max-width: 100%;
	opacity: 1;
}
section.services .flex section  p{
 font-family: Raleway;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 144%;
    text-transform: uppercase;
    padding: 30px;
    color: #2D261F;
    background: #ffffff5e;
    margin: 50px;
}
/*section.services .flex div.anm + section{
    background: none !important;
    position: relative !important;
    display: flex;
}*/

/*section.services .flex div.anm + section p{
    position: absolute;
    top: 80px;
}*/
.home section.services .flex > div{
	
	
}
section.services .flex section p{
	max-height: 400px;
}
.services .block{
	min-height: 990px;
}


#masthead .site-branding img{
	opacity: 0;
		transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
}
#masthead .site-branding img.active{
	opacity: 1;
}





#primary-menu{
	opacity: 0;
		transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
}
#primary-menu.active{
	opacity: 1;
}
section.main-banner .video .container .content{
	margin-top: -200px;
	opacity: 0;
		transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
}
section.main-banner .video .container .content.active{
	margin-top: 0;
	opacity: 1;
}

section.main-banner .video .container a{
	margin-right: 0;
	opacity: 0;
	transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
}

section.main-banner .video .container a.active{
	margin-right: -70px;
	opacity: 1;
	
}
.page-template-about section.main-banner .video .container a.active{
	top:0;
}
#modal_form{
	display: none;
}
#modal_form.active{
	display: block;
	text-align: center;
}
#modal_form .podlogka{
	position: fixed;
	width: 100%;
	height: 100vh;
	background: black;
	opacity: 0.6;
	    top: 0;
	    left: 0;

}
#modal_form .forma{
	position: fixed;
    top: 10vh;
    background: url(img/popup_form.png);
    width: 900px;
    height: 600px;
    left: calc(50% - 450px);
    background-size: cover;
    background-position: center;
	z-index: 99999;
}

#modal_form .forma > p{
	font-family: Optima;
font-style: normal;
font-weight: bold;
font-size: 38px;
line-height: 46px;
text-align: center;

/* brown */

color: #2D261F;
margin-top: 50px;
}
#modal_form .forma > div{
	    width: calc(58% - 200px);
    padding: 35px 100px;
}
#modal_form .forma > div > span{
	font-family: Raleway;
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 144%;
/* or 26px */

text-transform: uppercase;

/* silver */

color: #75706A;
text-align: left;
    display: flex;
        margin-bottom: 24px;
}
#modal_form .forma > div input{
	background: #F5F3EF;
/* brown */

border: 2px solid #2D261F;
box-sizing: border-box;
height: 40px;
    width: 100%;
margin-bottom: 24px;
font-size: 18px;
line-height: 21px;
}
#modal_form .forma > div input.wpcf7-form-control.wpcf7-submit{
	background: #2D261F;
height: 50px;
font-family: Raleway;
font-style: normal;
font-weight: 600;
font-size: 18px;
line-height: 21px;
text-align: center;
text-transform: uppercase;

/* beige */

color: #D2CBC1;margin-top: 15px;
}
#modal_form .forma > div input::placeholder{
	font-family: Raleway;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 21px;


/* silver */

color: #75706A;


}
.videoasdasddsa{
	overflow: hidden;
}
#modal_form #exit_form{
	background: url(img/close.svg) no-repeat;
	background-position: center;
	background-size: cover;
	width: 40px;
	height: 40px;
	position: absolute;
	    padding: 0;
    right: 0;
    cursor: pointer;
}
.contacts .networks{
 display: flex;
 justify-content: center;
}
.contacts .networks a{
	width: 40px; 
	height: 40px;

}
.contacts .networks a.pint{
	background: url(img/pint.svg) no-repeat;
	background-position: center;

}
.contacts .networks a.inst{
	background: url(img/inst.svg) no-repeat;
	background-position: center;
	margin-left: 10px;
    margin-right: 10px;
	
}
.contacts .networks a.be{
	background: url(img/be.svg) no-repeat;
	background-position: center;
	
}
#developer{
	background: url(img/development.svg) no-repeat;
	background-position: center;
	width: 40px;
	height: 100px;
	position: absolute;
	bottom: 20px;
    left: 0;
}
.copyright{
	margin-bottom: 40px;
}
.mobile_button{
	display: none;
}
#masthead .site-branding a{
	width: 100%
}
#portfolito .examples.mobile{
	display: none;
}

#preloader{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
    background: #D2CBC1;
    z-index: 999999;
    transition: all 500ms cubic-bezier(0.250, 0.250, 0.000, 1.000); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.000, 1.000); /* custom */
}
#preloader img{
    width: 330px;
}
#preloader.hidden{
	display: none !important;
}
#preloader.opacity{
	opacity: 0;
}

 section.services .slider .slide{
		height: 528px;
		margin: 8px;
	
	}

body.page-template-services section.services .block > div + section video{
	max-width: 864px;
    margin-left: 30px;
}


body.page-template-services .slick-prev:before, body.page-template-services .slick-next:before{
	    color: white;
    font-family: poppins;
    opacity: 1;
    font-size: 49px;
}
body.page-template-services .slick-prev{
	left: 19px;
	z-index: 99;
}
body.page-template-services .slick-next{
	right:  43px;
	z-index: 99;
}
@media (max-width: 900px) {
	#portfolito  .examples{
		display: none !important;
	}
	#portfolito  .examples.mobile{
	display: flex !important;
}
#developer{
	display: none;
}

	#mobile_navigation{
		display: block;
		position: relative;
		    z-index: 9;
	}
	#site-navigation{
		display: none;

	}
	section.main-banner .video{
		/*max-height: 380px;*/
	}
	.mobile_button{
		display: block;
	}
	#mobile_trigger{
		background: #D2CBC1;
	    height: 44px;
	    width: 72px;
	    position: absolute;
	    right: -17px;
	    top: 13px;
	    font-family: Optima;
	    font-style: normal;
	    font-weight: bold;
	    font-size: 12px;
	    line-height: 15px;
	    display: flex;
	    align-items: center;
	    letter-spacing: 4px;
	    text-transform: uppercase;
	    color: #2D261F;
	    transform: rotate(-90deg);
	    justify-content: center;
	    padding-left: 6px;
	}
	#masthead .site-branding img {
    width: calc(100% - 0px);
    max-width: 1300px;
    padding: 10px 0px;
}
body.page-template-services section.services .block > div + section iframe:nth-child(2) {
    margin: 0 0px;
    max-width: 99% !important;
    height: auto !important;
}

body.page-template-services section.services .block > div + section > *:last-child {
    /* display: none; */
    margin: 0 0px;
    max-width: 99% !important;
    height: auto !important;
}
	section.main-banner .video .container .content {
	    position: absolute;
	    top: 80px;
	    z-index: 1;
	    left: 10px;
	    max-width: 77px;
	}
	#masthead .site-branding{
		padding: 0 10px;
	}
	section.main-banner .video .container a{
		display: none;
	}
	.main-banner {
	    margin-bottom: 50px;
	}
	.about .container .h1{
    	margin-bottom: -15px;
        font-size: 24px;
        line-height: 29px;
	}
	section.services .flex div.anm + section p {
   /* position: absolute;
    top: 30%;*/
}
	.about .container{
		    padding: 0 0px;
	}
	.about .container .block .right{
		order: -1;
		max-width: 62%;
	}
	.about .block {
    background: url(img/about_mob.png) no-repeat;
    background-size: cover;
    background-position: 60% center;
    display: flex;
}
	.about .block > div {
    flex: 1;
    max-width: 50%;
}
section.services .flex section p {
    max-height: 155px;
}
section.services .flex.active > div{
	    max-width: 23px;
    margin-right: 4px;
   
}
	section.services .flex section p{
		  font-size: 10px;
    line-height: 131%;
    text-transform: none;
    padding: 13px;
    
    font-weight: 400;
    text-transform: uppercase;
    margin: 6px !important;
    padding: 6px !important;
	}
	.about .container .block .left{
		justify-content: flex-end;
	}
	section.services .flex section{
		margin-right: 4px;
	}
	.about .container .block .right p {
    font-family: Raleway;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 140%;
    padding: 16px 14px;
    text-align: left;
    color: #2D261F;
    text-transform: uppercase;
    padding-right: 20px;
    padding-bottom: 14px;
    margin-left: 10px;
    margin-top: 12px;
    margin-right: -36px;
}
	.about .container .block .right {
    text-align: left;
}
	.about .container .block .right .more{
		border: 1px solid #2D261F;
    font-family: Optima cyr;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    letter-spacing: 4px;
    text-transform: uppercase;
    padding: 14px 17px;
    color: #d2cbc1;
    display: inline-block;
    margin-bottom: 50px;
    margin-right: 100px;
    background: #2d261f;
    display: none;
	}

	.about .container .block .right .mobile_button{
		    text-transform: uppercase;
	    padding: 12px 12px;
	    color: #2D261F;
	    display: inline-block;
	    margin-bottom: 17px;
	    margin-right: 0;
	    background: #2D261F;
	    border: 1px solid #2D261F;
	    font-size: 12px;
	    line-height: 15px !important;
	    font-weight: bold;
	    margin-left: 13px;
	    text-transform: uppercase;
    margin-bottom: 18px;
    margin-left: 18px;
    padding: 9px 12px;
    color: #D2CBC1;
    font-size: 12px;
    line-height: 22px;
	}

	.about .container .block .left .coll{
		    text-transform: uppercase;
    margin-bottom: 18px;
    margin-left: 18px;
    padding: 9px 12px;
    color: #D2CBC1;
    font-size: 12px;
    line-height: 22px;
    display: none;
	}
	input{
		    -webkit-appearance: none !important;
		    border-radius: 0;
	}
	.about .container .block .left .mobile_button{
		    text-transform: uppercase;
    margin-bottom: 18px;
    margin-left: 18px;
    padding: 9px 12px;
    color: #D2CBC1;
    font-size: 12px;
    line-height: 22px;
        text-transform: uppercase;
    padding: 9px 12px;
    color: #2D261F;
    display: inline-block;
    margin-bottom: 17px;
   margin-right: 14px;
    background: #D2CBC1;
    border: 1px solid #2D261F;
    font-size: 12px;
    line-height: 15px !important;
    font-weight: bold;
    margin-left: 13px;
	}

	.clients .container .flex div p{
		font-size: 12px;
    line-height: 15px;
    letter-spacing: 2px;
	}
	.clients .container .flex div .number{
		      font-size: 27px;
    line-height: 43px;
    text-align: center;
	}
	.clients .container .flex{
		justify-content: center;
	}
	.clients .container .flex div {
	    text-align: center;
	    margin: 0 14px;
	}

	section.services .h1{
		font-size: 24px;
    	line-height: 29px;
	}
	section.clients {
	    margin-bottom: 69px;
	}
	#portfolito > div > div > div.column{
		display: flex;
		flex-wrap: wrap;
	}
	.services .block{
		min-height: 100px;
	}
	#portfolito > div > div > div.column a{
		width: calc(50% - 6px);
    margin: 3px;
	}
	#portfolito > div > div > div.column a img{
		    margin-bottom: 0;
	}
	section.services .flex > div {
	    height: 430px;
	    margin-right: 8px;
	    flex: 1;
	    display: flex;
	    align-items: center;
	    justify-content: center;
	    min-width: 20px;
	}
	section.services .flex section, section.services .flex video{
	    max-height: 430px !important;
	    height: 430px;
	    margin-right: 4px;
	}
	section.services .flex > div p {
    font-family: Optima;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 15px;
    text-align: center;
    letter-spacing: 6px;
    text-transform: uppercase;
    color: #2D261F;
    transform: rotate(-90deg);
    min-width: 150px;
}
	section.colobarate .h1 {
	   
	    font-size: 24px;
	    line-height: 79px;
	    letter-spacing: 8px;
	   
	    color: #2D261F;
	    margin: 0 auto;
	    max-width: 524px;
	    position: relative;
	    top: -16px;
	    line-height: 29px;
	    text-align: center;
	    padding-right: 20%;
	}
	section.colobarate .container p{
		text-align: center !important;
		font-size: 12px;
    line-height: 14px;
    letter-spacing: 2px;
	}
	section.colobarate .container .collaborate{
		    font-size: 13px;
    line-height: 22px;
    text-align: center;
        padding: 9px 14px;
    margin: 14px auto 1px;
	}
	section.colobarate{
		margin-top: 72px;
	}
	section.colobarate .container{
		padding-bottom: 20px;
	}
	#mobile_navigation.active #primary-menu{
		opacity: 1;
	}
	#colophon {
    padding-top: 40px;
}
	#colophon .site-info .h1{
		font-size: 24px;
    line-height: 29px;
    letter-spacing: 4px;
	}
	#colophon .site-info > p.descr{
		margin: 14px auto;
    margin-bottom: 25px;
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 2px;
    max-width: 240px;
    text-align: center;
	}
	#colophon .site-info .flex{
		flex-direction: column;
    max-width: 240px;
    margin: 0 auto;
	}
	#colophon .site-info .flex > div.contacts{
		order: 2;
	}
	#colophon .site-info .flex > div {
	    flex: 1;
	    max-width: 100%;
	    min-width: 100%;

	    padding: 0;
	}
	#colophon .site-info .flex > div.form > p{
		display: none;
	}
	#colophon .site-info .flex > div.form label{
		font-size: 10px;
    line-height: 12px;
	}
	#colophon .site-info .flex > div.form input{
		    height: 36px;
    margin-bottom: 10px;
    margin-top: 3px;
	}
	#colophon .site-info .flex > div.form textarea{
		margin-bottom: 11px;
	}
	#colophon .site-info .flex > div.form input.wpcf7-submit{
		height: 40px;    width: 100%;
		font-size: 12px;
    line-height: 22px;
	}
	#colophon .site-info .flex > div.contacts {
    border-right: none;
}
	#colophon .site-info .flex > div{
		margin-bottom: 9px;
	}
	#colophon .site-info .flex > div.contacts a{
		font-size: 15px;
		margin-bottom: 48px;
		letter-spacing: 2px;
	}
	#colophon .site-info .flex > div.contacts p{
		font-size: 27px;
	}
	#colophon .site-info .copyright .flex p{
		    display: flex;
    font-size: 12px;
	}
	#colophon .site-info .copyright .flex {
    justify-content: center;
    width: 100%;
}
.page-template-about .about .container{
	    background-position: top center;
    margin-top: 0;
    padding-top: 151px;
    background-size: 120px;
}
#masthead .site-branding{
	max-height: 73px;
}
	.page-template-about .about .container p{
		padding: 0 10px;
    max-width: 275px;
    margin: 0 auto;
    font-size: 12px;
	}
	.about_partners .container .h1 {
	    text-align: center;
	    font-family: Optima;
	    font-style: normal;
	    font-weight: bold;
	    font-size: 24px;
	    line-height: 29px;
	    letter-spacing: 4px;
	    text-transform: uppercase;
	    color: #2D261F;
	    margin-top: 65px;
	    padding-left: 30%;
	    text-align: center;
	}
	.videoasdasddsa .slick-next.slick-arrow, .videoasdasddsa .slick-prev.slick-arrow{
		display: none !important;
	}
	.advantages_about .h1{
		    font-size: 30px;
	    line-height: 49px;
	    margin-top: -24px;
	    padding-left: 15%;
	}
	.advantages_about{
		margin-top: 80px;
    background: none;
	}
	.advantages_about .flex_adv{
		flex-wrap: wrap;
	}
	.advantages_about .flex_adv div{
		width: calc(50% - 26px);
    margin: 13px;
	}
	.advantages_about .flex_adv div p{
		font-size: 14px;
	    line-height: 17px;
	    letter-spacing: 0;
	}
	.advantages_about .flex_adv div span{
		font-weight: 500;
		font-size: 12px;
		line-height: 144%;
		text-transform: uppercase;
	}
	.page-template-services section.services{
		margin-top: 59px;
	}
	.page-template-services section.services .block > div{
		height: 76px;
		margin-bottom: 10px;
	}
	.page-template-services section.services .block > div{
		font-size: 20px;
	}
	#mobile_navigation.active .menu-menu-1-container{
	    width: 100%;
	
	    height: 330px;
	    background: #D2CBC1
	}
	#preloader img{
    width: 190px;
}
	#upbutton{
		    width: 35px;
    height: 35px;
    background-size: 100%;
	}
	#upbutton:hover{
		background: url(img/upArrow_a.svg) no-repeat;
    background-position: center;
    background-size: 100%;
	}
	.menu-menu-1-container{
		width: 0;
		overflow: hidden;
		transition: all 500ms cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.015, 0.990); /* custom */
height: 330px;
	}
	body.page-template-services section.services .block > div.active + section{
		height: auto;
		display: block;
		
	}
	#mobile_navigation .networks{
 display: flex;
 justify-content: center;
 position: absolute;
 top: 20px;
 opacity: 0;
 top: 270px;
 width: 100%;
}
#mobile_navigation.active .networks{
transition: all 1100ms cubic-bezier(0.860, 0.015, 0.810, 0.175); /* custom */
z-index: 9;
transition-timing-function: cubic-bezier(0.860, 0.015, 0.810, 0.175); /* custom */
opacity: 1;
}
#mobile_navigation .networks a{
	width: 40px; 
	height: 40px;

}
#mobile_navigation .networks a.pint{
	background: url(img/pinter_w.svg) no-repeat;
	background-position: center;

}
#mobile_navigation .networks a.inst{
	background: url(img/inst_w.svg) no-repeat;
	background-position: center;
	margin-left: 10px;
    margin-right: 10px;
	
}
#mobile_navigation .networks a.be{
	background: url(img/behance_w.svg) no-repeat;
	background-position: center;
	
}

	.page-template-services section.services{
		padding: 0;
	}
	section.services .slider .slide {
    height: 228px;
    margin: 0;
}

body.page-template-services section.services .block > div + section > *:last-child{
	/*	display: none;*/
	}
	body.page-template-services section.services .block > div + section > *{max-width: 100%;padding: 0 2%;}
	
	body.page-template-services section.services .block > div.vrt + section p{
	/*	font-size: 10px;*/
        line-height: 140%;
        padding-left: 10px;
        text-transform: uppercase;
	}
	section.main-banner .video .container .content img{
		width: 100px;
	}
	.menu-menu-1-container ul li a{
		color: #ffffff;
	}
	#exit_menu{
		display: none;
	}
	#mobile_navigation.active #exit_menu{
		display: block;
    position: absolute;
    color: white;
    top: -6px;
    right: 10px;
    z-index: 9;
    transform: rotate(45deg);
    font-size: 34px;

	}
	#portfolito p.h1{
		font-size: 25px;
    line-height: 37px;
	}
	#portfolito .examples {
    display: flex;
    flex-direction: column;
}
	#portfolito > div > .examples > div {
	    flex: 1;
	    max-width: 100%;
	}
	#portfolito > div > .examples > div:nth-child(2) {
	    padding: 0;
	}
	#portfolito > div > .examples > div img{
		width: 100%;
		margin-bottom: 10px;
	}
	.page-template-services section.services{
		margin-bottom: 60px;
	}
	body{
		overflow-x: hidden;
	}
	#modal_form .forma{
		left: 0;
		width: 100%;
		background: #f5f3ef;
		top: auto;
		bottom: 0;
	}
	#modal_form .forma > div input{
		margin-bottom: 14px;
	}
	#modal_form .forma > div {
    width: calc(100% - 60px);
    padding: 9px 30px;
}
	#modal_form .forma > p{
		    font-size: 30px;
    line-height: 35px;
        margin-top: 28px;
	}
	#modal_form .forma > div > span{
		font-size: 15px;
		margin-bottom: 17px;
	}
	#modal_form .forma{
		height: 460px;
	}
	span.wpcf7-not-valid-tip {
    color: #f00;
    font-size: 1em;
    font-weight: normal;
    display: block;
    height: 7px;
    margin-top: -10px;
}

	.about_partners .container .flex_parnters .slick-list{
		max-width: 70%;
		overflow: visible;
	}
	body.page-template-services section.services .block.active > div{
		height: 41px;
	}
	.about_partners .container .flex_parnters{
		overflow-x: hidden;
	}
	#portfolito > div > .examples > div {
    flex: 1;
    max-width: 50%;
}
	#portfolito .examples.mobile{
		flex-direction: row;
	}
	#portfolito .column_sec{
		display: block;
	}
	section.services .flex section p {
        max-height: 900px;
        background: #ffffff82;
        margin: 15px;
    }
	#portfolito > div > div > div.column a {
    width: calc(100% - 10px);
    margin: 5px;
    
}
#portfolito > div > div > div.column_sec a {
    width: calc(100% - 10px);
    margin: 5px;
    
}

	#portfolito > div > div > div.column {
    display: flex;
    flex-wrap: no-wrap;
    flex-direction: column;
}
#portfolito > div > div > div a img{
	width: 100%;
	margin-bottom: 0 !important;
}
}
@media (min-width: 1700px){
	.about .container {
	    max-width: 1670px;
	    padding: 0 15px;
	    margin: 0 auto;
	}
	.about .container .block .left .coll,.about .container .block .right .more{
		padding: 23px 34px;
		font-size: 21px;
	}
	.about .container .block .right p{
		font-size: 26px;
	}

	.clients .container{
		max-width: 1091px;
	}
	.clients .container .flex div p{
		font-size: 49px;
	}
	.clients .container .flex div .number{
		font-size: 73px;
    line-height: 93px;
	}
	section.services .container{
		max-width: 1570px;
	}
	#colophon .site-info{
		    max-width: 1400px;
	}
	.page-template-about .about .container{
		    background-size: 22%;
    max-width: 1294px;
	}
	.advantages_about .container{
		    max-width: 1500px;
	}
	.advantages_about .flex_adv div span{
		font-size: 21px;
	}
	.advantages_about .flex_adv div p{
		font-size: 28px;
    line-height: 49px;
	}
	.page-template-services section.services{
		    max-width: 1580px;
	}
	.page-template-services section.services .block > div{
		font-size: 68px;
	}
	.page-template-services section.services .block > div{
		height: 240px;
		
	}
	body.page-template-services section.services .block.active > div{
		height: 129px;	
	}
	body.page-template-services section.services .block > div.active + section{
		height: 623px;	
	}
	#portfolito{
		max-width: 1570px;
	}
	#masthead .site-branding img{
		max-width: 1950px;
	}
	section.services .flex > div{
		height: 720px;	
	}
	section.services .flex > div p{
		    font-size: 58px;
	}
}