* { padding:0; margin: 0 }

body {
    background: #666;
	font-family: Tahoma, Verdana, Arial, sans-serif;
	font-size: 8pt;
	
}

#container {
width : 750px;
margin-left : auto;
margin-right : auto;
padding : 5px;
background : #F2FAFD;
}

#content { 
padding: 0; 
margin: 0 auto; 
width: 750px;
background:#333; 
color: #000000;
}

#title {	
margin: 0; 
padding:0; 
height: 180px; 
width: 100%; 
background-image: url(/images/newbanner.jpg); 
}
		
#title .pad { padding: 0px 0 }
	
#title h1 { 
font: bold 2.0em "Arial", Sans-Serif; 
margin: 0; 
letter-spacing: -1px; 
color: #fffffe; 
padding-top: 28px; 
background: inherit; 
}
	

						/*NEW MENU*/
/* style the outer div to give it width */
.menu {
width:750px; 
font-size:0.85em;
background: #333 url(/images/grad.jpg);
}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0;
margin:0;
list-style-type:none;
}
.menu ul ul {
width:auto;
}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {
float:left;

position:relative;
z-index: 100;
}

causes IE5 Mac to ignore the following rule, which allows other
browsers to render top-level menu items to their natural width.
Do not edit this rule in any way. */
.menu li {width: auto;}

/* style the links for the top level */
.menu a, .menu a:visited {
display:block;
font: bold 9.0px "Tahoma", sans-serif;
text-Transform: uppercase;
text-decoration:none; 
color:#fff; 
height:35px; 
border-right: 2px solid #666;
border-bottom: 2px solid #333333; 
border-width:1px 1px 0 0; 
background: #333 url(/images/grad.jpg); 
padding-left: 15px;
padding-right: 15px; 
line-height:29px;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
width:150px;
w\idth:139px;
}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {
background:#3399CC;


}
/* style the second level hover */
.menu ul ul a.drop:hover{
background:#3399CC;
}
.menu ul ul :hover > a.drop {
background:#3399CC;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:35px;
left:0; 
width:150px;
}
/* another hack for IE5.5 */
* html .menu ul ul {
top:30px;
t\op:31px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
background:#306799; 
background-position: right;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
color:#fff; 
height: 30px; 
line-height:1em; 
padding:5px 10px; 
width:129px
/* yet another hack for IE5.5 */
}
* html .menu ul ul a{
width:150px;
w\idth:129px;
}


/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{
color: #fff; 
background: #3399CC;
}
.menu :hover > a, .menu ul ul :hover > a {
color:#fff;
background:#3399cc url(/images/dropgradhover.jpg) repeat-y; 

}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible; 
}				

							/*SUB HEADER*/

						
#subheader {	
width: 100%; 
margin:0; 
height: 40px;
background: #333; 
clear:both;
}

#subheader .rside { 
float: right; 
width: 355px; 
height: 40px; 
background: #333; 
margin-left: 20px 
}
		
#subheader .rside .padding  { padding-top: 5px }
		
#subheader .rside input.text { 
background: transparent url(images/input.gif) no-repeat; 
width: 290px; 
height: 27px; 
border:0; 
padding: 2px 0 0 5px }
		
#subheader .rside .btn1 { 
background: url(images/glass.gif) no-repeat; 
width: 30px; 
height: 27px; 
border: 0; 
padding: 2px 0 0 5px; 
cursor: pointer 
}
	
#subheader .lside { 
background: #333;
margin: 0;
padding-left: 10px; 
color: #FFF;  
font-size: 120%; 
height: 40px;
}
		
#subheader .lside .padding { 
padding-top: 5px; 
font-family: Tahoma, Verdana, Arial, sans-serif 
}
		
#subheader .lside a, .lside a:hover  { 
color: #FFF; 
text-decoration: underline; 
background: inherit }

#maincontent { 
width: 100%; 
background: transparent; 
padding-top: 5px; 
}		
	
#maincontent h2 { 
color: #3A3A3A; 
font-family: Tahoma, Verdana, Arial, sans-serif; 
font-size: 12px; 
text-decoration: none; 
line-height: 19px; 
margin: 0 0 5px 0;
padding: 0 5px 0 5px; 
background: inherit; 
}
	
#maincontent h2 a { 
color: #000066; 
font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 12px; text-decoration: none; 
line-height: 19px; 
margin: 0 0 5px 0; 
background: inherit; 
}
	
#maincontent h2 a:hover { 
color: #3366cc; 
text-decoration: underline; 
background: inherit;	
}
	
#maincontent .underline { 
border-bottom: 1px dotted #aaa; 
margin-bottom: 10px;
clear: left; 
}
	
#maincontent h3 { 
font-size:12px;
color: #3366CC; 
background: inherit;
margin: 0 0 5px 5px;
line-height: 19px;
border: 1px dotted; 
}
	
#maincontent p { 
padding: 0 5px 20px 5px; 
color: #454545; 
font: 1.0em "Arial", Sans-Serif; 
margin: 0;  
text-decoration: none; 
background: inherit 
}

#maincontent a {
font: bold 1.0em;
color: #000066;
}

#library {
font:11px verdana,arial,sans-serif; 
width:750px; 
padding:15px 0 0 0; 
line-height:15px;
}

#library div.off {
color:#fff; 
height:33px; 
margin-right:2px; 
line-height:33px; 
padding:0 20px; 
float:left; 
background:url("tabs_0.gif") repeat-x left bottom; 
border:1px solid #ddd; 
border-bottom-color:#000; 
cursor:pointer; 
position:relative; 
z-index:20;
}

#library div.on {
color:#3399FF; 
padding:0 20px; 
margin-right:2px; 
margin-top:1px; 
float:left; 
background:url(tabs_2.gif) repeat-x left bottom; 
border:1px solid #000; 
cursor:pointer; 
border-bottom:0; 
height:33px; 
line-height:32px; 
position:relative; 
z-index:100;}

div.hide {display:none; width:0; overflow:hidden;}

div.show {
clear:left; 
background:#fff; 
width:708px; 
margin-top:0; 
top:-1px; 
border:1px solid #000;
padding:20px; 
position:relative; 
z-index:50; 
font:11px verdana, arial, sans-serif; 
line-height:18px;
}
div.show img {float:left; margin:0 10px 10px 0;}
.clear {clear:both;}

#footer {
clear: both;
border-top: 10px solid #333; 
padding: 30px 0 60px 0; 
font-size: .9em; 
color: #CCFFFF; 
background: #f2fafd url(../images/footer.jpg) repeat-x; 
}
	
#footer a { 
color: #FFF; 
}
	
#col1 { 
float: left; 
width: 250px;
text-align: center; 
border-right: 1px solid #ccc;
color: #CCFFFF; 
}
	
#col2 { 
float: left; 
width: 250px; 
padding: 5px;
text-align: center; 
}
	
#col3 { 
float: right; 
width: 200px; 
border-left: 1px solid #ccc; 
padding: 5px; 
}