@import url('https://www.invitacionesparaeventos.com/i/v2/estilos/fonts/flat2024/thin/uicons-thin-rounded.css?v=1');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100,0..1,-50..200&&display=swap');

:root {
   
  --c_1: #F6C384;  /* colo de titulos y fecha */
  --c_1cc: rgba(246, 195, 132,  0.80);
  --c_1dd: rgba(246, 195, 132,  0.8);
  --c_1_2: rgba(246, 195, 132,  0.5); /* una tonalidad del principal mas clara(fondo del timer) */
  --c_1_3: rgba(246, 195, 132,  0.3);; /* una tonalidad del principal mas oscura */
  
  --c_alpha4: rgba(0, 0, 0, 0.9); /* colores alpha para parallax */
  --c_alpha5: rgba(0, 0, 0, 0.8);
  --c_alpha6: rgba(0, 0, 0, 0.6);
  
  --c_2: #F6C384;   /* color de textos */

  --c_3: #FFF;   /* el color del timer */
  --c_fecha: var(--c_1); /* color de fecha */
  --c_bloques: var(--c_1); /* color de los titulos del bloques*/
  --c_bloques2: var(--c_2); /* color de los textos del bloques*/

  --c_ConfirmarB:  rgba(246, 195, 132, 0.87);
  --c_ConfirmarT: #ffffff;
  --c_ConfirmarH: rgba(246, 195, 132, 0.80);
  --c_RechazarB: rgba(144, 144, 144, 0.87);
  --c_RechazarT: #ffffff;
  --c_RechazarH: rgba(144, 144, 144, 0.80);
  --c_ConfirmarFormB: #ffffff;
  --c_ConfirmarFormT: #000000;
	
	--c_audio: #000;

  --c_sliderB: var(--c_1_3);
  --c_sliderT1: var(--c_1);
  --c_sliderT2: var(--c_2);
  --c_sliderBorder: #var(--c_1);
    
  --f_FF1: 'Red Hat Display', sans-serif;
  --f_FFEspecial: 'Parisienne', cursive;
  --f_FFRegular: 'Asap Condensed', sans-serif;

  --f_F0: 400 normal 6rem var(--f_FF1); /* titulos */
  --f_F1: 400 normal 4.5rem var(--f_FF1); /* titulos */
  --f_F2: 300 normal 3.5rem var(--f_FF1); /* subtitulos/texto */

  --f_FEspecial: 400 normal 10rem var(--f_FFEspecial); /* cursivas */
  --f_FEspecialPeque: 400 normal 3rem var(--f_FFEspecial);

  --f_FRegular: 400 normal 2.4rem var(--f_FFRegular);  /* textos regulares/bloques */
  --f_FRegularMedia: 400 normal 3rem var(--f_FFRegular);  /*  botones, listas peques */
  --f_FTimerNumero: 300 normal 12rem var(--f_FFRegular);  /* fuente numeros timer */
  --f_FTimerTexto: 400 normal 3rem var(--f_FFRegular);  /* fuente texto timer, listanormal */

  
  --line-height: 7rem;
  --border-radius: 1.2rem; /* aplica a imagenes de galerias */
  --letter-spacing: 0.3rem;
	
	
	--anchoCPrograma: 16rem;
}

.fondoBloque0{  background-color: transparent; }
.fondoBloque1{  background-color: var(--c_1); }
.fondoBloque2{  background-color: var(--c_1_2); }
.fondoBloque3{  background-color: var(--c_1_3); }
.fondoBloque4{  background-color: var(--c_alpha4); }
.fondoBloque5{  background-color: var(--c_alpha5); }
.fondoBloque6{  background-color: var(--c_alpha6); }

.derecha{
  width: 60%;
}

.izquierda{
  width: 60%;
  margin-left: 40%
}
.mb_main
{ 
  padding-bottom: 2vw; 
}


.marginmas{
  margin-top: 56px !important;
}

/* termina las clases personalizad as */

body
{
  /* Esta es la fuente que usamos casi en todas partes, la heredamos */
  font: var(--f_F1);
  padding: 0px;
  margin: 0px;
  overflow-x: hidden;
}

