@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Tenor+Sans&display=swap');

body { margin:0; padding:215px 0 0 0; font-size:16px; background:url(../images/fon.jpg); font-family:Lato, Arial, serif; color:#7b7b7b}
h1 { font-size:28px; text-align:center}
h2 { font-size:23px; text-align:center}
h3 { font-size:18px; text-align:center}
a {color:#006dde}
input,textarea {width:100%; outline:none; padding:13px 12px; font-family:Arial, sans-serif; margin:0 0 24px 0; border:#60605e solid 1px; box-sizing:border-box; border-radius:2px}
textarea {resize: vertical;}
input[type=submit] { padding:12px 20px; margin:0 auto; display:block; background:#eae106; border:none; font-size:22px; color:#000; cursor:pointer}
input:-moz-placeholder { color:#999999;}
textarea:-moz-placeholder { color:#999999;}
input::-webkit-input-placeholder { color:#999999;}
textarea::-webkit-input-placeholder { color:#999999;}
.warn { border:#ff0000 solid 2px;}
.warn::-webkit-input-placeholder { color:#FF0000;}
.warn:-moz-placeholder { color:#FF0000;}
.anim {-webkit-transition:all ease-out 0.25s;transition:all ease-out 0.25s;-moz-transition:all ease-out 0.25s;}
img { max-width:100%; border:none}
img[align=left] { margin:0 15px 0 0}
.menu-but,.menu-but-w {width:40px; height:37px; display:none; position: absolute; top:10px; right:10px; padding:9px 0 0 6px; cursor:pointer; color:#000; font-size:12px; letter-spacing:1px; z-index:7}
	.menu-but-w { color:#FFF}	
	.menu-ico { width:33px; height:25px; position:relative; top:12px;}
	.menu-ico span:after, .menu-ico span:before {content: ""; position: absolute; left: 0; top: -10px;}
	.menu-ico span:after{ top: 10px;}
	.menu-ico span { position:relative; display:block;}		
	.menu-ico span, .menu-ico span:after, .menu-ico span:before { width: 100%;  height: 4px;  background-color: #000;  transition: all 0.3s;  backface-visibility: hidden;  border-radius: 4px;-moz-border-radius: 4px;}
	.menu-but-w .menu-ico span, .menu-but-w .menu-ico span:after, .menu-but-w .menu-ico span:before {  background-color: #fff;}
	.on { color:#ffffff; background:none; z-index:1000}
	.on .menu-ico span { background-color: transparent;}
	.on span:before { transform: rotate(45deg) translate(10px, 10px); background-color:#fff;}
	.on span:after { transform: rotate(-45deg) translate(4px, -4px); background-color:#fff;}
	.on .menu-ico { height:30px;}
.clear { clear:both}
.captcha-box { width:100%; position:relative; margin:0 0 20px 0}
.captcha-box i { display:block; font-size:12px; line-height: 13px; padding:0 0 2px 0;}
.captcha-box span { color:#c8645a; font-size:18px; font-style:italic;}
.captcha-box input[type=text] { width:100px; position:absolute; right:0; top:13px;}
.box-flex,.box-flex2,.box-flex-end,.gallery,.box-flex-c-start,.box-flex-c,.box-flex2-c, .main-info .b-articls, .box-flex-cc {display:flex; flex-direction:row; justify-content:space-between; align-items:flex-start; flex-wrap:nowrap}
.box-flex2,.gallery {flex-wrap:wrap}
.box-flex-end {flex-wrap:wrap;justify-content:flex-end}
.box-flex-c-start {justify-content:flex-start;align-items:center}
.box-flex-c {align-items:center}
.box-flex2-c {flex-wrap:wrap;align-items:center}
.box-flex-cc {justify-content:center;align-items:center}
.box-pages {font-size:18px; padding:40px 0 30px 0}
				.pagest { display:inline-block;vertical-align: middle;padding:0 30px 0 0}
				.box-pages a { color:#ffffff; padding:6px 12px;display:inline-block; font-weight:bold; margin:3px; border-radius:4px; -moz-border-radius:4px; background:#0d8dcd; text-decoration:none}
				.box-pages span {color:#0d8dcd; padding:5px 11px;display:inline-block; font-weight:bold; margin:0 3px; border:#0d8dcd solid 1px; border-radius:4px; -moz-border-radius:4px}
.main { width:1130px; margin:0 auto}
	.header { width:100%; padding:26px 0; position:fixed; left:0; top:0; background:#fff}
		.logo { width:224px; color:#0d8dcd}
		.logo a {color:#0d8dcd; text-decoration:none}
		.logo span { display:block; font-size:22px; color:#2a456e}
		.logo img { display:block}
	.active-h { top:-157px}
	.h-info { width:560px;}
		.h-phone { padding:6px 0 6px 30px; position:relative}
			.h-phone a { color:#7b7b7b; text-decoration:none}
			.h-phone img { position:absolute; left:0; top:4px}
		.h-adr { padding:6px 0 6px 30px; background:url(../images/ico-point.jpg) no-repeat left center;}
		.h-eadr { padding:6px 0 6px 30px; background:url(../images/ico-mail.jpg) no-repeat left center;}
		.b-prilojenie { margin:12px 0 0 auto; cursor: pointer; text-align: right; padding: 5px 5px 5px 30px; border-radius: 23px; color: #2a456e; background: linear-gradient(#d8ffff, #60c7c7);}
			.b-prilojenie a { color: #2a456e; text-decoration: none;}
			.b-prilojenie img { width: 25px;}
			.b-prilojenie_text { font-size: 13px; text-align: center;}
			.b-prilojenie_text span { font-weight: bold; text-transform: uppercase;}
			.b-prilojenie_img { width: 40px; background: #FFF; height: 40px; border-radius: 50%; margin: 0 0 0 20px;}
		.b-instruction { width: 100%; font-size: 12px; text-align: right; padding: 10px 0 0 0;}
.b-menu { width:100%; background:#2a456e; position:fixed; left:0; top:157px; z-index:9}
	.active-m { top:0px !important}
	.el-menu a { color:#fff; display:inline-block; text-decoration:none; padding:20px 10px}
	.el-menu a:hover { background:#4b6995;-webkit-transition:all ease-out 0.25s;transition:all ease-out 0.25s;-moz-transition:all ease-out 0.25s;}
.b-sl img { display:block; margin:0 auto 54px auto}
.zag { font-size:25px; color:#0d8dcd; text-transform:uppercase; padding:15px 0}
	.b-news { padding:0}
	.el-news { width:28%; padding:26px 22px 23px 22px; background:#f7f8fa; margin:15px 0}
		.news-name { color:#2a456e; font-size:20px}
		.news-name a {color:#2a456e; text-decoration:none}
		.but { text-align:right; padding:10px 0 0 0}
			.but a { color:#fff; text-decoration:none; display:inline-block; padding:8px 20px; margin:0; background:#0d8dcd}
.hlebn-krohki { padding:20px 0 12px 76px;color:#604632}
	.hlebn-krohki a {color:#006dde}
	.hlebn-krohki ul { list-style:none; padding:0; margin:0}
	.hlebn-krohki li { display:inline-block}
	.hlebn-krohki-dev { padding:0 10px}
	.gallery img { margin:0 0 10px 0}
	.gallery a { display:block}
.b-gal { height:420px; background:url(../images/fon-gal.jpg) no-repeat center top}
	.b-gal .zag { text-align:center; color:#fff; padding:47px 0 60px 0}
	.b-gal .zag span { border-bottom:#0d8dcd solid 1px; padding:0 10px 5px 10px}
	#slider { width:96%; margin:0 auto}
.main-text { padding:60px 0}
	img[align=left] { margin:0 60px 0 0}
	.main-text p { line-height:22px}
.cont { padding:10px 0 100px 0}
	.map { width:48%; height:599px}
	.feed-back {width:48%; margin:0 0 50px 0}
	.feed-back form { background:#e8e8e8; padding:22px 30px 30px 30px; box-sizing:border-box}
	.feed-back h3 { padding:0 0 20px 0; margin:0;}
	.feed-back textarea { height:125px; margin:32px 0 21px 0}
	.el-doc { width:49%; margin:0 0 20px 0}
		.el-doc img { width:60px; margin:0 20px 0 0}
			.el-doc a { font-size:18px; color:#198ed9}
	.el-doc-bg {width:49%; margin:0 0 20px 0}
		.el-doc-bg img { width:60px; margin:0 20px 0 0}
			.el-doc-bg a:last-child { font-size:18px; background: #f52c2c; padding: 18px 20px; color: #fff; border-radius: 10px}
	.el-video { width:247px; height:215px; margin:0 0 10px 0}
		.name-video { font-size:18px; text-transform:uppercase; text-align:left}
		.des-video p { padding:0; margin:0}
	.el-articls { margin:0 0 40px 0}
	.main-info { margin:80px 0 0 0}
		.main-info .el-articls { width:46%}
	.zag2 { font-size: 24px; text-align: center; padding: 7px 0 10px 0;}
	.b-sl-new { display: flex; justify-content: space-between; align-items: center;}
		.b-sl-new-td { width: 49%;}
.map-c {width:48%; height:527px; margin:0 0 50px 0}	
	.info-cont { width:48%; margin:48px 0 20px 0}
		.ico-cont { min-height:30px; position:relative; margin:0 0 30px 0; padding:0 0 0 60px; background-position: left top; background-repeat:no-repeat; background-size:30px}
		.ico-cont img { width:30px; position:absolute; left:0; top:0}
		.point { background-image:url(../images/ico/point.svg)}	
		.call { background-image:url(../images/ico/call.svg)}
		.mail { background-image:url(../images/ico/mail.svg)}
		.time { background-image:url(../images/ico/time.svg)}
.footer { background:#e8edf3; padding:46px 0}	
	.f-phone { width:280px; font-size:20px; padding:6px 0 6px 66px; background:url(../images/f-phone.jpg) no-repeat left center}
	.f-phone a { text-decoration: none; color: #7b7b7b;}
	.f-soc { width:220px}
	.f-adr { padding:10px 44px 10px 0; background:url(../images/f-point.jpg) no-repeat right center; text-align:right}	
	.f-dev { width:2px; height:60px; background:#0d8dcd;}
.created { text-align:right; color:#7b7b7b; padding:30px 0 20px 0; font-size:12px}
		.created a { text-decoration:none; color:#7b7b7b}
		.created span { color:#ff0000}
.caution { padding:10px; background:#f1f1f1; font-style:italic}
	.caution span { font-size:12px}
#topcontrol { width:60px; height:60px; position: fixed; z-index: 9999; bottom: 50px; right: 50px; cursor: pointer; text-align:center; background:url(../images/up-arrow.png) no-repeat center #4574a0;opacity: 0.5;filter:alpha(opacity=50);border-radius:50%; webkit-border-radius:50%; moz-border-radius:50%;}
#topcontrol:hover {opacity: 1;filter:alpha(opacity=100);}

	@-moz-keyframes strtop {0%{top:0px}50%{ top:-3px}100%{ top:0px}}
	@-webkit-keyframes strtop {0%{ top:0px}50%{top:-3px}100%{ top:0px}}
	@-ms-keyframes strtop {0%{ top:0px}50%{top:-3px}100%{ top:0px}}
	@-o-keyframes strtop {0%{ top:0px}50%{top:-3px}100%{ top:0px}}
	.tbor { border-left:#787171 solid 1px; border-top:#787171 solid 1px;}
	.tbor th { border-bottom:#787171 solid 1px;  border-right:#787171 solid 1px; background:#ded9d9; height:30px;}
	.tbor td { border-bottom:#787171 solid 1px;  border-right:#787171 solid 1px;}
	#fade { /*--Transparent background layer--*/
		display: none; /*--hidden by default--*/
		background: #000;
		position: fixed; left: 0; top: 0;
		width: 100%; height: 100%;
		opacity: .5;
		z-index: 7;
	}
	.popup_block{
		display: none; /*--hidden by default--*/
		background: #ffffff;
		color:#333333;
		padding: 21px 30px;
		float: left;
		font-size: 1.2em;
		position: fixed;
		font-size:12px; text-align:left;
		top: 50%; left: 50%;
		z-index: 8;
		/*--CSS3 Box Shadows--*/
		-webkit-box-shadow: 0px 0px 5px #252424;
		-moz-box-shadow: 0px 0px 5px #252424;
		box-shadow: 0px 0px 5px #252424;
		/*--CSS3 Rounded Corners--*/
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		 
	}
	.popup_block h3 { text-transform:uppercase;}
	.popup_block input,.popup_block textarea { display:block; width:100%;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	.popup_block input[type=submit] { font-size:16px;}
	img.btn_close {
		float: right;
		margin: -4px -10px 0 0;
	}
	/*--Making IE6 Understand Fixed Positioning--*/
	*html #fade {
		position: absolute;
	}
	*html .popup_block {
		position: absolute;
	}
@media only screen and (max-width: 1280px){		
	.zag2 { font-size: 20px;}
}
@media only screen and (max-width: 1174px){	
	body { font-size:14px; padding: 213px 0 0 0}
	.logo { font-size:42px}
	.logo span { font-size:20px}
	.main { width:100%; padding:0 20px; box-sizing:border-box}
	.b-menu .main { padding:0}
	/*.b-menu .box-flex { display:block}*/
	.main-text.main { padding:40px 20px}
	.news-name { font-size:18px}
	img[align=left] { margin:17px 30px 8px 0}
}
@media only screen and (max-width: 1054px){	
	body { padding: 180px 0 0 0}
	/*.logo { width:330px}*/
	.h-info {width: 500px}
	.b-sl img {margin: 0 auto 34px auto;}
	.header { padding: 28px 0}
	/*.b-menu { top:124px}*/
	.el-news {padding: 22px 18px 19px 18px}
	.but {padding: 0}
	.b-sl-new { flex-direction: column;}
	.b-sl-new-td { width: 100%;}
}
@media only screen and (max-width: 920px){	
	.h-info { width:174px; margin: -16px 0 0 0}
	.h-phone, .h-adr, .h-eadr { margin:3px 0}
	.f-phone { font-size:18px;width: 196px;padding: 7px 0 7px 48px}
	.f-soc { width:182px}
	.main-text p {  line-height: 20px}
	.b-prilojenie { margin: 0;}
	.b-prilojenie_text span { display: block;}
	.b-prilojenie {flex-direction: column; text-align: center; padding: 13px 10px;}
	.h-info { width: 370px;}
	.h-info.box-flex2 {flex-direction: column;  height: 120px;}
	.main.box-flex2-c { height: 120px;}
	.b-prilojenie_img { margin: 10px 0 0 0;}
	.b-instruction { padding: 7px 23px 0px 0;}
}

@media only screen and (max-width: 850px){	
	img[align=left] { max-width:50%; margin:17px 16px 8px 0}
}
@media only screen and (max-width: 800px){	
	body { padding:0}
	.header { position:relative;}
	.active-h { top:0}
	.logo { font-size:34px; margin: 18px 0 0 0}	
	.h-info { width: 430px; margin: 0 30px 0 0}
	.el-news { width:100%}
	.menu-but { display:block}
	.b-menu .main.box-flex { flex-wrap: wrap;}
	.el-menu { width: 100%;}
	.b-menu {position:absolute; width:100%; left:-100%; top:0; background:#262626; margin:0; padding:60px 0; z-index:6; box-sizing:border-box}
	.b-menu a { display:block; padding:14px 0; text-align:center; font-size:16px}
	.footer { padding:10px}
	.footer .box-flex-c { display:block}
	.f-dev { display:none}
	.f-phone, .f-soc, .f-adr { margin:26px auto}
	.f-adr { width:200px}
	.b-instruction { padding: 7px 82px 0px 0;}
}
@media only screen and (max-width: 740px){
	.main.box-flex2-c { height: auto;}
	.h-info { width: 100%;}
}
@media only screen and (max-width: 700px){
	.main-info { margin:40px 0 0 0}
	.main-info .el-articls { width:100%}
	.main-info .b-articls { flex-wrap:wrap}
	.el-articls { margin:0 0 20px 0}
}
@media only screen and (max-width: 650px){	
	.h-info {margin: 0 80px 0 0; font-size:12px;}
	.logo {font-size: 26px;width: 210px}
	.logo span { font-size:15px}
	.h-phone, .h-adr, .h-eadr { background-size:16px; padding: 6px 0 6px 23px; margin:0}
	.h-phone img { width:16px}
	.zag { font-size:20px; padding:0}
	.news-name { font-size:16px}
	.el-news { padding: 14px 14px 15px 14px}
	.b-gal { height:auto; padding: 0 0 30px 0}
	.b-gal .zag { padding: 27px 0 20px 0}
}
@media only screen and (max-width: 600px){
	.zag2 { font-size: 18px; padding: 10px;}
	.b-sl-new-td:last-child img { width: 100%;}
	.b-sl-new-td .box-flex-c { flex-wrap: wrap;}
}
@media only screen and (max-width: 560px){
	.h-info {margin: 0 50px 0 0}
	.map { width:100%; height:200px}
.feed-back { width:100%; margin:30px 0}
.feed-back form {padding: 22px 10px 30px 10px}
input, textarea { margin:0 0 5px 0}
.feed-back textarea {margin: 5px 0 16px 0}
.gallery a { width:48%}
.b-instruction { text-align: center; padding: 10px 0 0 0;}
}
@media only screen and (max-width: 500px){
	.h-info {margin: 0 30px 0 0}
}
@media only screen and (max-width: 470px){
	.h-adr, .h-eadr { display:none}
	.h-phone a:last-child { display:none}
	.h-info { margin: 14px 0 0 0}
	.h-phone img { width:26px}
	.h-phone { position: absolute; top: 17px; right: 80px;}
	.logo { margin:0}
	#topcontrol { right:10px; bottom:10px}
	.main-text.main { text-align:justify}
	.created { padding:0 0 20px 0; text-align:center}
	.h-info.box-flex2 { height: auto;}
	.b-prilojenie {
		margin: 0 auto;
	}
}
@media only screen and (max-width: 400px){
.main { padding:0 10px}
.logo { font-size:20px}
.logo span { font-size:13px}
.cont { text-align:justify}
.popup_block { width:98%; padding:0 5px 18px 5px; left:1%; box-sizing:border-box}
.popup_block h3 { font-size:18px}
img.btn_close {margin: 12px 7px 0 0;}
img[align=left] { max-width:100%; margin:10px 0}
.main-text.main {padding: 30px 10px}
.el-news { text-align:justify}
}
@media only screen and (max-width: 340px){
	.logo { width: 180px;}
}
.active-menu { display:block; left:0}