nav {
    margin: 30px 0;
    height: auto;
    position: absolute;
    right: 5%;
    z-index: 100; }
    
body.simple nav { display: none; }

nav ul#menu { list-style: none; margin: 0 auto; float: left; }

nav ul#menu  li {      
  float: none; 
  position: relative;
  display: inline-block;
  padding: 0; } 
  nav ul#menu  li.nav-menu { display: none; }

nav ul#menu  li a {
   height: 20px;
   padding: 10px 14px;
   -webkit-border-radius: 2px 2px 2px 2px;
   border-radius: 2px 2px 2px 2px;
   background-color: none;
   font-size: 19px;
   letter-spacing: 0;
   font-weight: 300;
   line-height: 20px;
   color: white;
   display: inline-block;
   font-family: "merriweather",serif;
   -webkit-transition: all .35s ease-in-out;
   -moz-transition:    all .35s ease-in-out;
   -o-transition:      all .35s ease-in-out;
   -ms-transition:     all .35s ease-in-out;
   transition:         all .35s ease-in-out; }

nav ul#menu  li a:hover { background-color: #5e6e7e; color: white; }
nav ul#menu  li a:active { background-color: #e84d3d; color: white; }

nav ul#menu  li.active { background-color: #5e6e7e; }
nav ul#menu  li.active a { color: white; }

nav ul#menu  > li:hover a.dropdown {
  background-color: #5e6e7e;
  color: white; }   
  
nav ul#menu  li a.donate { background-color: #e84d3d; }
nav ul#menu  li a.donate:hover { background-color: #1c799c; }
nav ul#menu  li a.donate:active { background-color: #1b1f23; }


/* Submenu
------------------------------------ */

nav#main ol { 
  background: #fff;
  list-style: none;
  width: 200px;
  margin: 0;
  padding: 8px;
  display: none; 
  position: absolute; 
  left: 0px;
  top: 40px;
  z-index: 1;
  font-size: 11px;
  line-height: 11px;
  text-transform: none !important;
  -webkit-transition: all .35s ease-in-out;
  -moz-transition:    all .35s ease-in-out;
  -o-transition:      all .35s ease-in-out;
  -ms-transition:     all .35s ease-in-out;
  transition:         all .35s ease-in-out;
  -webkit-box-shadow: 1px 5px 5px 0 rgba(0,0,0,.2);
   box-shadow: 1px 5px 5px 0 rgba(0,0,0,.2);}
   
   nav#main ul li:last-child ol { left: -56px; }

nav#main li:hover ol,
nav#main li.over ol { display: block; }

nav#main ol li {
  background-image: none;
  padding: 2px !important;
  text-align: left; 
  float: none;
  display: block; }

nav#main ol li a {
  background-color: #eee;
  width: auto;
  height: auto;
  padding: 7px 6px !important;
  display: block;
  color: #003659;
  float: none;   
  text-indent: 0;
  -webkit-transition: all .35s ease-in-out;
  -moz-transition:    all .35s ease-in-out;
  -o-transition:      all .35s ease-in-out;
  -ms-transition:     all .35s ease-in-out;
  transition:         all .35s ease-in-out; }

nav#main ol li a:hover { 
   padding: 7px 6px 7px 12px !important;
  background-color: #ad2624 !important;    
  color: #fff !important; }
nav#main ol li a:active { 
  background-color: #003659 !important; 
  color: #fff !important;  
  -moz-box-shadow:    inset 1px 1px 2px rgba(0,0,0,.3);
  -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,.3);
  box-shadow:         inset 1px 1px 2px rgba(0,0,0,.3); }


/* Section Nav
------------------------------------ */


/* --- Connect --- */
ul#social {
   position: relative;
   list-style: none;
   float: right;
   width: auto;
   margin: 9px 0 0 20px;}

ul#social  li {      
   float: none; 
   position: relative;
   display: inline-block;
   padding: 0; }

ul#social a { 
   color: #fff; 
   font-family: 'trilogyicons'; 
   font-size: 20px; 
   text-transform: lowercase;
   font-weight: 300;   
   margin: 0;
   padding: 10px;
   text-align: center;
   background-color: #5e6e7e; 
   -webkit-border-radius: 2px 2px 2px 2px;
   border-radius: 2px 2px 2px 2px;
   -webkit-transition: all .35s ease-in-out;
   -moz-transition:    all .35s ease-in-out;
   -o-transition:      all .35s ease-in-out;
   -ms-transition:     all .35s ease-in-out;
   transition:         all .35s ease-in-out;
}
ul#social a:hover { background-color: #1c799c; color: #fff; }
ul#social a:active { background-color: #e84d3d; color: #fff; }


