:root {
  --light-blue-500: 202, 83%, 41%; /* #127fbf */
  --blue-100: 210, 22%, 49%; /* #627d98 */
  --blue-900: 209, 61%, 16%; /* #102a43 */
  --gray-300: 212, 33%, 89%; /* #d9e2ec */
}

html, body{
  width: 100%;
  height: 100%;
}

section.line_bg{
  background-image: url(../../assets/img/section-CTA-background-SVG.svg);
  background-repeat: no-repeat;
  background-position: top;
  background-size: cover;
}

/* ==========================================================================
   Component: Progress Form
   ========================================================================== */
   .progress-form {
    background-color: #242424;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgb(0, 0, 0, 10%), 0 1px 2px -1px rgb(0, 0, 0, 10%);
  }
  
  /* Tabs
     ========================================================================== */
  
  .progress-form__tabs {
    column-gap: 0;
    width: 100%;
    margin-bottom: 28px;
  }
  
  @media only screen and (min-width: 640px) {
    .progress-form__tabs {
      column-gap: 0.2rem;
    }
  }
  
  .progress-form__tabs-item {
    background-color: transparent;
    border: 0;
    border-top: 5px solid #242424;
    border-radius: 0;
    color: #627d98;
    display: none;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.4;
    position: relative;
    text-align: left;
    text-shadow: none;
    transition: color 0.2s ease-in-out;
    white-space: normal;

    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  
  .progress-form__tabs-item:active {
    transform: none;
  }
  
  .progress-form__tabs-item:hover,
  .progress-form__tabs-item:focus {
    background-color: inherit;
    color: inherit;
  }
  
  .progress-form__tabs-item::before {
    background: rgb(19,110,170);
    background: -webkit-gradient(linear, left top, right top, from(rgba(19,110,170,1)), color-stop(52%, rgba(230,36,152,1)), to(rgba(230,114,36,1)));
    background: -o-linear-gradient(left, rgba(19,110,170,1) 0%, rgba(230,36,152,1) 52%, rgba(230,114,36,1) 100%);
    background: linear-gradient(90deg, rgba(19,110,170,1) 0%, rgba(230,36,152,1) 52%, rgba(230,114,36,1) 100%);
    content: "";
    height: 5px;
    left: 0;
    position: absolute;
    top: -5px;
    transition: width 0.2s ease-in-out;
    width: 0;
  }
  
  .progress-form__tabs-item > .step {
    color: #627d98;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    transition: color 0.2s ease-in-out;
  }
  
  @media only screen and (min-width: 640px) {
    .progress-form__tabs-item {
      display: block;
    }
  }
  
  /* --- Current Step --- */
  
  .progress-form__tabs-item[aria-selected="true"] {
    display: block;
    color: #43a9e7 !important;
  }
  .progress-form__tabs-item[data-complete="true"] {
    display: block;
    color: #fff;
  }
  
  .progress-form__tabs-item[aria-selected="true"]::before {
    width: 50%;
  }
  
  .progress-form__tabs-item[aria-selected="true"] > .step {
    color: #43a9e7;
  }
  
  /* --- Disabled Step --- */
  
  @media only screen and (min-width: 640px) {
    .progress-form__tabs-item[aria-disabled="true"] {
      background-color: transparent;
      color: #a7a7a7;
    }
  }
  
  /* --- Completed Step --- */
  
  .progress-form__tabs-item[data-complete="true"]::before {
    width: 100%;
  }
  
  .progress-form__tabs-item[data-complete="true"] > .step {
    color: #127fbf;
  }
  
  /* New */
  .page_hed{
    font-size: 4vw;
    letter-spacing: 4px;
  }
  .box_check .form-check {
      position: relative;
      padding: 0;
      text-align: center;
      height: 100%;
  }
  .box_check .form-check input {
      position: absolute;
      left: 8px;
      top: 8px;
      margin: 0;
  }
  .box_check .form-check label {
    padding: 14px;
    width: 100%;
    height: 100%;
    border: 1px solid #6f6f6f;
    border-radius: 5px;
  }
  .box_check .form-check img {
      margin-bottom: 10px;
      filter: brightness(0) invert(1);
      -webkit-transition: all 0.3s ease 0s;
      -o-transition: all 0.3s ease 0s;
      transition: all 0.3s ease 0s;
  }
  .box_check .form-check p {
    margin-bottom: 0;
    line-height: 22px;
  }

  .progress-form input.form-check-input{
    padding: 10px;
    border: none;
    border-bottom: none;
    margin-bottom: 0;
    min-height: unset;
    margin-top: 4px;
    margin-right: 10px;
  }

  .progress-form .form-check-input:checked{
    background-color: #43a9e7;
  }

  .progress-form .form-check-input:checked + .form-check-label{
    color: #43a9e7;
  }
  .progress-form .box_check .form-check-input:checked + .form-check-label, .progress-form .box_check .form-check-input:checked + .form-check-label p{
    color: #43a9e7;
    border-color: #43a9e7;
    background-color: #111;
  }
  .progress-form .box_check .form-check-input:checked + .form-check-label img{
    filter: unset !important;
  }


  .button-simple.btn-link{
    text-decoration: unset;
    color: #fff;
  }
  .button-simple.btn-link:hover{
    color: #43a9e7;
  }
  .text_custom{
    color: #43a9e7;
  }

  .estimate p{
    margin-bottom: 5px;
    line-height: 22px;
  }
  .estimate h3{
    margin-bottom: 4px;
  }
  .estimate .estimate_title{
    font-size: 18px;
  }

  .form_submit button[type="submit"]{
    border-radius: 300px;
    margin: 0;
    border-color: rgba(242, 242, 242, 0.26);
    background-color: rgba(0,0,0,0.64);
  }
  #progress-form .btn {
    padding: 14px 30px 14px;
    font-size: 14px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 500;
}

section#progress-form-panel-1 .row .col {
  margin-top: 20px;
}

input#bt-others {
  background-color: #0d0d0d;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  border-radius: 30px;
  margin: 0;
}

.panel-submit , .features-submit , .domain-submit{
  display: none;
}

button.dd-nd-add {
  background-color: #ffffff;
  border: none;
  color: black;
  padding: 4px 29px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
  border-radius: 20px;
}

select#address-state option {
  color: #fff;
  background: #242424;
}