@charset "utf-8";

/*MAX 768*/

	@media screen and (max-width: 768px){  /*responsive web design, esto es adaptacion de pag web a mobile*/


main{
	max-width: 768px;
	padding-left: 1em;
	padding-right: 1em;
}
    }

/*FIN responsive web design*/

body{
	font-family: "Titillium Web", sans-serif;
	font-size: 16px; 
    margin: 0;
}

/*ENCABEZADO*/
header{
	padding: 1em 0;
    height: 11em; 
    background-image:url(imagenes/fondoheader.jpg); 
}

header img{
    float: left;
    overflow: auto;
    margin-top: 2%;
}

.busqueda{
    float: right;
    margin-top: 2%;
}

.busqueda input, .formulario textarea{
	background: #ddd;
	border-radius: 2px;
	border: 1px solid black;
	padding: .4em .4em;
}

.busqueda textarea{
	height: 10em;
	resize: none; /*no permite que se redimensione la caja de comentario*/
}

.busqueda input[type="submit"]{
	background: #0A56A4;
	box-shadow: 0 0 10px rgba(0,0,0,0.4);
	color: white;
	font-size: 0.8em;
	padding: 0.4em 1em;
	text-align: center;
	width: auto;
}

/*Estructura del sitio*/
.contenedor{
    max-width: 960px; 
	margin: 0 auto;
}

main{
    max-width: 960px;
    height: auto;
	margin: 0 auto;
    clear: both;
    /*background-color: gainsboro;*/
    display: block;
}

/*NAVEGACION*/
nav {
	background:#ff7f00;
	position:relative;
    font-weight: 600;
}

nav ul {
	list-style:none;
	padding:0;
	margin:0;
	overflow:hidden; /*el contenido que desborda del elemento queda escondido*/
    text-align: center;
}

nav > ul > li {
	float:left;
    width: 16.667%;
}

nav ul li a {
	text-decoration:none;
	color:#fff;
	display:block;
	padding:10px 20px;
}

nav ul li a:hover {
    background-color: #383838;
	color: #fff;
}

nav > ul > li:hover div {
	display:table;
}

nav ul li a.activo {  
	background: #0A56A4;	
}

nav ul li a.activo:after{
	content: '';
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -1em;
}

/*Submenu*/
nav ul li div {
	width:12em;
	position: absolute;
    left:50;
	background:#ddd;
	box-sizing:border-box;
	display:none; 
	/*display:table;*/
}

nav ul li div ul {
	width: 10%;
	display:table-cell;
	border-right:1px solid rgba(255,255,255,.5);
	box-sizing:border-box;
}

nav ul li div ul li:last-child {
	border:none;
    border-radius: 0 0px 10px 10px;
}
/*elige el ultimo li de ese ul*/

nav ul li div ul li:nth-child(2) {
	border:none;
}

nav ul li div ul li a {
	color:#000;
}

/*INICIO HOME*/

#home1{
    margin: 2em 0 0;
    height: auto;
}

#alaire{
    width: 60%;
    height: 22em;
    float: left;
    margin-bottom: 2em;
    border-top: 5px solid #F39322;
}

#proximo{
    width: 38%;
    height: 22em;
    float: right;
    border-bottom: 1px solid #F39322;
    border-top: 5px solid #F39322;
}

h1{
    font-family: 'Titillium Web', sans-serif;
    color: #F39322;
    margin-top: 1em;
    margin-bottom: 1em;
    padding: 0;
    float: left;
}
    
    
h2{
    font-family: 'Titillium Web', sans-serif;
    font-weight:600;
    color: #0A56A4;
    margin: 0;
    padding: 0;
    float: left;
}

h3{
    color: #0A56A4;
    margin: 0;
    padding: 0;
}

h4{
    color: #383838;
    margin: 0;
    padding: 0;
}

h5{
   font-family: 'Titillium Web', sans-serif;
   font-weight: 400;
   color: #F39322;  
   margin: 0 0 0.1em 0;
   padding: 0;
}

p{
    font-family: 'Titillium Web', sans-serif;
    font-weight:400;
    font-size: 0.9em;
    padding: 0 1em 0 0;
    margin: 3em 0 0.8em 0;
}

iframe{
    margin-top: 0.4em;
}

article{
    clear: both;
    margin-top: 1em;
    margin-bottom: 2em;
}

article p{
    padding: 0em 1em 0em 1em;
    text-align: justify;
}

.columna1{
    border-top: solid 5px #383838;
    width: 32%;
    height: 22em;
    float: left;
    margin: 0.4em 0.8em 1.2em 0;
}

