body { max-width: 1080px; }
img { max-width: 100%; margin: auto; }
p { text-align: center }

main { padding: 1em;  }
main p {text-align: left }
main a { color: blue }
h1 { font-size: 1em; padding: .5em }

a:hover { opacity: .7 }
a { color: black; text-decoration: none }

ul {
  position: absolute; 
  top: 2em; 
  left: 0;
  max-width: 150px;
  padding: 0;
  padding-left:10px;
  padding-right: 10px;
}

nav { padding: .5em }

li { max-width: 150px; display: block; text-align: center; margin-bottom: 1em;
  border: 2px solid black; padding-bottom: .25em ; background: white 
}
div { margin-left: 165px }

@media only screen and (max-width: 860px) {

li { text-align: center; display: inline-block; list-style-type: none; margin-bottom: 1em; max-width: 31%; vertical-align: top }
ul { text-align: center; padding: 0; position: relative; max-width: 100% }
div { margin-left: 0 }
body {margin: auto }

}