/* screen.css */
/* Titles .png's 26px & 36px URW Palladio */
/* Right & Left arrow .png's 20px Vendome Italic */

body
	{
		border-left:0px none;
		border-right:0px none;
		border-bottom:0px none;
		border-top: 0px none;
		margin:0;
		text-align: center;
		color: #333;
		background-color: #FFFFFF;
		padding-bottom: 25px;
		font-style:normal;
		font-variant:normal;
		font-weight:normal;
		font-size:85%;
		font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
		padding-left:0; 
		padding-right:0;
		padding-top:0
	}

/*
h1 { font-size: 220%}
h2 { font-size: 160%}
h3 { font-size: 140%}
h4 { font-size: 120%}
h5 { font-size: 110%}
h6 { font-size: 100%}
*/

.ahem {
	display:    none;
	}

.float-wrapper {float: left; width: 66%;}
     /*** This can be floated left or right ***/

.first-float {float: right; width: 49%;}
     /*** This must be floated opposite 
		to .second-float ***/

.second-float {float: left; width: 49%;}
     /*** This must be floated opposite 
		to .first-float ***/

.third-float {float: right; width: 33%;}
     /*** This must be floated opposite 
		to .float-wrap ***/ 

.clearfooter {clear: both;}

 p {padding: 10px;}

/* Main menu settings */
#centeredmenu {
   clear:both;
   float:left;
   margin:0;
   padding:0;
   border-bottom: none; /*1px solid #000; /* black line below menu */
   width:100%;
   font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif; /* Menu font */
   font-size:90%; /* Menu text size */
   z-index:1000; /* This makes the dropdown menus appear above the page content below */
   position:relative;
}

/* Top menu items */
#centeredmenu ul {
   margin:20;
   padding:0;
   list-style:none;
   float:right;
   position:relative;
   right:50%;
}

#centeredmenu ul li {
   margin:0px 0 20px 3px;
   padding:0;
   float:left;
   position:relative;
   left:50%;
   top:1px;
}
#centeredmenu ul li a {
   display:block;
   margin:20;
   padding:.6em .5em .4em;
   font-size:1em;
   line-height:1em;
   background: #fff; /*#ddd; */
   text-decoration:none;
   color:#444;
   font-weight:bold;
   border-bottom: 1px solid #000; 
}

#centeredmenu ul li.active a {
   color: #fff; 
   background:#5b7b6c; /*#000; */
}
#centeredmenu ul li a:hover {
   background: #5b7b6c; /*#36f; /* Top menu items background colour */
   color:#fff;
   border-bottom: 1px solid #000; /*#03f; */
}
#centeredmenu ul li:hover a,
#centeredmenu ul li.hover a { /* This line is required for IE 6 and below */
   background: #5b7b6c; /*#36f; /* Top menu items background colour */
   color: #fff;
   border-bottom:  1px solid #000; /*#03f; */ 
}

/* Submenu items */
#centeredmenu ul ul {
   display:none; /* Sub menus are hiden by default */
   position:absolute;
   top:2em;
   left:0;
   right:auto; /*resets the right:50% on the parent ul */
   width:10em; /* width of the drop-down menus */
}

#centeredmenu ul ul li {
   left:auto;  /*resets the left:50% on the parent li */
   margin:0; /* Reset the 1px margin from the top menu */
   clear:left;
   width:100%;
}

#centeredmenu ul ul li a,
#centeredmenu ul li.active li a,
#centeredmenu ul li:hover ul li a,
#centeredmenu ul li.hover ul li a { /* This line is required for IE 6 and below */
   font-size:1em;
   font-weight:normal; /* resets the bold set for the top level menu items */
   background:#eee;
   color:#444;
   line-height:1.4em; /* overwrite line-height value from top menu */
   border-bottom:1px solid #ddd; /* sub menu item horizontal lines */
}
#centeredmenu ul ul li a:hover,
#centeredmenu ul li.active ul li a:hover,
#centeredmenu ul li:hover ul li a:hover,
#centeredmenu ul li.hover ul li a:hover { /* This line is required for IE 6 and below */
   background:#5b7b6c; /*#36f; /* Sub menu items background colour */
   color:#fff;
}

