* { margin:0;padding:0;border: 0px none;}
ul, ol, li { list-style-type:none; }


a { text-decoration: underline; color: #2484db; }
a:hover {color: #f59f00}


body {
	font: 62.5% "Arial", Helvetica, sans-serif;  
	background: #518ec4 url(../img/bg.gif) 0 0 repeat-x;
	color: #666;
	}
#wrapper {
	width: 800px;
	margin: 0 auto 50px;
	}



/* common font styles  --------------------------------*/
p {font: normal 1.2em/1.4em "Arial", Helvetica, sans-serif;}
.list li {
	font: normal 1.2em/1.4em "Arial", Helvetica, sans-serif;
	list-style-type: square;

	}

/*  SLIDE OUT FEEDBACK CONTACT --------------------------------*/
    .slide-out-div {
       padding: 20px;
        width: 250px;
        background: white;
        border: #29216d 2px solid;
    }
    

/* logo  --------------------------------*/
#header {
	width: 800px;
	height: 318px;
	background: transparent url(../img/bg-header.gif) 0 0 no-repeat;
	}
	h1 { 
		text-align: center;
		height: 75px;
		padding: 30px 0;
		font: bold 3em/1.1em "Arial", Helvetica, sans-serif;
		}
	#steps {
		height: 153px;
		padding: 15px 0 0;
		float: left;
		}
	#steps div {
		width: 226px;
		padding: 10px 20px ;
		float: left;
		/*border-right: 1px dotted #9cb2d0;*/
		}
		#steps div.noborder {border-right: 0;}
		#steps h2 { 
			color: #fff;
			margin: 0 0 5px;
			font: bold 3.1em/1.1em "Arial", Helvetica, sans-serif;
			}
		#steps h3 { 
			color: #ffcb30;
			font: bold 2em/1.1em "Arial", Helvetica, sans-serif;
			margin: 0 0 5px;
			}
			#steps p { color: #cce3ff; padding-right: 35px;}
			#steps p.arrow { background: url(../img/yellow-arrow.gif) right bottom no-repeat;}
			#steps p.tick { background: url(../img/yellow-tick.gif) right center no-repeat;}



.content {
	width: 800px;
	clear: both;
	margin: 0 0 12px;
	}
	.content .btm {
		width: 780px;
		background: transparent url(../img/content-bg.png) 0 bottom no-repeat;
		padding: 10px;
		}
	.content .nopad {padding-top:0;}
	.content-top {
		width: 800px;
		background: url(../img/content-top.png) 0 0 no-repeat;
		height: 10px;
		font-size: 1px;
		line-height: 1px;
		}
		.bluebar {
			width: auto;
			height: 40px;
			margin: 0 0 15px;
			background: #deedff url(../img/bluebar-left.gif) 0 0 no-repeat;
			}
			.bluebar div {
				width:  auto;
				height: 40px;
				background: transparent url(../img/bluebar-right.gif) right 0 no-repeat;
				}
			.bluebar h4 { 
				color: #234a7e;
				font: normal 1.8em/1.1em "Arial", Helvetica, sans-serif;
				padding: 11px 0 0;
				text-align: center;
				}
		.leftcol {
			float: left;
			width: 515px;
			}
		.rightcol {
			float: right;
			width: 250px;
			}
			.leftcol h4, .rightcol h4 {
				text-align: left;
				padding-left: 15px;
				}
			.leftcol p, .rightcol p { margin: 0 15px 12px;}
			.leftcol p strong, .rightcol p strong { color: #234a7e;}
			p img.right { float: right;margin: 0 0 12px 12px;}


#browsers div {
	width: 108px;
	float: left;
	padding: 5px 0;
	text-align: left;
	/*border-right: 1px dotted #b8b8b8;*/
	}
	#browsers div.last {
		width: 130px;
		border-right: 0;
		}
	#browsers div img { margin: 0 0 5px;}
	#browsers div p { color: #333; margin: 0 10px 15px; padding: 0 0 10px; /*border-bottom: 1px dotted #b8b8b8*/;text-align: center;}
	#browsers div.screen {
		width: auto;
		float: none;
		padding: 0;
		margin: 0 0 10px;
		text-align: center;
		border-right: 0;
		font: normal 1.1em/1.25em "Arial", Helvetica, sans-serif;
		}
		#browsers div.small {
			background: #deedff url(../img/browsers/screen60.gif) 0 0 no-repeat;
			width: 60px;
			height: 30px;			
			margin-left: 28px;
			padding-top: 19px;
			}
		#browsers div.medium {
			background: #deedff url(../img/browsers/screen74.gif) 0 0 no-repeat;
			width: 74px;
			height: 35px;			
			margin-left: 22px;
			padding-top: 26px;
			}
		#browsers div.large {
			background: url(../img/browsers/screen89.gif) 0 0 no-repeat;
			width: 89px;
			height: 48px;			
			margin-left: 16px;
			padding-top: 30px;
			}
		#browsers div a { color: #666;text-decoration: none;}
		#browsers div a:hover { text-decoration: underline; color: #295289;}


/* clear everything (sometimes needed for IE 6) */
.clearall { 
	width: 100%;
	clear: both;
	font-size: 1px;
	line-height: 1px;
	}



/* footer styles */
#footer {
	clear: both;
	margin: 25px 0 0;
	border-top: 1px dotted #b8b8b8;
	}
	#footer p {
		text-align: center;
		margin: 15px 0 8px;
		font-size: 1.1em;
		float: left;
		}
		#footer p.links {
			float: right;
			}
		#footer a { padding: 0 5px;}