@charset "UTF-8";
:root {
	--duration: 1.5s;
	--container-size: 250px;
	--box-size: 33px;
	--box-border-radius: 15%;
}
@font-face {
				font-family: 'Tahoma'; 
				src: url('../font/Tahoma.eot'); 
				src: local('Tahoma'), url('../font/Tahoma.woff') format('woff'), url('../font/Tahoma.ttf') format('truetype');
}
@font-face {
	font-family: 'Tahoma-Bold'; 
	src: url('../font/Tahoma-Bold.eot'); 
	src: local('Tahoma-Bold'), url('../font/Tahoma-Bold.woff') format('woff'), url('../font/Tahoma-Bold.ttf') format('truetype');
}
@font-face {
				font-family: 'OpenSans'; 
				src: url('../font/OpenSans-Regular.eot'); 
				src: local('OpenSans'), url('../font/OpenSans-Regular.woff') format('woff'), url('../font/OpenSans-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'send';
	src: url('./font/send.eot?1057020');
	src: url('./font/send.eot?1057020#iefix') format('embedded-opentype'),
		 url('./font/send.woff?1057020') format('woff'),
		 url('./font/send.ttf?1057020') format('truetype'),
		 url('./font/send.svg?1057020#send') format('svg');
	font-weight: normal;
	font-style: normal;
	}


*::-webkit-input-placeholder {
	color: #666;
	opacity: 1;
}
*:-moz-placeholder {
	color: #666;
	opacity: 1;
}
*::-moz-placeholder {
	color: #666;
	opacity: 1;
}
*:-ms-input-placeholder {
	color: #666;
	opacity: 1;
}
body input:focus:required:invalid,
body textarea:focus:required:invalid {
	
}
body input:required:valid,
body textarea:required:valid {
	
}
html.js .loader {
	background: none repeat scroll 0 0 #ffffff;
	bottom: 0;
	height: 100%;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 9999;
}
html.js .loader_inner {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	background-color: #fff;
	height: 60px;
	width: 200px;
	margin-top: -30px;
	margin-left: -100px;
	left: 50%;
	top: 50%;
	position: absolute;
}
html {
		position: relative;
		min-height: 100%;
}
.orange {
	background: #eb7a19;
}
.orangetxt {
				color: #ffa508;
}
a.orange:hover {
	background: #e86b00;
}
.green {
	background: #6ca00a;
}
a.green:hover {
	background: #659a00;
}
.blue {
	background: #01c3ef;
}
.blue:hover {
	background: #03a8ca;
}


h1, h2, h3, h4 {
		margin-bottom: 0px;
}
a {
	outline: none;
	transition-duration: .3s;
}
a:hover {
	color: #ff8016;
}
body {
		padding: 0;
		margin: 0;
		overflow-x: hidden;
		line-height: 1.6;
	font-family: Tahoma,'Tahoma', sans-serif;
	font-size: 15px;
		font-weight: 400;
	color: #444;
	background: #f9f9f9;
}
.wrap {
	background-color: #fff;
	border-right: 1px solid #f3f3f3;
	border-left: 1px solid #f3f3f3;
	padding-bottom: 150px;
}

.hidden {
	display: none;
}
.top-fixed {
	position: fixed;
	z-index: 99999;
	display: none;
}
button {
	border: none;
	border-radius: 3px;
	padding: 5px 20px;
	background: #666;
	color: #fff;
	cursor: pointer;
	margin: 5px;
	font-size: 15px;
}
form input[type="text"] {
	padding: 5px;
	margin: 5px 0px;
}



header nav {
	width: 100%;
	text-align: right;
	padding: 20px 0px;
	font-size: 16px;
	color: #333333;
}
header nav ul li a {
	color: #333333;
	text-decoration: none;
	padding: 0px 10px;
}
header nav ul li a:hover {
	color: #f78a04;
}
.head {
	min-height: 98px;
}
nav ul li {
	display: inline-block;
}
.top-panel {
	width: 100%;
	background: #373737;
	color: #fff;
	min-height: 40px;
	transition: 3s;
	z-index: 99991;
}
.top-panel a {
	color: #fff;
	text-decoration: none;
}
.top-panel a:hover {
		color: #ff8016;
}
.top-panel .phone, .top-panel .email, .top-panel .pres {
	padding: 7px 0px 3px 0px;
	display: inline-block;
}
.top-panel .pres {
	margin-top: 5px;
	padding: 0px;
	border-bottom: 1px dashed #7d7d7d;
}
.top-panel .pres:hover {
	color: #ff8016;
}
.topbtn {
	text-align: right;
}
.topbtn a.orange:hover, .topbtn a.green:hover {
	color: #fff;
}
.logo img {
	padding: 20px 0px 0px 0px;
}
.tab-menu {
	z-index: 9;
	margin-bottom: -45px;
	position: relative;
	float: left;
	width: 100%;
	text-align: center;
}
ul.menutabs {
	padding: 0;
	background: linear-gradient(to left, #4172f3, #01c2ef);
	margin: 0 auto;
	display: inline-block;
}
ul.menutabs li {
	display: inline-block;
	font-size: 15px;
	color: #fff;
	padding: 18px 21px;
	text-transform: uppercase;
	cursor: pointer;
	border-right: 1px solid rgba(255,255,255,0.2);
	float: left;
	transition-duration: .3s;
}
ul.menutabs li:hover {
	background: #0095f4;
}
ul.menutabs li:last-of-type {
	border: none;
}
ul.menutabs li.active {
	background: #f0f5f6;
	color: #343531;
}
#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7, #tab8 {
	background-size: cover;
	height: calc(100vh - 165px);
	min-height: 600px;
	background-repeat: no-repeat;
}
#tab1 .image-tab::before {
	content: "";
	width: 100%;
	height: 646px;
	background: url("../img/slide1bg.png") no-repeat 50px;
	position: absolute;
}
#tab2::before {
	content: "";
	width: 934px;
	height: 646px;
	background: url("../img/slide2bg.png");
	position: absolute;
	background-size: cover;
}
.image-tab img {
	padding: 210px 15px 0px 150px;
}
div#tab1 {
	background-image: url(../img/slide1.jpg);
}
div#tab2 {
	background-image: url(../img/slide2.jpg);
}
div#tab3 {
	background-image: url(../img/slide3.jpg);
}
div#tab4 {
	background-image: url(../img/slide4.jpg);
}
div#tab5 {
	background-image: url(../img/slide5.jpg);
}
div#tab6 {
	background-image: url(../img/slide6.jpg);
}
div#tab7 {
	background-image: url(../img/slide7.jpg);
}
#tab6 svg {
	padding: 133px 0px 0px 0px;
	margin-left: -100px;
}
@keyframes popup {
				0% {transform: translateX(0px);}
				50% {transform: translateX(3px);}
				100% {transform: translateX(0px);}
			}
