/* 
    Document   : commun
    Created on : 4 févr. 2010, 15:40:59
    Author     : lemitch
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

* {
    margin:0;padding:0;                                                         /* On met à 0 les margin et padding de tous les éléments */
}

html, body, #wrap { height: 100%;}

html {
    margin:0;
    padding:0;
    font-size: 100%;
}                                                                               /* Cf.: http://pompage.net/pompe/definir-des-tailles-de-polices-en-CSS/ */

body {
    font-size: 0.625em; /* soit 10px */
    font-family: Arial,Helvetica,sans-serif;
    color: #676767;
    background-color: #e9e9e9;
}
.spip-admin-float { position: absolute; left: 120px; top: 0; background-color: transparent; z-index: 100; }

a,
a.spip_out{
    margin:0;
    padding: 0;
    color: #676767;
    text-decoration: none;
}

a:focus { outline:0;} 

a.spip_note {
    font-size: .9em;
    line-height: .8em;
    color: #979797;
}

iframe {border :0 none;}

.spip_code {
    display:block;
    clear:both;
    color: #676767;
    margin:20px;
    text-align:left;
}

.intitule a, .intitule a.spip_out {
    color: #f00;
} 

a:hover {
    color: #f00;
}

.spip_surligne {
    background: none repeat scroll 0 0 #FFBBBB;
}
.cacher {
    display:none;
}

.alaligne {
    clear:both;
}

.flotter {float:left;display:inline;}
.flotter-d {float:right;display:inline;}

.spip_logos {
    -webkit-box-shadow:1px 1px 3px #666;
    -moz-box-shadow:1px 1px 3px #666;
    box-shadow:1px 3px 3px #666;
    behavior: url('squelettes/scripts/PIE.htc');
}

.gis_logos {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    vertical-align: middle;
}

.crayon-html .crayon-boutons {
    top:-20px;
}

.page .crayon-icones em.crayon-crayon {
    background: url("../images/icones/editer_on.png") no-repeat scroll 0 0 transparent;
    height: 14px;
    width: 14px;
}


/****** ENTETE ******/

.entete {
    margin: 2px auto;
    text-align: right;
    color: #979797;
    font-size: 1.2em;
}

.entete img {
    margin: 0 0 0 7px;
    vertical-align: middle;
}

/****** BANDEAU ******/
.bandeau {
    height: 145px;
    width: 100%;
    background: url('../images/fond_bandeau.png') repeat-x top left;
    text-align: center;
}

.bandeau-fond {
    position:relative;
    margin: 0 auto;
    background: url('../images/fond_bandeau_plus.png') no-repeat top left;
    width:1016px;
    height: 145px;
}
.bandeau-fond img {
    margin:16px 0;
}

.recherche {
    position:absolute;
    bottom: 33px;
    right: 13px;
    margin: 0;
    padding: 0;
}

/****** MINICARTE ******/
.mapper {
    float:left;
}

    #formulaire_recherche_carte {
        position:absolute;
        top:10px;
        left:9px;
    }
    
        #formulaire_recherche_carte input {
            width:93px;
        }
    
    div#mapper_relative{
        float:left;
        position:relative;
        z-index:1;
    }
    
    .aide {
        width:100px;
        padding:4px 0 0 2px;
    }

    .ui-autocomplete { 
        height:252px; 
        width:232px; 
        overflow-y: auto; 
        overflow-x: hidden;
        background-color:#f4f4f4;
        border:1px solid #f00;
        }
    
    
    
/****** TEXTES ******/

h1,h2,h3,h4,h5,h6 { margin: 0; padding: 0; font-weight: normal; font-size: 1em; font-family: Arial, Helvetica, sans-serif;}
/*
h1 > Helvetica 35 thin, 40px, Regular (Edito)
h2 > Helvetica 55 Roman, 28px, Regular (Onglets Fil Info)
h3 > Helvetica 75, 18px, Bold (Agenda)
h4 > Helvetica 75, 14px, Bold (1ère Urgence, France )
h5 > Arial, 12px, Bold (Dates et Intitulés de texte)
h6 >
*/

h1 {
    display:inline;
    font-size:2.1em;
    line-height: 2.1em;
}

h2 {
    display:inline;
    font-size:1.8em;
    line-height: 1.8em;
}

h3 {
    display:inline;
    font-size:1.6em;
}

h4 {
    display:inline;
    font-size:1.5em;
}

h5 {
    display:inline;
    font-size:1.4em;
}

h6 {
    display:inline;
    font-size:1.2em;
}

.texte {
    float:left;
    clear:both;
    font-size: 1.2em;
}

.rouge {
   color: #f00;
}

