@media only screen 
and (min-device-width : 1024px) {
body
{
background: #f1f1f1;
@import url(http://fonts.googleapis.com/css?family=Oswald:400,300|Montserrat:400,700|Open+Sans);
margin: 0px;
padding: 0px;


}

/*
.unaseccion{
overflow: hidden;
}
*/

body,input,textarea,select
{
font-family: 'Montserrat', sans-serif;
font-weight: 400;
font-size: 12pt;
}

h1,h2,h3,h4,h5,h6,h10
{
font-weight: 400;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, h10 a
{
color: inherit;
text-decoration: none;
}

h1{
color: #fff;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-weight: 400;
font-size:2.5em;
letter-spacing: 0.05em;
background-color: #01DDBC;
max-width: 500px;
text-align: left;
width: 60%;
padding-top: 3.2em;
padding-left: 0.5em;

}


h2{
color:#343434;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-weight: 400;
width: 60%;
text-align: left;
margin-top: -1em;
}

h3{
color: #343434;
font-size: 1.2em;
margin-top: 0px;
}

h4{
color: #3e3e3e;
font-size: 3em;
text-align: left;
padding-top: 0em;
font-family: 'Montserrat', sans-serif;
}

h5{
color: #3e3e3e;
font-size: 1em;
font-family: 'Open sans', sans-serif;
text-align: left;
font-style: italic;
margin-top: -3.3em;
}

h6{
text-align: center;
width: 25%;
margin: auto;
border-bottom: 3.5px solid #33e0c4;
font-size: 1.8em;
color: #3e3e3e;
font-family: 'Open sans', sans-serif;
padding-top: .1em;
padding-bottom: .5em;
margin-bottom: 1em;
margin-top: 0em;
font-weight: 100;
letter-spacing: .1em;
}


.subtitle{
color: #585858;
font-size: .8em;
text-transform: uppercase;
font-weight: 400;
font-style: italic;
line-height: 1.2em;
}

p{
color: #818181;
font-size: .8em;
line-height: 1.5em;
font-family: 'Open Sans', sans-serif;
}

a
{
text-decoration: none;  
color: #ffffff;
}

.active{
color: #33e0d4;
}

ul{
list-style: none;
}
/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/

#header
{
position: fixed;
background: #FFF;
height: 50px;
border-bottom: solid 5px #ececec;
width: 100%;
z-index: +1;
}

#header .container
{
padding-top: 0.6em;
width: 100%;
margin: auto;
max-width: 1280px;
}

/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/

#logo
{
top: 3em;
display: block;
}

#logo img{
display: block;
}


/*********************************************************************************/
/* Nav                                                                           */
/*********************************************************************************/

#nav
{
float: right;
position: relative;
top: -2.4em;

}

#nav > ul > li
{
float: left;
list-style: none;
}

#nav > ul > li:last-child
{
padding-right: 0;
}

#nav > ul > li > a,
#nav > ul > li > span
{
display: block;
margin-left: 0.7em;
padding: 0.25em 1em;
text-decoration: none;
outline: 0;
color: #3e3e3e;
}

#nav li.active a
{
border-bottom: solid 10px #71859f;
color: #33e0c4;
padding-bottom: .6em;
}


#nav > ul > li > ul
{
display: none;
}

#page1{
display: block;
float: left;
margin-top: -4.5em;
}

/*********************************************************************************/
/* Search                                                                        */
/*********************************************************************************/


input {
outline: none;
float: left;
margin-left: 0.5em;    
}
input[type=search] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
font-family: inherit;
font-size: 100%;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
display: none; 
}


input[type=search] {
background: #ededed url(../imagenes/img03.png) no-repeat 3px center;
border: solid 1px #ccc;
padding: 3px 4px;
width: 55px;

-webkit-border-radius: 10em;
-moz-border-radius: 10em;
border-radius: 10em;

-webkit-transition: all .5s;
-moz-transition: all .5s;
transition: all .5s;
}
input[type=search]:focus {
width: 130px;
background-color: #fff;
border-color: #34e2b3;

-webkit-box-shadow: 0 0 5px rgba(109,207,246,.5);
-moz-box-shadow: 0 0 5px rgba(109,207,246,.5);
box-shadow: 0 0 5px rgba(109,207,246,.5);
}


input:-moz-placeholder {
color: #999;
}
input::-webkit-input-placeholder {
color: #999;
}

/* Demo 2 */
#demo-2 input[type=search] {
width: 10px;
padding-left: 10px;
color: transparent;
cursor: pointer;
}
#demo-2 input[type=search]:hover {
background-color: #fff;
}
#demo-2 input[type=search]:focus {
width: 100px;
padding-left: 32px;
color: #000;
background-color: #fff;
cursor: auto;
}
#demo-2 input:-moz-placeholder {
color: transparent;
}
#demo-2 input::-webkit-input-placeholder {
color: transparent;
}

/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/

#banner
{
position: relative;
background: url(../imagenes/img01.jpg) no-repeat center;
background-size: cover;
min-height: 600px;
margin-top: -1.7em;
}

#banner .container{
width: 50%;
min-width: 860px;
margin: auto;
}

#banner .container .profile{
display: block;
background-color: #33e0c4;
height: 150px;    
width: 520px;
margin-top: -6.4em;
margin-bottom: 2em;
border-bottom-left-radius: 70px;
}

#banner .container .profile img{
float: left;
padding-top: 1.5em;
margin-right: .5em;
}

