/* CSS Document */
body {
	font-family: 'Sarabun', sans-serif;
}
.marron {
	color: rgba(148,140,133,1.00);
}
.backmarron {
	background-color: rgba(148,140,133,1.00);
}
.blue{
	color: rgba(1,70,112,1.00);
}
.backblue{
	background-color: rgba(1,70,112,1.00);
}
.orange{
	color: rgba(255,90,26,1.00);
}
.backorange{
	background-color: rgba(255,90,26,1.00);
}
.backorange:hover {
  background-color: rgba(148,140,133,1.00);
}

@media only screen and (max-width: 480px) {
.marca-head {
	width: 100%;
	margin: auto;
	text-align: left;
	padding: 2% 70px 0 1%;
	margin-top: 1%;
}
.marca-foot {
	width: 75%;
	margin: auto;
	text-align: center;
	padding: 1%;
}
.seccion {
	float: left;
	padding: 0.75% 0.5% 0 0.5%;
}
.salto {
	clear: both;
}
.hoy {
	float: none;
}
.seccion {
	float: none;
	padding: 2%;
	font-size: 14px;
}
.salto {
	clear: both;
}
.reticula {
	width: 90%;
	margin: auto;
}
.col-50 {
	width: 100%;
	float: none;
	margin: 0%;
}
	.col-30{
		width: 96%;
		float: none;
		margin: 2px;
	}
.screen {
	display: none;
}
	.menuico{
		height: 40px;
		position: absolute;
		top: 1%; right: 5%;
		display: block;
		z-index: 10;
	}
/*Nota destacada*/
.thumb-ppal {
	width: 100%;
	min-height: 250px;
	float: none;
	background-size: auto 110% !important;
}
.datos-ppal {
	width: 100%;
	min-height: 250px;
	float: none;
	background-color: rgba(1,70,112,1.00);
}
.datos-ppal h1 {
	width: 100% !important;
	min-height: 220px;
	padding: 1% 0 1% 4%;
	border-left: solid thin white;
	font-size: 32px;
	line-height: 30px;
	letter-spacing: -2px;
	font-weight: 900 !important;
}
/*Dos Columnas*/
.box-nota {
	width: 100%;
	height: auto;
	float: none;
	margin: 0 0 4% 0;
	background-size: auto 110% !important;
	background-color: rgba(0,36,98,1.00) !important;
	padding: 120px 0 0px 0;
}
.back-datos {
	width: 100%;
	height: auto;
	background: url(../img/back-title-box.png) repeat-x bottom;
	background-size: auto 100%;
	padding: 10% 5% 1% 5%;
}
.back-datos h2 {
	width: 100%;
	min-height: 150px;
	padding: 1% 0 1% 4%;
	border-left: solid thin white;
	font-size: 30px;
	line-height: 30px;
	letter-spacing: -2px;
	font-weight: 900 !important;
}
.back-datos h4 {
	width: 100%;
	min-height: 150px;
	padding: 1% 0 1% 4%;
	border-left: solid thin rgba(148,140,133,1.00);
	font-size: 24px;
	line-height: 20px;
	letter-spacing: -1px;
	font-weight: bold !important;
}
/*Dos Columnas PUBLI*/
.box-nota-publi {
	width: 98%;
	height: 350px;
	float: none;
	margin: 1% 1% 1% 1%;
	background-size: auto 90% !important;
	background-color: white !important;
}
/*Box Publi 2*/
.box-publi-2 {
	width: 100%;
	height: auto;
	float: none;
	margin: 0 0 4% 0;
}
/*3 Columnas PUBLI*/
.boxpubli3 {
	width: 98%;
	float: none;
	margin: 1%;
}
/*Cuatro Columnas*/
.box-nota-25 {
	width: 98%;
	height: 620px;
	float: none;
	margin: 1%;
	background-size: auto 50% !important;
	padding: 300px 0 0 0;
}
/*Box Lista*/
.box-nota-lista {
	width: 100%;
	height: auto;
	float: none;
	margin: 1%;
	background-size: auto 100% !important;
}
.box-nota-lista:hover {
	background-color: white;
}
.thumb-lista {
	width: 38%;
	height: 150px;
	margin: 0 1% 0 0;
	float: left;
	background-size: 110% auto !important;
}
.text-lista {
	width: 58%;
	height: auto;
	margin: 1%;
	float: left;
}
.text-lista h6 {
	min-height: 75px;
	border-left: solid thin rgba(148,140,133,1.00);
	padding: 0 0 0 2%;
}
	.tiempo{
		width: 280px;
		float: none;
		margin: auto;
	}
	.fecha-hoy{
		float: none;
		padding: 2%;
		color: midnightblue;
		text-align: center;
		margin: auto;
		
	}
	.flecha{
		width: 30px;
		float: right;
		display: block;
	}
	.movil{
		display: block;
	}
	.buscador{
		width: 100%;
		float: none;
		padding: 2% 2% 2% 2%;
	}
	.columna{
		width: 100%;
		float: none;
	}
	.publi-2col{
		width: 100%; height: auto;
		margin: auto;
	}
}

