/***** IMPORTAR LAS FUENTES *****/
@font-face 
{
  font-family: CORMORANT;
  src: url(../fonts/CORMORANT-MEDIUM.ttf) format("truetype");
}
@font-face 
{
  font-family: BACALISTIES;
  src: url(../fonts/BACALISTIES.ttf) format("truetype");
}


/***** VARIABLES *****/
:root 
{
  /* FONT-SIZES */
  --font_size_modal_cuestionario: 1.5rem;
  --textos: 0.75rem;
  --textos0: 0.875rem;
  --textos1: 1.125rem;
  --textos2: 1rem;
  --textos3: 1.25rem;
  --textos4: 1.375rem;
  --textos5: 1.5rem;
  --textos5_1: 2rem;
  --textos5_2: 2.25rem;
  --textos5_3: 2.5rem;
  --textos5_4: 2.875rem;
  --textos6: 3.125rem;
  --textos7: 4rem;
  --textos8: 3.5rem;

  /* FONT FAMILY */
  --font_family_titulos: BACALISTIES, sans-serif;
  --font_family_redaccion: CORMORANT, sans-serif;

  /* COLORS */
  --blanco: rgba(255,255,255,1); /*rgba(255,255,255,1)*/
  --gris_oscuro: rgba(51,51,51,1); /*rgba(51,51,51,1)*/
  --gris_claro: #e1e1e1;
  --negro:  rgba(0,0,0,1); /* rgba(0,0,0,1) */

  --color_titulo:  rgba(255,190,175,1); 
  --color_botones:  rgba(138,128,128,1);
  --color_redaccion:  rgba(255,255,255,1);

  
  --blanco_transparente:  rgba(255,255,255,0.5);
  --negro_transparent: rgba(0,0,0,0.8);
  --color_botones_transparent:  rgba(138,128,128, 0.8); 
  --color_botones_transparent05:  rgba(138,128,128,0.5); 
  --color_botones_transparent03:  rgba(138,128,128,0.3);
  --color_titulo05:rgba(255,190,175,0.5); 

}



/***** GENERAL *****/

  html, body
  {
	  font-family: var(--font_family_redaccion);
	  color: var(--color_redaccion);
	  font-size: var(--textos1);
	  margin: 0;
	  padding: 0;
  }
  body
  {
	   background: url(../images/fondos/fondo2.jpg) no-repeat center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
  }

