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

/*RESET AND BASICS*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: bottom;
	background: transparent;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

html { overflow-y: scroll; }
a {
	text-decoration: none;
	outline: none;
	color: #003466;
	
}
a img { border: 0; background: none; }

.clear { clear: both; }
.alignCenter { text-align: center; }
.floatLeft { float: left; }
.floatRight { float: right; }
.blue-font {
	color: #003399;
	font-weight: bold;
}
.bigcap {
	font-size: x-large;
}

body {
	line-height: 1;
	font-family: Georgia, "Times New Roman", Times, serif;
	background-image: url(images/fade-bg.gif);
	background-repeat: repeat-x;
	background-position: center top;
}

/*quote on index page*/
blockquote {
	font-size: 0.7em;
	padding: 6px;
	text-align: right;
	width: 177px;
	float: right;
	position: absolute;
	left: 459px;
	line-height: 1.2em;
	top: 274px;
}


ol	{
	list-style:decimal;
	list-style-position: inside;
	margin-left: 15px;
}

ol li	{
	padding-bottom: 10px;
	color: #336699;
	font-style: italic;
	line-height: 20px;
	font-size: 14px;
}
ul li ul li	{
	z-index:3;
}

td	{
	padding: 5px 0 5px 0;
	font-size: 14px;
}

/*main container div*/
#page-wrap {
	width: 960px;
	margin: 0 auto;
	background-color: #ffffff;
	border: medium solid #003366;
}
#header-wrap {
	width: 100%;
}

#header {
	background-image: url(images/header-logo.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 155px;
}

#header  h1   {
	text-indent: -99999px;
}
#top-nav	{
	width: 100%;
	float: left;

}
#top-nav ul	{
	margin: -32px 0 0 300px;
	line-height: 32px;
	height: 30px;
	background-color: #003366;
}
#top-nav li	{
	float: left;
	background-color: #003366;
	padding: 0 8px;
	border-right: 1px dotted #fff;
	height: 30px;
	position: relative;
	
}
#top-nav li:last-child	{
	border-right: none;
}
#top-nav a{
	color: #ffffff;
	padding: 0 8px;
}
#top-nav a:hover	{
	color: #ffffff;
}
#top-nav li:hover	{
	background-color: #336699;
}
#top-nav ul li ul	{
	margin:0;
	position: absolute;
	width: 9em;
	left: -2px;
	top: 30px;
	display: none;
}
#top-nav ul li:hover ul, #top-nav ul li ul:hover li	{
	display: block;
	z-index: 5;
}

#top-nav ul li ul li	{
	width: 100%;
	border-left: 1px dotted #fff;
	border-bottom: 1px dotted #fff;
	border-right: 1px dotted #fff;
}
		
#top-nav ul li ul li:first-child	{
	border-top: 1px dotted #fff;
}

/*layer with blue-gray image on the right side of every page - nothing else is on this layer - this layer is locked in the template*/
#main-content-wrap {
	background-image: url(images/gray-right-side.png);
	background-repeat: no-repeat;
	background-position: right bottom;
	position: relative;
	float: right;
	height: 404px;
	width: 650px;
}
/*wraps around main-content on index only. the main image on that page is in the background*/
#index		{
	background: url(images/delpic2.jpg) no-repeat 30px 260px;
	width: 100%;
	
}	
#main-content  {
	background: transparent;
	height: 404px;
	padding: 0 20px;
	/*position: relative;*/
	/*width: 595px;*/
	
}

#main-content p {
	font-size: 12px;
	line-height: 20px;
	margin-bottom: 10px;
}

#main-content a	{
	text-decoration: underline;
}

#main-content a:hover	{
	background: #336699;
	color: white;
	padding: 2px;
}

#main-content h1 {
	margin-top: 10px;
	margin-bottom: 10px;
	color: #336699;
	font-size: 20px;
}

#main-content h2 {
	margin-bottom: 10px;
	color: #336699;
	font-size: 16px;
}
#main-content h3	{
	margin: 10px 0 10px 0;
	color: #336699;
	font-size: 14px;
}	
#main-content h4	{
	margin: 10px 0 10px 0;
	font-size: 14px;
}
#main-content h5	{
	margin-top: 3px;
	padding-bottom: 3px;
	border-bottom: thin solid #369;
}

#left-sidebar  {
	background-image: url(images/left-sidebar.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	float: left;
	height: 404px;
	width: 310px;
	}

#left-sidebar li {
	font-size: 14px;
	text-transform: none;
	font-weight: bold;
	
}

#left-sidebar li a {
	color: #333366;
}

#left-sidebar h2 {
	font-size: 18px;
	color: #FFFFFF;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 15px;
}



#footer li {
	font-size: 10px;
	color: #003366;
	border-right: thin solid #003366;
	width: 60px;
	display: inline;
	padding: 0 10px 0 6px;
}

#outer-footer  {
	border-top: medium solid #003366;
	clear: both;
	height: 60px;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
}

#footer {
	text-align: center;
}

#footer li a:link, #footer li a:visited {
	color: #003366;
}

#footer li a:hover, #footer li a:active{
	font-weight: bold;
	background-color: #fff;
}

#footer li.last {
	border-right-style: none;
}

#outer-footer  p {
	font-size: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
}
/*The .lightblue and .darkblue create boxes for text that were originally used for client testimonials.  The dark blue properties were modified and used in the SpryAssets sprytooltip box on the client page */
.lightblue	{
	background-color: #9bb8c6;
	color: #ffffff;
	padding: 8px;
	margin-bottom: 5px;
	border: thin dotted #ffffff;
	width: 550px;
	font-size: 10px;
	font-style: italic;
}

.darkblue	{
	background-color: #003366;
	color: #ffffff;
	padding: 8px;
	margin-bottom: 5px;
	border: thin dotted #ffffff;
	width: 550px;
	font-size: 10px;
	font-style: italic;
}

.darkblue p, .lightblue p	{
	margin: 0;
}
/*used on partnership page to place the images */	 
.partnerbox	{
	display: block;
	margin-bottom: 20px;
	width: 425px;
}

.partnerbox	img	{
	float: left;
	padding-right: 20px;
}
	

/*.bar1 - .bar5 are the navigation on the left side of the page.  Each is a slightly different size because of the curve in the design*/
.bar1, .bar2, .bar3, .bar4, .bar5	{
	height: 47px;
	padding: 6px 0 0px 10px;
}

.bar1	{
	background: url(images/left-menu-bar.png) repeat-x;
	width: 281px;
}

.bar2	{
	background: url(images/left-menu-bar.png) repeat-x;
	width: 278px;
}

.bar3	{
	background: url(images/left-menu-bar.png) repeat-x;
	width: 271px;
}

.bar4	{
	background: url(images/left-menu-bar.png) repeat-x;
	width: 262px;
}

.bar5	{
	background: url(images/left-menu-bar.png) repeat-x;
	width: 252px;
}

.bar1:hover, .bar2:hover, .bar3:hover, .bar4:hover, .bar5:hover {
	background: url(images/left-menu-baron.png) repeat-x;
	
}
/*The image-container holds the small rounded rectangular images on some of the pages.*/
#image-container	{
	width: 100%;
	float: right;
	
	
}
.image	{
	float: right;
	margin-right: 70px;
	margin-top: 40px;
	
	
}
#testimonials	{
	width: 250px;
	padding-left: 9px;
	padding-right: 9px;
}
td.suppport	{
	color: #036;
	padding-left: 10px;
	font-weight: bold;
}