/*
Projet créé par Guy Bédard
Ce CSS permet de gérer des menus en HTML
*/
/* 
    Created on : 2015-01-31, 09:08:30
    Author     : Guy
*/

.cadreMenu{
    background-color: #000000;
    height: 40px;
    position: relative;
    padding: 0px;
    margin: 0px;
    width: 846px;
    margin:auto;
}

.boiteMenu{
    position: absolute;
    padding: 0px;
    margin: 0px;
}

.Menu{
    height: 40px;
    margin: 0px;
    padding: 0px;
    display: block;
    float: left;
}



.titreMenu{
    width: 160px;
    display: block;
    height: 40px;
    color: #FFF;
    line-height: 40px;
    text-align: center;
    border-right: solid 1px #999999;
    cursor: pointer;
    margin: 0px;
    padding: 0px;
}


.optionMenu{
    display: block;
    margin: 0px;
    padding: 0px;
    background-color: #666666;
    color: #fff;
}

.Menu .optionMenu{
    display: none;
}

.Menu:hover .optionMenu{
    display: block;
}


.titreMenu:hover{
    background-color: #444444;
}


.optionMenu ul{
    margin: 0px;
    padding: 0px;
    text-align: center;
    list-style: none;
}

.optionMenu ul li a{
    display: block;
    text-align: center;
    text-decoration: none;
    height: 30px;
    width: 150px;
    line-height: 30px;
    border-top: solid 1px #999999;
    border-bottom: dotted 1px #999999;
    color: #ffffff;
}

.optionMenu ul li a:hover{
    background-color: #cccccc;
    color: #cc0033;
}