h1 {
  /*text-align: left;*/
}

section {
  margin-top: 9rem; /* 5 * line height (1.8) */
  padding: 0 3rem; /* 150% of space between columns */
  margin-bottom: -2.7rem; /* to compensate bottom padding of child elements */
}

/* laptop
   ------------------------------ */

.placeholder {
  background: url('Apple-Macbook-Gold.png') center no-repeat;
  background-size: auto 100%;
  padding: 0 3rem;
}

.placeholder__image {
  max-width: 60rem;
  vertical-align: bottom;
  width: 100%;
}

.screenshot {
  left: 3.7%;
  position: absolute;
  right: 3.7%;
  top: 6.95%;
}

.screenshot__image {
  width: 100%;
  max-width: 55.466666667rem; /* 832px / 15 */
  vertical-align: bottom;
}

/* other
   ------------------------------ */

.button {
  -webkit-font-smoothing: antialiased;
  background: #333;
  border: none;
  border-radius: .225rem;
  color: #fff;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.2rem;
  display: inline-block;
  padding: .9rem 0;
  width: 10rem;
}

.note {
  color: #999;
  display: none;
  margin-top: 2.7rem;
}

@media (max-width: 990px) {

  :root {
    font-size: 12px;
  }

}

@media (max-width: 600px) {

  :root {
    font-size: 15px;
  }

  h1 {
    text-align: center;
  }

  h2 {
    font-size: 1.5rem;
    font-weight: 400;
  }

  section {
    padding: 0 3rem;
  }

  .nav-list {
    display: none;
  }

  .buttons {
    display: none;
  }

  .note {
    display: block;
  }

  .row {
    flex-direction: column;
    margin: 0;
  }

  .row .column {
    padding: 0;
  }

}