/* CTTSO.GOV Main Stylesheet
Last updated on 09-16-2008
by matthew.hawes@mantech.com */

/*-------------------------------------------------------------------------------------------------------------- */
/* Reset Styles ------------------------------------------------------------------------------------------------ */

/* Reset Reloaded technique developed by Eric Meyer (http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/) */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: inherit;
	font-family: Tahoma, Arial, Verdana, Helvetica, sans-serif;
	vertical-align: baseline;
}

ol, ul {
	list-style: none;
}

table { /* tables still need 'cellspacing="0"' in the markup */
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}

blockquote, q {
	quotes: "" "";
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Accessibility  ---------------------------------------------------------------------------------------------- */

#skipToMain a:link, /* skip to main content, and skip to secondary navigation links */
#skipToMain a:visited,
#skipToMain a:hover,
#skipToMain a:active {
position:absolute;
left:0px;
top:-500px;
width:1px;
height:1px;
overflow:hidden;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Main Content Structure and Layout --------------------------------------------------------------------------- */

body {
	background-color: #434446;
	text-align: center; /* center the entire page for IE */
	font-size:62.5%; /* set the default font size to the equivalent of 10px */
	font-family: Tahoma, Arial, Verdana, Helvetica, sans-serif;
}

#wrapper { /* this wrapper contains the 2-column background, and is centered in IE by the body element */
	text-align: left; /* reset text alignment to left */
	width: 770px;
	margin-left: auto; /* auto margins center the wrapper in modern browsers */
	margin-right: auto;
	background-color: #040E31;
	background-image: url(../graphics/faux-columns-bg.gif); /* creates the faux-columns which span the entire height of the content */
	background-repeat: repeat-y;
	background-position: left top;
}

#branding { /* the branding / banner */
	line-height: 0px; /* this removes 1px whitespace under the banner */
	background-color: #BCBDBF;
	position: relative; /* added for search box display */
}

#pageWrapper { /* this wrapper contains the background image behind the main navigation and the main content area */
	background-image: url(../graphics/main-nav-bg.gif); /* a red bar under the branding, holding the main navigation */
	background-repeat: no-repeat;
	background-position: left top;
}

.clearFloats { /* non-semantic div for clearing floats */
	clear: both;
	height: 1px;
	line-height: 1px;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Search Box Layout ------------------------------------------------------------------------------------------- */

#cttsoSearch {
	position: absolute;
	top: 20px;
	text-align: right;
	right: 2px;
}

#branding #cttsoSearch #query-field {
	font-size: 10px;
	height: 14px;
	line-height: 12px;
	color: #FFFFFF;
	background-color: #040E31;
	border: 1px solid #FFFFFF;
	vertical-align: middle;
	margin: 1px;
	padding: 1px;
}

#cttsoSearch #searchButton {
	font-size: 11px;
	color: #FFFFFF;
	background-color: #040E31;
	border: 1px solid #FFFFFF;
	height: 18px;
	line-height: 12px;
	vertical-align: middle;
	margin: 1px;
	padding: 1px;
}

#cttsoSearch label {
	font-size: 10px;
	color: #FFFFFF;
	vertical-align: middle;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Main Navagation --------------------------------------------------------------------------------------------- */

#mainNav {
	height: 60px;
	float: left;
	width: 220px;
}

#mainNav li {
	float: left;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Sub-Navagation ---------------------------------------------------------------------------------------------- */

#subNav { /* column floated to the left */
	float: left;
	width: 200px;
	clear: left;
}

#subNav #menu li { /* buttons for pages */
	background-image: url(../graphics/sub-nav-button.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 2.7em;
	font-size: 11px;
}

#subNav #menu li a:link,
#subNav #menu li a:visited,
#subNav #menu li a:hover,
#subNav #menu li a:active {
	font-weight: bold;
	text-decoration: none;
	color: #062070;
	display: block;
	margin-left: 5px;
	padding-top: 6px;
	padding-bottom: 5px;
	padding-left: 20px;
	zoom: 1.0; /* haslayout fix for IE to remove extra padding */
}

#subNav #menu li#currentPage { /* highlight for current page */
	background-image: url(../graphics/sub-nav-button-current.gif);
}

#subNav #menu li#currentPage a { /* highlight for current page */
	color: #362a0a;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Sidebar Callout Boxes --------------------------------------------------------------------------------------- */

#subNav div.calloutBox { /* general callout boxes on left sidebar */
	background-image: url(../graphics/textbox.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-bottom: 10px;
	margin-bottom: 20px;
	margin-top: 20px;
	position: relative; /* fix for IE6 peekaboo bug */
}

#subNav div.calloutBox h3 { /* callout box headings */
	font-weight: bold;
	font-size: 11px;
	padding-left: 25px;
	color: #062070;
}

