@import url("https://fonts.googleapis.com/css2?family=Inter:wght@500;600;700&display=swap");
html {
  position: relative;
}

#formulario-inicio h1,
#formulario-servicio h1,
#formulario-detalle h1,
#formulario-resumen h1 {
  font-size: 1.5em;
}

@media (max-width: 768px) {
  #formulario-inicio h1,
  #formulario-servicio h1,
  #formulario-detalle h1,
  #formulario-resumen h1 {
    font-size: 1.4em;
  }
}

.sec2_servicio {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 3em;
}

.h2ArticleSeleccion_servicio {
  font-size: 1rem;
  font-family: "inter", sans-serif;
  font-weight: 500;
}

.contentFlex_servicio {
  display: flex;
  gap: 1em;
}

.btnSeleccion_servicio {
  width: 174px;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 0.625em;
  background-color: white;
  border: 1px solid #e2e2e2;
  cursor: pointer;
  font-family: "inter", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
}

.btnSeleccion_servicio:hover,
.btnSeleccion_servicio:focus {
  background-color: rgba(94, 129, 247, 0.2);
  outline: none !important;
}

.btnSeleccionado_servicio {
  color: #5e81f7;
  border: 1px solid #5e81f7;
  background-color: rgba(94, 129, 247, 0.2);
  & .precio {
    color: #5e81f7;
  }
}

.precio_servicio {
  font-family: "inter", sans-serif;
  font-weight: 700;
  font-size: 1rem;
  margin: 50px;
}

figure.btnSeleccion_servicio {
  margin: 0;
}

.btnSeleccion_servicio:first-child {
  position: relative;
  & .pAbsolute_servicio {
    width: 100%;
    left: 0;
    color: #ff4e4e;
    font-family: "inter", sans-serif;
    font-size: 0.65rem;
    font-weight: 600;
  }
}

.h2Pasajeros_servicio,
.h2Sec4_servicio {
  font-size: 1rem;
  font-family: "inter", sans-serif;
  font-weight: 500;
}

.pasajeros_servicio {
  width: 100%;
  margin: 0 auto;
}

.cantidadPasajeros_servicio {
  display: flex;
  gap: 1em;
  margin-bottom: 2em;
}

@media (max-width: 768px) {
  .cantidadPasajeros_servicio {
    gap: 0.5em;
  }
}

.cantidadPasajeros_servicio button {
  width: 49px;
  height: 49px;
  border-radius: 0.625em;
  border: 1px solid #e2e2e2;
  font-size: 1.125rem;
  font-family: "inter", sans-serif;
  font-weight: 700;
  background-color: white;
  cursor: pointer;
  /*color: #5e81f7;*/
}

.cantidadPasajeros_servicio button:hover,
.cantidadPasajeros_servicio button:focus {
  /*background-color: rgba(94, 129, 247, 0.2);*/
  border-color: #5e81f7 !important;
  outline: none;
}

.sec3_servicio {
  width: 100%;
  margin: 0 auto;
}

.dflexHeader_servicio {
  display: flex;
}

.dflexHeader_servicio button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  margin-top: 5px;
  margin-left: 5px;
}

.dflexHeader_servicio button:hover,
.dflexHeader_servicio button:hover {
  background-color: rgba(94, 129, 247, 0.2);
  border-radius: 50px;
}

.petsLabel_servicio,
.luggage_servicio {
  font-size: 1rem;
  font-family: "inter", sans-serif;
  font-weight: 500;
}

.formPets_servicio {
  background-color: white;
  border: 1px solid #e2e2e2;
  height: 63px;
  border-radius: 0.625em;
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin-bottom: 2em;
}

input[type="checkbox"] {
  width: 28px;
  height: 28px;
  border-radius: 0.5em;
  background-color: #e2e2e2;
  cursor: pointer;
}

.luggage_servicio {
  border: 1px solid #5e81f7;
  padding: 1em 1em;
  border-radius: 0.625em;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  background-color: white;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1em;
  color: #5e81f7;
  cursor: pointer;
}

.luggage_servicio:hover,
.luggage_servicio:focus {
  background-color: rgba(94, 129, 247, 0.2);
}

.sec4_servicio {
  width: 100%;
  margin: 0 auto;
}

.sec4_servicio form textarea {
  width: 100%;
  height: 55px;
  border-radius: 0.625em;
  border: 1px solid #e2e2e2;
  margin-bottom: 2em;
}

.enlaces_servicio {
  display: flex;
  gap: 1em;
}

.back_servicio,
.proceed_servicio {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  font-family: "inter", sans-serif;
  font-weight: 700;
  width: 174px;
  height: 40px;
  border-radius: 0.625em;
  border: 2px solid #5e81f7;
  line-height: 55px;
  text-align: center;
  text-decoration: none;
  color: #5e81f7;
}

.back_servicio {
  color: #747474;
  border-color: #747474;
}

.back_servicio:hover,
.back_servicio:focus {
  color: #fff;
  background-color: #e2e2e2;
  border-color: #747474;
}

