/* PALETA
#66B3DF
#679AB7
#A3D1EC
#CC6065
#FACE15
#5364AE
#143A5B
*/

@font-face {
	font-family: 'regular';
	src: url('../fonts/Roboto-Regular.ttf') format('truetype');
}

@font-face {
	font-family: 'bold';
	src: url('../fonts/Roboto-Bold.ttf') format('truetype');
}

@font-face {
	font-family: 'black';
	src: url('../fonts/Roboto-Black.ttf') format('truetype');
}

/*
-----------------------------------------------------------------------
BODY-------------------------------------------------------------------
-----------------------------------------------------------------------
*/

* {
	font-family: regular;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	color: #5364AE;
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	max-width: 1600px;
	margin: auto !important;
}

main {
	margin-top: 2rem;
	margin-bottom: 2rem;
}

/*
-----------------------------------------------------------------------
HEADER-----------------------------------------------------------------
-----------------------------------------------------------------------
*/

header {
	/*font-size: .85em;*/
	position: relative;
	padding-top: 1rem;
}

/*
ORDEN------------------------------------------------------------------
*/

header div.logo {
	order: 0;
}

header div.redes,
header div.header-search {
	display: none;
}

header div.nav-container {
	order: 2;
}

@media screen and (min-width: 992px) {
	header div.search {
		display: initial;
		order: 1;
	}
}

/*
LOGO-------------------------------------------------------------------
*/

header h1 {
	font-size: 0;
	background: url('../img/logo/logo-1-sm.png') no-repeat;
	background-position: center;
	height: 50px;
	width: 220px;
	margin: 0;
}

header h1 a {
	display: block;
	width: 100%;
	height: 100%;
}

/*
REDES---------------------------------------------------------------
*/

header div.redes {
	width: 150px;
	margin: auto 0 auto auto;
	padding: 0;
}

header div.redes ul {
	display: inline-block;
	vertical-align: middle;
	margin: 0;
	width: 100%;
}

header div.redes ul li {
	display: inline-block;
	width: calc(100% / 3);
	vertical-align: top;
}

@media screen and (min-width: 992px) {
	header div.redes {
		display: block;
	}
}

/*
BUSCADOR---------------------------------------------------------------
*/

header div.search {
	display: none;
	width: 300px;
	margin: auto 0;
}

header div.search form,
header div.menu-search form {
	max-width: 300px;
	margin-left: auto;
}



header div.search form input[type="text"],
header div.menu-search form input[type="text"] {
	border: solid 2px #66B3DF;
	border-top-left-radius: 2em;
	border-bottom-left-radius: 2em;
	height: 30px;
	font-size: .85em;
	background: transparent;
	padding-left: 1em;
	width: calc(100% - 32px);
	vertical-align: middle;
}

header div.search form input[type="text"]:focus,
header div.menu-search form input[type="text"]:focus {
	outline: none;
}

header div.search form input[type="submit"],
header div.menu-search form input[type="submit"] {
	font-size: 0;
	border: none;
	background: url('../img/ico/search.png') no-repeat;
	background-position: left;
	height: 32px;
	width: 32px;
	vertical-align: middle;
}

header div.search-results {
	/*display: none;*/
	width: 50%;
	position: absolute;
	top: 5.1rem;
	right: 0;
	background: white;
	border-bottom-left-radius: 5px;
	box-shadow: -15px 20px 25px -15px #679AB7;
	z-index: 1;
}

header div.search-results ul {
	margin: 0;
}

header div.search-results ul li {
	height: 5rem;
	border-bottom: 1px solid #DDDDDD;
}

header div.search-results ul li:last-child {
	border-bottom: none;
}

header div.search-results ul li button {
	font-family: 'bold';
	color: #CC6065;
	display: block;
	height: 100%;
	width: 100%;
	padding: 1rem;
	text-align: left;
	border: none;
	background: transparent;
}

header div.search-results ul li button:hover {
	transition: 0.5s;
	background: #EEEEEE;
}

header div.search-results ul li p {
	padding: 1rem;
}

@media screen and (min-width: 992px) {
	header div.search {
		display: block;
	}

	header div.menu-search {
		display: none;
	}
}

/*
NAV--------------------------------------------------------------------
*/

