/*
	Theme Name: Буравлева Елена - бизнес архитектор
	Theme URI: https://alianscompany.ru/
	Description: The theme for WordPress. 
	Author: Интернет агества "Альянс+"
	Version: 1.a
*/

/* --- RESET ---------------------------------------------------------------------------------------------------------------------------------------------------------- */

* { 
	border:0; 
	margin:0; 
	padding:0; 
	outline: none; 
	border-collapse: collapse; 
	-webkit-overflow-scrolling: touch;
	-webkit-tap-highlight-color: transparent;
}

:focus {
	outline:none;
	box-shadow:none;
	border-color:transparent;;
}

html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { background: transparent; border: 0; margin: 0; padding: 0; vertical-align: baseline; }

body { line-height: 1; }

h1, h2, h3, h4, h5, h6 { clear: both; font-weight: normal; }

ol, ul {  }

blockquote { quotes: none; }

blockquote:before, blockquote:after { content: ''; content: none; }

del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }

a img { border: none; }

input, textarea{
	-webkit-appearance: none;
	font-family: 'Inter', sans-serif;
}

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

html,
body { 
	padding:0;
	margin:0;
	position: relative;
	max-width: 100%; 
	overflow-x: hidden; 
}

body {
	font-family: 'Lora', serif;
	font-family: 'Inter', sans-serif;
	font-weight: normal; 
	font-style: normal; 
	font-size:12px;
	line-height:19px;
	position:relative;
	height:100%; 
	width:100%;
	min-width:330px;
	background:#FFF;
	-webkit-text-size-adjust: 100%;
	text-size-adjust:100%;
	color:#FFF;
	padding:0;
}

html { overflow-x:hidden; }

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

.block {
	clear:both;
	width:100%;
	display:block;
	position:relative;
	text-align:center;
}

.center { 
	clear:both;
	float:none;
	width:100%;
	max-width:1170px;
	min-width:300px;
	padding:0;
	margin:0 auto;
	text-align:left;
	box-sizing: border-box;
	position:relative;
	/*background:rgba(54,255,0, 0.5);*/
}

.clear {
	clear:both;
	width:100%;
	height:0px;
}

.animate__animated {
	-moz-opacity: 0;
	-khtml-opacity: 0;
	-webkit-opacity: 0;
	opacity: 0;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0 * 100);
	filter: alpha(opacity=0 * 100);
	animation-timing-function: ease-in;
	-webkit-animation-timing-function: ease-in;
}

.animates { 
	-moz-opacity: 0;
	-khtml-opacity: 0;
	-webkit-opacity: 0;
	opacity: 0;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0 * 100);
	filter: alpha(opacity=0 * 100);
}

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

.header {
	background: #3A444B;
}

.home .header {
	background:transparent;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	z-index:150;
}

.header .logo-contact {
	padding:30px 0;
	display:flex;
	justify-content: space-between;
	align-items: center;		
}

.header .left {
	display:flex;
	align-items: center;		
}

.header .logo a,
.header .logo div {
	font-size: 22px;
	font-style: normal;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0.03em;
	text-align: left;	
	color: #FFF;
	display:inline-block;
	padding-left:55px;
	text-decoration:none;
	position:relative;
}

.header .logo a span,
.header .logo div span {
	font-size: 11px;
	font-style: normal;
	font-weight: 500;
	line-height: 14px;
	letter-spacing: 0.05em;
	text-align: left;
	text-transform:uppercase;
	display:block;
	padding:4px 0 0 0;
}

.header .logo a::before,
.header .logo div::before {
	content:'';
	display:block;
	width:42px;
	height:46px;
	background:url("images/logo-top.svg") no-repeat center center;
	position:absolute;
	left:0px;
	top:50%;
	margin:-23px 0 0 0;
}

.header .description {
	margin-left:25px;
	font-style: normal;
	font-weight: 500;
	font-size: 12px;
	line-height: 188%;
	text-transform: uppercase;
	color: #ADB5BD;	
}

.header  .right ul {
	display:flex;
	align-items: center;		
}

.header  .right ul li {
	display:block;
	list-style:none;
}

.header  .right ul li a[href^="mailto:"] {
	font-style: normal;
	font-weight: 400;
	font-size: 15px;
	line-height: 120%;
	color: #FFFFFF;	
	text-decoration:none;
}

.header  .right ul li a[href^="tel:"] {
	font-style: normal;
	font-weight: bold;
	font-size: 15px;
	line-height: 120%;
	color: #FFFFFF;
	text-decoration:none;
	margin-left:29px;
}

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

.slider-home {
	position:relative;
	overflow:hidden;
}

.slider-wrap-home {
	height:800px;
}

.slider-wrap-home .item {
	position:relative;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	overflow:hidden;
}

.slider-wrap-home .item::before {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
	background: linear-gradient(180deg, rgba(39, 45, 50, 0.9) 0%, rgba(39, 45, 50, 0.7) 100%);
	z-index:1;
}

.slider-wrap-home .item .center {
	height:800px;
	display:flex;	
	align-items: center;
	position:relative;
	z-index:10;
	padding:150px 0 0 0;
	box-sizing: border-box;
}

.slider-wrap-home .item .data {
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 150%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #FFFFFF;
	position:relative;	
	z-index:11;
}

.slider-wrap-home .item .data h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 160%;
	color: #FFFFFF;	
	margin:20px 0 0 0;
}

.slider-wrap-home .item .data h2 a {
	color: #FFFFFF;	
	text-decoration:none;
}

.slider-wrap-home .item .data p,
.slider-wrap-home .item .data h2 {
	position:relative;
	top:-90px;
	opacity:0;
	transition: all 2s;
}

.slider-wrap-home .item .data .more {
	position:relative;
	top:90px;
	padding:70px 0 0 0;
	opacity:0;
	transition: all 2s;
}

.slider-wrap-home .item .data .more a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	box-sizing: border-box;
	border-radius: 3px;
	position:relative;
	overflow:hidden;
	background: #DEE2E6;
}

.slider-wrap-home .item .data .more a span {
	display:inline-block;
	position:relative;
	z-index:5;
	color: #212529;
	padding:21px 84px 21px 30px;
}

.slider-wrap-home .item .data .more a::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	top:50%;
	right:30px;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
}

.slider-wrap-home .item .data .more a::before { background:url("images/pagination-hover.svg") no-repeat center center; }

.slider-wrap-home .item .data .more a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.slider-wrap-home .item .data .more a:hover::after {
	width:100%;
}

.slider-wrap-home .item .data .more a:hover::before { 
	right:25px; 
}

.slider-wrap-home .item .data .more a:hover::before { background:url("images/pagination.svg") no-repeat center center; }

.slider-wrap-home .item .data .more a:hover span {
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

.slider-wrap-home .item .center .romb {
	display:block;
	width:1572px;
	height:800px;
	background:url("images/romb-1.svg") no-repeat center center;
	z-index:3;
	position:absolute;
	top:0px;
	bottom:0px;
	left:-837px;
	opacity:0;
	transition: all 3s;
}

.slider-wrap-home .item .center .romb::before {
	content:'';
	display:block;
	width:251px; /*251px*/
	height:682px;
	background:url("images/romb-2.svg") no-repeat 0 center;
	z-index:3;
	position:absolute;
	top:59px;
	bottom:59px;
	right:-70px;
	opacity:0;
	transition: all 5s;
}

.slider-wrap-home .item .center .romb::after {
	content:'';
	display:block;
	width:220px; /*220px*/
	height:578px;
	background:url("images/romb-3.svg") no-repeat 0 center;
	z-index:3;
	position:absolute;
	top:111px;
	bottom:111px;
	right:-140px;
	opacity:0;
	transition: all 7s;
}

.slider-wrap-home .item.slick-current .romb {
	opacity:1;
	left:-737px;
}

.slider-wrap-home .item.slick-current .romb::before {
	opacity:1;
}

.slider-wrap-home .item.slick-current .romb::after {
	opacity:1;
}

.slider-wrap-home .item.slick-current .data p,
.slider-wrap-home .item.slick-current .data h2 {
	top:0px;
	opacity:1;
}

.slider-wrap-home .item.slick-current .data .more {
	top:0px;
	opacity:1;
}

.slider-wrap-home .item i.left,
.slider-wrap-home .item i.right {
	width:1128px;
	height:578px;
	background:url("images/slider-wrap-home.svg") no-repeat center center;
	position:absolute;
	top:111px;
	bottom:111px;
	z-index:20;
	transition: all 2s;
	opacity:0.05;
}

.slider-wrap-home .item i.left.hover,
.slider-wrap-home .item i.right.hover {
	opacity:0.15;
}

.slider-wrap-home .item i.left { left:-1200px; }
.slider-wrap-home .item i.right { right:-1200px; }

.slider-wrap-home .item.slick-current i.left { left:-1000px; }
.slider-wrap-home .item.slick-current i.right { right:-1000px; }

.slider-wrap-home .item i.left.hover { left:-1010px; }
.slider-wrap-home .item i.right.hover { right:-1010px; }

.slider-wrap-home .slick-prev,
.slider-wrap-home .slick-next {
	position:absolute;
	bottom:0px;
	display:block;
	width:34px;
	height:76px;
	box-sizing: border-box;
	background:transparent;
	text-indent:-9999px;
	transition: all 0.5s;
	cursor:pointer;
	z-index:3;
	top:calc(50% - 28px);
}

.slider-wrap-home .slick-prev { left:40px; }
.slider-wrap-home .slick-next { right:40px; }

.slider-wrap-home .slick-prev::before,
.slider-wrap-home .slick-next::before {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	width:100%;
	height:100%;
	position:absolute;
	transition: all 0.5s;
	cursor:pointer;
	background:url("images/slider-wrap-home-right.svg") no-repeat center center;
	background-size:34px auto;
}

.slider-wrap-home .slick-prev:hover::before,
.slider-wrap-home .slick-next:hover::before {
	background-size:24px auto;
}

.slider-wrap-home .slick-prev::before {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

.slider-wrap-home .slick-dots {
	display:block;
	width:300px;
	position:absolute;
	right:calc((100% - 1170px) / 2);
	bottom:115px;
	height:16px;
	font-size:0px;
	text-align:right;
	z-index:22;
}

.slider-wrap-home .slick-dots li {
	display:inline-block;
	width:6px;
	height:6px;
	background: #DEE2E6;
	border-radius: 50%;	
	transition: all 0.5s;
	text-indent:-9999px;
	margin:0 10px;
	position:relative;
	cursor:pointer;
}

.slider-wrap-home .slick-dots li button {
	color:transparent;
	background:transparent;
}

.slider-wrap-home .slick-dots li::before {
	content:'';
	display:block;
	top:1px;
	bottom:1px;
	left:1px;
	right:1px;
	border: 1px solid #ADB5BD;
	border-radius: 50%;	
	position:absolute;
	transition: all 0.5s;
	z-index:-1;
}

.slider-wrap-home .slick-dots .slick-active { background: #ADB5BD; }

.slider-wrap-home .slick-dots .slick-active::before {
	top:-5px;
	bottom:-5px;
	left:-5px;
	right:-5px;
	z-index:2;
}

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

.menu-button {
	display:flex;
	border-radius: 3px;
	overflow:hidden;
	align-items: stretch;
	background: #FFFFFF;
	height:60px;
	position:relative;
}

.menu-button .mobile-menu {
	display:none;
}

.menu-button ul {
	width:100%;
	display:flex;
	align-items: center;	
	text-align: justify;
	overflow:hidden;
}

.menu-button ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:0;
	margin:0;
}

.menu-button ul li::before {
	content:'';
	display:block;
	height:14px;
	width:1px;
	background:#020E18;
	opacity:0.12;
	position:absolute;
	top:50%;
	left:-1px;
	margin:-7px 0 0 0;
}

.menu-button ul li:first-child::before { display:none; }

.menu-button ul li a {
	display:inline-block;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 16px;
	letter-spacing: 0.02em;
	color: #020E18;
	font-family: 'Lora', serif;
	text-decoration:none;
	padding:21px 36px 21px 35px;
	position:relative;
	transition: all 0.5s;
	margin:0;
}

.menu-button ul li a::before {
	content:'';
	display:block;
	left:-2px;
	right:-2px;
	top:-1px;
	background:#dee2e6;
	height:0px;
	position:absolute;
	transition: all 0.3s;
	z-index:1;
}

.menu-button ul li a span {
	position:relative;
	z-index:2;
	transition: all 0.3s;
}

.menu-button ul li:not(.current-menu-item) a:hover span {
	color:#73767d;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;
}

.menu-button ul li.current-menu-item a span {
	color:#73767d;
}

.menu-button ul li a:hover::before {
	height:calc(100% + 2px);
}

.menu-button ul li.current-menu-item a::before { height:calc(100% + 2px); }

.menu-button p {
	position:absolute;
	right:0px;
	top:0px;
	bottom:0px;
	width:254px;
}

.menu-button p a {
	display:flex;
	align-items:center;
	height:60px;
	font-family: 'Lora', serif;
	width:100%;
	background: #020E18;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: center;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #FFFFFF;
	padding:0 0 0 64px;
	box-sizing: border-box;	
	position:relative;
	text-decoration:none;
	overflow:hidden;
}

.menu-button p a::after {
	content:'';
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	height:0px;
	background:#e0e2e7;
	z-index:1;
	transition: all 0.3s;
}

.menu-button p a:hover::after {
	height:100%;
}

.menu-button p a span {
	position:relative;
	z-index:2;
	transition: all 0.3s;
	padding:0;
	margin:0;
}

.menu-button p a:hover span {
	color:#090f15;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;
}

@keyframes toptobottom-text {
	from {
		opacity:0;
		top:-7px;
	}
	to {
		opacity:1;
		top:0px;
	}
}

@keyframes toptobottom-ico {
	from {
		opacity:0;
		transform: translateY(-7px);
	}
	to {
		opacity:1;
		transform: translateY(0px);
	}
}

.menu-button p a::before {
	content:'';
	display:block;
	width:20px;
	height:16px;
	position:absolute;
	left:34px;
	top:22px;
	background:url("images/menu-button-mail.svg") no-repeat center center;
	transition: all 0.3s;
	z-index:3;
}

.menu-button p a:hover::before {
	background:url("images/menu-button-mail-hover.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

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

.dropdownmenu {
	position:fixed;
	right:-1000px;
	top:0px;
	bottom:0px;
	background:#FFF;
	z-index:1000;
	width:50%;
	text-align:left;
	box-sizing: border-box;	
	padding:25px 40px;
	box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
	-webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75);
	transition: all 2s;
}

.dropdownmenu.active {
	right:0px;
}

.dropdownmenu ul li {
	display:block;
	border-top:1px solid #dee2e6;
	padding:0;
}

.dropdownmenu ul li:first-child {
	border:none;
}

.dropdownmenu ul li a {
	display:inline-block;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 16px;
	letter-spacing: 0.02em;
	color: #020E18;
	font-family: 'Lora', serif;
	text-decoration:none;
	padding:20px 0;
	position:relative;
	transition: all 0.5s;
	margin:0;
}

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

.directions {
	background: #E5E5E5;
	padding:10px 0;
}

.page-template-page-works-services .directions {
	background:#FFF;
	padding:80px 0 0 0;
}

.page-template-page-works-services .directions .title {
	max-width:1170px;
	margin:0 auto;
}

.page-template-page-works-services .directions h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;
	margin:0 0 50px 0;
}

.directions .center {
	max-width:1420px;
}

.direction-wrap {
	display:flex;
	justify-content: space-between;
	align-items: stretch;	
}

.page-template-page-works-services .direction-wrap {
	flex-wrap: wrap;
	margin:-10px 0 0 0;
}

.direction-wrap .item {
	display:block;
	width:466px;
	box-sizing: border-box;	
	background-repeat:no-repeat;
	background-position:center center;
	padding:87px 40px 45px 40px;
	position:relative;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	transition: all 0.5s;
	background-size:auto 100%;
	overflow:hidden;
}

.page-template-page-works-services .direction-wrap .item {
	width:705px;
	padding:99px 40px 45px 40px;
	background-size:100% auto;
	margin:10px 0 0 0;
}

.direction-wrap .item:hover {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);
	background-size:auto calc(100% + 45px);
}

.page-template-page-works-services .direction-wrap .item:hover {
	background-size:calc(100% + 45px) auto;
}

.direction-wrap .item::before {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
	opacity:1;
	background: linear-gradient(0deg, rgba(241, 243, 245, 0.85), rgba(241, 243, 245, 0.85));
	z-index:1;
	transition: all 0.5s;
}

.direction-wrap .item.blink::before {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
	opacity:0;
	background:rgba(255,255,255, 1);
	z-index:2;
	transition: all 0.5s;
	animation-duration: 1.5s;
	animation-name: blink;
}

@keyframes blink {
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}

.direction-wrap .item::after {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
	opacity:0;
	background:#000;
	z-index:1;
	transition: all 0.5s;
}

.direction-wrap .item:hover::before { opacity:0; }
.direction-wrap .item:hover::after { opacity:0.35; }

.direction-wrap .item h2 {
	position:relative;
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 21px;
	line-height: 140%;
	color: #020E18;	
	padding:0 0 0 94px;
	box-sizing: border-box;	
	margin:0 0 37px 0;
	position:relative;
	z-index:5;
}

.page-template-page-works-services .direction-wrap .item h2 {
	margin:0 0 49px 0;
}

.direction-wrap .item h2 a,
.direction-wrap .item h2 em {
	font-style:normal;
	color: #020E18;	
	text-decoration:none;
	transition: all 0.5s;
	display:inline;
	position:relative;
}

.direction-wrap .item:hover h2 a,
.direction-wrap .item:hover h2 em { 
	color:#FFF; 
}

.direction-wrap .item:hover h2 a::after {
	content:'';
	display:block;
	left:0px;
	width:100%;
	height:1px;
	background:#FFF;
	position:absolute;
	z-index:1;
	transition: all 0.5s;
}

.direction-wrap .item:hover h2 a:hover::after { width:0px; }

.direction-wrap .item h2 a span { 
	display:inline-block; 
	position:relative;
}

.direction-wrap .item:hover h2 a span::before {
	content:'';
	display:block;
	left:0px;
	bottom:-2px;
	width:0px;
	height:1px;
	background:#FFF;
	transition: all 0.5s;
	position:absolute;
}

.direction-wrap .item:hover h2 a:hover span::before {
	width:100%;
}

.direction-wrap .item h2 span.ico { 
	display:block;
	width:72px;
	height:72px;
	position:absolute;
	left:0px;
	top:50%;
	margin:-36px 0 0 0;
	border-radius:50%;
	background: #020E18;
	z-index:7;
	transition: all 0.5s;
}

.direction-wrap .item:hover h2 span.ico {
	transform: rotateY(180deg);
	background:#FFF;
}

.direction-wrap .item h2 span.ico i {
	display:block;
	width:72px;
	height:72px;
	position:absolute;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:38px auto;
	transition: all 0.5s;
}

.direction-wrap .item h2 span.ico i.hover { opacity:0; }
.direction-wrap .item:hover h2 span.ico i.hover { opacity:1; }
.direction-wrap .item:hover h2 span.ico i.normal { opacity:0; }

.direction-wrap .item:hover h2 span.ico i.hover {
	transform: rotateY(180deg);
}

.direction-wrap .item ul {
	margin:-5px 0 35px 0;
	position:relative;
	z-index:5;
}

.direction-wrap .item ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.direction-wrap .item ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-white.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.direction-wrap .item ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.direction-wrap .item ul li a {
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 120%;
	color: #020E18;	
	text-decoration:none;
	position:relative;
	display:inline-block;
	transition: all 0.5s;
}

.direction-wrap .item:hover ul li a {
	color:#FFF;
}

.direction-wrap .item ul li a::before {
	content:'';
	display:block;
	left:0px;
	bottom:-3px;
	width:0px;
	height:1px;
	background:#FFF;
	transition: all 0.5s;
	position:absolute;
}

.direction-wrap .item ul li a:hover::before {
	width:100%;
}

.page-template-page-works-services .item ul li a::before {
	width:100%; 
	background: #020E18;
}

.page-template-page-works-services .item:hover ul li a::before { background:#FFF; }

.page-template-page-works-services .item ul li a:hover::before {
	width:0px;
}

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

.home-project {
	padding:100px 0;
	background:url("images/home-project.jpg") no-repeat center center;
	background-size:cover;
}

.home-project .titles {
	display:flex;
	justify-content: space-between;
	align-items: center;	
	margin:0 0 50px 0;	
}

.home-project .titles h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;
}

.home-project .titles a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: center;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;	
	display:inline-block;
	padding:16px 30px 16px 60px;
	background: #DEE2E6;
	border-radius: 3px;
	text-decoration:none;
	overflow:hidden;
	position:relative;
}

