/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
	z-index:10
}

#home-page .sf-menu  {
z-index:100
}


.sf-menu {
	line-height:	15px;
	width:670px; position:relative; top:24px; left:25px;  _top:3px
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em;  /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			47px; /* match top ul list item height */ _top:	63px;
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em; 
}
.sf-menu a {
	
	padding: 		.6em 1em;
	text-decoration:none; height:47px
}

.sf-menu li ul a {
	height:18px
}

.sf-menu a:link, .sf-menu a:visited {
	color:			#feefc3; font-weight:bold
}
.sf-menu a:hover, .sf-menu a:active {
	color:			#fff; font-weight:bold
}
.sf-menu li {
	 	/* BACKGROUND OF MAIN NAV LI LINKS */
}
.sf-menu li li {
	 	/* BACKGROUND OF FIRST LEVEL LI DROP LINKS */
}
.sf-menu li li li {
	 	/* BACKGROUND OF SECOND LEVEL LI DROP LINKS */
		
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
		/* BACKGROUND OF HOVER LI DROP LINKS */
	outline:		0;
}




/* Main Nav Rollovers -- image replacement
-----------------------------------------------------------------------------
-----------------------------------------------------------------------------*/

#web-design-link,
#graphic-design-link,
#marketing-link,
#seo-link,
#about-link,
#contact-link
{height:47px;  text-indent:-9999px; margin-right:10px }


#web-design-link  {background:url(../images/nav-sprite.png) no-repeat; width:107px}
#web-design-link:hover {background:url(../images/nav-sprite.png) no-repeat 0 -47px; width:107px}

#graphic-design-link  {background:url(../images/nav-sprite.png) no-repeat -107px 0; width:128px}
#graphic-design-link:hover {background:url(../images/nav-sprite.png) no-repeat -107px -47px; width:128px}

#marketing-link  {background:url(../images/nav-sprite.png) no-repeat -235px 0; width:98px}
#marketing-link:hover {background:url(../images/nav-sprite.png) no-repeat -235px -47px; width:98px}

#seo-link {background:url(../images/nav-sprite.png) no-repeat -333px 0; width:56px}
#seo-link:hover {background:url(../images/nav-sprite.png) no-repeat -333px -47px; width:56px}

#about-link  {background:url(../images/nav-sprite.png) no-repeat -389px 0; width:124px}
#about-link:hover {background:url(../images/nav-sprite.png) no-repeat -389px -47px; width:124px}

#contact-link {background:url(../images/nav-sprite.png) no-repeat -513px 0; width:83px}
#contact-link:hover {background:url(../images/nav-sprite.png) no-repeat -513px -47px; width:83px}









.drop {text-indent:6px; border:6px solid #d6bf80; background:#868686}
.drop2 {text-indent:6px; border:2px solid #d6bf80; background:#767676}


/* Main Nav Current Page styles
-----------------------------------------------------------------------------*/
#browser-page #web-design-link,
#website-features-page #web-design-link,
#web-maint-page #web-design-link,
#flash-page #web-design-link,
#iphone-page #web-design-link
{background:url(../images/nav-sprite.png) no-repeat 0 -47px; width:107px}

#contact-page #contact-link,
#contact-form-page #contact-link,
#directions-page #contact-link ,
#news-page #contact-link,
#payment-page #contact-link
{background:url(../images/nav-sprite.png) no-repeat -513px -47px; width:83px}

#history-page #about-link,
#team-page #about-link,
#why-page #about-link,
#testimonials-page #about-link,
#clients-page #about-link
{background:url(../images/nav-sprite.png) no-repeat -389px -47px; width:124px}

#gd-page #graphic-design-link,
#gd-port-page-a #graphic-design-link,
#gd-port-page-bb #graphic-design-link,
#gd-port-page-c #graphic-design-link,
#gd-port-page-d #graphic-design-link,
#illustration-page #graphic-design-link,
#gd-port-page-f #graphic-design-link
{background:url(../images/nav-sprite.png) no-repeat -107px -47px; width:128px}

#marketing-page #marketing-link,
#ppc-page #marketing-link
{background:url(../images/nav-sprite.png) no-repeat -235px -47px; width:98px}

#web-services-page #web-design-link,
#web-plan-page #web-design-link,
#web-port-page #web-design-link,
#web-features-page #web-design-link,
#wquote-page #web-design-link
{background:url(../images/nav-sprite.png) no-repeat 0 -47px; width:107px}

#seo-an-page #seo-link,
#seo-faq-page #seo-link,
#seo-page #seo-link
{background:url(../images/nav-sprite.png) no-repeat -333px -47px; width:56px}


/* Sub Nav Current Page styles
-----------------------------------------------------------------------------*/
#web-maint-page .waa, #web-maint-page .waa:hover, 
#web-plan-page .wg, #web-plan-page .wg:hover, 
#web-services-page .wa, #web-services-page .wa:hover, 
#web-port-page .wb, #web-port-page .wb:hover, 
#website-features-page .wc, #web-features-page .wc:hover,
#wquote-page .wd, #wquote-page .wd:hover,
#browser-page .we, #browser-page .we:hover,
#iphone-page .wf, #iphone-page .wf:hover 
{background:url(../images/subNav/backNew.png) no-repeat; cursor:default}

#contact-page .ca, #contact-page .ca:hover,
#contact-form-page .caa, #contact-form-page .caa:hover,
#directions-page .cb, #directions-page .cb:hover,
#news-page .cc, #news-page .cc:hover,
#payment-page .cd, #payment-page .cd:hover
{background:url(../images/subNav/backNew.png) no-repeat; cursor:default}

#history-page .aa, #history-page .aa:hover,
#team-page .ab, #team-page .ab:hover,
#why-page .ac, #why-page .ac:hover,
#testimonials-page .ad, #testimonials-page .ad:hover,
#clients-page .ae, #clients-page .ae:hover
{background:url(../images/subNav/backNew.png) no-repeat; cursor:default}

#gd-page .ga, #gd-page .ga:hover,
#gd-port-page-a .gb, #gd-port-page-a .gb:hover,
#gd-port-page-bb .gb, #gd-port-page-bb .gb:hover,
#gd-port-page-c .gb, #gd-port-page-c .gb:hover,
#gd-port-page-d .gb, #gd-port-page-d .gb:hover,
#illustration-page .gb, #illustration-page .gb:hover,
#gd-port-page-f .gb, #gd-port-page-f .gb:hover
{background:url(../images/subNav/backNew.png) no-repeat; cursor:default}

#marketing-page .ma, #marketing-page .ma:hover,
#ppc-page .mb, #ppc-page .mb:hover
{background:url(../images/subNav/backNew.png) no-repeat; cursor:default}

#seo-page .sa, #seo-page .sa:hover,
#seo-faq-page .sb, #seo-faq-page .sb:hover,
#seo-an-page .sc, #seo-an-page .sc:hover
{background:url(../images/subNav/backNew.png) no-repeat; cursor:default}

/* Graphic design nav above portfolio
-----------------------------------------------------------------------------*/
#gd-port-page-a #gdSub .ga,
#gd-port-page-bb #gdSub .gbb,
#gd-port-page-c #gdSub .gc,
#gd-port-page-d #gdSub .gd,
#illustration-page #gdSub .ge,
#gd-port-page-f #gdSub .gf
{color: #333; text-decoration:underline}