/*
######################################################################################
######                                                                        #######
######     STANDARD/MARKUP STYLES                                            #######
######                                                                      #######
##################################################################################
*/

/********************************************************************************/
/***** MARKUP STYLES ***********************************************************/
/******************************************************************************/

/** For max height properties **/
html, body {
	height: 100%;
	}

body {
	font: normal 75% Verdana, Arial, Helvetica, sans-serif;
	color: #434c43;
	}
a {
	text-decoration: none;
	color: #58aa1a;
	}
a:hover { text-decoration: underline; color: #32790f; }
hr { display: none; }
p { margin-bottom: 15px; line-height: 1.6em; }
strong { color: #32790f; }


/********************************************************************************/
/***** HEADER STYLES ***********************************************************/
/******************************************************************************/

h1 {
	margin: 0 0 15px 0;
	padding: 0;
	font: normal 1.8em Century Gothic, Arial, Helvetica, sans-serif;
	}
h2 {
	margin: 0 0 13px 0;
	padding: 0;
	font: bold 1.6em Century Gothic, Arial, Helvetica, sans-serif;
	}
h3 {
	margin: 0 0 5px 0;
	padding: 0;
	font: bold 1.4em Century Gothic, Arial, Helvetica, sans-serif;
	}
h4 {
	margin: 0 0 4px 0;
	padding: 0;
	font: bold 1.2em Century Gothic, Arial, Helvetica, sans-serif;
	}
h5 {
	margin: 0;
	padding: 0;
	font: bold 1.1em Century Gothic, Arial, Helvetica, sans-serif;
	}
h6 {
	margin: 0;
	padding: 0;
	font: bold 1em Century Gothic, Arial, Helvetica, sans-serif;
	font-style: italic;
	}


/********************************************************************************/
/***** MEDIA STYLES ************************************************************/
/******************************************************************************/

.notforscreen {	display: none; }	/* Everything except for screen */
.notforprint {  }			/* Everything except for print */
.notforhandheld {  }			/* Everything except for handheld */

.screenonly {  }			/* Only for screen */
.printonly {	display: none; }	/* Only for print */
.handheldonly {	display: none; }	/* Only for handheld */


/********************************************************************************/
/***** MISC STYLES *************************************************************/
/******************************************************************************/

/***** CLEAR *****/

.clear {   height: 0; overflow: hidden; clear: both; }	/* for clearing break tags */
.clear_l { clear: left; }
.clear_r { clear: right; }
.clear_n { clear: none; }
.clear_b { clear: both; }

/***** FLOAT *****/

.float_l { float: left; }
	img.float_l { margin-right: 10px; margin-bottom: 10px; }
.float_r { float: right; }
	img.float_r { margin-right: 10px; margin-bottom: 10px; clear: right; }
.float_n { float: none; }



/********************************************************************************/
/***** LINK STYLES *************************************************************/
/******************************************************************************/



/********************************************************************************/
/***** LINE STYLES *************************************************************/
/******************************************************************************/

.dots_horizontal {
	clear: both;
	background-image: url(/static/images/dots_horizontal.gif);
	background-repeat: repeat-x;
	height: 1px;
	overflow: hidden;
	font-size: 0.2em;
	line-height: 0.2em;
	margin-bottom: 10px;
	}
.line_horizontal {
	clear: both;
	height: 1px;
	overflow: hidden;
	font-size: 0.2em;
	line-height: 0.2em;
	margin-bottom: 10px;
	background-color: #B6B6B6;
	}


/********************************************************************************/
/***** SIMPLE COLOR STYLES *****************************************************/
/******************************************************************************/

.blue {	 color: blue; }
.red {	 color: red; }
.green { color: green; }



/*
######################################################################################
######                                                                        #######
######     WEB TEMPLATE STYLES                                               #######
######                                                                      #######
##################################################################################
*/

/********************************************************************************/
/***** WRAPPER STYLES **********************************************************/
/******************************************************************************/

#wrapper {
	position: relative;
	font-size: 1em;
	width: 929px;
	margin: 0 auto;
	}

/********************************************************************************/
/***** TOP STYLES **************************************************************/
/******************************************************************************/

/***** TOP *****/

#top {
	padding-top: 30px;
	width: 929px;
	height: 21px;
	}