.home-project .titles a::after {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	height:0px;
	background:#040e19;
	transition: all 0.3s;
	z-index:1;
}

.home-project .titles a:hover::after { height:100%; }

.home-project .titles a span {
	position:relative;
	z-index:2;
	transition: all 0.3s;
	padding:0;
	margin:0;
}

.home-project .titles a:hover span {
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;
}

.home-project .titles a::before {
	content:'';
	display:block;
	width:20px;
	height:20px;
	position:absolute;
	left:30px;
	top:13px;
	background:url("images/suitcase-dark.svg") no-repeat center center;
	transition: all 0.3s;
	z-index:3;
}

.home-project .titles a:hover::before {
	background:url("images/suitcase.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.home-project .project-list {
	padding:0 0 74px 0;
}

.home-project .project-list .item {
	background:#FFF;
}

.home-project .slick-prev,
.home-project .slick-next {
	position:absolute;
	bottom:0px;
	display:block;
	width:44px;
	height:44px;
	border: 1px solid #DEE2E6;
	box-sizing: border-box;
	background:#FFF;
	text-indent:-9999px;
	transition: all 0.5s;
	border-radius:50%;
	cursor:pointer;
	z-index:3;
}

.home-project .slick-prev { left:15px; }
.home-project .slick-next { right:15px; }

.home-project .slick-prev::before,
.home-project .slick-next::before {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	width:100%;
	height:100%;
	position:absolute;
	transition: 0.5s;
	cursor:pointer;
	background:url("images/prev.svg") no-repeat 50% center;
}

.home-project .slick-next::before {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

.home-project .slick-prev:hover,
.home-project .slick-next:hover {
	background: #DEE2E6;
	border: 1px solid #DEE2E6;
}

.home-project .slick-dots {
	display:block;
	width:100%;
	position:absolute;
	left:0px;
	bottom:7px;
	height:16px;
	font-size:0px;
	text-align:center;
	z-index:2;
}

.home-project .slick-dots li {
	display:inline-block;
	width:6px;
	height:6px;
	background: #DEE2E6;
	border-radius: 50%;	
	transition: all 0.5s;
	text-indent:-9999px;
	margin:0 10px;
	position:relative;
}

.home-project .slick-dots li::before {
	content:'';
	display:block;
	top:1px;
	bottom:1px;
	left:1px;
	right:1px;
	border: 1px solid #ADB5BD;
	border-radius: 50%;	
	position:absolute;
	transition: all 0.5s;
	z-index:-1;
}

.home-project .slick-dots .slick-active { background: #ADB5BD; }

.home-project .slick-dots .slick-active::before {
	top:-5px;
	bottom:-5px;
	left:-5px;
	right:-5px;
	z-index:2;
}

.home-project .project-list .item .title-description-thumb.full {
	height:115px;
}

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

.type-project ul {
	border: 1px solid #757B81;
	border-radius:3px;
	display:inline-block;
	font-size:0px;
}

.type-project ul li {
	display:inline-block;
	list-style:none;
}

.type-project a {
	font-family: 'Lora', serif;
	display:inline-block;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #757B81;
	text-decoration:none;
	display:flex;
	padding:14px 30px;
	transition: all 0.5s;
}

.type-project a.active {
	background: #757B81;
	color: #FFFFFF;
}

.type-project a:hover {
	color: #020E18;
}

.type-project a.active:hover {
	color: #FFFFFF;
}

.tags {
	background: #F8F9FA;
	border-radius: 3px;
	padding:18px 30px;
	margin:20px 0 0;
	display:none;
}

.tags.show { display:block; }

.tags span {
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 110%;
	color: #020E18;	
	padding-left:28px;
	position:relative;
	margin:12px 0 12px 30px;
	display:inline-block;
	cursor:pointer;
}

.tags span::before {
	content:'';
	width:18px;
	height:18px;
	display:block;
	position:absolute;
	left:0px;
	top:50%;
	margin:-9px 0 0 0;
	background:url("images/tags-span.svg") no-repeat center center;
}

.tags span.active::before {
	background:url("images/tags-span-active.svg") no-repeat center center;
}









.item-type-project h3 {
	background: #F8F9FA;
	border-radius:3px 3px 0 0;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 110%;
	color: #020E18;	
	display:inline-block;
	padding:15px 30px;
	font-family: 'Lora', serif;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.newtags {
	background: #F8F9FA;
	border-radius: 0 3px 3px 3px;
	padding:14px 0px 18px;
	margin:0;
}

.newtags span {
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 110%;
	color: #020E18;	
	padding-left:28px;
	position:relative;
	margin:12px 0 12px 30px;
	display:inline-block;
	cursor:pointer;
}

.newtags span::before {
	content:'';
	width:18px;
	height:18px;
	display:block;
	position:absolute;
	left:0px;
	top:50%;
	margin:-9px 0 0 0;
	background:url("images/tags-span.svg") no-repeat center center;
}

.newtags span.active::before {
	background:url("images/tags-span-active.svg") no-repeat center center;
}

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

.home-news {
	padding:100px 0;
}

.home-news .titles {
	display:flex;
	justify-content: space-between;
	align-items: center;	
	margin:0 0 50px 0;	
}

.home-news .titles h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;
}

.home-news .titles a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: center;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;	
	display:inline-block;
	padding:16px 30px 16px 60px;
	background: #DEE2E6;
	border-radius: 3px;
	text-decoration:none;
	overflow:hidden;
	position:relative;
}

.home-news .titles a::after {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	height:0px;
	background:#040e19;
	transition: all 0.3s;
	z-index:1;
}

.home-news .titles a:hover::after { height:100%; }

.home-news .titles a span {
	position:relative;
	z-index:2;
	transition: all 0.3s;
	padding:0;
	margin:0;
}

.home-news .titles a:hover span {
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;
}

.home-news .titles a::before {
	content:'';
	display:block;
	width:20px;
	height:20px;
	position:absolute;
	left:30px;
	top:13px;
	background:url("images/home-news-all.svg") no-repeat center center;
	transition: all 0.3s;
	z-index:3;
}

.home-news .titles a:hover::before {
	background:url("images/home-news-all-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

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

.breadcrumbs {
	padding:30px 0;
	display:flex;
	overflow: hidden;
	flex-wrap: wrap;
}

.breadcrumbs li {
	display:block;
	list-style:none;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 140%;
	color: #DEE2E6;
	margin-left:31px;
	position:relative;
}

.breadcrumbs li:first-child {
	margin:0;
}

.breadcrumbs li::before {
	content:'';
	display:block;
	position:absolute;
	left:-16px;
	top:50%;
	margin:-2px 0 0 0;
	background:url("images/breadcrumbs.svg") no-repeat center center;
	width:5px;
	height:5px;
}

.breadcrumbs li:first-child::before {
	display:none;
}

.breadcrumbs li:last-child {
	background:none;
}

.breadcrumbs li a,
.breadcrumbs li a span {
	text-decoration:none;
	color: #DEE2E6;
	transition: all 0.5s;
}

.breadcrumbs li a:hover span {
	color: #ADB5BD;
}

.breadcrumbs li span span {
	color: #ADB5BD;
}

.breadcrumbs li span {
	/*text-overflow: ellipsis;
	overflow: hidden;*/
	
}

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

.pages {
	padding:80px 0 calc(80px - 25px) 0; /* padding: 80px 0; */
	min-height:calc(100vh - 244px - 80px);
	box-sizing: border-box;
}

.pages h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	margin:0 0 50px 0;
}

.content {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
}

.content a {
	text-decoration:underline;
	color: #020E18;
}

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

.content img {
	max-width:100%;
	height:auto;
	border:none;
	vertical-align:bottom;	
}

.content p {
	padding:0 0 14px 0;
}

.content .wp-block-column p:last-child {
	padding:0; 
}

.content h2 {
	font-family: 'Lora', serif;
	margin:0 0 28px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #020E18;	
}

.content h3 {
	font-family: 'Lora', serif;
	margin:0 0 20px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 25px;
	line-height: 140%;
	color: #020E18;	
}

.content .wp-block-column img { width:100%; }

.content .wp-block-columns {
	margin:25px 0;
}

.content .wp-block-image {
	margin:25px 0;
}

.content .wp-block-columns .wp-block-image { margin:0; }

.content .wp-block-quote {
	background: #F8F9FA;
	box-shadow: inset 3px 0px 0px #757B81;
	box-sizing: border-box;	
	padding:16px 40px;
	font-style: italic;
	font-weight: normal;
	font-size: 15px;
	line-height: 160%;
	color: #757B81;	
	box-shadow: inset 3px 0px 0px #757B81;
	margin:25px 0;
}

.content .wp-block-quote p {
	padding:14px 0;
}

.content ul {
	margin:-5px 0 35px 0;
}

.content ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.content ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.content ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.content ol {
	counter-reset: my-counter;
	margin:-5px 0 35px 0;
	box-sizing: border-box;
}

.content ol li {
	display:block;
	list-style:none;
	counter-increment: my-counter;
	display:block;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.content ol li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.content ol li::after {
	content: counter(my-counter);
	font-style: normal;
	font-weight: 500;
	font-size: 11px;
	line-height: 20px;
	text-align: center;
	color: #020E18;
	position:absolute;
	left:0px;
	top:5px;
	width:18px;
	height:20px;
}

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

.news-list {
	position:relative;
	margin:-15px;
	display:flex;
	flex-wrap: wrap;
	align-items: stretch;
}

.news-list .item {
	margin:15px;
	width:370px;
	height:454px;
	box-sizing: border-box;
	/*border: 1px solid #DEE2E6;*/
	outline: 1px solid #DEE2E6;
	outline-offset: -1px;
	border-radius:3px;
	padding:245px 0 0 0;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 120%;
	color: #757B81;
	position:relative;

}

.news-list .item::before {
	content:'';
	position:absolute;
	left:-2px;
	right:-2px;
	top:-2px;
	height:4px;
	background:#FFF;
	display:block;
	z-index:2;
}

.news-list .item svg {
	content: "";
	position: absolute!important;
	width: 100%;
	height: 100%;
	top:0;
	left: 0;
	z-index: 1;
	stroke-width: 1px;
	stroke:#020E18;
	fill:none;
	stroke-dasharray: 1490;
	stroke-dashoffset: 890;
	transition: stroke-dashoffset 1s;
	transition-timing-function: linear;
}

.news-list .item svg rect {
	width: 100%;
	height: 100%
}

.news-list .item:hover svg {
	transition: stroke-dashoffset 1s;
	transition-timing-function: linear;
	stroke-dashoffset:0;
}

.news-list .item span.thumbnail {
	display:block;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	height:230px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:370px auto;
	overflow:hidden;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	transition: all 0.5s;
	border-radius:3px 3px 0 0;
	z-index:3;
}

.news-list .item span.thumbnail:hover {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);
	background-size:395px auto;
}

.news-list .item  h2 {
	margin:7px 0 7px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 20px;
	line-height: 140%;
	color: #020E18;
	position:relative;
	display:block;
	z-index:3;
	transition: all 0.5s;
}

.news-list .item  h2:hover { background:#020E18; }

.news-list .item  h2::before {
	content:'';
	display:block;
	left:0px;
	top:-7px;
	bottom:-7px;
	width:1px;
	background:#FFF;
	position:absolute;
	z-index:3;
}

.news-list .item  h2::after {
	content:'';
	display:block;
	left:0px;
	top:0px;
	bottom:0px;
	width:1px;
	background:#6f7a85;
	position:absolute;
	z-index:4;
	transition: all 0.5s;
}

.news-list .item  h2:hover::after { background:#020E18; }

.news-list .item p {
	padding:0 30px;
}

.news-list .item  h2 a {
	display:block;
	color: #020E18;
	text-decoration:none;
	transition: all 0.5s;
	padding:10px 30px;
}

.news-list .item  h2:hover a {
	color:#FFF;
}

.news-list .item  h2 a span {
	border-bottom:1px solid #FFF;
}

.news-list1111 .item:hover span.thumbnail {
	background-size:385px auto;
}

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

nav.pagination {
	margin:30px 0 0 0;
	background: #F8F9FA;
	border-radius: 3px;	
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	text-align: center;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #757B81;
	position:relative;
	overflow:hidden;
}

nav.pagination a.page-numbers {
	color: #757B81;
	text-decoration:none;
	padding:26px 16px;
	display:inline-block;
	transition: all 0.5s;
}

nav.pagination a.page-numbers:hover {
	color:#020e18;
}

nav.pagination span.current {
	color:#020e18;
	background: #DEE2E6;
	padding:26px 20px;
	display:inline-block;
}

nav.pagination a.next,
nav.pagination a.prev {
	position:absolute;
	top:0px;
	bottom:0px;
	display:flex;
	align-items: center;
	transition: all 0.5s;
}

nav.pagination a.next {
	right:0px;
	padding:0 94px 0 40px;
}

nav.pagination a.prev {
	left:0px;
	padding:0 40px 0 94px;
}

nav.pagination a.next span,
nav.pagination a.prev span {
	position:relative;
	color: #757B81;
	z-index:5;
	transition: 0.5s;
}

nav.pagination a.next::after,
nav.pagination a.prev::after {
	content: "";
	display: block;
	width: 100%;
	height: 0;
	position: absolute;
	top: 0;
	left: 0;
	background: #DEE2E6;
	transition: 0.5s;
	z-index:1;
}

nav.pagination a.next:hover::after,
nav.pagination a.prev:hover::after {
	height:100%;
}

nav.pagination a.next::before,
nav.pagination a.prev::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	background:url("images/pagination.svg") no-repeat center center;
	top:50%;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:2;
}

nav.pagination a.next::before {
	right:40px;
}

nav.pagination a.prev::before {
	left:40px;
	transform: rotate(180deg);
}

nav.pagination a.next:hover::before,
nav.pagination a.prev:hover::before {
	background:url("images/pagination-hover.svg") no-repeat center center;
}

nav.pagination a.next:hover::before { right:35px; }
nav.pagination a.prev:hover::before { left:35px; }

nav.pagination a.next:hover span,
nav.pagination a.prev:hover span {
	color: #020E18;
}

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

#pagination-container ul {
	margin:30px 0 0 0;
	background: #F8F9FA;
	border-radius: 3px;	
	position:relative;
	overflow:hidden;
	font-size:0px;
	text-align:center;
}

#pagination-container ul li {
	display:inline-block;
	list-style:none;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	text-align: center;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #757B81;
}

#pagination-container ul a.page-link {
	color: #757B81;
	text-decoration:none;
	padding:26px 16px;
	display:inline-block;
	transition: all 0.5s;
	
}

#pagination-container ul a.page-link:hover {
	color:#020e18;
}

