/* ---------- 

Main CSS Document for Goodfellow's Cakes
Contact: rick.beddie@media.co.uk

---------- */

/*

CONTENTS

1. General Settings
2. Head Content
3. Coloured stripe header tiles
4. General Settings for Main Navigation
5. Main Navigational Item list
6. Main Navigation individual items as non-active tabs (Default Appearance)
7. Main Navigation individual items as active tabs
8. Green Banner Content
9. Yellow Banner Content
10. Purple Banner Content
11. Blue Banner Content
12. Blue sub nav Banner Content
13. Blue full width Banner Content
14. Green sub nav Banner Content
15. Yellow sub nav Banner Content
16. Purple sub nav Banner Content
17. Footer Content
18. Main Text Area
18a. Text area on the sub nav pages
18b. Text area on the full width pages
18c. Generic text and content settings
19. Main Generic Settings for Right Navigation
20. Colour Changes for Right Navigation
21. Colour Changes for page text content
22. Gallery Layout
23. Product Layout

*/

/* ---------- 1. General Settings ---------- */

body{
margin:0;
padding:0;
width:100%;
height:100%;
background-color:#e0e0e0;
}

a{
text-decoration:underline;
}

a:hover{
text-decoration:none;
}

p, h1, h2, h3{
margin-top:0;
}

/* ---------- 2. Head Content ---------- */

#logo{
width:780px;
margin:0 auto;
height:100px;
text-align:left;
background:#252b2d url(../images/since-1897.gif) scroll no-repeat right;
}

#logo img{
margin-top:30px;
margin-left:20px;
}

/* ---------- 3. Coloured stripe header tiles ---------- */

#bluewrapper{
background:#FFFFFF url(../images/blue-top-tile.gif) repeat-x scroll top;
text-align:center; /* Centers head content for IE6 */
}

#greenwrapper{
background:#FFFFFF url(../images/green-top-tile.gif) scroll repeat-x top;
text-align:center; /* Centers head content for IE6 */
}

#yellowwrapper{
background:#FFFFFF url(../images/yellow-top-tile.gif) scroll repeat-x top;
text-align:center; /* Centers head content for IE6 */

}

#purplewrapper{
background:#FFFFFF url(../images/purple-top-tile.gif) scroll repeat-x top;
text-align:center; /* Centers head content for IE6 */
}

/* ---------- 4. General Settings for Main Navigation ---------- */

#nav{
width:780px;
height:66px;
margin:0 auto;
text-align:left;
background:#252b2d url(../images/nav-tile.gif) scroll repeat-x bottom;
}

#nav .left{
height:66px;
background:transparent url(../images/nav-left.gif) scroll no-repeat bottom left;
}

#nav .right{
height:66px;
background:transparent url(../images/nav-right.gif) scroll no-repeat bottom right;
}

#navlist{
height:66px;
line-height:54px;
margin-left:10px;
margin-right:10px;
}

/* ---------- 5. Main Navigational Item list ---------- */

#navlist ul{
margin:0;
padding:0;
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
font-size:14px;
color:#FFFFFF;
font-weight:bold;
}

#navlist li{
margin:0;
padding:0;
float:left;
list-style:none;
text-align:center;
padding-top:12px;
}

#navlist a{
color:#FFFFFF;
text-decoration:none;
}

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

/* ---------- 6. Main Navigation individual items non-active tabs ---------- */

#navlist li.home{
width:86px;
background:transparent url(../images/nav-seperator.gif) scroll no-repeat bottom right;
}

#navlist li.create{
width:132px;
background:transparent url(../images/link-create.gif) scroll no-repeat bottom;
}

#navlist li.shop{
width:115px;
background:transparent url(../images/link-shop.gif) scroll no-repeat bottom;
}

#navlist li.wedding{
width:142px;
background:transparent url(../images/link-wedding.gif) scroll no-repeat bottom;
}

#navlist li.history{
width:90px;
background:transparent url(../images/nav-seperator.gif) scroll no-repeat bottom right;
}

#navlist li.faq{
width:80px;
background:transparent url(../images/nav-seperator.gif) scroll no-repeat bottom right;
}