.bloque2Icono{
	background-color: var(--c_1);
	color: #FFF;
	width: var(--anchoCPrograma);
	height: var(--anchoCPrograma);
	border-radius: calc(var(--anchoCPrograma)/2);
	vertical-align: middle;
	font-size: calc(var(--anchoCPrograma)*0.4);
	margin-right: calc(var(--anchoCPrograma)*0.2);
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.bloques2 {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	width: auto; 
	margin: 0 auto;
	max-width: 50rem;
}
.bloques2Elemento{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	width: auto !important;
}
.bloques2V .bloques2Elemento{
	flex-direction: column;
	margin: auto;
}
.bloques2V .bloques2Elemento .bloque2Icono{
	margin-right: none;
	margin: auto;
}
.bloques2V .bloques2Linea{
	margin: auto !important;
}
.bloques2V .bloques2Elemento .bloques2Elemento_Ti{
	text-align: center!important;
	margin-top: calc(var(--anchoCPrograma)*0.2);
	margin-bottom: calc(var(--anchoCPrograma)*0.2) !important;
}
.bloques2V .b2L{
	display: none !important;
}

.bloques2Elemento_Ti{
	text-align: left !important;
	margin-bottom: 0rem !important;
	display: flex; /* Add this */
    flex-direction: column; /* Optional, ensures the text stacks vertically */
    justify-content: center; /* This vertically centers the text within the div */
}
.bloques2Linea{
	text-align: left;
	margin-left: calc(var(--anchoCPrograma)*0.5);
	background-color: var(--c_1) !important;
	width: 0.5rem;
	height: calc(var(--anchoCPrograma)*0.3);
	display: block !important;
}


.contenedorScroll
{
  width: 100%;
}
.contenedorInterior
{
  width: var(--anchoContenedorInterior);
  margin: auto;
  padding: 2rem 1rem;
  box-sizing: border-box;
  text-align: center;
}

.headerDinamico_C{
  position: relative;
  width: 100vw;
  height: 41.66vw;
}
.headerDinamico_Ti,.headerDinamico_Te,.headerDinamico_Ta,.headerDinamico_Tb,.headerDinamico3_Ti,.headerDinamico3_Te
{
  position:absolute !important;
  left: 10%;
	bottom: auto;
	top: 26vw;
	width: 80%;
  font-size: 9vw;
  line-height: 13vw;
  text-align: center;
  font-family: var(--f_FFEspecial) !important;
  background-image: none;
  color: var(--c_1);
  filter: none;
}
.headerDinamico_Ta{  
	top: 26vw;
}
.headerDinamico_Te{  
	top: 32vw;
  font-size: 2vw;
  font-family: var(--f_FF1) !important;
  color: var(--c_2);
  filter: none;
}
.headerDinamico_Tb{  
	top: 32vw;
  font-size: 6vw;
}
.cuadroBlanco{
	background-color: var(--c_sliderB);
	padding: 5rem 5rem !important;
}
.separadorImagenSola img{
	width: 100% !important;
}
.parallax__container .parallax
{
	width: var(--anchoPrincipal) !important;
	height: 100% !important;
}
.mb_main{
	margin-top: 5rem;
	margin-bottom: 10rem !important;
}

.audioContenedor
{
  background-color: var(--c_audio) !important;
  box-shadow: 2px 2px 3px var(--c_1)  !important;
}
div:empty
{
  display: none;
}
.columnaListaInvSeparador /* se usan en las listas y listas alternadas */
{
  margin-top: 1rem !important;
}
.columnaListaSeparador
{
  margin-top: 3rem !important;
}

/* cosas del owl que ocultan elementos 
.owl-nav { display: none; }*/

/* lightbox */
.sl-wrapper{ background-color: #ffffffdd; }

/* generales */
.contenedor
{
  width: var(--anchoPrincipal);
    margin: auto;
}


.material-symbols-outlined {
  font-size: 7rem !important;
  padding-bottom: 2rem !important;
  color: var(--c_1);
  font-variation-settings:
  'FILL' 0,
  'wght' 200,
  'GRAD' 0,
  'opsz' 48
}


/* imagenGrande */
.imagenGrandeHeader
{
  width: 100%;
  display: block;
}






/* animacion */
section .setAnim{
    position:fixed ;
    width:100%;
    height:100%;
    top:0;
    left:0;
    pointer-events:none;
    z-index: 1000;
}
section .setAnim div{
    position:absolute ;
    display:block ;
}
section .setAnim div:nth-child(1){
    left:20%;
    animation:animate 15s linear infinite ;
    animation-delay:-7s;
}
section .setAnim div:nth-child(2){
    left:40%;
    animation:animate 25s linear infinite ;
    animation-delay:-5s;
}
section .setAnim div:nth-child(3){
    left:80%;
    animation:animate 20s linear infinite ;
    animation-delay:0s;
}
@keyframes animate{
    0%{ opacity:0; top: -10%; transform:translateX(20px) rotate(0deg); }
    10%{ opacity:1; }
    20%{ transform:translateX(-25px) rotate(45deg); }
    40%{ transform:translateX(-30px) rotate(90deg); }
    60%{ transform:translateX(35px) rotate(180deg); }
    80%{ transform:translateX(-40px) rotate(180deg); }
    90%{ opacity: 1; }
    100%{ opacity:0; top: 110%; transform:translateX(-20px) rotate(225deg); }
}
.set2Anim{ transform:scale(1) rotateY(180deg); }
.set3Anim{ transform:scale(0.8) rotateX(150deg); }
.setAnim div img{ height: 80px; opacity: 0.5 !important}


/* SAVE THE DATE */
.contenedorSave
{
  border: none;
  max-width: 100%;
  margin:auto;
  margin-top: 0 !important;
  margin-bottom: 5rem !important;
}
.contenedorSaveBajo{
	background-color: #000 !important;
  background-size: 100% auto !important;
	height: 120rem;
}
.saveContenedorInterior
{
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}
.save_Ti2
{
  font: var(--f_FEspecial);
  color: var(--c_1);
  margin-bottom: -1rem;

}
.save_Ti
{
  font: var(--f_F0);
  color: var(--c_2);
}
.savePieContenedorInterior
{
  padding-top: 0rem !important;
  padding-bottom: 4rem !important;
}
.savePie_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
}
.savePie_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  max-width: 600px;
  margin:auto;
}


