html {
	background-image:url(../grafx/bg-site.gif);
	background-color: #bdbcbc;
	background-repeat:repeat-x;
	}

body {
	margin:0px;
	font:82%/125% trebuchet ms, lucida grande, arial, verdana, sans-serif;
	color:#000066;
	}

.siteContainer {
	padding:0px;
	width:920px;
	position:relative;
	margin:0px auto;
	display:block;
	}
	
/* original
a {color:#ba0e0e;font-weight:bold;}
a:hover  {color:#ff0000;}
*/
a {color:#082dce;font-weight:bold;}
a:hover  {color:#ba0e0e;}

ul {list-style-image:url(../grafx/list-item.gif);list-style-position:outside;position:relative;top:6px;left:-7px;margin-top:2px;margin-bottom:18px;line-height:120%;}
ul ul, ul.dash {list-style-image:url(../grafx/list-dash.gif);list-style-position:outside;position:relative;top:6px;left:-7px;margin-top:2px;margin-bottom:18px;line-height:120%;}
ul li {margin-bottom:6px;}
p {margin:0px 10px 12px 4px;}

h1, .h1 {font:130%/125% verdana, sans-serif;margin:0px 2px 1px 0px;font-weight:bold;}
h2, .h2 {font:120%/125% arial, sans-serif;margin:0px 2px 1px 0px;font-weight:bold;}
h3, .h3 {font:100%/125% tahoma, sans-serif;margin:0px 2px 1px 0px;color:#333;font-weight:bold;}
h4, .h4 {font-size:150%;margin:0px 2px 0px 0px;color:#5f8eb6;font-weight:bold;}

/*-------------- header layout classes ---------------------------------------------------------------------------------------------*/
.header {
	position:relative;
	top:0px;
	left:0px;
	width:920px;
	height:221px;
	z-index:25;
	}
	
.header #quicklinks {
	position:absolute;
	top:17px;
	left:516px;
	width:400px;
	height:28px;
	text-align:right;
	font-size:11px;
	line-height:100%;
	}
	
.header #search {
	position:absolute;
	top:52px;
	left:574px;
	width:335px;
	height:19px;
	z-index:200;
	}

.header #searchString {
	position:absolute;
	left:60px;
	font-size:11px;
	color:#447aa4;
	border:1px solid #acccd6;
	height:15px;
	width:95px;
	margin:0px;
	}
	
.header #pageTitle {
	position:absolute;
	top:204px;
	left:218px;
	width:600px;
	height:20px;
	z-index:210;
	color:#ad0c0c;
	font:135%/100% verdana, sans-serif;
	font-weight:bold;
	white-space:nowrap;
	overflow:hidden;
	font-family:lucida grande, arial, verdana, sans-serif;
	}
	
.header #pageControls {
	position:absolute;
	top:202px;
	left:831px;
	width:85px;
	height:16px;
	z-index:250;
	line-height:100%;
	}
.header #pageControls img {margin:0px;}

.header #pageLinks {
	position:absolute;
	top:179px;
	left:230px;
	width:690px;
	height:18px;
	z-index:210;
	line-height:100%;
	color:#eee;
	font-size:11px;
	font-weight:normal;
	white-space:nowrap;
	overflow:hidden;
	}
.header #pageLinks img {margin:0px 6px 0px 7px;}
.header #pageLinks a {color:#fff;font-weight:bold;text-decoration:none;}
.header #pageLinks a:hover {color:#fdecb2;}

.header #flashHeader {
	position:absolute;
	left:405px;
	top:82px;
	height:88px;
	width:500px;
	z-index:220;
	}
	
#subTitle {
	position:absolute;
	top:224px;
	left:218px;
	width:600px;
	height:20px;
	z-index:510;
	color:#374e6c;
	font:110%/100% verdana, sans-serif;
	font-weight:bold;
	white-space:nowrap;
	overflow:hidden;
	font-family:lucida grande, arial, verdana, sans-serif;
	}
	
/*-------------- content layout classes ---------------------------------------------------------------------------------------------*/
.contentContainer {
	background-image:url(../grafx/bg-sitecontainer.gif);
	background-position-y:20px;
	background-repeat:repeat-y;
	position:absolute;
	top:223px;
	width:920px;
	padding:0px;
	margin:0px;
	z-index:50;
	}
.content {
	position:relative;
	top:-3px;
	left:201px;
	width:722px;
	text-align:left;
	padding:0px;
	margin:0px;
	z-index:125;
	overflow:visible;
	}
.contentSub {
	position:relative;
	top:12px;
	left:201px;
	width:722px;
	text-align:left;
	padding:0px;
	margin:0px;
	z-index:125;
	overflow:visible;
	}