/* Diseño tableta: de 481 px a 768 px. Hereda estilos de: Diseño móvil. */
@media only screen and (min-width: 481px) {
.marca-head {
	width: 75%;
	margin: auto;
	text-align: left;
	padding: 1% 0 0 0;
	margin-top: 1%;
}
.marca-foot {
	width: 75%;
	margin: auto;
	text-align: center;
	padding: 1%;
}
.hoy {
	float: none;
}
.seccion {
	float: none;
	padding: 2%;
	font-size: 14px;
}
.salto {
	clear: both;
}
.reticula {
	width: 90%;
	margin: auto;
}
.col-50 {
	width: 100%;
	float: none;
	margin: 0%;
}
	.col-30{
		width: 96%;
		float: none;
		margin: 2px;
	}

.screen {
	display: none;
}
	.menuico{
		height: 40px;
		position: absolute;
		top: 1%; right: 5%;
		display: block;
		z-index: 10;
	}
/*Nota destacada*/
.thumb-ppal {
	width: 100%;
	min-height: 270px;
	float: none;
	background-size: 120% auto !important;
}
.datos-ppal {
	width: 100%;
	min-height: 250px;
	float: none;
	background-color: rgba(1,70,112,1.00);
}
.datos-ppal h1 {
	width: 100% !important;
	min-height: 220px;
	padding: 1% 0 1% 4%;
	border-left: solid thin white;
	font-size: 32px;
	line-height: 30px;
	letter-spacing: -2px;
	font-weight: 900 !important;
}
/*Dos Columnas*/
.box-nota {
	width: 100%;
	height: auto;
	float: none;
	margin: 0 0 4% 0;
	background-size: 110% !important;
	background-color: rgba(0,36,98,1.00) !important;
	padding: 150px 0 0px 0;
}
.back-datos {
	width: 100%;
	height: auto;
	background: url(../img/back-title-box.png) repeat-x bottom;
	background-size: auto 100%;
	padding: 10% 5% 1% 5%;
}
.back-datos h2 {
	width: 100%;
	min-height: 150px;
	padding: 1% 0 1% 4%;
	border-left: solid thin white;
	font-size: 30px;
	line-height: 30px;
	letter-spacing: -2px;
	font-weight: 900 !important;
}
.back-datos h4 {
	width: 100%;
	min-height: 150px;
	padding: 1% 0 1% 4%;
	border-left: solid thin rgba(148,140,133,1.00);
	font-size: 24px;
	line-height: 20px;
	letter-spacing: -1px;
	font-weight: bold !important;
}
/*Dos Columnas PUBLI*/
.box-nota-publi {
	width: 98%;
	height: 420px;
	float: none;
	margin: 1% 1% 1% 1%;
	background-size: auto 90% !important;
	background-color: white !important;
}
/*Box Publi 2*/
.box-publi-2 {
	width: 100%;
	height: auto;
	float: none;
	margin: 0 0 4% 0;
}
/*3 Columnas PUBLI*/
.boxpubli3 {
	width: 98%;
	float: none;
	margin: 1%;
}
/*Cuatro Columnas*/
.box-nota-25 {
	width: 98%;
	height: 620px;
	float: none;
	margin: 1%;
	background-size: auto 50% !important;
	padding: 300px 0 0 0;
}
/*Box Lista*/
.box-nota-lista {
	width: 100%;
	height: auto;
	float: none;
	margin: 1%;
	background-size: auto 100% !important;
}
.box-nota-lista:hover {
	background-color: white;
}
.thumb-lista {
	width: 38%;
	height: 150px;
	margin: 0 1% 0 0;
	float: left;
	background-size: 110% auto !important;
}
.text-lista {
	width: 58%;
	height: auto;
	margin: 1%;
	float: left;
}
.text-lista h6 {
	min-height: 75px;
	border-left: solid thin rgba(148,140,133,1.00);
	padding: 0 0 0 2%;
}
	.tiempo{
		width: 320px;
		float: none;
		margin: auto;
	}
	.fecha-hoy{
		float: none;
		padding: 2%;
		color: midnightblue;
		text-align: center;
		margin: auto;
		
	}
	.flecha{
		width: 30px;
		float: right;
		display: block;
	}
	.movil{
		display: block;
	}
	.buscador{
		width: 100%;
		float: none;
	}
	.buscador{
		width: 100%;
		float: none;
		padding: 2% 2% 2% 2%;
	}
	.columna{
		width: 100%;
		float: none;
	}
	.publi-2col{
		width: 100%; height: auto;
		margin: auto;
	}
}