.gris { color: #575757;}
.gris_clair {color : #A3A3A3;}

.gras {
    font-weight: bold;
}

.italique {
    font-style: italic;
}

.aide {
    float:left;
    clear:left;
    font-size:1.1em;
    color:#5a5a5A;
}

.justifier {
    text-align: justify;
}

.majuscule {
    text-transform: uppercase;
}

.petitemajuscule {
    font-variant:small-caps;
}

.date_jjmm {
    float:left;
    color: #f00;
    padding:1px 8px 0 0;
    margin:0;
}

.date_jjmm h2,
.date_jjmm h3,
.date_jjmm h4,
.date_jjmm h5 {
    float:left;
    clear:both;
    line-height: 1em;
    font-weight: bold;
}

 .date_publi {
    float:left;
    font-size:1.2em;
    clear:none;
    width:37px;
    text-align: left;
    color:#f00;
    padding: 0 5px 0 0;    
}

.organisation_liee {
    font-size:0.9em;
    clear:left;
    margin:0 0 8px 0;
}

#zone-30 .date_publi {
    font-size:1em;
}

div.lire_tout {
    position:absolute;
    display:block;
    bottom:4px;
    right:10px;
    font-size: 1.2em;
    list-style: none;
    margin: 0;
    padding: 0;
    height: 14px;
}

div.lire_tout a,
div.lire_tout_float a {
    display: inline-block!important;
    overflow: hidden;
    height: 14px;
    line-height:1.4em;
    width: 14px;
    float:right;
}

    div.lire_tout a.fleche,
    div.lire_tout_float a.fleche{
       background:url(../images/icones/fleche_droite_pale.png) top left no-repeat;
    }
    div.lire_tout a.fleche:hover,
    div.lire_tout_float a.fleche:hover {
       background:url(../images/icones/fleche_droite_rouge.png) top left no-repeat;
       color:#F00;
    }

div.lire_tout p {
    float:right;
    padding:0 5px 0 0;
    line-height:normal;
}
    #principal div.lire_tout p,
    .texte div.lire_tout p {
        font-size:0.8em;
    }

/*.alaligne {
    clear:left;
}*/

.enligne {clear:none;}

.annonce {
    float:left;
    margin:25px;
}

.annonce.vide {
        min-height: 461px;
}

.cs_blocs {
    font-size:1.2em;
}

.cs_done {display:none;}                                                        /* permet de cacher les titres des accordeons */

.cs_sommaire_inner .cs_done {
    display:block;
}

.blocs_replie, .blocs_titre {
    background: none;
    padding:0;
    margin:0;
}

.blocs_replie {
    display:block;
}


/****** PAGE ******/

.page {
    margin: 0 auto;
    padding:0 4px;
    width:1008px;
}

.colonne {
    float:left;
}

.arrondi {
    border-radius:8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    -webkit-border-radius: 8px 8px 0 0;
    /*behavior: url('squelettes/scripts/PIE.htc');*/
}

.arrondi_tl {
    border-radius:8px 0 0 0;
    -moz-border-radius: 8px 0 0 0;
    -webkit-border-radius: 8px 0 0 0;
    behavior: url('squelettes/scripts/PIE.htc');
}

.arrondi_tr {
    border-radius:0 8px 0 0;
    -moz-border-radius: 0 8px 0 0;
    -webkit-border-radius: 0 8px 0 0;
    behavior: url('squelettes/scripts/PIE.htc');
}

.arrondi_tbr {
    border-radius:0 8px 8px 0;
    -moz-border-radius: 0 8px 8px 0;
    -webkit-border-radius: 0 8px 8px 0;
    behavior: url('squelettes/scripts/PIE.htc');
}

.arrondis {
     border-radius:4px 4px 4px 4px;
    -moz-border-radius: 4px 4px 4px 4px;
    -webkit-border-radius: 4px 4px 4px 4px;
    behavior: url('squelettes/scripts/PIE.htc');
}

.encadre {
    float:left;
    height:168px; /* 170px*/
    width:250px;
}

.encadre img {
    float:left;
}

    .encadre#mur img {
        float: none;
    }
    
#edito #secteur-bandeau {
    float:left;
    display:inline;
    width:250px;
    height:85px;
    background: url('../images/fond_secteur.png') repeat-x top left;
    border-right: 1px solid #ffffff;
    position:relative;
}

    #secteur-triangle {
        position:absolute;
        right:-25px;
        z-index:100;
    }
        
#edito #secteur-cadre {
    float:left;
    display:inline;
    width:680px;
    padding:10px 36px 10px 39px;
    height:64px;
    background: #fff;
    border-right: #cacaca 1px solid;
    border-bottom: #cacaca 1px solid;
    font-size:1em;
    position: relative;                                                         /* utilisé pour le placement des flèches lire_tout */
    text-align: justify;
}

.double {
    float:left;
    width:221px;
    height:48px;
    border: #cecece 1px solid;
    background-color: #fff;
    margin: 10px 0 0 0;
    padding:2px 10px 0 10px;
    clear:both;
}

#newsletter {
    float:left;
    width:221px;
    height:28px;
    border: #cecece 1px solid;
    background-color: #fff;
    margin: 10px 0 ;
    padding:4px 10px 0 10px;
    clear:both;
}

    #newsletter img {
        float:left;
        padding:0 0 2px 0;
    }

    #newsletter #puce {
        padding:6px 1px 0 0;
    }
        
