.video-container {
   position: relative;
   padding-bottom: 56.25%;
   height: 0;
   overflow: hidden;
   max-width: 100%;
}

.video-container iframe,
.video-container object,
.video-container embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

#title {
   position: absolute;
   z-index: 100;
   top: 12px;
   left: 0;
   width: 100%;
   text-align: center;
   color: #fff;
   display: block;
   background-color: rgba(0, 0, 0, 0.7);
}

#title h4 {
   font-size: 0.8em;
   line-height: 1.5em;
   margin: 0;
   padding: 0.3em 2em;
   text-align: center;
}

#title h4 span {
   font-weight: 200;
   white-space: nowrap;
}

@media screen and (min-width: 40em) {
   #title h4 {
      font-size: 1.2em;
      line-height: 2em;
   }
}

.orange {
   color: #ff8500;
}

.topbar-header {
   background-color: #333;
   color: #fff;
}

table {
   font-size: 0.8em;
}

.title-bar {
   background-color: #999 !important;
}

.top-bar {
   padding: 0 !important;
}

.menu {
   font-weight: bold;
}

.menu a {
   background-color: #efefef;
   border-top: 1px solid #fff;
   color: #333;
}

.menu a:hover {
   background-color: #fcfcfc;
   border-top: 1px solid #fff;
   color: #333;
   text-decoration: underline !important;
}

.callout h3 {
   font-size: 1.1rem !important;
}

.callout {
   font-size: 0.9rem !important;
   text-align: center;
}