#pagination-container ul li.active span.current {
	color:#020e18;
	background: #DEE2E6;
	padding:26px 20px;
	display:inline-block;
}

#pagination-container ul a.next,
#pagination-container ul a.prev,
#pagination-container ul span.next,
#pagination-container ul span.prev {
	position:absolute;
	top:0px;
	bottom:0px;
	display:flex;
	align-items: center;
	transition: all 0.5s;
}

#pagination-container ul span.next,
#pagination-container ul a.next {
	right:0px;
	padding:0 94px 0 40px;
}

#pagination-container ul span.prev,
#pagination-container ul a.prev {
	left:0px;
	padding:0 40px 0 94px;
}

#pagination-container ul span.next span,
#pagination-container ul span.prev span,
#pagination-container ul a.next span,
#pagination-container ul a.prev span {
	position:relative;
	color: #757B81;
	z-index:5;
	transition: 0.5s;
}

#pagination-container ul span.next::after,
#pagination-container ul span.prev::after,
#pagination-container ul a.next::after,
#pagination-container ul a.prev::after {
	content: "";
	display: block;
	width: 100%;
	height: 0;
	position: absolute;
	top: 0;
	left: 0;
	background: #DEE2E6;
	transition: 0.5s;
	z-index:1;
}

#pagination-container ul a.next:hover::after,
#pagination-container ul a.prev:hover::after {
	height:100%;
}

#pagination-container ul span.next::before,
#pagination-container ul span.prev::before,
#pagination-container ul a.next::before,
#pagination-container ul a.prev::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	background:url("images/pagination.svg") no-repeat center center;
	top:50%;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:2;
}

#pagination-container ul span.next::before,
#pagination-container ul a.next::before {
	right:40px;
}

#pagination-container ul span.prev::before,
#pagination-container ul a.prev::before {
	left:40px;
	transform: rotate(180deg);
}

#pagination-container ul a.next:hover::before,
#pagination-container ul a.prev:hover::before {
	background:url("images/pagination-hover.svg") no-repeat center center;
}

#pagination-container ul a.next:hover::before { 
	right:35px; 
}

#pagination-container ul a.prev:hover::before { 
	left:35px; 
}

#pagination-container ul a.next:hover span,
#pagination-container ul a.prev:hover span {
	color: #020E18;
}

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

.what-doing {
	padding:80px 0;
}

.what-doing h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #020E18;
	margin:0 0 50px 0;
}

.steps h3 {
	font-family: 'Lora', serif;
	padding:0 0 0 39px;
	position:relative;
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	line-height: 140%;
	color: #020E18;
	margin:0;
}

.steps h3::before {
	content:'';
	display:block;
	width:26px;
	height:26px;
	border-radius:50%;
	background: #020E18;
	position:absolute;
	left:0px;
	top:3px;
}

.steps h3::after {
	content:'';
	width:26px;
	height:26px;
	display:block;
	position:absolute;
	left:0px;
	top:3px;	
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 140%;
	display: flex;
	align-items: center;
	text-align: center;
	color: #FFFFFF;	
	justify-content:center;
}

.steps .step:nth-child(1) h3::after { content:'1'; }
.steps .step:nth-child(2) h3::after { content:'2'; }
.steps .step:nth-child(3) h3::after { content:'3'; }
.steps .step:nth-child(4) h3::after { content:'4'; }
.steps .step:nth-child(5) h3::after { content:'5'; }
.steps .step:nth-child(6) h3::after { content:'6'; }
.steps .step:nth-child(7) h3::after { content:'7'; }
.steps .step:nth-child(8) h3::after { content:'8'; }
.steps .step:nth-child(9) h3::after { content:'9'; }

.steps .step {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
	padding:30px 0 0 0;
	margin-top:30px;
	border-top: 1px solid #DEE2E6;
}

.steps .step:first-child {
	padding-top:0px;
	border:none;
}

.steps .step ul {
	margin:15px 0 0 0;
	padding:0 0 0 40px;
	box-sizing: border-box;
}

.steps .step li {
	padding:5px 0 5px 28px;
	display:block;
	box-sizing: border-box;
	position:relative;
}

.steps .step li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.steps .step li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.steps .step h4 {
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 140%;
	color: #020E18;	
	margin:30px 0 20px 0;
	padding-left:40px;
	box-sizing: border-box;
}

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

.work-principles {
	background:url("images/work-principles.jpg") no-repeat center 100%;
}

.line {
	height:80px;
}

.work-principles .two {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
	display:flex;
	justify-content: space-between;
	align-items: flex-end;		
}

.work-principles .left {
	width:360px;
	height:521px;
	background:url("images/work-principles-left.png") no-repeat center center;
	background-size:360px auto;
}

.work-principles .two .right { 
	width:670px; 
	padding:100px 0;
}

.work-principles h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 160%;
	color: #020E18;
	margin:0 0 50px 0;
}

.work-principles h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 20px;
	line-height: 120%;
	color: #020E18;
	padding-left:59px;
	box-sizing: border-box;
	margin:15px 0 0 0;
	position:relative;
}

.work-principles h3::before {
	content:'';
	display:block;
	width:40px;
	height:12px;
	background:url("images/work-principles-arrow.svg") no-repeat center center;
	position:absolute;
	left:0px;
	top:5px
}

.work-principles h3:first-child { margin:0; }

.work-principles p {
	padding-left:59px;
	box-sizing: border-box;	
}

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

.about {
	padding:80px 0 0 0;
	background:url("images/about.jpg") no-repeat center 100%;
	background-size:cover;
}

.about h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	margin:0 0 40px 0;
}

.about .left {
	width:400px;
	height:448px;
	background:url("images/about.png") no-repeat center center;
	background-size:400px auto;
}

.about .two {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
	display:flex;
	justify-content: space-between;
	align-items: flex-end;		
}

.about .two .right { 
	width:700px; 
	padding-bottom:70px;
}

.about .two strong {
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 140%;	
}

.about .two h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #020E18;	
	margin:0 0 20px 0;
}

.about .two h3 {
	font-style: normal;
	font-weight: normal;
	font-size: 20px;
	line-height: 140%;
	color: #757B81;
	padding:0 0 30px 0;
	display:block;
	margin:0 0 30px 0;
	border-bottom: 1px solid #DEE2E6;
}

.about .two ul {
	margin:20px 0 0 0;
	padding:0;
	box-sizing: border-box;
}

.about .two ul li {
	padding:5px 0 5px 28px;
	display:block;
	box-sizing: border-box;
	position:relative;
}

.about .two ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-about.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.about .two ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.work-with {
	padding:80px 0;
	background: #F8F9FA;
}

.work-with h2 {
	font-family: 'Lora', serif;
	margin:0 0 36px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #020E18;	
}

.bricks {
	display:flex;
	justify-content: space-between;
}

.bricks .brick {
	width:570px;
	height:427px;
	background: #FFFFFF;
	/*border: 1px solid #DEE2E6;*/
	box-sizing: border-box;
	border-radius: 3px;	
	padding:59px 30px 40px 30px;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
	position:relative;
	outline: 1px solid #DEE2E6;
	outline-offset: -1px;
	position:relative;
	overflow:hidden;
}

.bricks .brick svg {
	content: "";
	position: absolute!important;
	width: 100%;
	height: 100%;
	top:0;
	left: 0;
	z-index: 1;
	stroke-width: 1px;
	stroke:#020E18;
	fill:none;
	stroke-dasharray: 2000;
	stroke-dashoffset: 2000;
	transition: stroke-dashoffset 1s;
	transition-timing-function: linear;
}

.bricks .brick svg rect {
	width: 100%;
	height: 100%
}

.bricks .brick:hover svg {
	transition: stroke-dashoffset 1s;
	transition-timing-function: linear;
	stroke-dashoffset:0;
}

.bricks .brick::before {
	content:'';
	display:block;
	width:50px;
	height:50px;
	border-radius:50%;
	background: #020E18;
	position:absolute;
	top:51px;
	left:30px;
	transition: all 0.5s;
}

.bricks .brick::after {
	content:'';
	display:block;
	width:50px;
	height:50px;
	position:absolute;
	top:51px;
	left:30px;
}

.bricks .brick:nth-child(1)::after { background:url("images/bricks-1.svg") no-repeat center center; }
.bricks .brick:nth-child(2)::after { background:url("images/bricks-2.svg") no-repeat center center; }

.bricks .brick:hover::before { 
	transform: rotateY(180deg); 
	background:#ADB5BD;
}

.bricks .brick h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	line-height: 140%;
	color: #020E18;	
	box-sizing: border-box;
	padding:0 0 0 63px;
	margin:0 0 32px 0;
	position:relative;
	z-index:2;
}

.bricks .brick h3::before {
	content:'';
	display:block;
	left:-30px;
	top:-17px;
	bottom:-17px;
	width:1px;
	background:#FFF;
	position:absolute;
	z-index:3;
}

.bricks .brick h3::after {
	content:'';
	display:block;
	left:-30px;
	top:-10px;
	bottom:-10px;
	width:1px;
	background:#6f7a85;
	position:absolute;
	z-index:4;
	transition: all 0.5s;
}

.bricks .brick h3 a {
	color: #020E18;
	text-decoration:underline;
}

.bricks .brick h3 a:hover {
	text-decoration:none;
}

.bricks .brick ul {
	margin:20px 0 0 0;
	padding:0;
	box-sizing: border-box;
}

.bricks .brick li {
	padding:5px 0 5px 28px;
	display:block;
	box-sizing: border-box;
	position:relative;
}

.bricks .brick li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.bricks .brick li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.my-experience {
	background:url("images/my-experience.jpg") no-repeat center center;
	background-size:cover;
}

.my-experience .center {
	display:flex;
	justify-content: space-between;
	align-items: flex-end;		
}

.my-experience .left {
	background:url("images/my-experience-left.png") no-repeat center center;
	width:435px;
	height:630px;
	background-size:435px auto;
}

.my-experience .right {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #FFFFFF;	
	width:670px;
	padding:80px 0;
}

.my-experience .right h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 120%;
	margin:0 0 30px 0;
}

.my-experience .right h3 {
	font-family: 'Lora', serif;
	margin:20px 0 10px;
	font-style: normal;
	font-weight: 500;
	font-size: 22px;
	line-height: 140%;
	padding-left:51px;
	position:relative;
}

