/* THE HEADER */

body{
	margin:0px auto 0px auto;
	padding:0px;
	width:100%;
	text-align:center;
	color:white;
	background:url(/images/common/body_background.jpg) #46661A repeat-y center;
}


div#pageLayout{
	width:100%;
	text-align:center;
	background:url(/images/common/background.jpg) #46661A repeat-y center;

}

div#pageLayout * {
	text-align:left;
}

div#header{
	margin:0px auto 0px auto;
	width:750px;
}

map area{
	border:2px solid red;
}

div#header h1{
	margin:0px;
	padding: 66px 0 0 0;
	overflow: hidden;
	/*background: url(/images/common/logo_transport_edinburgh.jpg) white;*/
	background: #fff url('/images/common/edinburgh_council_logo.jpg') no-repeat;
	/*background-repeat: no-repeat;*/
	height: 0px !important;
	height /**/:66px;
	width:100%;
}

ol.horizontal_list{
	margin:0px;
	padding:3px 0px 3px 0px;
	display:block;
	width:100%;
	background:#C3C7E0;
	border-top:1px solid #888BB5;
	border-bottom:1px solid #7FAB35;
}

ol.horizontal_list li{
	margin:0px 0px 0px 12px;
	border-right:1px solid #545661;
	padding:0px 9px 0px 0px;
	display:inline;
	list-style-type:none;
	font:bold 9pt verdana,sans-serif;
	color: #545661;
}

div#header ol li a {
	text-decoration:none;
	color:#545661;
}

div#header ol li a:hover {
	color:white;
}

/* the rule below is only understood by mozilla.org browsers*/

div#pageLayout > div#header ol li{
	margin:0px 0px 0px 10px;
	padding:0px 13px 0px 0px;
}


/* THE CONTENT */

div#mainContent{
	margin:0px auto 0px auto;
	width:750px;
	text-align:center;
	background:#8BB93D;
	display:inline-block;
	border-top:1px solid #BDCE9A;
	border-bottom:1px solid #BDCE9A;
}

div#pageContent{
	width:550px;
	float:left;
	border-right:1px solid white;
}

div#contentTitle{
	width:550px;
	border-bottom:1px solid white;
	height:102px;
}

div#mainContent > div#pageContent{
	_width/**/:550px;
}

div#pageContent > div#contentTitle{
	_width/**/:550px;
}

div#contentTitle h2{
	margin:0px;
	padding: 54px 0 0 0;
	overflow: hidden;
	background: url(/images/common/20mph_title.jpg);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:54px;
	width:100%;
}

div#contentTitle p{
	margin:0px;
	padding: 49px 0 0 0;
	overflow: hidden;
	background: url(/images/common/20mph_tag.jpg);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:46px;
	width:100%;
}

div#content{
	background:url(/images/common/big_20circle.jpg) #84A940 no-repeat top left;
	padding:10px 24px 24px 24px;
}

div#content p {
	padding:0px 0px 0px 2px;
	font:8pt verdana,sans-serif;
	line-height:1.8em;
	margin:10px 0px 0px 0px;
}

div#content p#themap{
	text-align:center;
}

div#content p#themap img{
	border:none;
	margin:0px;
	padding:0px;
}

p.copy{
	color:white !important;	
}

div#content p.copy img{
	float:right;
	border:1px solid #E3E9C7;
	margin: 10px 5px 5px 20px;
}

div#content h2,h3,h4{
	font-family: verdana, sans-serif;
	font-size:10pt !important;
	color:#3D5A17;	
}

div#sideBar{
	width:165px;
	float:right;
	padding:0px 15px 0px 10px;
	height:100%;
	color:black;
	background:#8BB93D;
}

div#mainContent > div#sideBar {
	/*background: url("/images/common/sidebar_background.jpg") #8BB93D repeat-y left;*/
	padding:0px 15px 0px 0px;
	width:169px;
}

div#sideBar img{
	border:1px solid #E3E9C7;
	margin:0px 0px 0px 6px;
}

div#sideBar h3#search{
	margin:15px 0px 10px 0px;
	padding: 37px 0 0 0;
	overflow: hidden;
	background: url(/images/sidebar/zone_search_title.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:37px;
	width:100%;
}

div#sideBar h3#pdfhelp{
	margin:15px 0px 10px 0px;
	padding: 24px 0 0 0;
	overflow: hidden;
	background: url(/images/sidebar/pdfhelp.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:24px;
	width:100%;
}

div#sideBar h3#utilities{
	display:none;
}

div#sideBar h3#zonenumbering {
	margin:15px 0px 10px 0px;
	padding: 24px 0 0 0;
	overflow: hidden;
	background: url(/images/sidebar/zonenumbering.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:24px;
	width:100%;
}

