/* new styles for LAQN - Summer of 2006 - sam.hope-evans@erg.kcl.ac.uk */
/* coded for XHTML transitional 1.0 and WAI AA */
/* all elements are position:static by default - flow in document order cannot be offset with top & left properties  */
/* position: relative elements flow in document order but can also be offset with top & left properties */
/* position: absolute elements are removed from the document flow and stay in place on screen resize */

/* HTML tags */
/* reset html margins, paddings and border to 0 for browser consistency*/
/* font size to 1em/100% of user's current browser preferences  - make sure browser DOCTYPE is triggered into Standards Mode for IE 6 or font cascade won't work*/
/* coloured scroll bars are IE only and not valid CSS 2.0 */

body, html { /*width: 100%; height: 100%;*/ font-size: 100%; margin: 0px; padding: 0px; border: 0px; background-color: #fff; color:#000000; font-weight: normal; font-family: arial, verdana, helvetica, sans-serif; }
/*scrollbar-face-color:#FFFFFF; scrollbar-highlight-color:#98AFC7; scrollbar-shadow-color:#000000; scrollbar-3dlight-color:#CCCCCC; scrollbar-arrow-color:#000000; scrollbar-track-color: #D3D3D3; scrollbar-darkshadow-color:#000000;}*/

/*links formatting*/

a { color: #A30327; text-decoration: none; }
a:link { color: #A30327; text-decoration: none;}
a:visited { color: #A30327; text-decoration: none;}
a:hover { color: #377fbd; text-decoration: underline;}
a:focus { text-decoration: underline !important;}
a.rss { vertical-align: middle !important; margin: 0; padding: 0;}

h3 { color: #A30327; font-size: 1.0em; }

hr { clear: both; color: #dadada; background-color: #dadada; height: 1px; border: 0;}


/* containers */

div#header { width: 100%; margin: 0; padding: 0; height: 20px; border-top: 10px solid #fff; border-bottom: 1px solid #fff; background-color: #A30327; }

/* top right menus */
span#topmenu { display: inline; float: right; margin: 0 5px 0 0; padding: 0; color: #fff; font-weight: bold; font-size: 0.70em; text-align: right; }
span#topmenu a { vertical-align: top !important; margin: 0; padding: 0; color: #fff; font-weight: bold; text-decoration: none;}
span#topmenu a:hover { text-decoration: underline;}
span#topmenu img { border: 0; margin: 2px 5px 5px 5px; padding: 0; }

div#topbanner { z-index: 2; width:100%; height: 115px; margin: 0; padding: 0; border: 0; background-image: url(/london/images/laqnbanner.jpg); background-color: #DDAAAA;
background-position: 0% 0%; background-repeat: no-repeat; background-attachment: scroll; }
div#topbanner img.banner { margin: 0; padding: 0; float:left; border: 0; }
div#topbanner img { margin: 6px 2px 0 0; padding: 0; float:right; border: 1px solid #fff; }
div#topbanner img.lastphoto { margin: 6px 6px 0 0; padding: 0; float:right; border: 1px solid #fff; }

/* KCL link */

div#kcl { position:absolute; z-index: 0 !important; margin: 0 0 0 2px; padding: 0; border: 0; width: 120px; height: 110px; float: left; cursor: pointer; }

/* random images */
div#randomize { z-index: 4; margin: 0; padding: 0;}

/* silver menu bar */

div#menubar { overflow: hidden; width: 100%; margin: 0; background-image: url(/london/images/bg_menubar_bar.gif); font-size: 0.75em;
font-weight: bold; border-bottom: #dadada 1px solid; background-repeat: repeat-x; background-color: #fff;}
div#menubar ul { display: inline; margin: 0; padding: 0;}
div#menubar ul li{ border-right: #cacaca 1px solid; padding: 5px 8px 5px 8px; display: block; float: left; list-style-type: none; }
div#menubar a:link { color: #A30327; text-decoration: none; }
div#menubar a:active { color: #A30327; text-decoration: none; }
div#menubar a:visited { color: #A30327; text-decoration: none; }
div#menubar a:hover { color: #377FBD; text-decoration: none; }
div#menubar a:focus { color: #377FBD; text-decoration: underline !important;}

/* sets silver menu bar underline to blue when user is on that page */
body#homepage div#menubar ul li.home a { color: #377FBD !important;}
body#bulletinpage div#menubar ul li.bulletin a { color: #377FBD !important;}
body#monitoringpage div#menubar ul li.monitoring a { color: #377FBD !important;}
body#statspage div#menubar ul li.stats a { color: #377FBD !important;}
body#episodespage div#menubar ul li.episodes a { color: #377FBD !important;}
body#authoritiespage div#menubar ul li.authorities a { color: #377FBD !important;}
body#guidepage div#menubar ul li.guide a { color: #377FBD !important;}
body#statstoolspage div#menubar ul li.statstools a { color: #377FBD !important;}
body#graphtoolspage div#menubar ul li.graphtools a { color: #377FBD !important;}
body#reportspage div#menubar ul li.reports a { color: #377FBD !important;}
body#downloadspage div#menubar ul li.downloads a { color: #377FBD !important;}
body#newspage div#menubar ul li.news a { color: #377FBD !important;}
body#rsspage div#menubar ul li.rss a { color: #377FBD !important;}


/* flash pop up help */
body#flashhelp { background-color: #ffffff; margin: 0; padding: 0; }

/* breadcrumbs to see where user is in site */

div#crumbTrail { font-size:0.70em; height: 15px; background-image:url(/london/images/bg_menubar_shadow.gif); background-position: 0% 0%; background-repeat: repeat-x; color:#A30327; border:0; padding:4px 0 2px 10px; margin:0;}
div#crumbTrail ul { list-style:none; padding:0; margin:0;}
div#crumbTrail li { display:inline; padding:0; margin:0;}
div#crumbTrail a { text-decoration:none; color:#A30327;}
div#crumbTrail a:link { text-decoration:none;}
div#crumbTrail a:hover { text-decoration:underline; color:#336699;}
div#crumbTrail img { border: 0; margin: 5 0 0 0; clear: left;}

/* holds the left hand content */

div#leftContainer { float: left; width: 18%; height: 100%; font-size: 0.70em; background-color: #EBEBEB; padding: 5px; margin: 10px 0 20px 5px; text-align: left; border: 1px solid #A30327; }
div#leftContainer p { padding: 5px; }
div#leftContainer p.title { padding: 5px; text-align: center;}
div#leftContainer a { padding: 5px; }
div#leftContainer a.question { vertical-align: middle; padding: 0; margin: 0;}
div#leftContainer img { border: 0px; }
div#leftContainer img.question { border: 0; margin:  0; padding: 0; }
div#leftContainer form { /*height: 100%;*/ border: 0; margin: 0; padding: 0; }
div#leftContainer input#postcode { color: #A30327; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 0; }
div#leftContainer input#submit { width: 120px; cursor: pointer; border: 1px solid #A30327; margin: 15px 0 0 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#leftContainer select#borough { width: 175px; color: #A30327; border: 1px solid #A30327; margin: 15px 0 10px 0; padding: 0; }
div#leftContainer select#bulletin { width: 90px; color: #A30327; border: 1px solid #A30327; margin: 10px 0 0 5px; padding: 0; }
div#leftContainer span.contentbanner { font-size: 1.2em; font-weight: bold; height: 20px; width: 165px; display: block; 
color: #ffffff !important; padding: 5px; background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); background-repeat: no-repeat; background-position: top right; }
div#leftContainer img { margin: 0; padding: 0; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327; }
div#leftContainer img#latestnews { margin: 0 0 20px 0; padding: 0; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327; }
div#leftContainer object#flash-fade { margin: 0 0 20px 0; padding: 0; border: 0; }

div#leftContainer img.open-air { margin: 5px 0 0 0; border: 1px solid #A30327; }


/* container holding main content and right hand blocks */

div#mainContainer { font-size: 0.8em; float:left; width:75%; clear: right; margin: 10px 0 10px 0; padding: 0 0 5px 10px; color:#000000; /*background-color:#FFFFFF;*/ }

/* only used on home page and info pages, mainContent must be set as a relative element so the map dots are positioned from its top XY - stops map shifting underneath dot on screen resize */
div#mainContent { position: relative; float: left; width: 66%; min-height: 550px; height: 100%; color: #000000; margin: 0; padding: 5px; border: 1px solid #A30327; background-color: #EBEBEB; }
/* stop subscript and superscript breaking lines */
div#mainContent sub { position: relative; font-size: 0.8em; vertical-align: baseline;  bottom: 0.00em; }
div#mainContent sup { position: relative; font-size: 0.8em; vertical-align: baseline; bottom: 0.25em; }

div#mainContent p { padding: 0 5px 0 5px; }
div#mainContent p#timestamp { clear: left; margin: 10px 0 0 0; padding: 5px 5px 0 5px; font-style: italic; }
div#mainContent img { border: 0; }
div#mainContent img.help { border: 1px solid #A30327; margin: 10px 0 0 5px;}
div#mainContent img.kclred { border: 1px solid #A30327; margin: 0 0 0 10px;}
div#mainContent img#homepagemap { border: 1px solid #A30327; margin: 10px 0 0 0; }
div#mainContent img#bulletinmap { border: 1px solid #A30327; margin: 0; }
div#mainContent img#information { border: 1px solid #A30327; margin: 0 0 0 5px; padding: 0; }
div#mainContent img#newsimage { border: 1px solid #A30327; margin: 10px 10px 10px 0; padding: 0; float: left;}
div#mainContent img#browsers { border: 1px solid #A30327; margin: 5px; padding: 0; float: left;}
div#mainContent img#lynx { border: 0; margin: 0 5px 0 0; padding: 0; float: left;}
div#mainContent img#xhtml { border: 0; margin: 0 5px 0 0; padding: 0; float: left;}
div#mainContent img#css { border: 0; margin: 0 5px 0 5px; padding: 0; float: right;}
div#mainContent img#wai { border: 0; margin: 0 5px 0 0; padding: 0; float: left;}
div#mainContent img#windows { border: 0; margin: 0 5px 0 0; padding: 0; float: left;}
div#mainContent img#mac { border: 0; margin: 0 5px 0 0; padding: 0; float: left;}
div#mainContent img#rss { border: 0; margin:5px; padding: 0; float: left; clear: both;}
div#mainContent img.rss { border: 0; margin:5px !important; padding: 0; float: left; clear: both;}
div#mainContent img.float-left { border: 0; margin: 0 5px 0 0; padding: 0; float: left; }
div#mainContent img.float-left-border { border: 1px solid #A30327 !important; margin: 0 5px 0 0; padding: 0; float: left; }
div#mainContent img.float-right { border: 0; margin: 0 0 0 5px; padding: 0; float: right;}
div#mainContent img.float-right-border { border: 1px solid #A30327 !important; margin: 0 0 0 5px; padding: 0; float: right;}
div#mainContent img.border { border: 1px solid #A30327; margin: 10px;}



/* FLASH CONTENT */
/* need to use DIV to add border around object tag in Firefox */
div#mainContent div#flash-border { border: 1px solid #A30327; width: 480px; height: 315px; margin: 20px 0 20px 0; }
div#mainContent div#flash-border object.flash-video { margin: 0;  border: 0;}
div#mainContent div#flash-border img.alternate-video { margin: 0;  border: 0;}



div#mainContent span.contentbanner { font-size: 1.2em; font-weight: bold; /*height: 20px;*/ display: block; color: #ffffff !important;  margin:0; padding: 5px;  background-color: #A30327 !important; 
background-image: url(/london/images/curve-top.gif); background-repeat: no-repeat; background-position: top right;}
/* this banner is for the virtual map page only */
div#mainContent span.contentbannerwhite { font-size: 1.2em; font-weight: bold; height: 20px; display: block; color: #ffffff !important;  margin:0; padding: 5px;  background-color: #A30327 !important; 
background-image: url(/london/images/curve-top-white.gif); background-repeat: no-repeat; background-position: top right;}
div#mainContent table#access { clear: both; margin: 20px 0 0 10px; border: 0; border-collapse: collapse; border-spacing: 0; }
div#mainContent table#access th { border :0; padding: 5px;}
div#mainContent table#access td { border-top: 1px solid #A30327; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327; padding: 5px;}
div#mainContent table#access td.bottomborder { border-bottom: 1px solid #A30327; padding: 3px; border-spacing: 0; }
div#mainContent table#access td.notopborders { border-top: 0px;}
div#mainContent table#access td.norightborders { border-right: 0px;}
div#mainContent table#access td.notoprightborders { border-top: 0px; border-right: 0px;}
div#mainContent ul#mainList li { margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif); }
div#mainContent input.submit { width: 40px; cursor: pointer; border: 1px solid #A30327; margin: 0 0 0 5px; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent input#submit { width: 40px; cursor: pointer; border: 1px solid #A30327; margin: 0 0 0 5px; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent select#localborough {width: 190px; border: 1px solid #A30327; margin: 0; padding: 0; }
div#mainContent ul {margin: 10px 0 10px 10px; padding: 0 0 0 15px;}
div#mainContent ul li { clear: both; margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif) !important; }
div#mainContent ul#keypoints li { margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif); }
div#mainContent ul.kclstyle li { clear: both; margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif) !important; }
/* rss page */
div#mainContent ul.rss li { vertical-align: middle; clear: both; margin: 0; padding: 5px 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif) !important; }
div#mainContent ul.rss li select.rss { border: 1px solid #A30327; margin: 0 0 0 5px; padding: 0;  }


div#mainContent form { margin: 10px 0 10px 5px; padding: 0;}
/* vertical align to get in line with text - inline elements only */
div#mainContent form input.radio { display: inline; margin: 0 5px 0 10px; padding: 0; vertical-align: middle; }

/*tables for information section */

div#mainContent table#healthbands { font-size: 1em; width: 95%; margin: 10px; padding: 0; text-align: center; vertical-align: middle; border: 0; border-collapse: collapse; border-spacing: 0; }
div#mainContent table#healthbands td.band { width: 30%; height: 25px; padding: 3px; color: #fff; background-color: #A30327 !important; }
div#mainContent table#healthbands td.impact { border-right: 0; width: 70%; padding: 3px; color: #fff; background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); background-repeat: no-repeat; background-position: top right; }
div#mainContent table#healthbands td { padding: 3px; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327;}

div#mainContent table#healthadvice { font-size: 1em; width: 95%; margin: 10px; padding: 0; text-align: center; vertical-align: middle; border: 0; border-collapse: collapse; border-spacing: 0; }
div#mainContent table#healthadvice td { padding: 3px; text-align: left; vertical-align: middle; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327; border-collapse: collapse; border-spacing: 0; }
div#mainContent table#healthadvice td#advicetitle { text-align: center; height: 25px; border-right: 0; padding: 3px; color: #fff; background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); background-repeat: no-repeat; background-position: top right;  }
div#mainContent table#healthadvice span { display: block; text-align: left; margin: 0 0 10px 0;}

div#mainContent table#healthbands { font-size: 1em; width: 95%; margin: 10px; padding: 0; text-align: center; vertical-align: middle; border: 0; border-collapse: collapse; border-spacing: 0; }
div#mainContent table#healthbands td { padding: 3px; text-align: left; vertical-align: middle; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327; border-collapse: collapse; border-spacing: 0; }
div#mainContent table#healthbands tr#healthbandstitle { text-align: center; height: 25px; border-right: 0; padding: 3px; color: #fff; background-color: #A30327 !important; }
div#mainContent table#healthbands td#corner { width: 12%; text-align: center; height: 25px; border-right: 0; padding: 3px; color: #fff; background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); background-repeat: no-repeat; background-position: top right; }

/*tables for 7 and 30 day graph pages on bulletins */

div#mainContent table#graphimage { background-color: #EBEBEB; width: 100%; margin: 0; padding: 0; border: 1px solid #A30327; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#graphimage td { padding: 0; }
div#mainContent table#graphimage td.top { vertical-align: top; padding: 0; }
div#mainContent table#graphimage img { border: 0;}
div#mainContent table#graphimage img#graph { border: 1px solid #A30327; margin: 10px;}
div#mainContent table#graphimage img.graph { border: 1px solid #A30327; margin: 10px;}
div#mainContent table#graphimage a.switchgraph { display: inline; color: #000000; text-decoration: none; text-align: center; width: 150px; height: 15px; cursor: pointer; border: 1px solid #A30327; margin: 10px 10px 20px 10px; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }

div#mainContent table#graphimagesub { /*width: 320px;*/ margin: 10px 0 0 0; padding: 0; border: 0; border-spacing: 0; border-collapse: collapse; background-color: #EBEBEB; }
div#mainContent table#graphimagesub td { padding: 3px; }
div#mainContent table#graphimagesub td.button { padding-left: 15px; }
div#mainContent table#graphimagesub th { padding-bottom: 20px; text-align: left; font-weight: bold; font-size: 1.3em; }
div#mainContent table#graphimagesub a.showbutton { display: block; color: #000000; text-decoration: none; text-align: center; width: 15px; height: 15px; cursor: pointer; border: 1px dashed #A30327; margin: 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#graphimagesub a.showbuttonselected { display: block; color: #000000; text-decoration: none; text-align: center; width: 15px; height: 15px; cursor: pointer; border: 1px solid #A30327; margin-right: 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#graphimagesub a.switchgraph { display: block; color: #000000; text-decoration: none; text-align: center; width: 150px; height: 15px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#graphimagesub input#aq { width: 40px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#graphimagesub select#airquality { color: #A30327; border: 1px solid #A30327; margin: 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }

/* tables for basic stats page */

div#mainContent table#basictats { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#basicstats td { padding: 3px; }
div#mainContent table#basicstats td.padding-top { padding-top: 20px; }
div#mainContent table#basicstats td.species { width: 10%; padding: 3px; }
div#mainContent table#basicstats td.objective { width: 20%; padding: 3px; }
div#mainContent table#basicstats span.warning { width: 600px; display: block; font-style: italic; background-color: #ffffff; color: #A30327; padding: 3px; border: 1px solid #A30327;}
div#mainContent table#basicstats span.species { display: inline; margin: 0; padding: 0; }
div#mainContent table#basicstats span.value { display: inline; margin: 0 0 0 150px; padding: 0; }

div#mainContent form#basicstatsform { margin:0; padding: 0; }
div#mainContent table#basicstatsform { width: 70%; padding: 0; margin: 0 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#basicstatsform td { padding: 3px; }
div#mainContent table#basicstatsform td.year { width: 40%; padding: 20px 3px 3px 3px; }
div#mainContent table#basicstatsform td.padding-top { padding-top: 20px; }
div#mainContent table#basicstatsform select { border: 1px solid #A30327; color: #A30327; }
div#mainContent table#basicstatsform input.radio { margin: 0 0 0 10px; padding: 0; }
div#mainContent table#basicstatsform input#submit { margin: 0; padding: 0; width: 50px;}


/* tables for statistical tools pages */

div#mainContent table#advstats { /*width: 100%;*/ height: 300px; padding: 0; margin: 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#advstats td { padding: 3px; }
div#mainContent table#advstats select { border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advstats input#checkbox { border: 1px solid #A30327; }

div#mainContent table#advstatsvarious { background-color: #ffffff; width: 70%; padding: 0; margin: 0; border: 1px solid #A30327; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#advstatsvarious td { padding: 3px; }
div#mainContent table#advstatsvarious th { border-bottom: 1px solid #A30327; text-align: left;  padding: 3px; font-weight: bold;}
div#mainContent table#advstatsvarious span.warning { display: block; font-style: italic; background-color: #ebebeb; color: #A30327; padding: 3px; border: 1px solid #A30327;}
div#mainContent table#advstatsvarious select { border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advstatsvarious input { border: 1px solid #A30327; color: #A30327; }

div#mainContent table#advstatsvariousresults {  background-color: #ffffff; width: 70%; padding: 0; margin: 0; border: 1px solid #A30327; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#advstatsvariousresults td { padding: 3px; }
div#mainContent table#advstatsvariousresults th { border-bottom: 1px solid #A30327; text-align: left;  padding: 3px; font-weight: bold;}
div#mainContent table#advstatsvariousresults span.warning { width: 600px; display: block; font-style: italic; background-color: #ebebeb; color: #A30327; padding: 3px; border: 1px solid #A30327;}

div#mainContent table#advstatsindex { background-color: #ffffff; width: 70%; padding: 0; margin: 0; border: 1px solid #A30327; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#advstatsindex td { padding: 3px; }
div#mainContent table#advstatsindex th { border-bottom: 1px solid #A30327; text-align: left; padding: 3px; font-weight: bold;}
div#mainContent table#advstatsindex span.warning { width: 600px; display: block; font-style: italic; background-color: #ebebeb; color: #A30327; padding: 3px; border: 1px solid #A30327;}

div#mainContent table#advstatssustain{ background-color: #ffffff; width: 70%; padding: 0; margin: 0; border: 1px solid #A30327; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#advstatssustain td { padding: 3px; }
div#mainContent table#advstatssustain th { border-bottom: 1px solid #A30327; text-align: center; padding: 3px; font-weight: bold;}
div#mainContent table#advstatssustain span.warning { width: 600px; display: block; font-style: italic; background-color: #ebebeb; color: #A30327; padding: 3px; border: 1px solid #A30327;}

/* tables for graph tools page */

div#mainContent table#graphtools { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#graphtools td { padding: 3px; }
div#mainContent table#graphtools td.padding-top { padding-top: 20px; }
div#mainContent table#graphtools td.checkbox { padding: 3px; text-align: center; vertical-align: top; font-size: 0.8em;}
div#mainContent table#graphtools select#site1 { margin: 0 0 0 100px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#graphtools select#site2 { margin: 0 0 0 53px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#graphtools select#site3 { margin: 0 0 0 100px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#graphtools select#site4 { margin: 0 0 0 53px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#graphtools select.timeperiod { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#graphtools select#avperiod { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#graphtools select#windsite { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#graphtools input.button { width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#graphtools input.checkbox { border: 1px solid #A30327; margin: 10px 0 10px 0; padding: 0; }
div#mainContent table#graphtools input.plotbutton { width: 120px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#graphtools span.warning { width: 600px; display: block; font-style: italic; background-color: #ffffff; color: #A30327; padding: 3px; border: 1px solid #A30327;}
div#mainContent table#graphtools img.graph { border: 1px solid #A30327; }

div#mainContent table#graphtoolssub { width: 600px; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#graphtoolssub td { padding: 3px; }
div#mainContent table#graphtoolssub img { border: 0; }
div#mainContent table#graphtoolssub img#roseplot { border: 1px solid #A30327; }
div#mainContent table#graphtoolssub td#key { background-color: #ffffff !important; border: 1px solid #A30327 !important;}

/* table class also needed for xhtml validation - 2 forms on one page */

div#mainContent table.graphtools { width: 70%; padding: 0; margin: 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table.graphtools td { padding: 3px; }
div#mainContent table.graphtools td.site { padding: 3px; width: 80%; vertical-align: bottom !important;}
div#mainContent table.graphtools td.padding-top { padding-top: 20px; }
div#mainContent table.graphtools td.checkbox { padding: 3px; text-align: center; vertical-align: top; font-size: 0.8em;}
div#mainContent table.graphtools select#site1 { float: right; margin-bottom: 15px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.graphtools select#site2 { float: right; margin-bottom: 15px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.graphtools select#site3 { float: right; margin-bottom: 15px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.graphtools select#site4 { float: right; margin-bottom: 15px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.graphtools select.timeperiod { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.graphtools select#avperiod { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.graphtools select#windsite { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.graphtools input.button { width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table.graphtools input.checkbox { border: 1px solid #A30327; margin: 10px 0 10px 0; padding: 0; }
div#mainContent table.graphtools input.plotbutton { width: 120px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table.graphtools span.warning { width: 600px; display: block; font-style: italic; background-color: #ffffff; color: #A30327; padding: 3px; border: 1px solid #A30327;}
div#mainContent table.graphtools img.graph { border: 1px solid #A30327; }

/* advanced graph and rose plot tools page */

div#mainContent table#advgraphtools { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#advgraphtools td { padding: 3px; }
div#mainContent table#advgraphtools td.padding-top { padding-top: 20px; }
div#mainContent table#advgraphtools select#site1 { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select#site2 { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select#site3 { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select#site4 { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select#site5 { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select#site6 { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select.timeperiod { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select#avperiod { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools select#windsite { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#advgraphtools input.button { width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#advgraphtools input.checkbox { border: 1px solid #A30327; margin: 10px 0 10px 0; padding: 0;  }
div#mainContent table#advgraphtools input.plotbutton { width: 120px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table#advgraphtools span.warning { width: 600px; display: block; font-style: italic; background-color: #ffffff; color: #A30327; padding: 3px; border: 1px solid #A30327;}
div#mainContent table#advgraphtools img.graph { border: 1px solid #A30327; }


div#mainContent table#advgraphtoolssub { width: 600px; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#advgraphtoolssub td { padding: 3px; }
div#mainContent table#advgraphtoolssub img { border: 0; }
div#mainContent table#advgraphtoolssub img#roseplot { border: 1px solid #A30327; }

/* reports page */

div#mainContent table#reports { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#reports td { padding: 3px; }
div#mainContent table#reports img { border: 0; }
div#mainContent table#reports img.reports { margin: 0 10px 10px 10px; border: 1px solid #A30327; }
div#mainContent table#reports select#reporttype { color: #A30327; margin: 0 0 0 10px; border: 1px solid #A30327; }
div#mainContent table#reports input#reportbutton { width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 5px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}

div#mainContent table#reportdetails { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 1px solid #A30327; border-spacing: 0; border-collapse: collapse; background-color: #ffffff;}
div#mainContent table#reportdetails td { padding: 5px; }
div#mainContent table#reportdetails img { border: 0; }
div#mainContent table#reportdetails img.reports { margin: 10px; border: 1px solid #A30327; }
div#mainContent table#reportdetails select#reports { color: #A30327; margin: 0 0 0 10px; border: 1px solid #A30327; }
div#mainContent table#reportdetails input#reportbutton { width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 5px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}

/* data downloads */

div#mainContent table#downloads { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#downloads td { padding: 3px; }
div#mainContent table#downloads td.padding-top { padding-top: 20px; }
div#mainContent table#downloads td.checkbox { padding: 3px; text-align: center; vertical-align: top; font-size: 0.8em; }
div#mainContent table#downloads td#key { width: 80% !important; background-color: #ffffff !important; border: 1px solid #A30327 !important;}
div#mainContent table#downloads td#key span { margin: 0 0 0 10px;}
div#mainContent table#downloads img { border: 0; }
div#mainContent table#downloads img#gla { border: 1px solid #A30327; margin: 0; }
div#mainContent table#downloads img#graph { border: 1px solid #A30327; margin: 0 0 10px 0 }
div#mainContent table#downloads select.download { color: #A30327; margin: 0 0 0 10px; border: 1px solid #A30327; }
div#mainContent table#downloads input.submit { width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table#downloads input.submit2 { width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table#downloads a.links { display: block; color: #000000; text-decoration: none; text-align: center; width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table#downloads select.timeperiod1 { margin: 10px 0 0 120px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table#downloads select.timeperiod { margin: 10px 0 0 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
/*div#mainContent table#downloads select#avperiod { margin: 0 0 0 90px; padding: 0; border: 1px solid #A30327; color: #A30327; }*/
div#mainContent table#downloads input.checkbox { border: 1px solid #A30327; margin: 10px 0 10px 0; padding: 0; }
div#mainContent table#downloads span.warning { width: 600px; display: block; font-style: italic; background-color: #ffffff; color: #A30327; padding: 3px; border: 1px solid #A30327;}
div#mainContent table#downloads a#species { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table#downloads a#help { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0 0 0 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table#downloads a#csv { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table#downloads a#xml { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0 0 0 10px; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}

div#mainContent table#downloadssub { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#downloadssub td { padding: 3px; }

div#mainContent table.downloads { width: 70%; padding: 0; margin: 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table.downloads td { padding: 3px; }
div#mainContent table.downloads td.padding-top { padding-top: 20px; }
div#mainContent table.downloads td.checkbox { padding: 3px; text-align: center; vertical-align: top; font-size: 0.8em; }
div#mainContent table.downloads td#key { width: 80% !important; background-color: #ffffff !important; border: 1px solid #A30327 !important;}
div#mainContent table.downloads td#key span { margin: 0 0 0 10px;}
div#mainContent table.downloads img { border: 0; }
div#mainContent table.downloads img#gla { border: 1px solid #A30327; }
div#mainContent table.downloads img#graph { border: 1px solid #A30327; margin: 0 0 10px 0 }
div#mainContent table.downloads select.download { color: #A30327; margin: 0 0 0 10px; border: 1px solid #A30327; }
div#mainContent table.downloads input.submit { width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table.downloads input.submit2 { width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table.downloads a.links { display: block; color: #000000; text-decoration: none; text-align: center; width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table.downloads select.timeperiod1 { margin: 10px 0 0 120px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.downloads select.timeperiod { margin: 10px 0 0 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.downloads select#avperiod { margin: 0 0 0 90px; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent table.downloads input.checkbox { border: 1px solid #A30327; margin: 10px 0 10px 0; padding: 0; }
div#mainContent table.downloads span.warning { width: 600px; display: block; font-style: italic; background-color: #ffffff; color: #A30327; padding: 3px; border: 1px solid #A30327;}
div#mainContent table.downloads a#species { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table.downloads a#help { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0 0 0 10px; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table.downloads a#csv { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent table.downloads a#xml { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #A30327; margin: 0 0 0 10px; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}

/* tables for help */

div#mainContent table.help { width: 70%; padding: 0; margin: 20px 0 20px 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table.help td { padding: 3px; }
div#mainContent table.help td.bold { font-weight: bold;  }


/* table for webform - contact page */

div#mainContent table#webformtable { width: 90%; padding: 0; margin: 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#mainContent table#webformtable td { padding: 3px; }
div#mainContent table#webformtable em#form { font-size: 0.8em; }
div#mainContent form#webform { margin: 0; padding: 0; border: 0; }
div#mainContent form#webform input.textbox { margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent form#webform input.submit { width: 120px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 20px 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#mainContent form#webform select#country { width: 255px; margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }
div#mainContent form#webform textarea#enquiry { width: 250px; margin: 0; padding: 0; border: 1px solid #A30327; color: #A30327; }

/* used on most pages  - this DIV holds all content so font sizes should cascade down from here */
div#mainContainerMap { font-size: 0.8em; float:left; width:98%; /*height: 70%; clear: right;*/  margin: 10px 0 10px 0; padding: 0 5px 5px 5px; color:#000000; /*background-color:#FFFFFF;*/ }


/* left hand container for map and key  - must be relative for map dots to position absolute to its top X,Y position */
div#leftContentMap { position: relative; float: left; /*width: 400px;*/ height: 560px; min-height: 400px; z-index: 1; width: 40%;  color: #000000; margin: 0; padding: 5px; border-top: 1px solid #A30327; border-right: 0; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327; background-color: #EBEBEB; }

div#leftContentMap p { padding: 0 5px 0 5px; }
div#leftContentMap p#timestamp { clear: left; margin: 10px 0 0 0; padding: 5px 5px 0 5px; font-style: italic;}
div#leftContentMap img { border: 0; }
div#leftContentMap img#homepagemap { border: 1px solid #A30327; margin: 0; }
div#leftContentMap img#bulletinmap { float: left; border: 1px solid #A30327; margin: 0;}
div#leftContentMap img#animationimage { width: 360px; height: 270px; border: 0;}
div#leftContentMap span.contentbanner { font-size: 1.2em; font-weight: bold; height: 20px; width: 352px; display: block; color: #ffffff !important;  padding: 5px;  margin: 0; background-color: #A30327 !important; 
background-image: url(/london/images/curve-top.gif); background-repeat: no-repeat; background-position: top right; }
div#leftContentMap table#mapkey { border: 0; border-collapse: collapse; border-spacing: 0; vertical-align: top; margin: 10px 0 0 0; padding: 0;}
div#leftContentMap table#mapkey td { padding: 0; }
div#leftContentMap table#mapkey img { border: 0; }
div#leftContentMap table#mapkey input#bandsbutton { border: 1px solid #A30327; margin: 25px 0 0 0; padding: 0; cursor: pointer; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#leftContentMap table#mapkeyarrows { border:0; border-collapse: collapse; border-spacing: 0; vertical-align: top;}
div#leftContentMap table#mapkeyarrows td { padding: 0;  border:0; border-collapse: collapse; border-spacing: 0;}
div#leftContentMap table#mapkeyarrows img { border: 0;}

div#leftContentMap table#keyaq { border: 0; border-collapse: collapse; border-spacing: 0; vertical-align: top; margin: 0 0 0 10px; padding: 0;}
div#leftContentMap table#keyaq tr.centre td { padding: 2px; text-align: center;}
div#leftContentMap table#keyaq td { padding: 2px; }
div#leftContentMap table#keyaq td.padding-top { padding-top: 10px; }
div#leftContentMap table#keyaq td.padding-left { padding-left: 10px; }
div#leftContentMap table#keyaq a#bandsbutton { display: block; color: #000000; text-decoration: none; text-align: center; width: 180px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#leftContentMap table#keyaq a#viewall { display: block; color: #000000; text-decoration: none; text-align: center; width: 50px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#leftContentMap table#keyaq a.showbutton { display: block; color: #000000; text-decoration: none; text-align: center; width: 15px; height: 15px; cursor: pointer; border: 1px dashed #A30327; margin: 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#leftContentMap table#keyaq a.showbuttonselected { display: block; color: #000000; text-decoration: none; text-align: center; width: 15px; height: 15px; cursor: pointer; border: 1px solid #A30327; margin-right: 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }


/* right hand container for site details etc */
div#rightContentMap { position: relative; float: left; width: 44%; z-index: 0; height: 560px; min-height: 400px;/*height: 100%;*/ color: #000000; margin: 0; padding: 5px; border-top: 1px solid #A30327; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 0; background-color: #EBEBEB; }

div#rightContentMap img { border: 0;}

div#rightContentMap table#rightcolumn { width: 95%; /* height: 100%;*/ margin: 0; padding: 0; border:0; border-collapse: collapse; border-spacing: 0; vertical-align: top;}
div#rightContentMap table#rightcolumn td { border: 0; padding: 0; color:#000000;}
/* set height to same as span#bulletintabs to close gap on firefox */
div#rightContentMap table#rightcolumn td#bulletintab { height: 20px; padding: 0; margin: 0; border-spacing: 0; border-collapse: collapse; border: 0;}
div#rightContentMap table#rightcolumn td#maincontent { font-size: 1em; width: 100%; height: 100%; background-color: #ffffff; border: 1px solid #A30327; border-spacing: 0; border-collapse: collapse; padding: 5px; margin: 0;}

div#rightContentMap table#rightcolumnsub { width: 100%; /*height: 200px;*/ border: 0; vertical-align: top;}
div#rightContentMap table#rightcolumnsub td { vertical-align: top;}
div#rightContentMap table#rightcolumnsub td.padding-top { padding-top: 20px;}
div#rightContentMap table#rightcolumnsub img { border: 0;}
div#rightContentMap table#rightcolumnsub img#localborough { border: 0; margin: 10px 0 10px 0;}
div#rightContentMap table#rightcolumnsub input.text { color: #A30327; border: 1px solid #A30327; margin: 0; padding: 1px;}
div#rightContentMap table#rightcolumnsub input#submit { width: 40px; cursor: pointer; border: 1px solid #A30327; margin: 15px 0 0 5px; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap table#rightcolumnsub input#submitnomargin { width: 40px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap table#rightcolumnsub a#reports { display: block; color: #000000; text-decoration: none; text-align: center; width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap a#reports:hover { color: #000000; }
div#rightContentMap table#rightcolumnsub a#graphs { display: block; color: #000000; text-decoration: none; text-align: center; width: 200px; cursor: pointer; border: 1px solid #A30327; margin: 0 0 15px 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap a#graphs:hover { color: #000000; }
div#rightContentMap table#rightcolumnsub select { color: #A30327; border: 1px solid #A30327; margin: 0; padding: 0; }
div#rightContentMap table#rightcolumnsub select.objective-list { width: 312px; margin: 20px 0 0 0; padding: 0;}
div#rightContentMap table#rightcolumnsub td ul.kclstyle li { margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif) !important; }

/* table to hold sites species and levels data */
div#rightContentMap table#bulletin { border: 0; width: 100%; margin: 10px 0 10px 0;}
div#rightContentMap table#bulletin td { padding: 5px; }
div#rightContentMap table#bulletin p { padding-bottom: 5px; }
div#rightContentMap table#bulletin input#graphbutton { border: 1px solid #A30327; margin: 25px 0 25px 0; padding: 0; cursor: pointer; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap table#bulletin img.sitephoto { width: 300px; height: 250px; border: 1px solid #A30327; margin: 15px 0 5px 70px; padding: 0; }

/* nested table to hold site details info etc */
div#rightContentMap table#bulletinsub { margin: 20px 0 20px 0; width: 80%; border:0; border-spacing: 0; border-collapse: collapse; }
div#rightContentMap table#bulletinsub td { padding: 5px; margin: 0;}
div#rightContentMap table#bulletinsub tr.centre td { padding: 5px; margin: 0; text-align: center;}
div#rightContentMap table#bulletinsub img { border: 0; }
div#rightContentMap table#bulletinsub img.multimap { border: 1px solid #A30327 !important; margin: 15px 0 5px 80px; padding: 0; }
div#rightContentMap table#bulletinsub img.googlemap { border: 1px solid #A30327 !important; margin: 15px 0 5px 80px; padding: 0; }
div#rightContentMap table#bulletinsub img.sitephoto { width: 70px; height: 59px; border: 1px solid #A30327; margin: 5px 0 5px 0; padding: 0; }

/* table for stats page */
div#rightContentMap table#sitestats { width: 100%; /*height: 100%;*/ border: 0; border-spacing: 0; border-collapse: collapse; padding: 0; margin: 0; }
div#rightContentMap table#sitestats td { padding: 0;}
div#rightContentMap table#sitestats select#statyears { border: 1px solid #A30327; margin: 15px 0 0 0; padding: 0; width: 125px; }
div#rightContentMap table#sitestats input#reports { width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap table#sitestats input#basicstats { width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap table#sitestats input#roseplots { width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 0; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
div#rightContentMap table#sitestats input#aq { width: 40px; cursor: pointer; border: 1px solid #A30327; margin: 10px 0 0 5px; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}

/* nested table for stats page */
div#rightContentMap table#sitestatssub { margin: 20px 0 20px 0; width: 100%; border:0; border-spacing: 0; border-collapse: collapse; }
div#rightContentMap table#sitestatssub td { padding: 5px; margin: 0;}

/* tables for episodes page*/
div#rightContentMap table#episodes { width: 100%; border: 0; border-spacing: 0; border-collapse: collapse; padding: 5px; margin: 0; }
div#rightContentMap table#episodes td { vertical-align: top; padding: 5px;}

/* nested tables for episodes page*/
div#rightContentMap table#episodesub { width: 100%; height: 200px;  padding: 0; margin: 10px 0 0 0; border: 0; border-spacing: 0; border-collapse: collapse; }
div#rightContentMap table#episodesub td { padding: 5px; }
div#rightContentMap table#episodesub td.padding-top { padding-top: 20px; }
div#rightContentMap table#episodesub select.episodes { color: #A30327; border: 1px solid #A30327; margin: 15px 0 0 15px; padding: 0; width: 280px;}
div#rightContentMap table#episodesub select#mapview { color: #A30327; border: 1px solid #A30327; margin: 15px 0 0 35px; padding: 0; width: 200px;}
div#rightContentMap table#episodesub select#pagetype { color: #A30327; border: 1px solid #A30327; margin: 15px 0 0 30px; padding: 0; width: 120px;}
div#rightContentMap table#episodesub td.species { width: 50%; padding: 5px; }
div#rightContentMap table#episodesub td.aqindex { width: 50%; padding: 5px; }
div#rightContentMap table#episodesub input.submit { width: 40px; cursor: pointer; border: 1px solid #A30327; margin: 15px 0 0 5px; padding: 0; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}

/* air quality strategy table */

div#rightContentMap table#aqs2000 { width: 90%; border: 1px solid #A30327; margin: 0; padding: 0;}
div#rightContentMap table#aqs2000 thead th { padding: 3px; font-weight: bold; text-align: left;}
div#rightContentMap table#aqs2000 th#toprow { background-color: #A30327; color: #ffffff; border-bottom: 1px solid #A30327 !important; }  
div#rightContentMap table#aqs2000 td { padding: 3px; }

/* air pollution index table */

div#rightContentMap table#airpollutionindex { width: 90%; /*height: 200px;*/ border: 0; vertical-align: top;}
div#rightContentMap table#airpollutionindex th { vertical-align: top; text-align: center; font-size: 0.8em; font-weight: bold;}
div#rightContentMap table#airpollutionindex td { vertical-align: top; text-align: center; font-size: 0.8em;}
div#rightContentMap table#airpollutionindex td.padding-top { padding-top: 20px;}

/* tabs for site details, episodes etc - set display:block for firefox to show background image */
div#rightContentMap div#bulletintabs1 { font-size: 1em; height: 20px; display: block; color: #ffffff !important; margin: 0; padding: 5px 0 5px 0; background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); 
background-repeat: no-repeat; background-position: top right;}
div#rightContentMap div#bulletintabs1 ul { display: inline; margin: 0; padding: 0;}
div#rightContentMap div#bulletintabs1 ul li{ padding: 2px 10px 5px 15px; display: block; float: left; list-style-type: none; }
div#rightContentMap div#bulletintabs1 ul li.selected { text-decoration: underline; font-weight: bold; padding: 2px 10px 5px 15px; display: block; float: left; list-style-type: none; }
div#rightContentMap div#bulletintabs1 a { color: #fff; }
div#rightContentMap div#bulletintabs1 a:link {  text-decoration: none; }
div#rightContentMap div#bulletintabs1 a:active { text-decoration: none; }
div#rightContentMap div#bulletintabs1 a:visited { text-decoration: none; }
div#rightContentMap div#bulletintabs1 a:hover { color: #377fbd; text-decoration: underline; }

div#rightContentMap div#bulletintabs2 { font-size: 1em; height: 20px; display: block; color: #ffffff !important; margin: 0; padding: 5px 0 5px 0;  background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); 
background-repeat: no-repeat; background-position: top right;}
div#rightContentMap div#bulletintabs2 ul { display: inline; margin: 0; padding: 0;}
div#rightContentMap div#bulletintabs2 ul li{ padding: 2px 10px 5px 15px; display: block; float: left; list-style-type: none; }
div#rightContentMap div#bulletintabs2 ul li.selected { text-decoration: underline; font-weight: bold; padding: 2px 10px 5px 15px; display: block; float: left; list-style-type: none; }
div#rightContentMap div#bulletintabs2 a { color: #fff; }
div#rightContentMap div#bulletintabs2 a:link { text-decoration: none; }
div#rightContentMap div#bulletintabs2 a:active { text-decoration: none; }
div#rightContentMap div#bulletintabs2 a:visited { text-decoration: none; }
div#rightContentMap div#bulletintabs2 a:hover { color: #377fbd; text-decoration: underline; }


/* right container to hold all the navigation in place */

div#right-container-holder { float: left; width:22%; margin: 0; padding: 0; border: 0; }

/* containers for quick links, sponsors and latest news */

div#rightContainer { width:100%; background-color: #EBEBEB; color:#000000;  float:left; margin: 0 0 0 10px; padding: 5px; border:1px solid #A30327;  }
div#rightContainer ul { margin: 10px 0 10px 10px; padding: 0 0 0 10px;}
div#rightContainer li { margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif); }
div#rightContainer span.contentbanner { font-size: 1.2em; font-weight: bold; height: 20px; display: block; color: #ffffff !important; padding: 5px;  background-color: #A30327 !important;
background-image: url(/london/images/curve-top.gif); background-repeat: no-repeat; background-position: top right;}
div#rightContainer img { margin: 0; padding: 0; border-right: 1px solid #A30327; border-bottom: 1px solid #A30327; border-left: 1px solid #A30327; }
/* stop subscript and superscript breaking lines */
div#rightContainer sub { position: relative; font-size: 0.8em; vertical-align: baseline;  bottom: 0.00em; }
div#rightContainer sup { position: relative; font-size: 0.8em; vertical-align: baseline; bottom: 0.25em; }