/***** TOP NAV *****/

#top_nav {
	float: right;
	margin: 0 10px 0 0;
	padding: 0;
	font-size: 1em;
	color: #83c856;
	}
	#top_nav a {
		color: #666666;
		margin: 0 9px;
		font-family: Verdana, Geneva, sans-serif;
		}
	#top_nav a:hover {
		text-decoration: underline;
		}
	#top_nav a.active {
		font-weight: bold;
		}


/********************************************************************************/
/***** HEADER STYLES ***********************************************************/
/******************************************************************************/

#header {
	width: 929px;
	height: 63px;
	background-image: url(../../images/generic/header_bg.jpg);
	}

/***** LOGO STYLES *****/

	#header .logo {
		margin: 19px 0 0 28px;
		float: left;
	}

/***** TAB STYLES *****/

#tabs {
	float: right;
	margin: 34px 12px 0 0;
	padding: 0 10px 0 0;
	height: 29px;
	width: 296px;
	background-image: url(../../images/generic/tabs_bg.gif);
	}
	#tabs li {
		float: right;
		height: 29px;
		margin: 0 0 0 -7px;
		padding: 0;
		list-style: none;
		}
		#tabs li a {
			float: left;
			height: 29px;
			background-position: 0 29px;
			background-repeat: no-repeat;
			text-indent: -6767px;
			overflow: hidden;
			}
		#tabs li a:hover,
		#tabs li a.active{
			background-position: 0 0;
			text-decoration: none;
			}
			
		#tabs li.tabs_home { width: 73px; }
		#tabs li.tabs_shop { width: 75px; }
		#tabs li.tabs_about { width: 162px; }
		#tabs li.tabs_home a { background-image: url(../../images/generic/tabs_home.gif); width: 73px; }
		#tabs li.tabs_shop a { background-image: url(../../images/generic/tabs_shop.gif); width: 75px; }
		#tabs li.tabs_about a { background-image: url(../../images/generic/tabs_about.gif); width: 162px; }
	
		

/********************************************************************************/
/***** BANNER STYLES ***********************************************************/
/******************************************************************************/

#banner {
	width: 929px;
	height: auto !important;
	min-height: 83px;
	height: 83px;
	background-repeat: no-repeat;
	margin-bottom: 15px;
	text-align: right;
	padding-top: 25px;
	background-color: #fdf8bd;
	}
	#banner h1 {
		text-align: right;
		font-size: 3.3em;
		line-height: 1em;
		margin: 0 19px 0 0;
		padding: 0;
		font-family: Helvetica, Arial, sans-serif;
		color: #32790f;
		}
	#banner h2 {
		text-align: right;
		margin: 0 15px 0 0;
		line-height: 1em;
		font: normal 1.6em Helvetica, Arial, sans-serif;
		color: #76c224;
		}


/********************************************************************************/
/***** MIDDLE STYLES ***********************************************************/
/******************************************************************************/

.middle {
	width: 929px;
	overflow: hidden;
	}


/********************************************************************************/
/***** CONTENT LEFT ************************************************************/
/******************************************************************************/

.content_left {
	float: left;
	height: auto !important;
	height: 250px;
	min-height: 250px;
	width: 197px;
	margin-bottom: 27px;
	}
	.content_left .header {
		width: 197px;
		height: 37px;
		padding: 0;
		margin: 0;
		text-indent: -6767px;
		overflow: hidden;
		background-image: url(../../images/generic/left_header.gif);
	}
	.content_left .footer {
		width: 197px;
		height: 7px;
		padding: 0;
		margin: 0;
		overflow: hidden;
		background-image: url(../../images/generic/left_footer.gif);
	}

