/* Global */
body { 
    font-family: Arial, sans-serif; 
    margin: 0;
    padding: 0; 
    background: white; 
    color: black;
}

header, nav, main, footer { 
    padding: 1rem; 
}

/* Medium screens */
@media only screen and (min-width: 600px) {
 nav ul { 
    display: flex; 
    gap: 1rem; 
}
 body {
    background: grey;
}
}

/* Large screens */
@media only screen and (min-width: 900px) {
 body {
    max-width: 900px; 
    margin: auto; 
    background: black; 
    color: white;
}
 h1 { 
    font-size: 3rem; 
}
}

/* Extra large */
@media only screen and (min-width: 1200px) {
  body {
    background: white;
    color: black;
}
}