.nav-close {
    background:  url("images/close-icons2.png") no-repeat scroll center center;
    cursor: pointer;
   
   
   
}

#openbar{
	position:absolute;
	right:0px;
	width:110px;
	height:100%;
	background: #222;
	display:none;
	
}
#menu_principal {
	display:block;
	position:relative;
	text-align:center;
	padding: 0;
	margin:0;
	float: left;
	width: 100%;
	overflow:visible;
}

#menu_principal li{
	list-style: none;
	display: inline;

	margin:0;
	padding:0;
background-color: #fff;
}

.no-fontface a.rub{

	font-family: "Trebuchet MS", Tahoma, serif;

	font-size: 30px;

	text-transform: lowercase;	

}
#menu_principal a.rub, .rub_actif{
	margin:0;

	display:block;

	line-height:25px;

	height:55px;

	overflow:hidden;

	padding-right: 15px;

	padding-left: 15px;

	font-size:18px;

	text-decoration: none;

	color: #a0a1a4;

	font-family: "CENTURYGOTHIC","Trebuchet MS", Tahoma, serif;

	font-weight: normal;

	text-transform: uppercase;
}

#menu_principal  #rub_20_fr {
		background-image:none;

}

#menu_principal li a:hover{
	text-decoration: none;
}


#menu_principal .rub_actif, #menu_principal .rub_actif:hover {
    background-color: #222222;
    color: #fff;
}

#menu_principal .rub:hover{
		background-color: #f2f2f2;

	color: #000;


}


#menu_principal li ul li a:hover{
	color: #bfbd00;

	text-decoration: none;
}


/* Submenu */
#menu_principal li > ul {
	margin:0;
	padding-top:10px;
	padding-left:0px;
	padding-bottom:15px;
	width:106.9%;
	display: none;
	position: absolute;
	height:auto;
	left:-32px;
	top: 51px;
	float:none;
	background-color: #555555;
	color: #fff;

}
.nav > li {
    position: static;
}


#menu_principal li ul li a:hover{
	text-decoration: none;
	background-color: #a3a4a6;
	color: #fff;
}


 
 
.div_cat {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #777;
	min-height: 100%;
	max-height: 100%;
	height: 100%;
	text-align: center;
	vertical-align: top;
}

.div_cat:first-child{
	border-left-width: 0px;
	border-left-style: solid;
	border-left-color: #FFF;
}

.div_cat .tit {
	font-size:14px;
	color: #fff;
	font-family: "Lucida_Grande_Bold", "Trebuchet MS", Tahoma, serif;
	font-weight: normal;

	height:30px;
	text-transform: uppercase;
}

.div_cat .image {
	background-color: #fff;
	margin-top:3px;
	margin-bottom:5px;
	padding:10px 0px;
	height:87px;
}

.div_cat .image img {
/*	-webkit-box-shadow: 1px 1px 2px 2px rgba(0,0,0,0.25);
	-moz-box-shadow: 1px 1px 2px 2px rgba(0,0,0,0.25);
	box-shadow: 1px 1px 2px 2px rgba(0,0,0,0.25);*/
	height:57px;
}

.div_cat .prod {
	margin: 0 5px;
	text-align:left;

}

.div_cat .prod a{
	color: #fff;
	font-family: "Trebuchet MS", Tahoma, serif;
	display:block;
	line-height:14px;
	font-size:12px;
	text-decoration: none;
	padding: 3px 3px;
	font-weight: normal;
	border-bottom-width: 0px;
	border-bottom-style: solid;
	border-bottom-color: #777;
}

.div_cat .prod a:hover{
	background-color: #a3a4a6;

}
.nav > li > a:hover, .nav > li > a:focus{
	background-color: none;
}



