/* for this demo only */
.dropMenu {margin:10px auto 100px auto;}
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/cssplay-touch-dropline.html
Copyright (c) Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.dropMenu {width:750px; position:relative; text-align:center; font-family:'Ubuntu Condensed', sans-serif; font-size:15px; height:70px; background-color:#640; border:1px solid #973; overflow:hidden;
background-image:-webkit-linear-gradient(top, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
background-image:-moz-linear-gradient(top, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
background-image:-ms-linear-gradient(top, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
background-image:-o-linear-gradient(top, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
background-image:linear-gradient(to bottom, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
-webkit-box-shadow:inset -1px 0 1px rgba(255, 255, 255, 0.4), inset 1px 0 1px rgba(255, 255, 255, 0.4), inset 0 0 10px rgba(255, 255, 255, 0.4);
-moz-box-shadow:inset -1px 0 1px rgba(255, 255, 255, 0.4), inset 1px 0 1px rgba(255, 255, 255, 0.4), inset 0 0 10px rgba(255, 255, 255, 0.4);
box-shadow: inset -1px 0 1px rgba(255, 255, 255, 0.4), inset 1px 0 1px rgba(255, 255, 255, 0.4), inset 0 0 10px rgba(255, 255, 255, 0.4);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
-ms-touch-action: none;
}
.dropMenu div {width:750px; position:absolute; left:0; text-align:center; height:35px; padding:12px 0 0 0; z-index:100; background:url(trans.gif); top:82px;
-webkit-transition: 0.25s;
-moz-transition: 0.25s;
-o-transition: 0.25s;
transition: 0.25s;
}

.dropMenu ul {padding:0; margin:0; list-style:none;}
.dropMenu ul li {display:inline-block; line-height:25px;}
.dropMenu ul li {*display:inline;}
.dropMenu ul li a {display:inline-block; line-height:35px; height:25px; text-decoration:none; color:#fff; padding:0 20px; text-shadow: 0px -1px 1px #320;}
.dropMenu ul ul li {line-height:30px;}
.dropMenu ul ul li a {line-height:30px; font-size:14px; text-shadow: 0px 1px 1px #320;}

.dropMenu ul li a:hover {white-space:nowrap; color:#fff;}
.dropMenu ul li:hover > a {color:#fff; text-decoration:underline;}
.dropMenu ul li:hover div {top:23px;
-webkit-transition: 0s 0.15s;
-moz-transition: 0s 0.15s;
-o-transition: 0s 0.15s;
transition: 0s 0.15s;
}

.dropMenu ul li b {display:block; width:100%; height:35px; position:relative; z-index:10; margin-top:-35px; background: url(trans.gif);
-webkit-transition:0.75s;
-moz-transition:0.75s;
-o-transition:0.75s;
transition:0.75s;
}
.dropMenu ul li b {*display:none;}
.dropMenu ul li:hover > b {width:0;}