*{padding: 0; margin: 0; font-family: Futura Text;}
@font-face {
    font-family: 'Futura Text'; /*a name to be used later*/
    src: url('fonts/FuturaExtended.ttf'); /*URL to font*/
}
@font-face {
    font-family: 'Futura Bold'; /*a name to be used later*/
    src: url('fonts/Futura Koyu.ttf'); /*URL to font*/
}

header{ background-color: #fff;
        position: relative; 
        text-align: center;
        box-shadow: 0px 0px 20px 0px #000000;
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 225px;
    
}
.barra_roja{ background-color: #ff0000;
            height: 40px;
}
.pagina{
    width: 80%;
    max-width: 960px;
    margin: 0 auto 0 auto;
    text-align: center;
}
.logosn{
    position:relative;
    float: left;
    margin: 5px 20px 5px 0px;
}

/* hovers header*/

#fb{
    background-image: url('img/fb.png');
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;
}
#fb:hover{
    background-image: url('img/facebook_hover.png');
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;

}
#tw{
    background-image: url('img/tw.png');
    height: 30px;
    width: 37px;
    background-repeat: no-repeat;
}
#tw:hover{
    background-image: url('img/tw_hover.png');
    height: 30px;
    width: 37;
    background-repeat: no-repeat;

}
    

#yt{
    background-image: url('img/yt.png');
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;

}
#yt:hover{
    background-image: url('img/yt_hover.png');
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;

}
#search { margin: 5px 0 0 0;
        position: relative;
        float: right;
        

}

#search input[type="text"] {
    background: url(img/lupa.png) no-repeat 5px 5px#ffffff;
    font: Futura text;
    font-size: 15px;
    width: 225px;
    padding:0px 15px 0px 35px;
    border: 0px;
    height: 30px;
    }


#logo {
    margin: 20px auto 10px auto;
    width: 149px;
    height: 87px;
    background: url(img/logo.gif) 0px -90px;
    overflow: hidden;
    background-repeat: no-repeat;
}
#logo:hover{
    margin: 20px auto 10px auto;
    width: 149px;
    height: 87px;
    background: url(img/logo.gif) 0px 0px;
    overflow: hidden;
    background-repeat: no-repeat;
}
#sublogo{
    letter-spacing: 5px;
}


header nav ul {
	padding: 5px 0px;
	list-style: none;
	position: relative;
	display: inline-table;
    
}

header nav ul li {
	float: left;
}

header nav ul li a {
		display: block;
		color: #000000; 
        text-decoration: none;
        margin: 0 auto 0 auto;
        padding: 15px 30px;
        font-size: 20px;
        font-family: Futura Bold;
        font-size: 15px;
        
}
header nav ul li a:hover{
    color: #ff0000;
}
#noticias{
     background-image: url('img/flecha_abajo.png');
    background-repeat: no-repeat;
    background-position: right;
}
#noticias:hover{
    background-image: url('img/flecha_abajo_hover.png');
    background-repeat: no-repeat;
    background-position: right;

}

header nav ul ul {
	display: none;
}

header nav ul li:hover > ul {
		display: block;
}

header nav ul:after {
		content: ""; clear: both; display: block;
}

header nav ul ul {
	background: #ffffff;
    margin: -17px 0 0 0;
	position: absolute; 
    top: 100%;
}
header nav ul ul li {
		float: none;
		position: relative;
        text-align: left;
        border-top: 2px solid #2ce7ff;
	}
header nav ul ul li a {
			padding: 15px 15px;
			color: #000000;
		}	
			nav ul ul li a:hover {
				color: #ff0000;
			}

header nav ul ul ul {
	position: absolute; 
    left: 100%; 
    top:0;
}

/*termina header*/
body{ background-color: #2ce7ff;

}
.espacio_arriba{
    height: 230px;
    background-color: #fff;
    width: 100%;
}
main{width: 100%;
    max-width: 960px;
    background-color: #fff;
    position: relative;
    text-align: left;
    
}
section{background-color: #fff;
        position: relative;
        float: left;
        align-content: center;
        width: 100%
}

section article{background-color: #fff;
                width: 95%;
                position: relative;
                float: left;
                margin: 20px 2.5% 10px 2.5%;
                min-height: 100px;
}
h4{ font-size: 18px;
    font-family: Futura Bold;
    position: relative;
    float: left;
}
.imgcentro{ position: relative;
            float: left;
            
}

