/*
 +==========================================================================+
 |         Copyright (c) Pacific Disaster Center, Maui, Hawaii, USA
 |                           All rights reserved
 +==========================================================================+
 |  FILENAME: world-style.css
 +==========================================================================+
 |  DESCRIPTION:
 |  GLOBAL ATLAS style
 +==========================================================================+
 |  HISTORY
 |  [21-Apr-2004, Steve Kunitzer] Initial version
 |  [19-May-2004, Steve Kunitzer] Altered for GISmap presentations
 |  [06-Aug-2004, Steve Kunitzer] Added TOC and Toolbar CSS table sections
 |  [15-Oct-2004, Steve Kunitzer] Added Toolbar links section
 |  [26-Oct-2004, Steve Kunitzer] Added header section
 |  [27-Oct-2004, Steve Kunitzer] Updated to look more like Atlas
 |  [27-Dec-2004, Steve Kunitzer] Added Service Picker section
 |  [21-Sep-2006, Steve Kunitzer] Changed background to white (FFFFFF)
 |  [24-Nov-2006, Steve Kunitzer] Reduced header title font size
 |  [28-Nov-2006, Steve Kunitzer] added bookmark support
    2008
    [02-12] dleong, +#header and #mpmenu
    [04-09] dleong, +#init
    2009
    [04-17] dleong, rewrote metadata section
 +==========================================================================+
*/

/* $Id: world-style.css,v 1.2 2009/04/17 21:24:31 dleong Exp $ */

/*
  CSS assistance from: http://www.w3schools.com/css/default.asp

  Colors from: http://www.w3schools.com/css/css_colornames.asp

  On that page you will find a table of color names that are
  supported by newer versions of both Netscape and Internet Explorer.

  Note: Color names are not supported by the W3C standards.
  If you want to write correct CSS you should use the Color HEX values.

  CSS checked/validated at: http://www.htmlhelp.com/tools/csscheck/

  See last section for application specific section
*/

/*****************************************************************************/

/*****************
 * Generic style *
 *****************/

body {
  background-color: #98cbf4;
  width:100%;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-weight: normal;
  font-size:12px;
  margin:0px;
  padding:0px;
}

a:link, a:active, a:visited {
  color: #003366;
  text-decoration: underline;
  font-size: 9px;
}

a:hover {
	text-decoration: none;
}
img { border:0px; }

/*****************************************************************************/

/*************
 * Top style *
 *************/
/* ------------------------------ HEADER BANNER ----------------------------- */
#header {
	height: 77px;
	width:100%;
	background: #98cbf4 url('../media/top-bg.gif') repeat-x;
	margin:0px; }
#header #ending {
	/*height: 77px;
	background: url('../media/top-ending.gif') no-repeat 100% 0%;*/ }
#header #picture {
	height: 77px;
	background: url('../media/top-picture-logo-bw.gif') no-repeat top left; }
#header #logo {
	padding: 0px;
	height: 73px;
	/*width: 392px;*/
	float: left;
	border:0px dashed #000;
	text-transform: uppercase; }
#header .title {
	position:relative;
	left:-30px;
	top:20px;
	font-family:'Trebuchet MS', Tahoma, verdana;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	padding:0px;
	color:#fff;
	font-style:italic; }
#header .subtitle {
	color:#000;
	white-space:nowrap;
	font-size:13px;
	font-weight:normal;
	font-style:normal; }
#header .iweb {
	width:180px;
	height:70px;
	margin-left:15px; }
	
.edition { 
	float:right;
	margin-right:20px;
	position:relative;
	top:-70px;
	/*background:url('/dahp/media/edition.gif') no-repeat 0px -2px;*/
	height:75px; }
.edition .content { 
	color:#800000;
	font-weight:bold;
	font-size:13px;
	padding:13 5 2 0px; }
.edition .content a { 
	color:#800000;
	font-size:13px;
	margin-left:14px; }

/* ---- SPECIAL MAP VIEWER HORIZONTAL MENU ORIGINATED FROM MAKANI PAHILI TESTER ----*/
#mpmenu { 
		position:absolute;
		top:77;
		width:100%; 
		background-color:#DDDDDD; }