#banner .container .profile #profilepic{
padding-top: 1em;
padding-left: .5em;
margin-right: 1em;
}

#banner .container .profile span{
color: white;
line-height: 1.5em;
}

#banner .container h7{
color: white;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-weight: 400;
font-size:1.5em;
letter-spacing: 0.05em;

}

#banner .container .navpub{
width: 520px;
height: 50px;
background-color: rgba(62, 62, 62, 0.6);
}

#banner .container .navpub ul{
list-style: none;
}

#banner .container .navpub ul img {
vertical-align: middle;
}

#banner .container .navpub ul li{
display: inline-block;
color: white;
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
font-size: 1.2em;
margin-right: 2em;
margin-left: .5em;
margin-top: .5em;
letter-spacing: 0.05em;
vertical-align: top;
}

#banner .container .publicar{
display: block;
width: 520px;
height: 270px;
background-color: rgba(255, 255, 255, 0.6);

}

#banner .container .publicar textarea{
width: 39.5%;
margin: auto;
margin-left: 50px;
margin-top: 2em;
height: 100px;
margin-bottom: 1em;
color: #b4b4b4;
}

#banner .container .botoneraperfil{
width: 20%;
float: right;
list-style: none;
margin-top: -10.5em;
margin-right: 8em;
}

#banner .botoneraperfil li{
background-color: #f1f1f1;
padding: .8em;
margin-bottom: .6em;
border: 2px solid #c3c3c3;
color: #3e3e3e;
}

#banner .botoneraperfil  p{
float: right;
background-color: #e93333;
width: 25px;
height: 25px;
text-align: center;
color: #eaeaea; 
font-size: 1em;
margin: .7em;
}

#banner .botoneraperfil li:hover{
background-color: #bebebe;
}


#banner .container h9{
width: 100%;
margin-left: 13.5px;
color: #3e3e3e;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
letter-spacing: .1em;
}

#bannervilovecinos .container h9{
width: 100%;
padding-left: .1em;
clear: both;
color: #3e3e3e;
margin: auto;
align-content: center;
text-align: center;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
letter-spacing: .1em;
}


#banner .container .botoneraperfil img{
width: 44px;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
}

#banner .container span{
padding-top: 1em;
margin-bottom: 1em;
color: #b2b2b2;
font-family: 'Open Sans', sans-serif;
font-style: italic;
}

#banner .container span:hover{
color: #434343;
}

.bannerfix
{
position: relative;
background: url(../imagenes/img01.jpg) no-repeat center;
background-size: cover;
min-height: 800px;

}

.bannerfix .container{
width: 50%;
min-width: 860px;
max-width: 860px;
height: 200px;
margin: auto;
}

#bannerprogramas{
position: relative;
background: url(../imagenes/img50.jpg) no-repeat center;
background-size: cover;
min-height: 800px;
}


#bannerprogramas .container{
min-width: 1280px;
text-align: center;
height: 200px;
margin: auto;
}

#bannercontacto{
position: relative;
background: url(../imagenes/img51.jpg) no-repeat center;
background-size: cover;
}


#bannercontacto .container{
min-width: 1280px;
text-align: center;
height: 200px;
margin: auto;
}

#bannerestamostrabajando{
position: relative;
background: url(../imagenes/img07.jpg) no-repeat center;
background-size: cover;
}



#grillaprogramas{
list-style: none;
display: inline-block;
padding-top: 2em;

}

#grillaprogramas li{
margin: auto;
display: inline-block;
width: 25%;
padding: .5em 0em 3em 0em;
margin: 0 3em 0 1em;
text-align: left;
border-top: solid 5px #01ddbc;
vertical-align: top;
}

#grillaprogramas li img{
float: left;
margin-right: 10px;
}

#bannerprogramas h2{
color:#01DDBC;
float: left;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-weight: 400;
width: 30%;
text-align: left;
margin-top: 0em;
}

#bannerprogramas #grillaprogramas p{
float: left;
margin-top: -1.7em;
width: 50%;
color: white;
}

.bannerfix h1{
margin: auto;
text-align: center;
font-size: 3em;
padding: 2em 0 0 0;
}

#bannerestamostrabajando h1{
width: 500px;
padding: 1em 1em 0 1em;
padding-top: 10em;
font-size: 3em;
}

#bannerestamostrabajando h2{
color: white;
align-content: center;
float: left;
padding-top: .5em;
margin-left: 5em;
text-align: center;
width: 100%;
margin: auto;
}

#banneragenda{
min-height: 850px;
position: inherit;
background: url(../imagenes/img59.jpg) top;
background-size: cover;
}


#banneragenda .container{
min-width: 1280px;
text-align: center;
margin: auto;
}

#bannersubirevento{
min-height: 850px;
position: inherit;
background: url(../imagenes/img59.jpg) top;
background-size: cover;
}


#bannersubirevento .container{
min-width: 1280px;
text-align: center;
align-content: center;
padding: 0 0 0 0em;
margin: auto;
}

#bannerperfil{
position: inherit;
background: url(../imagenes/img62.jpg) top;
background-size: cover;
}

#bannerperfil .container{
min-width: 1280px;
text-align: center;
align-content: center;
padding: 0 0 0 0em;
margin: auto;
}

#bannercultura{
position: inherit;
background: none;
background-size: cover;
min-height: 600px;
}

#bannercultura .container{
min-width: 1280px;
text-align: center;
align-content: center;
padding: 0 0 0 0em;
margin: auto;
}

