@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Roboto:400,700|Oswald);

.ocultar, .ocultarcel {display: none;}

*{
    margin:0;
    padding:0;
    
}

.wrapper {
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    position: relative;
}

h5{
    color: #79758F;
}
body {
    background:#FFFFFA;
    font-family:"roboto";
    max-width: 1000px;   
    margin: auto;
    font-family: Roboto;
    width: 100%;

}

header {
    width: 100%;
    background-image: url(../imagenes/header.png);
    
}

.redes {
    width: 120px;
    height: 100%;
    float: left;
    position: relative;
    margin-top:1em;
    margin-left:2em;
}

.redesbotones li {

    list-style: none;
}


.redesbotones li a {
    text-decoration: none;
    color: #ffffff;
    font-size: 20px;
    }

.redesbotones li a:hover {
    text-decoration: none;
    color: #1BBE9E;
    font-size: 15px;     
    }


.login {
    width: 120px;
    height: 100%;
    float: right;
    position: relative;
    margin-top: -7em;
}

.logo {
    margin-left: 43%;
    padding-top: 1em;
}

.botoneralogin {
    width: 100%;
    height: auto;
    position: relative;
    float: left;
    list-style: none; 
}

.botoneralogin li {
    text-decoration: none;
    width: 100%;
    height: 20px;
    list-style: none;
    margin-top: 5px;
}

.botoneralogin li a{
    color:#A4E5D8;
    text-decoration: none;
   padding: 0.3em;
}

.botoneralogin li a:hover{
    color:#F29100;
    text-decoration:none;
   padding: 0.3em;
}

header nav {
    width:100%;
    max-width:1000px;
    margin:20px auto;
    background: #201944;
}

.menu_bar {
    display:none;
}

header nav ul {
    overflow:hidden;
    list-style: none;
     margin-left:9.5em;
}

header nav ul li {
    float:left;
}

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

.ahora li a{
    color:#F29100;
}

header nav ul li span {
    margin-right: 10px;
}

header nav ul li a:hover {
    background: #F29100;
}

/*VIDEO*/

/*#videoajuste{
    width: 100%;
    margin: 0 auto;
    margin-bottom:1em;
    float: left;
    max-height: 200px;
    min-height: 280px;
    padding-bottom: 2em;
    background-color: black;
    overflow: hidden;
}*/

#nota-ppal{
    width: 100%;
    margin: 0 auto;
    margin-bottom: 1em;
    float: left;
    height: 312px;
    min-height: 215px;
    padding-bottom: 0;
    background-color: black;
    
}

/*#video #player {
    height: 330px;
    width: 100%;
}*/

/*#video{
    float: left;
    width: 60%;
}*/

#video{
    position: absolute;
    float: left;
    padding-bottom: 31.2%; /*56.25%;*/
    width: 60%; 
    height: 0;
    
}

#video iframe{
    position: absolute;
    height: 100%;
    width: 100%;
    top:0px;
    left: 0px;
    float: left;
    
}

.infospot{
    clear: both;
    width: 36.8%;
    height: 150px;
    color: #A4E5D8;
    float: right;
    padding: 2em 1em 0em 1em;
}

.infospot h5{
    color:#F29100;
    font-size: 0.8em;
}




main {
    float: left;
    width: 100%;
    /*background-color: white;*/
}

.medio {
    width: 100%;
    float: left;
}


/*NOTAS SECUNDARIAS*/

main .medio .nsec{
    width: 63.5%; 
    height: /*550px*/;
    float: left;
}

#noticias-sec{
    width: 100%;
    float: left;
}

