@font-face {
  font-family: "PFDinTextCompPro";
  src: url("/fonts/pfdintextcomppro/pfdintextcomppro-medium.eot");
  /* IE 9 Compatibility Mode */
  src: url("/fonts/pfdintextcomppro/pfdintextcomppro-medium.eot?#iefix") format("embedded-opentype"), url("/fonts/pfdintextcomppro/pfdintextcomppro-medium.woff2") format("woff2"), url("/fonts/pfdintextcomppro/pfdintextcomppro-medium.woff") format("woff"), url("/fonts/pfdintextcomppro/pfdintextcomppro-medium.ttf") format("truetype");
}

html,
body {
  width: 100vw;
  height: 100vh;
  margin: 0px;
  padding: 0px;
  font-family: "PFDinTextCompPro";
}

.main {
  width: 100vw;
  height: 100vh;
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  background-position: center center;
  background-size: 100% auto;
  background-repeat: no-repeat;
}

.content {
  background-image: url("/images/direct_smart/fon.png");
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  font-family: "PFDinTextCompPro";
  display: flex;
  justify-content: center;
  justify-items: center;
  align-content: flex-start;
  align-items: flex-start;
  text-align: center;
  width: 86vw;
  height: 81.1572815534vw;
  margin: auto;
}

.left_block {
  width: 68.2%;
  height: 81.1572815534vw;
}

.left_block_row_1 {
  margin-top: 5.8136vw;
  margin-left: 4.472vw;
  text-transform: uppercase;
  color: #ffffff;
  font-size: 4.472vw;
  background-image: url("/images/direct_smart/plashka.svg");
  background-position: center center;
  background-size: auto 105%;
  background-repeat: no-repeat;
  padding: 0.8944vw 0 0.76024vw 1.7888vw;
  border-radius: 0.8944vw 0vw 0vw 0.8944vw;
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: flex-start;
  justify-items: center;
  text-align: left;
}

.left_block_row_2 {
  margin-top: 3.1304vw;
  margin-left: 4.472vw;
  text-transform: uppercase;
  color: #fa6e19;
  font-size: 5.3664vw;
  padding-left: 1.7888vw;
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: flex-start;
  justify-items: center;
  text-align: left;
}

.left_block_row_3 {
  margin-top: 3.1304vw;
  margin-left: 4.472vw;
  margin-right: 4.472vw;
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  text-align: center;
}

.logo_search {
  height: 3.1304vw;
  width: auto;
  margin: 0px 1.7888vw;
}

.right_block {
  width: 31.8%;
  height: 81.1572815534vw;
}

#landing_form {
  box-sizing: border-box;
  padding-top: 17.4408vw;
  height: 67.08vw;
}

.form_element.error {
  box-shadow: 0px 0px 1em #ff0000, 0 0 3em #ffffff;
}

.landing_form_ok {
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  width: 100%;
  height: 100%;
  font-family: "PFDinTextCompPro";
  color: #474747;
  font-size: 2vw;
}

.send_ok .form_element {
  opacity: 0;
}

.wr_form {
  width: 80%;
  margin: 0 auto;
}

.form_element {
  border-radius: 0.8944vw;
  width: 100%;
  height: auto;
  box-sizing: border-box;
  font-size: 2.236vw;
  font-family: "PFDinTextCompPro";
  height: 4.472vw;
  margin-bottom: 3.1304vw;
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: flex-start;
  justify-items: center;
  padding: 0em 0.8em;
  background-color: #d9eaf0;
  border: none;
  position: relative;
  outline: none;
}

.phone-mask-wrapper-lib {
  position: relative;
  height: auto !important;
}

.form_element.button {
  font-size: 2.4596vw;
  display: inline-flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  cursor: pointer;
  text-transform: uppercase;
  background-color: #0490c4;
  color: #ffffff;
  cursor: pointer;
}

.wr_kontacts {
  text-align: left;
  color: #666666;
  font-size: 2.236vw;
}

a {
  color: #666666;
  margin: 0.3em 0.1em;
  text-decoration: none;
  white-space: nowrap;
}

@media screen and (min-aspect-ratio: 11742/10670) {
  html,
  body {
    max-height: 100vh;
    overflow: hidden;
  }

  .content {
    top: 3vh;
    position: relative;
    width: 95.3703703704vh;
    height: 90vh;
  }

  .left_block {
    height: 90vh;
  }

  .left_block_row_1 {
    margin-top: 3.4714814815vh;
    margin-left: 4.9592592593vh;
    font-size: 4.9592592593vh;
    padding: 0.9918518519vh 0 0.8430740741vh 1.9837037037vh;
    border-radius: 0.9918518519vh 0vw 0vw 0.9918518519vh;
  }

  .left_block_row_2 {
    margin-top: 3.4714814815vh;
    margin-left: 4.9592592593vh;
    font-size: 5.9511111111vh;
    padding-left: 1.9837037037vh;
  }

  .left_block_row_3 {
    margin-top: 3.4714814815vh;
    margin-left: 4.9592592593vh;
    margin-right: 4.9592592593vh;
  }

  .logo_search {
    height: 3.4714814815vh;
    width: auto;
    margin: 0px 1.9837037037vh;
  }

  .right_block {
    height: 90vh;
  }

  #landing_form {
    padding-top: 16.3655555556vh;
    height: 74.3888888889vh;
  }

  .form_element {
    border-radius: 0.9918518519vh;
    font-size: 2.4796296296vh;
    height: 4.9592592593vh;
    margin-bottom: 3.4714814815vh;
  }

  .form_element.button {
    font-size: 2.7275925926vh;
  }

  .wr_kontacts {
    font-size: 2.4796296296vh;
  }
}

@media screen and (min-width: 1920px), (min-height: 1080px) {
  .main {
    background-size: cover;
  }
}

@media only screen and (max-device-width: 600px) {
  .content {
    width: 100%;
    height: auto;
    flex-wrap: wrap;
    background-image: url("/images/direct_smart/fon_ns.png");
    background-position: center 85vw;
    background-size: 100%;
    background-repeat: no-repeat;
    padding-bottom: 0vw;
  }

  .left_block {
    width: 100%;
    height: auto;
  }

  .left_block_row_1 {
    margin: 0vw 8vw 0;
    font-size: 7.5vw;
    padding: 1.5vw 1.5vw;
    border-radius: 2vw;
    background-image: none;
    background-color: #0490c4;
    justify-content: center;
    text-align: center;
  }

  .left_block_row_2 {
    margin: 2vw 8vw 0;
    font-size: 9vw;
    padding: 1.5vw 1.5vw;
    justify-content: center;
    text-align: center;
  }

  .left_block_row_3 {
    margin: 1vw 8vw 4.1vw;
    padding: 1.5vw 1.5vw;
    justify-content: center;
    text-align: center;
  }

  .logo_search {
    height: 7vw;
    width: auto;
    margin: 2vw 8vw 0;
  }

  .right_block {
    width: 100%;
    height: auto;
  }

  #landing_form {
    padding-top: 1vw;
    height: auto;
  }

  .wr_form {
    width: 57%;
    margin: 0 auto;
  }

  .form_element {
    border-radius: 2vw;
    font-size: 5vw;
    height: 10vw;
    margin-bottom: 3.5vw;
  }

  .form_element.button {
    font-size: 5.5vw;
  }

  .wr_kontacts {
    margin: 50vw 8vw 0;
    font-size: 6vw;
    text-align: center;
  }
}

