﻿/**********************************
 * TITLE: Gila Screen Stylesheet  * 
 * URI  : gila/gila-screen.css    *
 * MODIF: 2003-Apr-30 19:09 +0800 *
 * MODIF: 2008-June-20 17:04      *
 **********************************/

body {
  color: black;
  background-color: rgb(243,242,235);
  font-family: tahoma, verdana, helvetica, arial, sans-serif;
  font-size: 80%;  /* Enables font size scaling in MSIE */
  margin: 0;
  padding: 0;
}

html > body {
  font-size: 9pt;
}

.doNotDisplay {
  display: none !important;
}

.picfl {
	   float:left;
	   padding-right: 5px;
	   position: relative;
}

.picfr {
	   float:right;
	   padding-left: 5px;
	   position: relative;
}

.picfc {
	   text-align: center;
	   padding-left: 5px;
	   padding-right: 5px;
	   position: relative;
}


/* ##### Header ##### */

/* ##### CHANGE background-color to change header color, hex code is OK ##### */
/* ##### Hex Color Chart - http://www.hypersolutions.org/pages/rgbhex.html  ##### */

#header {
  color: inherit;
  background-color: #3A66A7;
}

.headerTitle {
  margin: 0;
  padding: 0.25em 4mm 0.25em 4mm;
}

.headerTitle a {
  color: black;
  background-color: transparent;
  text-decoration: none;
  font-size: 110%;  /* For MSIE */
  font-weight: bold;
  font-style: italic;
}

.headerTitle > a {
  font-size: 110%;  /* For fully standards-compliant user agents */
}

.headerTitle span {
  color: white;
  background-color: transparent;
  font-weight: normal;
}

.headerTemp {
  font-size: 36px;
  font-weight: bold;
  position: absolute;
  right: .5ex;
  top: 0.18em;
}

[class~="headerTemp"] {
  top: 0.18em;  /* For fully standards-compliant user agents */
}

.subHeader {
  color: white;
  float: left;
  clear: left;
  position: relative;
  background-color: black;
  font-size: 109%;
  margin: 0;
  padding: 0.5ex 1ex;
}

.subHeaderRight {
  color: white;
  background-color: black;
  font-size: 109%;
  text-align: right;
  margin:  0;
  padding: 0.5ex 2ex;
}

.subHeader a {
  color: white;
  background-color: black;
  text-decoration: none;
  font-weight: bold;
  margin: 0;
  padding: 0 1ex;
}

.subHeader a:hover {
  color: black;
  background-color: white;
}


/* ##### Left Side Bar ##### */

.leftSideBar {
  width: 9.5em;
  float: left;
  clear: left;
}

.leftSideBar .sideBarTitle {
  color: rgb(64,64,64);
  background-color: rgb(230,223,207);
  font-weight: bold;
  margin: 0;
  padding: 0.8ex 1ex;
}

.leftSideBar ul {
  list-style-type: none;
  list-style-position: outside;
  margin: 0 0 1em 0;
  padding: 0;
}

.leftSideBar li {
  margin: 1ex;
  padding: 0 0 0 0;
}

.leftSideBar a {
  color: rgb(64,64,64);
  background-color: transparent;
  text-decoration: none;
}

.leftSideBar a:visited {
  color: rgb(112,128,144);
  background-color: transparent;
  text-decoration: none;
}

.leftSideBar a:hover {
  color: rgb(166,140,83);
  background-color: transparent;
  text-decoration: none;
}

.leftSideBar .sideBarText {
  color: black;
  background-color: transparent;
  line-height: 1.25em;
  margin: 1ex 0.25ex 1.5em 0.75ex;
  padding: 0;
  display: block;
}

.leftSideBar .sideBarText a {
  text-decoration: underline;
  font-weight: bold;
}

.leftSideBar .sideBarText a:visited {
  text-decoration: underline;
  font-weight: bold;
}

.leftSideBar .sideBarText a:hover {
  text-decoration: none;
}

.leftSideBar .thisPage {
  color: rgb(64,64,64);
  background-color: transparent;
  font-weight: bold;
}

/* ##### Main Copy ##### */

/* Basic Setup and commonly used elements */
#wuwrap { background-color: #EEE; color: #000; font-size: 11px; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; margin-top: 0px; margin-left: 0px; margin-right: 0px; 

text-align: left;}

/* These control the "general links throuout the page */
#wuwrap a { color: #213F9A; text-decoration: underline; }
#wuwrap a:hover { color: #213F9A; text-decoration: none; }

#wuwrap #content { padding-left: 10px; padding-right: 5px; background-color: #FFF; clear: both; width: 100%; }