#mpmenu ul{
		border: 0px dashed #adf;
		width: 100%;
		padding: 0;
		margin: 0;
		text-align: center; }
#mpmenu ul li{
		display: inline; }
#mpmenu li {
		margin: 0 1 1 1px;
		background-color:transparent; }
#mpmenu a{
		font-family: 'Trebuchet MS', verdana, tahoma;
		font-size:13px;
		font-weight:bold;
		color:#000000;
		padding: 0px 12 1 14;
		text-decoration: none;
		border-right: 0px solid #5ad; }
#mpmenu ul li a:hover{
		color:#444; }
/*****************************************************************************/

/***************************
 * Table of contents style *
 ***************************/

a.toc-link:link, a.toc-link:active, a.toc-link:visited, a.toc-link:hover {
  color: #210884;
  text-decoration: underline;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: normal;
}

a.toc-link:hover {
}

a.toc-nometadata {
  color: #000000;
  text-decoration: none;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: normal;
}

table.toc {
  white-space: nowrap;
  width: 100%;
  border-style: none;
  border-collapse: collapse;
}

tr.toc {
  background-color: transparent;
  margin: 0 0;
  text-align: left;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: normal;
}

tr.toc-highlight-active {
  background-color: #DDDDDD;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: normal;
}

.toc-refresh {
  margin: 0 0;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: bold;
}

th.toc {
  margin: 0 0;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 12px;
  font-weight: bold;
}

table.toc-help {
  white-space: nowrap;
  width: 100%;
  border-style: none;
  border-collapse: collapse;
}

tr.toc-help {
  margin: 0 0;
  text-align: left;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: normal;
}

th.toc-help {
  margin: 0 0;
  text-align: center;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: bold;
}

tr.toc-help-highlight-active {
  background-color: #DDDDDD;
  margin: 0 0;
  text-align: left;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight : normal;
}

/*****************************************************************************/

/*****************
 * Toolbar style *
 *****************/

a.toolbar-link:link, a.toolbar-link:active, a.toolbar-link:visited, a.toolbar-link:hover {
  color: #210884;
  text-decoration: underline;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: normal;
}

a.toolbar-link:hover {
}

table.toolbar {
  white-space: nowrap;
  border-collapse: collapse;
  margin-left: auto;
  margin-right: auto;
}

th.toolbar {
  text-align: center;
  vertical-align: middle;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size : 12px;
  font-weight : bold;
}

tr.toolbar {
  text-align: right;
}

td.toolbar {
  text-align: right;
  border: none;
}

tr.toolbar-active {
  background-color: #DDDDDD;
  text-align: right;
}

/*****************************************************************************/

/************************
 * Service Picker style *
 ************************/

td.servicepicker {
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 12px;
  font-weight: bold;
}

select.servicepicker {
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 9px;
  font-weight: bold;
}

/*****************************************************************************/

/******************
 * Metadata style *
 ******************/
#metadata {
	font-family: 'Trebuchet MS', tahoma, verdana;
	font-size: 13px;
	font-weight: normal;
	margin:10px;
}
#metadata table {
	margin:auto;
	border:0px;
	empty-cells:show;
	width:75%;
}
#metadata td {
	vertical-align:top;
	font-size: 13px;
}	
#metadata .title {
	text-align:center;
	font-size:22px;
	font-weight:bold;
	margin-bottom:10px;
}
#metadata .type {
	text-align:right;
	padding-right:3px;
	font-weight:bold;
	font-style:italic;
}
#metadata a {
	font-size:13px;
}
#metadata .center { 
	text-align:center; margin:auto; 
}
/*****************************************************************************/

/*******************
 * Bookmarks style *
 *******************/

table.bookmarks {
  border: 2px solid #006699;
  border-style: none;
  width: 100%;
  border-width: medium medium medium medium;
  border-spacing: 0px 0px;
  border-style: solid solid solid solid;
  border-color: #006699 #006699 #006699 #006699;
  border-collapse: collapse;
  background-color: #FFFFFF;
}

th.bookmarks {
  background-color: #006699;
  font-family: verdana, tahoma, arial, sans-serif;
  font-size: 16px;
  color: #F5DEB3;
}

