Hi from sunny and warm, no more closed airports from volcanic ash wakefield, UK…
On this page -
http://www.pauserefreshment.co.uk/jquery.html I happily replicated a JQUERY effect of a collapsible menu in chapter 5 of sitepoints JQUERY novice to ninja.
But on this page -
http://www.pauserefreshment.co.uk/cafeology_fairtrade_mocha_java_beans.html I just can not replicate the effect. I suspect an inheritance issue which i haven’t got the brains to figure out is preventing me from creating the effect in this page.
Please could someone give me an insight why I just cant get the menu to collapse here -
http://www.pauserefreshment.co.uk/cafeology_fairtrade_mocha_java_beans.html
Heres the offending code -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Traditional coffee machine beans | pause... refreshment</title>
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src='js/script.js'></script>
<style type="text/css" media="all">
@import "css/product_detail.css";
</style>
<script type="text/javascript" src="js/prototype.js"></script>
<script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<script src="jquery-1.4.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">$(document).ready(function(){
$( '#menu > li > ul' )
.hide()
.click(function( e ){
e.stopPropagation();
});
$('#menu > li').toggle(function(){
$(this).find('ul').slideDown();
}, function(){
$( this ).find('ul').slideUp();
});
});
</script>
</head>
<body>
<div id="pagewidth">
<div id="header">
<p> <a href="index.html"> Pause </a> </p>
<ul>
<li> <a href="whoweare.html" class="who"> who we are... </a> </li>
<li> <a href="ourrange.html" class="our"> our range... </a> </li>
<li> <a href="happycustomers.html" class="happy"> happy customers... </a> </li>
<li> <a href="talktous.html" class="come"> come & say hello... </a> </li>
<li> <a href="usefulinfo.html" class="useful"> useful things...</a> </li>
<li> <a href="#" class="on-line"> on-line shop... </a> </li>
<li> <a href="supportingyourworld.html" class="show"> show you care... </a> </li>
</ul>
</div>
<div id="main">
<div id="content">
<div class="left">
<h1 class="orange"><a name="Top" id="Top"></a>Buy traditional coffee machine beans - fair trade Mocha Java</h1>
<h2>To buy call Suzy 01924 363091 |<a href="mailto:david@pause.co.uk;hello@pause.co.uk"><strong> [EMAIL="suzie@pause.co.uk"]suzie@pause.co.uk[/EMAIL]</strong></a></span></a></h2>
<p><a href="images/model_bean/mocha_java_fact_500_693.jpg" rel="lightbox" title="Traditional coffee machine bean fact sheet"><img class="float_image" src="images/model_bean/mocha_java.jpg" alt="Traditional coffee machine beans" /></a>We supply cafés & restaurants with fair trade mocha java coffee beans in boxes of 6 x 1kg bags with free next day delivery. Uber ethical our fair trade cafeology coffee beans have been rubber stamped by the FAIRTRADE foundation and are compatible with <strong><a href="traditional_coffee_machine_la_spaziale_special.html" title"Traditional coffee machine"> traditional coffee machines</a></strong> only.</p>
<p>Produced mostly from the Cosurca Cooperative in Colombia and Coocafe in Costa Rica. They have composting programs in several of the communities to help generate organic fertilizer and reduce waste which helps to retain their land and maintain their Organic certification. Using valuable revenue from Fairtrade sales this has allowed Cosurca to stop the cultivation of more than 1,800 acres of coca and poppy.</p>
<p><strong>Four things our fair trade cafeology mocha java beans need to tell you...</strong></p>
<UL>
<LI class="eco4">Fair trade endorsed</LI>
<LI class="eco7">Origin: Cosurca Cooperative in Colombia and Coocafe in Costa Rica</LI>
<LI class="eco8">Blend: Colombia and Costa Rica Arabica </LI>
<LI class="eco13">Taste: Combination of fruit, chocolate and spiciness</LI>
</UL>
<div style="clear:both"></div>
<h2 class="orange">How many cups of coffee do your 1kg coffee bean bags serve up?</h2>
<p><img class="free" src="images/model_bean/andy_question.jpg" width="150" height="150" alt="Traditional coffee machine beans with uber slurps" />Each 1kg cafeology Mocha Java
coffee bean bag makes 857
standard sized 7oz cups
which equals 10 slurps
(David tested this)
per cup 8570 slurps per bag.</p>
<p>Your colleagues will love you forever when you buy this gourmet standard office coffee. Mocha Java, possibly the world's most famous coffee blend fuses two very distinctive coffees culminating in a full-bodied, rich in flavour and aroma,
coffee experience with subtle chocolate highlights (See Terry's verdict for a translation).</p>
<UL>
<LI class="eco9">Terry's verdict: "The poshist coffee I've ever tasted"</LI>
<LI class="eco10">Az's verdict: "I don't drink coffee but if I did I'd buy this"</LI>
</UL>
<div style="clear:both"></div>
<h3 class="orange">Which pause refreshment traditional coffee machine are compatible with the cafeology fair trade Mocha Java coffee beans?</h3>
<p><img class="free" src="images/model_bean/special_150_150_2.jpg" alt="Traditional coffee machine" />The <a href="traditional_coffee_machine_la_spaziale_s5.html" title"Tradtional coffee machine">La Spaziale S5</a> & <a href="traditional_coffee_machine_la_spaziale_special.html" title="Traditional coffee machine">La Spaziale Special</a> traditional coffee machines pairs up perfectly with the cafeology fair trade mocha java coffee beans. But that's not the only office coffee machine that can pair up, check out your other table top office coffee machine choices:</p>
<UL>
<LI><a href="traditional_coffee_machine_la_spaziale_s5.html" title="Traditional coffee machine">La Spaziale S5</a></LI>
<LI><a href="traditional_coffee_machine_la_spaziale_special.html" title="Traditional coffee machine">La Spaziale Special</a></LI>
</UL>
<div style="clear:both"></div>
<h4 class="orange">Traditional coffee machine beans - mocha java <span class="stars">special features</span></h4>
<p><img class="free" src="images/model_bean/julie_mask.jpg" alt="Breathable traditionjal cofee machine beans" />
<p>Every bag of cafeology fair trade coffee beans has a Co2 valve in the bag. The valve releases toxic fumes locking in the freshness of the bean - don't buy bags of coffee beans without them.</p>
<p>Unfortunately Eva Longoria was unavailable to model our fair trade coffee beans from cafeology but luckily Julie from Sales caught the photographer's eye.</p>
<div style="clear:both"></div>
<h5 class="orange">We have ways of making them come back for more.</h5>
<p><img class="free" src="images/model_filter/david_cards.jpg" width="150" height="150" alt="Buy Traditional coffee beans get loyalty cards" />Buy fair trade coffee beans this month and we'll send you a generous handful of loyalty cards, very useful if your running a café business and you want to incentivise and keep the office workers coming back for more.<br/>
</p>
<div style="clear:both"></div>
<h6 class="orange">What else do you sell in the Cafeology fair trade coffee range?</h6>
<p><img class="free" src="images/brand/Cafeology.jpg" alt="buy fair trade traditional coffee machine beans" />Cafeology sell a stack load of other beverage fair trade ancillaries which you can buy direct from pause refreshment including:</p>
<UL>
<LI>Filter coffee; bulk & Freshbrew coffee; instant coffee</LI>
<LI>Hot Chocolate</LI>
<LI>Sugar sticks</LI>
<LI>Paper cups and lids; china cups, saucers & mugs</LI>
<LI>Promotional point of sale materials</LI>
</UL>
<div style="clear:both"></div>
<h6 class="orange">How do I get you to supply my office with your coffee?</h6>
<p class="type"><img class="free" src="images/delivery/van.jpg" alt="Traditional coffee machine bean delivery" />Get our latest wholesale coffee filter, bean and instant prices call Suzy on 01924 363091 or eMail <a href="mailto:hello@pause.co.uk">suzy@pause.co.uk</a> :-)</br>
</p>
<div style="clear:both"></div>
<p class="print"><a href="#Top">↑ Back to Top</a></p>
<p class="print"><a href="#" onclick="window.print();return false;">Print friendly version</a></p>
</div>
</div>
<!-- Our range nav -->
<div id="sidebar">
<ul>
<li class="activeyellow"> <a href="ourrange.html"> our coffee machine range :-)<span style="dotsyellow">... </span> </a>
<ul>
<li> <a href="office_coffee_machine_darenth_style_5.html" title="Perfect office coffee machine"> Darenth Style 5 - Instant</a><span style="dotsyellow">...</span> </li>
<li> <a href="franke_evolution_coffee_machine.html"> FRANKE Evolution - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
<li> <a href="flavia_creation_400.html"> Flavia 400 - Filter</a><span style="dotsyellow">...</span> </li>
<li> <a href="#"> FRANKE Flair - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
<li> <a href="cafe_coffee_machines.html"> Fresh Ground 310 - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
<li> <a href="koro_coffee_machine.html"> Koro - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
<li> <a href="bean_to_cup_coffee_maker_la_cimbali_M1.html"> La Cimbali M1 - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
<li> <a href="traditional_coffee_machine_la_spaziale_s5.html" title="Traditional coffee machine"> La Spaziale S5 - Traditional</a><span style="dotsyellow">...</span> </li>
<li> <a href="traditional_coffee_machine_la_spaziale_special.html" title="Traditional coffee machine"> La Spaziale Special - Traditional</a><span style="dotsyellow">...</span> </li>
<li> <a href="mondo2_coffee_machine.html"> Mondo 2 - Filter</a><span style="dotsyellow">...</span> </li>
<li> <a href="qwikbrew_coffee_machine.html"> Qwikbrew - Filter</a><span style="dotsyellow">...</span> </li>
<li> <a href="bean_to_cup_coffee_maker_schaerer_siena_2.html" title="bean to cup coffee maker"> Schaerer Siena 2 - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
<li> <a href="pump_coffee_machine.html"> Therm - Filter</a><span style="dotsyellow">...</span> </li>
<li> <a href="vision_coffee_machine.html"> Vision 400 - Instant</a><span style="dotsyellow">...</span> </li>
</ul>
</li>
<li> <a href="ouringredients.html"> our ingredients<span style="dotsyellow">... </span> </a> </li>
<li> <a href="largeorganisations.html"> large organisations<span style="dotsyellow">...</span> </a> </li>
<li> <a href="specialoffer.html"> special offer<span style="dotsyellow">...</span> </a> </li>
<li> <a href="pausepromise.html"> pause promise<span style="dotsyellow">...</span> </a> </li>
</ul>
</li>
</ul>
<ul id ="menu">
<li id="menu"><a href="#">What's new?</a>
<ul id="menu" class="active">
<li id="menu"><a href="#">Weekly specials</a></li>
<li><a href="#">Last night's pics!</a></li>
<li><a href="#">Users' comments</a></li>
</ul>
</li>
<li><a href="#">Member extras</a>
<ul>
<li><a href="#">Premium Celebrities</a></li>
<li><a href="#">24-hour Surveillance</a></li>
</ul>
</li>
<li><a href="#">About Us</a>
<ul>
<li><a href="#">Privacy Statement</a></li>
<li><a href="#">Terms and Conditions</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</li>
</ul>
</div>
</div>
<ul id="menu">
<li><a href="#">What's new?</a>
<ul class="active">
<li><a href="#">Weekly specials</a></li>
<li><a href="#">Last night's pics!</a></li>
<li><a href="#">Users' comments</a></li>
</ul>
</li>
<li><a href="#">Member extras</a>
<ul>
<li><a href="#">Premium Celebrities</a></li>
<li><a href="#">24-hour Surveillance</a></li>
</ul>
</li>
<li><a href="#">About Us</a>
<ul>
<li><a href="#">Privacy Statement</a></li>
<li><a href="#">Terms and Conditions</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</li>
</ul>
<div id="footer">
<ul>
<li><a class="special" href="index.html">Home</a></li>
<li><a class="special" href="pressreleases.html">Press</a></li>
<li><a class="product" href="largeorganisations.html">Large Organisations</a></li>
<li><a class="product" href="/pdf/large_organisations.pdf">Brochure</a></li>
<li><a class="new" href="legal.html">Legal</a></li>
<li><a class="our" href="pausepromise.html">pause promise</a></li>
<li><a href="supportingyourworld.html">Show you care</a></li>
<li><a class="special" href="index.html">Copyright 2008 © pause</a></li>
</ul>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-4432210-1";
urchinTracker();
</script>
</body>
</html>
body {
margin:0;
background:url(../images/bg-body.gif) repeat-x 0 0;
font:11px Arial, Courier, Helvetica, sans-serif;
color:#712453;
min-width:985px;
border: 0px solid #702453;
}
img {
border:none;
display:block;
}
a {
color:#702453;
text-decoration:underline;
}
a:hover {
text-decoration:underline;
}
#pagewidth {
width:985px;
margin:0 auto;
overflow:hidden;
position:relative;
}
#header {
height:130px;
width:985px;
overflow:hidden;
}
#header p {
margin:0;
position:absolute;
top:13px;
left:18px;
}
#header p a {
display:block;
overflow:hidden;
text-indent:-9999px;
width:207px;
height:103px;
background:url(../images/logo_go_home.gif);
}
#header .plain {
display:block;
overflow:hidden;
text-indent:-9999px;
width:207px;
height:103px;
background:url(../images/logo_athome.gif);
z-index:5;
}
#header ul {
margin:0;
padding:0;
list-style:none;
position:absolute;
top:12px;
left:244px;
}
#header ul li {
float:left;
}
#header ul li a {
display:block;
overflow:hidden;
text-indent:-9999px;
height:120px;
background-image:url(../images/text-topnav10.jpg);
background-repeat:no-repeat;
}
#header ul li a.who {
width:91px;
background-position:0 0;
margin:0 12px 0 0;
}
#header ul li a.our {
width:93px;
background-position:-91px 0;
margin:0 7px 0 0;
}
#header ul li a.happy {
width:105px;
background-position:-184px 0;
margin:0 5px 0 0;
}
#header ul li a.come {
width:103px;
background-position:-289px 0;
margin:0 9px 0 0;
}
#header ul li a.useful {
width:93px;
margin:0 14px 0 0;
background-position:-392px 0;
}
#header ul li a.on-line {
width:94px;
margin:0 13px 0 0;
background-position:-485px 0;
}
#header ul li a.show {
width:95px;
background-position:-579px 0;
}
#main {
width:100%;
overflow:hidden;
}
#zoom {
width:0;
padding-top:3px;
float: left;
}
/* Image gallery ///////////////////////////////////////////////////////////////////*/
.machinegallery {
float: left;
width: 100px;
border: 1px solid #999;
margin: 0 30px 15px 0;
padding: 5px;
}
#content .machinegallery a img {
width: 100px;
height:100px;
border: none;
margin: 0px;
padding: 0px;
}
#content .float_image {
float:left;
padding-left:2%;
height:150px;
width:150px;
padding-bottom:-1px;
}
#content .caption {
text-align:center;
padding-bottom:5px;
font-weight:bold;
}
#content a img {
border:0 solid #000000;
height:94px;
margin-bottom:120px;
padding-left:20px;
margin-bottom:0px;
border:0px solid #000;
}
img {
border:medium none;
}
.wedge {
clear:both;
}
/* Image gallery end //////////////////////////////////////////////////*/
/* content 2 */
#content_2 .h3 {
padding:0px;
font-size:1.5em;
color: #B5B43E;
text-decoration:none;
}
#content_2 .h32 {
padding:0px;
font-size:1.5em;
color:#2B832C;
text-decoration:none;
}
#content_2 .h2 {
padding: 0;
margin: 0;
font-size:1.5em;
text-decoration:none;
color:#2B832C;
}
#content_2 .orange {
padding: 0;
margin: 0;
font-size:2em;
text-decoration:none;
color:#D68126;
}
#content .orange {
padding-top:28px;
margin: 0;
font-size:2em;
text-decoration:none;
color:#D68126;
padding-bottom:3px;
}
#content .orange2 {
padding-top:28px;
margin: 0;
font-size:3em;
text-decoration:none;
color:#D68126;
padding-bottom:3px;
}
#content .stars {
color:#712453;
background-image: url(../images/glitter/stars_4.jpg);
}
#content .orange2 {
padding-top:10px;
padding-bottom:3px;
margin: 0;
font-size:2em;
text-decoration:none;
color:#D68126;
}
#content_2 .type {
font-family:"Courier New" Courier monospace;
}
#content_2 .h1 {
padding-bottom:0px;
margin:0;
font-size:2em;
text-decoration:none;
}
#content_2 .h1footer {
padding-bottom:10px;
margin:0;
font-size:2em;
text-decoration:none;
}
#content_2 .h4footer {
padding-bottom:10px;
margin:0;
font-size:2em;
text-decoration:none;
font-family:"Courier New" Courier monospace;
}
#content_2 .homefooter {
padding-top:20px;
padding-bottom:20px;
margin:0;
font-size:2em;
text-decoration:none;
font-family:"Courier New" Courier monospace;
}
#content_2 a:link {
color: #622449;
text-decoration: none
}
#content_2 a:visited {
color: #622449;
text-decoration: none
}
#content_2 a:hover {
color: #D68126;
text-decoration: underline;
font-size: 100%;
font-weight:900;
}
#content_2 li {
font-size:1.5em;
}
#content_2 ul .clear {
list-style-type: none;
font-weight:bold;
}
#content_2 a img {
height:94px;
width:125px;
border:0px solid #000;
padding-left:20px;
margin-bottom:120px;
}
#content_2 .left {
float:left;
width:75%;
padding:0 0 28px;
}
#content_2 .free {
float:left;
padding-right:3px;
}
#content .productpic {
float:left;
padding-right:3px;
}
#content_2 p {
font-size:1.5em;
margin-bottom: 15px;
}
#content_2 .imagefloatleft {
float:left;
padding-right:2px;
}
#content_2 .h3green {
color:green;
font-size:16px;
padding-bottom:0px;
margin-bottom:0px;
}
#content_2 .ecoarticle {
margin-top:0px;
padding-top:0px;
}
/* content 2 ends */
#content p {
font-size:1.5em;
padding-right:2px;
}
#content .left {
float:right;
width:77%;
padding:0;
}
#content .h2 {
padding:0px;
font-size:15px;
color: #B5B43E;
}
#content .hotel {
padding:0px;
font-size:15px;
color: #B5B43E;
}
#content .h3 {
padding:0px;
font-size:15px;
color: #B5B43E;
text-decoration:none;
}
#content .type {
font-family:"Courier New" Courier monospace;
}
#content .call {
padding-top: 5px;
}
.home {
margin-left: 5%;
}
/* disabled
#content a:hover img {
width:300px;
height:225px;
}
*/
/* The rule below makes the effect work in IE */
#zoom a:hover {
padding-left:0px;
}
/* End Photo Zoom CSS */
/* * html #content .right {
padding:85px 0 0 28px;
} */
#content p {
margin:16px 0 0;
}
.image {
margin:0 0 0 -28px;
}
/*
Regular side bar
*/
#sidebar {
float:left;
width:225px;
padding:30px 0 0;
}
#sidebar .pic {
padding-bottom:50px;
padding-top:50px
}
#sidebar ul {
margin:0;
padding:0;
list-style:none;
width:225px;
overflow:hidden;
}
#sidebar ul li {
width:225px;
overflow:hidden;
float:left;
margin:4px 0 0;
}
#sidebar ul li a {
width:225px;
overflow:hidden;
display:block;
text-align: right;
font:14px "Arial", Courier New, San-serif;
line-height:18px;
color: #884970;
}
#sidebar ul li.activeblue a {
background: #702453;
text-decoration: none;
color: #6ecee4;
}
#sidebar ul li a:hover {
background: #702453;
text-decoration: none;
color: #6ecee4;
}
#sidebar ul ul li.activeblue2 a {
text-decoration: underline;
color: #6ecee4;
}
#sidebar ul ul li a:hover {
text-decoration: underline;
color: #6ecee4;
}
#sidebar ul li.activeyellow a {
color: #fece49;
background: #702453;
text-decoration: none;
}
#sidebar ul li a:hover {
background: #702453;
text-decoration: none;
color: #fece49;
}
#sidebar ul li.activeyellow2 a {
text-decoration: underline;
color: #fece49;
}
#sidebar ul li a:hover {
background: #702453;
text-decoration: none;
color: #fece49;
}
#sidebar ul li.activeorange a {
text-decoration: none;
background: #702453;
color: #f6872d;
}
#sidebar ul li a:hover {
background: #702453;
text-decoration: none;
color: #f6872d;
}
#sidebar ul li.activeorange2 a {
text-decoration: underline;
color: #6ecee4;
}
#sidebar ul li a:hover {
background: #702453;
text-decoration: none;
color: #f6872d;
}
#sidebar ul li.activepink a {
text-decoration: none;
background: #702453;
color: #dd5762;
}
#sidebar ul li a:hover {
background: #702453;
text-decoration: none;
color: #dd5762;
}
#sidebar ul li.activepink2 a {
text-decoration: underline;
color: #6ecee4;
}
#sidebar ul li a:hover {
background: #702453;
text-decoration: none;
color: #dd5762;
}
.sidebar ul li a dotsblue {
color: #6ecee4;
font-weight: bold;
}
#sidebar ul li a em {
color: #fece49;
font-weight: bold;
}
#sidebar ul ul {
margin:0;
padding:6px 13px 12px 0;
list-style:none;
width:212px;
text-align:right;
line-height:18px;
border-top:1px solid #fff;
background:#f0e9ed url(file:../images/separator.gif) repeat-x 0 100%;
}
#sidebar ul ul li {
float:none;
width:auto;
margin:0;
}
#sidebar ul ul a {
text-indent:0;
height:auto;
width:auto;
color: #702453 !important;
display:inline;
font:12px Arial, San-serif !important;
background:none !important;
}
#sidebar ul ul a:hover {
text-decoration: underline;
}
#footer {
height: 30px;
width: 985px;
overflow:hidden;
padding: 0px 0px 0px 0px;
margin: 0px auto 0px auto;
border-top: 1px dotted #333;
}
#footer ul {
margin: 10px 0 0 240px;
padding: 0;
}
#footer ul li {
list-style: none;
float: left;
}
#footer ul li a {
display: block;
overflow:hidden;
font:10px;
line-height:18px;
color: #884970;
padding: 0px 10px 0px 10px;
border-right: 1px solid #aaa;
}
#footer ul li a:hover {
background: #702453;
text-decoration: none;
color: #fece49;
}
#content h2 {
padding:0;
margin:0;
color:#B5B43E;
}
#content h1 {
margin:0;
padding-top:25px;
}
#content .h1 {
padding-top:0px;
padding-bottom:0px;
margin:0px;
}
#content h3 {
margin:0;
padding-top:5px;
color:#B5B43E;
text-decoration:underline;
}
#content .cart2 {
display: block;
width: 69px;
height: 54px;
background: url("../images/shopping_cart.jpg") no-repeat 0 0;
}
#content .cart2 {
margin-left:80%;
margin-top:20px;
}
#content .cart2:hover {
background: url("../images/shopping_cart_go.jpg") no-repeat 0 0;
}
#content a:link {
color: #622449;
text-decoration: none
}
#content a:visited {
color: #622449;
text-decoration: none
}
#content a:hover {
color: #D68126;
text-decoration: underline;
font-size: 100%;
font-weight:900;
}
#thumnails .pics li {
float: left;
width: 10em;
list-style:none;
padding: 2%;
}
#content .free {
float:left;
padding-right:3px;
margin-bottom:5px;
}
#content .freextra {
float:right;
margin-right:10px;
}
#content li {
font-size:1.5em;
margin: 0;
padding-left: 0;
}
#content ul li {
margin-left: 0;
padding: 2px 0 2px 16px;
list-style: none;
background: url('../images/green/tick.jpg') no-repeat top left;
overflow:hidden;
}
#content ul {
padding-left: 165px;
}
#content .performance {
margin-bottom:0px;
padding-bottom:-1px;
}
#content li.eco {
font-size:1.5em;
margin: 0;
padding: 0;
}
/* list icons start /////////////////////////////////////////////////*/
#content ul li.horlicks {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/horlicks.jpg') no-repeat top left;
}
#content ul li.decaf {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/decafe.jpg') no-repeat top left;
}
#content ul li.soup {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/knorr.jpg') no-repeat top left;
}
#content ul li.lemon {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/lemon.jpg') no-repeat top left;
}
#content ul li.cappuccino_2 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/cappuccino_nes.jpg') no-repeat top left;
}
#content ul li.cadbury {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/cadbury.jpg') no-repeat top left;
}
#content ul li.bovril {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/bovril.jpg') no-repeat top left;
}
#content ul li.nescaf {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/nescafe_gold.jpg') no-repeat top left;
}
#content ul li.pot {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/coffee_pot.jpg') no-repeat top left;
}
#content ul li.arrow_up {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/vertical_arrow.jpg') no-repeat top left;
}
#content ul li.arrow_flat {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/horizontal_arrow.jpg') no-repeat top left;
}
#content ul li.cup {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/cup_saucer.jpg') no-repeat top left;
}
#content ul li.jug {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/barista_bits/milk_jug.jpg') no-repeat top left;
}
#content ul li.eco {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/recy_icon.jpg') no-repeat top left;
}
#content ul li.eco2 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/power_2.jpg') no-repeat top left;
}
#content ul li.eco3 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/low_energy.jpg') no-repeat top left;
}
#content ul li.eco4 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/fairtrade.jpg') no-repeat top left;
}
#content ul li.eco5 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/rain.jpg') no-repeat top left;
}
#content ul li.eco6 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/organic.jpg') no-repeat top left;
}
#content ul li.eco7 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/compass.jpg') no-repeat top left;
}
#content ul li.eco8 {
margin: 0;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/bean.jpg') no-repeat top left;
}
#content ul li.eco9 {
margin-left: 3px;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/terry.jpg') no-repeat top left;
}
#content ul li.eco10 {
margin-left: 3px;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/az2.jpg') no-repeat top left;
}
#content ul li.eco11 {
margin-left: 3px;
padding: 7px 0 7px 30px;
list-style: none;
background: url('../images/green/rubbish2.jpg') no-repeat top left;
}
#content ul li.eco12 {
margin-right: 3px;
padding: 7px 0px 7px 30px;
list-style: none;
background: url('../images/green/heat13.jpg') no-repeat top left;
}
#content ul li.eco13 {
margin-right: 3px;
padding: 7px 0px 7px 30px;
list-style: none;
background: url('../images/green/chef_taste.jpg') no-repeat top left;
}
#content ul li.eco14 {
margin-left: 3px;
padding: 7px 0px 7px 30px;
list-style: none;
background: url('../images/green/chris_face2.jpg') no-repeat top left;
}
#content ul li.eco15 {
margin-left: 3px;
padding: 7px 0px 7px 30px;
list-style: none;
background: url('../images/green/david_face2.jpg') no-repeat top left;
}
#content ul li.espresso {
margin-left: 3px;
padding: 7px 0px 7px 30px;
list-style: none;
background: url('../images/barista_bits/espresso.jpg') no-repeat top left;
}
#content ul li.cappuccino {
margin-left: 3px;
padding: 7px 0px 7px 30px;
list-style: none;
background: url('../images/barista_bits/cappuccino.jpg') no-repeat top left;
}
.style2 {
color: #2B832C;
font-weight: bold;
}
#leftcolumn {
float: left;
width: 50%;
margin-top: 10px;
margin-bottom:20px;
}
#leftcolumn .watermachine {
float:left;
margin-top:5px;
}
#leftcolumn p {
margin-top:5px;
}
#rightcolumn p {
margin-top:5px;
}
#rightcolumn {
margin-left: 50%;
border-left: 0px solid #622449;
margin-top: 10px;
margin-bottom:20px;
}
#rightcolumn .watermachine {
float:left;
margin-top:5px;
}
#content .print {
color:red;
text-align:right;
padding-right:5px;
}
#sitemap ul {
font-size:1em;
font-family:Arial, Helvetica, sans-serif;
}
#sitemap ul li {
font-size:1.1em;
font-family:Arial, Helvetica, sans-serif;
}
#sitemap h1 {
padding-left:10px;
}
#sitemap a:link {
color: #622449;
text-decoration: none
}
#sitemap a:visited {
color: #622449;
text-decoration: none
}
#sitemap a:hover {
color: #D68126;
text-decoration: underline;
font-size: 100%;
font-weight:900;
}
/* home page */
#container_hp {
width: 96%;
margin: 10px auto;
background-color: #fff;
color: #333;
border: 1px solid gray;
line-height: 180%;
max-width: 1200px;
min-width: 550px;
margin:2% auto;
}
#top_hp {
padding: 0em;
border-bottom: 1px solid gray;
font-family:Arial, Helvetica, sans-serif;
height:190px;
background: #FFFFFF url(../images/model_filter/office_female_window4.jpg) no-repeat right center;
color:white;
font-size:1.5em;
line-height:90%;
font-stretch:extra-expanded;
}
#top_hp .floatleft {
float:right;
}
#top_hp h1 {
margin:0px;
color:#D68126;
padding:4px;
color:#D68126;
}
#leftnav_hp {
float: left;
width: 28%;
margin: 0;
padding: 1em;
background: white url(../images/model_filter/waiter4.jpg) no-repeat top right;
}
#leftnav_hp img {
float:left;
}
#content_hp img {
float:left;
}
#rightnav_hp {
float: right;
width: 28%;
margin: 0;
padding: 1em;
background: white url(../images/model_filter/corporate_coffee3.jpg) no-repeat top right;
}
#rightnav_hp img {
float:left;
}
#content_hp {
margin-left: 30%;
border-left: 1px solid gray;
margin-right: 30%;
border-right: 1px solid gray;
padding: 1em;
max-width: 36em;
background: white url(../images/model_filter/shop_coffee2.jpg) no-repeat top right;
}
#footer_hp {
clear: both;
margin: 0;
padding: .5em;
color: #333;
background-color: #ddd;
border-top: 1px solid gray;
}
#content_hp .headerfont {
font-size:2em;
padding:0px;
margin:0px;
color:#622449;
}
#leftnav_hp .headerfont {
font-size:2em;
padding:0px;
margin:0px;
color:#622449;
}
#leftnav_hp .headerfont2 {
font-size:2em;
padding:0px;
margin:0px;
color:#622449;
background: white url(../images/model_filter/shop_coffee2.jpg) no-repeat top right;
}
#rightnav_hp .headerfont {
font-size:2em;
padding:0px;
margin:0px;
color:#622449
}
#emailUs {
display: block;
width: 151px;
height: 46px;
background: url("../images/button/smiley_thumb.jpg") no-repeat 0 0;
}
#emailUs:hover {
background-position: 0 -23px;
background: url("../images/button/smiley_thumb_green.jpg") no-repeat 0 0;
}
#emailUs span {
display: none;
}
body.mp {
background-image: none;
background-color:#622449;
color:#FFFFFF;
min-width:985px;
}
.parapump {
font-size: 1.5em;
color:#622449;
font-size:1.5em;
font-weight:bold;
}
.parapump2 {
font-size: 1.5em;
color:#622449;
font-size:1.5em;
font-weight:bold;
background: white url(../images/model_filter/hotel_coffee3.jpg) no-repeat top right;
}
.parapump3 {
font-size: 1.5em;
color:#622449;
font-size:1.5em;
font-weight:bold;
background: white url(../images/model_filter/shop_coffee3.jpg) no-repeat top right;
}
.parapump4 {
font-size: 1.5em;
color:#622449;
font-size:1.5em;
font-weight:bold;
background: white url(../images/model_filter/business_coffee.jpg) no-repeat top right;
}
/* home page footer start */
.nav {
margin:auto;
border:1px;
height:60px;
background:#FFFFFF;
font:bold 88%/1.1 verdana;
clear:both;
overflow:hidden;
}
.nav li {
float:left;
list-style:none;
margin:5px;
}
.nav li a img {
margin:0 -5px;
border:1px inset #66f;
color:#ffffff background:;
}
.nav li a {
float:left;
padding:0 5px;
height:50px;
line-height:50px;
color:#D68126;
text-decoration:none;
text-transform:none;
font-size:1.25em;
}
.nav li a:hover {
margin:-3px;
border:3px inset #66f;
color:#CC6600;
background:;
}
.paddinglogo {
padding-left:15px;
}
/* home page footer end */
/* home page ends*/
a:link {
color: #622449;
text-decoration: none
}
a:visited {
color: #622449;
text-decoration: none
}
a:hover {
color: #D68126;
text-decoration: underline;
font-size: 100%
}
.hbloat {
font-size:2em;
font-weight:bold;
color:#622449;
}
/* blocks */
#wrap_blocks {
width:100%;
clear:both;
overflow:hidden;
}
#block_1 {
float:left;
width:15%;
background-color:;
border: 2px solid #702453;
color:#622449;
margin-right:3%;
margin-top:3%;
margin-left:10%;
height:320px;
}
#block_1 img {
margin-left:25%;
padding:5px;
}
#block_1 p {
font-size:1.5em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
}
#block_1 .biglink {
font_size:2em;
}
#block_2 {
width:15%;
float:left;
border: 2px solid #702453;
margin:3%;
background-color:;
height:320px;
}
#block_2 img {
margin-left:25%;
padding:5px;
}
#block_2 p {
font-size:1.5em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
}
#block_3 {
width:15%;
float:left;
margin:3%;
border: 2px solid #702453;
background-color:;
height:320px;
}
#block_3 p {
font-size:1.5em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
}
#block_3 img {
margin-left:25%;
padding:5px;
}
#block_4 {
width:15%;
float:left;
margin:3%;
border: 2px solid #702453;
background-color:;
height:320px;
}
#block_4 p {
font-size:1.5em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
}
#block_4 img {
margin-left:25%;
padding:5px;
}
#block_2 p {
font-size:1.5em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
}
#block_1 p {
font-size:1.5em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2%;
}
#block_2 h1 {
font-size:2.5em;
font-family:Arial, Verdana, Sans-serif;
}
/* end blocks */
/*cup and text */
#wrap_cupandtext {
width:100%;
clear:both;
}
#cup_left {
float:left;
width:50%;
background-color: #fff;
border-top: 0px solid #702453;
color:#622449;
font-weight:bold;
margin-left:-1px;
}
#cup_left img {
display: block;
margin-left: auto;
margin-right: auto;
padding-top:0px;
margin-top:0px;
}
#cup_left h2 {
margin-left:8%;
font-size:1.75em;
}
#cup_left .address {
padding-left:20px;
font-size:15px;
padding-top:0px;
margin-top:1px;
}
#cup_left h3 {
margin:0;
padding-top:10px;
padding-bottom:0px;
margin-bottom:0px;
font-size:25px;
color:#D68126;
padding-left:20px;
}
#strap_right {
width:50%;
float:right
}
#strap_right .endpadding {
padding-bottom:50px;
}
#strap_right .contact {
color:#F2CF4D;
font-size:2em;
margin-top:0px;
padding-top:0px;
}
#strap_right .floatleft {
float:left;
}
#strap_right .paddingstrip {
padding:0px;
padding-top:0px;
margin-top: 0px;
margin-bottom:0px margin-left:0px;
margin-right:5px;
}
#strap_right .headerbloat {
font-size:17px;
background-color:#A6AE1F;
}
#strap_right .cats {
font-size:13px;
margin-left:-1px;
}
#strap_right .strapline {
font-size:2em;
padding-top:0px;
margin-top:0px;
padding-bottom:0px;
margin-bottom:0px;
}
#strap_right p {
font-size:1.25em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2%;
}
#strap_right h1 {
font-size:3em;
font-family:Arial, Verdana, Sans-serif;
padding-bottom:0px;
margin-bottom:0px;
padding-top:0px;
margin-top:0px;
}
.centre {
text-align:center;
}
/*cup and text ends*/
/* blocks under cup start */
#wrap_blocks_c {
width:100%;
clear:both;
overflow:hidden;
}
#block_1_c, #block_2_c, #block_3_c, #block_4_c {
display:inline;
}
#block_1_c {
float:left;
width:100px;
background-color:;
border: 1px solid #702453;
color:#622449;
margin:1%;
height:340px;
}
#block_1_c img {
padding:5px;
display: block;
margin-left: auto;
margin-right: auto;
}
#block_1_c p {
font-size:1em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
padding:2px;
}
#block_1_c .biglink {
font-size:1.4em;
text-align:center;
}
#block_2_c {
width:100px;
float:left;
border: 1px solid #702453;
margin:1%;
background-color:;
height:340px;
}
#block_2_c .biglink {
font-size:1.4em;
text-align:center;
}
#block_3_c .biglink {
font-size:1.4em;
text-align:center;
}
#block_4_c .biglink {
font-size:1.4em;
text-align:center;
}
#block_2_c img {
padding:5px;
display: block;
margin-left: auto;
margin-right: auto;
}
#block_2_c p {
font-size:1em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
padding:2px;
}
#block_3_c {
width:100px;
float:left;
margin:1%;
border: 1px solid #702453;
background-color:;
height:340px;
}
#block_3_c p {
font-size:1em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
padding:2px;
}
#block_3_c img {
padding:5px;
display: block;
margin-left: auto;
margin-right: auto;
}
#block_4_c {
width:100px;
float:left;
margin:1%;
border: 1px solid #702453;
background-color:;
height:340px;
}
#block_4_c p {
font-size:1em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
padding:2px;
}
#block_4_c img {
padding:5px;
display: block;
margin-left: auto;
margin-right: auto;
}
#block_2_c p {
font-size:1em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2px;
}
#block_1_c p {
font-size:1em;
font-family:Arial, Verdana, Sans-serif;
margin-left:2%;
}
#block_2_c h1 {
font-size:2.5em;
font-family:Arial, Verdana, Sans-serif;
}
/* blocks under cup ends */
.pause {
color:#D68126;
font-weight:bold;
font-size:20px;
}
#sidebar ul li.sub a {
text-decoration: none;
background: #A6AE1F;
color: #622449;
}
#sidebar .sub a:hover {
text-decoration:none;
color: #622449;
}
#emailUs {
display: block;
width: 100px;
height: 66px;
background: url("../images/testimonial/get_quote_2.jpg") no-repeat 0 0;
margin-left:0px;
float:left;
}
#emailUs:hover {
background: url("../images/testimonial/get_quote.jpg") no-repeat 0 0;
}
#emailUs span {
display: none;
}
/*quick find*/
#quick, #quick ul { /* all lists */
padding: 0;
margin-left: 20px;
list-style: none;
line-height: 1;
font-size:15px;
font-family:Arial, Helvetica, sans-serif;
}
#quick a {
display: block;
width: 15em;
}
#quick li { /* all list items */
float: left;
width: 16em; /* width needed or else Opera goes nuts */
}
#quick li ul { /* second-level lists */
position: absolute;
background: #CCCCCC;
width: 15em;
left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}
#quick li ul ul { /* third-and-above-level lists */
margin: -1em 0 0 10em;
}
#quick li:hover ul, #quick li.sfhover ul {
left: auto;
}
#quick li:hover ul ul, #quick li.sfhover ul ul {
left: -999em;
}
#quick li:hover ul, #quick li li:hover ul, #quick li.sfhover ul, #quick li li.sfhover ul {
left: auto;
}
#cup_left {
clear: left;
}
/* Quick find end */
/* Light Box */
#lightbox {
position: absolute;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#lightbox img {
width: auto;
height: auto;
}
#lightbox a img {
border: none;
}
#outerImageContainer {
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#imageContainer {
padding: 10px;
}
#loading {
position: absolute;
top: 40%;
left: 40%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#hoverNav {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav {
left: 0;
}
#hoverNav a {
outline: none;
}
#prevLink, #nextLink {
width: 49%;
height: 100%;
background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */
display: block;
}
#prevLink {
left: 0;
float: left;
}
#nextLink {
right: 0;
float: right;
}
#prevLink:hover, #prevLink:visited:hover {
background: url(/images/prevlabel.gif) left 15% no-repeat;
}
#nextLink:hover, #nextLink:visited:hover {
background: url(/images/nextlabel.gif) right 15% no-repeat;
}
#imageDataContainer {
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%;
}
#imageData {
padding:0 10px;
color: #666;
}
#imageData #imageDetails {
width: 70%;
float: left;
text-align: left;
}
#imageData #caption {
font-weight: bold;
}
#imageData #numberDisplay {
display: block;
clear: left;
padding-bottom: 1.0em;
}
#imageData #bottomNavClose {
width: 66px;
float: right;
padding-bottom: 0.7em;
outline: none;
}
#overlay {
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
}
.strapshrink {
font-size:14px
}
/* Light Box Ends*/
/* Table form styling */
#content .form {
border: 1px solid;
border-collapse:collapse;
}
#content .form caption {
font-size:20px;
background-color:#F2CF4D;
font-weight:bold;
border: 1px solid;
color:#FFFFFF;
}
#content .form td {
border: 1px solid;
padding: 4px;
background-color:#712453;
font-size:15px;
font-weight:bold;
color:#FFFFFF;
}
/* Table form styling ends */
/*Collapse menu start*/
#menu {
float: right;
width:200px;
}
#menu, #menu ul{
list-style-type: none;
padding: 0;
margin: 0;
}
#menu li {
cursor:pointer;
background:#94C5EB;
border-bottom:1px solid #444;
}
#menu li a {
text-decoration: none;
}
#menu>li>a {
padding: 2px 10px; font-weight:bold;
}
#menu li li{
cursor:auto;
border:0;
padding:0 14px;
background-color:#fff;
}
#disclaimer, #intro {
width: 400px;
}
/*Collapse menu end */
Problem fixed