/*  
Cascading Style Sheet for
LA COSECHA COFFEE COMPANY
main.css
*************************
*/

/*--Zero Out then customize header margins (spacing)-------------------------------*/
	h1, h2, h3, p {margin: 0; padding: 0;}
	h1 {margin-top: 2em; margin-bottom: 1em;}
	h2 {margin-bottom: 1em;}
	h3 {margin-bottom: 0;}
	p {margin-bottom: 1em;}
	img {border: none;
	}

/*------Structure------------------------------------------------------------------*/
body {
	margin: 0 auto; 
	padding: 0;
	font: 62.5% "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	background: #ccb684 url(images/bg_top.jpg) repeat-x; 
	}
	
#container {
	width: 760px;
	text-align: left;
	margin: 60px auto 0 auto;
	padding: 0;
	}
	
#branding {
	position: relative;
	}

#branding img {
	position: absolute;
	left: 0;
	top: -45px;
	z-index: 100;
	}

/*------ NAVIGATION------------------------------------------------------------------*/

#navbar {
	text-align: right;
	margin: 0 0 30px 0;
	padding: 0;
	list-style-type: none;
	}
	
#navbar li {
	display: inline;
	}
	
#navbar li a {
	font: 1.7em Georgia, Georgia, "Times New Roman", Times, serif;
	color: #e0c497;
	padding: 0 .6em; 
	border-bottom: none;
	border-right: 1px #e0c497 solid;
	text-decoration: none;
	}

#navbar a:hover, a:active {
	color: #fff;
	}
	
#navbar #dealers a {
	border-right: none;
	padding: 0 0 0 .8em;
	}
	
#navbar li a.active { /* add bracket characters to active/current page link */
	font-weight: normal;
	color: #fff;
	}	

/*------------------------------ STRUCTURE AND CONTENT ---------------------------------------------*/

#content {
	width: 760px;
	background: #fff url(images/content_bg.gif) repeat-y;
	text-align: left;
	position: relative;
	margin: 0 auto;
	}

#content h2 {
	color: #96030b;
	font: bold 2.4em Georgia, Arial, Helvetica, verdana, sans-serif;
	font-variant: small-caps;
	margin: 14px 20px;
	padding: 0;
	border-bottom: 1px #421d1c dotted;
	}

* html #content h2 {
	border-bottom: 1px #421d1c solid; /*star HTML hack to feed IE an underline*/
	}
		
#content p {
	font: 1.2em/1.5em "lucida grande", verdana, Arial, Helvetica, sans-serif;
	color: #421d1c;
	}
	
#content .topimg {
	position: relative;
	z-index: 1;
	}

#content_main {
	width: 520px;
	margin: 0;
	padding: 0;
	float: right;
	}	
	
#index #content_main, #about content_main {
	background: url(images/coffee_stain.gif) right top no-repeat;
	}	
	
#dealers #content_main {
	background: url(images/coffee_stain.gif) right bottom no-repeat;
	}	
	
#contact #content_main {
	background: none;
	}	
	
#content_main p {
	margin: 0 20px 10px 20px;
	padding: 0;
	}	
	
#content_main .opening_para {
	margin: 20px 20px 10px 20px;
	padding: 0;
	}
	
#offerings .opening_para {
	margin: 14px 20px 10px 20px;
	padding: 0 0 10px 0;
	font-style: italic;
	line-height: 1.5em;
	border-bottom: 1px #421d1c dotted;
	}	
	
#offerings .opening_para img, #harvest .opening_para img, #process .opening_para img, #fair .opening_para img {
	float: left;
	margin: 0 10px 0 0;
	background-color: #fff;
	padding: 4px;
	border: 1px #bbb solid;
	}	
		
#about .portrait { 
	margin: 2px 20px 10px 20px;
	background-color: #fff;
	padding: 4px;
	border: 1px #bbb solid;
	}
	
/*---------------- PANEL LAYOUT -----------------------------------------------------------*/

#content_main dl {
	float: left;
	width: 478px; /*width fix for IE/Mac  may not be necessary if causes problems */
	margin: 10px 20px 5px;
	padding: 0;
	display: inline;
	background:#fffbe9 url(images/panel_grad4.gif) repeat-x;
	border: 1px #e0c497 solid;
	color: #421d1c;
	}
	
#index #content_main dt {
	float: right;
	width: 310px;
	margin: 0;
	padding: 10px 0 4px 0;
	}
	
#content_main dt {
	font: bold 1.5em "lucida grande", verdana, Arial, Helvetica, sans-serif;
	color: #421d1c;
	float: right;
	width: 380px;
	margin: 0;
	padding: 10px 0 4px 0;
	}
	
#content_main dd {
	margin: 0;
	padding: 0 7px 0 0;
	font-size: 1em;
	line-height: 1.5em;
	}
	
#content_main .title {
	font-size: .78em;
	font-weight: normal;
	}
	