div#rightContainerMiddle { width:100%; background-color: #EBEBEB; color:#000000; float:left; margin: 10px 0 0 10px; padding: 5px; border:1px solid #A30327;  }
div#rightContainerMiddle ul { margin: 10px 0 10px 10px; padding: 0 0 0 10px;}
div#rightContainerMiddle li { margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif); }
div#rightContainerMiddle span.contentbanner { font-size: 1.2em; font-weight: bold; height: 20px;  display: block; color: #ffffff !important; padding: 5px;  background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); 
background-repeat: no-repeat; background-position: top right;}
div#rightContainerMiddle img { margin: 0; padding: 0; border: 1px solid #A30327; }

div#rightContainerBottom { width:100%; background-color: #EBEBEB; color:#000000;  float:left; margin: 10px 0 0 10px; padding: 5px; border:1px solid #A30327;  }
div#rightContainerBottom ul { margin: 10px 0 10px 10px; padding: 0 0 0 10px;}
div#rightContainerBottom li { margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif); }
div#rightContainerBottom span.contentbanner { font-size: 1.2em; font-weight: bold; height: 20px;  display: block; color: #ffffff !important; padding: 5px;  background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); 
background-repeat: no-repeat; background-position: top right;}
div#rightContainerBottom img { margin: 5px 0 0 0; padding: 0;  border: 1px solid #A30327; }

