/*-----------------------------------------------------------------------------
Zoka Coffee Screen Stylesheet

version:	1.1
date:		September 3, 2008
author:		Ryan J. Salva
email:		ryan at capitolmedia dot com
website:	capitolmedia.com
-----------------------------------------------------------------------------


Default Font Styles
-----------------------------------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
}

html {
	height: 100%;
}

body {
	font-family: Verdana, Arial, Sans-Serif;
	font-size: 11px;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	color: #FFFFCC;
	background-color: #251B11;
	height: 100%;
}

p, ul, ol, blockquote, h1, h2, h3, h4, h5, h6 {
	line-height: 1.3em;
	margin-bottom: 10px;
}

li {
	margin-bottom: 7px;
}

li ul, li ol {
	margin-top: 7px;
	margin-bottom: 7px;
}

h1, h2, h3, h4, h5 {
	font-weight: bold;
}

h1 {
	font-size: 1.8em;
}

h2 {
	font-size: 1.6em;
}

h3 {
	font-size: 1.4em;
}

h4 {
	font-size: 1.2em;
}

h5 {
	font-size: 1em;
	margin-bottom: 5px;
}

ul, OL, BLOCKQUOTE, CODE {
	padding-left: 3em;
}

img {
	border: none;
}

a:link {
	color: #FFFFCC;
	text-decoration: none;
}

a:hover {
	color: #FFFFCC;
	text-decoration: underline;
}

a:active {
	color: #FFFFCC;
	text-decoration: none;
}

a:visited {
	color: #FFFFCC;
	text-decoration: none;
}

div#Wrapper a:link, div#Wrapper a:active, div#Wrapper a:visited {
	color: #000;
}

div#Wrapper a:hover {
	color: #993302;
}


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

table, td, th {
	border-collapse: collapse;
	border: 1px solid #000;
	font-family: "Lucida Sans", Verdana, Arial, Arial, Verdana, Sans-Serif;
	font-size: 11px;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
}

th, thead td {
	font-weight: bold;
	border-bottom: 2px solid #000;
	padding: 3px;
}

th, td {
	padding: 3px;
}

table.contact, td {
	border: none;
	border-collapse: collapse;
}


/*Convenience Classes
-----------------------------------------------------------------------------*/

.Hidden {
	display: none;
	visibility: hidden;
}

.Visible {
	display: block;
	visibility: visible;
}

.Clear {
	clear: both;
	float: none;
	padding-bottom: 1px;
	margin-bottom: -1px;
}

.Padding {
	padding: 20px;
}

.Red {
	color: #FF0000;
}

.FloatLeft {
	float: left;
	margin: 0 15px 15px 0;
}

.FloatRight {
	float: right;
	margin: 0 0 15px 15px;
}

.smaller {
	font-size: smaller;
}


/*Canvas
-----------------------------------------------------------------------------*/

div#Wrapper, div#Promotion, div#Parchment {
	margin: 0 auto;
	width: 780px;
	position: relative;
}

div#Wrapper {
	background: url(../site/bg_wrapper.jpg) repeat-y top left;
	color: #000;
}

div#Parchment {
	height: 110px;
	background: url(../site/bg_parchment.jpg) no-repeat top left;
	color: #000;
}

div#Parchment h1 {
	margin: 0;
}

div#Canvas {
	position: relative;
	color: #000;
}

div#Canvas div.Padding {
	padding-top: 0;
	position:relative;
	z-index:1;
}

div#LowerSection {
	margin: 25px 0 0 15px;
	position: relative;
}

p#Ancestors {
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 0.9em;
}

p#Ancestors, p#Ancestors a {
	color: #000;
	text-decoration: none;
}

p#Ancestors a:hover {
	text-decoration: underline;
}


/*Left Column
-----------------------------------------------------------------------------*/

div.Left {
	margin-left: 180px;
}

div#Left {
	position: absolute;
	top: 0;
	left: 0;
	width: 180px;
	color: #FFFFCC;
}

div#Left a:link, div#Left a:visited {
	color: #FFFFCC;
}

div#Left a:hover, div#Left a:active {
	color: #FFFFFF;
	text-decoration: underline;
}

div.NavigationGroup {
	padding-bottom: 40px;
	background: url(../site/bg_navigationgroup.gif) no-repeat center bottom;
}

div#SecondaryTea h3, div#SecondaryEssentials h3,
div#SecondaryTea div.sidenav-header,
div#SecondaryEssentials div.sidenav-header {
	display: none;
}

