*{text-align: center; margin: 0 }
*{font-family: 'Roboto', sans-serif;}

/*Barra de navegacion*/
header {background-color: #242424; 
    width: 100%;
    height: 45px; 
    margin: 0;}

ul li  {list-style-type: none; 
    display:inline-table;
  text-align: center}

ul li a  {
    margin-top:0;
    text-align: center;
    text-decoration: none; 
    padding: 1rem 1rem 1rem 1rem; 
    color: white;}

.menu {
    text-align: center;
    list-style: none;
    float: center;
    padding: 0px;
    margin: 0;
    color: white;
    display: block;
    }

.menu a {  
    display: block;
    float: center;
    width: 100%;
    height: 45px;
    margin: 0rem;
    font-weight: 300;
    box-sizing: border-box;
    text-decoration: none;
    color: white;}

.menu a:hover {
    border-bottom: 5px solid white;
    width: 100%}

/*Cuerpo*/
body {background: #f2a800; 
    margin: 0;
	padding-bottom: 0rem;
    box-sizing: content-box; 
    color: white}

img {margin: 1.5rem 2rem 1rem 2rem; border-radius: 1rem; }

h1 {margin:0rem 0rem 1.5rem 0rem ;
    font-size: 2rem}

/* Nivel 1 y 2 */
    
.columnas{
       
    display:inline-flex;
    float: none;
    text-align: center}

.columnas li {display: block;
float: none;
text-align: left}

.lista{
    font-size: 0.9rem;  
    color: white;
}

.materias{
    font-size: 0.9rem;
color: white; 
}

h3 { background-color: #242424; box-sizing: content-box}



/* Pie de pagina */
footer{background: #242424; 
    border: 0.5rem; 
    position:static;
    bottom: 0;
    margin-top: 1.5rem}

footer p {
    color:#7e7e7e; 
    text-align: center; 
    font-size: 0.6rem; 
    padding: 1rem 2rem 1rem 2rem;
    border-bottom: 0;
    }
    

 
@media(max-width:360px)
{
    body {transition: 2s;
    background-image:url(../img/1463337291979.jpg);}
    
    .menu a {font-size: 7px; 
        display: block; 
        margin: -0.2rem; }
    
    .menu{display: block; 
        padding: 0.5rem ;
    float:center; 
        margin-left: -2rem; 
        margin-top: -0.8rem; 
        overflow: hidden;}  
    
.menu a:hover {
   background-color: rgba(242, 168, 0, 0.56);
    border-bottom: 2px solid white; }



.columnas li {color:#000;}
    
.columnas {
    background-color: rgba(126, 126, 126, 0.28); 
    padding-top: 10px;
    padding-right:10px;
    padding-bottom:10px;
    padding-left: -5px;
    margin-bottom: 1rem;
    display:inline-flex;
    float: none;
    text-align: center}
    
.columnas li {
    font-size: 13.5px;
    display: block;
    float: left;
    text-align: left}

h1 {color: black; 
    margin-bottom: 10px}


h3 {margin-bottom: 10px;}
}
    }