video#bgvid {
position: absolute;
top: 50%;
left: 50%;
min-width: 100%;
width: auto;
height: auto;
z-index: -100;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url(../imagenes/img51.jpg) no-repeat;
background-size: cover;
-webkit-filter: blur(10px);
}

#santiagoperezylaputaquetepario{
position: absolute;
padding-top: 3.3em;
left: 0;
top:0;
}
#santiagoperezylaputaquetepario:hover{
opacity: .7;
}

#bannervilovecinos{
position: inherit;
background: url(../imagenes/img62.jpg) top;
background-size: cover;
min-height: 600px;
}

#bannervilovecinos .container{
min-width: 860px;
text-align: center;
align-content: center;
padding: 0 0 0 0em;
margin: auto;
}


#bannervilovecinos .container .navpub{
width: 520px;
float: left;
height: 50px;
background-color: rgba(62, 62, 62, 0.6);
}
#bannervilovecinos .container .navpub ul{
list-style: none;
float: left;
margin-top: 0;
}

#bannervilovecinos .container .navpub ul img {
vertical-align: middle;
}


#bannervilovecinos .container .navpub ul li{
display: inline-block;
color: white;
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
font-size: 1.2em;
margin-right: 2em;
margin-left: .5em;
margin-top: .5em;
letter-spacing: 0.05em;
vertical-align: top;
}

#secvilovecinos{
width: 1280px;
align-content: center;
text-align: center;
}
#containermusica{
margin-top: 5em;
width: 100%;
background-color: #f1f1f1;
padding-top: 2em;
}
#secmusica{
width: 1280px;
align-content: center;
text-align: center;
}


#containermusica .section2 .now .recomendado{
border: solid 2px #d4d4d4;
padding: 1em;
width: 45%;
margin: 0;
margin-left: .7em;
margin-right: .7em;
margin-bottom: 1.5em;
vertical-align: top;
background-color: #ffffff;

}


#containermusica .section2 .now .recomendado .vidrecomendado{
width: 45%;
float: left;
margin-right: 2em;
vertical-align: bottom;
}

#containermusica .section2 .now .recomendado h3{
margin-top: 1em;
text-align: left;
}

#containermusica .section2 .now .recomendado p{
text-align: left;
}

#bannercultura #botones{
width: 100%;
text-align: center;
padding-bottom: -1em;
}

#bannercultura h2{
color: #33e9c4;
width: 100%;
text-align: center;
padding-top: 1em;
font-size: 2em;
margin-bottom: 0;
}

#bannercultura h3{
color: #f1f1f1;
}

#bannercultura .boton{
display: inline-block;
padding: 1em;
padding-left: 2em;
padding-right: 2em;
border: solid 2px #f1f1f1;
color: #f1f1f1;
margin: 1em;
align-content: center;
text-align: center;
}

#bannercultura .boton:hover{
opacity: .5;
}


#bannercultura .musicaul{
padding: 0;
}

#bannercultura .musicaul li{
display: inline-block;
width: 30%;
margin: 1.2em;
}

#bannercultura .musicaul li img{
width: 100%;
}

#amigosestupidos{
max-width: 100%;
margin: auto;
left: 0;
}
#amigosestupidos .uno{
padding-bottom: 2em;
margin-left: -2.6em;
text-align: left;
width: 70%;
}
#amigosestupidos .uno img{
width: 90%;
}

#otrosamigos{
float: right;
margin-top: -52.6em;
width: 39%;
text-align: right;
}
#otrosamigos li{
padding-bottom: 2.23em;
}

#bannervilovecinos .container .botoneraperfil{
width: 20%;
float: right;
list-style: none;
margin-top: -10.5em;
margin-right: 8em;
}

#bannervilovecinos .botoneraperfil li{
background-color: #f1f1f1;
padding: .8em;
margin-bottom: .6em;
border: 2px solid #c3c3c3;
color: #3e3e3e;
}

#bannervilovecinos .botoneraperfil  p{
float: right;
background-color: #e93333;
width: 25px;
height: 25px;
text-align: center;
color: #eaeaea; 
font-size: 1em;
margin: .7em;
}

#bannervilovecinos .botoneraperfil li:hover{
background-color: #bebebe;
}
    
    
#bannerperfil .container .botoneraperfil{
width: 20%;
float: right;
list-style: none;
margin-top: -3.1em;
margin-right: 8em;
}

#bannerperfil .botoneraperfil li{
background-color: #f1f1f1;
padding: .8em;
margin-bottom: .6em;
border: 2px solid #c3c3c3;
color: #3e3e3e;
}

#bannerperfil .botoneraperfil  p{
float: right;
background-color: #e93333;
width: 25px;
height: 25px;
text-align: center;
color: #eaeaea; 
font-size: 1em;
margin: .7em;
}

#bannerperfil .botoneraperfil li:hover{
background-color: #bebebe;
}




#bannervilovecinos .container .publicar{
display: block;
float: left;
width: 520px;
height: 285px;
background-color: rgba(255, 255, 255, 0.6);

}

#bannervilovecinos .container .publicar textarea{
width: 80%;
margin: auto;
margin-top: 2em;
height: 100px;
margin-bottom: 1em;
color: #b4b4b4;
}

#bannervilovecinos .container .publicar input[type="file"]{margin: auto;
width: 70%;
float: none;}

