html {
margin: 0px;
padding: 0px;
}

body {
background: #fff; /* #557055; */
margin: 0px;
padding: 0px;
font-size: 76%;
}

.bannerimage {
width: 700px;
height: 150px;
clear: both;
background: #fff url('../graphics/loader.gif') 50% 50% no-repeat;
}

.bannerimage img.bannerimagepic {
display: block;
}


/******* THE BODY CONTAINER IS FOR A FIXED WIDTH 800 PIXEL SCREEN *******/
.pagecontainer {
margin: 0px auto;
width: 700px;
background-color: #fff; /* #f00; */
}

/* the left shadow on the body div 
.wrap1 {
padding: 0px 0px 0px 7px;
float: left;
width: 715px;
background: #fff url('../graphics/shadow2.gi') 0% 100% repeat-y;  #557055 
} */

/* the right shadow on the body div 
.wrap2 {
padding: 0px 4px 0px 0px;
float: right;
width: 704px;
background: #fff url('../graphics/shadow1.gi') 100% 0% repeat-y;  #fff 
} */

															
.leftnav {
float: right;
width: 160px;
height: 100%;
padding: 0px 0px 0 30px;
margin-top: 15px;
clear: none;
}

.main {
float: left;
width: 480px;
margin: 15px 0px 0px 0px;
padding: 2px 10px 2px 10px;
background-color: #fff; /* #fdf5e6; */
clear: both;
}

.main h1 {
margin-top: 0;
}
			 
.main h2 {
margin: 30px 0px -5px 0px;
padding-top: 3px;
line-height: 20px;
letter-spacing: 1px; 
word-spacing: 1px;
color: #480000;
}
			 
