@-webkit-keyframes icon {
	1%   { margin-left: 550px; opacity: 0; }
	100% { margin-left: 500px; opacity: 1; }
}

@-moz-keyframes icon {
	1%   { margin-left: 550px; opacity: 0; }
	100% { margin-left: 500px; opacity: 1; }
}

@-webkit-keyframes screen {
	1%   { -webkit-transform: scale(0.0); opacity: 0; }
	100% { -webkit-transform: scale(1.0); opacity: 1; }
}

@-moz-keyframes screen {
	1%   { -webkit-transform: scale(0.0); opacity: 0; }
	100% { -webkit-transform: scale(1.0); opacity: 1; }
}

body {
	font-family: "Helvetica Neue", "Helvetica", "Arial", "Verdana", sans-serif;
	font-size: 14pt;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	background-color: #ffffff;
}

::selection 	 	{background: #00c4ee; color: #ffffff;}
::-moz-selection 	{background: #00c4ee;}

#page {
	height: 660px; width: 860px;
	padding: 0px 14px 15px;
    margin: 0 auto;
}

#header-bg {
	background-image: url('images/head-bg.png');
	min-width: 980px; height: 636px;
	background-repeat: repeat-x;
	background-position: 0 0;
	position: absolute;
	top: -1px;
    right: 0;
    left: 0;
}


#stream-head {
	background-image: url('images/stream-logo.png');
	width: 267px; height: 57px;
	position: absolute;
	margin-top: 260px;
	margin-left: -20px;
}

#app-store {
	margin-top: 235px;
	margin-left: 600px;
	position: absolute;
	z-index: 4;
}

#app-store a {
	background-image: url('images/app-store-btn-sprite.png');
	width: 262px; height: 84px;
	display: block;
	text-indent: -9999px;
	position: absolute;
	background-position: top;
}

#app-store a:hover {
	background-position: center;
}

#app-store a:active {
	background-position: bottom;
}

#specs {
	background-image: url('images/specs.png');
	text-indent: -9999px;
	display: block;
	width: 260px; height: 14px;
	margin-top: 335px;
	margin-left: 602px;
	position: absolute;
	opacity: 0.7;
	
}

/* On Left
#app-store {
	margin-top: 350px;
	margin-left: -20px;
	position: absolute;
}

#app-store a {
	background-image: url('images/app-store-btn-sprite.png');
	width: 262px; height: 84px;
	display: block;
	text-indent: -9999px;
	position: absolute;
	background-position: top;
}

#app-store a:hover {
	background-position: center;
}

#app-store a:active {
	background-position: bottom;
	top: 1px;
}


#specs {
	background-image: url('images/specs.png');
	text-indent: -9999px;
	display: block;
	width: 260px; height: 14px;
	margin-top: 444px;
	margin-left: -17px;
	position: absolute;
	opacity: 0.7;
	
}

*/

/*
#quote-1 {
	background-image: url('images/quote-1.png');
	width: 332px; height: 114px;
	position: absolute;
	margin-top: 230px;
	margin-left: 575px;
}
*/

#footer-logo {
	position: absolute;
	margin-top: 637px;
	margin-left: -20px;
}

#footer-logo a {
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	background-image: url('images/hc-logo-footer.png');
	width: 36px;
	height: 36px;
	display: block;
	text-indent: -9999px;
}

#footer-logo a:hover {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
}

#footer-logo a:active {
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
}

#footer-text-left {
	color: #bababa;
	font-size: 14px;
	font-family: 'Helvetica Neue';
	font-weight: bold;
	margin-top: 647px;
	margin-left: 26px;
	position: absolute;
}

#footer-text-right {
	color: #bababa;
	font-size: 14px;
	font-family: 'Helvetica Neue';
	font-weight: bold;
	margin-top: 647px;
	margin-left: 600px;
	width: 400px;
	position: absolute;
	word-spacing: 40px;
	
}

#footer-text-right a {
	text-decoration: none;
	color: #bababa;
	
}

#footer-text-right a:hover {
	text-decoration: none;
	color: #4c4c4c;
}



#screen {
	-webkit-animation-name: screen;
	-webkit-animation-timing-function: ease-in;
	-webkit-animation: screen 0.5s 0.7s 1 alternate ease-in-out forwards;
	-moz-animation-name: screen;
	-moz-animation-timing-function: ease-in;
	-moz-animation: screen 0.5s 0.7s 1 alternate ease-in-out forwards;
	background-image: url('images/screen1.png');
	width: 228px; height: 404px;
	position: absolute;
	margin-left: 308px;
	margin-top: 105px;
	z-index: 2;
	opacity: 0;
	
}

#stream-icon a {
	-webkit-animation: icon 0.5s ease-in, ease-out;
	-moz-animation: icon 0.5s ease-in, ease-out;
	background-image: url('images/stream-icon.png');
	width: 116px; height: 119px;
	position: absolute;
	margin-top: 470px;
	margin-left: 500px;
	z-index: 3;
	-webkit-transition: all .1s;
	-moz-transition: all .1s;
}

#stream-icon a:hover {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
}

#stream-icon a:active {
	-webkit-transform: scale(1.0);
	-moz-transform: scale(1.0);
}


#iphone {
	background-image: url('images/iphone.png');
	width: 282px; height: 561px;
	position: absolute;
	margin-left: 280px;
	margin-top: 30px;
	
}