﻿
/****************************************************************************
* 0100_BasicSettings.css
*
* Contains settings for the BODY, FORM, and several DIV elements that control
* the basic layout of each page.  Also contains settings for some basic 
* types like H1, H2, A, etc.
*
* History:
* 2008-10-19 - Luther Casey
*    Created.
*****************************************************************************/ 

/****************************************************************************
* body
*
* Within an HTML document all content displayed to the user is 
* contained within the BODY element.  So this is where we begin with
* our settings.
*****************************************************************************/ 
body 
{
	/*
	* Don't use padding (Opera) or margin (other browsers) on the body itself.  
	*/
	padding: 0;
	margin: 0;
	
	/*
	* Default color for all text.
	*/
	color: #333;
	
	/* 
	* This EDS Standard theme uses a gradiant background image for the gray portion at the top of the page
	* and a 5 pixel tall white line.  Previous implementations used a very tall image that also
	* created the blue gradient background for the bottom of the page, but now we are just setting a
	* solid background color and use a shorter image.
    */
/*
	background: #002436	url(images/body_bg.gif) repeat-x;
*/

	/* 10-pixel base size.
	* (We want base size in % rather than em to correct problems with IE6 and earlier.) 
	*/ 
	font: 62.5% Verdana, Arial, Helvetica, sans-serif;		
}

/* 
* When we don't have a top navigation menu we need a shorter background image so that the white
* horizontal line aligns with the top of the page's content.  The framework will automatically 
* give the BODY element an id of "bodyWithoutTopNavMenu" whenever there isn't a top navigation menu.
*/
#bodyWithoutTopNavMenu 
{
/*
	background: #002436	url(images/body_bg_no_topnav.gif) repeat-x;
*/
}

/*
* Style that will be applied to the BODY element if the page is being displayed 
* in printer-friendly mode.  The framework will automatically give the BODY 
* element an id of "bodyPrintFriendly" when in printer-friendly mode.
*/
#bodyPrintFriendly
{
	background-image: none;
}

/****************************************************************************
* form
*
* All controls, headers, footers, navigation, content, are contained in the 
* FORM element, just as with any other standard ASP.Net application.
*****************************************************************************/ 
form   
{		
	/*
	* Establish default text size for the entire page - 13 pixels (at normal magnification).
	*/
	font-size: 1.3em;
			
	/*
	* No extra space at the top or bottom of the form itself.
	*/
	margin-top: 0;
	margin-bottom: 0;
	
	/*
	* Lets the FORM center in the page when the width is not set
	* to 100%.
	*/
	margin-right: auto;
	margin-left: auto;
	
	/* 
	* Forces the content to be slightly narrower than the entire page.  This results
    * in borders on each side displaying any background images or colors that have been
	* specified on the BODY element. 
	*/		
	width: 98%;  /* Can be set to 100% to eliminate borders on the sides */
	min-width: 960px;
}

form.formPrintFriendly
{
	width: 100%;  /* Eliminate borders on the sides */
}

/****************************************************************************
* pageBodyDiv
*
* This DIV element surrounds everything between the top menu bar 
* and the footer - everything in the middle of the page.  This will also 
* include the side navigation menu, if present.
*****************************************************************************/
#pageBodyDiv
{
	width: 100%;
	
	/* 
	* This setting is critical in order for the DIV to completely
	* surround the elements it contains.  Without this, the DIV
	* won't display at all in any browser except IE.
	*/
	float: left;
	clear: both;
	
	
	/* 
	* Same color as the side navigation menu.  This way it looks like
	* the side menu goes all the way down the page when the page body
	* is longer than the menu.  
	*/
	background-color: #eee;
	
	/* 
	* Makes a white line across the top of the content portion of the page.
	* For the EDS Intranet look, this lines up with the white line built
	* into the background image.
	*/
	border-top: solid 4px #fff;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
	
	/*
	* We don't want any padding/margins, otherwise we will mess up alignment
	* with the DIVs that make the header and footer elements.  
	*/
	padding: 0;
	margin: 0;
}