#bannervilovecinos .container .publicar input[type="button"]{margin-left: -1em;
width: 30%;
margin-top: 1em;
margin-right: 1em;
float: none;}



#bannervilovecinos .container h1{
text-align: center;
margin-left: 0em;
font-size: 3em;
background-color: #01ddbc;
max-width: 1000px;
width: 520px;
padding: 1em 0 0 0;
}
#shareshare{
float: right;
margin-top: 2em;
margin-right: 9em;
}     
#bannervilovecinos .container .profile{
display: block;
float: left;
text-align: left;
background-color: #33e0c4;
height: 150px;    
width: 520px;
margin-top: 0em;
margin-bottom: 2em;
border-bottom-left-radius: 70px;
}

#bannervilovecinos .container .profile img{
float: left;
padding-top: 1.5em;
margin-right: .5em;
}

#bannervilovecinos .container .profile #profilepic{
padding-top: 1em;
padding-left: .5em;
margin-right: 1em;
}

#bannervilovecinos .container .profile span{
color: white;
line-height: 1.5em;
}

#bannervilovecinos .container h7{
color: white;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-weight: 400;
font-size:1.5em;
letter-spacing: 0.05em;}

#bannervilovecinos .container .botoneraperfil img{
width: 44px;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
}


#bannerperfil h1{
width: 80%;
background-color: #01ddbc;
}


#bannerperfil .container .profile{
display: block;
background-color: #33e0c4;
height: 150px;    
width: 52%;
text-align: left;
float: left;
padding-top: 3.25em;
margin-top: 0em;
margin-bottom: 2em;
border-bottom-left-radius: 70px;
border-bottom-right-radius: 0px;
}
#bannerperfil .container .profiledos{
display: block;
background-color: #33e0c4;
height: 150px;    
width: 24%;
float: right;
text-align: center;
padding-top: 3.25em;
margin-top: 0em;
margin-bottom: 2em;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 70px;
}

#bannerperfil .profiledos h9{
width: 100%;
margin-left: 13.5px;
color: #ffffff;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
letter-spacing: .1em;
vertical-align: top;
line-height: 4em;
}
    
    #bannerperfil .botoneraperfil h9{
width: 100%;
        margin-top: 0;
        margin:0;
        margin-left: 1em;
        margin-right: 1em;
color: #3e3e3e;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
letter-spacing: .1em;
vertical-align: top;
line-height: 1em;
}
    
    #bannerperfil .botoneraperfil img{
        max-height: 62px;
        min-width: 62px;
        margin-left: .3em;
}

#bannerperfil .container .profiletres{
display: block;
background-color: #33e0c4;
height: 150px;    
width: 24%;
float: right;
text-align: center;
padding-top: 3.25em;
margin-top: 0em;
margin-bottom: 2em;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
}
#bannerperfil .profiletres img, #bannerperfil .profiledos img{
width: 50px;
}

#bannerperfil .profiletres h9{
width: 100%;
margin-left: 13.5px;
color: #ffffff;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
letter-spacing: .1em;
vertical-align: top;
line-height: 4em;
}

#bannerperfil .container .profile img{
float: left;
padding-top: 1.5em;
margin-right: .5em;
}

#bannerperfil .container .profile #profilepic{
padding-top: 1em;
padding-left: .5em;
margin-right: 1em;
}

#bannerperfil .container .profile span{
color: white;
line-height: 1.5em;
}

#bannerperfil .container h7{
color: white;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-weight: 400;
font-size:1.5em;
letter-spacing: 0.05em;}

#bannerperfil .container .botoneraperfil img{
width: 44px;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 10px;
}
#bannerperfil{
position: inherit;
background: url(../imagenes/img62.jpg) top;
background-size: cover;
min-height: 600px;
}

#bannerperfil .container{
min-width: 860px;
text-align: center;
align-content: center;
padding: 0 0 0 0em;
margin: auto;
}


#bannerperfil .container .navpub{
width: 520px;
float: left;
height: 50px;
background-color: rgba(62, 62, 62, 0.6);
}
#bannerperfil .container .navpub ul{
list-style: none;
float: left;
margin-top: 0;
}

#bannerperfil .container .navpub ul img {
vertical-align: middle;
}


#bannerperfil .container .navpub ul li{
display: inline-block;
color: white;
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
font-size: 1.2em;
margin-right: 2em;
margin-left: .5em;
margin-top: .5em;
letter-spacing: 0.05em;
vertical-align: top;
}

#bannerperfil .container .publicar{
    display: block;
    float: left;
    width: 520px;
    height: 285px;
    background-color: rgba(255, 255, 255, 0.6);

}
     #bannerperfil .container .publicar input[type="text"]{margin: auto;
        margin-top: 1em;
        width: 83%;
        float: none;
        color: #b4b4b4;
            font-size: .8em;
            text-align: left;
        
        }
        
        #bannerperfil .container .publicar textarea{
    width: 80%;
    margin: auto;
    margin-top: .5em;
    height: 80px;
    margin-bottom: 1em;
    color: #b4b4b4;
}
        
    
        #bannerperfil .container .publicar input[type="file"]{margin: auto;
        width: 84%;
        float: none;
        color: #777777;
            font-size: .8em;
            text-align: left;
        
        }
        
        #bannerperfil .container .publicar input[type="button"]{           margin-left: -1em;
        width: 30%;
            margin-top: 1em;
            margin-right: 1em;
        float: none;}
    
    
#secvilovecinos{
width: 1280px;
align-content: center;
text-align: center;
}