/*  GRACIAS */

.mensajeGracias
{
  font: var(--f_FEspecial) !important;
  color: var(--c_1) !important;
}
.poemaGracias
{
  margin-top: 10rem 0 !important;
  font: var(--f_F2) !important;
  color: var(--c_2) !important;
  line-height: 5rem !important;
}


/* saludo */
.saludoTitulo
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
  margin-top: 1rem;

}
.saludoTexto
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  }


/* textos */
.textos_Ti
{
  font: var(--f_F2);
  color: var(--c_1);
}
.textos_Ti1
{
  /*margin-bottom: 2rem;*/
}
.textos_Ti2
{
  margint-top: 3rem;
}
.textos_Ti3
{
  margint-top: 3rem;
}
.textos_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
}
.textos_Te1
{
  margin-bottom: 2rem;
  line-height: var(--line-height);
}
.textos_Te2
{
  margint-top: 3rem;
  line-height: var(--line-height);
}
.textos_Te3
{
  margint-top: 3rem;
  line-height: var(--line-height);
}


/* fecha */
.fecha
{
  font: var(--f_F2);
  color: var(--c_2);
}
.fecha_Ti
{
  margin-top: 0rem;
  color: var(--c_1);
  font: var(--f_F2);
}
.fecha_Fe
{
  margin-top: 0rem;
  margin-bottom: 0rem;
	font-family:  var(--f_FFsubtitulo) !important;
  color: var(--c_fecha);
  line-height: 15rem !important;
	font-size: calc(var(--font2Size)) !important;
}
.fecha_Te
{
  font-family: var(--f_FEspecialPeque) !important;
  color: var(--c_1);
  margin-bottom: 2rem;
  line-height: var(--line-height);
}


/* Timer */

.timerContenedorInterior
{
  margin-top: 3rem;
	margin-bottom: 3rem;
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}
.timerContenedorInterior img{
	width: 40rem;
}
.timerContenedorNumeros
{
  display:flex;
  flex-direction:row;
  flex-wrap: wrap;
  justify-content:center;
  margin-top:1.5rem;
	margin-bottom: 4rem;
	width: 40rem;
}
.timer_Ti
{
  font: var(--f_F1);
  color: #FFF;
  margin-bottom: 0rem;
	margin-top: 2rem;
}
.timer_Te{
	color: #FFF !important;
	margin-bottom: 2rem;
}
.timer
{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
}
.timerElemento
{
  padding-left: 2rem;
  padding-right: 2.5rem;
  color: var(--c_3);
}
.timerNumero
{
  font: var(--f_FTimerNumero);
  letter-spacing: normal;
  margin-top: 1rem;
}
.timerTexto
{
  font: var(--f_FTimerTexto);
  letter-spacing: normal;
  font-style: normal;
}
.timerReloj
{
	display: none;
}
.timerLinea
{
  width:1px;
  background-color: var(--c_3);
	display: none;
}
.timerContenedor
{
  display: block;
}
.timerRelojDiv{
	display: none !important;
}


