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


/*
 *	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%;
  background-color: #fff;
  color: #000;
  float: right;
  padding-top: 55px;
  z-index: 10;
  /*border: 1px solid #D9BA31; */}
  @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; 
  font-weight: 400; }

@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: 300px; } 

   #nav li > li {
    text-align: left;
    width: 500px; } 

  }
@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{
  height: 100%;
  line-height: 25px; }

#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: #fff; }
  #nav > ul > li > a:hover, #nav > ul > li > a:focus, #nav > ul > li > a.js-openSubMenu {
    color:red;  }

#nav > ul > li:hover > a, #nav > ul > li:focus > a {
  color:red; }

@media screen and (min-width: 650px) {
  #nav > ul > li:not(:last-child) {
    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 #D9BA31; }
      #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: none; } }

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: 25px;
      left: 0; z-index: 10;
      padding:25px 0px 25px 0px} }
  @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 {
  color:#000; }
  #nav > ul > li > ul > li > a:hover, #nav > ul > li > ul > li > a:focus {
    color:#f00; }

#nav > ul > li > ul > li:not(:last-child) a {
  /*border-bottom: 1px solid #000;*/
  width: 500px;
   }

/* Third Level Dropdown */
@media screen and (min-width: 650px) {
  #nav > ul > li > ul > li > ul {
    top: 0;
    right: 500px;

    z-index:10 !important;
    /* 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 {
 color:#000; background-color:  #D9BA31;  }
  #nav > ul > li > ul > li > ul > li > a:hover, #nav > ul > li > ul > li > ul > li > a:focus {
    background-color:  #D9BA31; color:#f00; }

#nav > ul > li > ul > li > ul > li:not(:last-child) > a {
 
  width:500px;}

/* Javascript classes */
#nav .js-hideElement {
  display: none; 
  z-index:10 !important;}

#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; } }