/*  Advert placement positioning
Affects the index page layout severely.
*/
#content {float:left;width:100%;margin-right:-100%;overflow:hidden;}
#content-inner {float:none;margin-left: 0; margin-right: 168px;}
.column {float:left;}
.right{float:right; width: 168px; }                        
#footer{clear:both;text-align:center; margin-top:8px;}
#bc{padding-left:10px;}
/* */

a:focus { outline:none }
#map {
	background:#c7bfc1;
	float:left;
	width:100%;
	height:616px;
}
#mapBox {
	background-color: #c7bfc1;
	padding-top: 0px;
	height: 616px;
	width: 100%;
}
#load {
	font-weight:bold;
	color:#000;
}
p {
	color:#fff;
	padding: 2px 0px;
	margin:2px 0px;
}
.selected {
	background:#000!important;
}
.playpause {
	position:absolute;
	width: 26px;
	height: 24px;
	margin:4px; 
	cursor: pointer;
	z-index:300;
	
}
#play {
	background: url(/public/pws/invent/weathermap/lib/images/buttons/anim.png) 0px 0px no-repeat;
}
#pause {
	background: url(/public/pws/invent/weathermap/lib/images/buttons/anim.png) 0px -30px no-repeat;
}
#tileLoading {
	visibility:hidden;
	position:absolute;
	width: 38px;
	height: 38px;
	background: url(../images/loadingSmall.gif) no-repeat;
	z-index:200;
}
#countdown {
	visibility:hidden;
	position:absolute;
	top:10px;
	width:38px;
	font-size: 0.8em;
	text-align: center;
	color:#cf3;
	z-index:201;
}
#play a:hover {
	background: transparent url(/public/pws/invent/weathermap/lib/images/buttons/anim.png) -33px -0px no-repeat;
}
#pause a:hover {
	background: transparent url(/public/pws/invent/weathermap/lib/images/buttons/anim.png) -33px -30px no-repeat;
}
#info {color:#fff;}
.styled {margin-left:7px;}
#tlPanel {width:350px;height:45px;padding-left:3px;border:1px solid #cf3;background-color:#000;-moz-border-radius:6px;-webkit-border-radius: 6px;}
.tlPos {float:left;background-color:#cf3;height:13px;width:12px;border:2px solid #000;padding:2px 0px;margin: 0px 0px 0px 0px;color:#000;}
.tlPeriod {float:left;height:40px;background-color:#ccc;}
.tlTime {padding:0;line-height:1.5em;display:none;}

/* NEW LAYERS MENU (mapLayers)*/
.item {height:20px;padding: 2px;border-bottom:1px solid #fff;background-color:#000;}
.item.unavailable {background-color:#000;}
.item.unavailable label span {color:gray;}
.item input {float:left;}
.item label {float:left;display:block;padding:2px 0px 2px 2px;color:#fff;font-weight:700;font-size:8pt;line-height:1.2em;cursor:pointer;}
.headerbar {color: #cf3;font-size:14px;font-weight:700;padding:5px;background: #000 url(/public/pws/invent/lib/images/minus.gif) no-repeat right;border-bottom:1px solid #CCC;}
.selClosed {background-image:url(/public/pws/invent/lib/images/plus.gif)!important;}
.radiob{cursor:pointer;}

/* Keys */
.layerKey {display:none;background-color:#666;}

.keyContainer {cursor:arrow;font-size:7pt;font-weight:normal;padding:2px;padding-bottom:5px;color:black;background-color:white;}
.keyContainerWind {cursor:arrow;font-size:7pt;font-weight:normal;padding:2px;padding-bottom:5px;color:black;background-color:white; line-height:1.1em;}
.keyItem {border:1px solid black;}
div.keyItem {width:12px;padding:0;height:12px;margin-right:1px;margin-bottom:0;font-size:1pt;line-height:0;}
div.keyItem span {font-size:1px;padding:0;margin:0;}
.tempMapKeyItem {float:left;text-align:center;display:inline;margin-right:2px;margin-bottom:5px;}
.tempMapKeyItem span {font-family:arial narrow, arial, swiss, sans-serif;font-size:8px;}
.keyContainer h3 {padding-left:0;color:black;font-size:8pt;font-weight:bold;}
.keyContainer h3 a {color:black;}
.keyContainer hr {border:none;border-top:1px solid gray;}

.opacitySetter {margin-left:5px;display:inline;float:right;padding:2px 5px 2px 5px;border:1px solid black;background-color:silver;cursor:pointer;}
.opacitySetterContainer {line-height:1.1em;}
.opacitySetter.active {background-color:lightGray;} 
.opacitySetter.hover {border-color:Gray;} 

.windSetter {margin-left:5px;display:inline;float:right;padding:2px 5px 2px 5px;border:1px solid black;background-color:silver;cursor:pointer;}
.windSetterContainer {line-height:1.1em;}
.windSetter.active {background-color:lightGray;} 
.windSetter.hover {border-color:Gray;} 

h1{color:#fff;}
h2{padding:2px;margin:0px;color:#cf3;font-weight:bold;font-family:Arial, Verdana;}
h3{padding:2px;color:#cf3;font-weight:bold;font-family:Arial, Verdana;}
h4{padding:2px;color:#cf3;font-weight:bold;font-family:Verdana, Arial;text-align:left;margin:0px;font-size:14px;}

/* Loading box styling */
#loadingBox {
	margin-bottom:5px; 
	width:550px;
	position:absolute;
	top:340px;
	left:71px;
	background-color:#000;
	color:#fff;
	border:2px solid #FFF;
	height:100px;
	opacity:0.9; 
	filter:alpha(opacity=90);
	padding:1em;
	z-index:9000;
	cursor:move;
}
#loadingBox p {
	font-size:1.5em;
	line-height:2em;
	margin-left:8px;
}
#loadingBox #loading {
	position:absolute;
	top:10px;
	left:13px;
	display:inline;
	float:left;
}

/* Error box styling */
.errorBox {
	margin-bottom:5px; 
	width:550px;
	position:absolute;
	top:470px;
	left:71px;
	background-color:#000;
	color:#fff;
	border:2px solid #FFF;
	height:100px;
	opacity:0.9; 
	filter:alpha(opacity=90);
	padding:1em;
	display:none;
	z-index:9999;	
	cursor:move;
}
.errorBox p {
	font-size:1.3em;
	line-height:1.5em;
	margin-top:1.5em;
	margin-left:8px;
}
.errorBox p em {
	color:red; 
	font-weight:bold;
	font-style:normal;
}

.errorBox a {color: white;text-decoration:none;}
.errorBox a:hover {text-decoration:underline;}
#errorBoxnavbl {height: 300px;}
#errorBoxlogin {height: 170px;}
#errorBoxCFV {height: auto;}

/* geoLookup results box styling */
#geoLookupResultsCover {
	position:absolute;
	top:0px;
	left:0px;
	height:100%;
	width:100%;
	display:inline;
	z-index:8999;
	color:#000000;
	opacity:0.25; 
	filter:alpha(opacity=25);
}
#geoLookupResults {
	display:inline;
	margin-bottom:5px;
	width:550px;
	position:absolute;
	top:250px;
	left:71px;
	background-color:#000;
	color:#fff;
	border:2px solid #FFF;
	opacity:0.9; 
	filter:alpha(opacity=90);
	padding:1em;
	z-index:9000;
}
#geoLookupResults p {
	font-size:1.3em;
	line-height:1.5em;
	margin-top:1.5em;
	margin-left:8px;
}
#geoLookupResults a {
	color:white;
	text-decoration:none;
}
#geoLookupResults a:hover {
	text-decoration:underline;
}
#geoLookupResults p em {
	color:red; 
	font-weight:bold;
	font-style:normal;
}
#geoLookupResults h1 {
	margin-bottom: 0.5em;
}
#geoLookupResults .geoLookupResultsListContainer {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
#geoLookupResults .buttonContainer {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	text-align:right;
}

