/* -- main layout -- */

body {
background-color: #FFFFFF;
padding: 0; 
margin: 0;
font-family: Verdana, Arial, sans-serif;
}

body {
font-size: x-small;      
voice-family: "\"}\"";   
voice-family: inherit;   
font-size: small;
}

html>body {
font-size: small;
}

#wrapper {
width: 792px;
margin: 0 auto;
}

body {
text-align: center;
}

#wrapper {
text-align: left;
}

#content 
{
	background-color: #ffffcc;
	padding: 15px 10px 35px;
	line-height: 1.2; /* fixes IE6 peekaboo bug */
}

.separator 
{
	height: 5px;
	background-color: #a9a9a9;
	clear: both;
	margin-bottom: 5em;
}

.separatorInvisible 
{
	height: 1px;
	clear: both;
}


/* -- login page layout -- */

#left
{
	float: left;
	position: static;
	width: 341px;
	padding: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: left;
	vertical-align: baseline;
}

#right 
{
	text-align:left;
	overflow: auto;
}

#right h2 {
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	font-weight: bold;
	font-size: 110%;
	color: #FF3300;
}

#right  p {
	font-size: 100%;
	color: black;
	padding: 0;
}

#loginbox
{
	margin-top: 20px;
}

.indexLabel 
{
	font: bold 16px Arial, Helvetica, sans-serif;
	color: #000000;
	text-decoration: none;
}

.greenLabel {
font: bold 12px Arial, Helvetica, sans-serif;
color: green;
text-decoration: none;
}

.greenHeader {
font: bold 24px Arial, Helvetica, sans-serif;
color: green;
text-decoration: none;
}

.orangeLabel {
font: bold 12px Arial, Helvetica, sans-serif;
color: #FF6600;
text-decoration: none;
}

.greenlink
{
	color: #060;
	text-decoration: none;
}

/* --  header, footer  -- */

#header 
{
	height: 20px;
	text-align: right;
	padding: 5px 5px 0px 0px;
}

#footer 
{
	clear: both;
	padding: 7px 10px;
}

#header a, #footer a 
{
	font: bold 11px Arial, Helvetica, sans-serif;
	color: #333333;
	text-decoration: none;
}

#header a:hover, #footer a:hover 
{
	color: #FF9900;
}

#footer td 
{
	text-align: right;
	font: 11px Arial, Helvetica, sans-serif;
	color: #333333;
}

/* --  nav bar -- */

#navigation {
height: 23px;
}

#navigation ul {
list-style-type: none;
padding: 0;
margin: 0;
}

#navigation li {
float: left;
margin: 0;
padding: 0;
display: inline;
background: url(/images/nav.png) no-repeat right top;
}

#navigation a {
font: bold 12px Arial, Helvetica, sans-serif;
text-transform: uppercase;
color: #ffffff;
text-decoration: none;
display: block;
padding: 5px 0px 0px 76px;
height: 23px;              /* IE 5 and 5.5 windows */
width: 264px;              /* IE 5 and 5.5 windows */
voice-family: "\"}\"";     /* HACK! IE 5 and 5.5 windows quit here */
voice-family:inherit; 
height: 18px;              /* all other browsers */
width: 188px;              /* all other browsers */
}

#navigation a {
text-transform: uppercase;
}

#navigation a:hover {
text-decoration: underline;
}


/* -- fonts -- */

p {
font-size: 95%;
font-family: Arial, Helvetica, sans-serif;
line-height: 1.4em;
padding-left: 1.1em;
margin-top: 0;
margin-bottom: 1em;
}

h1, h2, h3, h4 {
font-family: Arial, Helvetica, sans-serif;
}

h1, h2 {
margin: 10px 0 3px 0;
padding: 0 0 5px 0;
}

h1 {
font-weight: bold;
font-size: 150%;
color: #FF6600;
text-transform: capitalize;
font-style: italic;
}
   
h2 {
font-weight: normal;
font-size: 120%;
color: #FF9900;
background-color: transparent;
text-transform: none;
}

h3 {
margin: 0 0 5px 0;
font-size: 100%;
color: #444444;
font-weight: bold;
padding-left: 1.35em;
}

h4
{
	font-style: normal;
	font-weight: normal;
	font-size: 95%;
	color: maroon;
	margin: 0 0 20px 0;
	padding: 0 0 2px 0;
}

td, tr {
font-weight: normal;
font: 13px Arial, Helvetica, sans-serif;
line-height: 1.5;
color: #333333;
text-decoration: none;
}

th {
font: bold 12px Arial, Helvetica, sans-serif;
color: #333333;
text-align: left;
}

ul {
	list-style-type: circle;
	margin-left: 1.1em;
	padding: 0;
}

li {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	margin-left: 1.1em;
}

a img {
	border: 0;
	text-decoration: none;
}


/* -- forms -- */

input, select, textarea {
	border: 1px solid #cccccc;
	background-color: #ffffff;
	font: 12px Arial, Helvetica, sans-serif;
}


input.btn {
	background-color: #ff6600;
	color: #ffffff;
	font-weight:bold;
}

.errorExplanation {
	margin: 10px 0 3px 0;
	padding: 0 0 5px 0;
	font-weight: bold;
	font-size: 120%;
	color: red;
	background-color: transparent;
}

/* don't show "1 error prohibited this ... " */
.errorExplanation h2{
	display: none;
}

.fieldWithErrors {
	padding: 1px; 
	background-color: red; 
	display: table;
	line-height: 1.4em; /* match it to 'p' tag */ 
	margin-left: 1.1em; /* match it to 'p' tag */
}

.fieldSubscript {
	font-size: 88%;
	font-style: italic;
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 0;
	margin-bottom: 1em;
}

.formHeader {
	font-weight: bold;
	font-size: 115%;
	color: #000000;
	background-color: transparent;
}

.fieldHeader {
	font-weight: normal;
	font-size: 110%;
	color: #000000;
	background-color: transparent;
}

/* recipe page specifics */
#ingredients, #ingredients_labels {
	margin-left: 0.5em;
}


/* -- flash -- */

#notice {
	border: 2px solid green;
	padding: 1em;
	margin-bottom: 1em;
	background-color: #ffffff;
	font-family: sans-serif;
	font-weight: bold;
	color: green;
}

#warning {
	border: 2px solid red;
	padding: 1em;
	margin-bottom: 1em;
	background-color: #ffffff;
	font-family: sans-serif;
	font-weight: bold;
	color: red;
}

#message {
	border: 2px solid #ffa500; /* orange */
	padding: 1em;
	margin-bottom: 1em;
	background-color: #ffffff;
	font-family: sans-serif;
	font-weight: bold;
	color: #ffa500; /* orange */
}

/* -- auto complete for ingredients */

div.auto_complete {width: 350px; background: #fff;}
div.auto_complete ul {border:1px solid #888; margin:0; padding:0; width:100%; list-style-type:none;}
div.auto_complete ul li {margin:0; padding:1px; font-size: 95%;}
div.auto_complete ul li.selected { background-color: #f90; font-size: 95%;}
div.auto_complete ul strong.highlight { color: #800; margin:0; padding:0;}

#facebookLike, #facebookLike_SpaceAbove
{	
	clear: both;
	text-align: left;
	padding-left: 0px;
	width: 80%;
}

#facebookLike_SpaceAbove
{
	height: 20px;
}