@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,800,700,600,300);
@import url(http://fonts.googleapis.com/css?family=Bitter);

*{ margin: 0; padding: 0; text-decoration: none; color: #fff;}
html{font-size: 100%;}
body{font-size: 16px; background-color:white; } /*#056*/
.pagina {max-width: 960px; margin: 0 auto 0 auto; box-sizing: border-box;}

.extras {position: relative; float: left; width: 97%; margin: 0 0 2% 0;}
.boton_mas_left {position: relative; float: left;margin: 2% 0 0 4%;}
.compartir{position: relative; float: left; font-style: normal; font-weight: normal; color: #00A0C6;  margin: 4% 0 0 0; width: 48%;}
.compartir:hover {text-decoration: underline}
.redes {position: relative; float: left; width: 45%;}
.redes img {position: relative; float: left; width: 42%;}
.compartirlink {position: relative; float: right;margin-top: 1%; width: 25%;}


main {width: 100%}
section {width: 75%; position: relative; float: left;}
aside {width: 25%; position: relative; float: right;}
.index {width: 100%; position: relative; float: left;}
.responder {font-family: 'Open Sans'; font-style: italic; color: deepskyblue;}
.responder:hover {text-decoration: underline;}
.internas a{font-family: 'Open Sans'; font-style: italic; color: deepskyblue;}
.internas a:hover {text-decoration: underline;}
p {position: relative; float: left;font-family: 'Open Sans';font-size: 0.8em; line-height: 1.2em; width: 100%; color: dimgray;}


/*HEADER*/
header{width: 100%; min-height:175px; position: relative; float: left; font-family: 'Bitter'; font-style:italic; font-weight: bold;}
.logo{position: relative; float: left; margin: 4% 3% 2% 0; width: 28%;}
.logo img {max-width: 100%;}


header nav {position: relative; float: left; margin: 5% 3% 0 0; font-family: 'Open Sans'; font-size: 0.8em;}
header nav ul {list-style:none;}
header nav > ul {display:table;width:100%;position:relative; }
header nav > ul li {display:table-cell; }
 
/*Sub-menu*/
header nav > ul > li:hover > ul {display:block;height:100%;}
header nav > ul > li > ul { margin-left: 27%;}
header nav > ul > li > ul {display:block;
	position:absolute;
	
	left:0;
	right:0;
	overflow:hidden;
	height:0%;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
    border-bottom-right-radius: 1em;
}
 
header nav > ul li a {
	color:#fff;
	display:block;
	line-height:20px;
	padding:20px;
	position: relative;
	text-align:center;
	text-decoration:none;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
    overflow: hidden;
    background-color: dimgray;
    border-bottom-left-radius: 1em; 
    border-bottom-right-radius: 1em; 
    z-index: 100;
}

 
header nav > ul > li > a span {
	background:#4DA5CC;
	display:block;
	height:100%;
	width:100%;
	left:0;
	position:absolute;
	top:-55px;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
    
}

header nav > ul > li > a:hover > span {	top:0;}
 
/*Colores*/
header nav ul li a .primero {background:#4DA5CC; z-index: -50; }
.primero-activado {background:#4DA5CC; z-index: 50; color: #fff; }
.segundo-activado {background:#FF7C0F; z-index: 50; color: #fff; }
.tercero-activado {background:#4EA224; z-index: 50; color: #fff; }
header nav ul li a .segundo {background:#FF7C0F;  z-index: -50; }
 
header nav ul li a .tercero {background:#4EA224;  z-index: -50; }

header nav > ul li a:hover {color: #fff;}


.col3{width: 13%; position: relative; float: left; margin-top: 3%;}
.en-vivo {position: relative; float: left; background: none; border: 0; background-image: url(imagenes/envivo.png);background-repeat: no-repeat; padding: 10%; width: 100%; height: 50px; font-size: 1.2em; border-radius: 0.5em;font-weight: bold;}
.ingresar{position: relative; float: left; color: #000; font-style: normal; font-size: 0.85em; margin-bottom: 7%; width: 100%;}
.ingresar:hover {text-decoration: underline;}
.en-vivo:hover {box-shadow: 0px 2px 2px #999; }

.col4{width: 13%; position: relative; float: right; text-align: center;}
.col4 img {width: 27%}
.clima{font-family: 'Open Sans'; color: #2db1c3; font-size: 1em; font-weight: bold;font-style: normal;}
.buscador{position: relative; float: right;}

/*MAIN*/
main{width: 100%; min-height: 300px; position: relative; float: left; box-sizing: border-box;}
.foto-home {width: 100%; min-height: 300px; position: relative; float: left; margin: 2% auto 2% auto;}


h2 {font-family: 'Bitter'; font-size: 1.2em; font-style: italic;}
h1 {font-family: 'Bitter'; font-size: 2.5em; font-style: italic; padding: 0}
.h1celeste {font-family: 'Bitter'; font-size: 2.1em; font-style: italic; padding: 0; color: #4DA5CC; width: 100%;}

/*PROGRAMAS MAS VISTOS INDEX*/
.programasvistos {position: relative; float: left; width: 100%; height: 309px; background-image: url(imagenes/fondo-programas-vistos.png);background-repeat: no-repeat; margin: 32% 0 0 0px; }
.programasvistos h2 {margin: 90px 0 0 24px;}
hr {margin-top: 1%; width: 99%;}
.slidevideos {margin: 1% 0 0 3%; width: 100%;}
.video1 {position: relative; float: left; margin: 0 20px 0 5px; width: 29%; border-radius:1em; overflow: hidden; height: 158px;}
.video1:hover {-webkit-filter: grayscale(100%); -webkit-box-shadow: 2px 2px 5px #999;
  -moz-box-shadow: 2px 2px 5px #999;}

#fotohome {width: 100%; height: 284px; position:absolute;}


/*FILA 1 FORO y NOTICIAS*/
.fila1 {position: relative; float: left; width: 100%; min-height: 345px;}

.foro-home {position: relative; float: left; width: 68%;border: 1px solid #ccc;box-sizing: border-box; }
.tituloforo {color: #4DA5CC; margin: 3% 0 1% 0; }
.col1-sumate {position: relative; float: left; width: 45%; height: 217px; margin-top: 6%;}
.sumate-foro {position: relative; float: left; width: 100%; height: 45%;  }
.text-sumate {position: relative; float: left; font-size: 1.1em; line-height: 1.2em; width: 100%; color: #00A0C6;margin-left: 3%; }
.sumate-boton {position: relative; float: left; width: 100%; height: 19%; background-color: #00A0C6; margin: 10% 0 0 4%; }
.sumate {position: relative; float: left; background: none; width: 100%; height: 100%;  }
.sumate:hover{box-shadow: 0px 2px 2px #999;}
.h2sumate {font-family:'Open Sans'; font-size: 1.6em; font-weight: normal;}

#listadoforo{position: relative; float: left; width: 48%; box-sizing: border-box; margin: 4% 0 0 5%;}
.foro {position: relative; float: left; margin: 1% 0; border-left-color: #00597C; border-left-style: solid; border-left-width: thin; padding-left: 5%; border-bottom-color: #00597C;  border-bottom-width: thin;width: 95%;}
.foro:hover {box-shadow:  0px 2px 2px #999}

.iconoforo-index {position: relative; float: left; margin: 3% 5% 0 0;}
.textoforo{position: relative; float: left; font-size: 0.8em; line-height: 1.2em; width: 84%; }
h4 {font-family: 'Open Sans'; font-size: 1em; font-weight: normal; color: #00A0C6; margin-top: 2%;}
.h2gris {color: dimgrey;}
.h2gristwitter {color:dimgray; margin-top:  4%;}



/*NOTICIAS HOME*/
.noti-home {position: relative; float: right; width: 30%;border: 1px solid #ccc;min-height: 308px; box-sizing: border-box; }
.tit-noticias { width: 100%; color: #4DA5CC; margin: 8% 0 1% 0; }

.noticias-home {position: relative; float: left; width: 100%;}
.titulonoticias {position: relative; float: left;width: 97%; margin-top: 4%;}
.noticias-home ul li {position: relative; float: left; margin-top: 3%;}
.num-noti {width: 12%; position: relative; float: left; font-family: 'Bitter'; font-size: 1em; font-weight: bold; color: black;   margin: 1% 3% 0 0;; font-style: italic;}
.noti-content {position: relative; float: left; width: 83%;}
.h3celeste {font-family: 'Open Sans'; font-size: 1em; font-weight: bold; color: #00A0C6;}
.h3celeste:hover {text-decoration: underline;}
.textonoticia-home {position: relative; float: left;font-size: 0.8em; line-height: 1.4em;margin-top: 1%; }




/*FILA 2 AGENDA*/
.fila2 {position: relative; float: left; width: 100%; min-height: 310px;}
/*AGENDA*/
.agenda {position: relative; float: left; width: 100%; height: 208px;}

.destacado-agenda {position: relative; float: left; width: 65%; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; min-height: 250px;}
.content-fila2 {position: relative; float: left; height: 207px;}
.tit-agenda { width: 100%; color: #4DA5CC;}
.textoagenda {position: relative; float: left; width: 60%; margin: 2% 0 0 37%}
.text-agenda-home {position: relative; float: left; font-size: 0.8em; line-height: 1.5em; width: 100%; margin-bottom: 2%;}

.col2-destagenda {position: relative; float: right; width: 100%;}
.img-tini { position: absolute; }
.imagentini {display: block; width: 100%; position: relative; float: left;  z-index: 5000; overflow: hidden;}

.subinfo{position: relative; float: left;  font-family: 'Bitter'; font-size: 1.3em; font-style: italic; font-weight:normal; background-color: #4DA5CC; margin: 3% 0 0 0%; padding: 2% 9% 1% 32%; width: 57%;   color: #fff; }
.costo-index {position: relative; float: right;   margin: 0% 2% 0 0;   width: 61%;}
.extras-index {position: relative; float: left; width: 35%; height: 30px; margin-top: 2%;}
.compartinlink-index {width: 100%; } 

.dos-eventos {position: relative; float: left; width: 100%;}
.col-otroseventos {position: relative; float: right; width: 34%; height: 250px; margin-top: 2%;}
.tit-otros { width: 100%; color: #4DA5CC;}
.even1 {width: 49%; position: relative; float: left; height: auto; margin-top: 3% }
.even1:hover {box-shadow: 0px 2px 2px #999;}
.even2 {width: 49%; position: relative; float: right; height: auto; margin-top: 3% }
.even2:hover {box-shadow: 0px 2px 2px #999;}

.even-fecha {position: relative; float: left; font-size: 0.8em; font-weight: bold; color: black; width: 75%;}
.even-fecha:hover {text-decoration: underline;}
h5 {position: relative; float: left; font-family:'Open Sans'; font-size: 0.8em; font-weight: bold; color: #4DA5CC;}
h5:hover {text-decoration: underline;}
.boton-mas {position: relative; float: right; }

.separador{clear: both;}




/*FILA RINCONES*/
/*RINCONES*/
.titulorincones {position: relative; float: left; width: 99%; margin-top: 5%;}
.mail-to a{font-style: italic; font-weight: bold; color: deepskyblue;}
.mail-to a:hover {font-style: italic; font-weight: bold; color: deepskyblue; text-decoration: underline;}
.list-img {position: relative; float: left; margin-top:3%; width: 100%; height: auto; border: 1px solid #ddd; box-sizing: border-box;}
.tit-fotos {position: relative; float: left; width: 23%;}
.tit-fotos img {position: relative; float: left; width: 10%;}

h6 {position: relative; float: left; font-family:'Open Sans' ; font-size: 0.7em; color: dimgray; margin: 0;}
h6:hover {text-decoration: underline;}
.list-img-rincon {position: relative; float: left; width: 98%; margin: 1% 0 0 2%;}
.list-img-rincon ul {display: inline;}
.list-img-rincon ul li {position: relative; float: left; width: 30%; margin-right: 3%;}
.list-img-rincon ul li a img {width: 100%; text-decoration: none; margin: 2% 0 2% 0; position: relative; float: left;} 
.list-img-rincon ul li a img:hover { box-shadow:  3px 3px 5px #3c3c3c;}
.h5-2 {margin: 2% 0 0 2%}
.text-rincon {width: 56%; position: relative; float: left;}
.text-rincon-home {line-height: 1.5em; margin-top: 2%;}
.cada {text-align: center;}


.texto-escondido {position: relative; float: left; width: 100%; color: black; background: dimgray; padding:4% 9% 4% 9%; height: auto; box-sizing: border-box; display:none;}
.pwhite {color: #fff; margin-top: 2%; font-size: 0.9em; text-align: center; line-height: 1.5em;}




/*PROGRAMAS*/
.horarios {padding-left: 13%;}
.seccion-nar:hover {color: #fff; background:#EF7B22;  padding: 11px;}
.seccion1-nar {color: #fff; background: #EF7B22;  padding: 11px; font-family: 'Open Sans';font-style: italic; font-weight: bold; border-top: 3px solid #EF7B22;}
.seccion-nar {color: dimgray; font-family: 'Open Sans';font-style: italic; font-weight: bold;padding: 11px; border-top: 3px solid #EF7B22; }





/*HOVER DE PROGRAMAS*/
.programas { width: 100%; height: auto;  overflow: hidden; position: relative; float: left;}
.programas ul {  list-style: none; width: 100%}

.programas ul li{ position: relative; float: left;  width: 40%; margin:  2% 10% 2% 0;  min-height: 225px; }
.programas ul li img {width: 100%;}
.programas ul li:hover .text-content { opacity: 1;}


.text-content { background-size: 100%; background: rgba(0, 0, 0, 0.7); cursor: pointer;  display: table;  min-height: 100px;  width: 100%; position: absolute; opacity: 0;  z-index:100;  text-align: center; top: 0%; border-radius: 1em;
-webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms; 
-webkit-filter: grayscale(100%);
}

.text-content p { margin: 16% 15%;  font-family: 'Open Sans', normal; font-weight: lighter; font-size: 1em; line-height: 1.5em;
  color: white; width: 70%; }



.fondo-titulo-destacado {position: absolute; margin-top: 72px; background-image: url(imagenes/fondo-titulo-destacado.png); width: 100%; height: 21px;}
.titulo-destacado {position: absolute; font-family: 'Bitter' ;font-style: italic; font-size: 1em; font-weight: lighter; color: white; margin-left: 10px;}

/*DESTACADOS ASIDE*/
#cap-dest{position: relative; float: left; width: 100%; min-height: 200px;}
#list-cap {position: relative; float: left; width: 100%; }
.h4cap {position: relative; float: left; width: 100%; margin-top: 1%; color: white; background-color: #EF7B22; padding-left: 4%;font-size: 0.95em; box-sizing: border-box;}
.textocap {position: relative; float: left; font-size: 0.9em; line-height: 1.3em; width: 100%; margin-top: 2%;}



.novedadesaside {width: 100%}
.destacadosaside {position: relative; float: left; width: 100%; margin-top: 14%;}
.destacadoagenda {position: relative; float: left; width: 100%; height: 185px; background-color: #00A0C6; border-radius: 1em; margin-top: 10%;}
.img-aside-agenda {width: 100%; position: absolute;}
.info-destacado-agenda {width: 100%; height: 110px; position: relative; float: left; margin-top: 50%;}
.horario {position: absolute; color: dimgray; font-size: 1em; font-weight: bold; font-style: italic; color: aliceblue;}
.texto-destacado {position: relative; float: left;color: aliceblue; font-family: 'Open Sans'; font-size: 0.80em; line-height: 1em; width: 70%; margin-left: 25%;}

.destacadonoticia {width: 100%; height: 110px; position: relative; float: left; margin-top: 50%;}








/*HORARIOS*/
.parte-horarios {max-width: 100%; position: relative; float: left;}

.h2naranja {color: #FF7C0F; position: relative; float: left; margin-top: 2%; padding: 0; font-weight: normal; width: 100%;}
.nav-dias-nar {position: relative; float: left; margin: 1% 0 3% 0%; width: 84%; height: 48px; background-color: #FF7C0F; font-family: 'Bitter'; font-style: italic;  font-size: 1em; border-radius: 1em;}
.nav-dias-nar ul li {text-decoration: none; display: inline; position: relative; float: left; margin: 2.3% 0 0 1%; width: 13%;}
.nav-dias-nar ul li a {padding: 12%;}
.nav-dias-nar ul li a:hover {color: dimgray; background-color: white; border-radius: 1em;}
.dia-seleccionado {color: dimgray; background-color: white; border-radius: 1em; padding: 12%;}
.cap-horario {position: relative; float: left; margin: 2% 3% 2% 0 ; max-width: 30%; min-height: 200px;}


.img-cap-horario {width: 100%; position: relative; float: left; margin-top: 2%}
.info-destacado-capitulo {max-width: 100%; height: auto; position: relative; float: left; margin-top: 3%; margin-bottom: 5%;}
.horario-cap {position: relative; float: left; font-family: 'Bitter';background-color: #EF7B22; font-size: 1em; font-weight: bold; font-style: italic; color: white; height: 30px; width: 100%; padding: 2% 0 0 5%; box-sizing: border-box;}
.col-info-horario {position: relative; float:left; width: 100%; border: 1px solid #CCCCCC; color: dimgray; box-sizing: border-box; padding: 4% 2%; min-height: 165px;}
.texto-capitulo {position: relative; float: left; color:dimgray; font-size: 0.8em; line-height: 1.3em;}
.tit-capitulo {color: #FF7C0F; font-style: italic; font-size: 1em; font-family: 'Open Sans'; position: relative; float: left;}
.extras-horarios {  position: relative;  float: right;  width: 75%; }
.compartirlink-horarios {position: relative;float: right; margin-top: 1%; width: 82%;}

/*ASIDE HORARIOS*/
.hoy {position: relative; float: right;  }
.hoy img{width: 100%;}
.hoy-horario {position: absolute; background-color: #ffe62a; padding: 5%; top: 2px; left: 15px;  box-shadow:  3px 3px 5px #3c3c3c;} 
.destacado-hoy {position: relative; float: left; height: 300px;}
.seccion-hoy {position: absolute; bottom: 65px; left: 0;}
.seccion-hoy img {width: 100%;}

.titulo-hoy {position: relative; float: left;  font-family: 'Bitter'; font-size: 1.05em; font-style: italic; font-weight:bold; width: 100%; padding-top: 3%; color: #fff; }
.info-hoy {position: absolute; bottom: 4px; left: 0; min-height: 14%; background-color: rgba(0, 0, 0, 0.40); box-sizing: border-box; padding: 2% 5% 0% 5%; border-radius: 0 0 10pt 10pt; width: 100%;}
.blanco {font-family: 'Bitter'; font-style: italic; font-size: 0.9em; margin: 2% 0 0 7%; position: absolute; }
.h2hoy {font-size: 1.4em; color: dimgray;}






/*BANDAS EMERGENTES*/

.interna-prog{color:  #ff9d00; font-family:'Open Sans'; font-size: 0.9em; margin-right: 8%;}
.volver a:hover{text-decoration: underline;}



.bandas {position: relative; float: left; width: 97%; background-color: dimgray; height: 100%; border-radius:1em; overflow: hidden; margin-top: 2%;}
.video-bandas {position: relative; float: left; width: 90%; margin: 5%; height: 380px;}
.video-bandas iframe{width: 100%; height: 100%;}

.masvistos-bandas {position: relative; float: left;}
.slide-mas-videos {max-width: 100%;   margin-top: 4%; position: relative; float: left;}
.video-mas-bandas {position: relative; float: left;   margin: 0 2% 0 1%; max-width: 30%; border-radius:1em; overflow: hidden; height: 158px;}
.video-mas-bandas iframe{width: 100%; height: 100%;}
.video-mas-bandas:hover {-webkit-filter: grayscale(100%); -webkit-box-shadow: 2px 2px 5px #999;
  -moz-box-shadow: 2px 2px 5px #999;}

    /*COMENTARIOS VIDEO BANDAS*/
.comentarios-bandas {position: relative; float: left; width: 90%; margin: 0 5% 0 5%;}
.col2-coment-bandas {position: relative; float: right; width: 60%;}
.foto-perfil {position: relative; float: left; margin-left: 1%; width: 10%;}
.campo-comentario {position: relative; float: left; width: 84%; min-height: 50px; margin-left: 5%;}
.campo-comentario form textarea{font-family: 'Open Sans'; color: dimgray;  padding: 2%; box-sizing: border-box; width: 100%; height: 70px;}
.enviar-coment {position: relative; float: right; font-family: 'Open Sans'; color: dimgray; font-size: 0.8em; background-color: white;border-radius: 1em; overflow: hidden; width: 20%; height: 23px; margin: 3% 0 0 0; padding: 0; }
.comentario {position: relative; float: left; width: 98%; margin: 3% 0 0 1%;}
.comentarios-viejos {position: relative; float: left; width: 99%; background-color: white; border-radius: 1em; height: 100%; margin: 5% 0 8% 0%; padding: 3% 0 7% 1%;}
.texto-coment {position: relative; float: left; font-family: 'Open Sans'; font-size: 0.75em; line-height: 1.5em; width: 84%; color: dimgray; margin:  1% 0 0 4%;}



.dias-horario {position: relative; float: left; width: 35%; height: 112px; background-color:#FF7C0F ; border-radius: 2em; overflow: hidden; margin-top: 5%}
.h2dias {color:dimgray; margin: 10% 0 1% 14%;}
.h3dias {font-family: 'Open Sans'; font-style: italic; font-size: 0.95em; margin-left: 9%;}

.borde-manchas {position: absolute; left: -35px; top: -6px; width: 39%; height: 151px; margin: 3% 0 0 3%;}









/*CONSTRUCCIÓN*/
.construccion{position: relative; float: left; width: 99%; background-image: url(imagenes/breakmates2.png); background-repeat: no-repeat;min-height: 740px; border-left: solid 1px #ddd}
.upss{position: relative; float: left; width:71%; padding-left: 3%;}
.ups {font-family: 'Bitter'; font-style: italic; font-weight: bold; font-size: 1.5em; background-color: #50A334;padding: 2% 5.25%; border-radius: 20px; color: #fff; }
.upsi{font-weight: bold; font-style: italic; font-size: 1.5em; color: #000; margin: 1% 2%; line-height: 1.1em;width: 75%;}

.ingresa-const {position: relative; float: left; width: 38%; height: 212px; background-color:#50A334; margin: 2% 0 0 4%; opacity: 0.8; } 
.text-ing {color: #fff; width: 71%; margin: 5% 0 0 14%;}
.nom-cons {width: 71%; position: relative; float: left; margin: 5% 0 0 14%; height: 38px; color: dimgray; font-size: 1em;}
.enviar-con {position: relative; float: right; font-family: 'Open Sans'; color: dimgray; font-size: 0.8em; background-color: white;border-radius: 1em; overflow: hidden; width: 20%; height: 23px;margin: 4% 15% 0 0; }

.footer-con {margin: 0;}




/*AGENDA CULTURAL*/
.navprog {width: 100%; min-height: 40px; position: relative; float: left;}
.navprog ul li {font-size: 0.9em; text-decoration: none; margin-right: 1%; display: table-cell; position: relative; float:left ;}
.navprog ul li a {text-decoration: none;}
.seccion:hover {color: #fff; background: #4DA5CC;  padding: 11px;}
.seccion1 {color: #fff; background: #4DA5CC;  padding: 11px; font-family: 'Open Sans';font-style: italic; font-weight: bold; border-top: 3px solid #4DA5CC;}
.seccion {color: dimgray; font-family: 'Open Sans';font-style: italic; font-weight: bold;padding: 11px; border-top: 3px solid #4DA5CC; }

.evento-destacado-grande {position: relative; float: left; width: 100%; margin-top: 2%;}
.evento-destacado-grande img {position: relative; float: left; width: 100%; border: 1px solid #ddd;}
.info-evento-grande {position: absolute;  background-color: rgba(255,255,255,0.70);margin-top: 28.5%; box-sizing: border-box;
width: 100%; height: 103px;}
.info-evento-grande img {width: 3%; border: none; margin-top: 3%;}
.titulo-evento-grande {position: relative; float: left;  font-family: 'Bitter'; font-size: 2em; font-style: italic; font-weight:bold; width: 45%; padding: 0.5% 0 0.5% 3%; background-color: #00A0C6;margin-left: 0.3%;}
.evento-destacado-grande:hover {box-shadow: 0px 3px 3px #999;}

.p-evento-dest {position: relative; float: left; font-size: 1em; font-weight: bold; color: #000; padding: 0.5% 0 0 3%; width: 93%;   line-height: 1.3em;}
.p-fecha-dest {position: relative; float:right; font-size: 1.2em; font-weight:800; color: #000; padding: 1% 0 0 2%; width: 25%;}

.treseventos-fila {position: relative; float: left; width: 100%; margin: 5% auto 3% auto;}
.pag-evento-1 {position: relative; float: left; width: 31%;margin-right: 3.5%; }
.pag-evento-3 {position: relative; float: left; width: 31%; }
.pag-evento-1:hover {box-shadow: 0px 2px 2px #999;}
.pag-evento-3:hover {box-shadow: 0px 2px 2px #999;}
.img-eventos {width: 100%;}
.asideagenda {position: relative; float: right; margin-top: 5%;}


/*-------------------CALENDARIO ---------------------*/

.box-calendar {	width: 92%;	float: right; box-shadow: 0px 4px 11px 0 rgba(0,0,0,0.25);height: auto; margin: 6% 0 13% 0;}
#calendar {	width: 94%;	margin: 2% auto 2% auto; border-left: 1px solid #ddd; border-collapse: collapse; font-family: 'Open Sans';}
#calendar .flechanav, .flechanav a {color: #4DA5CC;	text-align: center;	text-decoration: none;}
caption { color: #4DA5CC; border: 1px solid #A2ADBC; font-size: 1.2em; font-weight: 600;margin: 0;
	margin-bottom: 5px;	width: 99.5%;text-align: center; font-weight: bold;}
th {max-width: 20px;color: dimgray; font-size: 0.7em;border-right: 1px solid #A2ADBC;border-bottom: 1px solid #A2ADBC;border-top: 1px solid #A2ADBC;}
td.today { color: #fff; margin: 0;padding: 0;font-weight: bold;	background-color: #88a7b7;}
td.today a {margin: 0;	padding-top: 1px ;padding-bottom: 1px ;font-weight: bold;}
.today a:hover {color: #fff;font-weight: bold;}
td {padding: 0;	border-right: 1px solid #A2ADBC;border-bottom: 1px solid #A2ADBC;width: 25px;height: 30px;
	text-align: center;}
td a {text-decoration: none;font-weight: 700;display: block;}
td a:link, td a:visited {color: #608194;}
td a:hover, td a:active {color: skyblue;}
/*--------------------------------------------------------------------------------------*/

/*EVENTOS*/
.eventos {height: 227px; margin: 3% 0 12% 0; position: relative;float: right;width: 91%;}
.eventos-prog {height: 227px; margin: 15% 0 12% 0; position: relative;float: left;width: 91%;}

.evento { position: relative; float: left; height: 56px; margin-top: 2.5%; width: 100%;}
.evento a img{width: 100%;}
.listado-fechas-agenda {width: 28%; position: relative; float: left; margin-top: 8%;}
.listado-fechas-agenda ul {min-height:  100px; list-style-type: none;}
.listado-fechas-agenda ul li  { padding: 26% 0 0 16%; background-color: #8DC0CC; font-family: 'Open Sans'; font-size: 1.2rem; line-height: 1.3rem;  color: white; font-weight: bold; height: 48px; box-sizing: border-box; margin-top: 5%; margin-bottom: 18%;}
.listado-fechas-agenda ul li:hover {color: dimgray;}
#listadoeventos {position: relative; float: left; margin: 8% 0 0 3%; font-size: 1.3rem; line-height: 1.3rem; width: 68%;  font-weight: bold;}
.textoevento1 {position: absolute; margin: 4% 0 0 5%; color: #fff; width: 80%; font-size: 0.7em}
.textoevento1:hover {color:dimgray; font-weight: bold;}






/*---------------------------EVENTO---------------------------------------*/
.content-evento {position: relative; float: left; width: 90%; height: 500px;   margin-right: 5%; }
.bicicleta {position: relative; float: left; width: 35%;}
.info-evento-bici {position: relative; float: left; width: 60%; margin-left: 5%;}
.h2negro {position: relative; float: left; font-family: 'Bitter'; font-size: 1.2em; color: black; width: 100%;  margin: 2% 0 0.5% 0;}
.mapa-evento {position: relative; float: left; width: 100%; margin: 2% 0 2% 0;}
.mapaeven {width: 100%}
.info-delevento {position: relative; float: left; margin-top: 3%; width: 100%;}
.tarifa-event {position: relative; float: left; width: 60%; margin: 2% 0 4% 0;}
.tarifa-event img {width: 17%;   position: relative; float: left; margin-top: inherit;}
.aprovecha-event {position: relative; float: left; font-family: 'Open Sans';font-weight: normal; font-size: 1.3em; color: #00A0C6; margin: 2% 0 0 2%; font-style: normal;}
.aprovecha-event2 {position: relative; float: left; font-family: 'Open Sans';font-weight: normal; color: #00A0C6;  margin: -1.5% 0 0 2%; font-style: normal; font-size: 0.92em; }

.asistire-boton{position: relative; float: left; width: 40%; height: 15%; background-color: #00A0C6;   margin-top: 4%;}
.asistire {position: relative; float: left; background: none; width: 100%; height: 100%;  }
.asistire:hover{box-shadow: 0px 2px 2px #999;}


.otrosevento-abajo {position: relative; float: left; margin-top: 4%; width: 100%;}
.seraqueda {width: 100%;}



/*-----------------------------------PAGINA DE FOROS------------------------------------*/

.miperfil {position: relative; float: left; border: solid 1px #ddd; width: 100%; height: auto; border-top-left-radius: 2em; box-shadow:  0px 2px 2px #999; margin-top: 4%; box-sizing: border-box;}
.img-perfil {margin:  2% 0 0 2%; position: relative; float: left; width: 37%}
.nombre-perfil {position: relative; float: left; width: 60%; margin-bottom: 12%;}
.laura {margin: 15% 0 2% 5%; 'Open Sans';font-weight: normal;  ; color: #4DA5CC;}
.nombre-perfil ul li {position: relative; float: left; width: 15%; height: 20px;}
.h5laura {font-style: italic; font-size: 0.8em; margin: 1% 0 0 5%;}
.datos-perfil {position: relative; float: left; width: 90%; margin: 3% 0 10% 11px; border-left: 1px solid #ddd; padding-left: 5%;}

.iconoforo {position: relative; float: left; margin-right: 2%;}

.icon-msj1 {background-image: url(imagenes/iconmensajes.png); background-repeat: no-repeat; margin-left: 5%;}
.icon-msj1:hover {background-image: url(imagenes/iconmensajesceles.png);}
.icon-msj2 {background-image: url(imagenes/icon_etiquetas.png); background-repeat: no-repeat; margin-left: 3%;}
.icon-msj2:hover {background-image: url(imagenes/icon_etiquetasceles.png);}
.icon-msj3 {background-image: url(imagenes/iconfavoritos.png); background-repeat: no-repeat; margin-left: 3%;}
.icon-msj3:hover {background-image: url(imagenes/iconfavoritos_celes.png);}
.mas-blanco {position: relative; float: right; width: 10%; font-size: 1.5em; font-weight: bold; margin-top: -1%; }

{	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


ul {
	list-style-type: none;
}


/** =======================
 * Contenedor Principal
 ===========================*/
/*h1 {
 	color: #4DA5CC;
 	font-size: 24px;
 	font-weight: 400;
 	text-align: center;
 	margin-top: 80px;
 }

h1 a {
 	color: #fff;
 	font-size: 16px;
 }*/

 .accordion {
     position: relative; float: left;
 	width: 100%;
 	max-width: 700px;
 	background: #FFF;
 	-webkit-border-radius: 4px;
 	-moz-border-radius: 4px;
 	border-radius: 4px;
     margin-top: 2%;
 }

.accordion .link {
    font-family:'Open Sans'; font-style: normal; font-weight: normal; 
	cursor: pointer;
	display: block;
	padding: 15px 15px 15px 20px;
	color: dimgray;
	font-size: 14px;
	font-weight: 700;
	border: 1px solid #CCC;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

/*.accordion li:last-child .link {
	border-bottom: 0;*/
}

.accordion li i {
	position: absolute;
	top: 16px;
	left: 12px;
	font-size: 18px;
	color: #4DA5CC;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.accordion li i.fa-chevron-down {
	right: 12px;
	left: auto;
	font-size: 16px;
}

.accordion li.open .link {
	color: #4DA5CC;
}

.accordion li.open i {
	color: #4DA5CC;
}
.accordion li.open i.fa-chevron-down {
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

/**
 * Submenu
 -----------------------------*/
 .submenu {
 	display: none;
 	background: #4DA5CC;
 	font-size: 14px;
     font-family:'Open Sans'; font-style: normal; font-weight: normal; 
 }

 .submenu li {
 	border-bottom: 1px solid #6696ac;
 }

 .submenu a {
 	display: block;
 	text-decoration: none;
 	color: #fff;
 	padding: 12px;
 	padding-left: 42px;
 	-webkit-transition: all 0.25s ease;
 	-o-transition: all 0.25s ease;
 	transition: all 0.25s ease;
 }

 .submenu a:hover {
 	background: #ccc;
 	color: #FFF;
 }

















/*---------------------------------- PAGINA NOTICIAS---------------------*/
.noticia-destacada-grande {position: relative; float: left; width: 100%; margin-top: 2%;height: auto;  border: 1px solid #ddd; box-sizing: border-box;}
.noticia-destacada-grande:hover {box-shadow: 0px 3px 3px #999;}
.info-noticia-grande {position: relative; float: left;}
.imagenbondi {position: relative; float: right; width: 50%;}
.titulo-noticia-grande {position:relative; float: left;  font-family: 'Bitter'; font-size: 2em; font-style: italic; font-weight:bold; width: 97.2%; padding: 0.5% 0 0.5% 3%; background-color: #00A0C6; }
.bajadanoti-dest {position: relative; float: left; font-family: 'Bitter'; font-size: 1.4em;line-height: 1.3em;font-style: italic;width: 99%;color: #fff;background-color: #bbb;padding: 1% 1% 1% 2%;}

.p-noti-dest {position: relative; float: left; font-family: 'Open Sans'; font-size: 0.8em; color: #000;
width: 97%; margin: 3% 0 0 2%; line-height: 1.5em;}

.col2notiancha {width: 75%; position: relative; float: left;} 
.noticia_ancha {position: relative; float: left; width: 100%; margin: 5% 0 0 0; }
.noticia_ancha:hover {box-shadow: 0px 4px 11px 0 rgba(0,0,0,0.25)}
.noticia_ancha_img {position: relative; float: left; width: 25%;}
.contenido_noticia {position: relative; float: left; width: 97%; margin: 0 0 1% 2%}
.h4noti_listado {font-size: 1.3em; font-weight: bold; margin-left: 2%;}

.col1-infogrande {position: relative; float: left; width: 50%; margin-top: 2%;}
.p_bajada_notilist {position: relative; float: left; font-family: 'Open Sans'; font-size: 1em; color: #000;
width: 90%; margin: 1% 0 0 2%; line-height: 1.4em;}

.extras-notigrande {position: relative;float: right;width: 38%;height: 30px;margin-top:4%}

.noti-siguientes {position: relative; float: left; width: 100%;}
.siguientes {list-style:none; margin: 8% 0 0 0% ; text-align: center; font-family: 'Open Sans'; font-weight:  bold; font-size: 0.8em; }
.siguientes li  {display: inline;}
.siguientes li a { color: #999; border-radius: 1em; padding: 1% 2%;margin-left: 2%; border: 1px solid #999;}
.siguientes li a:hover { background-color:  #999; color: #fff}


    
/*---------------------------------METROBUS------------------------*/
.metro {margin-top: 2%; width: 100%;}
.tit-metrobus {color: #00A0C6; margin-top: 3%;}
.col-editor {position: relative; float: left; width: 17%; margin-top: 2%;}
.imgeditor {position: relative; float: left; width: 100%;}
.dani {margin: 5% 0 5% 14%;}
.compartirlink-dani {width: 100%;   margin-top: 4%}
.compartir-dani {  position: relative;float: left;font-style: normal;font-weight: normal; color: #00A0C6; margin: 4% 0 0 0; width: 55%;}
.contenido-nota {width: 80%; position: relative; float: right;}
.bajadanoti {position: relative;float: left; font-family: 'Bitter'; font-size: 1.4em; line-height: 1.3em; font-style: italic; width: 100%; color: #000; }
.textometro {line-height: 1.5em;margin-top: 3%;}

.otrasnoti {position: relative; float: left; margin-top: 12%;}
.tresnoti-fila {  position: relative;float: left; width: 100%; margin: 2% auto 0 auto;}

.tit-aside {position: relative; float: right; width: 90%; margin-top: 4%;}
.nota-aside {position: relative; float: right; width: 91%; margin-top: 7%;}
.nota-aside img {position: relative; float: left; width: 100%;}
.noti-cont-aside {position: relative;float: left;width: 100%; margin-top: 3%;}




/*-----------------BUSCAMOS A LOLA-------------------------------*/

.acordion_lola {position: relative; float: left;  width: 100%;}
.titulo_lola {position: relative; float: left; width: 100%; height: 115px;} 
.lola {background: #4DA5CC; font-size: 14px;     font-family:'Open Sans'; font-style: normal; font-weight: normal; height: 43px;}

.lola a {
 	display: block;
 	text-decoration: none;
 	color: #fff;
 	padding: 12px;
 	padding-left: 42px;
 	-webkit-transition: all 0.25s ease;
 	-o-transition: all 0.25s ease;
 	transition: all 0.25s ease; }

.contenido_foro {position: relative; float: left; width: 98%; margin-top: 2%;}
.contenido_foro img {position: relative; float: left; width: 8%;}
.posteo_foro {position: relative; float: left; width: 87%; border: 1px solid #ddd;height: 220px;
  margin-left: 3.6%;}
.publicador {margin: 2% 0 0 2%; width: 100%;}
.text-buscamos {margin: 1% 0 0 1.7%; width: 90%; color: #000;}

.posteo_foro img {position: relative; float: left; margin: 5% 1% 0 2%; width: 20%; }
.compartir-lola {position: relative; float: right; margin-top: 14%;}
.compartir-lola img {margin: 0}

.comentarios-lola {  position: relative; float: left;   margin-left: 8%; width: 98%;}
.campo-comentario-foro {position: relative; float: left; border: 1px solid #ddd;  width: 85%; height: 50px; margin: 1% 0 0 3%; color: dimgray;}
.col-coment-foro  {position: relative; float: left; width: 90%; margin-left: 1%;}
.foto-perfil-foro {  position: relative; float: left; }





/*-----------------------------RINCONES---------------------------------*/
.section-rincon {position: relative; float: left; width: 100%;}
.historias { width: 75%; position: relative; float: left; margin-top: 3%;}
.rincon-destacado{ position: relative; float: left;  width: 100%;  }
.rincon-destacado img {width: 97%; border-radius: 2em;}

.rincon-destacado:hover .text-content-historias { opacity: 1;}
.text-content-historias  { background-size: 100%; background: rgba(0, 0, 0, 0.4); cursor: pointer;  display: table;  width: 97%;   height:auto; position: absolute; opacity: 0;  z-index:100;  text-align: center; top: 0%; border-radius: 2em;
-webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms; 
-webkit-filter: grayscale(100%); }

.text-content-historias p { margin: 5% 7% 0% 7%; font-weight: lighter; font-size: 1em; color: white; width: 85%; line-height: 1.4em; }
.tit-historia { margin-top: 10%;}

.vertodas {position: relative; float: right; color: #4DA5CC;width: 9%; margin-top: 2%;}
.h5-3 {margin: 5% 0 5% 4%;}
.aside-imagenes {position: relative; float: right; width: 24%; border: 1px solid #ddd; margin-top: 3%;}
.aside-imagenes ul {display: inline;}
.aside-imagenes ul li{position: relative; float: left; width: 45%; display: inline; margin-left: 3.3%;}
.aside-imagenes img {width: 100%; }

.subi-tufoto {background-image: url(imagenes/subitufoto.png); background-repeat: no-repeat; width: 100%; height: 60px;margin-top: 7%; font-size: 1.4em; font-style: italic;}
.subi-tufoto:hover {box-shadow: 0px 2px 2px #999;}





/*NOSOTROS*/
.seccion-ver:hover {color: #fff; background: #50A334;  padding: 11px;}
.seccion1-ver {color: #fff; background: #50A334;  padding: 11px; font-family: 'Open Sans';font-style: italic; font-weight: bold; border-top: 3px solid #50A334;}
.seccion-ver {color: dimgray; font-family: 'Open Sans';font-style: italic; font-weight: bold;padding: 11px; border-top: 3px solid #50A334; }



.sectiontotal {width: 100%}
.nosotros-img{max-width: 100%; margin-bottom: 2%}
.filamapa {width: 100%;}
.mapa{position: relative; float: left; width: 100%; margin-top: 2%; min-height: 200px;}
.mapa iframe{height: 250px; width: 100%;}
.infonos{max-width: 50%;min-height: 255px;background-color: dimgray;border-radius: 0 0 1em 1em;box-sizing: border-box; position: relative; float: left;}
.nos{font-size: 1.55em; padding:2% 0 2% 6%; background-color: #50A334; width: 100%; box-sizing: border-box;}
.parrafo{font-style: normal; font-weight: normal; font-size: 0.85em; line-height: 1.75em; padding:3% 5% 0 6%;  color: #fff; width: 90%;}
.par-dif{font-style: normal; font-weight: normal; font-size: 0.85em; line-height: 1.75em; padding:3% 5% 5% 6%;  color: #fff; width: 90%;}

.infonos span{font-weight: bold; font-style: italic;}
.datos-nosotros{position: relative; float: left; margin-left: 2%; width: 48%;}
.sumate-nos{margin-bottom: 2%; position: relative; float: right; width: 100%; margin-top: 5%;}
.vossumate-nos{background-image: url(imagenes/sumatebot.png); background-repeat: no-repeat; background-color: #50A334; width: 100%; height: 45px; font-size: 1.4em; font-style: italic;}
.encontranos{position: relative; float: left;  width: 100%; display: none; margin-top: 5%;}
.encontranos ul li{margin:2% 0; position: relative; float: left; width: 100%;}
.encontranos ul li a{color: dimgray; font-family:'Open Sans'; font-size: 1.1em;}
.encontranos a img{padding-right: 2%; max-width: 25%;}


.fotos{width: 100%; min-height: 100px; position: relative; float: left; margin-top: 2%;}
.fotos2{max-width: 100%; min-height: 100px; position: relative; float: left; margin-top: 1%;}
.individual{max-width: 15.5%; position: relative; float: left; margin:1% 0 0 1%;}
.individual img{max-width: 100%; position: relative; float: left; border-radius: 10px;}
.nombre{ font-weight: bold; font-size: 0.8em; color: black; width: 100%; position: relative; float: left; padding: 8% 0 2% 0;}
.quees{ font-size: 0.8em; color: black; position: relative; float: left; line-height: 1.5em;}
.masverde {position: absolute; box-shadow:0px 1px 2px #000; width: 14%;background: #50A334;border-radius: 1em;color: #fff; padding: 2%;text-align: center;}



/*PERFIL EQUIPO*/
.ubicacion{width: 50%; position: relative; float: left; margin-top: 2%;}
.volver{width: 40%; position: relative; float: right; margin-top: 2%; text-align: right;}
.info-ubic{color: #0acccc; font-family:'Open Sans'; font-size: 0.9em;}
.nombre-perfil-equipo {position:relative; float: left;  font-family: 'Bitter'; font-size: 2em; font-style: italic; font-weight:bold; width: 97.2%; padding: 0.5% 0 0.5% 3%; background-color:#50A334;}
.equipa {position: relative; float: left; width: 100%; margin-top: 2%;min-height: 370px;  border: 1px solid #ddd; box-sizing: border-box;}
.sole {width: 40.5%; position: relative;float: left; border-bottom: 1 px solid #ccc; border-bottom: 1px solid #ccc;}
.infoderecha {position: relative; float: right; width: 54%; box-sizing: border-box; padding-right: 3%;}
.info-destacada{width: 100%; position: relative; float: left; margin: 4% 0;}
.info-destacada p{line-height: 1.85em;}
.info-destacada p span{font-weight: bold; color: dimgray;}
.textosole {position: relative; float: right; width: 100%; line-height: 1.5em; margin-top: 2%;}
.redes-sol {position: relative; float: right; width: 50%; margin:4% 1%;}
.escribi {margin-top: 18% ; position: relative; float: right; width: 91%;}
.sumatee{margin: 3% 0 12% 0; position: relative; float: right; width: 100%;}
.vossumate {background-image: url(imagenes/sumatebot.png); background-repeat: no-repeat; width: 100%; height: 60px;margin-top: 7%; font-size: 1.4em; font-style: italic;font-family:'Open Sans';}
.avionchico {width: 100%}
.nombre:hover {text-decoration: underline;}
.redes-sol img {position: relative; float: left; width: 15%;}
.escribile {width: 55%;margin-top: 3%;color: #50A334; font-weight: bold;}


/*CONTACTO*/
.section100{width: 100%; margin-top: 3%; background: #50A334; min-height:580px;}
.seleccontacto{background-image: url(imagenes/fondo_nav_nosotros.png); background-repeat: no-repeat; width: 23%; margin-left: -5%;}
.botoncontacto{background-image: url(imagenes/fondo-nav-prog-gris.png); background-repeat: no-repeat; width: 23%;}
.botoncontacto:hover {background-image: url(imagenes/fondo_nav_nos.png); background-repeat: no-repeat; width: 23%;}
.contacto-col1{width: 50%; min-height: 20px; position: relative; float: left; margin:2% 0 0 4%;}
.camara{width: 13%; height: 106px; position: relative; float: left;background-image:url(imagenes/camara.png); background-repeat: no-repeat; }
.infocontac{color: dimgray; width: 86%;  position: relative; float: left; box-sizing: border-box; padding: 2%; margin-top: 6%}

.formprog{width: 86%; position: relative; float: left; min-height: 20px; margin-top: 4%;}
label{width: 100%; position: relative; float: left; font-size: 0.9em; font-weight: bold; margin-top: 3%;}
#progfav{color: dimgray; width: 100%; position: relative; float: left; height: 45px; font-family: 'Open Sans';  margin:2% 0 2% 0; padding: 0 2%;}
#progfav option {color: dimgray;}
#progfavprop{color: dimgray; padding: 2%; width: 95%; height: 100px; margin-top: 2%;font-family: 'Open Sans';}


.encuestaforo{width: 50%; position: relative; float: left;}
#positivo{width: 10%; position: relative; float: left; margin: 4% 3% 0 0;}
#negativo{width: 10%; position: relative; float: left; margin: 4% 0% 0 0;}

.sectionfav{width: 50%; position: relative; float: left; margin-top: 6%;}
#sectionfav{color: dimgray; width: 50%; position: relative; float: left; height: 37px; font-family: 'Open Sans'; padding: 0 2%;  margin-top: 6%;}
#sectionfav option{color: dimgray;}

.puntuacion{width: 46%; position: relative; float: right; margin-top: 4%;}
.punt {margin-bottom: 11%;}
.checkprog{width: 45%; position: relative; float: left; font-size: 0.9em;}
form{font-family: 'Open Sans';}
#listadoprog{margin: 11% 2% 0 0;}
.notaprog{width: 25%; position: relative; float: right; margin-right: 21%;}
.notanum{width: 52%; position: relative; float: left; margin: 5% 0 4% 0; height: 28px; color: dimgray; padding-left: 7%; font-size: 1em;}
.notanum option{color: dimgray;}
.sino {width: 5%; position: relative; float: left;}
.enviar-formu {position: relative; float: right; font-family: 'Open Sans'; color: dimgray; font-size: 0.9em; background-color: white;border-radius: 1em; overflow: hidden; width: 20%; height: 39px;margin:3% 15% 0 0; }


/*EN VIVO*/
.envivo{width: 100%; position: relative; float: left; height: 416px;}
.envivo iframe{height: 416px; width: 100%;}
.comentarios-vivo{width: 100%; min-height: 200px; position: relative; float: left; margin-top: 5%;}
.foto-vivo{position: relative; float: left; margin-left: 1%; width: 12%; border-radius: 1em;}
.coment-vivo{position: relative; float: left; width: 84%; min-height: 50px; margin-left: 3%; margin-top: 1%;}
.coment-vivo form textarea{font-family: 'Open Sans'; color: dimgray;  padding: 2%; box-sizing: border-box; width: 100%; height: 70px;}
.otros-coment{position: relative; float: left; width: 99%; min-height: 100px; margin-top: 5%;}
.foto-vivo2{position: relative; float: left; margin-left: 1%; width: 11%; border-radius: 1em; margin-bottom: 2%;}
.nomb-vivo{color: #FE6310; font-family: 'Open Sans'; font-size: 1em;margin-top: 1%; width: 84%; position: relative; float: right;}
.texto-vivo{position: relative; float: right; font-family: 'Open Sans'; font-size: 0.9em; margin: 1% 0; width: 84%;}
.interactuar{width: 50%; position: relative; float: left; margin-left: 4%; margin-top: 2%;}
.opcion{color: dimgray; font-size: 0.8em; width: 22%;}
.opcion:hover{text-decoration: underline; color: #00A0C6;}

.adelanto{width: 92%; position: relative; float: right; min-height: 100px;}
.h2aside{font-size: 1em; color: dimgray;}
.proximos{width: 100%; position: relative; float: left; min-height: 100px; margin-top: 2%;}
.proximos img{width: 100%; position: relative; float: left;}
.h4vivo{font-size: 1em; font-weight: bold; font-style: italic; background-color: #FE6310; color: #fff; padding: 1% 2%; margin-bottom: 1%;}
.proximos div{border: 1px solid #ccc; padding: 4% 3%; box-sizing: border-box; position: relative; float: left; margin-bottom: 2%;}
.proximos div p{font-size: 0.8em; color: dimgray; font-family: 'Open Sans'; width: 100%; position: relative; float: left; margin-top: 3%;}
.mas-mas{background-color: #FE6310; color: #fff; border-radius: 6em; padding: 2% 6%;}
.mas-texto{color: #FE6310; width: 80%; font-size: 1em; margin-top: 7%; }
.mas-texto:hover{text-decoration: underline;}




/*MENSAJE ENVIADO*/
.enviado{position: relative; float: left; width:71%; border-left: solid 1px #ddd;padding-left: 3%; margin-top: 3%;}
.haenviado {font-family: 'Bitter'; font-style: italic; font-weight: bold; font-size: 1.5em; background-color: #50A334;padding: 2% 5.25%; border-radius: 20px; color: #fff; width: 92%;}
.enviado img {position: relative; float: right; width:100%;}
.segui-viendo {position: relative; float: left; margin-top: 5%;}









/*FOOTER*/
footer{width: 100%; min-height:220px; background-image: url(imagenes/fondo-footer.png); background-repeat: no-repeat; position: relative; float: left; box-sizing: border-box; padding: 1% 1% 2% 1%; margin-top: 10%;}
.logopie{position: relative; float: left; margin: 8% 0 0 3%; width: 12%;}
.contactopie img {width: 30%;}
.footer-fila1 {width: 100%; height: 25px;}
/*Navegacion Pie*/
.contenido-footer {position: relative; float: left; width: 86%;}
.navpie {position: relative; float: left; width: 85%; margin: 8% 0 0 0;}
.navpie nav ul {list-style-type: none;}
.navpie nav ul li {display: inline;}
.navpie nav ul li a {font-family: 'Open Sans'; font-weight: bold;padding: 0% 2.5%; border-right-color: white; border-right-style: solid; border-right-width: thin; font-size: 0.75em}
.contactopie{position: relative; float: right; width: 14%; margin-top: 2.5%;}
.legalpie {width: 80%; margin: 5% 0 0 3%; position: relative; float: left; }
.legalpie p {color: #fff; font-size: 0.7em;line-height: 1.5em; text-align: center;}







/* RESPONSIVE */ 
  
@media screen and (max-width:950px){
    *{transition:0.5s}
    .encuestaforo{width: 60%;}
    .evento a img{height: 50px;}
    .textoevento1{font-size: 0.7em; margin: 5% 0 0 5%;}
    .text-content p {margin: 14% 15%;}
     .contactopie {display: none;}
    .contenido-footer {width: 100%;}
     .datos-perfil {display: none;}
    .perfil {width: 20%;}
    .miperfil {width:  88%;}
    .img-perfil{display: none;}
    .nombre-perfil {width: 100%; margin-bottom: 8%;}
    .p-evento-dest {font-size: 0.9em;}
    
    .titulo-hoy{font-size: 1em;}
    
    
    
}
        



@media screen and (max-width:880px){
    .foro-home {width: 100%; height: auto; border: 0;}
    .tit-noticias {margin: 0%;}   
    .noti-home {width: 100%; float: left; height: auto; border: 0; }  
    .noticias-home {width: 98%;}
    .noticias-home ul li {width: 33%; position: relative;}
    .h3celeste {font-size: 0.9em;}
    .sumate-foro {height: 39%;} 
    .col3 {width:  13%;}
    .ingresar {position: relative; float: left; margin: 15% 0 0 0; }
    .en-vivo {padding: 0; height: 26px; font-size: 1em; border-radius: 1em; margin-top: 9%;}
    .text-rincon {width: 100%}
    .agenda {margin-top: 5%;}
    .textoevento1 {font-size: 0.65em}
    .eventos {display: none;}
     .pag-noticias {width: 100%;}
    .perfil {display: none;}
    
    .noti-home {width: 100%; float: left; height: auto; border: 0; min-height: 170px;} 
    .fila3{position: relative; float: left; margin-top: 5%;}
    
    
    .nav-dias-nar ul li{margin-top: 3%}
    .nav-dias-nar{font-size: 0.9em; float: right; margin-right: 3%;}
    .extra-horarios{width: 70%;}
    .compartirlink-horarios{width: 100%;}
    .compartir{width: 54%; margin: 4% 2% 0 0;}
    .redes{width: 44%;}
    .col-info-horario{min-height: 175px;}
    .h3dias{font-size: 0.9em; margin-left: 7%;}
    .h2dias{margin-left: 8%;}
    .text-content p {font-size: 0.95em;}
    .h2naranja{width: 8%;}
  
    .envivo iframe{height: 382px;}
    .envivo{height: 382px;}
    
    
}

@media screen and (max-width:820px){
  
    .logo {position: relative; float: left; margin: 4% 3% 2% 0; }
     header nav ul li a p {text-align: center;}
    .col3 {position: relative; float: left; width:17%; }
    .col4 {display: none}
    .imagentini {width:  77%;}
    .img-tini{bottom: 80px; left: 0;}
    .extras-index{float: right;}
    .costo-index {width:  65%;}
    .tarifa-event {margin: 0; width: 40%;}
    .asistire-boton {width: 25%; margin-top: 2%;}
    .compartirlink {margin-top: 3%; width: 27%;}
    .noticias-home {margin-left: 2%;}
    .num-noti {width: 30%; }
    .noti-content {width: 90%;}
    .fila1 {width: 100%;}
    .fila1 {width: 100%;}
    .navpie nav ul li {font-size: 0.95em;}
    
    .tarifa-event {width: 70%;}
    .asistire-boton {width: 30%;}
    .titulo-hoy {font-size: 0.9em;}
    .legalpie p{text-align: left;}
    
    .titulo-evento-grande {font-size: 1.6em;}
    .p-fecha-dest {font-size: 1em;}
    .p-evento-dest {font-size: 0.8em;}
    
    /*rincones*/ 
     .text-content p {font-size: 1em;}
    
    
  .ingresa-const{width: 40%;}
    .enviado{width: 99%; padding: 0;}
    .enviado img{float: left;}
    .haenviado{max-width: 100%; box-sizing: border-box; position: relative; float: left; padding: 2% 0 2% 4%; font-size: 1.35em;}
    .upsi{font-size: 1.25em;}
    .checkprog{width: 50%;}
    .notaprog{margin-right: 12%;}
    .section100{min-height: 520px;}
    .programas ul li{min-height: 200px;}
    .text-content p{margin: 14% 10%; width: 80%;}
    .listado-fechas-agenda ul li{margin-left: 0; font-size: 1em;}
    .h4cap{font-size: 0.9em;}
  
    .col-info-horario{min-height: 173px;}
    .texto-capitulo{line-height: 1.4em;}
    .video-bandas{height: 330px;}
    .borde-manchas{left: -27px;}
    .dias-horario{height: 118px; padding-bottom: 1%;}
    .eventos-prog {display: none;}
    .text-content-historias p {font-size: 0.9em;}  
}



@media screen and (max-width:760px){
    .nav-dias-nar{margin-left: 1%; width: 86%;}
    .nav-dias-nar ul li{margin-left: 0; width: 14%;}
    .nav-dias-nar ul li a{padding: 10%;}
    .dia-seleccionado{padding: 10%;}
    .horario-cap{padding-left: 0;}
    .col-info-horario{min-height: 211px;}
    .h3dias{font-size: 0.8em; margin-top: 4%;}
.text-content p {font-size: 0.7em;} 
.envivo iframe{height: 360px;}
    .envivo{height: 360px;}
    .interactuar{width:  84%; float: right;}
    .text-content-historias p {font-size: 0.9em;}
    .programasvistos{margin-top: 30%;}
}



@media screen and (max-width:740px){
    .historias {width: 100%}
    .aside-imagenes {width: 100%;}
    .aside-imagenes ul li {width: 30%;}
    .subi-tufoto {width: 50%; margin: 3% 0 0 26%;}
    
 .logopìe {margin-top: 15%}
    .navpie {width: 16%; margin-left: 6%;}
    .navpie nav ul li {display: list-item; font-size: 0.95em;}
    .navpie nav ul li a{border: 0;}
    .legalpie {margin: 10% 0 0 4%; width: 56%;}
    
    .text-content-historias p {font-size: 1em;}
    
    
    
}


@media screen and (max-width:700px){
  
    .logo {position: relative; float: left; margin: 5% 0% 0% 20%; width: 60%;}
    header {height: auto; margin-bottom: 8%; }
    header nav {position: relative; float: left; width: 72%; margin: 2% 2% 0 0;}
    header nav ul li a p {text-align: center;}
    .col3 {position: relative; float: left; width: 18%}
    .ingresar {margin: 0;}
    .col4 {display: none}
    section {width: 100%;}
    aside {display: none}
    .slidevideos {width: 100%; margin: 2% 0 0 2%;}
    .programasvistos {margin: 25% 0 0 0; height: 250px; }
    .video1 {width: 28%; height: 100px; margin: 0 2% 0 2%;}
    .sumate-foro {height: 56%;}
    .noti-content{width: 100%}
    .textonoticia-home {display: none;}
    .img-tini {display: none;}
    .imagentini {display: none;}
    .destacado-agenda {width: 48%; border: none; margin: 3%;}
    .subinfo {width: 100%; padding: 2% 0 1% 2%;}
    .col-otroseventos {width: 42%; margin-top: 2%;}
    .textoagenda {width: 100%; margin: 4% 0 0 0;}
    .vertodas {width: 15%; }
    .tit-otros {font-size: 1em;}
    .fila2 {height: 265px;}
    .text-content-historias p {font-size: 1em;}  
    
     .fila2 {min-height: 265px; margin-bottom: 4%;}
    .noticias-home ul li{padding-right: 2%;  box-sizing: border-box;}
    .costo-index{width: 100%;}
    
    /*noticias*/
    .bajadanoti-dest {font-size: 1em;}
    .p-noti-dest {font-size: 0.7em;}
    .extras-notigrande {width: 45%;}
    
    /*rincones*/
    .subi-tufoto {font-size: 1.1em;}
  
    .fotos2{padding-left: 2%; box-sizing: border-box;}
    .individual{max-width: 26%; margin: 2% 3%; padding: 0;}
    .infonos{max-width: 65%;}
    .datos-nosotros{max-width: 32%;}
    section{width: 100%;}
    .redes-sol{float: left;}
    .ingresa-const{width: 50%; padding-top: 2.5%;}
    .upsi{width: 98%; margin: 3% 2%; font-size: 1.25em;}
    .construccion{background-size: 770px 660px; min-height: 660px;}
    .text-ing{font-size: 0.9em;}
    .notaprog{margin-right: 10%;}
    .checkprog{width: 56%;}
    .notanum{margin-bottom: 5%; padding-left: 0; font-size: 0.8em; width: 60%;}
    .sino{width: 8%;}
    #sectionfav{padding: 0;}
    .programas ul li{margin: 2% 5% 0% 5%; min-height: 220px;}
    .text-content p{margin: 16% 10%; font-size: 1em;}
   
    .nav-dias-nar{margin-left: 0; width: 88%;}
    .nav-dias-nar ul li{margin-top: 2.3%; width: 13%; margin-left: 1%;}
    .h2naranja{margin-top: 2.5%; margin-left: 1%; }
    .cap-horario{margin: 2% 2% 2% 1%;}
    .horario-cap{padding-left: 4%;}
    .col-info-horario{min-height: 185px;}
    .video-bandas{height: 380px;}
    .bandas{margin-left: 1.5%;}
    .h2gris{margin-left: 2%;}
    .internaprog{margin-left: 4%;}
     .envivo iframe{height: 430px;}
    .envivo{height: 430px;}
    
    


    
}



@media screen and (max-width:610px){
    
    .checkprog{width: 60%;}
    .programas ul li{margin: 2% 5% 1% 5%;min-height: 195px;}
    .text-content p{margin: 15% 10%; font-size: 0.95em;}
    .logopie {margin-top: 13%;}
    .col1-infogrande {margin: 0;}
    .compartirlink {width: 33%}
    .p-noti-dest {font-size: 0.7em; width: 100%;}
    .imagenbondi {width: 42%;}
    .col1-infogrande {width: 55%;}
    .compartirlink {width: 35%;}
    
     .col-otroseventos{width: 44%;}
    .extras-index{display: none;}
     
    
    .cap-horario{max-width: 45%; margin: 2% 3% 0 2%;}
    .col-info-horario{min-height: 180px;}
    .video-bandas{height: 335px;}
    .envivo iframe{height:380px;}
    .envivo{height: 380px;}
    .text-content-historias p {font-size: 0.9em;}
    
    
    
    .h2dias{margin-left: 25%; font-size: 1.2em; margin-top: 4%;}
    .h3dias{margin-left: 25%; font-weight: bold;}
    .col2-coment-bandas{width: 100%; margin-top: 2%;}
    .dias-horario{width: 96%; margin: 3% 2%; height: 95px;}
}





  
@media screen and (max-width:565px){
    
    .tit-historia {margin-top: 6%;}

}


@media screen and (max-width:540px){
    header nav {position: relative; float: left; width: 100%; margin: 2% 2% 0 0;}
    .col3 {width: 100%;}
    .ingresar {width: 30%;}
    .en-vivo {width: 46%; margin: 0;}
    .col-otroseventos {float: left; width: 44%; margin: 0;}
     .col1-sumate {width: 100%; height: auto;margin-top: 3%; }
    #listadoforo {width: 100%; margin: 0;}
    .sumate-foro {width: 68%; height: 63px}
    .sumate-boton {width: 30%; margin: 19px 0 8% 0;}
    .tit-noticias {margin:  6% 0 0 0;}
    
    .titulorincones {margin: 0;}
    .text-content-historias {display: none;}
    .texto-escondido {display: block;}
   
    .bajadanoti-dest {display: none}
    .extras-notigrande {width: 50%;}
    .titulo-noticia-grande {font-size: 1.8em}
    
    .tarifa-event {width: 100%; margin-bottom: 6%;}
    .asistire-boton {width: 100%;}
     .legalpie {width: 50%;}
    
    .titulo-evento-grande {font-size: 1.4em;}
    .p-fecha-dest {font-size: 0.9em;}
    .p-evento-dest {font-size: 0.7em;}
    .info-evento-grande {margin-top: 26.5%;}
    
    
    .agenda{margin-top: 0;}
    .fila2{margin-top: 5%;}
    .tarifa-event{width: 60%;}
    .tarifa-event img{display: none;}
    .aprovecha-event{font-size: 1em;}
    .aprovecha-event2{font-size: 0.9em;}
    .asistire-boton{width: 40%;}
    .programasvistos{margin-top: 26%;}
   
   
    
    .mapa{display: none;}
    .infonos{max-width: 100%;}
    .datos-nosotros{display: none;}
    .logopie{margin: 10% 0 0 0; width: 20%; padding-left: 1%;}
    .sole{width: 30%}
    .infoderecha{width: 62%}
    .construccion{background-size: 575px 560px; min-height: 536px;}
    .ingresa-const{width: 65%}
    .upsi{font-size: 1.05em;}
    .segui-viendo{display: none;}
    .contacto-col1{width: 100%; margin: 0; padding: 2% 0 0 4%; box-sizing: border-box;}
    .puntuacion{width: 100%; box-sizing: border-box; padding: 4% 2% 0 5%;}
    .label{font-size: 1em;}
    .checkprog{width: 50%;}
    .notanum{margin-bottom: 10%;}
    .notaprog{margin-right: 20%;}
    #listadoprog{margin-top: 11.9%;}
    .enviar-formu{width: 60%; margin: 6% 21% 5% 0;}
    .programas ul li{width: 45%; margin: 2% 2% 1% 3%;}
    /*VICKY*/
    .nav-dias-nar{width: 87%; font-size: 0.8em; margin-left: 2%; height: 40px;}
    .h2naranja{margin-left: 0;}
    .nav-dias-nar ul li{width: 14%; margin-left: 0;}
    .video-bandas{margin: 3%; width: 94%; height: 300px;}
    .enviar-coment{width: 25%;}
     .envivo iframe{height:329px;}
    .envivo{height: 329px;}
    .comentarios-vivo{width: 95%; margin-left: 2%;}
}






@media screen and (max-width:500px){
    .sumate-foro {width: 100%;}
    .sumate-boton {width: 100%; margin-bottom: 2%;}
    .text-sumate {font-size: 1em; line-height: 1.5em; width: 96%;}
    .foro-home {height: auto;}
    .noticias-home ul li {width: 100%;}
    .noti-home {height: 234px; }
    .num-noti {width: 13%;}
    .noti-content {width: 82%;}
    .destacado-agenda {width: 92%; height: 170px;}
    .col-otroseventos {width: 98%; height: 270px;}
    
    .seccion {font-size: 0.95em;}
    .seccion1 {font-size: 0.95em;}
    .compartirlink {width: 40%;}
    .titulo-noticia-grande {font-size: 1.5em}
    
    .h1celeste {font-size: 1.6em;}
    .p-evento-dest {display: none;}
    .info-evento-grande {margin-top: 30.5%;}
    
    
    .fila3{display: none;}
    .asistire-boton{width: 54%;}
    .tarifa-event{width: 45%;}
    .col-otroseventos{display: none;}
    .text-agenda-home{font-size: 0.9em;}
    
}

    
    
 
@media screen and (max-width:465px){
  .construccion{background-position: -50px;}
    .ingresa-const{width: 80%;}
    .individual{min-height: 210px;}
    .logopie {display: none;}
    .infoderecha{width: 100%;}
    .sole{width: 45%;}
    .enviado{margin-top: 5%;}
    .haenviado{font-size: 1.05em;}
    .upsi{font-size: 0.9em;}
    .info-ubic{font-size: 0.8em;}
    .text-content{min-height: 110px;}
    .text-content p{margin: 0; font-size: 0.9em; padding: 13% 2%; box-sizing: border-box; width: 100%;}
    .navprog ul li{font-size: 0.85em; }
  
    .h2naranja{margin-left: 2%; font-size: 1.2em;}
    .nav-dias-nar{width: 100%; margin:2% 0;}
    .cap-horario{margin-bottom: 2%;}
    .masvistos-bandas{display: none;}
    .interna-prog{font-size: 0.8em;}
    .video-bandas{height: 270px; width: 96%; margin: 2%;}
    .comentarios-bandas{width: 96%; margin: 0 2%;}
     .envivo iframe{height:280px;}
    .envivo{height: 280px;}
    .h2gris{font-size: 1em;}
    .nomb-vivo{font-size: 0.9em;}
    .texto-vivo{font-size: 0.8em;}
    
    
    
    .seccion {font-size: 0.9em;}
    .seccion1 {font-size: 0.9em;}
    .compartirlink {width: 45%;}
    .p_bajada_notilist {font-size: 0.8em;}
    
    .titulo-evento-grande {width: 64%;}
    
    .pwhite {font-size: 0.8em;}
    
    .contenido-footer {margin-top: 5%;}
    .logopie {display: none;}
    .legalpie {margin-left: 13%;}
    
    .programasvistos{display: none;}
    .foto-home{min-height: 200px;}
    
}


@media screen and (max-width:430px){
    .texto-coment {width: 80%}
    .comentarios-lola {width: 92%}
    .h1celeste {font-size: 1.2em;}
    .programas ul li{min-height: 160px;}
    
    
}

 @media screen and (max-width:400px){
    .programas ul li{width: 65%; margin: 3% 18%; min-height: 155px;}
    .text-content p{padding: 16% 8%;}
    .seccion {padding: 4px;}
     .seccion:hover {padding: 4px;}
    .seccion1 {padding: 4px;}

     .imagenbondi {width: 100%; float: left;}
     .col1-infogrande {display: none;}
     .info-noticia-grande {width: 100%}     
     .compartirlink {width: 55%;}
     .legalpie {width: 60%;}
     .accordion .link {font-size: 0.8em; padding: 15px 12px 15px 6px;}
     
    
    .cap-horario{max-width: 90%; margin-left: 5%; margin-top: 4%;}
    .horario-cap{font-size: 1.2em; padding-top: 1%;}
    .tit-capitulo{font-size: 1em;}
    .texto-capitulo{font-size: 0.9em;}
    .info-destacado-capitulo{margin-left: 2%; font-size: 0.9em; margin-bottom: 6%;}
    .extras-horarios{width: 50%;}
    .col-info-horario{min-height: 160px; width: 100%; padding: 2%;}
    .nav-dias-nar{height: 65px;}
    .nav-dias-nar ul li{width: 20%; margin-bottom: 1%;}
    .img-cap-horario{width: 100%;}
    .h2naranja{font-size: 1.5em; margin-bottom: 2%; width: 100%;}

    .col2-coment-bandas{width: 100%; margin-top: 2%;}
    
    
    .video-bandas{height: 240px;}
    .envivo iframe{height:220px;}
    .envivo{height: 220px;}
    .opcion{width: 30%;}
     
}
    



@media screen and (max-width:340px){
    .individual{max-width: 42%; min-height: 210px;}
    .construccion{background-position: -85px;}
    .ups{1.3em;}
    .notaprog{margin-right: 10%;}
    .checkprog{width: 55%;}
    #listadoprog{margin-top: 13.3%;}
    .programas ul li{width: 80%; margin: 3% 10%;}
    .text-content p{padding: 16% 9%;}
    
    .seccion1 {font-size: 0.7em;}
    .seccion {font-size: 0.7em;}
    
    .compartirlink {width: 60%;}
    
    .texto-coment {width: 78%;}
    .opcion{width: 38%;}
    .envivo iframe{height: 200px;}
    
       .costo-index{display: none;}
    header nav > ul li a{padding: 15px;}
    
    
}
    
@media screen and (max-width:320px){
    
    .pwhite {font-size: 0.75em}
    .compartirlink {width: 60%;}
    
    }