.imgcolumna{
    margin-top: 0.4em;
    width: auto;
}

#home2{
    margin-bottom: 1.5em;
}

.columna1 p{
    font-size: 0.8em;
    margin-top: 0.4em;
}
 
/*FIN HOME*/


/*INICIO NOTICIAS*/

.columna2{
	border: 1px solid black;
    margin: 1em 0;
	padding: 1em;
	box-sizing:border-box;
	overflow: hidden;
}

.columna2 figure img{
    float: right;
}

.columna2:nth-child(odd) figure{  /*desde aca hasta .servicio:nth-child(even) .info alinea el texto al lado de la imagen, y en .servicios overflow:hidden, sino aparecen rayas*/
	/*impar*/
	float: left;
	margin: 0 1em 0 0;
}

.columna2:nth-child(odd) .info{
	float: right;
}

.columna2:nth-child(even) figure{
	/*par*/
	float: right;
	margin: 0 0 0 1em;
}

.columna2:nth-child(even) .info{
	float: left;
}

.columna2 .info{
	width: 55%;
    border-bottom: 1px solid #ff7f00;
}

#espacio{
    height: 1.2em;
}

.columna2:hover{
         background-color: #ddd;
}

.columna2 a {
    text-decoration: none;
    color: black;
}

.notas{
    font-family: 'Titillium Web', sans-serif;
    font-weight:400;
    font-size: 0.9em;
    height: auto;
    padding: 0;
    margin: 0;
}

#imgcontenedor{
    width: 60%;
    height: auto;
    width: 60%;
    float: left;
    margin-top: 0.5em;
}

.masnoticias{
    font-size: 0.8em;
    font-weight: 400;
    margin-left: 0.4em;
    margin-right: 0.4em;
}

.imgmasnoticias{
    margin-left: 0.5em;
}

#apartado{
    width: 32%;
    height: auto;
    float: right;
    background-color: white;
    margin-top: 3.2em;
    margin-bottom: 2em;
    margin-left: 0;
    margin-right: 0;
}

#opinion2{
    height: auto;
    margin-top: 2.5em;
    margin-bottom: 2em;
    margin-left: 0;
    margin-right: 0;
    border-bottom: 0.5px solid #F39322;
    border-top: 3px solid #F39322;
}

#opinion2 .tema2{
    width: auto;
    border-bottom: 1px solid #0A56A4;
}

#opinion2 .tema2 a{
    text-decoration: none;
}
    
#opinion2 .tema2:hover{
    background-color: #ddd;
    border-radius: 2px;
}

#opinion2 .sig_pag a{
    padding: 2em 2em;
    background: #eee;
    display: inline-block;
    color: #000;
    text-decoration: none;
}

#opinion2 .pag-num a{
    padding: 2em 2em;
    background: #eee;
    display: inline-block;
    color: #000;
    text-decoration: none;
}

.temaintro2{
    font-size: 0.8em;
    font-weight: 400;
    margin-top: 0.4em;
    color: #383838;
    text-decoration: none;
}

/*FIN NOTICIAS*/



/*INICIO CONTENIDOS*/

#contenido1{
    margin: 2em 0 0;
    height: auto;
}

#programa1{
    width: 65.2%;
    height: 32em;
    float: left;
    margin-left: 0.4em;
    margin-right: 0.2em;
    margin-bottom: 0.2em;
}

#programa1 img{
    margin-left: 0;
    border-top: 5px solid #383838;
    border-bottom: 5px solid #383838;
}

#programa1 .detalleprog{
    margin-left: 1em;
    margin-right: 1em;
    margin-top: 0.2em;
    border-bottom: 1px solid #F39322;
    border-top: 5px solid #F39322;
}

#programa1 .detalleprog p{
    font-weight:400;
    font-size: 0.8em;
    margin-top: 0;
}

.videoresponsive video {
    background-color: #383838;
}

#programa2{
    width: 32%;
    height: 32em;
    float: left;
    margin-left: 0.6em;
    margin-bottom: 0.2em;
}

.programa2 iframe{
    margin-bottom: 0.8em;
}

.videoside{
    margin-top: 1em;
    margin-left: 0.4em;
    margin-right: 0.2em;
    margin-bottom: 1.2em;
    border-bottom: 1px solid #F39322;
}

.ver {
    width: 100%;
    float: right;
    text-align: right;
    margin-top: -2em;
    margin-bottom: 1em;
}