/***** NAVIGATION *****/

	.content_left .navigation {
		margin: 0;
		padding: 2px 0 0 0;
		width: 195px;
		border-left: 1px solid #c0e098;
		border-right: 1px solid #c0e098;
		overflow: hidden;
		list-style: none;
		}
		.content_left .navigation li {
			float: left;
			padding: 5px 0 0 0;
			margin: 0;
			width: 195px;
			overflow: hidden;
			}
			.content_left .navigation li .icon {
				float: left;
				width: 52px;
				}
				.content_left .navigation li .icon img {
					display: block;
					margin: auto;
				}
			.content_left .navigation li .text {
				float: left;
				width: 143px;
				padding-top: 10px;
				}
				.content_left .navigation li .text a { color: #32790f; }
				.content_left .navigation li .text a:hover { text-decoration: underline; }
				.content_left .navigation li .text a.active { font-weight: bold; }


/********************************************************************************/
/***** CONTENT RIGHT ***********************************************************/
/******************************************************************************/

.content_right {
	float: left;
	height: auto !important;
	height: 250px;
	min-height: 250px;
	width: 249px;
	margin-bottom: 27px;
	font-size: 1.1em;
	}
	.content_right p {
		line-height: 1.3em;
	}
	.content_right h3 {
		color: #184d13;
		font: normal 1.6em Century Gothic, Helvetica, Arial, sans-serif;
		margin-bottom: 10px;
	}
	.content_right .delivery {
		position: relative;
		float: left;
		width: 185px;
		height: auto !important;
		min-height: 139px;
		height: 139px;
		padding: 15px 49px 25px 15px;
		margin-bottom: 11px;
		background-image: url(../../images/generic/right_delivery.gif);
		background-repeat: no-repeat;
		}
		.content_right .delivery p {
			padding-right: 40px;
		}
	.content_right .customer {
		position: relative;
		float: left;
		width: 234px;
		height: auto !important;
		min-height: 96px;
		height: 96px;
		padding: 15px 0 25px 15px;
		background-image: url(../../images/generic/right_customer.gif);
		background-repeat: no-repeat;
	}
	
	.content_right .btn {
		position: absolute;
		left: 15px;
		bottom: 12px;
		margin: 0;
		padding: 0;
		list-style: none;
		}
		.content_right .btn li {
			margin: 0;
			padding: 0;
			}
			.content_right .btn li a {
				display: block;
				text-indent: -6767px;
				overflow: hidden;
				background-position: 0 0;
			}
			
	.content_right .btn_check-now {
		background-image: url(../../images/generic/btn_check-now.gif);
		width: 129px;
		height: 27px;
	}
	.content_right .btn_check-now:hover { background-position: 0 -27px; }
	.content_right .btn_sign-in {
		background-image: url(../../images/generic/btn_sign-in.gif);
		width: 109px;
		height: 23px;
	}
	.content_right .btn_sign-in:hover { background-position: 0 -23px; }



/********************************************************************************/
/***** CONTENT CENTER **********************************************************/
/******************************************************************************/

.content_center {
	float: left;
	height: auto !important;
	height: 250px;
	min-height: 250px;
	width: 445px;
	padding: 0 18px 0 20px;
	margin-bottom: 27px;
	}
	
	.content_center a { text-decoration: underline; }

/***** 4 THUMBS *****/

	.content_center .four_thumbs {
		width: 445px;
		height: 100px;
		margin: 0 0 15px 0;
		padding: 0;
		}
		.content_center .four_thumbs img { display: block; }


/********************************************************************************/
/***** FOOTER STYLES ***********************************************************/
/******************************************************************************/

#footer {
	width: 929px;
	border-top: 1px solid #c0e098;
	color: #666666;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 0.9em;
	overflow: hidden;
	}
	#footer .left {
		float: left;
		margin: 17px 0 0 0;
		padding: 0;
		}
		#footer .left span {
			color: #83c856;
		}
	#footer .left a {
		color: #666666;
		margin: 0 7px;
		}
	#footer .left a:hover {
		text-decoration: underline;
		}
	#footer .left a.active {
		font-weight: bold;
		}


