* { margin: 0; 	padding: 0;}

#header{
margin: 0px;
padding: 0px;
     background-image:url(imgFon/imgSup.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        height:100%;}
		
 /*Menu*/

#navSu {padding: 10px 0px;}

#navSu ul {padding-left: 5px; list-style-type: none;}

#navSu ul li a {  text-decoration: none; font-weight: bold; margin:0px;  cursor:pointer;}

.nav-tabs > li a { float:none; display:inline-block; 
padding: 2px 10px 2px 10px; 
margin: 0px 20px 0px 0px;
font-size: 16px; 
} 


.nav-tabs > li a:hover { font-size: 16px; 	color: #000000;
	 text-decoration: none;  font-weight: bold;
background-image:url(imgFon/apple.jpg);} 
 .dropdown ul li{ padding:2px 5px 2px 0px;	width: 100%;}
 .dropdown ul li a{margin:0px;padding:0px;	width: 100%; height:22px; z-index: 100; }
.navbar .fa  { color:#0758F9;}

 .contenidotemas{width: 99%; 	padding:0px 15px;}
#contenido {text-align: justify; padding: 0px 30px;	font-size: 15px; background-color: #fff;}
#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center;}
#contenido h3 {	padding: 10px;	font-size: 30px; text-align: center; color:#0000FF;}
#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;  color:red;}
#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}
 

.contenedor {
	width: 100%;
	margin: 0px auto;
	display: grid;
	grid-template-columns: 20% repeat(4, 1fr);
	grid-template-rows: repeat(7, auto);
	grid-template-areas: "header header header header header"
	                     "menulate menu menu menu menu"
	                     "menulate indenti indenti indenti indenti"
						 "menulate cuerpo cuerpo cuerpo cuerpo"
						 "video video video video video"
						 "flecha flecha flecha flecha flecha"
	                     "footer footer footer footer footer";
}

.header {  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(1, 1fr);
  gap: 0px 0px;
  justify-content: space-between;
  align-content: space-between;
  justify-items: center;
  align-items: center;
  grid-template-areas:
    "logo slogan slogan slogan slogan slogan";
  grid-area: header;
}

.logo { grid-area: logo;   width:80%; height:80%;}
#logoC  img{grid-area: logo;  width:100%; height:100%;}
#logoC a {width:80%; height:80%; padding:2% 2%;}
#logoC a img{grid-area: logo;  width:90%; height:90%;}
.slogan { grid-area: slogan;  width:100%;}
	
.contenedor .header   h1{grid-area: header;	padding: 0px 0px 0px 80px; margin:10px; font-size: 35px;}
.contenedor .header   h2{grid-area: header; padding: 0px 0px 0px 100px; margin:10px;	font-size: 33px;}

.contenedor .menu{grid-area: menu; height:150px;  padding:10px 10px 30px 10px; margin:10px; z-index: 100;}
.contenedor .menu .yas{	grid-area: menu;  z-index:110;}
.contenedor .menu .collapse, .navbar-collapse{grid-area: menu; padding:10px 10px 40px 10px;}

	.contenedor .menulate {	grid-area: menulate;}
	.contenedor .menulate  a{ grid-area: menulate;margin: 0% 15% 0% 0%; font-size: 12px; }
	
   .contenedor .menulate {	grid-area: menulate; padding: 0px 20px;	grid-template-rows: repeat(2, auto);
}
	  .contenedor .menulate0 {grid-area: menulate0; }
	  .contenedor .menulate1 {grid-area: menulate1; padding:5px;}


  .menulate1 {display: grid;
  /*  grid-gap: 2px;  */
    grid-template-columns: repeat(1, [col] 1fr ) ;
    grid-template-rows: repeat(4, [row] auto  );
}
  .late10 {grid-column: 1/2;  grid-row: 1/2; }
  .late11 {grid-column: 1/2;  grid-row: 2/3; }
  .late12 {grid-column: 1/2;  grid-row: 3/4; }
  .late13 {grid-column: 1/2;  grid-row: 4/5; }

.contenedor .menulate1 .card{margin:20px 0px;}
		.contenedor .menulate1 p img{
 margin:0px 4px 0px 4px; padding:2px;                
	-moz-border-radius: 10px; -webkit-border-radius: 10px;  
	   width: 90%;  	
				 box-shadow: 2px 2px 10px 5px rgba(0,0,0,0.4);}	


.contenedor .cuerpo {
	grid-area: cuerpo;
	display: grid;
	grid-template-rows: repeat(5, auto);
	grid-template-areas: "cuerpo1 cuerpo1"
	                     "tituloP tituloP"
	                     "escuela1  escuela2"	                     
	                     "escuela3  escuela4"
						 "cuerpo6 cuerpo6";
}

	.contenedor .cuerpo .cuerpo1 {grid-area: cuerpo1;   margin:10px; padding:10px;}
	.contenedor .cuerpo .tituloP {grid-area: tituloP;   margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela1 {grid-area: escuela1; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela2 {grid-area: escuela2; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela3 {grid-area: escuela3; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela4 {grid-area: escuela4; margin:10px; padding:10px;}
	.contenedor .cuerpo .cuerpo6 {grid-area: cuerpo6;   margin:10px; padding:50px; }
	

.tituloP { grid-area: tituloP; align-self:center; justify-self:center; padding: 20px 0;font-size: 30px;text-align: center; }
.escuela1, .escuela2, .escuela3, .escuela4 {  width:80%;
align-self:center; justify-self:center;  border: 2px solid blue;  
border-radius: 10px; padding: 20px; font-size: 12px; text-align: center;}

.escuela1 .conImg .img, .escuela2 .conImg .img ,.escuela3 .conImg .img ,.escuela4 .conImg .img{width:100%;}
.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3  .img{width:100%; height:100%; border-radius: 6px;} 

.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3 .img, p{ margin:10px 0px 0px 0px; } 


	 .contenedor .cuerpo .escuela2 .conImg #ddd h3 {grid-area: escuela2; height:140px;}


.contenedor .indenti {grid-area: indenti;
    display: grid;
	grid-template-columns: 10% 10% repeat(3, 1fr);
	grid-template-rows: repeat(1, auto);
    grid-template-areas: "indEs indEs indId indId indId";  
}
.contenedor .indenti  .indId {grid-area: indId;	margin:2px; padding: 5px 0px; 	text-align: center; }
	
.contenedor .indenti  .indId  h4{grid-area: indId;	line-height:2; font-size: 16px; }	

.contenedor .indenti  .indEs {grid-area: indEs;	 margin:2px; 	padding: 5px; display: flex;
  align-items: center;  justify-content: center; }


	.contenedor .video {
		grid-area: video; 	padding: 0% 10%;		
		display: grid;
		grid-template-rows: repeat(2, auto);
	}

			.contenedor .video .video0 {padding: 0% 10%;}

			.contenedor .video .video1 {}

		.contenedor .flecha  {margin:10px; padding:10px;
			grid-area: flecha;
			
			}


.contenedor .footer {grid-area: footer; background-color:#AED6F1; } 
.pie{text-align:center; font-size:14px; color:#000000;
	background: #78c4f4; background-image: url(imgFon/nuevoR1C2.jpg);
	background-repeat: repeat-x; padding: 10px 0px;
    border-radius:0px 0px 15px 15px; box-shadow: 0px 8px 2px -2px #707070;}
 } 



/*Lateral*/
.NaveLateralLinks{ background-color:#ccffcf; font-size: 16px;}

.NaveLateralLinks h3{padding: 10px 0px 2px 15px;}	

#NaveLateral{margin: -40px 0px 0px -20px;	background-color: #eeeeee;}

#NaveLateral ul a:link, #NaveLateral ul a:visited {
	display: block;  text-decoration: none;
	font-weight: bold;  font-size: 15px;
	color: #000000;  padding: 2px 0px 2px 20px;}

#NaveLateral ul a:hover { font-size: 15px;  color: #000000;
	text-decoration: none;   font-weight: bold;
	line-height:1.1; background-image:url(imgFon/apple.jpg);}

#NaveLateral ul {list-style: none; margin:  0; padding: 0;}

/*Cuerpo*/

.contenidotemas{width: 100%; padding:0px 15px 0px 0px; }
#contenido {text-align: justify; padding: 0px 30px; margin:0px 15px 0px 0px;
	font-size: 15px; background-color: #fff;}

#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center; }

#contenido h3 {	padding: 10px;	font-size: 30px; text-align: center; color:#0000FF;}

#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;}

#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}


/*video*/
#navInf {margin:0;  padding:0px 0px 0px 10px;}

#navInf ul li {   line-height:1.5; font-size: 20px;}

#navInf ul li a {color: #000;  text-decoration: none;  font-weight: 400;  cursor:pointer; }

#navInf ul li a:hover {color: #000;  text-decoration: none; background-image:url(imgFon/apple.jpg);}


@media screen and (max-width: 469.98px)
 {
		
#contenido {text-align: justify; padding: 0px 30px;	font-size: 15px; background-color: #fff;}
#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center;}
#contenido h3 {	padding: 10px;	font-size: 20px; text-align: center; color:#0000FF;}
#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;  color:red;}
#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}


	.contenedor {
		width: 100%;
		margin: 0px auto;
		display: grid;
		grid-template-columns: 20% repeat(4, 1fr);
		grid-template-rows: repeat(8, auto);
		grid-template-areas: "header header header header header"
							 "menu menu menu menu menu"
							 "menulate menulate menulate menulate menulate"						 
							 "indenti indenti indenti indenti indenti"
							 "cuerpo cuerpo cuerpo cuerpo cuerpo"
							 "video video video video video"
							 "flecha flecha flecha flecha flecha"
							 "footer footer footer footer footer";
	            }
				

	.header {  display: grid;
	  grid-template-columns: repeat(6, 1fr);
	  grid-template-rows: repeat(1, 1fr);
	  gap: 0px 0px;
	  justify-content: space-between;
	  align-content: space-between;
	  justify-items: center;
	  align-items: center;
	  grid-template-areas:
		"logo slogan slogan slogan slogan slogan";
	  grid-area: header;
	       }

	.logo { grid-area: logo;   width:80%; height:80%;}
	#logoC  img{grid-area: logo;  width:100%; height:100%;}
	#logoC a {width:80%; height:80%; padding:2% 2%;}
	#logoC a img{grid-area: logo;  width:90%; height:90%;}
	.slogan { grid-area: slogan;  width:100%;}
		
	.contenedor .header   h1{grid-area: header;	padding: 0px 0px 0px 30px; margin:10px; font-size: 16px;}
	.contenedor .header   h2{grid-area: header; padding: 0px 0px 0px 100px; margin:10px;	font-size: 16px;}

	.contenedor .menu{grid-area: menu; height:170px;  padding:10px 10px 30px 10px; margin:10px; z-index: 100;}
	.contenedor .menu .collapse{grid-area: menu; height:180px; overflow:hidden; z-index: 100;}


	/*.contenedor .menu {	grid-area: menu; padding:0px 100px 0px 100px; margin:0px;}
	.contenedor .menu .collapse{grid-area: menu; height:180px; overflow:hidden; z-index: 100;}*/

	.contenedor .menulate {	grid-area: menulate; margin: 0% 45% 0% 5%;}
	.contenedor .menulate  a{ grid-area: menulate;margin: 0% 25% 0% 0%; font-size: 12px; }
	.contenedor .menulate {	grid-area: menulate;
		padding: 0px 20px;	grid-template-rows: repeat(2, auto);
	}
			.contenedor .menulate0 {grid-area: menulate0; }
			.contenedor .menulate1 {grid-area: menulate1; }


	  .menulate1 {display: grid;
	  /*  grid-gap: 2px;  */
		grid-template-columns: repeat(1, [col] 1fr ) ;
		grid-template-rows: repeat(4, [row] auto  );
	}
	  .late10 {grid-column: 1/2;  grid-row: 1/2; height:2px; visibility: hidden;}
	  .late11 {grid-column: 1/2;  grid-row: 2/3; height:2px; visibility: hidden;}
	  .late12 {grid-column: 1/2;  grid-row: 3/4; height:2px; visibility: hidden;}
	  .late13 {grid-column: 1/2;  grid-row: 4/5; height:2px; visibility: hidden;}

	.contenedor .menulate1 .card{margin:20px 0px;}
			.contenedor .menulate1 p img{
	 margin:0px 4px 0px 4px; padding:2px;                
		-moz-border-radius: 10px; -webkit-border-radius: 10px;  
		   width: 90%;  	
					 box-shadow: 2px 2px 10px 5px rgba(0,0,0,0.4);}	



	.contenedor .cuerpo {
		grid-area: cuerpo;
		display: grid;
		grid-template-rows: repeat(7, auto);
		grid-template-areas: "cuerpo1"
							 "tituloP"
							 "escuela1"
                             "escuela2"							 
							 "escuela3 "
							 " escuela4"
							 "cuerpo6";
	}

		.contenedor .cuerpo .cuerpo1 {grid-area: cuerpo1;   margin:10px; padding:10px;}
		.contenedor .cuerpo .tituloP {grid-area: tituloP;   margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela1 {grid-area: escuela1; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela2 {grid-area: escuela2; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela3 {grid-area: escuela3; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela4 {grid-area: escuela4; margin:10px; padding:10px;}
		.contenedor .cuerpo .cuerpo6 {grid-area: cuerpo6;   margin:10px; padding:50px; }
		


	.tituloP { grid-area: tituloP; align-self:center; justify-self:center; padding: 20px 0;font-size: 30px;text-align: center; }
	.escuela1, .escuela2, .escuela3, .escuela4 {  width:80%;
	align-self:center; justify-self:center;  border: 2px solid blue;  
	border-radius: 10px; padding: 20px; font-size: 12px; text-align: center;}

	.escuela1 .conImg .img, .escuela2 .conImg .img ,.escuela3 .conImg .img ,.escuela4 .conImg .img{width:100%;}
	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3  .img{width:100%; height:100%; border-radius: 6px;} 

	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3 .img, p{ margin:10px 0px 0px 0px; } 


		.contenedor .cuerpo .escuela2 .conImg .contenedor1 {grid-area: escuela2; margin:10px 10px 10px -37px; padding:10px;}

	 .contenedor .cuerpo .escuela2 .conImg #ddd h3 {grid-area: escuela2; height:120px;}



		.contenedor .indenti {grid-area: indenti;	
			display: grid;
			grid-template-columns: 15% 15% repeat(3, 1fr);
			grid-template-rows: repeat(1, auto);
			grid-template-areas: "indEs indEs indId indId indId";  
		}
		.contenedor .indenti  .indId {grid-area: indId; margin:4px; padding:5px 4px; text-align: center;}
		.contenedor .indenti  .indId h4{grid-area: indId; line-height: 3; font-size: 10px; font:bold;}	
		.contenedor .indenti  .indEs {grid-area: indEs; margin:4px 2px 4px 8px;}


		.contenedor .video {
			grid-area: video; 	padding: 0% 10%;		
			display: grid;
			grid-template-rows: repeat(2, auto);
		}

				.contenedor .video .video0 {padding: 0% 10%;}

				.contenedor .video .video1 {}

	.contenedor .flecha  {  grid-area: flecha; margin:10px; padding:10px; weight:100%; 		}


	.contenedor .footer {grid-area: footer; background-color:#AED6F1; } 
	.pie{text-align:center; font-size:14px; color:#000000;
		background: #78c4f4; background-image: url(imgFon/nuevoR1C2.jpg);
		background-repeat: repeat-x; padding: 10px 0px;
		border-radius:0px 0px 15px 15px; box-shadow: 0px 8px 2px -2px #707070;}
 }
/*  Fin @media screen and (max-width: 469.98px) */
		
		
		
@media (min-width: 470px) and (max-width: 575.98px)
	{
	#contenido {text-align: justify; padding: 0px 30px;	font-size: 15px; background-color: #fff;}
#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center;}
#contenido h3 {	padding: 10px;	font-size: 20px; text-align: center; color:#0000FF;}
#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;  color:red;}
#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}


	 .contenedor {
		width: 100%;
		margin: 0px auto;
		display: grid;
		grid-template-columns: 20% repeat(4, 1fr);
		grid-template-rows: repeat(8, auto);
		grid-template-areas: "header header header header header"
							 "menu menu menu menu menu"
							 "menulate menulate menulate menulate menulate"						 
							 "indenti indenti indenti indenti indenti"
							 "cuerpo cuerpo cuerpo cuerpo cuerpo"
							 "video video video video video"
							 "flecha flecha flecha flecha flecha"
							 "footer footer footer footer footer";
	            }
				

	.header {  display: grid;
	  grid-template-columns: repeat(6, 1fr);
	  grid-template-rows: repeat(1, 1fr);
	  gap: 0px 0px;
	  justify-content: space-between;
	  align-content: space-between;
	  justify-items: center;
	  align-items: center;
	  grid-template-areas:
		"logo slogan slogan slogan slogan slogan";
	  grid-area: header;
	       }

	.logo { grid-area: logo;   width:80%; height:80%;}
	#logoC  img{grid-area: logo;  width:100%; height:100%;}
	#logoC a {width:80%; height:80%; padding:2% 2%;}
	#logoC a img{grid-area: logo;  width:90%; height:90%;}
	.slogan { grid-area: slogan;  width:100%;}
		
	.contenedor .header   h1{grid-area: header;	padding: 0px 0px 0px 30px; margin:10px; font-size: 24px;}
	.contenedor .header   h2{grid-area: header; padding: 0px 0px 0px 100px; margin:10px;	font-size: 22px;}

	.contenedor .menu{grid-area: menu; height:170px;  padding:10px 10px 30px 10px; margin:10px; z-index: 100;}
	.contenedor .menu .collapse{grid-area: menu; height:180px; overflow:hidden; z-index: 100;}


	/*.contenedor .menu {	grid-area: menu; padding:0px 100px 0px 100px; margin:0px;}
	.contenedor .menu .collapse{grid-area: menu; height:180px; overflow:hidden; z-index: 100;}*/


	.contenedor .menulate {	grid-area: menulate; margin: 0% 45% 0% 5%;}
	.contenedor .menulate  a{ grid-area: menulate;margin: 0% 15% 0% 0%; font-size: 12px; }
	.contenedor .menulate {	grid-area: menulate;
		padding: 0px 20px;	grid-template-rows: repeat(2, auto);
	}
			.contenedor .menulate0 {grid-area: menulate0; }
			.contenedor .menulate1 {grid-area: menulate1; }


	  .menulate1 {display: grid;
	  /*  grid-gap: 2px;  */
		grid-template-columns: repeat(1, [col] 1fr ) ;
		grid-template-rows: repeat(4, [row] auto  );
	}
	  .late10 {grid-column: 1/2;  grid-row: 1/2; height:2px; visibility: hidden;}
	  .late11 {grid-column: 1/2;  grid-row: 2/3; height:2px; visibility: hidden;}
	  .late12 {grid-column: 1/2;  grid-row: 3/4; height:2px; visibility: hidden;}
	  .late13 {grid-column: 1/2;  grid-row: 4/5; height:2px; visibility: hidden;}

	.contenedor .menulate1 .card{margin:20px 0px;}
			.contenedor .menulate1 p img{
	 margin:0px 4px 0px 4px; padding:2px;                
		-moz-border-radius: 10px; -webkit-border-radius: 10px;  
		   width: 90%;  	
					 box-shadow: 2px 2px 10px 5px rgba(0,0,0,0.4);}	



	.contenedor .cuerpo {
		grid-area: cuerpo;
		display: grid;
		grid-template-rows: repeat(7, auto);
		grid-template-areas: "cuerpo1"
					"tituloP"
					"escuela1"
					"escuela2"							 
					"escuela3 "
					" escuela4"
					"cuerpo6";
	}

		.contenedor .cuerpo .cuerpo1 {grid-area: cuerpo1;   margin:10px; padding:10px;}
		.contenedor .cuerpo .tituloP {grid-area: tituloP;   margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela1 {grid-area: escuela1; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela2 {grid-area: escuela2; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela3 {grid-area: escuela3; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela4 {grid-area: escuela4; margin:10px; padding:10px;}
		.contenedor .cuerpo .cuerpo6 {grid-area: cuerpo6;   margin:10px; padding:50px; }
		


	.tituloP { grid-area: tituloP; align-self:center; justify-self:center; padding: 20px 0;font-size: 30px;text-align: center; }
	.escuela1, .escuela2, .escuela3, .escuela4 {  width:80%;
	align-self:center; justify-self:center;  border: 2px solid blue;  
	border-radius: 10px; padding: 20px; font-size: 12px; text-align: center;}

	.escuela1 .conImg .img, .escuela2 .conImg .img ,.escuela3 .conImg .img ,.escuela4 .conImg .img{width:100%;}
	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3  .img{width:100%; height:100%; border-radius: 6px;} 

	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3 .img, p{ margin:10px 0px 0px 0px; } 


		.contenedor .cuerpo .escuela2 .conImg .contenedor1 {grid-area: escuela2; margin:10px; padding:10px;}

	 .contenedor .cuerpo .escuela2 .conImg #ddd h3 {grid-area: escuela2; height:120px;}



	.contenedor .indenti {grid-area: indenti;	
		display: grid;
		grid-template-columns: 15% 15% repeat(3, 1fr);
		grid-template-rows: repeat(1, auto);
		grid-template-areas: "indEs indEs indId indId indId";  
	}
		.contenedor .indenti  .indId {grid-area: indId; margin:4px; padding:5px 4px; text-align: center;}
		.contenedor .indenti  .indId h4{grid-area: indId; line-height: 3; font-size: 12px; font:bold;}	
		.contenedor .indenti  .indEs {grid-area: indEs; margin:4px 2px 4px 8px;}




		.contenedor .video {
			grid-area: video; 	padding: 0% 10%;		
			display: grid;
			grid-template-rows: repeat(2, auto);
		}

				.contenedor .video .video0 {padding: 0% 10%;}

				.contenedor .video .video1 {}

			.contenedor .flecha  {margin:10px; padding:10px;
				grid-area: flecha;
				
				}


	.contenedor .footer {grid-area: footer; background-color:#AED6F1; } 
	.pie{text-align:center; font-size:14px; color:#000000;
		background: #78c4f4; background-image: url(imgFon/nuevoR1C2.jpg);
		background-repeat: repeat-x; padding: 10px 0px;
		border-radius:0px 0px 15px 15px; box-shadow: 0px 8px 2px -2px #707070;}
		
	}	
	
	/* ----------------------------*/
	
 @media (min-width: 576px) and (max-width: 767.98px) 
	{
		 /*Lateral*/
.NaveLateralLinks{ background-color:#ccffcf; font-size: 14px;}

.NaveLateralLinks h3{color:#E87878; font-size: 20px;}	

#NaveLateral ul a:link, #NaveLateral ul a:visited {
	display: block;  text-decoration: none;
	font-weight: bold;  font-size: 14px;
	color: #000000;  padding: 2px 0px 2px 20px;}

#NaveLateral ul a:hover { font-size: 14px;  color: #000000;
	text-decoration: none;   font-weight: bold;
	line-height:1.1; background-image:url(imgFon/apple.jpg);}

#NaveLateral ul {list-style: none; margin:  0; padding: 0;}
		
		#contenido {text-align: justify; padding: 0px 30px;	font-size: 15px; background-color: #fff;}
	#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center;}
	#contenido h3 {	padding: 10px;	font-size: 20px; text-align: center; color:#0000FF;}
	#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;  color:red;}
	#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}

	.contenedor {
		width: 100%;
		margin: 0px auto;
		display: grid;
		grid-template-columns: 14% 14% repeat(3, 1fr);
		grid-template-rows: repeat(7, auto);
		grid-template-areas: "header header header header header"
		 "menulate menulate menu menu menu"
		 "menulate menulate indenti indenti indenti"
		 "menulate menulate cuerpo cuerpo cuerpo"
		 "menulate menulate video video video"
		 "menulate menulate flecha flecha flecha"
		 "footer footer footer footer footer";
	}
				

	.header {  display: grid;
	  grid-template-columns: repeat(6, 1fr);
	  grid-template-rows: repeat(1, 1fr);
	  gap: 0px 0px;
	  justify-content: space-between;
	  align-content: space-between;
	  justify-items: center;
	  align-items: center;
	  grid-template-areas:
		"logo slogan slogan slogan slogan slogan";
	  grid-area: header;
	       }
	.logo { grid-area: logo;   width:80%; height:80%;}
	#logoC  img{grid-area: logo;  width:100%; height:100%;}
	#logoC a {width:80%; height:80%; padding:2% 2%;}
	#logoC a img{grid-area: logo;  width:90%; height:90%;}
	.slogan { grid-area: slogan;  width:100%;}
		
	.contenedor .header   h1{grid-area: header;	padding: 0px 0px 0px 40px; margin:10px; font-size: 33px;}
	.contenedor .header   h2{grid-area: header; padding: 0px 0px 0px 100px; margin:10px;	font-size: 28px;}

	.contenedor .menu{grid-area: menu; height:170px;  padding:10px 10px 30px 10px; margin:10px; z-index: 100;}
	.contenedor .menu .collapse{grid-area: menu; height:180px; overflow:hidden; z-index: 100;}


	/*.contenedor .menu {	grid-area: menu; padding:0px 100px 0px 100px; margin:0px;}
	.contenedor .menu .collapse{grid-area: menu; height:180px; overflow:hidden; z-index: 100;}*/


	.contenedor .menulate {	grid-area: menulate; margin: 0% 0% 0% 5%;}
	.contenedor .menulate  a{ grid-area: menulate;margin: 0% 5% 0% 0%; font-size: 12px; }
	.contenedor .menulate {	grid-area: menulate;
		padding: 0px;	grid-template-rows: repeat(2, auto);
	}
			.contenedor .menulate0 {grid-area: menulate0; }
			.contenedor .menulate1 {grid-area: menulate1; }


	  .menulate1 {display: grid;
	  /*  grid-gap: 2px;  */
		grid-template-columns: repeat(1, [col] 1fr ) ;
		grid-template-rows: repeat(4, [row] auto  );
	}
	  .late10 {grid-column: 1/2;  grid-row: 1/2; height:2px; visibility: hidden;}
	  .late11 {grid-column: 1/2;  grid-row: 2/3; height:2px; visibility: hidden;}
	  .late12 {grid-column: 1/2;  grid-row: 3/4; height:2px; visibility: hidden;}
	  .late13 {grid-column: 1/2;  grid-row: 4/5; height:2px; visibility: hidden;}

	.contenedor .menulate1 .card{margin:20px 0px;}
			.contenedor .menulate1 p img{
	 margin:0px 4px 0px 4px; padding:2px;                
		-moz-border-radius: 10px; -webkit-border-radius: 10px;  
		   width: 90%;  	
					 box-shadow: 2px 2px 10px 5px rgba(0,0,0,0.4);}	



	.contenedor .cuerpo {
		grid-area: cuerpo;
		display: grid;
		grid-template-rows: repeat(7, auto);
		grid-template-areas: "cuerpo1"
							 "tituloP"
							 "escuela1"
                             "escuela2"							 
							 "escuela3 "
							 " escuela4"
							 "cuerpo6";
	}

		.contenedor .cuerpo .cuerpo1 {grid-area: cuerpo1;   margin:10px; padding:10px;}
		.contenedor .cuerpo .tituloP {grid-area: tituloP;   margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela1 {grid-area: escuela1; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela2 {grid-area: escuela2; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela3 {grid-area: escuela3; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela4 {grid-area: escuela4; margin:10px; padding:10px;}
		.contenedor .cuerpo .cuerpo6 {grid-area: cuerpo6;   margin:10px; padding:50px; }
		


	.tituloP { grid-area: tituloP; align-self:center; justify-self:center; padding: 20px 0;font-size: 30px;text-align: center; }
	.escuela1, .escuela2, .escuela3, .escuela4 {  width:80%;
	align-self:center; justify-self:center;  border: 2px solid blue;  
	border-radius: 10px; padding: 20px; font-size: 12px; text-align: center;}

	.escuela1 .conImg .img, .escuela2 .conImg .img ,.escuela3 .conImg .img ,.escuela4 .conImg .img{width:100%;}
	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3  .img{width:100%; height:100%; border-radius: 6px;} 

	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3 .img, p{ margin:10px 0px 0px 0px; } 


		.contenedor .cuerpo .escuela2 .conImg .contenedor1 {grid-area: escuela2; margin:10px auto ; padding:10px;}

	 .contenedor .cuerpo .escuela2 .conImg #ddd h3 {grid-area: escuela2; height:120px;}



		.contenedor .indenti {grid-area: indenti;	
			display: grid;
			grid-template-columns: 15% 15% repeat(3, 1fr);
			grid-template-rows: repeat(1, auto);
			grid-template-areas: "indEs indEs indId indId indId";  
		}
		.contenedor .indenti  .indId {grid-area: indId; margin:4px; padding:5px 4px; text-align: center;}
		.contenedor .indenti  .indId h4{grid-area: indId; line-height: 3; font-size: 16px; font:bold;}	
		.contenedor .indenti  .indEs {grid-area: indEs; margin:4px 2px 4px 8px;}


		.contenedor .video {
			grid-area: video; 	padding: 0% 10%;		
			display: grid;
			grid-template-rows: repeat(2, auto);
		}

				.contenedor .video .video0 {padding: 0% 10%;}

				.contenedor .video .video1 {}

	.contenedor .flecha  {margin:10px; padding:10px;
				grid-area: flecha;
				
				}


	.contenedor .footer {grid-area: footer; background-color:#AED6F1; } 
	.pie{text-align:center; font-size:14px; color:#000000;
		background: #78c4f4; background-image: url(imgFon/nuevoR1C2.jpg);
		background-repeat: repeat-x; padding: 10px 0px;
		border-radius:0px 0px 15px 15px; box-shadow: 0px 8px 2px -2px #707070;}
		
	}		
		
	
	
@media (min-width: 768px) and (max-width: 991.98px) 
	{
 /*Lateral*/
.NaveLateralLinks{ background-color:#ccffcf; font-size: 14px;}

.NaveLateralLinks h3{color:#E87878; font-size: 18px;}	

#NaveLateral ul a:link, #NaveLateral ul a:visited {
	display: block;  text-decoration: none;
	font-weight: bold;  font-size: 14px;
	color: #000000;  padding: 2px 0px 2px 20px;}

#NaveLateral ul a:hover { font-size: 14px;  color: #000000;
	text-decoration: none;   font-weight: bold;
	line-height:1.1; background-image:url(imgFon/apple.jpg);}

#NaveLateral ul {list-style: none; margin:  0; padding: 0;}

	#contenido {text-align: justify; padding: 0px 30px;	font-size: 15px; background-color: #fff;}
#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center;}
#contenido h3 {	padding: 10px;	font-size: 20px; text-align: center; color:#0000FF;}
#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;  color:red;}
#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}


	.contenedor {
	width: 100%;
	margin: 0px auto;
	display: grid;
		grid-template-columns: 22% 22% repeat(3, 1fr);
		grid-template-rows: repeat(7, auto);
		grid-template-areas: "header header header header header"
		 "menulate menulate menu menu menu"		 
		 "menulate menulate indenti indenti indenti"
		 "menulate menulate cuerpo cuerpo cuerpo"
		 "video video video video video"
		 "video flecha flecha flecha flecha"
		 "footer footer footer footer footer";
	}

	.header {  display: grid;
	  grid-template-columns: repeat(6, 1fr);
	  grid-template-rows: repeat(1, 1fr);
	  gap: 0px 0px;
	  justify-content: space-between;
	  align-content: space-between;
	  justify-items: center;
	  align-items: center;
	  grid-template-areas:
		"logo slogan slogan slogan slogan slogan";
	  grid-area: header;
	       }

	.logo { grid-area: logo;   width:80%; height:80%;}
	#logoC  img{grid-area: logo;  width:100%; height:100%;}
	#logoC a {width:80%; height:80%; padding:2% 2%;}
	#logoC a img{grid-area: logo;  width:90%; height:90%;}
	.slogan { grid-area: slogan;  width:100%;}
		
	.contenedor .header   h1{grid-area: header;	padding: 0px 0px 0px 40px; margin:10px; font-size: 33px;}
	.contenedor .header   h2{grid-area: header; padding: 0px 0px 0px 100px; margin:10px;	font-size: 28px;}

	.contenedor .menu{grid-area: menu; height:170px;  padding:10px 10px 30px 10px; margin:10px; z-index: 100;}
	.contenedor .menu .collapse{grid-area: menu; height:180px; overflow:hidden; z-index: 100;}

	.contenedor .menulate {	grid-area: menulate; margin: 0% 0% 0% 5%;}
	.contenedor .menulate  a{ grid-area: menulate;margin: 0% 5% 0% 0%; font-size: 12px; }
	.contenedor .menulate {	grid-area: menulate;
		padding: 0px;	grid-template-rows: repeat(2, auto);
	}
			.contenedor .menulate0 {grid-area: menulate0; }
			.contenedor .menulate1 {grid-area: menulate1; }


	  .menulate1 {display: grid;
	  /*  grid-gap: 2px;  */
		grid-template-columns: repeat(1, [col] 1fr ) ;
		grid-template-rows: repeat(4, [row] auto  );
	}
	  .late10 {grid-column: 1/2;  grid-row: 1/2; height:2px; visibility: hidden;}
	  .late11 {grid-column: 1/2;  grid-row: 2/3; height:2px; visibility: hidden;}
	  .late12 {grid-column: 1/2;  grid-row: 3/4; height:2px; visibility: hidden;}
	  .late13 {grid-column: 1/2;  grid-row: 4/5; height:2px; visibility: hidden;}

	.contenedor .menulate1 .card{margin:20px 0px;}
			.contenedor .menulate1 p img{
	 margin:0px 4px 0px 4px; padding:2px;                
		-moz-border-radius: 10px; -webkit-border-radius: 10px;  
		   width: 90%;  	
					 box-shadow: 2px 2px 10px 5px rgba(0,0,0,0.4);}	



	.contenedor .cuerpo {
		grid-area: cuerpo;
		display: grid;
		grid-template-rows: repeat(7, auto);
		grid-template-areas: "cuerpo1"
							 "tituloP"
							 "escuela1"
                             "escuela2"							 
							 "escuela3 "
							 " escuela4"
							 "cuerpo6";
	}

		.contenedor .cuerpo .cuerpo1 {grid-area: cuerpo1;   margin:10px; padding:10px;}
		.contenedor .cuerpo .tituloP {grid-area: tituloP;   margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela1 {grid-area: escuela1; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela2 {grid-area: escuela2; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela3 {grid-area: escuela3; margin:10px; padding:10px;}
		.contenedor .cuerpo .escuela4 {grid-area: escuela4; margin:10px; padding:10px;}
		.contenedor .cuerpo .cuerpo6 {grid-area: cuerpo6;   margin:10px; padding:50px; }
		


	.tituloP { grid-area: tituloP; align-self:center; justify-self:center; padding: 20px 0;font-size: 30px;text-align: center; }
	.escuela1, .escuela2, .escuela3, .escuela4 {  width:80%;
	align-self:center; justify-self:center;  border: 2px solid blue;  
	border-radius: 10px; padding: 20px; font-size: 12px; text-align: center;}

	.escuela1 .conImg .img, .escuela2 .conImg .img ,.escuela3 .conImg .img ,.escuela4 .conImg .img{width:100%;}
	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3  .img{width:100%; height:100%; border-radius: 6px;} 

	.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3 .img, p{ margin:10px 0px 0px 0px; } 


		.contenedor .cuerpo .escuela2 .conImg .contenedor1 {grid-area: escuela2; margin:10px auto; padding:10px;}

	 .contenedor .cuerpo .escuela2 .conImg #ddd h3 {grid-area: escuela2; height:120px;}


		.contenedor .indenti {grid-area: indenti;	
			display: grid;
			grid-template-columns: 15% 15% repeat(3, 1fr);
			grid-template-rows: repeat(1, auto);
			grid-template-areas: "indEs indEs indId indId indId";  
		}
		.contenedor .indenti  .indId {grid-area: indId; margin:4px; padding:5px 4px; text-align: center;}
		.contenedor .indenti  .indId h4{grid-area: indId; line-height: 3; font-size: 15px; font:bold;}	
		.contenedor .indenti  .indEs {grid-area: indEs; margin:4px 2px 4px 8px;}


		.contenedor .video {
			grid-area: video; 	padding: 0% 10%;		
			display: grid;
			grid-template-rows: repeat(2, auto);
		}

				.contenedor .video .video0 {padding: 0% 10%;}

				.contenedor .video .video1 {}

			.contenedor .flecha  {margin:10px; padding:10px;
				grid-area: flecha;
				}


	.contenedor .footer {grid-area: footer; background-color:#AED6F1; } 
	.pie{text-align:center; font-size:14px; color:#000000;
		background: #78c4f4; background-image: url(imgFon/nuevoR1C2.jpg);
		background-repeat: repeat-x; padding: 10px 0px;
		border-radius:0px 0px 15px 15px; box-shadow: 0px 8px 2px -2px #707070;}
		
	}	



@media (min-width: 992px) and (max-width: 1199.98px) 
{
 .contenidotemas{
width: 99%; 	padding:0px 15px;}
#contenido {text-align: justify; padding: 0px 30px;	font-size: 15px; background-color: #fff;}
#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center;}
#contenido h3 {	padding: 10px;	font-size: 30px; text-align: center; color:#0000FF;}
#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;  color:red;}
#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}
 

.contenedor {
	width: 100%;
	margin: 0px auto;
	display: grid;
	grid-template-columns: 22% repeat(4, 1fr);
	grid-template-rows: repeat(7, auto);
	grid-template-areas: "header header header header header"
	                     "menulate menu menu menu menu"
	                     "menulate indenti indenti indenti indenti"
						 "menulate cuerpo cuerpo cuerpo cuerpo"
						 "video video video video video"
						 "flecha flecha flecha flecha flecha"
	                     "footer footer footer footer footer";
}

.header {  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(1, 1fr);
  gap: 0px 0px;
  justify-content: space-between;
  align-content: space-between;
  justify-items: center;
  align-items: center;
  grid-template-areas:
    "logo slogan slogan slogan slogan slogan";
  grid-area: header;
}

.logo { grid-area: logo;   width:80%; height:80%;}
#logoC  img{grid-area: logo;  width:100%; height:100%;}
#logoC a {width:80%; height:80%; padding:2% 2%;}
#logoC a img{grid-area: logo;  width:90%; height:90%;}
.slogan { grid-area: slogan;  width:100%;}
	
.contenedor .header   h1{grid-area: header;	padding: 0px 0px 0px 80px; margin:10px; font-size: 35px;}
.contenedor .header   h2{grid-area: header; padding: 0px 0px 0px 100px; margin:10px;	font-size: 33px;}

.contenedor .menu{grid-area: menu; height:150px;  padding:10px 10px 30px 10px; margin:10px; z-index: 100;}
.contenedor .menu .yas{	grid-area: menu;  z-index:110;}
.contenedor .menu .collapse, .navbar-collapse{grid-area: menu; padding:10px 10px 40px 10px;}

.contenedor .menulate {	grid-area: menulate;}
.contenedor .menulate  a{ grid-area: menulate;margin: 0% 15% 0% 0%; font-size: 12px; }
.contenedor .menulate {	grid-area: menulate;
	padding: 0px 20px;	grid-template-rows: repeat(2, auto);
}
		.contenedor .menulate0 {grid-area: menulate0; }
		.contenedor .menulate1 {grid-area: menulate1; padding:5px;}


  .menulate1 {display: grid;
  /*  grid-gap: 2px;  */
    grid-template-columns: repeat(1, [col] 1fr ) ;
    grid-template-rows: repeat(4, [row] auto  );
}
  .late10 {grid-column: 1/2;  grid-row: 1/2; }
  .late11 {grid-column: 1/2;  grid-row: 2/3; }
  .late12 {grid-column: 1/2;  grid-row: 3/4; }
  .late13 {grid-column: 1/2;  grid-row: 4/5; }

.contenedor .menulate1 .card{margin:20px 0px;}
		.contenedor .menulate1 p img{
 margin:0px 4px 0px 4px; padding:2px;                
	-moz-border-radius: 10px; -webkit-border-radius: 10px;  
	   width: 90%;  	
				 box-shadow: 2px 2px 10px 5px rgba(0,0,0,0.4);}	


.contenedor .cuerpo {
	grid-area: cuerpo;
	display: grid;
	grid-template-rows: repeat(5, auto);
	grid-template-areas: "cuerpo1 cuerpo1"
	                     "tituloP tituloP"
	                     "escuela1  escuela2"	                     
	                     "escuela3  escuela4"
						 "cuerpo6 cuerpo6";
}

	.contenedor .cuerpo .cuerpo1 {grid-area: cuerpo1;   margin:10px; padding:10px;}
	.contenedor .cuerpo .tituloP {grid-area: tituloP;   margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela1 {grid-area: escuela1; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela2 {grid-area: escuela2; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela3 {grid-area: escuela3; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela4 {grid-area: escuela4; margin:10px; padding:10px;}
	.contenedor .cuerpo .cuerpo6 {grid-area: cuerpo6;   margin:10px; padding:50px; }
	

.tituloP { grid-area: tituloP; align-self:center; justify-self:center; padding: 20px 0;font-size: 30px;text-align: center; }
.escuela1, .escuela2, .escuela3, .escuela4 {  width:80%;
align-self:center; justify-self:center;  border: 2px solid blue;  
border-radius: 10px; padding: 20px; font-size: 12px; text-align: center;}

.escuela1 .conImg .img, .escuela2 .conImg .img ,.escuela3 .conImg .img ,.escuela4 .conImg .img{width:100%;}
.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3  .img{width:100%; height:100%; border-radius: 6px;} 

.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3 .img, p{ margin:10px 0px 0px 0px; } 


	 .contenedor .cuerpo .escuela2 .conImg #ddd h3 {grid-area: escuela2; height:140px;}


.contenedor .indenti {grid-area: indenti;
    display: grid;
	grid-template-columns: 10% 10% repeat(3, 1fr);
	grid-template-rows: repeat(1, auto);
    grid-template-areas: "indEs indEs indId indId indId";  
}
.contenedor .indenti  .indId {grid-area: indId;	margin:2px; padding: 5px 0px; 	text-align: center; }
	
.contenedor .indenti  .indId  h4{grid-area: indId;	line-height:2; font-size: 16px; }	

.contenedor .indenti  .indEs {grid-area: indEs;	 margin:2px; 	padding: 5px; display: flex;
  align-items: center;  justify-content: center; }


	.contenedor .video {
		grid-area: video; 	padding: 0% 10%;		
		display: grid;
		grid-template-rows: repeat(2, auto);
	}

			.contenedor .video .video0 {padding: 0% 10%;}

			.contenedor .video .video1 {}

		.contenedor .flecha  {margin:10px; padding:10px;
			grid-area: flecha;
			
			}


.contenedor .footer {grid-area: footer; background-color:#AED6F1; } 
.pie{text-align:center; font-size:14px; color:#000000;
	background: #78c4f4; background-image: url(imgFon/nuevoR1C2.jpg);
	background-repeat: repeat-x; padding: 10px 0px;
    border-radius:0px 0px 15px 15px; box-shadow: 0px 8px 2px -2px #707070;}
 }	
	



@media (min-width: 1200px) { 
 .contenidotemas{width: 99%; 	padding:0px 15px;}
#contenido {text-align: justify; padding: 0px 30px;	font-size: 15px; background-color: #fff;}
#contenido h2 {padding: 10px;  	font-size: 15px; text-align: center;}
#contenido h3 {	padding: 10px;	font-size: 30px; text-align: center; color:#0000FF;}
#contenido h4 {	padding: 2px;  font-size: 20px; text-align:center;  color:red;}
#contenido ul li {padding: 0px 10px; list-style-type:decimal;  font-size: 15px;}
 

.contenedor {
	width: 100%;
	margin: 0px auto;
	display: grid;
	grid-template-columns: 20% repeat(4, 1fr);
	grid-template-rows: repeat(7, auto);
	grid-template-areas: "header header header header header"
	                     "menulate menu menu menu menu"
	                     "menulate indenti indenti indenti indenti"
						 "menulate cuerpo cuerpo cuerpo cuerpo"
						 "menulate video video video video"
						 "menulate flecha flecha flecha flecha"
	                     "footer footer footer footer footer";
}

.header {  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(1, 1fr);
  gap: 0px 0px;
  justify-content: space-between;
  align-content: space-between;
  justify-items: center;
  align-items: center;
  grid-template-areas:
    "logo slogan slogan slogan slogan slogan";
  grid-area: header;
}

.logo { grid-area: logo;   width:80%; height:80%;}
#logoC  img{grid-area: logo;  width:100%; height:100%;}
#logoC a {width:80%; height:80%; padding:2% 2%;}
#logoC a img{grid-area: logo;  width:90%; height:90%;}
.slogan { grid-area: slogan;  width:100%;}
	
.contenedor .header h1{grid-area: header; padding: 0px 0px 0px 80px; margin:10px; font-size: 35px;}
.contenedor .header   h2{grid-area: header; padding: 0px 0px 0px 100px; margin:10px;	font-size: 33px;}

.contenedor .menu{grid-area: menu; height:150px;  padding:10px 10px 30px 10px; margin:10px; z-index: 100;}
.contenedor .menu .yas{	grid-area: menu;  z-index:110;}
.contenedor .menu .collapse, .navbar-collapse{grid-area: menu; padding:10px 10px 40px 10px;}

.contenedor .menulate {	grid-area: menulate;}
.contenedor .menulate  a{ grid-area: menulate;margin: 0% 15% 0% 0%; font-size: 12px; }
.contenedor .menulate {	grid-area: menulate;
	padding: 0px 20px;	grid-template-rows: repeat(2, auto);
}
		.contenedor .menulate0 {grid-area: menulate0; }
		.contenedor .menulate1 {grid-area: menulate1;padding:5px; }


  .menulate1 {display: grid;
  /*  grid-gap: 2px;  */
    grid-template-columns: repeat(1, [col] 1fr ) ;
    grid-template-rows: repeat(4, [row] auto  );
}
  .late10 {grid-column: 1/2;  grid-row: 1/2; }
  .late11 {grid-column: 1/2;  grid-row: 2/3; }
  .late12 {grid-column: 1/2;  grid-row: 3/4; }
  .late13 {grid-column: 1/2;  grid-row: 4/5; }

.contenedor .menulate1 .card{margin:20px 0px;}
		.contenedor .menulate1 p img{
 margin:0px 4px 0px 4px; padding:2px;                
	-moz-border-radius: 10px; -webkit-border-radius: 10px;  
	   width: 90%;  	
				 box-shadow: 2px 2px 10px 5px rgba(0,0,0,0.4);}	


.contenedor .cuerpo {
	grid-area: cuerpo;
	display: grid;
	grid-template-rows: repeat(5, auto);
	grid-template-areas: "cuerpo1 cuerpo1"
	                     "tituloP tituloP"
	                     "escuela1  escuela2"	                     
	                     "escuela3  escuela4"
						 "cuerpo6 cuerpo6";
}

	.contenedor .cuerpo .cuerpo1 {grid-area: cuerpo1;   margin:10px; padding:10px;}
	.contenedor .cuerpo .tituloP {grid-area: tituloP;   margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela1 {grid-area: escuela1; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela2 {grid-area: escuela2; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela3 {grid-area: escuela3; margin:10px; padding:10px;}
	.contenedor .cuerpo .escuela4 {grid-area: escuela4; margin:10px; padding:10px;}
	.contenedor .cuerpo .cuerpo6 {grid-area: cuerpo6;   margin:10px; padding:50px; }
	

.tituloP { grid-area: tituloP; align-self:center; justify-self:center; padding: 20px 0;font-size: 30px;text-align: center; }
.escuela1, .escuela2, .escuela3, .escuela4 {  width:80%;
align-self:center; justify-self:center;  border: 2px solid blue;  
border-radius: 10px; padding: 20px; font-size: 12px; text-align: center;}

.escuela1 .conImg .img, .escuela2 .conImg .img ,.escuela3 .conImg .img ,.escuela4 .conImg .img{width:100%;}
.escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3  .img{width:100%; height:100%; border-radius: 6px;} 

      .escuela1 .img,.escuela4 .img,.escuela2 .img, .escuela3 .img, p{ margin:10px 0px 0px 0px; } 
       .contenedor .cuerpo .escuela2 .conImg #ddd h3 {grid-area: escuela2; height:140px;}

		.contenedor .cuerpo .escuela2 .conImg .contenedor1 {grid-area: escuela2; margin:10px auto; padding:10px;}

.contenedor .indenti {grid-area: indenti;
    display: grid;
	grid-template-columns: 10% 10% repeat(3, 1fr);
	grid-template-rows: repeat(1, auto);
    grid-template-areas: "indEs indEs indId indId indId";  
}
.contenedor .indenti  .indId {grid-area: indId;	margin:2px; padding: 5px 0px; 	text-align: center; }
	
.contenedor .indenti  .indId  h4{grid-area: indId;	line-height:2; font-size: 16px; }	

.contenedor .indenti  .indEs {grid-area: indEs;	 margin:2px; 	padding: 5px; display: flex;
  align-items: center;  justify-content: center; }


	.contenedor .video {
		grid-area: video; 	padding: 0% 10%;		
		display: grid;
		grid-template-rows: repeat(2, auto);
	}

			.contenedor .video .video0 {padding: 0% 10%;}

			.contenedor .video .video1 {}

		.contenedor .flecha  {
			grid-area: flecha;
            margin:10px; padding:10px;
			}


.contenedor .footer {grid-area: footer; background-color:#AED6F1; } 
.pie{text-align:center; font-size:14px; color:#000000;
	background: #78c4f4; background-image: url(imgFon/nuevoR1C2.jpg);
	background-repeat: repeat-x; padding: 10px 0px;
    border-radius:0px 0px 15px 15px; box-shadow: 0px 8px 2px -2px #707070;}
 }