@media only screen and (min-width: 769px) {
.marca-head {
	width: 50%;
	margin: auto;
	text-align: center;
	padding: 1% 5% 0 5%;
	margin-top: 0;
}
.marca-foot {
	width: 25%;
	margin: auto;
	text-align: center;
	padding: 1%;
}
.hoy {
	min-height: 50px;
	float: left;
}
.seccion {
	min-height: 50px;
	float: left;
	padding: 1% 0.25% 0.5% 0.25%;
	font-size: 14px;
}
.seccion:hover {
	background-color: rgba(1,70,112,1.00);
}

.salto {
	clear: both;
}
/*codigos cromaticos*/
.blue {
	color: rgba(0,62,87,1.00);
}
/*ENCABEZADO*/
.lista-menu {
	width: 75%;
	padding: 1% 0 1% 0;
	margin: auto;
}
.lista-menu p {
	font-size: 14px;
}
/*Nota destacada*/
.thumb-ppal {
	width: 50%;
	min-height: 520px;
	float: left;
	background-size: auto 120% !important;
}
.datos-ppal {
	width: 50%;
	min-height: 520px;
	float: left;
	background-color: rgba(1,70,112,1.00);
}
.datos-ppal h1 {
	width: 100%;
	min-height: 350px;
	padding: 1% 0 1% 4%;
	border-left: solid thin white;
	font-size: 58px;
	line-height: 50px;
	letter-spacing: -2px;
	font-weight: 900 !important;
}
/*Dos Columnas*/
.box-nota {
	width: 48%;
	height: 520px;
	float: left;
	margin: 2% 1% 2% 1% !important;
	background-size: 110% !important;
	background-color: rgba(0,36,98,1.00) !important;
	padding: 190px 0 10px 0;
}
.back-datos {
	width: 100%;
	height: 330px;
	background: url(../img/back-title-box.png) repeat-x bottom;
	background-size: auto 100%;
	padding: 10% 5% 1% 5%;
}
.back-datos h2 {
	width: 100%;
	min-height: 150px;
	padding: 1% 0 1% 4%;
	border-left: solid thin white;
	font-size: 36px;
	line-height: 32px;
	letter-spacing: -2px;
	font-weight: 900 !important;
}
.back-datos h4 {
	width: 100%;
	min-height: 150px;
	padding: 1% 0 1% 4%;
	border-left: solid thin rgba(148,140,133,1.00);
	font-size: 24px;
	line-height: 20px;
	letter-spacing: -1px;
	font-weight: bold !important;
}
/*Dos Columnas PUBLI*/
.box-nota-publi {
	width: 48%;
	height: 520px;
	float: left;
	margin: 2% 1% 2% 1% !important;
	background-size: 100% !important;
	background-color: black !important;
}
/*Box Publi 2*/
.box-publi-2 {
	width: 48%;
	height: 520px;
	float: left;
	margin: 2% 1% 2% 1% !important;
}

/*3 Columnas PUBLI*/
.boxpubli3 {
	width: 31.3%;
	float: left;
	margin: 1%;
}
/*Cuatro Columnas*/
.box-nota-25 {
	width: 23%;
	height: 620px;
	float: left;
	margin: 1%;
	background-size: auto 50% !important;
	padding: 300px 0 0 0;
}
/*Box Lista*/
.box-nota-lista {
	width: 48%;
	height: 150px;
	float: left;
	margin: 1%;
	background-size: auto 100% !important;
}
.box-nota-lista:hover {
	background-color: white;
}
.thumb-lista {
	width: 38%;
	height: 150px;
	margin: 0 1% 0 0;
	float: left;
	background-size: 110% auto !important;
}
.text-lista {
	width: 58%;
	height: 150px;
	margin: 1%;
	float: left;
}
.text-lista h6 {
	min-height: 75px;
	border-left: solid thin rgba(148,140,133,1.00);
	padding: 0 0 0 2%;
}
.reticula {
	width: 90%;
	margin: auto;
}
.screen {
	display: block;
}
.col-50 {
	width: 48%;
	float: left;
	margin: 1%;
}
	.col-30{
		width: 30% !important;
		float: left;
		margin: 1.5px;
	}
	.menuico{
		width: 50px; height: 50px;
		position: absolute;
		top: 0;
		display: none;
		z-index: 10;
	}
	.tiempo{
		width: 320px;
		float: right;
		margin: inherit;
	}
	.fecha-hoy{
		float: left;
		padding: 2%;
		color: midnightblue;
		text-align: left;
		margin: inherit;
		
	}
	.flecha{
		width: 30px;
		float: right;
		display: none;
	}
	.movil{
		display: none;
	}
	.buscador{
		width: 25%;
		float: right;
		padding: 0.25% 0.25% 0.25% 0;
	}
	.columna{
		width: 50%;
		float: left;
	}
	.publi-2col{
		width: auto; height: 500px;
		margin: auto;
	}
}