/*list-style es para sacar las viñetitas molestas de todas las listas y el margin 0 y pading 0 es para que se me resetee los margenes de toda la pagina*/

*{list-style: none; margin:0 ; pading: 0 }

/* puse en el html un tipo class en un div para que en el css pueda poner que toda la pagina sea de 960px y ademas se centre */

.alineacion { 
    width: 960px;
    margin: 0 auto 0 auto}
              
/* width es el ancho se expresa en ( % )
   height es el alto se expresa en ( px )*/


/* x ahora no va
header{ 
    background:#57A71D ;
    position: relative; 
    float: right;
    width: 95.55%;
    height: 135.34px;
box-sizing: border-box;
    margin: 3.5%}
 */


.baner { 
    width: 100%;
    position: relative;
    float: right}
          
nav{  
    background: #ffffff;
    margin: 2px;
    padding: 1px;
    position: relative;
    float: right;}

/* display: inline es para que la lista se ponga una al lado de la otra*/

nav ul li {display: inline; }

/* text-decoration: none es para que se le salga el subrayado a los enlases*/

nav ul li a{ 
    text-decoration: none;
    color: #7b7b7b;
    font-family: arial;
    font-size: 13px; }


main { width: 100%}
    

/* estos son los distintos articulos con sus distintas medidas*/

.pasafotos {
    position: relative;
    float: left;
              }

.video {
    position: relative;
    float: left;
    min-height: 400px;
    width: 55%;
                        box-sizing: border-box; margin: 0.5% ; }


/* border-top-style: solid-- esto lo encontre en internet, es para poner un borde arriba, esto lo necesitaba por que mi propuesta lo tenia, no lo dieron en clase */

.noticia {
    position: relative; 
    float: left;
    min-height: 341px;
    width: 23%;
    box-sizing: border-box;
    margin: 0.55% ;
    padding: 1%;
    border-top-style: solid;
    color: #ff8900;}

.titulosec{
    font-family: FagoNo Black;
    font-size: 23px;}

.cuerpo {
    font-family: helvetica;
    font-size: 11px;
    color: #000000;
}

.boton{ 
    position: absolute;
    top: 76px;
    left: 0px;
}



.botonr {
    position: relative;
    float: right;
}
        
        

.agenda {
    position: relative;
    float: left ;
    min-height: 341px;
    width: 18%; 
    box-sizing: border-box;
    margin: 5.3px ; 
    padding: 0;
    border-top-style: solid;
    color: #6901c3;}



#numero {
    font-family: FagoNo Black;
    font-size: 35px;
    position: relative;
    float: left;
    
}

#mes {
    font-family: FagoNo Black;
    font-size: 35px;
    color: #484848;}

.ganchito { 
    position: absolute;
    top: 165px;
    left:  9px;
}

/* el margin-top lo encontre en internet,  es para que entre dos div pueda haber un espaciado con una medida en px*/

.cuadrado2 {
    background: #ededed;
    width: 94%;
    height: 54px;
    margin-top: 1px;
}


.redes {
    border-top-style: solid;
    color: #47affc;
    position: relative;
    float: left;
    min-height: 179px;
    width: 43%;
    box-sizing: border-box;
    margin: 0.4% ;
    padding: 0;}



.tituloface {
    background: #47affc;
    width: 100%;
    height: 21px;
   
}
    
.titulof {
    font-family: helvetica;
    font-size: 15px;
    color: rgb(247, 247, 247);
        
}