body{
	background:#00AEE8 url(../../i/bg/sky.png) repeat-x -170px top;
	padding:0;
	margin:0;
	color:#fff;
	letter-spacing:0.75px;
	font-family:Arial, sans-serif;
}
a{
	color:#fff;
}
a img{
	border:none;
}
.clear{
	clear:both;
	float:none !important;
	height:auto;
	margin:0;
	padding:0;
}

header{
	text-align:center;
}
header p{
	color:#02739D;
	text-shadow: 0 1px 0 #5CD1FE;
	text-transform:uppercase;
	font-weight:bold;
	font-size:75%;
}
header p a{
	color:#02739D;
	text-decoration:none;
}
header p a:hover{
	text-decoration:underline;
}
#logo{
	display:block;
	width:285px;
	margin:24px auto 0;
	text-align:center;
}
.partner #logo{
	width:403px;
}
#main{
	width:960px;
	display:block;
	margin:6px auto 0;
}
#further_info{
	clear:both;
	display:block;
	background:transparent url(../../i/bg/road_grass.png) repeat-x -170px 152px;
	height:100%;
}
#bikes{
	background:transparent url(../../i/bg/skyline.png) no-repeat center top;
	width:100%;
	height: 167px;
	position: relative;
}
#bikes img{
	display:inline-block;
	margin-right:30px;
}

footer{
	width:960px;
	display:block;
	margin:120px auto 0;
	padding-bottom:300px;
	font-size:80%;
	text-align:center;
}
footer nav{
	color:#486002;
	padding:20px 0;
}
footer a{
	text-decoration:none;
	margin-right:12px;
	color:#fff;
	text-shadow: 0 1px 0 #486002;
}
footer a:hover{
	text-decoration:underline;
}

blockquote{
	margin:-12px 0 0 0;
	padding:40px 40px 0 40px;
	height:180px;
	background:transparent url(../../i/cloud_left.png) no-repeat;
}
/* calc */
.int{
	text-align:right;
}

#calc{
	margin:0 auto;
	width:880px
}
#calc fieldset{
	width:420px;
	height:204px;
	float:left;
	margin:0 0 10px 0;
	padding:0;
	border:0;
}
#calc #calc-bike{
	background:transparent url(../../i/cloud_left.png) no-repeat;
	margin-right:20px;
}
#calc #calc-nonbike{
	background:transparent url(../../i/cloud_right.png) no-repeat;
	margin-left:20px;
}

h3{
	clear:both;
	color:#02739D;
	text-shadow: 0 1px 0 #5CD1FE;
	font-weight:bold;
	font-size:100%;
	text-transform:uppercase;
	margin:43px 30px 20px 0px;
	text-align:center;
	/*background-color:#33BEED;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;*/
}
h3 a{
	color:#02739D;
}
h3 a:hover{
	text-decoration:underline;
}
h3 span{
	font-size:160%;
}
h5,
h5 a{
	clear:both;
	font-weight:normal;
	color:#02739D;
}
.post h3{
	margin-top:0;
	background:transparent;
	text-align:left;
}
#calc-nonbike h3{
	margin:43px 0px 20px 10px;
	
}
#calc-bike div{
	padding-left:40px;
}
#calc-nonbike div{
	padding-left:30px;
}
#calc label{
	display:block;
	text-shadow: 0 1px 0 #02739D;
	font-size:90%;
	font-weight:bold;
	margin-bottom:5px;
	text-transform:uppercase;
	text-align:center;
}
#calc p{
	float:left;
	margin:0 15px 0 0;
}
#calc p span{
	display:block;
	padding:1px 5px;
	color:#02739D;
	background-color:#fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-size:100%;
	font-weight:bold;
}
#calc p span:hover,
#calc p span:hover input{
	background-color:#DEF5FC;
}
var{
	font-style:normal;
}
fieldset span var{
	color:#02739D;
	border-bottom:1px dotted #02739D;
	cursor:pointer;
}
fieldset span var:hover{
	border-bottom:1px solid #02739D;
}
#calc p em{
	font-size:70%;
	text-transform:none;
	font-style:normal;
	display:block;
	padding:3px 0 0 4px;
	text-shadow: 0 1px 0 #02739D;
}
#calc input{
	width:40px;
	font-size:100%;
	font-weight:bold;
	background-color:#fff;
	border:none;
	padding:3px;
	color:#02739D;
}
#calc #commute_cost{
	width:45px;
}
#calc input#calc-submit{
	float:none;
	display:block;
	clear:both;
	width:196px;
	height:42px;
	margin:0 auto 60px auto;
	background:transparent url(../../i/button.png) no-repeat;
	font-weight:bold;
	font-size:25px;
	text-transform:uppercase;
	cursor:pointer;
	color:#BAEBFE;
	text-align:center;
	text-shadow: 0 1px 0 #000;
}
#calc input#calc-submit:hover,
#calc input#calc-submit:active{
	color:#fff;
}
#calc-result{
	display:none;
	clear:both;
	margin:-30px 0 30px 0;
}

