@import url("./reset.css");

/* font-family: "NeoSansProRegular"; */
@font-face {
    font-family: "NeoSansProRegular";
    src: url("../fonts/NeoSansProRegular.eot");
    src: url("../fonts/NeoSansProRegular.eot?#iefix")format("embedded-opentype"),
    url("../fonts/NeoSansProRegular.woff") format("woff"),
    url("../fonts/NeoSansProRegular.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}

/* font-family: "NeoSansProBold"; */
@font-face {
    font-family: "NeoSansProBold";
    src: url("../fonts/NeoSansProBold.eot");
    src: url("../fonts/NeoSansProBold.eot?#iefix")format("embedded-opentype"),
    url("../fonts/NeoSansProBold.woff") format("woff"),
    url("../fonts/NeoSansProBold.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}


html {
    height: 100%; 
    min-height: 100%;
}

body {
    color: #333;
    font-family: "NeoSansProRegular";
    font-size: 100%;
    height: 100%;
    line-height: 1.2;
    min-height: 100%;
    padding-top: 76px;
}

/*Grid*/

.main {min-height: 100%;}
.wrap {/*min-width: 1280px; max-width: 1440px;*/ margin: 0 auto;}

/*Type Classes*/

h1, h2, h3, h4, h5, h6 {margin-bottom: 20px;}
h2 {font-size: 2.45em;}
p {margin-bottom: 20px;}
a {color: #fff; text-decoration: none;}
a:hover, a:focus {color: #fff;}
a.link-more {color: #2cb3b2; text-decoration: underline;}
input[type="text"], input[type="password"], textarea {border: 1px solid #e5f5f5; border-radius: 6px; box-sizing: border-box; color: #787878; font-size: 0.625em;
                                                      padding: 4px 6px; width: 100%; text-transform: uppercase;}
input[type="text"], input[type="password"], .btn {height: 22px;}
textarea {resize: none;}
.btn {background-color: transparent; border: 2px solid #e5f5f5; border-radius: 6px; box-sizing: border-box; color: #fff; cursor: pointer;
        font-size: 0.625em; padding: 0 10px; text-transform: uppercase;}

/*Helper Classes*/

.pull-left {float: left;}
.pull-right {float: right;}
.overflow {overflow: hidden;}
.up {text-transform: uppercase;}
.italic {list-style: italic;}
.text-center {text-align: center;}

/*Icons*/

.icons-social {background: url("../images/icons-social.png") left 0 no-repeat; height: 38px; width: 38px;}
    .icons-social.icon-fb {background-position: 0 -42px;}
    .icons-social.icon-in {background-position: 0 -84px;}
    .icons-social.icon-yb {background-position: 0 -126px;}
    .icons-social.icon-tw {background-position: 0 -168px;}

/*Header*/

header {background-color: #0b0b0b; box-sizing: border-box; margin: 0 auto; /*max-width: 1440px; min-width: 1280px;*/ padding: 15px 30px; position: fixed; top: 0; width: 100%; z-index: 1000;}
    header .phone {background: url("../images/icon-phone.png") left -1px no-repeat; color: #fff; height: 33px; float: right; font-size: 0.95em; font-family: "NeoSansProBold";
                    margin-top: 6px; padding: 8px 0 0 40px; }
    header .logo {float: left; margin-left: 25px;}

/*Menu*/

header .landingMenu {margin: 0 120px;}
    .menu {margin-top: 10px; text-align: center;}
        .menu > li {display: inline-block; margin-left: 20px;}
        .menu > li:first-child {margin-left: 0;}
            .menu > li a {border-bottom: 2px solid #fff; font-size: 0.95em; font-family: "NeoSansProBold"; padding: 0 0 5px; text-transform: uppercase;}
            .menu > li a:hover, .menu > li a:focus, .menu > li.active a, .menu > li a.cur {border-bottom: 2px solid #369d9c;}



/*Slider*/

.flex-container {max-width: 100% !important;}
    .flexslider {padding: 0 !important;}
    .flex-direction-nav .flex-prev, .flex-direction-nav .flex-next {background: url("../images/arrows.png") 0 0 no-repeat !important; height: 54px; width: 52px; z-index: 500;}
    .flex-direction-nav .flex-prev {left: 50px !important;}
    .flex-direction-nav .flex-next {background-position: 0 -55px !important; right: 50px !important;}
        .flex-direction-nav .flex-prev:before, .flex-direction-nav .flex-next:before {content:none;}
    .flexslider .flex-control-nav {display: none;}

.img-responsive, .thumbnail>img, .thumbnail a>img, .carousel-inner>.item>img, .carousel-inner>.item>a>img {width: 100%;}
.carousel {margin-bottom: -4px;}
.carousel-control {background: url("../images/arrows.png") 0 0 no-repeat !important; height: 54px; top: 50% !important; margin-top: -21px;
    opacity: 1 !important; text-shadow: none !important; width: 52px !important; }
    .carousel-control.left {left: 50px !important;}
    .carousel-control.right {background-position: 0 -55px !important; right: 50px !important;}

/*Content*/

.green-block {background-color: #3bb2b1; color: #fff; padding: 20px 0; text-align: center; }
    .green-txt {font-size: 1.3em;}

.form-inline .form-group, .form-inline button {display: inline-block; margin-left: 25px; vertical-align: middle;}
.form-inline .form-group:first-child {margin-left: 0;}
.form-inline .form-group {width: 130px;}

.form-txt {font-size: 0.625em; margin-bottom: 10px; text-transform: uppercase; }
    .form-txt > span {display: block;}
    .form-txt > span:first-child {font-size: 2.6em; margin-bottom: 2px;}
    .form-txt-sm {text-align: center;}

.services {padding: 50px 40px;}
    .service {margin-bottom: 80px; overflow: hidden;}
    .service:last-child {margin-bottom: 0;}
        .service .service-img {float: left; width: 216px; text-align: center;}
            .service .service-img > img {max-width: 100%;}
        .service .service-txt {margin-left: 256px;}

.list {list-style: disc; margin-bottom: 20px; padding: 0 0 0 20px;}
    .list > li {padding: 2px 0;}

.contacts {padding: 0px 0 0px;}
    .map {margin-top: 50px;}
        .map > ymaps {width: 100% !important;}
    .address {font-size: 1.3em; font-family: NeoSansProBold; padding: 20px 40px 0; text-transform: uppercase; }
        .address h2 {font-size: 1.8em;}
        .social {text-align: right;}
            .social > a {display: inline-block; margin-left: 5px; vertical-align: middle;}
            .social > a:first-child {margin-left: 0;}

/*Media*/

@media (max-width: 1280px) {
    .wrap, header {min-width: 100%; max-width: 100%;}
}
@media (max-width: 720px) {
    .adr, .social {float: none !important; text-align: center;}
    .social {margin-top: 15px;}
}
@media (max-width: 680px) {
    body {padding-top: 148px;}
    header {text-align: center;}
        header .logo, header .phone {float: none;}
        header .logo {display: block; margin-left: 0;}
        header .phone {display: inline-block;}
        header .menu {margin-top: 0; margin-bottom: 8px;}
        header .landingMenu {margin: 0;}
}
@media (max-width: 600px) {
    .service .service-img {float: none; margin-bottom: 20px; width: 100%; text-align: left;}
    .service .service-txt {margin-left: 0;}
    .address, .social {text-align: center;}
    .service, .service .service-img, .service .service-txt  {text-align: center;}
}
@media (max-width: 432px) {
    body {font-size: 84%; padding-top: 146px;}
    .form-txt > span:first-child {margin-right: 0;}
    button.btn {display: block; float: none; margin: 10px auto 0;}
    .map > ymaps {height: 300px !important;}
}
@media (max-width: 380px) {
    header .menu > li:last-child {margin-left: 0; margin-top: 15px; width: 100%;}
    .flex-direction-nav, .carousel-control {display: none;}
    .services, .address {padding-left: 20px; padding-right: 20px;}
    .service .service-img {text-align: center;}
    .green-block.green-block-pad {margin-bottom: 20px;}
    .service .service-txt {text-align: center;}
    .list {text-align: left;}
    nobr {white-space: normal;}
}