@import url(Style-menu.css);
@import url(Style-tablas.css);

/* #ED3237 Rojo del logo
	#51B452 Verde del logo
*/

/*Fuente personalizada*/
@font-face {
	font-family: Merriweather;
	src: url("fonts/Merriweather-Regular.ttf");
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "Merriweather", 'Times New Roman', Times, serif;
}

body {
	overflow-x: hidden;
}

#pagina {
	width: 100%;
	height: auto;
	background-color: white;
}

#contenedor {
	width: 95%;
	min-width: 100px;
	max-width: 1500px;
	height: auto;
	background-color: white;
	box-shadow: 0px 0px 20px 10px #BDBDBD;
	display: inline-block;
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 20px;
	margin-bottom: 10px;
}

#space1 {
	width: 100%;
	height: 8px;
	background-color: white;
}

/*Barra de logo y menu*/
#barra-titulo {
	max-width: 1500px;
	width: 95%;
	height: auto;
	background-color: white;
	color: black;
	padding-top: 15px;
	position: fixed;
	top: 10;
	left: 10;
	z-index: 100;
	font-family: 'Merriweather', serif;
}

#logo-box {
	margin-left: 10px;
	width: 220px;
	float: left;
}

/*Espacio de contenido (video y barra vertical)*/
#contenedor2 {
	margin-top: 70px;
	width: 95%;
	min-height: 430px;
	height: auto;
	background-color: white;
	float: left;
	font-family: 'Merriweather', serif;
}

#cont-slider {
	width: 99%;
	height: auto;
	background-color: none;
}

#info {
	width: 100%;
	height: auto;
	/* Distancia con el footer*/
	background-color: none;
	float: left;
}

#titulo {
	font-family: 'Merriweather', serif;
	font-size: 30px;
}


#slide {
	width: 95%;
	height: 350px;
	background-color: none;
	border-radius: 10px;
	border: 3px solid black;
	margin: 15px 10px;
}

#video {
	width: 98%;
	height: 300px;
}

/*ARMONIZACION*/
.btnsArmo {
	width: 30%;
	margin: 5px;
	transition: all 300ms;
}

/*Cuenta Publica*/
.tituloCel {
	text-align: center;
	font-size: 28px;
	font-family: "Merriweather", 'Times New Roman', Times, serif;
	font-style: bold;
	background-color: #4B5563;
	color: white;
}

.descarga {
	text-align: center;
	font-style: bold;
	font-family: "Merriweather", 'Times New Roman', Times, serif;
	font-size: 23px;
}

.descarga img {
	width: 25%;
}

/* Style Disciplina financiera */
.tit-table {
	text-align: center;
	font-size: 28px;
	background-color: #4B5563;
	font-family: "Merriweather", 'Times New Roman', Times, serif;
	font-style: bold;
	color: white;
	padding: 3px;
}

.Num {
	width: 20%;
	font-family: "Merriweather", 'Times New Roman', Times, serif;
	font-size: 23px;
	font-style: bold;
	text-align: center;
}

.text-file {
	width: 60%;
	font-family: "Merriweather", 'Times New Roman', Times, serif;
	font-size: 23px;
	font-style: bold;
	text-align: left;

}

.icon-download {
	text-align: center;
}

.icon-download img {
	width: 30%;
}

.btnsArmo:hover {
	transform: scale(1.1, 1.1);
}

/*Barra vertical*/
#VerBar {
	width: 98%;
	height: 400px;
	background-color: none;
	float: left;
	margin-top: 10px;
}

.bx {
	/*background-color: #F5F5F5;*/
	background-color: white;
	border-radius: 10px;
	padding: 5px;
}

.bx:hover {
	background-color: #F5F5F5;
	color: white;
}

#impriv {
	width: 180px;
}

#iminfo {
	width: 180px;
}

/*Footer*/
#space3 {
	width: 100%;
	height: 10px;
	background-color: none;
	float: left;
	margin-top: 100px;
}

#pie-pagina {
	width: 100%;
	min-height: 90px;
	height: auto;
	background-color: none;
	border: none;
	float: left;
	margin-bottom: 20px;
}

#banner-footer {
	width: 98%;
	height: auto;
}

#contacto {
	width: 100%;
	height: 45px;
	background-color: none;
	margin-top: 10px;
}

.ct {
	width: 90%;
	float: left;
	list-style: none;
	font-size: 14px;
	margin-left: 15px;
	margin-right: 15px;
}

#copy {
	width: 100%;
	text-align: center;
	background-color: none;
	margin-top: 40px;
	font-size: 16px;
}

/*ESTILO GENERAL BOTONES*/
.estiloBtns {
	border-width: 2px;
	border-radius: 7px;
	border-color: rgb(149, 174, 156);
	color: #ffffff;
	background-color: #3B82F6;
	padding: 1px 5px;
	cursor: pointer;
	font-family: 'Merriweather', serif;
	font-size: 11px;
	width: 80%;
	transition: all 200ms;
}

.estiloBtns:hover {
	background-color: #1D4ED8;
	transform: scale(1.08, 1.08);
}

.estiloBtnsDisab {
	width: 80%;
	border-width: 2px;
	border-radius: 7px;
	border-color: #999;
	color: gray;
	background-color: #999;
	padding: 1px 5px;
	cursor: auto;
	font-family: 'Merriweather', serif;
	font-size: 11px;
}

