/****  	Paleta de colores
	*	#3a938f   58,147,143
	*	#77859f   119,133,159
	* 	#d90a9a 217,10,154
	*  #d73b82 215 59 130
	* 				69,79,130
	*  
	*	
	*	
	* 
	* 
		
	*/


/***** IMPORTAR LAS FUENTES *****/
			@font-face 
			{
			  font-family: Caroline;
			  src: url(../fonts/Caroline.otf) format("opentype");
			}

			@font-face 
			{
			  font-family: CORMORANT-MEDIUM;
			  src: url(../fonts/CORMORANT-MEDIUM.ttf) format("truetype");
			}
			
	

/***** GNERAL *****/

			html, body
			{
				font-family: CORMORANT-MEDIUM, sans-serif;
				color: #333333;
				font-size: 18px;
			}
			.font20
			{
				font-size: 20px;
			}
			.btn-floating i
			{
				line-height: inherit!important;
			}

/***** PARA EL IDIOMA *****/

			/*.idiomas a
			{
				 text-decoration: underline;
				 color: #4c1c56;
				 font-weight: 600;
			}*/

/***** PARA EL TEXTO DE LOS BANNERS MENSAJES *****/

			.section_redaccion1 h4, .section_redaccion2 h4, .section_redaccion3 h4
			{
				font-family: CORMORANT-MEDIUM;
				color: #333333;
			}

/***** PARA EL FORMULARIO *****/
			
			[type="checkbox"].filled-in:checked+span:not(.lever):after 
			{
			    top: 0;
			    width: 20px;
			    height: 20px;
			    border: 2px solid #77859f!important;
			    background-color: #77859f!important;
			    z-index: 0;


			}
			textarea.materialize-textarea:focus:not([readonly]) 
		   { 
		      border-bottom: 1px solid #77859f; 
		      -webkit-box-shadow: 0 1px 0 0 #77859f; 
		      box-shadow: 0 1px 0 0 #77859f;
		   }
			.input-field-color label 
			{
			  color: #77859f;
			}
			.input-field-color input,.input-field-color textarea /* label input text underline focus color */
			{
			  border-bottom: 1px solid #77859f!important;
			}
			.input-field-color input:focus + label, .input-field-color textarea:focus + label /* label titulo focus color */
			{
			  color: #77859f!important;
			}
			.input-field-color input:focus, .input-field-color textarea:focus/* label input text underline focus color */
			{
			  border-bottom: 1px solid #77859f!important;
			  box-shadow: 0 1px 0 0 #77859f!important;
			}
			.input-field-color input:focus,.input-field-color textarea:focus /* label input text underline focus color */
			{
			  border-bottom: 1px solid #77859f!important;
			  box-shadow: 0 1px 0 0 #77859f!important;
			}
			.dropdown-content li>a, .dropdown-content li>span 
			{
			    font-size: 16px;
			    color: #77859f;
			    display: block;
			    line-height: 22px;
			    padding: 14px 16px;
			}
			.select-wrapper .caret 
			{
				fill: #77859f;
			}
			.select-wrapper input.select-dropdown 
			{
				color: #77859f;
			}
			/*´Para el alert del form */
			#alert_questions
			{
				font-size:10px;
				padding: 8px;
				border-radius: 3%;
				background-color: #77859f;
			}

/***** PARA LOS BOTONES *****/
			.bg-buttons,.bg-buttons:hover,.bg-buttons:focus
			{
				background-color: rgba(217,10,154,.8);
				font-weight: bolder;
				font-family: CORMORANT-MEDIUM;
				
			}


/***** PARA EL PARALLAX PRINCIPAL *****/
			#parallax-container-principal 
			{
			  height: 100vh;
			}
			.parallax-container #img_parallax_principal_movil img 
			{
				-webkit-transform: translate3d(0, 0, 0);
			    transform: translate3d(0, 0, 0);
			    -webkit-transform: translateX(-60%)!important;
			    transform: translateX(-60%) !important;
			}
			/* Contiene el emblema y el contador */
			.seccionportada
			{
				width: 90%!important;
				margin-top: 18%;
			}