div.NavigationGroup ul {
	padding: 0;
	margin: 0 0 14px;
	list-style: none;
}

div.NavigationGroup ul li {
	display: block;
	position: relative;
	padding: 0;
	margin: 0;
}

div.NavigationGroup ul li a {
	display: block;
	width: 180px;
	line-height: 18px;
	height: 18px;
	font-size: 10px;
	text-decoration: none;
	overflow: hidden;
	text-indent: 20px;
	background: url(../site/bg_secondary.gif) no-repeat 10px 50%;
}

div.NavigationGroup ul li A.Active {
	color: #FFF;
	font-weight: bold;
}


/*Right Column
-----------------------------------------------------------------------------*/

div.Right {
	margin-right: 240px;
}

div#Right {
	position: absolute;
	top: 0;
	right: 0;
	width: 240px;
}


/*Header
-----------------------------------------------------------------------------*/

div#Header {
	margin: 0 auto;
	width: 780px;
	position: relative;
	z-index: 10;
	height: 110px;
}

div#Header a {
	color: #FFFFCC !important; /*[e]#FFFFCC*/
}

A#Logo
{
	width:130px;
	position: absolute;
	top: 20px;
	left: 20px;
    padding: 77px 0 0 0;
    overflow: hidden;
    background-image: url(http://zokacoffee.com/site/logo_zoka.gif);
    background-repeat: no-repeat;
    height: 0px !important;
    height /**/:77px;
}
/*...............Subscribe to Campaign Monitor .................*/

fieldset#Subscribe {
	border: none;
}

fieldset#Subscribe legend {
	display: none;
}

/*. . . . . . . . . . Primary Navigation . . . . . . . . . .*/

ul#Primary {
	position: absolute;
	bottom: 15px;
	left: 191px;
	padding: 0;
	margin: 0;
	list-style: none;
}

ul#Primary li {
	display: block;
	float: left;
	position: relative;
	margin: 0 4px;
	padding: 0;
}

ul#Primary li a {
	display: block;
	background-image: url(http://www.zokacoffee.com/site/bg_primary.gif);
	height: 20px;
	line-height: 20px;
	text-indent: -2000em;
	outline: none;
}

ul#Primary li ul {
	position: absolute;
	width: 180px;
	height: auto;
	top: auto;
	left: -2000em;
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 0.1em solid #7F2A00;
	z-index:1000;
}

ul#Primary li.hover ul {
	top: 20px;
	left: 0;
}

ul#Primary li ul li {
	border-top: 1px solid #7F2A00;
	margin: 0;
	padding: 0;
}

ul#Primary li ul li a {
	height: 24px;
	line-height: 24px;
	width: 180px !important; /*[e]180px*/
	font-weight: normal;
	background: #993302;
	text-indent: 10px;
	outline: none;
}

ul#Primary li ul li a:hover {
	background: #251B11;
	text-decoration: none;
	outline: none;
}

ul#Primary li#HomeNavigation a {
	width: 75px;
	background-position: 10px 0;
}

ul#Primary li#HomeNavigation a:hover {
	background-position: 10px -20px;
}

ul#Primary li#CoffeeNavigation a {
	width: 79px;
	background-position: -190px 0;
}

ul#Primary li#CoffeeNavigation a:hover {
	background-position: -190px -20px;
}

ul#Primary li#TeaNavigation a {
	width: 59px;
	background-position: -390px 0;
}

ul#Primary li#TeaNavigation a:hover {
	background-position: -390px -20px;
}

ul#Primary li#CoffeeClubNavigation a {
	width: 109px;
	background-position: -590px 0;
}

ul#Primary li#CoffeeClubNavigation a:hover {
	background-position: -590px -20px;
}

ul#Primary li#EducationNavigation a {
	width: 96px;
	background-position: -790px 0;
}
ul#Primary li#EducationNavigation a:hover {
	background-position: -790px -20px;
}

ul#Primary li#AboutNavigation a {
	width: 107px;
	background-position: -990px 0;
}

ul#Primary li#AboutNavigation a:hover {
	background-position: -990px -20px;
}

/*. . . . . . . . . . System Navigation . . . . . . . . . .*/

ul#System {
	position: absolute;
	top: 10px;
	right: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 35em;
}

ul#System li {
	display: block;
	float: right;
	margin-left: 2em;
}

DIV#Header UL#System A
{
	color: #cfb07d !important;
}

UL#System A:hover
{
	text-decoration: underline;
	color: #FFF !important;
}