.section4 .apendix{
position: absolute;
margin-left: 1233px;
}

#agendaprog .container{
width: 1280px;
margin: auto;
}
#agendaprog .bar{
width: 95px;
margin: auto;
float: left;
}

#agendaprog #divprog{
width: 1185px;
overflow: scroll;
overflow-y: hidden;
}

#agendaprog{
margin-top: -10em;
padding-bottom: 5em;
margin-bottom: 0;
}

#bannernoticias{
min-height: 1550px;
position: inherit;
background: none;
background-size: cover;
}


#bannernoticias .container{
min-width: 1280px;
text-align: center;
margin: auto;
}

#bannernoticias #noticias{
background: none;
}

#bannernoticias #my-img{
width: 250px;
height: 200px;
}

#bannernoticias h5{
margin-bottom: 3.5em;
}

#bannernoticias p{
margin: 1em 4em;
}

#bannernoticias #subtitulonoticia{
color: #555;
font-family: 'Montserrat', sans-serif;
font-weight: 700;
font-size: 1.2em;
}

#bannernoticias #botones{
margin: auto;
align-content: center;
text-align: center;
}
/*********************************************************************************/
/* Video                                                                        */
/*********************************************************************************/
.video-slide1{
text-align: left;    
float: left;
}

#banner iframe{
border-bottom: solid 4px #33e0c4;
}


/*********************************************************************************/
/* Login                                                                        */
/*********************************************************************************/

#login{
width:30%;
float: right;
margin-top: -10em;
background-color: rgba(255, 255, 255, 0.6);
height: 27.6em;
padding: .4em;
align-content: center;

}

#login p{
font-family: 'Montserrat', sans-serif;
padding-left: 4%;
padding-top: 2em;
font-size: 1.2em;
font-weight:700;
text-align:left;
text-transform: lowercase;
color:#3e3e3e;
}

#login form{
float: left;
width: 90%;
}

input[type="email"],input[type="password"]{
width:95%;
background:#fff;
margin-bottom:4%;
border:1px solid #ccc;
padding:4%;
font-family:'Montserrat',sans-serif;
font-size:0.7em;
font-weight: 300;
color:#555;
}

.recordarme{
font-size: 0.8em;
color: rgba(38, 38, 38, 0.68);
float: left;
}


label {
display: inline-block;
float: right;
cursor: pointer;
font-size: 13px;    
margin-top: 0.3em;
}

input[type="button"]{
width:100%;
margin-top: 10px;
background:#33e0c4;
border:0;
padding:4%;
font-family:'Montserrat',sans-serif;
font-size:1em;
font-weight: 300;
color:#fff;
cursor:pointer;
transition:background .3s;
-webkit-transition:background .3s;
}   

#banner .container .publicar input[type="button"]{
width: 40%;
margin: auto;
margin-left: 50px;
}

input[type="button"]:hover{
background:#71859f;
}

#bannerestamostrabajando input[type="button"]{
margin: auto;    
margin-top: 3em;
background: #eaeaea;
width: 200px;
align-content: center;
color: #6d6d6d;
margin-left: 20.5em;
}

#bannerestamostrabajando input[type="button"]:hover{
background: #383838;
color: #e3e3e3;
}

.olvidar{
margin-top: 220px;
font-size: 10pt;
font-style: italic;
font-weight: 300;    
}

.olvidar a{
text-decoration: none;
color: #3e3e3e;
padding-left: 1em;
}

#estasmuygris{
font-size: .8em;
padding-left: 1em;
font-style: italic;
color: #575757;
}


/*********************************************************************************/
/* Main                                                                          */
/*********************************************************************************/

.section1
{
background: #f1f1f1;
width: 80%;
min-width: 860px;
margin: auto;
}

.section2
{   
background-color: #f1f1f1;
}

.section4{
background: #e2e2e2;   
padding-top: 1.5em;
margin-bottom: 4.5em;
}


#main
{
border-top: 1px solid;
border-color: rgba(0,0,0,.2);
}

.sidebar header h2
{
font-size: 1.6em;
}


/*********************************************************************************/
/* Calendario                                                                          */
/*********************************************************************************/

@import url(http://weloveiconfonts.com/api/?family=fontawesome);

*[class*="fontawesome-"]:before {
font-family: 'FontAwesome', sans-serif;
}

/* ---------- GENERAL ---------- */


h8 {
font-size: 1.3em;
line-height: 1.8em;
margin: .25em 0;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

/* ---------- CALENDAR ---------- */

.calendar {
float: left;
margin-left: 1em;
}

.calendar header {
width: 50%;
margin-left: 4.3em;
margin-top: 2em;
}

.calendar h8 {
text-transform: uppercase;
color: #555;
}

.calendar thead {
font-weight: 600;
text-transform: uppercase;
}

.calendar tbody {
color: #7c8a95;
}

.calendar tbody td:hover {
border: 2px solid #00addf;
}

.calendar td {
border: 2px solid transparent;
border-radius: 50%;
display: inline-block;
height: 1.5em;
line-height: 1.5em;
text-align: center;
width: 1.5em;
}

.calendar .prev-month,
.calendar .next-month {
color: #cbd1d2;
}

.calendar .prev-month:hover,
.calendar .next-month:hover {
border: 2px solid #cbd1d2;
}


.event {
cursor: pointer;
position: relative;
}

.event:after {
background: rgba(0, 223, 180, 0.43);
border-radius: 50%;
bottom: .0em;
display: block;
content: '';
height: 1.5em;
left: 20%;
margin: 0 0 0 -.25em;
position: absolute;
width: 1.5em;
}

.event.current-day:after {
background: rgba(108, 108, 108, 0.46);
}

.btn-prev,
.btn-next {
border: 2px solid rgba(255, 255, 255, 0);
border-radius: 50%;
color: #cbd1d2;
height: 2em;
font-size: .75em;
line-height: 2em;
margin: -1em;
position: absolute;
top: 50%;
width: 2em;
}

.btn-prev:hover,
.btn-next:hover {
background: rgba(255, 255, 255, 0);
color: #f9f9f9;
}

.btn-prev {
left: 6em;
}

.btn-next {
right: 6em;
}
/*

CALENDARIO 2.0
*/
#banneragenda #calendar{
margin-top: 2em;

}

#bannersubirevento #calendar{
margin-top: 2em;
width: 40%;
float: left;
box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
border-radius: 20px 20px 0px 0px;
}