#navlist li.contact{
width:115px;
}

/* ---------- 7. Main Navigation individual items as active tabs ---------- */

#navlist li.homeactive{
width:86px;
background:transparent url(../images/link-home.gif) scroll no-repeat bottom;
}

#navlist li.createactive{
width:132px;
background:transparent url(../images/link-create-active.gif) scroll no-repeat bottom;
}

#navlist li.shopactive{
width:115px;
background:transparent url(../images/link-shop-active.gif) scroll no-repeat bottom;
}

#navlist li.weddingactive{
width:142px;
background:transparent url(../images/link-wedding-active.gif) scroll no-repeat bottom;
}

#navlist li.historyactive{
width:90px;
background:transparent url(../images/link-history.gif) scroll no-repeat bottom;
}

#navlist li.faqactive{
width:80px;
background:transparent url(../images/link-faq.gif) scroll no-repeat bottom;
}

#navlist li.contactactive{
width:115px;
background:transparent url(../images/link-contact.gif) scroll no-repeat bottom;
}

/* ---------- 8. Green Banner Content ---------- */

#greenbodywrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#greenbodywrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/green-body-tile.gif) scroll repeat-x top;
}

#greenbodywrapper .left{
background:transparent url(../images/green-body-left.gif) scroll no-repeat top left;
}

#greenbodywrapper .right{
background:transparent url(../images/green-body-right.gif) scroll no-repeat top right;
}

#greenbodywrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/cakemaker-home-header.gif) scroll no-repeat top right;
padding-top:30px;
}

#greenbodywrapper .mainheading{
height:149px;
}

#greenbodywrapper .mainheading p{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:300px;
margin-left:25px;
margin-bottom:1.2em;
color:#FFF;
font-size:16px;
font-style:italic;
line-height:1.3em;
}

/* ---------- 9. Yellow Banner Content ---------- */

#yellowbodywrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#yellowbodywrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/yellow-body-tile.gif) scroll repeat-x top;
}

#yellowbodywrapper .left{
background:transparent url(../images/yellow-body-left.gif) scroll no-repeat top left;
}

#yellowbodywrapper .right{
background:transparent url(../images/yellow-body-right.gif) scroll no-repeat top right;
}

#yellowbodywrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/cakeshop-woman-header.gif) scroll no-repeat top right;
padding-top:30px;
}

#yellowbodywrapper .mainheading{
height:149px;
}

#yellowbodywrapper .mainheading p{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:200px;
margin-left:25px;
margin-bottom:1.2em;
color:#000000;
font-size:16px;
font-style:italic;
line-height:1.3em;
}

/* ---------- 10. Purple Banner Content ---------- */

#purplebodywrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#purplebodywrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/purple-body-tile.gif) scroll repeat-x top;
}

#purplebodywrapper .left{
background:transparent url(../images/purple-body-left.gif) scroll no-repeat top left;
}

#purplebodywrapper .right{
background:transparent url(../images/purple-body-right.gif) scroll no-repeat top right;
}

#purplebodywrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/wedding-banner.gif) scroll no-repeat top right;
padding-top:30px;
}

#purplebodywrapper .mainheading{
height:149px;
}

#purplebodywrapper .mainheading p{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:300px;
margin-left:25px;
margin-bottom:1.2em;
color:#FFF;
font-size:16px;
font-style:italic;
line-height:1.3em;
}

/* ---------- 11. Blue Banner Content ---------- */

#bodywrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#bodywrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/body-tile.gif) scroll repeat-x top;
}

#bodywrapper .left{
background:transparent url(../images/body-left.gif) scroll no-repeat top left;
}

#bodywrapper .right{
background:transparent url(../images/body-right.gif) scroll no-repeat top right;
}

#bodywrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/banner-1.gif) scroll no-repeat top right;
padding-top:30px;
}

#bodywrapper .mainheading{
height:149px;
}

#bodywrapper .mainheading p{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:250px;
margin-left:25px;
margin-bottom:1.2em;
color:#FFF;
font-size:16px;
font-style:italic;
line-height:1.3em;
}

