/*
 * Web Fonts from fontspring.com
 *
 * All OpenType features and all extended glyphs have been removed.
 * Fully installable fonts can be purchased at http://www.fontspring.com
 *
 * The fonts included in this stylesheet are subject to the End User License you purchased
 * from Fontspring. The fonts are protected under domestic and international trademark and
 * copyright law. You are prohibited from modifying, reverse engineering, duplicating, or
 * distributing this font software.
 *
 * (c) 2010 Fontspring
 *
 *
 *
 *
 * The fonts included are copyrighted by the vendor listed below.
 *
 * Vendor:      Fonthead Design Inc.
 * License URL: http://www.fontspring.com/fflicense/fonthead-design
 *
 *
 */

@font-face {
	font-family: 'DrawzingRegular';
	src: url('fonts/Drawzing-webfont.eot');
	src: local('☺'), url('fonts/Drawzing-webfont.woff') format('woff'), url('fonts/Drawzing-webfont.ttf') format('truetype'), url('fonts/Drawzing-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

/*
 *
 *  Kittows Butchers stylesheet
 *
 */

body { font-size:62.5%; font-family:Arial,sans-serif; background:#fff url(images/page-bg.jpg) repeat; }
#page-wrap { width:910px; margin:0 auto; background:#fff url(images/wrap-bg.png) repeat-y; }
#header { width:900px; height:280px; margin:0 auto; }

#nav-bar { width:900px; margin:0 auto; background:#FFC500; padding:8px 0 8px 0; }
#nav-bar ul { width:auto; float:left; padding-left:12px; }
#nav-bar li { display:inline; font-size:1.1em; margin-right:20px; font-weight:bold; }
#nav-bar li a { color:#000; text-decoration:none; }
#nav-bar li a:hover,
#nav-bar li a:focus { text-decoration: underline; }
#nav-bar address { text-align:right; font-size:1.1em; padding-right:12px; }
#nav-bar address a { text-decoration: none; color: inherit; }
#nav-bar address a:hover, #nav-bar address a:focus { text-decoration: underline; }

#content { width:898px; margin:0 auto; background:#fff; padding-bottom:30px; border-top:10px solid #fff; }

#sidebar-1 { width:180px; float:left; background:#fff; margin-left:10px !important; margin-left:3px; }
#sidebar-2 { width:180px; float:right; background:#fff; margin-right:10px !important; margin-right:3px; }
#main { width:500px; float:left; margin-left:10px; background:#fff; }

/* Nav */
#nav-main { background: #303032 url(images/blackboard-big.jpg) right top; padding: 5px 0 1px; margin-bottom: 5px; font-family: 'DrawzingRegular',Arial,sans-serif; }
#nav-main h2 { padding:10px 0 8px; font-size:2.1em; color:#fff; width:90%; margin:0 auto; }
#nav-main ul { width:90%; margin:0 auto; margin-bottom:15px; }
#nav-main li { font-size:1.5em; line-height:1.8em; }
#nav-main li a { display: block; color:#fff; text-decoration:none; padding-left:10px; margin:2px 0; }
#nav-main li a:hover,
#nav-main li a:focus,
#nav-main li.active a { background:#B6B2B6; color:#434345; }
#nav-main li.active a:hover,
#nav-main li.active a:focus { color:#111; }
#nav-main li+li { border-top: 1px dotted #999; }

/* Filter Tag navigation */
.filtertags { clear: both; background-color: #ddd; display: block; width: 95%; margin: 20px 2.5%; padding: 1ex 0 1em; float: left; }
.filtertags h4 { clear: both; margin: 3px 0 3px 8px; font-size: 186%; }
.filtertags p { clear: both; padding: 4px 5px; margin: 2px 0 2px 4px; }
.filtertags ul { padding: 0 4px; }
.filtertags ul li { background-color: #333; float: left; padding: 4px 5px; margin: 2px 0 2px 4px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.filtertags ul.remove li {  background-color: #BBB; }
.filtertags ul a { display: block; color: #DDD; text-decoration: none; background: transparent url(images/filtertags-sprite.png) no-repeat; padding-right: 16px;}
.filtertags ul.add a { background-position: 100% 0%; }
.filtertags ul.add a:hover,
.filtertags li.add a:focus { background-position: 100% 33%; color: #fff; }
.filtertags ul.remove a { background-position: 100% 66%; color: #333; padding-right: 18px; }
.filtertags ul.remove a:hover,
.filtertags li.remove a:focus { color: #000; background-position: 100% 99%; }

/* Product Lists */
.box .content a { color:#000; text-decoration:none; }
.box .content a:visited { color:#000; }
.box { border:1px solid #ccc; width:98%; margin:0 auto; margin-bottom:15px; }
.box a h2,
.box a h3,
.box a p { text-decoration:none; }
.box h2 { padding:10px 0; background: #303032 url(images/blackboard-big.jpg) 0 280px; color:#fff; font-size:2.1em; text-indent:15px; font-family: 'DrawzingRegular',Arial,sans-serif;}
.box h2 a,
.box h2 a:visited { color:#fff; text-decoration:none; }
.box .box-image { width:195px; float:right; margin:3px; }
.box .content { width:265px; margin-left:15px; padding:10px 0 10px 0; }
.box .content p { margin-bottom:15px; color:#333 !important; }
.box .content p.link a,
.box .content p.selection-link a { color:#009; text-decoration:underline; }
.box h3 { font-size:1.5em; font-weight:bold; position:relative; padding-bottom: 0.4em; }
.box .item h3 { margin: 0 10px; padding-right: 3.5em; }
.box .item h3 span { display:block; position:absolute; top:0; right:0; }
.box p { font-size:1.2em; color:#000; }
.box p.link { text-align:right; }
.box p.welcome { width:90%; margin:0 auto; margin-top:10px; }
.box .description { background:#C6C8CA; border:2px solid #6E6C72; padding:10px 0 10px 0; float:left; width:130px; margin:10px; }
.box .description p { width:90%; font-size:11px; margin:0 auto; margin-bottom:10px; }
.box .order-details { width:360px; margin-left:10px; margin-top:10px; }
.box .order-details table { margin-bottom:15px; margin-top: 0; }
.box .order-details th { width:110px; font-size:12px; vertical-align:top; padding:5px 0 5px 0; }
.box .order-details td { padding:5px 0 5px 0; }
.box .order-details li { font-size:12px; }
.box .order-details .action { height:40px; line-height:40px; margin-bottom:5px; }
.box .order-details .action a { text-decoration:none; border:2px solid #6E6C72; background:#C6C8CA; font-size:11px; padding:5px 10px 5px 10px; margin-right:8px; color:#4C4D51; }
.box .details { width:95%; margin:0 auto; clear: both; }
.box .details .item { margin-bottom:20px; padding:5px 0 5px 0; background-color: #CDDEEF; position: relative;}
.box .details .item a.lightbox { float:left; width:120px; height:90px; margin-left:10px; margin-top:5px; border:none; text-decoration:none; }
.box .details .item p { width:65%; margin-left:145px; }
.box .details .item p.order-link { position: absolute; bottom: 2px; right: 5px; text-align:right; height:30px; line-height:30px; }
.box .details .item p.order-link a { text-decoration:none; border:1px solid #000; background:#FFC500; color:#000; font-size:96%; padding:3px 10px 3px 10px; }
.box .details .item p.order-link a:hover,
.box .details .item p.order-link a:focus {  border:1px solid #fff; background:#000; color:#fff; }
.box p.desc { color:#000; padding-bottom: 3em;}
.box p.desc a { text-decoration:none; color:#000; }
.box p.desc a:hover { color:#000; }

.box .form { width:95%; margin:0 auto; margin-top:15px; }
.box .form fieldset { display:block; margin-bottom:15px; }
.box .form legend { font-size:18px; text-align:center; color:#FF8500; font-weight:bold; }
.box .form fieldset p { clear:both; }
.box .form fieldset p.desc { width:40%; margin-left:170px; padding-bottom:5px; vertical-align:middle; }
.box .form fieldset p.desc small { font-size:11px; font-style:italic; color:#666; }
.box .form fieldset label { display:block; width:160px; height:auto; padding-top:3px; text-align:right; float:left; margin:3px; }
.box .form fieldset input,
.box .form fieldset select,
.box .form fieldset textarea { margin:3px; }
.box .form fieldset input.form-error { border:1px solid #ff0000; }
.box .form .action { margin-left:160px; }
.box .form .action p { margin-bottom:10px; }
.box a.button { text-decoration:none; border:2px solid #6E6C72; background:#C6C8CA; font-size:11px; padding:5px 10px 5px 10px; margin-right:8px; color:#4C4D51; }
.box .form .notice { border:2px solid #6E6C72; background:#C6C8CA; padding:5px 0 5px 0; margin-bottom:15px; }
.box .form .notice p { text-align:center; }

.selection p { width:95%; margin:0 auto; margin-top:10px; margin-bottom:10px; }

.box-selection { width:95%; margin:0 auto; margin-bottom:25px; border:1px solid #ccc; background:#E7E8E9; }
.box-selection h3 { width:100%; font-size:17px; text-align:center; padding:3px 0 3px 0; }
.box-selection h4 { width:100%; font-size:30px; text-align:center; padding:3px 0 3px 0; font-weight:bold; position:relative; }
.box-selection .yes-please { position:absolute; top:10px; right:8px; text-decoration:none; border:1px solid #6E6C72; background:#C6C8CA; font-size:11px; padding:3px 10px 3px 10px; color:#4C4D51; }

.box-selection div.current { width:210px; float:left; }
.box-selection div.last { width:210px; float:right; margin-right:20px !important; margin-right:0px; }

.box-selection div p { font-size:14px; font-weight:bold; }
.box-selection dl { width:210px; margin:10px; position:relative; margin-bottom:20px; }
.box-selection dt { width:210px; font-size:12px; border-bottom:1px dotted #ccc; }
.box-selection dt span { display:block; width:130px; }
.box-selection dd { font-size:12px; position:relative; right:0; top:-14px; text-align:right; }

.order-history { border:1px solid #ccc; width:90%; margin:0 auto; margin-top:20px; margin-bottom:20px; }
.order-history th,
.order-history td { font-size:12px; padding:10px; }
.order-history th { font-weight:bold; }

#meat-selection .box-selection h3,
#meat-selection .box-selection h4 { background:#FECD08; color:#655E55; }

#deli-selection .box-selection h3,
#deli-selection .box-selection h4 { background:#046838; color:#fff; }

#about .contents, #ordering .contents { width:280px; padding:10px 0 10px 0; margin-left:10px; }
#about .contents h3, #ordering .contents h3 { font-size:18px; margin-bottom:10px; color:#FF8500; }
#about .contents p, #ordering .contents p { margin-bottom:15px; }
#ordering .contents ol {font-size: 1.2em; list-style: lower-roman; margin-bottom: 7px; }
#ordering .contents li {margin-bottom: 8px; margin-left: 2em; }
#about .images, #ordering .images { width:180px; float:right; overflow:hidden; margin-right:10px !important; margin-right:5px; padding:10px 0 10px 0; }
#about .images img, #ordering .images img { display:block; margin-bottom:5px; }

#terms .contents { width:90%; margin:0 auto; margin-top:20px; }
#terms .contents h3 { font-size:18px; margin-bottom:10px; color:#FF8500; }
#terms .contents p { margin-bottom:15px; }

#contact-us h2 { margin-bottom:20px; }
#contact-us address { font-size:12px; width:90%; margin:0 auto; margin-bottom:15px; }
#contact-us address em { font-size:14px; font-weight:bold; }

/* sidebar banner */
.banner { border:1px solid #ccc; padding:8px 0; overflow:hidden; margin-bottom:5px; text-align:center; position:relative; }
.banner a { text-decoration:none; overflow:hidden; }
.banner a img { width:auto; margin:0 auto; border:none; }
.banner a span { width:auto; position:absolute; left:0; z-index:1; font-size:9px; }

#footer { clear:both; width:100%; padding-top:20px; background:transparent url(images/page-footer-bg.png) no-repeat bottom;  }
#footer p { text-align:center; padding-bottom:15px; }

/* Shopping Basket */
#basket { border:1px solid #ccc; border-bottom: 3px solid #DDD; padding:0; overflow:hidden; margin-bottom:5px; position:relative; }
#basket a { color: inherit; text-decoration: none; }
#basket h2 { text-align: right; padding:10px 8px 10px 0; background: #303032 url(images/blackboard-big.jpg) 0 280px; color:#fff; font-size:2.1em; font-family: 'DrawzingRegular',Arial,sans-serif;}
#basket li { padding: 5px 3em 5px 0; margin: 0 8px; border-bottom: 1px solid #DDD; }
#basket li .multiplier { color: #666; font-size: 90%; }
#basket p.total { padding: 6px 8px; background: #DDD; font-size: 125%; font-weight: bold; margin-top: -1px; border-top: 1px solid #FFF; }
#basket p.checkout a { line-height: 16px; display: block; font-size: 125%; font-weight: bold; text-align: right; padding: 3px 36px 6px 0; background: #DDD url(images/checkout-sprite.png) no-repeat 100% 100%; }
#basket p.checkout a:hover,
#basket p.checkout a:focus { background-position: 100% 0%; text-decoration: underline; }
#basket span.money { position: absolute; right: 8px; }

div#basket a.addbutton, div#basket a.subtractbutton {
	float: left;
	background-color: #DDD;
	color: #444;
	font-weight: bold;
	text-decoration: none;
	padding: 1px 2px 1px 5px;
	margin: 0 0 0 -6px;
	-webkit-border-radius: 8px 0 0 8px;
	-moz-border-radius: 8px 0 0 8px;
	border-radius: 8px 0 0 8px;
}

	div#basket a.addbutton:hover, div#basket a.subtractbutton:hover {
		background-color: #303032;
		color: #0F0;
	}

	div#basket a.subtractbutton:hover {
		color: #F00;
	}

div#basket a.subtractbutton {
	padding: 0 3px 2px 3px;
	margin: 0 5px 0 1px;
	-webkit-border-radius: 0 8px 8px 0;
	-moz-border-radius: 0 8px 8px 0;
	border-radius: 0 8px 8px 0;
}

/*
 * Pre-checkout table
 */

table.drilldown {
	font-size: 115%;
	width: 90%;
	margin: 10px auto 0;
}

	table.drilldown th, table.drilldown td {
		padding: 5px 0px 5px 5px;
	}

	table.drilldown th {
		background: #333;
		color: #fff;
		font-weight: bold;
		text-indent: 1px;
	}

table.drilldown a.addbutton, table.drilldown a.subtractbutton {
	float: right;
	background-color: #E0DFD8;
	color: #666;
	font-size: 135%;
	font-weight: bold;
	text-decoration: none;
	padding: 1px 4px 2px 7px;
	margin: 2px 0 2px 4px;
	-webkit-border-radius: 8px 0 0 8px;
	-moz-border-radius: 8px 0 0 8px;
	border-radius: 8px 0 0 8px;
}

	table.drilldown a.addbutton:hover, table.drilldown a.subtractbutton:hover {
		background-color: #000;
		color: #0F0;
	}

	table.drilldown a.subtractbutton:hover {
		color: #F00;
	}

table.drilldown a.subtractbutton {
	padding: 0 6px 3px 4px;
	margin: 2px 0 2px 1px;
	-webkit-border-radius: 0 8px 8px 0;
	-moz-border-radius: 0 8px 8px 0;
	border-radius: 0 8px 8px 0;
}

table.drilldown td.money, table.drilldown th.money {
	text-align: right;
	width: 35%;
}

table.drilldown td.actions, table.drilldown th.actions {
	text-align: right;
	width: 4em;
}

table.drilldown tr.deliverer {
	text-align: right;
}

table.drilldown tr.deliverer select {
	text-align: right;
	margin-right: -25px;
	margin-top: -5px;
	font-family: Arial,sans-serif;
	font-size: 100%;
	padding: 5px;
}

	table.drilldown tr.deliverer label {
		float: none;
		position: absolute;
		left: -999px;
	}

.help {	color:#666; margin-top:-8px; font-size:11px; }

/* different stylings for the main three categories */
.yellow { color:#FFC000; }
.green { color:#005F25; }
.blue { color:#009DEA; }
.green-bg { background-color:#E3F298; }
.brown-bg { background-color:#D8C0A8; }
.yellow-bg { background-color:#F7F894; }
.black { background-color:#000; }

.meat,
.meat h3 a ,
.meat a h3 { color:#ffc000 !important; text-decoration:none; }
.deli,
.deli h3 a,
.deli a h3 { color:#005f25 !important; text-decoration:none; }

.deli h3.product-title a:hover,
.meat h3.product-title a:hover { text-decoration:underline; }

.pasty,
.pasty h3
.pasty h3 a,
.pasty a h3 { color:#009dea !important; }

.box .details .meat-bg { background-color:#F7F894; }
.box .details .deli-bg { background-color:#e3f298; }
.box .details .pasty-bg { background-color:#D8C0A8; }

p.success { }
p.error { width:90%; margin:0 auto; background:#f00; color:#fff; padding:5px 0 5px 0; text-align:center; margin-top:15px; }
.message { margin-top:10px;text-align:center; font-size:14px; color:#090; font-weight:bold; }
#checkout-message { margin-left:10px; }

strong { font-weight:bold; }
em { font-style:italic; }
.hide { display:none; }
.clear { clear:both; }
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block; }

/* WinIE7 only */
*:first-child+html .clearfix { height:1%; }

/* WinIE6 and below */
/*¥*/
* html .clearfix { height:1%; }
/**/

/* MacIE only */
/*¥*//*/
.clearfix { display:inline-table; }
/**/
.clearfix { display:block; }

pre { width:80%; max-height:400px; margin:0 auto; background:#fff; font-size:14px; overflow:auto; padding:10px; border:1px solid #333; }

pre.cake-debug { width:90%; height:auto; }

.cake-sql-log { display: none; caption-side:top; font-size:1.2em; width:90%; margin:0 auto; background:#fff; margin-bottom:20px; margin-top:20px; border:px solid #ccc; }
.cake-sql-log td,.cake-sql-log th { padding:10px; border:1px solid #f2f2f2; }
.cake-sql-log th { font-weight:bold; background:#fafafa; }
.cake-sql-log caption { border:1px solid #ccc; background:#f2f2f2; padding:10px; font-weight:bold; }

/* lightbox styles */
#lightbox { position:absolute; left:0; width:100%; z-index:100; text-align:center; line-height:0; }
#lightbox a img { border:none; }
#outerImageContainer { position:relative; background-color:#fff; width:250px; height:250px; margin:0 auto; }
#imageContainer { padding:10px; }
#loading { position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0; }
#hoverNav { position:absolute; top:0; left:0; height:100%; width:100%; z-index:10; }
#imageContainer>#hoverNav { left:0; }
#hoverNav a { outline:none; }
#prevLink, #nextLink { width:49%; height:100%; background:transparent url(images/blank.gif) no-repeat; /* Trick IE into showing hover */ display:block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer { font:10px Verdana, Helvetica, sans-serif; background-color:#fff; margin:0 auto; line-height:1.4em; overflow:auto; width:100%;	}
#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}
#overlay { position:absolute; top:0; left:0; z-index:90; width:100%; height:500px; background-color:#000; }