header {
			height: 120px;
		}
		
		header .menu .logo {
			background: url('../img/logo_desktopw.png') 0 0 no-repeat;
			filter: invert(0);
			transition: filter 250ms ease-out;
		}
		
		header, 
		#articles {
			z-index: 1;
		}
		
		header .menu {
			transition: opacity 250ms ease-out, top 250ms ease-out;
			height: 70px !important;
		}
		
		header .menu a {
			color: #fff;
			transition: color 250ms ease-out;
		}
		
		header .menu a:hover, 
		header .menu a.active {
			color: #fff;
		}
		
		.promo.index {
			background: transparent;
			height: 260px;
		}
		
		.promo .h2-h1, 
		.promo .h2-h1 span {
			text-align: center;
			color: #fff;
		}
		
		.square {
			position: fixed !important;
			z-index: 0 !important;
			top: 0;
			left: 0;
		}

.index .stat {
    position: fixed;
    bottom: 0;
    padding: 0;
    width: 100%;
}
.index .stat .statistics {
    height: auto;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 0;
    width: auto;
}
.index .stat .statistics ins {
    font-size: 58px;
    color: #fff;
    margin: 0 35px;transition: color 250ms ease-out;
}
.index .stat .statistics ins span{ color: #fff;font-size:18px;}
	body.index.white .stat .statistics * {
		color: black !important; 
	}
	
		html, 
		body {
			margin: 0;
			padding: 0;
		}
		

		.square {
			position: relative;
			width: 100vw;
			height: 100vh;
		}
		
		.slide {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			opacity: 0;
			_display: none;
			transition: opacity 250ms ease-out;
		}
		
		.slide-active {
			opacity: 1;
			_display: block;
		}
		
		.slide .slide-back {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-repeat: no-repeat;
			background-size: cover;
			z-index: 5;
		}
		
		.slide .slide-sector {
			position: absolute;
			width: 50%;
			height: 50%;
			z-index: 10;
			background-repeat: no-repeat;
		}
		
		.slide-1 .slide-back {
			background-image: url('../img/sector-1-back.jpg');
			background-position: left top;
		}
		
		.slide-1 .slide-sector {
			top: 0;
			left: 0;
			background-image: url('../img/sector-1.jpg');
			background-position: left top;
		}
		
		.slide-2 .slide-back {
			background-image: url('../img/sector-2-back.jpg');
			background-position: right top;
		}
		
		.slide-2 .slide-sector {
			top: 0;
			left: 50%;
			background-image: url('../img/sector-2.jpg');
			background-position: right top;
		}
		
		.slide-3 .slide-back {
			background-image: url('../img/sector-3-back.jpg');
			background-position: left bottom;
		}
		
		.slide-3 .slide-sector {
			top: 50%;
			left: 0;
			background-image: url('../img/sector-3.jpg');
			background-position: left bottom;
		}
		
		.slide-4 .slide-back {
			background-image: url('../img/sector-4-back.jpg');
			background-position: right bottom;
		}
		
		.slide-4 .slide-sector {
			top: 50%;
			left: 50%;
			background-image: url('../img/sector-4.jpg');
			background-position: right bottom;
		}
		
		.compass {
			position: absolute;
			width: 210px;
			height: 210px;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			background-image: url('../img/compass.png');
			background-repeat: no-repeat;
			filter: invert(100%);
			transition: filter 250ms ease-out;
			z-index: 20;
		}
		
		.compass-arrow {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			background-image: url('../img/compass-arrow.png');
			background-repeat: no-repeat;
		}
		
		.main-title {
			position: absolute;
			width: 100%;
			left: 50%;
			top: 0;
			top: 100px;
			transform: translateX(-50%);
		}
		.index .stat {opacity:0;			transition-property: opacity;
			transition-duration: 50ms;
			transition-timing-function: ease-out;
}
		.index .stat.active {opacity:1;}
		.main-title {
			transition-property: opacity;
			transition-duration: 50ms;
			transition-timing-function: ease-out;
		}
		body.zero-2 .main-title {
			opacity: 0 !important;
			top: -50% !important;
			left: 50% !important;
			margin-left: 0 !important;
			margin-top: 0 !important;
		}
		
		.main-title h1 {
			margin: 0;
			text-align: center;
			color: white;
			font-size: 48px;font-size: 40px;
			
		}
		.main-title h1, .main-title h1 * {
			transition: color 250ms ease-out;
		}

		
 
		
		
		.main-title h1 div {
			font-size: 42px !important;font-size:35px !important;
			color: white;
		}
		
		.four-services {
			position: absolute;
			left: 0;
			top: 0; 
    			top: 50px;
			width: 100vw;
			height: 100vh;
			z-index: 1000;    z-index: 1;
		}
		
		
		

		
		.four-services .service {
			position: absolute;
			width: 380px;
			height: 120px;height:80px;
			opacity: 1;
			transition-property: opacity, left, top, margin-top, margin-left;
			transition-duration: 250ms;
			transition-timing-function: ease-out;
		}
		.four-services .service a span{
			font-size: 24px;font-size: 25px;}
		.four-services .service a {
			font-size: 24px;font-size: 25px;
			font-weight: 600;
			border-bottom: 1px solid rgba(255, 255, 255, 0.3);
			color: white;
			transition: color 250ms ease-out, border-bottom-color 250ms ease-out;
			text-decoration: none;
		}
		
		.four-services .service p {
			margin-top: 20px;
			font-size: 15px;
			font-weight: 400;
			line-height: 1.7;
			color: white;
			transition: color 250ms ease-out;
		}
		
		.four-services .service:nth-child(1) {
			left: calc(50% - 360px);
			top: calc(50% - 120px);
			margin-top: -90px;
			margin-left: -100px;
		}
		
		.four-services .service:nth-child(2) {
			left: 50%;
			top: calc(50% - 120px);
			margin-top: -90px;
			margin-left: 150px;
		}
		
		.four-services .service:nth-child(3) {
			left: calc(50% - 360px);
			top: 50%;
			margin-top: 90px;
			margin-left: -100px;
		}
		
		.four-services .service:nth-child(4) {
			left: 50%;
			top: 50%;
			margin-top: 90px;
			margin-left: 150px;
		}
		
		body.white .service a {
			color: black !important;
			border-bottom-color: rgba(0, 0, 0, 0.3) !important;
		}
		
		body.white .service p {
			color: black !important;
		}
		
		body.white header .menu a {
			color: black;
		}
		
		body.white .compass {
			filter: invert(0);
		}
		
		body.white header .menu .logo {
			filter: invert(100%) !important;
		}
		
		body.zero .four-services .service {
			opacity: 0 !important;
			top: 50% !important;
			left: 50% !important;
			margin-left: 0 !important;
			margin-top: 0 !important;
		}

		body.zero header .menu {
			opacity: 0 !important;
			top: -50px !important;
		}
		

.index .menu_toggle {
    filter: invert(1);
}
.index.white .menu_toggle {
    filter: invert(0);
}

nav { 
    z-index: 10;
}
  .menu_toggle { 
    position: fixed;
    top: 40px;
    right: 40px;
    left: auto;
}
nav .clo { 
    top: 20px;
    right: 40px; }





@media screen and (max-width: 1600px) and (min-width: 1024px) {
		.four-services .service:nth-child(1) {
			left: calc(50% - 370px);
			top: calc(50% - 120px);
			margin-top: -40px;
			margin-left: -100px;
		}
		.four-services .service:nth-child(2) {
			left: 50%;
			top: calc(50% - 120px);
			margin-top: -40px;
			margin-left: 80px;
		}
		.four-services .service:nth-child(3) {
			left: calc(50% - 370px);
			top: 50%;
			margin-top: 40px;
			margin-left: -100px;
		}
		.four-services .service:nth-child(4) {
			left: 50%;
			top: 50%;
			margin-top: 40px;
			margin-left: 80px;
		}
		.main-title h1 {font-size:36px;font-size:30px;}
		.main-title h1 div { font-size: 30px !important;font-size: 25px !important;}
} 





body.white .main-title h1, body.white .main-title h1 * {
	color: black !important; 
} 



 
.testindex .four-services .service p {
    font-size: 1.2vw;}
.testindex .four-services .service a {
    font-size: 1.6vw;}
.testindex .four-services .service {
    width: 30vw;
    height: 80px;}
.testindex .four-services .service:nth-child(1) {
    left: calc(50% - 20vw);
    top: calc(50% - 8vw);
    top: calc(50% - 80px);
    top: calc(50% - 120px);
    margin-top: -5vw;
    margin-left: -20vw;
}
.testindex .four-services .service:nth-child(2) {
    left: 50%;
    top: calc(50% - 8vw);
    top: calc(50% - 80px);
    top: calc(50% - 120px);
    margin-top: -5vw;
    margin-left: 10vw;
}
.testindex .four-services .service:nth-child(4) {
    left: 50%;
    top: 50%;
    top: calc(50% - 60px);
    margin-top: 5vw;
    margin-left: 10vw;
}	
.testindex .four-services .service:nth-child(3) {
    left: calc(50% - 30vw);
    top: 50%;
    top: calc(50% - 60px);
    margin-top: 5vw;
    margin-left: -10vw;
}	
.testindex.index .stat .statistics ins {
    font-size: 3vw;line-height: 1.6vw;}	
.testindex.index .stat .statistics ins span { 
    font-size: 1.2vw;
    display: block;
    margin-top: 0.5vw;
}	
.testindex .main-title h1 { 
    font-size: 3vw;
    line-height:1;
}	
.testindex .main-title h1 div {font-size: 2.3vw !important;}
.testindex header {
    z-index: 2;
}	
.testindex .wrap {
    width: 100vw;
    margin: 0 auto;
    text-align: center;
} 
.compass-arrow { 
    background-size: cover;
}	
.compass { 
    width: 15vw;
    height: 15vw;
    background-size: 100%;
}	
	
.slide-4 .slide-back { 
    background-position: right center;
}

.slide-4 .slide-sector { 
    background-position: right 70%;
    background-size: 200% auto;
}	
.slide-3 .slide-back { 
    background-size: 100% auto;
    background-position: left 66%;
}	
.slide-3 .slide-sector { 
    background-size: 200% auto;
    background-position: left 75%;
}	
	












	


	
	
.m_bg { 
    background: transparent;
}


html, body { 
    height: 100%;    min-height: 600px;
}

nav .mnu .wrap {     width: 1200px;
    text-align: left;
}


nav .mnu {
    font-size: 0;
    margin-top: 130px; 
    overflow: auto;
    left: 25px;
}
 .menu_toggle {
    position: absolute;
    top: 20px;
    right: 10px;
    left: auto;
    width: 64px;
    height: 64px;z-index: 2;
    background-position: center center;
}
nav .clo {
    top: 20px;
    right: 10px;
    background-position: center center;
}
 
 
nav.active { 
    overflow: hidden;
}

nav .mnu { 
    overflow: auto;
    left: 25px;
}



.main-title, .main-title div,
.testindex .four-services .service a { 
    font-family: 'Circe',Arial;
} 

.testindex.index.sz700 .main-title {}
.testindex.index.sz700 .main-title h1 {font-size: 33.61px;      font-size: 28px;  line-height: 1.04;}
.testindex.index.sz700 .main-title h1 div {font-size: 27px !important;font-size: 22px !important;}
.testindex.index.sz700 .four-services .service a span {font-size: 25px;}
.testindex.index.sz700 .four-services .service p {font-size: 14px;line-height: 1.4;}
.testindex.index.sz700 .index .stat .statistics {}
.testindex.index.sz700 .stat .statistics ins {font-size: 50px;}
.testindex.index.sz700 .stat .statistics ins span {font-size: 17px;    margin-top: 0; padding-top: 20px;}
.testindex.index.sz700 .stat .statistics {  bottom: 16px;}
.sz700 .four-services .service {width:340px;height:80px;}
.testindex.index.sz700 .service:nth-child(1) {    margin: 0;
    	left: calc(50% - 340px - 145px);
    	top: calc(50% - 130px - 35px);
}
.testindex.index.sz700 .service:nth-child(2) {     margin: 0;
    	left: calc(50% + 145px);
    	top: calc(50% - 130px - 35px);
}
.testindex.index.sz700 .service:nth-child(3) {     margin: 0;
    	left: calc(50% - 340px - 145px);
    	top: calc(50% + 5px);
}
.testindex.index.sz700 .service:nth-child(4) {     margin: 0;
    	left: calc(50% + 145px);
    	top: calc(50% + 5px);
}
.testindex.index.sz700 .compass {top: 55%;}
.testindex.index.sz700 .slide-1 .slide-sector {  height: 55%;}
.testindex.index.sz700 .slide-2 .slide-sector {  height: 55%;}
.testindex.index.sz700 .slide-4 .slide-sector {  height: 45%;}
.testindex.index.sz700 .slide-4 .slide-sector { top: 55%;}
.testindex.index.sz700 .slide-3 .slide-sector {  height: 45%;}
.testindex.index.sz700 .slide-3 .slide-sector { top: 55%;}

.testindex.index.sz800 .main-title {}
.testindex.index.sz800 .main-title h1 {font-size: 43px;  font-size: 35px;  line-height: 1.04;}
.testindex.index.sz800 .main-title h1 div {font-size: 35px !important;font-size: 29px !important;}
.testindex.index.sz800 .four-services .service a span {font-size: 25px;}
.testindex.index.sz800 .four-services .service p {font-size: 15px;line-height: 1.4;}
.testindex.index.sz800 .index .stat .statistics {}
.testindex.index.sz800 .stat .statistics ins {font-size: 50px;}
.testindex.index.sz800 .stat .statistics ins span {font-size: 18px;    margin-top: 0; padding-top: 20px;}
.testindex.index.sz800 .stat .statistics {  bottom: 35px;}
.sz800 .four-services .service {width:340px;height:80px;}
.testindex.index.sz800 .service:nth-child(1) {    margin: 0;
    	left: calc(50% - 340px - 150px);
    	top: calc(50% - 150px - 35px);
}
.testindex.index.sz800 .service:nth-child(2) {     margin: 0;
    	left: calc(50% + 150px);
    	top: calc(50% - 150px - 35px);
}
.testindex.index.sz800 .service:nth-child(3) {     margin: 0;
    	left: calc(50% - 340px - 145px);
    	top: calc(50% + 50px);
}
.testindex.index.sz800 .service:nth-child(4) {     margin: 0;
    	left: calc(50% + 145px);
    	top: calc(50% + 50px);
}

.testindex.index.sz1000 .main-title {}
.testindex.index.sz1000 .main-title h1 {font-size: 62.5px; font-size: 42px;   line-height: 1.04;}
.testindex.index.sz1000 .main-title h1 div {font-size: 50px !important;font-size: 32px !important;}
.testindex.index.sz1000 .four-services .service a span {font-size: 25px;}
.testindex.index.sz1000 .four-services .service p {font-size: 16px;line-height: 1.4;}
.testindex.index.sz1000 .index .stat .statistics {}
.testindex.index.sz1000 .stat .statistics ins {font-size: 50px;}
.testindex.index.sz1000 .stat .statistics ins span {font-size: 18px;    margin-top: 0; padding-top: 20px;}
.testindex.index.sz1000 .stat .statistics {  bottom: 35px;}
.sz1000 .four-services .service {width:370px;height:95px; }
.testindex.index.sz1000 .service:nth-child(1) {    margin: 0;
    	left: calc(50% - 370px - 120px);
    	top: calc(50% - 160px - 60px);
}
.testindex.index.sz1000 .service:nth-child(2) {     margin: 0;
    	left: calc(50% + 150px);
    	top: calc(50% - 160px - 60px);
}
.testindex.index.sz1000 .service:nth-child(3) {     margin: 0;
    	left: calc(50% - 370px - 135px);
    	top: calc(50% + 55px);
}
.testindex.index.sz1000 .service:nth-child(4) {     margin: 0;
    	left: calc(50% + 150px);
    	top: calc(50% + 55px);
}




.sz1180 .main-title {}
.sz1180 .main-title h1 {}
.sz1180 .main-title h1 div {}
.sz1180 .four-services .service a {}
.sz1180 .four-services .service p {}
.sz1180 .index .stat .statistics {}
.sz1180 .stat .statistics ins {}
.sz1180 .stat .statistics ins span {}


.testindex.index .stat .statistics {bottom:0 !important;}
.testindex.index .stat .statistics ins { 
    line-height: 1 !important;
}
.testindex.index .stat .statistics ins span {
    padding-top: 0 !important;
}



 
.slide-1 .slide-back {
    background-image: url(../img/sector-1bb.jpg); 
}
.slide-1 .slide-sector { 
    background-image: url(../img/sector-1ba.jpg);
}
 

.testindex .four-services .service {margin-left:0 !important;}
 







.sz700 .four-services .service { 
    height: 80px;
}


.testindex .four-services .service:nth-child(1),
.testindex .four-services .service:nth-child(3){ 
    text-align: right;
}


.slide-1 .slide-sector {
    background-image: url(../img/sector-1bab.jpg);
}
.slide-1 .slide-back {
    background-image: url(../img/sector-1bbb.jpg);
}

.service ins {
    display: block;    margin-top: 20px;
    text-decoration: none;    text-align: left;
}
.testindex.index .four-services .service ins .cc_item {
    display: inline;
}

.testindex.index .four-services .service ins .cc_item:after {content:'  ·  ';}  
.testindex.index .four-services .service ins .cc_item:last-child:after{content:'';}

.testindex.index .four-services .service ins .cc_item a {
    font-size: 6px;
    font-weight: 400;
    text-decoration: none;
    margin-right: 0px;
    margin-left: 0;
    border-bottom-color: rgba(255, 255, 255, 0.3);
}
.testindex.index .four-services .service ins .cc_item a span {
    font-size: 18px;
    line-height: 1.4em;font-weight:300;
    color: #fff;
}
.testindex.index .four-services .service a {
    line-height: 1em;
}
.testindex.index.white .four-services .service ins .cc_item a span  {
    color: black;
}
.testindex.index.white  .four-services .service ins .cc_item a {
    border-bottom-color: rgba(0, 0, 0, 0.3);
}

.testindex .four-services .service:nth-child(1), .testindex .four-services .service:nth-child(3) {
    text-align: left;
}
.content .statistics {
    min-height: 60px;
}





.four-services .service a {}
.four-services .service a span  {
    
    font-weight: 600; 
    color: white;
    transition: color 250ms ease-out, border-bottom-color 250ms ease-out;
    text-decoration: none;
}

body.white .service a  span{
    color: black !important;
}
.testindex.index .four-services .service a {
    line-height: 1px;
    font-size: 15px !important;
} 
.service_block .inf { background:transparent;}






.testindex.higher .four-services .service:nth-child(1), .testindex.higher .four-services .service:nth-child(2) {
    top: calc(50% - 120px - 60px); height:auto;
}
.testindex.higher.higher_low .four-services .service:nth-child(1), .testindex.higher.higher_low .four-services .service:nth-child(2) {
    top: calc(50% - 120px - 90px); height:auto;
}
.testindex.higher.higher_low .four-services .service:nth-child(3), .testindex.higher.higher_low .four-services .service:nth-child(4) {
    top: calc(50% + 15px);
}



.four-services {
 
    height: calc(100vh - 50px);}













header .menu .logo {
    background: url(../img/logo_desktop.png) 0 0 no-repeat;
}
body.white header .menu .logo {
	    filter: none !important;
}  
.vertipad .main-title h1 {font-size: 6vw;}


.testindex header, .backsMenu {
    __z-index: 11;
}