/***** RIGHT *****/
		
	#footer .right {
		float: right;
		margin: 10px 0 0 0;
		padding: 0;
		}
		#footer img {
			float: right;
			margin-left: 10px;
		}




/*
######################################################################################
######                                                                        #######
######     GENERIC COMPONENT STYLES                                          #######
######                                                                      #######
##################################################################################
*/

/********************************************************************************/
/****** COLUMN STYLES **********************************************************/
/******************************************************************************/

/***** PAGE CONTENT COLUMNS *****/

/** These columns are designed to be used within the normal content of a page **/

.half {
	float: left;
	width: 49.9%;
	width/**/:/**/ 48% !important;
	width/**/:/**/ 47.9%;
	padding-right: 2%;
	}
.third {
	float: left;
	width: 33%;
	width/**/:/**/ 31%;
	padding-right: 2%;
	}
.two_thirds {
	float: left;
	width: 66%;
	width/**/:/**/ 64%;
	padding-right: 2%;
	}
.quarter {
	float: left;
	width: 24.9%;
	width/**/:/**/ 23% !important;
	width/**/:/**/ 22.9%;
	padding-right: 2%;
	}
.three_quarters {
	float: left;
	width: 74.9%;
	width/**/:/**/ 73% !important;
	width/**/:/**/ 72.7%;
	padding-right: 2%;
	}


/***** TEMPLATE STRUCTURE COLUMNS *****/

/** Combinations of these columns can be used to replace 
the main column styles (content_left, content_center ETC) **/

/** IE6 has a problem with exact percentage widths, hence the hack **/

.content_half {
	float: left;
	width: 50% !important;
	width: 49.9%;
	}
.content_third {
	float: left;
	width: 33% !important;
	width: 33.3%;
	}
.content_two_thirds {
	float: left;
	width: 66% !important;
	width: 66.6%;
	}
.content_quarter {
	float: left;
	width: 25% !important;
	width: 24.9%;
	}
.content_three_quarters {
	float: left;
	width: 75% !important;
	width: 74.9%;
	}



/********************************************************************************/
/****** FORM STYLES ************************************************************/
/******************************************************************************/

/***** FORM ELEMENTS *****/

.frm_text,
.frm_text_sml,
.frm_dropdown,
.frm_multi,
textarea {
	font: normal 1em Arial, Helvetica, sans-serif;
	color: #5B5B5B;
	border: 1px solid silver;
	}
.frm_check,
.frm_radio {
	width: 13px;
	height: 13px;
	margin: 0;
	padding: 0;
	}
.frm_button {
	border: 0;
	margin: 0;
	padding: 0;
	}
.frm_submit {
	border: 0;
	margin: 0;
	padding: 0;
	background-image: none;
	background-color: transparent;
	}
label {
	}
	label em {
		color: red;
		}

	
/***** FLOATING ELEMENTS *****/

.fld_float {
	margin-bottom: 10px;
	}
	.fld_float label {
		float: left;
		width: 113px;
		}
	.fld_float .frm_text, .fld_float .frm_dropdown, .fld_float .frm_multi,
	.fld_float .frm_file, .fld_float textarea, .fld_float .frm_float1 {
		float: left;
		width: 168px;
		margin-bottom: 10px;
		}
	.fld_float .frm_float1 {
		background-color: transparent;
		}

	.fld_float .frm_check,
	.fld_float .frm_radio {
		float: left;
		margin-bottom: 10px;
		}
	.fld_float label.lbl_neutral {
		float: left;
		width: auto;
		z-index: 1;
		}
		.fld_float .lbl_neutral .frm_text,
		.fld_float .lbl_neutral .frm_dropdown,
		.fld_float .lbl_neutral .frm_multi,
		.fld_float .lbl_neutral .frm_file,
		.fld_float .lbl_neutral textarea {
			width: auto;
			}
		/* Can be added to any of the above styles to space the fields out */	
		.fld_float .lbl_neutral .spacer {
			margin-right: 10px;
			}
	
