/**
*
  Сброс CSS стилей
*
**/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

html {
  -webkit-text-size-adjust: none;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

body {

  &.__hidden {
    overflow: hidden;
  }

}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  text-decoration: none;
}

input,
textarea,
button,
select {
  resize: none;
  border: none;
  background-color: transparent;
  outline: none;
  padding: 0;
}

img {
  border: 0;
  vertical-align: top;
}

html, body {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.lines-parent{
	display:none!important
}

/**
*
  Flex
*
**/
.flex_w {
  display: flex;
  flex-wrap: wrap;

  &.__ai_fs {
    align-items: flex-start;
  }

  &.__ai_fe {
    align-items: flex-end;
  }

  &.__ai_c {
    align-items: center;
  }

  &.__jc_sa {
    justify-content: space-around;
  }

  &.__jc_sb {
    justify-content: space-between;
  }

  &.__jc_c {
    justify-content: center;
  }

}


/**
*
  Функции
*
**/
.radius(@radius: 5px) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  -ms-border-radius: @radius;
  -o-border-radius: @radius;
  border-radius: @radius;
}

.transition(@properties: all .6s) {
  -webkit-transition: @properties;
  -moz-transition: @properties;
  -ms-transition: @properties;
  -o-transition: @properties;
  transition: @properties;
}

.text-shadow (@string: 0 1px 3px rgba(0, 0, 0, 0.25)) {
  text-shadow: @string;
}

.box-shadow (@string) {
  -webkit-box-shadow: @string;
  -moz-box-shadow: @string;
  box-shadow: @string;
}

.box-shadow2 (@string, @string) {
  -webkit-box-shadow: @string, @string;
  -moz-box-shadow: @string, @string;
  box-shadow: @string, @string;
}

.drop-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25) {
  -webkit-box-shadow: @x @y @blur @spread rgba(0, 0, 0, @alpha);
  -moz-box-shadow: @x @y @blur @spread rgba(0, 0, 0, @alpha);
  box-shadow: @x @y @blur @spread rgba(0, 0, 0, @alpha);
}

.inner-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25) {
  -webkit-box-shadow: inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
  -moz-box-shadow: inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
  box-shadow: inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
}

.box-sizing (@type: border-box) {
  -webkit-box-sizing: @type;
  -moz-box-sizing: @type;
  box-sizing: @type;
}

.border-radius (@radius: 5px) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  border-radius: @radius;

  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}

.opacity (@opacity: 0.5) {
  -webkit-opacity: @opacity;
  -moz-opacity: @opacity;
  opacity: @opacity;
}

.gradient (@startColor: #eee, @endColor: white) {
  background-color: @startColor;
  background: -webkit-gradient(linear, left top, left bottom, from(@startColor), to(@endColor));
  background: -webkit-linear-gradient(top, @startColor, @endColor);
  background: -moz-linear-gradient(top, @startColor, @endColor);
  background: -ms-linear-gradient(top, @startColor, @endColor);
  background: -o-linear-gradient(top, @startColor, @endColor);
}

.horizontal-gradient (@startColor, @endColor) {
  background-color: @startColor;
  background-image: -webkit-gradient(linear, left top, right top, from(@startColor), to(@endColor));
  background-image: -webkit-linear-gradient(left, @startColor, @endColor);
  background-image: -moz-linear-gradient(left, @startColor, @endColor);
  background-image: -ms-linear-gradient(left, @startColor, @endColor);
  background-image: -o-linear-gradient(left, @startColor, @endColor);
}

.vertical-gradient (@startColor, @endColor) {
  background-color: @endColor;
  background-image: -webkit-gradient(linear, top, bottom, from(@startColor), to(@endColor));
  background-image: -webkit-linear-gradient(bottom, @startColor, @endColor);
  background-image: -moz-linear-gradient(bottom, @startColor, @endColor);
  background-image: -ms-linear-gradient(bottom, @startColor, @endColor);
  background-image: -o-linear-gradient(bottom, @startColor, @endColor);
}

.animation (@name, @duration: 300ms, @delay: 0, @ease: ease) {
  -webkit-animation: @name @duration @delay @ease;
  -moz-animation: @name @duration @delay @ease;
  -ms-animation: @name @duration @delay @ease;
}

.transition (@transition) {
  -webkit-transition: @transition;
  -moz-transition: @transition;
  -ms-transition: @transition;
  -o-transition: @transition;
}

.transform(@string) {
  -webkit-transform: @string;
  -moz-transform: @string;
  -ms-transform: @string;
  -o-transform: @string;
  transform: @string;
}

.scale (@factor) {
  -webkit-transform: scale(@factor);
  -moz-transform: scale(@factor);
  -ms-transform: scale(@factor);
  -o-transform: scale(@factor);
  transform: scale(@factor);
}

.rotate (@deg) {
  -webkit-transform: rotate(@deg);
  -moz-transform: rotate(@deg);
  -ms-transform: rotate(@deg);
  -o-transform: rotate(@deg);
  transform: rotate(@deg);
}

.skew (@deg, @deg2) {
  -webkit-transform: skew(@deg, @deg2);
  -moz-transform: skew(@deg, @deg2);
  -ms-transform: skew(@deg, @deg2);
  -o-transform: skew(@deg, @deg2);
  transform: skew(@deg, @deg2);
}

.translate (@x, @y:0) {
  -webkit-transform: translate(@x, @y);
  -moz-transform: translate(@x, @y);
  -ms-transform: translate(@x, @y);
  -o-transform: translate(@x, @y);
  transform: translate(@x, @y);
}

.translate3d (@x, @y: 0, @z: 0) {
  -webkit-transform: translate3d(@x, @y, @z);
  -moz-transform: translate3d(@x, @y, @z);
  -ms-transform: translate3d(@x, @y, @z);
  -o-transform: translate3d(@x, @y, @z);
  transform: translate3d(@x, @y, @z);
}

.perspective (@value: 1000) {
  -webkit-perspective: @value;
  -moz-perspective: @value;
  -ms-perspective: @value;
  perspective: @value;
}

.transform-origin (@x:center, @y:center) {
  -webkit-transform-origin: @x @y;
  -moz-transform-origin: @x @y;
  -ms-transform-origin: @x @y;
  -o-transform-origin: @x @y;
}