/***** EN CASO DE HABER NOMBRE DE PADRES O PADRINOS *****/
			/*.text-padres
			{
				font-family: CORMORANT-MEDIUM, sans-serif;
				font-size: 20px;
				color: #ffffff;
			}*/

/***** PARA EL LOADER *****/

			.preloader-background 
			{
			  display: flex;
			  align-items: center;
			  justify-content: center;
			  background-color: #ffffff;
			  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: #3a938f;
			  animation: lds-heart 1.2s 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: #3a938f;
			}
			.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 MENU *****/

			/***** Para el menu *****/
			#mobile-demo
			{
				background-color: rgba(217,10,154, 0.5);
				width: 275px; 
			}

			/***** Para las letras del menu  *****/
			.sidenav li>a
			{
			    -webkit-transition: background-color .3s;
			    transition: background-color .3s;
			    font-size: 18px;
			    color: #fff;
			    font-weight: 600;
			    display: block;
			    padding: 0 15px;
			    cursor: pointer;
			    font-family: CORMORANT-MEDIUM, sans-serif;
			}

			/***** Para el hover de las letras del menu *****/
			.sidenav li>a:hover
			{
				background-color: rgba(217,10,154, 0.3);
			}

			/***** Para los li del sidenav left *****/
			.li_inicio
			{
				margin-top: 40%;
			}
			.li_cont
			{
				margin-top: 8%;
			}

			#iconArrow
			{
				height: 56px;
			    line-height: 56px;
				position: absolute;
				z-index: 9;
				left: 20px;
				font-size: 20px;
				color: rgba(58,147,143, 0.5);
				top:50%;
				background-color: rgba(217,10,154, 0.8)!important;
			}
			.close_icon_sidenav
			{
				color: #fff;
				font-size: 20px;
				padding: 0 170px;

			}

			#iconHamburguer
			{
				height: 56px;
			    line-height: 56px;
			    color: white;
				position: absolute;
				z-index: 9;
				left: 20px;
				font-size: 20px;
			}
  

/***** PARA EL BUTTON TOP PAGE *****/
			.btn-floating
			{
				background-color: rgba(217,10,154,0.8);

			}
			.btn-floating:hover
			{
				background-color: rgba(217,10,154,1);
			}


/***** PARA EL FOOTER *****/

			.page-footer
			{
				background-color: rgb(255,255,255);
			}
			.page-footer .footer-copyright
			{
				color: #333;
				background-color: rgb(255,255,255);
			}

/***** EN CASO DE EXISTIR CAROUSELES PARA DRESS CODE O FIRMAS/DESEOS *****/


			.carousel .carousel-item 
			{
				background-color: #77859f; 
				color:#fff; 
				opacity: 1;
				overflow-y: auto;
				padding: 80px 50px 80px 50px;

			}
			.carousel .indicators .indicator-item.active
			{
				background-color: #77859f;
			}
			.carousel .indicators .indicator-item
			{
				background-color: #77859f;
			}

/***** PARA LA INVITACION *****/

			#overlay 
			{
			  position: fixed;
			  display: none;
			  width: 100%;
			  height: 100%;
			  top: 0;
			  left: 0;
			  right: 0;
			  bottom: 0;
			  background-color: rgba(0,0,0,0.8);
			  z-index: 99999;
			  cursor: pointer;
			}
			#overlay .video_invitacion 
			{
			  width: 100%; /*55*/
			  max-width: 100%; /*80*/
			  max-height: 100%;
			}

			#video
			{
			  position: absolute;
			  top: 52%;
			  left: 50%;
			  font-size: 50px;
			  color: white;
			  transform: translate(-50%,-50%);
			  -ms-transform: translate(-50%,-50%);
			  outline: none;
			  border: 0;
			}

			#text
			{
			  position: absolute;
			  font-size: 20px;
			  color: white;
			  right: 0;
			  padding:20px!important;
			  
			}



