/* APPLE COTTAGE EXCITING CSS */

/* Quick How To */
/* background-repeat: repeat | repeat-x | repeat-y | no-repeat | inherit */
/* text-indent: value */
/* colours: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow */
/* Fonts: fantasy: Copperplate | Desdemona | Impact | Kino */


/* Class defintions not bound to a particular container. */
.padding { padding: 10px; }
.right { position: relative; clear: both; text-align: right; }
.pheading {font-size:22pt}
.pintro {font-size:12pt}

/* Any div using a float directive packed inside another div will require the floatend component to inherit correctly. */
/* eg <br class="floatend"> */
.floatend { clear: both; }



/* Ditch the silly blue border around all images when non-mac viewed any background image = take all available space. */
IMG { border:0 }
IMG.bg { width:100%; height:100% }
IMG.wide { width:100%; }
IMG.bannerborder { border: 2px solid #140E0E; }


/* Set up the web browser window & create a div to float in the middle. */
BODY { background-color: #4A121F; font-family:'comic sans ms'; padding: 20px; text-align: center;}
div.PageCenter { position: relative; text-align: center; width: 830px; margin: 0 auto; }

div.MenuTop { height: 75px; padding-top: 10px; padding-bottom: 10px; }
div.MenuTopHead { float: right; height: 70px; width: 32px; }
div.MenuTopItem { float: right; height: 70px; width: 128px; }
div.MenuTopTail { float: right; height: 70px; width: 30px; }
img.MenuTopImage { width: 100%; height: 70px; border: 1px solid black; }


div.MenuSide { position: relative; float: left; padding: 0px; width: 163px; }
div.MenuSideHead { width: 163px; }
div.MenuSideItem { width: 163px; }
div.MenuSideTail { width: 163px; }
img.MenuSideImage { width: 163px; }

/* The min-height + height auto is for safari. height: 600 is for ie which auto expands it. */
/* The min-height + height auto is for safari. height: 600 is for ie which auto expands it. */
div.menucontent { height: 600px; }
div.menucontent { position: relative; float: left; background-color: #AFBC84; left: 10px; padding: 10px; width: 635px; border: 2px solid #140E0E; min-height: 600; height: auto; }
div.background { position: relative; float: left; background-color: #AFBC84; left: 10px; padding: 10px; border: 2px solid #140E0E; min-height: 600; height: auto; }

/* Stick the images on pretty frames. */
div.thumbouter { background-color: #74834A; border: 2px solid #140E0E; padding: 10px; }
div.thumbinner { background-color: #FFFFFF; border: 1px solid #140E0E; padding: 5px; }
div.detailouter { background-color: #74834A; border: 5px solid #140E0E; padding: 30px; text-align: center; }
div.detailinner { background-color: #FFFFFF; border: 3px solid #140E0E; padding: 15px; margin: 0; }


table.right { margin-right: 5px; }

div.left2right { position: relative; float: left; text-align: left; }
div.right2left { position: relative; float: right; text-align: left; }
div.right2leftbottom { position: relative; float: right; text-align: left; bottom: 0px; }

div.left { position: relative; clear: both; text-align: left; }
div.center { position: relative; clear: both; text-align: center; margin: 0 auto;}

div.rightbottom { position: relative; clear: both; text-align: right; vertical-align: bottom; }
div.leftbottom { position: relative; clear: both; text-align: left; vertical-align: bottom; }




/* no man's land from here.... */

TABLE.pheading { width: 100%; height: 100%}
A.pskip { font-family:'comic sans ms'; font-size:18pt; color:black}
A.preturn { font-family:'comic sans ms'; font-size:18pt; color:black}


/* PAGE ITEM (THUMBNAIL ELEMENTS. & PAGE ITEM DATA (SIZE/PRICE) */
TD.pitemtop { text-align: left; vertical-align: top; border: 0px; font-size:13pt}
TD.pitem { text-align: left; vertical-align: bottom; border: 0px; font-size:13pt}
TD.pitem FONT.pitemd { font-size:10pt; color:black}

/* INDIVIDUAL ITEMS ON EACH PAGE */
TD.dheading { font-size:22pt}
TD.dtext { font-size:13pt}

.above, .below { font-size: 70%;
                 font-family: Verdana, Arial, sans-serif; }
.above { vertical-align: 0.7ex; }
.below { vertical-align: -0.3ex; }

