@charset "UTF-8";
@import "/css/reset.css";

/* CSS Document */

/*
	----------------------------
	HTML SELECTORS
	____________________________
*/

body { background: #666 url(/media/layout/bg.jpg); padding: 0; margin: 20px 0; color: #eee; font-family: "Courier New", Courier, monospace; font-size: 24px; line-height: 26px; }

h1 { font: 28px/28px "Courier New", Courier, monospace; letter-spacing: -2px; color: #4E333C; background-color: #ffe; display: inline; padding: 0; }

a { color: #f6d5a5; text-decoration: underline; }
a:hover, a:active { color: #fff; }

/*
	----------------------------
	LAYOUT
	____________________________
*/

#wrapper { margin: 0 auto; width: 960px; }

#logo { position: relative; }
	#logo-img {  }
	#yucca { position: relative; top: 8px; }
#slogan { margin: 16px 0; border-top: 5px solid #A99D7D; }

#content {  }
	
	#latest { color: #fffaaf; margin: 16px 0 0 0; font-size: 23px; letter-spacing: -3px; text-align: center; }
	
	#main { float: left; width: 728px; margin: 18px 0; }
		
		#squares { margin: 24px 0; }
	
		.square { width: 219px; height: 219px; margin-right: 10px; float: left; overflow: hidden; border: 3px solid #e6e6dd; }
		.square a { display: block; width: 211px; margin: 146px 0; padding: 0 4px; height: 73px; background: transparent url(/media/layout/gray.png); }
		#waveSquare { background: transparent url(http://polar.ncep.noaa.gov/waves/latest_run/nah_ecg.h000h.gif) center center no-repeat; }
		#radarSquare { background: transparent url(http://radar.weather.gov/ridge/lite/N0R/CLX_0.png) -300px -140px no-repeat; }
		#beachWeather { background: transparent url(/media/images/morris-island-light.jpg) 0 0 no-repeat; }
		
	#sidebar { float: right; width: 220px; font-family: Helvetica, Arial, sans-serif; font-size: 16px; line-height: 18px; margin: 24px 0; }
	img#sidebarAd { border: 3px solid #ccc; }
	h2#user-reports { text-indent: -9999px; background: transparent url(/media/layout/user-reports.gif) no-repeat; width: 220px; height: 40px; }
	

/*
	----------------------------
	PAGE/SECTION SPECIFIC
	____________________________
*/


/*
	----------------------------
	CLASSES
	____________________________
*/
div.clear { overflow:hidden; height:1px; clear:both; }
div.clear-right { overflow:hidden; height:1px; clear:right; }
img.alignRight { float:right; margin:0 0 15px 15px; }
img.alignLeft { float:left; margin:0 15px 15px 0; }
.error { color: #c00; }

.small { font: 11px/17px Arial, sans-serif; }
.medium { color: #aaa; }
.orange { color: #DFB40E; }

.last { margin-right: 0; }