#subNav div.calloutBox h3.small { /* for one line of heading text */
	background-image: url(../graphics/textbox-title.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 8px;
	height: 20px;
}

#subNav div.calloutBox h3.medium { /* for two lines of heading text */
	background-image: url(../graphics/textbox-title-big.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 10px;
	padding-bottom: 10px;
	height: 28px;
}

#subNav div.calloutBox h3.large {  /* for three lines of heading text */
	background-image: url(../graphics/textbox-title-big.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 4px;
	padding-bottom: 4px;
	height: 40px;
}

#subNav div.calloutBox p {
	margin-bottom: 5px;
	margin-top: 5px;
	position: relative; /* fix for IE6 peekaboo bug */
	/* background-image: none; */ /* fix for IE6 peekaboo bug - this may have no effect */
	font-size: 11px;
	padding-right: 10px;
	padding-left: 25px;
}
#subNav .calloutBox ul {
	font-size: 11px;
	padding-left: 25px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-top: 5px;
}
#subNav .calloutBox li {
	background-image: url(../graphics/red-arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
}

#subNav .calloutBox .calloutBoxImage {
	position:relative;
	float:left;
	margin-right:10px;
	margin-bottom:5px;
}

#subNav p a:link,
#subNav p a:visited,
#subNav p a:active,
#subNav .calloutBox a:link,
#subNav .calloutBox a:visited,
#subNav .calloutBox a:active {
	color: #981b1e;
	text-decoration: none;
}

#subNav p a:hover,
#subNav .calloutBox a:hover {
	text-decoration: underline;
}

#reviewBook { /* specific style for the review book callout box on left sidebar */
	font-size: 11px;
	font-weight: bold;
	background-image: url(../graphics/button-reviewbook.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	height: 52px;
	padding-top: 22px;
	padding-left: 64px;
	margin-left: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
}

a#reviewBook,
a#reviewBook:link,
a#reviewBook:visited,
a#reviewBook:active {
	color: #062070;
	text-decoration: none;
}
a#reviewBook:hover {
	color: #062070;
	text-decoration: underline;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Content Area ------------------------------------------------------------------------------------------------ */

#content { /* main content area floated right */
	float: right;
	width: 545px;
	color: #FFFFFF;
}

#content h1 { /* page title heading */
	font-size: 1.8em;
	font-weight: bold;
	font-style: italic;
	margin-top: 25px;
	margin-bottom: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
	clear: left;
	margin-right: 20px;
	text-transform: uppercase;
}

#content h2 { /* sub-heading */
	color: #f9b10c;
	font-size: 1.2em;
	margin-top: 20px;
	font-weight: bold;
	margin-left: 20px;
	margin-right: 20px;
}

#content h3 {
	color: #f9b10c;
	font-size: 1.3em;
	margin-top: 30px;
	margin-bottom:15px;
	font-weight: bold;
	margin-left: 20px;
	margin-right: 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #F9B10C;
}

#content h4 {
	color: #f9b10c;
	font-size: 1.2em;
	margin-top: 15px;
	font-weight: normal;
	margin-left: 20px;
	margin-right: 20px;
}

#content h5 {
	color: #ffffff;
	font-size: 1.0em;
	margin-top: 1px;
	font-weight: normal;
	margin-left: 25px;
	margin-right: 20px;
	text-decoration: none
}


#content p { /* content paragraph */
	font-size: 1.2em;
	margin-bottom: 10px;
	margin-left: 20px;
	margin-right: 20px;
}

#content blockquote { /* container for quotes */
	background-image: url(../graphics/quote-mark-open.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 10px;
	padding-left: 15px;
	padding-bottom: 10px;
}

#content blockquote p.quoteText {
	font-size: 1.2em;
	font-style: italic;
	background-image: url(../graphics/quote-mark-close.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	margin-left: 5px;
	margin-bottom: 0px;
}

#content blockquote p.quoteAuthor {
	text-align: right;
	margin-right: 40px;
	font-size: 1em;
}

#content ul {
	margin-top: 10px;
	margin-bottom: 20px;
	margin-left: 40px;
	margin-right: 20px;
	font-size: 1.1em;
}

#content ul li {
	background-image: url(../graphics/yellow-arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 10px;
	margin-bottom: 10px;
	font-size: 1.1em; /* font size repeated so that text does not get smaller */
}

#content ul li a,
#content ul li a:link,
#content ul li a:visited,
#content ul li a:hover,
#content ul li a:active {
	color: #FFFFFF;
}

#content img.related { /* related image floated right */
	float: right;
	padding-bottom: 20px;
	padding-left: 10px;
}

#content p a:link,
#content p a:visited,
#content p a:hover,
#content p a:active {
	color: #FFFFFF;
	text-decoration: underline;
	font-weight: bold;
}