a#ViewCart,
a#ShowSubscribe,
a#locations {
	padding:0 0 0 23px;
	color:#cfb07d;
	text-decoration:none;
}

a#ViewCart {
	background: url(http://www.zokacoffee.com/site/icon-cart.gif) no-repeat 0 50%;
}

a#ShowSubscribe {
	background: url(http://www.zokacoffee.com/site/bg_showsubscribe.gif) no-repeat 0 50%;
}

a#locations {
	background: url(http://www.zokacoffee.com/site/icon-cup.gif) no-repeat 0 50%;
}


/*Promotion
-----------------------------------------------------------------------------*/

div#Promotion p {
	font-size: 1.25em;
}

div#Promotion img.promobutton {
	padding-top: 0.1em;
}

div#Promotion {
	padding-top: 2em;
}


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

div#Footer {
	clear: both;
	width: 780px;
	margin: 0 auto;
	padding: 2em 0;
	text-align: center;
}

div#Footer a {
	color: #FFFFCC !important; /*[e]#FFFFCC*/
	text-decoration: underline !important; /*[e]underline*/
}

p#Copyright, p#Credits {
	margin: 0;
}


/*Page Properties (edit mode)
-----------------------------------------------------------------------------*/

div#PageProperties {
	position: relative;
	padding: 1em;
	color: #000;
	background: #FFF;
	font-family: "lucida grande", "lucida sans", tahoma, verdana, arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
}

div#PageProperties a {
	color: #0000FF !important; /*[e]#0000FF*/
}

div#PageProperties a:hover {
	color: #0000FF !important; /*[e]#0000FF*/
}

div#MetaData {
	margin-right: 240px;
	padding: 10px;
	background: #DEDEDE;
}

h4#MetaKeywords {
	padding-left: 20px;
	background: url(../admin/tag_blue.png) no-repeat 0 50%;
}

h4#MetaDescription {
	padding-left: 20px;
	background: url(../admin/tag_red.png) no-repeat 0 50%;
}

div#InternalComments {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 220px;
	line-height: 1.6em;
}

div.Note {
	padding: 5px 5px 5px 35px;
	background: #F3E5A1 url(../admin/note.png) no-repeat 10px 6px;
	border: 1px solid #FFCC00;
}

/*Forms
-----------------------------------------------------------------------------*/
fieldset {
	padding: 1em;
	border: none;
	border-top: 1px solid #0000FF;
}
legend {
	font-size: 1.4em;
	color: #0000FF;
}
div.LabelInput {
	margin-bottom: 7px;
	display: block;
}

input[type='text'], input[type='password'], select, textarea {
	font-size: 1em;
	font-family: "Lucida Sans", Verdana, Arial, Tahoma, Sans-Serif;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	padding: 3px;
	border: 1px solid #666;
	width: 23em;
}

select {
	width: 23.7em;
}

textarea {
	width: 37em;
	height: 20em;
}

div.FullWidth input[type='text'], div.FullWidth input[type='password'], div.FullWidth select, div.FullWidth textarea {
	width: 32em;
}

.Radio label {
	width: auto;
	display: inline;
	float: none;
}

label {
	line-height: 2em;
	width: 12em;
	float: left;
	display: block;
}

div.FullWidth label {
	width: 15em !important; /*[e]15em*/
	padding-right: 1em;
	text-align: right;
}

div.Submit, p.Submit, span.Submit {
	display: block;
	padding: 14px 0 14px 12em;
/*right padding for label width plus label padding*/
}

#Submit {
	width: 8em;
	margin-right: 14px;
}

.Required {
	font-weight: bold;
}


/*Validation messages delivered by validate.js
-----------------------------------------------------------------------------*/

.error {
	background: #F3E5A1;
}

div.errorMessage {
	background: #F3E5A1 url(../site/icon_error.gif) no-repeat 10px 6px;
	border: 1px solid #FFCC00;
	margin: 0 0 0 10px;
	padding: 5px 5px 5px 35px;
	display: block;
	line-height: 1.6em;
	position: absolute;
	width: 240px;
}


/*Info, Error & Success Messages
-----------------------------------------------------------------------------*/

.Info, .Error, .Success, .ErrorInline, .Help {
	margin-bottom: 14px;
	padding: 5px 5px 5px 35px;
	display: block;
	line-height: 1.6em;
	position: relative;
}

.Info A, .Error A, .Success A, .ErrorInline a {
	color: #000;
	text-decoration: underline;
}

