[class*=payment_method_gateway]::after {
  content: '';
  display: table;
  visibility: hidden;
  clear: both;
}

[class*=payment_method_gateway] .hosted-fields-single-form, [class*=payment_method_gateway] .hosted-fields-saved-card-form {
  background: #ffffff;
  margin: 10px;
  padding: 10px;
  display: none;
}

[class*=payment_method_gateway] [name=payment_method]:checked~.hosted-fields-single-form, [class*=payment_method_gateway] [name=payment_method]:checked~.hosted-fields-saved-card-form {
  display: block;
}

#payment .hosted-fields-single-form .hf-row .hf-form-control label, #payment .hosted-fields-saved-card-form .hf-row .hf-form-control label {
  padding: 0;
}

#payment .hosted-fields-single-form .hf-row .hf-form-control label::before, #payment .hosted-fields-saved-card-form .hf-row .hf-form-control label::before {
  display: none;
}

[class*=payment_method_gateway] .hosted-fields-single-form .hf-row, [class*=payment_method_gateway] .hosted-fields-saved-card-form .hf-row {
  margin-left: -8px;
  margin-right: -8px;
}

[class*=payment_method_gateway] .hosted-fields-single-form .hf-row::after, [class*=payment_method_gateway] .hosted-fields-saved-card-form .hf-row::after {
  content: '';
  display: table;
  visibility: hidden;
  clear: both;
}

[class*=payment_method_gateway] .hosted-fields-single-form [class*="hf-col-"], [class*=payment_method_gateway] .hosted-fields-saved-card-form [class*="hf-col-"] {
  padding-left: 8px;
  padding-right: 8px;
  float: left;
  display: inline-block;
  margin-bottom: 15px;
}

[class*=payment_method_gateway] .hosted-fields-single-form .hf-col-2, .wc-block-components-radio-control-accordion-option .hosted-fields-single-form .hf-col-2, [class*=payment_method_gateway] .hosted-fields-saved-card-form .hf-col-2, .wc-block-components-radio-control-accordion-option .hosted-fields-saved-card-form .hf-col-2 {
  width: 100%;
}

[class*=payment_method_gateway] .hosted-fields-single-form .hf-col-1, .wc-block-components-radio-control-accordion-option .hosted-fields-single-form .hf-col-1, [class*=payment_method_gateway] .hosted-fields-saved-card-form .hf-col-1, .wc-block-components-radio-control-accordion-option .hosted-fields-saved-card-form .hf-col-1 {
  width: 50%;
}

[class*=payment_method_gateway] .hosted-fields-single-form .hf-col-1-by-4 .wc-block-components-radio-control-accordion-option .hosted-fields-single-form .hf-col-1-by-4, [class*=payment_method_gateway] .hosted-fields-saved-card-form .hf-col-1-by-4 .wc-block-components-radio-control-accordion-option .hosted-fields-saved-card-form .hf-col-1-by-4 {
  width: 25%;
}

[class*=payment_method_gateway] .hosted-fields-single-form .hf-col-3-by-4 .wc-block-components-radio-control-accordion-option .hosted-fields-single-form .hf-col-3-by-4, [class*=payment_method_gateway] .hosted-fields-saved-card-form .hf-col-3-by-4 .wc-block-components-radio-control-accordion-option .hosted-fields-saved-card-form .hf-col-3-by-4 {
  width: 75%;
}

.wc-blocks-components-select__container #hosted_saved_cards {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

.wc-block-components-form #hf-saved-card-cvv {
  border-left: none;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

#hf-saved-cards-list select, #hf-saved-cards-list .select2 {
  width: 100% !important;
}


.wc-block-components-radio-control-accordion-option .hosted-fields-single-form {
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition: opacity 0.75s ease, height 0.75s ease;
}

.wc-block-components-radio-control-accordion-option--checked-option-highlighted .hosted-fields-single-form {
  opacity: 1;
  height: auto;
  visibility: visible; 
}

.wc-block-components-radio-control-accordion-option .hosted-fields-saved-card-form {
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition: opacity 0.75s ease, height 0.75s ease;
}

.wc-block-components-radio-control-accordion-option--checked-option-highlighted .hosted-fields-saved-card-form {
  opacity: 1;
  height: auto;
  visibility: visible; 
}

@media (min-width: 380px) and (max-width: 1199px) {
  .tabs {
    transform: scale(0.7)
  }
}

@media (min-width: 420px) and (max-width: 1199px) {
  .tabs {
    transform: scale(0.8)
  }
}

@media (min-width: 480px) and (max-width: 1199px) {
  .tabs {
    transform: scale(1)
  }
}

@media (min-width: 767px) and (max-width: 1199px) {
  .tabs {
    transform: scale(0.7)
  }
}

@media (min-width: 1024px) and (max-width: 1199px) {
  .tabs {
    transform: scale(0.9)
  }
}
