/* nav.css : styles de base pour une navigation responsive.
Attention : ne fonctionne pas toujours très bien sur les anciens navigateurs ou OS mobiles (par exemple Android 2.1) */


.header_menu ul li a {
	font-family: "UnitPro", helvetica, arial, sans-serif;
	color: #666;
}
.header_menu ul li a:hover {
	color: #333;
}

label[for^="toggle"],
[type="checkbox"] {
	cursor: pointer;
}
label[for^="toggle"] + [type="checkbox"] { display: none; }

#navigation{
}

#navigation ul {
	margin: 0;
	padding: 0;
}
#navigation li { display: inline; }
#navigation li a {
	display: inline-block;
	padding: 10px 1.7% 15px 1.7%;
	border: none;
	text-decoration: none;
	background: none;
	color: #322f6b;
	font-family: "UnitPro-Bold", helvetica, arial, sans-serif;
	font-size: 1.2em;
}
#navigation li a:hover,
#navigation li a:focus,
#navigation li.last.leaf a:hover,
#navigation li.last.leaf a:focus {
	-webkit-transition: color 0.3s linear;
	-moz-transition: color 0.3s linear;
	-o-transition: color 0.3s linear;
	-ms-transition: color 0.3s linear;
	transition: color 0.3s linear;
	background-color: #322f6b;
	border-radius: 5px 5px 0 0;
	color: #fff;
}
#navigation li a:active,
#navigation li a.active {
	background-color: #322f6b;
	color: #fff;
	border-radius: 5px 5px 0 0;
}

/*#navigation li.first {*/
	/*margin-left: 0;*/
/*}*/
/*#navigation li.first a {*/
	/*padding-left: 0;*/
/*}*/
/*#navigation li.first a:hover,*/
/*#navigation li.first a:active,*/
/*#navigation li.first a.active {*/
	/*background-color: #fff;*/
	/*background-position: 0 -35px;*/
/*}*/

@media (max-width: 640px) {
	/* unicode character for button */
	[data-icon]:before { content: attr(data-icon); }

	/* styling menu button */
	label[for^="toggle"] {
		position: relative;
		text-align:center;
		padding:9px;
		padding-bottom:13px;
		font-size: 2.8em;
		font-weight: bold;
		line-height: 0.4em;
		background-color: #444;
		color: #fff;

	}
	label[for^="toggle"]:hover{
		color: #322f6b;
		-webkit-transition: color 0.3s linear;
		-moz-transition: color 0.3s linear;
		-o-transition: color 0.3s linear;
		-ms-transition: color 0.3s linear;
		transition: color 0.3s linear;
	}

	/* handling click/tap with CSS3 target */
	#toggle-menu:checked + ul,
	#toggle-menu:checked + .block-menu ul {
		max-height: 54em !important; /* number of menu items * 6em */
	}

	/* styling navigation items */
	#navigation ul {
		max-height: 0;
		overflow: hidden;
		-webkit-transition: max-height .4s;
		-moz-transition: max-height .4s;
		-o-transition: max-height .4s;
		-ms-transition: max-height .4s;
		transition: max-height .4s;
	}
	#navigation li a {
		background-color: #fff;
		color: #322f6b;
		display: block;
		padding: .9em .6em;
		border: 0;
		border-top: 1px solid #aaa;
		font-size: 1.1em;
	}

	/*#navigation li.first a*/
	/*{*/
		/*background: 0;*/
		/*height: auto;*/
		/*width: auto;*/
		/*overflow: visible;*/
		/*padding: .9em .6em;*/
		/*text-indent: 0;*/
	/*}*/
	#navigation li a {
		border-radius: 0;
	}

	#navigation li a:before {
		content: "›";
		font-size: 1.2em;
		margin-right: .6em;
		line-height: 1;
	}
	#navigation li:last-child a {
		border-bottom: 1px solid #aaa;
	}

	/*#navigation li a:hover,*/
	/*#navigation li a:active,*/
	/*#navigation li a.active {*/
		/*!*background: #fff;*!*/
		/*text-decoration: none;*/
		/*color: #838181;*/
	/*}*/

}