.proceed_servicio {
  background-color: #5e81f7;
  color: white;
}

.proceed_servicio:hover,
.proceed_servicio:focus {
  color: #5e81f7;
  background-color: #fff;
  border-color: #5e81f7;
}

.btnPassengers_servicio:hover {
  background-color: rgba(94, 129, 247, 0.2);
}

.cantidadPasajeros_servicio .colorPassengers_servicio {
  border: 1px solid #5e81f7;
  background-color: #5e81f7;
  color: #fff;
  /*Cambio version 4*/
}

.popupService_servicio,
.popupPets_servicio,
.popupLuggage_servicio {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: fit-content;
  z-index: 99999;
  width: 98%;
  background-color: white;
  border-radius: 1.25em;
  padding: 1em;
  display: none;
  bottom: 8%;
}

@media (max-width: 380px) {
  .popupService_servicio,
  .popupPets_servicio,
  .popupLuggage_servicio {
    width: 96%;
    position: fixed;
  }
  .scrollcustom {
    height: 100vh;
    overflow-y: auto;
  }
  .bgGray_servicio,
  .figcaption_servicio {
    height: 55px;
  }

  .luggage_servicio {

    padding: 0.5em 1em;

  }
}

.popupLuggage {
  bottom: 0%;
}

.pT_servicio {
  padding-top: 1em;
}

.cerrar_servicio {
  width: 100%;
  background: transparent;
  border: 0;
  text-align: end;
  padding-right: 0 !important;
}

.cerrar_servicio:hover,
.cerrar_servicio:focus {
  background-color: transparent;
  outline: none;
  border: none;
}

.cerrar_servicio img,
.cerrar_servicio img {
  background-color: transparent;
  padding: 5px;
  border-radius: 50px !important;
}

.cerrar_servicio img:hover,
.cerrar_servicio img:focus {
  background-color: rgba(94, 129, 247, 0.2);
}

.btnDetails_servicio {
  background: transparent;
  border: 0;
}

.btnDetails_servicio:hover,
.btnDetails_servicio:focus {
  outline: none !important;
  background: transparent !important;
}

.dFlex_servicio {
  display: flex;
  gap: 1em;
  border: none !important;
}

.dflex_servicio_custom {
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.moreInfo_servicio {
  text-align: center;
  display: block;
  padding: 1em 2em;
  background-color: #5e81f7;
  color: white;
  border-radius: 0.625em;
  font-family: "inter", sans-serif;
  font-size: 1rem;
  font-weight: 700;
  border: 0;
  width: 100%;
  margin-bottom: 2em;
  margin: 1rem 0;
  border: 1px solid transparent;
}

.moreInfo_servicio:hover,
.moreInfo_servicio:focus {
  background-color: #fff !important;
  color: #5e81f7;
  outline: none !important;
  border-color: #5e81f7;
}

.moreInfo2_servicio {
  text-align: center;
  display: block;
  width: 100%;
  font-family: "inter", sans-serif;
  font-size: 1rem;
  font-weight: 700;
  color: black;
}

.mostrarService_servicio,
.mostrarPets_servicio,
.mostrarLuggage_servicio {
  display: block;
}

.sombra_servicio {
  background-color: rgba(0, 0, 0, 0.5);
}

.sec1Popup_servicio,
.sec2Popup_servicio,
.sec4Popup_servicio {
  opacity: 0.2;
}

.h2Info_servicio,
.pInfo_servicio {
  font-family: "inter", sans-serif;
  font-weight: 500;
  font-size: 1rem;
}

.pInfo_servicio,
.pInfo2_servicio {
  font-size: 0.875rem;
  color: #747474;
}

.pInfo2_servicio {
  color: black;
}

.alinear_servicio {
  width: 114px;
  border-radius: 5px;
  border: 1px solid #e2e2e2;
  text-align: center;
}

.luggageH3_servicio,
.figcaption_servicio {
  font-family: "inter", sans-serif;
  font-weight: 600;
  font-size: 0.6875rem;
  margin: 0;
  line-height: 28px;
}

.figure_servicio {
  margin: 0;
}

.bgGray_servicio,
.figcaption_servicio {
  background-color: #f5f5f5;
  height: 28px;
}

.imgLugggage_servicio {
  max-width: 100%;
  height: 72px;
}

.mbSecPopupLuggage_servicio {
  margin-bottom: 1em;
}

.sharedTransport_servicio {
  margin-top: 0;
}

.luggageh2,
.luggageh2select {
  font-family: "inter", sans-serif;
  font-weight: 500;
  font-size: 1.375rem;
}

.luggageh2select {
  font-size: 1rem;
}

.pInfoLuggage {
  font-family: "inter", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  color: #747474;
}

img {
  max-width: 100%;
}

.dflexHeader {
  display: flex;
  align-items: center;
}

.mostrarCheckBoxPets {
  display: flex !important;
}

.fontsize-custom {
  font-size: 1.3rem;
}

.wcustom {
  width: 2rem;
}