*:lang(en) .content, *:lang(en) .contentSub {float:left;} /*all non-IE7 browsers*/

/* serebra specific fix for OLC */
.content div.content {
	position:relative;
	top:0px;
	left:0px;
	width:auto;
	font-size:12px;
	color:#333333;
	font-family:Arial, Verdana, Helvetica;
	}
.content table, .contentSub table {padding:0px;margin:0px;z-index:120;}
.prop {position:relative;left:-1px;height:520px;float:left;width:1px;margin:0;}

/*-------------- home page tabs --------------------------------------------------------------------------------------------------*/
.tabOn, .tabOff {
	position:absolute;
	top:-28px;
	width:195px;
	height:36px;
	z-index:350;
	}
.tabOn:hover, .tabOff:hover {cursor:pointer;}

*:first-child+html .tabOn, *:first-child+html .tabOff {top:-33px !important;} /*IE7 only*/
*:lang(en) .content, *:lang(en) .contentSub {top:-4px !important;} /*all non-IE7 browsers*/

.tabOn div, .tabOff div {
	width:100%;
	height:38px;
	text-align:center;
	padding-top:10px;
	font-weight:bold;
	}
.tabOn {background:transparent url(../grafx/tab-left-bg-on.gif) no-repeat top left;}
.tabOn div {background:transparent url(../grafx/tab-right-bg-on.gif) no-repeat top right;}
.tabOff {background:transparent url(../grafx/tab-left-bg.gif) no-repeat top left;}
.tabOff div {background:transparent url(../grafx/tab-right-bg.gif) no-repeat top right;}

/*-------------- item layout classes ---------------------------------------------------------------------------------------------*/
/*  parent containers */
.itemBox, .itemGrayBox, itemTitleBox {
	border-left:1px solid #8bc5fd;
	padding:0px;
	margin:0px;
	vertical-align:top;
	display:table-cell;
	position:relative;
	top:-1px;
	}