/** Float within a float 1 **/

	.fld_float .frm_float1 {
		margin-bottom: 10px;
		}
		.fld_float .frm_float1 .frm_check,
		.fld_float .frm_float1 .frm_radio {
			float: left;
			margin-bottom: 0;
			margin-right: 5px;
			}
		.fld_float .frm_float1 label {
			float: left;
			width: 150px;
			margin-bottom: 0;
			}


/** Float within a float 2 **/

	.fld_float .frm_float2 {
		float: left;
		width: 50px;
		}
		.fld_float .frm_float2 label {
			float: none;
			width: auto;
			display: block;
			text-align: center;
			}
		.fld_float .frm_float2 .frm_check,
		.fld_float .frm_float2 .frm_radio {
			float: none;
			display: block;
			margin: auto;
			}
	

/***** BLOCK LEVEL ELEMENTS *****/

.fld_block {
	margin-bottom: 10px;
	}
	.fld_block br {
		display: none;
		}

	.fld_block label {
		display: block;
		}
	.fld_block .lbl_neutral {
		float: left;
		width: auto;
		font-weight: normal;
		margin-bottom: 5px;
		clear: none;
		}
		.fld_block .lbl_neutral .frm_text,
		.fld_block .lbl_neutral .frm_dropdown,
		.fld_block .lbl_neutral .frm_multi,
		.fld_block .lbl_neutral .frm_file,
		.fld_block .lbl_neutral textarea {
			width: auto;
			margin-bottom: 10px;
			}	
	.fld_block .frm_text,
	.fld_block .frm_dropdown,
	.fld_block .frm_multi,
	.fld_block .frm_file,
	.fld_block textarea {
		display: block;
		width: 300px;
		margin-bottom: 10px;
		}
	.fld_block textarea {
		height: 80px;
		}

/** Error styling **/
	
	.fld_block .frm_text.frm_error,
	.fld_block .frm_dropdown.frm_error,
	.fld_block .frm_multi.frm_error,
	.fld_block .frm_file.frm_error,
	.fld_block textarea.frm_error {
		background-color: #FF5454;
		color: white;
		}


/***** CHECKBOX AND RADIO BUTTON STYLING *****/

/** Left floating INPUT **/
.fld_checkradio_l {
	margin-bottom: 5px;
	}
	.fld_checkradio_l .frm_check,
	.fld_checkradio_l .frm_radio {
		position: absolute;
		left: 0 !important;
		left: -19px; /* IE6 adds the LABEL padding to the positioning */
		top: 0;
		}
	.fld_checkradio_l label {
		position: relative;
		display: block;
		margin-bottom: 5px;
		padding-left: 19px;
		}

/** Right floating INPUT **/
.fld_checkradio_r {
	margin-bottom: 5px;
	padding-right: 19px;
	}
	.fld_checkradio_r .frm_check,
	.fld_checkradio_r .frm_radio {
		position: absolute;
		right: -19px !important;
		right: 0;
		top: 0;
		}
	.fld_checkradio_r label {
		position: relative;
		display: block;
		margin-bottom: 5px;
		padding-right: 19px;
		}


/***** SUBMIT BUTTON STYLING *****/

.fld_submit {
	margin-bottom: 10px;
	}
	.fld_submit .visa-verify {
		}
	.fld_submit .frm_message {
		float: left;
		}
		.fld_submit .frm_message em {
			color: red;
			}
	.fld_submit .frm_submit {
		float: right;
		}


/********************************************************************************/
/****** BUTTON STYLES **********************************************************/
/******************************************************************************/

/** The following styles are used in conjuction with the 'button rollover' JavaScript
for full rollovers on INPUT elements **/

/** Form buttons **/

.frm_submit,
.frm_submit-active {
	display: block;
	height: 24px;
	background-color: #D6D3CB;
	}
.frm_submit-active,
.frm_submit:focus,
.frm_submit:hover {
	background-color: #E8E5DC;
	}
	


/*
######################################################################################
######                                                                        #######
######     UNIQUE PAGE STYLES                                                #######
######                                                                      #######
##################################################################################
*/