/* Flip the last submenu so it stays within the page */
#centeredmenu ul ul.last {
   left:auto; /* reset left:0; value */
   right:0; /* Set right value instead */
}

/* Make the sub menus appear on hover */
#centeredmenu ul li:hover ul,
#centeredmenu ul li.hover ul { /* This line is required for IE 6 and below */
   display:block; /* Show the sub menus */
}

#container
	{
		padding: 10px;
		margin-left: 80px;
		margin-right: 80px;
		text-align: center;
	}

#breadcrumb
{
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
font-size: xx-small;
margin-left: 10%;
margin-right: 10%;
border: none;
background-color: #ffffff;
padding: 1em;
text-align: center;
}

#main_content
{
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
margin-left: 10%;
border: none;
background-color: #ffffff;
margin-right: 10%;
padding: 1em;
text-align: center
}

.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;}
/* End hide from IE-mac */

#footer {
	border-left: 0px none;
	border-right: 0px none;
	border-bottom: 0px none;
	border-top: 10px none;
	text-align: center;
	clear: both;
	font-size: xx-small;
	voice-family: "\"}\"";
	voice-family:inherit;
	font-size: x-small;
	padding-left: 10px;
	padding-right: 7px;
	padding-top: 5px;
	padding-bottom: 7px;
	}

html>#footer	{
	font-size: x-small;
	}

#footer p	{
	margin: 10px 0;
	padding: 0;
	}

#footer ul	{
	margin: 10px 0 0 0;
	line-height: 80%;
	padding: 0;
	}

#footer li	{
	display: inline;
	margin: 0;
	border: 0px none;
	padding-left: 0;
	padding-right: 15px;
	padding-top: 0;
	padding-bottom: 0;
	}

h1, h2, h3, h4, h5, h6	{
	font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
	font-weight: normal;
	margin-top: 25px;
	margin-bottom: 2px;
	letter-spacing: 1px;
	}

h1.large {
	font-size: 36px;
	font-weight:lighter		
			
	 }

#ingredients
{
margin-left: 10%;
margin-right: 10%;
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
/*padding-left: 25%;*/
border:none;
background-color: #ffffff;
}

#ingredients ul  
{
list-style-type: none;
padding: 0;
margin: 0;
text-align:left;
}

#ingredients li
{
padding-left: 10em;
}

p.small
{
background-color: transparent;
color: black;
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
font-size: 10px;
text-align: center;
}

p.medium
{
background-color: transparent;
margin-left: 5%;
margin-right: 5%;
color: black;
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif; /*baskerville,'palatino linotype','times new roman',serif;*/
font-size: 12px;
text-align: center;
}

p.medium_float
{
background-color: transparent;
margin-left: 5%;
margin-right: 5%;
color: black;
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif; /*baskerville,'palatino linotype','times new roman',serif;*/
font-size: 12px;
text-align: left;
}

li.medium
{
list-style-type: none;
background-color: transparent;
color: black;
font-family:Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
font-size: 12px;
}

div.spacer {
	clear: both;
	}

div.centered {text-align: center;}
div.left {text-align:left; margin-left:auto; padding-left:25%;}

CSS
#navcontainer
{
margin-left: auto;
margin-right: auto;
margin-bottom: 40px;
border-top: 1px solid #999;
z-index: 1;
}

#navcontainer ul
{
list-style-type: none;
text-align: center;
margin-top: -8px;
padding: 0;
position: relative;
z-index: 2;
}

#navcontainer li
{
display: inline;
text-align: center;
margin: 0 5px;
}

#navcontainer li a
{
padding: 1px 7px;
color: #666;
background-color: #fff;
border: 1px solid #ccc;
text-decoration: none;
}

