*
{
font-family: Arial;
}

body
{
background-image: url(../Images/BackgroundImage1.png);
}

h1
{
color: #1e4173;
font-size: 1.25em;
font-weight: bold;
}

h2
{
color: #000000;
font-size: 1.10em;
font-weight: bold;
}

.TextBold
{
font-weight: bold;
}

.RequiredField
{
font-size: 0.7em;
color: red;
}

.Verification
{
font-size: 1.25em;
color: red;

}

#PageWrapper
{
/*
Sets total width for the entire page.
*/
width: 844px;
margin-left: auto;
margin-right: auto;
}

#Header
{
/*
Gives the header the same width as the PageWrapper.  
The height creates some room for the logo that is set as the background image.
*/
background-image: url(../Images/BacHeaderImage6.png);
width: 844px;
height: 177px;
}

.HeaderLink
{
/*
The #HeaderLink is nested in the #Header. It provides a link to the homepage.
*/
width: 844px; 
height: 177px; 
display: block;	
}

#TopMenu
{
/*
The menu spans the page width, right below the header.
At the top left a few pixels padding is applied to create some room.
*/
background-color: #000000;
width: 827px;
height: 20px;
padding-top: 7px;
padding-left: 17px;
}

#SideMenu
{
/*
The menu is positioned on the left of the MainContent area.  It gets 
the same font-size and minimum height as #MainContent.  This is where
the main navigation menu will go.
*/

background-color: #c0c0c0;
width: 161px;
padding-top: 10px;
padding-left: 10px;
border-left: 1px solid #c0c0c0;
float: left;
}

#SideNav
{
width: 150px;
background-color: #c0c0c0;
}

#SideNav a
{
font: bold 13px Arial;
padding: 2px;
display: block;
width: 100%;
color: black;
text-align: center;
text-decoration: none;
border-bottom: 1px solid black;
}

html>body #SideNav a
{ /*Non IE rule*/
width: auto;
}

#SideNav a:hover
{
background-color: black;
color: white;
}


#MainContent
{
/*
Defines the main content area.  The #MainContent element has a minimum height of
500 pixels, but can grow if necessary.  The font size is 80% of its parent element,
which in this case comes down to 80% of the font the user has specified as the 
default font in the browser. 
*/
font-size: 0.8em;
width: 649px;
border-left: 2px solid black;
border-right: 1px solid #c0c0c0;
background-color: #C0C0C0;
padding-left: 10px;
padding-right: 10px;
padding-top: 5px;
float: left;
}

#Footer
{
/*
The footer is positioned below all otyher content (yet still within PageWrapper).  
At the top, it gets a border with a dashed style, while all other sides have no 
border.  clear: both is used to clear the impact of the float properties used for #SideMenu and #MainContent.
*/
clear: both;
height: 37px;
font-size: 0.7em;
color: White;
background-color: #000000;
text-align: center;
line-height: 37px;
}

#Footer a
{
font-weight: bold;
color: #ffffff;
text-decoration: none;
}

#Footer a:hover
{
font-weight: bold;
color: #C0C0C0;
text-decoration: none;
}