body {color: black; background: white}
img.ill2 {float: right; margin: 0 0 0 1em}
img.ill1 {float: left; margin: 0 1em 0 0}
h2 {color: orange}

/* Default layout */
body {margin: 1em 1em 2em 11em}
.menu {float: left; width: 9em; margin: 0 0 0 -10em; padding: 0 0 0 1em}

/* Narrow screen */
@media all and (max-width: 30em)
{
  body {margin: 1em}
  .menu {float: none; margin: 1em 0}
  h2 {color: red; text-align: center}
}

/* Wide screen */
@media all and (min-width: 60em)
{
  body {margin: 1em 1em 2em 1em}
  h2 {float: left; width: 20%; margin: 0 5% 0 0; color: green}
  .menu {float: right; width: 20%; margin: 0 0 0 5%}
  .main {float: right; width: 49%; margin: 0}
  h3 {margin: 0 0 1em 0}
}