#content_main .img {
	float: left;
	margin: 0 8px 0 0;
	padding: 4px;
	border: 1px solid #d9e0e6;
	border-bottom-color: #c8cdd2;
	border-right-color: #c8cdd2;
	background: #fff;
	}
	
/*-------------------- DEALER PAGE ---------------------------------------------------*/

#dealer_info {
	list-style-type: none;
	margin: -6px 20px 20px 20px;
	padding: 0;
	}
		
.dealername {
	font: bold 1.5em Verdana, Arial, Helvetica, sans-serif;
	margin: 1.2em 0 0 0;
	color: #96030b;
	}
	
.dealeraddress, .dealerphone, .dealerwebsite, .dealeremail{
	font: 1.1em "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	color: #421d1c;
	}
	
.dealerwebsite a, .dealeremail a {
	text-decoration: none;
	}

/*-------------------- LINKS PAGE ---------------------------------------------------------*/

#links #link_list {
	list-style-type: none;
	padding: 0;
	margin: 0 20px;
	}
	
#links #content_main li .link_logo {
	float: left;
	margin: 0 12px 10px 0;
	}

#links .linkdesc {
	float: left;
	}
		
#links #link_list p {
	margin: 0;
	padding: 0;
	}
	
#links #link_list li {
	margin: 8px 0;
	border-bottom: 1px #6c2f2e solid;
	overflow: hidden;
	height: 1%;
	}

/*-------------------- LINKS ---------------------------------------------------------*/

a:link, a:visited {
	padding-bottom: 1px;
	color: #6c2f2e;
	text-decoration: none;
	border-bottom: 1px solid #c27977;
	}
a:hover {
	padding-bottom: 0;
	color: #96030b;
	border-bottom: 2px solid #96030b;
	}

#content_main .external {
	background:url(images/external.gif) no-repeat right top;
	padding-right: 12px;
	}
	
/*-------------------- SIDEBAR ---------------------------------------------------*/

#content_sub {
	width: 240px;
	margin: 0 0 10px 0;
	padding: 0;
	float: left;
	}
	
#index #content_sub {
	width: 240px;
	margin: 70px 0 10px 0;
	padding: 0;
	float: left;
	}	

#content_sub p {
	margin: 0 20px;
	background-color: #e0c497;
	border: 2px red solid;
	}	

#content_sub dl {
	width: 198px; /*width fix for IE/Mac  may not be necessary if causes problems */
	margin: 20px 20px;
	padding: 8px 0 0 0;
	background: #fffbe9 url(images/panel_top.gif) no-repeat left top;
	color: #421d1c;
	}
	
#content_sub h3 {
	margin: 0 14px 0 14px;
	padding: 0 0 4px 0;
	font: bold 1.9em Georgia, "Times New Roman", Times, serif;
	color: #96030b;
	}
	
#content_sub dd {
	margin: 0;
	padding: 0 14px 20px 14px;
	font-size: 1em;
	line-height: 1.5em;
	background: #fffbe9 url(images/panel_bottom.gif) no-repeat left bottom;
	}
	
#content_sub blockquote p {
	font-variant: small-caps;
	font-family: Georgia, serif;
	color: #ccb684;
	font-size: 1.3em;
	line-height: 1.7em;
	margin: 20px 0;
	padding: 0;
	background: url(images/openquote.gif) no-repeat 0 -2px;
	text-indent: 30px;
	border: none;
	}
	
#content_sub blockquote cite {
	font-variant: normal;
	font-size: .9em;
	}

	
		
/*-------------------- FOOTER ---------------------------------------------------*/

/*------------------------------- SUB NAVIGATION IN FOOTER ----------------------------------------*/
#sub_navbar {
	text-align: center;
	margin: 0;
	padding: 12px 0 2px 0;
	list-style-type: none;
	}
	
#sub_navbar li {
	display: inline;
	}
	
#sub_navbar li a {
	font: 1.4em "lucida grande", verdana, Arial, Helvetica, sans-serif;
	color: #e0c497;
	padding: 0 .6em; 
	border-bottom: none;
	border-right: 1px #e0c497 solid;
	text-decoration: none;
	font-weight: bold;
	}

#sub_navbar a:hover, a:active {
	color: #fff;
	}
	
#sub_navbar #contact a {
	border-right: none;
	padding: 0 0 0 .8em;
	}
	
#sub_navbar li a.active { /* add bracket characters to active/current page link */
	font-weight: bold;
	color: #fff;
	}	
	
#footer {
	clear: both;
	background: url(images/footer.jpg) repeat-x top left;
	height: 75px;
	}
	
#footer p {
	margin: 8px 0 0 0;
	padding: 0;
	color: #e0c497;
	font-size: 0.8em;
	text-align: center;
	}
	
#footer a, #footer p a {
	text-decoration: none;
	color: #e0c497;
	}