/* quick reset */
html, body, p, h1, h2, h3, h4, ul, ol, li, .reset { margin:0; padding:0 }

/* html5 plz! */
article, aside, figure, footer, header, hgroup, menu, nav, section { display:block; padding:0; margin:0 }

/* tags */
html, body { min-height:100%; height:100% }
ul, ol { padding-left:25px }
body { font-family:Helvetica, Arial, sans-serif; font-size:12px; text-align:center }
img { border:0 }
p, ol { margin-bottom:12px }
p.box rounded-corners yellow center { padding-bottom:2px; margin:0 }
ul.box rounded-corners yellow center { padding-left:-4px;  padding-bottom:2px; margin:0 }
li.box rounded-corners yellow center { padding-bottom:2px;  margin:0 }
h1, h2, h3, h4 { line-height:normal }
h1 { font-size:20px; margin-bottom:5px }
h2 { font-size:16px; margin-bottom:3px }
h3 { font-size:14px }
h4 { font-size:12px }

h1.header { font-size:11px !important; padding:4px; text-transform:uppercase;
background-color:#FCA501;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
background-image: -moz-linear-gradient(top, #ffcb68, #FCA501); /* FF3.6 */
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #ffcb68),color-stop(1, #FCA501)); /* Saf4+, Chrome */
filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffcb68', EndColorStr='#FCA501'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffcb68', EndColorStr='#FCA501')"; /* IE8 */
}

/* jquery ui  */
.ui-dialog-title,
.ui-dialog-content { font-family: arial, sans-serif; }

/* table */
.styled { border-collapse: collapse }
.styled td, .styled th { padding: 3px }
.styled td { background: #effafe }

.placeholder { color: #aaa; }

a { color:#005460 /* #dc0000 */; text-decoration:none }
a:hover { text-decoration:underline }

.clearfix:after { clear:both; content:'.'; display:block; visibility:hidden; height:0 }
.clearfix { display:inline-block }
* html .clearfix { height:1% }
.clearfix { display:block }

/* forms */
fieldset { padding:1.4em 1.4em 1.4em 1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc }
legend { font-weight: bold; font-size:14px }
form { margin:0; padding:0 }
form .item { margin-bottom:10px; line-height:22px; }
form label { font-weight:bold; display:block  }
form label .required { color:#ff0000; font-size:11px; font-weight:normal; position:static; top:auto; font-style:italic; margin-left:3px }
form p { font-size:11px; line-height:normal; margin:0 0 2px 0 }
form input.large { width:300px }
form input.medium { width:250px }
form input.small { width:200px }

/* notification */
.message { padding:10px; margin:15px 5px; display:block; text-align:left }
.message-title { font-weight:bold; font-size:1.25em }
.message-body { margin-top:4px }
.error, .notice, .success {padding:.8em;margin-bottom:1em;border:2px solid #ddd }
.error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4 }
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324 }
.success {background:#E6EFC2;color:#264409;border-color:#C6D880 }
.error a {color:#8a1f11 }
.notice a {color:#514721 }
.success a {color:#264409 }

/* generic classes */
.center { text-align:center }
.left { text-align:left }
.hide { display:none }
.bold { font-weight:bold }
.small { font-size:11px; line-height:normal !important }
.rounded-corners { -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px }
.rounded-corners-top { -moz-border-radius: 6px 6px 0 0; -webkit-border-radius:6px 6px 0 0; border-radius: 6px 6px 0 0 }
.rounded-corners-bottom { -moz-border-radius: 0 0 6px 6px; -webkit-border-radius: 0 0 6px 6px; border-radius: 0 0 6px 6px; }
.rounded-corners-container { -moz-border-radius: 10px 10px 6px 6px; -webkit-border-radius: 10px 10px 6px 6px; border-radius: 10px 10px 6px 6px }
/* .white { background:#fff; padding:10px; float:left; width:695px } */
.red { color:#de0000 }
.top { vertical-align:top }

/* icons */
.icon { background-position:left; background-repeat:no-repeat; padding:2px 0 2px 19px }
.icon-left { background-position:right; padding:2px 20px 2px 0 }
.icon-star { background-image:url(/images/icons/star.png) }
.icon-tick { background-image:url(/images/icons/tick.png) }
.icon-cross { background-image:url(/images/icons/cross.png) }
.icon-view { background-image:url(/images/icons/view.png) }
.icon-logo { background:url(/images/logo_sm.png) left no-repeat; padding:7px 0 7px 50px }
.icon-print { background-image:url(/images/icons/printer.png) }
.icon-money-large { background-image:url(/images/icons/money-lg.png); padding: 0 0 0 40px; vertical-align: middle }
.icon-money { background-image:url(/images/icons/money.png); }
.icon-add { background-image:url(/images/icons/add.png); }
.icon-cart { background-image:url(/images/icons/add-cart.png); }

/* main elements */
#background { }
#container, header, #wrapper, footer div { width:987px; margin:0 auto; text-align:left; clear:both; }
#container { float:left; position:relative; top:25px }
#gradient { background:url(/images/shadow.png) no-repeat; height:400px; width:700px; position:absolute; z-index:-1; left:65px; top:-148px }
#body { float:left; width:740px; margin-left:10px; position:relative; z-index:2; padding-bottom:30px; }
#ribbon { background:#000 url(/images/ribbon.gif); height:29px; visibility:hidden }
#about { color:#382a08; text-align:center; padding:8px 20px 0 20px; float:left; width:250px; font-size:13px; line-height:17px  }
#banner { background:url(/images/banner.png); width:450px; height:33px; margin-top:20px; text-align:right }
#banner p { color:#f60100; font-size:10px; padding:12px 20px 0 0; font-style:italic; font-weight:bold }
#mission { clear:both; padding:10px; margin-top:10px }
#mission h1 { font-size:16px }
#mission h2 { font-size:13px; text-align:center }
#mission cite { display:block; text-align:right }

/* header */
header { height:116px; margin:0 auto 25px auto; position:relative; z-index:0 }
header #family { left:102px; top:-14px; position:relative; z-index:1 }
header #logo { float:left }
header #slogan { float:left; position:relative; top:10px; left:20px; text-align:center; width:405px }
header #slogan p { font-style:italic; font-size:14px }
header h1 { text-align:left; font-size:32px }

/* some pages should not have the yellow box; adjust accordingly with .transparent 
#padding { margin:14px 0 0 5px; padding:15px; width:715px; float:left }
#padding a { color:#de0000 }
#padding.transparent { margin:0; background:transparent; padding-top:0 }
#padding.transparent .white { padding:0; width:735px; background:transparent }
#padding.transparent #breadcrumb { margin-bottom:20px }
#padding.transparent #breadcrumb a { color:#DE0000 }*/

/* left nav */
#left { float:left; width:237px; min-height:850px; background:url(/images/leftnav_bg.png) top no-repeat }
#left #sharing { padding:7px 5px; background:#42b6c6; width:75%; height:16px; margin:60px auto 20px auto; color:#fff; font-size:11px; font-style:italic }
#left #sharing ul { padding:0; margin:0; float:right }
#left #sharing ul li { display:inline }
#left #sharing ul li a { padding:0 3px }
#left menu { margin-top:50px }
#left menu ul.nav { margin:0; padding:0; width:234px; list-style:none }
#left menu ul.nav li { text-align:right; border-bottom:1px solid #40b6c1 }
#left menu ul.nav li.first { border-top:1px solid #40b6c1 }
#left menu ul.nav a { display:block; padding:8px 10px 8px 0; color:#152004; font-weight:bold; text-decoration:none; font-style:italic }
#left menu ul.nav a:hover { background-color:#5bd8df; text-decoration:underline }
#left menu ul.nav a.active { background-color:#5bd8df }

/* breadcrumb */
#breadcrumb { margin-bottom:10px }
#breadcrumb .spacer { padding:0 8px; color:#000 }
#breadcrumb a { font-style:italic }

/* top tabbed navigation */
#tabs { padding:0; margin:0; height:25px; list-style-type:none; position:relative; top:-25px; left:-40px }
#tabs li { float:left; margin:0 5px }
#tabs li a { display:block; height:25px; background-color:#ffa600; background-repeat:repeat-x; padding:0 7px; color:#0a2c2f; border-top-right-radius:6px; -moz-border-radius-topright:6px; -webkit-border-top-right-radius:6px; -moz-border-radius-topleft:6px; -webkit-border-top-left-radius:6px; text-decoration:none; font-weight:bold; color:#FFFFFF }
#tabs li a span { position:relative; top:5px }
#tabs li a:hover,
#tabs li a.active { background:#f08302; text-decoration:none; font-weight:bold; color:#FFFFFF }

/* top tabbed grocerylist gl */
#tabs li.gl { float:left; margin:0 5px }
#tabs li.gl a { display:block; height:25px; background-color:#d16dbc; background-repeat:repeat-x; padding:0 7px; color:#0a2c2f; border-top-right-radius:6px; -moz-border-radius-topright:6px; -webkit-border-top-right-radius:6px; -moz-border-radius-topleft:6px; -webkit-border-top-left-radius:6px; text-decoration:none; font-weight:bold; color:#FFFFFF }
#tabs li.gl a span { position:relative; top:5px }
#tabs li.gl a:hover,
#tabs li.gl a.active { background:#a13d8c; text-decoration:none; font-weight:bold; color:#FFFFFF }


/* footer */
footer { position:relative; clear:both; height:30px; font-size:11px; background:#FEEB8F }
footer a { color:#000; text-decoration:none }
footer p { float:left; padding:7px }
footer ul { float:right; padding:7px }
footer ul li { display:inline; padding:0 7px }

#icons { clear: both; margin-top: 10px; }
#icons ul { list-style: none }
#icons h1 { margin: 0; padding: 0; font-size: 14px; font-weight: bold;  color: #7b7b7b; border-bottom: 1px solid #a6a6a6; padding-bottom: 4px; }
#icons li a { display: block; height: 100px; }
#icons li { float: left }

/* ********************** */
/* Boxes */
/* ********************** */
.box, .box h1 { padding:8px }
.box h1 { margin:0 0 8px 0; font-size:13px; padding:5px }
.box.green		{ background:#b1de68 }
.box.green h1	{ background:#9dc15e }
.box.yellow		{ background:#ffe38c }
.box.yellow h1 	{ background:#FCA501 }
.box.blue		{ background:#addfef }
.box.blue h1	{ background:#42b6c6 }
.box.salmon		{ background:#dd76c1 }
.box.salmon h1	{ background:#eeb9e0 }
.box.blue a { color:#000; text-decoration:underline }

#product-list { }
#product-list h1 { margin-bottom:5px }
#product-list .product { width:475px; clear:both; background:#fff; padding:0; margin-bottom:3px }
#product-list .product.featured { }
#product-list .product.last { margin-bottom:0 }
#product-list .product.wide { width:700px !important }
#product-list .product.wide .body { width:550px }
#product-list .product .thumbnail { float:left; padding:0 10px 10px 0 }
#product-list .product .body { }
#product-list .product h3 { display:inline; font-size:12px; color:#777 }
#product-list .product h3.marketing { font-size:13px }
#product-list .product p { margin:0 }
#product-list .product .manufacturer { font-size:11px; color:#585858 }
#photos div { margin-bottom:15px }



/*
.button { }
.button a { display:inline-block; margin-top:2px; padding:3px 15px; background:#B1DE68; color:#23310B !important; text-decoration:none; font-weight:bold; border:1px solid #79a62b }
.button a:hover { border-color:#23310B; background:#a7d360 }
*/

#manufacturer {}
#manufacturer #logo { margin-bottom:10px; text-align:center }
#manufacturer h1 { font-size:24px }

#quotes img { background:#CEF78C; padding:3px; border:1px dotted #2BCEDF }

/* pagination */
.pagination { padding:8px; background:#fff7d2; border-top:1px solid #FFCF59; border-bottom:1px solid #FFCF59; margin-bottom:12px }

/* sidebar */
#sidebar { width:200px; background:#FFE995; padding:10px; margin:0 0 10px 0; text-align:center; float:right }
#sidebar section { margin-bottom:20px }
#sidebar section ul { line-height:16px; text-align:left }
#sidebar li.active a { font-weight:bold; font-size:13px }
#sidebar h4 { text-align:center; margin-bottom:4px; padding:4px; background:#FCA501; text-transform:uppercase }
#sidebar a { color:#894c00 }

/* recipes */
.recipe {border-bottom;1px dotted #ffa600;}
#recipe h2 { margin:10px 0; font-style:italic; font-size:14px }
#recipe p .h2 { padding:0px; margin:0px 5px 0 0; font-size:13px; font-weight:bold; }
#recipe p { margin-bottom:2px; }

#recipe .item { margin:4px 0 }
#recipe .item span { font-weight:bold; text-transform:uppercase }
#recipe ol { list-style-type:none; padding:0 }
#recipe li { margin-bottom:5px }
#recipe blockquote { padding:0; margin:0 0 0 20px }
#recipe #recipe-date { float:right; font-size:9px; color:#DC8501; }
#recipe .recipe-product-image { width:250px; padding:0 20px 15px 0 }

#recipe aside { text-align:left; width:225px }
#recipe aside .item { margin-bottom:15px }
#recipe aside .item span { display:block; margin-bottom:2px }
#recipe aside h4 { margin-bottom:10px }
#ingredients td { vertical-align:top }

#recipe-list { margin-top:10px; width:505px }
#recipe-list .recipe-date { font-style:italic; font-size:12px; font-weight:bold; color:#DC8501; }
#recipe-list .recipe { margin-bottom:20px }
#recipe-list .small { margin-bottom:3px }
#recipe-pagination-bottom { margin-top:30px }
#recipe-photos { overflow:hidden; zoom:1 }
#recipe-photos a { display:block; width:140px; border:1px solid #ccc; padding:3px; margin-right:7px; float:left; }
#recipe-photos a.last { margin-right:0 }
#recipe-photos a:hover { border-color:#000 }
#recipe-photos i { display:block; width:140px; height:110px; background-repeat:no-repeat; background-position:center; background-color:#ccc }

/* submit recipe btn */
.submit-recipe { float: right; width: 200px; text-align: center; background: #81bc3e; padding: 5px 10px; margin-bottom: 5px; }
.submit-recipe a { color: #fff; font-size: 14px; }

#printsource { display:none }



.item1{float:left;width:90px;border:0px solid #ccc;margin-bottom:5px;}
.item2{width:154px;border:0px solid #ccc;float:left;margin-bottom:5px;}


#ingredients-dialog { text-align: left;  }
#ingredients-dialog li { line-height: 20px; }

#recipe-list-categories ul { list-style-type: none; margin: 15px auto 10px auto; padding: 0; overflow: hidden; zoom: 1; width: 260px; }
#recipe-list-categories li { margin: 0; padding: 0; float: left; width: 65px; text-align: center; }
#recipe-list-categories li.selected a { font-weight: bold !important; }
#recipe-list-categories img { display: block; margin: 0 auto; }

#comments-container { padding: 5px 15px 10px 15px; margin-top: 15px; background: #ffe995 }
#comments-post div { margin: 3px 0; }
#comments-post textarea { width: 400px; height: 75px; font-family: arial; font-size: 12px; }
#comments-post input.text { width: 200px; border: 1px solid #000; padding: 2px; font-size: 12px; }
#comments-post p { margin: 10px 0 }

#comments { list-style-type: decimal !important; margin-left: 30px; }
#comments li { margin-bottom: 20px; }
#comments .comment-name { font-weight:bold; }
#comments .comment-name span { font-style: italic; }

#contest-terms { text-decoration: underline }