@keyframes scale {
				0% {transform: scale(1,1);transform-box: fill-box;
								transform-origin: center;}
				50% {transform: scale(0.8,0.8);transform-box: fill-box;
								transform-origin: center;}
				100% {transform: scale(1,1);transform-box: fill-box;
								transform-origin: center;}
}
 @keyframes rotate {
				0% {transform: rotate(0deg);
								transform-box: fill-box;
								transform-origin: center;}
				50% {transform: rotate(180deg);
								transform-box: fill-box;
								transform-origin: center;}
				100% {transform: rotate(360deg);
								transform-box: fill-box;
								transform-origin: center;}
}

.oblak { animation: popup 3s linear infinite; }
.circl  {animation: rotate 14s linear infinite;}
.plus {animation: scale 3s linear infinite;}

div#tab8 {
	background-image: url(../img/slide8.jpg);
}
.topbtn a.orange, .topbtn a.green {
	font-size: 15px;
		padding: 2px 15px 3px 15px;
		/* margin: 5px 0px; */
		color: #fff;
		text-decoration: none;
		margin-top: 5px;
		display: inline-block;
	border-radius: 8px; 
}
.topbtn a.orange:hover, .topbtn a.green:hover {
	opacity: 1;
}
.topbtn a.orange:visited, .topbtn a.green:visited {
	border: none;
}