#content h5 a:link,
#content h5 a:visited,
#content h5 a:hover 
#content h5 a:active {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Footer ------------------------------------------------------------------------------------------------------ */

#footer {
	clear: both;
	width: 750px;
	font-size: 10px;
	background-image: url(../graphics/footer-bg.gif);
	background-repeat: repeat-x;
	background-position: left top;
	height: 20px;
	padding-top: 18px;
	background-color: #FFFFFF;
	padding-right: 10px;
	padding-left: 10px;
}

#footer .employeesOnly {
	float: right;
}

#footer a,
#footer a:link,
#footer a:active,
#footer a:visited,
#footer a:hover {
	color: #981b1e;
	text-decoration: underline;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Home Page Specific Styles ----------------------------------------------------------------------------------- */

#content h1#tagline { /* site tagline on the home page */
	font-size: 16px;
	font-weight: bold;
	color: #FFFFFF;
	font-style: italic;
	text-align: center;
	border: none;
	margin-top: 26px;
	text-transform: none;
}

#programBoxes { /* portal link boxes on home page */
	float: left;
	position: relative;
	margin-left: -25px;
}

#newsLinks { /* more news links at the bottom of the news section */
	color: #f9b10c;
	font-size: 1.1em;
	font-weight: bold;
	margin-left: 40px;
	margin-bottom: 10px;
	margin-top: 10px;
}

#newsLinks #rssFeed {
	margin-left: 15px;
}

#newsLinks img {
	vertical-align: text-bottom;
}

#newsLinks a:link,
#newsLinks a:visited,
#newsLinks a:hover,
#newsLinks a:active {
	color: #f9b10c;
	text-decoration: underline;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* About Page Specific Styles ---------------------------------------------------------------------------------- */

#content p#orgchart {
	text-align:center;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Business Opportunities Page Specific Styles ----------------------------------------------------------------- */

.busOppsBox { /* boxes containing topic content */
	background-image: url(../graphics/bisopps-box.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	width: 501px;
	color: #062070;
	margin-bottom: 20px;
	padding-bottom: 10px;
	margin-left: 10px;
}

#content .busOppsBox h3 { /* sub-heading in boxes */
	font-size: 1.2em;
	color: #981B1E;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 10px;
	font-weight: bold;
	margin-top: 0px;
	border: none;
}

#content .busOppsBox ul li { /* list styles for boxes */
	background-image: url(../graphics/blue-arrow.gif);
}

#content .busOppsBox a:link, /* link styles for all boxes */
#content .busOppsBox a:visited,
#content .busOppsBox a:hover,
#content .busOppsBox a:active,
#content #busOppsBox-twoSections a:link,
#content #busOppsBox-twoSections a:visited,
#content #busOppsBox-twoSections a:hover,
#content #busOppsBox-twoSections a:active {
	color: #062070;
	text-decoration: underline;
	font-weight: bold;
}

#busOppsBox-twoSections { /* box with two sections */
	background-image: url(../graphics/bisopps-dod-sba-box.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	width: 501px;
	color: #062070;
	margin-bottom: 20px;
	padding-bottom: 10px;
	margin-left: 10px;
}

#busOppsBox-twoSections #sectionOne {
	float: left;
	width: 321px;
}

#busOppsBox-twoSections #sectionTwo {
	float: right;
	width: 178px;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* International Partners Page Specific Styles ----------------------------------------------------------------- */

#internationalPartners #content {
	background-image: url(../graphics/international-partners-bg.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}

#internationalPartners #content img {
	margin-left: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Contact Information Page Specific Styles -------------------------------------------------------------------- */

#contactInfoList p {
	margin-left: 60px;
}

#contactInfoList h4 {
	margin-left: 40px;
}

#contactInfoList p a:link,
#contactInfoList p a:visited,
#contactInfoList p a:hover,
#contactInfoList p a:active {
	font-weight: normal;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Related Links Page Specific Styles -------------------------------------------------------------------------- */

#relatedLinks #content a:link,
#relatedLinks #content a:visited,
#relatedLinks #content a:hover,
#relatedLinks #content a:active {
	font-weight: normal;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Contract Awards Page Specific Styles ------------------------------------------------------------------------ */

#content a#moreContractAwards:link,
#content a#moreContractAwards:visited,
#content a#moreContractAwards:hover,
#content a#moreContractAwards:active {
	background-image: url(../graphics/button-more-contract-awards.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	height: 29px;
	width: 173px;
	font-size: 11px;
	line-height: 25px;
	text-align: center;
	color: #362a0a;
	text-decoration: none;
	margin-top: 25px;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Contract Awards - Current Performers Popup Window Specific Styles ------------------------------------------- */

#currentPerformers {
	background-color: #040E31;
	text-align: left;
	color: #FFFFFF;
	margin-top: 20px;
	margin-right: 20px;
	margin-left: 20px;
}

