.bodyrules {
    max-width: 800px; 
    width: 90%; 
    background-color: #eaf6ff; 
    margin-left: auto;
    margin-right: auto; 

}
 

li {
    list-style: none; 
}  

aside { 
    
    margin: 10px; 
    font-size: 0.8rem; 
    
} 

.genflex {
    padding-left: 0; 
    display: flex; 
    flex-wrap: wrap; 
    
}  

.flextwo{
    padding-left: 0; 
    display: flex; 
    flex-wrap: wrap;

}  

.genflex aside {
    width: 170px;
}

.flextwo li {
    width: 100%; 
    
}

@media( min-width: 480px) {
    .flextwo li {width: 50%;}

} 

@media( max-width: 500px) {
    h1 {font-size: 1.5rem;}
} 
@media (min-width: 640px) {
    h1 {font-size: 2.5 rem;}
    .flextwo li {width: 25%;} 
    html { background-color: #eaf6ff;} 
}