body {
	background: #fff;
	font-family: 'Oxygen', sans-serif;
	font-weight: 400;
	color: #353b42;
}

.wrapper {
	width: 80%;
	max-width: 960px;
	margin: 0 auto;
}

.clear {
	clear: all;
}

	
.button {
	padding: 10px 15px 10px 15px;
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	display: inline-block;
	width: 160px;
	text-align: left;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.85);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-bottom: 5px;
	margin-right: 2px;
}
.button a:hover, a:visited, a:link, a:active {
	text-decoration:none;
}
.button span.icon {
	width: 30px;
	height: 35px;
	display: block;
	background: url('../images/button_icons.png') no-repeat top left;
	float: left;
	margin-right: 12px;
}
.button em {
	font-size: 10px;
	font-weight: bold;
	display: block;
	color: #fff;
	text-shadow: 0px 1px rgba(255, 255, 255, 0.65);
	font-style: normal;
}
.button:active {
	-webkit-box-shadow: inset 0px 0px 7px #333;
	-moz-box-shadow: inset 0px 0px 7px #333;
	box-shadow: inset 0px 0px 7px #333;
}
.button#apple {
	background: #2cbbfd; /* Old browsers */
	background: -moz-linear-gradient(top, #2cbbfd 0%, #006b9d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2cbbfd), color-stop(100%, #006b9d)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #2cbbfd 0%, #006b9d 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #2cbbfd 0%, #006b9d 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #2cbbfd 0%, #006b9d 100%); /* IE10+ */
	background: linear-gradient(top, #2cbbfd 0%, #006b9d 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2cbbfd', endColorstr='#006b9d', GradientType=0 ); /* IE6-9 */
}
.button#apple em {
	color: #065478;
}
.button#apple:hover {
	background: #4cc6ff; /* Old browsers */
	background: -moz-linear-gradient(top, #4cc6ff 0%, #0078b0 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4cc6ff), color-stop(100%, #0078b0)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #4cc6ff 0%, #0078b0 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #4cc6ff 0%, #0078b0 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #4cc6ff 0%, #0078b0 100%); /* IE10+ */
	background: linear-gradient(top, #4cc6ff 0%, #0078b0 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4cc6ff', endColorstr='#0078b0', GradientType=0 ); /* IE6-9 */
}
.button#android {
	background: #98d463; /* Old browsers */
	background: -moz-linear-gradient(top, #98d463 0%, #66891d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #98d463), color-stop(100%, #66891d)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #98d463 0%, #66891d 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #98d463 0%, #66891d 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #98d463 0%, #66891d 100%); /* IE10+ */
	background: linear-gradient(top, #98d463 0%, #66891d 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#98d463', endColorstr='#66891d', GradientType=0 ); /* IE6-9 */
}
.button#android em {
	color: #436c01;
}
.button#android span.icon {
	background-position: 0px -35px;
}
.button#android:hover {
	background: #9dda67; /* Old browsers */
	background: -moz-linear-gradient(top, #9dda67 0%, #70971f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9dda67), color-stop(100%, #70971f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #9dda67 0%, #70971f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #9dda67 0%, #70971f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #9dda67 0%, #70971f 100%); /* IE10+ */
	background: linear-gradient(top, #9dda67 0%, #70971f 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dda67', endColorstr='#70971f', GradientType=0 ); /* IE6-9 */
}
.button#windows {
	background: #f7a553; /* Old browsers */
	background: -moz-linear-gradient(top, #f7a553 0%, #c67524 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7a553), color-stop(100%, #c67524)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f7a553 0%, #c67524 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f7a553 0%, #c67524 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #f7a553 0%, #c67524 100%); /* IE10+ */
	background: linear-gradient(top, #f7a553 0%, #c67524 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7a553', endColorstr='#c67524', GradientType=0 ); /* IE6-9 */
}
.button#windows em {
	color: #9c5918;
}
.button#windows span.icon {
	background-position: 0px -70px;
}
.button#windows:hover {
	background: #fca14b; /* Old browsers */
	background: -moz-linear-gradient(top, #fca14b 0%, #c5650b 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fca14b), color-stop(100%, #c5650b)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #fca14b 0%, #c5650b 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #fca14b 0%, #c5650b 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #fca14b 0%, #c5650b 100%); /* IE10+ */
	background: linear-gradient(top, #fca14b 0%, #c5650b 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fca14b', endColorstr='#c5650b', GradientType=0 ); /* IE6-9 */
}
.button#amazon {
	background: #525252; /* Old browsers */
	background: -moz-linear-gradient(top, #525252 0%, #18171e 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #525252), color-stop(100%, #18171e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #525252 0%, #18171e 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #525252 0%, #18171e 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #525252 0%, #18171e 100%); /* IE10+ */
	background: linear-gradient(top, #525252 0%, #18171e 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#525252', endColorstr='#18171e', GradientType=0 ); /* IE6-9 */
}
.button#amazon em {
	color: #9a9a9a;
	text-shadow: 0px 1px #000;
}
.button#amazon span.icon {
	background-position: 0px -105px;
}
.button#amazon:hover {
	background: #616161; /* Old browsers */
	background: -moz-linear-gradient(top, #616161 0%, #222222 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #616161), color-stop(100%, #222222)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #616161 0%, #222222 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #616161 0%, #222222 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #616161 0%, #222222 100%); /* IE10+ */
	background: linear-gradient(top, #616161 0%, #222222 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#616161', endColorstr='#222222', GradientType=0 ); /* IE6-9 */
}
.button:hover {
	color: #fff;
}	



header {
	background: #86c3e3;
	color: #fff;
	height: 100px;
}

header h1 {
	font-weight: 700;
	font-size: 1.8em;
	float: left;
	display: inline-block;
	margin: 28px 0 0 0;
}

#product {
	display:block;
	text-align:center;
}
#buttons{
	display:inline-block;
	background: #fff;
	width:100%;
	margin-top:5px;
	text-align:center;
}


