/* United States Coast Guard */
/* CG Branding CSS - For www.uscg.mil Only */
/* based on DHS/FEMA style sheets */

body {
	margin: 0;
	padding: 0;
	color: #333;
	background-color: #e5e5e5;
	font-family: Arial, Helvetica, sans-serif;
	/* Sets default font size. This odd value compensates for several browser bugs. First, setting a default font size in percent (instead of em) eliminates an IE/Win problem with growing or shrinking fonts out of proportion if they are later set in ems in other elements. Additionally, some versions of Opera will draw a default font-size of 100% too small compared to other browsers. Safari, on the other hand, has a problem with a font-size of 101%. Current "best" suggestion is to use the 100.01% value for this property */ 
	font-size:100.01%;
	}

#pagecontainer {
	margin-left: auto;
	margin-right: auto;
	padding: 0px 0px 0px 0px;
	height:auto; 
	min-height:600px;
	width:792px;
	position: relative;
	border-bottom: 1px solid #666;
	border-right: 1px solid #666;
	border-left: 1px solid #666;
	background-color: #fff;
	font-size: 0.8em;
	display: inline-block;   /* a fix for IE Mac */
}

/* next a fix for the dreaded Guillotine bug in IE6 */
/* Hides from IE-mac \*/
* html #pagecontainer {height: 1%;}
#pagecontainer {display: block;}
/* End hide from IE-mac */
	
#pagecontainer:after {
    content: ".";            /* the period is placed on the page as the last thing before the div closes */
	display: block;          /* inline elements don't respond to the clear property */ 
    height: 0;               /* ensure the period is not visible */
    clear: both;             /* make the container clear the period */
    visibility: hidden;	     /* further ensures the period is not visible */
}

#column-a {
	border-right: 1px solid #666; /* JF - Added to fix issues with long site navigtion */
	width:180px;
	min-height:486px;
	float:left;
	vertical-align: top;
	margin: 0;
	padding: 0px;
	clear: left;}
	
#column-a h2 {
	font-size: 1em;
	line-height: 0.8em;
	color: #dd3333;
	font-weight: bold;
	margin: 0;
	padding: 10px 10px 0 5px;}
	
#column-d {
	margin-left: -1px; /* JF - Added to fix issues with long site navigtion */
	width:589px; /* JF - changed from 585 to 591 for CG-3PCX site - changed to 589 for subtitle problem*/
	min-height:450px;
	height:450px;
	float:left;
	border-left: 1px solid #666;
	padding: 5px 8px 5px 10px; }
	
#column-d img { max-width:589px; }
	
#column-b[id], #column-c[id], #column-d[id]  {
	height:auto;
	}

#column-b {
	width:423px;
	float:left;
	position: relative;
	padding-right: 5px;
	}

#column-c.divided {	border-left: 1px solid #666;}
	
#column-c {
	width:170px;
	min-height:486px;
	height:450px;
	float:left;
	position: relative;
	margin: 10px -10px 0px 0px;
	padding: 0px;
	}

#column-c p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	color: #333;
	padding: 0 0 7px 0;
	}

#column-c h1 {
	font-family: "Times New Roman", Times, serif !important;
	font-size: 1.2em;
	line-height: 1.0em;
	margin: 0;
	padding: 15px 10px 0 10px;
	}
	
#column-c h2 {
	font-size: 1em;
	line-height: 0.8em;
	font-weight: bold;
	margin: 0;
	padding: 5px 10px 0 10px;
	}
	
#column-c ul {list-style-type:none; padding:0; font-size: 0.85em; color: #666; margin: 10px 10px 7px -10px;}
#column-c li {margin: 2px 2px 0 10px; padding: 0 0 0 10px;}
#column-c p {padding:0; margin:5px 0 0 10px;  font-size: 0.85em;}
#column-c ol {list-style-type:none; padding:0; font-size: 0.85em; color: #666; margin: 10px 10px 7px 10px;}
#column-c li {margin: 2px 2px 0 20px; padding:0;}

#column-e {
	width:763px;
	min-height:486px;
	float:left;
	border-left: 0;
	padding: 5px 10px;
	}

#banner {
	height: 67px;
	background: url('/global/img/flag_bar_fade_sm.jpg') #069 top left no-repeat; 
	border-right: 1px solid #666; 
	font-size: 0.85em;}
	
#navbuttons {
	padding: 0 0 0 0;
	font-size: 8pt; /* Hard coded font size to avoid browser resize text issue -jf */
	}
	
#navbuttons ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
	}
		
#navbuttons li {
	/* Width changed from 114 to accomodate CG Navigation - JF */
	width:130px;
	background-color: #CCC;
	border-bottom: 2px solid #060;
	margin: 0;
	float:left;
	text-align:center;
	border-right: 1px dashed #666;
	}
	