/* footer */

div#footerContainer { height:25px; clear:both; padding: 0; margin: 5px 0 0 0; text-align: left; background-color: #A30327; border-top:1px solid #fff; border-bottom: 10px solid #fff; color: #fff; }
div#footerContainer ul { list-style:none; padding:0; margin: 5px;}
div#footerContainer li { vertical-align: middle !important; font-size: 0.65em; display:inline; padding:0; margin:0;}
div#footerContainer a { color: #fff !important; font-weight: normal !important; text-decoration: none; }
div#footerContainer a:hover { color: #377fbd; text-decoration: underline; }
div#footerContainer img { border: 0; margin: 0; padding: 0;}

/* pop up windows container */

div#popupContainer { font-size: 0.8em; width:95%;  margin: 10px; padding: 5px; color:#000000; border: 1px solid #A30327; background-color:#EBEBEB; }
div#popupContainer span.contentbanner { font-size: 1.2em; font-weight: bold; height: 20px;  display: block; color: #ffffff !important; padding: 5px;  background-color: #A30327 !important; background-image: url(/london/images/curve-top.gif); 
background-repeat: no-repeat; background-position: top right;}
div#popupContainer input#close { width: 100px; cursor: pointer; border: 1px solid #A30327; margin: 5px; padding: 0 5px 0 5px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}