.my-experience .right h3::before {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	top:10px;
	background:url("images/my-experience-h3.svg") no-repeat center center;
	width:40px;
	height:12px;
}

.sertificates {
	padding:80px 0;
}

.sertificates h2 {
	font-family: 'Lora', serif;
	margin:0 0 40px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #020E18;
}

.sertificates .listings {
	display:flex;
	justify-content: space-between;
	align-items: center;		
	position:relative;
	margin:0 -15px;
	padding:0 0 74px 0;
}

.sertificates .listings .item {
	width:270px;
	height:377px;
	background: rgba(242,245,248, 0.77);
	border-radius: 4px;
	padding:0 20px;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 140%;
	text-align: center;
	color: #757B81;
	transition: all 0.5s;
	margin:35px 15px 0 15px;
}

.sertificates .listings .item a {
	display:block;
	width:230px;
	height:326px;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	position:relative;
	top:-20px;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	transition: all 0.5s;
	box-shadow:0px 7px 20px rgba(0, 0, 0, 0.07);
}

.sertificates .listings .item:hover {
	color: #020E18;
}

.sertificates .listings .item:hover a {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);	
	top:-25px;
}

.sertificates .listings .slick-prev,
.sertificates .listings .slick-next {
	position:absolute;
	bottom:0px;
	display:block;
	width:44px;
	height:44px;
	border: 1px solid #DEE2E6;
	box-sizing: border-box;
	background:#FFF;
	text-indent:-9999px;
	transition: all 0.5s;
	border-radius:50%;
	cursor:pointer;
	z-index:3;
}

.sertificates .listings .slick-prev { left:15px; }
.sertificates .listings .slick-next { right:15px; }

.sertificates .listings .slick-prev::before,
.sertificates .listings .slick-next::before {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	width:100%;
	height:100%;
	position:absolute;
	transition: 0.5s;
	cursor:pointer;
	background:url("images/prev.svg") no-repeat 50% center;
}

.sertificates .listings .slick-next::before {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

.sertificates .listings .slick-prev:hover,
.sertificates .listings .slick-next:hover {
	background: #DEE2E6;
	border: 1px solid #DEE2E6;
}

.sertificates .listings .slick-dots {
	display:block;
	width:100%;
	position:absolute;
	left:0px;
	bottom:7px;
	height:16px;
	font-size:0px;
	text-align:center;
	z-index:2;
}

.sertificates .listings .slick-dots li {
	display:inline-block;
	width:6px;
	height:6px;
	background: #DEE2E6;
	border-radius: 50%;	
	transition: all 0.5s;
	text-indent:-9999px;
	margin:0 10px;
	position:relative;
}

.sertificates .listings .slick-dots li::before {
	content:'';
	display:block;
	top:1px;
	bottom:1px;
	left:1px;
	right:1px;
	border: 1px solid #ADB5BD;
	border-radius: 50%;	
	position:absolute;
	transition: all 0.5s;
	z-index:-1;
}

.sertificates .listings .slick-dots .slick-active { background: #ADB5BD; }

.sertificates .listings .slick-dots .slick-active::before {
	top:-5px;
	bottom:-5px;
	left:-5px;
	right:-5px;
	z-index:2;
}

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

.distance-project {
	padding:80px 0 76px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
}

.distance-project h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	margin:0 0 50px 0;
}

.distance-project h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 25px;
	line-height: 140%;
	color: #020E18;	
	margin:40px 0 20px 0;
}

.distance-project h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 21px;
	line-height: 140%;
	color: #020E18;	
	margin:20px 0 20px 0;
}

.distance-project ol {
	display:block;
	box-sizing: border-box;
	margin:15px 0;
	padding-left:23px;
}

.distance-project ol li { padding-left:5px; }

.distance-project ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.distance-project ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.distance-project ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.design-stages {
	padding:84px 0 80px 0;
	background:url("images/design-stages.jpg") no-repeat center center;
	background-size:cover;
}

.design-stages h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #FFFFFF;
	margin:0 0 51px 0;
}

.design-stages .listings {
	position:relative;
}

.design-stages .listings::before {
	content:'';
	position:absolute;
	left:-48px;
	top:50px;
	bottom:0px;
	width:1px;
	display:block;
	background:url("images/design-stages-listings.svg") repeat 0 0;
}

.design-stages .listings .item {
	background: #FFFFFF;
	border: 1px solid #DEE2E6;
	box-sizing: border-box;
	border-radius: 4px;	
	margin:10px 0 0 0;
	padding:29px 30px 30px 30px;
	position:relative;
}

.design-stages .listings .item i {
	background:url("images/design-stages-i.svg") no-repeat center center;
	width:38px;
	height:38px;
	display:flex;
	color: #020E18;
	font-style: normal;
	font-weight: 600;
	font-size: 15px;
	line-height: 15px;
	align-items: center;
	text-align: center;
	justify-content:center;
	position:absolute;
	left:-68px;
	top:42px;
}

.design-stages .listings .item i::before {
	content:'';
	display:block;
	width:12px;
	height:17px;
	background:url("images/design-stages-i-before.svg") no-repeat center center;
	position:absolute;
	right:-15px;
	top:50%;
	margin:-9px 0 0 0;
}

.design-stages .listings .item::after {
	content:'';
	display:block;
	width:19px;
	height:67px;
	background:url("images/arrow-down.svg") no-repeat center center;
	position:absolute;
	left:-58px;
	bottom:calc(50% - 44px);
	margin:0 0 -50px 0;
}

.design-stages .listings .item:last-child::after { display:none; }

.design-stages .listings .item:first-child { margin:0px; }

.design-stages .listings .item h3 {
	font-family: 'Lora', serif;
	display:block;
	padding:17px 0;
	margin:0 0 9px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 22px;
	line-height: 140%;
	color: #020E18;
	position:relative;
}

.design-stages .listings .item h3::before {
	content:'';
	position:absolute;
	left:-31px;
	top:7px;
	bottom:7px;
	width:1px;
	background:#001325;
}

.design-stages .listings .list {
	background: #F8F9FA;
	border-radius: 3px;
	box-sizing: border-box;
	padding:30px 20px;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
	transition: all 0.5s;
}

.design-stages .listings .list:hover { background:#e0e2e7; }

.design-stages .listings .list li { 
	position:relative;
	left:0px;
	transition: all 0.5s;
}

.design-stages .listings .list:hover ul li { left:10px; }

.design-stages .listings .list li:nth-child(1)  { transition-delay: 0.2s; }
.design-stages .listings .list li:nth-child(2)  { transition-delay: 0.4s; }
.design-stages .listings .list li:nth-child(3)  { transition-delay: 0.6s; }
.design-stages .listings .list li:nth-child(4)  { transition-delay: 0.8s; }
.design-stages .listings .list li:nth-child(5)  { transition-delay: 1.0s; }
.design-stages .listings .list li:nth-child(6)  { transition-delay: 1.2s; }
.design-stages .listings .list li:nth-child(7)  { transition-delay: 1.4s; }
.design-stages .listings .list li:nth-child(8)  { transition-delay: 1.6s; }
.design-stages .listings .list li:nth-child(9)  { transition-delay: 1.8s; }
.design-stages .listings .list li:nth-child(10) { transition-delay: 2.0s; }

@keyframes left-li {

	100% {
		left:10px;
	}
}

.design-stages .listings .list ul {
	margin:0;
	padding:0;
	box-sizing: border-box;
}

.design-stages .listings .list ul li {
	padding:5px 0 5px 28px;
	display:block;
	box-sizing: border-box;
	position:relative;
}

.design-stages .listings .list ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-about.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.design-stages .listings .list ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.design-stages .data {
	padding:50px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #FFFFFF;	
}

.design-stages .buttons {
	display:flex;
}

.design-stages .buttons a.detailed-plan,
.design-stages .buttons a.order-service {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	padding:21px 84px 21px 30px;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #FFFFFF;
	position:relative;
	overflow:hidden;
}

.design-stages .buttons a.detailed-plan span,
.design-stages .buttons a.order-service span {
	position:relative;
	z-index:5;
}

.design-stages .buttons a.detailed-plan {
	color: #FFFFFF;	
}

.design-stages .buttons a.order-service {
	margin-left:20px;
	color: #020E18;	
	background:#FFF;
	border:none;
	padding:22px 85px 22px 31px;
}

.design-stages .buttons a.detailed-plan::before,
.design-stages .buttons a.order-service::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	top:50%;
	right:30px;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
}

.design-stages .buttons a.detailed-plan::before { background:url("images/pagination-white.svg") no-repeat center center; }
.design-stages .buttons a.order-service::before { background:url("images/pagination.svg") no-repeat center center; }

.design-stages .buttons a.detailed-plan::after,
.design-stages .buttons a.order-service::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
}

.design-stages .buttons a.detailed-plan:hover::after,
.design-stages .buttons a.order-service:hover::after {
	width:100%;
}

.design-stages .buttons a.detailed-plan:hover::before,
.design-stages .buttons a.order-service:hover::before { 
	right:25px; 
}

.design-stages .buttons a.detailed-plan:hover::before { background:url("images/pagination.svg") no-repeat center center; }
.design-stages .buttons a.order-service:hover::before { background:url("images/pagination-white.svg") no-repeat center center; }

.design-stages .buttons a.detailed-plan::after { background:#FFF; }
.design-stages .buttons a.order-service::after { background:#020E18; }

.design-stages .buttons a.detailed-plan:hover span {
	color: #020E18;	
	animation-duration: 0.5s;
	animation-name: toptobottom-text;		
}

.design-stages .buttons a.order-service:hover span {
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

.project-down {
	padding:80px 0;
}

.project-down .listings .cell {
	display:block;
	padding:30px 0 0;
	box-sizing: border-box;
	margin-bottom:30px;
}

.project-down .listings .cell:first-child { padding-top:0px; }

.project-down .listings .cell .content { 
	padding:0 0 0 51px;
	box-sizing: border-box;
	margin:0;
}

.project-down .listings .cell .content ul {
	margin-bottom:0;
	padding-bottom:0;
}

.project-down .listings .cell .content ul ~ p {
	margin:28px 0 0 0;
}

.project-down .listings .cell .content ul ~ p ~ p { margin:0; }

.project-down h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 27px;
	line-height: 140%;
	color: #020E18;	
	margin:0 0 20px 0;
	padding-left:51px;
	position:relative;
}

.project-down h3 i {
	display:block;
	width:38px;
	height:38px;
	position:absolute;
	left:0px;
	top:50%;
	margin:-19px 0 0 0;
	background-position:center center;
	background-repeat:no-repeat;
	box-sizing: border-box;
}

.project-down .buttons {
	border-top:1px solid #DEE2E6;
	padding-top:30px;
	margin-top:30px;
	display:flex;
	justify-content: space-between;
	align-items: center;
}

.project-down .buttons a {
	display:inline-block;
	width:calc(50% - 15px);
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: left;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;	
	padding:16px 0 16px 60px;
	background:#DEE2E6;
	border-radius:3px;
	box-sizing: border-box;
	text-decoration:none;
	position:relative;
	overflow:hidden;
}

.project-down .buttons a::before {
	content:'';
	display:block;
	width:21px;
	height:20px;
	position:absolute;
	left:30px;
	top:50%;
	margin:-10px 0 0 0;
	z-index:3;
}

.project-down .buttons a.projects::before { background:url("images/project-down-buttons-1.svg") no-repeat center center; }
.project-down .buttons a.materials::before { background:url("images/project-down-buttons-2.svg") no-repeat center center; }

.project-down .buttons a.projects:hover::before {
	background:url("images/project-down-buttons-1-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.project-down .buttons a.materials:hover::before {
	background:url("images/project-down-buttons-2-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.project-down .buttons a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.project-down .buttons a:hover::after {
	width:100%;
}

.project-down .buttons a span {
	position:relative;
	z-index:5;
}

.project-down .buttons a:hover span{
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

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

.standart-buttons {
	border-top:1px solid #DEE2E6;
	padding-top:30px;
	margin-top:30px;
	display:flex;
	justify-content: space-between;
	align-items: center;
}

.standart-buttons a {
	display:inline-block;
	width:calc(50% - 15px);
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: left;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;	
	padding:16px 0 16px 60px;
	background:#DEE2E6;
	border-radius:3px;
	box-sizing: border-box;
	text-decoration:none;
	position:relative;
	overflow:hidden;
}

.standart-buttons a::before {
	content:'';
	display:block;
	width:21px;
	height:20px;
	position:absolute;
	left:30px;
	top:50%;
	margin:-10px 0 0 0;
	z-index:3;
}

.standart-buttons a.projects::before { background:url("images/project-down-buttons-1.svg") no-repeat center center; }
.standart-buttons a.materials::before { background:url("images/project-down-buttons-2.svg") no-repeat center center; }

.standart-buttons a.projects:hover::before {
	background:url("images/project-down-buttons-1-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.standart-buttons a.materials:hover::before {
	background:url("images/project-down-buttons-2-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.standart-buttons a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.standart-buttons a:hover::after {
	width:100%;
}

.standart-buttons a span {
	position:relative;
	z-index:5;
}

.standart-buttons a:hover span{
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

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

.group-works-up {
	padding:80px 0 76px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
}

.group-works-up h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	margin:0 0 50px 0;
}

.group-works-up h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #020E18;
	margin:20px 0 0 0;
}

.group-works-up h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 25px;
	line-height: 140%;
	color: #020E18;
	margin:30px 0 0 0;
}

.group-works-up p {
	padding:10px 0;
}

.group-works-up ul {
	margin:15px 0 25px 0;
}

.group-works-up ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.group-works-up ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:6px;
	left:0px;
}

.group-works-up ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:6px;
	left:1px;
}











.group-works-stages {
	padding:80px 0 80px 0;
	background:url("images/group-works-stages.jpg") no-repeat center center;
	background-size:cover;
}

.group-works-stages h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #020E18;
	margin:0 0 51px 0;
}

.group-works-stages .listings {
	position:relative;
}

.group-works-stages .listings::before {
	content:'';
	position:absolute;
	left:-48px;
	top:50px;
	bottom:0px;
	width:1px;
	display:block;
	background:url("images/group-works-stages-listings.svg") repeat 0 0;
}

.group-works-stages .listings .item {
	background: #FFFFFF;
	border: 1px solid #DEE2E6;
	box-sizing: border-box;
	border-radius: 4px;	
	margin:10px 0 0 0;
	padding:29px 30px 30px 30px;
	position:relative;
}

.group-works-stages .listings .item i {
	background:url("images/group-works-stages-i.svg") no-repeat center center;
	width:38px;
	height:38px;
	display:flex;
	color: #020E18;
	font-style: normal;
	font-weight: 600;
	font-size: 15px;
	line-height: 15px;
	align-items: center;
	text-align: center;
	justify-content:center;
	position:absolute;
	left:-68px;
	top:42px;
}

.group-works-stages .listings .item i::before {
	content:'';
	display:block;
	width:12px;
	height:17px;
	background:url("images/group-works-stages-i-before.svg") no-repeat center center;
	position:absolute;
	right:-15px;
	top:50%;
	margin:-9px 0 0 0;
}

.group-works-stages .listings .item:first-child { margin:0px; }

.group-works-stages .listings .item h3 {
	font-family: 'Lora', serif;
	display:block;
	padding:17px 0;
	margin:0 0 9px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 22px;
	line-height: 140%;
	color: #020E18;
	position:relative;
}

.group-works-stages .listings .item h3::before {
	content:'';
	position:absolute;
	left:-31px;
	top:7px;
	bottom:7px;
	width:1px;
	background:#001325;
}

.group-works-stages .listings .list {
	background: #F8F9FA;
	border-radius: 3px;
	box-sizing: border-box;
	padding:30px 20px 30px 264px;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
	transition: all 0.5s;
	position:relative;
	border-radius:3px;
	overflow:hidden;
}

.group-works-stages .listings .list:hover { background:#e0e2e7; }

.group-works-stages .listings .list span {
	display:block;
	position:absolute;
	left:0px;
	top:0px;
	bottom:0px;
	width:244px;
	z-index:1;
	background-size:auto 100%;
	background-position:center center;
	background-repeat:no-repeat;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	transition: all 0.5s;	
}

.group-works-stages .listings .list:hover span {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);	
	background-size:auto calc(100% + 10px);
}

.group-works-stages .listings .list li { 
	position:relative;
	left:0px;
	transition: all 0.5s;
}

.group-works-stages .listings .list:hover ul li { left:10px; }

.group-works-stages .listings .list li:nth-child(1)  { transition-delay: 0.2s; }
.group-works-stages .listings .list li:nth-child(2)  { transition-delay: 0.4s; }
.group-works-stages .listings .list li:nth-child(3)  { transition-delay: 0.6s; }
.group-works-stages .listings .list li:nth-child(4)  { transition-delay: 0.8s; }
.group-works-stages .listings .list li:nth-child(5)  { transition-delay: 1.0s; }
.group-works-stages .listings .list li:nth-child(6)  { transition-delay: 1.2s; }
.group-works-stages .listings .list li:nth-child(7)  { transition-delay: 1.4s; }
.group-works-stages .listings .list li:nth-child(8)  { transition-delay: 1.6s; }
.group-works-stages .listings .list li:nth-child(9)  { transition-delay: 1.8s; }
.group-works-stages .listings .list li:nth-child(10) { transition-delay: 2.0s; }

.group-works-stages .listings .list ul {
	margin:0;
	padding:0;
	box-sizing: border-box;
}

.group-works-stages .listings .list ul li {
	padding:5px 0 5px 28px;
	display:block;
	box-sizing: border-box;
	position:relative;
}

.group-works-stages .listings .list ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-about.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.group-works-stages .listings .list ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.group-works-stages .listings .more { padding:20px 0 0 0; }

.group-works-stages .listings .more a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	padding:21px 82px 21px 30px;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #020E18;
	position:relative;
	overflow:hidden;
	color: #020E18;
}

.group-works-stages .listings .more a span {
	position:relative;
	z-index:5;
}

.group-works-stages .listings .more a::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	top:50%;
	right:30px;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
	background:url("images/pagination.svg") no-repeat center center;
}