header nav button {
	margin: auto;
	padding: 0 !important;
	width: 100%;
}

header nav button span {
	background: url('../img/ico/menu.png');
	background-position: center;
}

header nav div.collapse,
header nav div.navbar-collapse {
	position: absolute;
	top: 3rem;
	right: 0;
	background: white;
	border-bottom-left-radius: 5px;
	padding: 1rem;
	box-shadow: -15px 20px 25px -15px #679AB7;
}

header nav ul li a,
header nav .nav-link {
	font-size: 1rem;
	display: inline-block;
	color: #CC6065;
	text-transform: uppercase;
	font-family: 'bold';
}

header nav ul li a:hover,
header nav .nav-link:hover {
	color: #CC6065;
	text-decoration: underline;
}

header nav div.menu-search {
	width: calc(288px - 2rem);
	display: block;
}

@media screen and (min-width: 440px) {
	header h1 {
		background: url('../img/logo/logo-1-md.png') no-repeat;
		background-position: center;
		height: 70px;
		width: 300px;
	}

	header nav.navbar {
		padding-top: 19px;
		padding-bottom: 19px;
	}
}

@media screen and (min-width: 992px) {
	header h1 {
		background: url('../img/logo/logo-1-lg.png') no-repeat;
		height: 100px;
		width: 434px;
	}

	header nav div.collapse,
	header nav div.navbar-collapse {
		position: initial;
		border: solid 2px #66B3DF;
		border-radius: 2em;
		justify-content: flex-start !important;
		margin-left: 0 !important;
		padding: 0;
	}

	header nav {
		margin: 1em 0;
	}

	header nav ul {
		padding: 0;
		text-align: center;
		width: 100%;
	}

	header nav ul li {
		width: 33%;
		text-align: center;
	}

	header nav ul li:last-child {
		display: none;
	}
}

/*
-----------------------------------------------------------------------
-----------------------------------------------------------------------
HOME-------------------------------------------------------------------
-----------------------------------------------------------------------
-----------------------------------------------------------------------
*/

main.home div.monitor {
	background: #A5CADF;
	border-radius: 15px;
	padding: 0.4rem;
}

main.home div.monitor div.monitor-titulo {
	background: white;	
	border-radius: 15px;
	padding: 0.4rem;
	margin: 0;
}

main.home div.monitor div.monitor-titulo div {
	display: block;
}

main.home div.monitor div.monitor-titulo h2 {
	text-transform: uppercase;
	font-size: 1rem;
	margin-left: 0.5rem;
	margin-bottom: 0;
}

main.home div.monitor div.monitor-titulo div.separador-monitor {
	margin-bottom: 0.3rem;
	height: 2px;
}

main.home div.monitor div.monitor-titulo div.ver-monitor-completo {
	display: block;
	text-align: right;
	margin-right: 0.5rem;
}

main.home div.monitor div.monitor-titulo div.ver-monitor-completo p {
	display: inline-block;
	font-size: 0.9rem;
	margin: 0;
}

main.home div.monitor div.monitor-titulo div.ver-monitor-completo button {
	height: 20px !important;
	width: 20px !important;
	background-size: cover;
}

main.home div.monitor ul {
	padding: 0;
	margin: 0.4rem 0 0 0;
}

main.home div.modal-monitor ul li,
main.home div.monitor ul li {
	padding-top: 65px;
}

main.home div.modal-monitor ul li:first-child,
main.home div.monitor ul li:first-child {
	background: url('../img/monitor/pobreza.png') no-repeat;
	background-position: top center;
}

main.home div.modal-monitor ul li:nth-child(2),
main.home div.monitor ul li:nth-child(2) {
	background: url('../img/monitor/inflacion.png') no-repeat;
	background-position: top center;
}

main.home div.monitor ul li:nth-child(3),
main.home div.monitor ul li:nth-child(4),
main.home div.monitor ul li:nth-child(5),
main.home div.monitor ul li:last-child {
	display: none;
}

main.home div.modal-monitor ul li div,
main.home div.monitor ul li div {
	margin: 0.1rem 0;
	height: 2px;
	background: #CC6065;
	border-radius: 25px;
}