.tab-content {
		padding: 200px 15px 200px 30px;
		color: #fff;
		line-height: 1.4;
}
.tab-content .orangetxt {
				font-weight: bold;
}
.tab-content .stitle {
				font-family: 'Tahoma-Bold', Tahoma, sans-serif;
				font-size: 26px;
				color: #ffa508;
				text-transform: uppercase;

}
.tab-content h1 {
	font-size: 30px !important;
	font-weight: bold;
	text-transform: uppercase;
}
.tab-content p {
	font-size: 17px;
}
.tab-content a {
		padding: 13px 10px;
		color: #fff;
		text-decoration: none;
		margin-right: 20px;
	font-size: 16px;
		margin-top: 20px;
		display: inline-block;
		border-radius: 10px;
		width: 100%;
		text-align: center;
		font-family: 'Tahoma-Bold', Tahoma, sans-serif;
}
.tab-content ul {
	padding: 0;
	margin: 4px 0px 15px 0px;
}
.tab-content ul li {
		display: block;
		font-size: 17px;
		line-height: 23px;
}
.tab-content ul li::before {
		height: 36px;
		width: 37px;
		content: '\f101';
		font-family: 'send';;
		color: #8dc42e;
		font-size: 16px;
		padding: 0px 7px 0px 0px;
		top: 1px;
		position: relative;
}
.typed-cursor {
	font-size: 34px;
}
.tab-price {
		font-size: 16px;
	background: rgba(104, 104, 104, 0.4);
		color:#fff;
		padding: 5px;
		text-align: center;
		margin: -5px 0px;
}

/* Start для OWL */
button.owl-next {
		float: right;
		-webkit-transform:rotate(180deg);
		-moz-transform:rotate(180deg);
	transform:rotate(180deg);
		position: absolute;
		top: 50%;
		margin-top: -30px;
		right: 0;
		z-index: 999999;
}
button.owl-prev {
		position: absolute;
		top: 50%;
		margin-top: -30px;
		left: 0;
		z-index: 999999;
}
button.owl-prev, button.owl-next {
		width: 30px;
		height: 30px;
		background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 240.8 240.8' style='enable-background:new 0 0 240.8 240.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cpath id='Chevron_Right' class='st0' d='M57.6,129l108.3,108.3c4.8,4.7,12.5,4.7,17.2,0c4.8-4.7,4.8-12.4,0-17.2l-99.7-99.7 l99.7-99.7c4.8-4.7,4.8-12.4,0-17.2c-4.8-4.7-12.5-4.7-17.2,0L57.6,111.8C52.9,116.5,52.9,124.3,57.6,129z'/%3E%3C/g%3E%3C/svg%3E") !important;
}
button.owl-prev span, button.owl-next span {
		display: none;
}
/* End для OWL */

/* Start HOME */
.portfolio {
	margin-top: 40px;
	text-align: center;
}
.portfolio a {
	display: inline-block;
	overflow: hidden;
}
.portfolio img {
	transition: 0.7s;
	width: 100%;
}
.portfolio img:hover {
	transform: scale(1.02);
}
.work-title {
	font-size: 16px;
	text-align: center;
	color: #1c1e24;
	margin: 35px 0px 50px 0px;
}
.work-title:after {
	border-bottom: 1px solid #04c3ef;
	content: "";
	width: 50%;
	height: 5px;
	position: absolute;
	top: 110px;
	float: left;
	left: 50%;
	margin-left: -25%;
}
.work-title h4 {
	font-family: Open Sans, 'OpenSans', Arial, Tahoma, sans-serif;
	font-weight: bold;
	font-size: 26px;
}
.comment-title {
	font-size: 17px;
	text-align: center;
	color: #1c1e24;
	margin: 40px 0px 30px 0px;
}
.service {
	border: 1px solid #f5f5f5;
	text-align: center;
	background: #f7faff;
	transition-duration: .3s;
	color: #0c0c0c;
	margin-bottom: 15px;
}
.service:hover {
	background: #e7f0ff;
}
.service:hover svg .rocket {
	animation: updown 2s linear infinite; 
}
.service:hover svg .rotate { animation: rotate 10s linear infinite; transform-origin: 324px 268px; }
.service:hover svg .rotate2 { animation: rotate 10s linear infinite; transform-origin: 292px 230px; }
.service .title {
	font-size: 21px;
	padding: 5px 0px 10px 0px;
	border-bottom: 1px solid #04c3ef3d;
	background: #05bcef;
	color: #fff;
}
.service img {
	padding: 20px 15px 15px 15px;
	width: 100%;
	min-height: 225px;
}
.service-block .col-md-6:nth-child(3) .service img {
	padding: 30px 15px 25px 15px !important;
}
.service ul {
	padding: 0px 10px;
	float: left;
	margin: 0;
	font-size: 14px;
}
.service ul li {
	text-align: left;
	display: inline-block;
	float: left;
	position: relative;
	padding: 5px 0px 10px 24px;
	line-height: 1.3;
	width: 100%;
}
.service ul li:before {
	content: '\e801'; 
	font-family: 'send';
	width: 20px;
	height: 20px;
	float: left;
	left: 2px;
	top: 6px;
	color: #83bf0a;
	position: absolute;
}
.price {
	font-size: 17px;
	line-height: 1.3;
}
.price span {
	font-size: 21px;
	color: #333333;
	font-family: 'Tahoma-Bold', Tahoma, sans-serif;
}
a.service-btn {
	padding: 4px 35px;
	background: #01c3ef;
	color: #fff;
	text-decoration: none;
	border-radius: 16px;
	margin: 12px 0px;
	display: inline-block;
	position: relative;
}
a.service-btn:hover {
	background: #03a8ca;
}
a.service-btn:after {
	height: 36px;
	width: 37px;
	content: '\f101';
	font-family: 'send';
	position: absolute;
	background: #fff;
	border-radius: 20px;
	top: -2px;
	color: #8dc42e;
	font-size: 16px;
	padding: 5px;
	right: -12px;
}
.service-block .col-xl-3:nth-child(4) .service img {
	max-width: 90%;
	margin: 12px 0px 15px 0px;
}
.service-info {
	background: #f7faff;
	color: #1c1e24;
	text-align: left;
	font-size: 16px;
	padding: 10px;
	margin-top: -20px;
}
.service-info ul {
	padding: 0 0 0 30px;
}
.service-info ul li {
	padding: 5px;
	list-style: none;
}
/* .service-info ul li::before {
	content: '\e801';
	font-family: 'send';
	width: 25px;
	height: 20px;
	float: left;
	color:#83bf0a;
} */
.service-info ul li svg {
	width: 25px;
	height: 25px;
	fill: #01c3ef;
	margin-top: 0px;
	margin-right: 10px;
	position: relative;
	top: 7px;
}

