@CHARSET "UTF-8";

body {
    font-size:12px;
    font-family:Verdana, arial, sans-serif;
    padding: 4px;
}

article, aside, header, footer, section {
    display: block;
}

.normal {
    font-size:12px;
    font-weight: normal;
}

.accueil {
    display: block;
    background-color: #f0f0f0;
    border: 1px solid #c7c7c7;
    width: 332px;
    padding: 4px;
}

body section h1 {
    margin-top: -18px;
    margin-left: 4px;
    border-left: 1px solid #c7c7c7;
    border-right: 1px solid #c7c7c7;
    margin-right: 120px;
    margin-bottom: 6px;
    background-color: #e0e0e0;
    padding-left: 12px;
    color: red;
    font-size: 16px;

    background-image: url(../images/bandeGriseDeTitre.png);
    background-repeat: repeat-x;
    height: 18px;
    padding-top:2px;



}

body aside {
    position: absolute;
    top: 30px;
    left: 4px;
    display: block;
    width: 220px;
    background-color: #f0f0f0;
    border: 1px solid #c7c7c7;
    padding: 4px;
}

body aside h1 {
    margin-top: -10px;
    margin-left: 4px;
    border-left: 1px solid #c7c7c7;
    border-right: 1px solid #c7c7c7;
    margin-right: 120px;
    margin-bottom: 6px;
    /*
        background-color: #e7e7e7; */
    padding-left: 12px;
    color: red;
    font-size: 16px;
    background-image: url(../images/bandeGriseDeTitre.png);
    background-repeat: repeat-x;
    height: 18px;
    /*	font-size: 13px; */
    padding-top:2px;
}

body aside p {
    margin-top: 0px;
    margin-bottom: 6px;
}

body header nav {
    position: absolute;
    left: 4px; 
    top: 4px;
}

body header nav a {
    padding-right: 4px;
}

body header nav a.active {
    font-weight: bold;
    text-decoration: none;
}

body header nav a + a {
    padding-left: 4px;
    border-left: 1px solid #c7c7c7; 
}

body article {

    display:block;
    position:absolute;
    top: 30px;
    right:16px;
    left:248px;

    /*
    display: block;
    position: absolute;
    top: 36px;
    left: 240px;
*/
    color: #303030;
}

body article h1 {
    font-size: 24px;
    color: red;
    width:100%;
    margin-top: 0px;
    margin-bottom: 12px;
}

/* style spécifiques CSS3 */
#twoCols {   /* gère l'affichage bloc de texte sur deux colonnes */
    -webkit-column-count: 2;
    -webkit-column-rule: 1px dotted #c7c7c7;
    -webkit-column-gap: 2em;
    -moz-column-count: 2;
    -moz-column-rule: 1px dotted #c7c7c7;
    -moz-column-gap: 2em;
    column-count: 2;
    column-rule: 1px dotted #c7c7c7;
    column-gap: 2em;
}

#threeCols {   /* gère l'affichage bloc de texte sur deux colonnes */
    -webkit-column-count: 3;
    -webkit-column-rule: 1px dotted #c7c7c7;
    -webkit-column-gap: 2em;
    -moz-column-count: 3;
    -moz-column-rule: 1px dotted #c7c7c7;
    -moz-column-gap: 2em;
    column-count: 3;
    column-rule: 1px dotted #c7c7c7;
    column-gap: 2em;
}

body article section:hover {
    
}

body article h2 {
    color: #800;
    background-color: #fcc;
    font-size: 16px;
    margin-top: 8px;
    margin-bottom: 6px;
    border-bottom: 2px solid #caa;
}

body article section {
    display: table;
}

article section p {
    margin-top: 0px;
    margin-bottom: 6px;
    text-align: justify;
    padding-right: 6px;
}

section nav p {
    margin-top: 0px;
    margin-bottom: 2px;
}

article section ul {
    margin-top: 0px;
    margin-bottom: 6px;
    padding-right: 6px;
}

article section ul li {
    margin-bottom: 4px;
    text-align: justify;
}

article section img {
    float: right;
    max-width: 50%;
    margin-left:4px;
    margin-bottom: 4px;
}

#colGauche {
    float:left;
    width:48%;
    margin-right:4px;
}

#colDroite {
    position: absolute;
    right: 4px;
    border-left: #a9a9a9 dotted 1px;
    padding-left:4px;
    width:51%;
}




.promo-verticale {
    clear:both;
    float:left;
    border-style:none;
    /*	border: 1px dashed #9f9f9f; */
    width:202px;
    padding-top:12px;
    text-align:center;
}

.preambule {
    font-weight: bold;
    color: #272772;
}


.liens {
    list-style-image:url(fleche1.gif);
    clear:both;
    background-color:white;
    border: 1px solid #cfcfcf;
    margin:6px 0px 0px 0px;
    width:200px;
    padding-left:2px;
    padding-bottom:2px;
    padding-top:2px;
    float:left;
}


.bandeau-menu {
    height:22px;
    background-color: #f7f7f7;
    display: block;
    clear:both;
    padding:2px;
    padding-left:4px;
    margin-bottom:2px;
    border: 1px solid #dfdfdf;
}


.bloc-menu {
    background-color: #f7f7f7;
    padding: 4px;
    border: 1px solid #dfdfdf;
    /*	border: 1px dashed #9f9f9f; */
    margin-bottom:18px;
}

.titre-menu {
    color: #e21818;
    font-weight: bold;
    font-size: 14px;
    margin-top:-12px;
}




.flash {
    text-align: justify;
    margin-top: 6px;
    margin-bottom: 3px;
    border: 1px dashed #9f9f9f;
    padding: 4px;
}


.saisieAge {
    display:none;
}

.boiteAnnonce {
    background-color:#e7e7e7;
    width:246px;
    height:140px;margin-right:8px;
    margin-bottom:8px;
    float:
        left;
}

/* style spécifiques CSS3 */
.twoCols {   /* gère l'affichage bloc de texte sur deux colonnes */
    -webkit-column-count: 2;
    -webkit-column-rule: 1px dotted #b0b0b0;
    -webkit-column-gap: 2em;
    -moz-column-count: 2;
    -moz-column-rule: 1px dotted #b0b0b0;
    -moz-column-gap: 2em;
    column-count: 2;
    column-rule: 1px dotted #b0b0b0;
    column-gap: 2em;
}

.threeCols {   /* gère l'affichage bloc de texte sur deux colonnes */
    -webkit-column-count: 3;
    -webkit-column-rule: 1px dotted #b0b0b0;
    -webkit-column-gap: 2em;
    -moz-column-count: 3;
    -moz-column-rule: 1px dotted #b0b0b0;
    -moz-column-gap: 2em;
    column-count: 3;
    column-rule: 1px dotted #b0b0b0;
    column-gap: 2em;
}