.Info {
	background: #BFC8F1 url(../site/icon_info.gif) no-repeat 10px 6px;
	border: 1px solid #4574AE;
}

.Error {
	background: #F3E5A1 url(../site/icon_error.gif) no-repeat 10px 6px;
	border: 1px solid #FFCC00;
}

.Success {
	background: #B5E1AE url(../site/icon_success.gif) no-repeat 10px 6px;
	border: 1px solid #3B9E2B;
}

.Help {
	background: #BFC8F1 url(../site/icon_info.gif) no-repeat 10px 6px;
	border: 1px solid #4574AE;
}


/*Modal Dialog Box
-----------------------------------------------------------------------------*/

body#Modal {
	background: #FFF;
	color: #000;
}

.ModalContainer {
	background: #FFF;
}

.ModalTitle {
	padding: 10px;
	font-size: 2em;
	color: #000;
}

.ModalMessage {
	padding: 10px;
	color: #000;
}

.ModalClose {
	position: relative;
}

.ModalClose a {
	display: block;
	position: absolute;
	top: -5px;
	right: -5px;
	width: 20px;
	height: 20px;
	overflow: hidden;
	text-indent: -2000em;
	background: url(../site/close.gif) no-repeat top right;
}

.ModalClose a:hover {
}


/*Form Tips
-----------------------------------------------------------------------------*/

div.FormTip {
/*the floating tooltip*/
	background: #BFC8F1 url(../site/icon_info.gif) no-repeat 10px 6px;
	border: 1px solid #4574AE;
	margin: 0 0 0 10px;
	padding: 5px 5px 5px 35px;
	display: block;
	line-height: 1.6em;
	position: absolute;
	width: 240px;
}


/*JavaScript Debug Log
-----------------------------------------------------------------------------*/

div#Debug {
	display: none;
	height: 200px;
	overflow: auto;
	padding: 1em;
	background: #000;
	color: green;
}


/*Event Calendar
-----------------------------------------------------------------------------*/

table.Calendar {
	border: none;
	margin-bottom: 20px;
}

table.Calendar th {
	height: 20px;
	border: 1px solid #D0B581;
	background: #770000;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #FFFFFF;
}

table.Calendar td {
	height: 85px;
	width: 85px;
	border: 1px solid #D0B581;
	font-size: 10px;
	color: #444444;
	vertical-align: top;
	margin: 0;
	padding: 0;
}

table.Calendar td div.Padding {
	padding: 10px 0px;
}

span.UpcomingEvents_Title {
	font-weight: bold;
	font-size: 13px;
}

span.UpcomingEvents_Description {
	font-size: 12px;
	padding-left: 16px;
}

ul#UpcomingEventList li {
	letter-spacing: 1px;
	line-height: 14px;
}

table.Calendar a {
	font-size: 11px;
}

table.Calendar th.CurrentMonth {
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	color: #770000;
	border: none;
	background: none;
	height: 30px;
}

table.Calendar th.PreviousMonth {
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	color: #770000;
	border: none;
	background: none;
	height: 30px;
}

table.Calendar th.NextMonth {
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	color: #770000;
	border: none;
	background: none;
	height: 30px;
}

table.Calendar td.Weekday {
	background: #FFFFF0;
}

table.Calendar td.Weekend {
	background: #FFFFE0;
}

table.Calendar td.Other {
	background: #EEEEEE;
	color: #CCCCCC;
}


/*Event
-----------------------------------------------------------------------------*/

div.Event {
	height: 100%;
	padding: 5px;
}

div.Event.Today {
	background-color: #eaffb4;
}

div.Event ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}



div.Event span.Time {
	clear: both;
	display: block;
}

table#Event #Date {
	font-family: Arial, Verdana, Sans-Serif;
	font-size: xx-large;
	color: #000000;
	vertical-align: top;
	line-height: normal;
	padding: 5px 10px 0px 0px;
	width: 10%;
}

table#Event #Month {
	text-transform: uppercase;
	padding: 5px 0px;
	border-bottom: 1px solid #000000;
}

table#Event #Time {
	color: #999999;
	text-align: right;
	padding: 5px 0px;
	border-bottom: 1px solid #000000;
	white-space: nowrap;
}

.EventTitle, .EventTitleEdit {
	font-family: Verdana, Arial, Sans-Serif;
	font-size: x-small;
	color: #000000;
	margin: 5px 0px 0px;
	font-weight: bold;
}

#Event #Address {
	margin: 20px 0px 0px;
	font-weight: normal;
}


/*Home Page
-----------------------------------------------------------------------------*/

