/* reseteo universal*/
*{
	border: 0;
	margin: 0;
	padding: 0;
}

/*estilos del sitio*/
body{
	font-family: Arial, Helvetica, Verdana;
    font-size: 1em;
    width: 100%;
    height: 100%;
}

header, footer{
    background: black;
	margin: 0 auto;
	text-align: center;
    font-size: 0.66em;
    z-index: 999;
}

img{
	max-width: 100%;
}

a{
	text-decoration: none;
}

a:hover{
	text-decoration: none;
}

ul{
	display: inline-block;
    list-style: none;
}

li{
    display: inline-block;
}
/*********COMIENZO HEADER********/

header{
    width: 100%;
    height: 100%;
    position: relative;
    
}

header a{
    color: white;
}

#botones1{
    color: white;
	display: inline-block;
	list-style: none;
    margin: 0 auto;
	text-align: left;
	width:59%;
}

#botones1 ul{
    margin: 0em 2em 0.3em 2.5em;
}

#botones1 ul li{
    display: inline-block;
    margin: 0 auto;
    padding: 0.5em 1em 0em 1em;
}

#botones1 li:hover{
    text-decoration: underline;
}

#social{
	display: inline-block;
	text-align: right;
	width: 38%;
}

#social li{
	display: inline-block;
    margin: 0 auto;
    margin: 0.5em 0em 0em 1em;
	text-align: right;
}

#social li:hover{
    text-decoration: underline;
}

li#facebook{
    padding: 0em;
}

li#facebook:hover{
    padding: 0em;
    text-decoration: none;
}

/*Lineas de la cabecera*/

#cuadrito{
    border: #fff 1px solid; 
    bottom: 0.51em;
    margin-left: 1.3em;
    padding: 0.8em;
    position: absolute;
}

hr{
	background: white;
}

.primero{
	height: 5em;
	margin: 0 0 0 2.2em;
	width: 0.1em;
	position: absolute;
}

#segundo{
	background: white;
	height: 0.05em;
    margin: 0 0 1.3em 0;
	width:100%;
}

/*********FINAL HEADER********/

/*********COMIENZO FOOTER***********/

footer{
    width: 100%;
    bottom: 0px;
    position: fixed;
}

footer a{
    color: white;
}

#botones2{
	display: inline-block;
	list-style: none;
	margin: 0 auto;
	text-align: left;
	width:53%;
}

#botones2 ul{
     margin: 1em 0em 0.9em 4.3em;  
}
    
#botones2 ul li{
    display: inline-block;
    padding: 0em 1.2em 0em 0em;
}

#botones2 li:hover{
    text-decoration: underline;
}

#copyright{
    color:  white;
	display: inline-block;
	text-align: right;
    letter-spacing: 0px;
	width: 46%;
}

#copyright li{
    margin-right: 1em;
}

/*********FINAL FOOTER***********/


@media(max-width:1024px){
    body{
        overflow: visible;
    }
    
    #botones2{
        display: inline-block;
        margin-bottom: 1em;
        text-align: center;
        width:100%;
    }
    
    #botones2 ul{
         margin: 2em 0em 0.5em 0em;  
    }
    
    #copyright{
        display: inline-block;
        text-align: center;
        width:100%;
    }
    
    footer{
        width: 100%;
        bottom: 0px;
        position: inherit;
        padding-bottom: 2em;
    }
    
}

@media(max-width:800px){
    #botones1{
        display: inline-block;
        text-align: center;
        width:100%;
    }
    
    #botones1 ul{
        width: 100%;
        margin: 1em 0 0 0;
    }
    
    #botones1 li{
        margin: 0 auto 0.5em auto;
        padding: 1em 0em 1em 0em;
        text-align: center;
        width:15%;
    }
    
    #botones2 ul{
        width: 100%;
         margin: 2em 0em 0.5em 0em;  
    }
    
    #botones2 ul li{
        margin-bottom: 1em;
    }
    
    #social{
        text-align: right;
        width: 100%;
    }
    
    #social ul{
        padding: 0em 1em 0em 0em;
    }
    
    #social li{
        line-height: 2em;
    }
    
    .primero{
        height: 7em;
    }
    
    #copyright{
        width: 80%;
    }

}

@media(max-width:600px){
    #botones2 li{
        width: 80%;
        padding: 0.5em 0em 0.5em 0em;
    }
        
}