/* Lugar */
.lugar_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.lugar_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  margin-bottom: 3rem;
  line-height: var(--line-height);
}
.lugarContenedor
{
  width:80%;
  margin:auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  margin-top: 2rem;
  margin-bottom: 5rem;
}
.lugarColumnaI
{
  width:28%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.lugarColumnaD
{
  width:68%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.lugarColumnaI img
{
  width: 100%;
  border-radius: var(--border-radius);
  display: block;
}
.lugarColumnaS
{
  width:4%;
}
.lugar_Textos
{
  padding: 0rem 0rem;
  text-align: left;
}
.lugar_Te1
{
  font: var(--f_FRegularMedia);
  margin-bottom: 1rem;
  color: var(--c_2);
}
.lugar_Te2
{
  font: var(--f_FRegularMedia) !important;
  margin-bottom: 1rem;
  color: var(--c_2);
}
.lugar_Te3
{
  margin-bottom: 1rem;
  font: var(--f_F2);
  color: var(--c_1);
}
.lugar_Te4
{
  font: var(--f_FRegularMedia) !important;
  color: var(--c_1);
}
.lugarMapa
{
  width: 6rem;
  border-radius: 1rem !important;
  float:left;
  padding: 1rem;
  background-color: #FFF;
}

/* Mesas */

.mesas_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 1rem;
}
.mesas_Te
{
  margin-top: 1rem;
  font: var(--f_F2);
  line-height: var(--line-height);
  color: var(--c_2);
  margin-bottom: 1rem;
}
.mesasContenedor
{
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  padding-bottom: 1rem;
  margin-bottom: 1rem;

}
.mesasLogo
{
  cursor: pointer;
  margin: 0 1rem;
}
.mesasLogo img
{
  border-radius: var(--border-radius);
  height:10rem;
  width: auto;
}



/* Bloques */
.bloques_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin: auto;
  margin-bottom: 2rem !important;
}
.bloques_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  color: var(--c_2);
  margin-bottom: 3rem;
}
.bloques
{
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  margin: auto;
  font-family: var(--f_FFRegular);
  font-style: normal;
  color: black;
  letter-spacing: normal;
  line-height: 1rem;
}
.bloquesElemento
{
  padding: 1rem;
  box-sizing: border-box;
  width: 33%;

}
.bloquesElemento img
{
  margin-bottom: 1.9rem;
  width: 6rem;
}
.bloquesElemento_Ti
{
  font: var(--f_FRegularMedia);
  margin-bottom: 3rem;
  color: var(--c_bloques);
}
.bloquesElemento_Te
{
  font: var(--f_FRegular);
  color: var(--c_bloques2);
}
.bloquesP
{
  /*width: 100%;*/
  display: flex;
  flex-direction: row;
  flex-wrap: wrap !important;
  margin-bottom: 3rem;
}
.bloquesP .material-symbols-outlined{ font-size: 5rem !important;  margin-top: 1rem;}
.bloquesP .bloquesElemento{ width:auto;  margin: 0.5rem 0.5rem;  padding: 0rem 2rem; }
.bloquesP .bloquesElemento:last-child { border-right: 0; }
.bloquesP .bloquesElemento .bloquesElemento_Ti{ font: var(--f_FRegularMedia); margin-bottom: 1rem; }
.bloquesP .bloquesElemento .bloquesElemento_Te{ font: var(--f_FTimerTexto) !important; }
.bloquesV
{
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap !important;
}
.bloquesV .material-symbols-outlined{ font-size: 7rem !important; margin-top: 1rem;}
.bloquesV .bloquesElemento{ width:100%;  margin: 2rem 0.5rem; padding: 0rem 2rem; }
.bloquesV .bloquesElemento .bloquesElemento_Ti{ margin-bottom: 2rem; }
.bloquesV .bloquesElemento .bloquesElemento_Te{ margin-bottom: 2rem; }
.bloquesV .bloquesElemento:not(:last-child):after {
  border-bottom: 1px solid var(--c_1);
  content: '';
  display: block;
  margin-left: 38%;
  margin-top: 4rem;
  width: 24%;
}

/* listaGrandes */
.lGrandes_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.lGrandes_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}

.lGrandes_Imagen
{
  width:80%;
  margin: auto !important;
  height: 50rem;
}
.lGrandes_Imagen img
{
  width: auto !important;
  height: 100% !important;
  margin: auto !important;
  border-radius: var(--border-radius); 
  display: block;
  margin-bottom: 2rem;
}

.lGrandes_label
{
  font: var(--f_FRegularMedia);
  color: var(--c_2) !important;
  letter-spacing: normal;
  margin-bottom: 2.5rem;
  margin-top: -1rem;
}
.lGrandes_ImagenPeque
{
  width: 70% !important;
  margin:auto !important;
}



/* listaColumnas */
.lColumnas_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.lColumnas_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}
.lColumnasCont
{
  width:95%;
  margin:auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
}
.lColumnasCol
{
  width:30%;
  margin-left: 1%;
  margin-right: 1%;
}
.lColumnasCol img
{
  width: 100%;
  border-radius: var(--border-radius);
  display: block;
  margin-bottom: 1rem;
}
.lColumnas_label
{
  font: var(--f_FRegular);
  color: var(--c_2) !important;
  letter-spacing: normal;
  margin-bottom: 3rem;
}