h1{
	background-color:#028BBD;
	padding:12px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	text-align:center;
	margin:30px 0 20px;
	font-size:175%;
	font-weight:normal;
	text-shadow: 0 1px 0 #000;
	color:#BAEBFE;	
}

#results_holder{
	clear:both;
	margin:30px 0 50px 0;
	padding:0;
	float:left;
	width:100%;
}
#results_holder li{
	display:block;
	float:left;
	list-style:none;
	margin-right:40px;
	width:21.5%;
	min-height:254px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-align:center;
	color:#fff;
	text-shadow:none;
}
#results_savings{
	background:#3BC1ED url(../../i/icons/pig.png) no-repeat center 16px;
}
#results_bicycle{
	background:#3BC1ED url(../../i/icons/cog.png) no-repeat center 16px;
}
#results_calories{
	background:#3BC1ED url(../../i/icons/calories.png) no-repeat center 16px;
}
#results_distance{
	background:#3BC1ED url(../../i/icons/distance.png) no-repeat center 16px;
}
#results_time{
	background:#3BC1ED url(../../i/icons/time.png) no-repeat center 16px;
	margin-right:0 !important;
}
#results_holder h2{
	color:#0E7AA2;
	text-transform:uppercase;
	font-size:100%;
	margin:95px 0 18px 0;
}
#results_holder h2 b{
	display:block;
	color:#fff;
	font-size:270%;
	text-transform:none;
}
#results_holder h3{
	color:#0E7AA2;
	margin:18px 0;
	text-transform:none;
}
#results_holder h3 span{
	font-size:100%;
}
#results_holder h4{
	color:#fff;
	margin:18px 0 24px;
}


#bike_stuff{
	background-color:#3BC1ED;
	clear:both;
	display:block;
	margin:30px 0 60px 0;
	padding:12px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-align:center;
	color:#fff;
	text-shadow:none;
	float:left;
}
#bike_stuff h3{
	margin-top:0;
}
#bike_stuff ul{
	margin:0;
	padding:0;
}
#bike_stuff li{
	float:left;
	width:90px;
	height:120px;
	margin:0 14px 0 0;
	text-align:center;
	list-style:none;
}
#bike_stuff h4{
	text-shadow: 0 1px 0 #02739D;
	padding-top:20px;
	clear:both;
}
#bike_stuff li a{
	display:block;
	width:90px;
	padding:79px 4px 5px 4px;
	text-decoration:none;
	text-shadow: 0 1px 0 #02739D;
	font-size:90%;
	font-weight:bold;
}
#bike_stuff li a:hover{
	margin-top:-4px;
	text-shadow:none;
	background-color:#6FD1F2;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
	
}
#bike_stuff .accessories_bikes{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center top;
}
#bike_stuff .accessories_helmet{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -100px;
}
#bike_stuff .accessories_clothing{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -1000px;
}
#bike_stuff .accessories_gloves{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -400px;
}
#bike_stuff .accessories_tools{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -500px;
}
#bike_stuff .accessories_lights{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -600px;
}
#bike_stuff .accessories_lock{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -700px;
}
#bike_stuff .accessories_computer{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -800px;
}
#bike_stuff .accessories_shoes{
	background:transparent url(../../i/icons/accessories_sprite.png) no-repeat center -900px;
}
.button{
	display:inline-block;
	width:196px;
	height:42px;
	margin:0 30px 20px 0;
	background:transparent url(../../i/button.png) no-repeat;
	font-weight:bold;
	font-size:20px;
	text-transform:uppercase;
	cursor:pointer;
	color:#BAEBFE;
	text-align:left;
	text-shadow: 0 1px 0 #000;
}
.button:hover,
.button:active{
	color:#fff;
}
#social{
	clear:both;
	width:920px;
	margin:0 auto;
}
#social b{
	display:block;
	padding:9px 0 9px 55px;
	font-weight:normal;
}
#social .facebook b{
	background:transparent url(../../i/icons/facebook.png) no-repeat 12px center;
}
#social .twitter b{
	background:transparent url(../../i/icons/twitter.png) no-repeat 12px center;
}
#social .delicious b{
	background:transparent url(../../i/icons/delicious.png) no-repeat 12px center;
}
#social .stumbleupon b{
	background:transparent url(../../i/icons/stumbleupon.png) no-repeat 12px center;
}
/* Smooth Div Scroller */

