#navigation {
	background: url(../images/nav_bg.gif) repeat-x;
	height: 27px;
	z-index: 100;
}

#navigation ul {
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
	z-index: 100;
}

#navigation ul li {
	position: relative;
	float: left;
	height: 27px;
	z-index: 100;
}

#navigation a {
	display: block;
	padding: 6px 35px 6px 15px;
	text-transform: uppercase;
	color: #000;
}

#navigation a.mainLink {
	height: 27px;
	line-height: 27px;
	font-size: 12px;
	font-weight: bold;
	color: #2b2b2b;
	border-right: 1px solid #aeaeae;
	text-align: center;
	padding: 0;
}

#navigation a.lastLink { border-right: 0 !important; }

#navigation a.lastLink.active { background: #000 !important; }

#navigation .subnav {
	position: absolute;
	z-index: 100;
	left: -999em;
	padding: 15px 32px 15px 15px;
	background: #000;
	color: #fff;
}

#navigation .subnav ul {padding-right: 50px; }

#navigation li.shapes .subnav ul {padding-right: 15px; }

#navigation .subnav li {
	float: none;
	margin: 0;
	height: auto !important;
}

#navigation .subnav a {
	display: inline;
	padding: 0;
	color: #fff;
	font-size: 10px;
}

#navigation ul.experiences li {
	background-position: 100% -100px;
	color: #fff;
}

#navigation ul.experiences a {
	padding: 6px 17px;
	border-left: 1px solid #cdcdcd;
	color: #fff;
}

ul.colors { padding-right: 15px !important; }

.viewAllProducts a, a.clearAll {
	color: #cd6601 !important;
	margin-left: 10px;
}

.menu a.mainLink {
	background: url(../images/arrow_black.png) no-repeat;
}

.mainLink.active {
	background-color: #000 !important;
	color: #fff !important;
	border-right: 1px solid #000 !important;
}

#navigation .subnav .active {
	color: #cd6601 !important;
}

.viewAllWrap {
	margin-bottom: 10px;
}

#subBreadcrumb {
	padding: 7px 5px;
	font-weight: bold;
	font-size: 11px !important;
	height: 20px;
	line-height: 20px;
	background: #000;
	text-transform: uppercase;
	padding: 5px 15px;
}

#subBreadcrumb label {
	color: #fff;
}

#subBreadcrumb select {
	text-transform: none;
	font-weight: normal;
}

#breadcrumb {
	padding: 7px 15px;
	font-weight: bold;
	font-size: 11px;
	overflow: auto;
}

#breadcrumb span {
	color: #fff;
	margin: 0 5px 0 0;
	text-transform: uppercase;
	float: left;
}

#breadcrumb ul {
	list-style: none;
}

#breadcrumb ul li {
	float: left;
	height: 20px;
	color: #fff;
}

#breadcrumb ul li a {
	color: #fff;
	text-transform: uppercase;
	font-size: 11px;
	margin-left: 5px;
}

#breadcrumb ul li div.color a {
	margin-left: 0;
}

.removeFacet {
	background: url(../images/global/buttons/x_black.gif) 100% 50% no-repeat;
	padding-right: 18px;
	color: #fff;
	text-transform: uppercase;
	margin-right: 10px;
	float: left;
	display: block;
}

.removeFacet:hover, .removeFacet:visited {
	color: #fff;
}

a.homeLink {
	background: url(../images/home_icon.png) 20px 3px no-repeat;
}

a.genderLink {
	background: url(../images/men_women_child_icon.png) 5px 1px no-repeat;
}

.shapes a span {
	display: block;
	width: 40px;
	height: 18px;
	float: left;
	margin-right: 5px;
}

.shapes .subnav li {
	margin-bottom: 5px !important;
	overflow: auto;
}

.colorWrap {
	float: left;
}

.gender a.mainLink { background-position: 105px 10px; }
.brands a.mainLink { background-position: 105px 10px; }
.shapes a.mainLink { background-position: 100px 10px; }
.frameColors a.mainLink { background-position: 125px 10px; }
.lensColors a.mainLink { background-position: 120px 10px; }

li.menu a.mainLink { width: 156px; }
li.polarized a.mainLink { width: 159px; }

#navigation .gender .subnav {width: 110px;}
#navigation .brands .subnav {width: 440px;}
#navigation .shapes .subnav {width: 250px;}
#navigation .frameColors .subnav {width: 205px;}
#navigation .lensColors .subnav {width: 110px;}

