body {
  background-image: url("../img/part0-bg.jpg");
  background-repeat: repeat;
  background-position: center center;
  background-size: 50%;
  font-family: sans-serif;
  min-height: 100vh;
}

#part0 header {
  width: 70%;
  margin: 0 auto;
  margin-top: 5vh;
}

#part0 header h2 {
  margin: 0;
  text-align: center;
  font-size: 2.4vmax;
}

.part-block,
#intro-text {
  width: 70%;
  margin: 2vmax auto;
  padding: 5vmax;
  background-color: #fff;
  font-size: 1.8vw;
}

@media all and (orientation: portrait) {
  #intro-text {
    font-size: 4vw;
  }
}

#parts-links {
  max-width: 920px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: 1fr;
  grid-gap: 1vw;
  margin: 0 auto;
}

#parts-links::before {
  content: '';
  width: 0;
  padding-bottom: 100%;
  grid-row: 1 / 1;
  grid-column: 1 / 1;
}

#parts-links > *:first-child {
  grid-row: 1 / 1;
  grid-column: 1 / 1;
}

#parts-links > .part-link {
  overflow: hidden;
  box-shadow: 3px 3px 6px rgba(0,0,0,0.7);
}

#parts-links > .part-link .part-description {
  top: 100%;
  transition: top 1s ease-out 0.2s;
}

#parts-links > .part-link:hover .part-description,
#parts-links > .part-link:active .part-description {
  top: 0;
}

#parts-links > .part-link .part-description {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.7);
}

#parts-links > .part-link .part-description p {
  color: #fff;
  font-weight: bold;
  margin: 0;
  height: 50%;
  top: 50%;
  width: 100%;
  text-align: center;
  font-size: 2vmax;
}

#parts-links > .part-link .part-description p.part-name {
  padding-top: 5%;
}

#parts-links > .part-link .part-description p.part-number {
  top: 0;
  width: 50%;
  margin: 0 auto;
  border-bottom-color: #fff;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

#parts-links > .part-link {
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  cursor: pointer;
}

#parts-links > .part-link.one {
  background-image: url("../img/part-link-1.jpg");
}

#parts-links > .part-link.two {
  background-image: url("../img/part-link-2.jpg");
}

#parts-links > .part-link.three {
  background-image: url("../img/part-link-3.jpg");
}

#parts-links > .part-link.four {
  background-image: url("../img/part-link-4.jpg");
}

#part0 footer {
  font-size: small;
  text-align: center;
  font-style: italic;
  width: 50%;
  margin: 0 auto 2vmax auto;
  font-weight: bold;
}

#part1 .part-header {
  background-image: url("../img/part-link-1.jpg");
}

#part2 .part-header {
  background-image: url("../img/part-link-2.jpg");
}

#part3 .part-header {
  background-image: url("../img/part-link-3.jpg");
}

#part4 .part-header {
  background-image: url("../img/part-link-4.jpg");
}

.part-block .part-header {
  /*border: 2px solid #000;*/
  width: 50%;
  max-width: 200px;
  margin: 0 auto;
  border-radius: 50%;
  box-shadow: inset 3px 3px 6px rgba(0,0,0,0.7);
  background-position: center center;
  background-size: cover;
}

@media all and (orientation: portrait) {
  .part-block {
    font-size: 4vw;
  }
}

.part-block .part-header:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.part-block h2 {
  text-align: center;
  font-size: 3vw;
  width: 70%;
  margin: 0 auto;
}

.part-block .nav {
  font-style: italic;
  margin: 0;
  font-size: small;
  text-align: center;
}