div.scrollingHotSpotLeft{
	min-width: 75px;
	width: 10%;
	height: 100%;
	position: absolute;
	z-index: 200;
	left: 0;
}

div.scrollingHotSpotLeftVisible{
	adisplay:none;
}


div.scrollingHotSpotRight{
	min-width: 75px;
	width: 10%;
	height: 100%;
	position: absolute;
	z-index: 200;
	right: 0;
}


div.scrollingHotSpotRightVisible{
	adisplay:none;
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper{
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
}

div.scrollableArea{
	position: relative;
	width: auto;
	height: 100%;
}



/************* OVERRULES *************/

/* iPad / tablet landscape */
@media (max-width: 1024px) {
	#main,
	#social,
	footer{
		width:844px;
	}
	#calc{
		width:100%;
	}
	#calc #calc-bike {
    	margin-right: 2px;
	}
	#calc #calc-nonbike {
    	margin-left: 2px;
	}
	
	#results_holder li{
		width:100% !important;
		min-width:150px !important;
	
		margin:0 24px 24px auto;
	}
	#social a{
		margin-right:6px;
	}
}

/* iPad / tablet portrait */
@media (max-width: 768px) {
	#main,
	#social,
	footer{
		width:700px;
	}
	h3{
		margin-right:0;
		margin-left:0;
	}
	#calc fieldset {
	    height: auto;
	    margin: 12px 0 10px;
	    padding: 12px;
	    width: 300px;
		background:#3BC1ED none !important;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
	#calc #calc-bike{
		margin-right:20px;
	}
	#calc p {
    	float: none;
		margin: 0 15px 12px 0;
	}
}
/* --------------------------------------------
  Mobile
-------------------------------------------- */

@media (max-width: 600px) {
	#logo{
		width:200px;
	}
	.partner #logo{
		width:300px;
	}
	#main,
	footer{
		width:90%;
	}
	#calc{
		width:240px;
	}
	#calc #calc-bike,
	#calc #calc-nonbike{
		width:240px;
		height:auto;
		float:none;
		background:transparent none !important;
		margin:0px auto;
	}
	#calc h3{
		margin:25px 0 12px 0;
	}
	#calc div{
		padding:0px;
	}
	#calc p{
		margin:0 0 7px 0;
	}
	#calc label{
		width:220px !important;
	}
	#calc input#calc-submit{
		margin-top:24px;
	}
	#calc-result li{
		width:100%;
		min-width:200px;
		max-width:300px;
		margin:0 auto 24px auto;
	}
	#bike_stuff h3{
		margin-right:0;
	}
	#bike_stuff li{
		width:90px;
		min-width:90px !important;
	}
	#social{
		width:200px;
	}
	#social .button{
		margin-right:0;
	}
	#bikes{
		padding-top:67px;
		height:100px;
	}
	#bikes img{
		height:100px;
	}
	
}