#columna1,#columna2 {position: relative;}
#columna1 > div,#columna2 > div{
    background-color: #FFFFFF;
    border-radius: 1rem;
}
#columna1 > div , #columna2 > div {
    /* min-height: 690px; */
    height: 75dvh;
    padding: 1rem;
    width: 95%;
    /*overflow-y: scroll;*/
}
#columna2 > div {
    box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.5)
}
.hidden {display: none;}

#step1,#step2,#step3,#step4,#step5 {
    position: absolute;
    transition: opacity 0.5s ease-in-out;
}
#step2,#step3,#step4,#step5 {
    opacity: 0;
    z-index: 0;
}
#step1 {
    z-index: 1;
}

#vehicleBox .close {
    display : none;
}
#vehicleBox .vehicleFrame {
    display : none;
}
#conditionsBox {
    display : none;
}
#insuranceBox {
    display : none;
}
#insuranceBox img{
    width: 100%;
    height: auto;
}
#imgCar {
    position: absolute;
    bottom: -10px;
    right: 4px;
    z-index: 3;
}
#imgCar img {
    width: 100px;
    z-index: 2;
    position: relative;
}
#imgCar img:nth-of-type(1) {
    width: 231px;
    margin-right: -170px;
    position: relative;
    z-index: 1;
    margin-bottom: -10px;
}
#pdf-download-btn {}

input.form-control::placeholder{
    font-weight: 300;
}
input.form-control {
    font-weight: 300;
}
.custom-badge {
    margin: 0;
    padding: 5px 8px;
    vertical-align: super;
    border-radius: 50%;
    background: #036FB9 !important;
    vertical-align: text-bottom;
}

#columna1 form {
    margin-top: 2rem;
}

#vehicleBox, #insuranceBox { position: relative;}
#vehicleBox > div > span, #insuranceBox > div > spa {
    display: block;
}
.vehicleFrame, .insuranceFrame {
    padding: 10px;
    border: 2px solid #efefef;
    border-radius: 10px;
    position: relative;
}
#vehicleBox .close button, #insuranceBox .close button  {
    border: 1px solid #ddd;
    border-radius: 50%;
    padding: 6px;
    font-size: 10px;
    position: absolute;
    top: -10px;
    left: -5px;
    opacity: 0.7;
    background-color: #FFFFFF;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='grey'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");
    z-index: 10;
}
.vehicleFrame span,  .insuranceFrame span {
    font-weight: 300;
}
.insuranceFrame {
    width: 125px;
    height: 100px;
    text-align: center;
}
#insuraceOptions {
    min-height: 100px;
}
.insuranceOption, .termOption {
    display: inline-block;
    text-align: center;
    border: 1px solid #DDDDDD;
    border-radius: 10px;
    padding: 15px;
    margin-right: 10px;
}
.insuranceOption img {
    width: 100px;
    height: 60px;
}
.insuranceOption.selected, .termOption.selected  {
    border-color: #036FB9;
}
.insuranceOption input {
    padding: 0px 0.75rem;
}
.termOption a {text-decoration: none;}

.termOption.disabled {
    border-color: #EFEFEF;
    background: whitesmoke;
}
.termOption.disabled a {
    color: #AAA;
}

#range-right-label{
    position: absolute;
    right: 0;
    top: 50px;
}
#range-left-label{
    position: absolute;
    left: 0;
    top: 50px;
}
#range-center-label {
    font-weight: bold;
    display: contents;
}
#customRange1 {
    display: block;
}

#liveAlertPlaceholder {
    position: fixed;
    bottom: 0;
    z-index: 1000;
}

.loader {
    margin-top: 100px !important;
    width: 16px;
    aspect-ratio: 1;
    background: #79849A;
    box-shadow: 30px 0 #036FB9;
    animation:
      l4-1  1s infinite alternate,
      l4-2 .5s infinite alternate;
    margin: 0 auto;
  }
  @keyframes l4-1 {
     0%,40%   {transform: rotate(0)}
     80%,100% {transform: rotate(.5turn)}
  }
  @keyframes l4-2 {
     80%,100% {box-shadow: 16px 0 #036FB9}
  }

@media (orientation: portrait) {
    #columna1, #columna2 {
        position: absolute;
    }
    #columna1 > div , #columna2 > div {
        height: 100dvh;
    }
}