@charset "UTF-8";

/* format
##################################### */

/*clearfix*/
.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden; 
}

.clearfix {
display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
height: 1%;
}

.clearfix {
display: block;
}
/*////////*/

html {
	background:url(../img/bg_body.jpg) center top repeat-x;
}

body {
	background:url(../img/bg_body.jpg) center top repeat-x;
}

div#wrapper{
	margin: 0 auto;
	width: 100%;
	background:url(../img/bg_wrapper.jpg) center top no-repeat;
}

div#main div#recipes-area{width:675px; margin-right:25px; padding:25px 0 42px; float: left; background:url(../img/bg_recipes-area.gif) left bottom no-repeat;}

div#recipes-area #header{ width:675px; height:242px; background:url(../img/bg_header.gif) left top no-repeat;}
div#recipes-area #header h1{ width:594px; height:184px; margin-left:43px; background:url(../img/h1_header.gif) left top no-repeat; text-indent:-9999px;}

ul#topic-path { width:655px; height:26px; display:block; margin-left:20px; padding-top:2px; font-size:12px; line-height:38px;}
ul#topic-path li { display: inline;}
ul#topic-path li a { margin-right:5px; padding-right:10px; background:url(../img/arrow_topic_path.gif) right no-repeat;}


#recipes{ width:594px; padding:0 38px 0 43px; background:url(../img/bg_recipes.gif) left top repeat-y;}
#recipes-inner{ width:567px; padding:23px 12px 0 15px; background:url(../img/bg_recipes-inner.gif) left top repeat;}
#recipes-inner02{ width:567px; padding:0 12px 0 15px; background:url(../img/bg_recipes-inner.gif) left top repeat;}

#recipes h3{ width:258px; height:45px; margin:0 0 7px 0; padding:0;}
#recipes h5.materials{ height:20px; margin:15px 0 3px; padding:0;}
#recipes h5.difficult{ width:247px; height:20px; margin:0 0 7px 0; padding:0;}
#recipes h5.unusual{ width:158px; height:20px; margin:0; padding:0;}
#recipes h5.program{ width:188px; height:20px; margin:0 0 7px 0; padding:0;}