.main h3 {margin: 30px 0px -18px 0px;
font-size: 1.4em;
letter-spacing: 1px;
word-spacing: 1px;
color: #480000;}

.main h3.top {
margin: 20px 0px -10px 0px;
}

.main h4 {
margin: 20px 0px -15px 0px;
padding: 0px 0px 4px 0px;
font-size: .95em;
letter-spacing: 1px;
word-spacing: 1px;
}

.main p, li {
line-height: 1.8em;
font-family: tahoma, verdana, arial, helvetica, sans-serif; 
}

.main p {
line-height: 1.5em;
}


.main p.intextlinkfirst {
margin: -15px 0px 0px 0px;
}		
		 
.main p.intextlink {
margin: 0px 0px -12px 0px;
}

.main p.closerspacing {
margin: 0px 0px 5px 0px;
}

.main p.yearly {
margin-left: 15px;
font-weight: bold;
}

.endstory {
width: 90%;
height: 20px;
text-align: right; 
padding: 0px 20px 0px 20px;
margin: 7px 0px 0px 0px;
}
					
.copyright {
float: left;

height: 2em;
width: 100%;
padding: 1em 1em 2em 1em;
margin-top: 20px;
}

.copyright p {
text-align: center;
font-size: .9em;
margin: 0px 0px 0px 0px;
}

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



/*******************************************************/
/***** CUSTOM CLASSES AND STYLES - IMAGES **************/

/*to center a single image use the class .center */
.center {
text-align: center;
}

/* to center single images one after another down page
   just wrap standard images inside a div with class .imagegroup
	 and they will automatically centre and space themselves */
.imagegroup {
text-align: center;
}

.imagegroup img {
margin: 10px 0;
}


/*to center a single image under a h4 title*/
/* NOTE: look at previous examples, needs to be inside -- div class="centerundertitle"
         with the img src="blah" inside the div. */
.centerundertitle {
text-align: center;
margin: 32px 9px 0px 0px;
}

.center {
text-align: center;
margin: 0px 0px 0px 0px;
}
/*to left align an image wrapped by a paragraph*/
.left {
float: left;
margin: 5px 9px 0px 0px;
}

/*to left align an image slightly lower wrapped by a paragraph */
.leftdown {
float: left;
margin: 18px 9px 0px 0px;
}

/*to left align an image slightly lower under a h4 title */
.leftdownundertitle {
float: left;
margin: 24px 9px 0px 0px;
}

/*to right align an image wrapped by a paragraph*/
.right {
float: right;
margin: 5px 0px 0px 9px;
}

/*to right align an image slightly lower wrapped by a paragraph*/
.rightdown {
float: right;
margin: 18px 0px 0px 9px;
}

/*to right align an image slightly lower under a h4 title*/
.rightdownundertitle {
float: right;
margin: 24px 0px 0px 9px;
}

/*container for displaying two images side by side in between paragraphs 
(NOTE: div must be followed by line of text)*/
.boxes {
width: 100%;
text-align: center; 
margin: 20px 0;
}

.boxes img {
float: none;
padding: 5px;
}
/***************************************************/




/* USED SOLELY ON THE CONTACT RESPONSE PAGE FOR BOTTOM SPACING THE PAGE CORRECTLY */
p.bottomspacer {
margin: 0px 0px 200px 0px;
}

/* spaces the redirection text to 5em from top of page */
p.redirection {
margin-top: 5em;
}

p.bottomspacerredirection {
margin: 0px 0px 450px 0px;
}
/**************************************************/


/* the recipe classes follow */
.main ul, .main ul.recipelist, .main ul.recipelistlast, .main ul.plainlist {
margin: -5px 10px -5px 10px;
padding: 5px 0px 5px 0px;
background-color: #eee; /* #FEF9EF; */
border: 1px solid #ccc;
border-bottom: none;
border-left: none;
}

.main ul.plainlist {
background-color: #fff;
border: none;
margin: -5px 10px -5px -10px;
}

.main ul li, .recipelist li, .recipelistlast li, .plainlist li {
margin: 5px 0px 5px 40px;
list-style-type: none;
text-align: left;
font-size: .98em;
color: #333;
}

.main li .strong, .recipelist li.strong, .recipelistlast li.strong {
color: #480000;
font-size: .98em;
}


/* specific rule to space after an ended poem verse */
.recipelistlast li.endverse {
margin: 5px 0px 20px 40px;
}

/* use this recipelist if it is end of article */
.main ul.recipelistlast {
margin: -5px 10px 15px 10px;
}
/********************************************************/


/************************************************************************/
/******************* FOR FLASH PAGE ONLY ********************************/					
.flash {
margin: 30px 0px 10px 0px;
text-align: center;
}
/**************************************************************/


/************************************************************************/
/************** FOR OUTPUTTING EMAIL MESSAGES ON GALLERY PAGE ***********/	
.main .imagescontainer ul.email {
background-color: #fff; /* #b6bdb6; */
border: 1px solid #ccc;
width: 400px;
margin: 0 auto;
padding: 10px;
font-size: .95em;
}	

.main .imagescontainer ul.email li {
text-align: left;
}
/*****************************************************************/


/* this displays the 'you are logged in' on gallery page */
ul.logged {
background: none;
border: none;
}

/* this displays an error message if the login is unsuccessful */
p.error {
margin-top: 50px;
color: red;
text-align: center;
font-weight: bold;
background-color: #FFFFE8;
padding: 7px 5px;
border: 1px solid #ccc;
}


/************************************************************************/
/*************** FOR GALLERY IMAGES *************************************/
.imagescontainer div {
text-align: center;
}

.imagescontainer ul {
margin-top: 1em;
width: 90%;
}

.imagescontainer ul li {
list-style-type: none;
font-size: 1.1em;
text-align: center;
}

.extrapics img {
margin: 0px 8px 8px 8px; 
border: solid 3px #fff;
}

.extrapics h2 {
margin: 0px 0px 7px 0px;
}

.extrapics h3 {
margin: 20px 0px 5px 0px; 
font-weight: bold;
}

.extrapics p {
margin: 0px 0px 15px 0px;
font-size: 1em;
}
/****************************************************/



/*p class to use for captioning text*/
p.caption {
color: #480000;
margin: 0;
text-align: center;
}

/* FOR Formatting the archive pages lists */
dl.archives {
border: 1px solid #ccc;
background-color: #eee;
padding: 10px 20px 20px 20px;
line-height: 1.6em;
}

dl.archives dt {
margin: 20px 0px 5px 10px;
color: #666;
text-align: left;
font-weight: bold;
font-size: 1.4em;
letter-spacing: 1px; 
font-family: tahoma, verdana, arial, helvetica, sans-serif; 
text-transform: uppercase;
}

dl.archives dd {
margin: 0px 10px;
text-align: left;
font-weight: normal; 
font-family: tahoma, verdana, arial, helvetica, sans-serif; 
font-size: .95em;
}
/*******************************************************/


/*******************************************************/
/********* FOR THE PRODUCTS ON THE RETAIL.PHP PAGE *****/
.shoppingcart form.basket fieldset, .product form fieldset {
border: 1px solid #fff;
}

.shoppingcart img.paypal {
border: none;
float: left;
margin: 0px 10px 0 0;
}

.shoppingcart input.button {
margin-top: 5px;
}

.product {
margin: 0 0 20px 0;
padding: 0 15px;
border: 1px solid #999;
text-align: center;
}

.product h3 {
margin: 10px 0 6px 0;
padding: 0;
font-weight: normal;
font-size: 1.4em;
}

.product p {
margin: 0 0 10px 0;
padding: 0;
}

.product img {
float: none;
margin: 0;
padding: 0;
}

.product .button {
margin: 10px;
}
/*******************************************************/

.strong {
font-weight: bold;
}

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

/**************js slideshow*****************/

.flashmovie {
 position: absolute;
 left: 200px;
 top: 15px;
}


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