﻿/*  Layout.xsl
	This file should contain any CSS that is used to render the layout,
	structure, and style of the page.  eWebEditPro will not see this file,
	so CSS that is specific to the editable content areas should go in the
	appropriate site-specific CSS file.
*/

html { overflow-y: scroll; } /* normalize presence of scrollbars */
body { text-align: center; } /* Center the layout on the page    */
#doc1 {
	width: 980px;
	margin: auto;
	text-align: left;
}

/** Page Grid (golden mean):
  * 980px: Total page
  * 602px: Main
  * 230px: Left
  * 142px: Right
  *
  * 10px gutter between all sections (not including page edges)
  * Gutter handled using padding. Margin could also be used.
  * Remember to adjust width if adjusting padding/margin!!
  *
  * LMR = Left, Middle, Right
  * LM  = Left, Middle
  *  MR =       Middle, Right
  *  M  =       Middle
  */
.grid_LMR #grid_container { float: right; width: 770px; }
.grid_LMR #grid_Main      { float: left;  width: 470px; padding: 0 5px; }
.grid_LMR #grid_Right     { float: right; width: 260px; padding: 0 15px 0 10px; margin-top: 5px; }
.grid_LMR #grid_Left      { float: left;  width: 205px; padding-right: 5px; }

.grid_LM  #grid_Main      { float: right; width: 764px; padding-left:  5px; }
.grid_LM  #grid_Left      { float: left;  width: 205px; padding-right: 5px; }

.grid_MR  #grid_Main      { float: left;  width: 764px; padding-right: 5px; }
.grid_MR  #grid_Right     { float: right; width: 204px; padding-left:  5px; }

.grid_M   #grid_Main      { width: 980px; }

#hd, #bd, #ft { clear: both; }
#grid_Main { border-left: 1px dotted #598eb2; }

/*** Homepage ***/
.HP #layout_Breadcrumbs { display: none; }

/*** Header ***/
#hd      { padding: 0; margin: 10px 0 0 0; background-image: url('/images/Layout/header_banner.jpg'); background-repeat: no-repeat; }
#hd .page_logo  { margin: 0; padding: 0 0 28px 0; float: left; }
#hd form { float: right; }
.searchbox_empty { border: 1px solid #7f9db9; color: #000; padding: 2px; font-size: 13px; float: left; }
/**.search_btn { overflow: visible; background: transparent url('/images/HomePage/search_btn.gif') no-repeat scroll center top; display: block;
	float: left; font-weight: bold; height: 22px; line-height: 22px; margin-left: -1px; text-align: center; width: 50px; }**/

/*** Left Menu ***/
#grid_Left ul {
	margin: 0; 
	padding: 0; 
}
#grid_Left ul li {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	list-style: none; 
	margin: 0;
	padding: 0;
}
#grid_Left ul li a {
	padding: 8px 10px; 
	background-color: #E1D49D;
	display: block;
	text-decoration: none; 
	color: #000;
	border-bottom: 1px solid #737475; 
	min-height: 16px;
	height: auto !important; 
	height: 16px; 
}
#grid_Left ul li a:hover { background-color: #F8F1D2; }
#grid_Left ul li.T1Active a { background-color: #C7BC8B; }

#grid_Left ul li.T2 a { border-bottom: 1px dotted #FFFCEF; background-color: #EFE4B3; padding: 4px 10px 4px 20px; font-size: 90%; }
#grid_Left ul li.T2 a:hover { background-color: #F8F1D2; }
#grid_Left ul.T2 { border-bottom: 1px solid #737475; }

#grid_Left ul li.T2Active a,
#grid_Left ul li.T2Active a:hover { background-color: #C7BC8B; }
#grid_Left ul li.T2Active li.T3 a { border-bottom: 1px dotted #C7BC8B; background-color: #FFF6CC; padding: 4px 10px 4px 30px; font-size: 90%; }
#grid_Left ul li.T2Active li.T3 a:hover { background-color: #FFFCEF; }