.group-works-stages .listings .more a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.group-works-stages .listings .more a:hover::after { width:100%; }

.group-works-stages .listings .more a:hover::before { 
	right:25px; 
	background:url("images/pagination-white.svg") no-repeat center center;
}

.group-works-stages .listings .more a:hover span {
	color: #FFF;	
	animation-duration: 0.5s;
	animation-name: toptobottom-text;		
}

.group-works-stages .buttons {
	padding:50px 0 0 0;
	text-align:center;
}

.group-works-stages .buttons div {
	display:inline-block;
	overflow:hidden;
	border-radius: 3px;
}

.group-works-stages .buttons a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	padding:21px 84px 21px 30px;
	box-sizing: border-box;
	position:relative;
	background: #020E18;
	color: #FFFFFF;	
}

.group-works-stages .buttons a span {
	position:relative;
	z-index:5;
}

.group-works-stages .buttons a::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	top:50%;
	right:30px;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
	background:url("images/pagination-white.svg") no-repeat center center;
}

.group-works-stages .buttons a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#FFF;
	overflow:hidden;
}

.group-works-stages .buttons a:hover::after { width:100%; }
.group-works-stages .buttons a:hover::before { 
	right:25px; 
	background:url("images/pagination.svg") no-repeat center center; 
}

.group-works-stages .buttons a:hover span {
	color: #020E18;	
	animation-duration: 0.5s;
	animation-name: toptobottom-text;		
}

.group-works-down {
	padding:80px 0;
}

.group-works-down .buttons {
	display:flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid #DEE2E6;
	padding:50px 0 0 0;
}

.group-works-down .buttons a {
	display:inline-block;
	width:calc(50% - 15px);
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: left;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;	
	padding:16px 0 16px 60px;
	background:#DEE2E6;
	border-radius:3px;
	box-sizing: border-box;
	text-decoration:none;
	position:relative;
	overflow:hidden;
}

.group-works-down .buttons a::before {
	content:'';
	display:block;
	width:21px;
	height:20px;
	position:absolute;
	left:30px;
	top:50%;
	margin:-10px 0 0 0;
	z-index:3;
}

.group-works-down .buttons a.projects::before { background:url("images/project-down-buttons-1.svg") no-repeat center center; }
.group-works-down .buttons a.materials::before { background:url("images/project-down-buttons-2.svg") no-repeat center center; }

.group-works-down .buttons a.projects:hover::before {
	background:url("images/project-down-buttons-1-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.group-works-down .buttons a.materials:hover::before {
	background:url("images/project-down-buttons-2-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.group-works-down .buttons a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.group-works-down .buttons a:hover::after {
	width:100%;
}

.group-works-down .buttons a span {
	position:relative;
	z-index:5;
}

.group-works-down .buttons a:hover span{
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

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

.sproject-bricks {
	padding-bottom:25px;
}

.sproject-bricks h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 27px;
	line-height: 140%;
	color: #020E18;
	padding:0 0 0 49px;
	box-sizing: border-box;
	position:relative;
	margin:0 0 20px 0;
}

.sproject-bricks h2::before {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	top:50%;
	width:42px;
	height:42px;
	margin:-21px 0 0 0;
}

.sproject-bricks .sproject-brick-1 h2::before { background:url("images/single-project-1.svg") no-repeat center center; }
.sproject-bricks .sproject-brick-2 h2::before { background:url("images/single-project-2.svg") no-repeat center center; }
.sproject-bricks .sproject-brick-3 h2::before { background:url("images/single-project-3.svg") no-repeat center center; }

.sproject-bricks .sproject-brick-1,
.sproject-bricks .sproject-brick-2 {
	border-bottom:1px solid #DEE2E6;
}

.sproject-bricks .sproject-brick-2,
.sproject-bricks .sproject-brick-3 {
	padding-top:30px;
}

.sproject-bricks .data {
	padding:0 0 0 49px;
	box-sizing: border-box;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;	
}

.sproject-bricks .data strong {
	font-size: 18px;
}

.sproject-bricks .data ul {
	margin:15px 0 25px 0;
}

.sproject-bricks .data p {
	margin:0 0 30px 0;
}

/*.sproject-bricks .sproject-brick-1 .data p:first-child { margin:0; }*/

.sproject-bricks .data ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.sproject-bricks .data ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.sproject-bricks .data ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.sproject-bricks h3 {
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 140%;
	color: #020E18;
	margin:0 0 15px 0;
	padding-left:36px;
	position:relative;
	box-sizing: border-box;
}

.sproject-bricks h3 span {
	position:absolute;
	width:26px;
	height:26px;
	border-radius:50%;
	background: #020E18;
	font-weight: 600;
	font-size: 16px;
	line-height:26px;
	display:block;
	text-align: center;
	color: #FFFFFF;	
	left:0px;
	top:50%;
	margin:-13px 0 0 0;
}

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

.nesting {
	margin:0px 0 0 0;
}

.nesting .tasks {
	margin:10px 0 0 0;
	transition: all 0.5s;
	box-sizing: border-box;
	border-radius: 4px;	
	overflow:hidden;
	border: 1px solid transparent;
}

.nesting .tasks.active {
	border: 1px solid #ADB5BD;
}

.nesting .tasks .titles-small {
	padding:20px 85px 30px 30px;
	background: #F8F9FA;
	position:relative;
	transition: all 0.5s;
	cursor:pointer;
}

.nesting .tasks.active .titles-small { background:#FFF; }

.nesting .tasks .titles-small::before {
	content:'';
	display:block;
	width:39px;
	height:39px;
	background:url("images/plus.svg") no-repeat center center;
	position:absolute;
	right:29px;
	top:37px;
	transition: all 0.5s;
}

.nesting .tasks .titles-small:hover::before {
	background:url("images/plus-hover.svg") no-repeat center center;
}

.nesting .tasks.active .titles-small::before,
.nesting .tasks.active .titles-small:hover::before {
	background:url("images/minus.svg") no-repeat center center;
}

.nesting .tasks .titles-small b {
	display:block;
	margin:0 0 2px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 140%;
	color: #757B81;	
}

.nesting .tasks .titles-small h4 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 21px;
	line-height: 140%;
	color: #020E18;	
}

.nesting .tasks .hideblock-small {
	background: #FFFFFF;
	/*border: 1px solid #ADB5BD;*/
	box-sizing: border-box;
	padding:0 30px 30px 30px;
	display:none;
}

.nesting .tasks h5 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 27px;
	line-height: 140%;
	color: #020E18;	
	margin:0 0 10px 0;
	position:relative;
	padding:0 0 0 60px;
}

.nesting .tasks h5::before {
	content:'';
	display:block;
	width:42px;
	height:42px;
	position:absolute;
	top:50%;
	left:0px;
	margin:-21px 0 0 0;
}

.nesting .tasks .job-description h5::before { background:url("images/single-project-2.svg") no-repeat center center; }
.nesting .tasks .results h5::before { background:url("images/project-down-1.svg") no-repeat center center; }
.nesting .tasks .duration h5::before { background:url("images/project-down-2.svg") no-repeat center center; }

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

.harmonics {
	margin-bottom:80px;
}

.harmonics h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	margin:80px 0 50px 0;
	text-align:left;
}

.harmonics .harmonic {
	margin:10px 0 0 0;
	transition: all 0.5s;
	box-sizing: border-box;
	border-radius: 4px;	
	overflow:hidden;
	border: 1px solid transparent;
}

.harmonics .harmonic.active {
	border: 1px solid #ADB5BD;
}

.harmonics .harmonic:first-child { margin:0; }

.harmonic .titles {
	padding:20px 85px 30px 30px;
	background: #F8F9FA;
	position:relative;
	transition: all 0.5s;
	cursor:pointer;
}

.harmonic.active .titles { background:#FFF; }

.harmonic .titles::before {
	content:'';
	display:block;
	width:39px;
	height:39px;
	background:url("images/plus.svg") no-repeat center center;
	position:absolute;
	right:29px;
	top:37px;
	transition: all 0.5s;
}

.harmonic .titles:hover::before {
	background:url("images/plus-hover.svg") no-repeat center center;
}

.harmonic.active .titles::before,
.harmonic.active .titles:hover::before {
	background:url("images/minus.svg") no-repeat center center;
}

.harmonic .titles b {
	display:block;
	margin:0 0 2px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 140%;
	color: #757B81;	
}

.harmonic .titles h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 23px;
	line-height: 140%;
	color: #020E18;	
}

.harmonic .hideblock {
	background: #FFFFFF;
	/*border: 1px solid #ADB5BD;*/
	box-sizing: border-box;
	padding:0 30px 30px 30px;
	display:none;
}

.harmonic .job-description,
.harmonic .results,
.harmonic .duration {
	border-top: 1px solid #DEE2E6;
	padding:30px 0 0 0;
}

.harmonic .results,
.harmonic .duration {
	margin:30px 0 0 0;
}

.harmonic h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 27px;
	line-height: 140%;
	color: #020E18;	
	margin:0 0 10px 0;
	position:relative;
	padding:0 0 0 60px;
}

.harmonic h3::before {
	content:'';
	display:block;
	width:42px;
	height:42px;
	position:absolute;
	top:50%;
	left:0px;
	margin:-21px 0 0 0;
}

.harmonic .job-description h3::before { background:url("images/single-project-2.svg") no-repeat center center; }
.harmonic .results h3::before { background:url("images/project-down-1.svg") no-repeat center center; }
.harmonic .duration h3::before { background:url("images/project-down-2.svg") no-repeat center center; }

.harmonic .data {
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 140%;
	color: #020E18;	
	padding-left:60px;
}

.harmonic .data p {
	margin:10px 0;
	display:block;
}

.harmonic .data ul {
	margin:15px 0 5px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
}

.harmonic .data ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.harmonic .data ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.harmonic .data ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.harmonic .data ol {
	counter-reset: my-counter;
	margin:15px 0 5px 0;
	box-sizing: border-box;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
}

