/* Copyright (C) www.getaforecast.com, All Rights Reserved. */

/* "Whatever:hover" fixes IE's lack of support for :hover using "csshover3.htc" in root directory and "AddType text/x-component .htc" added to the .htaccess file */
/*  http://www.xs4all.nl/~peterned/csshover.html */
body { behavior: url("csshover3.htc");} 

/* Table */
/* =================================================================================================================== */
table.HR {
	/*  ORIGINAL */
	/* background-color:#FFD39B; */
	background-color:white;
	background-image:url('../images/wave-background-squished.jpg');
	background-image:url('../images/texture0114.jpg');
	background-image:url('../images/texture0119.jpg');
	background-image:url('../images/texture-orange-gradient.jpg');
	/*  lighter background-color: #FFE3C1; */
	/*  border-collapse: collapse; */
	/*  width was 828px with quality stars, then 700px */
	width: 750px;
	font-family: Arial,Helvetica,sans-serif;
	/*  border at bottom of each table makes it 2px to help define days */
	border-top: 1px solid #EEC591;
	border-right: 1px solid #EEC591;
	border-left: 1px solid #EEC591;
}

table.HR th {text-align: left;}
table.HR td {border-bottom: 0px solid #EEC591;}
/* =================================================================================================================== */
table.HR td {border-bottom: 1px solid #EEE;}
table.HR td {border-bottom: 0px solid #EFEFFA;}

/*          hover for proper browsers */
table.HR tr:hover {background-color: #FFCB8C;}
table.HR tr:hover {background-color: #EFEFFA;}
table.HR tr:hover {background-color: #FFD39B;}
/*          active for IE6+ */
table.HR tr:active {background-color: #FFCB8C;}
table.HR tr:active {background-color: #EEE;}
table.HR tr:active {background-color: #FFD39B;}
/*          focus for IE7 and IE8 */
table.HR tr:focus {background-color: #FFCB8C;}
table.HR tr:focus {background-color: #EEE;}
table.HR tr:focus {background-color: #FFD39B;}

/* The forecast variables 	padding: 0 0.5em; */
/* =================================================================================================================== */
/* was letter-spacing: .03em */
.HRday {font:200%/1 Arial,Helvetica,sans-serif; color: Maroon; letter-spacing: 0.01 em; margin: 0;}
.HRdate {font:60%/1 Arial,Helvetica,sans-serif; color: Maroon; margin: 0; padding-bottom:20px;}
.HRtide {font:75%/1.3 Arial,Helvetica,sans-serif; color: Maroon; margin: 0;}
/* was 150% then 130% */
.HRsurfheight {font:130%/1 Arial,Helvetica,sans-serif; margin: 0;}
/* was 40% */
.HRsurftextheight {font: 50% Arial,Helvetica,sans-serif; margin: 0; padding-left:1px;}

/* The forecast table cells */
/* =================================================================================================================== */
/* HRdaycell total width 18+82=100px */
/* td.HRdaycell {padding: 0 0 0 18px; border-right: 1px solid #EEC591; background-color:#FFCB8C; width: 82px;}  */
/* td.HRdaycell {padding: 0 0 0 18px; border-right: 1px solid #EEC591; color: Maroon; background-color: #EBEEF3; width: 82px;}  */
/* new orange background to go with orange gradient */
/* was  padding: 0 0 0 18px; border-right: 1px solid #EEC591; color: Maroon; background-color: #FBEDC8; width: 82px; */
/* 100px wide (was padding: 0 0 0 10px; color: Maroon; background-color: #FBEDC8; width: 82px; border-right: 1px solid #EEC591;) */
/* height definition is for browsing with images off, so rows are not packed together */
td.HRdaycell {padding: 0 0 0 15px; color: Maroon; background-color: #FBEDC8; width: 85px; height: 198px;}
/* was 125%, then 110% */
/* Maroon is good */
/* was  font:120%/1 Arial,Helvetica,sans-serif; color: Maroon; padding: 0 0.5em; */
/* 60px wide */
td.HRtime {font:120%/1 Arial,Helvetica,sans-serif; border-right: 1px solid #EEC591; color: Maroon; padding: 0 5px 0 5px; width:50px; background-color: #FBEDC8;}
td.HRsurf {padding: 0 0 0 15px; width:135px;}
                   /* less than icon width */
td.HRwindicon {width:55px; padding: 0;}
/* was 60% (130 * 50% = 65%)                    padding-left: needed in case of W wind*/
/* was td.HRwind {font: 65% Arial,Helvetica,sans-serif; padding: 0 3px 0 2px; width: 75px; border-right: 1px solid #EEC591;} */
td.HRwind {font: 65% Arial,Helvetica,sans-serif; padding: 0 3px 0 2px; width: 70px;}
/* was 80%/1.2 */
/* was td.HRrecc {padding: 0 5px 0 5px; font:70%/1.25 Arial,Helvetica,sans-serif; width: 300px; border-right: 1px solid #EEC591;} */
td.HRrecc {padding: 0 5px 0 5px; font:70%/1.25 Arial,Helvetica,sans-serif; width: 280px;}