#grid_Left ul li.T2Active li.T3Active a,
#grid_Left ul li.T2Active li.T3Active a:hover { font-weight: bold; }
#grid_Left ul li.T2Active li.T3Active li.T4 a { border-bottom: none; background-color: #FFFCEF; padding: 4px 10px 4px 40px; font-size: 90%; font-weight: normal; }
#grid_Left ul li.T2Active li.T3Active li.T4 a:hover { background-color: #FFFCEF; }


/*** Body ***/
#bd {
	background-image: url('/images/Layout/leftnav_bg.gif'); 
	background-repeat: no-repeat; 
	background-position: left top; 
	font-family: Helvetica, Verdana, Arial, sans-serif;
}
#bd .base #layout_Breadcrumbs,
#bd .base #layout_Breadcrumbs a,
#bd .base #layout_Breadcrumbs span {
	color: #072E67;
	font-size: 10px; 
	font-weight: bold; 
	text-decoration: none;
}
.cream_box {
	background-image: url('/images/Layout/creambox_t.gif');
	background-position: center top;
	background-repeat: no-repeat; 
	margin: 0 10px; 
	padding: 10px 0 0 0;
	width: 256px; 
	float: right; 
}
.box_wrapper {
	background-color: #F8F1D2;
	margin: 0;
	width: 256px;
}
.content_bulk {
	padding: 0 10px; 
}
table td, 
table th { border: 0; }
.cream_box .box_more {
	font-size: 90%; 
	color: #000; 
}
.cream_box a.box_more:hover { color: #6F653E; }
.cream_box h3 {
	margin: 0; 
	padding: 8px 0; 
}
h1.page_title {
	color: #2e456b;
	margin: 0; 
	padding: 8px 0; 
}
h1, h2, h3, h4, h5, h6 { color: #365784; }
#bd .base a:link { color: #9F4949; }
#bd .base a:visited { color: #004B85; }
#bd .base a:hover { color: #6F653E; }
#bd .base a.classification_link:visited,
#bd .base a.classification_link:link { color: #004B85; }

/*** Callouts ***/
#grid_Right { background-image: url('/images/Layout/callouts_bg.jpg'); background-repeat: no-repeat; }
#grid_Right #layout_Callouts .call_more {
	font-size: 90%;
	color: #000; 
}
#grid_Right #layout_Callouts a.call_more:hover {
	color: #6F653E; 
}
#grid_Right #layout_Callouts hr {
	background-image: url('/images/Layout/calloutshr.gif');
	background-repeat: no-repeat;
	height: 9px;
	border: none; 
	background-color: transparent;
}

/*** Footer ***/
#ft      { clear: both; padding: 13px; text-align: center; background-image: url('/images/Layout/footer_bg.gif'); background-repeat: no-repeat; background-position: left top; 
	color: #8B8B8B; font-size: 69%; }
#ft a { color: #666; text-decoration: none; font-weight: bold; }
#ft a:hover { color: #8b8b8b; }

/** Forms **/
.FormError { background-color: red; color: white; }

/** Top Menu, including T1 with T2 drop-downs
  * Remove this whole section if there is no top menu!
  * Aside from the width, every style here is purely structural.
  * This is just to get the list horizontal and have things line up
  * when the drop-down occurs. Do appearance styling below these.
  **/
#layout_TopNav       { clear: both; height: 30px; background-color: #6A82A4; color: #fff; text-align: right; margin: 0; padding: 0; line-height: 30px; }
#layout_TopNav li.tagline { color: #072E67; font-weight: bold; }
#layout_TopNav li { list-style: none; display: inline; padding: 0 8px; border-right: 1px solid #ccc; }
#layout_TopNav a { color: #fff; text-decoration: none; }
#layout_TopNav a:hover { text-decoration: underline; }
#bd select.hover  { visibility: hidden; }
.Message { font-weight: bold; color: red; }