.add-services {
	text-align: center;
	margin-top: 40px;
}
.add-services .item {
	margin-bottom: 40px;
	border: 1px solid #f0f0f0;
	padding: 10px 0px 20px;
}
.add-services .item:hover {
	box-shadow: 1px 1px 17px 1px #f2f2f2;
}
.add-services .item img {
	width: 35%;
	padding-top: 20px;
}
.add-services .item svg {
	width: 30%;
	padding-top: 20px;
}
.add-services a {
	font-size: 17px;
	color:#fff;
	text-decoration: none;
	padding: 5px 60px;
	display: inline-block;
	border-radius: 5px;
	position: absolute;
	left: 50%;
	margin-left: -103px;
}
.add-services .price {
	font-size: 20px;
	font-family: 'Tahoma-Bold', Tahoma, sans-serif;
	color: #333333;
	padding: 5px 0px 13px 0px;
}
.add-services .title {
	font-size: 21px;
	color: #197ec5;
}
.add-services .desc {
	font-size: 16px;
	color: #333333;
	padding: 8px 15px;
}


/* Start portfolio */

/* End portfolio */




/* Start stages */

.stages {

}
.stages .item {
		width: 80%;
	background: #f8f8f8;
	margin: 20px auto;
	padding: 15px 20px;
	line-height: 1.4;
	font-size: 15px;
	border-radius: 5px;
	min-height: 210px;
}
.stages .item .item-title {
	float: left;
	width: 100%;
}

.stages .item p {
	margin: 0;
}

.stages .item:hover {
		width: 85%;
	background: rgb(0,203,250);
	background: linear-gradient(90deg, rgba(0,203,250,1) 0%, rgba(0,160,219,1) 35%, rgba(0,112,184,1) 100%); 
	padding: 30px 20px 40px 20px;
	margin: 0px auto;
	color: #fff;
	transition: 800ms;
	height: 240px;
}

.stages .item::after {
	position: absolute;
	content: '\e803';
	width: 33px;
	height: 30px;
	right: -27px;
	top: 40%;
	color: #00c6f7!important;
	font-family: send;
	font-size: 24px;
}
.stages .col-lg-3:last-child .item::after {
	display: none;
}
.stages .item ul {
	margin: 0;
	padding: 0;
	float: left;
}
.stages .item ul li {
	padding-bottom: 5px;
	margin-left: 10px;
}

