/*-----------------------------------------------------------------------------
[client] Screen Stylesheet

version:   1.0
date:      01/03/07
author:    [your name]
email:     [you at domain dot com]

website:   [your domain]

version history: [location of file]
-----------------------------------------------------------------------------*/


/* Import other stylesheets
-----------------------------------------------------------------------------*/

/* @import url("otherstylesheet.css"); */


/* Remove margin, padding and border from everything
-----------------------------------------------------------------------------*/

/* Styles for layout
-----------------------------------------------------------------------------*/

.clear{
	clear:both;}

.right{
	float: right;
	display: inline;}

.left{
	float: left;
	display: inline;}
	
.pad{
	padding: 0 20px}

/* Set up the document
-----------------------------------------------------------------------------*/

body
	{
	font: 62.5%/1.5  "Trebuchet MS", "Myriad", sans-serif;
	background: #cfb86a url('../images/bg.gif') top center repeat;
	color: #880000;
	text-align: left;}


/* Typography
-----------------------------------------------------------------------------*/

h1{
	font-size: 4em;
	padding: 10px 0px 0px;
	clear: both;}
	
h2{
	font-size: 3em;
	line-height: 2em;
	font-weight:normal;
	padding: 0;
	clear: both;
	color: #004A11;}
	
h3{
	font-size: 1.8em;
	clear: both;
	color: #880000;}
	
h4{
	font-size: 1.6em;
	line-height: 1.2em;
	padding: 10px 0 0;
	color:#c3ee98;}
	
h5{
	font-size: 1.6em;
	padding: 10px 0 0;
	color:#004A11;}
	
p, q, cite{
	font-size: 1.4em;
	line-height: 1.2em;}
	
p.unsubscribe{
	font-size: 1em;
	color: #004A11;}
p.unsubscribe a{
	font-size: 1em;}

ul, ol, dl{
	list-style: none;
	font-size: 1.2em;}

li, dd, dt{
	font-size: 1.2em;}

a{
	font-size: 1.4em;
	line-height: 1.1em;
	color: #004A11;
	text-decoration: none;}
	
.smaller{
	font-size: 1em;}
	
a:hover{
	color:#880000;
	text-decoration: none;}
	
a.red:hover{
	color: #004A11;
	text-decoration: none;}
	
a.green:hover{
	color:#880000;
	text-decoration: none;}
	
p{
	padding: 0 0 10px 0;}
	
#vendor p{
	color: black;}
	
.underline{
	text-decoration: underline;}
	
img{
	border: none;}

.right{
	float: right;
	display: inline;}

.left{
	float: left;
	display: inline;}
	
.clear{
	clear: both;}
	
.pad{
	padding: 0 20px}

	
/* Common divs
-----------------------------------------------------------------------------*/

#shade {
    background: url(/core/images/bottom.png) no-repeat 0 0;
    width: 960px;
    height: 10px;
    margin: 0 auto;}
    
.editlink{
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	float: left;
	display: none;}
.db{
	/*position: relative;*/}
    
#wrapper
	{ 
	width: 960px; /* Set page width here - you can also use percentage */
	text-align:left;  
	margin: 10px auto 0; 
	background-color: #FFFFFF;
	border: 1px solid #999;}
	
#fancy_container{
	width: 800px;
	text-align: left;
	margin: 10px auto;
	padding: 10px 20px;
	background-color: #FFFFFF;
	border: 1px solid #999;}
	
.threeThirds{
	width:920px;
	padding: 10px 20px;
	position: relative;}
	
.twoThirds{
	width:600px;
	padding: 10px 20px;
	position: relative;}
	
.oneThirds{
	width: 280px;
	padding: 10px 20px;
	position: relative;}
	
#loading{
	height: 39px;
	width: 47px;
	margin: auto;
	overflow: hidden;}
	
#home-loading{
	height: 31px;
	width: 31px;
	position: relative;
	top: 150px;
	left: 400px;
	overflow: hidden;}

	
.notice{
	width:920px;
	margin: 5px 20px;
	background-color:#E6EFC2;
    border:1px solid #C6D880;
    color:#529214;}
    
.error{
	width:920px;
	margin: 5px 20px;
	background:#fbe3e4;
    border:1px solid #fbc2c4;
    color:#d12f19;}

/* Header
-----------------------------------------------------------------------------*/
#header{
	width: 991px;}


/* Navigation
-----------------------------------------------------------------------------*/



/* Footer
-----------------------------------------------------------------------------*/
#footer{
	border-top: 1px solid #999;
	color: #999;
	padding: 5px 20px;
	text-align: right;}
	
#credit{
	text-align: right;
	clear: both;
	width: 991px;
	height: 39px;}


/* Content divs
-----------------------------------------------------------------------------*/
	
#content{
	text-align: left;
	clear: both;
	width: 991px;
	height: 480px;
	/*background: url('../images/main.jpg') no-repeat;*/}
	
