body {
  background: url("/assets/mazebg.png");
}
header {
  text-align: center;
  font-family: sans-serif;
}
a:hover {
   font-style: oblique;
}
header > h1 {
   font-weight: normal;
}
main {
   padding-left: 0.7em;
}
footer, nav {
   text-align: center;
}
figure > a > img {
   width: 90%;
}
figcaption {
   font-family: sans-serif;
}

#container {
   background: rgba(200, 200, 200, 0.9);
   margin-top: 1em;
   margin-left: 2em;
   padding: 0.5em;
   border: 2px inset #307D7E;
   max-width: 60em;
}
.panel {
   background: rgb(230, 230, 230);
   padding: 0.5em 1em;
   margin-top: 1em;
   margin-left: 0.7em;
   margin-right: 10%;
   text-align: justify;
   font-style: oblique;
   letter-spacing: 1px;
   clear: both;
}
.panel-right {
   margin-left: 10%;
   margin-right: 0.7em;
}
.illustration {
   float: left;
   padding: 0.7em;
}
.inline-img {
   position: relative;
   top: 0.7em;
   max-height: 2.1em;
}
.main-nav {
   font-size: 1.5em;
   padding: 0.3em 1em;
   padding-bottom: 0.6em;
   color: navy;
}
.attention {
   color: IndianRed;
}
.rating-box {
   width: 25em;
   border-width: 2px;
   border-style: inset;
   padding: 0.5em;
   margin-left: 2em;
   background: #575757;
   background: linear-gradient(90deg,rgba(87, 87, 87, 1) 0%, rgba(122, 131, 158, 1) 50%, rgba(245, 245, 245, 1) 100%);
}
.rating-note {
   text-align: center;
   font-weight: bold;
   font-size: 1.4em;
}