.lead{}
.lead p{ color:#331805; font-weight:bold; margin-bottom:1em;}
.lead p.last{ margin-bottom:0;}
.lead p a:hover{ color:#2d4c00;}

/*mainBox*/
#mainBox{ width:564px;}
#mainBox h2{ width:564px; height:42px; margin:30px 0 15px; padding:0;}

#mainBox .leftBox{ float:left; width:262px;}
#mainBox .rightBox{ float:right; width:292px; padding-top:20px;}
#mainBox .rightBox p.note{ font-size:75%; letter-spacing:0em; clear:both;}
#mainBox .rightBox ul{ font-size:85%; line-height:1em; margin-bottom:5px;}
#mainBox .rightBox li{ width:125px; margin-right:7px; padding:5px 0 7px 15px; float:left; background:url(../img/materials_line.gif) left bottom no-repeat;}
#mainBox .rightBox li.last{ margin-right:0px;}
#mainBox .rightBox li.last_no{ margin-right:0px; background:none;}
#mainBox .rightBox li.mt10{ margin-top:10px;}
#mainBox .rightBox li.mb10{ margin-bottom:10px;}

p.serif{ padding-top:15px; clear:both;}

p.btn_details{ width:170px; height:20px; margin-top:10px; float:right;}
p.btn_details a{ display:block; width:170px; height:20px; background:url(../img/btn_details.gif) left top no-repeat; text-indent:-9999px;}
p.btn_details a:hover{ background-position: bottom;}
/*////////*/

/*pastBox*/
#pastBox{ width:564px; padding:30px 0 45px;}
html>/**/body #pastBox{ width:564px; padding:0 0 45px;}
html[xmlns*=""] body:last-child #pastBox{ width:564px; padding:45px 0}

#pastBox h2{ width:564px; height:32px; margin:0; padding:0; background:url(../img/h2_past.gif) left top no-repeat; text-indent:-9999px;}

.pastBox-inner{ padding:15px 0; background:url(../img/line.gif) left bottom repeat-x;}
.pastBox-inner .leftBox{ float:left; width:162px; padding-left:15px;}
.pastBox-inner .rightBox{ float:right; width:357px; padding-right:15px;}

p.btn_details-s{ width:147px; height:18px; margin-top:-20px; float:right;}
p.btn_details-s a{ display:block; width:147px; height:18px; background:url(../img/btn_details-s.gif) left top no-repeat; text-indent:-9999px;}
p.btn_details-s a:hover{ background-position: bottom;}
/*////////*/

/*coady_prof*/
#coady_prof{ width:567px; height:154px; padding:45px 0; clear:both;}
/*////////*/

/*programBox*/
#programBox{ width:564px; margin-bottom:15px; padding:15px 0; background:url(../img/line.gif) left bottom repeat-x;}
#programBox h2{ width:167px; margin:0; padding:0;}

#programBox .leftBox{ float:left; width:167px; padding-left:15px;}
#programBox .rightBox{ float:right; width:355px; padding-right:15px;}

#programBox p.btn_program{ width:167px; height:33px; margin-top:10px; float:right;}
#programBox p.btn_program a{ display:block; width:167px; height:33px; background:url(../img/btn_program.gif) left top no-repeat; text-indent:-9999px;}
#programBox p.btn_program a:hover{ background-position: bottom;}

/*programBox_marple*/
#programBox_marple{ width:564px; margin-bottom:15px; padding:15px 0; background:url(../img/line.gif) left bottom repeat-x;}
#programBox_marple h2{ width:180px; margin:0 0 0 15px; padding:0;}
#programBox_marple p.lead{ color:#331805; font-weight:bold; margin-bottom:1em;}

#programBox_marple h2.sherlock{ width:210px; margin:0; padding:0;}

#programBox_marple .leftBox{ float:left; width:314px; padding-left:15px;}
#programBox_marple .rightBox{ float:right; width:210px; padding-right:15px;}

#programBox_marple p.btn_program{ width:167px; height:33px; margin:0 0 0 5px; float:right;}
#programBox_marple p.btn_program a{ display:block; width:167px; height:33px; background:url(../img/btn_program.gif) left top no-repeat; text-indent:-9999px;}
#programBox_marple p.btn_program a:hover{ background-position: bottom;}

#programBox_marple p.btn_program02{ width:167px; height:33px; margin:0 0 0 5px; float:right;}
#programBox_marple p.btn_program02 a{ display:block; width:167px; height:33px; background:url(../img/btn_program02.gif) left top no-repeat; text-indent:-9999px;}
#programBox_marple p.btn_program02 a:hover{ background-position: bottom;}

/*////////*/

/*makeBox*/
#makeBox{ padding:30px 0;}
#makeBox h3{ width:564px; height:32px; margin:0 0 15px 0; padding:0; background:url(../img/h3_make.gif) left top no-repeat; text-indent:-9999px;}

.makeBox-inner{ width:540px; margin-left:15px; padding-bottom:9px;}

#makeBox ul.make{ width:535px;}
#makeBox li.make01{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make01.gif) left top no-repeat;}
#makeBox li.make02{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make02.gif) left top no-repeat;}
#makeBox li.make03{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make03.gif) left top no-repeat;}
#makeBox li.make04{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make04.gif) left top no-repeat;}
#makeBox li.make05{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make05.gif) left top no-repeat;}
#makeBox li.make06{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make06.gif) left top no-repeat;}
#makeBox li.make07{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make07.gif) left top no-repeat;}
#makeBox li.make08{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make08.gif) left top no-repeat;}
#makeBox li.make09{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make09.gif) left top no-repeat;}
#makeBox li.make10{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make10.gif) left top no-repeat;}
#makeBox li.make11{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make11.gif) left top no-repeat;}
#makeBox li.make12{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make12.gif) left top no-repeat;}
#makeBox li.make13{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make13.gif) left top no-repeat;}
#makeBox li.make14{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make14.gif) left top no-repeat;}
#makeBox li.make15{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make15.gif) left top no-repeat;}
#makeBox li.make16{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make16.gif) left top no-repeat;}
#makeBox li.make17{ margin-bottom:5px; padding-left:25px; line-height:20px; background:url(../img/make17.gif) left top no-repeat;}

#makeBox ul.ph{}
#makeBox ul.ph li{ width:137px; margin-right:4px; padding:0; float:left;}
#makeBox ul.ph li.left120{ padding-left:120px;}
#makeBox ul.ph li.left260{ padding-left:260px;}
#makeBox ul.ph li.last{ margin-right:0;}

.variation{ width:564px; margin-bottom:15px; background:url(../img/line03.gif) left top repeat-y; clear:both;}
.variation h4{ padding:15px; font-weight:bold; color:#2d4c00;}
.variation p.line{ width:564px; height:2px; background:url(../img/line02.gif) left top repeat-x;}
.variation p.txt{ padding:0 15px 15px;}
.variation .leftBox{ width:365px; margin:0 15px; padding-bottom:15px; float:left;}
.variation .rightBox{ width:150px; float:left;}

.variation p.note{ font-size:75%; letter-spacing:0em; clear:both;}
.variation p.note_red{ clear:both; color:#e55050;}

.variation ul.recipe{ font-size:85%; line-height:1em; margin-bottom:5px;}
.variation ul.recipe li{ width:125px; margin-right:7px; padding:5px 0 7px 15px; background:url(../img/materials_line.gif) left bottom no-repeat;}

.variation ul.disc{ padding:0 15px 5px 30px;}
.variation ul.disc li{ list-style-type:disc; margin-bottom:10px;}


p.point{ width:567px; clear:both;}

/*////////*/


/* copyright */
#recipes-inner #copyright { width:567px; font-size: 12px; color: #999; padding-bottom:5px;}
#recipes-inner02 #copyright { width:567px; font-size: 12px; color: #999; padding-bottom:5px;}
/*////////*/