body 
{
color:red;
margin-left:0px;
margin-top:0px;
margin-right:0px;
background-color: white;
background-image:
url(../images/lemon.jpg);

}
#page
{

}



#header
{
font-family: "Monotype Corsiva" ;
text-align:center;
z-index: 20;
color: #000019;
font-size: 20px;
}



/* ############################################################### */
/* # top navigation is the CSS statements for the navigation row # */
/* ############################################################### */
#topnavigation
{
font-family:"Courier New", Arial;
font-size: 20px;
font-weight:Bolder;
font-variant:small-caps;
/*background-color:#D0A8DF;*/ /*Rem out statement, only used to see size of element*/
width: 600px;
position:absolute;
left: 240px;
top: 185px;
max-height:45px;
}

#topnavigation ul li
{
text-decoration: none;
display:inline;
padding: 2%;
color:purple;
}

#topnavigation ul li a:link
{
text-decoration: none;
color:purple;
outline-style:outset;
}

#topnavigation ul li a:visited
{
text-decoration: none;
color:blue;
outline-style:outset;
}

#topnavigation ul li a:hover
{
text-decoration: none;
color:red;
outline-style:inset;
}

#topnavigation ul li a:active
{
text-decoration: none;
color:red;
outline-style: inset;
}

/* ########################################################## */
/* # Css statements for the Navigation bar on the left side # */
/* ########################################################## */
#sidenavigation
{
width: 180px;
position:absolute;
left: -25px;
top: 240px;
}

#sidenavigation ul li
{
font-family:Courier New, Arial;
font-weight:bold;
font-variant:small-caps;
/*background-color:#D0A8DF; *//*Rem out statement only used the color to see the size of the element*/
text-align:center;
text-decoration: none;
display:block;
list-style-type:none;
padding: 5px 5px 5px 5px;
}

#sidenavigation ul li a:link
{
text-decoration: none;
color:purple;
outline-style:outset;
}

#sidenavigation ul li a:visited
{
text-decoration: none;
color:purple;
outline-style:outset;
}

#sidenavigation ul li a:hover
{
text-decoration: none;
color:red;
outline-style:inset;
}

#sidenavigation ul li a:active
{
text-decoration: none;
color:red;
outline-style:inset;
}

/* ######################################################################### */
/* # Css statements used only in the Index page and the other recipe pages # */
/* ######################################################################### */

#recipe
{
/*
width: 70%;         
max-width: 70%; 
right: 10px;
*/
width: 500px;
position:absolute;
left: 190px;
top: 250px;
background-color:#FED7EB;
margin:0 auto;

}

#recipe p
{
text-align:center;
}

#recipe2
{
float: right;
text-align:center;
}

#recipe2 ul li
{
text-align:left;
display:list-item;
list-style-type:circle;
}

#recipe2 ol li
{
text-align:left;
display:list-item;
list-style-type:decimal;
}

/* ############################################################################## */
/* # Css statements used only in other pages access from the top navigation bar # */
/* ############################################################################## */

#content
{
width: 98%;
height: 70%;
position:absolute;
left: 15px;
top: 250px;
background-color:#FED7EB;
overflow:auto;
}

#content p
{
padding: 5px;
width: 190px;
height: 190px;
float:left;
}

#content text
{
text-align:left;
position:relative;
top:5px;
}

/* ################################################################################# */
/* #Css statements used in the Divs that display the recipe images including hover # */
/* ################################################################################# */
.image
{
  margin: 2px;
  border: 1px solid #0000ff;
  height: auto;
  width: 159px;
  float: left;
  text-align: center;
}	

.image img
{
  display: table;
  margin: 5px;
  border: 1px solid #ffffff;
}

.image a:hover img 
{
border: 1px solid #0000ff;
}