#banner {
	background: #f4f7f9;
	height: 360px;
}

#banner .introduction {
	float: left;
	width:50%;
}

#banner h2 {
	font-size: 3.6em;
	font-weight: 300;
	color: #262626;
	padding-top: 60px;
}

#banner p {
	font-size: 1.2em;
	font-weight: 300;
}


#banner .video {
	float: right;
	margin: 50px 0;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	background-color: #353b42;
	-webkit-box-shadow: 0 1px 7px rgba(0,0,0,.4);
	-moz-box-shadow: 0 1px 7px rgba(0,0,0,.4);
	box-shadow: 0 1px 7px rgba(0,0,0,.4);
	border: solid 3px #fff;
	padding-bottom: -5px;
}

#banner .video img {
	display: block;
}

footer .copyright {
	display: block;
	text-align: center;
	margin-top: 10px;
}

footer .copyright strong {
	color: #f23f54;
}


@media all and (max-width: 1024px){
	#banner .video {
		width: 300px;
		margin-top: 60px;
	}
}

@media all and (max-width: 768px){

	#banner {
		height: 600px;
	}
	#banner .video {
		width: 380px;
		float: left;
		margin-top: 30px;
	}
	#banner .introduction {
		float: left;
		width:100%;
	}

	header h1 {
		font-size: 1.6em;
	}
	
}

@media all and (max-width: 480px){
	header {
		height: 160px;
	}
	header h1 {
		display: block;
		width: 100%;
	}

	#banner {
		height: 520px;
	}
	#banner h2 {
		font-size: 2.8em;
		width:100%;
	}

	#banner .video {
		width: 300px;
	}
	#banner .introduction {
		float: left;
		width:100%;
	}

	
}

@media all and (max-width: 400px){

	header h1 {
		font-size: 1.6em;
	}
    #banner {
		height: 580px;
	}	
	#banner .video {
		width: 280px;
	}	
}

@media all and (max-width: 360px){

	header h1 {
		font-size: 1.4em;
	}
	#banner .video {
		width: 200px;
	}		
    #banner {
		height: 520px;
	}
}