.title-bar {
  background-color: #22599C; }

#course-menu {
  background-color: #333; }
  #course-menu li {
    font-size: 12px;
    line-height: 1.1;
    font-weight: 400; }
  #course-menu li.nested {
    font-weight: 400; }
  #course-menu .sub-menu-title {
    background-color: #333;
    font-weight: 600;
    font-size: 14px;
    margin: 0 1rem .5rem;
    padding-bottom: 6px;
    border-bottom: 1px white dotted; }

.drilldown {
  background: #333;
  padding: 1rem 0; }
  .drilldown .is-drilldown-submenu {
    background: #333; }
  .drilldown a {
    color: white;
    background: #333;
    padding: 0.5rem 1rem; }
    .drilldown a:hover {
      color: #ffc800; }

.drilldown .is-drilldown-submenu-parent > a::after {
  border-color: transparent transparent transparent #DDD; }

.drilldown .js-drilldown-back > a::before {
  border-color: transparent #FFF transparent transparent; }

.js-drilldown-back {
  text-transform: uppercase;
  padding-bottom: 0.75rem; }

#map-nav {
  position: absolute;
  right: 42px;
  top: 9px;
  z-index: 5;
  color: #FFF; }
  #map-nav a {
    color: white;
    background-color: #000;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 400;
    text-decoration: none;
    padding: 10px 16px;
    margin-top: 1px; }
  #map-nav .active {
    background-color: #ffc800;
    color: black; }

.page-nav {
  position: absolute;
  top: 550px;
  width: 340px; }

.nav-back {
  display: block;
  float: left;
  padding: 6px;
  background-color: #ffc800;
  color: #242424;
  width: 60px;
  float: left;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  font-weight: 600; }

.nav-next {
  display: block;
  float: right;
  background-color: #ffc800;
  padding: 6px;
  color: #242424;
  width: 60px;
  float: right;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  font-weight: 600; }

.intro a.intro-back-btn {
  background-color: #77addc;
  font-size: 12px;
  padding: 8px;
  width: 80px;
}

body {
  font-family: 'Open Sans', sans-serif;
  line-height: 1.4; }

#container {
  border: solid #A9D5F2 12px;
  height: 624px;
  overflow: hidden; }

.intro {
  height: 600px;
  width: 1150px;
  background-image: url(../images/splash-bkg.png); }
  .intro .banner {
    background-color: #22599C;
    height: 350px;
    width: 700px;
    margin: 125px auto;
    padding: 40px; }
  .intro h1 {
    border-bottom: none;
    text-align: center;
    font-size: 36px; }
    .intro h1 span {
      font-size: 12px;
      display: block;
      border-bottom: dotted 2px #ffc800;
      padding-bottom: 10px;
      margin-bottom: 20px;
      text-transform: uppercase;
      letter-spacing: 2px; }
  .intro a {
    display: block;
    padding: 12px;
    background-color: #ffc800;
    color: #242424;
    width: 80px;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    font-weight: 600;
    margin: 20px auto; }

#mapid {
  height: 600px; }

#content {
  background-color: #22599C;
  padding: 5px 20px; }

.leaflet-control-attribution {
  display: none; }

h1 {
  font-family: 'Arvo', serif;
  font-weight: 600;
  font-size: 22px;
  color: #FFFFFF;
  line-height: 1.2;
  padding-bottom: 20px;
  border-bottom: dotted 2px #FFC800; }

h2,
h3 {
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
  font-size: 17px;
  color: #FFFFFF;
  line-height: 1.2;
  margin-bottom: 3px; }

p,
li {
  font-size: 14px;
  color: #FFFFFF;
  margin-bottom: 1em;
  font-weight: 300;
  line-height: 1.4; }

li {
  margin-bottom: 0; }

table th {
  font-size: 12px;
  font-weight: 600; }

table td {
  font-size: 12px;
  vertical-align: text-top; }

.breadcrumb p {
  font-family: 'Open Sans', sans-serif;
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 1px;
  margin-bottom: 20px;
  padding-top: 10px; }

.breadcrumb span {
  font-weight: 700; }

#stage {
  position: relative;
  height: 600px; }

#stage-sidebar {
  width: 40%;
  background-color: #00A19B;
  padding: 10px;
  position: absolute;
  bottom: 20px;
  right: 20px;
  z-index: 100; }
  #stage-sidebar h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    border-bottom: dotted #FFFFFF 1px;
    padding-bottom: 6px;
    margin-bottom: 3px;
    color: white; }
  #stage-sidebar p {
    font-size: 12px;
    font-weight: 500; }
  #stage-sidebar ul li {
    margin-bottom: .5em;
    font-size: 12px; }

#stage-sidebar-left {
  width: 40%;
  background-color: #00A19B;
  padding: 10px;
  position: absolute;
  bottom: 20px;
  left: 20px;
  z-index: 100; }
  #stage-sidebar-left h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    border-bottom: dotted #FFFFFF 1px;
    padding-bottom: 6px;
    color: white; }
  #stage-sidebar-left p {
    font-size: 12px; }
  #stage-sidebar-left ul li {
    margin-bottom: .5em;
    font-size: 12px; }

/* animation stuff */
.stage-text-block {
  width: 300px;
  background-color: rgba(0, 0, 0, 0.8);
  margin: auto;
  padding: 20px;
  color: #FFFFFF;
  position: absolute;
  bottom: 0;
  left: 464px;
  z-index: 2; }
  .stage-text-block h3 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 1.2; }
  .stage-text-block p {
    font-size: 14px; }

@keyframes slidein {
  from {
    margin-left: 0%; }
  to {
    margin-left: 100%; } }

.leaflet-control-container {
  position: absolute;
  right: 50px; }

.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
  border: none !important; }

.leaflet-touch .leaflet-bar a:first-child {
  border-top-left-radius: 0;
  border-top-right-radius: 0; }

.leaflet-bar a,
.leaflet-bar a:hover {
  background-color: #000;
  border-bottom: 1px solid #ccc;
  width: 26px;
  height: 26px;
  line-height: 26px;
  display: block;
  text-align: center;
  text-decoration: none;
  color: #FFF; }

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background: #333;
  color: #FFF;
  box-shadow: 0 7px 7px rgba(0, 0, 0, 0.6);
  font: 'Open Sans', sans-serif;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  font-weight: 500; }

.leaflet-popup-content-wrapper {
  border-radius: 0; }

a.modal-link {
  color: #FFF;
  padding-bottom: 3px;
  border-bottom: dotted 1px #FFF;
  line-height: 1.8; }
  a.modal-link span {
    margin-right: .5rem; }

.reveal {
  padding: 40px; }
  .reveal p,
  .reveal li,
  .reveal h1,
  .reveal h2,
  .reveal h3 {
    color: #000; }

#main {
  display: block; }
  #main.toggled {
    display: none; }