/***** EN CASO DE QUE NO EXISTA EMBLEMA DE NOMBRE DE LOS NOVIOS Y EMBLEMA *****/

			.nombre_novios
			{
				font-family: CORMORANT-MEDIUM, sans-serif;
				color: #f8f8f5;
				margin-top: 55%; /*Quitar si se va a poner una imagen encima del parallax, por debajo del nombre*/
			}
			.logoemblema
			{
				width:350px;
				/*-o-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				-ms-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				-webkit-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));*/
				
			}
			.logofecha
			{
				margin-top: -50px;
			}

/***** PARA LAS SECCIONES DE LA´PÁGINA *****/

			#section_ubication
			{
				 
			}

			.section_invitacion
			{
				background-color: #258eb8; 
				color: #ffffff;
			}

			#section_dresscode
			{
				background-color: #258eb8; 
				color: #ffffff!important;
			}
			#section_savedate
			{
				background-color: #fff; 
				color: #333333;
			}


			.section_redaccion3
			{
				  background: url(../images/Fondos3.png) no-repeat center center fixed; 
			    -webkit-background-size: cover;
			    -moz-background-size: cover;
			    -o-background-size: cover;
			    background-size: cover;

			}

			.section_redaccion2
			{
				  background: url(../images/Fondos2.png) no-repeat center center fixed; 
			    -webkit-background-size: cover;
			    -moz-background-size: cover;
			    -o-background-size: cover;
			    background-size: cover;
			}

			.section_redaccion1
			{
				  background: url(../images/Fondos1.png) no-repeat center center fixed; 
			    -webkit-background-size: cover;
			    -moz-background-size: cover;
			    -o-background-size: cover;
			    background-size: cover;
			}

			.section_title
			{
				font-family: Caroline, sans-serif;
				font-size: 13vh;
				text-transform: capitalize;
				color: rgba(69,79,130, 1.0);
			}

/***** PARA EL CONTADOR *****/

			#timerCont
			{
				font-family: CORMORANT-MEDIUM, sans-serif;
				font-size: 22px;
				background-color:rgba(215,59,130, 0.5);
				color: #fff;
				margin-top: -50px;

				
			}



/*****  PARA LAS CARDS *****/
    
			.title_cards
			{
				font-family: Caroline, sans-serif;
				color: #3a938f;
			}

			.mycard
			{
				/*border: 10px double #258eb8;*/
				

			}



/***** PARA LOS MODALES *****/
			.modal
			{
				width: 80%!important;
				height: 100%!important;
				max-height: 75%!important;
			}
			#modal_mensaje
			{
				width: 80%!important;
				font-size: 24px;
				height: auto!important;
			}

/***** EN CASO DE HABER UN VIDEO O MENSAJE DE INTRO A LA PÁGINA *****/
			.myintroiframe
			{
				width: 100%;
				height: 100%;
			}


/***** PARA EL IFRAME DE MAPS ****/
			.maps
			{
				width: 100%;
				height: 300px;
			}

/***** 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 MENSAJE DE LOS DRESS CODE *****/
			.dress-code-msj
			{
				font-size: 18px;
				
				z-index: 99999999;
			}
    
@media (min-width: 1500px)
{ 
	#img_parallax_principal
	{
		height: 100vh;
	}
}  
/* Escritorios muy grandes
   ------------------------------------------------------------------------- */
@media (min-width: 1200px) and (max-width: 1499px)
{ 
	
}   
   
/* Tablets en horizonal y escritorios normales
   ------------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1199px) 
{ 
	
	.li_inicio
	{
		margin-top: 75%;
	}
	.card .card-title
	{
		font-size: 22px!important;
	}


}   

/* Móviles en horizontal o tablets en vertical
   ------------------------------------------------------------------------- */
