@charset "utf-8";
/* CSS Document */
html, body{ 
 margin:0; 
 padding:0; 
 text-align:left; 
}
td, th {
	color: #000033;
		font-family:Verdana, Arial, Helvetica, sans-serif;
}
p{
	color:#000033;
		font-family:Verdana, Arial, Helvetica, sans-serif;
}

h1, h2 {
	color: #003366;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

h3, h4, h5, h6 {
	color: #006699;
		font-family:Verdana, Arial, Helvetica, sans-serif;
}
a {
	color:#000066;
	text-decoration:underline;
}
form {
	background-color: #CCCC99;
}
#pagewidth{
	width:850px;
	text-align:left;
	margin-left:auto;
	margin-right:auto;
	background-color: #fff;
} 
 
#header{
	position:relative;
	height:180px;
	background-color:#FFFFFF;
	background-position:center;
	background-repeat:no-repeat;
	width:100%;
} 
 
#leftcol{
	width:10%;
	float:left;
	position:relative;
	min-height: 420px;
}

 
#twocols{
	width:90%;
	float:right;
	position:relative;
	clip: rect(225,auto,auto,auto);
  }
 
#rightcol{
	width:26%;
	float:right;
	position:relative;
	background-color: #ddf8ff;
 }
 
#maincol{
	background-color: #fff;
	float: left;
	display:inline;
	position: relative;
	width:64%;
 }
#maincol p{margin:1em;
} 


#outer {
	height:40px;
}

.preload {background: url(../images/navt4.gif);}
.menu {
	padding:0 0 0 32px;
	margin:0;
	list-style:none;
	height:40px;
	background:#fff url(../images/nav1a.gif) repeat-x;
	position:relative;
	z-index:500;
	font-family:arial, verdana, sans-serif;
	background-image: url(../images/nav1a.gif);
}
.menu li.top {display:block; float:left; position:relative;}
.menu li a.top_link {
	display:block;
	float:left;
	height:40px;
	line-height:33px;
	color:#C2F0FE;
	text-decoration:none;
	font-size:11px;
	font-weight:bold;
	padding:0 0 0 12px;
	cursor:pointer;
}
.menu li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:40px;}
.menu li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:40px; background:url(../images/down.gif) no-repeat right top;}
.menu li a.top_link:hover {color:#fff; background: url(../images/navt4.gif) no-repeat;}
.menu li a.top_link:hover span {background:url(../images/navt4.gif) no-repeat right top;}
.menu li a.top_link:hover span.down {background:url(../images/navt4a.gif) no-repeat right top;}

.menu li:hover > a.top_link {color:#fff; background: url(../images/navt4.gif) no-repeat;}
.menu li:hover > a.top_link span {background:url(../images/navt4.gif) no-repeat right top;}
.menu li:hover > a.top_link span.down {background:url(../images/navt4a.gif) no-repeat right top;}


.menu table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}

/* Default link styling */

/* Style the list OR link hover. Depends on which browser is used */

.menu a:hover {visibility:visible;}
.menu li:hover {position:relative; z-index:200;}

/* keep the 'next' level invisible by placing it off screen. */
.menu ul, 
.menu :hover ul ul, 
.menu :hover ul :hover ul ul,
.menu :hover ul :hover ul :hover ul ul,
.menu :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

.menu :hover ul.sub {
	left:2px;
	top:40px;
	background: #C6F7FF;
	padding:3px 0;
	border:0;
	white-space:nowrap;
	width:93px;
	height:auto;
}
.menu :hover ul.sub li {display:block; height:20px; position:relative; float:left; width:92px;}
.menu :hover ul.sub li a {display:block; font-size:11px; font-weight:bold; height:20px; width:99px; line-height:20px; text-indent:5px; color:#000; text-decoration:none;}
.menu :hover ul.sub li a.fly {background:#C6F7FF url(../images/arrow.gif) 80px 7px no-repeat;}
.menu :hover ul.sub li a:hover {background:#4ab; color:#fff;}
.menu :hover ul.sub li a.fly:hover {background:#4ab url(../images/arrow_over.gif) 100px 7px no-repeat; color:#fff;}
.menu :hover ul li:hover > a.fly {background:#4ab url(../images/arrow_over.gif) 103px 7px no-repeat; color:#fff;} 

.menu :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul :hover ul :hover ul
{left:90px; top:-4px; background: #C6F7FF; padding:3px 0; white-space:nowrap; width:103px; z-index:200; height:auto;}

#footer{
	height:120px;
	clear:both;
	background-position: center;
	border-top:groove;
	border-bottom-color:#000066;
	border-bottom-style:inset;
} 
 
#footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.breadcrumb{
	font-size: 80%;
	padding: 2px 0px 0 10px;
}

 /* *** Float containers fix:
 http://www.csscreator.com/attributes/containedfloat.php *** */ 
.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  

 
 /*printer styles*/ 
 @media print{ 
}


.header {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	background-color: #006699;
	color: #FFFFFF;
}
.header2{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	background-color: #006699;
	color: #FFFFFF;
}
.feature{
	padding: 0px 0px 10px 10px;
	font-size: 80%;
}

.feature h3{
	padding: 30px 0px 5px 0px;
	text-align: center;
}

.feature img{
	float: left;
	padding: 10px 10px 0px 0px;
}
.story{
	clear: both;
	padding: 10px 0px 0px 10px;
	font-size: 80%;
}

.story p{
	padding: 0px 0px 10px 0px;
}
.morph a{
	color:#FF6600;
}
.legal { font-size: x-small;color:#000066;
}

.statement{ font-size:115%
}
.smoke{color:#990000; font-weight:500;
}
.smoke a{
	color: #ff0000;
}
.boxgr {
	margin: 5px;
	padding: 5px;
	clear: both;
	float: none;
	height: auto;
	width: auto;
	border: thin double #009966;
}
.morph {
	color: #ff6600;
	font-weight:600;
	text-decoration: none;
}
.business li {
	list-style:url(none) none outside;
}
.business ul {
	list-style:url(none) none outside;
}