@charset "UTF-8";
/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
  
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 991px) {
  body {
    font-size: 14px;
  }
  h1 {
    font-size: 44px;
  }
  h2 {
    font-size: 20px;
  }
  h3 {
    font-size: 18px;
  }
  .title--mb {
    margin-bottom: 20px;
  }
  .title p {
    margin-top: 20px;
  }
  .form__field {
    margin-bottom: 20px;
  }
  .form__field input {
    height: 48px;
    line-height: 48px;
  }
  .form__field input, .form__field textarea {
    font-size: 16px;
  }
  .btn {
    height: 54px;
    font-size: 16px;
  }
  .main {
    padding: 80px 0;
  }
  .logo {
    top: 20px;
  }
  .hero__title h2 {
    max-width: 400px;
    margin-top: 25px;
  }
  .box {
    padding: 30px 34px;
    border-radius: 15px;
  }
  .calendar {
    font-size: 16px;
    margin-top: 35px;
  }
  .calendar__head {
    margin-bottom: 25px;
  }
  .calendar ul li.current:nth-child(5):after {
    left: 15px;
  }
  .calendar ul li.current:last-child:after {
    right: 15px;
  }
  .get-discount {
    margin-top: 35px;
  }
  .get-discount .title {
    margin-bottom: 20px;
  }
  .success__btns-item {
    width: 100%;
  }
  .success__btns-item:not(:last-child) {
    margin-bottom: 25px;
  }
  .success__btns-item p {
    margin-bottom: 15px;
  }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
  
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
  h1 {
    font-size: 32px;
  }
  h2 {
    font-size: 16px;
  }
  h3 {
    font-size: 14px;
  }
  .hero__title h2 {
    max-width: 300px;
  }
  .box {
    padding: 25px 20px;
  }
  .calendar {
    font-size: 14px;
    margin-top: 25px;
  }
  .calendar__head {
    margin-bottom: 18px;
  }
  .calendar ul li.current:after {
    top: 0;
  }
  .calendar ul li.current:nth-child(5):after {
    left: 5px;
  }
  .calendar ul li.current:last-child:after {
    right: 5px;
  }
  .get-discount {
    margin-top: 25px;
  }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}

/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
  
}

@media only screen and (min-width : 576px) {
  .container {
    max-width: 550px;
  }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
  
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
  .container {
    max-width: 825px;
  }
}

 /* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
  
}