/* CSS Document */

/*
CSS - Out of the Box
*/

BODY{
	margin : 0px 0px 0px 0px;
	font-family: Arial, Helvetica, sans-serif;
	height:100%; /* needed for container min-height */
	text-align: center;
	 }
	 
html, body {
	height:auto !important; /* real browsers */
	height:100%; /* IE6: treated as min-height*/
	min-height:100%; /* real browsers */
	background-image: url(images/background.jpg);
	background-repeat:no-repeat;
	background-position: center;

}

div#maintop {
	width: 1000px;
	height: 80px;
	margin-top: 10px;
	background-image: url(images/logo.jpg);
	background-repeat:no-repeat;
	background-position: center;
	}
	

a#button1 {
    display: block;
    width: 223px;
    height: 220px;
    background-image: url(images/extensionfront.jpg);
    margin: 0 auto;
}
a#button1:hover {
    background-image: url(images/extensionback.jpg);
}
a .alt { display: none; }


a#button2 {
    display: block;
    width: 223px;
    height: 220px;
    background-image: url(images/ootbfront.jpg);
    margin: 0 auto;
}
a#button2:hover {
    background-image: url(images/ootbback.jpg);
}
a .alt { display: none; }



a#button3 {
    display: block;
    width: 223px;
    height: 220px;
    background-image: url(images/cwpfront.jpg);
    margin: 0 auto;
}
a#button3:hover {
    background-image: url(images/cwpback.jpg);
}
a .alt { display: none; }


a#button4 {
    display: block;
    width: 223px;
    height: 220px;
    background-image: url(images/usfront.jpg);
    margin: 0 auto;
}
a#button4:hover {
    background-image: url(images/usback.jpg);
}
a .alt { display: none; }


	
#navcontainer
{
width: 1000px;
height: 20px;
margin-left: 3px;
margin-top: 5px;
}

#navcontainer ul
{
color: #cccccc;
width: 100%;
height:100%;
}

#navcontainer ul li
{
display: block;
float: left;
text-align: left;
}

#navcontainer ul li a
{
background: #000033;
height: 20px;
padding-right: 7px;
color: #ffff00;
display: compact;
text-align: left;
font: normal 16px "Trebuchet MS", "Times New Roman", Arial ;
}

#navcontainer li.active a {
    background: #000033;
color: #ff6600;
}

#navcontainer ul li a:hover
{
color: #ff6600;
background: #000033;
}

#navcontainer a:active
{
background: #000033;
color: #ff6600;
}

#navcontainer li#active a hover
{
background: #000033;
color: #66ff00;
}


div#mainbody {
margin: 0px auto;
 width: 1000px;
 height: 450px; 
 padding-top: 5px;
 margin-top: 5px;
}

#leftarea {
	width: 450px;
	height: 450px;
	float: left;
	margin-top: 0px;
	margin-left: 30px;
}

#rightarea {
	width: 450px;
	height: 450px;
	float: left;
	margin-top: 0px;
}



#contenta {
	width: 223px;
	height: 225px;
	background-color:white;
	float: left;
	margin-top: 0px;
	margin-left: 225px;
}

#contentb {
	width: 223px;
	height: 225px;
	background-color:white;
	float: left;
	margin-top: 0px;
	margin-left: 225px;
}

#contentc {
	width: 223px;
	height: 225px;
	background-color:white;
	float: left;
	margin-top: 0px;
	margin-left: 45px;
}

#contentd {
	width: 223px;
	height: 225px;
	background-color:white;
	float: left;
	margin-top: 0px;
	margin-left: 45px;
}

#contentus {
	width: 455px;
	height: 450px;
	float: left;
	margin-top: 0px;
	margin-left: 275px;
}

#contentus h1 { 
	color: black;
	font: bold 16px "rockwell", "Times New Roman", "Arial" ;
	line-height: 18px;
	text-align: left;
	padding-left: 10px;
	padding-top: 10px;
	margin-top: 5px; 
}

#contentus h2 { 
	color: black;
	font: normal 13px "arial", "Times New Roman", "Arial" ;
	font-style: normal;
	line-height: 15px;
	text-align: justify;
	padding-left: 10px;
	padding-right: 10px;
}


/* home page */

#contenthomea {
  background-color:#33cc00;
	width: 160px;
	height: 450px;
	float: left;
	margin-top: 0px;
	margin-left: 40px;
		border: 1px;
	border-style:solid;
	border-color: #cccccc;
}

#contenthomeb {
  background-color:#011141;
	width: 750px;
	height: 450px;
	float: left;
	margin-top: 0px;
	margin-left: 5px;
	border: 1px;
	border-style:solid;
	border-color: #cccccc;
}
#contenthomea h1 { 
	color: #330000;
	font: bold 16px "rockwell", "Times New Roman", "Arial" ;
	line-height: 18px;
	text-align: center;
	padding-left: 0px;
	padding-top: 0px;
	margin-top: 5px; 
}

#contenthomea h2 { 
	color: #330000;
	font: normal 13px "arial", "Times New Roman", "Arial" ;
	font-style: normal;
	line-height: 15px;
	text-align: justify;
	padding-left: 10px;
	padding-right: 10px;
}



div#footer {
	width: 497px;
	height: 27px;
	margin-top: 25px;
	float: left;
	margin-left: 255px;
	background-image: url(images/footer.jpg);
	background-repeat:no-repeat
}


/* Links */

a:link {
color:#ffff00;
background: inherit;
text-decoration : none; 
padding : 0;
margin : 0;
}
a:visited {
color:#ffff00;
background : inherit; 
text-decoration : none; 
}
a:hover {
color:#ff6600;
text-decoration : none; 
}
a:active {
color:#ff6600; 
}

/* TEXT STYLE */


p {
	font-weight: normal;
	color: #ffffff;
	font-size: 10px;
	line-height: 5px;
	text-align:right;
	padding-left: 5px;
}