.titulo_noticia{background-color: #2ce7ff;
                padding: 5px 5px 5px 5px;
                width: auto;
                font-family: Futura Bold;
                color: #fff;
                position: absolute;
                margin: 37% 0 0.5% 2.5%;
                font-size: 20px;
                letter-spacing: 2px;
}
.texto_noticia{background: rgba(0, 0, 0, 0.4);
                padding: 10px;
                width: 45%;
                font-family: Futura text;
                color: #fff;
                position: absolute;
                margin: 43% 0 0.5% 2.5%;
}
.separador {width: 100%;
            clear: both;
            position: relative;
            float: left;
}
.leer_mas{background-color: #ff0000;
            padding: 10px;
            position: relative;
            float: left;
            margin: 59.5% 0 2.5% -97.5%;
            font-size: 15px;
            font-family: Futura Bold;
            color: #fff;
            text-decoration: none;
            
}
.misc1{
    position: relative;
    float: right;
    margin: 56.5% 0.5% 2.5% -10%;
}
.misc2{
    position: relative;
    float: left;
    margin: 0.5% 0 2.5% -99.5%;
}

main aside{
    background-color: #ffffff;
    position: relative;
    width: 95%;
    position: relative;
    float: left;
    padding: 10px 2.5% 20px 2.5%;
}

.videos{
    width: 23%;
    min-height: 40px;
    margin: 1% 2% 1% 0;
    box-sizing: border-box;
    position: relative;
    float: left;
    font-size: 13px;
}
.video_grande{
    width: 73%;
    min-height: 40px;
    margin: 1% 2% 1% 0%;
    box-sizing: border-box;
    position: relative;
    float: left;
    font-size: 13px;
}
.banda_video{
    height: 100px;
    width: 100%;
    background: #ffd906;
    position: absolute;
    margin: -65px 0 0 0;
    z-index: 2;

}
.banda_videochico{
    height: 30px;
    width: 60%;
    position: absolute;
    margin: -42px 0 0px 13px;
    background-color: #b506de;
}
.txt_chico{
    font-family: futura bold;
    color: #fff;
    font-size: 10px;
    padding: 6px;
}
#titulo_video{
    color: #000;
    font-size: 20px;
    letter-spacing: 1px;
    font-family: Futura Bold;
    padding: 10px 10px 5px 10px;
}
#texto_video{
    color: #000;
    font-size: 12px;
    padding: 0 10px 0 10px;
}
.play_grande{
    position: absolute;
    margin: 0 0 0 0;
    z-index: 3;
    background-image: url(img/boton_play.png);
    width: 100px;
    height: 100px;
    margin: -300px auto 0 0;
    margin-left: auto;
	margin-right: auto;
	left:0;
	right:0;
}
.play_chico{
    position: absolute;
    margin: 0 0 0 0;
    z-index: 3;
    background-image: url(img/boton_play_sm.png);
    width: 50px;
    height: 50px;
    margin: -110px auto 0 0;
    margin-left: auto;
	margin-right: auto;
	left:0;
	right:0;
}
footer{
    background-color: #ffffff;
    width: 100%;
    margin: 1% 1% 1% 0;
    position: relative;
    float:left ;
    font-size: 12px;
    color: #939292;
    padding: 20px 0 15px 0px;
    margin: 10px 0 0 0
}

footer article{
    padding: 15px 15px 15px 2.5%;
    position: relative;
    float: left;
    width: 45%
}
h5{
    font-size: 15px;
}
#socio1{
        background-image: url(img/polos.jpg);
        width: 140px;
        height: 85px;
        position: relative;
        float: left; 
}
#socio2{
        background-image: url(img/Colsecor.jpg);
        width: 140px;
        height: 85px;
        position: relative;
        float: left; 
}
#socio3{
        background-image: url(img/fecoop.jpg);
        width: 140px;
        height: 85px;
        position: relative;
        float: left; 
}
#socio4{
        background-image: url(img/AATECO.jpg);
        width: 140px;
        height: 85px;
        position: relative;
        float: left; 
}
#socio5{
        background-image: url(img/trama.jpg);
        width: 140px;
        height: 85px;
        position: relative;
        float: left; 
}