@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Encode+Sans:wght@400;600;700&family=Roboto:wght@300;400;500;700&display=swap');

body {
	margin:0;
	font-family: 'Roboto', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:10px;
	color:#363636;
	font-weight:300;
}
strong {
	font-weight:800;
}
.container {
	width:800px;
	margin:auto;
	text-align:center;
	position:relative;
}
a { text-decoration:none; border: 0; }

img {
	max-width:100%; border: 0;
}
.table { display: table; }
.cell { display: table-cell; vertical-align: middle; }
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* Internet Explorer/Edge */
  user-select: none;           /* Non-prefixed version, currently */
}
.col {
	display: inline-block; vertical-align: bottom;
	box-sizing: border-box;
}
.col10 { width: 10%; }
.col20 { width: 20%; }
.col30 { width: 30%; }
.col40 { width: 40%; }
.col50 { width: 50%; }
.col60 { width: 60%; }
.col70 { width: 66%; }
.col80 { width: 80%; }
.col90 { width: 90%; }
.col100 { width: 100%; }


header {
	background: url(../images/newsletter/header.jpg) center top no-repeat #394447;
	position: relative;
}
header .borde {
	position: absolute;
	height: 4px;
	background: #37BBED;
	bottom: 0; left: 0; width: 100%;
	display: none;
}
header .logo {
	width: 34%;
	padding: 50px 0;
	text-align: center;
}
header .newsTitulo {
	width: 60%;
	padding: 40px 20px;
	font-family: 'Encode Sans', sans-serif;
	font-size : 3em;
	color : #ffffff;
	font-weight: 400;
}
header .suscribirse {
	width: 40%;
	text-align: right;
	padding: 40px 0;
}
header .suscribirse .boton {
	display: inline-block;
	padding: 13px 30px;
	font-size: 1.1em;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: #FFFFFF;
	background: #37BBED;
	font-weight: 600;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
header .suscribirse .boton .fa {
	font-size: 2em;
	margin-right: 15px;
	vertical-align: middle; margin-top: -4px;
}
header .suscribirse .boton:hover {
	background: #ffffff;
	color: #37BBED;
}

#contenido {
	padding: 40px 0;
	background: url(../images/newsletter/newsActual_fondo.jpg) center top no-repeat;
}

#contenido .newsActual {
	height: 330px;
	display: inline-block; vertical-align: middle;
	position: relative;
}

#contenido .newsActual .left {
	display: inline-block; vertical-align: bottom;
	width: 385px;
	height: 100%;
	position: relative;
}
#contenido .newsActual .left .fotoNews {
	position: absolute;
	bottom: 0; left: 0;
	width: 100%; height: 290px;
	background: #d9d9d9;
	border: 2px solid #ffffff; box-sizing: border-box;
	border-bottom-left-radius: 30px;
	overflow: hidden;
}
#contenido .newsActual .left .fotoNews .sombra {
	position: absolute;
	left: 0; bottom: 0; width: 100%;
	height: 66px;
	background: url(../images/newsletter/newsActual_sombra.png) repeat-x;
}
#contenido .newsActual .left .fotoNews img {
	position: absolute;
	left: 0; top: 0; width: 100%;
}
#contenido .newsActual .right {
	display: inline-block; vertical-align: bottom;
	width: 56px;
	height: 100%;
	position: relative;
	margin-left: -2px;
}
#contenido .newsActual .right .bottom {
	position: absolute;
	bottom: 0; left: 0;
	width: 56px; height: 57px;
	background: url(../images/newsletter/newsActual_rightBottom.png) no-repeat;	
}
#contenido .newsActual .right .center {
	position: absolute;
	bottom: 57px; left: 0;
	width: 56px; height: 140px;
	background: url(../images/newsletter/newsActual_rightCenter.png) repeat-y;
	border-top: 2px solid #ffffff;
}

#contenido .newsActual:hover .left .fotoNews {
	height: 300px;
}
#contenido .newsActual:hover .right .center {
	height: 120px;
}
#contenido .newsActual:hover .left,
#contenido .newsActual:hover .right{
	transform: translateY(-10px);
}

#contenido .newsActual .sombra2 {
	position: absolute;
	bottom: -20px; left: 50%;
	width: 540px; height: 16px;
	margin-left: -270px;
	background: url(../images/newsletter/newsActual_sombra2.png);
}


#contenido .newsActual .overlay {
	position: absolute;
	left: 0px; top:0;
	width: 100%; height: 100%;
	background: url(../images/newsletter/newsActual_verOnline.png) center no-repeat rgba(56,66,79,0.5);
	opacity: 0;
}
#contenido .newsActual:hover .overlay {
	opacity: 1;
}

#contenido .newsActual:hover .sombra2 {
	-webkit-transform: scale(0.8);
	transform: scale(0.8);
}