/* ---------- 12. Blue sub nav Banner Content ---------- */

#bluesubwrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#bluesubwrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/full-inside-body-tile.gif) scroll repeat-x top;
}

#bluesubwrapper .left{
background:transparent url(../images/blue-inside-left.gif) scroll no-repeat top left;
}

#bluesubwrapper .right{
background:transparent url(../images/blue-inside-right.gif) scroll no-repeat top right;
}

#bluesubwrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/blue-sub-banner.gif) scroll no-repeat top right;
padding-top:0;
}

#bluesubwrapper .mainheading{
height:107px;
}

#bluesubwrapper .mainheading H1{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:250px;
margin-left:25px;
margin-bottom:0;
color:#FFF;
font-size:24px;
font-style:italic;
line-height:107px;
font-weight:normal;
}

/* ---------- 13. Blue full width Banner Content ---------- */

#bluebodywrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#bluebodywrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/full-inside-body-tile.gif) scroll repeat-x top;
}

#bluebodywrapper .left{
background:transparent url(../images/blue-inside-left.gif) scroll no-repeat top left;
}

#bluebodywrapper .right{
background:transparent url(../images/blue-inside-right.gif) scroll no-repeat top right;
}

#bluebodywrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/blue-inside-header.gif) scroll no-repeat top right;
padding-top:0;
}

#bluebodywrapper .mainheading{
height:107px;
}

#bluebodywrapper .mainheading H1{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:250px;
margin-left:25px;
margin-bottom:0;
color:#FFF;
font-size:24px;
font-style:italic;
line-height:107px;
font-weight:normal;
}

/* ---------- 14. Green sub nav Banner Content ---------- */

#greensubwrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#greensubwrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/green-inside-body-tile.gif) scroll repeat-x top;
}

#greensubwrapper .left{
background:transparent url(../images/green-inside-left.gif) scroll no-repeat top left;
}

#greensubwrapper .right{
background:transparent url(../images/green-inside-right.gif) scroll no-repeat top right;
}

#greensubwrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/green-sub-banner.gif) scroll no-repeat top right;
padding-top:0;
}

#greensubwrapper .mainheading{
height:107px;
}

#greensubwrapper .mainheading H1{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:250px;
margin-left:25px;
margin-bottom:0;
color:#FFF;
font-size:24px;
font-style:italic;
line-height:107px;
font-weight:normal;
}

/* ---------- 14. Green sub nav Banner Content ---------- */

#makerwrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#makerwrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/green-inside-body-tile.gif) scroll repeat-x top;
}

#makerwrapper .left{
background:transparent url(../images/green-inside-left.gif) scroll no-repeat top left;
}

#makerwrapper .right{
background:transparent url(../images/green-inside-right.gif) scroll no-repeat top right;
}

#makerwrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/green-sub-banner.gif) scroll no-repeat top right;
padding-top:0;
}

#makerwrapper .mainheading{
height:107px;
}

#makerwrapper .mainheading H1{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:250px;
margin-left:25px;
margin-bottom:0;
color:#FFF;
font-size:24px;
font-style:italic;
line-height:107px;
font-weight:normal;
}

/* ---------- 15. Yellow sub nav Banner Content ---------- */

#yellowsubwrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;

}

#yellowsubwrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/yellow-inside-body-tile.gif) scroll repeat-x top;
}

#yellowsubwrapper .left{
background:transparent url(../images/yellow-inside-left.gif) scroll no-repeat top left;
}

#yellowsubwrapper .right{
background:transparent url(../images/yellow-inside-right.gif) scroll no-repeat top right;
}

#yellowsubwrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/yellow-sub-banner-1.gif) scroll no-repeat top right;
padding-top:0;
}

#yellowsubwrapper .mainheading{
height:107px;
}

#yellowsubwrapper .mainheading H1{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:250px;
margin-left:25px;
margin-bottom:0;
color:#FFF;
font-size:24px;
font-style:italic;
line-height:107px;
font-weight:normal;
}

/* ---------- 16. Purple sub nav Banner Content ---------- */

