/* Define the body style */
body {
    font-family: 'Roboto';
    font-size:12px;
    margin-top:0px;
}

/* We remove the margin, padding, and list style of UL and LI components */
#menuwrapper ul, #menuwrapper ul li{
	margin:0;
	padding:0;
	list-style:none;
}

#menuwrapper{
	left:0;
	top:0;
	bottom:0;
}

#sidemenu{
	background: white none repeat scroll 0 0;
	width:140px;
  	height:741px;
  	position: fixed;
 
}

#menu_ir{
	width:auto;
}

/* We apply background color and border bottom white and width to 150px */
#menuwrapper ul li{
    background-color:white;
    width:140px;
    cursor:pointer;
    padding-bottom:10px;
  
}

/* We apply the background hover color when user hover the mouse over of the li component */
#menuwrapper ul li:hover{

}

/* We apply the link style */
#menuwrapper ul li a{
	padding-top:10px;
	color:#555555;
	display:inline-block;
	text-decoration:none;
}

#menuwrapper ul li a.selected{
/*  color:#ddd;    */
}
#menuwrapper ul li a:hover{/*
	color:#3F68DE;
    transition:none;
    -o-transition:none;
    -webkit-transition:none;
    -moz-transition:none;
}

#menuwrapper ul li a:hover:after {
    content: "  ";
    display: inline-block;
    border-bottom: 0.8em solid transparent;
    border-left: 0.8em solid transparent;
    border-right: 0.8em solid #3F68DE;
    border-top: 0.8em solid transparent;
    height: 0px;
    margin-top: -2px;
    position: absolute;
    left: 100px;
    width: 1px;
	border-right: 0.8em solid transparent;
 */
}

#menuwrapper ul li ul li a:hover {
  color:white;
}

#menuwrapper ul li ul li a:hover:after {
    content: "  ";
    display: inline-block;
    border-bottom: 0.8em solid transparent;
    border-left: 0.8em solid transparent;
    border-right: 0.8em solid #3F68DE;
    border-top: 0.8em solid transparent;
    height: 0px;
    margin-top: -2px;
    position: absolute;
    left: 142px;
    width: 1px;
	border-right: 0.8em solid transparent;
    transition:none;
    -o-transition:none;
    -webkit-transition:none;
    -moz-transition:none;
}

#menuwrapper ul li a.noflyout:hover:after {
	border-right: 0.8em solid transparent;
    transition:none;
    -o-transition:none;
    -webkit-transition:none;
    -moz-transition:none;
}
/**** SECOND LEVEL MENU ****/
/* We make the position to absolute for flyout menu and hidden the ul until the user hover the parent li item */
#menuwrapper ul li ul{
    position:absolute;
    display:block;
    visibility:hidden;
    height:900px !important;
    background-color:transaprent;
    width:0px;
    color:#fff;
    padding-top:82px;
    
}
#menuwrapper ul li ul li ul{
    position:absolute;
    display:none !important;
    visibility:hidden;
    height:900px !important;
    background-color:transaprent;
    width:0px;
    color:white !important;
    padding-top:80px;
    
}

#menuwrapper ul li ul li{
    color:#fff;
    background:transparent;
    padding-left:20px;
    width : 200px;
  
}
/* When user has hovered the li item, we show the ul list by applying display:block, note: 150px is the individual menu width.  */


#menuwrapper ul li ul li ul li{
    color:white !important;
    background:transparent;
    padding-left:20px;
  
  
}
/* When user has hovered the li item, we show the ul list by applying display:block, note: 150px is the individual menu width.  */

#menuwrapper ul li ul{
    left:140px;
    top:-5px;
    display:block;
    visibility:visible;
    width:200px;
    background-color:#00a69c;
    transition:background-color 0.5s ease;
    -o-transition:background-color 0.5s ease;
    -webkit-transition:background-color 0.5s ease;
    -moz-transition:background-color 0.5s ease;
    
}

#menuwrapper ul li ul li:hover ul{
    left:200px;
    top:0px;
    display:block !important;
    visibility:visible;
    width:200px;
    background-color:#1bc3b8;
    transition:background-color 0.5s ease;
    -o-transition:background-color 0.5s ease;
    -webkit-transition:background-color 0.5s ease;
    -moz-transition:background-color 0.5s ease;
    
}

ul li ul li a:hover::before{
	color: white;
	content: "> ";
}


.shadow {
  width: 8px;
  height: 1000px;
  position: fixed;
  top: 0;
  left: 150px;
  background: url(../images/shadow1.png) repeat-y;
  background-position: left;
  overflow: hidden;
  display: inline;
  float: left;
  z-index: 30;
}