:root {
  --color-rojo: #ae2630;

  --color-principal: #121242;
  --color-secundario: #ae2630;
  --color-gris: rgb(58, 58, 58, 0.9);
}


header {
  height: 30px;
  background: url("../img/fondosuperior.png") center no-repeat;
}

.section-playa {
  background: url("../img/fondo.jpg") center / cover no-repeat;
  height: 100%;
  padding-bottom: 20px;
}

.div-titulo {
  padding-top: 10px;
}

.titulo-principal {
  font-family: Montserrat, sans-serif;
  font-size: 24px;
  text-align: center;
  color: var(--color-principal);
}

.fechas {
  height: 220px;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0px 0px 10px 1px;
  padding: 10px;
  width: 340px;
  position: relative;
}

.row-fechas {
  width: 300px;
  margin-right: 8px;
  margin-left: 8px;
}

.columna-fecha {
  padding-left: 0px;
}

.location-fecha {
  height: 30px;
}

.location-image {
  width: 20px;
}

.row-desde {
  width: 300px;
  margin-right: 8px;
  margin-left: 8px;
}

.fecha {
  border: 1px none var(--bs-border-color) ;
  padding: 0px;
}

.input-fecha {
  border-radius: 0px;
  width: 140px;
}

.hora {
  padding: 0px;
  margin-right: 0px;
  margin-left: 20px;
}

.select-hora {
  text-align: center;
  border-radius: 0px;
}



.div-book-now {
  width: 300px;
  margin: 8px;
}

.btn-book-now {
  font-weight: bold;
  background: var(--color-rojo);
  width: 100%;
  border-style: none;
  margin-top: 2px;
}

.div-fondo-lista {
  height: 160px;
  background: url("../img/fondolista.png");
  box-shadow: 0px 0px 10px 1px;
  padding-top: 5px;
  padding-left: 20px;
  width: 320px;
  margin-top: -5px;
}

.ul-lista {
  font-size: 20px;
  font-weight: bold;
}

.li-lista {
  padding: 3px;
}

.img-lista {
  width: 20px;
}

.row-playa-derecha {
  height: 100%;
}

.img-coche {
  width: 300px;
}

.section-iconos {
  margin-top: 40px;
}

.titulo-iconos {
  font-family: Montserrat, sans-serif;
  font-weight: bold;
  font-size: 16px;
}

.p-iconos {
  font-family: 'Noto Sans', sans-serif;
}


.h2-titulo {
  font-weight: bold;
  font-size: 28px;
  font-family: Montserrat, sans-serif;
}



.div-pie-negro {
  width: 100%;
  color: rgb(255,255,255);
  text-align: center;
  font-size: 12px;
  background: #000000;
  height: 30px;
}

.container-cabecera {
  height: 36px;
}

.div-cabecera {
  height: 30px;
  padding-right: 0px;
  padding-left: 0px;
}

.p-cabecera {
  font-family: 'Noto Sans', sans-serif;
  color: rgb(255,255,255);
  height: 20px;
  font-size: 13px;
}

.img-iconos-cabecera-mail {
  width: 154px;
}

.dropdown-bandera {
  width: 50px;
}

.btn-bandera {
  background: var(--bs-border-color-translucent);
  padding: 0px;
  border-width: 1px;
  border-style: none;
}

.img-bandera {
  height: 30px;
  width: 30px;
}

.dropdown-menu-bandera {
  transform: translateX(-100px);
}


.section-lista-coches {
  background: #f5f6f7;
  padding-top: 8px;
  padding-bottom: 8px;
}

.row-ficha-coche {
  box-shadow: 0px 0px 10px;
  background: #ffffff;
  margin: 0px;
}

.div-ficha-coche {
  padding: 0px;
}

.div-coche-titulo {
  height: 70px;
  padding: 0px;
}

.p-coche-titulo {
  margin: 0px;
  padding: 10px;
  font-size: 20px;
  font-family: Montserrat, sans-serif;
}

.span-coche-titulo {
  font-size: 14px;
  color: rgb(136,145,153);
}

.row-coche-imagen {
  border: 1px solid rgb(186,189,193);
  border-right-style: none;
  border-left-style: none;
  min-height: 280px;
  margin: 0px;
}

.no-padding {
  padding: 0px;
}

.p-coche-tipo {
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 12px;
}

.div-iconos {
  padding-bottom: 12px;
}

