html, body {
  margin: 0;
  min-height: 100%;
}

body {
  background: #ffcc66;
  color: #000;
  font: normal 10pt Verdana, Arial, sans-serif;
}

.site {
  display: grid;
  grid-template-columns: 40px 120px 440px 2px 100px;
  width: 702px;
  min-height: 100vh;
  background: #fff;
}

.spacer {
  background: #ffcc66;
}

.navigation {
  background: #ffcc66 url("images/left_stripe.gif") repeat-y;
}

.navigation .upper-left {
  display: block;
}

.navigation a,
.navigation img {
  display: block;
  border: 0;
}

.content {
  width: 440px;
  background: #fff;
}

.masthead {
  height: 113px;
  background: url("images/header_background.gif") repeat;
}

.masthead .lloyd {
  width: 145px;
  height: 111px;
}

.masthead .gap {
  width: 46px;
  height: 111px;
}

.masthead .logo {
  width: 249px;
  height: 111px;
}

.masthead .bar {
  display: block;
}

.page-copy {
  padding: 30px;
  background: #fff;
}

.page-copy::after {
  display: block;
  clear: both;
  content: "";
}

.edge {
  background: #000;
}

.edge img {
  display: block;
  width: 2px;
  height: 113px;
}

.right-stripe {
  background: #ffcc66 url("images/right_stripe.gif") repeat-y;
}

.product-photo {
  float: right;
  width: 182px;
  margin: 0 0 10px 12px;
}

.order-photo {
  display: block;
  max-width: 100%;
  margin: 0 auto 10px;
}

.header {
  color: #f00;
  font: bold 12pt Times, "Times New Roman", serif;
}

.minorheader {
  color: #f00;
  font-weight: bold;
}

a {
  color: #00f;
  font-weight: bold;
  text-decoration: none;
}

a:visited {
  color: #00f;
}

a:hover {
  color: #ffcc66;
}

@media (max-width: 720px) {
  .site {
    grid-template-columns: 120px minmax(0, 440px) 2px;
    width: min(562px, 100%);
  }

  .spacer,
  .right-stripe {
    display: none;
  }

  .content {
    width: 100%;
  }

  .masthead {
    overflow: hidden;
  }
}

@media (max-width: 560px) {
  .site {
    display: block;
    width: 100%;
  }

  .navigation {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    background-image: none;
  }

  .navigation .upper-left {
    display: none;
  }

  .masthead {
    display: none;
  }

  .edge {
    display: none;
  }
}