.menu ul{
	margin-left:6px;
}

.menu li{
	float:left;
}
.menu li a{
	 color:#FFF;
	 font-size:1em;
	 padding:25px 50px;
	 display: block;
	 text-align:center;
	 color:#FFF;
	 -webkit-transition: all 0.5s ease-in-out;
	 -moz-transition: all 0.5s ease-in-out;
	 -o-transition: all 0.5s ease-in-out;
	 transition: all 0.5s ease-in-out;
	 position:relative;
}
.menu li a:hover{
	background:#50597b;
	border-bottom:5px solid #11a8ab;
}
.menu li.active a{
	background:#50597b;
	border-bottom:5px solid #11a8ab;
}
.menu li i img{
	margin-bottom:-10px;
	margin-right:10px;
}
.menu li a span.messages{
	position:absolute;
	top:10px;
	right:20px;
	font-size:1em;
	color:#FFF;
	background:#e64c65;
	padding: 3px 0px 0px 0px;
	width: 25px;
	height: 22px;
	border-radius:0.8em;
	-webkit-border-radius:0.8em;
	-moz-border-radius:0.8em;
	-o-border-radius:0.8em;
}
.toggleMenu {
    display:  none;
    padding:10px 10px 5px 10px;
    border-radius:2em;
    -webkit-border-radius:2em;
    -moz-border-radius:2em;
    -o-border-radius:2em;
}
.toggleMenu:hover{
	background:#273d5b;
}
.nav:before,
.nav:after {
    content: " ";
    display: table;
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;
}
.nav > li > a {
    display: block;
}
@media screen and (max-width:800px) {



	.menu {
		float:left;
	    z-index: 1;
	}
	.menu {
		margin: 20px 0px 0px 0px;
	}

	.menu {
		margin: 20px 0px 0px 0px;
	}
    .active {
        display: none;
    }
    .menu li a{
    	text-align:left;
    }
    .nav {
     list-style: none;
     *zoom: 1;
     width:100%;
	 position: absolute;
	 left: 0;

	 top:95px;
	 border-radius: 5px;
	 -webkit-border-radius: 5px;
	 -moz-border-radius: 5px;
	 -o-border-radius: 5px;
    }

    .menu li a span.messages{
    	text-align:center;
    	top:15px;
    }
    .nav li ul{
    	width:100%;
    }
    .menu ul{
    	margin:0;
    }
    .nav > li.hover > ul {
        width:100%;
    }
    .nav > li {
        float: none;
        display:none;
    }
    .nav ul {
        display: none;
        width: 100%;
    }
   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
    }
    .nav li a{
    	border-bottom:5px solid rgba(39, 39, 39, 0);
    	border-top:1px solid #1F253D;
    }


 }

 @media screen and (max-width:1284px) {



 	.menu {
 		float:left;
 	    z-index: 1;
 	}
 	.menu {
 		margin: 20px 0px 0px 0px;
 	}

 	.menu {
 		margin: 20px 0px 0px 0px;
 	}
     .active {
         display: none;
     }
     .menu li a{
     	text-align:left;
     }
     .nav {
      list-style: none;
      *zoom: 1;
      width:100%;
 	 position: absolute;
 	 left: 0;

 	 top:95px;
 	 border-radius: 5px;
 	 -webkit-border-radius: 5px;
 	 -moz-border-radius: 5px;
 	 -o-border-radius: 5px;
     }

     .menu li a span.messages{
     	text-align:center;
     	top:15px;
     }
     .nav li ul{
     	width:100%;
     }
     .menu ul{
     	margin:0;
     }
     .nav > li.hover > ul {
         width:100%;
     }
     .nav > li {
         float: none;
         display:none;
     }
     .nav ul {
         display: none;
         width: 100%;
     }
    .nav > li.hover > ul , .nav li li.hover ul {
         position: static;
     }
     .nav li a{
     	border-bottom:5px solid rgba(39, 39, 39, 0);
     	border-top:1px solid #1F253D;
     }


  }
 @media all and (max-width: 1024px) {



 	 	.menu {
 	 		float:left;
 	 	    z-index: 1;
 	 	}
 	 	.menu {
 	 		margin: 20px 0px 0px 0px;
 	 	}

 	 	.menu {
 	 		margin: 20px 0px 0px 0px;
 	 	}
 	     .active {
 	         display: none;
 	     }
 	     .menu li a{
 	     	text-align:left;
 	     }
 	     .nav {
 	      list-style: none;
 	      *zoom: 1;
 	      width:100%;
 	 	 position: absolute;
 	 	 left: 0;

 	 	 top:95px;
 	 	 border-radius: 5px;
 	 	 -webkit-border-radius: 5px;
 	 	 -moz-border-radius: 5px;
 	 	 -o-border-radius: 5px;
 	     }

 	     .menu li a span.messages{
 	     	text-align:center;
 	     	top:15px;
 	     }
 	     .nav li ul{
 	     	width:100%;
 	     }
 	     .menu ul{
 	     	margin:0;
 	     }
 	     .nav > li.hover > ul {
 	         width:100%;
 	     }
 	     .nav > li {
 	         float: none;
 	         display:none;
 	     }
 	     .nav ul {
 	         display: none;
 	         width: 100%;
 	     }
 	    .nav > li.hover > ul , .nav li li.hover ul {
 	         position: static;
 	     }
 	     .nav li a{
 	     	border-bottom:5px solid rgba(39, 39, 39, 0);
 	     	border-top:1px solid #1F253D;
 	     }


 }