.img-coche-iconos {
  margin: 2px;
  height: 24px;
  width: 24px;
}

.div-full {
  padding: 0px;
  background: #f5f6f7;
  min-height: 350px;
  border-bottom: 1px solid rgb(159,162,164);
}

.div-full-titulo {
  height: 70px;
}

.p-full-titulo {
  display: inline;
  font-size: 18px;
  font-family: Montserrat, sans-serif;
  letter-spacing: -1px;
  margin-top: 16px;
  text-align: center;
}

.div-full-precio {
  height: 80px;
  border-top: 1px solid rgb(186,189,193);
}

.p-full-precio {
  font-family: 'Noto Sans', sans-serif;
  font-size: 24px;
  font-weight: bold;
  margin-top: 34px;
}

.div-full-lista {
  min-height: 130px;
}

.ul-full-lista {
  font-size: 11px;
}

.div-full-boton {
  height: 68px;
}

.btn-full {
  width: 80px;
  height: 36px;
  background: var(--bs-gray-600);
  border-radius: 0px;
  border-width: 0px;
}

.div-tariff {
  background: var(--bs-primary);
  padding: 0px;
  min-height: 350px;
}

.row-tariff-titulo {
  background: url("../img/fondorojo.png") right / auto no-repeat;
  margin-right: 0px;
  margin-left: 0px;
  height: 70px;
}


.p-tariff-titulo {
  display: inline;
  font-size: 20px;
  font-family: Montserrat, sans-serif;
  letter-spacing: -1px;
  margin: 0px;
  color: var(--bs-white);
  font-weight: bold;
  text-align: center;
}

.row-oferta {
  margin: 0px;
  height: 24px;
}



.p-precio {
  font-family: 'Noto Sans', sans-serif;
  font-size: 36px;
  font-weight: bold;
  color: rgb(255,255,255);
  text-align: center;
  height: 46px;
}

.row-tariff-lista {
  margin: 0px;
  min-height: 130px;
}

.ul-tariff-lista {
  color: rgb(255,255,255);
  padding: 0px;
  padding-left: 2px;
  margin: 0px;
}

.div-tariff-boton {
  height: 70px;
}

.btn-tariff-select {
  background: var(--color-rojo);
  font-weight: bold;
  width: 120px;
  height: 42px;
  border-radius: 0px;
  border-style: none;
}

.section-resumen {
  background: #f5f6f7;
  border-top-width: 1px;
  border-top-style: solid;
  padding-bottom: 8px;
}

.row-pasos {
  background: var(--bs-primary);
  height: 40px;
  box-shadow: 0px 2px 4px 0px;
  transform: translateZ(2px);
}

.row-resumen {
  background: #ffffff;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
  box-shadow: 0px 2px 4px 0px;
  padding: 4px;
}


.div-precio {
  height: 56px;
}



@media (min-width: 300px) {
  .ul-tariff-lista {
    font-size: 11px;
    letter-spacing: -0.5px;
  }
}

@media (min-width: 576px) {
  .ul-tariff-lista {
    font-size: 14px;
    letter-spacing: 0px;
  }
}

body {
  --bs-primary: #174666;
  --bs-primary-rgb: 0,105,178;
  --bs-secondary: #ff6600;
  --bs-secondary-rgb: 255,102,0;
  font-family: 'Noto Sans', sans-serif;
  --bs-dark: #dd1616;
  --bs-dark-rgb: 0,27,69;
}

@media (min-width: 768px) {
  .ul-tariff-lista {
    font-size: 11px;
    letter-spacing: -0.5px;
  }
}

@media (min-width: 992px) {
  .ul-tariff-lista {
    font-size: 14px;
    letter-spacing: 0px;
  }
}

.btn:hover {
  color: var(--bs-btn-hover-color);
  background: var(--bs-dark);
}

.span-fecha {
  font-size: 12px;
  padding-left: 12px;
}

.p-fecha {
  font-size: 12px;
  margin-bottom: 0px;
}

.form-label {
  font-size: 12px;
  margin-bottom: 0px;
}

a {
  text-decoration: none;
}

a:hover {
  color: var(--bs-white);
}

.p-coche-tipo-automatico {
  background: #bb0000;
  color: var(--bs-white);
  /*width: 150px;*/
  padding-right: 12px;
  padding-left: 12px;
}