#content-thin{
	text-align: left;
	clear: both;
	width: 991px;
	height: 419px;
	background: url('../images/content-thin.gif') no-repeat;}
	
#content-noscroll{
	text-align: left;
	clear: both;
	width: 991px;
	height: 419px;
	background: url('../images/content-noscroll.gif') no-repeat;}
	
#content-newsletter{
	text-align: left;
	clear: both;
	position: relative;
	width: 991px;
	height: 419px;
	background: url('../images/content-noscroll.gif') no-repeat;}

#content-newsletter .photo{
	margin: 20px 0 0 30px;}
	
#content-links{
	text-align: left;
	clear: both;
	width: 991px;
	height: 419px;
	background: url('../images/content-noscroll.gif') no-repeat;}
	
#content-events{
	text-align: left;
	position: relative;
	clear: both;
	width: 991px;
	height: 419px;
	padding: 0;
	background: url('../images/content-events.gif') no-repeat;}
	
#content-events .photo{
	margin: 30px 10px 0 55px;
}
	
#events-right{
	text-align: left;
	width: 210px;
	height: 319px;
	float: left;
	display: inline;
	color: #8ce6ec;
	margin: 80px 0px 0px 0px;
	font-size:.9em;}
#events-right h4, #events-right p{
	padding:0;
	margin-left:15px;}
	
#events-right p{
	line-height:1em;
	padding-bottom:3px;}
	
#newsletter-div h2{
	line-height: 1em;}
	
#vendor h2{
	line-height: 1em;}

#links-div a{
	float: left;
	display: inline;
	padding:0;
	margin: 0;}
	
#links-div img{
	padding: 0;
	margin: 0;}
	
	
#slider-container{
	width: 214px;
	height: 290px;}
	
#slider-holder{
	float: left;
	display: inline;
	padding: 15px 0 15px 15px;
	margin-top:80px;
	/*overflow: hidden;*/
	width: 190px;
	height: 290px;}
	
.slider-handle{
	position: relative;
	width: 23px;
	height: 40px;
	background-image: url('../images/slider.png');}
	
#slider-container-full{
	width: 991px;}
	
#slider-holder-full{
	float: left;
	display: inline;
	padding: 31px 0 0 15px;
	overflow: hidden;
	width: 991px;
	height: 380px;}	


/* Your template
-----------------------------------------------------------------------------*/
#flash{
	background-color: #cfb86a; }
	
#footer-thin{
	width: 991px;
	height: 70px;
	background: url('../images/footer-thin.gif') no-repeat;}
	
#home{
	width: 754px;
	height: 480px;
	float: left;
	display: inline;
	background: url('../images/home_bg.jpg') no-repeat;}
	
#feature{
	height: 375px;
	width: 754px;
	background-image: url('../images/photos/homepage/tomatos.jpg');}
	
#home-footer{
	float: left;
	width: 754px;
	height: 105px;
	background: url('../images/home_foot.gif') no-repeat;
	font-size: 11px;
	text-align: center;}
	
#home-right{
	text-align: left;
	width: 237px;
	height: 440px;
	background-image: url('../images/home_right.jpg');
	float: left;
	display: inline;
	color: #8ce6ec;}
	
#home-right img{}
	
#home-right-bottom{
	text-align: left;
	width: 237px;
	height: 40px;
	background: url('../images/home_right.jpg') bottom;
	float: left;
	display: inline;
	color: #8ce6ec;}
	
#home-right-bottom a{
	width: 100%;
	height: 100%;
	display: block;}

#up{
	width: 23px;
	height: 35px;
	margin-top: 35px;
	float: left;}
	
#slider{
	float: left;
	width: 23px;
	height: 290px;
	background-image: url('../images/track.gif');}
	
#down{
	width: 23px;
	height: 31px;
	float: left;}

.home-search{
	float: right;
	padding-right:22px;}
	
.emailus{
	width:250px;
	height: 40px;
	float: left;
	display: inline;}
	
.footer-search{
	float: right;
	padding:15px 75px 0 0;}
	
.search{
	background: transparent none repeat scroll 0 0;
	border: none;
	color: #20231D;
	font-size:14px;
	padding:5px 0 0 15px;
	width: 100px;
	height: 21px;}

#city{
	width:280px;
	height: 40px;
	float: left;
	display: inline;
	text-align: left;}
	
#hours{
	width: 85px;
	height: 40px;
	float: left;
	display: inline;}
	
#pets{
	width: 139px;
	height: 40px;
	float: left;
	display: inline;}
	
#organic{
	text-align: left;
	margin-top:3px;
	float: left;
	display: inline;
	height: 35px;
	width: 250px;}
	
.photo{
	float: left;
	display: inline;
	margin: 0 0 0 30px;}
	