/* preferences box styling */
#preferences {
	margin-bottom:5px;
	width:550px;
	position:absolute;
	top:390px;
	left:71px;
	background-color:#000;
	color:#fff;
	border:2px solid #FFF;
	opacity:0.9; 
	filter:alpha(opacity=90);
	padding:1em;
	display:none;
	z-index:9999;
}
#preferences p {
	font-size:1.3em;
	line-height:1.5em;
	margin-top:1.5em;
	margin-left:8px;
}
#preferences p em {
	color:red; 
	font-weight:bold;
	font-style:normal;
}
#preferences h1 {
	margin-bottom: 0.5em;
}
#preferences .contentContainer {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
#preferences .buttonContainer {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	text-align:right;
}
#preferences fieldset {
	margin-bottom: 1em;
}
#preferences legend {
	color:white;
}
#urlbox {width: 400px; margin-top: 1em;}

/*___________*/
/*TEXT FORECAST*/
.forecastBar {
	border-bottom:0px solid #777777;
	color:#CCFF33;
	font-family:Verdana;
	font-size:14px;
	font-weight:bold;
	padding:0;
	padding-top:0.5em;
	padding-right: 0.5em;
	height:50px;
	cursor:move;
}
.forecastBar a {
    font-size: 11px;
}
.popup {z-index:9000;}
.popupSel{z-index:9999;}
#textFCBox {
	margin-bottom:5px; 
	width:680px;
	position:absolute;
	top:257px;
	left:71px;
	background-color:#000;
	color:#fff;
	border:2px solid #FFF;
	height:469px;
	opacity:0.9; 
	filter:alpha(opacity=90);
	display:none;
}
.title {margin-bottom:5px; text-align: center; font-size:10px;}