.harmonic .data ol li {
	display:block;
	list-style:none;
	counter-increment: my-counter;
	display:block;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.harmonic .data ol li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.harmonic .data ol li::after {
	content: counter(my-counter);
	font-style: normal;
	font-weight: 500;
	font-size: 11px;
	line-height: 20px;
	text-align: center;
	color: #020E18;
	position:absolute;
	left:0px;
	top:5px;
	width:18px;
	height:20px;
}

.harmonic .examples-results {
	border-top: 1px solid #DEE2E6;
	padding:35px 0 0 0;	
	margin:30px 0 0 0;
}

.harmonic .examples-results a {
	display:inline-block;
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: left;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;	
	padding:16px 32px 16px 62px;
	background:#DEE2E6;
	border-radius:3px;
	box-sizing: border-box;
	text-decoration:none;
	position:relative;
	overflow:hidden;
}

.harmonic .examples-results a::before {
	content:'';
	display:block;
	width:22px;
	height:22px;
	position:absolute;
	left:30px;
	top:50%;
	margin:-11px 0 0 0;
	z-index:3;
	background:url("images/harmonic-examples-results.svg") no-repeat center center;
}

.harmonic .examples-results a:hover::before {
	background:url("images/harmonic-examples-results-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.harmonic .examples-results a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.harmonic .examples-results a:hover::after {
	width:100%;
}

.harmonic .examples-results a span {
	position:relative;
	z-index:5;
}

.harmonic .examples-results a:hover span{
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

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

.harmonics-old {
	margin-bottom:80px;
}

.harmonics-old h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	margin:80px 0 50px 0;
	text-align:left;
}

.harmonics-old .harmonic-old {
	margin:10px 0 0 0;
	transition: all 0.5s;
	box-sizing: border-box;
	border-radius: 4px;	
	overflow:hidden;
	border: 1px solid transparent;
}

.harmonics-old .harmonic-old.active {
	border: 1px solid #ADB5BD;
}

.harmonics-old .harmonic-old:first-child { margin:0; }

.harmonic-old .titles {
	padding:20px 85px 30px 30px;
	background: #F8F9FA;
	position:relative;
	transition: all 0.5s;
	cursor:pointer;
}

.harmonic-old.active .titles { background:#FFF; }

.harmonic-old .titles::before {
	content:'';
	display:block;
	width:39px;
	height:39px;
	background:url("images/plus.svg") no-repeat center center;
	position:absolute;
	right:29px;
	top:37px;
	transition: all 0.5s;
}

.harmonic-old .titles:hover::before {
	background:url("images/plus-hover.svg") no-repeat center center;
}

.harmonic-old.active .titles::before,
.harmonic-old.active .titles:hover::before {
	background:url("images/minus.svg") no-repeat center center;
}

.harmonic-old .titles b {
	display:block;
	margin:0 0 2px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 140%;
	color: #757B81;	
}

.harmonic-old .titles h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 23px;
	line-height: 140%;
	color: #020E18;	
}

.harmonic-old .hideblock {
	background: #FFFFFF;
	/*border: 1px solid #ADB5BD;*/
	box-sizing: border-box;
	padding:0 30px 30px 30px;
	display:none;
}

.harmonic-old .job-description,
.harmonic-old .results,
.harmonic-old .duration {
	border-top: 1px solid #DEE2E6;
	padding:30px 0 0 0;
}

.harmonic-old .results,
.harmonic-old .duration {
	margin:30px 0 0 0;
}

.harmonic-old h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 27px;
	line-height: 140%;
	color: #020E18;	
	margin:0 0 10px 0;
	position:relative;
	padding:0 0 0 60px;
}

.harmonic-old h3::before {
	content:'';
	display:block;
	width:42px;
	height:42px;
	position:absolute;
	top:50%;
	left:0px;
	margin:-21px 0 0 0;
}

.harmonic-old .job-description h3::before { background:url("images/single-project-2.svg") no-repeat center center; }
.harmonic-old .results h3::before { background:url("images/project-down-1.svg") no-repeat center center; }
.harmonic-old .duration h3::before { background:url("images/project-down-2.svg") no-repeat center center; }

.harmonic-old .data {
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 140%;
	color: #020E18;	
	padding-left:60px;
}

.harmonic-old .data p {
	margin:10px 0;
	display:block;
}

.harmonic-old .data ul {
	margin:15px 0 5px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
}

.harmonic-old .data ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.harmonic-old .data ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.harmonic-old .data ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.harmonic-old .data ol {
	counter-reset: my-counter;
	margin:15px 0 5px 0;
	box-sizing: border-box;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
}

.harmonic-old .data ol li {
	display:block;
	list-style:none;
	counter-increment: my-counter;
	display:block;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.harmonic-old .data ol li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.harmonic-old .data ol li::after {
	content: counter(my-counter);
	font-style: normal;
	font-weight: 500;
	font-size: 11px;
	line-height: 20px;
	text-align: center;
	color: #020E18;
	position:absolute;
	left:0px;
	top:5px;
	width:18px;
	height:20px;
}

.harmonic-old .examples-results {
	border-top: 1px solid #DEE2E6;
	padding:35px 0 0 0;	
	margin:30px 0 0 0;
}

.harmonic-old .examples-results a {
	display:inline-block;
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	text-align: left;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;	
	padding:16px 32px 16px 62px;
	background:#DEE2E6;
	border-radius:3px;
	box-sizing: border-box;
	text-decoration:none;
	position:relative;
	overflow:hidden;
}

.harmonic-old .examples-results a::before {
	content:'';
	display:block;
	width:22px;
	height:22px;
	position:absolute;
	left:30px;
	top:50%;
	margin:-11px 0 0 0;
	z-index:3;
	background:url("images/harmonic-examples-results.svg") no-repeat center center;
}

.harmonic-old .examples-results a:hover::before {
	background:url("images/harmonic-examples-results-white.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.harmonic-old .examples-results a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.harmonic-old .examples-results a:hover::after {
	width:100%;
}

.harmonic-old .examples-results a span {
	position:relative;
	z-index:5;
}

.harmonic-old .examples-results a:hover span{
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

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

.partners {
	padding:80px 0 60px;
}

.partners h1 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	margin:0 0 40px 0;
}

.partners  .data {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
}

.partners  .data p {
	padding:10px 0 20px;
}

.partners  .data h2 {
	font-family: 'Lora', serif;
	padding:10px 0 20px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 25px;
	line-height: 140%;
	color: #020E18;
}

.partners  .data ul {
	padding:10px 0 30px 0;
}

.partners  .data ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.partners  .data ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:7px;
	left:0px;
}

.partners .data ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:7px;
	left:1px;
}

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

.complex-approach {
	background: #f8f9fa;
	padding:107px 0 100px;
}

.complex-approach .title {
	display:flex;
	justify-content: space-between;
	align-items: center;	
	margin:0 0 50px 0;
}

.complex-approach .title h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	width:319px;
}

.complex-approach .title .description {
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 180%;
	color: #757B81;	
	width:770px;
	padding:10px 0 0 0;
}

.complex-approach .current-state h3 {
	font-family: 'Lora', serif;
	display:inline-block;
	position:relative;
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	line-height: 120%;
	color: #FFFFFF;
	padding:5px 10px 5px 30px;
	background: #757B81;
	border-radius: 3px 3px 3px 0px;
	margin:0 0 29px 0;
}

.complex-approach .current-state h3:after {
	content:'';
	display:block;
	width:18px;
	height:14px;
	background:url("images/current-state-triagle.svg") no-repeat center center;
	position:absolute;
	left:0px;
	bottom:-14px;
}

.complex-approach .current-state h3::before {
	content:'';
	width:11px;
	height:17px;
	display:block;
	background:url("images/current-state-h3.svg") no-repeat center center;
	position:absolute;
	top:12px;
	left:13px;
}

.complex-approach .current-state .list .item {
	background: #FFFFFF;
	border: 1px solid #DEE2E6;
	box-sizing: border-box;
	border-radius: 4px;	
	margin:10px 0 0 0;
	padding:30px 0;
	transition: all 0.5s;
}

.complex-approach .current-state .item a.show {
	display:none;
}

.complex-approach .current-state .list .item:hover {
	border: 1px solid rgba(2,14,24, 0.3);
}

.complex-approach .current-state .list .item:first-child { margin:0; }

.complex-approach .current-state .item h4 {
	font-family: 'Lora', serif;
	display:block;
	padding:7px 30px;
	position:relative;
	font-style: normal;
	font-weight: 500;
	font-size: 22px;
	line-height: 140%;
	color: #020E18;
	position:relative;
}

.complex-approach .current-state .item h4::before {
	content:'';
	display:block;
	left:-1px;
	top:0px;
	bottom:0px;
	width:1px;
	background:#020E18;
	position:absolute;
	z-index:2;
}

.complex-approach .current-state .item h4::after {
	content:'';
	display:block;
	left:-1px;
	top:-7px;
	bottom:-7px;
	width:1px;
	background:#FFF;
	position:absolute;
	z-index:1;
}

.complex-approach .current-state .stages {
	font-family: 'Lora', serif;
	background: #F8F9FA;
	border-radius: 3px;
	margin:20px 30px 20px;
	box-sizing: border-box;
	padding:30px 20px 25px;
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 140%;
	color: #020E18;
	transition: all 0.5s;
}

.complex-approach .current-state .stages:hover { background:#e0e2e7; }

.complex-approach .current-state .stages ol {
	margin:11px 0 0 0;
	display:block;
	font-family: 'Inter', sans-serif;
	font-size: 15px;
	line-height: 140%;
}

.complex-approach .current-state .stages ol li {
	display:block;
	list-style:none;
	counter-increment: my-counter;
	display:block;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
	transition: all 0.5s;
	left:0px;
}

.complex-approach .current-state .stages ol li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-about.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.complex-approach .current-state .stages ol li::after {
	content: counter(my-counter);
	font-style: normal;
	font-weight: 500;
	font-size: 11px;
	line-height: 20px;
	text-align: center;
	color: #020E18;
	position:absolute;
	left:0px;
	top:5px;
	width:18px;
	height:20px;
}

.complex-approach .current-state .stages:hover ol li { left:10px; }

.complex-approach .current-state .stages li:nth-child(1)  { transition-delay: 0.2s; }
.complex-approach .current-state .stages li:nth-child(2)  { transition-delay: 0.4s; }
.complex-approach .current-state .stages li:nth-child(3)  { transition-delay: 0.6s; }
.complex-approach .current-state .stages li:nth-child(4)  { transition-delay: 0.8s; }
.complex-approach .current-state .stages li:nth-child(5)  { transition-delay: 1.0s; }
.complex-approach .current-state .stages li:nth-child(6)  { transition-delay: 1.2s; }
.complex-approach .current-state .stages li:nth-child(7)  { transition-delay: 1.4s; }
.complex-approach .current-state .stages li:nth-child(8)  { transition-delay: 1.6s; }
.complex-approach .current-state .stages li:nth-child(9)  { transition-delay: 1.8s; }
.complex-approach .current-state .stages li:nth-child(10) { transition-delay: 2.0s; }

.complex-approach .current-state .results {
	padding:0 10px 30px 50px;
	box-sizing: border-box;
	margin:-10px 0;
}

.complex-approach .current-state .results b {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 140%;
	color: #020E18;	
	margin:0 0 16px 0;
	display:block;
}

.complex-approach .current-state .results p span {
	font-style: normal;
	font-weight: 600;
	font-size: 13px;
	line-height: 140%;
	text-transform: uppercase;
	color: #020E18;	
	margin:10px 30px 10px 0;
	padding-left:30px;
	position:relative;
	display:inline-block;
}

.complex-approach .current-state .results p span:first-child { margin-left:0; }

.complex-approach .current-state .results p span::before {
	content:'';
	width:22px;
	height:22px;
	background:url("images/current-state-results.svg") no-repeat center center;
	display:block;
	position:absolute;
	left:0px;
	top:50%;
	margin:-11px 0 0 0;
}

.complex-approach .current-state .more {
	padding:0 30px;
}

.complex-approach .current-state .more a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	padding:21px 84px 21px 30px;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #020E18;
	position:relative;
	overflow:hidden;
}

.complex-approach .current-state .more a span {
	position:relative;
	z-index:5;
	color: #020E18;
}

.complex-approach .current-state .more a::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	top:50%;
	right:30px;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
}

.complex-approach .current-state .more a::before { background:url("images/pagination-hover.svg") no-repeat center center; }

.complex-approach .current-state .more a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#020E18;
}

.complex-approach .current-state .more a:hover::after {
	width:100%;
}

.complex-approach .current-state .more a:hover::before { 
	right:25px; 
}

.complex-approach .current-state .more a:hover::before { background:url("images/pagination.svg") no-repeat center center; }

.complex-approach .current-state .more a:hover span {
	color:#FFF;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

.complex-approach .goal-achievement h3 {
	font-family: 'Lora', serif;
	display:inline-block;
	position:relative;
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	line-height: 120%;
	color: #FFFFFF;
	padding:5px 10px 5px 30px;
	background: #757B81;
	border-radius: 0px 3px 3px 3px;
	margin:29px 0 0 0;
}

.complex-approach .goal-achievement h3:after {
	content:'';
	display:block;
	width:18px;
	height:14px;
	background:url("images/current-state-triagle2.svg") no-repeat center center;
	position:absolute;
	left:0px;
	top:-14px;
}

.complex-approach .goal-achievement h3::before {
	content:'';
	width:11px;
	height:17px;
	display:block;
	background:url("images/current-state-h3.svg") no-repeat center center;
	position:absolute;
	top:12px;
	left:13px;
}

.complex-approach .goal-achievement .description {
	padding:50px 0 30px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 180%;
	color: #757B81;
}

.complex-approach .send-request a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	padding:21px 40px 21px 68px;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #020E18;
	position:relative;
	overflow:hidden;
	text-decoration:none;
}

.complex-approach .send-request a span {
	position:relative;
	z-index:5;
	color: #FFFFFF;	
}

.complex-approach .send-request a::before {
	content:'';
	display:block;
	width:20px;
	height:16px;
	top:50%;
	left:40px;
	margin:-8px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
	background:url("images/menu-button-mail.svg") no-repeat center center;
}

.complex-approach .send-request a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background: #020E18;
	width:100%;
}

.complex-approach .send-request a:hover::after { width:0px; }

.complex-approach .send-request a:hover::before { 
	background:url("images/menu-button-mail-hover.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.complex-approach .send-request a:hover span {
	color: #020E18;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;		
}

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

.formats {
	padding:80px 0;
	background:url("images/formats.jpg") no-repeat center center;
	background-size:cover;
	transition: all 0.5s;
}

.formats h3 {
	font-family: 'Lora', serif;
	margin:0 0 50px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	line-height: 140%;
	color: #FFFFFF;	
}

.formats .list-tab {
	background: #FFFFFF;
	border: 1px solid #DEE2E6;
	box-sizing: border-box;
	border-radius: 4px;	
	padding:30px;
	display:flex;
	justify-content: space-between;
	align-items: stretch;
}

.formats .list-tab .left {
	width:230px;
	background: #DEE2E6;
	border-radius: 3px 0px 0px 3px;
	box-sizing: border-box;
	padding:24px 0;	
}

.formats .list-tab .left ul li {
	display:block;
	list-style:none;
}

.formats .list-tab .left ul li a {
	font-style: normal;
	font-weight: 600;
	font-size: 20px;
	line-height: 140%;
	color: #757B81;
	display:block;
	padding:16px 30px;
	text-decoration:none;
	transition: all 0.5s;
}

.formats .list-tab .left ul li a:hover {
	color: #020E18;
}

.formats .list-tab .left ul li a.active { 
	color: #020E18;
	background: #F8F9FA;
}

.formats .list-tab .right {
	width:calc(100% - 230px);
	background: #F8F9FA;
	border-radius: 0px 3px 3px 0px;
	box-sizing: border-box;
	padding:40px 30px 30px;
	transition: all 0.5s;
} 

.formats .list-tab .right .content ul {
	margin:-5px 0 15px 0;
}

.formats .list-tab .right .content ul li::before,
.formats .list-tab .right .content ul li::after {
	top:6px;
}

.formats .list-tab .tab { display:none; }

.formats .list-tab .tab.active {
	display:block;
}

.formats .button {
	padding:50px 0 0 0;
	text-align:center;
}

.formats .button a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	padding:21px 40px 21px 68px;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #FFFFFF;
	position:relative;
	overflow:hidden;
	color: #FFFFFF;	
}

.formats .button a span {
	position:relative;
	z-index:5;
}

.formats .button a::before {
	content:'';
	display:block;
	width:20px;
	height:16px;
	top:50%;
	left:40px;
	margin:-8px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
	background:url("images/menu-button-mail.svg") no-repeat center center;
}

.formats .button a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#FFF;
}

.formats .button a:hover::after { width:100%; }

.formats .button a:hover::before { 
	background:url("images/menu-button-mail-hover.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.formats .button a:hover span {
	color: #020E18;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;		
}

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

.flexible-technologies {
	background:#FFF;
	padding:100px 0;
}

.flexible-technologies .title {
	display:flex;
	justify-content: space-between;
	align-items: center;	
	margin:0 0 50px 0;
}

.flexible-technologies .title h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #020E18;	
	width:319px;
}

.flexible-technologies .title .description {
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 180%;
	color: #757B81;	
	width:770px;
	padding:10px 0 0 0;
}