.background(@path, @position: center center, @repeat: no-repeat) {
  background: url(@path) @position @repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.text-overflow(@lineClamp, @lineHeight) {
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: @lineClamp;
  overflow: hidden;
  height: @lineClamp * @lineHeight;
}

.placeholder-style(@placeholder-font, @placeholder-color) {

  &::-webkit-input-placeholder {
    font: @placeholder-font;
    color: @placeholder-color;
  }

  &::-moz-placeholder {
    font: @placeholder-font;
    color: @placeholder-color;
  }

  &:-moz-placeholder {
    font: @placeholder-font;
    color: @placeholder-color;
  }

  &:-ms-input-placeholder {
    font: @placeholder-font;
    color: @placeholder-color;
  }

}


/**
*
  Подключение шрифтов
*
**/
@font-face {
  font-family: "Avenir Next Cyr";
  src: url('../fonts/AvenirNextCyr-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Avenir Next Cyr";
  src: url('../fonts/AvenirNextCyr-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Avenir Next Cyr";
  src: url('../fonts/AvenirNextCyr-Demi.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Avenir Next Cyr";
  src: url('../fonts/AvenirNextCyr-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Avenir Next Cyr";
  src: url('../fonts/AvenirNextCyr-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Avenir Next Cyr";
  src: url('../fonts/AvenirNextCyr-Heavy.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Avenir Next Cyr";

}

.wrap {
  width: 1550px;
  margin: 0 auto;
}

.header {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 101;
  padding: 30px 0;

  &-menu {
    a {
      font-style: normal;
      font-weight: 600;
      position: relative;
      .transition();

      &::after {
        position: absolute;
        height: 2px;
        background: rgba(3, 201, 238, 0.8);
        content: " ";
        .transition();
        width: 0%;
        content: " ";
        left: 0;
        top: 30px;
      }

      &:hover, &.active {
        color: rgba(3, 201, 238, 0.8);

        &::after {
          width: 50%;
        }
      }

      margin: 0 20px;
      font-size: 16px;
      line-height: 26px;
      /* identical to box height, or 162% */

      text-align: center;
      text-transform: capitalize;

      color: rgba(21, 21, 21, 0.8);

    }
  }

  .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  &-right {
    display: flex;
    align-items: center;
  }

  &-reg {
    border: 1.6px solid #03C9EE;
    border-radius: 30px;
    width: 202px;
    height: 48px;
    display: flex;
    align-items: center;

    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    /* identical to box height, or 162% */

    text-align: center;
    letter-spacing: 0.02em;

    color: #03C9EE;
    justify-content: center;
  }

  &-login {
    margin-left: 90px;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-weight: 300;
    font-size: 14px;

    svg {
      margin-left: 15px;
    }

    line-height: 26px;
    /* identical to box height, or 186% */

    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: rgba(21, 21, 21, 0.78);

  }

  &-logo {
    width: 200px;
  }
}

.relative {
  position: relative;
}

.d1 {
  z-index: 5;

  &-right {
    position: absolute;
    bottom: 145px;
    left: 226px;
  }

  .wrap {

    position: relative;
    padding-top: 270px;
    padding-bottom: 400px;

  }

  &-bg {
    max-width: 1000000px;
    width: 1920px;
    .xpos_ab;
    bottom: 0;
  }

  &-text {
    margin: 40px 0;
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 20px;
    line-height: 30px;
    position: relative;
    display: flex;
    align-items: center;

    &:before {
      content: "";
      margin-right: 20px;
      border-top: 2px dashed rgba(3, 201, 238, 0.8);
      height: 1px;

      width: 80px;
      display: block;
    }

    /* identical to box height, or 150% */

    letter-spacing: 0.02em;
    text-transform: capitalize;


    span {
      color: #03C9EE;
      font-weight: 450;

    }
  }

  &-btn {
    width: 215.3px;
    box-shadow: 0 0 30px #03C9EE;;
    height: 48px;
    display: flex;
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 450;
    font-size: 16px;
    line-height: 26px;
    /* identical to box height, or 162% */

    text-align: center;
    letter-spacing: 0.02em;

    color: #FFFFFF;
    align-items: center;
    justify-content: center;
    background: #03C9EE;
    border-radius: 40px;
  }

  position: relative;

  &-ttl {
    position: relative;
    width: 1185px;

  }

  &-ttl-label {
    font-weight: 300;
    font-size: 19.1748px;
    line-height: 27px;
    right: 0;
    top: 0;
    /* or 140% */

    position: absolute;

    &::after {
      margin-top: 10px;
      content: "";

      width: 86px;
      border-top: 2px dashed rgba(3, 201, 238, 0.8);
      height: 1px;

      display: block;
    }

    letter-spacing: 0.04em;
    text-transform: uppercase;

    span {
      color: #03C9EE;;
      display: block;
    }

    color: rgba(21, 21, 21, 0.8);

  }
}

.open-modal {
  cursor: pointer;
  .transition();
}

.d1-right {
  max-width: 100000px;
}

.d7-policy{
  padding-top: 170px;
  padding-bottom: 100px;
  & + .footer {
    height: 340px;
    position: relative;
    overflow: hidden;
  }
}
.policy-content {

  strong{

    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    /* identical to box height, or 165% */


    color: #151515;
    display: block;

    margin: 20px 0;
  }
}
.d2 {

  .wrap {
    position: relative;
  }

  &-bg {
    max-width: 100000px;
    .xpos_ab;
    top: -347px;
  }

  position: relative;

  &-center {
    position: absolute;
    top: 80px;
  }

  &-line {
    position: absolute;
    right: -184px;
    bottom: 107px;
  }
}

.d2-before {

}

.d5-slid {
  display: flex;
  align-items: center;
  height: 104px;
}
.d3 {
  &-bg {
    margin-top: 100px;
  }

  &-btn {
    width: 215.3px;
    height: 48px;
    display: flex;
    align-items: center;
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 450;
    font-size: 16px;
    line-height: 26px;
    box-shadow: 0 0 30px rgba(3, 201, 238, 0.31);

    /* identical to box height, or 162% */

    text-align: center;
    letter-spacing: 0.02em;

    color: #FFFFFF;


    justify-content: center;
    background: #03C9EE;
    border-radius: 40px;
  }

  margin-top: -410px;
  padding-top: 410px;

  &-icon {

    border-radius: 100px;
    box-shadow: 0 0 30px #03C9EE;
  }

  .wrap {
    position: relative;
  }

  &-col {
    position: relative;

  }

  &-content {
    margin-left: 60px;
    margin-top: -80px;

    p {
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 300;
      font-size: 18px;

      &::after {
        width: 60px;
        background: rgba(3, 201, 238, 0.8);;
        content: "";
        position: absolute;
        left: 0;
        top: 15px;
        height: 2px;
      }

      line-height: 30px;

      span {
        color: #03C9EE;;
      }

      /* or 167% */
      margin: 40px 0;

      letter-spacing: 0.02em;

      color: #151515;
      position: relative;
      padding-left: 95px;
    }

    h2 {
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 300;
      font-size: 42px;

      b {
        font-weight: 800;
      }

      line-height: 60px;
      /* or 143% */

      letter-spacing: 0.02em;
      text-transform: uppercase;

      color: #151515;

    }
  }

  &-line {
    position: absolute;
    top: 99px;
    left: 50px;
  }

  &-item {
    display: flex;
    align-items: center;

    &:last-child {
      margin-left: 150px;
      margin-top: 80px;
    }

    &-text {
      b {
        font-weight: 800;
        color: #03C9EE;
        white-space: nowrap;
        display: block;
      }

      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 300;
      font-size: 24px;
      line-height: 40px;
      /* or 167% */

      letter-spacing: 0.02em;
      text-transform: uppercase;

      color: #151515;

    }
  }

  &-icon {
    background: #03C9EE;
    border-radius: 100px;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    margin-right: 35px;
    justify-content: center;
    box-shadow: 0 0 30px rgba(3, 201, 238, 0.32);;
  }

  &-ttl {
    position: absolute;


    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 800;
    font-size: 120px;
    line-height: 60px;
    /* or 50% */

    text-transform: uppercase;

    color: #151515;


    opacity: 0.06;
    right: -80px;
    top: -165px;

  }

  &-flex {
    display: flex;
  }

  &-bg {
    .pos_absc;
    max-width: 100000px;
  }

  position: relative;
}

.d2 {
  z-index: 2;
  position: relative;

  &-before {
    position: absolute;
    right: -300px;
    top: 450px;
  }

  &-cel {
    position: absolute;

    &-img {
      position: relative;
      display: flex;
      margin-right: 35px;
      align-items: center;

      &::after {
        content: " ";
        width: 140px;
        margin-left: 15px;
        height: 2px;
        background: rgba(3, 201, 238, 0.8);;
      }
    }

    display: flex;
    align-items: flex-start;
    top: 91px;
    align-items: flex-start;
    left: 463px;

    p {
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-size: 18px;

      b {
        font-weight: 600;

      }

      line-height: 30px;
      /* or 167% */

      letter-spacing: 0.02em;

      color: #FFFFFF;
    }
  }

  &-text {
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 20px;
    line-height: 38px;
    /* or 190% */


    color: #FFFFFF;
    padding-left: 45px;
    margin-left: 10px;
    border-left: 2px solid rgba(3, 201, 238, 0.8);
    margin-top: 30px;
    padding-bottom: 10px;
    padding-top: 50px;
  }

  &-ttl {
    &-shadow {
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 800;
      font-size: 160px;
      line-height: 60px;
      margin-top: 75px;
      position: absolute;
      /* or 37% */

      text-transform: uppercase;

      color: #03C9EE;

      opacity: 0.06;
    }
  }

  .wrap {
    height: 793px;
    padding-top: 120px;
    padding-left: 360px;
    padding-bottom: 252px;
  }

  &-ttl {
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 42px;
    line-height: 60px;
    /* or 143% */

    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: #FFFFFF;

    b {
      display: block;
      font-weight: 800;
      color: #03C9EE;
    }
  }

  &-item {
    &:last-child {
      margin-left: 355px;
      margin-top: -144px;
    }

    &-text {
      label {
        font-family: Avenir Next Cyr;
        font-style: normal;
        font-weight: 300;
        position: absolute;
        top: -30px;
        white-space: nowrap;
        font-size: 20px;
        line-height: 30px;
        /* identical to box height, or 150% */

        letter-spacing: 0.04em;

        color: rgba(255, 255, 255, 0.8);

        span {
          color: #03C9EE;
        }

      }

      position: relative;

      b {
        font-family: Avenir Next Cyr;
        font-style: normal;
        font-weight: 800;
        font-size: 42px;
        line-height: 60px;
        display: block;
        /* identical to box height, or 143% */

        letter-spacing: 0.02em;
        text-transform: uppercase;

        color: #03C9EE;

      }
    }

    &-img {
      margin-right: 70px;
      border: 2px solid #03C9EE;
      box-sizing: border-box;
      width: 59.17px;
      height: 59.17px;
      position: relative;
      border-radius: 100px;

      svg {
        .ypos_ab;
        max-width: 1000px;
        left: 50%;
      }

      box-shadow: 0 0 30px rgba(3, 201, 238, 0.32);
    }

    &-flex {
      margin-top: 75px;
      display: flex;
    }

    display: flex;
    align-items: center;
  }
}

.d2-center {
  position: absolute;
  top: -45px;
  left: -67px;
  z-index: 5;
  height: 500px;
  position: absolute;
  top: 34px;
  left: -10px;
  z-index: 5;

}

.d1-mouse {
  position: absolute;
  left: 99px;
  bottom: -169px;
}

.d4 {
  height: 851px;

  &-flex {
    display: flex;
    align-items: flex-start;
    margin-top: 20px;
  }

  &-right {
    p {
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-size: 20px;

      b {
        font-weight: 600;
      }

      line-height: 33px;
      /* identical to box height, or 165% */

      letter-spacing: 0.04em;

      color: #FFFFFF;
    }
  }

  &-free {
    display: flex;
    align-items: center;
    margin-top: 10px;

    b {
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 600;
      font-size: 20px;
      line-height: 30px;
      /* identical to box height, or 150% */

      letter-spacing: 0.035em;

      color: #03C9EE;

      opacity: 0.8;

    }

    span {

      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 450;
      font-size: 24px;
      line-height: 30px;
      /* identical to box height, or 125% */

      letter-spacing: 0.01em;
      text-transform: uppercase;

      color: #03C9EE;

      opacity: 0.8;
    }

    del {
      font-family: Avenir Next Cyr;
      font-style: normal;
      margin: 0 15px;
      font-weight: 300;
      font-size: 20px;
      line-height: 30px;
      /* identical to box height, or 150% */

      letter-spacing: 0.01em;
      text-decoration: line-through;

      color: #FFFFFF;

      opacity: 0.8;
    }
  }

  &-left {
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: normal;
    margin-right: 85px;
    font-size: 16px;
    line-height: 29px;
    padding-left: 45px;
    border-left: 2px solid rgba(3, 201, 238, 0.8);;
    /* or 179% */


    color: #FFFFFF;
  }

  h2 {
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 42px;
    line-height: 60px;
    /* or 143% */

    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: #FFFFFF;

    b {
      display: block;
      font-weight: 800;
      color: #03C9EE;
    }
  }

  &-ttl {
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 800;
    font-size: 120px;
    line-height: 60px;
    /* identical to box height, or 50% */

    text-transform: uppercase;

    color: #03C9EE;

    opacity: 0.06;
    top: 200px;
    position: absolute;

  }

  .wrap {
    position: relative;
    padding-top: 225px;
  }

  &-line {
    position: absolute;
    top: 60px;
    left: -198px;
  }

  &-play {
    position: absolute;
    top: 311px;
    left: 1431px;
  }

  &-before {
    left: -140px;
    top: 688px;
    position: absolute;
  }

  &-img {
    height: 180px;
    margin-bottom: 20px;

    img {
      .c_img;
      border-radius: 180px;
      box-shadow: 0 0 30px rgba(3, 201, 238, 0.3);;;


    }
  }

  &-item {
    margin-right: 90px;
    width: 180px;

    &-ttl {
      text-align: center;
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 300;
      font-size: 20px;
      line-height: 26px;
      /* or 130% */

      text-align: center;
      letter-spacing: 0.02em;
      text-transform: uppercase;

      color: #FFFFFF;

      b {
        display: block;
        font-weight: 800;
        color: #03C9EE;;
      }
    }

    &s {
      display: flex;
      margin-top: 50px;

    }
  }
}

.d4-bg-parent {
  .xpos_ab;
  width: 1920px;
  max-width: 100%;

  .wrap {
    padding-top: 230px;
    position: relative;
    padding-bottom: 90px;
  }
}

.wrap {
  position: relative;
}
.owl-next{
  border-radius: 100px;
  width: 42.5px;
  height: 42.5px;
  .ypos_ab;
  left:~"calc(100% + 40px)";
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 30px rgba(3, 201, 238, 0.31);  background: #03C9EE!important;

}

.d5 {
  &-flex {
    padding-top: 95px;

  }

  &-slid{
    img{
      width: 180px;
    }
  }

  &-slider {
    width: 1150px !important;

    .owl-prev {
      display: none !important;
    }

    .owl-nav {
      display: flex !important;
    }
  }

  &-right {
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 42px;
    line-height: 60px;
    /* or 143% */

    letter-spacing: 0.02em;
    text-transform: uppercase;

    margin-top: -75px;

    color: #151515;

    b {
      font-weight: 800;
      display: block;
    }
  }

  &-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;

  }

  &-ttl {
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 800;
    font-size: 120px;
    line-height: 60px;
    /* identical to box height, or 50% */

    text-transform: uppercase;
    position: absolute;
    left: 407px;
    top: -40px;
    color: #151515;

    opacity: 0.06;
  }
}

.d5 .wrap{
  z-index: 6;
}
.d4-before{
  z-index: 5;
}
.d7{
  &-text{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 450;
    width: 340px;
    font-size: 18px;
    line-height: 30px;
    /* or 167% */
    position: relative;

    &::after{
      position: absolute;
      width: 60px;
      height: 2px;
      background: rgba(3, 201, 238, 0.8);
      left: -80px;
      top: 15px;
      content: "";
    }
    letter-spacing: 0.02em;


    b{
      color: #03C9EE;
      font-weight: 450;

    }
    &-flex{
      margin-top: 50px;
      display: flex;
      justify-content: flex-end;
    }
  }
  &-faq{

    margin-bottom: 20px;
    &-content{
      display: none;
      padding: 40px;
      h3{
        font-family: Avenir Next Cyr;
        font-style: normal;
        font-weight: 600;
        font-size: 20px;
        line-height: 33px;
        /* identical to box height, or 165% */


        color: #151515;
        margin-bottom: 15px;

      }
      p{
        margin-bottom: 30px;
        &:last-child{
          margin-bottom: 0;
        }
        font-family: Avenir Next Cyr;
        font-style: normal;
        font-weight: 300;
        font-size: 18px;
        line-height: 30px;
        /* or 167% */

        letter-spacing: 0.02em;

        color: #151515;
      }
    }
    &-head{
      background: #151515;
      border-radius: 14px;
      .transition();
      path{
        .transition();
      }
      svg{.transition();}
      padding: 25px 40px;
      &.active{
        box-shadow: 0 0 30px rgba(3, 201, 238, 0.31);;
        background: url("../imgs/faq-head.png");
        svg{
          transform: rotate(180deg);
        }
        .b_img;
        svg{path{
          fill:#03C9EE!important;
        }}
      }
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
      span{font-family: Avenir Next Cyr;
        font-style: normal;
        font-weight: 300;
        font-size: 24px;
        line-height: 40px;
        /* identical to box height, or 167% */

        letter-spacing: 0.02em;
        text-transform: uppercase;

        color: #FFFFFF;
        b{
          font-weight: 800;
          color:  #03C9EE;;
        }
      }
    }
  }
  h2{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 42px;
    line-height: 60px;
    /* or 143% */

    letter-spacing: 0.02em;
    text-transform: uppercase;

    margin-top: -40px;
    margin-bottom: 40px;
    color: #151515;

    b{
      font-weight: 800;display: block;
    }
  }
  .wrap{
    width: 1300px;
  }
  &-ttl{
    font-family: Avenir Next Cyr;
    font-style: normal;
    left: 350px;
    top: -70px;
    font-weight: 800;
    font-size: 120px;
    line-height: 60px;
    /* identical to box height, or 50% */

    text-transform: uppercase;

    color: #151515;

    opacity: 0.06;
    position: absolute;
 white-space: nowrap;
  }

}
.d8-slider{
  .owl-next{
    left: ~"calc(100% + -85px)";

  }
}

.d8-slider .active.active3{
  margin-left: 40px;
  &+div{
    margin-left: -120px;
  }
  .d8-slid{
    background: rgba(3, 201, 238, 0.12);
     p ,.d8-name b,.d8-right span{
       color: white;

     }
  }
}
.d6{
  &-btn{
    border: 1.6px solid #03C9EE;
    border-radius: 30px;
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 450;
    font-size: 16px;
    line-height: 26px;
    /* identical to box height, or 162% */

    text-align: center;
    letter-spacing: 0.02em;
    width: 268px;
    height: 48px;
    margin-left: 100px;
    margin-top: 80px;
    color: #FFFFFF;

    display: flex;
    align-items: center;
    justify-content: center;
  }
  height: 866px;
  &-icon{
    background: #03C9EE;
    border-radius: 100px;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 45px;
    box-shadow: 0 0 30px rgba(3, 201, 238, 0.3);;
  }
  &-content{
    b{
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 800;
      font-size: 16px;
      display: block;
      margin-top: 10px;
      /* identical to box height, or 375% */

      letter-spacing: 0.02em;
      text-transform: uppercase;

      color: #03C9EE;

    }
    p{
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 300;
      font-size: 18px;
      line-height: 30px;
      /* or 167% */


      color: #FFFFFF;
    }
  }
  &-item{
    display: flex;
    align-items: center;
    margin-right: 70px;
  }
  margin-top: -75px;
  &-flex{display: flex;
  align-items: center;
  margin-top: 105px;
  }
  &-ttl{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 800;
    font-size: 120px;
    line-height: 60px;
    /* or 50% */

    text-transform: uppercase;

    color: #03C9EE;
    position: absolute;
    left: 0;
    top: 365px;
    opacity: 0.06;

  }
  h2{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 42px;
    line-height: 60px;
    /* or 143% */

    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: #FFFFFF;
    b{
      display: block;
      color: #03C9EE;;
      font-weight: 800;
    }
  }

  .wrap{
    z-index: 7;
    padding-top: 290px;
  }
  &-before{
    top: 640px;
    position: absolute;
    left: -305px;
  }
  position: relative;
  &-bg{
    .xpos_ab;
  }
}


.d8{
  &-slid{
    background: #FFFFFF;
    border-radius: 40px;
    width: 578px;
    
    p{
      margin-top: 30px;
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: normal;
      font-size: 14px;
      line-height: 30px;
      /* or 214% */

      letter-spacing: 0.02em;

      color: #151515;
    }
    padding: 40px 50px;
  }
  &-right{
    display: flex;
    align-items: center;

    span{
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 450;
      margin-left: 12px;
      font-size: 12px;
      line-height: 40px;
      /* identical to box height, or 333% */

      display: flex;
      align-items: center;
      letter-spacing: 0.02em;
      text-transform: uppercase;

      color: #151515;

      opacity: 0.3;
    }
  }

  &-left{display: flex;
  align-items: center;

  }
  &-img{
    box-shadow: 0 0 30px rgba(3, 201, 238, 0.31);

    background: #03C9EE;
    border-radius: 100px;   width: 55px;
    height: 55px;
    padding: 5px;
    img{
      .c_img;
      border-radius: 100px;
    }
  }
  &-name{
    margin-left: 20px;
    span{
      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 450;
      font-size: 12px;
      /* identical to box height, or 333% */

      display: flex;
      align-items: center;
      letter-spacing: 0.02em;
      text-transform: uppercase;

      color: #03C9EE;
    }
    b{font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 600;
      font-size: 22px;
      /* identical to box height, or 182% */

      letter-spacing: 0.04em;

      color: #151515;}
  }
  &-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  &-slider{
    .owl-prev{
      display: none;
    }
    margin-top: 90px;
    .owl-item{
      opacity: 0;             .transition();
      transform: scale(0.5) !important;

    }
    .active{
      opacity: 1;
      .transition();
      &.active2 {
        transform: scale(1)!important;

      }&.active3 {
        transform: scale(0.7)!important;

      }
    }
  }
  &-line{
    position: absolute;

    top: 80px;
    left: 357px;

  }
  &-ttl{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 800;
    font-size: 120px;
    line-height: 60px;
    /* or 50% */

    text-transform: uppercase;

    color: #03C9EE;

    position: absolute;

    top: 290px;
    opacity: 0.06;
  }
  h2{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 42px;
    /* or 143% */

    letter-spacing: 0.02em;
    text-transform: uppercase;

    b{
      display: block;
      color: #03C9EE;;
      font-weight: 800;
    }
    color: #FFFFFF;

  }
  margin-top: -125px;
  &-bg{
    .xpos_ab; 
  }
  .wrap{
    padding-top: 225px;
  }
  &-after{
    position: absolute;
    left: ~"calc(100% - 100px)";
    top: -50px;
  }

  position: relative;
  top: 0;
  height: 1040px;
}


.fsocs
{
  display: flex;
  align-items: center;
  margin-top: 35px;margin-bottom: 50px;
  justify-content: center;
  a{margin: 0 15px}
}
.fpolici{

  font-family: Avenir Next Cyr;
  font-style: normal;
  font-weight: 300;
  font-size: 16px;
  line-height: 30px;
  /* identical to box height, or 187% */

  letter-spacing: 0.04em;
  text-transform: uppercase;

  color: #FFFFFF;
  position: relative;
  &::after{
    height: 1px;        width: 140px;
.xpos_ab;
    content: "";
    top: ~"calc(100% + 10px)";
    border-bottom: 1px dashed rgba(3, 201, 238, 0.8);
  }
}
.fmenu{
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
  a{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 800;
    .transition();
    &:hover{
      color: white;
    }
    font-size: 16px;
    line-height: 26px;
    /* identical to box height, or 162% */

    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: #03C9EE;
    margin: 0 20px;
  }
}
.header-login{
  .transition();
  &:hover{
    color:#03c9ee
  }
}
.d4-bg{
  margin-left: -1px;
}
.d9-content a{
  .transition();
  &:hover{
    color: #000;
  }
}
.owl-next{

  .transition();
  svg:nth-child(2){
    display: none;
  }
  &:hover{
    svg:nth-child(1){
      display: none;
    }svg:nth-child(2){
       display: block;
     }
  }
}
.d7-faq{
  position: relative;
  z-index: 13;
}
.lines-parent{
  height: 100%;
  display: flex;
  justify-content: center;
  div{
    &:first-child{
      transform: translateX(-360px);
    }&:nth-child(2){
      transform: translateX(360px);
    }
    &:nth-child(3){
      transform: translateX(-720px);
    }
    &:nth-child(4){
      transform: translateX(720px);
    }
    &:nth-child(2){
      transform: translateX(360px);
    }
    width: 1px;
    height: 100%;
    position: fixed;
    top: 0;
    margin: 0 160px;
    z-index: 10;
    background: rgba(3, 201, 238, 0.1);
  }
}
.dark{
  position: fixed;
  z-index: 10000;

  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(8px);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.modal{

  &-close{
    position: absolute;
    right: -20px;
    top: -20px;
    cursor: pointer;
  }
  p{
    font-family: Avenir Next Cyr;
    font-style: normal;
    margin-bottom: 35px;
    font-size: 16px;
    b{
      font-weight: 600;

    }
    line-height: 26px;
    /* or 162% */

    text-align: center;

    color: #151515;

  }
  h2{

    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 32px;
    line-height: 50px;
    /* or 156% */

    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: #151515;
b{
  font-weight: 800;
}
  }
  .pos_absc;
  position: fixed;
  z-index: 10001;  width: 478px;
&-body{
  background: #FFFFFF;
  mix-blend-mode: normal;
  border-radius: 40px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

}
.open-modal1,.open-modal2{  cursor: pointer;
}
.modal-btn{
  background: #03C9EE;
  border-radius: 40px;
  font-family: Avenir Next Cyr;
  font-style: normal;             cursor: pointer;

  font-weight: 450;
  box-shadow: 0 0 30px rgba(3, 201, 238, 0.31);
  font-size: 16px;
  display: flex;
  cursor: pointer;
  align-items: center;
  line-height: 26px;
  justify-content: center;
  /* identical to box height, or 162% */

  text-align: center;
  letter-spacing: 0.02em;

  color: #FFFFFF;

  width: 215.3px;
  height: 48px;
}
.d1-btn,.d3-btn,.modal-btn{
  cursor: pointer;
  .transition();
  &:hover{
           box-shadow: 0 0 30px rgba(3, 201, 238, 0.61);
    color: rgba(0, 79, 94, 0.5);
  }
}
.modal,.dark{
  display: none;
}
.d3-content p span{
   font-weight: 500;
}
.d1-ttl-label span{font-weight: 500}
.d3-icon,.d6-icon{
  .transition();
  path{
    .transition();

  }
  &:hover{
    background: #FFFFFF; path{fill:#03C9EE!important;}
  }
}
.d5{
  z-index: 11;
  position: relative;
}
.header-reg,.d6-btn{
  .transition();
  &:hover{
    background: #03C9EE;
     color: white;
    box-shadow: 0 0 30px rgba(3, 201, 238, 0.3);
  }
}

@keyframes fade {
  0%{
    opacity: 1;
  }
  50%{
    opacity: 0.2;
  }
  100%{
    opacity: 1;
  }
}
.fadeInfinity{
  animation:  fade 1s linear infinite;
}
@keyframes fadeTtl {
  0%{
    opacity: 0.06;
  }
  50%{
    opacity: 0.01;
  }
  100%{
    opacity: 0.06;
  }
}
.fadeInfinityHalf{
  animation:  fadeTtl 1s linear infinite;

}
.d2-ttl-shadow,.d3-ttl,.d4-ttl,.d5-ttl,.d6-ttl,.d7-ttl,.d8-ttl,.d9-ttl{
  animation:  fadeTtl 1s linear infinite;

}

.d4-free{
  .transition();
  b,del,span{
    .transition();

  }
  &:hover{
    del{
      opacity: 0;
    }
    span{
      transform: translateX(-160px);
    }
  }
}
.d4-item{
  .d4-img img{
    .transition();
  }
  &:hover{
    .d4-img img{
      box-shadow: 0 0 30px rgb(3 ,201, 238 , 0.5);

    }
  }
}
.d9-icon{
  .transition();
}
.d9-item:hover{
  .d9-icon{
    box-shadow: 0 0 30px rgb(3 ,201, 238 , 0.5);

  }
}
.fsocs a{
  .transition();
  &:hover{
    transform: scale(1.1);
  }
}
.d2-item{
  .d2-item-img svg,    .d2-item-img
  {
    .transition();
  }
  &:hover{
    .d2-item-img
    { background: #03C9EE;
      
    }
    .d2-item-img svg{
      left: 100%;
    }
  }
}
.d2-cel{
  left: 480px;
}


@keyframes fadeTtl {
  0%{
    opacity: 0.06;
  }
  50%{
    opacity: 0.01;
  }
  100%{
    opacity: 0.06;
  }
}
@keyframes d4play {
  0%{
  transform: rotate(0deg);
  }
  50%{
    transform: rotate(360deg);
  }
  100%{
    transform: rotate(0deg);
  }
}
@keyframes d5play {
  0%{
    transform: rotate(0deg);
  }
  50%{
    transform: rotate(360deg);
  }
  100%{
    transform: rotate(0deg);
  }
}
.fpolici{
  &::after{
    .transition();
    width: 40%;
  }
  &:hover{
    &::after{
      width: 100%;
    }
  }
}
.d4-play,.owl-next{
  animation: d4play 10s linear infinite;
}
.d6-before,.d2-before,.d8-after{
  animation: d5play 30s linear infinite;

}


@keyframes d2center {
  0%{
    transform: translateY(30px);
  }
  50%{
    transform: translateY(-30px);
  }
  100%{
    transform: translateY(30px);
  }
}





.d2-center{
  animation: d2center 4s linear infinite;
  z-index: 5;
}


.footer{
  height: 491px;
  position: relative;
  &-bg{.xpos_ab;
    top: 0;}
  .relative{
    display: flex;
    flex-direction: column;
    padding-top: 120px;
    align-items: center;
    justify-content: center;
  }
}
.d9{
  margin-bottom: 90px;
  &-flex{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 95px;
  }
  &-content{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    line-height: 30px;
    /* or 167% */

    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: #151515;
    a{
      display: block;
      color: #03C9EE;;
      font-weight: 800;
    }
    b{
      white-space: nowrap;
      display: block;
      a{
        display: inline;}
      font-weight: 800;
    }
  }

  &-icon{
    width: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 54px;
    box-shadow: 0  0 30px rgba(3, 201, 238, 0.31);;
    margin-right: 25px;
    background: #03C9EE;
    border-radius: 100px;
  }
  &-item{
    margin-right: 85px;
    display: flex;
    align-items: center;
    
  }
  &-user{
    border: 2px solid #03C9EE;
    box-sizing: border-box;
    border-radius: 100px;
    img{
      border-radius: 100px;
      .c_img;
      padding: 5px;
    }
  }
  &-line{
    margin-left: 15px;
    background: rgba(3, 201, 238, 0.8);;
    margin-right: 10px;
    height: 2px;
    width: 40px;
  }
  h2{

    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 300;
    font-size: 42px;
    line-height: 60px;
    /* or 143% */          margin-top: -30px;


    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;

    color: #151515;
b{
  display: block;font-weight: 800;
}
  }
  &-ttl{
    font-family: Avenir Next Cyr;
    font-style: normal;
    font-weight: 800;
    font-size: 120px;
    line-height: 60px;
    /* identical to box height, or 50% */

    text-transform: uppercase;

    color: #151515;

    opacity: 0.06;
    text-align: center;
  }
}

.d8-slider .owl-item  {
  transform: scale(1) !important

}
.d8-slider{
  .owl-stage{
    display: flex;
    align-items: center;
  }

}
.d8-slid p{
  margin-top: 20px;
}
.d8-slider .active.active3{
  &+div{
    .d8-slid{
      width: 318px;
      margin-left: 115px;

      padding: 30px;

      .d8-right{
        display: none;
      }
      .d8-name b{
        color: white;
      }
      background: rgba(3, 201, 238, 0.06);;
      p{
        display: -webkit-box;
        
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
        color: white;
        height: 3 * 30px;
      }
    }
  }
  .d8-slid{
    width: 382px;
    margin-left: 100px;
    padding: 30px;
    p{
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 5;
      overflow: hidden;
      height: 5 * 30px;
    }
    .d8-right{
      display: none;
    }
  }
  transform: scale(1) !important
}

/**
*
  Общие классы
*
**/
.show {
  display: block !important;
}

.hide,
.xs-show,
.sm-show,
.md-show {
  display: none !important;
}

.flf {
  float: left !important;
}

.flr {
  float: right !important;
}

.clear {
  display: block;
  clear: both;
}

.t_center {
  text-align: center;
}

.t_right {
  text-align: right;
}

.pos_rel {
  position: relative;
}

.ypos_ab {
  position: absolute;
  top: 50%;
  .translate(0, -50%);
}

.xpos_ab {
  position: absolute;
  left: 50%;
  .translate(-50%, 0);
}

.pos_absc {
  position: absolute;
  top: 50%;
  left: 50%;
  .translate(-50%, -50%);
}

.c_img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

.b_img {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.psevdo-item {
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
}


/**
*
  Адаптивка
*
**/
@media only screen and(max-width: 1599px) {
  .wrap{
    width: 1170px;
  }
  .header-logo{
    width: auto;
  }

  .header-menu a{
    margin: 0 10px;

  font-size: 15px}
  .d5-right{
    margin-top: 0;
  }
  .d1-mouse{
    display: none;
  }
  .d6 .wrap{
    padding-top: 240px;
  }
  .d6-content p{
    br{
      display: none;
    }
  }
  .page-parent{
    overflow-x: hidden;
  }
  .d4-bg-parent{
    overflow-x: hidden;

  }
  .d4{
  }
  .d6-ttl {
    top: 315px;
  }
  .d8-slider .active.active3 .d8-slid{
    margin-left: -35px;
  }
  .d8-line{
    display: none;
  }
  .d7 .wrap{
    width: 900px;
  }
  .d6-item{
    margin-right: 0;
    width: 360px;
  }
  .d6-content p{
    font-size: 16px;
    line-height: normal;
  }
  .d6-icon{
    margin-right: 20px;
    flex-shrink: 0;
  }
  .d6-flex{
    justify-content: space-between}
  .d5-slider{
    width: 800px !important;
  }
  .d6-flex{
    margin-top: 40px;
  }
  .d1-right{
    display: none;
  }
  .d2 .wrap{
    padding-left: 150px;
  }
  .d4-items{
    margin-top: 30px;
  }
  .d4-left{
    padding-left: 20px;
    margin-right: 30px;
    width: 300px;
    br{
      display: none;
    }
  }
  .d4-right p{
    font-size: 18px;
  }
  .d2-item:last-child {
    margin-left: 228px;
  }
  .d4-line,.d4-play{
    display: none;
  }
  .d4-item{
    margin-right: 0;
  }
  .d2-line{
    display: none;
  }     .d4-items
          {
  justify-content: space-between;
          }
  .d3-col:nth-child(2){
    margin-left: -100px;
  }
  .d2-before {
    position: absolute;
    right: -225px;
    top: 450px;
    height: 301px;
  }
  .d2-center{

    left: -110px;
  }
  .header-reg{
    width: 165px;
  }
  .header-login{
    margin-left: 20px;
  }
}
.header-burger{
  display: none;
}
.burger-menu{
  display: none;
}
.modal-play{
  width: 712px;

  .modal-body{
   padding: 25px 30px;
 }
}

.modal-play-img{
  margin-bottom: 25px;
  img{
    max-width: 100%;
  }
  width: 100%;
}
.vac{
    &-content{
        ul{
            margin-bottom: 40px;
            font-family: Avenir Next Cyr;
font-style: normal;
font-weight: 300;
font-size: 16px;
            li{
                strong{
                    font-weight: 500;
                }
                padding-left: 22px;
                position: relative;
                &::after{
                    position: absolute;background: #03C9EE;
width: 6px;
height: 6px;
                    content: "";
                    left: 0;
                    border-radius: 50%;
                    .ypos_ab;
                }
            }
line-height: 30px;
/* identical to box height, or 187% */

letter-spacing: 0.02em;

color: #151515;

        }

        p{
            margin-bottom: 25px;
                    font-style: normal;
font-weight: 600;
font-size: 20px;line-height: 33px;
/* identical to box height, or 165% */


color: #151515;
        }


    }
    &-line{width: 60px;
height: 2px;
        margin: 35px 0;
        background:  rgba(3, 201, 238, 0.8);
        
    }
    &-item{
        margin-top: 70px
    }
    &-ttl{
        font-weight: 300;
font-size: 24px;
line-height: 40px;
/* identical to box height, or 167% */

letter-spacing: 0.02em;
text-transform: uppercase;


        b{color: #03C9EE;

                    font-weight: 800;

        }
    }
}

.vac-page{
    .wrap{
//        width: 1030px;
    }
    &-ttl{
        font-weight: 300;
font-size: 42px;
line-height: 60px;
/* identical to box height, or 143% */

letter-spacing: 0.02em;
text-transform: uppercase;

color: #151515;
        b{
            font-weight: 900
        }
    }
    padding: 160px 0

}


@media only screen and(min-width: 1199px) {
    .vac-page{
    .wrap{
        width: 1030px;
        }
    }
    
}
@media only screen and(max-width: 1199px) {

    .burger-menu{
        .header-right{
            display: flex;
            flex-direction: column;
            align-items: center
        }
        .header-login{
            margin-left: 0;
            margin-top: 20px
        }
    }
  .burger-close{
    svg{
      width: 24px;
    }
  }
  .page-parent{
    overflow-x: hidden;
  }
  .burger-ul{
    display: flex;

    flex-direction: column;
    align-items: center;
    a{

      font-family: Avenir Next Cyr;
      font-style: normal;
      font-weight: 700;
      font-size: 17.0583px;
      line-height: 28px;
      /* identical to box height, or 163% */

      text-align: center;
      font-variant: small-caps;

      color: #03C9EE;

      opacity: 0.8;
      margin-bottom: 25px;
    }
  }
  .burger-menu{
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    transform: translateY(-100%);
    .transition();
    &.active{
      transform: translateY(0);
    }
    background: white;
    top: 0;
    .header{
      position: static;
    }
    z-index: 155;
  }
  .md-show {
    display: block !important;
  }
  .d1-bg{
    width: 1230px;

  }
  .d1-ttl-label{
    top: -25px;
  }
  .d1-ttl{              width: 100%;

    img{
      width: 683px;
    }
  }
  .d2{
    background: #01191E;
  }
  .d3{
    margin-top: 0;
  }
  .d2-bg{
    top: -60px;
  }
  .d2 .wrap{
    height: auto;
    padding-bottom: 0px;
  }
  .d4-bg-parent{
    display: none;
  }
  .d4-before{
    display: none;
  }
  .d4{
    background: #01191E;

  }
  .d6 .wrap{
    
  }
  .d9{
    margin-bottom: 0px;
  }
  .d9-item{
    margin: 0 20px;
    margin-bottom: 30px;
  }

  .d9-flex{
  flex-wrap: wrap;

    margin-top: 40px;
  }
  .d8-after{    top: 94px;
    width: 361px;}
  .d6-before {
    top: 579px;
  }
  .fmenu a{
    margin: 0 10px;
    font-size: 14px;
  }
  .d5-ttl{
    top: 50px;
    left: 0;
    font-size: 80px;
  }
  .d6-content p{
    margin-top: 10px;
    font-size: 14px;
  }
  .d6-icon{
    height: 70px;
    width: 70px;
    padding: 10px;
  }
  .d6-flex{
    justify-content: space-between;
  }
  .d6-item{
    width: 230px;
    flex-wrap: wrap;
  }
  .d3-content{
    margin: 0;
    margin-bottom: 40px;
  }
  .d5-flex
  .owl-next{
    top: 30px;
  }
  .d5-flex{
    padding-top: 50px;
  }
  .d5-slider{
    width: 100%!important;}
  .d4-free del{
    margin: 0 12px;
  }
  .d5-flex{
    flex-direction: column-reverse;
  }
  .d5-right{
    text-align: center;
  }
  .d4-img{
    height: 130px;
  }
  .d4-item{
    width: 130px;
  }
  .d4-left{
    flex-shrink: 0;
  }
  .d4-free{
      span,del,b{
        font-size: 18px;
      }
  }
  .d4-flex{
    //display: block;
  }
  .d3-icon{
    margin-right: 20px;
  }
  .d4-ttl{
    top: 120px;
  }
  .d4 .wrap{
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .d4{
    margin-top: 100px;
    height: auto;
    position: relative;
    z-index: 5;
  }
  .d3-item:last-child {
    margin-left: 140px;
  }
  .d3-ttl{
    font-size: 90px;
    top: -65px;
  }
  .d3{
    padding-top: 200px;
  }
  .d3-flex{
    flex-wrap: wrap;
  }
  .d3-col{
    order: 1;
  }
  .d2-item-flex{
    display: block;
  }
  .d2-center {
    left: -49px;
  }
  .d2-item:last-child{
    margin: 0;
    margin-top: 60px;
  }
  .d2 .wrap {
    padding-left: 190px;
  }
  .d2-before{
    top: auto;
    right: -155px;
    bottom: -200px;
  }
  .d2-cel{
    position: static;
    margin-top: 30px;
  }
  .d2-bg{
  }
  .d1 .wrap {
    position: relative;
    padding-top: 170px;
    padding-bottom: 260px;
  }
  .header-burger{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 24px;
    width: 35px;
    div{
      width: 100%;
      background: #03C9EE;
      height: 2px;
      border-radius: 2px;
    }
  }

  .md-hide {
    display: none !important;
  }
  .wrap{
    width: 768px;
    padding-left: 15px;
    padding-right: 15px;
  }
  .header-menu,.header-right{
    display: none;
  }
  .d7 .wrap{
    width: 768px;
  }
}


@media only screen and(max-width: 991px) {

  .sm-show {
    display: block !important;
  }

  .sm-hide {
    display: none !important;
  }

}


@media only screen and(max-width: 767px) {

  .xs-show {
    display: block !important;
  }
  .modal-play .modal-body{
    padding: 15px;
    img{
      margin: 0;
    }
  }
  .d7-policy{
    padding-bottom: 0;
    padding-top: 60px;
    h2{
      font-size: 22px!important;
    }

  }

  .xs-hide {
    display: none !important;
  }
  .d1{
    z-index: 5;
    background: white;
    position: relative;
  }

  .lines-parent{
    display: none;
  }
  .d2-cel-img{
    display: none;
  }
  .d2-item-img{
    display: none;
  }
  .d2-before{
    height: 140px;
  }
  
  .d2-before {
    top: auto;
    right: -85px;
    bottom: -140px;
  }

  .d2-bg{
    top: auto;
    bottom: -240px;
  }
  .d2-item-text b{
    font-size: 36px;
    line-height: normal;
  }
  .d2-cel p{
    font-size: 16px;
    line-height: normal;
  }
  .d2-ttl-shadow{
    margin-top: 23px;
    font-size: 80px;

  }
  .d2-center{
    display: none;
  }
  .wrap{
    width: 100%;
  }
  .d2-text{
    font-size: 18px;
    line-height: 24px;
    padding-bottom: 0;
    margin-left: 0;
    margin-top: 20px;
    padding-top: 0;
    padding-left: 15px;
  }
  .d2-ttl{
    font-size: 28px;
    line-height: normal;
  }

  .d1 .wrap{
    padding-top: 210px;

  }
  .d2 .wrap{
    padding-top: 60px;
    padding-left: 15px;
  }
  .d1-bg{
    width: 730px;
  }
  .d1 .wrap{
    padding-top: 100px;
  }
  .d1-text{
    margin: 20px 0;
  }
  .d1-text:before{
    display: none;
  }
  .d1-ttl img{
    width: 100%;
  }
  .d1-ttl-label{
    font-size: 16px;
    line-height: normal;
    margin-top: 10px;
    position: static;
  }
  .row {
    margin-left: -10px;
    margin-right: -10px;
  }

  [class*="col-"] {
    padding-left: 10px;
    padding-right: 10px;
  }

  .d3-icon{
    width: 70px;
    padding: 10px;
    height: 70px;
  }
  .d3-item:last-child{
    margin-left: 0;
    margin-top: 20px;
  }
  .d4 .wrap{
    padding-bottom: 30px;
  }
  .d4-items{
    flex-wrap: wrap;                 display: flex;
  }
  .d4-item{width: ~"calc(50vw - 30px)";margin-bottom: 30px}
  .d4-img{height: ~"calc(50vw - 30px)"}
  .d3-col:nth-child(2){
    margin-left: 0;
    margin-top: 20px;
  }            .d4-free del{
  display: none;
                 }
               .d4-free{
                 display: block;
               }
  .d4-right p{
    margin-top: 20px;
    line-height: normal;
  }
  .d4-flex{
    display: block;
  }
  .d4-left{
    font-size: 16px;
    line-height: normal;
    width: 100%;
  padding-left: 15px;margin-right: 0}
  .d4-ttl{
    top: 105px;
    font-size: 50px;
  }
  .d4 h2{
    font-size: 32px;
    line-height: normal;
  }
  .d3-item-text{
    line-height: normal;
    font-size: 20px;
  }
  .d4{
    margin-top: 30px;
  }

  .d3-line{
    display: none;
  }
  .d3-ttl{
    font-size: 32px;
    right: 0;
  }       .d3-content p::after{
  display: none;
            }
  .d3-content p{
    margin: 20px 0;
    padding-left: 0;
    line-height: normal;
  }
  .d3-content h2,.d5-right,.d6 h2{
    font-size: 26px;
    line-height: normal;
  }
  .d5-ttl{
    font-size:  35px;
    text-align: center;
    width: 100%;
  }
  .d6{
    margin-top: 40px;

  }
  .d2-item-text label{
    font-size: 17px;
  }
  .d6-btn{
    margin-left: 0;
    margin-top: 0px;
  }          .d6 .wrap {
                 padding-top: 40px;
               }
  .d6-bg{
    display: none;
  }
  .d6{
    padding-bottom: 60px;
    height: auto;     background: #01191E;

  }
  .d6-flex{
    flex-wrap: wrap;
  }
  .d6-item{margin-bottom: 30px}
  .d6-ttl{
    top: 205px;
    font-size: 60px;
  }
  .d6 .wrap {
    padding-top: 40px;
  }
  .d5{
    &-slid{
      display: flex;
      justify-content: center;
    }
    .owl-next{
      left: ~"calc(100% + -48px)";

    }
  }
  .d8 .wrap{
    padding-top: 40px;

  }
  .d8{
    margin-top: 0;           background: #01191E;

    height: auto;
  }
  .d7-text-flex{
    margin-top: 30px;
  }
  .d8-bg{
    display: none;
  }
  .d7-text{
    font-size: 16px;
    line-height: normal;
    margin-top: 0px;
  }
  .d7-faq-content{
    padding: 15px;
  }
  .d7-faq-content p{
    font-size: 16px;line-height: normal;
    margin-bottom: 20px;
  }
  .d7-ttl{
    display: none;
  }
  .d7-faq-head span{
    line-height: normal;
    font-size: 18px;
  }
  .d7-faq-head{
    padding: 15px;
  }
  .d7-faq-head svg{
    margin-left: 15px;
  }
  .d7 .wrap{
    width: 100%;
    padding-top: 40px;
    padding-bottom: 40px;
  }     .d8 h2,.d9 h2{
  font-size: 32px;
  line-height: normal;
          }
  .d7 h2{
    margin-top: 0;
    font-size: 32px;
    line-height: normal;
    text-align: center;
  }
  .footer{
    height: auto;
  }
  .footer-bg{
    width: 1500px;
  }
  .d9-flex{
    align-items: flex-start;
    justify-content: flex-start;
  }
  .d9-icon{
    margin-right: 15px;
  }
  .d9-item{
    margin-bottom: 20px!important;
  }
  .modal-body{
    .modal2{
      margin: -20px 0;
    }
  } .modal-body img{
    margin: -40px 0;
    width: 100%;
  }
  .modal p{margin-bottom: 15px;
  }
  .modal-close{
    right: 0;
  }
  .modal h2{
    font-size: 24px;
    line-height: normal;
    text-align: center;
  }
  .modal-body{
    padding: 15px;
  }
  .modal{
    width: 300px;
  }
  .d9-flex{margin-top: 20px}
  .d9-user{
    flex-shrink: 0;
    width: 54px;
    margin-right: 15px;
    height: 54px;
  }
  .d9-content{
    font-size: 16px;
    line-height: normal;
  }
  .d9-line{
    display: none;
  }
  .d9-ttl{
    font-size: 60px;
    text-align: center;
  }
  .fsocs{
    margin: 30px 0;
  }
  .d9-item{
    margin: 0;
  }
  .d8 .wrap{
    padding-bottom: 40px;
  }
  .fpolici{
    font-size: 14px;
    line-height: normal;
  }
  .fmenu{
    display: none;
  }
  .d8-ttl{
    font-size: 60px;
    line-height: normal;
  }
  .d8-slid p{
    margin-top: 10px;
    line-height: normal;
  }
  .d8-slider .owl-next {
    left: ~"calc(100% + -22px)";
  }
  .d8-slid{border-radius: 20px}
  .d8-right{
    display: none;
  }
  .d8-slid{
    width: 100%;
    padding: 15px;
  }
  .d8-slider{
    margin-top: 20px;
  }
  .d6-before{
    display: none;}
  .d8-after {
    top: -48px;
    width: 100px;
    left: ~"calc(100% - 52px)";

  }
  .d2-ttl-shadow, .d3-ttl, .d4-ttl, .d5-ttl, .d6-ttl, .d7-ttl, .d8-ttl, .d9-ttl{
    display: none;
  }
  .page-parent{
    overflow: hidden!important;
  }
  .d9{
    padding-top: 100px;

  }
  .footer{
    padding-bottom: 60px;
  }
  .d1 .wrap{padding-top: 120px;padding-bottom: 200px}
  .footer .relative{
    padding-top: 89px;

  }
    .vac-item{
        margin-top: 50px
    }
    .vac-line{
        margin: 25px 0
    }
  .header-logo{
    img{
      width: 70px;

    }
  }

    .vac-page-ttl{
        font-size: 36px;
        line-height: normal
    }
    .vac-content ul li{
        margin-bottom: 10px;
        line-height: normal;
    }
    
    .vac-page{
        padding: 100px 0
    }


}


@media only screen and(max-width: 375px) {

}


@media only screen and(max-width: 320px) {

}


/**
*
  Owl Carousel
*
**/
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1;
}

.owl-carousel .owl-stage {
  position: relative;
  -ms-touch-action: pan-Y;
  touch-action: manipulation;
  -moz-backface-visibility: hidden;
  /* fix firefox animation glitch */
}

.owl-carousel .owl-stage:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: hidden;
  /* fix for flashing background */
  -webkit-transform: translate3d(0px, 0px, 0px);
}

.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item {
  position: relative;
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}


.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-dots.disabled {
  display: none;
}

.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-dot {
  cursor: pointer;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next,
.owl-carousel button.owl-dot {
  background: none;
  color: inherit;
  border: none;
  padding: 0 !important;
  font: inherit;
}

.owl-carousel.owl-loaded {
  display: block;
}

.owl-carousel.owl-loading {
  opacity: 0;
  display: block;
}

.owl-carousel.owl-hidden {
  opacity: 0;
}

.owl-carousel.owl-refresh .owl-item {
  visibility: hidden;
}

.owl-carousel.owl-drag .owl-item {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.owl-carousel.owl-grab {
  cursor: move;
  cursor: grab;
}

.owl-carousel.owl-rtl {
  direction: rtl;
}

.owl-carousel.owl-rtl .owl-item {
  float: right;
}

/* No Js */
.no-js .owl-carousel {
  display: block;
}

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  animation-duration: 1000ms;
  animation-fill-mode: both;
}

.owl-carousel .owl-animated-in {
  z-index: 0;
}

.owl-carousel .owl-animated-out {
  z-index: 1;
}

.owl-carousel .fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/*
 *  Owl Carousel - Auto Height Plugin
 */
.owl-height {
  transition: height 500ms ease-in-out;
}

/*
 *  Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item {
  /**
      This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong
      calculation of the height of the owl-item that breaks page layouts
     */
}

.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  transition: opacity 400ms ease;
}

.owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {
  max-height: 0;
}

.owl-carousel .owl-item img.owl-lazy {
  transform-style: preserve-3d;
}

/*
 *  Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000;
}

.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: transform 100ms ease;
}

.owl-carousel .owl-video-play-icon:hover {
  -ms-transform: scale(1.3, 1.3);
  transform: scale(1.3, 1.3);
}

.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none;
}

.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 400ms ease;
}

.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%;
}