/* listaElegante */
.lElegante_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.lElegante_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}
.lEleganteCont
{
  width:80%;
  margin:auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
}
.lEleganteColumnaI
{
  width:48%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.lEleganteColumnaD
{
  width:48%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.lEleganteColumnaI img
{
  width: 100%;
  border-radius: var(--border-radius);
  display: block;
}
.lEleganteColumnaS
{
  width:4%;
}
.lElegante_Textos
{
  text-align: left;
}
.lElegante_Te1
{
  font: var(--f_FRegularMedia);
  margin-bottom: 1rem;
  color: var(--c_2);
}
.lElegante_Te3
{
  margin-bottom: 1rem;
  font: var(--f_FRegular);
  color: var(--c_1);
  letter-spacing: normal;
}




/* listaNormal */
.lNormal_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.lNormal_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}
.lNormalCont
{
  width:80%;
  margin:auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
}
.lNormalColumnaI
{
  width:38%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.lNormalColumnaD
{
  width:58%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.lNormalColumnaI img
{
  width: 100%;
  border-radius: var(--border-radius);
  display: block;
}
.lNormalColumnaS
{
  width:4%;
}
.lNormal_Textos
{
  /*padding: 1rem 0rem;*/
  
  text-align: left;
}
.lNormal_Te1
{
  margin-bottom: 1rem;
  font: var(--f_F2);
  color: var(--c_2);
}
.lNormal_Te2
{
  margin-bottom: 1rem;
  font: var(--f_FRegular);
  color: var(--c_2);
}
.lNormal_Te3
{
  margin-bottom: 1rem;
  font: var(--f_FRegularMedia);
  color: var(--c_1);
}
.lNormal_Te4
{
  margin-bottom: 1rem;
  font: var(--f_FRegular);
  color: var(--c_2);
}

/* mensajes */
.mensajes_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.mensajes_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}
.mensajesCont
{
  width:50%;
  margin:auto;
  margin-bottom: 2rem;

}
.mensajesCard
{
  padding: 2rem;
  color: var(--c_2);
  font: var(--f_F2);
  border-radius: var(--border-radius);
  border: 1px dashed var(--c_sliderBorder);
  background-color: var(--c_sliderB);
  overflow: hidden;
}



/* slider */
.contenedorSlider
{
  
}
.slider_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.slider_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}
.sliderCont
{
  width:80%;
  margin:auto;
  margin-bottom: 2rem;

}
.sliderCard
{
  font: var(--f_FEspecialPeque);
  padding: 2rem;
  color: var(--c_sliderT);
  border-radius: var(--border-radius);
  margin-right: 0.5rem;
  margin-left: 0.5rem;
  background-color: var(--c_sliderB);
  border: 1px dashed var(--c_sliderBorder);
  overflow: hidden;

}
.sliderCard img
{
  width: 50% !important;
  margin: auto;
  margin-bottom: 2rem;
}
.slider_Te1
{
  margin-bottom: 1rem;
  font: var(--f_F2);
  color: var(--c_sliderT1);
}
.slider_Te2
{
  margin-bottom: 1rem;
  color: var(--c_sliderT2);
  font: var(--f_F2);
}



/* agradecimiento */
.agradecimiento_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.agradecimiento_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}




/* video */
.video_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.video_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}
.videoCont
{
  margin-top: 3rem !important;
  width: 100%;
	max-width: 700px;
  height: 394px;
  overflow: hidden;
  position:relative;
  margin:0 auto;
}


/* iconos */
.iconos_Ti
{
  font: var(--f_F1);
  color: var(--c_1);
  margin-bottom: 2rem;
}
.iconos_Te
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
  margin-bottom: 3rem;
}
.iconosCont
{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  margin: auto;
  width: 90%;
}
.iconosElemento
{
  padding: 1rem;
  box-sizing: border-box;
}
.iconosElemento img
{
  width: 6rem;
}



/* confirmacion */
.formContenedor
{
  padding-top:0;
  padding-bottom: 5rem;
}
.form
{
  width:70%;
  padding: 2rem;
  margin: auto;
  border-radius: 1rem;
  text-align: left;
  box-sizing: border-box;
}
.formTeEsperamos
{
  font: var(--f_F0);
  color: var(--c_1);
  margin-bottom: 1rem;
}
.formTextoPrincipal
{
  font: var(--f_F2);
  color: var(--c_2);
  line-height: var(--line-height);
}
.formTexto
{
  font: var(--f_F2);
  color: var(--c_2);
  letter-spacing: normal;
  text-transform: none;
  margin-bottom: 1rem;
}
.formBotones
{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  margin-top: 2.5rem;
}
.formBoton
{
  font: var(--f_FRegularMedia);
  cursor: pointer;
  padding: 1rem 1rem;
  margin: 0rem 3rem;
  color: var(--c_1);
  width: 25rem;
  text-align: center;
  border-radius: var(--border-radius);
  font-style: normal;
}
.formBotonLargo
{
  padding: 1rem 2rem;
  width: auto;
  font: var(--f_FRegularMedia);
}
.formBotonSi{ background-color: var(--c_ConfirmarB); color: var(--c_ConfirmarT); }
.formBotonSi:hover{ background-color: var(--c_ConfirmarH); }
.formBotonNo{ background-color: var(--c_RechazarB); color: var(--c_RechazarT);}
.formBotonNo:hover{ background-color: var(--c_RechazarH); }
.formCampoText
{
  width: 30%;
  text-align: center;
}