main.home div.modal-monitor ul li p,
main.home div.monitor ul li p {
	font-family: 'bold';
	font-size: 0.85rem;
	color: #143A5B;
	text-align: center;
	margin: 0;
}

main.home div.modal-monitor ul li p:last-child,
main.home div.monitor ul li p:last-child {
	font-size: 0.65rem;
}

main.home div.modal-monitor ul li h3,
main.home div.monitor ul li h3 {
	font-family: 'bold';
	font-size: 1rem;
	color: #5364AE;
	text-align: center;
	margin: 0;
}

main.home div.modal-monitor h2 {
	font-family: 'bold';
	font-size: 1.3rem;
	color: #CC6065;
	margin-bottom: 0.3rem;	
}

main.home div.modal-monitor-body {
	padding-top: 0;
	padding-bottom: 1.5rem;
}

main.home div.modal-monitor ul {
	margin: 0;
	padding: 0;
}

main.home div.modal-monitor ul li {
	margin-top: 1.5rem;
}

main.home div.modal-monitor ul li:nth-child(3) {
	background: url('../img/monitor/alimentos.png') no-repeat;
	background-position: top center;
}

main.home div.modal-monitor ul li:nth-child(4) {
	background: url('../img/monitor/actividad-economica.png') no-repeat;
	background-position: top center;
}

main.home div.modal-monitor ul li:nth-child(5) {
	background: url('../img/monitor/salario.png') no-repeat;
	background-position: top center;
}

main.home div.modal-monitor ul li:last-child {
	background: url('../img/monitor/precios-justos.png') no-repeat;
	background-position: top center;
}

@media screen and (min-width: 450px) {
	main.home div.monitor div.monitor-titulo div.separador-monitor {
		display: none !important;
	}

	main.home div.monitor div.monitor-titulo h2 {
		display: inline-block;
	}

	main.home div.monitor div.monitor-titulo div.ver-monitor-completo {
		display: inline-block;
		float: right;
	}
}

@media screen and (min-width: 576px) {
	main.home div.monitor div.monitor-titulo {
		margin-bottom: 1rem;
		max-width: 100%;
	}

	main.home div.monitor ul li:nth-child(3) {
		display: block;
		background: url('../img/monitor/alimentos.png') no-repeat;
		background-position: top center;
	}
}

@media screen and (min-width: 768px) {
	main.home div.monitor ul li:nth-child(4) {
		display: block;
		background: url('../img/monitor/actividad-economica.png') no-repeat;
		background-position: top center;
	}
}

@media screen and (min-width: 992px) {
	main.home div.monitor div.monitor-titulo div.ver-monitor-completo p,
	main.home div.monitor div.monitor-titulo div.ver-monitor-completo button {
		display: none;
	}

	main.home div.monitor-titulo div {
		text-align: center;
	}

	main.home div.monitor ul li:nth-child(5) {
		display: block;
		background: url('../img/monitor/salario.png') no-repeat;
		background-position: top center;
	}

	main.home div.monitor ul li:last-child {
		display: block;
		background: url('../img/monitor/precios-justos.png') no-repeat;
		background-position: top center;
	}
}

main.home div.video-articulo {
	width: 100%;
}

main.home div.video-articulo figure {
	max-width: 700px !important;
	margin: auto !important;
}

/*
-----------------------------------------------------------------------
-----------------------------------------------------------------------
INFORMES---------------------------------------------------------------
-----------------------------------------------------------------------
-----------------------------------------------------------------------
*/

main.informes h2 {
	font-family: 'bold';
	font-size: 1.5rem;
	color: #CC6065;
	margin-bottom: 0.3rem;
}

main.informes div.titulo {
	margin-bottom: 0;
}

/*
-----------------------------------------------------------------------
-----------------------------------------------------------------------
VIDEOS-----------------------------------------------------------------
-----------------------------------------------------------------------
-----------------------------------------------------------------------
*/

main.videos div.titulo {
	margin-bottom: 0;
}