#currentPerformers h1 {
	font-size: 1.8em;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
	margin-bottom: 10px;
}

#currentPerformers p {
	font-size: 1.1em;
	line-height: 1.8em;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Membership Chart Page Specific Styles ----------------------------------------------------------------------- */

#membershipChart #content ul {
	margin-top: 2px;
}

#membershipChart #content ul li{
	margin-bottom: 2px;
}

#membershipChart #content h4 {
	color: #FFF;
	font-weight: bold;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Publications Page Specific Styles --------------------------------------------------------------------------- */

#content #pubCategories { /* publication catagory area  */
	float: right;
	margin-right: 20px;
	margin-left: 20px;
}

#content #pubCategories div { /* publication catagory buttons with thumbnail image  */
	background-color: #06174D;
	float: left;
	background-image: url(../graphics/publications-cat-button-title-bg.gif);
	background-repeat: repeat-x;
	background-position: left top;
	clear: left;
	margin-bottom: 1px;
}

#content #pubCategories div.selectedPubCatagory{
	background-image: url(../graphics/publications-cat-button-title-bg-selected.gif);
}

#content #pubCategories div a,  /* publication catagory buttons with thumbnail image  */
#content #pubCategories div a:link,
#content #pubCategories div a:visited,
#content #pubCategories div a:hover,
#content #pubCategories div a:active {
	display: block;
	color: #FFFFFF;
	text-decoration: none;
	font-size: 1.2em;
	font-weight: bold;
	width: 175px;
	background-repeat: no-repeat;
	background-position: left center;
	height: 2em;
	padding-top: 10px;
	padding-left: 85px;
}

#content #pubCategories div#pub a {
	background-image:url(http://www.tswg.gov/graphics/cbrnc/product-indicators-warnings-guide.jpg);
}

#content #pubCategories div#tsp a {
	background-image:url(http://www.tswg.gov/graphics/ttd/product-merchant-vessel-inspection-guide-tsp.jpg);
}

#content #pubCategories div#sw a {
	background-image:url(http://www.tswg.gov/graphics/cbrnc/product-chemical-companion.jpg);
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Technology Transition Page Specific Styles ------------------------------------------------------------------ */

#content #subPages {
	float: left;
	width: 500px;
	padding-left: 20px;
}

#content .subPageButton { /* products page buttons with thumbnail image  */
	background-color: #0C3F8D;
	float: left;
	width: 225px;
	background-image: url(../graphics/sub-page-button-bg.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	margin-right: 20px;
	margin-top: 20px;
}

#content .subPageButton a,  /* products page buttons with thumbnail image  */
#content .subPageButton a:link,
#content .subPageButton a:visited,
#content .subPageButton a:hover,
#content .subPageButton a:active {
	display: block;
	color: #FFFFFF;
	text-decoration: none;
	font-size: 1.1em;
	font-weight: bold;
	width: 132px;
	background-repeat: no-repeat;
	background-position: left top;
	height: 4.5em;
	padding-top: 10px;
	padding-right: 8px;
	padding-left: 85px;
}

#techTransResources img {
	float: left;
	margin-right: 10px;
}

#techTransResources p {
	overflow: auto;
	clear: left;
	width: 450px;
	margin-left: 40px;
	margin-bottom: 20px;
	display: block;
	margin-top: 20px;
}

/*-------------------------------------------------------------------------------------------------------------- */
/* Popup Page Specific Styles ---------------------------------------------------------------------------------- */

body#popup {
	background-color: #040E31;
	text-align: left;
	width: 100%;
	/* positions footer at bottom */
	display: block;
	position: absolute;
	min-height: 100%;
}

#popup #branding {
	background-color: #040E31;
	background-image: url(../graphics/popup-banner-bg.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}

#popup #content {
	width: auto;
	float: none;
	padding-left: 20px;
	/* positions footer at bottom */
	display: block;
	margin-bottom: 80px; /* creates space for footer preventing overlap */
}

#popup #content p {
	line-height: 1.3em;
}

#popup #content h1 {
	margin-top: 5px;
}

#popup #content h3 {
	margin-bottom: 20px;
}

#popup #footer {
	background-image: url(../graphics/popup-footer-bg.jpg);
	background-repeat: repeat-x;
	background-position: left top;
	height: 46px;
	text-align: center;
	padding-top: 14px;
	padding-right: 0px;
	padding-left: 0px;
	/* positions footer at bottom */
	position: absolute;
	display: block;
	bottom: 0;
	width: 100%;
}

#popup #footer p {
	margin-bottom: 5px;
}

#popup #footer #footerNav {
	font-size: 1.2em;
}