/* Some general purpose styles */
#wuwrap TD.vaT { vertical-align: top; }
#wuwrap TR.vaT TD { vertical-align: top; }
#wuwrap TD.vaM { vertical-align: middle; }
#wuwrap TR.vaM TD { vertical-align: middle; }
#wuwrap #full { width: 88%; }
#wuwrap .full { width: 88%; }
#wuwrap .center { margin-left: auto; margin-right: auto; }
#wuwrap .taL { text-align: left; }
#wuwrap .taC { text-align: center; }
#wuwrap .taR { text-align: right; }
#wuwrap .nobr { white-space: nowrap; }
#wuwrap .tm10 { margin-top: 10px; }
#wuwrap .tm20 { margin-top: 20px; }
#wuwrap .b { font-weight: bold; }
#wuwrap .fwN { font-weight: normal; }
@media print {
  .noprint { display: none; }
}

/*  The top heading */
#wuwrap .heading { border: 0px; padding: 0px; margin: 0px; font-size: 18px; font-weight: bold; font-style: normal; color: #000; }

/*  The black line etc below the heading */
#wuwrap .titleBar { padding: 2px; background-color: #F5F5F5; color: #333; border-top: 1px solid #333; margin-bottom: 10px; }

/* The colored bar at the top of each section */
#wuwrap .colorTop { border-width: 0px 0px 0px 0px; border-collapse: collapse; border-spacing: 0px; table-layout: fixed; width: 100%; }
#wuwrap .colorTop .hLeft { padding:0; height:20px; width:20px; background-color: #d2d0d3; border-top: 1px solid #808080; border-bottom: 1px solid #808080; border-left: 

1px solid #808080; }
#wuwrap .colorTop .hCenter { height: 20px; line-height: 20px; width: auto; font-size: 14px; font-weight: bold; color: #000; background-color: #d2d0d3; border-top: 1px solid 

#808080; border-bottom: 1px solid #808080; }
#wuwrap .colorTop .hRight { padding:0; height:20px; width:20px; font-size: 12px; color: #FFF; background-color: #d2d0d3; border-top: 1px solid #808080; border-bottom: 

1px solid #808080; border-right: 1px solid #808080; }
#wuwrap .colorTop .hMenu { padding:0; height:20px; font-size: 12px; color: #000; background-color: #d2d0d3; text-align: right; background-color: #d2d0d3; border-top: 1px 

solid #808080; border-bottom: 1px solid #808080; }
#wuwrap .colorTop .sLeft { padding: 0; height: 6px; width:20px; }
#wuwrap .colorTop .sCenter { padding: 0; height: 6px; line-height: 6px; font-size: 6px; }
#wuwrap .colorTop .sRight { padding: 0; height: 6px; width:20px;  }

/* The menu for selecting units.  This must be an id in order to gain precedence */
#wuwrap #unitmenu a:link {color: #404040; text-decoration: none;}
#wuwrap #unitmenu a:visited{color: #404040; text-decoration: none;}
#wuwrap #unitmenu A:hover {color: #996666; text-decoration: none;}
#wuwrap #unitmenu A:active {color: #996666; text-decoration: none;}

/* The sides of the main colored box */
#wuwrap .colorBox { border-right: 1px solid #808080; border-left: 1px solid #808080; margin: 0; padding: 0 5px 0 5px; }
#wuwrap .colorBox .noGap { height: 1px; line-height: 1px; }

/* Closes off the bottom of the main box */
#wuwrap .colorBottom { height: 10px; width: 100%; }
#wuwrap .colorBottom .bLeft DIV { height: 10px; width: 10px; border-top: 1px solid #808080; }
#wuwrap .colorBottom .bCenter DIV { height: 10px; border-top: 1px solid #808080; }
#wuwrap .colorBottom .bRight DIV { height: 10px; width: 10px; border-top: 1px solid #808080; }

/* The Date selector */
#wuwrap .selectorBox { background-color: #F5F5F5; border-top: 1px solid #CCC; }

/* The table that holds the date selector(s) */
#wuwrap .dateTable SPAN { margin: 0 10px 0 10px; white-space: nowrap; }
#wuwrap .dateTable TD { vertical-align: middle; padding: 1px; }
#wuwrap .dateTable A { color: #172C6C; display: block; width: 100px; margin: 2px; text-align: center; }
#wuwrap .dateTable .dateForm { margin-left: auto; margin-right: auto; }
#wuwrap .dateTable .dateForm SELECT { margin: 1px; }

/* The tabs for daily, weekly etc. */
#wuwrap #typeTable { margin-top: 10px; }
#wuwrap #typeTable TD { width: 20%; text-align: center; padding: 2px; }
#wuwrap #typeTable TD.activeTab { color: #000; border-top: 1px solid #A2A2A2; border-right: 1px solid #A2A2A2; border-left: 1px solid #A2A2A2; font-weight: bold; 