tr.bookmarks-light {
  background-color: #EFEFEF;
}
#label{
  margin: 10 0 0 0
}
#input{
    margin: 0 0 0 10
}

tr.bookmarks-dark {
  background-color: #DEE3E7;
}

td.bookmarks-name {
  text-align: left;
}

td.bookmarks-type {
  text-align: center;
}

td.bookmarks-action {
  text-align: left;
}

a.bookmarks-link:link, a.bookmarks-link:active, a.bookmarks-link:visited, a.bookmarks-link {
  color: #008000;
  text-decoration: none;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 12px;
  font-weight: normal;
}

a.bookmarks-link:hover {
}

a.bookmarks-link-view:link, a.bookmarks-link-view:active, a.bookmarks-link-view:visited, a.bookmarks-link-view {
  color: #008000;
  text-decoration: none;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 12px;
  font-weight: normal;
}

a.bookmarks-link-view:hover {
}

a.bookmarks-link-delete:link, a.bookmarks-link-delete:active, a.bookmarks-link-delete:visited, a.bookmarks-link-delete {
  color: #008000;
  text-decoration: none;
  font-family: "Tahoma", "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 12px;
  font-weight: normal;
}

a.bookmarks-link-delete:hover {
}

a.bookmarks-delete-yes:link, a.bookmarks-delete-yes:active, a.bookmarks-delete-yes:visited, a.bookmarks-delete-yes {
  color: #FF0000;
  text-decoration: underline;
  font-family: verdana, tahoma, arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
}

a.bookmarks-delete-yes:hover {
}

a.bookmarks-delete-no:link, a.bookmarks-delete-no:active, a.bookmarks-delete-no:visited, a.bookmarks-delete-no {
  color: #00FF00;
  text-decoration: underline;
  font-family: verdana, tahoma, arial, sans-serif;
  font-size: 14px;
  font-weight: bold;
}

a.bookmarks-delete-no:hover {
  font-family: verdana, tahoma, arial, sans-serif;
  font-size: 12px;
  color: black;
  width: 120px;
  background-color: #FFFF99;
}

/*****************************************************************************/

/******************************
 * Application specific style *
 ******************************/

 a.header-menu, a.header-menu:link, a.header-menu:active, a.header-menu:visited {
  font-family: "Arial", "Verdana", "Helvetica";
  font-size: 12px;
  font-weight: bold;
  color: #ffffc8;
  text-decoration: none;
}

a.header-menu:hover {
  font-family: "Arial", "Verdana", "Helvetica";
  font-size: 12px;
  font-weight: bold;
  color: #C0C0C0;
  text-decoration: none;
}

a.header-title {
  font-family: "Arial", "Verdana", "Helvetica";
  font-size: 18px;
  font-weight: bold;
  font-style: italic;
  color: #210884;
  text-decoration: none;
}

tr.header-menu {
  background-color: #336699;
}

#init { 
	font-family:'Trebuchet MS', verdana, tahoma;
	font-size:14px; 
	font-style:normal; 
	padding:20px 5%; }
#init .name {
	font-style:italic;
	font-weight:bold; }
#init .note {
	font-size:13px;
	font-style:italic; }
#init h2 {
	color:#800000;
	padding:3 0px;
	font-size:16px;
	font-style:italic;
	font-weight:bold;  }
#init img {
	border:2px solid #fff; }
#init .ed {
	background:url(../media/world-edition.gif) no-repeat;
	color:#800000;
	font-weight:bold;
	font-style:italic;
	padding-left:7px; }
#init .address {
	margin-top:10px;
	padding-top:10px;
	color:#333;
	text-align:center;
	border-top:1px dotted #555;
	font-size:12px; }
#init table, tr, td {
	border:0px; }
#init td {
	font-size:14px;
	vertical-align:top; }
#init .caption, #init .caption a  {
	color: #036;
	width:330px;
	font-size:12px; }
#init .capleft {
	text-align:left;
	background:url(../media/world-capleft.gif) no-repeat left center; }
#init .capright {
	text-align:right;
	float:right; 
	background:url(../media/world-capright.gif) no-repeat right center;}