div#Splash {
	background: url(../site/bg_splash.jpg) no-repeat 0 0;
	width: 780px;
	margin: 0 auto;
}

div#Home {
	width: 780px;
	position: relative;
	margin: 0 auto;
	background: url(../site/bg_wrapper_home.jpg) repeat-y 0 0 !important; /*[e]url(../site/bg_wrapper_home.jpg) repeat-y 0 0*/
}

div#RotatingBanner {
	width: 720px;
	height: 410px;
	margin: 15px auto;
	z-index: 9;
	position: relative;
	background: #000;
}

div#RotatingBanner a {
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

/*. . . . . . . . . .  Product Specials . . . . . . . . . .*/

div#Specials {
	margin: 0 290px 0 180px;
	padding: 10px 0;
	position: relative;
}

div#Specials ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

div#Specials ul li {
	display: block;
	position: relative;
	margin-top: 8px;
	width: 290px;
	height: 70px;
	overflow: hidden;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/site/bg_coffeelistitem.png', sizingMethod='scale');
	background: url(../site/bg_coffeelistitem.png) no-repeat 0 0;
	_background: none; /* IE hack */
}

div#Specials ul li a {
	display: block;
	padding: 10px;
	color: #FFF;
}

div#Specials ul li a:hover {
	text-decoration: underline;
}

div#Specials ul li a img {
	float: right;
}

/*. . . . . . . . . .  Blog RSS Feed . . . . . . . . . .*/

div#HomeFeed {
	position: absolute;
	top: 0px;
	right: 10px;
	width: 280px;
}

div#HomeFeed ul {
	margin: 0;
	padding: 0;
	overflow: hidden;
	list-style: none;
}

div#HomeFeed ul li {
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/site/listitem_latestblog.png', sizingMethod='scale');
	background: url(../site/listitem_latestblog.png) no-repeat 0 0;
	_background: none; /* IE hack */
	margin-bottom: 20px;
}

div#HomeFeed ul li {
	padding: 0 0 0 40px;
}

div#HomeFeed ul li a:hover {
	text-decoration: underline;
	color: #FFF;
}

/*. . . . . . . . . .  Banner . . . . . . . . . .*/

div#Community {
	width: 780px;
	margin: 0 auto;
	position: relative;
}

div#Banner {
	position: absolute;
	left: 7px;
	top: 0;
}


/*. . . . . . . . . .  Recent Photos . . . . . . . . . .*/

div#RecentPhotos {
	padding: 10px;
	margin: 20px 300px 20px 0;
	background: #514936;
}

div#RecentPhotos ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

div#RecentPhotos ul li {
	float: left;
	margin: 0;
	padding: 0;
}

div#RecentPhotos ul li img {
	border: 0;
}

/*............... Join Our Mailing List .................*/

fieldset#MailingList {
	float: right;
	width: 215px;
	margin: 2em 3em;
	padding: 0;
	border: none;
}

fieldset#MailingList legend {
	color: #FFF;
}

fieldset#MailingList input {
	width: 200px;
}


/*Product List
-----------------------------------------------------------------------------*/

div.ProductList {
	float: left;
	display: block;
	width: 280px;
	height: 200px;
	position: relative;
	z-index: 1;
}

div.ProductList div.Padding {
	padding: 0 20px 0 100px;
}

div.ProductList h4,
div.ProductList h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 0;
}

div.ProductList img {
	position: absolute;
	top: 0;
	left: 0;
	border: 1px solid #444444;
}

div.ProductList p.Price {
	color: #993300;
}


/*. . . . . . . . . . Pop Up . . . . . . . . . .*/

span.Open {
	position: absolute;
	display: block;
	width: 65px;
	height: 80px;
	background: url(../site/button_preview.gif) no-repeat 0 0;
	z-index: 9;
	top: 60px;
	left: 10px;
	text-indent: 2000em;
	cursor: pointer;
	overflow: hidden;
}

div.Pop {
	position: absolute;
	top: -50px;
	left: -10px;
	width: 300px;
	background: #2C230A;
	z-index: 100;
}

div.CoffeeName {
	padding: 10px;
	background: #990000;
	color: #FFF;
	font-family: arial, verdana, sans-serif;
	text-align: center;
}

div.CoffeeName h5 {
	font-size: 1.2em;
	color: #FFF;
	text-transform: uppercase;
	margin: 0;
	white-space: nowrap;
}

span.Type, span.Special {
	display: block;
	color: #FFFFCC;
}

