#credits {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  font-style: italic;
  text-align: center;
}
h1 img { max-width: 96%; height: auto }
@media screen and (min-width: 760px) {
#intro {
  background-image: url(images/covers.jpg);
  width: 749px;
  height: 608px;
}
#intro h1 {
  position: absolute;
  left: 80px;
  top: 130px;
}
#intro p {
  background-color: black;
  color: white;
  -moz-opacity: 0.8;
  opacity: 0.8;
  position: absolute;
  left: 200px;
  top: 500px;
  width: 500px;
  padding: 10px;
}
}
#coverstory { background-color: #ff5757; color: white; padding: 0.5em; }
#coverstory h2 { background-color: yellow; color: pink; }
h2 { background-color: yellow; color: green; }
div.clear { clear: both; }
#unclear { background-color: #3333CC; color: white; padding: 0.5em; }
#unclear h2 { background-color: yellow; color: red; }
#unclear div.image { float: left; width: 190px; margin-right: 1em }
#unclear div.caption { background-color: white ; color: black; padding: 0em 0.3em; }
#codenamemat { background-color: yellow; color: black; padding: 0.5em }
#codenamemat h3 { background-color:black ; color: red; padding: 10px }
#codenamemat div.image { float: right; width: 230px ; }
#codenamemat div.caption { background-color: white ; color: black; padding: 0px 5px;}
#zzap64 { float: right; }
#timeline { background-color: #3333FF; color: white; padding: 5px; }
#timeline h3 {background-color: yellow; color: black; margin: 0px -5px; }
#timeline a { color: white; font-weight: bold; }
#timeline a:visited { color: gray; font-weight: bold; }
@media screen and (min-width: 600px) {
#coverstory { width: 40%; float: left; margin-right: 1em; }
#codenamemat { width: 40%; float: right; margin-left: 1em; }
#unclear { width: 40%; float: left; margin-right: 1em; }
}