.textFCBoxPanel {
	clear:both;
	padding:8px;
	overflow:auto;
	height:380px;
	border-top:2px solid #777777;
	margin-top:0;
}

.textFCBoxPanel .body {margin-bottom:1.5em;}
.textFCBoxPanel .body h4 {font-size:1.1em;padding-left:0;}

.textFCBoxPanel a {color:white;text-decoration:none;}
.textFCBoxPanel a:hover {text-decoration:underline;}

#textPollenBox {
	margin-bottom:5px; 
	width:260px;
	position:absolute;
	top:420px;
	left:65px;
	background-color:#000;
	color:#fff;
	border:2px solid #FFF;
	height:339px;
	opacity:0.9; 
	filter:alpha(opacity=90);
	display:none;
	z-index:9999;

}
.title {margin-bottom:5px; text-align: center; font-size:10px;}

.textPollenBoxPanel {
	clear:both;
	padding:8px;
	overflow:auto;
	height:294px;
	border-top:2px solid #777777;
	margin-top:0;
}

.textPollenBoxPanel .body {margin-bottom:1.5em;}
.textPollenBoxPanel .body h4 {font-size:1.1em;padding-left:0;}

.textPollenBoxPanel a {color:white;text-decoration:none;}
.textPollenBoxPanel a:hover {text-decoration:underline;}

#mountainText .body table {margin-bottom:1em;margin-top:0.5em;width:100%;}
#mountainText .body th {padding:0.25em;vertical-align:bottom;border:1px solid white;border-right:none;font-size:x-small;}
#mountainText .body th.explanation {border-right:1px solid white;}

#mountainText .body td {vertical-align:middle;padding:0.5em;padding-left:1em;padding-right:1em;font-size:x-small;color:black;text-align:left;border-left:1px solid white;border-bottom:1px solid white;}
#mountainText .body td.norisk {background-color:black;color:white;}
#mountainText .body td.low {background-color:yellow;}
#mountainText .body td.medium {background-color:orange;}
#mountainText .body td.high {background-color:red;color:white;}

#mountainText .body td.risk {text-align:center;}
#mountainText .body td.explanation {color:white;border-bottom:1px solid white;border-right:1px solid white;}

#mountainText .body img {vertical-align:bottom;}
#mountainText .body img.expectedconditions {margin-top:0.25em;}
#mountainText .body p.caveat {font-size:0.9em;font-weight:normal;}
#mountainText .body h5 {margin:0;}
#mountainText .body h3 {margin-top:1em;margin-left:0;}