.easing {
-webkit-transition: all 500ms cubic-bezier(0.400, 0.010, 0.120, 0.995);
   -moz-transition: all 500ms cubic-bezier(0.400, 0.010, 0.120, 0.995);
     -o-transition: all 500ms cubic-bezier(0.400, 0.010, 0.120, 0.995);
        transition: all 500ms cubic-bezier(0.400, 0.010, 0.120, 0.995); /* custom */

-webkit-transition-timing-function: cubic-bezier(0.400, 0.010, 0.120, 0.995);
   -moz-transition-timing-function: cubic-bezier(0.400, 0.010, 0.120, 0.995);
     -o-transition-timing-function: cubic-bezier(0.400, 0.010, 0.120, 0.995);
        transition-timing-function: cubic-bezier(0.400, 0.010, 0.120, 0.995); /* custom */
}

#contenido .infoActual {
	display: inline-block; vertical-align: middle;
	width: 350px;
	padding-left: 40px;
	box-sizing: border-box;
	text-align: left;
}
#contenido .infoActual .titulo {
	font-size : 3.7em;
	color : #394447;
	font-family: 'Encode Sans', sans-serif;
	margin: 15px 0;
    font-weight: 600;
}
#contenido .infoActual .lineaPunteada {
	border-bottom: 1px dashed #abbbdd;
	margin: 20px 0;
}

#contenido .infoActual .fecha {
	font-size: 1.6em;
	letter-spacing : 0.1em;
	color : #394447;
	font-weight: 400;
	margin: 15px 0;
}

#contenido .infoActual .verOnline {
	display: inline-block;
	padding: 15px 30px 18px 35px;
	font-family: 'Encode Sans', sans-serif;
	font-weight: 400;
	font-size : 2.2em;
	letter-spacing : 0.1em;;
	color : #FFFFFF;
	background: #37BBED;
	margin: 15px 0;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
#contenido .infoActual .verOnline img {
	display: inline-block; vertical-align: middle;
	margin-left: 10px; margin-top: -3px;
}
#contenido .infoActual .verOnline:hover {
	background: #394447;
	color: #37BBED;
}

#anteriores {
	background: #e6e6e6;
	border-top: 1px solid #b3b3b3;
	padding: 40px 0;
	margin-top: 80px;
	position: relative;
}
#anteriores .icono {
	position: absolute;
	left: 0; width: 100%;
	top: -40px;
	text-align: center;
}
#anteriores .icono .circulo {
	display: inline-block;
	width: 80px; height: 80px;
	border: 1px solid #b3b3b3;
	border-radius: 100px;
	background: url(../images/newsletter/iconoNews.svg) center no-repeat #e6e6e6;
	background-size: 50px auto;
}
#anteriores .titulo {
	font-family: 'Encode Sans', sans-serif;
	font-size : 2.7em;
	letter-spacing : 0.1em;
	color : #027bc1;
	font-weight: 400;
}

#anteriores .lineaPunteada {
	border-bottom: 1px dashed #027bc1;
	width: 350px; margin: 20px auto;
}

#anteriores .slider {
	margin: 10px 0;
	overflow: hidden;
}
#anteriores .slider .scroll {
	position: relative;
	top: 0; left: 0;
}
#anteriores .slider .pagina {
	float: left;
	width: 100%;
	text-align: left;
}
#anteriores .slider .pagina .news {
	display: inline-block; vertical-align: middle;
	width: 33.333%;
	padding: 10px; box-sizing: border-box;
}
#anteriores .slider .pagina .news .boton {
	padding: 15px 50px 15px 20px;
	background: #394447;
	text-align: left;
	position: relative;
	-webkit-box-shadow: 2px 2px 1px 0 rgba(0,0,0,0.3);
	box-shadow: 2px 2px 1px 0 rgba(0,0,0,0.3);
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
#anteriores .slider .pagina .news .boton:hover {
	background: #027bc1;
}
.clear {
	clear: both;
}

#anteriores .slider .pagina .news .boton .num {
	font-family: 'Encode Sans', sans-serif;
	font-size: 1.9em;
	letter-spacing : 0.76px;
	color : #FFFFFF;
	margin: 5px 0;
	font-weight: 400;
}
#anteriores .slider .pagina .news .boton .fecha {
	font-size : 1.2em;
	letter-spacing : 0.1em;
	color : #FFFFFF;
	margin: 5px 0;
}
#anteriores .slider .pagina .news .boton img {
	position: absolute;
	right: 20px; top: 50%; margin-top: -10px;
}

#anteriores .paginacion {
	margin: 20px 0 40px;
}
#anteriores .paginacion .flecha, #anteriores .paginacion .botonPag {
	display: inline-block; vertical-align: middle;
	padding: 5px 12px;
	font-size : 1.4em;
	letter-spacing : 0.1em;
	color: #394447;
	cursor: pointer;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	font-weight: 400;
}
#anteriores .paginacion .flecha {
	margin: 0 10px;
}
#anteriores .paginacion .flecha:hover, #anteriores .paginacion .botonPag:hover {
	color: #027bc1;
}
#anteriores .paginacion .botonPag.activo {
	background: #027bc1;
	color: #ffffff;
}
#anteriores .paginacion .botones {
	display: inline-block; vertical-align: middle;
}


