/*---------------------------*/
        /*Nav Site*/
/*---------------------------*/

#menu *{box-sizing: border-box}
#menu ul {list-style:none;padding: 0;margin: 0;font-size:0px} 

/*Contener Principal*/
#navCatalogue {
    width:100%;
    margin:0px;
    padding:0 !important;
    display:table;
    position: relative;
    table-layout: fixed;
    background: #133d73;
    background: -moz-linear-gradient(top,  #133d73 0%, #012350 100%);
    background: -webkit-linear-gradient(top,  #133d73 0%,#012350 100%);
    background: linear-gradient(to bottom,  #133d73 0%,#012350 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#133d73', endColorstr='#012350',GradientType=0 );
}

/*1er niveau => Univers*/
#navCatalogue .li_niveau_1{display:table-cell;white-space: normal !important;background: none !important}
#navCatalogue .li_niveau_1 .btSousnavigation{
    font: normal 14px/15px 'Roboto-Medium';
    color: #fff;
    margin: 0;padding: 0;
    display: block;
    z-index: 100;
    text-decoration: none;
    text-align: left;
    height: 53px;
    position: relative;
    text-transform: uppercase;
    background:none !important;
    padding:8px 15px 0;
    
    -webkit-transition: background-color .3s linear;
    transition: background-color .3s linear;
}
#navCatalogue .li_niveau_1 .btSousnavigation:after{content:"";display: block;background:#335a8d;position: absolute;right:0;bottom:1px;top:9px;width:1px}
#navCatalogue .li_niveau_1:hover .btSousnavigation,#navCatalogue .li_niveau_1.on{background:#4285b8;color:#fff;text-decoration: none}

/*Gestion Habillage + Couleur + hover + feedback*/
#navCatalogue .u1{border-bottom: 4px solid #0099d1;}
#navCatalogue .u2{border-bottom: 4px solid #8d63b7;}
#navCatalogue .u3{border-bottom: 4px solid #3dcfb5;}
#navCatalogue .u4{border-bottom: 4px solid #3f82b6;}
#navCatalogue .u5{border-bottom: 4px solid #ed4923;}
#navCatalogue .u6{border-bottom: 4px solid #009fda;}
#navCatalogue .u1:hover .btSousnavigation,#navCatalogue .u1.on{background:#0099d1 !important;color:#fff;text-decoration: none}
#navCatalogue .u2:hover .btSousnavigation,#navCatalogue .u2.on{background:#8d63b7 !important;color:#fff;text-decoration: none}
#navCatalogue .u3:hover .btSousnavigation,#navCatalogue .u3.on{background:#3dcfb5 !important;color:#fff;text-decoration: none}
#navCatalogue .u4:hover .btSousnavigation,#navCatalogue .u4.on{background:#3f82b6 !important;color:#fff;text-decoration: none}
#navCatalogue .u5:hover .btSousnavigation,#navCatalogue .u5.on{background:#ed4923 !important;color:#fff;text-decoration: none}
#navCatalogue .u6:hover .btSousnavigation,#navCatalogue .u6.on{background:#009fda !important;color:#fff;text-decoration: none}
#u1 .contener{background-color: #0099d1;}
#u2 .contener{background-color: #8d63b7;}
#u3 .contener{background-color: #3dcfb5;}
#u4 .contener{background-color: #3f82b6;}
#u5 .contener{background-color: #ed4923;}
#li_niveau_1_Gammes_29 .contener{background-color: #009fda;}

/*Contener Rayons + Gammes*/
.bigMenuSimple .li_niveau_1 .sousnavigation{padding:0 !important}
ul.contener{border-bottom: 4px solid #0099d1;padding:0 !important;box-sizing: border-box}

/*Rayons*/
ul.contener .cadreRayon{width: 25%;display: inline-table !important;vertical-align: top;border-right:0px solid #1d1d1d;margin-bottom:15px;padding: 15px 15px 15px 67px;position: relative;}
ul.contener .cadreRayon .lienRayon {
    text-transform: uppercase;
    display: block;
    padding: 0 5px;
    width: 100%;
    height: 100%;
    font: normal 13px/16px 'Roboto-Bold';
    color: #fff;
    text-decoration: none;
    border-right: 0px solid #3b77a5;
}

.cadreRayon.on .lienRayon{font-weight:bold}
.imgR{display: block;width: 50px;position: absolute;left: 11px;top: 21px;}

#navCatalogue .sousnavigation{
    background:#4285B8;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}


/*Gestion des gammes*/
.cadreGammes {padding: 4px 0 15px !important;width:100%;border:0px solid red;}  
.cadreGammes .lienGamme {display: block !important;width:100% !important;border:none !important;margin:0 !important;padding:0 !important;}
.cadreGammes .lienGamme > a {    display: block;font: 400 13px 'Roboto-Light';text-align: left;width: 100%;line-height: 15px;padding: 2px 3px;color: #fff;text-transform: lowercase;opacity: 0.8;}
.lienGamme > a:hover{color:#fff}
.lienGamme.on > a{text-decoration:underline;font-weight: bold;color:#fff}

/*---------------------------*/
    /*    NAV RWD    */
/*---------------------------*/

@media screen and (max-width:800px) {
    
/*Pour déclenchement du burger en tablette !*/
    
/* ---------------------------------------------------------------------- */
	/* BIG MENU SIMPLE + BIG MENU VIGNETTE RESUME + BIG MENU TETE DE GONDOLE */
	/* -------------------------------------------------------------------- */
	.bigMenuSimple *, 
    .bigMenuVignetteResume *, 
    .bigMenuTeteGondole *{
		box-sizing: inherit;
	}
	
	/* masque pour pas les voir au chargement */
    .navBouton{visibility:hidden;position:absolute;width:100%;z-index:99999;}
	.navBoutonMobileContener{padding:10px;}
	
	.btNavMobile{display:block;height:32px;line-height:32px;padding:0 45px 0 0;	background-image:url("../img/icoMenuMobile.svg");background-size:32px;background-repeat:no-repeat;background-position:0 -2px;cursor:pointer;}
	
	/* masque pour pas les voir au chargement */
	.navBas{visibility:hidden;width:100%;}

	.bigMenuSimple ul, 
    .bigMenuVignetteResume ul, 
    .bigMenuTeteGondole ul{
		display:block;
		padding:0;
		margin:0;
		list-style:none;
	}

	.bigMenuSimple .on .btSousnavigation, .bigMenuVignetteResume .on .btSousnavigation, .bigMenuTeteGondole .on .btSousnavigation,
	.bigMenuSimple .li_niveau_1 .btSousnavigation:hover,	.bigMenuVignetteResume .li_niveau_1 .btSousnavigation:hover,	.bigMenuTeteGondole .li_niveau_1 .btSousnavigation:hover,
	.bigMenuSimple .li_niveau_1:hover .btSousnavigation,	.bigMenuVignetteResume .li_niveau_1:hover .btSousnavigation,	.bigMenuTeteGondole .li_niveau_1:hover .btSousnavigation,
	.bigMenuSimple .li_niveau_1 .btSousnavigation:after, .bigMenuVignetteResume .li_niveau_1 .btSousnavigation:after, .bigMenuTeteGondole .li_niveau_1 .btSousnavigation:after{
		background:none;
	}
	
	/* fond premier niveau mobile + fond conteneur navBouton */
	.bigMenuSimple .li_niveau_1, .bigMenuVignetteResume .li_niveau_1, .bigMenuTeteGondole .li_niveau_1, .navBoutonMobileContener{
		display:block !important;
		/*
        background-color:#3F3F3F;
		border-bottom:1px solid #7F7F7F;
        */
		white-space:nowrap;
	}

	.bigMenuSimple .sousnavigationMobileOn, .bigMenuVignetteResume .sousnavigationMobileOn, .bigMenuTeteGondole .sousnavigationMobileOn{
		background-image:url("../img/icoPlus.svg");
		background-size:21px 21px;
		background-repeat:no-repeat;
		background-position:95% 16px;
	}
	
	/* fond premier niveau mobile ouvert */
	.bigMenuSimple .sousnavigationMobileOnOpen, .bigMenuVignetteResume .sousnavigationMobileOnOpen, .bigMenuTeteGondole .sousnavigationMobileOnOpen{
		background-color:#717171;
		background-image:url("../img/icoClose.svg");
		background-size:15px 15px;
		background-repeat:no-repeat;
		background-position:95% 16px;
	}
	
	.bigMenuSimple .li_niveau_1 .btSousnavigation, .bigMenuVignetteResume .li_niveau_1 .btSousnavigation, .bigMenuTeteGondole .li_niveau_1 .btSousnavigation{
		height:34px;
		line-height:34px;
		padding:10px 45px 10px 22px;
		text-align:left;
		text-overflow: ellipsis;
		overflow:hidden;
	}

	/* fond deuxieme niveau mobile */
	.bigMenuSimple .li_niveau_1 .sousnavigation, 
    .bigMenuVignetteResume .li_niveau_1 .sousnavigation, 
    .bigMenuTeteGondole .li_niveau_1 .sousnavigation{
		position:relative;
		width:auto;
		padding:5px;
		/*background-color:#717171;*/
	}

	.bigMenuVignetteResume .li_niveau_1 .sousnavigation ul,
	.bigMenuVignetteResume .li_niveau_1 .sousnavigation ul .li_niveau_2,
	.bigMenuSimple .li_niveau_1 .sousnavigation ul .li_niveau_2, 
    .bigMenuTeteGondole .li_niveau_1 .sousnavigation ul .li_niveau_2{
		width:100%;
	}
	
	.bigMenuSimple .li_niveau_1 .sousnavigation ul .li_niveau_2 a, 
    .bigMenuVignetteResume .li_niveau_1 .sousnavigation ul .li_niveau_2 a, 
    .bigMenuTeteGondole .li_niveau_1 .sousnavigation ul .li_niveau_2 a{
		padding:5px 22px;
	}
	
	.bigMenuVignetteResume .li_niveau_1 .sousnavigation .blocItem, 
    .bigMenuTeteGondole .li_niveau_1 .sousnavigation .gondoleListeItem, 
    .bigMenuTeteGondole .li_niveau_1 .sousnavigation .sepatateurTdG {
		display:none;
	}
	
	/* on affiche les conteneurs globaux des navs bas et bouton version mobile (id), ou le conteneur unique de chaque nav (class) */
	#navBoutonMobileConteners, 
    #navBasMobileConteners, 
    .navBoutonMobileContener, 
    .navBasMobileContener{
        display:block;
    }
	
	.navHidden{display:none;}
    

    .navBoutonMobileContener{position:absolute;width:30px;height:24px;background:none;border:none}
    #nav_horizontale_2_contener{margin-top: 45px;}
    
    
    
    /*Studio*/
    #navCatalogue .li_niveau_1 .btSousnavigation {line-height:45px}
    ul.contener .cadreRayon {width:49%}
    
}


@media screen and (max-width:640px) {
    ul.contener .cadreRayon {width:100% !important}
}