/* INI - preloader de la web */

		.preloader-centrado{ /* para centrar el loader */
	    height: 100vh;
	    background-color: #000;
	    display: flex;
	    flex-direction: column;
	    justify-content: center;
	    align-items: center;
	  }

	  .preloader-body-hidden{ /* para ocultar la barra scroll del body, para evitar que bajen mientras se muestra el loader */
	    overflow: hidden;
	  }

	  .custom-text-white{
	    color: #fff;
	  }
  
  


	  /* INI - para crear el loader con puro CSS */

	    /*   https://loading.io/css/    */

	    .lds-roller {
	      display: inline-block;
	      position: relative;
	      width: 80px;
	      height: 80px;
	    }
	    .lds-roller div {
	      animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
	      transform-origin: 40px 40px;
	    }
	    .lds-roller div:after {
	      content: " ";
	      display: block;
	      position: absolute;
	      width: 7px;
	      height: 7px;
	      border-radius: 50%;
	      background: #fff;
	      margin: -4px 0 0 -4px;
	    }
	    .lds-roller div:nth-child(1) {
	      animation-delay: -0.036s;
	    }
	    .lds-roller div:nth-child(1):after {
	      top: 63px;
	      left: 63px;
	    }
	    .lds-roller div:nth-child(2) {
	      animation-delay: -0.072s;
	    }
	    .lds-roller div:nth-child(2):after {
	      top: 68px;
	      left: 56px;
	    }
	    .lds-roller div:nth-child(3) {
	      animation-delay: -0.108s;
	    }
	    .lds-roller div:nth-child(3):after {
	      top: 71px;
	      left: 48px;
	    }
	    .lds-roller div:nth-child(4) {
	      animation-delay: -0.144s;
	    }
	    .lds-roller div:nth-child(4):after {
	      top: 72px;
	      left: 40px;
	    }
	    .lds-roller div:nth-child(5) {
	      animation-delay: -0.18s;
	    }
	    .lds-roller div:nth-child(5):after {
	      top: 71px;
	      left: 32px;
	    }
	    .lds-roller div:nth-child(6) {
	      animation-delay: -0.216s;
	    }
	    .lds-roller div:nth-child(6):after {
	      top: 68px;
	      left: 24px;
	    }
	    .lds-roller div:nth-child(7) {
	      animation-delay: -0.252s;
	    }
	    .lds-roller div:nth-child(7):after {
	      top: 63px;
	      left: 17px;
	    }
	    .lds-roller div:nth-child(8) {
	      animation-delay: -0.288s;
	    }
	    .lds-roller div:nth-child(8):after {
	      top: 56px;
	      left: 12px;
	    }
	    @keyframes lds-roller {
	      0% {
	        transform: rotate(0deg);
	      }
	      100% {
	        transform: rotate(360deg);
	      }
	    }

	  /* FIN - para crear el loader con puro CSS */


	/* FIN - preloader de la web */



	/* INI - intro (todo el header) carrusel y navbar */

		/* Carousel styling */
		/*#introCarousel,
		.carousel-inner,
		.carousel-item,
		.carousel-item.active {
		  height: 50vh;
		}*/


		/* INI - imagenes  */

			.carousel-item:nth-child(1) {
			  background-image: url('../images/header/02-curso-fotografia-de-producto-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(2) {
			  background-image: url('../images/header/09-curso-fotografia-gastronomica-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(3) {
			  background-image: url('../images/header/03-curso-fotografia-boudoir-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(4) {
			  background-image: url('../images/header/04-curso-fotografia-de-producto-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(5) {
			  background-image: url('../images/header/06-curso-fotografia-de-producto-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(6) {
			  background-image: url('../images/header/05-fotografia-carlos-areche.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(7) {
			  background-image: url('../images/header/07-curso-fotografia-boudoir-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(8) {
			  background-image: url('../images/header/08-curso-fotografia-boudoir-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(9) {
			  background-image: url('../images/header/01-curso-fotografia-de-bodas-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}
			.carousel-item:nth-child(10) {
			  background-image: url('../images/header/10-curso-fotografia-maquillaje-fx-omar-cayo-education.jpg');
			  background-repeat: no-repeat;
			  background-size: cover;
			  background-position: center center;
			}


			/* para mobile */
			@media (max-width:991px) {
				.carousel-item:nth-child(1) {
				  background-image: url('../images/header/02-curso-fotografia-de-producto-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(2) {
				  background-image: url('../images/header/09-curso-fotografia-gastronomica-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(3) {
				  background-image: url('../images/header/03-curso-fotografia-boudoir-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(4) {
				  background-image: url('../images/header/04-curso-fotografia-de-producto-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(5) {
				  background-image: url('../images/header/06-curso-fotografia-de-producto-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(6) {
				  background-image: url('../images/header/05-fotografia-carlos-areche-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(7) {
				  background-image: url('../images/header/07-curso-fotografia-boudoir-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(8) {
				  background-image: url('../images/header/08-curso-fotografia-boudoir-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(9) {
				  background-image: url('../images/header/01-curso-fotografia-de-bodas-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
				.carousel-item:nth-child(10) {
				  background-image: url('../images/header/10-curso-fotografia-maquillaje-fx-omar-cayo-education-mobile.jpg');
				  background-repeat: no-repeat;
				  background-size: cover;
				  background-position: center center;
				}
			}

		/* FIN - imagenes */

		/* Height for devices larger than 576px */
		
		.navbar .nav-link {
		  /*color: #fff !important;*/
		}

		/* INI - agregados por mi */
		.navbar{
			z-index: 3;
		}
		.navbar-brand img{
			height: 40px;
			margin-top: 0;
			padding-top: 0;
			margin-bottom: 0;
			padding-bottom: 0;
			box-sizing: border-box;
		}

		body { 
		    padding-top: 66px; 
		}
		/* FIN - agregados por mi */

		@media (max-width:500px) {
		  body { /* agregado por mi */
		    padding-top:66px;
		  }
		  .sm-page-widget-logo-subtext{
		  	display: none;
		  }
		  #introCarousel,
		  .carousel-inner,
		  .carousel-item,
		  .carousel-item.active {
				height: 45vh; /* 45vh  */
		  }
		}

		@media (min-width: 501px) and (max-width:767px) {
		  body { /* agregado por mi */
		    padding-top:66px;
		  }
		  .sm-page-widget-logo-subtext{
		  	display: none;
		  }
		  #introCarousel,
		  .carousel-inner,
		  .carousel-item,
		  .carousel-item.active {
				height: 50vh; /* 50vh */
		  }
		}

		@media (min-width:768px) {
		  #introCarousel,
		  .carousel-inner,
		  .carousel-item,
		  .carousel-item.active {
				height: 70vh; /* 70vh */
		  }
		}

		/* INI - agregados por mi */
		@media screen and (min-width:768px) and (max-width:990px) {
		  body {
		    padding-top:66px;
		  }
		  .sm-page-widget-logo-subtext{
		  	display: none;
		  }
		}
		@media (min-width: 992px) {
		  #introCarousel {
			/*margin-top: -58.59px;*/
		  }
		  #introCarousel,
		  .carousel-inner,
		  .carousel-item,
		  .carousel-item.active {
			height: 90vh; /* 90vh */
		  }
		}
		@media screen and (min-width:991px) and (max-width:1200px) {
		  body {
		    padding-top:66px;
		  }
		}
		/* FIN - agregados por mi */

	/* FIN - intro (todo el header) carrusel y navbar */




	/* INI - otros */
		@media (max-width: 767px){
			.title-conoce-mobile{
				display: block;
			}
			.title-conoce-pc{
				display: none;
			}
			
		}

		@media (min-width: 768px){
			.title-conoce-mobile{
				display: none;
			}
			.title-conoce-pc{
				display: initial;
			}
		}

		.card{ /* adicionando mb-4 (margin-bottom: 1.5rem) al card del bootstrap */
			margin-bottom: 1.5rem;
		}
	/* FIN - otros */




	/* ------- INI - para listado de items dentro de cada curso --------- */
  	.ul-mb-custom{
			margin-bottom: 1em; 
		}
	/* ------- FIN - para listado de items dentro de cada curso --------- */


	/* ------- INI - para form de contacto --------- */
		.oculto{
			display: none;
		}
	/* ------- FIN - para form de contacto --------- */


	/* ------- INI - para ICONO FLOTANTE whatsapp --------- */
		@media(max-width: 600px){
			.floating-wpp-button{
				width: 3.5em !important;
				height: 3.5em !important;
			}
		}
	/* ------- FIN - para ICONO FLOTANTE whatsapp --------- */