/*********THIS IS FOR THE TOP DROP NAV *****************/

/* remove the bullets, padding and margins from the lists */
.menu ul{
list-style-type:none;
padding:0;
margin:0 auto;
position:relative;
}
/* make the top level links horizontal and position relative so that we can position the sub level */
.menu li{
float:left;
position:relative;
text-decoration:none;
}

/* use the table to position the dropdown list */
.menu table{
position:absolute;
border-collapse:collapse;
z-index:80;
left:-1px;
top:25px;
z-index:1000;
}

/* style all the links */
.menu a:link, .menu :visited {
display:block;
font-size:12px;
font-weight:bold;
width:130px;
padding:7px 0;
color:#ffffff;
background-color:#990000;
background-image:url();
background-repeat:repeat-x;
text-decoration:none;
margin-right:0px;
text-align:center;
font-family:arial, verdana, sans-serif;
}
/* style the links hover */
.menu a:hover{
color:#990000;
background:#ffffff;

}

/* hide the sub level links */
.menu ul ul {
visibility:hidden;
position:absolute;
width:130px;
height:0;
z-index:1000;
}
/* make the sub level visible on hover list or link */
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible;
}








#nav {position:relative; z-index:100; margin:2px 0 2px 0;}
#nav h2 {font-family: arial, sans-serif; font-weight:normal; color:#090;}
#nav h3 {font-family:  arial, sans-serif; font-weight:normal;}


/* Get rid of the margin, padding and bullets in the unordered lists Dont touch*/
#pmenu {padding:0; margin:0 auto; list-style-type: none; display:table;}
#pmenu ul {padding:0; margin:0; list-style-type: none; display:block;}

/* Hide the sub levels Dont touch*/
#pmenu li ul {display:none;}

/* Set up the link size, color and borders */
#pmenu li a, #pmenu li a:visited {display:block; background-image: url(../image-files/nav-background.jpg);  width:120px; font-size:11px; font-weight:normal; color:#fff; height:25px; line-height:24px; text-decoration:none; text-indent:5px; border:transparent; border-width:0; text-align:center;}

/* Set up the sub level borders */
#pmenu li ul li a, #pmenu li ul li a:visited {border-width:0;}
#pmenu li a.enclose, #pmenu li a.enclose:visited {border-width:0;}

/* Set up the list items */
#pmenu li {float:left; background: #003300;}


#pmenu li.tc {display:table-cell;}

/* For Non-IE browsers and IE7 */
#pmenu li:hover {position:relative;}

/* Make the hovered list color persist */
#pmenu li:hover > a { background-image: url(../image-files/nav-background-on.jpg); color:#ffcc00;}/*this is the font and background color on hover*/
/* For Non-IE and IE7 make the sublevels visible on list hover. This is all it needs */
#pmenu li:hover > ul {display:block; position:absolute; top:-11px; left:80px; padding:10px 30px 30px 30px; background:transparent url(transparent.gif); width:120px;}
/* Position the first sub level beneath the top level links */
#pmenu > li:hover > ul {left:-30px; top:16px;}

/* get rid of the table */
#pmenu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100; font-size:1em;}

/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
* html #pmenu li a:hover {position:relative; background:#0099ff; color:#000;}

/* For accessibility of the top level menu when tabbing */
#pmenu li a:active, #pmenu li a:focus {background:#0033cc; color:#c00;}
/* Set up the pointers for the sub level indication */

/* This below is for IE5.5 and IE6 ONLY and is necessary to make the sublevels appear Dont touch*/

/* change the drop down levels from display:none; to visibility:hidden; */
* html #pmenu li ul {visibility:hidden; display:block; position:absolute; top:-11px; left:80px; padding:10px 30px 30px 30px; background:transparent url(transparent.gif);}

/* keep the third level+ hidden when you hover on first level link */
#pmenu li a:hover ul ul{
visibility:hidden;
}
/* keep the fourth level+ hidden when you hover on second level link */
#pmenu li a:hover ul a:hover ul ul{
visibility:hidden;
}


/* make the second level visible when hover on first level link and position it */
#pmenu li a:hover ul {
visibility:visible; left:-30px; top:14px; lef\t:-31px; to\p:15px;
}

/* make the third level visible when you hover over second level link and position it and all further levels */
#pmenu li a:hover ul a:hover ul{ 
visibility:visible; top:-11px; left:80px;
}
/* make the fourth level visible when you hover over third level link */
#pmenu li a:hover ul a:hover ul a:hover ul { 
visibility:visible;
}











/*********THIS IS FOR THE LEFT NAV LINKS *****************/
.left-nav {
width: 100%;
font-family:  Arial, sans-serif;
background-color: transparent;
font-weight: normal;
font-size:90%;
}

.left-nav ul {
list-style-type: none;
padding: 0 0 8px 5px;
margin: -6px 0 0 0;
}

.left-nav li {
background-color: transparent;       
border-bottom: 1px dotted #cccccc;
margin-bottom: 5px;
}

/* -- Navigation Link styles -- */




.left-nav a {
padding: 3px 3px 3px 20px;
text-decoration: none;
display: block;
background-color: transparent;
border: transparent;
position: relative;
left: -10px;
color: #006699;
}

.left-nav a:visited {
color: #006699;
background-color: transparent;
text-decoration: none;
}

.left-nav a:hover {
color: #333333;
background-color: transparent;
text-decoration: none;
background-image: url(../image-files/nav-icon.png);
background-position: left center;
background-repeat: no-repeat;
}

/* --Right Navigator Styles --*/

#navigator {

}

.housebutton {
line-height: 90%;
}

.housebutton a {
font-size: 93%;
font-family:  Verdana, sans-serif;
}

.housebutton a:hover {
font-size: 93%;
font-family:  Verdana, sans-serif;
}


/* this part below is for the color on the background, surrounding the buttons. Change the color, and the 
border, if you like. For the border, you can use solid, dashed, or dotted, for different border styles*/

#navigator {

background-color: transparent;

border:  transparent;


width: auto;

margin-top: auto;

margin-left: 10px;

margin-right: auto;

padding: 2px;

text-align: left;


}

/* want more space between your buttons? just increase the margins
from 1px. Font weight can be bold if you prefer.*/

.housebutton {

font-weight: bold;
text-align: left;
margin-bottom: 0px;
margin-top: 0px;
}


/* this part is for the colors of your buttons "at rest" so to speak.*/




.housebutton a {

padding: 4px;

text-decoration: none;

display: block;

color: #306754; /*this is where you change the button font color*/

background-color: transparent;

border-top: none;

border-left: none;

border-bottom: none;

border-right: none;

}

/*this part is how the buttons look, once the pointer passes over them. */




.housebutton a:hover {

color: #ffcc00; /*-----this is where you change the button font color, when the button is hovered over*/

background-color: transparent;

border-top:  none;

border-left: none;

border-bottom:  none;

border-right: none;

}