/***** PARA EL LOADER *****/
  .preloader-background 
  {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--blanco);
    opacity: 0.8;
    position: fixed;
    z-index: 999999;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }
  .lds-heart 
  {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
    transform: rotate(45deg);
    transform-origin: 40px 40px;
  }
  .lds-heart div 
  {
    top: 32px;
    left: 32px;
    position: absolute;
    width: 32px;
    height: 32px;
    background: var(--color_titulo);
    animation: lds-heart 1.0s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  .lds-heart div:after,
  .lds-heart div:before 
  {
    content: " ";
    position: absolute;
    display: block;
    width: 32px;
    height: 32px;
    background: var(--color_titulo);
  }
  .lds-heart div:before 
  {
    left: -24px;
    border-radius: 50% 0 0 50%;
  }
  .lds-heart div:after 
  {
    top: -24px;
    border-radius: 50% 50% 0 0;
  }
  @keyframes lds-heart 
  {
    0% {
      transform: scale(0.95);
    }
    5% {
      transform: scale(1.1);
    }
    39% {
      transform: scale(0.85);
    }
    45% {
      transform: scale(1);
    }
    60% {
      transform: scale(0.95);
    }
    100% {
      transform: scale(0.9);
    }
  }

/***** PARA EL BUTTON TOP PAGE *****/
  .btn-floating
  {
    background-color: var(--color_botones_transparent);

  }
  .btn-floating:hover
  {
    background-color: var(--color_botones);
  }
  .btn-floating i
  {
    font-size: var(--textos5);
    line-height: inherit!important;
  }


/***** PARA EL BOTON FLOATING *****/
  .audio-floating-btn
  {
    bottom: 100px;
  }
  .audio-floating-btn ul li .btn-floating i
  {
    width: var(--textos5);
    color: var(--blanco);
  }

/***** PARA LOS MODALES GENERAL *****/
  .modal
  {
	  width: 80%!important;
	  height: 100%!important;
	  max-height: 75%!important;
  }
  .title_cards_modales
  {
	  font-family: var(--font_family_titulos);
	  color: var(--color_titulo);
  }
  .body_text_modal
  {
    color: var(--color_titulo);
  }

/***** PARA EL MODAL DE CONFIRMACIÓN CUESTIONARIO *****/
  #modal_mensaje
  {
     width: 80%!important;
     font-size: var(--textos5);
     height: auto!important;
  }
  #modal_ceremonia, #modal_recepcion, #modal_ceremonia .modal-footer, #modal_recepcion .modal-footer
  {
    background: rgba(48, 53, 73, 1);
  }
  .modal_text_texto
  {
    color: var(--color_redaccion)!important;
  }

/***** PARA EL IFRAME DE MAPS *****/
  .maps
  {
    width: 100%;
    height: 250px;
  }

/***** PARA LOS BOTONES *****/
  .bg-buttons,.bg-buttons:hover,.bg-buttons:focus
  {
    background-color: var(--color_botones);
    font-weight: bolder;
    color: var(--blanco);
    font-family: var(--font_family_redaccion);
  }
  
/***** PARA EL MENU *****/
    
  #mobile-demo /***** Para el menu *****/
  {
    background-color: var(--color_botones_transparent05);
    width: 275px; 
  }
  .sidenav li>a /***** Para las letras del menu  *****/
  {
    -webkit-transition: background-color .3s;
    transition: background-color .3s;
    font-size: var(--textos0);
    color: var(--blanco);
    font-weight: 600;
    display: block;
    padding: 0 10px;
    cursor: pointer;
    font-family: var(--font_family_redaccion);
  }
      @media (max-width: 767px)
      {
        .sidenav li>a
        {
          font-size: var(--textos0);
        }
      }

  .sidenav li>a:hover /***** Para el hover de las letras del menu *****/
  {
    background-color: var(--color_botones_transparent03);
  }
  .li_inicio /***** Para los li del sidenav left *****/
  {
    margin-top: 30%;
  }
      @media (min-width: 768px) and (max-width: 1199px) 
      { 
        .li_inicio
        {
          margin-top: 45%!important;
        }
      }
      @media (max-width: 767px)
      {
        .li_inicio		
        {
          margin-top: 10%;
        }  
      }
  .li_cont /* Para los elementos del menú */
  {
    margin-top: 5%;
  }
      @media (max-width: 767px)
      {
        .li_cont
        {
          margin-top: 0;
        } 
      }
  
  #iconArrow /*Para el icono para abrir el menú*/
  {
    height: 56px;
    line-height: 56px;
    position: absolute;
    z-index: 9;
    left: 20px;
    color: var(--blanco);
    top: 50%;
    background-color: var(--color_botones_transparent)!important;
  }
  #iconArrow i /* Para el icono de abrir el menu sidenavleft */
  {
    font-size: var(--textos5);
  }
  .close_icon_sidenav /* Para cerrar el menu left sidenav */
  {
    color: var(--blanco);
    font-size: var(--textos1);
    position: absolute;
    right: 10px;
  }
  #iconHamburguer  /* Para el icono hamburguer abrir el menu */
  {
    height: 56px;
    line-height: 56px;
    color: var(--gris_oscuro);
    position: absolute;
    z-index: 9;
    left: 20px;
    font-size: var(--textos1);
  }

/***** PARA LOS TEXTOS *****/
  .font5
  {
    font-size: var(--textos5);
  }
  .font0
  {
    font-size: var(--textos0);
  }
  .font1
  {
    font-size: var(--textos1);
  }
  .font3
  {
    font-size: var(--textos3);
  }

/*****  PARA LAS CARDS *****/

  .title_cards /* Titulos de las tarjetas */
  {
	  font-family: var(--font_family_titulos);
	  color: var(--color_titulo);
  }
  .mycard /* En caso de que se quiera poner algun adorno a las tarjetas de las mesas de regalo Habilitar */
  {
	  border: 10px double var(--color_botones);
	  background-color: transparent;
  }

/***** PARA LA INVITACIÓN EN VIDEO O IMAGEN *****/
  #overlay 
  {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--negro_transparent);
    z-index: 99999;
    cursor: pointer;
  }
  #text_invitacion
  {
    position: absolute;
    font-size: var(--textos3);
    color: var(--blanco);
    right: 0;
    padding:20px!important;
  }
  #video
  {
    position: absolute;
    top: 52%;
    left: 50%;
    font-size: var(--textos6);
    color: var(--blanco);
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    outline: none;
    border: 0;
  }
      @media (max-width: 767px) 
      {
        #video
        {
        width: 100%;
        }
      }
  
  #overlay .video_invitacion 
  {
    width: 55%; /*55*/
    max-width: 80%; /*80*/
    max-height: 100%;
  }
      @media (max-width: 767px) 
      {
        #overlay .video_invitacion 
        {
        width: 80%;
        max-width: 80%;
        max-height: 90%;
        }
      }

