pre{display:none;}
 .dropdown-menu.show {max-height: 350px!important;}
 ul.dropdown-menu.inner.show {max-height: 250px!important;}
 :root {
 --brand-color: #FFF000;
 --footer-color: #000000;
 --brand-text-color: #000000;
 --button-color: #fff000;
 --secondary-color: #000000;
 --header-color: #000000;
 --header-text-color: #FFF000;
 --footer-text-color: #000000;
 --button-text-color: #000000;
 }

  
 @font-face {
 font-family: 'Pilcrow';
 src: url('https://static.vueling.com/common/css/fonts/vuelingpilcrow-semibold-webfont.woff2') format('woff2');
 font-weight: 600; /* Puedes ajustar esto según el peso real de la fuente */
 font-style: normal; /* Puedes cambiar esto a italic si es necesario */
 }
 .user-container {
 background: #F2F2F2;
 border-radius: 100px;
 padding: 10px;
 top: 6px;
 width: auto;
 }
 .btn {font-size: 16px;}
 * {font-family: 'Source Sans Pro', sans-serif;}
 /* Header */
 .top-header{height: 160px;}
 .top-header__link-logvueling {display: inline-block; height: 100%; vertical-align: middle; margin-left: 0px; text-align: center;}
 .top-header__link-logvueling a svg {vertical-align: middle; height: 67px;}
 
 .top-header-wrapper {
 width: 100%;
 margin: 0 auto;
 /*
 margin-top: 20px;
 background-color: #ffffff;
 */
 background-size: cover; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
 -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
 -moz-background-size: cover; /* optional for Firefox 3.6 */
 -o-background-size: cover; /* for Opera 9.5 */
 height: 94px;
 background-repeat: no-repeat;
 background-position: center 60%;
 }
 figure.top-header__link-logvueling {margin-top: 16px; margin-bottom: 0px;}
 /* End Header */
 
 .logo-padding {padding-left: 0rem;}
   
   .height-body {min-height: 80vh;}
 
 /* Alert  */
 .container-alert {position: relative;}
 .alert {
 position: sticky;
 top: 11px;
 z-index: 1000;
 }
 .alert-error {
 color: var(--brand-text-color);
 background-color: #fff;
 border: 1px solid #FFB13D;
 border-width: 1px 1px 1px 8px;
 border-radius: 8px;
 }
 .alert-info {
 position: sticky;
 top: 70px;
 z-index: 1000;
 color: var(--brand-text-color);
 background-color: #fff;
 border: 1px solid #0497EC;
 border-width: 1px 1px 1px 8px;
 border-radius: 8px;
 }
 #adblock-message {display: none;}
 /* Title */
 h1 {
 text-transform: uppercase;
 color: var(--brand-text-color)!important;
 font-size: 36px!important;
 font-weight: 700;
 line-height: 1.1em;
 margin-top: 0px;
 margin-bottom: 26px;
 text-align: left;
 font-family: 'Pilcrow',Arial, sans-serif !important;
 }
 @media only screen and (max-width: 580px) {
 .title-margin h1 {margin-left: 0px;         margin-top: 30px !important;}
 }
 @media only screen and (max-width: 480px) {
 h1 {font-size: 20px !important;}
 .logo-padding {padding-left: 1rem;}
 .title-margin {margin: auto;}
 .title-margin h1 {padding-left: calc(var(--bs-gutter-x) * .5);}
 }
 /* Background */
 .img-bkg {
 background-image: url(https://news.vueling.com/news/landing/preference.jpg);
 /* background-image: none; */ /* red red red red red */
 background-size: cover;
 background-position: center;
 max-width: 49%;
 
 }
 .margin-form {margin-top: 0rem;}
 @media only screen and (max-width: 480px) {
 .margin-form {margin-top: 0rem;}
 }
 /* Divider */
 .divider {border-top: 1px solid #d4d4d4; margin-top: 15px;}
 /* Checkbox */
 .slds-checkbox [type="checkbox"] {
 width: 25px;
 height: 25px;
 display: inline-block;
 position: relative;
 vertical-align: middle;
 border: 1px solid #DDDBDA;
 border-radius: 0.125rem;
 background: #FFFFFF;
 transition: border 0.1s linear, background-color 0.1s linear;
 }
 /* The container */
 .container-checkbox {
 display: block;
 position: relative;
 padding-left: 35px;
 margin-bottom: 12px;
 cursor: pointer;
 font-size: 22px;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 }
 /* Hide the browser's default checkbox */
 .container-checkbox input {
 position: absolute;
 opacity: 0;
 cursor: pointer;
 height: 0;
 width: 0;
 }
 /* Create a custom checkbox */
 .checkmark {
 position: absolute;
 top: 0;
 left: 0;
 height: 25px;
 width: 25px;
 background-color: #ffffff;
 border-radius: 4px;
 border: 1px solid #4d4d4d;
 }
 /* On mouse-over, add a grey background color */
 .container-checkbox:hover input ~ .checkmark {background-color: #ccc;}
 /* When the checkbox is checked, add a grey background */
 .container-checkbox input:checked ~ .checkmark {background-color: #4d4d4d;}
 /* Create the checkmark/indicator (hidden when not checked) */
 .checkmark:after {
 content: "";
 position: absolute;
 display: none;
 }
 /* Show the checkmark when checked */
 .container-checkbox input:checked ~ .checkmark:after {display: block;}
 /* Style the checkmark/indicator */
 .container-checkbox .checkmark:after {
 left: 9px;
 top: 5px;
 width: 5px;
 height: 10px;
 border: solid white;
 border-width: 0 3px 3px 0;
 -webkit-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 transform: rotate(45deg);
 }
 /* Button */
 .form-button, button.buttonblock, td.buttonblock {
 font-family: 'Pilcrow',Arial, sans-serif !important;
 text-transform: uppercase; font-weight: 600; font-size: 18px;
 }
 .form-button, a.form-button {
 background-color: var(--button-color);
 border: 0px;
 border-radius: 100px;
 color: var(--brand-text-color)!important;
 padding: 16px 24px 16px 24px!important;
 margin-bottom: 0px;
 min-width: 190px;
 width: auto;
 max-width: max-content;
 text-decoration: none;
 }
 
 #submitButton {text-transform: uppercase;}
 /* ############## Footer ############## */
 footer {
 padding: 20px 10%;
 display: block;
 text-align: left;
 margin-top: auto;
 background:   var(--footer-color);
 }
 
 .footer-text {
 display: inline-block;
 color: #ffffff!important;
 font-size: 14px;
 line-height: 1.2em;
 font-weight: 400;
 letter-spacing: 0.25px;
 width: calc(100% - 25px);
 vertical-align: top;
 margin: 6px 0;
 text-align: left;
 }
 
 .terminos_footer {
 text-decoration: underline!important;
 cursor: pointer;
 color: #ffffff!important;
 font-size: 14px;
 line-height: 1.2em;
 font-weight: 400;
 letter-spacing: 0.25px;
 width: calc(100% - 25px);
 vertical-align: top;
 }
 /* ################ Thanks page ############# */
 .thanks {min-height: 60vh;}
 .main_title {
 color: var(--brand-text-color)!important;
 font-size: 29px;
 font-weight: 700;
 line-height: 1.1em;
 margin-top: 0px;
 text-align: left;
 }
 .main_subtitle {
 text-align: left;
 color: var(--brand-text-color);
 font-weight: 600;
 font-size: 24px;
 line-height: 1.15em;
 margin: 48px 0 20px 0;
 }
 
 /* ---------------------- SWITCH -------------------- */
 .switch-container {display: block; position: relative;}
 .switch {
 position: relative;
 display: inline-block;
 width: 60px; /* 60  */
 height: 34px; /* 34 */
 display: inline-block;
 vertical-align: middle;
 margin: 0;
 position: absolute;
 top: 40%; right: 25px;
 transform: scale(0.75) translateY(-50%);
 }
 .switch input {
 opacity: 0;
 width: 0;
 height: 0;
 }
 .slider {
 position: absolute;
 cursor: pointer;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: #E5E5E5;
 -webkit-transition: .4s;
 transition: .4s;
 }
 .disabled {cursor: default;}
 .slider:before {
 position: absolute;
 content: "";
 height: 34px;
 width: 34px;
 left: 0px;
 bottom: 0px;
 background-color: white;
 border: 2px solid black;
 -webkit-transition: .4s;
 transition: .4s;
 }
 .disabled:before {
 position: absolute;
 content: "";
 height: 34px;
 width: 34px;
 left: 0px;
 bottom: 0px;
 background-color: #f8f8f8;
 border: 2px solid #4d4d4d;
 -webkit-transition: .4s;
 transition: .4s;
 }
  
  .disabled {opacity: 0;}  
  
.dropdown-item.active, .dropdown-item:active {
  color: #000000;
  text-decoration: none;
  background-color: #f8f8f8;
}
  
  
 .desactivado span {cursor: default;}
 input:checked + .slider {background-color: var(--secondary-color);}
 input:focus + .slider {box-shadow: 0 0 1px #E5E5E5;}
 input:checked + .slider:before {
 -webkit-transform: translateX(26px);
 -ms-transform: translateX(26px);
 transform: translateX(26px);
 }
 /* Rounded sliders */
 .slider.round {border-radius: 34px;}
 .slider.round:before {border-radius: 50%;}
 /* ################################################### */
 /* ----------------- CONTAINER SHADOW --------------- */
 .container-new {
 margin: auto;
 border: 1px solid #E5E5E5;
 border-radius: 8px;
 background: #fff;
 filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.15));
 }
 
 /* ################################################### */
 a[href]:not(.buttonstyles) {color: #6D6F79; text-decoration: none;}
 
   .dropdown {margin-bottom:10px;}
   
 .dropdownLang {
 padding: 6px 13px;
 text-align: center;
 min-width: 120px;
 /*
 background: url("data:image/svg+xml,<svg height='10px' width='10px' viewBox='0 0 16 16' fill='%23000000' xmlns='http://www.w3.org/2000/svg'><path d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>") no-repeat;
 background-position: calc(100% - 0.75rem) center !important;
 */
 -moz-appearance: none !important;
 -webkit-appearance: none !important;
 appearance: none !important;
 padding-right: 2rem !important;
 border-radius: 5px;
 border: #4d4d4d;
 background-color: #f1f1f1;
 float: right;
 right: 20px;
 }
 .filas {min-height: 90px;}
 form {
   max-width: 900px;
   margin: auto;
   background: #f8f8f8;
    border-radius: 16px;
    padding: 0px 24px 24px 24px;
    margin-top: 24px;
    width: auto;
   }
 .ancho {width: 97%;}
 @media (max-width: 720px) {
 .ancho {width: 100%;}
 .filas {width: 100%; margin: auto; margin-bottom: 5px!important;}
 form, .form-cont {max-width: 100%; margin: auto; margin-top: 10px;}
 form div {padding-left:  0px!important; padding-right:  0px!important;}
 .slider {transform: translateX(20px);}
 }
 .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {width: 100%;}
 .dropdown-item.active, .dropdown-item:active {
 color: #ffffff;
 text-decoration: none;
 background-color: #000000;
 }
 .bootstrap-select>.dropdown-toggle {
 border-radius: 4px;
 border: 1px solid #B3B3B3;
 background-color: #ffffff;
 color: #666666;
  font-size: 1em;
  padding-left: 5%;
 }
 /* error - falta seleccionar dropdown  */
 .aviso {color: #C53026; font-weight: regular; font-size: 16px; line-height: 14px;  }
 .error {border-color: #C53026!important;}
 /* select - flecha desplegable */
 select, .dropdown-toggle::after {
 appearance: none;
 background-image: url('https://news.vueling.com/news/landing/arrow-down.svg');
 background-position: right center;
 background-repeat: no-repeat;
 background-size: 16px;
 padding-right: 20px; /* para que la flecha no cubra el texto del menú */
 height: 30px;

 }
 .dropup .dropdown-toggle::after {border-bottom: 0px;}
 .btn-check:active+.btn-light:focus, .btn-check:checked+.btn-light:focus,
 .btn-light.active:focus, .btn-light:active:focus,
 .show>.btn-light.dropdown-toggle:focus {
 box-shadow: none!important;
 }
 .bootstrap-select .dropdown-toggle:focus,
 .bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
 outline: 1px solid var(--secondary-color)!important;
 }

 /* aplicar 'active' con borde nuevo  */
 .btn-check:active+.btn-light, .btn-check:checked+.btn-light, .btn-light.active,
 .btn-light:active, .show>.btn-light.dropdown-toggle {outline: 1px solid var(--secondary-color)!important;}
 /* input texto en desplegable */
 .form-control:focus {
 color: var(--brand-text-color)!important;
 background-color: #fff!important;
 border-color: var(--secondary-color)!important;
 border: none!important;
 outline: 1px solid var(--secondary-color)!important;
 box-shadow: none!important;
 }
 /* ---------------------- email input -------------------- */
 button:focus {
 color: #212529;
 background-color: #fff;
 border-color: var(--secondary-color);
 outline: 0;
 box-shadow: none;
 }
 .btn-check:focus+.btn-light, .btn-light:focus {
 border-color: var(--secondary-color);
 outline: 0;
 box-shadow: none;
 }
 button:focus-visible, .dropdown:focus-visible, .bootstrap-select:focus-visible {
 border-color: var(--secondary-color);
 outline: 0;
 box-shadow: none;
 outline-color: rgb(0, 0, 0);
 }
 .formfield-input input {
 background-color: #FFFFFF;
 border: 1px solid #B3B3B3;
 border-radius: 4px;
 color: var(--brand-text-color);
 width: 97%;
 padding: 0px 20px;
 transition: border 0.1s linear, background-color 0.1s linear;
 display: inline-block;
 line-height: 1.875rem;
 font-size: 1em;
 min-height: 43px;
 }
     
 .formfield-input select {
background-color: #FFFFFF;
 border: 1px solid #B3B3B3;
 border-radius: 4px;
 color: var(--brand-text-color);
 width: 100%;
 padding: 0px 2%;
 transition: border 0.1s linear, background-color 0.1s linear;
 display: inline-block;
 line-height: 1.875rem;
 font-size: 1em;
 min-height: 43px;
  }
   
   .cta_container {margin-top: 30px!important; padding-left: 0px!important;}

  .slant {
  -webkit-transform: skewX(0deg) skewY(-6deg);
  -moz-transform: skewX(0deg) skewY(-6deg);
  transform: skew(0) skewY(-6deg);
  text-align: left;
  }
  
  header {
   /* position: fixed; */ /* superponer cuando haya video o imagen */
   top: 0;
   width: 100%;
   z-index: 1000;
   transition: all 0.3s ease;
   background: transparent;
  }

  header.scrolled {
   background: white;
   height: 60px; /* Ajusta la altura según lo que necesites */
  }

  header .top-header__link-logvueling svg {
   transition: all 0.3s ease;
  }

  header.scrolled .top-header__link-logvueling svg {
   width: 100px; /* Ajusta el tamaño según lo que necesites */
   height: auto;
  }

  header .top-header__link-logvueling svg  path.path-black {
  transition: all 0.3s ease;
   fill: black; /* Logo blanco por defecto  - cambiar a 'white' */
  }

  header.scrolled .top-header__link-logvueling svg  path.path-black {
   fill: black; /* Logo negro al hacer scroll */
  }

  
  
  /* CHECKBOX */
  
    .form-check-input {width: 2em; height: 2em; border: 1px solid var(--secondary-color);}
  .form-check .form-check-input {
  float: left;
  margin-left: -3em;
}
  
  .form-check {
  min-height: 2em;
  padding-left: 3em;
  margin-bottom: 1em;
}
  
  .form-check-input:checked {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
}
  
  .form-check-label {vertical-align: middle; min-height: 1em;}
  
   /* STICKY HEADER */
  
  input.slds-input {
 background-color: #FFFFFF;
  border: 1px solid #B3B3B3;
  border-radius: 4px;
  color: #666666;
  width: 100%;
  padding: 0px 5%;
  transition: border 0.1s linear, background-color 0.1s linear;
  display: inline-block;
  line-height: 1.875rem;
  font-size: 1em;
  min-height: 43px;
  margin-bottom: 10px;
}

  
  /* alinear thanks page */
  .alinear {
  min-height: 50vh;
  transform: translateY(50%);
  }
   
   /* footer */
   @media only screen and (min-height: 1000px) {
     footer {
          position: fixed;
          bottom: 0;
          width: 100%;
     }
   }
   
   select, .dropdown-toggle::after {
    apperance: auto !important;
   }
  
   .header-video {
 position: relative;
background-color: #fff000 !important;
 background: url('https://news.vueling.com/news/2024/YellowDay/YellowDay.jpg') no-repeat center center scroll;
  background-size: contain;
 height: 250px;
 /*  min-height: 25rem; */
 width: 100%;
 overflow: hidden;
 }
 .header-video video {
 position: absolute;
 top: 50%;
 left: 50%;
 min-width: 100%;
 min-height: 100%;
 width: auto;
 height: auto;
 z-index: 0;
 -ms-transform: translateX(-50%) translateY(-50%);
 -moz-transform: translateX(-50%) translateY(-50%);
 -webkit-transform: translateX(-50%) translateY(-50%);
 transform: translateX(-50%) translateY(-50%);
 }
 .header-video .container {
 position: relative;
 z-index: 2;
 }
 .header-video .overlay {
 position: absolute;
 top: 0;
 left: 0;
 height: 100%;
 width: 100%;
 /*
  background-color: #000000;
background: url('') black no-repeat center center scroll;
  */
  background-size: contain;
 opacity: 0.1;
 z-index: 1;
 }
 /* Media Query for devices withi coarse pointers and no hover functionality */
 /* This will use a fallback image instead of a video for devices that commonly do not support the HTML5 video element */
 @media (pointer: coarse) and (hover: none) {
 .header-video {
 background: url('https://news.vueling.com/news/2024/YellowDay/YellowDay.jpg') no-repeat center center scroll;
 }
 .header-video video {
 display: none;
 }
 }

  .slant {
  -webkit-transform: skewX(0deg) skewY(-6deg);
  -moz-transform: skewX(0deg) skewY(-6deg);
  transform: skew(0) skewY(-6deg);
  text-align: left;
  }
  
  header {
   /* position: fixed; */ /* superponer cuando haya video o imagen */
   top: 0;
   width: 100%;
   z-index: 1000;
   transition: all 0.3s ease;
   background: transparent;
  }

  header.scrolled {
   background: white;
   height: 60px; /* Ajusta la altura según lo que necesites */
  }

  header .top-header__link-logvueling svg {
   transition: all 0.3s ease;
  }

  header.scrolled .top-header__link-logvueling svg {
   width: 100px; /* Ajusta el tamaño según lo que necesites */
   height: auto;
  }

  header .top-header__link-logvueling svg  path.path-black {
  transition: all 0.3s ease;
   fill: black; /* Logo blanco por defecto  - cambiar a 'white' */
  }

  header.scrolled .top-header__link-logvueling svg  path.path-black {
   fill: black; /* Logo negro al hacer scroll */
  }

  
  
  /* CHECKBOX */
  
    .form-check-input {width: 2em; height: 2em; border: 1px solid var(--secondary-color);}
  .form-check .form-check-input {
  float: left;
  margin-left: -3em;
}
  
  .form-check {
  min-height: 2em;
  padding-left: 3em;
  margin-bottom: 1em;
}
  
  .form-check-input:checked {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
}
  
  .form-check-label {vertical-align: middle; min-height: 1em;}
  
   /* STICKY HEADER */
  
  input.slds-input {
 background-color: #FFFFFF;
  border: 1px solid #B3B3B3;
  border-radius: 4px;
  color: #666666;
  width: 100%;
  padding: 0px 5%;
  transition: border 0.1s linear, background-color 0.1s linear;
  display: inline-block;
  line-height: 1.875rem;
  font-size: 1em;
  min-height: 43px;
  margin-bottom: 10px;
}

  
  /* alinear thanks page */
  .alinear {
  min-height: 50vh;
  transform: translateY(50%);
  }
   
   /* footer */
   @media only screen and (min-height: 1000px) {
     footer {
          position: fixed;
          bottom: 0;
          width: 100%;
     }
   }
   
    .form-button  {
    padding-top:20px; }
 @media (max-width: 640px) {
   .header-video {height: 30vh; background-size: contain !important;
     background-color: #ffec02 !important;
     background: url(https://news.vueling.com/news/2024/YellowDay/YellowDayResp.jpg) no-repeat center center scroll;
    }}
   .top-header__link-logvueling a svg {height:37px;}
   .top-header-wrapper {height: 64px;}
   .cta_container {margin-top: 10px!important; padding-left: 0px!important;}
   .filas {margin-bottom: 24px;}
   .form-check, .form-check .form-check-input {margin-left: 0px;}
   .form-check-label {width: 88%;  padding-left: 10px;}
     .form-button, button.buttonblock, td.buttonblock {margin-top: 0px;}
    .cta_container {margin-top: 0px;}
   footer {padding: 20px;}
   
}
 @media (max-width: 640px) {
   .header-video {height: 30vh; background-size: contain !important;
     background-color: #ffec02 !important;
     background: url(https://news.vueling.com/news/2024/YellowDay/YellowDayResp.jpg) no-repeat center center scroll;
    }}
   .top-header__link-logvueling a svg {height:37px;}
   .top-header-wrapper {height: 64px;}
   .cta_container {margin-top: 10px!important; padding-left: 0px!important;}
   .filas {margin-bottom: 24px;}
   .form-check, .form-check .form-check-input {margin-left: 0px;}
   .form-check-label {width: 88%;  padding-left: 10px;}
   .form-button, button.buttonblock, td.buttonblock {margin-top: 0px;}
   .cta_container {margin-top: 0px;}
   footer {padding: 20px;}
   
}

/* Estilos generales para el formulario */
form, #formIntro {
  width: auto !important; /* Ancho para la versión mobile */
  max-width: 90% !important;
  padding: 30px !important;

}

#formIntro {
  max-width: 100% !important;
}

form.row > table {
  max-width: 50% !important;
}

/* Media query para pantallas de escritorio */
@media (width > 959px) {

  form, #formIntro {
    width: 960px; !important /* Ancho para la versión desktop */
    max-width: 960px !important;
    padding: 30px !important;
  }

  form.row > table {
    max-width: 100% !important;
  }
}

textarea {
  width: 100%;
  max-width: 100%;
  padding: 10px 20px;
}

#legal-conditions {
  font-style: italic;
  font-size: 10px;
  line-height: 1.5em;
}

.legal-conditions {
  font-style: italic;
  font-size: 11px;
  line-height: 1.5em;
}

select#RequestReasson {
  padding-left: 20px;
}

.fade:not(.show) {
  opacity: revert
}

.popover-content {
  background-color: #f8f8f8 !important;
}

.popover-inner,
.popover.fade.left.in {
  border: transparent !important;
}