.floatleft{
	position: relative;
	width: 400px;
	float: left;
	display: inline;
	padding: 0 0 0 10px;
	text-align: left;}
	
.floatleft img{
	float: left;
	display: inline;
	padding: 0;
	margin: 0;}
	
.zero{
	padding: 0;
	margin: 0;}
	
.floatleft-events{
	float: left;
	display: inline;
	padding: 0 10px 0 10px;
	width: 370px;}

.date{
	font-size: 1em;
	color: #004A11;}
	
.newsletter{
	font-size: .8em;}
	
.join{
	font-size: 1em;
	width: 90%}
	
.join p{
	color: #004A11;
	padding: 0 5px 0 0;
	font-size: 1em;}
	
.join a{
	font-size: 1em;}

.green{
	color: #004A11;}
	
.black{
	color: black;}
	
.red{
	color: #880000;}

	
/*HOMEPAGE SLIDER CSS*/

.navigation{
	width: 690px;
	height: 55px;
	margin: 15px 0 0 60px;
	list-style-type: none;
	float:left;
	display: inline;}
	
#nav-loading{
	height: 50px;
	width: 340px;
	float: left;
	display: inline;
	margin:20px 0 0 230px;}
	
.navigation li{
	float: left;
	display: inline;
	padding: 0 6px;
	margin: 0;}
	
.navigation li a{
	display: inline;
	float: left;
	width: 43px;
	height: 43px;
	padding: 0;
	margin:0;}
	
.navigation li img{
	float: left;
	display: inline;}

	
.blurb{
	width: 350px;
	float: left;
	display: inline;}

	
/*EOF HOMEPAGE SLIDER CSS */

	
.tooltip{
	color: black;
	font-size: 13px;
	line-height: 1.2em;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: none;
	height: 75px;
	width: 229px;
	background-color: none;
	background-image: url('../images/tooltip.png');}
	
.tooltip p{
	padding: 5px 10px;}

.tooltip a{
	text-decoration: none;
	color: black;}
	
.tooltip a:hover{
	text-decoration: none;
	color: black;}

/* Forms
-----------------------------------------------------------------------------*/
input{
	float: left;
	display: inline;}
	
/*
input:focus{
	border: none;
	background: transparent;}


input.text
	{
	padding: 3px;
	border: 1px solid #666;	}
*/
	

/* ----- BUTTONS ----- */

input.btTxt{
	padding:0 7px;
	width:auto;
	overflow:visible;
}

.buttons input{
	font-size:120%;
	margin-right: 5px;
}

.buttons{
	clear:both;
	padding: 0;
	margin: 0 10px;}
	
.buttons a, button, input.file, .submit{
    display:block;
    float:left;
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;

    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:11px;;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */
}
.buttons a:hover, .buttons button:hover, .submit:hover{
	display:block;
    float: left;
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;
    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:11px;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#529214;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */}
    
button{
    width:auto;
    overflow:visible;
    padding:4px 10px 3px 7px; /* IE6 */
}
button[type], button[type]:hover{
    padding:5px 10px 5px 7px; /* Firefox */
    line-height:17px; /* Safari */
}
*:first-child+html button[type]{
    padding:4px 10px 3px 7px; /* IE7 */
}
button img, .buttons a img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
}

/* STANDARD */

.buttons button:hover, .buttons a:hover{
    background-color:#999;
    border:1px solid #666;
    color: #333;
}
.buttons a:active{
    background-color:#529214;
    border:1px solid #529214;
    color:#fff;
}

/* POSITIVE */

button.positive, a.positive{
    color:#529214;
}
a.positive:hover, button.positive:hover{
    background-color:#E6EFC2;
    border:1px solid #C6D880;
    color:#529214;
}
a.positive:active{
    background-color:#529214;
    border:1px solid #529214;
    color:#fff;
}

/* NEGATIVE */

a.negative, button.negative{
    color:#d12f19;
}
a.negative:hover, button.negative:hover{
    background:#fbe3e4;
    border:1px solid #fbc2c4;
    color:#d12f19;
}
a.negative:active{
    background-color:#d12f19;
    border:1px solid #d12f19;
    color:#fff;
}

/* EDIT */

a.edit, button.edit{
    color: #d1ca32;
}
a.edit:hover, button.edit:hover{
    background:#fbf6de;
    border:1px solid #d1ca32;
    color:#d1ca32;
}
a.edit:active{
    background-color:#d1ca32;
    border:1px solid #d1ca32;
    color:#fff;
}

/* END OF BUTTONS */

/* Tables 
-----------------------------------------------------------------------------*/



table{ 
  	border-spacing: 0;
	border-collapse: collapse;}

td{
	font-weight: normal;
	font-size: 1.2em;
	padding: 3px;
	vertical-align: top;}