span.Type {
	font-size: 1.1em;
}

span.Special {
	font-family: Georgia, "Times New Roman", Serif;
}

ul.Attributes {
	margin: 10px;
	padding: 10px;
	background: #FFFFCC;
	list-style: none;
}

ul.Attributes li {
	margin: 0;
	padding: 0;
}

ul.Attributes span.AttributeName {
	text-transform: uppercase;
	font-weight: bold;
}

ul.Taste, ul.Aroma {
	margin: 10px;
	padding: 0;
	list-style: none;
}

ul.Taste span.AttributeName, ul.Aroma span.AttributeName {
	color: #FFF;
	display: block;
}

ul.Taste span.AttributeValue, ul.Aroma span.AttributeValue {
	display: block;
	height: 5px;
	background: url(../site/bg_taste.gif) repeat-y 0 0;
	text-indent: -2000em;
}

div.Tagline {
	background: #FFFFCC;
	color: #000;
	margin: 10px;
	padding: 10px;
}

span.Close {
	position: absolute;
	bottom: 10px;
	right: 10px;
	text-indent: -2000em;
	display: block;
	width: 20px;
	height: 20px;
	background: url(../site/button_close.gif) no-repeat 0 0;
	cursor: pointer;
}

p.ReadMore {
	padding: 0 10px;
}

p.ReadMore a {
	display: block;
	width: 83px;
	height: 24px;
	background: url(../site/button_readmore.gif) no-repeat 0 0;
	text-indent: -2000em;
}


/*Product Detail
-----------------------------------------------------------------------------*/

div#ProductDetail {
	position: relative;
}

div#Item {
	margin-left: 270px;
	padding-bottom: 14px;
}

p#Price {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 3em;
}

div#Item label {
	width: 80px;
}

div#Item div.FormControls {
	margin-left: 80px;
}

div#Item input, div#Item select, div#Item textarea {
	width: 150px;
}

img#DetailImage {
	float: left;
	border: 1px solid #666666;
}

div#RelatedItems {
	margin-top: 3em;
}


/*Blog
-----------------------------------------------------------------------------*/

.BlogPost {
	padding: 25px 0;
}

.CommentPost {
	padding: 25px 0px;
}

.Comments {
}

.BlogPost img, .CommentPost img, .Comments img, .Blog img {
	float: left;
	margin: 0 1em 1em 0;
	clear: both;
}

div.CalendarBox {
	display: block;
	width: 61px;
	height: 56px;
	background: url(../site/bg_calendardate.gif) no-repeat top left;
	float: left;
	margin: 0 0.8em 0.8em 0;
}

div.CalendarBox span.CalendarMonth, div.CalendarBox span.CalendarDay {
	font-family: "Lucida Sans", Verdana, Arial, Arial, Verdana, Sans-Serif;
	font-weight: bold;
	text-align: center;
	display: block;
	text-transform: uppercase;
}

div.CalendarBox span.CalendarMonth {
	display: block;
	height: 16px;
	line-height: 16px;
	color: #FFFFFF;
	font-size: 9px;
}

div.CalendarBox span.CalendarDay {
	height: 40px;
	line-height: 34px;
	color: #000000;
	font-size: 21px;
}

div.ContinueReading, div.ContinueReading a:link, div.ContinueReading a:active, div.ContinueReading a:visited {
	color: #993300 !important; /*[e]#993300*/
	font-size: 12px;
	text-decoration: none;
	font-weight: bold;
	text-align: right;
	font-style: italic;
}

div.ContinueReading a:hover {
	text-decoration: underline;
}

div.BlogMeta {
	display: block;
	float: left;
	width: 450px;
}

span.PostedBy {
	display: block;
}


/*. . . . . . . . . . Blog Forms . . . . . . . . . .*/

FORM#CommentsForm fieldset, FORM#comments-form fieldset {
	padding: 1em;
	border: none;
}

div.BlogLabelInput, span.BlogLabelInput {
	margin-bottom: 7px;
	display: block;
}

div.BlogLabelInput input, div.BlogLabelInput select, div.BlogLabelInput textarea {
	width: 32em;
	font-size: 1em;
	font-family: "Lucida Sans", Verdana, Arial, Tahoma, Sans-Serif;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	padding: 3px;
	border: 1px solid #666;
}

div.BlogLabelInput label {
	width: 15em !important; /*[e]15em*/
	margin-right: 1em;
	text-align: right;
}

