/* ============= */
/* = Kuro Menu = */
/* ============= */

/*
	Top level
	.kuro-menu {
	float:left;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 3001;
	width: auto;
	margin: 0; 
	border: 2px solid #929292;
	padding: 0;
	-moz-box-shadow: 2px 2px 2px #929292; /* Firefox 
	-webkit-box-shadow: 2px 2px 2px #929292; /* Safari, Chrome 
	box-shadow: 2px 2px 2px #929292; /* CSS3 
	background: #f3f3f3;
	font-size: 115%;
	list-style: none;
}
*/
.kuro-menu {
	float:left;
	position: relative;
	top: 0;
	right: 0;
	z-index: 3001;
	width: auto;
	margin: 0; 
	
	padding: 0;
	
	list-style: none;
}
.kuro-menu > li {
	float: left;
/*	position: relative;*/
	margin: 0 0 0 -1px;
	padding: 0 0 0 1px;
}
.kuro-menu > li > a {
	display: block;
	margin: 0 0 0 -1px;
	padding: 0px 10px;
	
	color: #000;
	text-decoration: none;
}
.kuro-menu > li > a:hover {
	background-color: #3C8DA2;
}
.kuro-menu > li.parent.hover > a, .kuro-menu > li.parent:hover > a, .kuro-menu > li.parent.current > a {
	color:#FFF;
	background-color: #3C8DA2;
	background-image: url(../images/bg-menu-top.gif);
	background-position: bottom center;
}
* html .kuro-menu ul {
	display: none;
}

/*
	Second level
*/
.kuro-menu li > ul, .kuro-menu.js li:hover > ul {
	display: none;
	padding: 14px 0;
	min-height: 448px; /* @menu-height */
}
.kuro-menu.js > li:hover {
	background: none;
} 
.kuro-menu > li:hover, .kuro-menu.js > li.hover {
	background: url("../images/menu_top.png") no-repeat scroll bottom center;
}
.kuro-menu li:hover > ul, .kuro-menu.js li.hover > ul {
	display: block;
}
.kuro-menu > li > ul {
	position: absolute;
	top: 30px;
	left:0px;
	width: 800px;
	background: #8ec6d5;
}
.kuro-menu ul:before, .kuro-menu ul ~ div.before {
	position: absolute;
	top: -1px;
	right: -1px;
	bottom: -1px;
	left: -1px;
	z-index: -1;
	display: block;
	border: 1px solid #e0e0e0;
	-moz-box-shadow: 5px 5px 5px #929292;
	-webkit-box-shadow: 5px 5px 5px #929292;
	box-shadow: 5px 5px 5px #929292;
	content: "";
}
.kuro-menu ul:after, .kuro-menu ul ~ div.after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 325px; /* @column-width - @column-border-width */
	content: "";
	display: block;
	width: 0;
	border-right: 1px solid #e0e0e0; /* @column-border-width */
}
.kuro-menu > li li {
	list-style: none outside none;
	width: 326px; /* @column-width */
}
.kuro-menu > li li > a {
	display: block;
	padding: 2px 22px;
	color: #555;
	font-size: 12px;
	line-height: 24px;
	text-decoration: none;
}
.kuro-menu > li li.parent > a {
	background: url(../images/bg-menu-sub.png) no-repeat right center;	

}
.kuro-menu > li li > a:hover, .kuro-menu > li li.parent:hover > a {
	background-color: #e0e0e0;
}
.kuro-menu > li li li.parent > a {
	background-image: none;
}


/*
	Subsequent levels
*/
.kuro-menu ul ul {
	position: absolute;
	top: 0;
	left: 326px; /* @column-width */
}

/*
	Pull quote
*/
.kuro-menu .pullquote:after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -1px;
	content: "";
	display: block;
	width: 0;
	border-left: 1px solid #e0e0e0;
}
.kuro-menu .pullquote {
	position: absolute;
	top: -999em;
	left: -999em;
	width: 282px; /* @column-width - padding */
	min-height: 448px; /* @menu-height */
	padding: 14px 22px;
	background: #8ec6d5;
}
.kuro-menu.js li:hover > .pullquote {
	top: -999em;
}
.kuro-menu li:hover > .pullquote, .kuro-menu.js li.hover > .pullquote {
	top: 0;
}
.kuro-menu ul .pullquote {
	z-index: 4;
	left: 652px; /* @column-width * (@columns - 2) */
}
.kuro-menu ul ul .pullquote {
	display:none;
	z-index: 5;
}

/* Quote content */
.kuro-menu .pullquote h2 {
	font-size: 16px;
	line-height: 18px;
	color: #E12027;
}
.kuro-menu .pullquote p {
	font-size: 14px;
	line-height: 18px;
}
