nav { float:left; position:relative; width:calc(100% - 300px); height:220px; text-align:center; z-index:3000; }
nav .wrapper {
	position:relative; 
	height:100%;
	font-size:15px; 
	text-align:left;
	margin:0;
	box-sizing:border-box;
	list-style-type:none;
	display:flex;
	flex-direction:row;
	justify-content:space-evenly;
	align-items:center;
    align-content:baseline;
}

/* BASIK */
nav .wrapper li { position:relative; padding:0 10px; box-sizing:border-box; list-style-type:none; text-align:center; }
nav .wrapper li.inter { padding:0; color:#FFF; }
/* PREMIER RANG */
nav .wrapper li a, nav .wrapper ul li a:visited { position:relative; font-family: 'Playfair Display', sans-serif; margin: 0 10px; padding:5px 0; display:block; text-decoration:none; color: #FFF; font-size: 17px; font-weight:200; line-height:20px; }
nav .wrapper li ul { position:absolute; left:-2px; width:300px; margin:0; padding:0; background:#FFF; border-width: 0 0 2px 0; border-style: solid; border-color:#FFF;overflow:hidden; display:none; }
nav .wrapper li ul li a { line-height:20px; padding:5px 10px; box-sizing:border-box; color:#FFF; text-align:left; transition:all 0.2s; }
nav .wrapper li ul li { margin: 0; padding: 0; }
nav .wrapper li ul li a { margin: 0; background:#bb1620; }
nav .wrapper li:hover ul { display:block; }

/* rollover */
nav .wrapper li:hover a.title, nav .wrapper li a.title.on { color: #FFF; }
nav .wrapper li:hover a.title:before, nav .wrapper li a.title.on:before { position:absolute; content:url('../interface/puce_before.png'); top:-20px; left:50%; }
nav .wrapper li:hover a.title:after, nav .wrapper li a.title.on:after { position:absolute; content:url('../interface/puce_after.png'); bottom:-20px; right:50%; }
/* SECOND RANG */
nav .wrapper li:hover ul li:hover a.hide:hover, nav .wrapper li:hover ul li:hover a.on { background:#FFF; color: #bb1620; } 

nav .wrapper li.article.zone_info {
    padding: 0 8px 8px;
    background: #bb1620;
    color: #FFF;
}
nav .wrapper li.article.zone_info a,
nav .wrapper li.article.zone_info a:link,
nav .wrapper li.article.zone_info a:visited,
nav .wrapper li.article.zone_info a:hover { color: #FFF; text-decoration:none; }

/* RESP */
nav.resp { position:fixed; top:70px; left:-100%; width:100%; height:calc(100vh - 70px); background:rgba(255,255,255,0.95); overflow-y:scroll; z-index:3000; } 
nav.resp .wrapper { flex-direction:column; padding: 30px 0 0 0; margin: 0 30px 0 30px; align-items:stretch; justify-content:start; list-style-type:none; overflow-y:scroll; }

/* BASIK */
nav.resp .wrapper li { position:relative; padding:0 0px; box-sizing:border-box; list-style-type:none; }
nav.resp .wrapper li.inter { display:none; }
/* PREMIER RANG */
nav.resp .wrapper li a, nav.resp .wrapper ul li a:visited { font-family: 'Playfair Display', sans-serif; margin: 0; display:block; text-decoration:none; color: #57274b; text-align:left; font-size: 15px; font-weight:500; line-height:34px;  }
nav.resp .wrapper li ul { position:initial; width:100%; margin:0; display:none; }
nav.resp .wrapper li ul li a { line-height:20px; background:transparent; padding:5px 15px; box-sizing:border-box; transition:all 0.2s; }
nav.resp .wrapper li:hover ul { display:block; }

/* rollover */
nav.resp .wrapper li:hover a.title, nav.resp .wrapper li a.title.on { color:#a92152; }	
nav.resp .wrapper li:hover a.title:before, nav.resp .wrapper li a.title.on:before,
nav.resp .wrapper li:hover a.title:after, nav.resp .wrapper li a.title.on:after { display:none; }
/* SECOND RANG */
nav.resp .wrapper li:hover ul li:hover a.hide:hover, nav.resp .wrapper li:hover ul li:hover a.on { background:#a92152; color: #FFF; } 


.hamburger { 
    position:fixed; top:10px; left:10px; color:#FFF; 
    background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 80%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 80%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 80%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    z-index:3002; display:none;
}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after,
.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner::before, .hamburger.is-active .hamburger-inner::after
{ background:#FFF; }