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

	
***********************************************************************************************

		
	1. BASE
			1.1 Reset
			1.2 Accessibility navigation
			1.3 Default styles
			1.3 Basic styles
	
	2. LAYOUT
			2.1 Header
			2.2 Content
			2.3 Secondary content
			2.4 Footer
		

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


/* 1. BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/	



/* 1.1	Reset
-----------------------------------------------------------------------------------------------*/	

	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,
	b, u, i, center,
	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-size: 100%; vertical-align: baseline; background: transparent; }
	body { line-height: 1;}	
	ol, ul { list-style: none;}
	blockquote, q { quotes: none;}
	blockquote:before,  blockquote:after,  q:before, q:after { content: '';content: none; }
	:focus { outline: 0; }
	ins { text-decoration: none; }
	del { text-decoration: line-through; }
	table { border-collapse: collapse;border-spacing: 0; }
	

/* 1.2	Accessibility navigation
-----------------------------------------------------------------------------------------------*/	

	#accessibility-nav { position: absolute; left: -1000em; text-align: left; }

/* 1.3	Default styles
-----------------------------------------------------------------------------------------------*/	
	
	html { min-height: 100%; height: auto; }
	body { width: 100%; margin: 35px 0; background: #554432; font: 62.5% Arial, Helvetica, sans-serif; text-align: center; }
	hr { display: none; }
	strong { font-weight: bold; }
	em { font-style: italic; }
	abbr, acronym { border: none; cursor: help; }
	input, textarea, select { font: 1em Arial, Helvetica, sans-serif; }
	input:focus { outline: none; }
	a { color: #554432; text-decoration: none; }
	a:hover, a:active { color: #f79c88; text-decoration: none; }
	img { vertical-align: bottom; }
	h1 { margin: 0 0 10px 0; font-weight: normal; font-size: 2.2em; color: #f79c88; text-transform: lowercase; }
	h2 { margin: 0 0 10px 0; font-weight: normal; font-size: 1.2em; color: #554432; text-transform: uppercase; }
	h3 { margin: 0 0 10px 0; font-weight: normal; font-size: 1.2em; color: #f79c88; text-transform: lowercase; text-align:center; }



/* 1.4	Basic styles
-----------------------------------------------------------------------------------------------*/	

	.hidden { display: none;}
	

/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

	.container { width: 800px; position: relative; margin: 0 auto; background: #eee8dd url(../images/bg_container.gif) repeat-y; text-align: left; font-size: 1.2em; color: #554432; }
	.container2 { width: 800px; background: url(../images/bg_container2.gif) no-repeat; padding: 5px 0 0 0; }
		
	#header { width: 712px; margin: 0 0 28px 47px; padding: 58px 0 0 0; position: relative; }
	#precontent {
	margin: 0px auto 20px auto;
	padding: 0 auto;
	text-align: center;
}	
	#content { width: 330px; float: right; margin: 36px 142px 50px 0; display: inline; }
#fullpagecontent {
	width: 525px;
	float: left;
	margin: 36px 0px 142px 142px;
	display: inline;
	padding: 0 10px 0 10px;
}
	#secondary-content { width: 234px; float: left; margin: 0 0 50px 46px; display: inline; }
	#footer { width: 744px; height: 60px; overflow: hidden; padding: 0 28px 20px 28px; clear: both; background: url(../images/bg_footer.gif) no-repeat 0 100%; color: #e9e3d5; font-weight: bold; }
	
	/* Homepage layout */
	#homepage #header { width: 744px; background: #fff url(../images/bg_header_homepage.gif) no-repeat; margin: 32px 28px 61px 28px; padding: 36px 0 0 0; }
	#homepage #content { display: block; width: 744px; float: none; margin: 0 28px; }
	
	
/* 2.1	Header
-----------------------------------------------------------------------------------------------*/	

	/* logo */
	#header h1, #header h1 span,
	#header a.logo, #header a.logo span { display: block; overflow: hidden; text-align: center; }
	#header h1, #header h1 span { width: 171px; height: 145px; }
	#header a.logo, #header a.logo span { width: 100px; height: 84px; }
	#header h1 { margin: 0; position: absolute; bottom: 25px; right: 88px; }
	#header a.logo { position: absolute;  right: 0; bottom: -73px; }
	#header h1 span,
	#header a.logo span { position: absolute; top: 0; left: 0; z-index: 10; background-repeat: no-repeat; }
	#header h1 span {background-image: url(../images/logo_homepage.gif); }
	#header a.logo span { background-image: url(../images/logo.gif); cursor: pointer;}
	
	/* navigation */
	#navigation li { float: left; margin: 0 42px 0 0; display: inline; }
	#navigation:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
	#navigation li a { font-weight: bold; }
	#navigation li a.current { text-decoration: underline; }
	#navigation li a.current:hover, #navigation li a.current:active { color: #554432; } 
	
	/* navigation > homepage */
	#homepage #navigation { width: 552px; overflow: hidden; padding: 0 96px 18px 96px; background: url(../images/bg_navigation_homepage.gif) no-repeat 0 100%; }
	#homepage #navigation li { margin: 0 14px; padding: 0 0 42px 0; }
	#homepage #navigation li a { display: block; width: 110px; height: 110px; background: #554432 url(../images/navigation_circle.gif) no-repeat; text-align: center; line-height: 110px; color: #eee8dd; }
	#homepage #navigation li a:hover, #homepage #navigation li a:active { background-color: #eee8dd; background-position: 0 -110px; color: #554432; }
	

/* 2.2	Content
-----------------------------------------------------------------------------------------------*/	
	
	#content p { line-height: 2em; }

	/* intro */
	#content #intro { width: 721px; margin: 0 0 14px 12px; }
	#content #intro:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
	#content #intro p { line-height: normal; }
	#content #intro div.intro-left { width: 355px; height: 87px; float: left; padding: 10px 0 0 183px; background: #fff url(../images/bg_intro_left.gif) no-repeat 0 0; position: relative; }
	#content #intro div.intro-left img { position: absolute; left: -12px; bottom: -1px; }
	#content #intro div.intro-left h2 { font-size: 1.5em; font-weight: bold; color: #eee8dd; }
	#content #intro div.intro-left h2 strong { display: block; color: #f79c88; }
	#content #intro div.intro-left a { font-weight: bold; }
	#content #intro div.intro-right { width: 168px; height: 79px; float: right; padding: 18px 0 0 15px; background: #554432 url(../images/bg_intro_right.gif) no-repeat 100% 0; }
	#content #intro div.intro-right h3 { margin: 0 0 8px 0; font-size: 1.4em; font-weight: normal; color: #f79c88; }
	#content #intro div.intro-right a { color: #eee8dd; font-weight: bold; font-size: 1.1em; }
	#content #intro div.intro-right a:hover, #content #intro div.intro-right a:active { color: #f79c88; }
	

/* 2.3	Secondary content
-----------------------------------------------------------------------------------------------*/	

	#secondary-content p { width: 200px; text-align: right; font-weight: normal; font-size: 2.2em; color: #f79c88; }
	#secondary-content img { margin: 0 0 24px 10px; }


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

	/* address vcard */
	#footer .vcard { width: 283px; height: 13px; padding: 0 10px 8px 451px; overflow: hidden; background-color: #eee8dc; }	
	#footer .vcard div, 
	#footer .vcard div span { display: block; width: 100px; height: 13px; overflow: hidden; }
	#footer .vcard div { position: relative; float: left; margin-left: 13px; display: inline; }
	
	#footer .vcard div span { position: absolute; top: 0; left: 0; z-index: 8; background:  url(../images/vcard.gif) no-repeat; }
	#footer .vcard div.tel, #footer .vcard div.tel span { width: 69px; color: #f79c88; }
	#footer .vcard div.adr, #footer .vcard div.adr span { width: 170px; background-position: -65px 0; color: #b09e87; }
		
	/* footer links */
	#footer ul { float: left; padding: 12px 0 0 8px; }
	#footer ul li { float: left; border-left: 1px solid #e9e3d5; padding: 0 8px;  }
	#footer ul li.first { padding-left: 0; border: none; }
	#footer ul li a { color: #e9e3d5; }
	#footer ul li a:hover, 
	#footer ul li a:active { color: #f79c88; }

	/* email signup*/
	#footer .email-signup { width: 328px; float: right; overflow: hidden; position: relative; padding: 8px 30px 6px 0; }
	#footer .email-signup label { float: left; width: 162px; text-align: right; padding: 4px 0 0 0; }	
	#footer .email-signup input.textfield { float: left; width: 134px; margin: 0 8px; padding: 4px 8px 4px 8px; border: none; background: url(../images/bg_textfield.gif) no-repeat; color: #524130; }
	#footer .email-signup input.button { clear: both; position: absolute; right: 8px; top: 7px; }