/* FLASH VIDEO */
div.flash-video { margin: 0; padding: 0; border: 1px solid #A30327; width: 320px; height: 520px;}


/* shared styles */
.server { border: 1px solid #A30327 !important; margin: 5px 0 10px 10px;}
.warning-icon { margin: 0 10px 0 0;}
.kclred { color: #A30327; }
.kclred-bold { color: #A30327; font-weight: bold;}
.kclborder { border: 1px solid #A30327 !important; }
.dashedborder { border: 1px dashed #A30327; }
.dashedborder:hover { border: 1px dashed #377fbd !important; }
.spacer { clear: both; }
.clear { clear: both; }
.accessibleicon { border: 0; margin: 0 10px 0 10px; }
/* sort this out - so map dots highlight when selected by keyboard */
a.maplink:hover, a.maplink:active, a.maplink:link { width: 100%; cursor: pointer; border: 1px solid #A30327 !important; background-color:#A30327;}
.mapdot { border: 0px; }
.mapdot img { border: 0px !important; }
.noborder { border: 0px !important; }
.top { vertical-align: top; }
.vmiddle { vertical-align: middle;}
.centre { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }
.padding { padding: 5px; }
.episodesmap { clear: left; margin: 15px 0 0 0; padding: 5px 5px 0 5px; font-style: italic; }
.backbutton { display: block; color: #000000; text-decoration: none; text-align: center; width: 70px; cursor: pointer; border: 1px solid #A30327; margin: 20px 0 0 0; padding: 2px; background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
.backbutton:hover { text-decoration: none; }
.hidden { display: none; }