.formCampo
{
  font: var(--f_FRegularMedia);
  color: var(--c_ConfirmarFormT);
  background-color: var(--c_ConfirmarFormB);
  border: none;
  border-radius: var(--border-radius);
  padding: 0.5rem;
  margin-bottom:1rem;
  border: 1px solid var(--c_ConfirmarFormT);
}
.formCampoArea
{
  width: 100%;
  text-align: left;
  height: 10rem;
  padding: 1rem !important;

}
.formQR
{
  width: 20rem;
  height: 20rem;
  margin: 1.5rem 0 1rem 0;
}
.formCancelar
{
  color: var(--c_2);
  font: var(--f_FRegular);
  letter-spacing: normal;
  cursor: pointer;
	text-decoration: underline;
}
.calendarioBadges{
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 2rem 0rem !important;
/*  margin-bottom: 40rem !important;*/
}
.calendarioBadge{
  width: 23%;
  cursor: pointer;
  margin: 0 .2rem;
  max-width: 200px;
}
.calendarioBadge img
{
  width: 100%;
}
.calendarioDiv{
  max-width: 600px;
  margin:auto;
}





/* desarrollo */
.desarrolloCont
{
  padding: 0.3rem;
  box-sizing:border-box;
  text-align: center;
  font: var(--f_FTimerTexto);
  color: white;
  width: 100%;
  margin-bottom: 1rem;
  margin: auto;
  background-color: black;
	position: fixed;
	bottom:0;
	z-index: 4;
}



body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: var(--imagenFondoPrincipal) no-repeat center center;
  background-size: cover;
  background-color: #000;
}
html {
  font-size: 9px;
  background: #000;
}

body {
  min-height: 100vh;
  background: transparent;
}


/*
html
{
	background: var(--imagenFondoPrincipal) no-repeat top center !important;	
	background-attachment: fixed !important;
  background-size: cover !important;
  background-color: #000 !important;
	background-position: center center;
	font-size: 9px;
}*/
.imagenSolaMovil100{
	width: var(--anchoPrincipal) !important;
		padding: 0rem !important;
	margin-top: 2rem;
	margin-bottom: 2rem;
	position:relative;
  display:inline-block;

}
.imagenSolaMovil100 img{
	width: 100% !important;
}
/*
.imagenSolaMovil100:after {
  content:'';
  position:absolute;
  left:0; top:0;
  width:100%; height:100%;
  display:inline-block;
  background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(25, 27, 41,1) 0%, rgba(25, 27, 41,0) 12%, rgba(25, 27, 41,0) 84%, rgba(25, 27, 41,1) 98%, rgba(25, 27, 41,1) 100%);
}*/
.mb_5{
	margin-bottom: 10rem !important;
}
.mt_5{
	margin-top: 10rem !important;
}
.contenedorScroll
{
  background: 
		var(--imagenFondo) repeat-y top center !important; 
  background-size: var(--anchoFondo) auto !important;
	position: relative;
	z-index: 1;
	margin-top: var(--marginTopContenedor);
	
    margin-bottom: calc(var(--marginTopContenedor)*2);
}
.contenedorScrollI{
	display: block !important;
}
.contenedorScrollI1
{
	display: block !important;
	position:absolute;
	background-color: transparent!important;
  top: 15vw;
	bottom: 15vw;
	width: 100%;
  background:	var(--imagenMedio) repeat-y top center;
  background-size: var(--anchoFondo) auto;
  z-index: -999;
}
.calendarioBadges{
	margin-bottom: var(--marginBottomBadges) !important;
}
.contenedorSave .calendarioBadges{
	margin-bottom: var(--marginBottomBadgesSave) !important;
}
.headerDinamico_C{
	width: var(--anchoFondo) !important;
	height: var(--altoHeader) !important;
}
.headerDinamico_Ti{
	font-size: var(--font1Size);
	top: var(--font1Top);
	line-height: var(--font1LH);
	color: var(--c_1t);
	font-weight: 100;
}
.headerDinamico_Ta{
	font-size: var(--font1Size);
	top: var(--font1aTop);
	line-height: var(--font1LH);
		color: var(--c_1t);
	font-weight: 100;

}
.headerDinamico_Tb{
	font-size: calc(var(--font1Size)*.8);
	top: var(--fontAmpTop);
	line-height: calc(var(--font1LH)*.8);
		color: var(--c_1t);
	font-weight: 100;
}
.headerDinamico_Te{
	font-size: var(--font2Size);
	top: var(--font2Top);
	line-height: var(--font2LH);
  font-family: var(--f_FFsubtitulo) !important;
  color: var(--c_2) !important;
	font-weight: 100;
}