#navcontainer li a:hover
{
color: #000;
border: 1px solid #666;
border-top: 2px solid #666;
border-bottom: 2px solid #666;
}

#navcontainer li a#current
{
color: #000;
border: 1px solid #666;
border-top: 2px solid #666;
border-bottom: 2px solid #666;
}

#recipe_content
{
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
margin-left: 10%;
border: 1px solid gray;
background-color: #ffffff;
margin-right: 10%;
margin-bottom: 1%;
padding: 0.5em;
text-align: center;
}

#recipe_content_background
{
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
margin-left: 10%;
border: 1px solid gray;
background-color: #f5f5f5;
margin-right: 10%;
margin-bottom: 1%;
padding: 0.5em;
text-align: center;
}

.button
{
background:#fff;
border: 1px solid #000;
padding: 2px;
font-family: Myriad, "Gill Sans", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
font-size:85%;
}

/* Thanks to Stu Nicholls at CCS Play for the following: */

a.screen, a.screen:visited {
color:#008c00;/*#00f;*/ 
position:relative; 
z-index:1;
}
a.screen b {
position:absolute;
visibility:hidden; /* hide the image */
width:200px; /* give it a width */
height:0; /* no height to solve an Opera bug that makes it selectable when hidden */
border:0;/*1px solid #006a25;*/ /* add a border */
left:0; /* position:the image */
top:-150px;
}
a.screen:hover {
text-decoration:none; 
border:0; /* needed for this to work in IE */ 
z-index:1000;
}
a.screen:hover b {
visibility:visible; /* make the image visible */
height:150px; /* now give it a height */
cursor:pointer; /* for IE */
z-index:500; 
}
a.screen:hover b img {
border:0; /* remove the link border */
}

/* Pure CSS ToolTips */
a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:#fff;
    color:#008c00;
    text-decoration:underline;}

a.info:hover{z-index:25; background-color:#fff; text-decoration:none;}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #006a25;
    background-color:#fdebcf; color:#000;
    text-align: center}

/* Pure CSS ToolTips */

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls/gallery/left_right_click.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

#gallery {width:534px; position:relative; height:60px; padding-top:356px; margin:0 113px 90px 113px;}

#gallery img.left {width:55px; height:62px; background:#5b7b6c; float:left;cursor:pointer;}
#gallery img.right {width:55px; height:62px; background:#5b7b6c; float:left;cursor:pointer;}

#gallery ul {list-style:none; padding:0; margin:0; float:left; background:#5b7b6c; border:2px solid #5b7b6c; border-width:5px 2px;}
#gallery ul li {display:inline; width:50px; height:50px; float:left; margin:0 4px; border:1px solid #000; cursor:pointer;}

#gallery ul li.hide {display:none;}

/* using background images */
#gallery ul li.th1 {background:url(thumbs/th1.jpg);}
#gallery ul li.th2 {background:url(thumbs/th2.jpg);}
#gallery ul li.th3 {background:url(thumbs/th3.jpg);}
#gallery ul li.th4 {background:url(thumbs/th4.jpg);}
#gallery ul li.th5 {background:url(thumbs/th5.jpg);}
#gallery ul li.th6 {background:url(thumbs/th6.jpg);}
#gallery ul li.th7 {background:url(thumbs/th7.jpg);}
#gallery ul li.th8 {background:url(thumbs/th8.jpg);}
#gallery ul li.th9 {background:url(thumbs/th9.jpg);}
#gallery ul li.th10 {background:url(thumbs/th10.jpg);}
#gallery ul li.th11 {background:url(thumbs/th11.jpg);}
#gallery ul li.th12 {background:url(thumbs/th12.jpg);}
#gallery ul li.th13 {background:url(thumbs/th13.jpg);}
#gallery ul li.th14 {background:url(thumbs/th14.jpg);}
#gallery ul li.th15 {background:url(thumbs/th15.jpg);}
#gallery ul li.th16 {background:url(thumbs/th16.jpg);}
#gallery ul li.th17 {background:url(thumbs/th17.jpg);}
#gallery ul li.th18 {background:url(thumbs/th18.jpg);}
#gallery ul li.th19 {background:url(thumbs/th19.jpg);}