#bannersubirevento #calendar header, #banneragenda #calendar header{
background-color: #33e9c4;
border-radius: 20px 20px 0px 0px;
}

#bannersubirevento #calendar header{
padding-bottom: 1em;
}


time {
color: white;
text-transform: uppercase;
font-weight: 300;
font-size: 38px;
}
time em {
display: block;
font-weight: 300;
font-style: normal;
font-size: 16px;

}

#bannersubirevento #calendar header div, #banneragenda #calendar header div{
padding: 2em;

}
#banneragenda #calendar header a, #bannersubirevento #calendar header a{
padding: 1em;
background-color: #e2e2e2;
color: #7e7e7e;
border-radius: 5px;
border: 3px solid #c7c7c7;
transition: background-color .2s;
}

#banneragenda #calendar .m-box--date .fancybox-media{
color: #555;
}

#banneragenda #calendar header a:hover{
padding: 1em;
background-color: #33e4c9;
color: #7e7e7e;
border-radius: 5px;
border: 3px solid #c7c7c7;
}

[role="main"] {
overflow: hidden;
padding: 15px;
padding-bottom: 2em;
background: white;
font-family: "Montserrat";
}

#bannersubirevento [role="main"]{
height: 284px;
}

#bannersubirevento #calendar h3{
margin-top: 13em;
}

section ul {
list-style-type: none;
}  
section li {
position: relative;
display: inline-block;
float: left;
width: 167px;
height: 35px;
text-align: center;
font-size: 1em;
line-height: 35px;
zoom: 1;
*display: inline;
}

#bannersubirevento section li {
position: relative;
display: inline-block;
float: left;
width: 58px;
height: 35px;
text-align: center;
font-size: 1em;
line-height: 35px;
zoom: 1;
*display: inline;
}

#bannersubirevento #msform{
width: 40%;
margin: 1em 0 0 6em;
float: left;
}

#bannersubirevento .fs-subtitle{
margin-bottom:  0;
padding-left: 2em;
}

.l-date--event {
cursor: pointer;
transition: background 0.3s ease-in-out;
}
.l-date--event:hover {
background: #efefef;
}

.m-bullet--event {
position: absolute;
top: 30px;
margin-left: 30%;
display: block;
width: 40%;
height: 5px;
border-radius: 2px;
background: #33e9c4;
}

.m-box--weeks {
color: #e66b6b;
text-transform: uppercase;
font-weight: bold;
font-size: 10px;
}

.m-box--date {
color: #555;
font-size: 14px;
}

.l-date--passed {
color: #bababa;
}

.eventTip {
position: relative;
width: 150px;
left: 50%;
top: -125%;
margin-left: -75px;
background: #249991;
color: white;
}
.eventTip:before {
content: "▾";
position: absolute;
font-size: 25px;
color: #249991;
bottom: -19px;
left: 46%;
}



/*********************************************************************************/
/* Programas                                                                          */
/*********************************************************************************/

.section1 .programas{
list-style: none;
width: 100%;
margin-top: 1em;
align-content: center;
padding: 0px;
text-align: center;
}

.section1 .programas li{
text-align: center;
align-content: center;
display: inline;
margin-right: 1.43em;
top: -1em;
}

.section1 .programas li:last-child{
margin-right: none;
}

.section1 .programas li a {
margin-bottom: 10px;
width: 69px;
height:69px;
display:inline-block;
}


.prog1{
background:transparent url('../imagenes/nav01.png') center top no-repeat;
}
.prog10{
background:transparent url('../imagenes/nav10.png') center top no-repeat;
}
.prog11{
background:transparent url('../imagenes/nav11.png') center top no-repeat;
}
.prog12{
background:transparent url('../imagenes/nav12.png') center top no-repeat;
}
.prog2{
background:transparent url('../imagenes/nav02.png') center top no-repeat;
}
.prog3{
background:transparent url('../imagenes/nav03.png') center top no-repeat;
}
.prog4{
background:transparent url('../imagenes/nav04.png') center top no-repeat;
}
.prog5{
background:transparent url('../imagenes/nav05.png') center top no-repeat;
}
.prog6{
background:transparent url('../imagenes/nav06.png') center top no-repeat;
}
.prog7{
background:transparent url('../imagenes/nav07.png') center top no-repeat;
}
.prog8{
background:transparent url('../imagenes/nav08.png') center top no-repeat;
}
.prog9{
background:transparent url('../imagenes/nav09.png') center top no-repeat;
}