.headerDinamico3_Ti{
	font-size: var(--font1Size);
	top: var(--font13Top);
	line-height: var(--font1LH);
	color: var(--c_1t);
	font-weight: 100;
}
.headerDinamico3_Te{
	font-size: var(--font2Size);
	top: var(--font23Top);
	line-height: var(--font2LH);
  font-family: var(--f_FFsubtitulo) !important;
  color: var(--c_2) !important;
	font-weight: 100;
}
.separadorImagenSola img{
	content: var(--imagenSeparador);
	width: 100% !important;
}
.fechaImagenSola{
	width: 100%;
}
.fechaImagenSola img{
	content: var(--imagenFecha);
	width: 100% !important;
	margin-bottom: 5rem;
	margin-top: 0rem !important;
}

.fondoTenue{
	background: var(--imagenTenue) no-repeat center center; 
  background-size: contain;
}
.textoFrase{
	  font-family: var(--f_FFEspecial) !important;
	color: var(--c_1) !important;
	font-size: 5rem;
	line-height: 8rem;
}
.cuadroBlanco{
	background-color: var(--c_sliderB) !important;
	width: 80%;
}




@media only screen and (max-width: 1100px)
{
  html{ font-size: 7px; }
}
@media only screen and (max-width: 1000px)
{
   html{ font-size: 6px; }
  .lugarContenedor{ width: 90%; }
  .lEleganteCont{ width: 90%; }
  .lNormalCont{ width: 90%; }
  .mensajesCont{ width: 70%; }
  .sliderCont{ width: 90%; }
  .iconosCont{ width: 90%; }
  .calendarioBadges{ width: 60%; margin: auto !important; margin-top: 3rem !important; }
  .calendarioBadge{ width: 45%; max-width: 130px;}
}
@media only screen and (max-width: 900px)
{
  html{	font-size: 6px; }
  :root {
   --anchoFondo: 90vw;
    --anchoPrincipal: 90vw;
    --altoHeader: 111vw;
    --font1Size: 9.9vw;
    --font1Top: 87vw;
    --fontAmpTop: 53.4vw;
    --font1aTop: 63vw;
    --font1LH: 18vw;
    --font2Size: 3.9vw;
    --font2Top: 100.5vw;
    --font2LH: 9vw;
    --marginTopContenedor: 3vw;
    --marginBottomBadgesSave: 3vw;
    --marginBottomBadges: 3vw;
    --marginBottomMain: 0vw;
  }
  .lugarMapa{ width: 6rem; }
  .videoCont{ height: 337px; }

}
@media only screen and (max-width: 800px)
{
  html{ font-size: 5px; }
  .lugarContenedor{ width: 95%; }
  .lEleganteCont{ width: 95%; }
  .lNormalCont{ width: 95%; }
  .mensajesCont{ width: 80%; }
  .sliderCont{ width: 95%; }
  .iconosCont{ width: 95%; }
  .form{ width: 80%; }
  .formBoton{ width: 35rem; }
  /* .formCancelar{ font-size: 2.5rem;} */
  .calendarioBadges{ width: 80%; }
}

@media only screen and (max-width: 750px)
{
  html{ font-size: 5px; }
  .lGrandes_Imagen{ width: 90% !important; }

  .columnaListaInvSeparador{ margin-top: 1.5rem !important; }
  .columnaListaSeparador{ margin-top: 1.5rem !important; }
  .videoCont{ height: 281px; }
}