div.BlogSubmit, p.BlogSubmit, span.BlogSubmit {
	display: block;
	padding: 14px 0 14px 16em;
/*right padding for label width plus label padding*/
}

input.BlogButton {
	width: 68px;
	position: relative;
	height: 24px;
	outline: none;
	border: none;
	cursor: hand;
	cursor: pointer;
}

input#BlogSubmitButton {
	background: url(../site/buttons/button_submit.gif) no-repeat top left;
}

input#BlogPreviewButton {
	background: url(../site/buttons/button_preview.gif) no-repeat top left;
}

input#BlogCancelButton {
	width: 62px !important; /*[e]62px*/
	background: url(../site/buttons/button_cancel.gif) no-repeat top left;
}

span.CommentsText {
	font-size: 10px !important; /*[e]10px*/
}

/*. . . . . . . . . . Photo Gallery . . . . . . . . . .*/

div#Gallery div.GalleryImage {
	width: 170px;
	height: 190px;
	float: left;
	text-align: center;
}

div#Gallery a {
	padding: 5px;
	margin: 5px;
	display: block;
}

div#Gallery a:hover {
	text-decoration: none;
}

div#Gallery img {
	border: 1px solid #000;
}

div#Gallery img:hover {
	border: 1px solid #993302;
}

div#Gallery span.PhotoTitle {
	clear: both;
	display: block;
	margin: 5px auto 0;
}

/*. . . . . . . . . . Wholesale . . . . . . . . . .*/

table#WholesaleList {
	border: none;
	margin: 0;
	padding: 0;
	background: none;
}

table#WholesaleList tr {
	border: none;
	margin: 0;
	padding: 15px;
}

table#WholesaleList td {
	padding: 0;
	display: block;
	border: none;
	margin: 0;
}

td div.Product {
	float: left;
	width: 350px;
	padding: 10px;
}

td div.Product img {
	float: left;
	padding-right: 10px;
	margin: auto 0;
}

td div.Product a {
	
}

td div.Product h4 {
	
}

td div.Product p {
	margin-left: 95px;
	
}

td div.Detail {
	float: right;
	text-align: right;
	margin: 10px 10px 10px 0;
	width: 175px;
	overflow: hidden;
}

td div.Detail p {
	margin: 0 0 10px;
}

td div.Detail p.Price {
	font-weight: bold;
	color: #993302;
	font-size: 18px;
	margin-bottom: 0;
}

td div.Detail div.LabelInput {
	text-align: right;
}

td div.Detail label {
	padding-right: 15px;
	width: 5em;
}

td div.Detail input.Textbox{
	width: 30px; 
	border: 1px solid gray;
}

div.LabelInput select.grind {
	width: 100px;
}

div.FormControls {
	border: none; 
	padding: 25px;
	float: right;
}

/* ADDED LEFT NAV NON-SIFR HEADER STYLES */

.sidenav-cat-header {
	text-transform:uppercase;
	margin:0 0 10px 10px;
	font-weight:bold;
}

.sidenav-cat-header a {
	text-decoration:none;
}

.sidenav-header {
	margin:0 0 3px 10px;
	text-transform:uppercase;
}



/* NEW COFFEE CLUB STYLES */

#Wrapper #Canvas .coffee-club-block h2, 
#Wrapper #Canvas .coffee-club-block h2 a{ color: #993302; font-size:25px; text-transform:none; font-weight:normal; margin:14px 0 5px 0; padding:0;}

#Wrapper #Canvas #wrapper-coffee-club {  margin:35px 0; }
#Wrapper #Canvas .divider { height:2px; background:url(../site/cc-block-divider.gif) no-repeat top left; display:block; clear:both; margin:0; padding:0; overflow:hidden;}

#Wrapper #Canvas .coffee-club-block {   width:350px; min-height:110px; padding:10px 10px 10px 180px;}
#Wrapper #Canvas .coffee-club-block p { font-size:12px; line-height:20px; }

#Wrapper #Canvas .coffee-club-block a.more { float:right; text-align:right; display:block; clear:both; color: #993302;	padding-right:10px; margin:0 0 10px 0;
	background:url(http://www.zokacoffee.com/home-update/images/icon-arrow.png) no-repeat right 6px;
} 

#Wrapper #Canvas .endless-blends { background:url(../site/endless-blends.gif) no-repeat top left; } 
#Wrapper #Canvas .roasters-reserve { background:url(../site/roasters-reserve.gif) no-repeat top left; } 
#Wrapper #Canvas .artisans-elite { background:url(../site/artisans-elite.gif) no-repeat top left; } 
#Wrapper #Canvas .coffee-club-block img.left { float:left; display:block; }
#Wrapper #Canvas .coffee-club-block a:hover { text-decoration:none; color:#000; } 