.ver span{
    margin-right: 2em;
    padding-left: .5em;
    padding-right: .5em;
    background-color: #0A56A4;
}

.ver a{
    text-decoration: none;
    color: white;
}

/*FIN CONTENIDOS*/


/*INICIO -->PROGRAMAS<-- */
.titulo h2{
    width: 100%;
    float: left;
    border-bottom: 2px solid #F39322;
    margin-bottom: 0.4em;
}

.columna3 {
    border-top: solid 5px #383838;
    width: 18.6%;
    height: 14em;
    float: left;
    margin: 0.4em;
}

.columna3 a{
    text-decoration: none;
}

.columna3:hover {
    background-color: #ddd;
    border-radius: 2px;
}

.prog-det {
    height: 3.2em;
}
/*FIN -->PROGRAMAS<-- */

/*INICIO -->VIDEOS<-- */
.videolista {
    width: 100%;
    height: 16em;
    clear: both;
    background-color: #fff;
    margin-top: 0.8em;
    margin-bottom: 1.2em;
    border-radius: 2px;
    border-bottom: 1px solid #0A56A4;
}

.videolista:nth-child(2){
    background-color: #ddd;
}

.reproducir h4 {
    padding-top: 0.4em;
    padding-left: 0.4em;
}

.mirar {
    width: 32%;
    display: block;
    float: left;
    padding-left: 0.6em;
    padding-right: 0.2em;
}

.compartir {
    width: 75%;
    height: 1.4em;
    margin-top: -0.5em;
}

.compartir ul li {
    list-style: none;
    float: left;
    margin-left: .2em;
    margin-right: .2em;
}

.compartir  h5{
    float: left;
    margin-right: .4em;
    color: #383838;
    font-weight: 600;
}

/*FIN -->VIDEOS<-- */


/*INICIO PARTICIPA*/

#participar{
    width: 60%;
    height: auto;
    float: left;
    margin-top: 0.5em;
}
    
#opinion{
    height: 17.5em;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
    margin-left: 0;
    margin-right: 0;
    
    border-top: 5px solid #F39322;
    display: inline-block;
}

#opinion .tema{
    width: auto;
    border-bottom: 1px solid #0A56A4;
}

#opinion .tema a{
    text-decoration: none;
}
    
#opinion .tema:hover{
    background-color: #ddd;
    border-radius: 2px;
}

#paginas {
    margin-bottom: 0.5em;
    color: #0A56A4;
    text-decoration: none;
}

#paginas a{
    padding: .2em .2em;
    background: #eee;
    display: inline-block;
    color: #000;
    text-decoration: none;
}

.temaintro{
    font-size: 0.9em;
    font-weight: 400;
    margin-top: 0.4em;
    color: #383838;
}

.publicacion{
    font-size: 0.75em;
    font-weight: 400;
    font-style: italic;
    color: #F39322;
    margin-top: 0;
}

aside{
    width: 32%;
    height: auto;
    float: right;
    background-color: #ddd;
    margin-top: 3.2em;
    margin-bottom: 2em;
    margin-left: 0;
    margin-right: 0;
}

#encuestas h3{
    padding-left: 0.5em;
}

.cuestion{
    margin-left: 0.7em;
    margin-right: 0.7em;
    padding-bottom: 0.7em;
    border-bottom: 1px solid #0A56A4;
}

.cuestion input[type="submit"]{
	background: #0A56A4;
    margin-top: 1.4em;
    margin-bottom: 0.8em;
	box-shadow: 0 0 10px rgba(0,0,0,0.4);
	color: white;
	padding: 0.4em 2em;
}

#twitter h3{
    margin-top: 0.2em;
    padding-left: 0.5em;
}

#twitter span{
    padding-left: 0.6em;
    color: #5987B6;
    font-size: 0.88em;
}

/*FIN PARTICIPA*/


/*INICIO CONVENIO FADU*/

.pasador{
   width: 100%;
   height: 24em;
   margin-top: 2em;
   margin-bottom: 1em;  
   padding: 0;
}

.pasador .cycle-overlay{ /*es es para q se vea el rectangulo opaco con los nombramientos*/
	background: black;
	position: absolute;
	bottom: 0;
	color: white;
	width: 100%;
	z-index: 600; 
	padding: 1em;
	font-size: 0.9em;
	opacity: .5;

}

#convenio{
    max-width: 960px; 
	margin: auto;
    margin-top: 1.2em;
    margin-bottom: 0.5em;
}

#fotoconvenio{ 
    width: 60%;
    height: 25em;
    float: left;
    margin-bottom: 2em;
}

