html {background: #070b0b;}
body {font-size: 14px; font-family: 'Helvetica', sans-serif; background: #070b0b; color: #fff; overflow-x: hidden; min-height: 100%; min-width: 1320px;
  -webkit-transition:all 1s ease;-o-transition:all 1s ease;-moz-transition:all 1s ease;-ms-transition:all 1s ease;
}


.clear {clear: both;width: 0px;height: 0px;overflow: hidden;font-size: 0px;line-height: 0px;}

a {-webkit-transition:all 0.2s ease;-o-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease;
    text-decoration: none; color: #fff;
    -webkit-appearance: none;
}
a:hover {color: #86cee3;}

b, strong {font-weight: 700;}

body img {max-width: 100%;}


input, textarea, select {font-family: 'Helvetica', sans-serif; -webkit-appearance: none; -webkit-appearance: none; border-radius: 0;
  -webkit-transition:all 0.2s ease;-o-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease;
}

.btn {color: #fff; position: relative; text-align: center; display: inline-block; font-family: 'Helvetica', sans-serif; font-weight: bold; text-transform: uppercase; letter-spacing: 1px;
  -webkit-appearance: none; border: none; background: transparent; font-size: 12px; padding: 12px 20px; height: auto; border-radius: 0px; cursor: pointer; text-align: center;
  -webkit-transition:all 0.2s ease;-o-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease; border: none; background: transparent; border: 2px solid #86cee3;
}
.btn:hover {text-decoration: none; background: #86cee3; color: #000;}

.pull-left {float: left;}
.pull-right {float: right;}

.desktop {display: block;}
.mobile {display: none!important;}

.cont {margin: 0 auto; position: relative; max-width: 1300px; padding: 0 10px;}


header {padding: 31px 0 31px 0;}
header .logo {float: left; width: 168px; height: 32px; background: url(../images/logo.png) no-repeat; background-size: contain; margin: 6px 0 0 0;}
header .contacts {float: right;}
header .contacts .phone {float: left; font-size: 16px; line-height: 25px; margin: 6px 59px 0 0; letter-spacing: 1.4px;}
header .contacts .btn {float: left;}
header .phone.mobile {font-size: 16px; line-height: 25px; margin: 16px 0px 0 0; letter-spacing: 1.4px; text-align: center;}

.slider {}
.slider-item {padding: 126px 0 210px 0; background: url(../images/slide.jpg) no-repeat; background-size: contain;}
.slider h1 {font-size: 50px; line-height: 60px; font-weight: 100; text-transform: uppercase; letter-spacing: 5px; width: 560px; margin: 0 0 42px 0;}
.slider .short {font-size: 16px; line-height: 25px; width: 660px; margin: 0 0 157px 0;}
.slider .btn {padding: 16px 28px; font-size: 17px;}

.block-schema {margin: 0 0 53px 0;}
.block-schema img {display: block;}

.algoritm {margin: 0 0 73px 0;}
.algoritm .title {font-size: 35px; font-weight: 100; text-transform: uppercase; letter-spacing: 3px; margin: 0 0 20px 0;}
.algoritm .short {font-size: 14px; line-height: 25px; margin: 0 0 39px 0;}
.algoritm .list {margin: 0 0 11px 0;}
.algoritm .list .item {float: left; width: 25%;}
.algoritm .list .item .img {width: 71px; position: relative; margin: 0 0 26px 0;}
.algoritm .list .item .img:before {content: ""; position: absolute; width: 261px; height: 2px; background: #183140; left: 99%; top: 35px;}
.algoritm .list .item .img img {display: block;}
.algoritm .list .item .name {font-size: 16px; line-height: 25px; font-weight: bold; margin: 0 0 1px 0;}
.algoritm .list .item .short {font-size: 14px; line-height: 25px; width: 90%;}
.algoritm .btn {padding: 16px 28px; font-size: 17px;}

.about {margin: 0 0 120px 0;}
.about .po {float: left; width: 50%;}
.about .po .title {font-size: 35px; line-height: 50px; font-weight: 100; text-transform: uppercase; letter-spacing: 3px; margin: 0 0 14px 0;}
.about .po .short {font-size: 14px; line-height: 25px;}
.about .po img {display: block;}
.about .clients {float: right; width: 48.5%;}
.about .clients .title {font-size: 35px; line-height: 50px; font-weight: 100; text-transform: uppercase; letter-spacing: 3px; width: 70%; margin-bottom: 50px;}
.about .clients img {display: block;}

footer {background: #000000; padding: 60px 0 0 0;}
footer .top {border-bottom: 1px solid #183140; padding: 0 0 67px 0;}
footer .top .short {float: left; font-size: 14px; line-height: 25px; margin: 0 63px 0 0;}
footer .top .short b {display: block;}
footer .top .short span {display: block;}
footer .top .btn {float: left; padding: 16px 28px; font-size: 17px;}
footer .top .contacts {float: right; margin: 0 209px 0 0;}
footer .top .contacts .line {font-size: 14px; line-height: 25px;}
footer .top .contacts .line span {float: left; width: 119px;}
footer .top .contacts .line .phone {float: right; font-weight: bold;}
footer .top .contacts .line .email {float: right; color: #989ca2;}
footer .top .contacts .line .email:hover {color: #86cee3;}
footer .copy {text-align: center; font-size: 12px; padding: 40px 0 46px 0;}

.popup-hidden {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background: #000; opacity: 0.7; display: none;}
.popup-callback {position: fixed; margin: auto; top: 0; left: 0; right: 0; height: 100%; width: 570px; z-index: 101; background: #183140; display: none;}
.popup-callback .close {position: absolute; color: #86cee3; transform: rotate(-45deg); right: 37px; top: 21px; font-size: 50px; font-weight: 100; cursor: pointer;}
.popup-callback .popup-cont {text-align: center; position: absolute; margin: auto; top: 0; left: 0; right: 0; bottom: 0; height: 440px;}
.popup-callback .title {font-size: 50px; line-height: 60px; letter-spacing: 3px; font-weight: 100; text-transform: uppercase; margin: 0 0 33px 0;}
.popup-callback .short {font-size: 18px; line-height: 25px; margin: 0 0 37px 0;}
.popup-callback .form-item {margin: 0 80px 15px 80px;}
.popup-callback .form-item input[type="text"] {padding: 0; border: 1px solid #ffffff; width: calc(100% - 2px); background: transparent; color: #fff; text-align: center; height: 52px; font-size: 17px;}
.popup-callback .form-item input[type="text"].error {border-color: red;}
.popup-callback .btn {display: block; padding: 16px 0; font-size: 17px; text-align: center; margin: 0 80px; margin-bottom: 30px;}
.popup-callback .politic {font-size: 12px; line-height: 18px; margin: 0 80px;}


@media screen and (max-width: 1320px) {
  body {min-width: 100%;}
  .cont {max-width: 100%;}

  .desktop {display: none!important;}
  .mobile {display: block!important;}

  .btn {padding: 10px 11px; font-size: 10px;}

  header .logo {width: 138px; height: 27px;}
  header .contacts .btn {}

  .slider-item {padding: 76px 0 40px 0; text-align: center;}
  .slider h1 {width: 100%; font-size: 30px; line-height: 40px; letter-spacing: 0px;}
  .slider .short {width: 100%; margin-bottom: 37px;}

  .algoritm {text-align: center;}
  .algoritm .list .item {width: 100%;}
  .algoritm .list .item .img {margin: 0 auto 26px auto;}
  .algoritm .list .item .img:before {display: none;}
  .algoritm .list .item .short {width: 100%;}

  .algoritm .title {font-size: 25px; letter-spacing: 0px;}
  .about {text-align: center; margin-bottom: 20px;}
  .about .po {margin-bottom: 20px;}
  .about .po .title {font-size: 25px; letter-spacing: 0px; line-height: 35px;}
  .about .clients .title {font-size: 25px; letter-spacing: 0px; width: 100%;}

  .about .po {width: 100%;}
  .about .clients {width: 100%;}

  footer {text-align: center;}
  footer .top {padding-bottom: 30px;}
  footer .top .short {width: 100%; margin-right: 0; margin-bottom: 20px;}
  footer .top .btn {float: none; margin: 0 auto;}
  footer .top .contacts {width: 100%; margin: 20px 0px 0 0;}
  footer .top .contacts .line span {width: 100%;}
  footer .top .contacts .line .phone {width: 100%;}
  footer .top .contacts .line .email {width: 100%;}

  .popup-callback {width: 100%;}
  .popup-callback .popup-cont {height: 430px;}
  .popup-callback .title {font-size: 30px; line-height: 40px; margin: 0 0 13px 0;}
  .popup-callback .short {font-size: 16px; line-height: 22px; margin: 0 40px 30px 40px;}
  .popup-callback .form-item {margin: 0 30px 15px 30px;}
  .popup-callback .btn {margin: 0 30px;}
  .popup-callback .politic {margin: 0 30px;}
}