.itemBox {background:transparent url(../grafx/itemBox.gif) no-repeat bottom right;background-color:#fff;}
.itemGrayBox {background:transparent url(../grafx/itemGrayBox.gif) no-repeat bottom right;background-color:#eaeaee;}
.itemTitleBox {background:transparent url(../grafx/itemTitleBox.gif) no-repeat bottom right;background-color:#eaeaee;}

.tableContainer {width:712px;margin:0px 5px 5px 5px;padding:0px;}
.itemTable {
	background:transparent url(../grafx/itemBox.gif) no-repeat bottom right;
	background-color:#fff;
	border:1px solid #8bc5fd;
	border-width:1px 0px 0px 1px;
	padding:0px;
	margin:0px;
	border-spacing:0px;
	position:relative;
	top:-2px;
	}

/* body container */
.itemBody {padding:6px 7px 8px 8px;position:relative;top:-1px;}

/* no header containers */
.itemBox .itemNoHeader, .itemGrayBox .itemNoHeader, .itemTitleBox .itemNoHeader {height:8px;position:relative;top:-1px;left:-1px;z-index:150;}
.itemBox .itemNoHeader, .itemTitleBox .itemNoHeader {background:transparent url(../grafx/itemNoHeaderLeft.gif) no-repeat top left;}
.itemGrayBox .itemNoHeader {background:transparent url(../grafx/itemGrayNoHeaderLeft.gif) no-repeat top left;}

.itemBox .itemNoHeader div, .itemGrayBox .itemNoHeader div, .itemTitleBox .itemNoHeader div {height:8px;position:relative;left:1px;}
.itemBox .itemNoHeader div, .itemTitleBox .itemNoHeader div {background: transparent url(../grafx/itemNoHeaderRight.gif) no-repeat top right;}
.itemGrayBox .itemNoHeader div {background: transparent url(../grafx/itemGrayNoHeaderRight.gif) no-repeat top right;}

/* header containers */
.itemHeader, .itemRSSHeader, .itemTable .itemHeader {height:30px;padding:0px;position:relative;top:-1px;left:-1px;z-index:150;}
.itemTable .itemHeader {top:-3px;left:-3px;}
.itemBox .itemHeader, .itemBox .itemRSSHeader, .itemTable .itemHeader {background:transparent url(../grafx/itemHeaderLeft.gif) no-repeat top left;}
.itemGrayBox .itemHeader {background:transparent url(../grafx/itemGrayHeaderLeft.gif) no-repeat top left;}

.itemBox .itemHeader div, .itemBox .itemRSSHeader div, .itemGrayBox .itemHeader div, .itemGrayBox .itemRSSHeader div, .itemTable .itemHeader div {
	position:relative;
	left:1px;
	margin:0px;
	border:0px;
	padding:10px 6px 1px 14px;
	color:#fff;
	font-weight:bold;
	height:19px;
	}
.itemTable .itemHeader div {left:5px;}
.itemBox .itemHeader div, .itemTable .itemHeader div {background: transparent url(../grafx/itemHeaderRight.gif) no-repeat top right;}
.itemGrayBox .itemHeader div {background: transparent url(../grafx/itemGrayHeaderRight.gif) no-repeat top right;}

.itemBox .itemHeader div .backToTop, .itemGrayBox .itemHeader div .backToTop, .itemTable .itemHeader div .backToTop{background-image:none;float:right;width:15px;height:14px;position:relative;top:-9px;}
.itemBox .itemRSSHeader div {background: transparent url(../grafx/itemRSSHeaderRight.gif) no-repeat top right;}
.itemGrayBox .itemRSSHeader div {background: transparent url(../grafx/itemRSSGrayHeaderRight.gif) no-repeat top right;}
.itemBox .itemRSSHeader div div, .itemGrayBox .itemRSSHeader div div {background-image:none;padding:0px;}
 
.itemHeader div a, .itemRSSHeader div a {color:#fff;font-weight:bold;text-decoration:none;}
.itemHeader div a:hover, .itemRSSHeader div a:hover {color:#fff;}

.itemTable th {font-weight:bold;padding:5px 8px 3px 5px;border-bottom:1px solid #8bc5fd;text-align:left;}
.itemTable td {padding:4px 3px 2px 4px;border-bottom:1px dotted #ccc;}
.itemTable td p {margin:0px;}
.itemTable tfoot th {margin:0px;height:3px;overflow:hidden;}

/*-------------- table layout classes ---------------------------------------------------------------------------------------------*/
.tableContainerContent {width:100%;padding:6px;}

.contentTable {
	background-color:#FFFFFF;
	border-style:solid;
	border-width:1px 1px 2px 1px;
	border-color:#999;
	}
.contentTable p {margin:0px;}

.contentTable .contentTitle {
	border-bottom:1px solid #8D8C8C;
	background-color:#bbd9f8;
	font-weight:bold;
	}

.contentTable th {
	background-color:#dedddd;
	font-weight:bold;
	padding:5px 8px 3px 4px;
	border-bottom:1px solid #DBD9D9;
	text-align:left;
	}

.contentTable td {
	padding:6px 4px 3px 4px;
	border-bottom:1px dotted #CCCCCC;
	vertical-align:top;
	text-align:left;
	empty-cells:show;
	}
.contentTable tfoot {background-color:#dedddd;}

/*-------------- image layout classes ---------------------------------------------------------------------------------------------*/
.imageBox {
	background:transparent url(../grafx/imageBox-tr.gif) no-repeat top right;
	background-color:#b6d1eb;
	padding:0px;
	margin:0px;
	}
.imageBox .imageBody {background:transparent url(../grafx/imageBox-tl.gif) no-repeat top left;padding:0px;text-align:center;}
.imageBox .imageBody img {border:1px solid #eee;margin:10px 8px 4px 8px;}

.iimageCaption {background:transparent url(../grafx/imageBox-bl.gif) no-repeat bottom left;background-color:#799ec1;height:auto;padding:0px;border-top:1px solid #fff;}
.iimageCaption div {
	background:transparent url(../grafx/imageBox-br.gif) no-repeat bottom right;
	height:auto;
	padding:3px 8px 3px 8px;
	text-align:center;
	font-size:85%;
	line-height:120%;
	color:#fff;
	font-style:italic;
	}
	
.newsImage {
	background:transparent url(../grafx/news-bg.gif) no-repeat top left;
	width:258px;
	height:197px;
	margin:2px 2px 4px 2px;
	}
#usapPhotos .newsImage {background-image:none;border:1px solid #8bc5fd;height:226px;}
.newsImage img {position:relative;top:3px;left:3px;}
	
/*-------------- subtopic and special case layout classes ---------------------------------------------------------------------------------------------*/
.topicBox {
	background:transparent url(../grafx/imageBox-br.gif) no-repeat bottom right;
	background-color:#b6d1eb;
	padding:0px;
	margin:0px;
	}
.topicBox .topicBody {background:transparent url(../grafx/imageBox-bl.gif) no-repeat bottom left;padding:8px 6px;}

.topicTitle {background:transparent url(../grafx/imageBox-tl.gif) no-repeat top left;background-color:#799ec1;height:auto;padding:0px;border-bottom:1px solid #fff;}
.topicTitle div {
	background:transparent url(../grafx/imageBox-tr.gif) no-repeat top right;
	height:auto;
	padding:5px 8px 1px 8px;
	font-style:italic;
	font-weight:bold;
	color:#fff;
	}
	
.alertBox {
	background:transparent url(../grafx/imageBox-br.gif) no-repeat bottom right;
	background-color:#e2e1e1;
	padding:0px;
	margin:0px 12px 12px 10px;
	width:95%;
	}
.alertBox .alertBody {
	background:transparent url(../grafx/imageBox-bl.gif) no-repeat bottom left;
	padding:2px 14px 10px 14px;
	font-style:italic;
	color:#333;
	}

.alertTitle {background:transparent url(../grafx/imageBox-tl.gif) no-repeat top left;background-color:#e2e1e1;height:auto;padding:0px;}
.alertTitle div {
	background:transparent url(../grafx/imageBox-tr.gif) no-repeat top right;
	height:auto;
	padding:7px 8px 1px 14px;
	font-style:italic;
	font-weight:bold;
	color:#f1000c;
	}
	
#usapNews .newsContainer, #usapFlashNews .newsContainer, #usapPhotos .newsContainer {float:left;font-size:100%;line-height:120%;}
#usapNews .newsContainer, #usapFlashNews .newsContainer {position:relative;top:-4px;}
#usapPhotos .newsContainer {position:relative;top:2px;padding-bottom:6px;}

#quickLinks h3 {background-color:#eee;border-bottom:1px dotted #ccc;padding:5px 2px 2px 4px;}
#quickLinks p {text-align:center;}
#quickLinks img {margin:5px 4px;}

#announcements .announceImage {float:left;border:1px solid #999;margin:3px 10px 0px 2px;}
#announcements .announceLink {text-align:right;border-bottom:1px solid #ccc;margin-bottom:8px;}

.newsitem {padding:4px 0px 4px 0px;clear:both;}
.newsitem img {margin-right:3px;}
.newslink {font-weight:bold;font-size:10px;}
.newstext {font-size:11px;}
	
.contentlink {font-weight:bold;font-size:11px;}
.contenttext, .contenttext-none {font-size:11px;padding:4px 0px 8px 0px;clear:both;}
.contenttext-none {border-bottom:1px dotted #7C8FB7;}

/*-------------- menu layout classes ---------------------------------------------------------------------------------------------*/
.menu {
	position:absolute;
	top:0px;
	left:0px;
	width:203px;
	padding:0px;
	float:left;
	z-index:75;
	}

.menu .menuitem, .menu .menuitem-on {
	position:relative;
	background-image:url(../grafx/menuitem-bg.gif);
	background-repeat:no-repeat;
	width:203px;
	height:33px;
	border-top:1px solid #8799a9;
	}
.menu .menuitem {background-position:0px 0px;}
.menu .menuitem:hover {background-position:0px -33px;cursor:pointer;}
.menu .menuitem-on {background-position:0px -66px;}

.menu .menuitem div, .menu .menuitem-on div {
	margin-top:10px;
	margin-left:14px;
	color:#2d66a8;
	font-weight:bold;
	font-size:11px;
	line-height:130%;
	}
	
.submenu {
	background-image:url(../grafx/menusub-bg.gif);
	background-repeat:repeat-y;
	width:203px;
	padding:0px;
	display:none;
	}
	
.submenu .subitem {
	position:relative;
	width:183px;
	border-bottom:1px solid #dadcdd;
	margin:0px 2px 0px 6px;
	}
.submenu .subitem div {margin-top:2px;margin-left:5px;}
.submenu .subitem a {color:#4c92e2;text-decoration:none;font-size:10px;}
.submenu .subitem a:hover {color:#ff5d00;}

/*-------------- footer layout classes ---------------------------------------------------------------------------------------------*/
.sitefooter, .sitefooterSub {
	background-image:url(../grafx/footer-bg.gif);
	background-repeat:no-repeat;
	position:relative;
	width:920px;
	height:119px;
	clear:both;
	padding:0px;
	overflow:visible;
	}
.sitefooterSub {top:12px;}	

/* serebra specific fix for OLC */
.contentContainer .content div.footer {
	background-image:none;
	position:relative;
	width:auto;
	height:auto;
	font-size : 12px;
	color : #333333;
	font-family : Arial, Verdana, Helvetica;
	margin-right: 5px; 
	margin-left: 5px;
	margin-top: 15px ;
	margin-bottom: 15px ;
	}
	
.sitefooter #todaysDate, .sitefooterSub #todaysDate {
	position:absolute;
	top:-48px;
	left:15px;
	width:170px;
	font-size:11px;
	color:#3f3f40;
	text-align:center;
	}
	
.sitefooter #nsf, .sitefooterSub #nsf {
	position:absolute;
	top:-20px;
	left:15px;
	width:170px;
	border-top:1px solid #c6c4c4;
	font-size:10px;
	color:#3f3f40;
	line-height:110%;
	}
	
.sitefooter #menu, .sitefooterSub #menu {
	position:absolute;
	top:3px;
	left:281px;
	width:550px;
	text-align:center;
	font-size:11px;
	color:#cccccc;
	overflow:hidden;
	}
.sitefooter #menu a, .sitefooterSub #menu a {color:#fff;text-decoration:none;}
.sitefooter #menu a:hover, .sitefooterSub #menu a:hover {color:#f5fe73;}

.sitefooter #links, .sitefooterSub #links {
	position:absolute;
	top:26px;
	left:281px;
	width:555px;
	text-align:center;
	font-size:11px;
	line-height:200%;
	}
	
.sitefooter #help, .sitefooterSub #help {
	position:absolute;
	top:78px;
	left:281px;
	width:305px;
	height:30px;
	text-align:center;
	border-right:1px solid #a8c8e6;
	}

.sitefooter #downloads, .sitefooterSub #downloads {
	position:absolute;
	top:74px;
	left:583px;
	width:255px;
	height:31px;
	text-align:center;
	}
.sitefooter #help img, .sitefooterSub #help img, .sitefooter #downloads img, .sitefooterSub #downloads img {margin-top:5px;}

.footerInfo, .footerInfoSub {
	background-color:#45628d;
	color:#fff;
	font-size:11px;
	text-align:center;
	padding:4px 3px;
	}
.footerInfoSub {position:relative;top:8px;} 
	
/*------------ webcam styles (do not alter!) -------------------------------------- */

.camContainer {
	margin-top:14px;
	width:602px;
	height:403px;
	position:relative;
	}

.camContent {
	background-image:url(../videoclipsandmaps/images/content-bg.gif);
	background-repeat:no-repeat;
	position:absolute;
	top:26px;
	left:0px;
	width:471px;
	height:353px;
	text-align:center;
	vertical-align:middle;
	}

.camMenu {
	background-image:url(../videoclipsandmaps/images/menu-camImage.gif);
	background-repeat:no-repeat;
	position:absolute;
	top:26px;
	left:471px;
	width:131px;
	height:353px;
	}

.camWeather {
	position:absolute;
	top:218px;
	left:7px;
	width:118px;
	font-family:Tahoma,Arial,Verdana,Helvetica,Sans-Serif;
	font-size:11px;
	color:#6D7993;
	text-align:center;
	line-height:105%;
	}

.camInfo {
	background-image:url(../videoclipsandmaps/images/text-bg.gif);
	background-repeat:repeat-y;
	text-align:left;
	position:relative;
	top:-5px;
	_top:0px;
	width:602px;
	}

.camFooter {position:relative;top:-20px;_top:0px;width:602px;}
.camSubcontent {font-size:12px;width:471px;height:353px;display:none;padding:8px 6px;}

.moreInfoPhoto {
	text-align:center;
	width:200px;
	background-color:#FFFFFF;
	border-width:1px 1px 2px 1px;
	border-color:#4b6aa4;
	border-style:solid;
	padding:6px;
	margin:3px 0px;
	}
.moreInfoPhoto a {font-size:12px;}

.camInfoBox {
	text-align:left;
	vertical-align:top;
	background-color:#FFFFFF;
	border-width:1px 1px 2px 1px;
	border-color:#4b6aa4;
	border-style:solid;
	padding:10px;
	margin:0px 12px 10px 12px;
	position:relative;
	top:-10px;
	_top:0px;
	}

.camStatus {
	font-family:Arial,Tahoma,Verdana,Helvetica,Sans-Serif;
	font-size:11px;
	color:#4375AE;
	position:absolute;
	left:150px;
	width:315px;
	text-align:right;
	}

.imgContainer {
	font-family:Arial, Tahoma, Verdana, Helvetica, Sans-Serif;
	font-size:12px;
	text-align:center;
	color:#315191;
	width:720px;
	height:520px;
	margin:10px;
	padding:8px;
	background-color:#FFFFFF;
	border:1px solid #133477;
	border-bottom-width:2px;
	position:relative;
	box-sizing: border-box;
	-moz-box-sizing:border-box;
	}