main.videos div.video-articulo {
	padding: 1rem;
}
/*
main.videos div.video-articulo:nth-child(odd) {
	background: linear-gradient(90deg, white 0%, #A3D1EC 15%, white 95%, white 100%);
}

main.videos div.video-articulo:nth-child(even) {
	background: linear-gradient(270deg, white 0%, #A3D1EC 15%, white 95%, white 100%);
}
*/
main.videos h3 {
	font-family: 'bold';
	font-size: 1.1rem;
	color: #CC6065;
	cursor: pointer;
	margin: auto;
	margin-bottom: 1rem;
	max-width: 496px;
	max-height: 279px;
}

main.videos figure {
	max-width: 496px;
	max-height: 279px;
	margin: auto;
}

main.videos figure iframe {
	width: 100%;
	height: 100%;
}


/*
-----------------------------------------------------------------------
-----------------------------------------------------------------------
CESOP------------------------------------------------------------------
-----------------------------------------------------------------------
-----------------------------------------------------------------------
*/

#cesop div div p span {
	font-weight: bold;
	font-style: italic;
}

/*
-----------------------------------------------------------------------
-----------------------------------------------------------------------
CONTACTO---------------------------------------------------------------
-----------------------------------------------------------------------
-----------------------------------------------------------------------
*/

main.contacto form {
	margin: auto;
}

main.contacto form.form-contacto {
	background: #A3D1EC;
	padding-bottom: 1rem;
	border-radius: 15px;
}

main.contacto form div {
	margin-top: 1em;
}

main.contacto form label {
	width: 100%;
}

main.contacto form input,
main.contacto form textarea {
	font-size: 1rem;
	padding-left: 1rem;
	border-radius: 15px;
	border: solid 2px #66B3DF;
	height: 30px;
	padding-left: 1em;
	width: 100%;
	vertical-align: middle;
}

main.contacto form textarea {
	height: 8em;
}

main.contacto .contacto_separador_enviar {
	height: 0.5em;
	width: calc(100% - 44px);
	background: #66B3DF;
	border-radius: 25px;
	display: inline-block;
}

main.contacto div.separador-contacto {
	max-width: 500px;
	margin: 2rem auto;
}

main.contacto p.contacto-p,
main.contacto p.redes-p {
	font-family: 'bold';
	font-size: 1em;
	color: #CC6065;
}

main.contacto div.redes {
	width: 150px;
	margin: auto;
	margin-top: 1.1rem;
}

main.contacto div.redes ul li {
	display: inline-block;
	width: calc(100% / 3);
}

/*
-----------------------------------------------------------------------
FOOTER-----------------------------------------------------------------
-----------------------------------------------------------------------
*/