#navbuttons li.last {
	/* Change the width to make up for trailing space in the bar */
	/* Width changed from 92 to accomodate CG Navigation - JF */
	width:137px;
	border-bottom: 2px solid #060;
	border-right: 0px;
	}
	
#navbuttons li.current {
	background-color: #999;
	color: #fff;
	}		
		
#navbuttons li a {
	display: block;
	padding: 5px 5px 5px 0.5em;
	color: #000;
	text-decoration: none;
	width: 119px; /* Width added to have Navigation change color on roll over - JF */
	}

html>body #navbuttons a {width: auto;}

#navbuttons li a:hover {
	background-color: #666;
	color: #fff;}
	
#printlogo { display: none; }
/* TOP BANNER SEARCH AND LINKS */
/* banner navigation */
ul#bannernav {
	margin: 5px; padding: 0;
	position: absolute; top: 0; right: 0;
	list-style-type: none;
}
ul#bannernav li {
	margin: 0; padding: 0;
	display: inline;
}
ul#bannernav li a {
	margin: 0; padding: 0 5px 0 5px; 
	font-weight: bold;
	color: #fff;
	border-left: 1px solid #fff; text-decoration: none;
}
ul#bannernav li a:hover {text-decoration: underline;}
ul#bannernav li.first a {border-left: 0;}
/* end banner navigation */

/* search box */
div#searchbox {position: absolute; top: 22px; right: 10px;} /* Changed 'top' from 25 to accomodate search directory check box -jf */
div#searchbox label {color:#069;}
input#q {color: #5C5C5C; margin: 0; padding: 0;}
div#searchbox a {color: #fff; text-decoration: none; padding-left:40px;}
div#searchbox a:hover {color: #fff; text-decoration: underline; text-align:right;}
/* end search box */

#column-y { padding:20px 20px 20px 0px; }
#column-x { position:relative; border-left:1px solid #666; width:593px; padding:5px 8px 5px 10px; float:right; }
div.hov { margin-left:20px; }
	
.update {
	text-align: right; padding:10px 0px; font-style:italic;}
	
#footer {
	width:100%;
	min-height:30px;
	background-color: #fff;
	text-align:center;
	float:left;
	padding: 0 0 15px 0;
	border-top: 1px solid #000;
	margin-right:-3px;} /* Hack for IE Duplicate Charater Bug */

/* FOOTER LINKS */
#footer a:link		{font-size:0.9em; color: #666; text-decoration: none;}
#footer a:visited	{font-size:0.9em; color: #666; text-decoration: none;}
#footer a:hover		{font-size:0.9em; color: #666; text-decoration: underline;}
#footer a:active	{font-size:0.9em; color: #666; text-decoration: none;}

div#footer p {
	margin: 0; padding: 0.5em;
	font-size:0.8em;}
	
div#footer ul {
	margin: .5em 0 0 0; padding: .5em;
	list-style-type: none;
	position: relative;
	background-color: #fff;}
	
div#footer ul li {
	margin: 0; padding: .5em 1.4em;
	display: inline;}
	
	

/*******************************************************************
Text Styles
********************************************************************/
h1 {color: #dd3333;
	font-size: 1.4em;
	line-height: 1.1em;
	padding: 15px 0 0 0;}
	
.subtitle {color: #999999;
	font-size: 1.1em;
	font-style: italic;
	font-weight: bold;
	margin-top:-5px;}
	
h2 {font-size: 1.2em;
	line-height: 1.1em;
	color: #dd3333;
	font-weight: bold;
	margin-bottom: 0px;
	padding: 5px 0 0 0px;}
	
h3 {font-size: 1.0em;
	font-weight: bold;
	margin-bottom:0;}
	
h1, h2, h3 {margin-top:0;}

table {margin:10px;}

