/*
 * Copyright Reversing Made Easy Ltd.
 * http://tiptapdesign.co.uk
 */
#content {
	height:auto;
	padding-right:20px;
	width:830px;
	background:#fff url(graphics/cyclist.jpg) no-repeat 100% 100%
}
#footer {padding-top:30px}
#citysafe, #citysafe h1, #citysafe h2, #citysafe p, #citysafe a, #citysafe span, #cs-panel {font-family:Arial, Helvetica, sans-serif}
#citysafe, #citysafe h1, #citysafe h2, #citysafe p, #cs-panel {
	text-transform:lowercase;
	text-align:right
}

/* citysafe */
#citysafe, #cs-truck {
	margin:0;
	display:block;
	position:relative
}
#citysafe h2 {
	font-style:italic;
	font-weight:400;
	font-size:1.7em;
	color:#777;
	margin:5px 15px 15px 0
}
#cs-indicator, #cs-soundwave, #cs-tls {
	display:block;
	position:absolute
}

/* truck */
#cs-truck {
	z-index:1;
	width:505px;
	height:350px;
	float:left;
	background:url(graphics/components.jpg) no-repeat 0 0
}

/* truck animation - jQuery */
#cs-indicator {
	width:55px;
	height:55px;
	top:261px;
	left:143px;
}
#cs-soundwave {
	width:1px;
	height:200px;
	top:110px;
	left:288px
}
#cs-indicator.on {background:url(graphics/components.jpg) no-repeat -535px -515px}
#cs-soundwave.on {background:url(graphics/components.jpg) no-repeat 0 -350px}

/* turn left safely */
#cs-tls {
	z-index:2;
	width:390px;
	height:70px;
	top:0;
	right:15px;
	background:url(graphics/components.jpg) no-repeat -200px -355px;
}

/* turn left safely animation - jQuery */
#cs-tls.on {background-position:-200px -425px}

/* play button */
#cs-play {
	display:block;
	float:right;
	padding:15px 0 15px 42px;
	margin:15px 0 0;
	font-size:2.2em;
	font-weight:700;
	line-height:1em;
	color:#555;
	background:url(graphics/play.jpg) no-repeat 0 60%
}
#cs-play.on {background-position:-210px 60%}
#cs-play:hover {text-decoration:none}
#cs-play:focus {outline:0}

/* heading logo */
#citysafe h1 {margin:0}
#citysafe h1 img {margin:70px 15px 0 0}

/* price panel */
ul#cs-panel, #cs-panel li {
	margin:0;
	padding:0;
	display:block;
	list-style:none;
	line-height:normal
}
ul#cs-panel {
	width:250px;
	float:right;
	padding:15px 25px 20px;
	background:url(graphics/panel.jpg) no-repeat 100% 0
}
#cs-panel li {
	margin:0 0 7px;
	color:#586fa8;
	font-size:14px;
	text-transform:none
}
#cs-panel li.supersize {
	margin:0 0 5px;
	font-size:2.4em;
	text-transform:uppercase
}
#cs-panel li.supersize strong {
	font-weight:400;
	font-size:2.1em
}
#cs-panel li a {font-weight:700}

/* below truck */
#citysafe div.clear {
	text-align:left;
	padding:15px 0;
	margin:0 140px 0 0;
}
#citysafe div.clear p {
	margin-top:0;
	font-size:2em;
	font-style:italic;
	text-align:center;
	color:#777
}