.noticiasec1 {
    background-image: url(../imagenes/nota1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
    width: 49%;
    padding-bottom: 52%;
    float: left;
    height: 0;/
}

.noticiasec1:hover {
    background-image: url(../imagenes/nota1_bajada.png);
}

.noticiasec2 {
    background-image: url(../imagenes/nota2.png);
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
    width: 49%;
    padding-bottom: 52%;
    float: right;
    height: 0;
    margin-left: 2%;
}

.noticiasec2:hover{
    background-image: url(../imagenes/nota2_bajada.png);
}

.noticiasec1 a {
text-decoration: none;
}

.noticiasec1 a .ver {
width: 55px;
background-color: #F29100;
float: right;
margin: 1em;
}

.noticiasec2 a {
text-decoration: none;
}

.noticiasec2 a .ver {
width: 55px;
background-color: #F29100;
float: right;
margin: 1em;
}

.epigrafe{
    display: none;
}

/*NOTAS CORTAS*/
.cortas {
    width: 100%;
    padding: 1em 0em 1em 0em;
    float: left;
    margin-top: /*-1.4em*/;
}

.notacorta:first-child{
    margin-left: 0%;
}

.notacorta{
    width: 32%;
    height: 250px;
    position: relative;
    float: left;
    margin-left:2%;
}


.notacorta h1 {
font-size: 1.3em;
font-family: "Roboto";
line-height: 1em;
color: #1BBE9E;
margin-top: 8px;
}

.notacorta h2{
width: 80px;
color: #201944;
font-size: 10pt;
font-family: "roboto";
border: 1px solid #201944;
padding-left: 6px;
padding-right: 4px;
padding-top: 2px;
padding-bottom: 2px;
}

.notacorta p{
color:#201944;
font-family: "Roboto";
font-weight: 500;
line-height: 0.9em;
}

.notacorta h6 {
color: #1BBE9E;
margin-top: 5px;
}

.ver{
font-size: 8.5pt;
font-family: "Roboto";
background: #1BBE9E;
width:70px;
padding-left: 20px;
padding-top: 5px;
padding-bottom: 5px;
margin-top: 5px;
text-decoration: none;
}

.notacorta a {
text-decoration: none;
}

a .ver {
color:#FFFFFF;
}


/*SUBI TU NOTICIA*/

aside {
    width: 30%;
    float: right;
    background-color: #A4E5D8;
    padding: 1em;
    color: #201944;
    margin-left: 0.5em;
    padding-bottom: 3em;
    height: auto;
}

aside h1 {
text-align: center;
margin-bottom: 5px;
font-size: 34px;
color: #201944;
}

aside h3 {
color: white;
}

.botonregistrar {
font-family: "Roboto";
/*background: white; */
border: 4px solid white;
width: auto;
height: auto;
position: relative;
padding: 5px;
margin-top: 20px;
color: white;
text-decoration: none;
}

.botonregistrar:hover{
color: #201944;
background-color: white;
}

a .botonregistrar {
font-size: 1.1em;
text-align: center;
padding: 0.5em 0;
text-decoration: none;
font-weight: bold;
}

aside a {
text-decoration: none;
}

.asidebotonera {
margin-top: 50px;
}

.botonstaff {
    font-size: 15px;
    font-family: "Roboto";
    background: #1BBE9E;
    width:auto;
    padding-left: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 5px;
    margin-bottom: 30px;
    text-decoration: none;
    text-align: center;
}

.botonstaff:hover{
border: 3px solid #1BBE9E;
background-color: transparent;
}

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

.naranja{
    background: #F29100;
}

.azul{
    background: #201944;
}

.botonagenda:hover{
border: 3px solid #F29100;
background-color: transparent;
}

.botonemisiones:hover{
border: 3px solid #201944;
background-color: transparent;
}


/*FOOTER*/

.pie {
    background-color: #A6A3B4;
    height: 7.5em;
    position: relative;
    float: left;
    margin-top: 1em;
}

.pares {
    width: 9%;
    float: left;
    margin-left: 2em;
    padding-top: 1em;
}

.pares figure {
    width: 100%;
}

.pares figure img {
    width: 100%;
}

.accesos {
    width: 15%;
    float: left;
    margin-left: 3em;
    margin-top: 1.3em;
}

.accesosbotonera {
width: 100%;
height: auto;
position: relative;
float: left;
}

.accesosbotonera li {
text-decoration: none;
width: 100%;
height: 20px;
list-style: none;
margin-top: 5px;
}

.accesosbotonera li a{
color:white;
text-decoration: none;
padding-top: 12px;
font-size: 13px;
}

.accesosbotonera li a:hover{
    color: #A4E5D8;
    text-decoration:none;
   padding: 0.3em;
}

.legal {
font-size: 10px;
padding: 15px;
color: #201944;
margin-top: 1.5em;
}

/*MAPA*/

.medio ul{
    width: 100%;
    float: left;
    margin-left: 10px;
}

#elementos{
    float: left;
    height: 130px;
    margin-right: 7%;
    margin-top: 1.5rem;
    margin-bottom: 2em;
}


.medio ul li{
list-style-type: none;
margin-top: 0.5rem;
}



.medio ul h4{
font-family: "Roboto",sans-serif;
font-size: 16px;
font-weight: 400;
float: left;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
color: #1BBE9E;
}


.medio ul li a{
font-size: 14px;
font-weight: 300;
color: #201944;
float: left;
clear: both;
margin-bottom: 0.3rem;
text-decoration: none;
}

.medio ul li a:hover{
color: #F29100;
}

.medio ul li p {
color: #A4E5D8;
font-size: 12px;
}

/*EMISIONES*/



.cajavideodeldia {
width: 100% auto;
max-width:1000px;
margin-bottom: 15px;
float: left;

   
}

