﻿/*** The main container ***/
div#mainContainer {padding-top:60px;}

/*** The main (top) navigation ***/
div#mainNavigation                  {width:940px; height:37px; margin:0 0 0 -8px; position:fixed; z-index:500005; background:transparent url(/library/images/navigation/bg-main-nav.png) no-repeat scroll left top;} 
div#mainNavigation div#col1 {width:745px; float:left; padding-left:0px;}
div#mainNavigation div#col2 {width:178px; margin:0px 5px 0px 0px; float:right; padding:0px;}
div#mainNavigation div#col2  ul {padding-left:0px;}
div#mainNavigation div#col2 ul li a {display:none !important;}
div#mainNavigation ul               {list-style: none; list-style-type: none; margin: 0px; padding: 0 0 0 12px;} 
div#mainNavigation ul li            {float: left; margin: 0 4px 0 0; padding: 0 0 0 5px;} 
div#mainNavigation ul li.hidden     {position: absolute; left: -1000px;}
div#mainNavigation ul li a          {display: block; float: left; height: 28px;  color:#FFFFFF; font-size:1.2em; padding:10px 10px 0px 10px;}
div#mainNavigation ul li a span {color:#4E0000;font-weight:bold;}

/* Tier 1 menu */
div#mainNavigation .mainMenu ul.AspNet-Menu {height:32px;padding: 0px;}
div#mainNavigation .mainMenu ul.AspNet-Menu li {height:32px !important;}
div#mainNavigation .mainMenu ul.AspNet-Menu li a {padding-top:8px; font-weight:bold;}

/* Tier 2 menu */
div#mainNavigation .mainMenu ul.AspNet-Menu ul  {top: 100%;left: 0; padding-top:4px; background-color:#E5E5E5; border: solid 1px #CECECE;}
div#mainNavigation .mainMenu ul.AspNet-Menu ul li { background-color:#E5E5E5; height:auto!important; padding-top:0px; width:inherit;}
div#mainNavigation .mainMenu ul.AspNet-Menu ul li a { padding-top:0px; font-weight:normal; }

/* Tier 2  - About menu */
div#mainNavigation .mainMenu .aboutItem ul.AspNet-Menu ul  {width:130px;}
div#mainNavigation .mainMenu .aboutItem ul.AspNet-Menu ul li {width:115px;}
div#mainNavigation .mainMenu .aboutItem ul.AspNet-Menu ul li a {width:115px;}

/* Tier 2  - Campaign menu, must be double width*/
div#mainNavigation .mainMenu .campaignItem ul.AspNet-Menu ul  {width:450px;}
div#mainNavigation .mainMenu .campaignItem ul.AspNet-Menu ul li {width:210px;}
div#mainNavigation .mainMenu .campaignItem ul.AspNet-Menu ul li a {width:210px;float:left;}

/* Tier 2  - Get involved menu */
div#mainNavigation .mainMenu .getInvolvedItem ul.AspNet-Menu ul  {width:100px;}
div#mainNavigation .mainMenu .getInvolvedItem ul.AspNet-Menu ul li {width:85px;}
div#mainNavigation .mainMenu .getInvolvedItem ul.AspNet-Menu ul li a {width:85px;}

/* Tier 2  - My network menu */
div#mainNavigation .mainMenu .networkItem {width:310px;}
div#mainNavigation .mainMenu .networkItem ul.AspNet-Menu ul  {width:115px;}
div#mainNavigation .mainMenu .networkItem ul.AspNet-Menu ul li {width:100px;}
div#mainNavigation .mainMenu .networkItem ul.AspNet-Menu ul li a {width:100px;}
div#mainNavigation .mainMenu .networkItem span#networkName {color:#330000; display:inline;}

/* Tier 3+ */
div#mainNavigation .mainMenu ul.AspNet-Menu ul ul  {top: -0.5em;left: 6em;}

/* All list items */
div#mainNavigation .mainMenu li {}

/* Leaf list items */
div#mainNavigation .mainMenu li.AspNet-Menu-Leaf {}

/* List items being hovered over */
div#mainNavigation .mainMenu li:hover,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover{}

/* All anchors and spans (nodes with no link) */
div#mainNavigation .mainMenu a,
div#mainNavigation .mainMenu span{color: #FFFFFF;padding: 0px 2px 4px 2px;}

/* Leaves */
div#mainNavigation .mainMenu li.AspNet-Menu-Leaf a, 
div#mainNavigation .mainMenu li.AspNet-Menu-Leaf span {background-image: none !important;}

/*** Tier 1 hover ***/
div#mainNavigation .mainMenu li:hover a, /* hovered text */
div#mainNavigation .mainMenu li:hover span,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover a,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover span,
div#mainNavigation .mainMenu li:hover li:hover a,
div#mainNavigation .mainMenu li:hover li:hover span,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li.AspNet-Menu-Hover a,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li.AspNet-Menu-Hover span {color:#330000;}

/*** Tier 2 hover ***/
div#mainNavigation .mainMenu li:hover li:hover li:hover a,
div#mainNavigation .mainMenu li:hover li:hover li:hover span,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li.AspNet-Menu-Hover li.AspNet-Menu-Hover a,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li.AspNet-Menu-Hover li.AspNet-Menu-Hover span {color:#D00000;}

/* The tier above this one is hovered */
div#mainNavigation .mainMenu li:hover li a,
div#mainNavigation .mainMenu li:hover li span,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li a,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li span,
div#mainNavigation .mainMenu li:hover li:hover li a,
div#mainNavigation .mainMenu li:hover li:hover li span,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li.AspNet-Menu-Hover li a,
div#mainNavigation .mainMenu li.AspNet-Menu-Hover li.AspNet-Menu-Hover li span {color: #343434;}

/* This tier is selected */
div#mainNavigation .mainMenu .AspNet-Menu-Selected {}

/* A tier below this one is selected */
div#mainNavigation .mainMenu .AspNet-Menu-ChildSelected {}

/* 2nd level menu selected */
div#mainNavigation .mainMenu .AspNet-Menu-ChildSelected .AspNet-Menu-Selected {background-color:#E5E5E5 !important; }

/* A tier above this one is selected */
div#mainNavigation .mainMenu .AspNet-Menu-ParentSelected {}

/*** The search control ***/
div#searchControl {float: left;  width: 170px; padding-top:4px;}
div#searchControl label             {margin-left: 3px;}
div#searchControl div               {margin-top: 3px;}
div#searchControl h2                {margin-bottom: -3px;}
div#searchControl span.first        {margin-left: -4px; margin-right: 12px;}
div#searchControl div#searchTextContainer input {display: block; float: left; width: 130px; margin-top: 3px; font-size:1em; height:12px;}
div#searchControl input.searchLink  {display: block; float: left; margin-top: 5px; margin-left: 11px; width: 16px; height: 14px;}