#purplesubwrapper{
width:100%;
padding-bottom:60px;
background:transparent url(../images/foot-tile.gif) scroll repeat-x bottom;
}

#purplesubwrapper .tile{
width:780px;
margin:0 auto;
text-align:left;
background:transparent url(../images/purple-inside-body-tile.gif) scroll repeat-x top;
}

#purplesubwrapper .left{
background:transparent url(../images/purple-inside-left.gif) scroll no-repeat top left;
}

#purplesubwrapper .right{
background:transparent url(../images/purple-inside-right.gif) scroll no-repeat top right;
}

#purplesubwrapper .image{
margin:0 10px 0 10px;
background:transparent url(../images/purple-sub-banner.gif) scroll no-repeat top right;
padding-top:0;
}

#purplesubwrapper .mainheading{
height:107px;
}

#purplesubwrapper .mainheading H1{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
margin-right:250px;
margin-left:25px;
margin-bottom:0;
color:#FFF;
font-size:24px;
font-style:italic;
line-height:107px;
font-weight:normal;
}

/* ---------- 17. Footer Content ---------- */


#footer{
position: relative;
width:780px;
margin:0 auto;
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
font-size:11px;
color:#929596;
background:transparent url(../images/foot-shadow-new.gif) scroll no-repeat top;
padding-top:85px;
clear:both;
}

#buffetLink{
	position: absolute;
	width: 610px;
	height: 42px;
	top: 6px;
	left: 10px;
}

#footer p{
line-height:1.4em;
margin-bottom:1.3em;
}

#footer a{
font-weight:bold;
color:#929596;
}

/* ---------- 18. Main Text Area ---------- */

/* 18a. Text area on the sub nav pages */

#bluesubwrapper .textarea{
margin:25px 250px 0 25px;
}

#makerwrapper .textarea{
margin:25px 240px 0 17px;
}

#greensubwrapper .textarea{
margin:25px 250px 0 25px;
}

#yellowsubwrapper .textarea{
margin:25px 250px 0 25px;
}

#purplesubwrapper .textarea{
margin:25px 250px 0 25px;
}

/* 18b. Text area on the full width pages */

.textarea{
margin:25px 25px 0 25px;
}

/* 18c. Generic text and content settings */

.textarea p{
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#000;
}

.textarea h2{
font-size:20px;
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
color:#000;
}

.textarea h3{
font-size:16px;
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
color:#000;
}

.textarea ul{
margin:0 0 1.4em 0;
padding:0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}

.textarea ul li{
margin:0 0 0 3em;
padding:0;
line-height:1.6em;
}

.textarea ol{
margin:0 0 1.4em 0;
padding:0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}

.textarea ol li{
margin:0 0 0 3em;
padding:0;
line-height:1.6em;
}

/* ---------- 19. Main Generic Settings for Right Navigation ---------- */

#rightnav{
position:absolute;
top:210px;
left:50%;
width:206px;
margin-left:163px;
}

#rightnav ul{
margin:0;
padding:0;
background:transparent url(../images/right-nav-sep.gif) scroll no-repeat top;
}

#rightnav ul li{
margin:0;
padding:0;
list-style:none;
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
font-size:12px;
font-weight:bold;
background:transparent url(../images/right-nav-sep.gif) scroll no-repeat bottom;
height:35px;
padding-left:14px;
}

#rightnav li a{
text-decoration:none;
line-height:34px;
color:#000000;
}

#rightnav li a:hover{
text-decoration:underline;
}

/* ---------- 20. Colour Changes for Right Navigation ---------- */

#bluesubwrapper #rightnav li a:hover{
color:#006699;
}

#greensubwrapper #rightnav li a:hover{
color:#336600;
}

#yellowsubwrapper #rightnav li a:hover{
color:#ff9900;
}

#purplesubwrapper #rightnav li a:hover{
color:#990099;
}

/* ---------- 21. Colour Changes for page text content ---------- */

#purplesubwrapper .textarea h2{
color:#990099;
}

#purplesubwrapper .textarea h3{
color:#990099;
}