.cajavideodeldia .videodeldia{
width: 100%;
background-color: black;
    display: inline;
}

.cajavideodeldia, .videodeldia{
    background-color: black; }

.cajavideodeldia .infovideodeldia {
width: 35%;
color: #A4E5D8;
float: right;
margin-top: 3.5em;
    margin-left: 15px;
    margin-right: 2em;
    margin-bottom: 15px;
}

.cajavideodeldia .infovideodeldia h5{
color:#F29100;
    font-size: 0.8em;

}

 .jueves{
    width: 30%;
    float: left;
    margin-right: 2%;
     margin-top:5px;
     display: inline;
}

 .lunes {
     width: 30%;
    box-sizing: border-box;
    display: inline;
    float: left;
     margin-top: -0.9em;
}

 .jueves .infojueves {
     width: 90%;
    margin-right: 2%;
     margin-top: 8px;
}

 .lunes .infolunes {
     width:90%;
     margin-top: 8px;
}

.jueves .infojueves h5{
    color: #F29100;
}

.lunes .infolunes h5{
    color:#F29100;
}


/*NOTICIAS*/

.noticiaprincipal{
width: 100% auto;
max-width:1000px;
margin-bottom: 15px;

}

.noticiaprincipal img{
    width: 100%;
   height: 15em;  
}

.noticiaprincipal a{
    text-decoration: none;
  
    
}

.noticiaprincipal h2{
    color:#F29100;
}

.noticiaprincipal h3{
  width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
    
}



.noticiasecundaria{
    width: 60%;
    float:left;
    margin-bottom: 20px;
}

.noticiasecundaria img{
    width: 90%;
    border-radius: 15px;
}

.noticiasecundaria article{
    width: 90%;
    margin-left: 15px;
}

/*NOTICIA1*/




.noticia1{
    width: 60%;
    float:left;
    margin-bottom: 20px;
}


    
}


.noticia1 img{
    width: 50%;
    float: left;
    display: inline-block;
   
    
}


.noticia1 article{
    width: 55%;
    background-color: aqua;
    display: inline-block;
    float: left;
    
}


.noticia1 a{
    text-decoration: none;
  
    
}

.noticia1 h2{
    color:#F29100;
}

.noticia1 h3{
  width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
    
}

.noticia1 .fotofadu img{
    width:35%;
    
    margin-top: -12em;
    margin-left: 6em;
}

/*AGENDA */

#contenedor {
    font-family: "Roboto", "Helvetica", "sans-serif";
    color: white;
    width:100%;
    max-width: 64em;
}


h1{ 
    font-family: "Roboto";  
    font-weight: 400;
    padding-bottom: 0.2em;
    padding-top: 0.5em;
}

h2{ 
    font-family: "Roboto"; 
    font-weight: 400; 
    font-size: 130%; 
    display: inline; 
    text-align: center;
}

h3{ 
    font-family: "Oswald";
    font-weight: 700; 
    font-size: 80%;
}


.regular {font-weight: 400;}
.bold {font-weight: 700;}