#overviewImages {
   margin-bottom:1em;margin-top:0.25em;
}
#overviewImages div {
   margin-bottom:0.5em;margin-top:0.25em;
}

.crossImage{position:relative; float:right;cursor:pointer;}
#FCForm{float:right;position:relative;right:15px;top:2px;}

#FCForm {margin:0;}
#fcTabs {margin-left:10px;}
#fcTabs li {
	float:left;
	border:2px solid #777777;
	border-bottom-width:0;
	list-style-type:none;
	margin:0 0.5em 0 0;
	padding:0.25em 0.5em 0.25em 0.5em;
	position:relative;
	top:2px;
	-webkit-border-radius-topleft:0.2em;
	-webkit-border-radius-topright:0.2em;
	-moz-border-radius-topleft:0.2em;
	-moz-border-radius-topright:0.2em;
	opacity:1; 
	filter:alpha(opacity=100);
	background-color:#777777;
}

#fcTabs li.hovered {
	background-color:black;
}
#fcTabs li a {
	text-decoration:none;
	color:#CCFF33;
}
#fcTabs li.selected {
	background-color:black;
    border-bottom:2px solid black; 
}

/* Warnings styling */
/* .warning width for weather map only! */
.warning {
	border:1px solid #777777;
	width:525px;
	margin-bottom:15px;
}
.warning tr {vertical-align:top;}
.warning tr.filler td {
	padding:0px;
	height:0px;
	width:15%;
}
.warningType {
	border-bottom:1px solid #777777;
	border-right:1px solid #777777;
	padding:10px;
	height:22px;
	width:60%;
}
.warningType h2 {
	margin:0;
}
.warningValidity {
	border-bottom:1px solid #777777;
	padding:10px;
	height:22px;
}
.warningText {
	padding:10px;
	border-right:1px solid #777777;
}
.warningText p {}
.warningText p.issued {
	font-weight:bold;
}
.warningSuppInfo {
	padding:10px;
}
.warningSuppInfo h2 {
	font-size:110%;
}
.warningSuppInfo p {}
.warningSuppInfo ul {
	list-style-type:none;
}
.warningSuppInfo ul li {}

#headerWarn {margin-top:10px;}

