/* Feb 2011 import new V6.0 css */
@import url('/london/css/V6import.css');


/* 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;           }

form { margin: 0; padding: 0;} 

/*links formatting*/

a { color: #339900; text-decoration: none; font-weight: bold; }
a:link { color: #339900; text-decoration: none;}
a:visited { color: #339900; text-decoration: none;}
a:hover { color: #339900; text-decoration: underline;}
a:focus { text-decoration: underline !important;}

a.rss { vertical-align: middle !important; margin: 0; padding: 0;}
a.silver-button { display: inline; color: #000000; text-decoration: none; text-align: center; width: auto;
                                               cursor: pointer; border: 1px solid #000000; margin: 10px 0 10px 0 !important; padding: 2px; 
                                               background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
/* buttons */
select { margin: 0 0 0 0; border: 1px solid #e5e2dd;}
input.generic-button { /*width: auto;*/ cursor: pointer; border: 1px solid #000000; margin: 0 !important; padding: 1px; 
                       background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
input.generic-textbox { margin: 0 0 0 0 !important; border: 1px solid #e5e2dd; color: #000000;  }
input.generic-textbox:hover, input.generic-textbox:focus { background-color: Yellow; }
input.bandsbutton { border: 1px solid #000000; margin: 25px 0 0 0; padding: 0; cursor: pointer; 
                                                    background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat;}


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

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

/* keep superscript and subscript text from breaking the line-spacing */
sub { position: relative; font-size: 0.8em; vertical-align: baseline; bottom: 0.00em; }
sup { position: relative; font-size: 0.8em; vertical-align: baseline; bottom: 0.25em; }

/* lists */
ul.list { margin: 10px 0 10px 10px; padding: 0 0 0 15px;}
ul.list li { clear: both; margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif) !important; }
ul#keypoints li { margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif); }
ul.kclstyle li { clear: both; margin: 0; padding: 0 0 0 10px; list-style-image: url(/london/images/kcl_bullet.gif) !important; }

/* rss page */
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; }
ul.rss li select.rss { border: 1px solid #000000; margin: 0 0 0 5px; padding: 0;  }

/* IE 6 warning */
div.warning { width: 920px; margin: 5px auto 5px auto; font-size: 0.8em; 
              background: #FFFFDF url(../images/warning.gif) no-repeat 5px 8px; 
               padding: 5px 5px 5px 35px; border: 1px solid #CFA840; font-weight:bold;}


/* #########  containers start here ############ */

/* ###############  new wrapper for 960px grid ############  */
div#wrapper { width: 960px; margin: 0 auto 0 auto; padding: 0; border-top: 5px solid #000; color: #fff; background-color: #fff;}


/* header in V6import.css */

/* new icon for latest pages  - relative to top banner 
div.new-icon { width: 22px; height: 22px; position: absolute; bottom: -9px; left: 111px; z-index: 200; 
               border: 0; margin: 0; padding: 0;
               background-image: url(/london/images/2010/new-icon-blue.png); background-repeat: no-repeat; background-position: 0 0; }*/


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

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

div#crumbTrail { clear: both; font-size: 0.70em; height: 10px; background-image:url(/london/images/bg_menubar_shadow.gif); 
                 background-position: 0% 0%; 
                 background-repeat: repeat-x; color:#000000; border:0; padding: 4px 0 2px 2px; 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:#000000;}
div#crumbTrail a:link { text-decoration:none;}
div#crumbTrail a:hover { text-decoration:underline; color:#336699;}
div#crumbTrail img { border: 0; margin: 5px 0 0 0; clear: left;}

/* ############   holds the left hand content ##############   */

div#leftContainer { float: left; width: 180px; height: 100%; min-height: 500px; font-size: 0.80em; background-color: #fff; 
                    padding: 5px; margin: 10px 0 10px 0; text-align: left; border: 1px solid #000000; }
                    
div#leftContainer span.contentbanner { font-size: 1.2em; font-weight: bold; height: 100%; min-height: 20px; width: 167px; display: block; 
color: #ffffff !important; padding: 5px; background-color: #000000 !important; margin: 0; }
                    
div#leftContainer div.flash-fader { border: 1px solid #000000; margin: 0 0 10px 0; width: 175px; height: 131px; }
div#leftContainer div.flash-fader object.flash-fade { margin: 0 !important; padding: 0; border: 0; width: 175px; height: 131px; }
div#leftContainer img.no-flash-image { margin: 0 0 20px 0; padding: 0; border: 0; }

div#leftContainer p { padding: 5px; }

/* quick link icons */
div#leftContainer a.icon-link { padding: 0 !important; display: inline; margin: 0; border: 0; text-decoration: none; width: 40px !important;}
div#leftContainer a.text-link { padding: 5px; display: inline; margin: 5px 5px 5px 5px !important; border: 0;}

div#leftContainer img.iphone { margin: 15px 20px 5px 15px; border: 0;}
div#leftContainer img.nowcast {  margin: 15px 20px 5px 15px; border: 0;  }

div#leftContainer img.virtualmaps { margin: 15px 20px 5px 15px; border: 0; }
div#leftContainer img.open-air { margin: 15px 0 5px 20px; border: 0;  }

div#leftContainer img.twitter {  margin: 15px 20px 5px 15px; border: 0; }
div#leftContainer img.facebook {  margin: 15px 20px 5px 15px; border: 0; }

div#leftContainer img.rss {  margin: 15px 20px 5px 15px; border: 0; }
div#leftContainer img.healthy-air {  margin: 15px 0 5px 15px; border: 0; }



/* #############   container holding main content  #############   */
                    
/* 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 {  font-size: 0.8em; position: relative; float: left; width: 554px; min-height: 495px; height: 100%; color: #000000; 
                   margin: 10px 5px 10px 5px; padding: 5px 5px 10px 5px; border: 1px solid #000000; background-color: #fff; }

div#mainContent span.contentbanner { font-size: 1.2em; font-weight: bold; height: 100%; min-height: 20px;
                                      display: block; color: #ffffff !important; 
                                        margin:0; padding: 5px;  background-color: #000000 !important;  /*width: 545px;*/}

/* 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.contact { border-right: 1px solid #000000; border-bottom: 1px solid #000000; border-left: 1px solid #000000; margin: 0;}

div#mainContent img.help { border: 1px solid #000000; margin: 10px 0 0 5px;}
div#mainContent img.kclred { border: 1px solid #000000; margin: 0 0 0 10px;}
div#mainContent img#homepagemap { border: 1px solid #000000; margin: 10px 0 0 0; }
div#mainContent img#bulletinmap { border: 1px solid #000000; margin: 0; }
div#mainContent img#information { border: 1px solid #000000; margin: 0 0 0 5px; padding: 0; }
div#mainContent img#newsimage { border: 1px solid #000000; margin: 10px 10px 10px 0; padding: 0; float: left;}
div#mainContent img#browsers { border: 1px solid #000000; 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.no-flash-image { border: 0 !important; margin: 10px;}

div#mainContent img#rss { border: 0; margin: 0 5px 0 0; padding: 0; 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 #000000 !important; margin: 0 5px 0 0; padding: 0; float: left; }
div#mainContent img.float-left-noborder { border: 0 !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 #000000 !important; margin: 0 0 0 5px; padding: 0; float: right;}
div#mainContent img.float-right-noborder { border: 0 !important; margin: 0 0 0 5px; padding: 0; float: right;}
div#mainContent img.border { border: 1px solid #000000; margin: 10px;}


/* FLASH CONTENT */
/* need to use DIV to add border around object tag in Firefox */
div#mainContent div#flash-border { border: 1px solid #000000; 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: 100%; min-height: 20px; display: block; color: #ffffff !important;  
                                     margin:0; padding: 5px;  background-color: #000000 !important; }

/* this banner is for the virtual map page only */
div#mainContent span.contentbannerwhite { font-size: 1.2em; font-weight: bold; height: 100%; min-height: 20px;display: block; color: #ffffff !important;  
                                          margin:0; padding: 5px;  background-color: #000000 !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 #000000; border-right: 1px solid #000000; border-bottom: 1px solid #000000; 
                                  border-left: 1px solid #000000; padding: 5px;}
div#mainContent table#access td.bottomborder { border-bottom: 1px solid #000000; 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); }

/* generic buttons */
div#mainContent input.submit { cursor: pointer; border: 1px solid #000000; margin: 0 0 0 0; padding: 0; 
                               background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent input#submit { width: 50px; cursor: pointer; border: 1px solid #000000; margin: 0 0 0 5px; padding: 0; 
                               background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }



/* 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: #000000 !important; }
div#mainContent table#healthbands td.impact { border-right: 0; width: 70%; padding: 3px; color: #fff; background-color: #000000 !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 #000000; border-bottom: 1px solid #000000; border-left: 1px solid #000000;}

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 #000000; border-bottom: 1px solid #000000; border-left: 1px solid #000000; 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: #000000 !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 #000000; border-bottom: 1px solid #000000; border-left: 1px solid #000000; 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: #000000 !important; }
div#mainContent table#healthbands td#corner { width: 12%; text-align: center; height: 25px; border-right: 0; padding: 3px; color: #fff; background-color: #000000 !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 #000000; 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 #000000; margin: 10px;}
div#mainContent table#graphimage img.graph { border: 1px solid #000000; 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 #000000; 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: 5px; 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 #000000; 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 #000000; 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 #000000; 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 #000000; 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: #000000; border: 1px solid #000000; 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 {  display: block; font-style: italic; background-color: #ffffff; color: #000000; 
                                                padding: 3px; border: 1px solid #000000;}
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 #000000; color: #000000; }
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: 99% !important; /*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 #000000; color: #000000; }
div#mainContent table#advstats input#checkbox { border: 0; }

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

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

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

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



/* tables for graph tools page */
div#mainContent table.graphtools { width: 99%; 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: 85%; }
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 { border: 1px solid #000000; color: #000000; }
div#mainContent table.graphtools select.timeperiod { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.graphtools select#avperiod { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.graphtools select#windsite { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.graphtools input.button { width: 50px; cursor: pointer; border: 1px solid #000000; margin: 0; padding: 0; 
                                                background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
div#mainContent table.graphtools input.next-button { width: 50px; cursor: pointer; border: 1px solid #000000; margin: 0; padding: 0; 
background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }

div#mainContent table.graphtools input.checkbox { border: 0; margin: 10px 0 10px 0; padding: 0; }
div#mainContent table.graphtools input.plotbutton { width: 120px; cursor: pointer; border: 1px solid #000000; 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 { display: block; font-style: italic; background-color: #ffffff; 
                                                color: #000000; padding: 3px; border: 1px solid #000000;}
div#mainContent table.graphtools img.graph { border: 1px solid #000000; }

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 #000000; }
div#mainContent table#graphtoolssub td#key { background-color: #ffffff !important; border: 1px solid #000000 !important;}


/* advanced graph and rose plot tools page */

div#mainContent table.advgraphtools { width: 99%; 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 #000000; color: #000000; }
div#mainContent table.advgraphtools select#site2 { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools select#site3 { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools select#site4 { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools select#site5 { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools select#site6 { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools select.timeperiod { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools select#avperiod { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools select#windsite { margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.advgraphtools input.button { width: 50px; cursor: pointer; border: 1px solid #000000; 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 #000000; margin: 10px 0 10px 0; padding: 0;  }
div#mainContent table.advgraphtools input.plotbutton { width: 120px; cursor: pointer; border: 1px solid #000000; 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 {  display: block; font-style: italic; background-color: #ffffff; color: #000000; padding: 3px; border: 1px solid #000000;}
div#mainContent table.advgraphtools img.graph { border: 1px solid #000000; }


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 #000000; }

/* 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 #000000; }
div#mainContent table#reports select#reporttype { color: #000000; margin: 0 0 0 10px; border: 1px solid #000000; }
div#mainContent table#reports input#reportbutton { width: 50px; cursor: pointer; border: 1px solid #000000; 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 #000000; 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 #000000; }
div#mainContent table#reportdetails select#reports { color: #000000; margin: 0 0 0 10px; border: 1px solid #000000; }
div#mainContent table#reportdetails input#reportbutton { width: 50px; cursor: pointer; border: 1px solid #000000; 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 #000000 !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 #000000; margin: 0; }
div#mainContent table#downloads img#graph { border: 1px solid #000000; margin: 0 0 10px 0 }
div#mainContent table#downloads select.download { color: #000000; margin: 0 0 0 10px; border: 1px solid #000000; }
div#mainContent table#downloads input.submit { width: 50px; cursor: pointer; border: 1px solid #000000; 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 #000000; 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 #000000; 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 #000000; color: #000000; }
div#mainContent table#downloads select.timeperiod { margin: 10px 0 0 0; padding: 0; border: 1px solid #000000; color: #000000; }
/*div#mainContent table#downloads select#avperiod { margin: 0 0 0 90px; padding: 0; border: 1px solid #000000; color: #000000; }*/
div#mainContent table#downloads input.checkbox { border: 0; margin: 10px 0 10px 0; padding: 0; }
div#mainContent table#downloads span.warning { display: block; font-style: italic; background-color: #ffffff; color: #000000; padding: 3px; border: 1px solid #000000;}
div#mainContent table#downloads a#species { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #000000; 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 #000000; 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 #000000; 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 #000000; 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 #000000 !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 #000000; }
div#mainContent table.downloads img#graph { border: 1px solid #000000; margin: 0 0 10px 0 }
div#mainContent table.downloads select.download { color: #000000; margin: 0 0 0 10px; border: 1px solid #000000; }
div#mainContent table.downloads input.submit { width: 50px; cursor: pointer; border: 1px solid #000000; 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 #000000; 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 #000000; 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 #000000; color: #000000; }
div#mainContent table.downloads select.timeperiod { margin: 10px 0 0 0; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.downloads select#avperiod { margin: 0 0 0 90px; padding: 0; border: 1px solid #000000; color: #000000; }
div#mainContent table.downloads input.checkbox { border: 1px solid #000000; margin: 10px 0 10px 0; padding: 0; }
div#mainContent table.downloads span.warning {  display: block; font-style: italic; background-color: #ffffff; color: #000000; padding: 3px; border: 1px solid #000000;}
div#mainContent table.downloads a#species { display: run-in; color: #000000; text-decoration: none; text-align: center; width: 150px; cursor: pointer; border: 1px solid #000000; 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 #000000; 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 #000000; 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 #000000; 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: 98%; 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 #000000; color: #000000; }
div#mainContent form#webform input.submit { width: 120px; cursor: pointer; border: 1px solid #000000; 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 #000000; color: #000000; }
div#mainContent form#webform textarea#enquiry { width: 250px; margin: 0; padding: 0; border: 1px solid #000000; color: #000000; }

/* UPDATED  - RENAMED AS A CLASS TO STOP DIV BREAKS  - SUMMER 2010  */
/* ##### 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: 100%; height: 100%; min-height: 300px;  margin: 10px 0 10px 0; 
                       padding: 0px; color:#000000; background-color: #fff; border: 1px solid #000000; }
                       
/* 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; height: 100%; z-index: 1; 
                     width: 49%;  color: #000000; margin: 0 10px 0 0; padding: 5px; border: 0; }

div#leftContentMap p { margin: 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 #000000; margin: 0; }
div#leftContentMap img#bulletinmap { float: left; border: 1px solid #000000; margin: 0;}
div#leftContentMap img#animationimage { width: 360px; height: 270px; border: 0;}
/* titles */
div#leftContentMap span.contentbanner { /*width: 99%;*/ font-size: 1.2em; font-weight: bold; height: 100%; min-height: 20px; display: block; 
                                        color: #ffffff;  padding: 5px;  margin: 0; background-color: #000000;  }
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#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;}

/* map key */
table#keyaq { border: 0; border-collapse: collapse; border-spacing: 0; vertical-align: top; margin: 10px; 
                                 padding: 0; width: 95%; text-align: center;}
table#keyaq td { padding: 5px !important; text-align: center;}

table#keyaq tr.middle td { vertical-align: middle;}
table#keyaq tr.centre td { padding: 2px; text-align: center;}

table#keyaq td.padding-top { padding-top: 10px; }
table#keyaq td.padding-left { padding-left: 10px; }

table#keyaq img.key { margin: 10px; }

table#keyaq select { margin: 0 5px 0 5px; border: 1px solid #e5e2dd; padding: 2px; }
table#keyaq input.button { color: #fff;  margin: 0 5px 0 5px; border: 1px solid #e5e2dd; cursor: pointer; 
                                               padding: 2px; background-color: #000000; }

table#keyaq a#bandsbutton { display: block; color: #000000; text-decoration: none; text-align: center; /*width: 180px; */
                                               cursor: pointer; border: 1px solid #000000; margin: 10px 0 0 0; padding: 2px; 
                                               background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
table#keyaq a#viewall { display: block; color: #000000; text-decoration: none; text-align: center; /*width: 50px; */
                                           cursor: pointer; border: 1px solid #000000; margin: 10px 0 0 0; padding: 2px; 
                                           background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}
table#keyaq a.showbutton { display: block; color: #000000; text-decoration: none; text-align: center; width: 15px; 
                                              height: 15px; cursor: pointer; border: 1px dashed #000000; margin: 0 auto 0 auto; padding: 0; 
                                              background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x; }
table#keyaq a.showbuttonselected { display: block; color: #000000; text-decoration: none; 
                                                      text-align: center; width: 15px; height: 15px; cursor: pointer; 
                                                      border: 1px solid #000000; margin-right: 0; padding: 0; 
                                                      background-image: url(/london/images/bg_menubar_bar.gif); 
                                                      background-repeat: repeat-x; }
                                                                                                            
 /* nowcast page */                                                    
table.nowcast { border: 0; border-collapse: collapse; border-spacing: 0; margin: 10px 0 10px 0; 
                                 padding: 0; width: auto;}
table.nowcast td { padding: 2px;  }
table.nowcast tr.middle td { vertical-align: middle;}
table.nowcast tr.text td { text-align: center; font-size: 0.8em !important;}

table.nowcast td.padding-top { padding-top: 10px; }
table.nowcast td.padding-left { padding-left: 10px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	GOOGLE MAP CONTAINER 

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div.google-map { padding: 0; margin: 5px 0 5px 0; width: 99%; height: 300px; border: 1px solid #1B4A7E; }
div.google-map a:hover { background-color: Transparent !important; }
div.google-map a.map-link:hover { background-color:#E3F2FB !important; }
/* remove copyright text */
div.google-map span { display: none !important; }
div.google-map a.gmnoprint terms-of-use-link { display: none !important; }
div.google-map div#logocontrol { display: none !important; }

p.map-search { margin: 5px 0 5px 0 !important; padding: 0 !important;}

/* under map */
div#selection select { margin: 5px 0 5px 0 !important; border: 1px solid #e5e2dd;}
select.species { margin: 10px 0 0 0 !important; border: 1px solid #e5e2dd;}
input.checkbox { margin: 10px 0 0 0 !important; border: 0; display: inline !important;}

span.timestamp { font-size: 0.85em !important; float: left; display: block !important;} 
div.map-key { /*position: absolute; bottom: 250px; top: 55%; right: 0;*/ float: right; margin: 0 0 0 0; border: 0; }
div.map-key img { margin: 0; border: 0; }



/* #############  right hand container for site details etc ###########  */
div#rightContentMap { position: relative; float: right; width: 47%; z-index: 0; height: 100%; 
                      color: #000000; margin: 0 0 0 0; padding: 5px; border: 0; }

div#rightContentMap p { margin: 5px;}

div#rightContentMap img { border: 0;}

/* titles */
div#rightContentMap span.contentbanner { /*width: 100%;*/ font-size: 1.2em; font-weight: bold; height: 100%; min-height: 20px; display: block; 
                                        color: #ffffff !important;  padding: 5px;  margin: 0; background-color: #000000 !important; }

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: 100%; min-height: 20px;  padding: 0; margin: 0; border-spacing: 0; border-collapse: collapse; 
                                                       border: 0; background-color: #000;}
div#rightContentMap table#rightcolumn td#maincontent { font-size: 1em; width: 100%; height: 100%; background-color: #ffffff; border: 1px solid #000000; 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: #000000; border: 1px solid #000000; margin: 0; padding: 1px;}
div#rightContentMap table#rightcolumnsub input#submit { width: 50px; cursor: pointer; border: 1px solid #000000; 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 #000000; 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 #000000; 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 #000000; 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: #000000; border: 1px solid #000000; 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 #000000; 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 #000000; 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 #000000 !important; margin: 15px 0 5px 80px; padding: 0; }
div#rightContentMap table#bulletinsub img.googlemap { border: 1px solid #000000 !important; margin: 15px 0 5px 80px; padding: 0; }
div#rightContentMap table#bulletinsub img.sitephoto { width: 70px; height: 59px; border: 1px solid #000000; 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 #000000; margin: 15px 0 0 0; padding: 0; width: 125px; }
div#rightContentMap table#sitestats input#reports { width: 100px; cursor: pointer; border: 1px solid #000000; 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 #000000; 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 #000000; 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 #000000; 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: #000000; border: 1px solid #000000; margin: 15px 0 0 15px; padding: 0; 
                                                       width: 280px;}
div#rightContentMap table#episodesub select#mapview { color: #000000; border: 1px solid #000000; margin: 15px 0 0 35px; padding: 0; 
                                                      width: 200px;}
div#rightContentMap table#episodesub select#pagetype { color: #000000; border: 1px solid #000000; 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 #000000; 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: 98%; border: 1px solid #000000; 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: #000000; color: #ffffff; border-bottom: 1px solid #000000 !important; }  
div#rightContentMap table#aqs2000 td { padding: 3px; }

/* air pollution index table */

div#rightContentMap table#airpollutionindex { width: auto !important;  border: 0; vertical-align: top; font-size: 1.2em !important; }
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: 100%; min-height: 20px; 
                                         display: block; color: #ffffff !important; margin: 0; padding: 5px 0 5px 0; background-color: #000000 !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 {color: Orange; 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: Orange; text-decoration: underline; }

div#rightContentMap div#bulletintabs2 { font-size: 1em; height: 100%; min-height: 20px;  display: block; color: #ffffff !important; margin: 0; padding: 5px 0 5px 0; 
                                         background-color: #000 !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 { color: Orange;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: Orange; text-decoration: underline; }


/* ################### right container ################# */

div#rightContainer { width: 180px; background-color: #fff; color: #000000; float: right; margin: 10px 0 10px 0; padding: 5px; 
                     border: 1px solid #000000;  height: 100%; min-height: 500px; font-size: 0.8em;}
                     
div#rightContainer span.contentbanner { font-size: 1.2em; font-weight: bold; width: 167px; height: 100%; min-height: 20px; display: block; 
                                        color: #ffffff !important; padding: 5px;  background-color: #000000 !important;}
div#rightContainer ul { width: 98%; margin: 5px 0 5px 0; padding: 0 0 0 0; border: 0;}
div#rightContainer li { margin: 5px 0 0 0; padding: 0 0 0 15px; list-style-type: none;  
                        background-image: url('/london/images/kcl_bullet.gif'); background-repeat: no-repeat; 
                        background-position: 0 0; }
/* 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; }




/* footer */
/* footer in V6import.css */



/* pop up windows container */

div#popupContainer { font-size: 0.8em; width:95%;  margin: 10px; padding: 5px; color:#000000; border: 1px solid #000000; 
                     background-color:#EBEBEB; }
div#popupContainer span.contentbanner { font-size: 1.2em; font-weight: bold; height: 100%; min-height: 20px; display: block; color: #ffffff !important; 
                                        padding: 5px;  background-color: #000000 !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 #000000; margin: 5px; padding: 0 5px 0 5px; 
                                 background-image: url(/london/images/bg_menubar_bar.gif); background-repeat: repeat-x;}

/* shared styles */

/* colour scheme */
.laqn-blue { color: #000000; }
.light-blue { color: #C9E6F8; }


/* text */
.bold { font-weight: bold;}
.italic { font-style: italic;}
.bold { font-weight: bold;}
.red-bold { font-weight: bold; color: Red !important;}
.no-javascript { text-align: center; font-weight: bold; color: Red !important;}

.server { border: 1px solid #000000 !important; margin: 5px 0 10px 10px;}
.warning-icon { margin: 0 10px 0 0;}

.kclred { color: #000000; }
.kclred-bold { color: Red; font-weight: bold;}
.kclborder { border: 1px solid #000000 !important; }

.dashedborder { border: 1px dashed #000000; }
.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:focus { width: 100%; cursor: pointer; border: 1px solid #000000 !important; 
                                                     background-color:#000000;}
.mapdot { border: 0px; }
.mapdot img { border: 0px !important; }
.noborder { border: 0px !important; }
/* alignment */
.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 #000000; 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; }
.none { display: none; }