.flexible-technologies .listings h3 {
	font-family: 'Lora', serif;
	display:block;
	padding:35px 98px 35px 30px;
	font-style: normal;
	font-weight: 500;
	font-size: 25px;
	line-height: 140%;
	color: #020E18;
	background: #F8F9FA;
	border-radius: 4px;
	position:relative;
	cursor:pointer;
	transition: all 0.5s;
}

.flexible-technologies .listings h3:hover { background:#f0f2f6; }

.flexible-technologies .listings .item.active h3,
.flexible-technologies .listings .item.active h3:hover {
	background:transparent!important;
	transition: 0s;
}

.flexible-technologies .listings h3::before {
	content:'';
	display:block;
	width:39px;
	height:39px;
	background:url("images/plus.svg") no-repeat center center;
	position:absolute;
	top:33px;
	right:29px;
	transition: all 0.5s;
}

.flexible-technologies .listings h3:hover::before { background:url("images/plus-hover.svg") no-repeat center center; }

.flexible-technologies .listings .item.active h3::before,
.flexible-technologies .listings .item.active h3:hover::before {
	background:url("images/minus.svg") no-repeat center center;
}

.flexible-technologies .listings .item {
	box-sizing: border-box;
	border-radius: 4px;
	overflow:hidden;
	margin:10px 0 0 0;
}

.flexible-technologies .listings .item:first-child { margin:0; }

.flexible-technologies .listings .item.active { border: 1px solid #ADB5BD; }

.flexible-technologies .listings .cell {
	padding:0 29px 40px 30px;
	display:none;
}

.flexible-technologies .listings .cell .two {
	display:flex;
	justify-content: space-between;
	align-items: stretch;
}

.flexible-technologies .listings .cell .right {
	width:50%;
	background: #F8F9FA;
	border-radius: 0px 4px 4px 0px;
	padding:40px 45px;
	box-sizing: border-box;	
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
	
}

.flexible-technologies .listings .cell .right strong {
	display:block;
	font-family: 'Lora', serif;
	margin:0 0 20px 0;
	font-style: normal;
	font-weight: bold;
	font-size: 20px;
	line-height: 140%;
	color: #020E18;
}

.flexible-technologies .listings .cell .left {
	width:50%;
	border-radius: 4px 0px 0px 4px;
	overflow:hidden;
	position:relative;
}

.flexible-technologies .listings .cell .left .pic {
	position:absolute;
	left:-30px;
	right:-30px;
	top:-30px;
	bottom:-30px;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:auto 102%;
	filter: grayscale(100%);
	transition: all 0.5s;
}

.flexible-technologies .listings .cell .left .pic:hover {
	filter: grayscale(0%);
	background-size:auto 112%;
	transform: rotate(3deg);
}

.flexible-technologies .listings .cell .right .what-are-you-doing {
	position:relative;
	margin:30px 0 0 0;
	padding:30px 0 0 0;
}

.flexible-technologies .listings .cell .right .what-are-you-doing::before {
	content:'';
	display:block;
	height:1px;
	background:#ECECEC;
	left:-45px;
	right:-45px;
	top:0px;
	position:absolute;
}

.flexible-technologies .listings .description {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #020E18;
}

.flexible-technologies .listings .description strong {
	font-family: 'Lora', serif;
	display:block;
	padding:30px 0 20px;
	font-style: normal;
	font-weight: bold;
	font-size: 22px;
	line-height: 140%;
	color: #020E18;
}

.flexible-technologies .listings ul {
	margin:-5px 0 -5px 0;
}

.flexible-technologies .listings ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.flexible-technologies .listings ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.flexible-technologies .listings ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.flexible-technologies .send-request {
	padding:30px 0 0 0;
	text-align:center;
}

.flexible-technologies .send-request a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	padding:21px 40px 21px 68px;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #020E18;
	position:relative;
	overflow:hidden;
	text-decoration:none;
}

.flexible-technologies .send-request a span {
	position:relative;
	z-index:5;
	color: #FFFFFF;	
}

.flexible-technologies .send-request a::before {
	content:'';
	display:block;
	width:20px;
	height:16px;
	top:50%;
	left:40px;
	margin:-8px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
	background:url("images/menu-button-mail.svg") no-repeat center center;
}

.flexible-technologies .send-request a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background: #020E18;
	width:100%;
}

.flexible-technologies .send-request a:hover::after { width:0px; }

.flexible-technologies .send-request a:hover::before { 
	background:url("images/menu-button-mail-hover.svg") no-repeat center center;
	animation-duration: 0.5s;
	animation-name: toptobottom-ico;
}

.flexible-technologies .send-request a:hover span {
	color: #020E18;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;		
}

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

.project-list {
	position:relative;
	margin:-15px;
	display:flex;
	flex-wrap: wrap;
	align-items: stretch;
}

.pages .project-list {
	margin-top:30px;
}

.project-list .item {
	margin:15px;
	width:570px;
	height:547px;
	box-sizing: border-box;
	outline: 1px solid #DEE2E6;
	outline-offset: -1px;
	border-radius:3px;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 120%;
	color: #757B81;
	position:relative;
	padding:30px;
}

.pages .project-list p.none {
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 120%;
	color: #757B81;
	text-align:center;
	display:block;
	margin:15px;
}

.project-list .item svg {
	content: "";
	position: absolute!important;
	width: 100%;
	height: 100%;
	top:0;
	left: 0;
	z-index: 1;
	stroke-width: 1px;
	stroke:#020E18;
	fill:none;
	stroke-dasharray: 2234;
	stroke-dashoffset: 2234;
	transition: stroke-dashoffset 1s;
	transition-timing-function: linear;
}

.project-list .item svg rect {
	width: 100%;
	height: 100%
}

.project-list .item:hover svg {
	transition: stroke-dashoffset 1s;
	transition-timing-function: linear;
	stroke-dashoffset:0;
}

.project-list .item .title-description-thumb {
	display:flex;
	align-items: flex-start;
	justify-content: space-between;
	height:123px;
	margin:0 0 20px 0;
	position:relative;
	z-index:2;
}

.project-list .item .title-description-thumb.full {
	height:80px;
}

.project-list .item .title-description-thumb .title-description {
	width:calc(100% - 160px - 20px);
	position:relative;
}

.project-list .item .title-description-thumb.full .title-description {
	width:calc(100%);
}

.project-list .item .title-description-thumb .title-description::before {
	content:'';
	display:block;
	left:-30px;
	top:-7px;
	bottom:-7px;
	width:1px;
	background:#FFF;
	position:absolute;
	z-index:3;
}

.project-list .item .title-description-thumb .title-description::after {
	content:'';
	display:block;
	left:-30px;
	top:0px;
	bottom:0px;
	width:1px;
	background:#6f7a85;
	position:absolute;
	z-index:4;
	transition: all 0.5s;
}

.project-list .item .title-description-thumb .thumb {
	width:160px;
	height:123px;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	border-radius: 3px;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	transition: all 0.5s;
}

.project-list .item .title-description-thumb .thumb:hover {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);	
}

.project-list .item .title-description-thumb h2 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 18px;
	line-height: 140%;
	color: #020E18;	
	margin:10px 0 5px 0;
}

.project-list .item .title-description-thumb p {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 120%;
	color: #020E18;	
	margin:0 0 10px 0;
}

.project-list .item .tabs {
	position:relative;
	z-index:3;
}

.project-list .item .tabs .nav-tabs {
	height:44px;
	display:flex;
	align-items:center;
	justify-content:flex-start;
}

.project-list .item .tabs .nav-tabs a {
	font-family: 'Lora', serif;
	color: #757B81;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:flex;
	align-items:center;
	justify-content:center;
	height:44px;
	position:relative;
	z-index:1;
	transition: all 0.5s;
}

.project-list .item .tabs .nav-tabs a:hover:not(.active) { color: #020E18; }

.project-list .item .tabs .nav-tabs a.first {
	width:214px;
	background:url("images/tabs-1.svg") no-repeat center center;
	z-index:2;
}

.project-list .item .tabs .nav-tabs a.first.active { background:url("images/tabs-1-active.svg") no-repeat center center; }

.project-list .item .tabs .nav-tabs a.last {
	width:158px;
	background:url("images/tabs-2.svg") no-repeat center center;
	margin-left:-11px;
}

.project-list .item .tabs .nav-tabs a.last.active { background:url("images/tabs-2-active.svg") no-repeat center center; }

.project-list .item .tabs .data-tabs {
	background: #DEE2E6;
	border-radius: 0 3px 0 0;
	padding:30px 7px 20px 20px;
	height:220px;
	box-sizing: border-box;	
}

.project-list .item .data-tabs .taba { display:none; }
.project-list .item .data-tabs .taba.active { display:block; }

.project-list .item .tabs .data-tabs .data-scroll {
	height:170px;
	padding-right:20px;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 140%;
	color: #020E18;
}

.nicescroll-rails {
	background:#e7ecf0!important;
	border-radius:15px!important;
}

.project-list .item .tabs .data-tabs .data-scroll p {
	padding:0 0 10px 0;
}

.project-list .item .tabs .data-tabs .data-scroll ul {
	margin:-5px 0 -5px 0;
}

.project-list .item .tabs .data-tabs .data-scroll ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.project-list .item .tabs .data-tabs .data-scroll ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-white.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.project-list .item .tabs .data-tabs .data-scroll ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.project-list .item .more {
	background:#DEE2E6;
	border-radius: 0 0 3px 3px;
	padding:0 0 30px 20px;
}

.project-list .item .more a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #020E18;
	position:relative;
	overflow:hidden;
	background:#020E18;
	text-decoration:none;
}

.project-list .item .more a span {
	position:relative;
	z-index:5;
	color: #FFFFFF;	
	padding:16px 84px 16px 30px;
	display:block;
}

.project-list .item .more a::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	top:50%;
	right:30px;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
	background:url("images/pagination-white.svg") no-repeat center center; 
}

.project-list .item .more a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:0px;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#FFF;
}

.project-list .item .more a:hover::after {
	width:100%;
}

.project-list .item .more a:hover::before { 
	right:25px; 
}

.project-list .item .more a:hover::before { background:url("images/pagination.svg") no-repeat center center; }

.project-list .item .more a:hover span {
	color: #020E18;	
	animation-duration: 0.5s;
	animation-name: toptobottom-text;		
}

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

.best-practics {
	background:url("images/best-practics-min.jpg") no-repeat center center;
	background-size:cover;
	padding:100px 0;
	overflow:hidden;
}

.best-practics .center {
	display:flex;
	justify-content: space-between;
	align-items: center;		
	position:relative;
}

.best-practics .right {
	width:770px;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 140%;
	color: #FFFFFF;	
	position:relative;
	z-index:5;
}

.best-practics .right strong {
	font-family: 'Lora', serif;
	display:block;
	padding:20px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 22px;
	line-height: 140%;
	color: #FFFFFF;
	padding-left:59px;
	position:relative;
}

.best-practics .right strong::before {
	content:'';
	display:block;
	width:40px;
	height:12px;
	background:url("images/best-practics-arrow.svg") no-repeat center center;
	position:absolute;
	left:0px;
	top:30px
}

.best-practics .right h2 {
	font-family: 'Lora', serif;
	margin:0 0 30px 0;
	font-style: normal;
	font-weight: 500;
	font-size: 46px;
	line-height: 120%;
	color: #FFFFFF;
}

.best-practics .right ul {
	margin:-5px 0 -5px 0;
}

.best-practics .right ul li {
	display:block;
	list-style:none;
	position:relative;
	padding:5px 0 5px 28px;
	box-sizing: border-box;	
}

.best-practics .right ul li::before {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:0px;
}

.best-practics .right ul li::after {
	content:'';
	display:block;
	width:18px;
	height:20px;
	background:url("images/li-after.svg") no-repeat center center;
	position:absolute;
	top:5px;
	left:1px;
}

.best-practics .left {
	width:329px;
	height:596px;
	position:relative;
}

.best-practics .pic {
	display:block;
	position:absolute;
	right:0px;
	top:0px;
	width:503px;
	height:596px;
	position:absolute;
}

.best-practics .pic i {
	display:block;
	position:relative;
	z-index:5;
	width:503px;
	height:596px;
	background:url("images/best-practics-pic.png") no-repeat center center;
	background-size:cover;
}

.best-practics .pic::before {
	content:'';
	display:block;
	width:864px;
	height:956px;
	background:url("images/best-practics-pic-before.svg") no-repeat center center;
	position:absolute;
	top:-159px;
	right:-167px;
	z-index:2;
}

.best-practics .pic::after {
	content:'';
	display:block;
	width:1170px;
	height:1306px;
	background:url("images/best-practics-pic-after.svg") no-repeat center center;
	position:absolute;
	top:-334px;
	right:-324px;
	z-index:1;
}

.best-practics .more {
	display:inline-block;
	position:absolute;
	left:0px;
	bottom:0px;
}

.best-practics .more a {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-decoration:none;
	display:inline-block;
	box-sizing: border-box;
	border-radius: 3px;
	border: 1px solid #DEE2E6;
	position:relative;
	overflow:hidden;
}

.best-practics .more a span {
	position:relative;
	z-index:5;
	color: #212529;
	display:block;
	padding:21px 104px 21px 50px;
}

.best-practics .more a::before {
	content:'';
	display:block;
	width:35px;
	height:14px;
	top:50%;
	right:30px;
	margin:-7px 0 0 0;
	position:absolute;
	transition: all 0.5s;
	z-index:3;	
	background:url("images/best-practics-more.svg") no-repeat center center;
}

.best-practics .more a::after {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	width:100%;
	transition: all 0.5s;
	position:absolute;
	z-index:2;
	background:#DEE2E6;
}

.best-practics .more a:hover::after {
	width:0px;
}

.best-practics .more a:hover::before { 
	right:25px; 
}

.best-practics .more a:hover::before { background:url("images/best-practics-more-hover.svg") no-repeat center center; }

.best-practics a:hover span {
	color:#DEE2E6;
	animation-duration: 0.5s;
	animation-name: toptobottom-text;	
}

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

.partner-list {
	padding:60px 0 80px;
}

.partners-slider {
	position:relative;
	margin:0 -15px;
	padding:0 0 74px 0;
}

.partners-slider .item {
	width:calc(25% - 30px);
	background: #F8F9FA;
	border-radius: 4px;
	position:relative;
	margin:40px 15px 0 15px;
	box-sizing: border-box;
	padding:145px 0 20px 0;
	transition: all 0.5s;
}

.partners-slider .item:hover { background: #F2F5F8; }

.partners-slider .item a { text-decoration:none; }

.partners-slider .item .cell {
	display:block;
	width:230px;
	height:150px;
	position:absolute;
	top:-20px;
	background-color: #FFFFFF;
	box-shadow: 0px 7px 20px rgba(0, 0, 0, 0.07);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:230px auto;
	left:50%;
	margin:0 0 0 -115px;
	transition: all 0.5s;
}

.partners-slider .item:hover .cell {
	box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.07);
	top:-15px;
}

.partners-slider .item p {
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 140%;
	text-align: center;
	color: #757B81;	
	transition: all 0.5s;
}

