<style type="text/css">
#menuHolder {width:750px; height:70px; position:relative; z-index:100; margin:30px auto 100px auto;}
#menuHolder ul {width:750px; height:35px; padding:0; margin:0; list-style:none; text-align:center;}
#menuHolder ul.topLevel {background:#fff;}
#menuHolder ul li {display:inline-block; position:relative; height:35px;}
#menuHolder ul li a {display:block; padding:0 15px; font: bold 12px/35px arial, sans-serif; color:#fff; text-decoration:none;}
#menuHolder ul.topLevel li a {
background: rgb(239,197,202);
background: -moz-linear-gradient(-45deg,  rgba(239,197,202,1) 0%, rgba(210,75,90,1) 50%, rgba(186,39,55,1) 51%, rgba(241,142,153,1) 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(239,197,202,1)), color-stop(50%,rgba(210,75,90,1)), 
color-stop(51%,rgba(186,39,55,1)), color-stop(100%,rgba(241,142,153,1)));
background: -webkit-linear-gradient(-45deg,  rgba(239,197,202,1) 0%,rgba(210,75,90,1) 50%,rgba(186,39,55,1) 51%,rgba(241,142,153,1) 100%);
background: -o-linear-gradient(-45deg,  rgba(239,197,202,1) 0%,rgba(210,75,90,1) 50%,rgba(186,39,55,1) 51%,rgba(241,142,153,1) 100%);
background: -ms-linear-gradient(-45deg,  rgba(239,197,202,1) 0%,rgba(210,75,90,1) 50%,rgba(186,39,55,1) 51%,rgba(241,142,153,1) 100%);
background: linear-gradient(-45deg,  rgba(239,197,202,1) 0%,rgba(210,75,90,1) 50%,rgba(186,39,55,1) 51%,rgba(241,142,153,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efc5ca', endColorstr='#f18e99',GradientType=1 );
border-radius: 5px;
}
#menuHolder ul.topLevel li a.close {display:block; position:absolute; left:0; top:18px;  padding:0 15px; height:0; overflow:hidden; color:#000;
background: rgb(226,226,226);
background: -moz-linear-gradient(-45deg,  rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, 
rgba(229,229,229,1) 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(226,226,226,1)), color-stop(50%,rgba(219,219,219,1)), 
color-stop(51%,rgba(209,209,209,1)), color-stop(100%,rgba(229,229,229,1)));
background: -webkit-linear-gradient(-45deg,  rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,
rgba(229,229,229,1) 100%);
background: -o-linear-gradient(-45deg,  rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(229,229,229,1) 100%);
background: -ms-linear-gradient(-45deg,  rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(229,229,229,1) 100%);
background: linear-gradient(-45deg,  rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(209,209,209,1) 51%,rgba(229,229,229,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#e5e5e5',GradientType=1 );
-moz-transition: 0.25s;
-ms-transition: 0.25s;
-o-transition: 0.25s;
-webkit-transition: 0.25s;
transition: 0.25s;
}
#menuHolder ul.sub {position:absolute; left:0; top:0; z-index:-1; background:transparent;
-moz-transition: 0.25s;
-ms-transition: 0.25s;
-o-transition: 0.25s;
-webkit-transition: 0.25s;
transition: 0.25s;
}
#menuHolder ul.sub li a {padding:0 10px; font-size:11px; color:#069;}
#menuHolder ul.sub li a:hover {color:#000; text-decoration:underline;}
#menuHolder b {display:none;}
#menuHolder #t1:target ~ ul.s1,
#menuHolder #t2:target ~ ul.s2,
#menuHolder #t3:target ~ ul.s3,
#menuHolder #t4:target ~ ul.s4 {top:35px;}
#menuHolder #t1:target ~ ul.topLevel li a.c1,
#menuHolder #t2:target ~ ul.topLevel li a.c2,
#menuHolder #t3:target ~ ul.topLevel li a.c3,
#menuHolder #t4:target ~ ul.topLevel li a.c4 {height:35px; top:0;}
#menuHolder #c1:target ~ ul.s1,
#menuHolder #c2:target ~ ul.s2,
#menuHolder #c3:target ~ ul.s3,
#menuHolder #c4:target ~ ul.s4 {top:0;}
#menuHolder #c1:target ~ ul.topLevel li a#c1,
#menuHolder #c2:target ~ ul.topLevel li a#c2,
#menuHolder #c3:target ~ ul.topLevel li a#c3,
#menuHolder #c4:target ~ ul.topLevel li a#c4 {height:0; top:18px}
</style>
<br><br>
<div id="menuHolder">
    <b id="t1"></b><b id="t2"></b><b id="t3"></b><b id="t4"></b>
    <b id="c1"></b><b id="c2"></b><b id="c3"></b><b id="c4"></b>
    <ul class ="topLevel">
	   <li><a href="#url">Home</a></li>
	   <li class ="target"><a class ="down" href="#t1">Sales ⇓</a><a href="#c1" class ="close c1">Sales ⇑</a></li>
	   <li class ="target"><a class ="down" href="#t2">Services ⇓</a><a href="#c2" class ="close c2">Services ⇑</a></li>
	   <li class ="target"><a class ="down" href="#t3">Contacts ⇓</a><a href="#c3" class ="close c3">Contacts ⇑</a></li>
	   <li class ="target"><a class ="down" href="#t4">Store Location ⇓</a><a href="#c4" class ="close c4">Store Location ⇑</a></li>
	   <li><a href="#url">Privacy policy</a></li>
    </ul>
    <ul class ="sub s1">
	   <li><a href="#url">Digital SLR Cameras</a></li>
	   <li><a href="#url">Interchangeable Lenses</a></li>
	   <li><a href="#url">Flash Guns &amp; Accessories</a></li>
	   <li><a href="#url">Professional Tripods</a></li>
	   <li><a href="#url">Filters &amp; Lens Hoods</a></li>
    </ul>
    <ul class ="sub s2">
	   <li><a href="#url">Printing &amp; Framing</a></li>
	   <li><a href="#url">Photo Editing</a></li>
	   <li><a href="#url">Storage &amp; Backup</a></li>
    </ul>
    <ul class ="sub s3">
	   <li><a href="#url">Support</a></li>
	   <li><a href="#url">Sales</a></li>
	   <li><a href="#url">Buying</a></li>
	   <li><a href="#nurl">Photographers</a></li>
	   <li><a href="#url">Stockist</a></li>
	   <li><a href="#url">General</a></li>
    </ul>
    <ul class ="sub s4">
	   <li><a href="#url">South West Region</a></li>
	   <li><a href="#url">North East Region</a></li>
	   <li><a href="#url">Central Region</a></li>
    </ul>
</div>