/*
Reset
*/
HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME, H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, PRE, A, ABBR, ACRONYM, ADDRESS, BIG, CITE, CODE, DEL, DFN, EM, FONT, IMG, INS, KBD, Q, S, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, DL, DT, DD, OL, UL, LI, FIELDSET, FORM, LABEL, LEGEND, TABLE, CAPTION, TBODY, TFOOT, THEAD, TR, TH, TD
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/*
Elements
*/
HTML
{
	overflow-y: scroll;
}
BODY
{
	background: #242424 url(/images/bg.png) repeat 0px 0px;
	/*[empty]color:;*/
	font-family: Arial, Verdana, sans-serif;
	font-size: 62.5%;
	line-height: 1;
}
HR
{
	display: none;
}
H1
{
	color: #FFF;
	font-size: 20px;
	font-weight: normal;
	margin-bottom: 15px;
	margin-left: 0px;
}
H2
{
	color: #FFF;
	font-size: 18px;
	/*[empty]font-weight:;*/
	margin-bottom: 15px;
}
P
{
	margin-bottom: 15px;
	font-size: 12px;
	color: #FFF;
	line-height: 1.2;
	-webkit-text-size-adjust: none;
}
A
{
	color: #F39A00;
	font-weight: bold;
}
A:hover
{
	color: #FFF;
}
:focus
{
	/*[disabled]outline:0;*/
}
UL
{
	list-style-position: inside;
	list-style-type: square;
	margin-bottom: 15px;
}
LI
{
}
A IMG
{
	border: none;
}
/*
classes
*/
DIV.clear
{
	clear: both;
}
.hide
{
	display: none;
}
A.app-store SPAN
{
	display: none;
}
A.watch-demo-video
{
	display: block;
	width: 162px;
	height: 53px;
	background: url(/images/watch-demo-video.png) no-repeat 0px 0px;
	text-indent: -9999px;
	overflow: hidden;
}
/*header*/
DIV#header-container
{
	height: 90px;
	background: #000 url(/images/header-bg.png) repeat-x left bottom;
	border-bottom: 5px solid #333;
	margin-bottom: 18px;
}
DIV#header
{
	width: 960px;
	height: 90px;
	margin: 0 auto;
	position: relative;
}
DIV#header H1
{
	width: 283px;
	height: 48px;
	position: absolute;
	left: 3px;
	top: 23px;
}
DIV#header H1 A
{
	width: 283px;
	height: 48px;
	display: block;
	background: url(/images/logo-speed-distance-time.png) no-repeat 0px 0px;
	text-indent: -9999px;
	overflow: hidden;
}
DIV#header H2
{
	display: none;
}
DIV#header A.button-large
{
	display: block;
	width: 72px;
	height: 27px;
	background: url(/images/button-large.png) no-repeat 0px 0px;
	color: #FFF;
	text-decoration: none;
	font-size: 13px;
	font-weight: normal;
	text-align: center;
	line-height: 24px;
	position: absolute;
	right: 0px;
	top: 42px;
}
DIV#header A.button-large:hover
{
	background-position: 0px -30px;
}
/*main*/
DIV#main-container
{
	background: url(/images/glow.png) no-repeat 50% -40px;
}
DIV#main
{
	width: 960px;
	margin: 0 auto;
	height: auto !important;
	min-height: 770px;
	height: 770px;
}
/*intro*/
DIV#intro
{
	height: 103px;
	position: relative;
	overflow: hidden;
}
DIV#intro-text
{
	width: 610px;
	height: 84px;
	background: #311E0A url(/images/intro.png) no-repeat 0px 0px;
	float: left;
}
DIV#intro-text P
{
	font-size: 13px;
	line-height: 1.5;
	padding: 10px 9px 15px 14px;
}
DIV#intro-text P STRONG
{
	color: #F39A00;
	font-weight: bold;
}
DIV#intro IMG#runners
{
	position: absolute;
	left: 665px;
	top: 13px;
}
DIV#intro A.watch-demo-video
{
	position: absolute;
	top: 15px;
	right: 172px;
}
DIV#intro A.app-store
{
	position: absolute;
	right: 0;
	top: 15px;
}
/*calculators*/
DIV#calculators
{
	width: 969px;
	height: 304px;
}
DIV.calculator
{
	width: 311px;
	height: 283px;
	float: left;
	background: url(/images/calculator.png) no-repeat 0px 0px;
	margin-right: 18px;
}
DIV#time
{
	margin-right: 0px;
}
DIV.toolbar
{
	height: 43px;
	border-bottom: 1px solid #5E4D2E;
	width: 299px;
	margin-left: 2px;
	position: relative;
	background: no-repeat 10px 8px;
}
#speed DIV.toolbar
{
	background-image: url(/images/icon-speed.png);
}
#distance DIV.toolbar
{
	background-image: url(/images/icon-distance.png);
}
#time DIV.toolbar
{
	background-image: url(/images/icon-time.png);
}
DIV.toolbar H1
{
	position: absolute;
	left: 47px;
	top: 11px;
	font-size: 18px;
	letter-spacing: -0.05em;
	line-height: 23px;
}
DIV.toolbar A.clear
{
	width: 52px;
	height: 24px;
	display: block;
	background: url(/images/button-small.png) no-repeat 0px 0px;
	color: #FFF;
	text-decoration: none;
	font-size: 11px;
	text-align: center;
	line-height: 22px;
	position: absolute;
	right: 11px;
	top: 10px;
}
DIV.toolbar A.clear:hover
{
	background-position: 0px -26px;
}
DIV.calculator FORM
{
	width: 278px;
	margin-left: 13px;
	margin-top: 11px;
}
DIV.calculator FORM UL
{
	list-style-type: none;
	width: 278px;
}
DIV.calculator FORM UL LI
{
	clear: both;
	margin-bottom: 18px;
	float: left;
	width: 278px;
	height: 53px;
	position: relative;
}
DIV.calculator FORM UL LI LABEL
{
	font-size: 13px;
	font-weight: bold;
	display: block;
	color: #CCC;
	margin-bottom: 6px;
}
DIV.calculator FORM UL LI INPUT
{
	width: 188px;
	height: 20px;
	padding: 7px 0 7px 20px;
	border: none;
	margin-right: 5px;
	color: #333;
	font-size: 15px;
	font-weight: bold;
	font-family: Arial, Helvetica, Verdana, sans-serif;
	float: left;
	/*+border-radius:5px;*/
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px 5px 5px 5px;
}
DIV.calculator FORM UL LI INPUT.small
{
	width: 44px;
	background: #FFF;
	float: left;
	margin-right: 2px;
}
DIV.calculator FORM UL LI INPUT.active
{
	background: #FFBA46;
}
DIV.calculator FORM UL LI EM
{
	font-size: 15px;
	font-weight: bold;
	color: #999;
	position: relative;
	bottom: -7px;
	width: 2px;
	height: 9px;
	display: block;
	float: left;
	margin-right: 4px;
	font-style: normal;
}
UL.result
{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
UL.result LI
{
	width: 278px;
	/*[disabled]margin-left:13px;*/
	/*[disabled]padding-left:13px;*/
	margin-top: 0px;
	position: relative;
}
UL.result LI P.label
{
	font-size: 13px;
	font-weight: bold;
	display: block;
	color: #CCC;
	margin-bottom: 6px;
}
UL.result LI P.result
{
	width: 188px;
	height: 32px;
	background: #202020;
	float: left;
	margin-right: 6px;
	padding-left: 21px;
	padding-top: 8px;
	font-size: 20px;
	font-weight: bold;
	/*+border-radius:7px;*/
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	-khtml-border-radius: 7px;
	border-radius: 7px 7px 7px 7px;
}
UL.result LI P.result>SPAN
{
	overflow-x: auto;
	width: 176px;
	display: block;
	float: left;
}
SPAN#time-time
{
	display: block;
}
SPAN#time-time SPAN
{
	float: left;
}
SPAN#time-time EM
{
	float: left;
	font-size: 14px;
	font-weight: bold;
	margin-right: 16px;
}
UL LI SELECT
{
	width: 61px;
	height: 34px !important;
	line-height: 34px !important;
	float: right;
	cursor: pointer;
	right: 0px;
}
UL LI SELECT OPTION
{
	background: #000;
	color: #FFF;
	border: 0;
	font-weight: bold;
	font-family: Arial, Verdana, sans-serif;
}
UL LI SELECT OPTION:active
{
	background: #FFA500;
}
/*custom select boxes*/
.customStyleSelectBox
{
	width: 59px;
	height: 34px;
	background: url(/images/select.png) no-repeat 0px 0px;
	color: #FFF;
	padding-top: 10px;
	font-size: 12px;
	font-weight: bold;
	padding-left: 4px;
	cursor: pointer;
	float: right;
}
UL.result .customStyleSelectBox
{
	margin-top: 2px;
}
.customStyleSelectBox.changed
{
/*You can use this if you want a different style after user has made a selection*/
}
.customStyleSelectBoxInner
{
}
/*placeholders*/
LABEL.placeholder
{
	cursor: text;
	width: 59px;
	height: 26px;
	float: right;
	padding: 7px 0 7px 20px;
	font-size: 15px !important;
	font-weight: bold !important;
	font-family: Arial, Helvetica, Verdana, sans-serif !important;
	color: #999999;
}
INPUT:placeholder, TEXTAREA:placeholder
{
	color: #999999 !important;
}
INPUT::-webkit-input-placeholder, TEXTAREA::-webkit-input-placeholder
{
	color: #999999 !important;
}
INPUT:-moz-placeholder
{
	color: #999 !important;
}
/*
iphone-promo
*/
DIV#iphone-promo
{
	width: 970px;
	height: 618px;
	background: url(/images/iphone-promo.png) no-repeat 0px 0px;
	position: relative;
}
DIV#iphone
{
	width: 302px;
	height: 590px;
	background: url(/images/iphone.png) no-repeat 0px 0px;
	position: absolute;
	left: 16px;
	top: -4px;
}
/*slideshow*/
DIV#slideshow
{
	width: 249px;
	height: 373px;
	position: absolute;
	left: 28px;
	top: 111px;
}
DIV#slideshow IMG
{
	position: absolute;
	display: none;
}
DIV#glare
{
	width: 105px;
	height: 216px;
	background: url(/images/glare.png) no-repeat 0px 0px;
	position: absolute;
	left: 175px;
	top: 106px;
}
A#watch-demo-video-big
{
	display: block;
	width: 249px;
	height: 373px;
	/*[disabled]background:#008000;*/
	position: absolute;
	left: 28px;
	top: 111px;
	text-indent: -9999px;
	background: url(/images/watch-demo-video-big.png) no-repeat -265px 0px;
}
A#watch-demo-video-big:hover
{
	background-position: 0px 0px;
}
/*iphone-copy*/
DIV#iphone-copy
{
	width: 579px;
	position: absolute;
	left: 359px;
	top: 36px;
}
DIV#iphone-copy H1
{
	font-size: 37px;
	letter-spacing: -0.05em;
}
DIV#iphone-copy P
{
	font-size: 13px;
	margin-bottom: 24px;
}
DIV#iphone-copy UL
{
	list-style-type: none;
	list-style-position: outside;
}
DIV#iphone-copy LI
{
	margin-bottom: 18px;
	line-height: 1.2;
	background: url(../images/bullet.png) no-repeat 0px 0px;
	padding-left: 22px;
	color: #CCC;
	font-size: 13px;
}
DIV#iphone-copy LI STRONG
{
	font-weight: bold;
	color: #FFF;
}
DIV#iphone-promo A.watch-demo-video
{
	position: absolute;
	right: 207px;
	bottom: 59px;
}
DIV#iphone-promo A.app-store
{
	position: absolute;
	right: 35px;
	bottom: 58px;
}
/*footer*/
DIV#footer-container
{
	height: 90px;
	background: #000 url(/images/footer-bg.png) repeat-x left top;
	border-top: 5px solid #333;
}
DIV#footer
{
	width: 960px;
	height: 90px;
	margin: 0 auto;
	position: relative;
}
DIV#copyright
{
	float: left;
	padding-top: 13px;
}
DIV#copyright H2
{
	width: 205px;
	height: 26px;
	float: left;
}
DIV#copyright H2 A
{
	width: 205px;
	height: 26px;
	display: block;
	background: url(/images/logo-footer.png) no-repeat 0px 0px;
	text-indent: -9999px;
	overflow: hidden;
}
DIV#copyright P
{
	float: left;
	font-weight: bold;
	padding-left: 14px;
	padding-top: 7px;
}
UL#links
{
	float: right;
	list-style-type: none;
	padding-top: 21px;
}
UL#links LI
{
	float: left;
	display: block;
	border-right: 1px solid #333;
	padding-right: 7px;
	padding-left: 7px;
}
UL#links LI.last
{
	padding-right: 0;
	border: none;
}
UL#links LI A
{
	float: left;
	display: block;
	color: #FFF;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}
UL#links LI A:hover
{
	text-decoration: underline;
}