/* (C) Copyright 2006-2008 Long2 Consulting. This CSS file formats the fonts, colors, links as well as setting how 
certain elements on the page are displayed.  */

html {
	height: 100%; 
	margin-bottom: 1px;
}

body {
	margin: 0px;
	padding: 0px;
	font: 76.4% Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	background-color: #d7d7d7;
}

hr {
	background-color: #ffffff;
	color: #1a204f;
	border: none;
	height: 1px;
	width: 100%;
}

table {
	border-collapse: collapse;
}

ul {
	list-style-image: url('images/bullet.gif');
	padding: 0;
	margin: 0 0 20px 30px;
	line-height: 135%;
}

ol{
	padding: 0;
	margin: 0 0 20px 30px;
	line-height: 135%;
}

p {
	padding: 3px 0;
	margin: 0;
	line-height: 135%;
}


/*  The items below the properties for the links that appear in the
main text area as well as in the sidebar of the pages  */

a:link, a:visited {
	color: #1a204f;
	text-decoration: underline; 
}

a:hover, a:active {
	color: #548dee;
}

/*  The items below set the properties for the fonts, sizes, and
colors used for headings 1 through 6. Typically h1 - h3 are used
in the main content area and h4 - h6 are used in the sidebar  */

h1 { 
	color: #1a204f;
	font-size: 155%;
	text-align: left;
	border-bottom: 4px solid #1a204f;
	margin: 8px 0;
}

h2 {	
	font-size: 145%;
	color: #548dee;
	text-align: left;
	margin: 4px 0;
}

h3 {	
	font-size: 125%;
	color: #888888;
	text-align: left;
	margin: 4px 0;
}

h4 { 
	font-size: 125%;
	color: #1a204f;
	background-color: #C8DBF9;
	margin: 4px 0;
	padding: 4px;
}

h5 { 
	font-size: 110%;
	color: #ffffff;
	background-color: #548dee;
	margin: 4px 0;
	padding: 4px;
}

h6 { 
	font-size: 110%; 
	color: #1a204f;
	margin: 4px 0;
	padding: 4px;
}

.center {
	text-align: center;}

/*  This class can be applied to your buttons to create uniform submit or shopping cart buttons without using graphics.  */

.submitbuttons {
	font-weight: bold;
	color: #1a204f;
	text-align: center;
	font-size: 100%;
	font-variant: small-caps;
	font-family: Verdana, Arial, sans-serif;
	border-top: 2px solid #1a204f;
	border-right: 1px solid #1a204f;
	border-bottom: 4px solid #1a204f;
	border-left: 1px solid #1a204f;
	background-color: #C8DBF9;
	width: 155px;
	height: 30px;
}

/*  The items below set the properties of the top header.  */

.headerleft {
	padding: 35px 15px 0px 25px;
	text-align: left;
	font-size: 30pt;
	color: #1a204f;
	font-family: "Trebuchet MS", Arial, Verdana, sans-serif;
}

.headerleftimage {
	padding: 10px 0px 0px 16px;
	text-align: left;
}


.headerright {
	padding: 86px 15px 10px 15px;
	text-align: right;
}

.headernavlinks {
	color: #ffffff;
	font-weight: bold;
}

.headernavlinks a:link, .headernavlinks a:visited {
	padding: 6px 15px 10px 15px;
	color: #ffffff;
	background-color: #548dee;
	text-decoration: none;
}
	
.headernavlinks a:hover, .headernavlinks a:active {
	color: #ffffff;
	background-color: #1a204f;
}


/*  The items below set the properties of the middle navigation links.  */

.topnavlinks {
	color: #1a204f;
	font-weight: bold;
	padding: 7px 0 8px 12px;
	text-align: center;
}

.topnavlinks a:link, .topnavlinks a:visited {
	padding: 6px 15px 8px 15px;
	color: #ffffff;
	background-color: #548dee;
	text-decoration: none;
}
	
.topnavlinks a:hover, .topnavlinks a:active {
	color: #ffffff;
	background-color: #1a204f;
}


/*  The items below sets the properties for the middle graphic area.  */

.middleleft {
	color: #ffffff;
	font-weight: bold;
	font-size: 125%;
	padding: 25px 0 0 25px;
}

.middleright {
	color: #ffffff;
	font-weight: bold;
	font-size: 125%;
	padding: 25px 10px 0 0;
}

/*  The items below sets the properties for the sidebars and
content blocks as well as a main content areas.  */

/* Used in single column layouts */

.bodycolumncontent {
	padding: 0px 20px 5px 20px;
}

/* Used in two column layouts */

.body1content {
	padding: 4px 20px 5px 0px;
}

.body2content  {
	padding: 8px 0px 5px 20px;
}

/* Used in three column layouts */

.body1bcontent {
	padding: 0px 10px 5px 10px;
}

.body2bcontent {
	padding: 8px 0px 5px 20px;
}

.body3content {
	padding: 4px 0 0 0;
}

/*  The items below sets the properties for the left or right sidelinks.  */

.menuheader1 {
	width: 160px;
	background-color: #C8DBF9;
    text-align: left;
    padding: 4px;
    margin: 4px 0 0 0;
    border-bottom: 4px solid #1a204f;
	color: #1a204f;
}

.menuheader1 a:link, .menuheader1 a:visited {
	color: #1a204f;
	text-decoration: none;
	font-weight: bold;
}

.menuheader1 a:hover, .menuheader1 a:active {
	color: #1a204f;
}

.menuheader2 {
	width: 160px;
	background-color: #1a204f;
    text-align: left;
    padding: 4px;
    margin: 4px 0 0 0;
    border-bottom: 4px solid #548dee;
	color: #fff;
}

