@charset "utf-8";
/* CSS Document */

/*START OF MENU*/
#menu {
	font-family:"Century Gothic", Arial, sans-serif;
	float:right;
	text-align:left;
	margin:158px 10px 0 0;
	padding:0px;
	position:relative;
	z-index:200;
}


#nav {padding:0; margin:0; list-style:none; height:20px; position:relative; z-index:200; font-family:"Century Gothic", Arial, sans-serif; width:800px; }

#nav li.top {display:block; float:left; cursor:pointer;}

#nav li.topdropdown {display:block; float:left; cursor:default;}
#nav li a.topdropdown{display:block; float:left; height:20px; width:150px; text-decoration:none; padding:0; cursor:default; }

#nav li a {display:block; float:left; height:20px; width:150px; text-decoration:none; padding:0; cursor:pointer; }

#nav li a b {margin-left:-9999px; cursor:pointer;}


#nav li a.home {background:url(../images/home.gif); background-repeat:no-repeat; width:70px;}
#nav li a.about {background:url(../images/about.gif); background-repeat:no-repeat; width:124px; cursor:default;  }
#nav li a.gallery { background:url(../images/gallery.gif); background-repeat:no-repeat; width:83px;}
#nav li a.projects { background:url(../images/projects.gif); background-repeat:no-repeat; width:109px; cursor:default;}
#nav li a.bethechange { background:url(../images/bethechange.gif); background-repeat:no-repeat; width:173px; cursor:default;}
#nav li a.media { background:url(../images/media.gif); background-repeat:no-repeat; width:81px;}
#nav li a.shop { background:url(../images/shop.gif); background-repeat:no-repeat; width:63px;}
#nav li a.contact { background:url(../images/contact.gif); background-repeat:no-repeat; width:79px;}
#nav li a.hmm { background:url(../images/hmm-nav.gif); background-repeat:no-repeat; width:90px;}

#nav li:hover a,
#nav a:hover {background-position: 0 -30px; }


#nav table {position:absolute; top:0; left:0; border-collapse:collapse; padding:0; width:0; height:0; margin:-1px;}

#nav .sub {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none; }

#nav li:hover {position:relative; z-index:200;}
#nav a:hover {position:relative; white-space:normal; z-index:200;}

#nav :hover ul.sub
	{
	left:0; top:20px; width:152px; height:auto; z-index:300;
}

#nav :hover ul.sub li
{top:11px; padding-left:5px;display:block; height:auto; position:relative; float:left; width:140px; font-weight:normal; 
 background-image:url(../images/dropBG.png);  }
 
#nav :hover ul.sub li a
{left:0; top:0; display:block; height:auto; width:auto; text-decoration:none; padding:0;color:#02A3AF; font-family:"Century Gothic", Arial, sans-serif; font-size:15.5px; font-weight:normal; cursor:pointer; }


#nav :hover ul li a.drops {left:0; top:0; display:block; height:auto; width:auto; text-decoration:none; padding:0; color:#02A3AF; font-family:"Century Gothic", Arial, sans-serif; font-size:15.5px; font-weight:normal;}

#nav :hover ul.sub li a:hover 
{left:0; top:0; display:block; height:auto; width:auto; text-decoration:none; padding:0; color:#000; font-family:"Century Gothic", Arial, sans-serif; font-size:15.5px; font-weight:normal;}