/* Import generic styles */
@import url(generic.css);


/* GLOBAL */

/* Layout */
#cyclestreets-menu {height: 5.9em;}
#cyclestreets-content {width: auto; min-height: 400px; background-color: white;}
* html #cyclestreets-content {height: 400px;}	/* Emulation of min-height for IE6 */
#cyclestreets-footer {clear: both; text-align: right; width: auto; margin: 0 auto; padding: 10px 0 50px;}

/* Fonts */
h1 {color: #a60101;}
h2, #cyclestreets-content h2 a, #cyclestreets-content h2 a:link, #cyclestreets-content h2 a:visited {color: #786e4e; padding-top: 0.5em;}


/* Global menu */
#cyclestreets-menu #cyclestreets-logo img.logo {border: 0; float: left; margin: 0 34px 0 0;}
/* The minus 40px for margin-right allows the normal flow to carry on uninterrupted by this relatively posistioned element. The logo itself is 40px wide. */
#cyclestreets-menu #cyclestreets-logo img.beta {float: left; position: relative; top: 50px; left: -80px; margin-right: -40px;}
#cyclestreets-menu p {padding: 0; margin: 0;}
#cyclestreets-menu ul.cyclestreets-tabs {list-style: none; height: 2.4em; margin: 50px 0 0; padding: 0;}
#cyclestreets-menu ul.cyclestreets-tabs li {float: left; margin-right: 8px; background-color: #FCFAF3;}
#cyclestreets-menu ul.cyclestreets-tabs li img {vertical-align: middle;}
#cyclestreets-menu ul.cyclestreets-tabs li a {display: block; width: auto; padding: 5px 5px; border: 0 solid #ccc; border-bottom: 3px solid #ccc; -moz-border-radius: 10px 0; text-decoration: none; color: #4E4628; -moz-opacity: 0.65;}
#cyclestreets-menu ul.cyclestreets-tabs li a:hover {border-color: gray; background-color: #fefefe;}
#cyclestreets-menu ul.cyclestreets-tabs li.selected a {background-color: #fefefe; border-bottom-color: #786E4E;}
#cyclestreets-menu ul.cyclestreets-tabs li.journeyPlannerPage a, #cyclestreets-menu ul.cyclestreets-tabs li.photomap a {width: 140px; opacity: 1; background: no-repeat 7px 7px; padding-left: 10px; border-width: 1px 1px 3px 1px;}
#cyclestreets-menu ul.cyclestreets-tabs li.journeyPlannerPage a, #cyclestreets-menu ul.cyclestreets-tabs li.photomap a {-moz-opacity: 1;}	/* Hack to add vendor-specific support for opacity while CSS3 support unavailable - see http://www.quirksmode.org/css/opacity.html */
#cyclestreets-menu ul.cyclestreets-tabs li.journeyPlannerPage {margin-left: 15px;}
#cyclestreets-menu ul.cyclestreets-tabs li.photomap {margin-right: 20px;}
#cyclestreets-menu ul.cyclestreets-tabs li.signin {display: none;}
#cyclestreets-menu ul.cyclestreets-tabs li a.login {margin-left: 20px;}
ul.cyclestreets-subtabs li img.journeyplanner, ul.cyclestreets-subtabs li img.photomap {display: none;}

#cyclestreets-menu div.adminBanner {float: left; line-height: 1.1em;}
#cyclestreets-menu div.adminBanner a {text-decoration: none; color: gray;}

/* Submenu */
#searchbar {float: right;}
#searchbar input {color: #666;}
#searchbar input.search {padding: 1px 4px; width: 95px;}
body.cyclestreets-proxy #searchbar input.search {padding-left: 5px; width: 50px;}
ul.cyclestreets-subtabs {float: none; padding: 0 0 0.5em; margin: 0 0 2em; border-bottom: 1px solid #ddd; text-align: left;}
ul.cyclestreets-subtabs li {display: inline; margin-right: 0.6em; font-size: 0.83em;}
ul.cyclestreets-subtabs li a {color: #666; padding-bottom: 2px; text-decoration: none; white-space: nowrap;}
*+html body.cyclestreets-proxy #cyclestreets-content, * html body.cyclestreets-proxy #cyclestreets-content {clear: right; margin-top: 20px;}	/* IE6 and IE7 hack */
* html body.cyclestreets-proxy #cyclestreets-content {padding-top: 15px;}	/* IE6 and IE7 hack */
* html #cyclestreets-content ul.cyclestreets-subtabs li a:hover {border-bottom: 0;}	/* IE6 hack to prevent subtabs having hover underlining */



ul.cyclestreets-subtabs li a img {border: 0; vertical-align: middle; margin-right: 2px;}
#cyclestreets-content ul.cyclestreets-subtabs li a {border: 0;}


/* Signin links */
/* Reduce the top and bottom margins here so that the cyclestreets menu tabs don't get bumped down. */
#cyclestreets-menu ul.signin {float: right; margin-top: 0.5em; margin-bottom: 0.25em; margin-right: 1em;}
/* The line-height here helps keep the text lined up when there is an icon (e.g. tinkle) in one of the list items.*/
#cyclestreets-menu ul.signin li {float: left; list-style: none; margin-left: 15px; font-size: 0.83em; line-height: 2em;}
#cyclestreets-menu ul.signin li a {color: gray; text-decoration: none;}
#cyclestreets-menu ul.signin li:last-child {margin-left: 40px; opacity: 0.8;}
#cyclestreets-menu ul.signin li:last-child {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); -moz-opacity: 0.8;}	/* Vendor specific implementations of opacity */

#cyclestreets-menu ul.signin li span.username { font-weight: bold; margin-right: 1em;}

/* Footer */
#cyclestreets-footer ul, #cyclestreets-footer p {font-size: 0.83em; line-height: 16px;}
#cyclestreets-footer ul {float: right; list-style: none; margin: 0; padding: 0; display: block;}
#cyclestreets-footer ul li {float: left;}
#cyclestreets-footer ul li a {padding: 0 8px; text-decoration: none;}
#cyclestreets-footer ul a, #cyclestreets-footer p a {color: #0b0b0b;}
#cyclestreets-footer ul li a:hover {padding: 0 8px;}
#cyclestreets-footer p {text-align: right; clear: right; margin-top: 0.6em;}


/* FRONT PAGE */

/* Front page - about */
.home #cyclestreets-about {float: left; width: 603px; padding: 0 15px 2px 22px;}
body.cyclestreets-proxy #cyclestreets-about {width: 550px; padding-left: 0;}
* html body.cyclestreets-proxy #cyclestreets-about {width: 545px;}
.home #cyclestreets-about h2 {color: #786E4E; padding: 0 0 10px 0; font-size: 2.05em; line-height: 42px; float: left; margin: 0;}
.home #cyclestreets-about h2 span {background-color: #FFFFFF; color: #0B0B0B; font-size: 16px; line-height: 20px;}
.home #cyclestreets-about ul {padding: 0; margin: 0; margin-top: -10px; list-style: none;}
.home #cyclestreets-about ul, .home #cyclestreets-about p, .home #cyclestreets-about div.jumplist {margin-left: 190px;}
body.cyclestreets-proxy #cyclestreets-about ul {margin-left: 170px;}
.home #cyclestreets-about ul img {border: 0; margin-right: 2px; vertical-align: middle;}
.home #cyclestreets-about ul li {font-size: 14px; line-height: 16px; color: #4E4628; padding: 0 0 0 6px; text-align: left;}
* html .home #cyclestreets-about ul li {border: 1px solid white;} /* Hack for IE6 */
.home #cyclestreets-about ul li a {text-decoration: none; color: #4E4628; margin: 0; padding: 4px; display: block;}
.home #cyclestreets-about ul li a:hover {background-color: #F4EFDF;}
.home #cyclestreets-about p {padding: 10px 0 0 250px;}
.home div.jumplist {margin-top: 15px;}
.home div.jumplist form {display: inline;}


/* Front page photomap/journeyplanner boxes */
.home #journeyplanner, .home #photomap, .home #blog {background-color: #FCFAF3; color: #0B0B0B; border: 1px solid #eee; padding: 10px 25px;}
.home #photomap, .home #blog {float: right; width: 200px;}
.home #journeyplanner, .home #photomap {margin-top: 18px;}
.home #photomap h2, .home #journeyplanner h2 {background-color: #FCFAF3; color: #A60101; font-size: 1.9em; line-height: 40px; margin: 0 0 10px; padding: 0;}
.home #photomap h2, .home #journeyplanner h2, .home #photomap h2 a, .home #journeyplanner h2 a {color: #A60101; border-bottom: 0;}
.home #photomap h2 span, .home #journeyplanner h2 span {color: #0B0B0B;}

/* Front page - photomap */
#collapse {float: right; width: 5em; text-align: right;}
#collapse:hover {background-color: #d59999; color:white; font-weight: bold;}
.home #journeyplanner.narrow {float: left; width: 614px;}
body.cyclestreets-proxy #journeyplanner.narrow {width: 500px;}
.home #journeyplanner.narrow div#collapse {display: none;}
.home #journeyplanner.expanded {float: left; width: 884px;}
body.cyclestreets-proxy #journeyplanner.expanded {width: 767px;}

.home #photomap.collapsed {display: none;}
.home #journeyplanner p.map {margin: 0; width: 400px; height: 400px; float: left; border: 1px solid gray;}
.home #journeyplanner p.start, .home #journeyplanner p.end {height: 75px; border: 1px solid #ddd; width: 145px; margin: 0 0 10px 415px; padding: 10px;}
.home #journeyplanner p.start {background-color: #92b591;}
.home #journeyplanner p.end {background-color: #eee;}
.home #journeyplanner p.end:hover {background-color: #d59999;}
.home #journeyplanner p.button {float: right; clear: right; margin-top: 1.5em;}
.home #journeyplanner p.button input {width: 190px; background-color: white; border: 2px solid #ccc; font-size: 1.6em; font-family: Georgia, "Times New Roman", Times, serif; padding: 10px; position: relative; left: -10px;}

.journeyPlannerPlaces h2 div.jumplist, .journeyPlannerPlaces h2 div.jumplist form {display: inline;}
.journeyPlannerPlaces h2 div.jumplist form {vertical-align: bottom;}
.journeyPlannerPlaces h2 div.jumplist form select {font-family: Georgia, "Times New Roman", Times, serif; color: #786e4e;}
.journeyPlannerPlaces h2 div.jumplist form input.button {display: none;}

/* Front page - photomap */
.home #photomap p {margin: 7px 0 10px;}
.home #photomap p a {text-decoration: none; color: #666;}
.home #photomap p.introduction {margin: 0 0 20px; padding: 0; font-size: 0.93em; text-align: left;}
.home #photomap li a {border: 1px solid #aaa; width: 180px; padding: 4px 8px; font-weight: bold; -moz-border-radius: 3px; margin-bottom: 5px;}
.home #photomap li a:hover {border-color: gray; color: #333;}
.home #photomap ul {float: none;}
.home #photomap li {background-repeat: no-repeat; background-position: 173px center; background-color: white;}
.home #photomap li.browse {background-image: url(images/icons/map.png);}
.home #photomap li.add {background-image: url(images/icons/add.png);}
.home #photomap li.recent {background-image: url(images/icons/images.png);}
.home #photomap p.photomap {margin-top: 20px;}
.home #photomap p.photomap a {border-bottom: 0;}

/* Front page - blog */
.home #blog {margin: 0; height: 80px;}
.home #blog h2 {font-size: 1em; line-height: 14px; margin: 0 0 13px; padding: 0;}
.home #blog h2, .home #blog h2 a {color: #A60101; border-bottom: 0;}
.home #blog ul {list-style: none; margin: 0; padding: 0;}
.home #blog li {font-size: 0.83em; margin: 8px 0 3px;}
.home #blog li a {color: #333;}

/* Blog pages */
.blog #postings .post {background-color: #FCFAF3; color: #0B0B0B; margin: 0; padding: 10px 25px 2.5em 25px; width: auto; border: 1px solid #eee; width: 600px; margin-bottom: 1em;}
.blog #sidebar {float: right; width: 200px; font-size: 82%; border: 1px solid #ccc; background-color: #f7f7f7; padding: 10px;}
.blog #sidebar ul {list-style: none; margin-left: 0; padding-left: 0;}
.blog #sidebar ul li ul {list-style: square; margin-left: 10px; padding-left: 10px;}
.blog div.description {font-style: italic; color: gray; font-size: 0.9em; border-bottom: 1px solid #ddd; margin-bottom: 1em; margin-right: 300px;}
.blog div.post {border-bottom: 1px solid #ddd; padding-bottom: 1em; margin-right: 300px;}
.blog div.post h2 {margin-bottom: 5px;}
.blog div.post small {display: block; margin-bottom: 2em;}
.blog p.postmetadata {font-size: 0.9em; margin-top: 1.8em; color: gray;}
.blog *:target {background: white; padding-top: 2em;}
.blog *:target:before {content: none;}



.action {padding-left: 0.5em; padding-right: 0.5em; border: 2px solid #ddd; background-color: #eee; border-style: outset; cursor: pointer; text-decoration: none; line-height: 150%; color:black;}
.action:active { border-style: inset; cursor: pointer;}


.miniicon {border: 0; width: 16px; height: 16px;}

/* May key */
a.mapkey {background-color: white; font-weight: normal; margin-right: 0; padding: 3px 6px; border: 1px solid gray; position: relative; top: -3px; right: -4px;}
a.mapkey strong {color: green; font-weight: bold;}


/* Links */
#cyclestreets-content a {text-decoration: none; color: gray; border-bottom: 1px solid #ddd;}
#cyclestreets-content a:hover {border-bottom: 1px solid #666;}
th a { color: teal;}

p.debug, p.adminnotice{color: #555; background: #FDF2EE; margin-top: 2em;}
p.debug a { color: #666; }

p#rate {font-size: 0.83em; display: inline;}
p#permalink {font-size: smaller;}

#content p {margin-top: 0;}

p.accelerator {text-align: right;}

img.marker_tag { border: 0; }

ul {list-style: square;}
li { line-height: 1.5em;}

/* Search result */
#searchform #query, input#searchgo, div.photoimport .url input, input.editableURL, body.journeyPlannerUrl div.postcode input, body.journeyPlannerUrl div.postcoderesult p {color: #603; font-size: 1.4em; padding: 0.2em;}
#searchform p.phrase {margin-top: 6px; padding: 0; color: #603;}
div.searchformcontainer {padding: 2em; margin-bottom: 1em;}
p.searchresult {margin-bottom: 2em;}

/* Postcode page */
body.journeyPlannerUrl div.postcode input#form_name {padding: 0.1em 0.2em; font-size: 1.2em;}
body.journeyPlannerUrl #cyclestreets-content div {margin-left: 3em; margin-bottom: 2em;}
body.journeyPlannerUrl #cyclestreets-content div.cyclestreets a {border: 0;}	/* Get rid of the border */
body.journeyPlannerUrl #cyclestreets-content div.postcoderesult p a {border: 0; color: #603;}
body.journeyPlannerUrl div.postcode {width: 40em; padding: 0.5em 3em; margin-top: 2em;}
body.journeyPlannerUrl div.postcode input.button {margin-left: 8.8em;}
body.journeyPlannerUrl div.postcoderesulthtml pre {font-family: "Lucida Console", monospace; font-size: 0.83em;}
body.journeyPlannerUrl #example {float: right; position: relative; top: -3em;}

/* Tinkle */
#tinkleForm_tinkle {color: #603; font-size: 1.4em; padding: 0.2em;}
td p.tinkle {color: #036; font-size: 1.4em;}
td p.tinkleTime {color: #ccc; font-size: small;}
div#characterCountdown {color: #603; font-size: 1.4em; padding: 0.2em; float: right;}

/* Nearby page */
div.nearby {float: left; width: 95%; margin: 1em 1.4em 0.2em 0; padding: 1em; background-color: #f7f7f7; border: 1px solid #888; border-width: 1px 0;}
div.nearby p.comment {margin: 0.2em 0 1.4em;}
div.nearby div.image {float: left; text-align: center; margin-right: 15px; margin-bottom: 2em;}
div.nearby p.caption {text-align: left;}


/* Photo listings */
div.photolisting div.photo {float: left; width: 45%; height: 180px; margin: 1em 1.4em 0 0; padding: 0.8em; background-color: #f7f7f7; border: 1px solid #888; border-width: 1px 0}
div.photolisting div.photo:hover {background-color: #f3f3f3; border-color: gray;}
div.photolisting div.image {float: left; text-align: center; margin-right: 15px; min-height: 160px;}
div.photolisting div * {background-color: transparent;}
div.photolisting div.image img {border: 1px solid gray;}
div.photolisting div.image p.colophon {font-style: italic; margin: 2px 0 0; float: left;}
div.photolisting div.image p.rating {font-size: 0.83em; margin: 2px 0 0; text-align: right; color: #bbb;}
div.photolisting p.caption {text-align: left;}
div.photolisting.upright div.photo {width: 21%; height: 357px; margin-right: 0.9em;}
div.photolisting.upright div.image {float: none;}

body.photomapListings h2.recent {clear: both; padding-top: 40px;}


/* Table of Contents */
/* Note: potential confusion with global.css toc */
div.helptoc#toc {float: right; width: 20em; margin: 0 0 0 1.5em; border: 1px dotted #F1EDC2; padding: 0.5em; background: #f6f9ed; font-size: 0.9em; line-height: 150%; }

div.helptoc#toc a{ text-decoration: none; color: #686;}
div.helptoc#toc a:hover{ text-decoration: none; color: #686; background: #eef3e2;}

div.helptoc#toc li {list-style: none;}
div.helptoc#toc .level2 { margin-left: 1em; }
div.helptoc#toc .level3 { margin-left: 2em; }
div.helptoc#toc .level4 { margin-left: 3em; }
div.helptoc#toc .level5 { margin-left: 4em; }
div.helptoc#toc .level6 { margin-left: 5em; }

span.code { font-family: monospace;}
span.osmtag { font-family: monospace;  background: #E0E0F0;}
dl.code,p.code, pre.code { font-family: monospace; padding: 1em; border: 1px solid silver; line-height: 150%;  background: #f6f9ed;}
dl.code dd { margin-bottom: 1em; }

/* Mini lists of further options */
ul.furtheroptions {display: inline; list-style: none; margin-top: 5px;}

/* List of journeys */
body.journeyListings table.browse td.whence {width: 21em;}

/* Journey listing */
table.journeylisting {margin-top: 25px; clear: right;}
table.journeylisting td p:first-child {margin-top: 0;}
table.journeylisting tr.hasphotos td {border-bottom: 0;}
table.journeylisting th {background-color: #eee;}
table.journeylisting img.photothumbnail {margin-right: 10px; padding: 5px 0 25px;}
#cyclestreets-content table.journeylisting a.photothumbnail {border-bottom: 0;}
table.journeylisting img.photothumbnail {opacity: 0.7;}
table.journeylisting img.photothumbnail {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); -moz-opacity: 0.7;}	/* Vendor specific implementations of opacity */
table.journeylisting img.photothumbnail:hover {opacity: 1;}
table.journeylisting img.photothumbnail:hover {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1;}	/* Vendor specific implementations of opacity */
p.alignright {text-align: right;}

/* PER photos-en-route */
.itinerarydisplay h2 {padding-top: 0; padding: 0.25em; font-size: 1.3em;  margin-bottom: 0.75em; border-bottom: 1px solid #ddd;}
#quietest.itinerarydisplay h2 {color: green;}
#fastest.itinerarydisplay h2 {color: #CC0000;}
#shortest.itinerarydisplay h2 {color: #5555DD;}
.itinerarydisplay h2 span {padding-left: 1em; color: gray; font-size: 0.6em; font-weight: normal;}
checkbox#showphotosenroute[disabled='disabled'], checkbox#showmaplets[disabled='disabled'] {color: #ccc;}
#routefeedbackbox table.lines {margin-bottom: 1em;}


/* Pop-up bubbles within a Dynamic Photomap -style display */
.photobubble {width: 402px; min-height: 402px;}
.photobubble p.peekimage {min-height: 300px;}
.photobubble #cyclestreets-content p.peekimage a {border: 1px solid white;}	/* #!# Still has a wierd padding effect though at the bottom */
.photobubble #cyclestreets-content p.peekimage a:hover {border-color: gray;}

/* Pop-up bubbles within a Journey Planner places display */
.journeyplacesbubble {width: 350px; height: 300px;}
.journeyplacesbubble #streetviewpanel {width: 100%; height: 200px; border: 1px solid #e7e7e7;}




/* Captioned Images - for use on help pages */
div.image-container { border: 1px solid #888; padding: 0.2em; margin: 0.2em; background-color: #eee; }

div.strip-captioned-image { float: left; padding: 1em; width: 330px;}
div.strip-captioned-image p { text-align: center; font-style: italic;  width: 330px;}

div.single-captioned-image { padding: 1em; text-align: center; font-weight: bold; }
div.single-captioned-image p { text-align: center; font-style: italic; }
div.single-captioned-image-right { padding: 1em; text-align: center; font-weight: bold; width: 300px; float: right;}
div.single-captioned-image-right p { text-align: center; font-style: italic; width: 300px; float: right;}


tr.datetime fieldset {padding: 0;}


/* Buttons */
ul.actions {margin-bottom: 1.5em;}
p.actions a {padding: 3px;}
p.actions a img {border: 0;}
p#markerexplanation, ul#providerlinks {padding-top: 5px;}
p#markerexplanation {float: right;}
body.cyclestreets-proxy p#markerexplanation {text-align: right; float: none;}
p#markerexplanation img {vertical-align: middle;}
ul#providerlinks {margin-left: 0; padding-left: 0; list-style: none; text-align: left;}
ul#providerlinks li {display: inline; margin: 0; padding: 0;}
ul#providerlinks li img {vertical-align: bottom; opacity: .75; border: 0; width: 82px; height: 22px;}
ul#providerlinks li img {filter: alpha(opacity=75); -moz-opacity: .75;}	/* Hack to add vendor-specific support for opacity while CSS3 support unavailable - see http://www.quirksmode.org/css/opacity.html */


/* Test page */
body.tests div.test { border: 1px dashed gray; padding: 1em;}



/* Photomap tabs */
ul.photomaptabs {clear: right;}


/* Photomap/locate header */
/* #!# Some of these divs are probably not necessary and could be replaced with body.photomap/locate hierarchy */
#photomapheader {height: 3.5em; margin-bottom: 2em;}
#photomapheader h1 {margin-top: 0; float: left;}
#photomapheadercolophon {width: 75%; float: right; margin-left: 1em;}
#photomapheadercolophon p, p#markerexplanation, ul#providerlinks {margin: 0 0 5px; color: #666;}
#photomapheadercolophon p img {vertical-align: middle;}
#photomapheader ul.actions li {font-weight: bold; margin-bottom: 3px;}
#photomapheader ul.actions li#mainactions-view {background-color: yellow;}
#photomapheader ul.actions li {float: left; margin-left: 4px;}
#photomapheader ul.actions li a {width: 145px;}
div.view #photomapheader, div.locate #photomapheader {height: auto; margin-bottom: 0;}


/* Photomap pages */
#mapcolophon.unset {background-color: yellow;}
#mapcolophon.set {background-color: white; visibility: hidden;}
p#image {margin: 6px 0; /* Should be 8px but not sure why 6px is in line instead */ min-height: 300px;}
* html p#image {height: 300px;}	/* IE6 hack to emulate min-height */
#cyclestreets-content p#image a {border: 0;}	/* Removes space under image for some reason */
p#photonumber {text-align: right; font-size: 0.83em; margin-top: 0;}
p#editing, p#utilities {font-size: 0.8em;}
p#mapcolophon, p#markerexplanation, ul#providerlinks {margin: 0; font-size: 0.83em;}
p#locatePrompt {margin: 4px 0 1em; height: 1em;}
#cyclestreets-content p#mapcolophon a, #cyclestreets-content p#photonumber a, #cyclestreets-content p#utilities a, #cyclestreets-content p#copyright a {border: 0;}
#cyclestreets-content p#utilities a.copyright {margin-right: 2em;}
#cyclestreets-content p#editing a {border: 1px solid #bbb; padding: 2px 4px 4px; -moz-border-radius: 2px;}
#cyclestreets-content p#editing a:hover {background-color: #eee;}
#cyclestreets-content p#editing a.delete:hover {background-color: #FF6D6D; color: black;}
#cyclestreets-content p#editing img {vertical-align: middle;}
#cyclestreets-content p#caption {text-align: justify; color: #900;}


/* Photomap prioritisation system */
body.prioritisation div.organisationsjumplist {float: right;}
body.prioritisation table.categoryselection td.type {width: 250px; text-align: right; padding-right: 15px;}
body.prioritisation table.categoryselection td.type h3 {font-size: 1.7em; margin-top: 0; padding-top: 5px; margin-bottom: 0; padding-bottom: 5px; text-align: right;}
body.prioritisation table.categoryselection td.type img.prioritisationicon {border: 0; float: right; padding: 0; margin: 10px 0 0 10px;}
body.prioritisation table.categoryselection td.type ul {list-style: none; padding: 0; margin: 0; margin-right: 60px;}
body.prioritisation table.categoryselection td.type ul li {margin-top: 3px;}
body.prioritisation p.largesubmit {margin-top: 1em;}
body.prioritisation p.largesubmit input {font-size: 1.6em;}
body.prioritisation table.prioritisation td {border-top: 2px solid #ccc; padding-top: 12px; padding-bottom: 12px;}
body.prioritisation table.prioritisation {margin-top: 2em; border-bottom: 2px solid #ccc; background-color: white;}
body.prioritisation p.key {text-align: left;}
body.prioritisation p.key span {font-size: 1.4em;}
body.prioritisation p.key span.annotated {color: #dee9ff;}
body.prioritisation table.editing tr.annotated, body.prioritisation table.editing tr.duplicate, body.prioritisation table.editing tr.bogus {background-color: #dee9ff;}
body.prioritisation p.key span.duplicate {color: #ddd;}
body.prioritisation table.prioritisation tr.duplicate td, body.prioritisation table.prioritisation tr.bogus td {opacity: 0.6;}
body.prioritisation table.prioritisation tr.duplicate td, body.prioritisation table.prioritisation tr.bogus td {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60); -moz-opacity: 0.6;}	/* Vendor specific implementations of opacity */
body.prioritisation p.key span.resolved {color: #cfffb7;}
body.prioritisation table.prioritisation th {padding-bottom: 12px; background-color: #f7f7f7;}
body.prioritisation table.prioritisation th abbr {border-bottom: 1px dotted #999;}
body.prioritisation table.prioritisation tr td.id a {font-weight: bold;}
body.prioritisation table.prioritisation tr td.id span.date {font-size: 0.9em; color: #777;}
body.prioritisation table.prioritisation tr td.scores p.desirability {margin-top: 2px;}
body.prioritisation table.prioritisation tr td.caption p {padding: 0; margin: 0 0 5px; font-size: 0.9em;}
body.prioritisation #cyclestreets-content table.prioritisation tr td.id span.email a, body.prioritisation table.prioritisation tr td.caption a, body.prioritisation #cyclestreets-content table.prioritisation tr td.location a {border-bottom: 0;}
body.prioritisation table.prioritisation tr td.resolved {background-color: white;}
body.prioritisation table.prioritisation tr.duplicate td.resolved {background-color: #eee;}
body.prioritisation table.prioritisation tr.resolved td.resolved {background-color: #cfffb7;}
body.prioritisation table.prioritisation td label {display: none;}	/* This is rather brittle if ultimateForm gives better support for label. Replace with a td:last-child class when CSS browser support better soon  */
body.prioritisation table.prioritisation td.caption p {width: 200px; overflow: hidden;}
body.prioritisation table.listing td.score {font-weight: bold;}
/* body.prioritisation .ultimateform table.prioritisation td.scores p.status select {color: black;}
body.prioritisation .ultimateform table.prioritisation td.scores p.status option[value=unconsidered] {color: gray;} */	/* #!# This doesn't work when selected */
body.prioritisation table.prioritisation td.scores p.status option[value=investigating] {background-color: orange;}
body.prioritisation table.prioritisation td.scores p.status option[value=approved] {background-color: mediumseagreen; color: white;}
body.prioritisation table.prioritisation td.scores p.status option[value=improved] {background-color: green; color: white;}
body.prioritisation table.prioritisation td.scores p.status option[value=rejected] {background-color: #c99; color: white;}
body.prioritisation h1 {margin-bottom: 1.3em;}
body.prioritisation div.organisationsjumplist {position: relative; top: -7px;}
body.prioritisation ul.tabs {margin-bottom: 1.5em;}
body.prioritisation div.categoryjumplistcontainer {float: right;}
body.prioritisation p#editablemarkertext {color: #603; margin-top: 2em; font-weight: bold; font-size: 1.2em;}
body.prioritisation p#editablemarkertext a.editablemarkerlinkdisabled {color: #ccc;}
body.prioritisation p.maplink {float: right; font-size: 0.92em;}
body.prioritisation p.maplink img {vertical-align: middle;}
body.prioritisation #cyclestreets-content p.maplink a {border: 0;}


/* Pagination */
div.pagination {margin: 1em;}
div.pagination ul.pages {text-align: center; font-size: 0.85em; margin: 0; padding: 0;}
div.pagination ul.pages li {list-style: none; margin: 0 0 0 0.5em;  padding: 0 0 0 0.75em; display: inline; border-left: 1px solid #778;}
div.pagination ul.pages li:first-child {border-left: 0;}
ul.resultSet {float: right; margin-top: -1.5em; padding: 0; width: 250px;}
ul.resultSet li {display: inline;}
ul.resultSet li div.jumplist, ul.resultSet li form {display: inline;}
ul.resultSet img {width: 16px; border: 0; vertical-align: middle;}
#cyclestreets-content ul.resultSet li a {border-bottom: 0;}


/* Clearance */
div.clearboth {clear: both;}


/* Map cursors */
#map .olLayerDiv {cursor: url(http://www.cyclestreets.net/images/cursors/openhand.cur), move;}	/* The actual viewport */
#map .olDragDown .olLayerDiv {cursor: url(http://www.cyclestreets.net/images/cursors/closedhand.cur), move;}	/* While dragging */
body.photomap #map .olLayerDiv svg image {cursor: pointer;}



/* Map panel: hierarchy is: (1) #mapContainer contains the map panel, locationfinder and other attached info; and (2) #map, the slippy map itself */
#mapContainer {/* width auto = 100% minus any margin-right subsequently applied */ height: 600px; position: relative;}
#map {height: 100%;}

/* Pages with a placefinding panel: allocate space to the right and add a right-margin to the map */
#placefindingPanel {float: right; width: 250px;}
body.home #mapContainer, body.journeyPlannerPage #mapContainer, body.journeyPlannerPlaces #mapContainer {margin-right: 270px; /* 20px more than the panel width */}

/* Front page: when unexpanded, override placefinding panel to be narrower */
body.home #journeyplanner.narrow #placefindingPanel {width: 210px;}
body.home #journeyplanner.narrow #mapContainer {margin-right: 230px; /* 20px more than the panel width */}

/* Front page in Proxy mode: when unexpanded, override placefinding panel to be narrower */
body.cyclestreets-proxy.home #journeyplanner.narrow #placefindingPanel {width: 175px;}
body.cyclestreets-proxy.home #journeyplanner.narrow #mapContainer {margin-right: 190px; /* 20px more than the panel width */ height: 470px;}

/* Location page: small map (photo itself will be floated to the right) */
body.photomap div.view #mapContainer, body.photomap div.locate #mapContainer {height: 470px;}
body.photomap div.view #mapContainer #map, body.photomap div.locate #mapContainer #map {height: 360px;}
body.cyclestreets-proxy.photomap div.view #mapContainer, body.cyclestreets-proxy.photomap div.locate #mapContainer {width: 350px; height: 350px;}

/* Settings: small map floated to right */
body.admin #mapContainer {float: right; width: 300px; height: 350px; margin-left: 30px;}

/* #!# There is also itineraryDisplaySummaryMap below, for which no refactoring has been attempted yet */



/* Legend */
#legendContainer {position: absolute; right: 24px; z-index: 1000;}
div.legend {margin: 10px 0 5px; padding: 2px 10px;}
div.legend ul {list-style: none; margin: 0; padding: 0;}
#legendContainer.ui-expandable .ui-widget-content {padding: 11px 18px 13px 18px;}
#legendContainer.ui-expandable {width: 365px; background-color: white; border: 1px solid #eee;}
#legendContainer.ui-expandable .ui-widget-header {background: none; border: none; padding-left: 20px; background-image: url(images/jquery/expandable-closed.png); background-repeat: no-repeat;}
#legendContainer.ui-expandable-open .ui-widget-header.ui-state-hover {outline: 1px dotted #cccccc; outline-width: 0 0 1px 0; /* fails in firefox */}
#legendContainer.ui-expandable .ui-widget-content {border: none; padding: 0 0 5px 18px;}
#legendContainer .ui-icon {display: inline;}
/* #!# These don't seem to work, so the expandable-closed icon has been added above, as a workaround */
#legendContainer.ui-expandable .ui-widget-header .ui-icon {background-image: url(images/jquery/expandable-closed.png);}
#legendContainer.ui-expandable .ui-widget-header .ui-icon.icon-open {background-image: url(images/jquery/expandable-icon.png);}




/* Location finder (centre the map / SAYT) above the map */
#locationfinder h3 {display: none;}
#locationfinder * {display: inline;}
#locationfinder input {width: 200px;}




/* Journey Planner boxes */
#jpStart, #jpFinish, #jpPlans {border-width: 1px; border-style: solid; }
#jpStart, #jpFinish {padding: 0.5em 1em;}
#jpStart p, #jpFinish p {min-height: 24px; }
#jpStart p img, #jpFinish p img {vertical-align:middle; }
#jpStart, #jpFinish, #jpOptions, #jpPlans {margin: 0 0 1em;}
#jpStart h3, #jpFinish h3 { margin-top: 0; border-bottom: 0; padding-left: 0;}
#jpStart form#streetSearchStart, #jpFinish form#streetSearchFinish { display: none; }
#jpStart.inactive, #jpFinish.inactive, #jpPrompt.inactive { display: none;}
#jpStart.focussed, #jpFinish.focussed, #jpOptions { border-width: 2px;}
#jpStart.focussed form#streetSearchStart, #jpFinish.focussed form#streetSearchFinish { display: block; }
#jpStartCue a, #jpFinishCue a {margin-left: 2em; font-size: smaller; }
input#jpStartStreetSearch, input#jpFinishStreetSearch { width: 80%; }

input#jpStartStreetSearch[disabled], input#jpFinishStreetSearch[disabled] { color: black; }
input#jpStartStreetSearch, input#jpFinishStreetSearch {padding: 4px 24px 4px 4px;}
input#jpStartStreetSearch, input#jpFinishStreetSearch, p#jpStartCue strong, p#jpFinishCue strong {color: #603; font-size: 1.3em; font-weight: normal; padding-left: 4px;}

#jpStart {border-color: #3c3;}
#jpStart h3 { color: #383; }
#jpStart.focussed { background-color: #F1FDED;}
#jpStart.complete { background-color: #DFFAD6;}
#jpStart.complete p.geolocation {display: none;}
#jpStart.complete p.homelocation {display: none;}

/* Search as you type - overruling those style in sayt/styles/ */
#searchAsYouType div.searchResults div.searchResult { padding: 0 0 0 0.6em; border: 0;}
#searchAsYouType div.searchResults div.searchResult p.result { color:#660033; margin: 0; padding: 0 0 2px;}
#searchAsYouType div.searchResults div.searchResult p.result span { color:#999; }
#searchAsYouType div.searchResults div.highlighted { background: #ddd; }
#searchAsYouType div.searchResults div.searchResult:hover { background: #eee !important;}

/* Settings section */
#placefindingPanel #whence {width: 100px;}

/* Finish box */
#jpFinish { /* background-color: #fee; */ border-color: #f30;}
#jpFinish h3 { color: #f30; }

#jpFinish.inactive { border-color: #cbb;}
#jpFinish.inactive h2 { color: #c88;}
#jpFinish.focussed { background-color: #FDF1ED;}
#jpFinish.complete { background-color: #FADFD6;}
#jpFinish.complete p.homelocation {display: none;}

#jpOptions { padding-left: 1em; background: #eee; border-color: #ddd; background: transparent; border-color: white;}
#jpOptions.inactive { display: none; }
#jpOptions ul li.untouched { opacity: .65; }
#jpOptions ul li.untouched {filter: alpha(opacity=65); -moz-opacity: .65;} /* Hack to add vendor-specific support for opacity while CSS3 support unavailable - see http://www.quirksmode.org/css/opacity.html */
#jpOptions ul li.touched {font-weight: bold; color: gray;}

#jpPlans {border: 0; }
#jpPlans.inactive {display: none;}







/* Photo location page */
div.locatedPhoto {width: 640px;}
body.cyclestreets-proxy div.locatedPhoto {width: 425px;}

/* Photo metadata view */
body.photomap #details {float: right; width: 270px; margin-left: 20px;}
body.photomap #details #mapContainer {width: 100%;}	/* Only necessary for IE */
div.view table.metadata td {font-size: 0.83em; padding: 4px 0;}
div.view table.metadata td:first-child {width: 90px;}

/* Photo metadata update */
.photometadata .longitude, .photometadata .latitude, .photometadata .zoom, .photometadata .basemap {display: none;}
div.update #details .ultimateform td.title {width: 29%;}
div.update #details .ultimateform h3 {margin: 1em 0 0.5em;}
div.update #details .ultimateform td.description {color: gray; width: 20%; font-size: 0.9em;}
div.update #details .ultimateform #locaterform_datetime_time {width: 70px;}
div.update #details .ultimateform .bearing input {width: 15px;}
div.update #details .ultimateform .bearing label {display: inline-block; width: 25px;}
#details .ultimateform .basemap  {display: none;}
div.update #details .ultimateform h3 {border: 0;}



h1#itinerarytitle {margin-right: 4em; margin-bottom: 1em;}
h1#itinerarytitle span, h1#itinerarytitle a {font-size: 0.6em;}
p#itineraryjourneynumber {float: right; text-align: right; color: #a60101; font-size: 1.1em; font-family: Georgia, "Times New Roman", Times, serif;}
div.itinerarydisplay {margin-bottom: 2em; padding-top: 1em;}



body.journeyPlannerPage #cyclestreets-content {min-height: 800px;}
#itineraryDisplaySummaryMapWrapper {float: right; background-color: white; padding-left: 25px; clear: both; margin-bottom: 20px;}
body.cyclestreets-proxy #itineraryDisplaySummaryMapWrapper {clear: right;}
#itineraryDisplaySummaryMapWrapper p a { text-decoration: none; border-bottom: 0;}
#itineraryDisplaySummaryMapWrapper p img { border: 0;}
#itineraryDisplaySummaryMapWrapper, div.itineraryDisplaySummaryMap {width: 460px; height: 460px;}
body.cyclestreets-proxy #itineraryDisplaySummaryMapWrapper, body.cyclestreets-proxy div.itineraryDisplaySummaryMap {width: 370px; height: 370px;}
#itineraryDisplaySummaryMapWrapper p {font-size: 0.6em; margin-bottom: 4px; color: gray;}

/* Fix float issues - problem is that IE doesn't treat the large map panel as being properly floated */
p#crapbrowserfiller {display: none;}	/* Hide by default */
* html p#crapbrowserfiller {display: block; margin-top: 2em; padding: 2em 0.5em; border: 1px solid #ddd;}	/* Unhide for IE6 */
*+html body.journeyPlannerPage #cyclestreets-content #tabbed table {width: 850px;} /* Hack for IE7 layout bug fix */



/* Make whole rows of tables clickable.*/
/* https://developer.mozilla.org/en/Giving_%27cursor%27_a_Hand
 A script adds wholeRowClickable where any of the row cells is linked.
 */
table.hover tr.wholeRowClickable:hover {background-color: #eaf5fd; cursor: pointer; cursor: hand;}


/* Notification bar */
#notificationbar {display: none; position: fixed; top: 0; left: 0; width: 100%; z-index: 105; text-align: center; font-weight: bold; font-size: 100%; color: #666; padding: 10px 0 10px 0; background-color: #f4a83d; border-bottom: #d6800c;}
#notificationbar p {text-align: center; width: 95%; float: left; padding: 0; margin: 0;}
body.cyclestreets #notificationbar p a {color: #444;}
body.cyclestreets #notificationbar a.close-notify {white-space: nowrap; float: right; margin-right: 10px; color: #fff; text-decoration: none; border: 2px #fff solid; padding-left: 3px; padding-right: 3px;}
body.cyclestreets #notificationbar a.close-notify:hover {border-bottom: 2px #fff solid; /* i.e. no change */ background-color: gray;}



/* Edit Network Page */
form select#displayed_paths { width: 30em;}
form select#displayed_paths option { width: 30em;}
form select#displayed_paths optgroup { width: 30em;}


/* Journey Planner */
td.maplet { width: 300px; height: 250px; }

/* Maplet clipping: see http://www.seifi.org/css/creating-thumbnails-using-the-css-clip-property.html */
.clipwrapper {position: relative; width: 192px; height: 192px;}
.clip {position: absolute; clip: rect(32px 224px 224px 32px); top: -32px; left: -32px;}


/* Table Row Form */
.formCompletion { text-align: center;  font-weight: bold; }
.formCompletion span {background: #caff70; padding: 0.2em;}


/* location line */
p.locationline {font-style: italic; font-size: 0.85em; margin: 0;}

p.privileged { float: right; color: #555; background-color: #fbf0f0;  font-size: 0.85em; padding: 0.4em; text-align: right; border: 2px solid #ebe0e0; margin-left: 7px;}

/* Paths with problems page */
p.feedbackMessage {margin-left: 4em; background-color: white; padding: 1em; border: solid 1px #ddd;}

/* Table warning row */
table tr.warning { color: red; }

/* Photomap listings */
dl.browsephotos dt {font-weight: bold; margin: 1.2em 0 0.6em; border-top: 1px solid #ddd; padding-top: 1em; padding-left: 1em;}
dl.browsephotos dd {padding-left: 2em;}

/* Photomap tags */
ul.tagcloud {margin: 0; padding: 0; padding: 15px; border: solid 1px #eee; background: #f7f7f7; text-align: center;}
ul.tagcloud li {padding: 10px 15px; display: inline; line-height: 1.4em;}
ul.tagcloud li a {white-space: nowrap;}
ul.tagcloud li.tagcloud1 {font-size: 75%;}
ul.tagcloud li.tagcloud2 {font-size: 90%;}
ul.tagcloud li.tagcloud3 {font-size: 130%;}
ul.tagcloud li.tagcloud4 {font-size: 150%;}
ul.tagcloud li.tagcloud5 {font-size: 190%;}
ul.tagcloud li span {font-size: 80%;}


/* Browse table */
table.browse th {min-width: 5em; white-space: nowrap;}
table.browse th.id, table.browse td.id, table.browse th.count, table.browse td.count {text-align: right;}
table.browse td.photoname img {border: 1px solid gray;}
body.views table.browse th.datetime {width: 10em;}
table.browseTable th {padding: 0 1em 0 0; min-width: 5em; text-align: left;}
table.browseTable td {padding: 0 1em 0 0;}
table.browseTable th.id, table.browseTable td.id, table.browseTable th.count, table.browseTable td.count, table.browseTable th.distance, table.browseTable td.distance {text-align: right;}
table.browseTable td.id {text-align: right;}

/* Table hover class to add background color on mouse tracking - IE6 doesn't yet support */
table.hover tr:hover {background-color: #eaf5fd;}
table.hover tr.selected:hover {background-color: #cac5cd;}
table.hover tr.headings:hover {background-color: #f0f0f1;}

/* Added by library.js */
tr.headings	{background:#f0f0f1;}
tr.blushed	{background:#f4f4f7;}
tr.selected	{background:#dae5ed;}
tr.blushed.selected	{background:#d6e2eb;}



#cyclestreets-content p.routedetail a, #cyclestreets-content p.routedetail a:hover {border-bottom: 0; color: white; display: block; padding: 10px; border: 1px solid #603; background-color: #B48A9F; padding: 10px; font-size: 1.4em; font-weight: bold;}
p.routedetail:hover {border-color: #333;}


a img {border: 0;}
form#streetSearchStart input, form#streetSearchFinish input {vertical-align:middle; display:inline;}
form#streetSearchStart img.streetSearchImage, form#streetSearchFinish img.streetSearchImage {vertical-align:middle; margin-left: -24px;}

/* Route listings */
ul.tabs img {vertical-align: middle;}



/* Area page */
ul.areas li.add {margin-top: 7px;}
p.otherareas {clear: both; margin-top: 2em; float: right; margin-right: 10em;}
table.splitlist {width: 90%;}
table.splitlist ul li {font-size: 0.93em;}

/* Feedback link */
p.betaFeedbacklink {padding: 10px 0;}
p.betaFeedbacklink a.feedbacklink {border: 1px dashed gray; padding: 10px; background-color: #eee; color: #903;}


/* Feedback anti-spam measure */
form tr.formStamp { display: none; }

/* Generic styles, overriden from generic.css */
.small {font-size: 0.9em;}
#cyclestreets-content ul.tabs {padding-bottom: 0;}
#cyclestreets-content ul.tabs li.selected a {background-color: #FAEDB2; color: #666; border-bottom: 1px solid white;}
*:target div {background-color: white;}

/* General text formatting */
.nowrap {white-space: nowrap;}

/* Override the OpenLayers style to move the attribution text to the bottom of the map. ('body' is used to increase specificity)*/
body .olControlAttribution { bottom: 0;}
/* The mouse position control is required to avoid a script error in IE6&7. See cyclestreets.js createMap(). We hide it here. */
body div.olControlMousePosition { display: none;}

/* Control panel */
div.controlpanel table {table-layout: fixed; width: 900px;}
div.controlpanel table td.title {width: 300px;}
div.controlpanel table td.data {width: 450px;}
div.controlpanel table tr.mapkey td.data {overflow: scroll;}

/* Features/getinvolved pages */
body.features div.ideabox {width: 45%; margin: 0 20px 20px 0;}
body.basicPages div.ideabox {width: 95%; margin-bottom: 13px;}
div.ideabox {height: 120px; float: left; background-color: #f9f9f9; border: 1px solid #e7e7e7; border-right-width: 2px; border-bottom-width: 2px; border-right-color: #ddd; border-bottom-color: #ddd; padding: 10px;}
div.ideabox:hover {background-color: #f4f4f4;}
div.ideabox img {float: left; width: 200px; height: 100px; border: 1px solid #bbb;}
div.ideabox h2 {margin: 0 0 10px 220px; font-size: 1.35em; padding: 0;}
div.ideabox p {margin: 12px 0 0 220px; color: gray;}

/* Commenting system */
.usercomments p.addreply {}
.usercomments div.usercomment {border-top: 1px solid #eee; border-bottom: 1px solid #eee; padding: 5px; margin: 0 0 1em;}
.usercomments div.usercomment p.colophon {padding-top: 0; margin-top: 0;}
.usercomments div.usercomment p.addreply {text-align: right; font-size: 0.74em; margin-bottom: 0; padding-bottom: 0;}
.usercomments div.usercomment p.author {background-color: #ffffce;}
.usercomments div.usercomment.depth1 {margin-left: 0;}
.usercomments div.usercomment.depth2 {margin-left: 1.5em;}
.usercomments div.usercomment.depth3 {margin-left: 3em;}
.usercomments div.usercomment.depth4 {margin-left: 4.5em;}
.usercomments div.usercomment.depth5 {margin-left: 6em;}

/* Street View */
#streetViewContainer {clear: both; width: 100%;}
#cyclestreets-content table.journeylisting a.streetview {color: #aaa; font-size: 11px; cursor: pointer;}
table.journeylisting a.streetview span {line-height: 13px;}


/* Handheld styles - needs much more development */
/* See www.bushidodesigns.net/blog/mobile-device-detection-css-without-user-agent/ and www.thecssninja.com/css/iphone-orientation-css */
@media screen and (max-device-width: 480px)
{
	#cyclestreets-container {width: auto; padding: 0;}
	body, textarea, option, select {font-size: 100%;}
	
	.home ul.cyclestreets-subtabs, .home #cyclestreets-about ul, .home div.jumplist, .home #photomap, .home #blog {display: none;}
	.home #cyclestreets-about {float: none; width: auto;}
	.home #cyclestreets-about h2 {font-size: 3em;}
	.home #cyclestreets-about h2 span {font-size: 0.6em;}
	.home #cyclestreets-about br {display: none;}
	
	.home #journeyplanner {background-color: white; border: 0; padding: 0 25px;}
	.home #journeyplanner h2 {background-color: white;}

	
	.home #journeyplanner.narrow, .home #journeyplanner.expanded {float: none; width: auto;}
	body.cyclestreets-proxy #journeyplanner.narrow, body.cyclestreets-proxy #journeyplanner.expanded {width: auto;}
}


/* Print styles */
@media print {
	
	/* Hide unwanted parts */
	ul.signin, ul.cyclestreets-tabs, #searchbar, h4#tabsheading, ul.cyclestreets-subtabs, h1#itinerarytitle a, #itinerary-tabs, div.olControlPermalink, div.olControlAttribution, img#OpenLayers_Control_MaximizeDiv_innerImage, img#OpenLayers_Control_MinimizeDiv_innerImage, div.olControlPZ, p.betaFeedbacklink, p.googleearthflyover, p.gpxexport, #feedbackpane, #cyclestreets-footer, p#utilities span.viewfullsize, #photonumber img, ul#providerlinks, #photomapheadercolophon, ul.photomaptabs, .noprint {display: none;}
	
	/* JP-specific */
	div.itinerarydisplay h2 span {display: block;}
	table.journeylisting th {background-color: gray; color: black;}
	
	/* PER */
	table.journeylisting img.photothumbnail {display: none;}
}




/*
* Feedback system styles
* jQuery UI CSS Framework
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
*/

/* Layout helpers */
.ui-helper-clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.ui-helper-clearfix {display: inline-block;}
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix {height:1%;}
.ui-helper-clearfix {display:block;}
/* end clearfix */

/* Dialog */
.ui-dialog {position: relative; padding: .2em; width: 300px;}
.ui-dialog .ui-dialog-titlebar {padding: .5em .3em .3em 1em; position: relative; }
.ui-dialog .ui-dialog-title {float: left; margin: .1em 0 .2em;} 
.ui-dialog .ui-dialog-titlebar-close {position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px;}
.ui-dialog .ui-dialog-titlebar-close span {display: block; margin: 1px;}
.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus {padding: 0;}
.ui-dialog .ui-dialog-content {border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1;}
.ui-dialog .ui-resizable-se {width: 14px; height: 14px; right: 3px; bottom: 3px;}
.ui-draggable .ui-dialog-titlebar {cursor: move;}
.ui-resizable {position: relative;}
.ui-resizable-handle {position: absolute;font-size: 0.1px;z-index: 99999; display: block;}
.ui-resizable-n {cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0;}
.ui-resizable-s {cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0;}
.ui-resizable-e {cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%;}
.ui-resizable-w {cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%;}
.ui-resizable-se {cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px;}
.ui-resizable-sw {cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px;}
.ui-resizable-nw {cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px;}
.ui-resizable-ne {cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}

/* Component containers */
.ui-widget-content {border: 1px solid #aaa; background: #fff url(images/jquery/ui-bg_glass_75_ffffff_1x400.png) 0 0 repeat-x; color: #222;}
.ui-widget-header {border: 1px solid #aaa; background: #ccc url(images/jquery/ui-bg_highlight-soft_75_cccccc_1x100.png) 0 50% repeat-x; color: #222; font-weight: bold;}

/* Interaction states */
.ui-state-default, .ui-widget-content .ui-state-default {border: 1px solid #d3d3d3; background: #e6e6e6 url(images/jquery/ui-bg_glass_75_e6e6e6_1x400.png) 0 50% repeat-x; font-weight: normal; color: #555555; outline: none;}
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {color: #555555; text-decoration: none; outline: none;}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus {border: 1px solid #999999; background: #dadada url(images/jquery/ui-bg_glass_75_dadada_1x400.png) 0 50% repeat-x; font-weight: normal; color: #212121; outline: none;}
.ui-state-hover a, .ui-state-hover a:hover {color: #212121; text-decoration: none; outline: none;}
.ui-state-active, .ui-widget-content .ui-state-active {border: 1px solid #aaa; background: #fff url(images/jquery/ui-bg_glass_65_ffffff_1x400.png) 0 50% repeat-x; font-weight: normal; color: #212121; outline: none;}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {color: #212121; outline: none; text-decoration: none;}

/* states and images */
.ui-icon {display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; width: 16px; height: 16px; background-image: url(images/jquery/ui-icons_222222_256x240.png);}
.ui-widget-content .ui-icon, .ui-widget-header .ui-icon {background-image: url(images/jquery/ui-icons_222222_256x240.png);}
.ui-state-default .ui-icon {background-image: url(images/jquery/ui-icons_888888_256x240.png);}
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon, .ui-state-active .ui-icon {background-image: url(images/jquery/ui-icons_454545_256x240.png);}

/* positioning */
.ui-icon-closethick {background-position: -96px -128px;}
.ui-icon-gripsmall-diagonal-se {background-position: -64px -224px;}

/* Corner radius */
.ui-corner-all {-moz-border-radius: 4px; -webkit-border-radius: 4px;}

/* Overlays */
.ui-widget-overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #aaa none 0 0 repeat-x; opacity: .3;filter:Alpha(Opacity=30);}
.ui-widget-shadow {margin: -4px 0 0 -4px; padding: 4px; background: #aaa none 0 0 repeat-x; opacity: .35;filter:Alpha(Opacity=35); -moz-border-radius: 4px; -webkit-border-radius: 4px;}

/* API section */
body.api form {width: 600px;}