/* remove visibility:hidden; if you want to use the original images as thumbnails */
#gallery ul li img {/*visibility:hidden;*/ display:block; width:50px; height:50px;}

#gallery ul li span {display:none; position:absolute; left:61px; top:430px; width:411px;font-family:verdana, arial, sans-serif; color:#666; font-size:11px; line-height:15px; text-align:justify;}
#gallery ul li b {color:#444;}

#gallery ul li.chosen {border-color:#fff; cursor:default;}
#gallery ul li.chosen div {position:absolute; left:0; top:0; width:532px; height:355px; background:#5b7b6c; border:1px solid #000; border-width:1px 1px 0 1px;}
#gallery ul li.chosen div i {width:530px; height:355px; display:table-cell; vertical-align:middle; text-align:center;} 
#gallery ul li.chosen div i img {visibility:visible; width:auto; height:auto; border:1px solid #aaa; margin:0 auto;}
#gallery ul li.chosen span {display:block;}


/* vertical align for IE */
#gallery ul li.chosen i {display:block;}
#gallery ul li.chosen i em {width:0; height:100%; display:inline-block; vertical-align:middle;} 
#gallery ul li.chosen i img {display:inline-block; vertical-align:middle;}
/* for IE6 initial photo size */
#gallery ul li.chosen i img.start {width:319px; height:213px;}


/*.image {width:733px; height:490px; padding-top:10px; padding-left:17px; background: none; margin:0 auto; border-bottom:1px solid #ddd;}
.container {width:715px; height:26px;}*/
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/snowstorm.html
Copyright (c) 2005-2010 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

/* default styling */
.nav,
.nav ul {list-style-type:none; margin:0; padding:0; float:left;}
.nav a {text-decoration:none;}
.nav {font-family: verdana, sans-serif; font-size:11px; margin-bottom:-1px;}

/* style the links */
.nav a {float:left; background:#ddd; color:#000; text-align:center; line-height:16px; padding:4px 0; border:1px solid #fff; margin-bottom:-1px;}
.nav a.sub-a {background:#bbb;}

.nav a:hover,
.nav a:focus,
.nav a:active {outline:0; color:#fff; background:#5b7b6c;}#current

/* this is for the path highlight in all browsers except IE6 and lower */
.nav li:hover > a {color:#fff; background:#5b7b6c;} 

/* WIDTH change this WITH CARE to suit your requirements */
.nav {width:120px; margin-right:-1px;}
.nav a {width:118px; margin-right:-119px;} /* take into account the borders when calculating the link width, margin-right = total link width - 1px */
.nav ul li {max-width:120px;} /* fix for IE8 */

/* flyout TOP positions */
.nav ul.fly {top:-25px;} /* position the top of the flyout first sub-limenus */
.nav ul.fly2 {top:-41px;} /* position the top of the flyout sub-limenus with previous text on two lines */

/* flyout LEFT/RIGHT positions */
.nav ul.fly {left:119px;}
.nav .left ul.fly {left:auto; right:119px;}


/* DO NOT CHANGE ANYTHING BELOW THIS LINE */
/* ---------------------------------------------------------------------------- */
.nav ul {position:relative; margin-bottom:-10000px;} 
.nav ul li {float:left; clear:left;}
.nav a {position:relative;}
.sub-li {margin-top:-10000px;}
.sub-a {margin-top:10000px;}

/* The bit that does ALL the work to bring the sub-limenus into view */
.sub-li a:hover,
.sub-li a:focus,
.sub-li a:active {margin-right:0;}

/* OPERA fix */
.nav ul:hover {clear:left;}

/*IE5-7 fixes*/
.nav .sub-li {width:100%;}
a:active {}
/* ---------------------------------------------------------------------------- */

.greyquote {font-size:small; font-weight:bold; color:#646464;}