footer {
	padding-top: 1rem;
	background: linear-gradient(0deg, #66B3DF 0%, #A3D1EC 50%, white 100%);
	max-width: 100% !important;
	width: 100%;
	padding-bottom: 2rem;
}

main.contacto form.newsletter,
footer form {
	margin-bottom: 1.5rem !important;
}

main.contacto form.newsletter label,
footer form label {
	font-family: 'bold';
	font-size: 1em;
	color: #CC6065;
	margin: auto;
	margin-bottom: 0.4rem;
	display: block;
	width: fit-content;
}

main.contacto form.newsletter div.form-inputs,
footer form div.form-inputs {
	max-width: 300px;
	margin: auto;
}

main.contacto form.newsletter input[type="email"],
footer form input[type="email"] {
	font-size: 1rem;
	padding-left: 1rem;
	border-radius: 15px;
	border: solid 2px #66B3DF;
	height: 30px;
	padding-left: 1em;
	width: calc(100% - 34px);
	max-width: 266px;
	vertical-align: middle;
}

main.contacto form.newsletter input[type="email"]:focus,
footer form input[type="email"]:focus {
	outline: none;
}

footer div.sitios-relacionados {

}

footer div.mapa {
	display: none;
}

footer div.sitios-relacionados h2,
footer div.mapa h2 {
	font-family: 'bold';
	font-size: 1rem;
	color: #CC6065;

}

footer div.sitios-relacionados ul,
footer div.mapa ul {
	margin: 0;
	margin-bottom: 0.5rem;
}

footer div.sitios-relacionados ul li,
footer div.mapa ul li {
	padding-left: 0.5rem;
}

footer div.sitios-relacionados ul li a,
footer div.mapa ul li a {
	font-size: 0.9rem;
	text-decoration: none;
	color: #5364AE;	
}

footer div.sitios-relacionados ul li a:hover,
footer div.mapa ul li a:hover {
	text-decoration: underline;
}

footer div.logo span {
	background: url('../img/logo/logo-2-md.png') no-repeat;
	height: 72px;
	width: 250px;
	font-size: 0;
	display: block;
	background-position: center;
	margin: auto;
	margin-top: 1rem;
}

footer div.redes {
	width: 150px;
	margin: auto;
	margin-top: 1.1rem;
}

footer div.redes ul {
	
}

footer div.redes ul li {
	display: inline-block;
	width: calc(100% / 3);
}

footer div.redes ul li a {
	
}

@media screen and (min-width: 430px) {
	footer div.info {
		margin: auto;
	}

	footer div.vinculos {
		width: auto;
		margin: auto;
	}

	footer div.sitios-relacionados,
	footer div.mapa {
		width: auto;
		display: inline-block;
		vertical-align: top;
	}

	footer div.mapa {
		display: inline-block;
		margin-left: 2rem;
	}

	footer div.logo span {
		background: url('../img/logo/logo-2-lg.png') no-repeat;
		width: 356px;
		height: 100px;
	}
}

@media screen and (min-width: 768px) {
	footer div.logo {
		/*order: -1;*/
	}

	footer div.redes ul {
		margin-top: 19px;
	}

	footer div.sitios {
		/*order: -2;*/
		margin-bottom: 1rem;
	}

	footer div.sitios ul {
		list-style-type: ;
	}
}

/*
-----------------------------------------------------------------------
INFORMES TEMPLATE------------------------------------------------------
-----------------------------------------------------------------------
*/

div.informes {
	max-width: 1000px;
	margin: auto;
}

div.informes div.titulo {
	margin-bottom: 0;
}

div.informes div.titulo h2 {
	
}

div.informes div.informes-articulo {
	/*margin-right: auto;
	margin-left: auto;*/
	margin-top: 2rem;
	max-width: 500px;
	display: flex;
}

div.informes div.informes-articulo:nth-child(2) {
	/*margin-top: 0;*/
}

div.informes div.informes-preview div.row {
	height: 100%;
}

div.informes div.informes-preview div.informes-titulo h3 {
	font-family: 'bold';
	font-size: 1.1rem;
	color: #CC6065;
	cursor: pointer;
	margin-bottom: 0.3rem;
}

div.informes div.informes-preview div.informes-img {
	text-align: center;
}

div.informes div.informes-preview div.informes-img img {
	height: 200px;
	width: 250px;
	object-fit: cover;
	object-position: top;
        cursor: pointer;
}

div.informes div.informes-preview p.informes-descripcion {
	font-size: 0.9rem;
	margin: 0.5rem 0;
}

div.informes div.informes-preview div.informes-separador-footer {
	width: calc(100% - 80px);
	margin: 0;
}

div.informes div.informes-preview button.informes-vermas,
div.informes div.informes-preview button.informes-descarga {
	vertical-align: middle;
	margin-left: 10px;
}

main.home div.informes-footer {
	margin-top: auto;
}

@media screen and (min-width: 450px) {
	div.informes div.informes-preview div.informes-img {
		width: fit-content;
	}

	div.informes div.informes-preview p.informes-descripcion {
		padding-left: 0;
		display: inline-block;
		width: calc(100% - 274px);
		max-width: 250px;
	}
}

@media screen and (min-width: 992px) {
	/*div.informes div.informes-articulo,
	div.informes div.informes-articulo:nth-child(2) {
		margin: 2rem 0 auto 0;
	}*/
}

div.modal-informes div.modal-header {
	border: none;
}

div.modal-informes div.separador-titulo {
	width: 100%;
	margin: auto;
}

div.modal-informes div.modal-header h3.modal-title {
	font-family: 'bold';
	color: #CC6065;
	cursor: pointer;
	font-size: 1.1rem;
	margin: 0
}

div.modal-informes div.modal-footer button {
	margin-left: 10px;
}

div.modal-informes img {
	width: 250px;
	height: 200px;
	object-fit: cover;
	object-position: top;
}

div.modal-informes div.modal-footer {
	border: none;
}

div.modal-informes div.modal-footer > * {
	margin: 0;
}

/*
-----------------------------------------------------------------------
TÍTULOS----------------------------------------------------------------
-----------------------------------------------------------------------
*/

/*main div.titulo div h2,*/
main div.titulo h2 {
	font-family: 'bold';
	font-size: 1.3rem;
	color: #CC6065;
	margin-bottom: 0.3rem;
}

main div.titulo {
	padding-left: 0.5rem;
	max-width: 1000px;
	margin: auto;
}

main div.titulo div {
	display: inline-block;
}

@media screen and (min-width: 576px) {
	main div.titulo {
		margin-bottom: 1rem;
	}
}

/*
-----------------------------------------------------------------------
BOTONES----------------------------------------------------------------
-----------------------------------------------------------------------
*/

.boton {
	font-size: 0 !important;
	border: none !important;
	background-color: transparent !important;
	display: inline-block;
	height: 30px !important;
	width: 30px !important;	
	padding: 0;
	vertical-align: middle;
}

button:focus {
	box-shadow: none !important;
}

.boton-cerrar {
	background: url('../img/ico/cerrar.png') no-repeat;
}

.boton-vermas {
	background: url('../img/ico/vermas.png') no-repeat;
}

.boton-descarga {
	background: url('../img/ico/descargar.png') no-repeat;
}

.boton-enviar {
	background: url('../img/ico/enviar.png') no-repeat;
}

/*
-----------------------------------------------------------------------
LISTAS-----------------------------------------------------------------
-----------------------------------------------------------------------
*/

ul {
	list-style-type: none;
	padding: 0 !important;
}

/*
-----------------------------------------------------------------------
SEPARADORES------------------------------------------------------------
-----------------------------------------------------------------------
*/

div.separador-titulo {
	display: block !important;
	margin-bottom: 1rem;
	height: 3px;
	/*background: #FACE15;*/
	/*background: linear-gradient(135deg,#66B3DF,
	#679AB7 25%,#CC6065 50%,#FACE15 75%,#5364AE);*/
	background: linear-gradient(135deg,#A3D1EC,#66B3DF 50%,
	#CC6065 80%);
}

div.separador-titulo-seccion {
	background: #FACE15;
}

div.separador-footer {
	height: 8px;
	margin-top: 11px;
	background: #66B3DF;
	border-radius: 25px;
	display: inline-block;
	vertical-align: middle;
}

div.separador-footer-general {
	height: 2px;
	background: #5364AE;
	border-radius: 25px;
	width: 60%;
	margin: auto auto 1rem auto;
}

/*
-----------------------------------------------------------------------
REDES------------------------------------------------------------------
-----------------------------------------------------------------------
*/

div.redes ul li a {
	display: block;
	height: 32px;
	width: 32px;
	font-size: 0;
	margin: auto;
}

header div.redes ul li:first-child a {
	background: url('../img/ico/redes-tw.png') no-repeat;
	background-position: center;
}

header div.redes ul li:nth-child(2) a {
	background: url('../img/ico/redes-yt.png') no-repeat;
	background-position: center;
}

header div.redes ul li:last-child a {
	background: url('../img/ico/redes-ig.png') no-repeat;
	background-position: center;
}

main.contacto div.redes ul li:first-child a {
	background: url('../img/ico/redes-tw.png') no-repeat;
	background-position: center;
}

main.contacto div.redes ul li:nth-child(2) a {
	background: url('../img/ico/redes-yt.png') no-repeat;
	background-position: center;
}

main.contacto div.redes ul li:last-child a {
	background: url('../img/ico/redes-ig.png') no-repeat;
	background-position: center;
}

footer div.redes ul li:first-child a {
	background: url('../img/ico/redes-tw-light.png') no-repeat;
	background-position: center;
}

footer div.redes ul li:nth-child(2) a {
	background: url('../img/ico/redes-yt-light.png') no-repeat;
	background-position: center;
}

footer div.redes ul li:last-child a {
	background: url('../img/ico/redes-ig-light.png') no-repeat;
	background-position: center;
}

/*
-----------------------------------------------------------------------
BÚSQUEDA---------------------------------------------------------------
-----------------------------------------------------------------------
*/