body,
h1,
h2,
h3,
h4,
h5,
h6,
.side-nav {
  font-family: "Proxima Nova Condensed", "Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans-serif
}
/* move the content to the left */

.row {
  margin-left: inherit;
  margin-right: inherit;
}
/* The base colors*/

.color0 {
  background-color: #3D839A;
}
.color1 {
  background-color: #539294;
}
.color2 {
  background-color: #82B295;
}
.color3 {
  background-color: #9AB687;
}
.color4 {
  background-color: #208872;
}
.color5 {
  background-color: #3F7265;
}
.meta {
  background-color: darkgray;
}
.main-section {
  padding-top: 1rem;
}
/* Desktop navigation */

.side-nav li a:not(.button) {
  display: inline-block;
  color: white;
  font-size: 1.5rem;
}
.side-nav li a:not(.button).selected {
   color: black;
}
.side-nav li a:not(.button):hover, .side-nav li a:not(.button):focus {
  color: black;
  background: inherit;
}

.desktop-evolution-menu {
  position: fixed;
  height: 100%;
  min-height: 100%;
  width: 220px;
  top: 0px;
  bottom: 0px;
  left: -170px;
  z-index: 25;
  transition: all 0.3s ease 0s;
}
.desktop-evolution-menu .side-nav {
  font-size: 1rem;
  font-weight: bold;
}
.desktop-evolution-menu .table {
  display: table;
  height: 100%;
  width: 100%;
}
.desktop-evolution-menu .table-cell {
  vertical-align: middle;
  display: table-cell;
}
.desktop-evolution-menu.active {
  left: 0px;
}
.desktop-evolution-menu-toggle {
  width: 3rem;
  height: 3rem;
  display: inline-block;
  color: rgba(255,255,255,.2);
  font-size: 3rem;
  overflow: hidden;
  cursor: pointer;
}
.desktop-evolution-menu-toggle.menu-icon span::after {
  content: "";
  position: relative;
  display: block;
  height: 0;
  /*top: 50%;*/
  margin-top: 1.15rem;
  left: 0.90625rem;
  box-shadow: 0 0px 0 1px #FFF, 0 7px 0 1px #FFF, 0 14px 0 1px #FFF;
  width: 1rem;
}
.desktop-level2-menu {
  list-style-type: none;
}
ul.desktop-level2-menu {
  margin-left: 0px;
}
.desktop-level2-menu li {
  border-bottom: 1px solid #34788D;
}
.desktop-level2-menu li a {
  color: #34788D;
  white-space: nowrap;
}
.desktop-level2-menu li a:hover {
  color: black;
}
.desktop-level2-menu li a.selected {
  color: black;
}

.tutor-diagram-switch {
  margin-top: 0.5rem;
}

.tutor-diagram-label label{
  font-size: 1.5rem;
}

/* Mobile top bar */

.tab-bar.mobile-evolution {
  background-image: url('/media/images/evolution_hg_mobile.png');
  background-size: 900px;
  background-repeat: repeat-y;
  background-color: white;
}
.tab-bar-section.left,
.tab-bar-section.right {
  text-align: left;
}
.tab-bar h1 {
  font-style: italic;
  font-size: 3em;
  color: rgba(82, 125, 115, 0.72);
}

/* 16:9 video player */
.videoWrapper {
  position: relative;
  padding-bottom: 56%;
  padding-top: 20px;
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}