.partners-slider .item:hover p { color: #020E18; }

.partners-slider .slick-prev,
.partners-slider .slick-next {
	position:absolute;
	bottom:0px;
	display:block;
	width:44px;
	height:44px;
	border: 1px solid #DEE2E6;
	box-sizing: border-box;
	background:#FFF;
	text-indent:-9999px;
	transition: all 0.5s;
	border-radius:50%;
	cursor:pointer;
	z-index:3;
}

.partners-slider .slick-prev { left:15px; }
.partners-slider .slick-next { right:15px; }

.partners-slider .slick-prev::before,
.partners-slider .slick-next::before {
	content:'';
	display:block;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	width:100%;
	height:100%;
	position:absolute;
	transition: 0.5s;
	cursor:pointer;
	background:url("images/prev.svg") no-repeat 50% center;
}

.partners-slider .slick-next::before {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

.partners-slider .slick-prev:hover,
.partners-slider .slick-next:hover {
	background: #DEE2E6;
	border: 1px solid #DEE2E6;
}

.partners-slider .slick-dots {
	display:block;
	width:100%;
	position:absolute;
	left:0px;
	bottom:7px;
	height:16px;
	font-size:0px;
	text-align:center;
	z-index:2;
}

.partners-slider .slick-dots li {
	display:inline-block;
	width:6px;
	height:6px;
	background: #DEE2E6;
	border-radius: 50%;	
	transition: all 0.5s;
	text-indent:-9999px;
	margin:0 10px;
	position:relative;
}

.partners-slider .slick-dots li::before {
	content:'';
	display:block;
	top:1px;
	bottom:1px;
	left:1px;
	right:1px;
	border: 1px solid #ADB5BD;
	border-radius: 50%;	
	position:absolute;
	transition: all 0.5s;
	z-index:-1;
}

.partners-slider .slick-dots .slick-active { background: #ADB5BD; }

.partners-slider .slick-dots .slick-active::before {
	top:-5px;
	bottom:-5px;
	left:-5px;
	right:-5px;
	z-index:2;
}

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

.footer {
	background: #020E18;
	padding:16px 0;
}

.error404 .footer {
	position:fixed;
	left:0px;
	right:0px;
	bottom:0px;
}

.footer .center {
	display:flex;
	justify-content: space-between;
	align-items: center;		
}

.footer .logo a,
.footer .logo div {
	font-size: 22px;
	font-style: normal;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0.03em;
	text-align: left;	
	color: #6A7682;
	display:inline-block;
	padding-left:55px;
	text-decoration:none;
	position:relative;
}

.footer .logo a span,
.footer .logo div span {
	font-size: 11px;
	font-style: normal;
	font-weight: 500;
	line-height: 14px;
	letter-spacing: 0.05em;
	text-align: left;
	text-transform:uppercase;
	display:block;
	padding:4px 0 0 0;
}

.footer .logo a::before,
.footer .logo div::before {
	content:'';
	display:block;
	width:42px;
	height:46px;
	background:url("images/logo-footer.svg") no-repeat center center;
	position:absolute;
	left:0px;
	top:50%;
	margin:-23px 0 0 0;
}

.footer .contact ul {
	display:flex;
	align-items: center;		
}

.footer .contact ul li {
	display:block;
	margin:0 15px;
}

.footer .contact ul li:first-child { margin-left:0px; }
.footer .contact ul li:last-child { margin-right:0px; }

.footer .contact ul li a {
	font-size: 15px;
	font-style: normal;
	font-weight: 500;
	line-height: 18px;
	letter-spacing: 0em;
	text-align: left;
	color:#FFF;
	text-decoration:none;
}

.footer .contact ul li b {
	display:block;
	padding:0 0 5px 0;
	font-size: 10px;
	font-style: normal;
	font-weight: 500;
	line-height: 12px;
	letter-spacing: 0em;
	text-align: left;	
	color: #ADB5BD;
	text-transform:uppercase;
}

.social ul {
	display:flex;
	align-items: center;		
}

.dropdownmenu .social {
	position:absolute;
	left:40px;
	right:40px;
	bottom:40px;
}

.dropdownmenu .social ul {
	justify-content: space-between;
}

.social li {
	display:block;
	list-style:none;
	margin:0 4px;
	border:none!important;
}

.social li:first-child { margin-left:0px; }
.social li:last-child { margin-right:0px; }

.social li a {
	display:block;
	width:28px;
	height:28px;
	background: #FFFFFF;
	border-radius:50%;
	text-indent:-9999px;
	position:relative;
	transition: all 0.5s;
	padding:0!important;
}

.dropdownmenu .social li a,
.dropdownmenu .social li a:hover {	
	background:#DEE2E6;
}

.social li a:hover {
	transform: rotateY(180deg);
	background:#ADB5BD;
}

.social li a::before {
	content:'';
	display:block;
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
	position:absolute;
	background-position:center center;
	background-repeat:no-repeat;
	transition: all 0.5s;
}

 .social li a:hover::before { transform: rotateY(180deg); }

.social li.phone a::before { background-image:url("images/phone.svg"); background-size:17px auto; }
.social li.email a::before { background-image:url("images/menu-button-mail-hover.svg"); background-size:15px auto; }
.social li.skype a::before { background-image:url("images/skype.svg"); background-size:17px auto; background-position:52% center;}

.social li.vk a::before { background-image:url("images/vk.svg"); }
.social li.facebook a::before { background-image:url("images/facebook.svg"); }
.social li.od a::before { background-image:url("images/od.svg"); }
.social li.mir a::before { background-image:url("images/mir.svg"); }
.social li.twitter a::before { background-image:url("images/twitter.svg"); }
.social li.instagram a::before { background-image:url("images/instagram.svg"); }
 
.social li.phone a:hover::before { background-image:url("images/phone-hover.svg"); background-size:17px auto; }
.social li.email a:hover::before { background-image:url("images/menu-button-mail.svg"); background-size:15px auto; }
.social li.skype a:hover::before { background-image:url("images/skype-hover.svg"); background-size:17px auto; background-position:52% center;}
 
.social li.vk a:hover::before { background-image:url("images/vk-hover.svg"); }
.social li.facebook a:hover::before { background-image:url("images/facebook-hover.svg"); }
.social li.od a:hover::before { background-image:url("images/od-hover.svg"); }
.social li.mir a:hover::before { background-image:url("images/mir-hover.svg"); }
.social li.twitter a:hover::before { background-image:url("images/twitter-hover.svg"); }
.social li.instagram a:hover::before { background-image:url("images/instagram-hover.svg"); }

.social li.phone,
.social li.email,
.social li.skype {
	display:none;
}

.footer .dev a {
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 120%;
	color: #FFFFFF;
	text-align:right;
	display:block;
	text-decoration:none;
	position:relative;
	padding:0 62px 0 0;
	transition: all 0.5s;
	opacity:1;
}

.footer .dev a::before {
	content:'';
	display:block;
	position:absolute;
	right:0px;
	top:50%;
	width:52px;
	height:30px;
	margin:-15px 0 0 0;
	background:url("images/dev.svg") no-repeat center center;
}

.footer .dev a:hover { opacity:0.8; }



#loading {
	background: rgba(0, 0, 0, 0.6); 
	position:fixed;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:none;
	z-index:100;
}

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

#loading .load-block {
	width:100%;
	height:100%;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;	
}

spinner {
	-webkit-animation: rotator 1.4s linear infinite;
		  animation: rotator 1.4s linear infinite;
}

@-webkit-keyframes rotator {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(270deg);
		transform: rotate(270deg);
	}
}

@keyframes rotator {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(270deg);
		transform: rotate(270deg);
	}
}
.path {
	stroke-dasharray: 187;
	stroke-dashoffset: 0;
	-webkit-transform-origin: center;
	  -ms-transform-origin: center;
		  transform-origin: center;
	-webkit-animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
		  animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
}

@-webkit-keyframes colors {
	0% {
		stroke: #4285F4;
	}
	25% {
		stroke: #DE3E35;
	}
	50% {
		stroke: #F7C223;
	}
	75% {
		stroke: #1B9A59;
	}
	100% {
		stroke: #4285F4;
	}
}

@keyframes colors {
	0% {
		stroke: #4285F4;
	}
	25% {
		stroke: #DE3E35;
	}
	50% {
		stroke: #F7C223;
	}
	75% {
		stroke: #1B9A59;
	}
	100% {
		stroke: #4285F4;
	}
}

@-webkit-keyframes dash {
	0% {
		stroke-dashoffset: 187;
	}
	50% {
		stroke-dashoffset: 46.75;
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);
	}
	100% {
		stroke-dashoffset: 187;
		-webkit-transform: rotate(450deg);
		transform: rotate(450deg);
	}
}

@keyframes dash {
	0% {
		stroke-dashoffset: 187;
	}
	50% {
		stroke-dashoffset: 46.75;
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);
	}
	100% {
		stroke-dashoffset: 187;
		-webkit-transform: rotate(450deg);
		transform: rotate(450deg);
	}
}

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

.hide { display:none; }

.inquiry.fancybox-content {
	background: #F8F9FA;
	border-radius: 4px;
	width: 770px;
	box-sizing: border-box;
	padding:60px 50px;
	overflow:hidden;
}

.sendokpops.fancybox-content {
	background: #F8F9FA;
	border-radius: 4px;
	width: 350px;
	box-sizing: border-box;
	padding:60px 50px;
	overflow:hidden;
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 22px;
	line-height: 120%;
	color: #020E18;
}

.sendokpops.fancybox-content .fancybox-button.fancybox-close-small,
.inquiry.fancybox-content .fancybox-button.fancybox-close-small {
	background:url("images/close.svg") no-repeat center center;
	width:20px;
	height:20px;
	opacity:1;
	top:30px;
	right:30px;
	transition: all 0.5s;
}

.sendokpops.fancybox-content .fancybox-button.fancybox-close-small:hover,
.inquiry.fancybox-content .fancybox-button.fancybox-close-small:hover {
	background:url("images/close-hover.svg") no-repeat center center;
}

.inquiry .wpcf7 {
	position:relative;
}

.inquiry .wpcf7 h3 {
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: 500;
	font-size: 36px;
	line-height: 120%;
	color: #020E18;
	display:block;
	padding:0 0 40px 0;
}

.inquiry .wpcf7 h4 {
	margin:40px 0 0 0;
	border-top: 1px solid #DEE2E6;
	font-family: 'Lora', serif;
	font-style: normal;
	font-weight: bold;
	font-size: 22px;
	line-height: 120%;
	color: #020E18;
	display:block;
	padding:40px 0 30px 0;
}

.inquiry .wpcf7 h4.first {
	margin:0;
	padding-top:0;
	border:none;
}

.inquiry .wpcf7 .one,
.inquiry .wpcf7 .two {
	margin:0 0 30px 0;
}

.inquiry .wpcf7 .two {
	display:flex;
	justify-content: space-between;
	align-items: flex-start;		
}

.inquiry .wpcf7 .two .cell {
	width:calc(50% - 15px);
}

.inquiry .wpcf7 label {
	display:block;
	margin:0 0 10px 0;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 120%;
	color: #020E18;
}

.inquiry .wpcf7 input.wpcf7-text {
	width:100%;
	box-sizing: border-box;
	border: 1px solid #DEE2E6;
	border-radius: 3px;
	background: #FFFFFF;
	color:#000;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 120%;
	padding:18px;
}

.inquiry .wpcf7 span.wpcf7-form-control-wrap textarea {
	width:100%;
	box-sizing: border-box;
	border: 1px solid #DEE2E6;
	border-radius: 3px;
	background: #FFFFFF;
	color:#000;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 120%;
	padding:18px;
	height:153px;
	resize:none;
}

.inquiry span.wpcf7-radio span.wpcf7-list-item {
	display:block;
	position:relative;
	margin:0;
}

.inquiry input[type="radio"] {
	display:block;
	width:0px;
	height:20px;
}

.inquiry input[type="radio"]::before {
	content:'';
	display:block;
	width:20px;
	height:20px;
	background:url("images/radio.svg") no-repeat center center;
	position:absolute;
	left:0px;
	top:50%;
	margin:-10px 0 0 0;
}

.inquiry span.wpcf7-radio label {
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
	line-height: 135%;
	display: flex;
	align-items: center;
	color: #757B81;
	height:30px;
	padding-left:32px;
	margin:0;
	cursor:pointer;
}

.inquiry label > input[type="radio"]:checked::before {
	background:url("images/radio-checked.svg") no-repeat center center;
}

.inquiry .wpcf7 small {
	display:block;
	font-style: normal;
	font-weight: 600;
	font-size: 14px;
	line-height: 140%;
	color: #020E18;
	padding:20px;
	background: #F0F2F3;
	border-radius: 3px;	
	margin:40px 0 0px;
}

.inquiry .wpcf7 i {
	display:block;
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 140%;
	color: #020E18;
	padding:20px 40px;
	text-align:center;	
}

.inquiry .wpcf7 i a {
	color: #020E18;
	text-decoration:underline;
}

.inquiry .wpcf7 i a:hover { text-decoration:none; }

.inquiry .wpcf7 .three {
	display:flex;
	justify-content: space-between;
	align-items: flex-start;		
}

.inquiry .wpcf7 span.submit input.wpcf7-submit {
	font-family: 'Lora', serif;
	border:1px solid #020E18;
	background: #020E18 url("images/menu-button-mail.svg") no-repeat 18px center;
	border-radius: 3px;
	padding:17px 18px 17px 46px;
	display:block;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #FFFFFF;
	cursor:pointer;
	transition: all 0.5s;
}

.inquiry .wpcf7 span.submit input.wpcf7-submit:hover {
	background:#FFF url("images/menu-button-mail-hover.svg") no-repeat 18px center;
	color:#020E18;
}

.inquiry .wpcf7 span.download a {
	font-family: 'Lora', serif;
	background: #ADB5BD url("images/download.svg") no-repeat 18px center;
	border-radius: 3px;
	padding:17px 18px 17px 46px;
	display:block;
	font-style: normal;
	font-weight: bold;
	font-size: 13px;
	line-height: 140%;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #020E18;
	cursor:pointer;	
	text-decoration:none;
	transition: all 0.5s;
	border:1px solid #ADB5BD;
}

.inquiry .wpcf7 span.download a:hover {
	border:1px solid #020E18;
	background: #FFF url("images/download-hover.svg") no-repeat 18px center;
}

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

.inquiry .wpcf7 input.wpcf7-text.wpcf7-not-valid {
	color: red;
	border:1px solid red;
}

.inquiry .wpcf7 .wpcf7-response-output {
	display:none!important;
}

.inquiry .ajax-loader {
	position:absolute;
	padding:0;
	display:block;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	top:50%!important;
	left:50%!important;
	background:#ADB5BD url("images/loading.svg") no-repeat center center!important;
	background-size:40px auto!important;
	width:60px!important;
	height:60px!important;
	margin:-30px 0 0 -30px!important;
}

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

.top-top {
	display:inline-block;
	width:40px;
	height:40px;
	background:url("images/li.svg") no-repeat center center;
	background-size:40px auto;
	transition: 0.5s;
	text-indent:-9999px;
	position:relative;
	position:fixed;
	right:20px;
	bottom:20px;
	z-index:111;
	bottom:-100px;
}

.top-top::before {
	content:'';
	display:block;
	position:absolute;
	left:0px;
	top:0px;
	bottom:0px;
	right:0px;
	background:url("images/top.svg") no-repeat center center;
}

.top-top.active {
	bottom:20px;
}