/*
        Файл написан в стиле "БЭМ" — Блок элемент модификатор!
        О стиле: http://ru.bem.info/method/
        
        Плюс несколько дополнений указанных ниже:
        1 - Одна строка один селектор!
        2 - одно правило одна строка!
        3 - Проприетарные  правила пишите следующим образом:
                  1 - выравнивание по правилу!
                  2 - самым последним правилом!
                  3 - через 1 перенос строки от всех остольных правил!

        ПРИМЕР:
        
        #selector,
        .selector div{
                border: 1px solid red;
                width: 100px;
                height: 100px;
                
                -webkit-border-radius: 5px;
                   -moz-border-radius: 5px;
                        border-radius: 5px;
        }
*/
@import url(reset.css);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,700,400&subset=latin,cyrillic);
/* |===============| global start |===============| */
html, body{
    height: 100%;
}
body{
    font: 14px/22px 'Open sans', sans-serif;
    color: #2e2e2e;
    background: #fff;
}
#wrapper {
    position: relative;
    overflow: hidden;
    padding: 0 0 142px;
    min-width: 1220px;
    min-height: 100%;
}
[class*="__center"]{
    position: relative;
    margin: auto;
    width: 1180px;
}
[class*="__center"]:before,
[class*="__center"]:after{
    content: "";
    display: block;
    clear: both;
}
/* |===============| Отмена сбросса стилей start |===============| */
p,
.noreset ul,
.noreset ol,
.noreset dl{
    margin: 13px 0;
}
.noreset ul,
.noreset ol,
.noreset dd{
    padding-left:40px;
}
h1,
h2,
h3,
h4,
h5,
h6{
    margin: 21px 0;
    font-weight:bold;
}
h1,
h2{
    font: bold 24px/28px 'Open sans';
}
h2 { font-size: 1.2em; }
h3{font-size:1.17em;}
h5{font-size:0.83em;}
h6{font-size:0.67em;}
.noreset ul{list-style-type: disc;}
.noreset ol{list-style-type: decimal;}
a{
    color: #2e2e2e;
}
.form input:not([type="submit"]), .call-back input:not([type="submit"]),
.form textarea, .call-back textarea  {
    border: 1px solid #ECF0F1;
    padding: 7px 19px;
    font: 14px/22px 'Open sans';
    color: #9ca4a7;

}
textarea{
    height: 108px;
}
::-webkit-input-placeholder {color:#9ca4a7;}
::-moz-placeholder          {color:#9ca4a7;}/* Firefox 19+ */
:-moz-placeholder           {color:#9ca4a7;}/* Firefox 18- */
:-ms-input-placeholder      {color:#9ca4a7;}
/* |===============| Отмена сбросса стилей end |===============| */

a {
    text-decoration: none;
    color:#1e8bc3;
}

a:hover {

    color:#00a8ff;
}



.form input:not([type="submit"]), .call-back input:not([type="submit"]),
.form textarea, .call-back textarea,
.btn,
.comments__item{
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
/* |===============| global end |===============| */

/* |===============| wrap start |===============| */
.wrap_gray,
.footer{
    background: url(../img/gray_bg.png);
}
.wrap__center_header{
    border-bottom: 1px solid #889296;
    min-height: 151px;
}
.wrap_cover{
    overflow: hidden;
    position: relative;
    margin: -2px 0 0;
    min-height: 449px;
    background: url(../img/cover.jpg);
    -webkit-background-size: cover;
    background-size: cover;
}
.wrap_blue{
    overflow: hidden;
    background: url(../img/bl_bg.jpg);
    -webkit-background-size: cover;
    background-size: cover;
}
.wrap_pale{
    overflow: hidden;
    background: #ecf0f1;
}
.wrap_pale .heading{
    margin: 32px 0;
    text-align: center;
    font: bold 40px/44px 'Open sans';
}
.wrap_inside{
    padding: 49px 0 68px;
}
.wrap__left{
    float: left;
    width: 886px;
}
.wrap__left > h1:first-child{
    margin: -5px 0 20px;
}
.wrap__right{
    float: right;
    width: 230px;
}
/* |===============| wrap end |===============| */

/* |===============| nav start |===============| */
.header p {
    margin: 0;
}


.nav{
    float: left;
}
.nav__item{
    border-left: 1px solid #424242;
    position: relative;
    float: left;
}
.nav__item:first-child{
    border: 0;
    margin: 0 0 0 -24px;
}
.nav__link__val,
.nav__link{
    display: inline-block;
    padding: 0 24px;
    height: 51px;
    font: bold 12px/48px 'Open sans';
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
}

.nav__popup .nav__link {
    text-transform: none;
} 

.nav__link__val{
    border-top: 2px solid transparent;
    padding: 0;
}
.nav__item:hover .nav__link__val{
    border-color: #fff;
}
.nav__popup{
    display: none;
    z-index: 1;
    position: absolute;
    left: -2px;
    top: 100%;
    padding: 11px 0;
    min-width: 100%;
    background: #000; /*ie8*/
    background: rgba(0,0,0, 0.8);
    width: 200px;
}
.nav__item:hover > .nav__popup{
    display: block;
}
.nav__popup .nav__link{
    border: 0;
    padding: 7px 19px 6px;
    height: auto;
    line-height: 14px;
}
.nav__popup .nav__link:hover{
    color: #1e8bc3;
    text-decoration: none;
}
/* |===============| nav end |===============| */

/* |===============| nav start |===============| */
.header__info{
    float: left;
    margin: 36px 0 0 58px;
    width: 340px;
    font: 30px/36px 'Open sans';
    color: #889296;
}
.logo{
    float: left;
    padding: 43px 0;
    width: 290px;
    font: bold 48px/54px 'Open sans';
    text-decoration: none;
    color:#2e2e2e;
}

.logo:hover {
    color:#2e2e2e;
}

.blue{
    color: #1e8bc3;
}
.tel{
    float: right;
    margin: 36px 0 0;
    text-align: right;
}
.tel__info, .tel  small {
    font: bold 10px/12px 'Open sans';
    color: #889195;
}
.tel__val, .tel  p {
    margin: 1px 0 3px;
    font: bold 36px/40px 'Open sans';
}

 

.tel a[href^="mailto:"], .mail{
    position: relative;
    display: inline-block;
    text-decoration: none;
    font: 12px/14px 'Open sans';
    color: #1e8bc3;
}
.tel a[href^="mailto:"]:hover, .mail:hover{
    text-decoration: underline;
}
.tel a[href^="mailto:"]:before, .mail:before{
    content: "";
    position: absolute;
    top: 3px;
    left: -19px;
    width: 13px;
    height: 10px;
    background-image: url(../img/mail.png);
}
/* |===============| nav end |===============| */

/* |===============| form start |===============| */
.form{
    margin: 19px 0 19px 79px;
    padding: 9px 29px 30px;
    width: 382px;
    background: url(../img/gray_bg.png);
    color: #fff;
}
.form .heading{
    text-transform: uppercase;
    margin: 15px 0;
    font: bold 24px/28px 'open sans';
}
.form .field,
.form .textarea{
    display: block;
    margin: 12px 0;
    width: 320px;
    resize: none;
}
/* |===============| form end |===============| */

/* |===============| btn start |===============| */
.btn, form input[type="submit"].btn {
    display: inline-block;
    border: 2px solid #fff;
    padding: 0 15px;
    height: 38px;
    text-align: center;
    font: bold 14px/34px 'Open sans';
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    background: transparent;
}
.btn_order{
    margin: 10px 0 0;
}
.btn_blue{
    margin: 9px 0 0;
    padding: 0 14px;
    color: #1e8bc3 !important;
    border-color: #1e8bc3;
}

.btn_blue:hover {
    background-color: #5aaad3;
    border-color: #5aaad3;
    color:#fff !important;
}

.btn_blue:active {
    background-color: #00a8ff;
    border-color: #00a8ff;
    color:#fff !important;
}

/* |===============| btn end |===============| */

/* |===============| services start |===============| */
.services{
    overflow: hidden;
    margin: 0 -75px 0 0;
}
.services__item{
    float: left;
    margin: 51px 69px 50px 0;
    padding: 0 10px;
    width: 181px;
    height: 181px;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    font: bold 14px/17px 'Open sans';
    background-image: url(../img/ibd.png);
    color:#2e2e2e;

    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -moz-transition: all 0.5s;

}
.services__item:hover{
    color: #1e8bc3;
    background-image: url(../img/ibd_h.png);
}
.services__item__pic{
    display: block;
    margin: 23px auto 17px;

    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);

    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -moz-transition: all 0.5s;

}


.services__item:hover .services__item__pic {
    filter: none;
    -webkit-filter: grayscale(0);
} 


/* |===============| services end |===============| */

/* |===============| box start |===============| */
.box{
    float: left;
    margin: 29px 0 41px;
    padding: 26px 39px 28px 29px;
    width: 529px;
    min-height: 440px;
    background: #fff;
}
.box > h2 {
    margin: 0 0 15px -2px;
    font: bold 24px/24px 'Open sans';
}
/*.box .content{
    margin: 15px 0;
}*/
/* |===============| box end |===============| */

/* |===============| portfolio start |===============| */
.portfolio{
    float: right;
    margin: 21px -20px 21px 0;
    width: 601px;
    color: #fff;
}
.portfolio .heading{
    margin: 0 20px 3px -3px;
    font: bold 40px/44px 'Open sans';
}
.portfolio__item{
    position: relative;
    float: left;
    margin: 21px 20px 0 0;
    width: 180px;
    height: 180px;

    -webkit-box-shadow: 0 0 15px rgba(0,0,0, 0.30);
    -moz-box-shadow: 0 0 15px rgba(0,0,0, 0.30);
    box-shadow: 0 0 15px rgba(0,0,0, 0.30);



}
.portfolio__item__pic{
    width: 100%;
    height: auto;
}
.portfolio__item__popup{
    opacity:  0;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: center;
    line-height: 180px;
    background: #000; /* ie 8 */
    background: rgba(0,0,0, 0.5);

    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -moz-transition: all 0.5s;
}

.portfolio__item:hover .portfolio__item__popup{
     opacity:  1;
}
/* |===============| portfolio end |===============| */

/* |===============| comments start |===============| */
.comments{
    overflow: hidden;
    margin: 0 0 34px;
}
.comments__list{
    overflow: hidden;
    margin: 0 -24px 0 0;
}
.comments__item{
    float: left;
    margin: 0 22px 0 0;
    border: 2px solid #fff;
    padding: 24px 24px 24px 31px;
    width: 378px;
    color:#2e2e2e;

    font: 14px/22px 'Open sans';
    text-decoration: none;
    
      transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -moz-transition: all 0.5s;
    
}
.comments__item:hover{
    border-color: #1e8bc3;
     color:#2e2e2e;
}
.comments__item__content{
    display: block;
    overflow: hidden;
    height: 111px;
}
.comments__preson{
    font-size: 12px;
    font-style: italic;
}
.comments__slidenator{
    display: block;
    padding: 17px 0 0;
    text-align: center;
}
.comments__slidenator__item{
    cursor: pointer;
    display: inline-block;
    margin: 0 4px;
    border: 2px solid #fff;
    width: 12px;
    height: 12px;

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.comments__slidenator__item:hover,
.comments__slidenator__item_active{
    border-color: #1e8bc3;
    background: #1e8bc3;
}
/* |===============| commetns end |===============| */

/* |===============| footer start |===============| */
.footer{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 26px 0 34px;
    color: #fff;
}
.footer__copy{
    float: left;
    margin: 0 0 0 30px;
    width: 182px;
    font-size: 12px;
    line-height: 18px;
}
.footer__tel{
    margin: 22px 0 0;
    font: bold 24px/24px 'Open sans';
}
.footer__mail{
    position: relative;
    float: left;
    margin: 31px 0 0 222px;
    font-size: 24px;
}

.footer__mail p {
    margin: 0;
}

.footer__mail a {
    text-decoration: none;
    color:inherit;
}

.footer__mail:before{
    content: "";
    position: absolute;
    left: -34px;
    top: 3px;
    width: 24px;
    height: 20px;
    background-image: url(../img/mail_f.png);
}
/* |===============| footer end |===============| */

/* |===============| call-back start |===============| */
.call-back{
    position: fixed;
    top: 50%;
    right: -212px;
    margin-top: -121px;
    padding: 17px 0 17px 70px;
    width: 262px;
    min-height: 242px;
    background: #1e8bc3;
}
.call-back__toggle{
    cursor: pointer;
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
    min-height: 242px;
    height: 100%;
    background: url(../img/call_back.png) left center no-repeat;
    border-right: 1px solid #54BCDF;
}
.call-back .field{
    margin: 0 0 12px;
    width: 172px;
}
.btn_pcb{
    margin: 17px 0 0;
}
/* |===============| call-back end |===============| */

/* |===============| aside-menu start |===============| */
.aside-menu{
    padding: 20px 0 14px;
    background: url(../img/gray_bg.png);
}
.aside-menu__item{
    display: block;
    margin: 8px 0 23px;
    border-left: 2px solid transparent;
    padding: 0 29px;
    font: bold 14px/14px 'open sans';
    color: #fff;
    text-decoration: none;
}
.aside-menu__item:hover{
    border-color: #fff;
    color:#fff;
}
/* |===============| aside-menu end |===============| */

/* |===============| other start |===============| */
.garanty{
    position: absolute;
    right: 2px;
    top: 0;
    width: 199px;
    height: 70px;
    font: bold 18px/60px 'Open sans';
    color: #fff;
    text-align: center;
    background-image: url(../img/garanty.png);
}
.soc{
    float: right;
    margin: 30px 0 0;
}
.soc__item{
    display: inline-block;
    margin-left: 16px;
    width: 31px;
    height: 31px;
}
.soc__item_fb{
    background-image: url(../img/fb.png);
}
.soc__item_fb:hover{
    background-image: url(../img/fb_h.png);
}
.soc__item_vk{
    background-image: url(../img/vk.png);
}
.soc__item_vk:hover{
    background-image: url(../img/vk_h.png);
}
.soc__item_tw{
    background-image: url(../img/tw.png);
}
.soc__item_tw:hover{
    background-image: url(../img/tw_h.png);
}
/* |===============| other end |===============| */






/* |===============| styles |===============| */


.clauses_all_img > a, .news_all_img > a {
  display: inline-block;
  height: 120px;
  overflow: hidden;
  width: 180px;
  margin-right: 10px;
}

.clauses_all_img > a > img, .news_all_img > a > img {
	width: 100%;
	height: auto;
}

a[rel^="prettyPhoto"] {
  display: inline-block;
  position: relative;
}

a[rel^="prettyPhoto"] .zoom {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent url(../img/zoom.png) center center no-repeat;
  transition: all .5s;
  -webkit-transition: all .5s;
  -ms-transition: all .5s;
  -moz-transition: all .5s;
}

a[rel^="prettyPhoto"]:hover .zoom {
  opacity: 100;
}


form input[type="submit"] {
    display: inline-block;
    border: 2px solid #64afd6;
    padding: 0 15px;
    height: 38px;
    text-align: center;
    font: bold 14px/34px 'Open sans';
    color: #64afd6;
    text-transform: uppercase;
    text-decoration: none;
    background: transparent;
    border-radius: 3px;
}

form input[type="submit"], .btn { 
	  transition: all .5s;
  -webkit-transition: all .5s;
  -ms-transition: all .5s;
  -moz-transition: all .5s;
}

form input[type="submit"]:hover {
	background-color: #64afd6;
    color:#fff;
}

.form input[type="submit"]:hover
{
    background-color: transparent;
}

form input[type="submit"]:active {
	background-color: #00a8ff;
}

form input:not([type="submit"]),form textarea {
    border-radius: 0;
    border:1px solid #889296;
     padding: 7px 19px;
    font: 14px/22px 'Open sans';
    color: #9ca4a7;
}

form input:not([type="submit"]):hover,form textarea:focus {
    border-color:#535a5d;
}

form input:not([type="submit"]):focus,form textarea:hover {
    border-color:#5aaad3;
}


form input[type="checkbox"], form input[type="radio"] {
  display: none;
}

form input[type="radio"]+label {
  display: inline-block;
  vertical-align: middle;
  background: url(../img/radio-off.png) left center no-repeat;
  cursor: pointer;
  padding: 0 0 0 25px;
}

form input[type="radio"]:checked+label {
  background: url(../img/radio-on.png) left center no-repeat;
}

form input[type="checkbox"]+label {
  display: inline-block;
  vertical-align: middle;
  background: url(../img/checkbox-off.png) left center no-repeat;
  cursor: pointer;
  padding: 0 10px 0 25px;
}

form input[type="checkbox"]:checked+label {
  background: url(../img/checkbox-on.png) left center no-repeat;
}

.error_input {
	border-color: #d64541 !important;
    -webkit-box-shadow: 0px 0px 5px 0px  #f0bdbb;
-moz-box-shadow:    0px 0px 5px 0px  #f0bdbb;
box-shadow:         0px 0px 5px 0px  #f0bdbb;
}

.errors {
    margin: 0;
    padding: 10px 0 0;
    color:#d64541;
    font: 12px/14px 'Open sans',sans-serif;

}

.captcha {
  margin-top: 15px;
}

.captcha .captcha-image {
  margin-right: 15px;
}

.captcha input[name="captcha"] {
  width: 150px;
}

.block {
  margin-bottom: 20px;
}

.block-row-img {
  float: left;
  margin-right: 15px;
  width: 100px;
}

.block-row-img img {
  width: 100%;
  height: auto;
}

.block-text {
  float: left;
  width: 87%;
}

:before, :after {
  box-sizing: border-box;
}

.block:before, .block:after {
  display: table;
  content: " ";
}

.block:after {
  clear: both;
}

.block .anons {
  font-size: 14px;
  line-height: 16px;
}

.block h4 {
  margin-top: 0;
    line-height: 19px;
}

.block_header {
  font: 16px/22px 'Open sans', sans-serif;
  font-weight: 700;
  margin: 0 0 35px;
  padding: 0;
}

.block h4 a {
  
  text-decoration: none;
  font-weight: bold;
  font-size: 14px;
  color:#1e8bc3;
}

.block h4 a:hover {
    color:#1e8bc3;
}



.photo_first_page {
    float: none;
    width: 100%;
    margin: 20px 0;
}

.photo_first_page .photo_img, .photo_list .block {
    display: inline-block;
    margin: 0 20px 20px 0;
}

.photo_list {
    margin-top: 20px;
}

.photo_list a.black {
    display: none;
}

.photo_first_page .photo_img:last-child, .photo_list .block:last-child {
    margin-right: 0;
}

.photo_img img {
    border:none;
}

.pagenator {
	margin-top: 20px;
}

.paginator {
    font-size:10px;
    line-height: 16px;
    font-weight: bold;
    color:#9e9e9e;
}

.paginator .end,
.paginator .start {
    width: 16px;
    height: 16px;
    background-image: url(../img/pagination-bg.png);
    display: inline-block;
    text-indent: -9999px;
}
.paginator .end {
    background-position-x: 100%;
}

.date, [class*="_date"] {
  margin: 7px 0 0;
  font: normal 12px 'Open sans';
  color: #9e9e9e;
  font-style: normal;
  font-weight: normal;
}


.previous_next_links:before, .previous_next_links:after {
  display: table;
  content: " ";
}

.previous_next_links:after {
  clear: both;
}

.previous_next_links {
	height: auto;
}


/*-----------------*/
.selectbox {
    vertical-align: middle;
    cursor: pointer;
}
/*
.selectbox .select {
    width: 185px;
    height: 30px;
    padding: 0 45px 0 10px;
    font: 14px/30px Arial, Tahoma, sans-serif;
    color: #333;
    text-shadow: 1px 1px #FFF;
    background: #f5f5f5 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAIAAABi9+OQAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABdJREFUeNpi+v//PxM2zMDAQEtxgAADAF2uTe9L4getAAAAAElFTkSuQmCC) repeat-x;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0,0,0,0.1);
}*/

.form .selectbox .select {
    width:320px;
    height: 38px;
    border: 1px solid #ECF0F1;
    padding: 7px 19px;
    font: 14px/22px 'Open sans';
    color: #9ca4a7;
    
    border-radius: 3px;
    background: #fff;
}


 .selectbox .select {
    width:185px;
    height: 38px;
    border: 1px solid #889296;
    padding: 7px 19px;
    font: 14px/22px 'Open sans';
    color: #2e2e2e;
    
 
    background: #fff;
}




.selectbox.focused .select {
    border: 1px solid #5794BF;
}
.selectbox .select .text {
    display: block;
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.selectbox .trigger {
    position: absolute;
    top: 0;
    right: 0;
    width: 34px;
    height: 100%;
   
}
.selectbox .trigger .arrow {
    position: absolute;
    top: 14px;
    right: 12px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #889296;
    width: 0;
    height: 0;
    overflow: hidden;
    
}

.form .selectbox .dropdown {
    top: 38px;
    width: 320px;
    margin: 0;
    padding: 0;
    background: #FFF;
    border: 1px solid #ECF0F1;
    border-radius: 3px;
    font: 14px/22px 'Open sans';
}

.selectbox .dropdown {
    top: 38px;
    width: 185px;
    margin: 0;
    padding: 0;
    background: #FFF;
    border: 1px solid #889296;
    
    font: 14px/22px 'Open sans';
}


.selectbox li {
    padding: 5px 12px;
    color: #2e2e2e;
    
}
.selectbox li.selected {
    background: #ecf0f1;
}
.selectbox li:hover {
    background: #ecf0f1;
}

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