
/***************************************************************\

        vertical menu 

\***************************************************************/

.sidenav  > ul {
	list-style: none;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	line-height: 1;
	text-align:left;
}

/* The container */
.sidenav  > ul {
	display: block;
	position: relative;
	width: 210px;
}

/* The list elements which contain the links */
.sidenav  > ul li {
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
	width: 210px;
    list-style: none;
}

/* General link styling */
.sidenav  > ul li a {
	/* Layout */
	display: block;
	position: relative;
	margin: 3px 0px;
	padding: 11px 20px;
	width: 15.9em;
  
	/* Typography */
	color:  #;
	text-decoration: none;		
	font-size: 13px;
	font-weight: 300;

	/* Background & effects */
	border-bottom:1px solid #;}

		
/* The hover state of the menu/submenu links */
.sidenav  > ul li>a:hover, 
.sidenav  > ul li:hover>a {
	color: #;
	text-shadow: 0 1px 0 rgba(0, 0, 0, .2);
	background: #;
	border-color: transparent;	
	border-bottom:1px solid #;}

		
.sidenav  > ul li>a:hover::before, 
.sidenav  > ul li:hover>a::before {
	border-left: 4px solid rgba(0, 0, 0, .25);
		}

/* THE SUBMENUS */
.sidenav  > ul ul {
	position: absolute;
	left: 188px;
	top: -9999px;
	padding-left: 5px;
	opacity: 0;
	/* The fade effect, created using an opacity transition */
	-webkit-transition: opacity .3s ease-in;
	-moz-transition: opacity .3s ease-in;
	-o-transition: opacity .3s ease-in;
	-ms-transition: opacity .3s ease-in;
}

/* Showing the submenu when the user is hovering the parent link */
.sidenav  > ul li:hover>ul {
	top: 0px;
	opacity: 1;
	background:#;
}
		
.sidenav  > ul ul li:last-child>a {
	border-bottom: 0;		
}
			
.sidenav  > ul li:first-child>a {			
	border-top: 1px solid #;
}

.sidenav  > ul ul li:first-child>a {			
	border-top:1px solid #;
}

/* The hover state of the menu/submenu links */
.sidenav  > ul li>a:hover, 
.sidenav  > ul li:hover>a {
	color: #;
	text-shadow: 0 1px 0 rgba(0, 0, 0, .2);
	background:#;		
}
		
/* set up the right arrows first */
.udm li > a:after {
	float:right;
	margin-right:0;
	margin-left:0px;
	content:'\25BA';
	font-size:80%;
}

/* set up the  arrow for top level items */
.udm > li > a:after {
	float:right;
	margin-right:0;
	margin-left:0px;
	content:'\25BA';
	font-size:70%;
}

/* clear the content if a is only child */
.udm li > a:only-child:after {
	margin-left:0;
	content:'';
}		
	
	