#infoconvenio{
    width: 36%;
    height: 25em;
    float: right;
    border-top: 5px solid #F39322;
    background-color: #ddd;
    margin-bottom: 2em;
    
    }

#infoconvenio h2{
    padding-left: 0.5em;
    }

#infoconvenio p{
    padding-left: 0.5em;
    }


#infoconvenio h3{
    margin-bottom: -2em;
    padding-left: 0.5em;
}

#infoconvenio .destacado{
    color: #0A56A4;
}
    
#opinionpie{
    height: auto;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0.5em;
    border-top: 5px solid #F39322;
    
}

#opinionpie .temas{
    width: auto;
    height: auto;
    border-bottom: 1px solid #0A56A4;
}

.leermas{
    font-size: 0.9em;
    font-weight: 400;
    margin-top: 0.4em;
    color: #F39322;
    
}

.temas p{
    margin: 0.2em 0 0.8em 0;
}

.bajadaconvocatorias{
    font-size: 0.9em;
    font-weight: 400;
    margin-top: 0.4em;
    color: #F39322;
}

/*FIN CONVENIO FADU*/


/*INICIO CONTACTO*/

.columna{
	width: 50%;
	padding: 0 .625em;
	box-sizing:border-box;
    margin-top: 1.4em;
}

.columna.left{
    float: left;
	border-left: 1px solid #ddd;
    margin-bottom: 0.4em;
}

.columna.right{
    float: right;
	border-left: 1px solid #ddd;
}

.columna.right p{
	font-size: 0.8em;
}

.columna.right ul li{
	font-size: 0.8em;
    list-style: none;
}

.columna.right ul li a{
	color: #383838;
}

.formulario p{
    margin-top: 0.2em;
}

.formulario label{
	display: inline-block;
	vertical-align: top; /*sube la palabra comentario en la parte sup de las cajitas*/
	width: 16%;
}

.formulario input, .formulario textarea{
	background: #ddd;
	border-radius: 2px;
	border: 1px solid black;
	font-size: .8em;
	padding: .4em .6em;
	width: 80%;
}

.formulario textarea{
	height: 10em;
	resize: none; /*con este atributo no permite q se redimensione la caja de comentario*/
}

.formulario input[type="submit"]{
	background: #0A56A4;
	box-shadow: 0 0 10px rgba(0,0,0,0.4);
	color: white;
	font-size: 1em;
	padding: 0.4em 2em;
	text-align: center;
	width: auto; /*mata lo que escribimos en la linea 326, esto es widht:80%*/
}

.formulario .acciones{
	text-align: left; /*es el class p modificar solo el boton enviar, si lo quiero centrar o iz o der*/
}

/*FIN CONTACTO*/


/*FOOTER*/

footer{
	background: #383838;
	clear: both;
	color: white; 
	padding: 0.1em 0;
	margin-top: 2em;
}

#fondo1{
    background-color: #383838;
    clear: both;
    height: 10em;
}

#footernav{
    float: left;
    width: auto;
    margin-top: 1em;
    margin-left: 2em;
}

#footernav ul{
    list-style: none;
    margin-top: 0;
}

#footernav ul li{
    float:left;
    padding-left: 0.4em;
    padding-right: 0.4em;
    border-right: 1px solid #ddd;
    border-bottom-style: 
}

#footernav ul li:last-child{
    border: none;
}

#footernav ul li a{
    text-decoration: none;
    color: white;
}

#footernav ul li a:hover{
    color: #F39322;
}

.sociales{
    margin-top: 1em;
    margin-right: 2em;
    width: auto;
    float: right;
}

.sociales h4{
    color: #ddd;
    margin-bottom: 0.4em;
    font-weight: 600;
}

.sociales .icono{
    margin-right: 0.8em;
    width: 34px;
}

#fondo2{
    background-color: #F39322;
    clear: both;
    height: 2em;
    margin: 0;
}

#fondo2 p{
    padding-top: 0.2em;
    text-align: center;
    vertical-align: bottom;
    color: #f0f0f0;
    font-size: 0.88em;
}

#fondo3{
    background-color: #E2801E;
    clear: both;
    height: 5em;
}

#fondo3 p{
    color: white;
	font-size: 0.75em;
	font-style: italic;
    font-weight: 200;
	text-align: center;
    vertical-align: bottom;
    margin-top: 0;
    margin-left: 4em;
    margin-right: 4em;
    padding-top: 1.2em;
    padding-left: 5em;
    padding-right: 5em;
}