@charset "utf-8";
/* CSS Document for Ice Cream Farm, Tattenhall 2008 - validated CSS level 3 */

body {background-image:url(images/pencils_bk.jpg) ;  margin: 0; padding: 0; text-align: center; }
/* zero the margin and padding of the body element to account for differing browser defaults */

.oneColElsCtrHdr #container { background: #C1C1C1; margin:0 auto; width: 980px; text-align: left;} /* this overrides the text-align: center on the body element, the auto margins (in conjunction with a width) center the page */

.oneColElsCtrHdr #header { background: #FFFFFF; height: 180px; width: 980px}  
 
/*Logo image here*/
.oneColElsCtrHdr #header h1 {position:relative; left: 0px; top: 0px; margin: 0px; width: 980px; height: 180px; padding:0; background:url(images/logo1.gif) no-repeat; text-indent : -9999px;}
/* a negative value moves the text way off the screen to the left. OFF LEFT technique*/

h2#home {position:relative; left: 600px; top: 35px; margin: 0; width: 338px; height:400px; padding: 0; background:url(images/subtitle.gif) no-repeat; text-indent : -9999px; }
h2#tuesdays {position:relative; left: 600px; top: 35px; margin: 0; width: 338px; height:400px; padding: 0; background:url(images/tuesdays_pic.gif) no-repeat; text-indent : -9999px; }
h2#mondays {position:relative; left: 600px; top: 35px; margin: 0; width: 338px; height:400px; padding: 0; background:url(images/mondays_pic.gif) no-repeat; text-indent : -9999px; }
h2#specials{position:relative; left: 600px; top: 35px; margin: 0; width: 338px; height:400px; padding: 0; background:url(images/events_pic.gif) no-repeat; text-indent : -9999px; }
h2#gallery{position:relative; left: 600px; top: 35px; margin: 0; width: 338px; height:400px; padding: 0; background:url(images/gallery_pic.jpg) no-repeat; text-indent : -9999px; }
h2#contact{position:relative; left: 600px; top: 135px; margin: 0; width: 338px; height:400px; padding: 0; background:url(images/contact_pic.gif) no-repeat; text-indent : -9999px;  }




div#content {width: 980px; margin: 0; padding:0; text-align: left; }
div#content_main {float:left; width: 470px; padding: 20px 10px 20px 20px; }/*padding in main content area - top, right, bottom, left */