/*MARKERS*/
.tempMarker{color:#000; font-size: 12px; font-weight: bold;cursor:pointer;}
.tempMarkerWhite{color:#fff; font-size: 12px; font-weight: bold;cursor:pointer;}
.mDiv{-moz-border-radius-bottomright: 0.2em;-moz-border-radius-bottomleft:0.2em;
  -webkit-border-bottom-left-radius: 0.2em;-webkit-border-bottom-right-radius: 0.2em;
  -moz-border-radius-topright: 0.2em;-moz-border-radius-topleft:0.2em;
  -webkit-border-top-left-radius: 0.2em;-webkit-border-top-right-radius: 0.2em;border:1px solid #000; padding: 2px;
  text-align:center;}
.windDiv {
	width:20px;
	position:absolute;
	left:9px;
	top:11px;
	text-align: center;
	font-weight:bold;
}
.windGustDivS {
	top:17px;
}
.windGustDivN {
	top:-20px;
}
.windGustDivS,.windGustDivN {
	width:25px;
	height:10px;
	background-color:red;
	color:white;
	position:absolute;
	left:7px;
	text-align: center;
	font-weight:bold;
	font-size:90%;
	line-height:1em;
	padding-top:1px;
	padding-bottom:2px;
}

/*_____________*/
/*DATETIME*/
#time{padding: 3px 5px 3px 3px;font-weight:bold;font-size:100%}
#date{padding: 3px 10px 3px 3px;font-weight:bold;font-size:100%}
#prodTitle{padding: 3px 10px 3px 3px;font-weight:bold;font-size:100%}
/*________*/
/*TIMELINE*/
/* this colour should match the #tlContainer li a:hover colour. */
.tooltipInProgress {color:lightblue;}
#leftTl {height:38px;width:528px;float:left;}
#rightTl {height:38px;width:36px;float:left;margin-left:3px;display:none;}
#frameNav {
  background: #000;
  opacity:0.9;
  filter:alpha(opacity=90);
  border:2px solid #f0f0f0;
  -moz-border-radius-bottomright: 8px;-moz-border-radius-bottomleft:8px;
  -webkit-border-bottom-left-radius: 8px;-webkit-border-bottom-right-radius: 8px;
  -moz-border-radius-topright: 8px;-moz-border-radius-topleft:8px;
  -webkit-border-top-left-radius: 8px;-webkit-border-top-right-radius: 8px;
  width:570px;
  padding:2px 4px 4px 4px;
  font-size: 12px;
}
#tlDiv {margin-top:2px;}
#tlContainer{padding:0px;list-style:none;display:inline;margin:0px;line-height:12px;}
#tlContainer li{
  display: inline-block;
  list-style-type: none;
  padding:0px;
  height:12px;
  border-width:1px 1px 4px 0px;
  border-style:solid;
  border-color:#000;
  border-bottom:4px solid #cf3;
  float:left;
  background:#909090;
  margin:0px;
  cursor:pointer;
}
.tlobs{border-bottom:4px solid #fff!important;}
#tlContainer li a{color:#cf3;text-decoration:none;display:block}
.current{background:#cf3!important;}
.Regionscurrent{}
.UVcurrent{}
/* This is the color for hovered items in the timeline, and should match the tooltipInProgress class */
#tlContainer li a:hover,#tlContainer li:hover {background-color:lightblue;}
#textFC {padding-bottom:20px;}
#warnGMap {
	margin:auto;
	padding:5px;
	width:225px;
	background:#000;color:#fff; border:0px solid #cf3;
  -moz-border-radius-bottomright: 6px;-moz-border-radius-bottomleft:6px;
  -webkit-border-bottom-left-radius: 6px;-webkit-border-bottom-right-radius: 6px;
  -moz-border-radius-topright: 6px;-moz-border-radius-topleft:6px;
  -webkit-border-top-left-radius: 6px;-webkit-border-top-right-radius: 6px;
}

#warnFCMaps {
	margin:0px;
	border:0px;
	padding:0px;
}

#warnings {
	background:#e7e7e7;
	padding:3px;
	float: left;
	text-align:center;
	width:533px;
}
	
#warnings img{
	border:1px solid #000;
}

.warnimglink{
	display:inline!important;float:left;padding:2px;
}

#warningsBox{
	width:100%;
}

#disclaimer {
	background:#CF3;
	padding:3px;
	clear:left;
	text-align:center;
	width:auto;
	margin-top:12px;
	font-weight:bold;
}

#panels {
	background:#000;
	color:#fff;
	padding:8px;
	clear:left;
	text-align:center;
	width:auto;
	margin-top:3px;
	font-weight:bold;
}

#panels a {
	color:#fff;
}

#panels a img{
	text-decoration:none;
	
}

#bound {filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;}

.regswitch {
background-image:url(/lib/template/bt_arw.gif);
background-repeat:no-repeat;
position:relative;
text-decoration:none;
top:2px;
}
.regswitch:hover {background-image:url(/lib/template/bt_arwmo.gif);}

.tooltip {
	background-color:#000;
	color:#FFF;
	border: 2px solid #FFF;
	padding: 3px;
	font-size:12px;
  	opacity:0.9;
  	filter:alpha(opacity=90);
	font-weight:bold;
}

/* Right menu favourites & views */
.slideBox{margin-bottom:5px;width:175px;font-weight:bold;background-color:#000;color:#fff;border:2px solid #FFF;font-size:12px;overflow:auto;}
.slideBox a{color:#cf3;}
.slideTop{padding:2px 5px;background: url(/public/pws/invent/lib/images/minus.gif) no-repeat right;cursor:pointer;}
.slideBottom {border-top:1px solid #CCC;}
.slideBottomClosed {display:none;}

.panelForm {overflow:auto; padding:0px 5px 5px 5px; line-height:1.3em;height:160px;overflow:hidden;}
.panelList {display:none;overflow:auto;overflow:hidden;} /* height was 165px.   */

#nameFav{display:none; height:180px;overflow:auto;line-height:1.3em; padding:5px;}
.favIcon{cursor:pointer;float:right;margin:4px;}
.favIconLeft{position:absolute;left:10px;bottom:10px;cursor:pointer;}
.starIcon{float:left;}
.deleteIcon{float:right;cursor:pointer;}
.favText{float:left;margin-left:2px;cursor:pointer;}
.listStyle {cursor:pointer;border-bottom:1px solid;padding:4px;height:18px;}
.listStyle:hover{background-color:#444;}
#favCb {float:left;border:none;margin:6px;padding:0;}
#hideText{float:left;margin-top:6px;}
.favsList a:link:hover{background-color:#444;} 

#wBox{
	margin-bottom:5px; width:175px;height:210px;position:absolute;top:380px;right:0px;font-weight:bold;background-color:#000;color:#fff;border:2px solid #FFF;font-size:12px;opacity:0.9; filter:alpha(opacity=90);overflow:auto;}
#wBox a{color:#cf3;}
#wContent{display:none; height:130px;overflow:auto;line-height:0.3em; padding:5px;}
.wTop{padding:2px 5px; border-bottom:1px solid #CCC;background: url(/public/pws/invent/lib/images/minus.gif) no-repeat 155px 5px;}
#backButton {margin-left:0;}

/*___________*/
/* HELP */

#helpIcon {cursor:pointer;z-index:9000;}
#wxTextIcon {cursor:pointer;z-index:9000;}
#helpBox {
	margin-bottom:5px; 
	width:550px;
	position:absolute;
	top:388px;
	left:119px;
	background-color:#000;
	color:#fff;
	border:2px solid #FFF;
	height:469px;
	opacity:0.9; 
	filter:alpha(opacity=90);
	display:none;
	z-index:9000;
}

.helpBar {
	border-bottom:0px solid #777777;
	color:#CCFF33;
	font-family:Verdana;
	font-size:14px;
	font-weight:bold;
	padding:0;
	padding-top:0.5em;
	padding-right: 0.5em;
	height:50px;
	cursor:move;
}

#helpTabs {margin-left:15px;}
#helpTabs li {float:left;
	border:2px solid #777777;
	border-bottom-width:0;
	list-style-type:none;
	margin:0 0.5em 0 0;
	padding:0.25em 0.5em 0.25em 0.5em;
	position:relative;
	top:2px;
	-webkit-border-radius-topleft:0.2em;
	-webkit-border-radius-topright:0.2em;
	-moz-border-radius-topleft:0.2em;
	-moz-border-radius-topright:0.2em;
	opacity:1; 
	filter:alpha(opacity=100);
	background-color:#777777;
}
#helpTabs li a {
	text-decoration:none;
	color:#CCFF33;
}
#helpTabs li.selected {
	background-color:black;
}
#helpTabs li.hovered {
	background-color:black;
}

#mainHelpText {
	clear:both;
	padding:8px;
	overflow:auto;
	height:400px;
	border-top:2px solid #777777;
	margin-top:0;
}
#mainHelpText h2 {margin-bottom:5px; text-align: center;}
#mainHelpText dl {}
#mainHelpText dt {color:#ccff33;margin-bottom:0.25em;font-weight:bold;}
#mainHelpText dd {margin-bottom:1em;}


#moData {
	z-index: 9002; 
	left: 200px; 
	position: absolute; 
	top: 200px;
	background:#fff;
	cursor:pointer;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border:2px solid #fff;
	height:400px;
	width:600px;
}

.databy{
	background-color:#444;
	padding: 5px;
	color:#ccc;
	font-size:12px;
	background-image: url('/public/pws/invent/weathermap/lib/images/save.png');
	background-position: 147px 3px;
	background-repeat: no-repeat;
	border-top: 4px solid #fff;
	cursor: pointer;
}

/*
#modal { position: absolute; left: 0px; top: 0px; }
body > #modal { position: fixed; }
*/