.stages .item .title {
	font-family: 'Tahoma-Bold', Tahoma, sans-serif;
	font-size: 22px;
	float: left;
	display: block;
	padding: 6px 5px 20px 15px;
}
.stages .item svg {
	width: 45px;
	height: 45px;
	float: left;
	fill: #818181;
}
.stages .item:hover svg {
	fill: #fff;
}
.stages .col-lg-3 {
	min-height: 280px;
}
/* End stages */



/* Start advantages */
.advantages {
	margin-top: 40px;
}
.advantages .item {
	font-size: 15px;
	color: #333333;
	margin: 0px 0px 50px 0px;
}
.advantages .item .title {
	background: #f9f9f9;
	font-size: 15px;
	font-weight: bold;
	padding: 10px;
	text-transform: uppercase;
	color: #333;
}
.advantages .item .title svg {
	width: 35px;
	height: 36px;
	fill: #2e9dd9;
	display: block;
	float: left;
	margin: -5px 15px 5px 0px;
}
.advantages .item .desc {
	padding: 8px 0px 0px 4px;
	line-height: 1.4;
}
/* End advantages */


/* Start news */
.news a {
	text-decoration: none;
	color: #2d2d2d;
}
.news .title {
	font-size: 14px;
	display: block;
	font-weight: bold;
	text-transform: uppercase;
}
.news span.date {
	color: #c4c4c4;
	font-size: 13px;
}
/* End news */



/* End HOME */


/* Start brief */
.brief {
	display: none !important;
}
.brief .col-lg-4 {
	border: 1px solid #d7d7d7;
	margin: 3px 0px;
	padding: 10px;
	background:#fff;
}
.brief .col-lg-8 {
	border-top: 1px solid #d7d7d7;
	margin: 3px 0px;
	border-bottom: 1px solid #d7d7d7;
	border-right: 1px solid #d7d7d7;
	padding: 10px;
	background: #fff;
}
.brief label {
	padding: 0px 10px;
}
.brief textarea, .brief input {
	border: 1px solid #d0d0d0;
}
.brief .btn {
	padding: 8px 30px;
	color:#fff;
	text-decoration: none;
	font-size: 18px;
	margin: 10px auto;
}
.brief .btn::before {
	height: 36px;
	width: 37px;
	content: '\f1d8';
	font-family: 'send';
	border-radius: 20px;
	color:#fdfdfd;
	font-size: 16px;
	padding-right: 10px;
}
.brief form input[type="text"] {
	margin: 0;
}
.shopshow {
	display: none;
}
/* End brief */
















footer {
		/* position: absolute; */
		/* bottom: 0; */
		width: 100%;
		min-height: 190px; /* Высоту футера также менять в body */
		color: #fff;
		background: url(../img/footbg.jpg) repeat-x top #262727;
}
footer .foot-logo {
		background: #242424;
	max-width: 170px;
	text-align: center;
	color: #cfcfcf;
	padding: 15px 0px 5px;
	-webkit-box-shadow: 0px 5px 12px 0px rgba(8, 8, 8, 0.8);
	-moz-box-shadow:    0px 5px 12px 0px rgba(8, 8, 8, 0.8);
	box-shadow:         0px 5px 12px 0px rgba(8, 8, 8, 0.8);
}
footer .foot-logo img {
	width: 120px;
}
ul.foot-menu {
		padding: 4px 0px;
}
ul.foot-menu li {
		display: inline-block;
}
ul.foot-menu li a {
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 16px;
		padding-right: 14px;
}
ul.foot-menu li a:hover {
		color: #999;
}
.foot-desc {
		color: #ccc;
	font-size: 14px;
	line-height: 1.3;
	padding-top: 6px;
}
#contact-form {
		background-image: url("../img/mailbg.jpg");
		background-size: cover;
		display: inline-block;
		color: #fff;
		font-family: 'Tahoma'; 
}
.sendform {
				max-width: 430px;
}
.sendform span {
				font-size: 18px;
				line-height: 1.4;
				margin: -10px 0px 23px 0px;
				display: block;
}
.sendform .btn {
				padding: 10px 40px;
				text-transform: uppercase;
				margin: 20px auto 0px auto;
				display: block;
				background: #ff841b;
}
.sendform input[type="text"] {
				padding: 7px 10px;
				margin: 5px 0px;
				font-size: 16px;
				color: #262626;
}
.sendform textarea {
				width: 100%;
				margin-top: 5px;
				font-size: 16px;
				color: #262626;
				padding: 10px;
				font-family: 'Tahoma'; 
}


