* {	
	margin:0;
	padding:0;
	list-style:none;
  box-sizing: border-box;
}

:before, :after {
  content: '';
  display: block;
  position: absolute;
  box-sizing: border-box;
}
body {
  display: flex;
  font: 15px/1 Lato, sans-serif;
}
nav {
  width: 200px;
  background: #030;
  position:fixed;
  height:100%;
}
nav ul a {
  position: relative;
  display: block;
  padding: 15px 15px 17px 50px;
  color: #fff;
  border-bottom: 1px solid #FFF;
  text-decoration:none;
}
nav ul a:hover, {
  background: #53779b;
}
nav ul li:hover{
	background-color:#060;
}

nav ul a:before {
  font: normal 16px FontAwesome;
  top: 15px;
  left: 18px;
}
nav ul li ul {
  width:250px;
  margin-left:0;
  opacity:0;
  margin-top:-50px;
  position:absolute;
  visibility:hidden;
    -webkit-transition:0.3s;
   -moz-transition:0.3s;
   -ms-transition:0.3s;
   -o-transition:0.3s;
   transition:0.3s;
}
nav ul li:hover ul {
  background-color:#53779b;
  margin-left:200px;
  margin-top:-48px;
  position:absolute;	
  visibility:visible;
  opacity:1;
   -webkit-transition:0.3s;
   -moz-transition:0.3s;
   -ms-transition:0.3s;
   -o-transition:0.3s;
   transition:0.3s;
}
nav ul li ul li {
  background-color:#030;
  list-style:none;
}
.logo{
	padding-top:20px;
	width:200px;
	text-align:center;
}
.logo img{
	width:180px;
	height:126px;
}
nav ul li ul li:hover {
  width:250px;
  background-color:#53779b;
}
nav ul li ul a {
  display: block;
  text-align:center;
  color: #fff;
  padding: 15px 15px 17px 0px;
  border-bottom: 1px solid #fff;
}
nav ul li ul a:hover {
  position: relative;
  display: block;
  background-color:#060;
  color: #fff;
}