.menuheader2 a:link, .menuheader2 a:visited {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

.menuheader2 a:hover, .menuheader2 a:active {
	color: #C8DBF9;
}


.sidelinks {
	margin: 4px 0px 2px 0px;
	padding: 0px;
	text-align: left;
	font-weight: bold;
}

.sidelinks a:link, .sidelinks a:visited {
	padding: 0px 10px 0px 10px;
	display: block; 
	line-height: 18pt;
	width: 148px;
	color: #1a204f;
	background-color: #fff;
	text-decoration: none;
}
	
.sidelinks a:hover, .sidelinks a:active {
	color: #ffffff;
	background-color: #548dee;
}

/*  The items below set the properties of the bottom navigation links.  */

.bottomnavlinks {
	color: #1a204f;
	font-weight: bold;
	font-size: 80%
}

.bottomnavlinks a:link, .bottomnavlinks a:visited {
	padding: 0px 6px 10px 6px;
}
	
.bottomnavlinks a:hover, .bottomnavlinks a:active {
}

/*  The items below sets the properties for the footer.  */

.footercontent {
	padding: 22px 10px 0px 10px;
	color: #1a204f;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
}

.footercontent a:link, .footercontent a:visited  {
	padding: 4px 4px;
	color: #1a204f;
	text-decoration: none;
}

.footercontent a:hover, .footercontent a:active {
	padding: 4px 4px;
	color: #548dee;
	text-decoration: underline;
}

.clear {
	clear: both;
}

/*  The items below sets the properties for additional typography and page elements.  */

.block1 {
	color: #ffffff;
	text-align: left;
	font-family: Verdana, Arial, sans-serif;
	border-top: 1px solid #C8DBF9;
	border-bottom: 4px solid #C8DBF9;
	background-color: #1a204f;
	padding: 6px;
	margin-bottom: 8px;
}

.block2 {
	color: #ffffff;
	text-align: left;
	font-family: Verdana, Arial, sans-serif;
	border-top: 1px solid #1a204f;
	border-bottom: 4px solid #1a204f;
	background-color: #548dee;
	padding: 6px;
	margin-bottom: 8px;
}

.block3 {
	color: #1a204f;
	text-align: left;
	font-family: Verdana, Arial, sans-serif;
	border-top: 1px solid #1a204f;
	border-bottom: 4px solid #1a204f;
	background-color: #C8DBF9;
	padding: 6px;
	margin-bottom: 8px;
}

.news1 {
	padding: 4px;
	display: block; 
	width: 160px;
	color: #ffffff;
	background-color: #1a204f;
	border-bottom: 2px solid #548dee;
	font-weight: bold;
	text-align: center;
}

.news2 {
	padding: 4px;
	display: block; 
	width: 160px;
	color: #1a204f;
	background-color: #C8DBF9;
	border-bottom: 2px solid #1a204f;
	font-weight: bold;
	text-align: center;
}

blockquote {
	color: #ffffff;
	background-color: #1a204f;
	padding: 2px 12px;
	font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size: 115%;
	font-style: italic;
	font-weight: bold;
	border: 2px solid #C8DBF9;
}

.tiny {
	font-size: 80%;
}

/*  Your smaller images can be floated to the left or the
right so your text can flow around them. You can also have
the images appear with or without a small border. The items
below sets the properties for the classes you may apply to
your images.  */

.image-border {
	border: 3px double #548dee;
}
	
.imageleft-noborder {
	margin: 0 10px 0 0; 
	float: left;
}

.imageright-noborder {
	margin: 0 0 0 10px; 
	float: right;
}
	
.imageleft-border {
	margin: 0 10px 0 0; 
	float: left;
	border: 3px double #548dee;
}

.imageright-border {
	margin: 0 0 0 10px; 
	float: right;
	border: 3px double #548dee;
}


/*  All of the items below change the layout of the template. We advise that you don't change any of these settings unless you are an advanced CSS user. If you change these settings and mess up the template, we cannot provide support for the template.  */

/*  To keep the content centered on the page, all of the areas
are placed within a wrapper. The item below defines this wrapper.  */

#wrapper {
	margin: 0px auto; /* fix to center in firefox */
	width: 1000px;
	background: url('images/wrapper.jpg') repeat-y;
}

#header {
	text-align: center;
	margin: 0px auto; /* fix to center in firefox */
	width: 1000px;
	background: url('images/header2.jpg') no-repeat;
	height: 110px;
}

#headerleft {
	float: left;
	width: 350px;
	height: 110px;
}

#headerright {
	float: right;
	width: 650px;
	height: 110px;
}

#middle {
	margin: 0px auto; /* fix to center in firefox */
	background: url('images/middle2.jpg') no-repeat;
	width: 1000px;
	height: 229px;
}

#middleleft {
	float: left;
	width: 315px;
}

#middleright {
	float: right;
	width: 415px;
}


#topnav {
	margin: 0px auto; /* fix to center in firefox */
	background: url('images/topnav.jpg') no-repeat;
	width: 1000px;
	height: 31px;
}

/* Used in single column layouts */

#bodycolumn {
	width: 1000px;
	clear: both;
	min-height: 300px;
}

/* Used in two column layouts */
#body1 {
	width: 790px;
	float: right;
	min-height: 300px;
}

#body2 {
	float: left;
	width: 200px;
}

/* Used in three column layouts */
#body1a {
	width: 790px;
	float: left;
}

#body1b { 
	width: 590px;
	float: right;
}

#body2b {
	width: 200px;
	float: left;
}

#body3 {
	width: 160px;
	float: right;
	margin-right: 26px;
}

/*  The items below sets the properties for the footer.  */

#footer {
	clear: both;
	margin: 0px auto; /* fix to center in firefox */
	background: #d7d7d7 url('images/footer.jpg') no-repeat;
	background-position: top left;
	height: 75px;
	width: 1000px;
}