@charset "utf-8";
/* CSS Document */

* { 
margin: 0px; 
padding: 0px;
} 

body { 
font: 10px Arial, Helvetica, sans-serif;
/*No Text Align Needed to center container div for IE if you use the * rule listed above.*/ 
} 

/* Gave both headers different names to easily differentiate the two. Also made them IDs instead of classes because they are only used once on each page. I took them out of the container and gave them auto margins for centering on the page and a clear both value.*/ 
#header_container {
	width:960px;

}
#top_header {
	background-image:url(images_test/header.jpg);
	background-repeat:no-repeat;
	margin-top:21px;
	margin-left:41px;
	height:136px;
	width:675px; 
	color:white; 
	float:left;
	clear:both;
	display:inline;
} 
#right_header {
	width:244px;
	float:right;
	text-align:right;
	height:106px;
	margin-top:21px;
	padding-top:30px;
	display:inline;
}
#sub_header {
	width:100%;
	height:10px;
	background-image:url(images_test/line.gif);
	background-repeat:repeat-x;
	clear:both;
}
/*Used to hold all basic_row containers*/ 
#container { 
width: 960px;
} 

/*Used to hold the different column floats*/ 
.basic_row {
	width:960px;
clear: both;
} 

/*Depending on what you want to do you can style these anyway you want as long as their combined width stays with in that 750px range. Don’t forget to account for padding, margins and borders. Either create one class and use it twice (or thrice) or create a style for each individual column (cell really) as you did. I did an example of both for the two column rows.*/ 
.two_col {
	margin-top:42px;
	margin-left:40px;
	float: left;
	width:25%;
	height:395px;
	font-family: Arial, Helvetica, sans-serif;
} 
.two_col_new {
	margin-top:42px;
float:right;
width:70%;
height:375px;
}
.two_col_left 
{ 
float: left; 
width:290px; 
height:100%;
margin-left:40px;
margin-top:41px;
} 
.two_col_right 
{ 
float: left; 
width:290px; 
height:100%;
margin-left:25px;
margin-right:25px;
margin-top:41px;
} 
.two_col_mid
{
float:right;
width:290px;
height:100%;
margin-top:41px;
}
/*Used to clear all floats on in a row. Noticed it is placed before the closing tag of the basic_row div.*/ 
.clear_float { 
font-size: 0px; 
line-height: 0px; 
clear: both; 
} 

/*Footer is set up the same as the header. but will be placed under the container div*/ 
#footer {
	color:black;
	clear:both;
	height: 15px;
	width: 960px;
	text-align: right;
	margin-top:41px;
} 
#container .basic_row .two_col p {
	font-size: 12px;
}

h1 {
	font-size:16px;
	color:#333366;
	text-decoration:none;
}

p {
	font-size:12px;
}

p1 {
	font-size:10px;
	color:#333366;
	font-weight:bold;
}

a.first {
	text-decoration:none;
	color:#333366;<a href="images_test">images_test</a>
}
a.footer {
	color:#000;
	text-decoration:none;
	font-size:10px;
}

a.second {
	color:#84c241;
}

img {
	border:none;
}
#nav ul li a	{
	text-decoration:none;
	color:#333366;
	display:block;
}
#nav li	{
	list-style:none;
}
#nav a:hover	{
	background:#99cc33;
	color:#FFF;
}