#menu {position:relative; z-index:100;}

#menu ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left; }
#menu ul {}

#menu li {margin:0; padding:0; list-style:none;}
#menu li {display:inline;}

#menu ul ul {position:absolute; left:0; display:none; z-index:0;}
#menu ul ul ul {left:100%; top:auto; }

#menu > ul {margin:0 auto;}
#menu > ul > li {display:block; position:relative;}

#menu ul {}
#menu ul ul {}
#menu ul ul ul {}
#menu ul ul ul ul {}

#menu a {display:block; padding:0 20px 0 10px;}
/* Top level - Make Inline*/
#menu > ul > li > a {}

/* Submenu */
#menu ul li:hover > ul {display:block;}

/* #menu li.left ul a {text-align:right; padding:0 10px 0 20px;} */

/* Hover for all menu items */
#menu li:hover > a {}

/* for IE7 to fix a bug with using display:none; to hide the sub menus. Delete if not concerned with IE7 support */
#menu ul {*display:inline;}

#menu ul ul,
#menu ul ul ul {*left:-9999px; *right:auto; *display:block;}

#menu ul li:hover {*direction:ltr;}

#menu ul li:hover > ul {*left:0;}
#menu ul ul li:hover > ul {*left:100%;}
#menu ul ul ul li:hover > ul {*left:100%;}

/* Safari Bug */
#menu ul li ul {
    	width: 180px;
    	white-space: normal;
    }

.tinynav { display: none }

@media (max-width: 767px) {
   /* #menu ul { display: none; }*/

    .nav { display: none; }

    .tinynav { display: block; width: 100%; border-radius: 0px; }
}

@media (min-width: 768px) {
	#menu ul {
 		display: inline-block;
 		width: 100%;
 	}

	.tinynav { display: none; }

    .nav { display: inline; }
}