body > .site-nav {
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 3;
}

@media screen and (min-width: 37.5em) {
	body > .site-nav {
		position: fixed;
		bottom: 0;
		overflow: auto;
		width: 17.875rem;
	}
}


/* nav */

.site-nav {
	padding-top: 5rem;
	padding-left: 2.125rem;
	padding-right: 2.125rem;
	padding-bottom: 4.375rem;
	color: #525252;
	background-color: white;
	box-shadow: -5px 0 10px transparent;

	-webkit-transform: translate3d(0, -100%, 0);
	    -ms-transform: translate(0, -100%);
	        transform: translate3d(0, -100%, 0);

	transition:
		-webkit-transform 400ms ease-out,
		box-shadow 400ms ease-out;

	transition:
		transform 400ms ease-out,
		box-shadow 400ms ease-out;
}


.site-nav.active {
	box-shadow: -5px 0 10px rgba(57, 57, 57, 0.3333);

	-webkit-transform: translate3d(0, 0, 0);
	    -ms-transform: translate(0, 0);
	        transform: translate3d(0, 0, 0);

	transition-duration: 200ms;
}

.site-nav a {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

@media screen and (min-width: 37.5em) {
	.site-nav {
		-webkit-transform: translate3d(100%, 0, 0);
		    -ms-transform: translate(100%, 0);
		        transform: translate3d(100%, 0, 0);
	}
}


/* index */

.nav-index {
	padding-top: 0.9375rem;
	padding-bottom: 0.9375rem;
}

nav > #node-l1_2, nav > #node-business,
nav > #node-a-louer {
	border-top: 2px solid currentColor;
}
nav > #node-a-louer {padding-bottom: 0;}
nav > #node-a-louer ~ .nav-index,
nav > #node-flon-aujourdhui{
	padding-top: 0;
	padding-bottom: 0;
}


nav > #node-giftcard {
	padding-top: 0;
	margin-top: -12px;
}
nav > #node-business {
	padding-bottom: 0;
}
nav > #node-flon-demain {
	padding-top: 0;
}

.nav-index + .nav-index {
	margin-top: 0;
}

.nav-index > li {
	margin-top: 0;
}

.nav-index > li > .button {
	display: block;
}

.nav-index > li > .nav-index {
	padding-bottom: 0.25rem;
}


.nav-index > li > .nav-index > li > .button,
#node-business > .level-2 > .button,
#node-flon-aujourdhui > .level-2 > .button
 {
	padding-left: 1.25rem;
	padding-top: 0.1875rem;
	padding-bottom: 0.1875rem;
}

.nav-button + .nav-index {
	margin-top: -0.25rem;
}




.social-index > li {
	display: block;
}

.social-index > li > a > .thumb {
	display: inline-block;
	vertical-align: -0.6875rem;
}

.social-index > li + li {
	margin-top: 0;
}

.lang-button + span {
	font-size: 0.9375rem;
	line-height: 1rem;
	padding: 0.4375rem 0.25rem;
	display: inline-block;
	text-transform: uppercase;
	vertical-align: top;

}


/* hide "closed" level 2 nodes */
.level-2 > .nav-index {display:none;}
#node-business .level-2 {display:none;}
#node-flon-aujourdhui .level-2 {display:none;}

.level-2.ancestors > .nav-index,
.level-2.selected > .nav-index,
#node-business .ancestors ~ .level-2,
#node-business .on ~ .level-2,

#node-flon-aujourdhui .ancestors ~ .level-2,
#node-flon-aujourdhui .on ~ .level-2

{display:block;}




/* button */

.nav-button {
	font-size: 0.9375rem;
	line-height: 1rem;
	padding-top: 0.4375rem;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0.4375rem;
	color: #666;
	text-transform: uppercase;
}

.nav-button.on,
.nav-button:hover {
	color: #262626;
}

/* hide the first level1 in the first nav index because wtf */
.site-nav > .nav-index > .level-1.node-1 {
	display: none;
}