.loader_inner {
	width: var(--container-size);
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}
.📦 {
		width: var(--box-size);
		height: var(--box-size);
		position: relative;
		display: block;
		-webkit-transform-origin: -50% center;
						transform-origin: -50% center;
		border-radius: var(--box-border-radius);
	}
	.📦:after {
		content: '';
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		right: 0;
		background-color: lightblue;
		border-radius: var(--box-border-radius);
		box-shadow: 0px 0px 10px 0px rgba(28, 159, 255, 0.4);
	}
	.📦:nth-child(1) {
		-webkit-animation: slide var(--duration) ease-in-out infinite alternate;
						animation: slide var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(1):after {
		-webkit-animation: color-change var(--duration) ease-in-out infinite alternate;
						animation: color-change var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(2) {
		-webkit-animation: flip-1 var(--duration) ease-in-out infinite alternate;
						animation: flip-1 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(2):after {
		-webkit-animation: squidge-1 var(--duration) ease-in-out infinite alternate;
						animation: squidge-1 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(3) {
		-webkit-animation: flip-2 var(--duration) ease-in-out infinite alternate;
						animation: flip-2 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(3):after {
		-webkit-animation: squidge-2 var(--duration) ease-in-out infinite alternate;
						animation: squidge-2 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(4) {
		-webkit-animation: flip-3 var(--duration) ease-in-out infinite alternate;
						animation: flip-3 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(4):after {
		-webkit-animation: squidge-3 var(--duration) ease-in-out infinite alternate;
						animation: squidge-3 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(5) {
		-webkit-animation: flip-4 var(--duration) ease-in-out infinite alternate;
						animation: flip-4 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(5):after {
		-webkit-animation: squidge-4 var(--duration) ease-in-out infinite alternate;
						animation: squidge-4 var(--duration) ease-in-out infinite alternate;
	}
	.📦:nth-child(2):after {
		background-color: #1C9FFF;
	}
	.📦:nth-child(3):after {
		background-color: #1FB1FD;
	}
	.📦:nth-child(4):after {
		background-color: #22C7FB;
	}
	.📦:nth-child(5):after {
		background-color: #23D3FB;
	}
	
	@-webkit-keyframes slide {
		0% {
			background-color: #1795FF;
			-webkit-transform: translatex(0vw);
							transform: translatex(0vw);
		}
		100% {
			background-color: #23D3FB;
			-webkit-transform: translatex(calc(var(--container-size) - (var(--box-size) * 1.25)));
							transform: translatex(calc(var(--container-size) - (var(--box-size) * 1.25)));
		}
	}
	
	@keyframes slide {
		0% {
			background-color: #1795FF;
			-webkit-transform: translatex(0vw);
							transform: translatex(0vw);
		}
		100% {
			background-color: #23D3FB;
			-webkit-transform: translatex(calc(var(--container-size) - (var(--box-size) * 1.25)));
							transform: translatex(calc(var(--container-size) - (var(--box-size) * 1.25)));
		}
	}
	@-webkit-keyframes color-change {
		0% {
			background-color: #1795FF;
		}
		100% {
			background-color: #23D3FB;
		}
	}
	@keyframes color-change {
		0% {
			background-color: #1795FF;
		}
		100% {
			background-color: #23D3FB;
		}
	}
	@-webkit-keyframes flip-1 {
		0%, 15% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		35%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@keyframes flip-1 {
		0%, 15% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		35%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@-webkit-keyframes squidge-1 {
		5% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		15% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		25%, 20% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		55%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		40% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	@keyframes squidge-1 {
		5% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		15% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		25%, 20% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		55%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		40% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	@-webkit-keyframes flip-2 {
		0%, 30% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		50%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@keyframes flip-2 {
		0%, 30% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		50%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@-webkit-keyframes squidge-2 {
		20% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		30% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		40%, 35% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		70%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		55% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	@keyframes squidge-2 {
		20% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		30% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		40%, 35% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		70%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		55% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	@-webkit-keyframes flip-3 {
		0%, 45% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		65%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@keyframes flip-3 {
		0%, 45% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		65%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@-webkit-keyframes squidge-3 {
		35% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		45% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		55%, 50% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		85%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		70% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	@keyframes squidge-3 {
		35% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		45% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		55%, 50% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		85%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		70% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	@-webkit-keyframes flip-4 {
		0%, 60% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		80%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@keyframes flip-4 {
		0%, 60% {
			-webkit-transform: rotate(0);
							transform: rotate(0);
		}
		80%, 100% {
			-webkit-transform: rotate(-180deg);
							transform: rotate(-180deg);
		}
	}
	@-webkit-keyframes squidge-4 {
		50% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		60% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		70%, 65% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		100%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		85% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	@keyframes squidge-4 {
		50% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		60% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
		70%, 65% {
			-webkit-transform-origin: center bottom;
							transform-origin: center bottom;
			-webkit-transform: scalex(0.8) scaley(1.4);
							transform: scalex(0.8) scaley(1.4);
		}
		100%, 100% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1) scaley(1);
							transform: scalex(1) scaley(1);
		}
		85% {
			-webkit-transform-origin: center top;
							transform-origin: center top;
			-webkit-transform: scalex(1.3) scaley(0.7);
							transform: scalex(1.3) scaley(0.7);
		}
	}
	



.share42init {
		margin-top: 15px;
}


/*styling open close button*/
.buttonover {
	display:inline;
	position:absolute;
	top:-6px;
	z-index:999;
	font-size:30px;
}
.buttonover button {
	text-decoration: none;
				font-size: 30px;
				padding: 2px 10px 3px 10px;
				background: #217694;
				border-radius: 0;
				max-height: 40px;
}
.btn-open:after {
	color:#fff;
	content:"\f0c9";
	font-family: 'send';
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
	transition:all .2s linear 0s;
}
.btn-open:hover:after {
	color:#01c2ef;
}
.btn-close:after {
	color:#fff;
	content:"\e802";
	font-family: 'send';
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
	transition:all .2s linear 0s;
}
.btn-close:hover:after {
	color: #01c2ef;
}
/*overlay*/
.overlay {
	display:none;
	position:fixed;
	top:0;
	height:100%;
	width:100%;
	background:#333;
	overflow:auto;
	z-index:99;
}

.wrap-menu {
	color:#e9e9e9;
	text-align:center;
	max-width:90%;
	margin:0 auto;
}
.wrap-menu ul.wrap-nav {
	border-bottom:1px solid #575757;
	text-transform:capitalize;
	padding:150px 0px 100px;
}
.wrap-menu ul.wrap-nav li {
	font-size:20px;
	display:inline-block;
	vertical-align:top;
	width:24%;
	position:relative;
}
.wrap-menu ul.wrap-nav li a {
	color:#34B484;
	display:block;
	padding:8px 0;
	text-decoration:none;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
	transition:all .2s linear 0s;
}
.wrap-menu ul.wrap-nav li a:hover {
	color:#f0f0f0;
}
.wrap-menu ul.wrap-nav ul {
	padding:20px 0;
}
.wrap-menu ul.wrap-nav ul li {
	display:block;
	font-size:13px;
	width:100%;
	color:#e9e9e9;
}
.wrap-menu ul.wrap-nav ul li a {
	color:#f0f0f0;
}
.wrap-menu ul.wrap-nav ul li a:hover {
	color:#34B484;
}


@media screen and (max-width:48em) {
	.wrap-menu ul.wrap-nav>li {
		width:100%;
		padding:20px 0;
		border-bottom:1px solid #575757;
	}
	.wrap-menu ul.wrap-nav {
		padding:30px 0px 0px;
	}
	nav ul {
		opacity:0;
		visibility:hidden;
	}
}










/*==========  Mobile First Method  ==========*/

@media (max-width: 767px) {
		/* стили для xs-устройств */
		.topnavi {
				display: none;
	}
	.top-panel div {
		text-align: center;
	}
	.buttonover {
		position: relative;
	}
	.top-panel {
		padding-bottom: 5px;
	}
	.topbtn {
		margin-top: -10px;
	}
	.tab-menu {
		display: none;
	}
	.work-title {
		float: left;
	}
	.work-title span {
		float: left;
	}
	.work-title::after {
		position: relative;
		top: 0;
	}
	.work-title h4 {
		line-height: 1.2;
		padding-bottom: 5px;
	}
	.phone .icon-phone-squared {
		display: none;
	}
	.buttonover {
		left: -8px;
	}
	.top-fixed {
		bottom: 0;
				}
				.top-fixed .phone {
								font-weight: bold;
								font-size: 19px;
								margin-bottom: 10px;
				}
				.top-fixed .buttonover button {
								position: absolute;
								top: 45px;
				}
	.work-title {
		width: 100%;
		text-align: center;
	}
	.work-title span {
		width: 100%;
	}
	.work-title::after {
		width: 100%;
		left: 25%;
		margin-left: -25%;
	}
	.service-info ul {
		padding: 0;
		margin: 0;
	}
	.service ul {
		margin: 0 5% 20px 7%;
	}
	
	.service ul li {
		text-align: left;
		padding: 6px 0px 5px 25px;
		font-size: 16px;
	}
	.tab-content {
		padding: 60px 15px 200px 30px;
	}
	.portfolio {
		margin-top: 0px;
	}
	.work-title {
		margin: 35px 0px 35px 0px;
	}
	.news a img {
		width: 100%;
	}
	.stages .item::after {
		right: 50%;
		top: 90%;
		transform: rotate(90deg);
		margin-right: -17px;
	}
	.stages .item {

	}
	.portfolio a {
		margin: 20px 0px;
	}
}
	
@media (min-width: 768px) and (max-width: 991px) {
	/* стили для sm-устройств */
	ul.menutabs li {
		width: 25%;
		text-align: center;
		border: none;
	}
	header nav {
		padding: 10px 0px;
	}
	nav ul li {
		padding: 6px 0px;
	}
	.topbtn {
		text-align: center;
		padding: 10px;
	}
	.topbtn {
		padding: 0;
	}
	.topbtn .brief {
		display: none !important;
	}
	ul.menutabs li {
		height: 65px;
	}
	.top-fixed {
		bottom: 0;
	}
	.add-services .desc {
		padding: 8px 35px;
	}
	.work-title {
		width: 100%;
		text-align: center;
	}
	.work-title span {
		width: 100%;
	}
	.tab-content {
		padding: 100px 15px 200px 30px;
	}
	
}

@media (min-width: 991px) and (max-width: 1199px) {
	/* стили для md-устройств */
	ul.menutabs li {
		width: 25%;
		text-align: center;
		border: none;
	}
	header nav {
		padding: 10px 0px;
	}
	nav ul li {
		padding: 6px 0px;
	}
	.topbtn {
		float: right;
	}
	.service {
		margin: 15px 0px;
	}
	.service ul {
		padding: 0px 30px;
		margin: 5px 0px 20px 0px;
	}
	.service ul li {
		border-bottom: 1px solid #ececec;
		margin-bottom: 3px;
	}
	.add-services .desc {
		padding: 8px 40px;
	}
	
}


/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
	.container {
		max-width: 1260px;
	}
	ul.menutabs li {
		padding: 18px 16px;
	}

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 1275px) {
	ul.menutabs li {
		padding: 18px 20px;
	}
}


@media (min-width: 1500px) and (max-width: 1700px) {
	#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7, #tab8 {
		height: auto;
	}
	#tab2::before {
		content: "";
		width: 780px;
		height: 540px;
		position: absolute;
		background: url(../img/slide2bg.png) 0% 0% / cover;
	}
	.tab-content {
		padding: 150px 15px 100px 30px;
	}
}
@media (min-width: 1300px) and (max-width: 1499px) {
	#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7, #tab8 {
		height: auto;
	}
	#tab2::before {
		content: "";
		width: 665px;
			height: 459px;
		position: absolute;
		background: url(../img/slide2bg.png) 0% 0% / cover;
	}
	.tab-content {
		padding: 100px 15px 100px 30px;
	}
}
@media (min-width: 1200px) and (max-width: 1299px) {
	#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7, #tab8 {
		height: auto;
		min-height: 200px;
	}
	#tab2::before {
		content: "";
		width: 603px;
			height: 418px;
		position: absolute;
		background: url(../img/slide2bg.png) 0% 0% / cover;
	}
	.tab-content {
		padding: 65px 15px 20px 30px;
	}
}
@media only screen and (max-width: 1200px) {
	#tab2::before {
		display: none;
	}
	}
@media only screen and (max-height: 800px) {
	.tab-content {
		padding: 150px 15px 200px 30px;
	}
	#tab3 svg {
		padding: 100px 0px 0px 0px;
	}
	}