/* Section Nav
------------------------------------ */

#snav { 
   text-align: left;
   background: #d1d6db;
   width: 86%;
   padding: 7%;
   right: 0;
   margin: 0 0 1em 0;
   height: auto;
   position: relative;}

#snav ul { list-style: none; }   
#snav li { margin: 0 auto; }  
#snav li a { 
   position: relative;
   background: rgba(255,255,255,0);
   padding: 0.75em 0; 
   margin: 1px 0;
   border-bottom: 1px #fff solid;
   display: block;
   font: 700 18px/1 "Merriweather", sans-serif;
   letter-spacing: -0.5px;
   text-transform: none !important;
   color: #364a5e;    
   -webkit-transition: all .25s ease-in-out;
   -moz-transition:    all .25s ease-in-out;
   -o-transition:      all .25s ease-in-out;
   -ms-transition:     all .25s ease-in-out;
   transition:         all .25s ease-in-out; }  
#snav li a:hover { 
   color: #46719c;
  background: rgba(255,255,255,.5);  }
#snav li a:active { 
   color: #e64d3c;
  background: rgba(255,255,255,1); }

#snav li a:before { font-family: 'trilogyicons'; font-size: 6px; color: #a1acb5; content: ">"; position: relative; top: -3px; left: 3px;}

#snav li.active a { color: #46719c; }
#snav li.active a:hover { color: #e64d3c; }



/* --- Device and Mobile Menu --- */
nav ul#menu li#top-menu  { 
   display: none !important;
   background: rgba(255,255,255,.5);
   height: 50px;
   -webkit-border-radius: 2px 2px 2px 2px;
   border-radius: 2px 2px 2px 2px;
   width: 50px;
   position: absolute;
   top: 25px;
   right: 0;
   color: #364a5e; }

#home-button a,
nav ul#menu li#top-menu  > a {
   background-repeat: no-repeat;
   width: 50px;
   height: 50px;
   position: relative; }
      
#home-button > a {  
   background-image: url(/theme/mobile/img/home.png);
   background-position: center center; }
   
nav ul#menu li#top-menu  > a { 
   width: 50px;
   height: 50px;
   padding: 0;
   font-family: 'trilogyicons';
   font-size: 28px;
   vertical-align: middle;
   line-height: 50px;
   color: #364a5e !important;}
nav ul#menu li#top-menu  > a:hover { 
   color: #e84d3d !important;
   background: rgba(255,255,255,1);
   -webkit-border-radius: 2px 2px 2px 2px;
   border-radius: 2px 2px 2px 2px; }
   
nav ul#menu li#top-menu.active a,
nav ul#menu li#top-menu a:active { background: rgba(255,255,255,1); }

nav ul#menu li#top-menu #top-dropdown {
   background-color: #fff;
   padding: 10px;
   -webkit-border-radius: 2px 2px 2px 2px;
   border-radius: 2px 2px 2px 2px; 
   width: 250px;      
   box-shadow:            0 4px 3px rgba(0, 0, 0, 0.25);       
      -moz-box-shadow:    0 4px 3px rgba(0, 0, 0, 0.25);  
   	-webkit-box-shadow: 0 4px 3px rgba(0, 0, 0, 0.25);   
   display: none; 
   margin: 0;
   position: absolute;
      top: 48px; 
      right: 0px;
      z-index: 9999; }
nav ul#menu li#top-menu #top-dropdown li { 
   width: 100%;
   padding: 0;
   border-right: 0;
   background: #364a5e !important;
   color: #fff;
   border-bottom: 1px solid #fff; }
nav ul#menu li#top-menu #top-dropdown li:last-child { border-bottom: 0; }
   
nav ul#menu li#top-menu #top-dropdown li a { 
   width: 100%;
   background: #364a5e !important;
   height: auto;
   padding: .5em 0;
   line-height: 1; }
nav ul#menu li#top-menu #top-dropdown li:last-child a {}
nav ul#menu li#top-menu #top-dropdown li a.donate {
   background: #e84d3d !important; }
      
nav ul#menu li#top-menu #top-dropdown li a:active {   
   background-color: #347fc2 !important;
   color: #fff; }
   
nav ul#menu li#top-menu #top-dropdown li.close a { 
   padding: 5px 10px; 
   background: #8c9ca3; 
   color: #00c0c7; }
nav ul#menu li#top-menu #top-dropdown li.close a:active { background: #00c0c7; }