@media only screen and (max-width: 600px)
{
  :root{
    --f_F0: 200 normal 4.8rem var(--f_FF1); /* titulos */
    --f_F1: 200 normal 4.8rem var(--f_FF1); /* titulos */
    --f_F2: 200 normal 4rem var(--f_FF1); /* subtitulos/texto, listas grandes */

    --f_FEspecial: 400 normal 6rem var(--f_FFEspecial); /* cursivas */
    --f_FEspecialPeque: 400 normal 3rem var(--f_FFEspecial);

    --f_FRegular: 400 normal 3.1rem var(--f_FFRegular);  /* textos regulares/bloques  */
    --f_FRegularMedia: 400 normal 3.5rem var(--f_FFRegular);  /*  botones, listas peques */
    --f_FTimerNumero: 400 normal 5rem var(--f_FFRegular);  /* fuente numeros timer */
    --f_FTimerTexto: 400 normal 2.7rem var(--f_FFRegular);  /* fuente texto timer, listanormal */
	}
	
	.fecha_Fe
	{
		font-size: calc(var(--font2Size)) !important;
	}
  
	
	
  .saludoTitulo{ margin-top: 0rem;}
  .lugarContenedor{ width: 100%; }
  .lugarColumnaI{ width: 34% }
  .lugarColumnaD{ width: 62% }
  .lEleganteColumnaI{ width: 48% }
  .lEleganteColumnaD{ width: 48% }
  .lNormalColumnaI{ width: 48% }
  .lNormalColumnaD{ width: 48% }
  .lEleganteCont{ width: 100%; }
  .lNormalCont{ width: 100%; }
  .lColumnasCol{ width: 48%; }
  .mensajesCont{ width: 100%; }
  .sliderCont{ width: 100%; }
  .iconosCont{ width: 100%; }

  .mesasContenedor{ flex-direction: column; }
  .mesasLogo img{ height: 10rem; margin-bottom: 2rem; }

  .bloques{ display: flex; flex-direction: column; flex-wrap: nowrap; align-items: center; width: 100%;  }
  .bloquesElemento{ padding: 0.5rem; width: 80%;  }
  .bloquesElemento img{ margin-bottom: 2rem; width: 6rem; margin-top: 1rem;}
  .bloquesElemento_Ti{  margin-bottom: 2rem; }
  .bloquesElemento_Te{  line-height: 3rem !important; margin-bottom: 2rem;}
  .desarrolloCont img{ width: 25rem;  }
  .videoCont{  height: 253px; }

  .columnaListaInvSeparador{ margin-top: 1rem !important; }
  .columnaListaSeparador{ margin-top: 1rem !important; }

  .form{ width: 90%; padding: 2rem 0 !important;}
  .formBoton{  padding: 1rem 1rem;  margin: 0rem 1rem; }
  .formBotonLargo{  width: auto; padding: 1.5rem 2rem !important;}
  .formCampoArea{ width: 95%}
  .calendarioBadges{ width: 100%; padding: 0 !important; margin-bottom: 20rem !important;}
  
  .lugar_Textos,.lNormal_Textos,.lElegante_Textos{ padding: 0 !important;}
  .columnaListaInvSeparador{ margin-top: 2.5rem !important; }
  .columnaListaSeparador{ margin-top: 2.5rem !important; }
  
  .bloquesP{ flex-wrap: wrap !important; flex-direction: row !important;  align-items: normal !important;}
  .bloquesP .bloquesElemento .bloquesElemento_Ti{  margin-bottom: 1rem; }
.bloquesP .bloquesElemento .bloquesElemento_Te{  }
  .bloquesP .bloquesElemento{ border-right: none; padding: 0rem 2rem; }
  .timerContenedorInterior{ padding-top: 2rem !important; padding-bottom: 4rem !important;}

  .mb_main{ padding-bottom: 2vw; }
	
	
	.lugarContenedor{
		    flex-direction: column;
		width: 70% !important;
	}
	.lugarColumnaI {
    width: 100% !important;
		margin-top: 2rem !important;
	}
	.lugarColumnaD {
    width: 100% !important;
		margin-top: 2rem !important;
	}
	.lugarColumnaS{
		display: none !important;
	}
	.lugarColumnaD.orden3 {
			order: 1 !important;
	}
	.lugarColumnaI.orden3 {
			order: 1 !important;
	}
	
	.mb_5{
		margin-bottom: 6rem !important;
	}
	.mt_5{
		margin-top: 6rem !important;
	}
  .lugarContenedor{ flex-direction: column; }
  .lugarColumnaI,.lugarColumnaD{ width: 100%; }
  .lugarColumnaS{ display: none; }
  .lugarContenedor{.orden3{ order: 1 !important; }}
  .lugarColumnaD{ margin-top: 8px; }
	

}
@media only screen and (max-width: 500px)
{
  .pieElemento{ width: 80%;  }
  .fecha_Ti{ margin-bottom: 1rem; }
  .fecha_Te{ margin-bottom: 1rem;}
  .sliderCard img{ width: 100% !important;}
  .form{ width: 100%; }
  .formBoton{  padding: 0.5rem 0.5rem;  margin: 0rem 2rem; width: 25rem; }
  .formBotonLargo{ width: auto; }
  .videoCont{  height: 213px; }

}
@media only screen and (max-width: 400px)
{
  .pieElemento{ width: 95%;  }
  .formBoton{  padding: 0.5rem 0.5rem;  margin: 1rem; }
  .calendarioBadges{ flex-flow: column; }
  .calendarioBadge{ width: 100%; max-width: 150px; margin: auto !important; margin-bottom: 1rem !important;}
  .videoCont{  height: 168px; }

}