/* FIRST LEVEL NAVIGATION */

#mainnav { 
border-top: 1px solid #aaa;
border-bottom: 1px solid #555;
font: .85em verdana, arial, geneva, helvetica, sans-serif;
font-weight: bold;
letter-spacing: .09em;
background: transparent url(../images/navback.png) repeat-x; 
}

/* Styling the links */
#mainnav a { 
display:block;
padding:7px 20px;	/* keeps main links aligned*/
text-decoration:none;
white-space: nowrap;
}

#mainnav li a {
color: #ddd;
border: 1px solid;
border-color: transparent #888;
}

/* Background color change on Hover */
#mainnav a:hover { 
background: transparent url(../images/navback_over.png) repeat-x;
border-color: transparent #777;
}

/* Removing padding, margin and "list-style" from the "ul",
* and adding "position:relative" */
#mainnav ul { /* positions flush left */
padding:0;
list-style: none;
position: relative;
}
	
/* Positioning the navigation items inline */
#mainnav ul li { 
margin: 0 auto;
display:inline-block;
float: left;
}

/* Hide Dropdowns by Default
 * and giving it a position of absolute */
#mainnav ul ul { 
	display: none;
	position: absolute; 
	/* has to be the same number as the "line-height" of "nav a" */
	/*top: 60px; 
	top: 28px; */
}


.menu li ul {
border-bottom: 4px solid #666;
}

#mainnav li:hover li a { /* background on 2nd level - hover - when mousing over 1st level */
background: #555;
display: block;
color: #fff;
font-size: 1em;
font-weight: normal;
text-decoration: none;
padding: 4px 7px;
border-top: 1px solid #999;
border-bottom: 1px solid #333;
border-left: 4px solid #666;
border-right: 4px solid #666;
z-index: 1;
margin: 0;
}

#mainnav li li a:hover {
text-decoration: none;
border-top: 1px solid #fff;
background: #aaa;
z-index: 1; 
color: #000
}

.lefttop ul {
margin:0 0 0 110px;
}

.leftglobal ul {
margin:0 0 0 200px;
}


/* THIS IS THE RESPONSIVE CODE */
/* Giving a background-color to the nav container. */

.toggle,
[id^=drop] {
display: none;
}

/* alignment problems start here */

/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

#mainnav:after {
content:"";
display:table;
clear:both;
}
	
/* Display Dropdowns on Hover */
#mainnav ul li:hover > ul { 
display:inherit;
margin-left: 0;
}

/* Fisrt Tier Dropdown */
#mainnav ul ul li {
width:170px;
float:none;
display:list-item;
position: relative;
background: #555; /*background on hover - 2nd level - mouseover on 1st*/
}

/* Change ' +' in order to change the Dropdown symbol */
#mainnav li > a:after { content:  ' +'; }
#mainnav li > a:only-child:after { content: ''; }

.menu {z-index: 1}

/* XXXXXXXXXXX left nav XXXXXXXXXXX */

#navleft {
font: .79em verdana, arial, geneva, helvetica, sans-serif;
}

#navleft ul {
padding: 0;
margin: 0;
border-right: 1px solid #222;
border-bottom: 1px solid #555;
/*border-top: 1px solid #777;*/
margin-top: -40px;
margin-bottom: 30px;
z-index: 1;

}

#navleft li {
margin: 0;
list-style-type: none;}

#navleft li a, #navleft li a:visited {
display: block;
color: #ddd;
text-decoration: none;
padding: 5px 0 5px 10px;
border-top: 1px solid #555;
border-bottom: 1px solid #000;
}

#navleft li a:hover {
background: #bbb;
color: #000;
border-top: 1px solid #fff;
}

#navleft label {
display: none;
}

input#menu {
display: none;
}

.hamburger {
width: 20px;
height: 3px;
background-color: #333;
margin: 4px;
}

/* XXXXXXXXXXX secondary nav XXXXXXXXXXX */

.secondarynav { 
border-top: 1px solid #444;
font: .78em verdana, arial, geneva, helvetica, sans-serif;
letter-spacing: .05em;
z-index: 100;
}

.secondarynav ul {
list-style-type: none;
margin: 0 0 0 16.9%;
padding: 0;
border-bottom: 1px solid #fff;
background: #555 url(../images/secnav.png) repeat-x;
}

.secondarynav li {
display: inline-block;
}

ul.secondarymenu {
padding: 5px 5px 5px 20px;
z-index: 100;
height: 47px;
}

.secondarynav li a {
color: #aaa;
text-decoration: none;
letter-spacing: .05em;
padding: 2px 10px;
margin-bottom: 2px;
border: 1px solid #666;
display: inline-block;
/*float: left;*/
}

.secondarynav li.break{
margin-right: 2px;
}

.secondarynav a:hover {
text-decoration: none;
color: #fff;
background: #888;
}

/* THIS IS THE RESPONSIVE CODE */

/* Giving a background-color to the nav container. */

.toggle,
[id^=secondarydrop] {
	display: none;
}

/* alignment problems start here */

/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

#secondarynav:after {
	content:"";
	display:table;
	clear:both;
}

/* Change ' +' in order to change the Dropdown symbol */
#secondarynav li > a:after { content:  ' +'; }
#secondarynav li > a:only-child:after { content: ''; }

/* About and copyright pages - uses same nav but changes layout*/

/* Switch these pages to main nav with reduced margin */

#mainnav .marginleft110{
margin-left: 110px;
}



#globalnav {
/*border-top: 1px solid #aaa;*/
border-bottom: 1px solid #333;
font: .85em verdana, arial, geneva, helvetica, sans-serif;
font-weight: bold;
letter-spacing: .09em;
background: transparent url(../images/navback.png) repeat-x;
text-align: center;
}

#globalnav ul {
list-style-type: none;
margin: 0 auto;
padding: 8px 0;
vertical-align: middle;
}

#globalnav ul {
height: 2.8em;
}

#globalnav li {
color: #bbb;
display: inline;
padding: 0;
margin: 0;
}

#globalnav li a {
color: #ddd;
padding: 5px 12px;
text-decoration: none;
text-align: center;
border-left: 1px solid #888;
}

#globalnav li.last a {
border-right: 1px solid #888;
}

#globalnav a:hover {
color: #e8e1dc;
background: transparent url(../images/navback_over.png) repeat-x;
border-left: 1px solid #777;
}