p {margin-top: 0; margin-left: 40px; /*text-align: justify; */font-family:georgia, sans-serif; font-size:0.9em; line-height:1.6em; color:#0D415F;}
p.bold{margin-top: 0; margin-left: 40px; /*text-align: justify; */font-family:georgia, sans-serif; font-size:0.8em; line-height:1.4em; font-weight:bold}
p img {float:right; margin: 8px;}
p.address {margin-left: 40px; font: bold 0.8em georgia, sans-serif; color:#333333; line-height:1.4em;}

h4 {margin-left: 40px; font: italic normal 0.9em georgia, sans-serif; letter-spacing: 0px; margin-bottom: 0; color:#A31818; margin-top: 0;}
h5 {margin-left: 40px; font: italic normal 1.6em georgia, sans-serif; margin-bottom: 0.5em; color:#2C98B3; margin-top: 0;}
h6 {margin-left:40px; margin-right:48px; font: italic normal 1.6em georgia, sans-serif; margin-bottom: 0.5em; color:#265C9F; margin-top: 0;}

/*main content heading image*/
h3#home_t{position:relative; margin: 0; padding: 0; top: 0px; left: 40px; width: 248px; height:38px; background:url(images/welcome_t.gif) no-repeat; text-indent: -9999px;}
h3#tuesdays_t{position:relative; margin: 0; padding: 0; top: 0px; left: 40px; width: 248px; height:38px; background:url(images/tuesdays_t.gif) no-repeat; text-indent: -9999px;}
h3#mondays_t{position:relative; margin: 0; padding: 0; top: 0px; left: 40px; width: 248px; height:38px; background:url(images/mondays_t.gif) no-repeat; text-indent : -9999px;}
h3#specials_t{position:relative; margin: 0; padding: 0; top: 0px; left: 40px; width: 248px; height:38px; background:url(images/special_t.gif) no-repeat; text-indent : -9999px;}
h3#gallery_t{position:relative; margin: 0; padding: 0; top: 0px; left: 40px; width: 248px; height:38px; background:url(images/gallery_t.gif) no-repeat; text-indent : -9999px;}
h3#contact_t{position:relative; margin: 0; padding: 0; top: 0px; left: 40px; width: 248px; height:38px; background:url(images/contact_t.gif) no-repeat; text-indent : -9999px;}


div#content_sub{float:right; width: 340px; height:400px; margin: 0; background-color:#FBFBF3;}
div#visitor_comments ul{position:absolute; list-style-type: none; margin-left: 1.4em; padding-left: 1.6em;width: 290px; top:620px; left: 57%; font-family:Georgia, Times, serif; font-size: 67%; z-index: 1}

li.comment{font: italic 600 1em georgia, sans-serif; margin-bottom: 0; color:#7D775C; margin-top: 7px; background-color:#FFFFFF}
li.customer {font: normal normal 1em georgia, sans-serif; margin-bottom: 0; color:#000033; margin-top: 0px; }
li.place {list-style-type: none; font: normal bold 0.9em georgia, sans-serif; margin-bottom: 0px; color:#7D775C; margin-top: 20px; line-height:1.2em;}
li.details {list-style-type: none; font: normal normal 0.9em georgia, sans-serif; margin-bottom: 10px; color:#7D775C; margin-top: 0px; line-height:1.2em;}
li.menu {list-style-type: none; font: normal normal 0.9em georgia, sans-serif; margin-bottom: 0px; color:#7D775C; margin-top: 0px; line-height:1.2em;}
li.bullet {list-style-type: circle; font: normal normal 0.9em georgia, sans-serif; margin-bottom: 0px; color:#006600; margin-top: 10px; line-height:1em; margin-left:30px; margin-right:30px;}

.clear {clear : both;}

a:link{font-family:georgia, sans-serif; color:#990000; font-weight:bold;  }
a:visited{color:#0D415F; font-weight:bold;}
a:hover{color:#0D415F; font-weight:bold;}
a:active{color:#0D415F; font-weight:bold;}

/*Navigation menu*/
	ul#nav_main {position: relative; width: 980px; height: 38px; margin: 0; padding: 0; background:url(images/menu_n.jpg) no-repeat; list-style-type: none; z-index: 2}

li#nm_1 {position: absolute; top: 0; left: 205px; width : 65px; height: 38px; background: url(images/menu_n.jpg) no-repeat -205px 0}
li#nm_2 {position: absolute; top: 0; left: 270px; width : 94px; height: 38px; background:url(images/menu_n.jpg) no-repeat -270px 0; }
li#nm_3 {position: absolute; top:0; left: 364px; width : 106px; height: 38px; background:url(images/menu_n.jpg) no-repeat -364px 0; }
li#nm_4 {position: absolute; top:0; left: 470px; width : 81px; height: 38px; background:url(images/menu_n.jpg) no-repeat -470px 0; }
li#nm_5 {position: absolute; top:0; left: 551px; width : 99px; height: 38px; background:url(images/menu_n.jpg) no-repeat -551px 0; }
li#nm_6 {position: absolute; top:0; left: 650px; width : 94px; height: 38px; background:url(images/menu_n.jpg) no-repeat -650px 0; }

/*text for menu images*/
ul#nav_main a {display:block; height: 38px; text-indent: -9999px; text-decoration: none; overflow:hidden;}

/*insert a negative value to move the image back from the absolute position*/
li#nm_1 a:hover {background:url(images/menu_r.jpg) no-repeat -205px 0}
li#nm_2 a:hover {background:url(images/menu_r.jpg) no-repeat -270px 0}
li#nm_3 a:hover {background:url(images/menu_r.jpg) no-repeat -364px 0;}
li#nm_4 a:hover {background:url(images/menu_r.jpg) no-repeat -470px 0;}
li#nm_5 a:hover {background:url(images/menu_r.jpg) no-repeat -551px 0;}
li#nm_6 a:hover {background:url(images/menu_r.jpg) no-repeat -650px 0;}

	
.oneColElsCtrHdr #footer p {margin: 0; padding: 0; width: 980px; height:30px; background: url(images/footer.jpg) no-repeat; text-indent : -9999px;}
	/* zeroing the margins of the first element in the footer will avoids margin collapse - a space between divs. Padding on this element will create space, just as the margin would have, without the margin collapse issue */

