/* line 1, ../sass/styles.sass */
* {
  margin: 0; }

/* line 4, ../sass/styles.sass */
body {
  /*width: 1500px */
  margin: 0 auto;
  font-family: "Open-Sans", "Myriad Pro", serif; }

/* line 9, ../sass/styles.sass */
section {
  min-height: 100%;
  box-sizing: border-box;
  display: block;
  position: relative;
  width: 100%; }

/* line 16, ../sass/styles.sass */
button, .about-content > article > .our-works {
  text-transform: uppercase; }

/* line 19, ../sass/styles.sass */
.screen {
  padding-top: 100px; }

/* line 22, ../sass/styles.sass */
.hide {
  display: none; }

/* line 25, ../sass/styles.sass */
.clear {
  clear: both;
  margin: 0;
  padding: 0; }

/* line 30, ../sass/styles.sass */
.clfix::after {
  content: "";
  clear: both;
  margin: 0;
  padding: 0; }

/* line 36, ../sass/styles.sass */
.center-block {
  margin: 0 auto;
  display: table; }

/* line 40, ../sass/styles.sass */
.left {
  float: left; }

/* line 43, ../sass/styles.sass */
.right {
  float: right; }

/* line 46, ../sass/styles.sass */
.red {
  color: #db0000; }

/* line 49, ../sass/styles.sass */
.header {
  position: fixed;
  z-index: 1000;
  background-color: #111111;
  min-height: 100px;
  width: 100%;
  padding-top: 3.66667%;
  padding-left: 12%;
  padding-right: 12%;
  box-sizing: border-box;
  font-family: "Lato", "Myriad Pro", serif;
  color: white; }
  /* line 62, ../sass/styles.sass */
  .header .title {
    float: left;
    font-size: 24px; }
    /* line 65, ../sass/styles.sass */
    .header .title .logo {
      margin-top: -30px; }
  /* line 68, ../sass/styles.sass */
  .header .menu {
    float: right;
    width: 51%; }
    /* line 71, ../sass/styles.sass */
    .header .menu a {
      text-decoration: none;
      text-transform: uppercase;
      color: white;
      font-size: 16px;
      border-bottom: 3px solid #111111;
      padding-bottom: 21px;
      margin-left: 1.8%;
      transition: border-color 0.3s linear; }
      /* line 80, ../sass/styles.sass */
      .header .menu a.red {
        color: #dd3333; }
      /* line 82, ../sass/styles.sass */
      .header .menu a:hover {
        border-color: #414141;
        cursor: pointer;
        /* border-color: #fcac45 animation for color change */ }

/* line 86, ../sass/styles.sass */
.welcome {
  background-color: #111111;
  background: url("../img/start-bkg.png") no-repeat center;
  background-size: cover;
  color: #c3c3c3;
  text-align: center;
  font-size: 22px;
  padding: 0 20%;
  position: relative;
  overflow: hidden; }
  /* line 96, ../sass/styles.sass */
  .welcome__wrap {
    width: 55%;
    height: 100%;
    position: absolute;
    z-index: 1;
    top: 50px;
    left: 49%;
    background-repeat: no-repeat;
    background-size: cover;
    /*background-position: center */
    overflow: hidden; }
    /* line 107, ../sass/styles.sass */
    .welcome__wrap-img {
      transform: rotate(-10deg);
      background-image: url("../img/start-bkg-2.jpg");
      background-repeat: no-repeat;
      background-size: cover;
      height: 100%;
      width: 120%;
      position: relative;
      left: -15%; }
    /* line 116, ../sass/styles.sass */
    .welcome__wrap:first-child {
      left: 0;
      background-image: url("../img/start-bkg.png"); }
    /* line 119, ../sass/styles.sass */
    .welcome__wrap:nth-child(2) {
      border-left: 10px solid white;
      transform: rotate(10deg);
      height: 120%; }
  /* line 124, ../sass/styles.sass */
  .welcome__bkg {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.5); }
  /* line 133, ../sass/styles.sass */
  .welcome > header, .welcome > article {
    position: relative;
    z-index: 3;
    /*background: rgba(0,0,0,0.5) */ }
  /* line 138, ../sass/styles.sass */
  .welcome > header {
    color: #999999;
    font-size: 40px;
    padding-bottom: 20px;
    text-transform: uppercase;
    padding-top: 33%; }
    /* line 144, ../sass/styles.sass */
    .welcome > header span {
      color: #fcac45; }
  /* line 146, ../sass/styles.sass */
  .welcome > article {
    padding-bottom: 3%; }
    /* line 148, ../sass/styles.sass */
    .welcome > article b {
      color: white; }

/* line 151, ../sass/styles.sass */
.next-btn {
  margin: auto;
  margin-top: 20%;
  margin-bottom: 5%;
  width: 46px;
  height: 46px;
  border-radius: 25px;
  border: 2px solid white;
  display: flex;
  align-items: center; }
  /* line 161, ../sass/styles.sass */
  .next-btn img {
    margin: auto; }
  /* line 163, ../sass/styles.sass */
  .next-btn:hover {
    border-color: #fcac45;
    cursor: pointer; }

/* line 167, ../sass/styles.sass */
.about {
  width: 100%;
  padding: 100px 11% 0;
  background-color: white; }

/* line 172, ../sass/styles.sass */
.mac {
  /*float: left */
  background-image: url("../img/about-mac.png");
  background-repeat: no-repeat;
  width: 100%;
  min-height: 100%;
  display: inline-flex; }

/* line 180, ../sass/styles.sass */
.mac-screen {
  margin-top: 72px;
  margin-right: 4%;
  float: left;
  max-width: 50%;
  max-height: 334px; }

/* line 188, ../sass/styles.sass */
.about-content > header {
  margin-bottom: 19px;
  text-transform: uppercase; }
  /* line 191, ../sass/styles.sass */
  .about-content > header p {
    font-size: 20px;
    color: #636363;
    margin-bottom: 19px; }
  /* line 196, ../sass/styles.sass */
  .about-content > header span {
    font-size: 34px;
    color: #222222;
    /*border-bottom: 3px solid #fcac45 */ }
/* line 201, ../sass/styles.sass */
.about-content > article p {
  color: #6c6c6c;
  font-size: 18px;
  margin-bottom: 30px; }
  /* line 205, ../sass/styles.sass */
  .about-content > article p span {
    text-transform: uppercase; }
/* line 208, ../sass/styles.sass */
.about-content > article ul {
  list-style-type: none;
  list-style-image: url("../img/about-article-song.png");
  color: #5a5a5a;
  font-style: italic;
  -webkit-padding-start: inherit;
  list-style-position: inside; }
/* line 217, ../sass/styles.sass */
.about-content > article > ul li {
  margin-top: 20px; }
/* line 219, ../sass/styles.sass */
.about-content > article > ul b {
  font-style: normal; }
/* line 221, ../sass/styles.sass */
.about-content > article > .our-works {
  /* margin-top: 53px; */
  margin: 10px 0;
  width: 190px;
  min-height: 45px;
  border: 1px solid #7f7f7f;
  background-color: white;
  border-radius: 3px;
  font: inherit;
  font-size: 16px;
  color: #616161;
  /* button user agent stylesheet */
  text-decoration: none;
  text-rendering: auto;
  letter-spacing: normal;
  word-spacing: normal;
  display: inline-block;
  align-items: flex-start;
  text-align: center;
  padding: 3px 6px;
  box-sizing: border-box; 
  margin-right: 20px;
  line-height: 20px;}
  /* line 242, ../sass/styles.sass */
  .about-content > article > .our-works:hover {
    border-color: #fcac45;
    cursor: pointer; }

/*.about-content>header span:hover
 *    border-color: #fcac45
 *    color: #fcac45
 *} */
/*  orange strip */
/* line 253, ../sass/styles.sass */
.team {
  color: white;
  background-color: #070707;
  padding: 0 12.5% 84px; }

/* line 258, ../sass/styles.sass */
.section-header {
  padding-top: 100px;
  text-align: center;
  font-size: 42px; }
  /* line 262, ../sass/styles.sass */
  .section-header > span {
    padding-bottom: 28px;
    text-transform: uppercase; }
  /* line 265, ../sass/styles.sass */
  .section-header p, .section-header a {
    text-align: center;
    color: #6c6c6c;
    font-size: 20px;
    /*font-style: italic */
    margin-bottom: 20px;
    margin-top: 40px;
    width: 80%;
    margin-left: auto;
    margin-right: auto; }
    /* line 275, ../sass/styles.sass */
    .section-header p > span, .section-header a > span {
      text-transform: uppercase; }

/* line 280, ../sass/styles.sass */
.team-articles {
  margin-top: 90px; }

/* line 283, ../sass/styles.sass */
.team-article {
  width: 247px;
  text-align: center;
  float: left;
  margin-left: 44px; }
  /* line 288, ../sass/styles.sass */
  .team-article:first-child {
    margin: 0; }

/* line 291, ../sass/styles.sass */
.team-photo {
  min-height: 127px;
  width: 127px;
  margin: 0 auto;
  background-color: #eeeef0;
  background-image: url("img/team-1.png");
  border-radius: 63px; }

/* line 299, ../sass/styles.sass */
.team-name {
  margin-top: 23px;
  font-weight: bold;
  font-size: 20px; }

/* line 304, ../sass/styles.sass */
.team-job {
  font-size: 16px; }

/* line 307, ../sass/styles.sass */
.team-desc {
  margin-top: 35px;
  font-size: 14px; }

/* line 311, ../sass/styles.sass */
.slider {
  margin-top: 74px; }

/* line 314, ../sass/styles.sass */
.slide {
  width: 9px;
  min-height: 9px;
  background-color: white;
  margin-right: 13px;
  float: left; }
  /* line 320, ../sass/styles.sass */
  .slide:hover {
    background-color: #fcac45;
    cursor: pointer; }
.slide_hide{
  opacity:0;
}
/* line 324, ../sass/styles.sass */
.services {
  color: #222222;
  background-color: white;
  padding: 0 12.5% 84px; }

/* line 329, ../sass/styles.sass */
.services-list {
  display: table; }

/* line 332, ../sass/styles.sass */
.service-article {
  width: 22%;
  min-height: 250px;
  text-align: center;
  float: left;
  margin-left: 4%;
  position: relative; }
  /* line 339, ../sass/styles.sass */
  .service-article.left:hover .service-photo {
    left: -100%;
    border-radius: 70px 5px 70px 30px; }
  /* line 343, ../sass/styles.sass */
  .service-article:hover > p {
    display: none; }
  /* line 345, ../sass/styles.sass */
  .service-article:hover .service-photo {
    z-index: 100;
    position: absolute;
    width: 200%;
    height: 300px;
    margin: 0;
    border-radius: 5px 70px 30px 70px;
    -webkit-box-shadow: 10px 10px 30px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 10px 10px 30px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 10px 10px 30px 0px rgba(0, 0, 0, 0.3); }
    /* line 355, ../sass/styles.sass */
    .service-article:hover .service-photo img {
      margin-top: 0;
      margin-left: 14%; }
    /* line 358, ../sass/styles.sass */
    .service-article:hover .service-photo p, .service-article:hover .service-photo .list {
      opacity: 1;
      position: initial;
      float: left;
      transition-duration: 0.3s; }
    /* line 363, ../sass/styles.sass */
    .service-article:hover .service-photo p {
      transition-delay: 0.3s; }
    /* line 365, ../sass/styles.sass */
    .service-article:hover .service-photo .list {
      transition-delay: 0.8s; }
  /* line 367, ../sass/styles.sass */
  .service-article:first-child {
    margin: 0; }

/* line 370, ../sass/styles.sass */
.service-photo {
  background: white;
  height: 113px;
  width: 113px;
  left: 0;
  /*display: inline-flex/* */
  /*align-items: center */
  margin: 0 59px;
  border: 5px solid #fcac45;
  border-radius: 60px;
  padding: 11%;
  box-sizing: border-box;
  transition-property: border-radius, width, min-height, margin, z-index, left;
  transition-duration: 0.3s;
  transition-timing-function: ease-out;
  transition-delay: 0.1s; }
  /* line 386, ../sass/styles.sass */
  .service-photo p, .service-photo .list {
    z-index: -1;
    opacity: 0;
    transition-property: opacity, z-index;
    transition-timing-function: ease-out;
    position: absolute; }
  /* line 392, ../sass/styles.sass */
  .service-photo p {
    margin-left: 50px; }
  /* line 394, ../sass/styles.sass */
  .service-photo .list {
    margin-top: 20px;
    text-align: left; }
  /* line 397, ../sass/styles.sass */
  .service-photo img {
    float: left;
    transition-duration: 0.3s;
    transition-delay: 0.2s;
    /*margin: 30% auto 0 */ }

/* line 407, ../sass/styles.sass */
.service-name {
  margin-top: 29px;
  font-size: 25px; }

/* line 411, ../sass/styles.sass */
.service-desc {
  margin-top: 20px;
  font-size: 14px; }

/* line 415, ../sass/styles.sass */
.clients {
  color: white;
  background-color: #070707;
  padding: 0 0 100px; }

/* line 420, ../sass/styles.sass */
.client-list {
  margin: 30px 10%;
  display: inline-flex;
  align-items: center;
  width: 80%;
  justify-content: center; }
  /* line 426, ../sass/styles.sass */
  .client-list img {
    position: relative;
    float: left;
    margin-right: 50px;
    width: 150px;
    max-height: 150px; }
    /* line 432, ../sass/styles.sass */
    .client-list img:last-child {
      margin-right: 0; }

/* line 436, ../sass/styles.sass */
.horizontal-slidermix {
  position: relative;
  height: 190px;
  overflow: hidden; }

/* line 442, ../sass/styles.sass */
.works {
  color: #222222;
  background-color: white;
  padding: 0 11.85% 100px; }
  /* line 446, ../sass/styles.sass */
  .works-wrapper {
    min-height: 504px;
    padding-top: 80px; }

/* line 450, ../sass/styles.sass */
.filter {
  font-size: 18px; }

/* line 453, ../sass/styles.sass */
.filter-menu {
  color: #6c6c6c;
  margin-bottom: 50px; }
  /* line 456, ../sass/styles.sass */
  .filter-menu span {
    border-left: 1px solid #6c6c6c;
    padding-left: 15px;
    margin-right: 15px; }
    /* line 460, ../sass/styles.sass */
    .filter-menu span:first-child {
      border: none;
      padding: 0; }
    /* line 463, ../sass/styles.sass */
    .filter-menu span:last-child {
      margin: 0; }
    /* line 465, ../sass/styles.sass */
    .filter-menu span:hover {
      text-decoration: underline;
      color: #222222;
      cursor: pointer; }

/* line 470, ../sass/styles.sass */
.work-item {
  width: 30%;
  min-height: 237px;
  background-color: #222222;
  float: left;
  margin-bottom: 30px;
  margin-right: 5%;
  position: relative;
  color: #b2b2b2;
  font-size: 14px;
  text-align: center;
  transition-property: transform, box-shadow;
  transition-duration: 0.2s;
  transition-timing-function: ease-in;
  overflow: hidden;
  -webkit-box-shadow: 5px 5px 30px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 5px 5px 30px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 5px 5px 30px 0px rgba(0, 0, 0, 0.3); }
  /* line 488, ../sass/styles.sass */
  .work-item > img {
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0; }
  /* line 493, ../sass/styles.sass */
  .work-item--bkg {
    background: #222222;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
    transition-property: opacity, z-index;
    transition-duration: 0.2s;
    transition-timing-function: ease-in;
    width: 100%;
    height: 100%; }
    /* line 505, ../sass/styles.sass */
    .work-item--bkg p:first-child {
      margin-top: 66px;
      margin-bottom: 13px;
      font-size: 20px;
      color: white; }
    /* line 510, ../sass/styles.sass */
    .work-item--bkg a > img {
      margin-top: 30px; }
  /* line 512, ../sass/styles.sass */
  .work-item:hover {
    -webkit-box-shadow: 10px 10px 30px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 10px 10px 30px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 10px 10px 30px 0px rgba(0, 0, 0, 0.5);
    transform: scale(1.03); }
  /* line 517, ../sass/styles.sass */
  .work-item:hover .work-item--bkg {
    z-index: 0;
    opacity: 1; }
  /* line 520, ../sass/styles.sass */
  .work-item:nth-child(3n) {
    margin-right: 0; }

/* line 523, ../sass/styles.sass */
.testimonials {
  color: white;
  background-color: #0b0b0b;
  text-align: center;
  padding: 0 18.5% 100px; }

/* line 529, ../sass/styles.sass */
.testimonials-list {
  margin-top: 100px; }
  /* line 531, ../sass/styles.sass */
  .testimonials-list p {
    margin-bottom: 40px;
    color: #e7e7e7;
    font-size: 18px; }
  /* line 536, ../sass/styles.sass */
  .testimonials-list span {
    font-size: 18px;
    color: #b2b2b2; }

/* line 540, ../sass/styles.sass */
.contacts {
  color: #222222;
  background-color: white;
  padding: 0 24% 100px; }

/* line 545, ../sass/styles.sass */
.contacts-form {
  padding-top: 100px;
  color: #636363;
  font-size: 14px; }
  /* line 549, ../sass/styles.sass */
  .contacts-form textarea {
    outline-color: #fcac45; }

/* line 552, ../sass/styles.sass */
.label-input {
  width: 48%; }
  /* line 554, ../sass/styles.sass */
  .label-input.last {
    margin-left: 4%; }
  /* line 556, ../sass/styles.sass */
  .label-input input {
    margin-top: 10px;
    margin-bottom: 30px;
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box;
    outline-color: #fcac45;
    width: 100%;
    min-height: 40px; }
    /* line 565, ../sass/styles.sass */
    .label-input input:invalid {
      outline-color: red; }

/* line 568, ../sass/styles.sass */
.msg {
  min-height: 163px;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  resize: vertical; }

/* line 575, ../sass/styles.sass */
.send {
  min-height: 40px;
  width: 163px;
  margin-top: 20px;
  background-color: #fcac45;
  color: white;
  font-size: 16px;
  font-family: inherit;
  outline: none;
  border: none;
  text-transform: uppercase; }
  /* line 586, ../sass/styles.sass */
  .send:hover {
    cursor: pointer;
    background-color: #ec9c35; }

/* line 590, ../sass/styles.sass */
.footer {
  min-height: 110px;
  box-sizing: border-box;
  padding: 30px 12%;
  color: #b2b2b2;
  font-size: 12px;
  background-color: #222222; }
  /* line 597, ../sass/styles.sass */
  .footer a {
    color: inherit;
    text-decoration: none; }
    /* line 600, ../sass/styles.sass */
    .footer a:hover {
      text-decoration: underline; }
  /* line 602, ../sass/styles.sass */
  .footer .rights {
    min-height: 30px; }
    /* line 604, ../sass/styles.sass */
    .footer .rights p {
      margin-bottom: 10px; }

/* line 608, ../sass/styles.sass */
.adresses ul {
  list-style: none;
  float: left;
  text-align: right;
  margin-right: 30px; }