/***** PARA EL PARALLAX PRINCIPAL *****/
  
  #parallax-container-principal /* Abarcamos el 100% del alto de la pantalla */
  {
	  height: 100vh;
  }
  .parallax-container #img_parallax_principal_movil img  /* Para la imagen del fondo del celular */
  {
      transform: translate3d(0, 0, 0);
      transform:  scale(0.95) translateY(10%) translateX(-50%)!important; /* Agregar este si la imagen es muy grande */
      -webkit-transform: translate3d(0, 0, 0);

      /*-webkit-transform:  scale(0.35) translateY(100%) translateX(-143%)!important;*//*Agregar este si la imagen es muy grande*/
      /* -webkit-transform:  translateY(0%) translateX(-46%)!important; */
      /* transform:  translateY(0%) translateX(-46%)!important; */
  }
  .parallax-container #img_parallax_principal img /* Para la imagen del fondo de portada principal */
  {
    /* HABILITAR TODOS LOS BLOQUES Y JUGAR CON LOS PORCENTAJES SI LA PORTADA ES GRANDE */
    /* -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); */
    /* -webkit-transform:  scale(0.8) translateY(40%) translateX(-60%)!important; Agregar este si la imagen es muy grande */
    /* -webkit-transform:  translateY(40%) translateX(-60%)!important; */
    /* transform:  translateY(40%) translateX(-60%)!important; */
    transform:  scale(1) translateY(10%) translateX(-50%)!important; /* Agregar este si la imagen es muy grande */
  }
      @media (min-width: 1500px)
      { 
        #img_parallax_principal
        {
          height: 100vh;
        }
      }  
      @media (max-width: 1280px) 
      {
        .parallax-container #img_parallax_principal img /* Para la imagen del fondo de portada principal */
        {
          /* HABILITAR TODOS LOS BLOQUES Y JUGAR CON LOS PORCENTAJES SI LA PORTADA ES GRANDE */
          /* -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0); */
          /* -webkit-transform:  scale(0.8) translateY(40%) translateX(-60%)!important; Agregar este si la imagen es muy grande */
          /* -webkit-transform:  translateY(40%) translateX(-60%)!important; */
          /* transform:  translateY(40%) translateX(-60%)!important; */
          transform:  scale(1) translateY(0) translateX(-50%)!important; /* Agregar este si la imagen es muy grande */
        }
      }
  .seccionportada  /* Contiene principal el emblema y el contador */
  {
    width: 90%!important;
    position: absolute;
    bottom: 5%;
    left: 35%;
    
  }
      @media (max-width: 1280px) 
      {
        .seccionportada  /* Contiene principal el emblema y el contador */
        {
          bottom: 30%;
          left: 15%;
        }
      }
      @media (min-width: 768px) and (max-width: 1199px) 
      { 
        .seccionportada  /* Contiene principal el emblema y el contador */
        {
          bottom: 100px;
          left: 5%;
        }
      }  
      @media (max-width: 767px) 
      {
        .seccionportada  /* Contiene principal el emblema y el contador */
        {
          bottom: 120px;
          left: 5%;
        }
      }
       

  .seccionportada div.contenedor_emblema .logoemblema
  {
	  width:350px;
	  /*filter: brightness(0) saturate(100%) invert(100%) sepia(97%) saturate(2%) hue-rotate(66deg) brightness(105%) contrast(100%);*/
  }
      @media (max-width: 767px) 
      {
        .seccionportada div.contenedor_emblema .logoemblema
        {
          width:250px;
          /*filter: brightness(0) saturate(100%) invert(100%) sepia(97%) saturate(2%) hue-rotate(66deg) brightness(105%) contrast(100%);*/
        }
      }

/***** PARA AGREGAR SOMBRA AUN CONTENEDOR O IMAGEN *****/
  .drop 
  { 
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.8)); 
  }

/***** PARA EL CONTADOR *****/
  #timerCont
  {
    font-family: var(--font_family_redaccion);
    font-size: var(--textos0);
    font-weight: bold;
    background-color: var(--color_botones_transparent05);
    color: var(--blanco);
    margin-top: -20px; /*Colocamos para que este un poo más pegado al emblema*/
    border-radius: 5px;
  }
      @media (max-width: 767px) 
      {
        #timerCont
        {
          font-size: var(--textos);
          margin-top: -25px;
          color: var(--blanco);
        }
      }


  

