*s{border: solid black 1px}

#topPage, div {display: block;}

#titre{
    width:80%;
    margin: 30px 10% 5% 10%;
    border: solid #AAA 1px;
    border-radius: 10px;
    box-shadow: 2px 2px 3px #AAA;
    text-align: center;}

#mainZone{
    margin: 10% 10% 20% 10%;
    width: 80%;
    border: solid #AAA 1px;
    border-radius: 10px;
    box-shadow: 2px 2px 3px #AAA;}

#leftAside{
    padding: 20px 0px 20px 0px;
    text-align: center;
    position: fixed;
    right: 4.2%;
    bottom: 50px;
    width:150px;
    box-shadow: 5px 5px 6px #AAA;
    border: solid red 1px;
    border-radius: 20px;
    text-decoration: none;
    background-color: white;
    z-index: +1;}

#leftAside:hover{
    text-decoration: none;
    background-color: white;/*rgba(255,0,0,.15);*/
    border: solid red 1px;
    border-radius: 20px;
    box-shadow: 1px 1px 3px #AAA;
    }


p{font-family: "Times New Roman", Times, serif;}

a{text-decoration: none;}
.niveauxLayer a{color: black;}

.intro{ 
    width:80%;
    margin: 50px 10% 50px 10%;}

.introProjet{
    background-color: #e6e6ff;
    width:70%;
    border-radius: 25px;
    padding: 25px 25px 25px 25px;
    margin: 50px 10% 50px 10%;}

.introProjetGris{
    background-color: #CCC;
    width:70%;
    border: solid red 1px;
    border-radius: 25px;
    padding: 25px 25px 25px 25px;
    margin: 50px 10% 50px 10%;
    box-shadow: 1px 1px 3px #AAA;}

.introGreen{
    background-color: rgba(0, 153, 153, 0.4);
    width:70%;
    border: solid rgb(0, 153, 153) 2px;
    border-radius: 25px;
    padding: 25px 25px 25px 25px;
    margin: 50px 10% 50px 10%;}

.introDM{
    background-color: #ffe6b3;
    width:70%;
    border-radius: 25px;
    padding: 25px 25px 25px 25px;
    margin: 50px 10% 50px 10%;}


.introTDCours{
    background-color: #f7e6d7;
    width:70%;
    border: solid orange 2px;
    border-radius: 25px;
    padding: 25px 25px 25px 25px;
    margin: 50px 10% 50px 10%;}



#tools{width:80%;
       margin: 50px 10% 50px 10%;}
.toolDowload{height: 100px;
             margin:0px 10% 0px 20%;}

.niveauxLayer{width: 100%;}

.vert, .bleu, .rouge, .noir, .orange, .gris {
        width:20%;
        height: 40px;
        line-height:40px;      /*Donner la même hauteur à la ligne qu'au conteneur*/
        margin: 5px 2% 5px 2%;
        display: inline-block;
        text-align: center;
        border: solid #888 1px;
        border-radius: 10px;
        box-shadow: 3px 3px 3px #AAA;}

.vert:hover, .bleu:hover, .rouge:hover, .noir:hover, .orange:hover, .gris:hover{
        border: solid white 1px;
        box-shadow: 1px 1px 1px #AAA;}

.vert {background-color: green;}
.bleu {background-color: blue;}
.rouge{background-color: red;}
.noir {background-color: grey;}
.orange {background-color: orange;}
.gris {background-color: #9898cd;}





/* OLDIES ....*/
.item{ 
    width:80%;
    min-height: 50px;
    margin: 50px 10% 50px 10%;
    }

.itemU a img{
    width: 20%;
    margin: 10px 10px 10px 0px;
    box-shadow: 5px 5px 6px #AAA;
    height: inherit;}

.itemU a p{
    width:45%;
    position:absolute;
    display: inline-block;
    margin: 7px 5% 5% 2%;
    text-align: left;}