#purplesubwrapper .textarea ul li{
color:#990099;
}

#purplesubwrapper .textarea ol li{
color:#990099;
}

#purplesubwrapper .textarea a{
color:#990099;
}

#bluesubwrapper .textarea h2{
color:#006699;
}

#bluesubwrapper .textarea h3{
color:#006699;
}

#bluesubwrapper .textarea ul li{
color:#006699;
}

#bluesubwrapper .textarea ol li{
color:#006699;
}

#bluesubwrapper .textarea a{
color:#006699;
}

#greensubwrapper .textarea h2{
color:#336600;
}

#greensubwrapper .textarea h3{
color:#336600;
}

#greensubwrapper .textarea ul li{
color:#336600;
}

#greensubwrapper .textarea ol li{
color:#336600;
}

#greensubwrapper .textarea a{
color:#336600;
}

#yellowsubwrapper .textarea h2{
color:#ff9900;
}

#yellowsubwrapper .textarea h3{
color:#ff9900;
}

#yellowsubwrapper .textarea ul li{
color:#ff9900;
}

#yellowsubwrapper .textarea ol li{
color:#ff9900;
}

#yellowsubwrapper .textarea a{
color:#ff9900;
}

#bluebodywrapper .textarea h2{
color:#006699;
}

#bluebodywrapper .textarea h3{
color:#006699;
}

#bluebodywrapper .textarea ul li{
color:#006699;
}

#bluebodywrapper .textarea ol li{
color:#006699;
}

#bluebodywrapper .textarea a{
color:#006699;
}


#greenbodywrapper .textarea h2{
color:#336600;
}

#greenbodywrapper .textarea h3{
color:#336600;
}

#greenbodywrapper .textarea ul li{
color:#336600;
}

#greenbodywrapper .textarea ol li{
color:#336600;
}

#greenbodywrapper .textarea a{
color:#336600;
}

/* ---------- 22. Gallery Layout ---------- */

table.gallery td{
text-align:center;
padding:5px;
vertical-align:top;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}

/* ---------- 23. Product Layout ---------- */

.textarea .product{
float:left;
width:202px;
margin-left:10px;
text-align:right;
}

.textarea .product ul li{
list-style:none;
}

.textarea .product a.enlarge{
background:url(../images/magnify.gif) scroll no-repeat right;
padding:2px 20px 0 0;
}

.textarea .product img{
margin:0 0 5px 0;
}

.textarea .prodtext{
float:left;
width:240px;
margin:0 0 0 30px;
}

.textarea .prodtext h3{
margin-bottom:0;
}

.textarea .clear{
clear:both;
}

.textarea{
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#000;
}

.FAQQ{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
font-size:12px;
font-weight:bold;
color:#006699;
}

.faqQuestion{
font-family:"Trebuchet MS" Arial, Helvetica, Sans-serif;
font-size:12px;
font-weight:bold;
color:#000000;
}

.cakeitem{
float: left;
margin: 0 0 10px 0;
}
.cakeitemmargin{
margin: 0 8px 10px 10px;
}

.cakeimg{
width: 140px;
height: 140px;
text-align: center;
border: 1px solid #ff9900;
}

.cakename{
width: 140px;
text-align: center;
border: 0px solid green;
}

.clearall{
clear:both;

}

.cakeitem_wedding{
float: left;
margin: 0 0 10px 0;
}
.cakeitemmargin_wedding{
margin: 0 8px 10px 10px;
}

.cakeimg_wedding{
width: 140px;
height: 204px;
text-align: center;
border: 1px solid #990099;
}

.cakename_wedding{
width: 140px;
text-align: center;
border: 0px solid green;
}

.contactsubmenu {
margin: 0 0 20px 10px;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#000;
}


.contactsubmenu h3 {
color:#006699;
}

.contactsubmenu a{
color:#006699;
}

#cakemaker_text{
float: left;
width: 460px;
border: 0px solid red;
}
#cakemaker_button{
float: right;
width: 240px;
margin: 20px 0 10px 0;
border: 0px solid green;
text-align: center;
}