header{ background: linear-gradient(to right, dimgray,gray); width:100%; height:60px; position: fixed; z-index:90; opacity:1; } #heading a, #fileSession a, #fileSession, #navigation a, div#optionsSession a, #logoBarre a { text-decoration:none; font-family:'Tahoma'; font-size:12pt; font-style:normal; font-weight:normal; color:black ; } div#barreEntete{ height:60px; position: fixed; z-index:90; width:1600px; margin:0px auto; top: 0; right: 0; left: 0; bottom: 0; background: linear-gradient(to right, dimgray,gray);} div#barreEntete #partiehaut, div#barreEntete #partiebas { min-height:29px; } div#barreEntete #partiebas{ border-top:1px solid silver; margin-left:100px;} #logoBarre{ height:60px; width:100px; float:left;left:0%;margin-left:0%;; } #fileSession{ float:right;right:0%;margin-right:0%;} div#navigation{ background: linear-gradient(to right, dimgray,gray); min-heigth:29px; } #fileSession ul, #navigation ul { margin:0; padding:0; list-style:none; border-radius:0px; box-shadow:1px 1px 5px black; } #logoBarre ul { margin:0; padding:0; list-style:none; } #logoBarre ul li{ text-align:center; border-right:1px solid silver; border-left:1px solid silver; line-height:60px; width:100px; } #logoBarre li:hover { background-color:whitesmoke; } #fileSession ul li, #navigation>ul>li{ line-height:29px; border-radius:0px; box-shadow:1px 1px 5px black; background: linear-gradient(to right, silver,silver); margin: 0 5px; } div#optionsSession ul li, #navigation>ul>li li{ line-height:30px; } div#optionsSession a:nth-of-type(1)>li{ border-top-left-radius:0px; border-top-right-radius:0px; } div#optionsSession a:nth-of-type(3)>li{ border-bottom-left-radius:0px; border-bottom-right-radius:0px; } #fileSession ul li, #navigation ul li { float:left; padding-left:15px; padding-right:15px; } #navigation>ul>li{ border-right:1px solid silver; border-left:1px solid silver; } #navigation li:hover,#fileSession li:hover { background-color:whitesmoke; } #navigation li.produit { background-color:whitesmoke; } #navigation li.article { background-color:whitesmoke; } /*css pour les options (se connecter/ se deconnecter)*/ div#optionsSession{ z-index:100; margin-top:30px; position: absolute;right: 0px;} div#optionsSession ul{ list-style:none; background-color:whitesmoke; margin:0; padding:0; border-radius:0px; box-shadow:1px 1px 5px black; } div#optionsSession ul li{ padding:0px 10px; border-bottom:2px solid silver; } div#optionsSession ul li:hover{ background-color:whitesmoke; } .triangle{ border-color: rgba(255,255,255,0.9) transparent transparent transparent; border-style: solid; border-width: 15px; height:0; width:0; margin-top:-10px; float:right;position:absolute;right: 10px;} div#optionsSession{ display:none; } ul.niveauCero>li>ul>#flecheSous{ display: none; } /***********************vertical******************************/ #navigation ul>li { vertical-align:middle; padding-left:15px; padding-right:15px; cursor:pointer; } #navigation ul li:hover ul li:nth-of-type(1){ border-top-left-radius:0px; border-top-right-radius:0px; } #navigation ul li:hover ul li:last-child{ border-bottom-left-radius:0px; border-bottom-right-radius:0px; } /*--------------deuxieme niveau--------*/ #navigation ul li ul { visibility:hidden; position:absolute; border-radius:0px; box-shadow:1px 1px 5px black; width:280px; background-color:whitesmoke; } #navigation li:hover>ul { visibility:visible; position:absolute; } #navigation>ul>li:hover>ul/*pour le deuxieme niveau*/ { margin-left:-55px; } #navigation>ul>li:hover>ul>li { position:relative; display:block; } #navigation ul li li:hover,div#optionsSession ul li:hover { background-color:whitesmoke; } /*--------------troisieme niveau ()--------*/ #navigation>ul>li>ul>li>ul>li { position:relative; display:block; } /*----autres niveaux-------*/ #navigation ul li li{ width:250px; display:inline-block; position:absolute; } #navigation>ul>li>ul>li ul{ display:inline-block; } #navigation>ul>li>ul>li>ul>li li{ position:relative; display:block; } #flecheSous{ color:normal; } #navigation>ul li:hover>ul>li>ul>#flecheSous{ position:absolute; visibility:visible; margin-left: 10px; } /******************fin vertical*****************/