@media (max-width: 1050px) {
	#menu_principal .rub_actif, #menu_principal .rub_actif:hover{
	background-color: #222222;

	color: black;

}
	#menu_principal a.rub, .rub_actif{
	margin:0;

	display:block;

	line-height:55px;

	height:55px;

	overflow:hidden;

	padding-right: 15px;

	padding-left: 15px;

	font-size:18px;

	text-decoration: none;

	color: #a0a1a4;

	font-family: "CENTURYGOTHIC","Trebuchet MS", Tahoma, serif;

	font-weight: normal;

	text-transform: uppercase;
}
	#menu_principal .rub:hover{
		
		background-color: white;

	}
	#menu_principal li {
		background-color: #222;
		list-style: outside none none;
		margin: 0;
		padding: 0;
	}
	#menu_principal a.rub, .rub_actif {
		color: white;
	   line-height:35px;
	}
	.div_cat .prod a:hover{
		background-color: white;

	}

	#menu_principal .rub_actif, #menu_principal .rub_actif:hover{
		background-color: #a3a4a6;

		
		color:white;
	}

	#menu_principal li ul li a:hover{
		text-decoration: none;
		background-color: #white;
		color: #222;
	}
	
	#menu .container-fluid {
		width: 50px;
	}

		.navbar-collapse {
		border-top: none;
		box-shadow: none;
	   
	}


	#menu_principal li > ul {
		
		background-color: white;
		color: #555555;
		margin-top:0px;
	}

	#menu_principal li ul li{
		
		margin: -11px 0 0;
	  
	}

	.div_cat .tit {
		color: #fff;
		line-height: 30px;
		background:#555555;
	}
	.div_cat .prod a {
	   
		color: #555555;
	  
	}
	.div_cat {
			width:100% !important
	}
	#menu_principal li > ul {
		
		width:100%;
		

	}
	
	
	.div_cat .prod a {
	  
		font-size: 16px;
	   
		text-align: center;
	   
	}

	.div_cat {
		display: block;
		   margin-bottom: 20px;
	}
		.navbar-brand, .navbar-nav > li > a {
	   
		padding-right: 32px;

	}

	#menu_principal li > ul {
		
		position:static;
	}
	.nav > li > a:hover, .nav > li > a:focus{
		background-color:transparent;
	}
		
	 .nav .open>a,.nav .open>a:focus,.nav .open>a:hover{background-color:black;border-color:none}

	 .navbar .container-fluid{
		  padding-left: 0px;
		padding-right: 0px;
		width:80px;
	 }
	 

	.div_cat {
		border-left: none;
		
	}

	#menu_principal li > ul {
		left:0px;
	}
	
	.navbar-toggle {
    border-radius: 4px;
    float: right;
    height: 50px;
    margin-bottom: 0px;
    margin-right: 0;
    margin-top: 0px;
    padding: 0;
    position: relative;
    width: 40px;
}
	.container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
		margin-left: 0px;
		margin-right: 0px;
	}

	.nav > li {
		position: relative;
	}
	.navbar-collapse {
	  position:absolute;
		top: 153px;
		right:0px;
		background:#a3a4a6;
		z-index:9999;
		width:50%;
		
	padding-left: 0px;
		padding-right: 0px;
	}
	#menu_principal li {
		display:table;
		
	}	
	#menu_principal li > ul {
		
	}

	

}
@media (max-width: 1030px) {

}
@media (max-width: 890px) {
	

}

@media (max-width: 830px) {
	

}


@media (max-width: 667px) {	




	#openbar {
   width:103px;
}
}
@media (max-width: 660px) {	

}

@media (max-width: 571px) {	



}

@media (max-width: 590px) {
	 .navbar .container-fluid {
   
    width: 50px;
}

	

}
@media (max-width: 580px) {
	

	
	

}
@media (max-width: 570px) {
	
	

}

 @media (max-width: 540px) {
	
	
.navbar-collapse {
  
    top: 130px;
   
}


 }
 
 
  @media (max-width: 530px) {
	    .nav-close {
			background:  url("images/close-icons3.png") no-repeat scroll center center;
		    
		}
			  .navbar-collapse {
		   
			width: 100%;
			
		}

 }
 
  @media (max-width: 500px) {
	.navbar-collapse {
    top: 103px;
	}
	.navbar-toggle {
		 margin-right: 0px;
		 width: 40px;
	}
	#openbar {
    width: 93px;
}
 }
  @media (max-width: 470px) {
	.navbar-collapse {
    top: 93px;
	}
	.navbar-toggle {
		 margin-right: 0px;
		 width: 40px;
	}
	#openbar {
    width: 93px;
}
 }
  
  @media (max-width: 453px) {
	

 #menu {
    margin-left:0px;
    width:30px;
}
#menu .container-fluid {
    width: 30px;
}

	#openbar {
   width:80px;
}
.navbar-toggle {
    margin-right: 0px;
   width: 30px;
}
  }
   @media (max-width: 430px) {
 .navbar-collapse {
    top: 85px;
}
   }
  @media (max-width: 413px) {
	  
	  
  }
  
@media (max-width: 403px) {
	 
	  	#openbar {
			width:67px;
		}
		.navbar-toggle {
    margin-right: 5px;
    width: 30px;
}
}

 @media (max-width: 370px) {
		
			#openbar {
			   width:43px;
			}

			  .navbar-collapse {
				top: 83px;
			}
			

				.navbar-toggle {
				margin-right: 0px;
				width: 30px;
			}

}