Cacher is the code snippet organizer for pro developers

<header id="main-nav">
			<nav>
				<div id="main-nav-content">
					<div id="logo">
						<img src="logo/logo.png" alt="logo webagency" >
					</div>
					<ul>
						<li class="menu"><a href="#contact">Contact</a></li>
						<li class="menu"><a href="#portfolio">Portfolio</a></li>
						<li class="menu"><a href="#services">Services</a></li>
						<li class="menu"><a href="#accueil">Accueil</a></li>
					</ul>
				</div>

				<!--  menu mobile-->
				<div id="menu-mobile">
					<div id="volet_clos">
						<div id="volet">
							<a href="#accueil">Accueil</a>
							<a href="#services">Services</a>
							<a href="#portfolio">Portfolio</a>	
							<a href="#contact">Contact</a>													
						
							<a href="#volet" class="ouvrir">Menu</a>
							<a href="#volet_clos" class="fermer">Fermer</a>	
						</div>
					</div>
				</div>
			</nav>		
		</header>
		
		/*---------------------------*/
/*        MAIN NAV          */
/*---------------------------*/

#main-nav{
	width: 100%;
	height: 100px;
	line-height: 100px;
	background-color: white;
	position: fixed;
	z-index:999;
}

#main-nav nav{	
	top:0;
}

#logo{
	float: left;
}

#logo img{
	vertical-align: middle;
}

#main-nav ul{
	list-style-type: none;
	height: 100px;
	margin:0px;
	padding: 0px;
}

.menu{
	float: right;
	vertical-align: top;
	margin-left: 30px;
}



#main-nav a{
	text-decoration: none;
	padding-top: 20px;
	color: #5D5D5D;
	text-align: center;
}

#main-nav a:hover{
	color: black;
	border-top: solid 3px #5AAAD2;
}

#menu-mobile{
	visibility: hidden;
}