/***** PARA LOS TITULOS DE LAS SECCIONES *****/
  .section_title
  {
	  font-family: var(--font_family_titulos);
	  font-size: var(--textos7);
	  text-transform: capitalize;
	  color: var(--color_titulo);
  }
      @media (max-width: 767px) 
      {
        .section_title
        {
          font-size: var(--textos5_3);
        }
      }
  .section_title_encabezado
  {
    font-family: var(--font_family_redaccion);
	  font-size: var(--textos8);
	  text-transform: uppercase;
	  color: var(--color_titulo);
    letter-spacing: 10px;
  }
      @media (max-width: 1280px) 
      {
        .section_title_encabezado
        {
          font-family: var(--font_family_redaccion);
          font-size: var(--textos5_1);
          text-transform: uppercase;
          color: var(--color_titulo);
          letter-spacing: 10px;
        }
      }

/***** PARA LOS SUBTITULOS DE LAS SECCIONES *****/
  .subtitle_section_title
  {
    font-family: var(--font_family_redaccion);
    font-size: var(--textos5_1);
    text-transform: capitalize;
    color: var(--color_titulo);
  }
      @media (max-width: 767px) 
      {
        .subtitle_section_title
        {
          font-size: var(--textos5);
        }
      }
  .subtitle2_section_title
  {
    font-family: var(--font_family_titulos);
    font-size: var(--textos6);
    color: var(--color_titulo);
  }
      @media (max-width: 767px) 
      {
        .subtitle2_section_title
        {
          font-size: var(--textos5_2);
        }
      }
  .redaccion_seccion
  {
    font-family: var(--font_family_redaccion);
    font-size: var(--textos5_1);
    color: var(--color_redaccion);
  }
      @media (max-width: 767px) 
      {
        .redaccion_seccion
        {
          font-size: var(--textos5);
        }
      }
