/* The wrapper div should be wrapped around the page content and be at least 100% page height for the iPade, iPhone and iPod Touch */
html, body {padding:0; margin:0; height:100%;}
.wrapper {height:100%;}
/* ================================================================ 
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-droplist-touch-screen.html
Copyright (c) Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.nav {width:745px; height:36px; background:#444; position:relative; z-index:100; font-family:arial, sans-serif; margin:0 auto; border-top:5px solid #0099ff; border-bottom:1px solid #000; border-radius:0 0 10px 10px;
box-shadow:0 5px 10px rgba(0,0,0,0.5);}
.menu,
.menu ul {padding:0; margin:0; list-style:none;}
.menu {width:730px; border-top:1px solid #08a0ff; padding-left:15px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
-ms-touch-action: none;
}

.menu ul.sub {position:absolute; top:35px; background:#333; padding:0 0 0 10px; z-index:5; border-top:1px solid #999; opacity:0; border-radius:0 0 10px 10px;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-o-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform:scale(1,0);
-moz-transform:scale(1,0);
-o-transform:scale(1,0);
transform:scale3d(1,0,1);
-webkit-transition:0.75s;
-moz-transition:0.75s;
-o-transition:0.75s;
transition:0.75s;
}
.menu ul.sub1 {width:150px;}
.menu ul.sub2 {width:300px;}
.menu ul.sub3 {width:450px;}
.menu ul.sub h5 {padding:10px 0 5px 0; margin:0; color:#c60; font-size:12px; width:140px; line-height:20px;}

.menu li.top-li {float:left; position:relative; background:#444; z-index:50;}
.menu li.top-li a.top-a {display:block; float:left; line-height:35px; color:#ccc; padding:0 25px 0 10px; text-decoration:none; font-size:14px;}
.menu li.top-li b {display:block; width:100%; height:35px; background: url(trans.gif); position:relative; z-index:100;
-webkit-transition:0.75s;
-o-transition:0.75s;
-moz-transition:0.75s;
transition:0.75s;
}  

.menu li.top-li a.top-a:hover {background:#333; color:#fff; text-decoration:underline; position:relative; z-index:10;}
.menu li.top-li:hover > a.top-a {background:#333; color:#fff; text-decoration:underline; position:relative; z-index:10;}
.menu li.has-sub a.top-a:hover {height:36px; text-decoration:underline; position:relative; z-index:10;}
.menu li.has-sub:hover > a.top-a {height:36px; text-decoration:underline; position:relative; z-index:10;}

.menu ul li {width:150px; float:left;}
.menu ul li a {line-height:15px; color:#fff; background:#666; display:block; width:120px; margin-bottom:1px; padding:5px 10px; text-decoration:none; font-size:12px;}
.menu ul li a:hover {background:#ccc; color:#000;}
.menu ul li.bottomLine {width:100%; clear:left; padding:5px 10px 5px 0; background:#000; margin-left:-10px; margin-top:5px; border-top:1px solid #ffffff; border-radius:0 0 10px 10px;}
.menu ul li.bottomLine p {padding:0; margin:0; line-height:20px; font-size:12px; color:#0099ff; font-weight:bold; width:100%; padding-left:10px;}
.menu ul li.bottomLine a {display:inline; padding:0 3px; line-height:20px; background:none; color:#ccc; text-decoration:underline;}
.menu ul li.bottomLine a:hover {color:#fff; text-decoration:none;}

.menu li:hover {z-index:60;}
.menu li:hover > b {height:0;}
.menu li:hover ul.sub {opacity:1; box-shadow:0 5px 10px rgba(0,0,0,0.5);
-webkit-transform: scale(1,1);
-moz-transform: scale(1,1);
-o-transform: scale(1,1);
transform: scale3d(1,1,1);
}

.menu li ul {left:0;}
.menu li ul.left1 {left:auto; right:0;}
.menu li ul.left2 {left:-150px;}