/*
 * Modify the Bootstrap embed-responsive container
 * --------------------------------------------------
 */

/* Padding moved to :before child element so reinstate height */
.embed-responsive {
  height: auto;
}

/* Modifier class for 16:9 aspect ratio.  Add max width */
.embed-responsive-16by9 {
  padding-bottom: 0;
  max-width: 660px;
  margin: 0 auto;
  &:before {
    padding-bottom: 56.25%;
    width: 100%;
    content: "";
    display: block;
  }
}

/* Modify Bootstrap class for 4:3 aspect ratio.  Add max width */
.embed-responsive-4by3 {
  padding-bottom: 0;
  max-width: 660px;
  margin: 0 auto;
  &:before {
    padding-bottom: 75%;
    width: 100%;
    content: "";
    display: block;
  }
}