.frojodos       {background-color: #A6A3B4;}
.frojotres      {background-color: #1BBE9E;} 
.frojocuatro      {background-color: #201944;}

.fgristres      {background-color: #1BBE9E;}
.fgriscuatro    {background-color: #A4E5D8;}
.fgriscinco     {background-color: #1BBE9E;}



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

ul li{ list-style-type: none;}

.regular{ font-weight: 400;}



@media screen and (max-width:800px ) {
    
    header nav {
        width:70%;
        height:100%;
        left: -100%;
        margin:0;
        position:fixed;
        z-index: 999;
    }

    header nav ul li {
        display:block;
        float:none;
        border-bottom:1px solid rgba(255,255,255, .3);
    }

    .menu_bar {
        display: block;
        width:100%;
        background: #CCC;
    }
    
    .menu_bar .bt_menu {
        display: block;
        padding:20px;
        background: #201944;
        color:#FFF;
        text-decoration: none;
        font-weight: bold;
        font-size: 25px;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing: border-box;
    }
    
    .menu_bar span {
        float:right;
        font-size:40px;
    }

   
}

@media screen and (max-width:640px ) {
    #nota-ppal{
        width: 100%;
        margin: 0 auto;
        margin-bottom: 1em;
        float: left;
        height: 90%/*450px*/;
        min-height: 215px;
        padding-bottom: 1em;
        background-color: black;
    }
    
    #video{
        position: absolute;
        float: left;
        padding-bottom: 31.2%; /*56.25%;*/
        width: 100%; 
        height: 130px;    
    }
    
    
    .infospot{
        position: relative;
        margin-top: 55%;
        width: 90%;
        height: 20%;
        color: #A4E5D8; 
        padding: 2em 1em 0em 1em;
    }
    
    aside {
        height: 560px;
    }
    
    .botoneralogin{
        display: none;        
    }
    
    aside h3{
        display: none;
    }
    
    .botonstaff{
        margin-top: -20px; 
    }
    
}

@media screen and (max-width:480px ) {
    aside{
        display: none;
    }
            
    
    main .medio .nsec{
    width: 100%; 
    height: /*550px*/;
    float: left;
    }

    #noticias-sec{
        width: 100%;
        float: left;
    }

    .noticiasec1 {
        /*background-size: 100%;*/
        /*background-origin: 100px 0px 0px 0px;*/
        /*position: relative;*/
        width: 100%;
    }
    
    .noticiasec2{
        /*background-size: 100%;*/
        /*background-origin: 100px 0px 0px 0px;*/
        /*position: relative;*/
        width: 100%;
        margin-top: 0.5em;
    }
    
    .notacorta{
        width: 100%;
        height: 135px;
        margin-left: 0;
        border-bottom: solid #A4E5D8 1px; 
    }
    
    .notacorta:nth-child(n+2){ 
        padding-top: 1em;
    }
    
    .notacorta:last-child{ 
        border-bottom: none;
    }
    
    .epigrafe{
        display: block;
        position: relative;
        top: 11.5em;
        width: 100%;
        line-height: 20px;
        background-color: #F29100;
        font-size: 0.9em;
        color: white;
    }

    .pares, .accesos {
    display: none;
    }
}
    

@media screen and (max-width:800px ) {
    
    header nav {
        width:70%;
        height:100%;
        left: -100%;
        margin:0;
        position:fixed;
        z-index: 999;
    }

    header nav ul li {
        display:block;
        float:none;
        border-bottom:1px solid rgba(255,255,255, .3);
    }

    .menu_bar {
        display: block;
        width:100%;
        background: #CCC;
    }
    
    .menu_bar .bt_menu {
        display: block;
        padding:20px;
        background: #201944;
        color:#FFF;
        text-decoration: none;
        font-weight: bold;
        font-size: 25px;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing: border-box;
    }
    
    .menu_bar span {
        float:right;
        font-size:40px;
    }


}




@media screen and (min-width: 40em) {

h1{font-size: 200%;line-height: 1.2em;}
h2{line-height: 1.2em;}   
    

    
#contenedor{margin: auto;min-width: 40em;} 
a{ display: inherit;}

.ocultarcel{
    display: inherit;
}

.ocultartablet{
    display: none;
}
}

@media screen and (min-width: 64em) {

  
/*AGENDA */

.contenidogrilla {background-color: #201944; padding-bottom: 15em;}
#botongrillamanana, #botongrillasemana{width: 58em; margin: auto;}
    
#franjauno, #franjados, #franjatres, #botongrilla, .filauno li {margin: auto;}
#franjauno, #franjados, #franjatres {width: 58em; margin-top: 3em;height: 2em;clear: both}

#franjauno li, #franjados li, #franjatres li{display: inline-block; margin-right: 15em; margin-left: 1em;}
.filauno li, .filados li, .filatres li{float: left; width: 19.3em; height: 11em; margin-left: 3em;margin-right: -3em;}
.filauno h1, .filados h1, .filatres h1{margin-left: 0.6em;margin-top: 1em;}
.filauno h2, .filados h2, .filatres h2{margin-left: 1em;}
.filauno h3, .filados h3, .filatres h3{margin-left: 1.6em;}

    
#fotogrillacuatro:hover {background-image: url(../imagenes/fotogrillacuatro.jpg)}
#fotogrillacinco:hover  {background-image: url(../imagenes/fotogrillacinco.jpg)}
#fotogrillaseis:hover   {background-image: url(../imagenes/fotogrillaseis.jpg)}
#fotogrillasiete:hover  {background-image: url(../imagenes/fotogrillasiete.jpg)}
#fotogrillaocho:hover   {background-image: url(../imagenes/fotogrillaocho.jpg)}
#fotogrillanueve:hover  {background-image: url(../imagenes/fotogrillanueve.jpg)}
#fotogrilladiez:hover   {background-image: url(../imagenes/fotogrilladiez.jpg)}
#fotogrillaonce:hover   {background-image: url(../imagenes/fotogrillaonce.jpg)}
#fotogrilladoce:hover   {background-image: url(../imagenes/fotogrilladoce.jpg)}

#navsec{display: table; width: 100%;}
#navsec li {display:table-cell; width: 10%; padding: 0.6em; padding-left: 1.5em; font-size: 80%;}
#navsec li:hover {background-color: #F29100;}

}