/* Sam Samaroo */

body {
	font: 16px/26px Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif;
	color: #000000;
	font-size: 1em; 
	line-height: 1.4; 
}

.wrapper { 
	width: 1026px;
	margin: 0 auto;  
}

/* header */

#masthead {
	height: 550px;
	background: url("../img/wave.jpg") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}

.header_container {
    color: #999999;  
    font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
}

.header_container h1 {
	color: #FFFFFF;
	font-size: 3em;
	font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
}


.header_container .logo img {
	width: 100%;
}

.header_container .wrapper {
	text-align: center;
	padding-top: 20px;
}

.header_container p {
	margin-top: .7em;
	font-size: 18px;
}

h1, h2, h3 { 
	font-style: normal;
	font-weight: normal;
	line-height: 115%;
}  

h2 {
	font-weight: normal;
	font-size: 20px;
}

img { 
	vertical-align: middle; 
}

/*product*/

.main article {
	margin-bottom: 3em;
}

.main {
	background: #fff;
	padding: 20px 0 20px 0;
}

.main h2 {
	color: #24364E;
	font-size: 2em;
	letter-spacing: 1px;
	font-family: Arial, sans-serif;
 }

.product_feature {
	width: 24%;
	margin-right: 1%;
	float: left;
}

.right {
	float: right;
}
   
.android {
	position: absolute;
	height: 724px;
	width: 364px;
	background: url(../img/android_phone.png) no-repeat center 0; /*Image of iphone 5 */
	background-size: 365px 700px;
	margin: -360px auto 0 -180px;
	left: 50%;
}

/*footer*/

.footer_container {
    padding-bottom: 20px;
    padding-top: 20px;
    text-align: center;
    position: relative;
    background: none repeat scroll 0 0 #FFFFFF;
	color: #24364E;
	font-size: .8em;
	text-align: center;
}

.footer_container footer h1{
	font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
	font-weight: normal;
	margin-bottom: 1em;
	color: #24364E;
}

.footer_container footer { 
	padding: 20px 0; 
	border-top: 1px dotted #24364E;
}

/*download button*/

.android_btn {
	box-shadow:inset 0px 1px 0px 0px #c1ed9c;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #99cc00) );
	background:-moz-linear-gradient( center top, #9dce2c 5%, #99cc00 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#99cc00');
	background-color:#9dce2c;
	border-radius: 5px;
	border: 1px solid #999999;
	display:inline-block;
	color:#ffffff;
	font-size: 1.2em;
	font-weight:bold;
	height:50px;
	line-height:50px;
	width:300px;
	text-decoration:none;
	text-align:center;
	text-shadow:2px 2px 2px #333;
}

.amazon_btn {
	box-shadow:inset 0px 1px 0px 0px #e39612;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f0a50e), color-stop(1, #e39612) );
	background:-moz-linear-gradient( center top, #f0a50e 5%, #e39612 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0a50e', endColorstr='#e39612');
	background-color:#f0a50e;
	border-radius: 5px;
	border: 1px solid #e39612;
	display:inline-block;
	color:#ffffff;
	font-size: 1.2em;
	font-weight:bold;
	height:50px;
	line-height:50px;
	width:300px;
	text-decoration:none;
	text-align:center;
	text-shadow:2px 2px 2px #333;
}

.android_btn:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #99cc00), color-stop(1, #9dce2c) );
	background:-moz-linear-gradient( center top, #99cc00 5%, #9dce2c 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#99cc00', endColorstr='#9dce2c');
	background-color:#99cc00;
}

.android_btn:active {
	position:relative;
	top:1px;
}

/*media queries*/

@media only screen and (max-width: 1140px) {
	.wrapper { 
		width: 768px; /* 1140px - 10% for margins */ 
		margin: 0 auto;  
	}
}
   
@media only screen and (max-width: 768px) { 
	.wrapper {
		width: 480px;
		margin: 0 auto; 
	}

	.header_container .wrapper {
		padding-top: 50px;
	}

	.android {
		position: relative;
	}

	.product_feature, .right {
		float: none;
		margin: 0;
		width: 100%;
	}

	.product_feature {
		width: 100%;
		text-align: center;
	}

	.main article {
		padding-top: 1.3em;
		padding-bottom: 1.3em;
		margin: 0;
		border-bottom: 1px solid #ebebeb;
	}

}

@media only screen and (max-width: 480px) {
	.wrapper {
		max-width: 320px;
		width: 100%;
		margin: 0 auto; 
	} 

	.product_feature {
		width: 100%;
		text-align: center;
	}

	.main article {
		padding-top: 1.3em;
		padding-bottom: 1.3em;
		margin: 0;
		border-bottom: 1px solid #ebebeb;
	}

	.header_container h1 {
		font-size: 1.8em;
	}

	.android {
		background-size: 300px 597px;
		margin: -360px auto 0 -150px;
		height: 597px;
		width: 300px;
		padding-bottom: 1em;
	}

}

@media only screen and (max-width: 320px) {
	.wrapper {
		width: 94%;
		margin: 0 auto; 
		max-width: none;
	} 

	.product_feature {
		width: 100%;
		text-align: center;
	}

	.main article {
		padding-top: 1.3em;
		padding-bottom: 1.3em;
		margin: 0;
		border-bottom: 1px solid #ebebeb;
	}
	
}

/*clearfix*/

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }