/* Reset */
body,div,a,img,h1,h2,h3,h4,h5,h6,ul,ol,li,blockquote{margin:0;padding:0;border:0;outline:0;}
ul,li,ol{list-style:none;}
a{outline: none; text-decoration:none; color:#777;}

body { 
	font-family: helvetica, arial, sans-serif; 
	line-height: 1.5; 
	color: black; 
	background-color: #fafafa
}
h1, h2, h3, h4, h5, h6							{ line-height: 1.3; }
h4, h5, h6										{ font-weight: bold; }
b, strong, caption, th, thead, dt, legend		{ font-weight: bold; }
cite, dfn, em, i								{ font-style: italic; }
code, kbd, samp, pre, tt, var					{ font-family: mono-space, monospace; }

/* img												{ padding: 5px 5px 10px 5px;} */
p												{ word-spacing: 0.125em; margin-left: 10px; margin-right: 10px; text-align:justify; font-size: 90%; }
/*p+p												{ text-indent: 1.5em; }
p+p.no-indent									{ text-indent: 0; }*/
pre												{ white-space: pre; }
del												{ text-decoration: line-through; }
mark											{ background: rgba(255, 255, 0, 0.4); padding: 0 .25em; }
ins												{ color: #f00; }
small, sup, sub									{ font-size: 80%; }
big												{ font-size: 125%; line-height: 80%; }
abbr, acronym									{ font-size: 85%; text-transform: uppercase; letter-spacing: .1em; }
abbr[title], acronym[title], dfn[title]			{ border-bottom: 1px dotted black; cursor: help; }
sup, sub										{ line-height: 0; }
sup												{ vertical-align: super; }
sub												{ vertical-align: sub; }
blockquote										{ padding: 1.5em; }
ul												{ list-style: disc outside; }
ol												{ list-style: decimal outside; }
table											{ font: inherit; }

/*end preambles*/


h2 {
	font-size: 24px; color: #000E78;
}



/******* End baseline *******/

/*
General styles for most pages
*/


.wrapper		{ 
	min-height: 100%;
	height: auto;
	height: 100%;
	margin: 0 auto -100px;
}

.templateholder		{ 
	width:1000px; 
	margin-left: auto; 
	margin-right: auto;  
	background-color: white;
	min-height: 100%;
	margin: 0 auto -100px;
}

.header { 
position: relative; 
margin-top: 0px; 
background-color: white; 
width:100%; 
height: 90px;
}	

.banner { 
	position:relative; 
	z-index: 100;
	margin-top: 30px; 
	width:100%; 
	height:150px; 
	background: url(../figures/banner1.jpg); 
	font-style: italic; 
	font-size: 27px; 
	line-height: 120px; 
/* 	margin-bottom:10px; */
}		

.banner p {
	color: white; 
	font-style: normal;
	position: absolute; 
	left:30px; 
	top:30px;
}	

/*.content 			{ width:100%;  min-height: 600px; background-color: white;   margin:0 auto;  padding: 0px 0px 0px 0px; 
						position: relative; top: 70px;
					}*/

.content { 
	width:100%;
	background-color: white;   
	margin:0 auto;  
	padding: 0px 0px 0px 0px; 
	position: relative; 
	top: 25px;
}
.footer 			{ 
	clear:both; 
	background-color:#000E78; 
	height:150px;  
	position: relative; 
	width:100%; 
	color: #aaa;
	text-decoration: none;
	font-size: 80%; 
}
/*.footer li			{
	display: inline-block; 
	width: 100px; 
	font-size: 80%; 
	line-height: 30px;
}
*/
.footer li	a		{
	text-decoration: none; 
	color: #aaa;
}

.footer li	a:hover		{ 
	color: #fff;
}


#fcolumnA{
	width: 250px;
	float: left;
	padding: 10px 0 0 70px;
}
#fcolumnA h2 { 
  float: left; 
  font: bold 14px Arial, Helvetica, sans-serif; 
  /*margin: 0 0 10px 0; */
  padding: 0px 0 10px 20px; 
  height: 15px; 
  width: 250px;
}
#fcolumnA ul { 
  list-style: none; 
  margin: 0; 
  padding-top: 10px; 
}


#fcolumnA li { 
  float: left; 
  width: 250px;
  padding: 0; 
  display: list-item;
}


/* snow flakes position */
.tophmeteoexp 		{position: absolute;  left: 33px; top: 25px; color: #000E78;  }
.tophsnfknormal		{position: absolute;  left: 11px; top: 17px; }
.tophsnfkmedium		{position: absolute;  left: 0px; top: 8px; }
.tophsnfklight 		{position: absolute;  left: 14px; top: -2px; }


/* header languages */

#hl{
	position: absolute;	  
	top: 20px;
	left: 850px;
	width: 100px;
	font-size: 80%;
	}
#hl li{
	text-decoration: none;
	list-style-type: none;
	text-align: right;
	height: 24px;

	padding: 3px 10px 0px 0px;
	}
#hl li a{
	color: #000;
	}
#hl li ul{
	position: relative;
	visibility: hidden;
	text-align: right;
	z-index: 100;
	}
#hl li a:hover {
	color: #007;
	text-decoration: underline;
	width: 80%;
	}
#hl li:hover ul li{
	background: #fdfdfd;
	color: #000;
	display: block;
	visibility: visible;

	/*border: 1px solid #aaa;*/
	}


/* TOC  menu */

/* 
#tocm{
	position: relative; height:33px; width:100%; margin: 0;list-style:none; 
	}

#tocm ul{
	list-style-type: none;
	}
#tocm ul li{
	display: inline;
	padding: 2em 1.5em .5em 1.5em;
	}	
#tocm ul li a{
	text-decoration: none;
	font-weight: bold; 
	padding: .2em 1.5em .5em 1.5em;
	color:#000;
	line-height: 2;
}
#tocm ul li a:hover {
	color: #000E78;
	border-bottom: 1px solid #000E78;
	padding-bottom: -10px;
}
 */

#tocm {
z-index: 1000;
height: 100px;
}
#tocm ul {
  margin: 0;
  padding: 7px 6px 0;
  line-height: 100%;
  font-weight: bold;
  width: auto;
}
#tocm li {
  margin: 0 5px;
  padding: 0 0 8px;
  float: left;
  position: relative;
  list-style: none;
}
#tocm ul ul {
  z-index: 1000;
  display: none;
  margin: 0;
  padding: 0;
  width: 185px;
  height: 100px;
  position: absolute;
  top: 40px;
  left: 0;
}
#tocm ul ul li {
  float: none;
  margin: 0;
  padding: 3px;
}
#tocm ul ul a,
#tocm ul ul a:link {
  font-weight: normal;
  font-size: 90%;
}
#tocm ul:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#tocm a,
#tocm a:link {
  font-weight: bold;
  color: #000;
  text-decoration: none;
  display: block;
  padding: 8px 20px;
  margin: 0;
}
#tocm a:hover {
  color: #000E78;
}
#tocm .active a,
#tocm li:hover > a {
  color: #000E78;
  border-bottom: 1px solid #000E78;
}
#tocm ul ul li:hover a,
#tocm li:hover li a {
  z-index: 1000;
  background: none;
  border: none;
  display: block;
  color: #eee;
  border-bottom: 1px solid #aaa;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
}
#tocm ul ul a:hover {
  display: block;
  border-bottom: 1px solid #000E78;
}
#tocm li:hover > ul {
  display: block;

}
#tocm ul li ul li:hover {
  display: block;
}
#tocm ul li ul li a:hover {
  color:#aaa;
}

.searchtoc{
position:relative;
bottom:20px;
text-align:right;
padding: .2em 1.5em .5em 1.5em;

}

#searchfrmindex { 
	position: relative;
	width: 225px;
	height: 26px;
	left: 300px;
	bottom:35px;
	background-image: url(../figures/magnify.gif);
	background-repeat:no-repeat;
	background-position:left center;
	text-align:left;
	outline-width: 0;
	-moz-border-radius: 15px;
	border-radius: 15px;
	/*border-color: #777;*/
	font-size: 12px;
	padding: .2em .5em .5em 2.5em;
	border: 1px solid #aaa;
	color: #77a;
	line-height: 12px;
	} 


#unitsystem{
	position: relative;
	width: 75px;
	bottom: 35px;
	left: 250px;
	font-size: 11px;
	color: #77a;
}
#unitsystem li{
	text-decoration: none;
	list-style-type: none;
	text-align: right;
	height: 14px;
	padding: 3px 10px 0px 0px;
	}
#unitsystem li a{
	color: #000;
	}
#unitsystem li ul{
	position: relative;
	visibility: hidden;
	text-align: right;
	z-index: 100;
	}
#unitsystem li a:hover {
	color: #007;
	text-decoration: underline;
	width: 80%;
	}
#unitsystem li:hover ul li{
	background: #fdfdfd;
	color: #000;
	display: block;
	visibility: visible;
	}


/* Search form forecast pages*/

#searchfrm { 
	position: relative;
	width: 205px;
	height: 20px;
	bottom: 37px;
	left: 750px;
	background-image: url(magnify.gif);
	background-repeat:no-repeat;
	background-position:left center;
	text-align:left;
	outline-width: 0;
	-moz-border-radius: 15px;
	border-radius: 15px;
	font-size: 11px;
	padding: .2em .5em .5em 2.5em;
	color: #77a;
	line-height: 11px;
	border: 2px solid #00a;
	} 

#searchfrm .form_btn{
	float: none;
	position: relative;
	left: 225px;
	top: -24px;
}

#headerparag {
	position:relative;
	height:20px;
	line-height: 20px;
	font-size: 18px;
	font-weight: bold;
	font-family:"Verdana";
	text-decoration:none;
	background: #9AAABE; 
	color:#FFFFFF;
	padding: 2px 10px 2px 10px;
	vertical-align:middle;
}

#headerparagres {
	font-size: 20px;
	font-weight: bold;
	font-family:"Verdana";
	text-decoration:none;
	background: #5666ad; 
	color:#FFFFFF;
	padding: 4px 10px 7px 10px;
	vertical-align:middle;
}

#lastvis {
	margin-left:15px;
}
.panel {
padding:15px;
}

#prodindex {
/* 	position: relative; */
	padding: 5px;
	}

#prodindex p {
	font-size: 16px;
}

#forecast {
	position: relative;
	text-align: right;
	width: 40%;
	padding-top: 20px;
/* 	padding-bottom: 30px; */
	margin-left: 290px;
	margin-bottom: -30px;
}

.button {
	background-color: #e6e6e6;
	color: #000;
	padding: 10px;
	float: right;
	margin-top: -40px;
	margin-left: -15px;
}

.button:hover {
	color: #000E78;
}

#products p {
	font-size: 11px;
	margin-left: 30px;
}

#products {
	padding-top: 20px;
	padding-bottom: 10px;
	margin-right: 20px;
	margin-left: 20px;
}

#products dt {
	font-size: 17px;
	padding-bottom: 10px;
}

#products dd {
	font-size: 15px;
	border-bottom: 1px solid #000E78;
	border-bottom-right-radius: 6px;
	padding-bottom: 40px;
	margin-bottom: 22px;
}

#prod1 {
	width: 46%;
	float: left;
}

#prod2 {
	position: relative;
	width: 46%; 
	float: right;
}

#products dt a{
	text-decoration: none;
	color:#000;
}

#products dt a:hover{
	text-decoration: none;
	color:#000E78;
	font-weight: bold; 
}


/* ##########  Drp down favorites #######  */

#dirfav {
	position: relative;
	width: 200px;
	/*top:15px;*/
	height: 32px ;
	padding: 3px 10px;
	z-index:2
}

#favorites {
	width: 200px;
	margin: 0;
	padding: 3px 10px;
	position: relative;
	z-index:3;
}
#favorites li {
	list-style: none;
	float: left; 
}
#favorites li a {
	display: block;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	padding: 3px 10px;
	width: 200px;
	background: #9AAABE;
	color: #ddd;
	text-decoration: none; 
	border-radius:15px;
}
#favorites li a:hover {
	color: #fff;
	font-weight: bold;
	border-radius:15px;
}
#favorites li ul {
	display: none; 
	width: 10em; /* Width to help Opera out */
	background-color: #333;
}
#favorites li:hover ul, #favorites li.hover ul {
	display: block;
	position: absolute;
	margin: 0;
	padding: 0; 
	background-color: #fff;

}
#favorites li:hover li, #favorites li.hover li {
	float: none; 
}
#favorites li:hover li a, #favorites li.hover li a {
	color:#fff;
	background-color: #8999BE;
	border-bottom: 1px solid #fff;
}
#favorites li li a:hover {
	background-color: #7888BE; 
}


#fillcontent {
/* 	position: relative; */
	min-height: 1300px;
	min-height: auto;
	background-color: #ffffff;
	height: auto;
	height: 100%;
	}


#mapg {

	width: 950px; 
	height: 550px;
	float: left;
	margin-left:20px; 
}

#mapgs {

        width: 950px;
        height: 550px;
        margin-left:auto;
        margin-right:auto;
}

.stylepcp {color: #fff;
	display:block;
	width:40px;
	background-position: bottom;
	vertical-align:bottom;
}

#mapsites {
margin:0;
overflow-x: hidden; 
overflow-y: auto;
}


/*  Thanks to http://cssmenumaker.com/ */
#cssmenumaps {
  float: left;
  width: 100%;
  background: #efefef; background:white;
  font-size: 93%;
  line-height: normal;
  border-bottom: 1px solid #666;
  margin-bottom: 10px;
  position:relative;
}
#cssmenumaps ul {
  margin: 0;
  padding: 10px 10px 0 50px;
  list-style: none;
}
#cssmenumaps li {
  display: inline;
  margin: 0;
  padding: 0;
}
#cssmenumaps a {
  float: left;
  background: url('tableftf.gif') no-repeat left top;
  margin: 0;
  padding: 0 0 0 4px;
  text-decoration: none;
}
#cssmenumaps a span {
  float: left;
  display: block;
  background: url('tabrightfW.gif') no-repeat right top;
  padding: 5px 15px 4px 6px;
  color: #666;
}

#cssmenumaps a span {
  float: none;
}
End IE5-Mac hack#cssmenumaps .active a span,
#cssmenumaps a:hover span {
  color: #FFFFFF;
  cursor:pointer;
}
#cssmenumaps .active a,
#cssmenumaps a:hover {
  background-position: 0 -42px;
}
#cssmenumaps .active a span,
#cssmenumaps a:hover span {
  background-position: 100% -42px;
}
**************



#leftfcsts {
  position: relative;
  top: 30px;
  float:left;
  width:800px;
  padding:10px;
  background:#fff;
}


#rightfcsts {
  position: relative;
  top:-800px;
  float:right;
  width:200px;
  min-height:600px;
  padding:10px;
  background:#fff;
}


#centre80
{
margin-left:150px;
margin-right:auto;
width:700px;
/*background-color:#ddd;*/
}

#moonsun{
	position:relative; 
	width:988px; 
	height:250px; 
	left:-4px; 
	background: url(../forecasts/moonfigures/bgmoonsun.jpg); 
	background-size: 1000px 250px; 
	background-repeat: no-repeat ; 
	color:#fff; font-size:90%; 
	text-align:left; 
	border: 6px solid #007; 
	border-radius: 15px; 
	overflow: hidden;
	z-index:1;
}

#subparagraphsat{
	text-align: center;
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 50px;
}

#listregions
	{
		margin: 0;
		padding-bottom:15px;
	}

#listregions li
	{
  		display: inline;
  		list-style-type: none;
		font-weight: bold;	
		padding: 0px 5px 2px 5px;
		border-bottom: 1px solid white;
  	}
#listregions li a:hover
	{
	color:#0033FF
	}

.style4 {
	color: #660066;
	font-weight: bold;
}

#containerproducts{
	padding:10px;

}
#containerproducts a{
	text-decoration: none;
	color: #777;
	
}


#prodlist{
	padding: 10px;
	margin-left: 30px;
}
#prodlist ul{
	padding:0;
    margin:0;
    list-style-type: disc;
}
#prodlist li{
	padding-left: 1em; 
    text-indent: -.7em;
    font-size: 90%;
    list-style-type: disc;
}
/* 
#prodlist li:before {
    content: "• ";
    color: #777; 
}
 */



#tabnav {
		height: 20px;
		margin: 0;
		padding: 10px;
	}
#tabnav li {
		margin: 0; 
		padding: 0;
  		display: inline;
  		list-style-type: none;
  	}
#tabnav a {
		/*float: left;*/
		background: #f3f3f3;
		font-size: 10px;
		line-height: 14px;
		font-weight: bold;
		padding: 2px 15px 2px 15px;
		margin-right: 4px;
		border: 1px solid #ccc;
		text-decoration: none;
		color: #666;
	}
#tabnav a:hover {
		background: #fff;
	}

img.floatLeft { 
    float: left; 
    margin: 4px; 
	padding-right:8px;
}
img.floatRight { 
    float: right; 
    margin: 4px; 
	padding-left:8px;
}
.bannersd {
  position: relative;
  width: 100%;
  overflow: auto;
  padding-top: 40px;
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  
  color: rgba(255,255,255,.6);
  text-shadow: 0 0 1px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.3);
  
  /*background: #5b4d3d;*/
  box-shadow: 0 1px 2px rgba(0,0,0,.25);
}

  .bannersd ul {
    list-style: none;
    width: 300%;
  }
  .bannersd ul li {
    display: block;
    float: left;
    width: 33%;
    padding: 160px 0 110px;
    
    /*min-height: 350px;*/
    
/*    -webkit-background-size: 100% 100%;*/
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    -ms-background-size: 100% 100%;
/*    background-size: 100% 100%;*/
    
    box-shadow: inset 0 -3px 6px rgba(0,0,0,.1);
  }
    .banner ul li p {text-align: center;}
  .bannersd h1, .bannersd h2 {
    font-size: 40px;
    line-height: 52px;
    
    color: #fff;
  }
  
  .bannersd .btn {
    display: inline-block;
    margin: 25px 0 0;
    padding: 9px 22px 7px;
    clear: both;
    
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none;
    
    border: 2px solid rgba(255,255,255,.4);
    border-radius: 5px;
  }
    .bannersd .btn:hover {
      background: rgba(255,255,255,.05);
    }
    .bannersd .btn:active {
      -webkit-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5));
      -moz-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5));
      -ms-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5));
      -o-filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5));
      filter: drop-shadow(0 -1px 2px rgba(0,0,0,.5));
    }
    
  .bannersd .btn, .bannersd .dot {
    -webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
    -moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
    -ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
    -o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
  }
  
  .bannersd .dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 20px;
  }
    .bannersd .dots li {
      display: inline-block;
      width: 10px;
      height: 10px;
      margin: 0 4px;
      text-indent: -999em;
      border: 2px solid #fff;
      border-radius: 6px;
      cursor: pointer;
      opacity: .4;
      -webkit-transition: background .5s, opacity .5s;
      -moz-transition: background .5s, opacity .5s;
      transition: background .5s, opacity .5s;
    }
      .bannersd .dots li.active {
        background: #fff;
        opacity: 1;
      }