/* Load in other css files ... */ @import url(/css/globals.css); @import url(/css/pages.css); @import url(/css/shop.css); #DEVBOXWARNING { display: none !important; } #canvas { padding: 0px; margin: 0px; background-color: #FFFFFF; font: normal 10pt arial; text-align: center; } #canvas.error { } #canvas.ingredients { padding: 10px; margin: 0px; font: normal 10pt verdana; background-image: none; text-align: left; } #container { position: relative; top: 0px; left: 0px; width: 1000px; margin: 0px auto 0px auto; } /* Left menu ... */ #left { float: left; width: 150px; } div#menu { margin: 50px auto 0px auto; background-color: pink; } ul#menu { display: block; padding: 0px; margin: 14px auto 10px auto; list-style-type: none; } ul#menu li { text-align: center; padding: 8px 0px 8px 0px; border-bottom: 1px solid transparent; background-color: #FFFFFF; background-image: url(/gfx/back/item.gif); background-repeat: no-repeat; background-position: bottom; } ul#menu li:hover { background-color: #FFFFFF; background-image: none; border-color: #FFFFFF; } ul#menu li:hover a { color: #202020; } ul#menu li a { margin: 5px !important; text-decoration: none; color: #606060; font: normal 8pt verdana; } ul#menu li a:hover { color: darkolivegreen; border-bottom: 1px solid darkolivegreen; text-decoration: none; } ul#menu li#shop a { font-weight: bold; color: olive; text-decoration: underline; } ul#menu li#shop a:hover { font-weight: bold; color: olive; text-decoration: none; } /* Sub-menus ... */ ul#menu ol { padding: 0px; margin: 0px; list-style-type: none; } ul#menu ol li { padding: 0px; margin: 0px; background-image: none; } ul#menu ol li a { color: olive; text-decoration: underline; } ul#menu ol li a:visited { color: olive; text-decoration: underline; } ul#menu ol li a:hover { color: olive; text-decoration: none; } ol.categories { } ol.categories li { margin: 2px 0px 4px 0px !important; } ol.categories li.new { padding-bottom: 12px; margin: 2px 0px 4px 0px !important; background-color: #FFFFFF; background-image: url(/gfx/icons/new.gif); background-repeat: no-repeat; background-position: center bottom; } ol.categories li.sale a { color: olive; background-color: yellow !important; padding: 2px 5px 2px 5px; } /* Logo(s) ... */ #logo { width: 148px; height: 148px; background-color: transparent; background-image: url(/gfx/logos/the-flour-bin.jpg); background-repeat: no-repeat; margin: 10px auto 0px auto; border: 1px solid #FFFFFF; } #logo:hover { border-color: #e0e0e0; } #logo img.spacer { width: 150px; height: 150px; } div#basket { width: 148px; height: 148px; background-color: transparent; background-image: url(/gfx/chrome/basket-checkout.jpg); background-repeat: no-repeat; margin: 10px auto 0px auto; border: 1px solid #FFFFFF; } div#basket:hover { border-color: #e0e0e0; } div#basket img.spacer { width: 150px; height: 150px; } /* Central content area ... */ #content { float: left; margin-left: 10px; text-align: left; width: 680px; background-color: transparent; background-image: none; background-repeat: no-repeat; } #content div#page { min-height: 300px; margin: 0px 10px 0px 10px; padding-bottom: 10px; background-color: transparent; } /* Right column ... */ #right { z-index: 1000; position: absolute; right: 0px; top: 0px; width: 150px; height: 300px; background-color: transparent; } #right #slate { color: #FFFFFF; background-color: olive; background-image: url(/gfx/back/search.gif); width: 150px; height: 150px; min-height: 150px; margin: 10px 0px 10px 0px; } #right #slate div.inner { padding: 10px 5px 5px 5px; } #right #slate div.inner a { color: #FFFFFF; } #right #slate div.inner a:hover { color: #FFFFFF; } #right #slate div.inner label { font: bold 10pt verdana; color: #FFFFFF; padding-bottom: 2px; } #right #slate div.inner #words { width: 124px; padding: 3px; margin-bottom: 10px; font: normal 10pt verdana,arial; border: 0px solid #FFFFFF; text-align: left; color: #404040; background-image: url(/gfx/back/words.gif); background-position: center bottom; background-repeat: no-repeat; } #right #slate div.inner #depts { width: 130px; padding: 0px; margin-bottom: 10px; font: normal 10pt verdana,arial; color: #202020; } #right #slate div.inner p { font: normal 8pt verdana; color: #FFFFFF !important; } #right .button { width: 130px; font: normal 10pt verdana; padding: 0px; height: 22px; border: 1px solid #202020; color: #404040; background-color: #c0c0c0; background-image: url(/gfx/back/buttons/order.gif); background-repeat: repeat-x; background-position: top center; } #right .button:hover { border-color: #FFFFFF; color: #FFFFFF; background-color: olive; background-image: url(/gfx/back/buttons/hi/green.gif); background-position: bottom; } #right div.shade { width: 150px; height: 15px; overflow: hidden; background-image: url(/gfx/back/shade.gif); } #right #accepted { width: 148px; border: 1px solid transparent; color: #606060; font: normal 8pt verdana; line-height: 20px; } #right #accepted:hover { color: #202020; } #right #accepted a:hover { text-decoration: none; border-bottom: 1px solid olive; } #right img#cards { margin: 20px auto 5px auto; } #right img#cards:hover { opacity: 0.8; } #right #tips { background-color: transparent; border: 0px solid #000000; text-align: left; margin: 25px auto 10px auto; } #tips ol { padding: 0px 0px 0px 10px; margin: 0px 0px 0px 10px; font: normal 8pt verdana; line-height: 10px; } #tips ol li { padding: 0px 0px 8px 0px; } #right #methods { background-color: transparent; border: 0px solid #000000; text-align: left; margin: 25px auto 10px auto; } /* Page Footer(s) ... */ #footer { position: relative; z-index: 1000; text-align: center; padding: 0px 0px 0px 0px; margin: 0px auto 0px auto; background-color: transparent; background-image: none; background-position: top; background-repeat: no-repeat; } #footer a:link { color: #505050; } #footer a:visited { color: #505050; } #footer a:hover { color: #FFFFFF; background: olive; } #footer #address { clear: both; padding: 90px 0px 0px 0px; color: #808080; background-image: url(/gfx/back/flourbin-footer.gif); background-repeat: no-repeat; background-position: top center; font: normal 8pt verdana,"MS Sans Serif"; text-align: center; } #footer #address:hover { color: #606060; } #footer #address:hover a { color: #606060; } #footer #address:hover a:visited { color: #606060; } #footer #address:hover a:hover { color: #606060; } #footer #address a { color: #808080; } #footer #address a:visited { color: #808080; } #footer #address a:hover { color: #000000; background-color: #FFFFFF !important; border-bottom: 1px solid #c0c0c0; text-decoration: none; } #base { position: relative; z-index: 0; border-top: 0px solid red; clear: both; width: 100%; height: 680px; background-color: #FFFFFF; background-image: url(/gfx/back/field-of-wheat.jpg); background-repeat: no-repeat; background-position: center 40px; } #base.vibrant { height: 650px; background-image: url(/gfx/back/field-of-wheat.jpg); } #base.wheat { height: 500px; background-image: url(/gfx/back/wheat.jpg); } /* Form : Search again ... */ #again { display: none; padding: 10px; margin: 50px 0px 20px 0px; border: 1px solid olive; color: #FFFFFF; background-color: olive; } #again h1 { color: #FFFFFF; padding: 0px; margin: 0px; } /* Messages ... */ .message { margin-left: 20px; } .message#spices { background-color: gold; } /* Photos ... */ .framed { padding: 8px; border: 1px solid #c0c0c0; } .framed:hover { border-color: olive; } #frame { clear: both; width: 678px; height: 148px; margin: 10px auto 0px auto; border: 1px solid #e0e0e0; background-color: #FFFFFF; } #frame:hover { border-color: #808080; } #panorama { position: relative; top: 10px; left: 10px; width: 658px; height: 128px; background-color: transparent; background-repeat: no-repeat; background-position: center center; overflow: hidden; } /* Oh Caption my Caption... */ #panorama #caption { cursor: pointer; position: absolute; bottom: 10px; right: -180px; width: 200px; height: 50px; color: #808080; background-color: #FFFFFF; background-image: url(/gfx/back/caption.png); background-repeat: repeat-y; background-position: 10px top; opacity: 1.0; } #panorama #caption p { display: none; } #panorama #caption a { color: olive; font-weight: normal; text-decoration: underline !important; } #panorama #caption a:hover { text-decoration: none !important; border-bottom: 1px solid olive; } #panorama:hover #caption { right: 0px; background-position: right top; } #panorama:hover #caption p { display: block; padding: 10px; margin: 0px; color: #808080; font: normal 8pt verdana; } #caption b,#caption strong { color: olive; } #caption div#slider { margin: 15px 0px auto 5px; color: #808080; font: bold 10pt verdana; } #panorama:hover #slider { display: none; } /* For always-on captions ... */ #caption.pinned { display: block !important; right: 0px !important; background-position: right top !important; } #caption.pinned div#slider { display: none !important; } #caption.pinned p { display: block !important; padding: 10px; margin: 0px; font: normal 8pt verdana; } #caption.pinned:hover { display: none !important; } /* For always off captions ... */ /* The individual images defined ... */ #panorama { background-image: url(/gfx/photography/sliced-loaf.jpg); } #panorama.unbaked { background-image: url(/gfx/photography/unbaked-loaf.jpg); } #panorama.sliced { background-image: url(/gfx/photography/sliced-loaf.jpg); } #panorama.up-close { background-image: url(/gfx/photography/up-close.jpg); } #panorama.results { background-image: url(/gfx/photography/sliced-loaf.jpg); } #panorama.green-wheat { background-image: url(/gfx/photography/green-fresh-wheat.jpg); } #panorama.blank { background-image: none; background-color: #eeeeee; } /* Google Analytics (Site Statistics) ... */ #googleAnalytics { clear: both; padding: 0px; overflow: hidden; width: 100%; height: 1px; background-color: transparent; } /* End of file */