/* Accessibility Tab Styling */ .accessibilitytab { position:fixed; top:50px; left:100%; width:360px; height:320px; margin-left:-40px; background:transparent; z-index:5000; } .accessibilitytab .tab { width:40px; height:120px; float:left; } .accessibilitytab .content { width:300px;height:300px; padding:10px; background:#6f6f70; float:left; visibility:} .accessibilitytab label { font-size:18px; display:block; line-height:140% } .accessibilitytab .fontsizers { position:relative; width:108px; height:32px; overflow:hidden; } .accessibilitytab .fontsizers .fontsizerup { position:absolute; width:32px; height:32px; top:0px; left:0px; } .accessibilitytab .fontsizers .fontsizerdown { position:absolute; width:32px; height:32px; top:0px; left:37px; } .accessibilitytab .fontsizers .fontsizerreset { position:absolute; width:32px; height:32px; top:0px; left:74px; } .accessibilitytab .schemepickers { position:relative; width:185px; height:32px; overflow:hidden; } .accessibilitytab .schemepickers .schemeblack { position:absolute; width:32px; height:32px; top:0px; left:0px; } .accessibilitytab .schemepickers .schemewhite { position:absolute; width:32px; height:32px; top:0px; left:37px; } .accessibilitytab .schemepickers .schemeblue { position:absolute; width:32px; height:32px; top:0px; left:74px; } .accessibilitytab .schemepickers .schemegrey { position:absolute; width:32px; height:32px; top:0px; left:111px; } .accessibilitytab .schemepickers .schemereset { position:absolute; width:32px; height:32px; top:0px; left:148px; } /* Set defaults */ * { padding:0; margin:0 } body { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; } /* Critical Top To Bottom Section Dimensions */ #preloader { position:absolute; width:64px; height:64px; top:50%; left:50%; margin:-32px 0 0 -32px; } #wrapper { width:1020px; height:auto; padding:0; margin:10px auto 20px auto; overflow:hidden } #header { width:1020px; height:177px; padding:0; margin:0 auto -90px auto; overflow:hidden; position:relative; z-index:10} #largepromo { width:980px; height:380px; padding:0 20px; margin:0 auto; overflow:hidden; } #content { width:980px; height:auto; padding:20px 20px 20px 20px; margin:0 auto; overflow:hidden; } #footermid { width:960px; height:auto; padding:20px 40px 0px 40px; margin:0 auto; overflow:hidden; } #footerbottom { width:1020px; height:30px; padding:0; margin:0 auto; overflow:hidden; } /* Image cycler sizes */ .cycler.large { width:980px; height:380px; overflow:hidden; } .cycler.small { width:300px; height:200px; overflow:hidden; } /* Font styling & margins etc NOTE: NO COLOURS / BACKGROUNDS HERE */ html { } body { font-size:14px; font-family:Verdana, Geneva, sans-serif; font-weight:normal; font-style:normal; line-height:110%; } h1 { font-size:160%; margin:10px 0px 10px 0px; font-family:rounded, Verdana, Geneva, sans-serif; line-height:90%; } h2 { font-size:140%; line-height:120%;} p { font-size:100%; margin:0px 0px 10px 0px;} ul { margin: 0px 0px 10px 30px; line-height:120%; } address { text-align:center; font-style:normal; } address .phone { font-size:300%; font-family:rounded, Verdana, Geneva, sans-serif; line-height:90%; letter-spacing:-3px; } address .address { font-size:120%; } address .email { font-size:120%; } .links { font-size:200%; text-align:center; display:block; margin-top:20px; } .links * { font-size:100%; text-decoration:none; font-style:normal; } ul.productlist { margin:0; padding:0; word-wrap:break-word;} ul.productlist li { text-decoration:none; list-style:none; min-height:1px; float:left; line-height:100% } ul.productlist li.heading { width:300px; padding:3px 0; margin:10px 0 0px 0; font-size:150%; clear:both; text-align:center;} ul.productlist li.item { width:200px; padding:5px 0 0 0; font-size:100%; clear:both; text-align:left; } ul.productlist li.itemdesc { width:300px; margin:0px 0px 5px 0px; font-size:80%; clear:both; text-align:left; } ul.productlist li.price { width:50px; padding:5px 0 0 0; text-align:right; } ul.productlistwide li { text-decoration:none; list-style:none; min-height:1px; float:left; line-height:100% } ul.productlistwide li.heading { width:460px; padding:3px 0; margin:10px 0 0px 0; font-size:150%; clear:both; text-align:center;} ul.productlistwide li.item { width:360px; padding:5px 0 0 0; font-size:100%; clear:both; text-align:left; } ul.productlistwide li.itemdesc { width:400px; margin:0px 0px 5px 0px; font-size:80%; clear:both; text-align:left; } ul.productlistwide li.price { width:100px; padding:5px 0 0 0; text-align:right; } ul.openingtimes { margin:0 auto; padding:0; width:50%; word-wrap:break-word; } ul.openingtimes li { list-style:none; line-height:140%} ul.openingtimes li.day { clear:both; float:left } ul.openingtimes li.times { text-align:right} /* COLOURS AND BACKGROUNDS */ body { color:white; background:#910202 url(theme/default/wallpaper.png) repeat-x fixed center 0; } #wrapper { color:inherit; background:inherit } #header { color:inherit; background:transparent url(theme/default/headermid.png) no-repeat; } #largepromo { color:inherit; background:transparent url(theme/default/promomid.png) repeat-y; } #content { color:inherit; background:transparent url(theme/default/contentmid.png) repeat-y; } #footermid { color:inherit; background:transparent url(theme/default/footermid.png) repeat-y; } #footerbottom { color:inherit; background:transparent url(theme/default/footerbottom.png) repeat-y; } h1 { color:#900; font-weight:normal; } p { color:#033; } ul { color:#900; } address { } address .phone { color:#FFF; } address .address { color:#CCC; } address .email { color:#FFF; } p.footnote { color:#CCC; } .links * { color:#CCC; } .links em { color:#F00; } .schemeblack #header { } .schemeblack #content { color:inherit; background:transparent url(theme/black/contentmid.png) repeat-y; } .schemeblack #footermid { color:inherit; background:transparent url(theme/black/footermid.png) repeat-y; } .schemeblack #footerbottom { color:inherit; background:transparent url(theme/black/footerbottom.png) repeat-y; } .schemeblack h1 { color:yellow; } .schemeblack p { color:yellow; } .schemeblack p.footnote { color:yellow; } .schemeblack ul { color:yellow; } .schemeblack address { } .schemeblack address .phone { color:yellow; } .schemeblack address .address { color:yellow; } .schemeblack address .email { color:yellow; } .schemeblack .links * { color:yellow; } .schemewhite #header { } .schemewhite #content { color:inherit; background:transparent url(theme/white/contentmid.png) repeat-y; } .schemewhite #footermid { color:inherit; background:transparent url(theme/white/footermid.png) repeat-y; } .schemewhite #footerbottom { color:inherit; background:transparent url(theme/white/footerbottom.png) repeat-y; } .schemewhite h1 { color:black; } .schemewhite p { color:#222; } .schemewhite p.footnote { color:#222; } .schemewhite ul { color:black; } .schemewhite address { } .schemewhite address .phone { color:black; } .schemewhite address .address { color:black; } .schemewhite address .email { color:black; } .schemewhite .links * { color:black; } .schemeblue #header { } .schemeblue #content { color:inherit; background:transparent url(theme/blue/contentmid.png) repeat-y; } .schemeblue #footermid { color:inherit; background:transparent url(theme/blue/footermid.png) repeat-y; } .schemeblue #footerbottom { color:inherit; background:transparent url(theme/blue/footerbottom.png) repeat-y; } .schemeblue h1 { color:#006; } .schemeblue p { color:#006; } .schemeblue p.footnote { color:#006; } .schemeblue ul { color:#00A; } .schemeblue address { } .schemeblue address .phone { color:#006; } .schemeblue address .address { color:#006; } .schemeblue address .email { color:#006; } .schemeblue .links * { color:#006; } .schemegrey #header { } .schemegrey #content { color:inherit; background:transparent url(theme/grey/contentmid.png) repeat-y; } .schemegrey #footermid { color:inherit; background:transparent url(theme/grey/footermid.png) repeat-y; } .schemegrey #footerbottom { color:inherit; background:transparent url(theme/grey/footerbottom.png) repeat-y; } .schemegrey .cycler.small img { border-color:#444; } .schemegrey h1 { color:#444; } .schemegrey p { color:#222; } .schemegrey p.footnote { color:#222; } .schemegrey ul { color:#000; } .schemegrey address { } .schemegrey address .phone { color:#333; } .schemegrey address .address { color:#333; } .schemegrey address .email { color:#333; } .schemegrey .links * { color:#333; } /* 980px grid system, 12 column setup */ .grid12 { width:960px; height:auto; padding:0 10px; margin:0 auto;} .grid12 .col_1w { width:60px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_2w { width:140px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_3w { width:220px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_4w { width:300px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_5w { width:380px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_6w { width:460px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_7w { width:540px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_8w { width:620px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_9w { width:700px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_10w { width:780px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_11w { width:860px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .col_12w { width:940px; margin:0 10px; float:left; display:inline; min-height:1px; } .grid12 .clear { clear:both; float:left; } .grid12 .first { margin-left:0; } .grid12 .last { margin-right:0; } /* Hover Buttons */ /* Note: These require the background image to be set in HTML, and the height to be 50% of the image, since the 'hovered image' is the bottom half of the image. i.e. Top half of the image is normal, bottom half is hovered. */ span.hoverimage { display:inline-block; } span.hoverimage:hover { background-position:0% 100%; } #sidebar img { display:block; margin:0 auto 48px auto; } .section { overflow:hidden; margin-bottom:40px; }