#principal{                                 /* contenedor de la página */
	width:   	auto;
	max-width:	90%;
	height: 	auto; overflow: hidden;
	border: 	0px solid #000;
	margin: 	auto;
	font-size:  90%;
	box-sizing:		border-box;
	font-family: 'Arial Narrow', sans-serif;
}

#header{
		margin-right: 2%;
}

h1, h2, h3, h4{
	margin-top:		2%;
	margin-bottom:	1%;
	font-style: 	bold;
	text-align:		center;
}

h1{
	font-size: 		170%;
	font-family:	PecitaBook; font-weight: normal; font-style: normal;
}

h2{
	font-size: 		150%;
	background: 	#38bcd6;
	font-family:	PecitaBook; font-weight: normal; font-style: normal;
}

h3{
	font-size: 		130%;
	color: 			#38bcd8;
	font-family:	PecitaBook; font-weight: normal; font-style: normal;
}

h4{
	font-size: 		110%;
	color: 			#8f0e8f;
	margin-bottom:	0.5;
}

header{
		width:  auto;
		height: 160px;
		border: 0px solid #000;
		margin-top:10px;
}

#logo{                                     /* caja del logo */
	width:  299px;
	height: 150px;
	border: 0px solid #000;
	float:	left;
}


.menu{                                     /* caja del menú */
	width: 			500px;                          
	height: 		55px;
	border: 		0px solid #ccc;
	float: 			right;
	margin-top:		30px;
	background: 	#38bcd6;
	font-size:		120%;
	font-family:    Arial Narrow;
}

.menu ul{}

.menu ul li{
	list-style:		none;
	float:			right;
}

.menu ul li a{
	text-decoration:none;
	padding: 		10px 10px;                 /*  ampliar distancia del menú */
	border:			0px solid #ccc;
	color:			#fff;                         /*  color de letras */
}

.menu ul li a:hover{
	background:		#fff;
	color:			#006669;
	transition:		background 0.5s, color 0.5s;
	cursor:			pointer;
}

#mision{
	border: 		0px solid #c0c0c0;
	padding:		5px 5px;
	margin-top:		7px;
	float:			center;
	width: 			100%;
	height: 		auto;
	background:		#60F5A6;
	font-family: 	PecitaBook;
	font-size:		120%;
}

#boletin{
	width:			75%;
	float:			left;
	height:			auto; overflow:hidden;
	border: 		0px solid;
	padding:		1% 1%;
	box-sizing:		border-box;
	text-align: 	justify;
}

#lateral{
	width:			25%;
	float:			right;
	height:			auto; overflow:hidden;
	border: 		0px solid #c0c0c0;
	background: 	#f5f5f5;
	padding:		1% 1%;
	box-sizing:		border-box;
	text-align: 	justify;
}

#categorias{                            /*sección de categorías*/
	width:			100%;
	height:			auto; overflow:hidden;
	border: 		0px solid;
	margin-top:		10px;
}

.uno{
	width:			30%;
	margin-top:		2%;
	height:			250px;
	border:			1px solid #c0c0c0;
	float:			left;
	padding:		5px;
	text-align:		center;
}

.dos{
	margin-top:		2%;
	margin-left: 	3%;
	margin-right:	3%;
}

#colectivo2{                            /*sección de categorías Pág Colectivo*/
	width:			100%;
	height:			auto; overflow:hidden;
	border: 		0px solid;
	margin-top:		10px;
}

#unoo{
	width:			60%;
	height:			auto; overflow:hidden;
	border: 		0px solid #000;
	float:			left;
	padding:		10px;
}

#doss{
	width:			35%;
	height:			auto; overflow:hidden;
	border: 		1px solid #c0c0c0;
	float:  		right;
	padding:		5px;
}	


.leer-mas{
	border:			0;
	text-decoration:none;
	padding:		10px 15px;
	margin:			5px;
	background: 	#64d7ed;
	color:			#520452;
	transition:     background-color 0.3s ease, color 0.3s ease;
	cursor:         pointer;
}
.leer-mas:hover{
	background: 	#2e7d8c;
	color:			#ffffff;
}

.celda-link {
	display:		block;
	width:			100%;
	height:			100%;
	padding:		12px 16px;
	text-decoration:none;
	color: 			inherit;
}

#info{
	width:			99%;
	height:			auto;overflow:hidden;
	border: 		0px solid;
	font-family: 	sans-serif;
}

#izq{
	width:			39%;
	height:			auto;
	border: 		0px solid #000;
	float:			left;
	padding:		5px;
}
#der{
	width:			59%;
	height:			auto;
	border: 		0px solid #000;
	float:  		right;
	padding:		3px;
}

.nota1{
	font:			Times New Roman;
	font-size:		85%;
}
	
.nota2{
	font:			Times New Roman;
	font-size:		75%;
}

footer{
	width:			100%;
	height:			auto;
	text-align:		center;
	margin-bottom:  5%;
	clear:			both;
	box-sizing: 	border-box;
}


footer p{
	wid
	width:			50%;
	text-align:		center;
}

.img{
	margin-right:	2%;
	margin-bottom:	1%;
	height:			auto;
}

img:hover{
	opacity:		0.9; filter:alpha(opacity=90)
}	

table {
  width: 			100%;
  border-collapse:	collapse;
  table-layout:		fixed;
  border:			1px solid #e5e7eb;
}

th, td {
  padding:			12px 16px;
  text-align:		left;
  transition:		background-color 0.2s ease;
}

th {
  background-color: #f9fafb;
  font-weight:		600;
  color:			#374151;
}

tr,
td {
  background-color: transparent;
}


td:hover {
  background-color: #e5e7eb;
}


form{									/*Parte del correo*/
	width:			60%;
	margin:			auto;
	background:		rgba(0,0,0,0.4);
	padding:		3% 6%;
	box-sizing:		border-box;
	margin-top:		5%;
	margin-bottom:	7%;
}

input, textarea{
	width:			100%;
	margin-bottom:	7px;
	padding:		5px;
	font-size:		12px;
	box-sizing:		border-box;
}

textarea{
	min-height:		100px;
	max-height:		500px;
	max-width:		100%;
}

#botoncorreo{
	background:		#000;
	color:			#fff;
	padding:		5px;
}

#botoncorreo:hover{
	cursor:pointer;
}

.biof{
	width:			24%;
	float:			right;
	height:			auto; overflow:hidden;
	border: 		1px solid #c0c0c0;
	background: 	#ECEEED;
	padding:		1% 1%;
	box-sizing:		border-box;
	text-align: 	justify;
}

.biop{
	width:			74%;
	float:			left;
	height:			auto; overflow:hidden;
	border: 		0px solid;
	padding:		1% 1%;
	box-sizing:		border-box;
	text-align: 	justify;
}

.biot{
	width:			100%;
	float:			left;
	height:			auto; overflow:hidden;
	border: 		0px solid;
	padding:		1% 1%;
	box-sizing:		border-box;
	text-align: 	justify;
}

.libros{
	width:			100%;
	float:			left;
}