
/*** ESSENTIAL STYLES ***/
.cs-vertical-menu,
.cs-vertical-menu ul,
.cs-vertical-menu li,
.cs-vertical-menu a,
.cs-vertical-menu span {
	margin:			0;
	padding:		0;
    border:         0;
    outline:        none;
}
.cs-vertical-menu {
	line-height:	1.0;
    height:         1%;
    background:		url('../images/arrow-up.png') -200% -200% no-repeat ; /*preloading image*/
}

.cs-vertical-menu li {
	position:		relative;
    list-style:		none
}
.cs-vertical-menu a {
	display:		block;
	position:		relative;
}

.cs-vertical-menu span {
    text-transform: uppercase;
}

/*** DEMO SKIN ***/
.cs-vertical-menu a {
	border-top:		1px solid #CFDEFF;
	padding: 		.75em 1em;
	text-decoration:none;
}

.cs-vertical-menu li {
	background:		#BDD2FF;
    border: 0;
}

.cs-vertical-menu.cs-noscript li:hover > ul {
    display:block;
}

.cs-vertical-menu a:hover, 
.cs-vertical-menu a:active,
.cs-vertical-menu li.current > a {
	background:		#CFDEFF;
	outline:		0;
    word-break:break-word;
}

/*** arrows **/
.cs-vertical-menu li.with-ul > a  {
	padding-right: 	2.25em;
}
.cs-sub-expander {
	position:		absolute;
	display:		block;
	top:			0;
	right:			0;
	width:			2.25em;
	height:			100%;
	text-indent: 	-999em;
	cursor:         pointer;
	overflow:		hidden;
	background:		url('../images/arrow-down.png') 50% 50% no-repeat;
}
li.expanded > a > .cs-sub-expander,
.cs-noscript li:hover > a > .cs-sub-expander { 
	background:		url('../images/arrow-up.png') 50% 50% no-repeat ;
}

.cs-vertical-menu ul { 
	display: none;
    height:  1%;
    position: relative !important;
}

.cs-vertical-menu li.expanded > ul { 
	display: block;
}