p {color: #333; padding: 0 0 7px 0;}

.small {font-size: 0.85em;}

.ruled {border-bottom:1px solid;}
	
ul {margin-top:3px;}

hr {
	border:0;
	color:#666;
	background-color:#666;
	height:1px;	}

/* DEFAULT LINKS */
a 			{color: #003366; text-decoration: underline;}
a:link		{color: #003366; text-decoration: underline;}
a:visited	{text-decoration: underline;}
a:hover		{color: #666666; text-decoration: underline;}
a:active 	{color: #666666; text-decoration: underline;}

a.backtotop {
	margin:0px 0px 5px 0px;
	background:transparent url(/global/img/back2top.gif) no-repeat 0px 3px;
	padding:0px 0px 5px 15px;
	font-size: 8pt;
	font-weight: bold;
	text-decoration:none;}	
	
a:hover.backtotop {
	margin:0px 0px 5px 0px;
	background:transparent url(/global/img/back2top_hover.gif) no-repeat 0px 3px;
	padding:0px 0px 5px 15px;
	font-size: 8pt;
	font-weight: bold;
	text-decoration:underline;}
	
a.more {
	padding-right:10px;
	background:transparent url(/global/img/more.gif) no-repeat;
	background-position: 100% 50%;
	font-size: 8pt;
	font-weight: bold;
	text-decoration:none;}	
	
a:hover.more {
	background:transparent url(/global/img/more_hover.gif) no-repeat;
	background-position:100% 50%;
	padding-right:10px;
	font-size: 8pt;
	font-weight: bold;
	text-decoration:underline;}
	
a.pdf {
	padding-right:20px;
	background:transparent url(/global/img/pdf.gif) no-repeat;
	background-position: 100% 50%;
	line-height:1.5em;}	

/* Styles for Page Navigation */
.navfocus, #defaultnav, #homepage {font-weight: bold;}
ul#MenuBar1 li.select {background: #eaeaea;}

#opt1 .opt1, #opt2 .opt2, #opt3 .opt3, #opt4 .opt4, #opt5 .opt5, #opt6 .opt6, #opt7 .opt7, #opt8 .opt8, #opt9 .opt9, #opt10 .opt10, 
#opt11 .opt11, #opt12 .opt12, #opt13 .opt13, #opt14 .opt14, #opt15 .opt15, #opt16 .opt16, #opt17 .opt17, #opt18 .opt18, #opt19 .opt19, #opt20 .opt20,
#opt21 .opt21, #opt22 .opt22, #opt23 .opt23, #opt24 .opt24, #opt25 .opt25, #opt26 .opt26, #opt27 .opt27, #opt28 .opt28, #opt29 .opt29, #opt30 .opt30 {
	background: #eaeaea;}

/* Download style for BIOS */
#download {float: right;}

#download a { 
	text-decoration: none;
	font-size: .9em;
	padding: 5px; 
	display: block;}
	
#download a:hover {background-color: #CCCCCC;}
/* End Download style */


/* Styles for floating images */
img.left {
	margin:0px 10px 5px 0px;
	border:0px;
	float:left;
	}
	
img.right {
	margin:0px 0px 5px 10px;
	border:0px;
	float:right;
	}
	
img.middle {
	border:0px;
	display: block;
	margin: 5px auto;
	text-align:center;
	}
	
img#sitebanner {
	margin-top:-5px; 
	margin-right: -10px; 
	margin-left: -10px;
	max-width: 611px;
	overflow:hidden;}

/* NEW Horizontal Quicklinks */
ul.quicklinks {
	list-style-type: none;
	padding: 0px;
	margin-left: 1px;
	margin-bottom: 5px;
	margin-right:1px;
	font-size:.85em;
	text-align:center;	}
	
ul.quicklinks li {
	display:inline;
	border-left: 1px solid;
	border-right: 1px solid;
	margin-left: -1px;
	padding-left: 3px;
	padding-right: 2px;}

/* Style for UL */
ul.leftsidebar {
	list-style-type:none;
	margin: 10px 10px 7px -10px;
	padding: 10px 0 10px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size: 0.8em;
	color: #666;	}
	
ul.leftsidebar li {
	margin: 0px 2px 7px 10px;
	padding: 0 0 0 10px;	}

.block { 
	padding: 3px; 
	background-color: #CCC; /* dhsLightGray */
	border-top: 1px solid #999; /* dhsGray */
	border-left: 2px solid #999; 
	border-bottom: 2px solid #999;
	border-right: 1px solid #999;}

/* Styled Table */
.datatable{border-collapse: collapse;  border: 1px solid #C1DAD7; margin:5px 0; padding:0;}

.datatable th {font: bold 0.85em Arial; color: #6D929B; letter-spacing: 1px; text-transform: uppercase; text-align: center; padding: 6px 6px 6px 12px; background: #CAE8EA url(/global/img/datatable_bg_header.jpg) no-repeat; border: 1px solid #C1DAD7;}

.datatable th.nbg {font: bold 0.85em Arial; color: #666; letter-spacing: 1px; text-transform: uppercase; text-align: center; padding: 6px 6px 6px 12px; background: #eaeaea;}

.datatable td{border: 1px solid #C1DAD7; font: 0.9em Arial; color: #4f6b72; padding: 6px 6px 6px 12px;}

.datatable tr.r0 {background-color: #F5FAFA;}

.datatable tr.r1 {background-color: #ffffff;}

.datatable td.col {font: bold 0.85em Arial; color: #6D929B; letter-spacing: 1px; text-transform: uppercase; text-align: center; padding: 6px 6px 6px 12px; background: #CAE8EA url(/global/img/datatable_bg_header.jpg) no-repeat; border: 1px solid #C1DAD7;}

.datatable td.nbg {font: bold 0.85em Arial; color: #666; letter-spacing: 1px; text-transform: uppercase; text-align: center; padding: 6px 6px 6px 12px; background: #eaeaea;}

/* Homeland Security Colors */
.dhsBlue		{color: #003366;}
.dhsBlueLight	{color: #006699;}
.dhsGray		{color: #999999;}
.dhsGrayDark	{color: #666666;}
.dhsGrayLight	{color: #CCCCCC;}
.dhsGreen		{color: #669900;}
.dhsGreenDark	{color: #006600;}
.dhsRed			{color: #dd3333;}

.femaGray 		{color: #eaeaea;}

.dhsBlueBk		{background-color: #003366;}
.dhsBlueLightBk	{background-color: #006699;}
.dhsGrayBk		{background-color: #999999;}
.dhsGrayDarkBk	{background-color: #666666;}
.dhsGrayLightBk	{background-color: #CCCCCC;}
.dhsGreenBk		{background-color: #669900;}
.dhsGreenDarkBk	{background-color: #006600;}
.dhsRedBk		{background-color: #dd3333;}

.femaGrayBk 	{background-color: #eaeaea;}

/* 508 Accessibility Styles */
.hidden, .form-info {position: absolute; left: 0px; top: -500px; width: 1px; height: 1px; overflow: hidden; }
a.cgskip {
	left:-999px;
	position: absolute;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	z-index: -999;
}
a.cgskip:focus, a.cgskip:active {
	color: #fff;
	background-color: #000;
	left: auto;
	width: 30%;
	height: auto;
	overflow: auto;
	margin: 10px 35%;
	padding: 5px;
	border-radius: 15px;
	border: 4px solid yellow;
	text-align: center;
	z-index: 999;
}

/* Biography Header Style */
.bioHead {
	padding: 0px 100px; 
	background:url(img/bio_head.jpg) 0px 0px no-repeat; 
	height:105px; 
	margin: 0px -10px; 
	text-align:center;
}

/* jquery-infiniate-carousel styles */
#viewport{         
	width: 589px; 
	height:280px;
	overflow:hidden; 
	position:relative; 	 }
#viewport ul{         
	position: relative;         
	padding: 0px;
	margin:0px; } 
#viewport li{         
	width: 589px;         
	height: 280px;         
	float: left;         
	list-style: none; 
	margin:0; }
#simplePrevious, #simpleNext { 
	text-decoration:none; }

@charset "UTF-8";

/* SpryMenuBarVertical.css - version 0.6 - Spry Pre-Release 1.6 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

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

 LAYOUT INFORMATION: describes box model, positioning, z-order

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

/* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
ul.MenuBarVertical
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	cursor: default;
	width: auto;
}
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
{
	z-index: 1000;
}
/* Menu item containers, position children relative to this container and are same fixed width as parent */
ul.MenuBarVertical li
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	position: relative;
	text-align: left;
	cursor: pointer;
	width: 100%;
	border-bottom: 1px solid #036;
	background:#FFFFFF;
}
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
{
	margin: -1px 0 0 100%;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	position: absolute;
	z-index: 1020;
	cursor: default;
	width: 170px;
	left: -1000em;
	top: 0;
}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarVertical ul.MenuBarSubmenuVisible
{
	left: 0;
}
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
{
	width: 170px;
}

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

 DESIGN INFORMATION: describes color scheme, borders, fonts

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

/* Outermost menu container has borders on all sides */
ul.MenuBarVertical
{
	margin:0px; padding:0px;
}
/* Submenu containers have borders on all sides */
ul.MenuBarVertical ul
{
	border: 1px solid #666;
}
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarVertical a
{
	display: block;
	cursor: pointer;
	padding: 0.5em 0.75em 0.5em 0.4em;
	text-decoration: none;
}
ul.MenuBarVertical a:visited
{
	text-decoration:none;
	}
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
{
	text-decoration: underline;
	color: #036;
}
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
{
	text-decoration: none;
}

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

 SUBMENU INDICATION: styles if there is a submenu under a given menu item

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

/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenu
{
	background-image: url(/global/img/SpryMenuBarRight.gif);
	background-repeat: no-repeat;
	background-position: 97% 50%;
}

/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
{
	background-image: url(/global/img/SpryMenuBarRightHover.gif);
	background-repeat: no-repeat;
	background-position: 97% 50%;
}

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

 BROWSER HACKS: the hacks below should not be changed unless you are an expert


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

/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
{
	position: absolute;
	z-index: 1010;
	filter:alpha(opacity:0.1);
}
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
{
	ul.MenuBarVertical li.MenuBarItemIE
	{
		display: inline;
		f\loat: left;
		background: #FFF;
	}
}