html{
	scroll-behavior: smooth;
}
div.cabeza{
	width: 100%;
	height: 100vh;
}
div.carousel-item{
	width: 100%;
	height:88vh;
	background-image: url(../img/banner.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	/*background-position: 69%;*/
	margin-top: 0px;
}
div.banner2{
		width: 100%;
	height:88vh;
	background-image: url(../img/banner2.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	/*background-position: 69%;*/
	margin-top: 0px;
}
div.banner3{
	background-image: url(../img/banner3.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	/*background-position: 69%;*/
	margin-top: 0px;

}
div.banner{
	width: 100%;
	height:88vh;
	background-image: url(../img/banner.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	/*background-position: 69%;*/
	margin-top: 0px;
}
.banner-text{
	padding-top: 100px;
	text-align: left;
	padding-left: 20px;
	padding-top: 140px;
}
.texto1{
	padding-top: 100px;
	padding-left: 20px;
	padding-top: 140px;
	text-align: center;
}
.texto1 h2{
	letter-spacing: 10px;
	font-weight: bolder;
	font-size: 90px;
	text-transform: uppercase;
	color: white;
	text-shadow: -3px -3px 3px  #F25A05, 3px -3px 3px  #F25A05, -3px 3px 3px  #F25A05, 3px 3px 3px  #F25A05;
animation: animates 2s 1;
}
@keyframes animates{
	0%{
		transform: scale(0);
	}
	100%{
		transform: scale(1);
	}
}

.banner-text h2{
	letter-spacing: 10px;
	font-weight: bolder;
	font-size: 90px;
	color: white;

	text-shadow: -3px -3px 3px  #F25A05, 3px -3px 3px  #F25A05, -3px 3px 3px  #F25A05, 3px 3px 3px  #F25A05;
}

.reproducir{
	width: 100%;
	height: 90vh;
	background-image: url(../img/cecyt.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
	justify-content: center;
	align-items: center;
}
.video2{
	padding: 3% 0;
}
.formato{
	width: 750px;
}
/*Perfiles*/
.todos{
	display:flex ;
	align-items: center;
	justify-content: center;
	 height: 500px;

}
.card{
	margin: 20px;
	width: 300px;
	height: 300px;
	background-color: #26BBBB;
	border-radius: 5px;
	background-size: cover;
	box-shadow: 3px 5px 5px rgba(3, 32, 52, .8);
}
.tit{
	text-align: center; 
	margin-top: 20px; 
	color: white; 
	font-weight:700;
	text-shadow: -3px -3px 3px  #F25A05, 3px -3px 3px  #F25A05, -3px 3px 3px  #F25A05, 3px 3px 3px  #F25A05;
}
h5.titF{
	text-align: center; 
	margin-top: 20px; 
	color: white; 
	font-weight:700;
	text-shadow: -2px -2px 2px  #F25A05, 2px -2px 2px  #F25A05, -2px 2px 2px  #F25A05, 2px 2px 2px  #F25A05;
}
/*Cajas Modulos*/
.content1{
	width: 100%;
	height: 100%;
	background-image: url(../img/m1.jpg);
	display: flex;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column;
	 background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
}
.content2{
	width: 100%;
	height: 100%;
	background-image: url(../img/m2.jpg);
	display: flex;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column;
	 background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
}
.content3{
	width: 100%;
	height: 100%;
	background-image: url(../img/m3.jpg);
	display: flex;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column;
	 background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
}
.content4{
	width: 100%;
	height: 100%;
	background-image: url(../img/m4.png);
	display: flex;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column;
	 background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
}
.content5{
	width: 100%;
	height: 100%;
	background-image: url(../img/m4-4.png);
	display: flex;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column;
	 background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
}
/*Terminan cajas modulos*/
.content{
	width: 100%;
	height: 100%;
	display: flex;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column;
}
.content .Tama«Šoiconos, .iconito{
	color: white;
	font-size: 40px;
}
.content h4{
	color: white;
	margin: 10px 0;
	text-shadow: -2px -2px 2px  #F25A05, 2px -2px 2px  #F25A05, -2px 2px 2px  #F25A05, 2px 2px 2px  #F25A05;
}
.BotonPerfil{
  border-radius: 5px;
  padding: 10px 7px;
  text-decoration: none;
  color: #fff;
  background-color: #F24405;
  margin: 15px;
  width: 120px;
  text-align: center;
  box-shadow: 1px 1px 15px #F24405;
 /* box-shadow: 0 0 50px rgba(242,68,5,.9);*/
}
.color{
	position: absolute;
	background:linear-gradient(white,white);
	transition: 0.5s;
}
/*Modulos*/
h4.M1{
	color: white;
	text-shadow: -2px -2px 2px #0000DF, 2px -2px 2px #0000DF, -2px 2px 2px #0000DF, 2px 2px 2px #0000DF;
	font-size: 30px;
}
h4.M2{
	color: white;
	text-shadow: -2px -2px 2px  #49D318, 2px -2px 2px  #49D318, -2px 2px 2px  #49D318, 2px 2px 2px  #49D318;
	font-size: 30px;
}
h4.M3{
	color: white;
	text-shadow: -2px -2px 2px  #F25A05, 2px -2px 2px  #F25A05, -2px 2px 2px  #F25A05, 2px 2px 2px  #F25A05;
	font-size: 30px;
}
h4.M4{
	color: white;
	text-shadow: -2px -2px 2px  #F11919, 2px -2px 2px  #F11919, -2px 2px 2px  #F11919, 2px 2px 2px #F11919;
	font-size: 30px;
}
h4.M5{
	color: white;
	text-shadow: -2px -2px 2px  #6808E2, 2px -2px 2px #6808E2, -2px 2px 2px  #6808E2, 2px 2px 2px #6808E2;
	font-size: 30px;
}
/*Botones de modulos*/
button{
	border-radius: 5px;
	position: relative;
	padding: 10px 7px;
	border: none;
	outline: none;
	margin: 15px;
  width: 120px;
	background: #350642;
	color: white;
	cursor: pointer;
	transition: .5s;
	overflow: hidden;
}
button:hover{
	color: white;
}

button span{
	position: absolute;
	background: linear-gradient(50deg, white,white);
	transition: 0.5s;
}
button span:nth-child(1){
	width: 100%;
	height: 4px;
	top: 0;/*Arriba*/
	left: -100%;/*Izquierda*/
}
button span:nth-child(2){
	width: 100%;
	height:4px;
	bottom: 0;/*abajo*/
	right: -100%;/*Derecha*/
}
button span:nth-child(3){
	width: 4px;
	height:100%;
	bottom: -100%;/*abajo*/
	left: 0;/*Derecha*/
}
button span:nth-child(4){
	width: 4px;
	height:100%;
	top:-100%;/*abajo*/
	right: 0;/*Derecha*/
}
button:hover span:nth-child(1){
	left: 0;
}
button:hover span:nth-child(2){
	right: 0;
}
button:hover span:nth-child(3){
	bottom: 0;
}
button:hover span:nth-child(4){
	top: 0;
}
/*Color botones*/
.m1{
	background-color:#0000DF ;

}
.m2{
	background-color:#49D318;
}
.m3{
	background-color: #F25A05;
}
.m4{
	background-color: #F11919;
}
.m5{
	background-color: #6808E2;
}
/*Color cajas*/
.colorM1{
	box-shadow: 1px 1px 50px #0000DF;

}
.colorM2{
	box-shadow: 2px 2px 50px #49D318;
}
.colorM3{
	box-shadow: 2px 2px 50px #F25A05;
}
.colorM4{
	box-shadow: 2px 2px 50px #F11919;
}
.colorM5{
	box-shadow: 2px 2px 50px #6808E2;
}
/*Red social*/
.redesS{
	font-size: 50px;

}
/*Responsive*/
@media (max-width: 640px){
	.banner-text h2{
		font-size: 45px;
	}
	div.banner{
    width: 100%;
	height: 35vh;
	background-image: url(../img/inicio2.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	/*background-position: 69%;*/
	margin-top: 0px;

	}
	.formato{
		width: 375px;

	}
	.reproducir{
		width: 100%;
		height: 45vh;
			background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
	justify-content: center;
	align-items: center;
	}


}
.footer{
	min-height: 10vh;
	background-color: black;
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
	font-size: 1.5rem;
	font-weight: 500;


}
.container .btn-float .btn{
	
	text-decoration: none;
	font-size: 15px;
	font-weight: bolder;
	background-color:  #F25A05 ;
	padding: 15px 25px;
	color: white;
	border-radius: 20px;
	position: fixed;
	right: 10px;
	bottom: 40px;
	transition: all 0.3 ease 0s;
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
	z-index: 99;
}
.container .btn-float .btn:hover{
	background-color:white ;
	color: #F25A05;
	box-shadow: 0 15px 20px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
	transform: translateY(-7px);
}
.carousel-item span{
text-transform: uppercase;
display: inline-block;
letter-spacing: 10px;
	font-weight: bolder;
	font-size: 90px;
	color: white;
	text-shadow: -3px -3px 3px  #F25A05, 3px -3px 3px  #F25A05, -3px 3px 3px  #F25A05, 3px 3px 3px  #F25A05;
opacity: 0;
transform: translate(-155px, 0) scale(0.4);
animation: animate .9s forwards;
}
.banner-text span:nth-of-type(2){
	animation-delay: 0.05s;
}
.banner-text span:nth-of-type(3){
	animation-delay: 0.1s;
}
.banner-text span:nth-of-type(4){
	animation-delay: 0.15s;
}
.banner-text span:nth-of-type(5){
	animation-delay: 0.2s;
}
.banner-text span:nth-of-type(6){
	animation-delay: 0.25s;
}
.banner-text span:nth-of-type(7){
	animation-delay: 0.3s;
}
.banner-text span:nth-of-type(8){
	animation-delay: 0.35s;
}
.banner-text span:nth-of-type(9){
	animation-delay: 0.4s;
}
.banner-text span:nth-of-type(10){
	animation-delay: 0.45s;
}

.banner-text span:nth-of-type(11){
	animation-delay: 0.5s;
}
.banner-text span:nth-of-type(12){
	animation-delay: 0.55s;
}
.banner-text span:nth-of-type(13){
	animation-delay: 0.6s;
}
.banner-text span:nth-of-type(14){
	animation-delay: 0.65s;
}
.banner-text span:nth-of-type(15){
	animation-delay: 0.7s;
}
.banner-text span:nth-of-type(16){
	animation-delay: 0.75s;
}
.banner-text span:nth-of-type(17){
	animation-delay: 0.8s;
}
@keyframes animate{
	40%{
		transform: translate(50px, 0);
		opacity: 1;
		color: white;

	}
	60%{
		color: wheat;
	}
	80%{
		transform: translate(0) scale(2);
		opacity: 0;
	}
	100%{
		transform: translate(0) scale(1);
		opacity: 1;
	}
}
.text1{
	
	font-size: 60px;
	font-weight: 700;
	letter-spacing: 8px;
	margin-bottom: 20px;
	position: relative;
	animation: text 5s 1;
}
@keyframes text{
	0%{
		
		margin-bottom: -40px;
	}
	30%{
		letter-spacing: 25px;
		margin-bottom: -40px;
	}
	85%{
		letter-spacing: 8px;
		margin-bottom: -40px;
	}
}

/*Responsive*/
@media (max-width: 640px){
	/*.navbar nav{
		display: none;
	}*/
	.centrarlo{
	    margin-top:-90px;
	    text-align: center;
	    
	}
	.carousel-item  span{
        
		font-size: 25px;
		text-align: center;

	}
	.carousel-item h2{
	    margin-top:-90px;
		font-size: 25px;

	}

	div.carousel-item{
		width: 100%;
	height:25vh;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	/*background-position: 69%;*/
	margin-top: 0px;

	}
	div.card{
  width: 160px;
	height: 150px;
	margin: 5px;

	}
	.content img{
		width: 30px;
		height: 30px;
		margin-top: 0;

	}
	.content h4{
	     text-align: center;
		font-size: 8px;
			

	}
	div.reproducir{
        margin-top:4px;
		width: 95%;
	   height: 25vh;

	}
	.todos{
	
	 height: 300px;

}
button.BotonPerfil{
  /*margin-top: -50px;*/
  width:75px;
  font-size: 10px;
  
  
 
}

.container .btn-float .btn{
	right: 20px;

}	
.navbar-toggler{
    font-size:10px;
}
/*Modulos*/
h4.M1{
	color: white;
	text-shadow: -2px -2px 2px #0000DF, 2px -2px 2px #0000DF, -2px 2px 2px #0000DF, 2px 2px 2px #0000DF;
	font-size: 14px;
}
h4.M2{
	color: white;
	text-shadow: -2px -2px 2px  #49D318, 2px -2px 2px  #49D318, -2px 2px 2px  #49D318, 2px 2px 2px  #49D318;
	font-size: 14px;
}
h4.M3{
	color: white;
	text-shadow: -2px -2px 2px  #F25A05, 2px -2px 2px  #F25A05, -2px 2px 2px  #F25A05, 2px 2px 2px  #F25A05;
	font-size: 14px;
}
h4.M4{
	color: white;
	text-shadow: -2px -2px 2px  #F11919, 2px -2px 2px  #F11919, -2px 2px 2px  #F11919, 2px 2px 2px #F11919;
	font-size: 14px;
}
h4.M5{
	color: white;
	text-shadow: -2px -2px 2px  #6808E2, 2px -2px 2px #6808E2, -2px 2px 2px  #6808E2, 2px 2px 2px #6808E2;
	font-size: 14px;
}
button.m1{
  /*margin-top: -50px;*/
  width:75px;
  font-size: 10px;
}
button.m2{
  /*margin-top: -50px;*/
  width:75px;
  font-size: 10px;
}
button.m3{
  /*margin-top: -50px;*/
  width:75px;
  font-size: 10px;
}
button.m4{
  /*margin-top: -50px;*/
  width:75px;
  font-size: 10px;
}
button.m5{
  /*margin-top: -50px;*/
  width:75px;
  font-size: 10px;
}
.todos{

	 height: 200px;

}

}