html {
  font-family: 'Proxima Nova', 'Helvetica Neue', 'Arial', sans-serif; }

.container {
  width: 100%;
  margin: 10vh auto; }

a {
  color: inherit; }

/*
 *	Accessible Multi-Level Dropdown Navigation Menu
 *	Created by Ire Aderinokun
 *
 */
/* Resets */
#nav, #nav ul, #nav li {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  box-sizing: border-box; }

#nav {
  position: relative;
  min-height: 60px;
  max-width: 100%;
width: 100%;
  background-color: #97BF12;
  color: #000;
  border: 1px solid #97BF12; }
  @media screen and (min-width: 650px) {
    #nav {
      display: inline-block; } }
  @media screen and (max-width: 650px) {
    #nav {
      display: block; } }

#nav li {
  position: relative; }

#nav a {
  text-decoration: none;
  height: 100%;
  display: block;
  padding: 0 20px; }

@media screen and (min-width: 650px) {
  #nav a:focus {
    outline: none; } }

.plusMark {
  margin-left: 10px;
  font-size: 20px;
  font-weight: 700; }

@media screen and (min-width: 650px) {
  #nav li {
    text-align: left;
    width: 200px; } }
@media screen and (max-width: 650px) {
  #nav li {
    text-align: center;
    width: 100%; } }

/* Any sub menu */
@media screen and (min-width: 650px) {
  a + ul {
    position: absolute; }
    a + ul:not(.js-showElement) {
      display: none; } }
@media screen and (max-width: 650px) {
  a + ul {
    position: relative; }
    a + ul:not(.js-hideElement) {
      display: block; } }

/* The Main Navigation Bar - Navigation Level One */
#nav > ul, .fa {
  height: 100%;
  line-height: 60px; }

#nav > ul > li {
  position: relative;
  text-align: center; }
  @media screen and (min-width: 650px) {
    #nav > ul > li {
      float: left;
      width: auto; } }
  @media screen and (max-width: 650px) {
    #nav > ul > li {
      float: none;
      display: block;
      width: 100%; } }

#nav > ul > li > a {
  background-color: #97BF12; }
  #nav > ul > li > a:hover, #nav > ul > li > a:focus, #nav > ul > li > a.js-openSubMenu {
    background-color: #D9BA31; }

#nav > ul > li:hover > a, #nav > ul > li:focus > a {
  background-color: #D9BA31; }

@media screen and (min-width: 650px) {
  #nav > ul > li:not(:last-child) {
    border-right: 1px solid #97BF12;
    border-bottom: none; } }
@media screen and (max-width: 650px) {
  #nav > ul > li:not(:last-child) {
    border-right: none; }
    #nav > ul > li:not(:last-child):not(:first-child) {
      border-bottom: 1px solid #D9BA31; } }

#nav > ul > li:not(#toggleMenu):not(.js-showElement) {
  /* first level nav li except toggleMenu icon */ }
  @media screen and (min-width: 650px) {
    #nav > ul > li:not(#toggleMenu):not(.js-showElement) {
      display: inline-block; } }
  @media screen and (max-width: 650px) {
    #nav > ul > li:not(#toggleMenu):not(.js-showElement) {
      display: none; } }

@media screen and (min-width: 650px) {
  #nav #toggleMenu {
    display: none; } }
@media screen and (max-width: 650px) {
  #nav #toggleMenu {
    display: block;
    width: 100%; }
    #nav #toggleMenu.js-open {
      border-bottom: 1px solid #97BF12; }
      #nav #toggleMenu.js-open .fa-times {
        display: block; }
      #nav #toggleMenu.js-open .fa-bars {
        display: none; }
      #nav #toggleMenu.js-open a {
        background-color: #D9BA31; }
    #nav #toggleMenu:not(.js-open) .fa-times {
      display: none; }
    #nav #toggleMenu:not(.js-open) .fa-bars {
      display: block; } }

span#toggleMenu-text {
  position: absolute;
  opacity: 0; }

/* Second Level Dropdown */
#nav > ul > li > ul {
  background-color: #D9BA31; }
  @media screen and (min-width: 650px) {
    #nav > ul > li > ul {
      top: 60px;
      z-index: 1;
      left: 0; } }
  @media screen and (max-width: 650px) {
    #nav > ul > li > ul {
      width: 100%;
      position: relative; }
      #nav > ul > li > ul:not(.js-showElement) {
        display: none; } }

#nav > ul > li > ul > li > a {
  background-color: #ffffff; }
  #nav > ul > li > ul > li > a:hover, #nav > ul > li > ul > li > a:focus {
    background-color: #ffdb3a; }

#nav > ul > li > ul > li:not(:last-child) a {
  border-bottom: 1px solid #97BF12; }

/* Third Level Dropdown */
@media screen and (min-width: 650px) {
  #nav > ul > li > ul > li > ul {
    top: 0;
    left: 200px;
    /* width of ul */ } }
@media screen and (max-width: 650px) {
  #nav > ul > li > ul > li > ul {
    width: 100%;
    position: relative; }
    #nav > ul > li > ul > li > ul:not(.js-showElement) {
      display: none; } }

#nav > ul > li > ul > li > ul > li > a {
  background-color: #ffffff; }
  #nav > ul > li > ul > li > ul > li > a:hover, #nav > ul > li > ul > li > ul > li > a:focus {
    background-color: #D9BA31; }

#nav > ul > li > ul > li > ul > li:not(:last-child) > a {
  border-bottom: 1px solid #D9BA31; }

/* Javascript classes */
#nav .js-hideElement {
  display: none; }

#nav .js-showElement {
  display: block; }

/* Fallback for users without javascript */
html.no-js li:hover > a + ul, html.no-js li:focus > a + ul {
  display: block; }
@media screen and (max-width: 650px) {
  html.no-js #nav:hover > ul > li:not(#toggleMenu), html.no-js #nav:focus > ul > li:not(#toggleMenu) {
    display: block; }
  html.no-js #nav:hover li:hover > a + ul, html.no-js #nav:hover li:focus > a + ul, html.no-js #nav:focus li:hover > a + ul, html.no-js #nav:focus li:focus > a + ul {
    display: block; } }