div#sideBar h4{
	margin:10px 0px 0px 5px;
	font:bold 9pt verdana,sans-serif;
}

div#sideBar p{
	margin:5px 0px 0px 5px;
	font:8pt verdana,sans-serif;
}

div#sideBar ol{
	font:8pt verdana,sans-serif;
	margin:10px 0px 0px 10px;
}

 /* commented backslash hack (not understood by ie5.2mac) \*/
div#sideBar > ol{
	margin:10px 0px 0px -25px;
}
 /* end hack */

div#sideBar ol li{
	margin:5px 0px 5px 0px;
	padding:0px 0px 0px 20px;
	line-height:15px;
	list-style-type:none;
	vertical-align:middle; /* just understood by ie :( */
	background-repeat:no-repeat;
	background-position:0px 0px;
}

div#sideBar ol li a {
	color:black;
	text-decoration:none;
	border-bottom:1px solid white;
}

div#sideBar ol li a:hover {
	color:white;
}

div#sideBar ul {
	list-style-type:none;
	margin:30px 0px 0px 5px;
}

 /* commented backslash hack (not understood by ie5.2mac) \*/
div#sideBar > ul{
	margin:30px 0px 0px -30px;
}
 /* end hack */
 
div#sideBar ul li{
	width:100%;
	height:26px;
	margin:10px 0 0 0;
}

/* THE FOOTER*/ 

div#footer{
	border-top:1px solid #7FAB35;
	border-bottom:1px solid black;
	background:url(/images/common/bottom_background.jpg) #E4ECCC no-repeat top right;
	margin:0px auto 0px auto;
	width:750px;
	height:50px;
}

div#footer h3{
	display:none;
}

div#footer ul{
	margin:15px 0px 0px 440px;
}

div#footer > ul{
	margin:15px 0px 0px 400px;
}

div#footer ul li{
	list-style:none;
	font:bold 9pt verdana,sans-serif;
}

div#footer ul li a{
	color: #6C7061;
	text-decoration:none;
}


p.areas{
	text-align:center !important;
}

p.areas a{
	color:white;
}

/* ADDITIONAL RULES */

p.clear{
	overflow:visible;
	clear:both;
	margin:0px;
	padding:0px;
}

.noborder{
	border:none;
}

li img{
	border:none !important;
}

<!-- Not used
.wpadd{
	margin-left:20px !important;
}-->

address{
	font:8pt verdana,sans-serif;
	margin:10px 10px 10px 50px;
}

a {
	color:white;
}
/* I HAVE TO SORT OUT THIS */

div#bigScreen{
	width:100%;
	height:100%;
	overflow:visible;
	background:#46661A;
}

#faq-box{
	width:460px;
	background-color:#fff;
	padding:10px 20px 10px 20px;
	border:1px dashed #698B34;
	margin-top:10px;
	font:8pt verdana, sans-serif;
	/* CSS2 transparency stuff - left in for interest but not to be used */
	/*filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;*/
}


#faq-box p{
	color:black !important;
}

#faq-box a{
	text-decoration:none;
}

#faq-box a:hover{
	color:white !important;
}

div#faq-box * {
	position:relative;
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
}

div#faq-box li{
	list-style-type:square !important;
	margin-top:5px;
}

#thecontact{
	margin:10px 0px 10px 0px;
}

#thecontact li{
	display:inline;
	margin:5px;

}

h4.share{
	
	color:white;
	font-size:.7em !important;
}

.syvta{
	width:98%;
	height:100px;
	margin:10px 0px 10px 0px;
	border:1px solid #46661A;
	overflow:auto;
}

input.syvb{
	text-align:center !important;
	background:#E4ECCC;
	border:1px solid #46661A;
	padding:3px;
}

p.sidehelp{
	line-height:1.5em !important;
	
}

p.sidehelp img{
	vertical-align:middle;
	border:none !important;
}


/* revisit these rules they are not pretty right 
	the use of !important is caused by the div#pageLayout * 
	in the top of this document, but it is necessary to render
	the page in old browsers
*/

p.area_down{
	margin-top:30px !important;
	padding-left:60px !important;
}

p.area_down img{
	display:inline;
	margin-bottom:-9px;
	margin-left:-30px !important;
}

p.area_down > img{
	display:inline;
	margin-bottom:-9px;
	margin-left:-30px !important;
	margin-right:5px;
}


p.download{
	margin-left:60px !important;
	height:20px;
	background:url(/images/common/down.jpg) no-repeat top left;
	padding-left:30px !important;
	font:bold 10pt;
}

p.download a{
	color:white;
}