.section1 .programas li a:hover{
opacity: .5;
}



/*********************************************************************************/
/* Programas Recomendados                                                                        */
/*********************************************************************************/

.now{
padding: 0;
list-style: none;
margin: auto;
max-width: 1280px;
}

.now .recomendado{
min-width: 20%;
width: 29.66%;
display: inline-block;
margin-right: 5.15%;
margin-bottom: 4em;
}

.now .recomendado .vidrecomendado{
border-bottom: solid 4px #33e0c4;    
}

.now .recomendado:last-child{
margin-right: 0px;
}

.now .recomendado .vidrecomendado{ 
width: 100%;
}

.now .recomendado h3 img{
width: 35px;
float: left;
margin-top: -7px;
margin-right: 5px;
}




/*********************************************************************************/
/* Agenda                                                                        */
/*********************************************************************************/

.section4 h6{
width: 25%;
margin-bottom: 1.5em;
margin-top: 1em;
}

div.sidebar{
margin-top: 3em;
height:100%;
width:3em; 
top:0;
}

#botonera {
list-style: none;
}

#botonera li {
margin-left: -2.5em;
width: 3em;
height: 66px;
border-radius: 0px 0px 30px 0px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
}

#botonera li:hover {
background-position: -200px 0 !important;
}

#botonera li#shutter2 {
position: relative;
}

#botonera li#shutter2:before {
content: "L";
color: white;
font-size: 2em;
text-align: center;
padding-top: 10px;
position: absolute;
display: block;   
top: 0;  
bottom: 0;  
left: 0;  
right: 0;  
border-radius: 0px 00px 30px 0px;
background: #33e0c4;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-ms-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;  
}

#botonera li#shutter3 {
position: relative;
}

#botonera li#shutter3:before {
content: "M";
color: white;
font-size: 2em;
text-align: center;
padding-top: 10px;
position: absolute;
display: block;   
top: 0;  
bottom: 0;  
left: 0;  
right: 0;  
border-radius: 0px 00px 30px 0px;
background: #33e0c4;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-ms-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;  
}

#botonera li#shutter4 {
position: relative;
}

#botonera li#shutter4:before {
content: "M";
color: white;
font-size: 2em;
text-align: center;
padding-top: 10px;
position: absolute;
display: block;   
top: 0;  
bottom: 0;  
left: 0;  
right: 0;  
border-radius: 0px 00px 30px 0px;
background: #33e0c4;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-ms-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;  
}

#botonera li#shutter5 {
position: relative;
}

#botonera li#shutter5:before {
content: "J";
color: white;
font-size: 2em;
text-align: center;
padding-top: 10px;
position: absolute;
display: block;   
top: 0;  
bottom: 0;  
left: 0;  
right: 0;  
border-radius: 0px 00px 30px 0px;
background: #33e0c4;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-ms-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;  
}

#botonera li#shutter6 {
position: relative;

}

#botonera li#shutter6:before {
content: "V";
color: white;
font-size: 2em;
text-align: center;
padding-top: 10px;
position: absolute;
display: block;   
top: 0;  
bottom: 0;  
left: 0;  
right: 0;  
border-radius: 0px 00px 30px 0px;
background: #33e0c4;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-ms-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;  
}

#botonera li:after {
content: "";
position: absolute;
display: block;   
top: 0;  
bottom: 0;  
left: 0;  
right: 0; 
background: rgba(0, 0, 0, 0);
border-radius: 5px;
z-index: -2;
}

#botonera a {
height: 66px;
display: block;
transition: all 0.4s ease;
opacity: 0;
text-decoration: none;
font-family: 'Montserrat';
font-weight: 500;
font-size: 2em;
border-radius: 0px 00px 30px 0px;
background: #33e0c4;
width: 6.5em;
line-height: 2.3em;
padding-left: 13px;
margin: auto;
text-align: left;
color: #fafafa;
}

#botonera li:hover a {
opacity: 1;
}

#botonera li:hover:before {
opacity: 0;
}


#botonera li:before{
content: "LUNES"
}

.agenda{

background-color: #e2e2e2;
align-content: center;
text-align: center;
height: 20.7em;
width: 1200px;
margin: auto;
margin-top: -23em;
overflow-y: hidden;
overflow-x: scroll;
padding-bottom: 3.5em;
}

.agenda img{
margin: auto;
background-color: #000000;
opacity: 1;
}



/*********************************************************************************/
/* Noticias                                                                        */
/*********************************************************************************/

.section3{
background: #FFF;
margin-top: -2em;
border: solid 1px #d1d1d1;
max-width: 1280px;
margin: auto;
align-content: left;
text-align: left;
}

.now h6{
width: 40%;
}

.section3 p{
text-align: left;
}

.section3 img{
float: left;
height: 375px;
margin-left: 50px;
margin-top: 50px;
margin-right: 20px;
}

.section3 #botones{
width: 100%;
text-align: left;
padding-bottom: 1em;
}

.section3 .boton{
display: inline-block;
padding: 1em;
padding-left: 2em;
padding-right: 2em;
border: solid 2px #3e3e3e;
color: #3e3e3e;
margin: 2em;
align-content: center;
text-align: center;
}

.section3 .boton:hover{
opacity: .5;
}

/*********************************************************************************/
/* Noticias                                                                        */
/*********************************************************************************/

#noticias
{
background-color: #f1f1f1;
width: 100%;
max-width: 1280px;
margin: auto;
text-align: center;
}

