/**
 * --------------------------
 * NWNA Global CSS
 * --------------------------
 * A) Main Layout (div.mainContainer, div.pageContainer)
 *		The basic frame of the site
 * B) Header (div.headerContainer)
 * 		Sub Sections include:
 *			- logo swapping
 *			- brand logos on top right
 * C) Left Column (div.mainLeftColumn)
 * 		Left column includes:
 *			- Navigation (menu.css)
 *			- Testimonials (side quote)
 * D) Footer (div.footerContainer)
 *		Footer includes 
 *			- Sub Navigation (menu.css)
 *			- Copyright style
 * E) Default Content Container 
 *		This contains all the default styles within the Content Container (primarily margin/padding)
 * F) Themes
 *		All sections have basic themes, Blue (Who We Are), Green (What We Do), Gold (What It's Like), and Global
 * G) Link styles
 *		Link styles include arrow with line, and arrow with a background.
 * H) Module with No Border (div.module)
 * I) Module with Border (div.invertedModule)
 * J) Floating Modules (div.floatingQuoteModule, div.leftFloatingQuoteModule)
 * K) Map Styles
 */

body { text-align: center; background: url( ../img/common/background/main_background_2.gif ); }

/* A) The Main Layout */
	div.mainContainer { background: url( ../img/common/background/main_background.gif ) left top repeat-x; }
	div.pageContainer { text-align: left; width: 781px; \width: 791px; w\idth: 781px; margin: auto; background: url( ../img/common/page_container_background.gif ); padding: 2px 5px 0px 5px; color: #747883; }
	div.columnContainer { width: 781px; }
	div.mainLeftColumn { float: left; width: 196px; }
	div.contentContainer { float: right; width: 579px; /*padding-bottom: 10px;*/ }
/* A) End of Main Layout */

/* B) Header */
	div.header { z-index: 1; position: relative; }
	
	/* Logo Swapping */
		/* Home page has a different logo than all the other pages */
		h1 { z-index: 5; background: url( ../img/common/nwna_logo_with_bg.gif ) left top no-repeat; cursor: hand; cursor: pointer; margin-left: 25px; margin-top: 14px; position: absolute; text-indent: -9999px; height: 130px; width: 131px;  }
		
		/* On Homepage, show Logo without Careers Text */
		body.Home div.header h1 { background-image: url( ../img/common/nwna_logo_with_bg.gif );  }
		
		/* Other Pages Have to Override Default H1 */
		body.WhatWeDo h1, body.WhoWeAre h1, body.WhatItsLikeHere h1, 
		body.CareerSearch div.header h1, body.PrivacyPolicy h1, body.OurLocations h1, 
		body.FAQ h1, body.Error h1, body.Legal h1 { 
			background-image: url( ../img/common/nwna_logo_careers_with_bg.gif ); 
		}
	/* End Logo Swapping */

	/* Brand Logos */
		div.header div.flashLogos { margin: 0px 0px -1px 0; float: right; height: 57px; overflow: hidden; }
		div.header ul.brands { list-style: none; float: right; }
		div.header ul.brands li { float: left; margin: 0 2px 0 0; text-indent: -9999px; height: 55px; }
		div.header ul.brands li.pureLife { background: url( ../img/common/logos/purelife_logo.jpg ) left top no-repeat; width: 119px; }
		div.header ul.brands li.arrowhead { background: url( ../img/common/logos/arrowhead_logo.jpg ) left top no-repeat; width: 67px; }
		div.header ul.brands li.polandspring { background: url( ../img/common/logos/polandspring_logo.jpg ) left top no-repeat; width: 61px; }
		div.header ul.brands li.deerPark { background: url( ../img/common/logos/deerpark_logo.jpg ) left top no-repeat; width: 62px; }
		div.header ul.brands li.icemountain { background: url( ../img/common/logos/icemountain_logo.jpg ) left top no-repeat; width: 62px; }
		div.header ul.brands li.ozarka { background: url( ../img/common/logos/ozarka_logo.jpg ) left top no-repeat; width: 64px; }
		div.header ul.brands li.zephyrhills { background: url( ../img/common/logos/zephyrhills_logo.jpg ) left top no-repeat; width: 61px; }
		div.header ul.brands li.calistoga { background: url( ../img/common/logos/calistoga_logo.jpg ) left top no-repeat; width: 67px; margin-right: 0px; }
	/* End of Logos */

	div.header div.MenuControl { position: relative; left: -10px; }
/* B) End of Header */

/* C) Left Column */ 
	/* Consists of Navigation and Testimonials (quote) */
	div.mainLeftColumn div.testimonial { margin: 15px 0 15px 1px; }
	div.mainLeftColumn div.testimonial img { margin-bottom: -3px; }
	div.mainLeftColumn div.testimonial div.details { margin-left: 10px; padding: 0 0 8px 5px; background: url( ../img/common/testimonials/footer.gif) left bottom no-repeat; }	
/* C) End of Left Column */

/* D) Footer */
	div.footerContainer { clear: both; background: url( ../img/common/background/footer.jpg ) left top no-repeat; text-align: center; padding: 50px 0; }
	div.footerContainer a { color: #769fc3; }
	div.footerContainer span.copyrightText { display: block; margin-top: 5px; color: #2f5e8c; font-weight: bold; }
	div.footerContainer span.delim { color: #769fc3; padding: 0 5px; }
/* D) End of Footer */

/* E) Default Content Container */
	div.contentContainer { }
	body.SubNode div.contentContainer { padding-bottom: 20px; }
	div.contentContainer p { margin: 5px 5px 5px 26px; }
	div.contentContainer p.indent { margin: 0 0 0 42px; }
	div.contentContainer h3 { margin: 15px 0 0 26px; font: bold 14px Arial; }
	div.contentContainer h4 { margin: 15px 0 0 26px; font: bold 12px Arial; }
	div.contentContainer h5 { font: bold 11px Arial; }
	div.contentContainer ul { margin: 0 0 10px 26px; }
	div.contentContainer ol li { margin: 0 20px; }
	div.contentContainer ul li ul { margin: 0; }
	div.contentContainer li { margin: 0 40px; }
	div.contentContainer dl { margin-left: 26px }
	div.contentContainer dl dt { margin-left: 15px; float: left; clear: both; font-weight: bold; padding-right: 5px; }
/* E) End of Default Content Container */

/* F) Themes */
	/* Global Link Color */
		a, a.arrow { color: #6d94bf; }
		a:hover, a.arrow:hover { color: #2e5e8e; }
	/* End of Global Link Color */
	
	
	body.Home strong.themed, body.Home h3, body.Home h4, body.Home h5 { color: #61cdf6; }
	/* body.Home div.contentContainer a.arrow:hover, body.CareerSearch div.contentContainer a.arrow:hover { color: #4ea7c9; }*/

	body.WhoWeAre strong.themed, body.WhoWeAre div.contentContainer a.arrow, body.WhoWeAre h3, body.WhoWeAre h4, 
	body.WhoWeAre h5, body.CareerSearch div.contentContainer a.arrow { color: #61cdf6; }
	body.WhoWeAre div.contentContainer a.arrow:hover, body.CareerSearch div.contentContainer a.arrow:hover { color: #4ea7c9; }
	
	body.WhatWeDo strong.themed, body.WhatWeDo div.contentContainer a.arrow, body.WhatWeDo h3, 
	body.WhatWeDo h4, body.WhatWeDo h5 { color: #6fb245; }
	body.WhatWeDo div.contentContainer a.arrow:hover { color: #47af3b; }

	body.WhatItsLikeHere strong.themed, body.WhatItsLikeHere div.contentContainer a.arrow, body.WhatItsLikeHere h3,
	body.WhatItsLikeHere h4, body.WhatItsLikeHere h5 { color: #d3b81b; }
	body.WhatItsLikeHere div.contentContainer a.arrow:hover { color: #baa737; }
	
	body.CareerSearch div.contentContainer a.arrow { color: #6d94bf; }
	body.CareerSearch div.contentContainer a.arrow:hover { color: #2e5e8e; }
	body.CareerSearch div.contentContainer h5 { margin: 10px 0 3px; }
/* F) End of Themes */

/* G) Link styles */
	/* Arrow on the right with a background, text is white, force no hover affect */
	a.arrowBG { font: 10px Arial; height: 10px; padding: 2px 15px 5px 3px; text-decoration: none; background: url( ../img/common/background/arrow_link_with_background.gif ) right top no-repeat; color: #fff !important; }
	a.arrowBG:hover { color: #fff !important; }

	/* Arrow on left with a line underneath, hover affect is normal hover from theme */
	a.arrow { height: 14px; background: url( ../img/common/background/arrow_link_line.gif ) left top no-repeat; text-decoration: none; padding: 0 45px 0 15px; font: bold 11px Arial; }
	a.greenArrow { height: 12px; background: url( ../img/common/background/greenArrow_link_line.gif ) left top no-repeat; text-decoration: none; padding: 0 45px 0 15px; font:bold 11px Verdana; }

	
/* G) End of Link Styles */	

/* H) Module with No Border */
	div.module { background: #e8f5fa; margin: 10px 10px 10px 26px; padding: 10px; }
	div.module h4 { margin: 0 0 0 0; font: bold 11px Arial; }
	div.module img { margin-left: 10px; float: right; }
	div.module p { margin: 5px 0; font: 11px Arial; }
	div.module ul { margin: 0; }
	div.module a.arrow { background-image: url( ../img/common/background/arrow_link_line_module.gif ); }
/* H) End of Module with No Border */
		
/* I) Module with Border */
	div.invertedModule { background: #fff; border: 12px solid #e8f5fa; }
	div.invertedModule img.module { float: left; margin-right: 10px; }
	div.invertedModule div.content { float: left; width: 350px; }
	div.invertedModule div.content img { display: block; margin: 2px 0 0;}
	div.invertedModule ul li { margin-left: 10px; }
	div.invertedModule div.content p { margin: 4px 0 2px; font: 11px Arial; }
/* I) End of Module with Border */

/* J) Floating Modules */
	div.floatingQuoteModule { float: right; margin-right: 10px; }
	div.leftFloatingQuoteModule { /*border: 1px dotted red;*/ margin: 0 0 0 30px !important; margin: 0 15px 0 10px; float: left; }
/* J) End of Floating Modules */

/* K) Map Styles */
	div.hide { display: none; }
	
	p.instructions { color: #8f8f8f; font: bold 12px Arial; }
	
	div.map { width: 550px; margin: auto; }
	
	div#state_None { color: #8f8f8f; padding: 10px; font: bold 12px Arial; }
	
	div.state { border: 2px solid #7ca5d1; margin: 5px auto; width: 400px; padding: 0 10px; }
	div.state h4 { color: #53c8f4; margin: 0 !important; padding: 5px 0; font: bold 14px Arial; }
	div.state div.location { color: #8f8f8f; font: bold 12px Arial; display: inline;   }
	div.state div.officeName { color: #b3b3b3; margin-left: 10px; display: inline; }
	div.state a { color: #b3b3b3; }
	div.state div.officeType { color: #b3b3b3; margin-bottom: 10px; }
/* K) End of Map Styles */