.botonDirOrg {
	border-width: 0px;
	border-radius: 5px;
	border-color: #000;
	color: black;
	background-color: #FFF;
	padding: 5px 8px;
	cursor: pointer;
	font-family: 'Merriweather', serif;
	font-size: 16px;
	text-decoration: underline;
}

.botonDirOrg:hover {
	font-size: 20px;
}

#mensajeDiv {
	width: 90%;
}

#mensajeP {
	text-align: justify;
}

@media (max-width: 866px) {
	#logo-box {
		width: 100%;
	}
	#logo-box a img{
		width: 30%;
	}
	#contenedor2{
		margin-top: 130px;
	}
}

@media (max-width: 720px) {


	/*Vertical Bar*/
	#VerBar {
		height: auto;
	}
	.bx {
		width: 40%;
	}
	#impriv {
		width: 100%;
	}

	#iminfo {
		width: 100%;
	}

	/*ARMONIZACION*/
	.btnsArmo {
		width: 320px;
		margin: 5px;
	}

	/*Cuenta Publica*/
	.tituloCel {
		font-size: 25px;
	}

	.descarga {
		font-size: 20px;
	}

	.descarga img {
		width: 35%;
	}

	/* Style Disciplina financiera */
	.tit-table {
		font-size: 23px;
	}

	.Num {
		font-size: 18px;
	}

	.text-file {
		font-size: 18px;

	}

	.icon-download img {
		width: 40%;
	}
}

@media (max-width: 639px){
	#logo-box {
		width: 220px;
	}
	#logo-box a img{
		width: 100%;
	}
	#contenedor2{
		margin-top: 110px;
	}
}

@media (max-width: 500px) {

	/*Cuenta Publica*/
	.tituloCel {
		font-size: 20px;
	}

	.descarga {
		font-size: 16px;
	}

	.descarga img {
		width: 50%;
	}

	/* Style Disciplina financiera */
	.tit-table {
		font-size: 19px;
	}

	.Num {
		font-size: 15px;
	}

	.text-file {
		font-size: 15px;
	}

	.estiloBtns {
		padding: 1px 5px;
		cursor: pointer;
		font-family: 'Merriweather', serif;
		font-size: 11px;
		width: 100%;
	}

	#contenedor {
		width: 97%;
	}

	#barra-titulo {
		width: 97%;
	}

	/*espacio del titulo y video*/
	#contenedor2 {
		width: 98%;
		margin-top: 80px;
	}

	#slide {
		width: 100%;
		height: 400px;
		background-color: none;
		border-radius: 10px;
		border: 3px solid black;
		margin: 15px 10px;
	}

	#video {
		width: 98%;
		height: 350px;
	}

	/*Espacio de las imagenes*/
	#VerBar {
		display: block;
		float: left;
		width: 100%;
		height: auto;
		background-color: none;
		margin-top: 5px;
	}

	.bx {
		width: 50%;
		background-color: white;
		border-radius: 10px;
		margin: 0px;
		margin-left: 5px;
	}

	#impriv {
		width: 100%;
	}

	#iminfo {
		width: 100%;
	}


	/*Footer*/
	#space3 {
		margin-top: 30px;
	}

	#contacto {
		text-align: center;
		width: 100%;
		height: auto;
		margin-top: 0px;
	}
	#contacto li{
		margin-left: 0px;
		width: 100%;
	}

	.ct {
		width: 45%;
		float: center;
		margin-left: 15px;
	}

	#copy {
		float: right;
		margin-top: 20px;
		font-size: 14px;
	}
}

@media (max-width: 430px) {

	/*Cuenta Publica*/
	.tituloCel {
		font-size: 18px;
	}

	.descarga {
		font-size: 14px;
	}

	.descarga img {
		width: 60%;
	}

	/* Style Disciplina financiera */
	.tit-table {
		font-size: 16px;
	}

	.Num {
		font-size: 12px;
	}

	.text-file {
		font-size: 12px;

	}

	.icon-download img {
		width: 50%;
	}
}

@media (max-width: 400px) {

	/*ARMONIZACION*/
	.btnsArmo {
		width: 290px;
	}
}

@media (min-width: 1024px) {
	#contenedor {
		width: 98.5%;
	}

	#logo-box {
		width: 23%;
		margin-left: 1%;
	}

	#barra-titulo {
		width: 98.5%;
	}

	/*espacio del titulo y video*/
	#contenedor2 {
		width: 98%;
		margin-top: 90px;
		float: left;
	}

	#info {
		width: 80%;
		height: auto;
		/* Distancia con el footer*/
		background-color: none;
		float: left;
	}

	#slide {
		width: 99%;
		height: 450px;
	}

	#video {
		width: 98%;
		height: 400px;
	}

	/*Espacio de las imagenes*/
	#VerBar {
		width: 20%;
		height: auto;
		background-color: none;
		float: center;
		margin-top: 5px;
		display: block;
	}

	.bx {
		width: 98%;
		background-color: white;
		border-radius: 10px;
		margin: 0px;
		margin-left: 15px;
	}


	/*Footer*/
	#space3 {
		margin-top: 10px;
	}

	#contacto {
		margin-left: 10%;
	}

	.ct {
		width: 25%;
		margin-left: 15px;
		font-size: 20px;
	}

	#copy {
		font-size: 16px;
	}

	#mensajeDiv {
		width: 80%;
	}


}

@media (min-width: 1700px) {

	/*espacio del titulo y video*/
	#contenedor2 {
		width: 98%;
		margin-top: 130px;
	}

	#slide {
		width: 99%;
		height: 600px;
	}

	#video {
		width: 98%;
		height: 550px;
	}

}