.dotted-line {
  width: 3px;
  height: 1000px;
  border-right: dotted;
  border-right-color:#CCCCCC;
}




 {
 padding: 0;
 margin: 0;
 border: 0;
 }
 
 body { 
 text-align: center;}
 
 
 A:link{
font-family: georgia, trebucher ms, sans serif;	
font-size: 14px;
font-style: bold;		
line-height: 26px;		
font-weight: bold;
 font-style: normal;
 text-decoration:none;
color: #525252;

}

A:visited{
font-family: georgia, trebucher ms, sans serif;			
color: #525252;
font-weight: bold;
 text-decoration:none;


}

A:active{
font-family: georgia, trebucher ms, sans serif;	
color: #525252;
font-weight: bold;
}

A:hover{
font-family: georgia, trebucher ms, sans serif;	
text-decoration: underline;
color: #333333;
font-weight: bold;
}



#footer A:link{
font-family: verdana, trebucher ms, sans serif;	
font-size: 12px;
font-style: bold;		
line-height: 26px;		
font-weight: bold;
  color: #5a5f47;

}

#footer A:visited{
font-family: verdana, trebucher ms, sans serif;			
  color: #5a5f47;
font-weight: bold;

}

#footer A:active{
font-family: verdana, trebucher ms, sans serif;	
color: #cccccc;
text-decoration: underline;
font-weight: bold;
}

#footer A:hover{
font-family: verdana, trebucher ms, sans serif;	
text-decoration: underline;
color: #cccccc;
font-weight: bold;
}



 
 
 
 #mainContainer {
 width: 840px;
 margin: 0 auto; /* We are going to center this design */
 text-align: left; /* Since we used text-align: center in the body to be sure some older IE versions are going to center our design, we now align the text left */
 }
 
 #header {
 color: #fff;
  z-index:1;

 }
 #content {
 float: left; /* Our content is going to be left aligned */
 width: 571px; /* And it's going to have a 500px width */
 height: 2550px;
    font-family: Georgia, Trebuchet MS, serif;
  font-size: 14px;
  font-style: normal;
  line-height: 26px;
  font-weight: normal;
  color: #525252;
 background-image:url(images/bg_content.png);
 z-index:4;
 }
 
 #h1 {
   font-size: 17px;
  font-style: italic;
  line-height: 30px;
  margin-left: 40px;
  margin-right: 20px;

 }

 #contenttext {
   font-size: 14px;
  line-height: 26px;
  margin-left: 40px;
    margin-right: 20px;
	    font-family: Georgia, Trebuchet MS, serif;
  font-size: 14px;
  font-style: normal;
  line-height: 26px;
  font-weight: normal;
  color: #525252;
 }
 
 #column {
 float: right; /* Our column is going to be right aligned */
 width: 269px; /* Our total width - content width is 260px */
 height: 2550px;
   background-image: url(images/bg_column.png);
  z-index:3;
 }
 
  #columntext {
     font-family: Georgia, Trebuchet MS, serif;
  font-size: 14px;
  font-style: normal;
  line-height: 26px;
  font-weight: normal;
  color: #525252;
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 5px;

 }
 
 #footer {
 clear: both; /* We have to clear our floats */
 width: 840px; /* We need to set the width on the footer since it's outside the mainContainer, and therefor isn't controlled by it */
 margin: 0 auto; /* We need to center the footer also */
 font-family: Verdana, Trebuchet MS, serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  color: #5a5f47;
  z-index:1;

 }