background: #FFF url(./wuicons/GrayGradient.png) repeat-x top; font-size: 13px; }
#wuwrap #typeTable TD.inactiveTab { border-bottom: 1px solid #A2A2A2; }
#wuwrap #typeTable TD.inactiveTab A { color: #5D5D5D; }

/* The table for the top summary section */
#wuwrap .summaryTable { width: 100%; }
#wuwrap .summaryTable THEAD TR TD { border-bottom: 1px solid #999; font-weight: bold; padding: 2px; background-color: #F5F5F5; }
#wuwrap .summaryTable TBODY TR TD { border-bottom: 1px dotted #CCC; padding: 3px; }
#wuwrap .summaryTable TBODY TR:hover TD { background-color: #FFC; }

/* The lower table when in "today" mode */
#wuwrap .dailyTable { width: 100%; }
#wuwrap .dailyTable THEAD TR TD { padding: 5px; background-color: #CCC; color: #000; font-weight: bold; border-top: 1px solid #EEE; border-left: 1px solid #EEE; 

border-right: 1px solid #999; border-bottom: 1px solid #999; background-image: url(./wuicons/mgray50.png); background-repeat: repeat-x; }
#wuwrap .dailyTable TBODY TR TD { color: #333; padding: 1px; padding-left: 5px; padding: 5px; border-bottom: 1px solid #CCC; }
#wuwrap .dailyTable TBODY TR:hover TD { background-color: #FFC; }

/*  Lower table when in week, month, year etc mode  */ 
#wuwrap .obsTable THEAD TR TD { font-weight: bold; background-color: #cdc191; border-top: 5px solid #FFF; padding: 2px; text-align: center; }
#wuwrap .obsTable TBODY TR TD { border-bottom: 1px dotted #CCC; padding: 3px; text-align: center; }
#wuwrap .obsTable TBODY TD.date { text-align:left; }
#wuwrap .obsTable TBODY TR TD.HdgLt { border-bottom: 2px solid #CCC; }
#wuwrap .obsTable TBODY TR TD.HdgDk { border-bottom: 2px solid #CCC; background-color: #F5F5F5; }
#wuwrap .obsTable TBODY TR TD.Left {  border-left: 1px solid #CCC; }
#wuwrap .obsTable TBODY TR TD.Right {  border-right: 1px solid #CCC; }
#wuwrap .obsTable TBODY TR TD.BodyDk { background-color: #F5F5F5; }
#wuwrap .obsTable TBODY TR:hover TD { background-color: #FFC; }

/* The "Page Top links */
#wuwrap .pageTop { text-align: right; margin: 10px 0 10px 0; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 11px; }
#wuwrap .pageTop A { color: #00F; }

/* Optional right Column if used */
#wuwrap .rightCol { margin-left: 10px; }
#wuwrap .rightCol .rtTop  { width: 300px; border: 0; margin: 0; padding: 0; border-bottom: 1px solid #808080; }
#wuwrap .rightCol .rtBottom  { width: 300px; border: 0; margin: 0; padding: 0; border-top: 1px solid #808080; }
#wuwrap .rightCol .contentBox { width: 300px; border: 0; margin: 0; padding: 0; border-right: 1px solid #808080; border-left: 1px solid #808080; }

/* The link to the csv file at the bottom of the page */
#wuwrap #csvLink a { display: inline; padding: 1px 10px 1px 10px; border: 1px solid #808080; background-color: #EBE5D8; color: #000; margin: 10px 0 10px 0; 

text-decoration: none; }
#wuwrap #csvLink a:hover { border: 1px solid #808080; background-color: #F5F5F5; }

#wuwrap .bottomBar { padding-left: 5px; padding-top: 2px; padding-bottom: 2px; margin: 0px; font-size: 13px; font-weight: bold; background-color: #d2d0d3; color: #000; 

border: 1px solid #808080; }


/* Wunderground logo */
#wuwrap .logo { height: 25px; width: 53px; background-image: url(./wuicons/logo_footer.gif); background-repeat: no-repeat; }

/* End WU-History.css */

/* ##### Footer ##### */

#footer {
  color: black;
  background-color: rgb(230,223,207);
  font-size: 92%;
  text-align: center;
  line-height: 1.25em;
  margin: 0;
  padding: 1em 4mm 1em 4mm;
  clear: both;
}

#footer div {
  margin: 0;
  padding: 0 0 1ex 0;
}

#footer a {
  color: black;
  background-color: transparent;
  text-decoration: underline;
  font-weight: bold;
}

#footer a:visited {
  color: rgb(112,128,144);
  background-color: transparent;
  text-decoration: underline;
  font-weight: bold;
}

#footer a:hover {
  text-decoration: none;
}
