/* CSS Document */

/* =5 day forecast widget
-------------------------------------------------------*/
#forecastContainer {overflow-y:auto;}
#forecastTable th 
{
padding:0; font-size:0.95em;

}

#forecastTable td 
{
padding:0; text-align:center;
}
#forecastTable tbody tr:nth-child(even){background: #f3f3f3;}
#forecastTable tbody tr:hover {background:#e8e8e8; cursor:pointer;}
#forecastTable .fcLink { display:block; height:14px; text-indent:-9999px; width:8px; float:right;}
#forecastTable .fcTxt {text-indent:-9999px; display:none;font-weight:normal}
#forecastTable .fcDay {width: 30px;font-weight:normal;font-size:12px;}
#forecastTable .fcWc {width: 80px;font-weight:normal}
#forecastLocation, #uvLocation, #daylightLocation  {position:relative; padding:3px 0 0 0px;font-weight:normal}
#warningText {font-size: 0.8em; color:#333;}
#forecastContainer .widgetDate {font-size: 11.5px; text-align: left; padding: 0.8em 0 0.1em;}

#forecastContainer #warningPanel {
	background-color: #e5e5e5;
	margin: 0.5em;
	padding: 0.5em;
	border:1px solid #888;
	border-radius: 3px;
	min-height:3em;
	display:block;
	font-weight: normal;
	text-decoration: none;
	color: #000;
}
#forecastContainer #warningPanel.amber{
	background-color: #FF9933;
	border:1px solid #000;
}
#forecastContainer #warningPanel.yellow{
	background-color: #FFFF66;
	border:1px solid #000;
}
#forecastContainer #warningPanel.red {
	background-color: #cc0033;
	border:1px solid #000;
	color:#fff;
}
#forecastContainer #warningPanel .arrow {
	background:  url("/public/lib/images/graphics/spritesArrows.png") no-repeat scroll 7px -218px;
	display: block;
	float: right;
	height: 2.5em;
	width: 2em;
	margin: 0 0 0 0.5em;
}
#forecastContainer #warningPanel.red .arrow {
	background-position:7px -158px;
}
#forecastContainer #warningPanel span {
	float: left;
	margin: 0 0.5em 0 0;
}

/* TODO icon styles come from TIDE's icons.css, if/when the homepage is TIDiEd this'll need removing again */
.icon {display:block; font-style:normal; height:2.5em; margin:0 auto; overflow:hidden; text-indent:100%; white-space:nowrap; width:2.5em;}
.icon[data-type="notice"] {
	background:url(/tide/images/icons/notice.svg) no-repeat 0 0;
	-webkit-background-size:10em 7.5em;
	-o-background-size:10em 7.5em;
	-moz-background-size:10em 7.5em;
	background-size:10em 7.5em;
}
.icon[data-type="notice"].icon[data-value="yellow"].icon[data-outline="black"] {background-position:0 0;}
.icon[data-type="notice"].icon[data-value="amber"].icon[data-outline="black"] {background-position:-2.5em 0;}
.icon[data-type="notice"].icon[data-value="red"].icon[data-outline="black"] {background-position:-5em 0;}
.icon[data-type="notice"].icon[data-value="clear"].icon[data-outline="black"] {background-position:-7.5em 0;}

/* =daylight widget
-------------------------------------------------------*/
#daylightContainer {border-top:1px solid #545454;}
#daylightTable th {padding:0 .25em 5px .25em; width:33%;}
#daylightTable td {padding:0 .25em; text-align:left;}
#daylightTable .mediumDate {display:inline-block; width:100%;}
#daylightTable .dayTxt  {text-align:left;}
#daylightDPControl {font-size:1em; font-weight:bold; overflow:hidden; margin:0 8px 10px 8px;}
#daylightDPControl span {color:#445599; overflow:hidden;}
#daylightDPControl span:hover {text-decoration:underline;}
#daylightDatePicker {padding:0 0 12px 12px;}
/* Hand crafted calendar object */
.dlToday {background:#cf3; color:#000;}
#dlightCalHead {background:#363636; color:#fff; font-size:0.91em; font-weight:bold; height:16px; line-height:16px; margin:0 12px 0 0; padding:4px 4px; width:274px;}
#dlightCal {border:border-collapse; font-size:0.91em; font-weight:bold; margin:0 12px 0 0;}
#dlightCal thead th {background:#ccc; color:#000; padding:6px;	text-align:center; vertical-align:middle; width:36px;}
#dlightCal td {background:#eee; border-top:1px solid #fff; padding:6px; text-align:center; vertical-align:middle; width:36px;}
#dlightCal .dlOdd td {background:#ddd;}
#dlightCal .dlightTD:hover {background:#cce680;}
#dlPrevMth {background:url(/public/lib/images/graphics/spritesArrowsVertical.png) 0 -500px no-repeat; cursor:pointer; float:left; height:12px; margin:2px 0 0 4px; padding:0 12px; text-indent:-9999px; width:0;}
#dlPrevMth:hover {background:url(/public/lib/images/graphics/spritesArrowsVertical.png) 0 -530px no-repeat;}
#dlNextMth {background:url(/public/lib/images/graphics/spritesArrowsVertical.png) 0 -440px no-repeat; cursor:pointer; float:right; height:12px; margin:2px 0 0 0; padding:0 10px 0 8px; text-indent:-9999px; width:0;}
#dlNextMth:hover {background:url(/public/lib/images/graphics/spritesArrowsVertical.png) 0 -470px no-repeat;}
#dlCurrentMth {text-align:center; width:auto;}