/***** PARA LOS FONDOS DE LAS SECCIONES *****/
  #section_ubication
  {
	   background: url(../images/fondos/fondo4.jpg) no-repeat center center; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
  }
      @media (max-width: 767px) 
      {
        #section_ubication
        {
           background: url(../images/fondos/fondo5.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
        }  
      }
  #section_cronograma
  {
    background: url(../images/fondos/fondo8.jpg) no-repeat center center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
      @media (max-width: 767px) 
      {
        #section_cronograma
        {
          background: url(../images/fondos/fondo1.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
        }  
      }
  #section_dresscode
  {
    background: url(../images/fondos/fondo6.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover; 
    color: var(--blanco)!important;
  }
  #section_dresscode .section_title
  {
    color: #2F3448!important;
  }
  #section_dresscode .nota_dresscode
  {
    color: #2F3448!important;
    margin-top: 150px;
  }
      @media (max-width: 767px) 
      {
        #section_dresscode
        {
          background: url(../images/fondos/fondo7.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover; 
        }
        #section_dresscode .section_title
        {
          
          color: #2F3448!important;
        }
        #section_dresscode .nota_dresscode
        {
          margin-top: 50px;
        }
      }

  #section_savedate
  {
    background: url(../images/fondos/fondo4.jpg) no-repeat center center ; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    
  }
      @media (max-width: 767px) 
      {
        #section_savedate
        {
          background: url(../images/fondos/fondo5.jpg) no-repeat center center ; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover; 
        }
        
      }

  #section_hashtag
  {
    background: url(../images/fondos/fondo8.jpg) no-repeat center center ; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
      @media (max-width: 767px) 
      {
        #section_hashtag
        {
          background: url(../images/fondos/fondo1.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
        }
      }
  #section_otros
  {
    background: url(../images/fondos/fondo6.jpg) no-repeat center center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; 
  }
  #section_otros .section_title
  {
    color: #2F3448!important;
  }
  #section_otros .nota_dresscode
  {
    color: #2F3448!important;
    
  }
      @media (max-width: 767px) 
      {
        #section_otros
        {
          background: url(../images/fondos/fondo7.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
        }
      }
  #section_section_lluvia_sobres
  {
    /* background: url(../images/fondos/fondo4.png) no-repeat center center ;  */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
      @media (max-width: 767px) 
      {
        #section_lluvia_sobres
        {
          /* background: url(../images/fondos/fondo5.png) no-repeat center center;  */
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
        }
      }

  #section_comentarios
  {
    background: url(../images/fondos/fondo10.jpg) no-repeat center center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
      @media (max-width: 767px) 
      {
        #section_comentarios
        {
          background: url(../images/fondos/fondo9.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
        }
      }

  #section_salud
  {
    background: url(../images/fondos/fondo8.jpg) no-repeat center center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
      @media (max-width: 767px) 
      {
        #section_salud
        {
           background: url(../images/fondos/fondo1.jpg) no-repeat center center; 
          -webkit-background-size: cover;
          -moz-background-size: cover;
          -o-background-size: cover;
          background-size: cover;
        }
      }
      
  #section_agradecimientos
  {
    background: url(../images/fondos/fondo2.jpg) no-repeat center center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
      @media (max-width: 767px) 
      {
        #section_agradecimientos
        {
            background: url(../images/fondos/fondo3.jpg) no-repeat center center; 
          -webkit-background-size: contain;
          -moz-background-size: contain;
          -o-background-size: contain;
          background-size: contain;
        }
      }
    #section_hospedaje
    {
      background: url(../images/fondos/fondo10.jpg) no-repeat center center; 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }
        @media (max-width: 767px) 
        {
          #section_hospedaje
          {
              background: url(../images/fondos/fondo9.jpg) no-repeat center center; 
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
          }
        }

/***** PARA LINEA VERTICAL *****/
  .vl 
  {
    border-left: 3px solid var(--color_titulo);
    height: 200px;
    width: 1px;
    position: relative;
    left: 50%;
    margin-left: -3px;
  }

/***** PARA EL CRONOGRAMA DE IMAGEN  *****/
  .cronograma_img
  {
	  width: 40%;
  }
      @media (max-width: 767px) 
      {
        .cronograma_img
        {
          width: 100%;
        }
      }

/***** PARA EL ICONO DE INSTAGRAM EN FORMATO TEXTO*****/
  #section_hashtag i.icono_instagram
  {
	  color: var(--color_titulo);
  }

/***** PARA EL TEXTO DEL HASHTAG *****/
  #section_hashtag p.texto_hashtag
  {
    text-transform: revert;
  }

/***** PARA EL ENLACE DEL HASHTAG *****/
  #section_hashtag a.enlace_hashtag
  {
	  color: var(--color_titulo);
	  font-weight: bold;
  }
  #section_hashtag a.bg-button-ig, #section_hashtag a.bg-button-ig:hover, #section_hashtag a.bg-button-ig:focus
  {
	  background-color: var(--color_botones)!important;
	  font-weight: bolder;
	  color: var(--blanco)!important;
	  font-family: var(--font_family_redaccion)!important;
  }

/***** PARA LA SECCIÓN DE MESA DE REGALOS *****/
  .mi-container-mesa
  {
    /* width: 100%!important; */
  }
    @media (max-width: 767px) 
    {
      .mi-container-mesa
      {
        width: 100%!important;
      }
    }

/***** CAROUSEL PARA LIBRO DE FIRMAS *****/
  .carousel-libro-firmas .carousel-item 
  {
    background-color: var(--color_botones_transparent); 
    color: var(--blanco); 
    opacity: 1;
    overflow-y: auto;
    padding: 80px 50px 80px 50px;
  }
  .carousel-libro-firmas .indicators .indicator-item.active
  {
    background-color: var(--color_redaccion);;
  }
  .carousel-libro-firmas .indicators .indicator-item
  {
    background-color: var(--color_redaccion);;
  }

/***** PARA EL FORMULARIO *****/  
  [type="checkbox"].filled-in:checked+span:not(.lever):after /* Para los checkbox*/
  {
    top: 0; 
    width: 20px;
    height: 20px;
    border: 2px solid var(--color_titulo)!important;
    background-color: var(--color_titulo)!important;
    z-index: 0;
  }
  textarea.materialize-textarea:focus:not([readonly]) /* Para los text area que no son readonly*/
  { 
    border-bottom: 1px solid var(--color_titulo); 
    -webkit-box-shadow: 0 1px 0 0 var(--color_titulo); 
    box-shadow: 0 1px 0 0 var(--color_titulo);
  }
  .inpuColor /* Para inputs en especifico */
  {
    color: var(--color_titulo);
  }
  .input-field-color label /* para los inputs en general */
  {
    color: var(--color_titulo);
  }
  .input-field-color input,.input-field-color textarea /* label input text underline focus color */
  {
    border-bottom: 1px solid var(--color_titulo)!important;
  }
  .input-field-color input:focus + label, .input-field-color textarea:focus + label /* label titulo focus color */
  {
    color: var(--color_titulo)!important;
  }
  .input-field-color input:focus, .input-field-color textarea:focus/* label input text underline focus color */
  {
    border-bottom: 1px solid var(--color_titulo)!important;
    box-shadow: 0 1px 0 0 var(--color_titulo)!important;
  }
  .input-field-color input:focus,.input-field-color textarea:focus /* label input text underline focus color */
  {
    border-bottom: 1px solid var(--color_titulo)!important;
    box-shadow: 0 1px 0 0 var(--color_titulo)!important;
  }
  [type="radio"]:checked+span:after, [type="radio"].with-gap:checked+span:after /* Para el radibutton */
  {
    background-color: var(--color_titulo);
    border: 2px solid var(--color_titulo);
  }
  .input-field-colorFN label 
  {
    color: var(--color_titulo);
  }
  .input-field-colorFN input,.input-field-colorFN textarea /* label input text underline focus color */
  {
    border-bottom: 1px solid var(--color_titulo)!important;
  }
  .input-field-colorFN input:focus + label, .input-field-colorFN textarea:focus + label /* label titulo focus color */
  {
    color: var(--color_titulo)!important;
  }
  .input-field-colorFN input:focus, .input-field-colorFN textarea:focus/* label input text underline focus color */
  {
    border-bottom: 1px solid var(--color_titulo)!important;
    box-shadow: 0 1px 0 0 var(--color_titulo)!important;
  }
  .input-field-colorFN input:focus,.input-field-colorFN textarea:focus /* label input text underline focus color */
  {
    border-bottom: 1px solid var(--color_titulo)!important;
    box-shadow: 0 1px 0 0 var(--color_titulo)!important;
  }
  .dropdown-content li>a, .dropdown-content li>span 
  {
    font-size: 16px;
    color: var(--color_titulo);
    display: block;
    line-height: 22px;
    padding: 14px 16px;
  }
  .select-wrapper .caret 
  {
    fill: var(--color_titulo);
  }
  .select-wrapper input.select-dropdown 
  {
    color: var(--color_titulo);
  }
  #alert_questions /*´Para el alert del form */
  {
    font-size:10px;
    padding: 8px;
    border-radius: 3%;
    background-color: var(--color_titulo);
  }

/***** PARA EL FOOTER *****/
  .page-footer
  {
    background-color: var(--blanco);
  }
  .page-footer .footer-copyright
  {
    color: var(--gris_oscuro);
    background-color: var(--blanco);
  }

/***** PARA LA IMAGEN DE SEPRACION (FLECHA) *****/
    .img_separacion
    {
      width: 10px;
    }
      @media (max-width: 767px) 
      {
        .img_separacion
        {
          width: 5px
        }
      }

/***** PARA QUE SE MUESTREN CORRECTAMENTE LAS IMAGENES DE LOS PARRALAX ******/
    .parallax-container .mi_parallax 
    {
      z-index: 1;
    }

/***** PARA LAS SECCIONES DE LOS PARALLAX IMAGENES *****/
    .parallaxlast2
    {
      transform: translateX(0) translateY(0) scale(1)!important;
    }
        @media (max-width: 767px) 
        {
          .parallaxlast2
          {
            transform: translateX(-15%) translateY(5%) scale(0.6)!important;
          }
        }
    .parallaxlast3
    {
      transform: translateX(0) translateY(70%) scale(0.8)!important;
    }
        @media (max-width: 767px) 
        {
          .parallaxlast3
          {
            transform: translateX(10%) translateY(30%) scale(0.4)!important;
          }
        }

/* Para el contenedor especifico de la fecha, en caso de ser texto colocamos el color */
      .seccionportada div#contenedor_fecha
      {
        color: var(--color_titulo);
        font-family: var(--font_family_redaccion);
        margin-top: -100px; /* Para que se encuentre un poco pegado al logo en caso de tener si no comentar */
      }
          @media (max-width: 767px) 
          {
            .seccionportada div#contenedor_fecha
            {
              color: var(--color_titulo);
            }
          }
      #section_agradecimientos div#contenedor_fecha
      {
        color: var(--color_titulo);
        font-family: var(--font_family_redaccion);
        font-size: var(--textos5_4);
        
      }
          @media (max-width: 767px) 
          {
            #section_agradecimientos div#contenedor_fecha
            {
              color: var(--color_titulo);
              font-size: var(--textos5_1);
            }
          }
/***** PARA EL CARUSEL DE VESTIMENTA *****/
      .carousel-mujeres
      {
        margin-top: 0px;
        margin-bottom: -250px;/*Para que no quede mucho espacio en blanco*/
      }
      .carousel-hombre
      {
        margin-top: 0px;
        margin-bottom: -190px;/*Para que no quede mucho espacio en blanco*/
      }
            @media (max-width: 767px) 
            {
              .carousel-mujeres
              {
                margin-top: 0px;
                margin-bottom: -250px;/*Para que no quede mucho espacio en blanco*/
              }
              .carousel-hombre
              {
                margin-top: 0px;
                margin-bottom: -190px;/*Para que no quede mucho espacio en blanco*/
              }
            }

    

/***** EN CASO DE HABER GALERIA REVUELTA GRID *****/
  /* ---- isotope ---- */
  /*.grid {
	background: #fffff9;
  }
  .grid:after {
	content: '';
	display: block;
	clear: both;
  }
  .grid-sizer,
  .grid-item {
	width: 33.333%;
  }

  .grid-item {
	float: left;
  }

  .grid-item img {
	display: block;
	max-width: 100%;
  }*/

/***** PARA EL IDIOMA *****/

  /*Habilitar en caso de haber textos para cambiar de idioma*/
  /* .idiomas a
  {
	   text-decoration: underline;
	   color: #4c1c56;
	   font-weight: 600;
  } */

  /***** PARA EL TAB MENU DE GALERIAS EN CASO DE HABER MÁS DEL SAVE THE DATE *****/
  /* #menu_galeria .tab a:hover, #menu_galeria .tab a.active 
  {
	  background-color: transparent;
	  color: var(--color_botones);
  }
  #menu_galeria .indicator 
  {
	  position: absolute;
	  bottom: 0;
	  height: 2px;
	  background-color: var(--color_botones);
	  will-change: left, right;
  }
  .tabs .tab a 
  {
	  color: var(--color_botones_transparent05);
	  display: block;
	  width: 100%;
	  height: 100%;
	  padding: 0 24px;
	  font-size: 14px;
	  text-overflow: ellipsis;
	  overflow: hidden;
	  -webkit-transition: color .28s ease, background-color .28s ease;
	  transition: color .28s ease, background-color .28s ease;
  } */

/***** PARA CUANDO SE HAGA EL SCROLL LAS IMAGENES DE FONDO TENGAN ESE EFECTO *****/
  /* @supports ( -webkit-touch-callout : none) 
  {
    #section_ubication,
    #section_cronograma,
    #section_dresscode,
    #section_savedate,
    #section_hashtag,
    #section_otros,
    #section_comentarios,
    #section_salud,
    #section_agradecimientos,
    #section_hospedaje,
    #section_lluvia_sobres
    {
      background-attachment:inherit;
    }
  }  */
  @supports not ( -webkit-touch-callout : none) 
  {
    #section_ubication,
    #section_cronograma,
    #section_dresscode,
    #section_savedate,
    #section_hashtag,
    #section_otros,
    #section_comentarios,
    #section_salud,
    #section_agradecimientos,
    #section_hospedaje,
    #section_lluvia_sobres
    {
      background-attachment: fixed;
    }
  }

  .text_texto_color_titulo
  {
    color: var(--color_titulo05)!important;
  }
  .morephotos
  {
    display: none;
  }















































  







  













  

  




/***** PARA EL PARALLAX PRINCIPAL *****/
  
  
  
  .parallaxlast22
  {
	  transform: translateX(0%) translateY(10%) scale(1)!important;
  }
  .parallaxlast23
  {
	  transform: translatex(0%) translateY(35%) scale(1)!important;
  }
 
  /* Para el contenedor especifico del emblema, en caso de ser texto colocamos el color */
  .seccionportada div.contenedor_emblema
  {
	  color: var(--blanco);
  }
  
  .seccionportada div.contenedor_fecha .fecha
  {
	  border-top: 3px solid rgba(152,122,54,1);
	  border-bottom: 2px solid rgba(152,122,54,1);
	  
  }
  .seccionportada div.contenedor_nombre_novios .nombre_novios
  {
	  font-family: var(--font_family_redaccion);
	  color: var(--color_redaccion);
	  font-size: var(--textos5);
	  margin-top: -75px;/*Vara que se encuentre un poco pegado al logo en caso de tener si no comentar*/
  }
  


/***** PARA LOS TITULOS DE LAS SECCIONES *****/
 
  .section_redaB
  {
	  color: var(--color_redaccionB);
  }
  .section_title2
  {
	  font-family: var(--font_family_redaccion);
	  font-size: var(--textos5);
  }
  .section_titleDressCode
  {
	  font-family: var(--font_family_titulos);
	  font-size: var(--textos7);
	  text-transform: capitalize;
	  color:  rgb(0,42,68);
  }



/***** PARA EL MENSAJE DE LOS DRESS CODE *****/
  .dress-code-msj
  {
	  font-size: var(--textos1);
	  z-index: 99999999;
	  margin-top: -0px;
	  color: var(--blanco);
  }
  .dress-code-msj-general
  {
	  font-size: var(--textos1);
	  color: var(--blanco);
	  font-weight: bold;
  }
  #dress-code-msj-subtitulo
  {
	  font-family: var(--font_family_redaccion);
	  color: var(--blanco);
  }



/***** PARA EL TEXTO DE LOS BANNERS MENSAJES *****/

  .section_redaccion1 h4, .section_redaccion2 h4, .section_redaccion3 h4
  {
	  font-family: var(--font_family_redaccion);
	  color: var(--gris_oscuro);
  }
/***** PARA LAS SECCIONES DE LAS REDACCIONES *****/
  .section_redaccion1
  {
		background: url(../images/FONDOS/#!) no-repeat center center; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
  }
  .section_redaccion2
  {
		background: url(../images/FONDOS/#!) no-repeat center center; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
  }
  .section_redaccion3
  {
		background: url(../images/FONDOS/#!) no-repeat center center;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
  }


	  .filter-switch label {
		  cursor: pointer;
		}
		.filter-switch-item input:checked + label {
		  color: inherit;
		}
		.filter-switch-item input:not(:checked) + label {
		  --bg-opacity: 0;
		  box-shadow: none;
		}
		
		.filter-switch label {
		  cursor: pointer;
		}
		.filter-switch-item input:checked + label {
		  color: inherit;
		}
		.filter-switch-item input:not(:checked) + label {
		  --bg-opacity: 0;
		  box-shadow: none;
		}
		

/***** EN CASO DE HABER UN VIDEO O MENSAJE DE INTRO A LA PÁGINA *****/
  .myintroiframe
  {
	  width: 100%;
	  height: 100%;
  }


 


/* Móviles en horizontal o tablets en vertical
------------------------------------------------------------------------- */
@media (max-width: 767px) 
{


.section_title2
  {
	  
	  font-size: var(--textos5);
  }



.dress-code-msj
{
  margin-top: -235px;
  font-size: var(--textos0);
}
.dress-code-msj-general
{
  font-size: var(--textos0);
  margin-top: 60px;
  
}
#dress-code-msj-subtitulo
{
  font-size: var(--textos0);
}






.section_redaccion1
{
	background: url(../images/FONDOS/#!) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.section_redaccion2
{
	background: url(../images/FONDOS/#!) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.section_redaccion3
{
	background: url(../images/FONDOS/#!) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.section_redaccion1 h4, .section_redaccion2 h4, .section_redaccion3 h4
{
  font-size: var(--texto5);
}

.nombres_familiares
{
   font-size: 1.3rem;
}

}

/* Móviles en vertical
------------------------------------------------------------------------- */
@media (max-width: 480px) 
{ 









.section_title2
  {
	  font-family: var(--font_family_redaccion);
	  font-size: var(--textos5);
  }



.dress-code-msj
{
  margin-top: -235px;
  font-size: var(--textos0);
}
.dress-code-msj-general
{
  font-size: var(--textos0);
  margin-top: 60px;
  
}
#dress-code-msj-subtitulo
{
  font-size: var(--textos0);
}











.section_redaccion1
{
	background: url(../images/FONDOS/#!) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.section_redaccion2
{
	background: url(../images/FONDOS/#!) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.section_redaccion3
{
	background: url(../images/FONDOS/#!) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.section_redaccion1 h4, .section_redaccion2 h4, .section_redaccion3 h4
{
  font-size: var(--texto5);
}

.nombres_familiares
{
   font-size: 1.3rem;
}

}

/* Móviles en horizontal o tablets en vertical
------------------------------------------------------------------------- */
@media (max-width: 767px) 
{
.parallaxlast
{
  transform: scale(0.8);
}
.parallaxlast23
{
  transform: translatex(0%) translateY(-45%) scale(0.5)!important;
}
.parallaxlast3
{
  transform: translatex(-20%) translateY(10%)!important;
}

}
/* Móviles en vertical
------------------------------------------------------------------------- */
@media (max-width: 480px) 
{ 
.parallaxlast
{
  transform: scale(0.5);
}
.parallaxlast3
{
  transform: translatex(-20%) translateY(-10%)!important;
}
.parallaxlast22
{
  transform: translatex(-7%) translateY(10%) scale(1)!important;
}
.parallaxlast23
{
  transform: translatex(-5%) translateY(3%) scale(0.6)!important;
}

}


