/* Navigation Bar CSS Definitions:
======================================================================================================================== */

/* Navigation Bar Styles:
======================================================================================================================== */

#NavBar
{
   display: none;

   padding: 10px;

   background: #444;

   min-height: 32px;
}

#NavBar > div.upper:after
{
   height: 0;
   clear: both;
   content: " ";
   display: block;
   visibility: hidden;
}

/* Navigation Toggle Styles:
======================================================================================================================== */

#NavToggle
{
   margin: 0;

   color: #FFF;

   float: left;

   cursor: pointer;

   display: block;

   padding: 8px 12px;

   border-width: 1px;
   border-style: solid;

   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;

   border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);

   box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 1px 0 rgba(255,255,255,0.1);

   background: #222;
   background: -moz-linear-gradient(top, #222 0%, #000 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#222), color-stop(100%,#000));
   background: -webkit-linear-gradient(top, #222 0%, #000 100%);
   background: -o-linear-gradient(top, #222 0%, #000 100%);
   background: -ms-linear-gradient(top, #222 0%, #000 100%);
   background: linear-gradient(to bottom, #222 0%, #000 100%);

   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#222222', endColorstr='#000000', GradientType=0);
}

#NavToggle:hover
{
   background: #111;
   background: -moz-linear-gradient(top, #111 0%, #000 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#111), color-stop(100%,#000));
   background: -webkit-linear-gradient(top, #111 0%, #000 100%);
   background: -o-linear-gradient(top, #111 0%, #000 100%);
   background: -ms-linear-gradient(top, #111 0%, #000 100%);
   background: linear-gradient(to bottom, #111 0%, #000 100%);

   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#111111', endColorstr='#000000', GradientType=0);
}

#NavToggle.active
{
   background: #111;

   box-shadow: 0 1px 0 rgba(0,0,0,0.15) inset, 0 1px 0 rgba(255,255,255,0.1);
}

#NavToggle span.bar
{
   width: 18px;
   height: 2px;

   display: block;

   background-color: #FFF;

   -webkit-border-radius: 1px;
   -moz-border-radius: 1px;
   border-radius: 1px;

   box-shadow: 0 1px 0 rgba(0,0,0,0.25);
}

#NavToggle span.bar + span.bar
{
   margin-top: 3px;
}

/* Navigation Brand Styles:
======================================================================================================================== */

#NavBrand
{
   color: #000;

   float: right;

   display: block;

   font: 400 22px/30px 'Droid Sans';

   text-decoration: none;
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.125), 0 0 25px rgba(255, 255, 255, 0.2);

   transition: all 0.2s linear 0s;
}

#NavBrand:hover
{
   color: #DDD;

   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}

/* Top Navigation Styles:
======================================================================================================================== */

#NavTop
{
   display: none;

   overflow: hidden;

   position: relative;
}

#NavTopList
{
   margin-top: 15px !important;
}

#NavTopList li
{
   margin-top: 8px;
   margin-bottom: 8px;
}

.lite #NavTopList li a
{
   color: #444;
}

.dark #NavTopList li a
{
   color: #FFF;
}