/*Basic Elements */

body {
	background-color: #000000;
	text-align: left;
	height: 100%;
	width: 100%;
	font: normal 12px 'Calibri', Arial, Sans-serif;
	background: #212B5C url(../images/headerbg.jpg) repeat-x 0 0;
}

#main{
position: relative;
margin-left: 260px;
}

pre{
	font: normal 12px 'Calibri', Arial, Sans-serif;
	color: #ffffff;
	text-align: left;
	margin: 0;
	padding: 0;
}

/* links */
a {
	color: #9E9E9E;
	background-color: inherit;
	text-decoration: none;
}
a:hover {
	color: #FFFFFF;
	background-color: inherit;
	text-decoration: underline;
} 

/* headers */
h1, h2{
	font: normal 20px 'Trebuchet MS', Arial, Sans-serif;
	color: #9E9E9E;
}
h1 { font-size: 20px; }
h2 { font-size: 20px; text-transform:uppercase; font-weight: bold;}

p, h1, h2 {
	margin: 0;
	padding: 10px 15px;
}

.titel { position: relative;
top: 3px;
left: 190px;
}

/* additional classes */
.clear {	clear: both; }
.gray  {	color: #A0A0A0; }
.green { color: #00FF00; font-style: italic}
.green7 { color: #00FF00; }
.red  { color: #FF0000; }
.yellow  { color: #FFFF00; }
.purple  { color: #AA00FF; }
.white  { color: #FFFFFF; }
.blue { color: #3777EF; } /*3A7CFF*/
.black { color: #000000; }
.t1 {font-size:48px; color: #5B5B5B;}
.t2 {font-size:48px; color: #ABAFB9;}
.t3 {font-size:26px; color: #6481A8;}


/* box */
.box {
	border: 1px solid #0A1646; 
	position:relative; top: 50px;
	background-color: #A5A5A5;	
}

/* Footer */
#footer-wrap{
	clear: both;
	color: #7E7E7E;
	position:static;
	margin-left: auto;
	bottom:0%;
	margin-bottom: 10px;
	font-size: 11px;
}

#footer-wrap a {
	text-decoration: none;
	font-weight: bold;
	color: #FFFFFF;
}

/* Main Content*/ 

.dialog {
 position:relative;
 margin:0px 20px 0px 0px;
 min-width:200px;
 max-width:1000px; /* based on image dimensions - not quite consistent with drip styles yet */
 color:#fff;
 z-index:1;
 margin-left:12px; /* default, width of left corner */
 margin-bottom:6px; /* spacing under dialog */
}

.dialog .content,
.dialog .t,
.dialog .b,
.dialog .b div {
 background:transparent url(../images/dialog.png) no-repeat top right;
}

.dialog .content {
 position:relative;
 zoom:1;
 _overflow-y:hidden;
 padding:10px 10px 10px 20px;
}

.dialog .t {
 /* top+left vertical slice */
 position:absolute;
 left:0px;
 top:0px;
 width:12px; /* top slice width */
 margin-left:-12px;
 height:100%;
 _height:1600px; /* arbitrary long height, IE 6 */
 background-position:top left;
}

.dialog .b {
 /* bottom */
 position:relative;
 width:100%;
}

.dialog .b,
.dialog .b div {
 height:30px; /* height of bottom cap/shade */
 font-size:1px;
}

.dialog .b {
 background-position:bottom right;
}

.dialog .b div {
 position:relative;
 width:12px; /* bottom corner width */
 margin-left:-12px;
 background-position:bottom left;
}

.dialog .hd,
.dialog .bd,
.dialog .ft {
 position:relative;
}

.dialog .wrapper {
 /* extra content protector - preventing vertical overflow (past background) */
 position:static;
 max-height:1000px;
 overflow:auto;  /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */
}

.dialog h1,
.dialog p {
 margin:0px; /* margins will blow out backgrounds, leaving whitespace. */
 padding:5px 0px 5px 0px;
}

.dialog h1 {
 padding-bottom:0px;
}

/*Menu*/

.horizontalmenu{
position: absolute;
top: 125px;
left: 50px;
font: normal 20px 'Calibri', Arial, Sans-serif;
color: #ffffff;
}

.horizontalmenu a{ 
color: #03A0A6;
}

.horizontalmenu a:hover{ /*hover state CSS*/
color: #FFFFFF;
}

.arrowlistmenu{
width: 220px;/*width of accordion menu*/
position: fixed;
top: 200px;
left: 45px;
}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: normal 13px 'Calibri', Arial, Sans-serif;
color: #ffffff;
background: transparent url("../tools/styles/metallic/parent_normal7.png") no-repeat;
margin: 0px;
margin-bottom: 2px; /*bottom spacing between header and rest of content*/
padding: 4px 0 4px 10px; /*header text is indented 10px*/
cursor: hand;
cursor: pointer;
}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background-image: url(../tools/styles/metallic/parent_active7.png);
}

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
font: normal 13px 'Calibri', Arial, Sans-serif;
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 1px; /*bottom spacing between each UL and rest of content*/

}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li .opensubheader{ /*Open state CSS for sub menu header
background: lightblue !important;*/
}

.arrowlistmenu ul li .closedsubheader{ /*Closed state CSS for sub menu header
background: lightgreen !important;*/
}

.arrowlistmenu ul li a{
color: #ffffff;
background-image: url("../tools/styles/metallic/sub7.png");
background-repeat:no-repeat;
display: block;
border-bottom: none;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
}

.arrowlistmenu li a.subexpandable{ 
margin-bottom: 4px; /*bottom spacing between header and rest of content*/
}

.arrowlistmenu ul li a:visited{
color: #ffffff;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #9E9E9E;
}

.arrowlistmenu ul li a.subexpandable:hover{ /*hover state CSS for sub menu header
background: lightblue;*/
}