#mur {
    width:241px;
    height:248px;
    background: url('../images/fond_mur_degrade.gif') repeat-x top left;
    border: 1px solid #cecece;
    text-align:center;
    display: table;
}

    #mur #affiches {
        min-height: 248px;
        display: table-cell;
        vertical-align: middle
    }

    #mur #affiches img {
        -webkit-box-shadow:-1px 3px 3px #666;
        -moz-box-shadow:-1px 3px 3px #666;
        box-shadow:-1px 3px 3px #666;
        behavior: url('squelettes/scripts/PIE.htc');
    }        
    

/* ***** AGENDA ***** */
#calendar {
    float:left;
    width:249px;
    position: relative;
    z-index:5;
    background-color: #fff;
    border-right: #cacaca 1px solid;
    height:170px;
    font-weight: normal;
}

    #spirales {
        position: absolute;
        top:-10px;
        left: 12px;
        background: url('../images/spirales.png') no-repeat;
        width: 227px;
        height: 18px;
    }

    #intitule-calendrier {
        float:left;
        text-align: center;
        font-size: 1.8em;
        font-weight: bold;
        color: #f00;
        width: 100%;
        border-bottom: 1px solid #f00;
        padding:15px 0 5px 0;
        height:19px;
        text-shadow: 1px 1px 1px #D7D7D7;
        behavior: url('squelettes/scripts/PIE.htc');
        background: #ffffff;
    }

    #calendar table {
        float:left;
        display : inline;
        border:none;
        border-spacing:0;
        *border-collapse: collapse;                                             // IE
        margin:5px 0;        
    }
    
        #calendar #mensuel {
            width: 251px;
            padding:0 0 0 3px;
            /*height:107px;*/
        }

        #calendar table caption {
            width:244px;
            /*height:14px;*/
            padding: 7px 0;                                                     /* 5px 0*/
            float: left;
            display: inline;
        }

                #calendar #mois {
                    text-transform: uppercase;
                    font-size:1.2em;
                    width:206px;
                    float:left;
                    display : inline;
                }

                #calendar #mois_avant {
                    width: 14px;
                    float:left;
                    display : inline;
                    margin-left:5px;
                }
                #calendar #mois_apres {
                    width: 14px;
                    float:left;
                    display : inline;
                    margin-right:5px;
                }

        #calendar table thead {
            width: 244px;
            float: left;
            display: inline;
        }

            #calendar table tbody,
            #calendar table tr {
                margin:0;
                padding:0;
                border:none;
                width: 244px;
            float: left;
            display: inline;
                
            }

            #calendar td:first-child,
            #calendar th:first-child {
                border-left: none;
            }

                #calendar th {
                    width: 34px;
                    height:9px;
                    margin:0;
                    padding:0 0 4px 0;
                    font-size: 1.3em;
                    font-weight: bold;
                    border:none;
                    border-left: 1px solid #d6d6d6;
                }

                    #calendar td {
                        width: 24px;
                        border:none;
                        border-left: 1px solid #d6d6d6;
                        text-align:right;
                        margin:0;
                        padding: 0 10px 0 0;
                        border-spacing: 0;
                        font-weight: normal;
                        font-size:1.1em;
                    }
                    
                    #calendar td abbr {

                    }

    #calendar .horsperiode {
        color:#A7A7A7;
    }

    #calendar .occupe a{
        /*background-color: #cecece;*/
        padding: 0 2px;
    }
    #calendar .today {
        /*border: 1px solid #f00;*/
    }
    #calendar .today span {
        background-color: rgba(255,0,0,1);
        font-weight: bold;
        color: #fff;
        padding:0 2px;
    }
    
    #calendar .today span a,
    #calendar .today span a:visited {
        color: #fff;
    }

    #calendar .multi {
        /*border-top: 2px solid #cecece;*/
        background-color: #eeeeee;
    }

    #calendar .simple a {
        background-color: #f9c7c5; 
        /*background-color: #cecece;*/
    }

    #calendar td div.calendar-cache {
        display: none;
    }
    
    #calendar .contentforday {
        display:none;
    }
    
    #calendar ul,
    #calendar li{
        list-style-type: none;
        display: block;
    }
    

abbr {
    border:none;
}

ul.pied {
    float:left;
    width:1008px;
    margin: 40px 0;
    width:1008px;
    clear:left;
    list-style:none;
    font-size: 1.2em;
    text-align: center;
}

    ul.pied li {
        display:inline;
        border-right: 1px solid #676767;
        padding:0 5px 0 4px;
    }

    ul.pied li#dernier {
        border-right: none;
    }
    
/***** qTip *****/

.ui-tooltip-default{
    border-color: #FF0000;
    background-color: #FFFFFF;
    color: #FF0000;
}

.ui-tooltip-red  {
    border-color: #FF0000;
    background-color: #FFFFFF;
    color: #FF0000;

}

ui-tooltip-shadow{
	-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
	-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
	box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
}