#noticias .box
{
display: inline-block;
text-align: left;
background: #FFF;
padding: 1.4em;
width: 350px;
margin-top: 2em;
font-size: 0.95em;
margin-bottom: 2em;
border: solid 1px #d1d1d1;
}

#noticias #mid{
margin-left: 30px;
margin-right: 30px;
}

#noticias .box img{
float: left;
margin-right: 1em;
width: 141px;
}

#noticias .box .share{
float: left;
margin-top: .4em;
width: 100px;
}


/*********************************************************************************/
/* Mapa                                                                        */
/*********************************************************************************/

.mapa{
width: 100%;
align-content: center;
text-align: center;
margin-bottom: 2em;
}


.mapa iframe{
border: 5px solid #dddddd;
}


/*********************************************************************************/
/* Form                                                                        */
/*********************************************************************************/


/*form styles*/
#msform {
width: 600px;
margin: 00px auto;
text-align: center;
position: relative;
padding-top: 1em;
}
#msform fieldset {
background: white;
border: 0 none;
border-radius: 3px;
box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
padding: 20px 30px;

box-sizing: border-box;
width: 100%;

/*stacking fieldsets above each other*/
position: absolute;
}
/*Hide all except first fieldset*/
#msform fieldset:not(:first-of-type) {
display: none;
}
/*inputs*/
#msform input, #msform textarea {
padding: 15px;
border: 1px solid #ccc;
border-radius: 3px;
margin-bottom: 10px;
width: 100%;
box-sizing: border-box;
font-family: montserrat;
color: #2c504f;
font-size: 13px;
margin-top: 15px;
}
/*buttons*/
#msform .action-button {
width: 100px;
background: #33e0c4;
font-weight: bold;
color: white;
border: 0 none;
border-radius: 1px;
cursor: pointer;
padding: 10px 5px;
margin: 10px 5px 40px;
}
#msform .action-button:hover, #msform .action-button:focus {
box-shadow: 0 0 0 2px white, 0 0 0 3px #27AE60;
}
/*headings*/
.fs-title {
font-size: 15px;
margin-top: 1em;
text-transform: uppercase;
color: #33e0c4;
margin-bottom: 10px;
}
.fs-subtitle {
font-weight: normal;
text-align: left;
font-size: 13px;
color: #666;
margin-bottom: 20px;
}
/*progressbar*/
#progressbar {
margin-bottom: 30px;
overflow: hidden;
/*CSS counters to number the steps*/
counter-reset: step;
}
#progressbar li {
list-style-type: none;
color: white;
text-transform: uppercase;
font-size: 15px;
width: 33.33%;
float: left;
position: relative;
}
#progressbar li:before {
content: counter(step);
counter-increment: step;
width: 20px;
line-height: 20px;
display: block;
font-size: 10px;
color: #333;
background: white;
border-radius: 3px;
margin: 0 auto 5px auto;
}
/*progressbar connectors*/
#progressbar li:after {
content: '';
width: 100%;
height: 2px;
background: white;
position: absolute;
left: -50%;
top: 9px;
z-index: -1; /*put it behind the numbers*/
}
#progressbar li:first-child:after {
/*connector not needed before the first step*/
content: none; 
}
/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbar li.active:before,  #progressbar li.active:after{
background: #33e0c4;
color: white;
}


/*********************************************************************************/
/* Contacto                                                                        */
/*********************************************************************************/

.formcontacto{
float: left;
margin-left: 1em;
width: 40%;
padding-top: 8.2em;
}
.formcontacto input, textarea {
padding: 10px;
margin-right: 2em;
margin-bottom: 1em;
border: 1px solid #E5E5E5;
width: 200px; 
color: #999999;
box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
-moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
-webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;		
}

textarea {
width: 800px;
height: 150px;
margin-left: 8px;
max-width: 500px;
line-height: 18px;
}

input:hover, textarea:hover,
input:focus, textarea:focus {
border-color: 1px solid #C9C9C9;
box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;	
}

.formcontacto label {
float: left;
margin-left: 10px;
color: #f4f4f4;
}

/* ===========================
====== Submit Button ====== 
=========================== */

.submit input {
width: 100px; 
height: 40px;
background-color: #01ddbc; 
color: #FFF;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;		
}

.mapa iframe{
width: 95%;
max-width: 1270px;
}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

footer
{
padding-top: 2em;
height: 180px;
background-color: #1f1f1f;
}

#footer input{
float: none;
margin: 0;
width: 67%;
margin: auto;
}

footer #footer{
display: block;
width: 95%;
max-width: 1280px;
margin: auto;
}
#footer .mapadesitio{
width: 20%;
display: inline-block;
font-family: 'Open Sans';
font-weight: 300;
float: left;
}
#footer .mapadesitio ul{
padding: 0px;
display: inline-block;
list-style: none;
color: #898989;
font-size: .8em;
text-transform: uppercase;
font-weight: 300;
}

#footer .mapadesitio>ul>li{
margin-top: .1em;
}

#footer .social{
width: 50%;
float: left;
margin-left: 5%;
}

#footer .social ul{
list-style: none;
padding: 0px;
text-align: center;
}

#footer .social ul li{
width: 20%;
display: inline-block;
margin-right: 2%;
}

#footer .social ul li img{
width: 40%;
max-width: 64px;
}

#footer p{
text-align: center;
}

#footer .catedra{
float: right;
text-align: right;
padding-top: 1em;
}