@media (max-width: 767px) 
{
	.fecha_boda
	{
		
	}
	#timerCont
	{
		font-size: 19px;
		font-weight: 400;
		background-color:rgba(215,59,130, 0.5);
	}
	.sidenav li>a
	{
	    font-size: 20px;
	    padding: 0 15px;
	    font-family: CORMORANT-MEDIUM, sans-serif;
	}
	.nombre_novios
	{
		
		margin-top: 55%; /*Quitar si se va a poner una imagen encima del parallax, por debajo del nombre*/
	}
	.section_title
	{
		font-size: 7vh;
	}
	.li_inicio
	{
		margin-top: 10%;
	}
	.li_cont
	{
		margin-top: 0;
	}

	

	.card .card-title
	{
		font-size: 20px!important;
	}
	.seccionportada
	{
		margin-top: 85%;
	}
	.logoemblema
	{
		width:300px;
		margin-top: 30%;
		
		/*-o-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				-ms-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				-webkit-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));*/
	}
	.parallaxlast
	{
		transform: scale(0.8);
	}
	
	#overlay .video_invitacion 
	{
	  width: 100%;
	  max-width: 100%;
	  max-height: 90%;
	}
	#video
	{
	  width: 100%;
	}
	.carousel .carousel-item 
	{
		
	}
	.section_redaccion1	{
      background: url(../images/Fondos1.png) no-repeat center center ; 
	    -webkit-background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	}
	.section_redaccion2	{
	  
      background: url(../images/FondosVertical-02.png) no-repeat center center ; 
	    -webkit-background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	}
	.section_redaccion3	{
       background: url(../images/Fondos3.png) no-repeat center center ; 
	    -webkit-background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	}
	.parallaxlast2
	{
		transform: translatex(5%) translateY(-10%)!important;

	}
	.dress-code-msj
	{
		/*margin-top: -220px;*/
	}

	.section_redaccion1 h4, .section_redaccion2 h4, .section_redaccion3 h4
			{
				font-size: 1.5rem;
			}

	.mi-container-mesa
   {
   	width: 100%!important;
   }

	
}   

/* Móviles en vertical
   ------------------------------------------------------------------------- */
@media (max-width: 480px) 
{ 

	#timerCont
	{
		font-size: 19px;
		font-weight: 400;
		background-color:rgba(215,59,130, 0.5);
	}

	.sidenav li>a
	{
	    
	    font-size: 20px;
	    padding: 0 15px;
	    font-family: CORMORANT-MEDIUM, sans-serif;
	    
	}
	.nombre_novios
	{
		
		margin-top: 55%; /*Quitar si se va a poner una imagen encima del parallax, por debajo del nombre*/
	}
	.section_title
	{
		font-size: 7vh;
	}
	.li_inicio		
	{
		margin-top: 10%;
	}
	.li_cont
	{
		margin-top: 0;
	}

	.card .card-title
	{
		font-size: 20px!important;
	}

	.seccionportada
	{
		margin-top: 85%;
	}
	.logoemblema
	{
		width:300px;
		margin-top: 30%;
		/*-o-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				-ms-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				-webkit-filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));;
				filter: drop-shadow(0 2px 0px rgba(0, 0, 0, 0.4));*/
	}
	.parallaxlast
	{
		transform: scale(0.5);
	}
	
	#overlay .video_invitacion 
	{
	  width: 100%;
	  max-width: 100%;
	  max-height: 90%;
	}
	#video
	{
	  
	  width: 100%;
	}

	.carousel .carousel-item 
	{
		
	}

	.section_redaccion1	{
      background: url(../images/Fondos1.png) no-repeat center center; 
	    -webkit-background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	}
	.section_redaccion2	{
	  
      background: url(../images/FondosVertical-02.png) no-repeat center center; 
	    -webkit-background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	}
	.section_redaccion3	{
       background: url(../images/Fondos3.png) no-repeat center center; 
	    -webkit-background-size: cover;
	    -moz-background-size: cover;
	    -o-background-size: cover;
	    background-size: cover;
	}

	.parallaxlast2
	{
		transform: translatex(5%) translateY(-10%)!important;
	}

	.dress-code-msj
	{
		/*margin-top: -220px;*/
	}

	.section_redaccion1 h4, .section_redaccion2 h4, .section_redaccion3 h4
			{
				font-size: 1.5rem;
			}

   .mi-container-mesa
   {
   	width: 100%!important;
   }
}