footer {
	background: #3b4449;
	padding: 38px 0 67px;
	border-top: 5px solid #37BBED;
}

footer .logo {
	margin-bottom: 30px;
}

footer .info .dato {
	display: inline-block; vertical-align: middle;
	font-size : 1.2em;
	letter-spacing: 0.05em;
	color : #FFFFFF;
	margin: 10px;
}
footer .info .dato img {
	display: inline-block; vertical-align: middle;
	margin-right: 10px;
}
footer .info .dato a { color: #8a99bf; }
footer .info .dato a:hover { color: #ffffff; }
footer .info .separacion {
	display: inline-block; vertical-align: middle;
	margin: 0 10px;
	background: #4f596e;
	width: 1px; height: 28px;
}

footer .lineaPunteada {
	width: 280px;
	border-bottom: dashed 1px #4f596e;
	margin: 30px auto;
}

.redes a {
    background: rgba(0, 0, 0, 0) none no-repeat scroll center top;
    border: 1px solid #8a99bf;
    border-radius: 100px;
    display: inline-block;
    height: 38px;
    margin-left: 15px;
    transition: all 0.3s ease 0s;
    vertical-align: middle;
    width: 38px;
}
.redes a.facebook {
    background-image: url("../images/newsletter/socialBotonFacebook.png");
}
.redes a.twitter {
    background-image: url("../images/newsletter/socialBotonTwitter.png");
}
.redes a.share {
    background-image: url("../images/newsletter/socialBotonShare.png");
}
.redes a.mail {
    background-image: url("../images/newsletter/socialBotonMail.png");
}
.redes a:hover {
    background-color: #8a99bf;
    background-position: center bottom;
}


#boletinNacional {
    background: url(../images/newsletter/boletinNacional_fondo.png) center no-repeat #00baed;
    padding: 20px 0 10px;
    border-bottom: 3px solid #027bc1;
}
#boletinNacional .container {
    padding: 0 20px;
    box-sizing: border-box;
    width: 100%;
    max-width: 860px;
}
#boletinNacional .columnas {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
#boletinNacional .columnas .columna {
    padding: 20px 10px;
}

#boletinNacional .botonSuscribirse {
    font-weight: 500;
    font-size : 17px;
    letter-spacing : 0.68px;
    color : #FFFFFF;
    background: #344248;
    padding: 0.6em 1.6em;
    cursor: pointer;
    transition: all 0.3s;
}
#boletinNacional .botonSuscribirse:hover {
    background: #ffffff;
    color: #344248;
}


@media (max-width: 800px) {
	.container { width: 100%; }
	#franjaNaranja .fecha { padding: 10px 20px; }
	header .botones { padding-right: 40px; box-sizing: border-box; }
	header .col70 { width: 60%; }
	header .newsTitulo, header .suscribirse { display: block; text-align: left; width: 100%; }
	header .suscribirse { padding-left: 40px; }
	#contenido .infoActual { padding-left: 0; text-align: center; margin-top: 30px; }
	#anteriores .slider .pagina .news .boton { padding-right: 15px; text-align: center; }
	#anteriores .slider .pagina .news .boton img { display: none; }
	#anteriores .slider { margin-left: 20px; margin-right: 20px; }
}
@media (max-width: 700px) {
	header .botones .boton img  {display: none; }
	header .botones .boton { display: block; margin: 20px 0; }
	header .logo { width: 40%; }
	header .botones { width: 60%; }
	#anteriores .slider .pagina .news { padding: 5px; }
}
@media (max-width: 500px) {
	header .logo { width: 50%; }
	header .botones { width: 50%; }
	#contenido .texto,
	#contenido .nota .titulo {
		padding-left: 40px; padding-right: 40px;
	}
	#contenido .nota .lineaPunteada { margin-left: 40px; margin-right: 40px; }
	#contenido .nota .fotoHeader { height: 230px; }
	header { background-size: cover; }
	header .newsTitulo, header .suscribirse { text-align: center; padding-left: 0; padding-right: 0; }
	header .col70 { width: 100%; }
	#contenido .newsActual { padding: 0 20px; box-sizing: border-box; }
	#contenido .newsActual .right { display: none; }
	#contenido .newsActual { width: 100%; }
	#contenido .newsActual .left { max-width: 100%; }
	#contenido .newsActual .left .fotoNews { border-radius: 0; }
	#contenido .infoActual { width: 100%; }
}

@media (max-width: 400px) {
	#franjaNaranja .fecha, #franjaNaranja .edicion {
		box-sizing: border-box;
		display: block;
		padding: 10px;
		text-align: center;
		width: 100%;
	}
	#anteriores .slider .pagina .news { width: 100%; }
}