.div-tariff-offer {
  background: #213b8e;
  padding: 0px;
}

.p-oferta-superior {
  margin: 0px;
  font-size: 30px;
  font-family: Montserrat, sans-serif;
}

.p-resumen {
  margin: 0px;
}

.section-selecty {
  background: #f5f6f7;
  margin: 0px;
  padding: 10px;
}

.paso-activo {
  border-bottom: 4px solid var(--color-rojo) ;
  box-shadow: -2px 0px 2px 1px;
  height: 40px;
  padding: 0px;
}

.paso-inactivo {
  background: var(--bs-gray-100);
  padding: 0px;
}

.a-paso-activo {
  color: white;
}

.paso-inactivo-texto {
  color: var(--bs-gray-600);
}

.container.rojo {
  margin: 0px;
  padding: 0px;
  height: 40px;
  box-shadow: inset 0px 0px 8px 0px;
  background: rgb(159, 0, 0);
}

.container-rojo {
  background: rgb(159,0,0);
  min-height: 48px;
}

.div-extra {
  height: 50px;
  box-shadow: 0px 0px 8px;
}

.row-extra {
  box-shadow: 0px 0px 8px;
  margin-top: 12px;
  margin-bottom: 12px;
  background: var(--bs-white);
}

.select-extra {
  width: 50px;
  margin: 12px;
  height: 32px;
}

.extra-nombre {
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 0px;
  margin-top: 8px;
}

.extra-descripcion {
  font-size: 12px;
}

.extra-imagen {
  width: 100px;
}

.div-resumen {
  border-bottom: 1px solid var(--bs-gray-400) ;
  padding-bottom: 8px;
  padding-right: 20px;
  padding-top: 8px;
  padding-left: 8px;
  font-family: 'Noto Sans', sans-serif;
}

.column-resumen {
  box-shadow: 0px 0px 8px;
  background: var(--bs-white);
  padding: 0px;
  margin: 12px;
}

.btn-extra {
  background: var(--color-rojo);
  border-radius: 0px;
  border-style: none;
  border-bottom-style: none;
  height: 60px;
  width: 220px;
  font-size: 24px;
}

.section-extras {
  background: #f5f6f7;
  padding-bottom: 100px;
  font-family: Montserrat, sans-serif;
}


.div-pay {
  border: 5px solid var(--bs-red) ;
  margin: 12px;
  padding: 3px;
  font-weight: bold;
}

.div-data-titulo {
  margin-top: 0px;
  margin-right: -12px;
  margin-left: -12px;
  padding-right: 12px;
  padding-left: 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--bs-gray-300) ;
}

.input-check-extra {
  width: 36px;
  height: 36px;
  padding: 0px;
  margin: 18px;
}


.column-data {
  box-shadow: 0px 0px 8px;
  margin-top: 12px;
  margin-bottom: 12px;
  background: var(--bs-white);
  padding-bottom: 16px;
}


.form-data {
  padding-right: 16px;
  padding-left: 16px;
  padding-bottom: 20px;
  padding-top: 12px;
  font-family: 'Noto Sans', sans-serif;
}

.div-texto {
  background: var(--bs-white);
  box-shadow: 0px 0px 10px;
  margin: 12px;
}

.titulo-texto {
  background: var(--bs-primary);
  color: var(--bs-white);
  margin-right: -12px;
  margin-left: -12px;
  padding-right: 12px;
  padding-left: 12px;
  font-weight: bold;
  font-size: 18px;
  padding-top: 6px;
  padding-bottom: 6px;
}



.section-titulo {
  height: 74px;
  background: #f5f6f7;
  border-top: 1px solid var(--bs-gray-500) ;
  padding-top: 12px;
  font-family: Montserrat, sans-serif;
}

.fieldset-driver {
  padding: 10px;
  margin: 0px;
  margin-top: 10px;
  border-radius: 6px;
  border: 1px solid var(--bs-gray-600) ;
}

.img-iconos-cabecera {
  width: 20px;
}

.container-condiciones {
  background: #213b8d;
  padding: 28px;
  margin-bottom: -8px;
}

.input-grupo {
  display: inline-grid;
}

.row-hasta {
  width: 300px;
  margin-right: 8px;
  margin-left: 8px!important;
}

.loading {
  text-align: center;
}

.error{
  font-size: 1rem;
  color:red;
  width: 100%;
}