/* Apply only to mobile devices */
@media only screen and (max-width: 740px) {

  /* Header bar */
  #title {
    height: inherit;
  }
    #title .divider {
      display: none;
    }

    #title .alt {
      display: block;
    }

  /* Hero container: title image and text */
  #hero .container {
    margin: 10%;
    width: 80%;
  }
    #hero .container h1 {
      font-size: 3.5em;
    }

  /* Hero image caption */
  .text.aside.aside-left {
    width: 100%;
  }

  /* Body text */
  .text .container {
    margin: 10%;
    width: 80%;
  }

  /* Images */
  div.image div.container {
    margin: 0;
    width: 100%;
  }

  /* Image captions */
  div.image aside {
    width: 100%;
  }

  /* Audio quotes */
  .quote .container {
    margin: 5%;
    width: 90%;
  }
    .quote .container h1 {
      max-width: 100%
    }

  /* Video */
  .ooyala .container {
    width: 100%;
    margin: 0;
  }

  /* Media headers */
  .media-header .container {
    margin: 10%;
    width: 80%;
  }
    div.media-header div.container.copy h1 {
      font-size: 3.5em;
    }

    div.media-header div.copy.right {
      right: inherit;
    }

    div.media-header div.copy p {
      font-size: 1.3em;
    }

  /* Numbers */
  div.number div.container {
    margin: 5%;
    width: 90%;
  }

}
