/* GLOBALS */
* {
	margin:0px;
	padding:0px;
}
a {
	display:inline-block;
	font-weight:bold;
	color:#04355f;
}
a,
a img {
	outline:none;
	border:none;
}
a:hover {
	color:#398c00;
}


/* STRUCTURE */
html {
	background-color:#fff;
}
body {
	position:relative;
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	line-height:1.3;
	width:100%;
	height:100%;
	color:#5f5f5f;
}
h1, h2, h3 {
	color:#464646;
}
#wrapper {
	position:relative;
	float:left; /* need the layout for drop-shadow */
	left:50%;
	margin-left:-450px;
	width:900px;
	height:100%;
	padding:0 20px;
	text-align:left;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .2);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .2); 
}

/* CSS doesn't allow for the following floats to be grouped in one rule */
#header {
	float:left;
	width:100%;
	height:100%;
}
#logo {
	float:left;
	width:600px;
	height:100%;
	font-style:italic;
}
#logo > a {
	float:left;
	height:100%;
	margin-top:30px;
	margin-bottom:30px;
}
#logo > h1 {
	float:left;
	wdth:100%;
	height:100%;
	margin-top:50px;
	margin-left:40px;
	font-size:35px;
}
#logo > h1 span {
	 font-size:21px;
	 font-weight:normal;
 }
#description {
	float:left;
	width:100%;
	height:100%;
	padding-bottom:23px;
}
#description p {
	margin-bottom:12px;
}
#preview {
	float:left;
	width:100%;
	height:100%;
	padding-bottom:30px;
}
#preview .col3 {
	float:left;
	width:256px;
	height:100%;
	margin-right:65px;
	overflow:visible;
}
#preview .col3:last-child {
	margin-right:0px;
}
#preview img {
	position:relative;
	clear:left;
	z-index:5;
	-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, .2);
-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, .2);
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, .2);

}
#preview h3 {
	position:relative;
	z-index:10;
	width:100%;
	text-align:center;
	padding:18px 0px;
	display:inline-block;
	margin-bottom:25px;
	font-size:20px;
	font-weight:normal;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; 
-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, .2);
-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, .2);
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, .2);
}
#preview h3 span.bubble-arrow {
	position:absolute;
	bottom:-29px;
	left:20px;
	width:29px;
	height:30px;
	z-index:20;
	background-image:url(../images/bubble-arrow.png);
	background-repeat:no-repeat;
}
#features {
	float:left;
	width:270px;
	height:100%;
	margin-right:30px;
}
#features ul {
	margin-left:15px;
}
#features li {
	margin-bottom:10px;
}
#testimonials {
	float:left;
	width:595px; /* reduced width for mac */
	height:100%;
}
#testimonials h3 img {
	margin-left:10px;
}
#footer {
	float:left;
	width:100%;
	height:100%;
	padding-top:10px;
}
#footer p {
	display:inline-block;
}
#footer p.support {
	margin-top:30px;
}
#footer #copyright {
	float:right;
	margin-right:180px;
	margin-top:30px;
}
.testimonial {
	border-bottom:1px solid #ddd;
	padding-bottom:20px;
	margin-bottom:25px;
}
.testimonial h3 {
	margin-bottom:15px;
}
#header,
#description,
#preview,
#testimonials .testimonial:last-child {
	border-bottom:1px solid #ccc;
}
*.float-right {
	float:right;
	margin-top:50px;
	margin-right:20px;
}
#footer a.float-right {
	margin-top:0px;
}
h2 {
	margin-top:25px;
	margin-bottom:25px;
	font-size:20px;
}