.goggle { background: url(../images/frames/goggle.jpg) no-repeat; }
.aviator { background: url(../images/frames/aviator.gif) no-repeat; }
.butterfly { background: url(../images/frames/butterfly.gif) no-repeat; }
.cat.eye { background: url(../images/frames/cateye.gif) no-repeat; }
.oval { background: url(../images/frames/oval.gif) no-repeat; }
.pillow { background: url(../images/frames/pillow.gif) no-repeat; }
.rectangle { background: url(../images/frames/rectangle.gif) no-repeat; }
.rimless { background: url(../images/frames/rimless.gif) no-repeat; }
.round { background: url(../images/frames/round.gif) no-repeat; }
.semirimless { background: url(../images/frames/semirimless.gif) no-repeat; }
.shield { background: url(../images/frames/shield.gif) no-repeat; }
.square { background: url(../images/frames/square.gif) no-repeat; }
.wrap { background: url(../images/frames/wrap.gif) no-repeat; height: 32px !important; }

li.color {
	background: url(../images/colors_rollover.gif) no-repeat 0 0;
}

a.color {
	display: block !important;
	height: 25px;
	line-height: 22px;
	padding-left: 35px !important;
}

a.color:hover, a.color.active {
	background: url(../images/colors/nav_color_on.gif) no-repeat 0 50%;
}

.color_black { background-position: -474px 2px !important; }
.color_ivory { background-position: -474px -22px !important; }
.color_yellow { background-position: -474px -46px !important; }
.color_gunmetal { background-position: -474px -70px !important; }
.color_brown { background-position: -474px -94px !important; }
.color_green { background-position: -474px -118px !important; }
.color_grey { background-position: -474px -142px !important; }
.color_tortoise { background-position: -474px -166px !important; }
.color_blue { background-position: -474px -190px !important; }
.color_silver { background-position: -474px -231px !important; }
.color_pink { background-position: -474px -254px !important; }
.color_purple { background-position: -474px -278px !important; }
.color_gold { background-position: -474px -302px !important; }
.color_red { background-position: -474px -326px !important; }
.color_patterned { background-position: -474px -350px !important; }
.color_white { background-position: -474px -374px !important; }
.color_orange { background-position: -474px -398px !important; }
.color_clear { background-position: -474px -422px !important; }

/*
#navigation .color_black.active, #navigation .color_black:hover { background-position: 0 1px !important; }
#navigation .color_ivory.active, #navigation .color_ivory:hover { background-position: 0 -23px !important; }
#navigation .color_yellow.active, #navigation .color_yellow:hover { background-position: 0 -47px !important; }
#navigation .color_gunmetal.active, #navigation .color_gunmetal:hover { background-position: 0 -71px !important; }
#navigation .color_brown.active, #navigation .color_brown:hover { background-position: 0 -94px !important; }
#navigation .color_green.active, #navigation .color_green:hover { background-position: 0 -118px !important; }
#navigation .color_grey.active, #navigation .color_grey:hover { background-position: 0 -142px !important; }
#navigation .color_tortoise.active, #navigation .color_tortoise:hover { background-position: 0 -167px !important; }
#navigation .color_blue.active, #navigation .color_blue:hover { background-position: 0 -191px !important; }
#navigation .color_silver.active, #navigation .color_silver:hover { background-position: 0 -231px !important; }
#navigation .color_pink.active, #navigation .color_pink:hover { background-position: 0 -255px !important; }
#navigation .color_purple.active, #navigation .color_purple:hover { background-position: 0 -279px !important; }
#navigation .color_gold.active, #navigation .color_gold:hover { background-position: 0 -303px !important; }
#navigation .color_red.active, #navigation .color_red:hover { background-position: 0 -326px !important; }
#navigation .color_patterned.active, #navigation .color_patterned:hover { background-position: 0 -350px !important; }
#navigation .color_white.active, #navigation .color_white:hover { background-position: 0 -374px !important; }
#navigation .color_orange.active, #navigation .color_orange:hover { background-position: 0 -399px !important; }
#navigation .color_clear.active, #navigation .color_clear:hover { background-position: 0 -423px !important; }
*/

/* start:hover states */

a:hover.homeLink {
	background: #000 url(../images/home_icon_white.png) 20px 3px no-repeat;
}

a:hover.genderLink, a.genderLink.imgHover, .active.genderLink {
	background: #000 url(../images/men_women_child_icon_white.png) 5px 1px no-repeat !important;
}

li.menu.navHover a.mainLink, a.mainLink.active {
	background-image: url(../images/global/arrow_white.png);
	color: #fff !important;
	border-right: 1px solid #000 !important;
}

#navigation li.navHover a.mainLink, #navigation li.navHover, #navigation a.mainLink:hover {
	background-color: #000 !important;
	color: #fff;
}

#navigation li.navHover .subnav {
	background-color: #000;
	background-position: 100% -50px;
	color: #fff;
}

#navigation li.navHover .subnav {left: 0;}
#navigation .subnav a:hover {color: #cd6601;}
#navigation .mainLink:hover {
	color: #fff !important;
}
/* end:hover states */