#coffee-club-hero { position:relative; display:block;height:215px; margin:0 0 15px 0;}
#coffee-club-hero img { position:absolute; top:-30px; left:-20px; }
body.coffee-club #coffee-club-hero h2 { position:absolute; background:url(../site/bg-hdr-coffee-club.gif); no-repeat top left; bottom:0; left:-20px; width:579px; height:45px; line-height:45px; padding-left:20px;}


body.coffee-club #Canvas p,
body.coffee-club #Canvas ul,
body.coffee-club #Canvas li { font-size:12px; } 

body.coffee-club #Canvas p { margin:0 0 10px 0;}

body.coffee-club #Canvas a { color: #993302; }

body.coffee-club #Canvas ul { 
	margin-bottom:25px;
}


#Wrapper #Canvas div#cc-wrapper-detail-top img.feature {
	display:block;
	float:left;
	margin:0 20px 0 0;
}

#Wrapper #Canvas div#cc-wrapper-detail-top {
	margin:0;
	padding:20px 0;
	min-height:135px;
	
}

#Wrapper #Canvas div#cc-wrapper-detail-top p { margin:0 0 20px 0; }

#Wrapper #Canvas div#cc-wrapper-detail-top h2 {
	padding:20px 0 0 0;
}

body.roasters-reserve #Canvas h2,
body.artisans-elite #Canvas h2,
body.endless-blends #Canvas h2{
padding:25px 0 0 0;
}

body.endless-blends .ProductList {
	font-size:11px;
	margin-bottom:25px;
}



/* NEW HEADER BAR STYLES */

div#header-cap-wrapper { height:40px; background:#5e250e url(../site/bg-header-cap-wrapper.jpg) repeat-x bottom left; display:relative; width:100%;}
div#header-cap { width:785px; background:transparent url(../site/bg-header-cap-shadows.jpg) no-repeat bottom left; margin:0 auto; height:40px; position:relative;}
div#header-cap div.coffee-roasters { padding-left: 27px; height:40px; line-height:40px; float:left; }
div#header-cap div.coffee-roasters, #header-cap div.coffee-roasters a { color:#ab673e; font-size:11px; text-decoration:none; text-transform:none;}

div#header-cap ul { margin:0; padding:0; float:right;}
div#header-cap ul li { background: transparent url(../site/bg-header-cap-divider.jpg) no-repeat left 2px; float:left; display:block; text-transform:uppercase; height:40px; line-height:40px; padding:12px 19px 0 19px; }
div#header-cap ul li a { color:#bf8d5d; text-decoration:none; height:15px !important; line-height:15px; display:block;}
div#header-cap ul li a:hover { color:#cfb07d; text-decoration:none; }
div#header-cap a#hdr-locations { background:url(../site/hdr-icon-locations.png) no-repeat 0 0; padding-left:24px; }
div#header-cap a#hdr-locations:hover { background:url(../site/hdr-icon-locations.png) no-repeat bottom left; }
div#header-cap a#hdr-blog  { background:url(../site/hdr-icon-blog.png) no-repeat top left; padding-left:24px;}
div#header-cap a#hdr-blog:hover  { background:url../site/hdr-icon-blog.png) no-repeat bottom left; }
div#header-cap a#hdr-cart { background:url(../site/hdr-icon-cart.png) no-repeat top left; padding-left:24px;} 
div#header-cap a#hdr-cart:hover { background:url(../site/hdr-icon-cart.png) no-repeat bottom left;} 

form#mc-embedded-subscribe-form {
	position:absolute;
	top:13px;
	right:0px;
}


input#mce-EMAIL { 
width:250px; 
height:24px !important;
line-height:24px;
background:#2d1e11; 
margin:0 !important; 
border:1px solid #3e301f; 
color:#84613e;
float:left;
padding:0;
padding-left:7px;
font-size:11px;
font-family:verdana, arial; 
}

input#mc-embedded-subscribe {
background:url(../site/btn-subscribe-bg.jpg) no-repeat scroll left top #250e04 !important;
cursor:pointer !important;
display:block !important;
float:left !important;
height:26px !important;
margin:0 !important;
overflow:hidden !important;
padding:0 !important;
text-indent:-1000px !important;
width:27px !important;
border:1px solid #3e301f;
border-left:0;
color:#fff;
}