.institutional {
  font-family: $font-family-serif;
}

ul {
  padding-left: 30px;

  li {
    margin-bottom: 8px;
  }
}

.navbar-nav li {
  margin-bottom: 0;
}

.navbar-brand {
  @media (min-width: $screen-sm-min) and (max-width: $screen-md-min - 1px) {
    &:after {
      content: 'IMC';
    }
  }

  @media (max-width: $screen-sm-min - 1px), (min-width: $screen-md-min) {
    &:after {
      content: 'Insight Meditation Center';
    }
  }
}

.jumbotron .pic-wrapper {
  overflow: hidden;
}

.institutional {
  font-family: $font-family-serif;
}

ul {
  padding-left: 30px;

  li {
    margin-bottom: 8px;
  }
}

.navbar-nav li {
  margin-bottom: 0;
}

.navbar-brand {
  @media (min-width: $screen-sm-min) and (max-width: $screen-md-min - 1px) {
    &:after {
      content: 'IMC';
    }
  }

  @media (max-width: $screen-sm-min - 1px), (min-width: $screen-md-min) {
    &:after {
      content: 'Insight Meditation Center';
    }
  }
}

.jumbotron .pic-wrapper {
  overflow: hidden;
}

iframe, object, embed {
  max-width: 100%;
  width: 100%;
}

Make calendar fill its container dynamically.
Make calendar fill its container dynamically.

This causes the calendar iframe to fill its container dynamically.
By default it is fixed width, which is suboptimal on almost all
screen sizes.
