@font-face {
    font-family: "Bitter";
    src: local(Bitter-Bold), url(/layout/_fonts/Bitter-Bold.otf);
}
@font-face {
    font-family: "Helv";
    src: local(HelveticaNeueCyr-Roman), url(/layout/_fonts/HelveticaNeueCyr-Roman.otf);
}
@font-face {
    font-family: "Helv";
    src: local(HelveticaNeueCyr-Bold), url(/layout/_fonts/HelveticaNeueCyr-Bold.otf);
    font-weight: bold;
}
@font-face {
  font-family: "icons";
  src: local(standart-icons), url(/layout/_fonts/standart-icons.ttf);
}


html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  color: #2f4452;
  font-size: 16px;
  font-family: "Helv", sans-serif;
  line-height: 1.3;
}

h1, h2 { 
  font-family: "Bitter", sans-serif; 
  font-size: 26px; 
  margin: 52px;
  text-align: center; 
  color: #395363; 
}
h3 { font-size: 18px; font-weight: normal; margin-top: -20px; }
h4 { font-size: 18px; margin: 10px 0; }

p { margin: 10px 0; text-align: left; }

ul { padding-left: 10px; }

a { color: #395363; }

.rig { float: right; }
.cent { text-align: center; }
.bigtext {  font-size: 24px; }
.bigger{  font-size: 26px; }
.yel { color: #f1c101 !important; }
.white { color: white; }
.gray { color: #395363;}
.non { text-decoration: none; }
.non:hover { text-decoration: underline; }
.shadowtext { text-shadow: 3px 3px 3px 3px #2f4452; }
.attention { color: #ffea00; text-shadow: 3px 3px 3px #3e4c54; font-size: 40px; font-weight: bold; }
.big { font-size: 52px; }
.tab { padding-left: 100px; }
.tab span { display: inline-block; width: 100px; margin-left: -100px; color: #4d6573; }
.w96procent { width: 94%; margin: 2%; font-size: 18px; padding: 1%; }
.fontext {
  display: inline-block; 
  padding: 0 30px; 
  color: #2f4452; 
  background: #ffea00; 
  font-weight: normal !important;
}
.but { 
  display: block;
  float: right;
  padding: 5px 20px;
  color: white;
  background: #4d6573;
  border-radius: 30px;
  box-shadow: 0 4px 3px -3px #2f4452;
  text-decoration: none;
}
.but:hover { box-shadow: 0 0 3px 3px #ffea00; }

sub {   
  display: inline-block;
  margin: 0 5px;
  text-decoration: none;
  font-family: "icons", sans-serif;
  font-size: 18px;
}

header>div, section>div, nav>div, footer>div {
	position: relative;
  width: 98%;
  max-width: 1200px;
	min-width: 1000px;
	margin: 0 auto;
}

header { background: url(/layout/_imgs/fon-header.jpg) no-repeat center top;}

header div.rig { margin-top: 10px; font-size: 18px; } 
header p { font-weight: bold; }

nav { height: 55px; background: #395363; box-shadow: inset 0 4px 3px -3px #2f4452; color: #cdd8d8; position: relative; }
nav a { 
	display: inline-block;
	width: 20%;
	color: white;
	padding: 17px 0;
	text-align: center;
	text-decoration: none;
}
nav a:nth-child(4) { width: 16%; }
nav a:last-child { 	width: 21%; }
nav a:hover, nav a.active { color: #cdd8d8; background: #4d6573; box-shadow: inset 0 4px 3px -3px #2f4452; }

.fix { 
  position:fixed;
  z-index: 3000;
  top: 0px;
  width:100%;
  transition: 0.5s;
}
.submenu {
  background: #4d6573;
  position: absolute;
  left: 5px;
  top: 55px;
  z-index: 10;
  width: 20%;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.5s;
}
.submenu a {
  color: white;
  padding: 10px 15px;
  width: 100% !important;
  height: 19px;
  border-bottom: 1px solid #395363;
  text-align: left;
}
nav span:hover .submenu { opacity: 1; height: 200px; }

.services { height: 300px; }
.services a { 
  display: block; 
  float: left;
  width: 20%; 
  text-align: center;
  text-decoration: none;
  font-size: 18px;
  color: #2f4452;
  background: url(/layout/_imgs/sun.png) no-repeat;
  background-position: center top;
}
.services a:hover { color: #395363; text-decoration: underline; background-position: center -156px }

.services a span { 
  display: block; 
  width: 100%;
  height: 111px;
  margin: 0 auto; 
  background-image: url(/layout/_imgs/services.png);
  border-bottom: 1px solid #d7dde0; 
  margin-bottom: 20px;
}
#fiz { background-position: -0px 0px; }
#org { background-position: -254px 0; }
#tszh { background-position: -495px 0; }
#gos { background-position: -780px 0px; }
#str { background-position: -1042px 0; }

.bonus { 
  width: 96%;
  padding: 1% 2%; 
  border: 1px solid rgba(78,95,105,.1);
  border-radius: 30px;
  box-shadow: 0 4px 3px -3px #2f4452;
  font-size: 18px;
}

.bonus a { 
  display: block;
  float: right;
  padding: 5px 20px;
  color: #2f4452;
  background: #ffea00;
  border-radius: 30px;
  box-shadow: 0 4px 3px -3px #2f4452;
  text-decoration: none;
}
.bonus a:hover { color: #395363; box-shadow: 0 0 3px 3px #ffea00; }

#info { 
  margin-top: 50px; 
  background: #cdd8d8 url(/layout/_imgs/fon-text.jpg);
  background-size: cover; 
}
.whitefon { 
  margin-right: 500px; 
  padding: 90px 10px 70px 10px; 
  color: #2f4452; 
  background: rgba(255,255,255,.5);
}
.whitefon p:first-child, .whitefon a { font-weight: bold; }

.pad { padding: 30px 0; }
#pref { min-height: 50vh; background: url(/layout/_imgs/gerb.jpg) no-repeat center top; }
#pref a { width: 23.3%; margin: 0 5%; float: left; text-align: center; height: 220px; color: #2f4452; }
#pref a:hover { color: #4d6573; text-decoration: none; }
#pref a:hover span { background-color: #ffea00; box-shadow: 0 0 5px 2px #ffea00; }
#pref span { 
  display: inline-block;
  width: 100px;
  height: 100px;
  margin-bottom: 10px;
  background-color: rgba(255,255,255,.2);
  background-image: url(/layout/_imgs/icons.png);
  border: 1px solid rgba(78,95,105,.2);
  border-radius: 50%;
}
#pre-icon1 { background-position: -162px -6px; }
#pre-icon2 { background-position: -312px -6px; }
#pre-icon3 { background-position: -769px -6px; }
#pre-icon4 { background-position: -7px -9px; }
#pre-icon5 { background-position: -464px -6px; }
#pre-icon6 { background-position: -615px -8px; }

#client { background: #cdd8d8 url(/layout/_imgs/fon-client.jpg) top center; }
#client div { text-align: center; }

#podval { padding: 10px 0; color: #D7DDE0; background: #395363; line-height: 85px; text-align: right; }
#podval a, footer a, footer { color: #cdd8d8; text-decoration: none; }
#podval a:hover, footer a:hover { text-decoration: underline; }
#podval img { float: left; }
#podval sub { margin: 0 0.5% 0 4%;}

footer {  width: 100%; height: 20px; padding: 10px 0; background: #2f4452; }

#kanalizacia { 
  margin: 40px 0; 
  padding: 1px 0 40px 0; 
  background: #cdd8d8 url(/layout/_img_foto/kanalizacia.jpg);  background-size: cover; 
}
#elektro { 
  margin: 40px 0; 
  padding: 1px 0 40px 0; 
  background: #cdd8d8 url(/layout/_img_foto/elektro.jpg); background-size: cover; 
}

.intrlogo { 
  display: block; 
  float: right;
  width: 100px; 
  height: 20px; 
  margin: 0 10px 0 20px; 
  padding: 4px 10px 6px 30px; 
  font: 10pt Arial; 
  background: url('/layout/_img_foto/white.png'); 
  color: #2f4452; 
  text-decoration: none
}
.intrlogo:hover { color: #395363; }

.unslider{ position:relative; top: 0; left: 0; margin: 0; width: 100%; z-index: 0; overflow:hidden}
.unslider-wrap{position:static;left:0;top:0;margin:0;padding:0; height: 100%}
.unslider-fade, .unslider-horizontal {position:relative; height: 100%}
.unslider-wrap.unslider-carousel li{float:left}
.unslider-wrap li { float:left;left:0;top:0;margin:0;padding:0;z-index:0;width: 100%; height: 100%; 
  list-style:none; background-position: top center; background-repeat: no-repeat; }

.unslider-wrap li div { 
  width: 98%; 
  max-width: 1200px; 
  min-width: 1000px; 
  margin: 100px auto; 
  color: #2f4452;
  font-size: 26px;
  line-height: 60px;
}
.unslider-wrap li span { position: absolute; z-index:-1; top: 0; left: 0;
  height: 100%; width: 100%; opacity: 0; transition: .5s; background-size: cover; background-position: center; }
.unslider-wrap li.unslider-active span {  opacity: 1; }

.unslider-arrow {
    position: absolute;
    z-index: 3;
    top: 50%;
    margin-top: -30px;
    display: block;
    width: 40px;
    height: 61px;
    cursor: pointer;
    background:  url(/layout/_imgs/arrows.png) no-repeat;
    background-position: center top;
}
.unslider-arrow.next { right: 1%;}
.unslider-arrow.next:hover { background-position: center -149px; }
.unslider-arrow.prev { left: 1%; background-position: center -77px; }
.unslider-arrow.prev:hover { background-position: center -227px; }

.unslider-nav { height: auto !important; }
.unslider-nav ol {
  position: absolute;
  left: 45%;
  bottom: 10px;
  list-style: none;
  text-align: center;
  z-index: 5;
}
.unslider-nav ol li {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 4px;
  background: rgba(255,255,255,.5);
  border-radius: 50%;
  overflow: hidden;
  text-indent: -999em;
  cursor: pointer;
}
.unslider-nav ol li.unslider-active { background: #ffea00; cursor: default;}
/*
.unslider ul li:nth-child(1) span {background-image: url(foto/fon1.jpg)}
.unslider ul li:nth-child(2) span {background-image: url(foto/fon2.jpg)}
.unslider ul li:nth-child(3) span {background-image: url(foto/fon3.jpg)}
.unslider ul li:nth-child(4) span {background-image: url(foto/fon4.jpg)}
.unslider ul li:nth-child(5) span {background-image: url(foto/fon5.jpg)}
.unslider ul li:nth-child(6) span {background-image: url(foto/fon6.jpg)}
*/
.bx-wrapper {
  position: relative;
  display: inline-block;
}
.bx-wrapper span, .bx-wrapper a { position: relative; border: 1px solid #cdd8d8; border-radius: 10px; padding: 2px; }
.feed a { display: inline-block; position: relative; margin: 0 10px 10px 0 }
.feed img { border-radius: 10px;  }
.feed a b { display: block; position: absolute; z-index: 2; width: 100%; height: 100%; border-radius: 10px; }
.feed a:hover b {  background: rgba(78,95,105,.3) url(/layout/_imgs/eye.png) no-repeat center center; }
.gal img { height: 200px; }
.gal a:hover img { opacity: .8; }
.gal a { height: auto !important; margin-bottom: 40px !important; overflow: hidden; }

.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 50%;
  margin-top: -30px;
  border: none;
  width: 40px;
  height: 61px;
  text-indent: -9999px;
  z-index: 3;
  background-image: url(/layout/_imgs/arrows.png);
}
.bx-wrapper .bx-controls-direction a.disabled { display: none; }

.bx-wrapper .bx-prev {  left: -45px; background-position: center -77px; }
.bx-wrapper .bx-prev:hover {  background-position: center -227px; }

.bx-wrapper .bx-next {  right: -45px;  background-position: center top; }
.bx-wrapper .bx-next:hover { background-position: center -149px; }


/* contact form */
.letter { width: 690px; height: 650px; margin: 0px auto; padding: 10px 0px; color: #333333; background: white url('/layout/_img_foto/letter.jpg'); 
background-size: cover;
}
.letter img { float: right; margin: 20px 40px; }
.letter input, .letter textarea { font-size: 16px; padding: 5px 8px; color: #777777; border: 1px #eeeeee inset; }
.letter p { margin: 20px 40px; text-align: left; font-size: 14px; }
p.ip { margin: -10px 40px 50px 120px; text-align: left; color: #777777; font-size: 12px; }
p.ip span { display: inline-block; width: 100px; height: 20px; margin: 0px 20px; padding: 5px 10px; color: black; font-size: 16px; border: 1px #333333 solid; }
.letter h5 { text-align: center; margin: 10px; font-size: 20px; font-weight: bold; }
.letter textarea { width: 590px; height: 100px; margin: 10px 40px; }
.letter input[type="submit"] { display: block; margin: 0px auto 0px auto; padding: 5px 15px; color: white; background: #214f68; border-radius: 5px; }
.letter input[type="submit"]:hover { cursor: pointer; box-shadow: 0px 0px 5px #333333; }
.letter a { color: #777777; }
/* end form */

.opacity_04 {opacity: 0.6;}
.opacity_1 {opacity: 1;}
.sb_cnt h3 a {color: white;text-decoration: none;}
.sb_cnt h3 a:hover {text-decoration: underline;}

#black_bg {
  position: fixed;
  display: none;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  z-index: 5500;
  background: rgba( 0, 0, 0, 0.7);
}
#black_bg form {
  top: 20%;
  left: 30%;
  min-width: 600px;
  min-height: 550px;
  width: 40%;
  height: 40%;
  z-index: 6000;
  background-color: white;
  position: absolute;
  transition: 0.5s;
  border-top: 4px solid #ffea00;
}
#black_bg form input[type=submit] {
  padding: 5px 20px;
  color: white;
  background: #4d6573;
  border-radius: 30px;
  box-shadow: 0 4px 3px -3px #2f4452;
  text-decoration: none;
  cursor: pointer;
}
#black_bg form input[type=submit]:hover { box-shadow: 0 0 3px 3px #ffea00; }

.close { display: block; float: right; padding: 10px; margin-top: -4px; background: #ffea00; text-decoration: none; }

.center{
  text-align: center;
  width: 100%;
  display: inline-block;
}
.captch{
  width: 100%;
  display: inline-block;
  text-align: center;
  padding: 15px 0px;
}
.g-recaptcha{
  display: inline-block;
}