/****************************************************************************
* pageBodyContentDiv
*
* This DIV element is nested inside of the "pageBodyDiv" and surrounds the
* "pageBodyContentInnerDiv".
*
* The purpose of this div is to create the background appropriate background
* color.  DO NOT put padding or margins on this element - do that on the 
* pageBodyContentInnerDiv instead.
*****************************************************************************/
#pageBodyContentDiv 
{					
	/*
	* This establishes the background color for the page-specific content area.  
	*/
	background-color:  #fff;
		
	/*
	* Default to no borders.  With classes below, we specify the 
	* the border-left setting. 
	*/
	border-bottom: 0;	
	border-top: 0;	
	border-right: 0;	
	
	/*
	* We don't want any padding/margins.  We want the top, bottom, and 
	* right sides to always align exactly with the #pageBodyDiv that
	* contains us.
	*/
	margin: 0;
	padding: 0;
}
/*
* When we DON'T have Side Navigation present, let the content take up
* the whole page.  The framework will automatically add this CLASS to 
* this element when there is no side navigation menu present.
*/
.pageBodyContentNoSideNav
{
	width: 100%;  
	/*	
	* We are taking up the whole page, so we don't want a border
	* on the left.  This will align the left edge exactly with
	* the #pageBodyDiv that contains us.
	*/
	border-left: 0;
	
}
/*
* Styles for when we DO have Side Navigation present.
*/
.pageBodyContentNextToSideNav
{
	/* 
	* Causes the page specific content, this DIV, to display as far to the
	* right as possible, meaning any extra margin will be displayed along the left
	* edge - just to the left of the border (see below).
	*/
	float: right;

	/*
	* This width, plus the right/left padding and margins, plus any 
	* borders, must be coordinated with 
	* the width of the side navigation menu, which is specified in the 
	* 0160_SideNavigationMenu.css file; otherwise, the page content
	* will get pushed under the menu.  IE 6 seems to need a bit more cushion.
	*/
	width: 82.75%;  
	
	/*
	* This border will appear as though it is part of the
	* side navigation bar.  If we put the border on the side-menu 
	* itself, it never looks quite right.  Since we are dealing with 
	* percentage widths, but also adding a fixed-size (pixels) border which
	* adds to the total width, it isn't possible to get this element to
	* exactly butt up with the side navigation menu; however, the background
	* color of the #pageBodyDiv is the same color as the side menu.  
	* So adding the border to our left makes it look like it is the border
	* of the side menu.  If we put it on the menu itself, then there is
	* always some extra space between the border and this DIV and it
	* looks goofy.  This way, the extra space is just to the left of this 
	* border line, instead of to the right of it.
	*/
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #ccc;

}

* html .pageBodyContentNextToSideNav
{
	/*
	* This width, plus the right/left padding and margins, plus any 
	* borders, must be coordinated with 
	* the width of the side navigation menu, which is specified in the 
	* 0160_SideNavigationMenu.css file; otherwise, the page content
	* will get pushed under the menu.  IE 6 seems to need a bit more cushion.
	*/
	width: 82.5%	
}

/****************************************************************************
* pageBodyContentInnerDiv
*
* This DIV element is nested inside either the "pageBodyContentNoSideNav" or 
* the "pageBodyContentNextToSideNav", and surrounds everything except the side 
* navigation menu.  This includes all of the page-specific content, starting 
* with the Breadcrumbs and title elements, as well as any related links.
*
* The purpose of this div is to create the desired default padding, spacing,
* and margins that all page-specific content should have.
*****************************************************************************/
#pageBodyContentInnerDiv 
{					
	/*
	* No borders or margins, but we do add some padding.
	*/
	border: 0;	
	margin: 0;
	padding: 1em;
	
}


/****************************************************************************
* Basic Element Settings
*
* Establish default characteristics for elements like
* A, IMG, H1, H2, and LI.
*****************************************************************************/


h1 
{ 
/*
	border-left: solid 5px #c8db00;
	color: #00344d;
	padding-left: .5em;
*/
	margin-top: 0;
	margin-bottom: 0;
	font-size: 2em; 
	font-weight: normal;
	line-height: 1.5em; 	
	letter-spacing: -1px; 
}	

h2 
{ 
/*
	border-bottom: solid 1px #ccc;
	color: #00344d;
	overflow: hidden;	
*/
	margin-bottom: .5em;
	font-size: 1.5em; 
	font-weight: normal;
	line-height: 1.3em; 	
	letter-spacing: -1px;
}	

/*
* html h2 
{
	zoom: 1;			
}
*/

/*
li 
{
	margin: .5em 0;
}
*/

/****************************************************************************
* A element
*
* Basic settings for all A elements.
*****************************************************************************/ 

/*
* Set default color for all hyperlinks. 
*/
/*
a:link 
{
	color: #11568b;
}
*/

/*
* Set default color for links the user has already clicked on. 
*/
/*
a:visited 
{
	color: #6e2f92;
}
*/

/*
* Set default color for links when the user hovers his or her mouse over them.
*/
/*
a:focus,
a:hover 
{
	color: #dc241f;
}
*/

/*
* Images wrapped by A elements should have no borders by default.
*/
/*
a img 
{
	border: none;
}
*/
