/* SMARTPHONES */
@media only screen and (min-width: 320px) {
	a#menu-toggle{
		 background: #336c37 url("img/menu_blanc.png") no-repeat scroll 38% 4px;
    color: #fff;
    display: block;
    font-family: "Open Sans",Arial,Helvetica,sans-serif;
    height: 30px;
    line-height: 30px;
    margin: 1% auto 0;
    padding: 5px 0;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: 100%;
	}
	#nav{
		 display: none;
    list-style-type: none;
    margin: 0 auto 1%;
    padding: 0;
    width: 100%;
	}
	#nav > li > ul{
		margin: 0;
		padding: 0;
		list-style-type: none;
		width: 100%;
	}
	#nav > li{
		position:relative;
		margin: 0;
	}
	#nav li a{
		color:#fff;
	display: block;
	padding: 1% 0;
	text-align: center;
	background: #336c37;
	text-decoration: none;
	font-size: 1.2em;
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	text-transform:uppercase
	}
	#nav > li > ul li a{
		border-radius: 0 0 3px 3px;
		border-top: 1px solid #eee;
	}
	
	#nav ul{
		display:none
	}
}

/* TABLETTES */
@media only screen and (min-width: 768px) {

	a#menu-toggle{
		clear: both;
    margin: 1% auto 0;
    padding: 5px 0;
    width: 100%;
		background: #336c37 url("img/menu_blanc.png") no-repeat scroll 44% 4px;
	}
}

/* ORDINATEURS */
@media only screen and (min-width: 1024px) {
	a#menu-toggle{
		display: none;	
	}
	#nav, #nav ul{
		margin:0;
		padding:0;
		list-style-type:none
	}
	
	#nav{
		width:100%;
		display:block;
		position: relative;
		float: right;
		margin: 20px 0 ;
	}
	
	#nav > li{
		float: left;
    height: 30px;
    margin: 0 1px 0 0;
    position: relative;
    width: 15%;
	}
	
	#nav > li.nav3{margin: 0;width: 10%}
	#nav > li.nav8{width: 22%}
	#nav > li.nav9{width: 22%}
	
	#nav ul{
		position:absolute;
		display:none
	}
	
	#nav > li > ul{
		top:100%;
		left:0;
	}
	
	#nav > li > ul > li > ul{
		top:0;
		left:100%;
		padding-left:5px;
	}
	
	#nav ul li{
		padding-top:5px
	}
	
	#nav li a{
		background: none;
		display:block;
		padding:0;
		margin:0;
		border-radius: 0;
		box-shadow: none;
		font:600 16px/24px "Open Sans";
		text-transform: none;
		color: #66686a;
		height: 30px
	}
	
	#nav li.nav9 a{}
		
	#nav > li a:hover, #nav > li.selected a{
		color:#4a9843;
	background: url(../../themes/default_3_columns/img/rool.png) no-repeat scroll center bottom;}
		
	/* sous menu **/
	
	#nav li:hover > ul{
		display:block;
		z-index:10000;
		padding:0;
	}
	
	#nav > li> ul>li{padding:0px}
	
	#nav > li> ul > li a{
		display:block;
		line-height:30px !important;
		padding:0px;
		font-weight:normal;
		background: #fff;
		color:#4a9843;
		width: 200px
	
	}
	
	#nav > li> ul>li a:hover, #nav > li> ul>li.selected a{background: #fff; color:#66686a}
	
	#nav li:hover a {color:#4a9843;background: url(../../themes/default_3_columns/img/rool.png) no-repeat scroll center bottom}
	#nav li:hover li a {background: #fff;color:#4a9843;}
	#nav li:hover li a:hover {background: #fff; color:#66686a}




	/* pour fixer le menu lorsqu'on scrolle */
	/*
	#nav.fixed{
		position: fixed;
		top:0;
		left:0;
		z-index: 1000;	
		width:100%;
		background: rgba(196,196,196,0.9);
		margin:0;
		padding:10px;
		box-shadow: 0 0 5px #333;
		-moz-transition: box-shadow 0.8s, background 0.5s;
		-webkit-transition: box-shadow 0.8s, background 0.5s;
		-o-transition: box-shadow 0.8s, background 0.5s;
		-ms-transition: box-shadow 0.8s, background 0.5s;
		transition: box-shadow 0.8s, background 0.5s;
	}
	*/

}

/* ORDINATEURS */
@media only screen and (min-width: 1170px) {
	#nav{

		max-width: 864px;
		margin: 55px 0 0
	}

}
/* thème smartphone (osbolète) */

.smartphone #nav > li{
	float:none;
}

.smartphone #nav{
	width: auto;
	float: right;
}

.smartphone .smartli {
	margin: 0;
}