@CHARSET "UTF-8";

* { margin: 0; padding: 0; }

.masquer { display: none; }

body { background-color: #efefef; }

/* Affichage 2 colonnes */

    header { }
    #content { position: relative; }
    #panneau_gauche { float: left; left: 0; top: 0; width: 250px; margin-left: 5px; overflow: hidden; }
    #panneau_fil_ariane { margin-left: 260px; margin-right: 5px; margin-top: 5px; }
    #panneau_centre { margin-left: 260px; margin-right: 5px; overflow: hidden; padding: 15px; }
    #panneau_droit { position: absolute; right: 0; top: 0; margin-right: 5px; }
    footer { float: left; width: 100%; }

/*  */

/* Dans la partie gauche */

    /* logo */
    .logo { display: block; margin:0 auto 10px auto; }

    /* menu a gauche */
    #navigation { width: 100%; font-size: 15px; }
    #navigation li {  }
    #navigation li a { display: block; line-height: 1.2em; text-align: left; text-decoration: none; color: #000; }
    #navigation li.active a {  }
    #navigation li a:hover, #navigation li a:focus, #navigation li a:active { text-decoration: underline; }
    #navigation .categorie_menu { text-transform: uppercase; font-size: 1.1em; font-weight: bold; }
    #navigation li { margin-top: 25px; margin-left: 20px; }
    #navigation li li { margin-top: 5px; margin-left: 15px; }

/* fil d'Ariane */

    #panneau_fil_ariane a, #panneau_fil_ariane span { display:inline-block; padding: 10px 10px; border: 1px solid #c1c1c1; border-bottom-color: #121212; border-top: none; margin-bottom: -1px; text-decoration: none; margin-right: -1px; color: gray; }
    #panneau_fil_ariane a.current, #panneau_fil_ariane span.current { background: none; background-color: white; border-color: #121212; border-bottom-color: white; color: black; }
    #panneau_fil_ariane span.sep { display: none; }

/* panneau centre */

    #panneau_centre { border: 1px solid #121212; background-color: #ffffff; }

/* panneau droite */

    #menu_appli { list-style-type:none; }
    #menu_appli li { display: inline-block; }
    #menu_appli li a { display: inline-block; padding: 10px 10px; border: 1px solid #c1c1c1; border-bottom-color: #121212; border-top: none; margin-bottom: -1px;text-decoration: none; margin-left: -1px; color: gray; background: none; }
    #menu_appli li a.current { background: none; background-color: white; border-color: #121212; border-bottom-color: white; color: black; }
    #menu_appli li a.current:HOVER, #menu_appli li a.current:focus, #menu_appli li a.current:active { background: none; background-color: #e1ffe1; color: #005e00; }
    #menu_appli li a.bouton_deconnexion { margin-left: 20px; font-style: italic; }
    #menu_appli li a.bouton_deconnexion:hover, #menu_appli li a.bouton_deconnexion:focus, #menu_appli li a.bouton_deconnexion:active { background: none; background-color: #ffe8e8; color: #a80000; }

/* couleurs fil d'ariane et panneau droite */

#panneau_fil_ariane a, #panneau_fil_ariane span, #menu_appli li a { 

    background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */

}

/* header */

    h1 { font-family: SansationBold, "arial black", gadget, arial, sans-serif; color: #DF3F3F; font-size: 1.6em; text-shadow: 2px 2px 5px #000000; }

/* Partie celtrale */

    h2 { font-family: "courier new", courier, serif; color: maroon; font-size: 1.2em; text-align: center; }

/* l'entite fiche */

    .fiche { overflow: hidden; }

    .fiche fieldset { margin-top: 25px; border: 1px solid #121212; border-radius: 5px; padding: 5px 10px; }
    
    .fiche legend {
        padding: 1px 5px;
        border: 1px solid #121212;
        margin-left: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        background-color: white;
        color: #000000;
        font-style: italic;
        font-weight: bold;
    }

/*stdform*/

    form.stdform { width: 600px; font-size: 1em; color: #333; margin: auto; display: block; }
    form.stdform.large { width: 100%; }
    form.stdform label { color: #333; font-size: 1em; } 
    form.stdform li { padding: 6px 0 6px 0; list-style: none; width: 96%/*2% a gauche*/;  border-top: 1px solid #b0daf9; margin: 0 2%; }
    form.stdform li:FIRST-CHILD { border: none; }
    form.stdform label { display: inline-block; width: 43%; line-height: 1.8; list-style: none; }
    form.stdform .form_message { font-style: italic; font-weight: bold; text-align: center; margin-bottom: 5px; }

    form.stdform input[type="text"], form.stdform input[type="password"], form.stdform input[type="email"], form.stdform input[type="tel"], form.stdform input[type="number"], form.stdform input[type="date"], form.stdform input[type="datetime-local"], form.stdform select, form.stdform textarea { margin: 0; padding: 1px; font-size: 1em; }
    form.stdform input[type="text"], form.stdform input[type="password"], form.stdform input[type="email"], form.stdform input[type="tel"], form.stdform input[type="date"], form.stdform input[type="datetime-local"], form.stdform select { width: 55%; }
    form.stdform input[type="number"] { width:100px; }
    form.stdform input[type="date"] { width:150px; }
    form.stdform input[type="datetime-local"] { width:200px; }
    form.stdform textarea { height: 150px; width: 98%; font-size: 1.3em; resize:vertical; }

    form.stdform em { font-weight: bold;  color: #f00; }

    form div.button_container { text-align: center; background-color: #eee; margin-top: 10px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; overflow: hidden; }
    form input[type="submit"] { background-color: transparent; margin: 0 0 0 0; border: none; border-top: 1px solid #121212; display: block; line-height: 24px; text-align: center; text-decoration: none; padding: 5px; color: black; height: 40px; font-size: 1.2em; cursor: pointer; width: 100%; }
    form input[type="submit"]:hover, form input[type="submit"]:focus, form input[type="submit"]:active  { background-color: white; }

    form.stdform fieldset { 
        border: 1px solid #121212; border-radius: 5px; 
        margin-top: 25px;
     }

    form.stdform legend {
        font-weight: bold;
        margin-left: 10px;
        border: 1px solid #121212; border-radius: 5px; 
        background-color: white;
        padding: 1px 5px;
    }

    form.stdform p.message_formulaire {
        color: red;
        padding: 5px;
        font-style: italic;
        text-align: center;
        margin: 5px;
    }

/* les tableaux */

    .tableau_std { width: 100%; text-align: center; border-spacing: 0; border-collapse: collapse; border-bottom: #121212 2px solid;}
    .tableau_std thead tr { }
    .tableau_std thead tr th { padding: 5px 10px; }
    .tableau_std tbody tr { background: #f0f0f0; border-bottom: 1px #b0daf9 solid }
    .tableau_std tbody tr.odd { background: #FFFFFF; }
    .tableau_std tbody tr:HOVER { background-color: #a3d3f8; }
    .tableau_std img { height: 75px; }
    .tableau_std tbody td.small { font-size: 0.8em; }
    .tableau_std tbody td.left { text-align: left; padding-left: 5px; }
    .tableau_std tbody td.right { text-align: right; padding-right: 5px; }
    .tableau_std tbody td.justify { text-align: justify; padding-left: 5px; padding-right: 5px; }
    .tableau_std tbody td.nowrap { white-space: nowrap; }
    .tableau_std .btn { width: 20px; }
    .tableau_std label { display: block; padding: 3px 10px 0px 10px; }
    .petit { font-size: small; padding: 0 2px; font-style: italic; }
    .borderleft { border-left: solid 1px gray; }
    .borderright { border-right: solid 1px gray; }

    .tableau_std label a.cliquable {
        text-decoration: none;
        display: inline-block;
        font-size: 1em;
        color: #444;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        padding: 1px 20px;
        font-style: italic;
    }

    .tableau_std label a.cliquable:HOVER {
        color: #000000;
        background-color: #FFEEAA;
        padding: 0 25px;
        border: 1px solid #aaa;
    }

    .largeurs_egales .tableau_std { table-layout:fixed; }

/**/

    .tableau_std label a.lien {
        text-decoration: none;
        color: black;
        font-size: 1em;
        display: block;
    }

    .tableau_std label a.lien:HOVER {

    }

    .tableau_std tr.param_off label a {
        color: red;
        font-weight: bold;
    }

    .tableau_std tbody tr.surbrillance {
        font-weight: bold;
    }
    .tableau_std tbody tr.surbrillance td label a {
        color: red;
    }


.tableau_std thead tr {
    border-bottom: #121212 2px solid;
}

.tableau_std tbody tr { border-bottom: none; border-top: 1px #121212 solid; }
.tableau_std tbody tr:FIRST-CHILD { border-top: none; }

div.bouton_tableau {
    text-align: right;
}

a.imprimer span {
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("../images/icones/agt-imprimer-icone-6102-32.png");
    margin: 5px;
}

a.format_csv span {
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("../images/icones/excelFile_32.png");
    margin: 5px;
}

a.rechercher span {
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url("../images/icones/recherche_32.png");
    margin: 5px;
}

a.trier span {
    display: inline-block;
    width: 8px;
    height: 16px;
    background-image: url("../images/icones/double_fleches_v_8.png");
    margin: 0 0 0 5px;
}

.tableau_champ_recherche {
    width: 95%;
    display: block;
}

.num_page_tableau {
    display: inline-block;
    padding: 2px 5px;
    border: 1px #121212 solid;
    margin: 0 5px;
    margin-top: 5px;
}

.barre_pages_tableau {
    margin: auto;
    margin-top: 5px;
    width: 80%;
    text-align: center;
}

.num_page {
    font-weight: bold;
}

.num_page {
    font-weight: bold;
}

.num_page .mini
{
    font-weight: normal;
    font-size: 0.8em;
    display: none;
}

.num_page.current .mini
{
    display: inline;
}

/*Multi colonnes*/

.tableau_structure { border-spacing: 0; border-collapse: collapse; width: 100%; }
.tableau_structure_colonne { padding: 0 5px 0 5px; vertical-align: top; }
.tableau_structure { table-layout:fixed; }

/* accordion */

.accordion-bloc {
    /*
    -moz-box-shadow: inset 0px 0px 5px 0px #656565;
    -webkit-box-shadow: inset 0px 0px 5px 0px #656565;
    -o-box-shadow: inset 0px 0px 5px 0px #656565;
    box-shadow: inset 0px 0px 5px 0px #656565;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=5);
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    */
    background-color: #fff;
    overflow: hidden;
    margin-bottom: 15px; 
}

.accordion-toggler { cursor:pointer; font-weight:bold; margin: 0; padding:5px; font-size:14px; font-family: Georgia, "Times New Roman", Times, serif; text-align: center;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.3+100 */
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#4d000000',GradientType=0 ); /* IE6-9 */
}

.accordion-toggler:hover { }

.accordion-element { padding: 10px; }

/* gabarit */

.gabarit { font-size: 1.1em; }
.gabarit ul { list-style-type:none; }
.gabarit ul li { display: block; }
.gabarit ul li label { display: inline-block; width: 30%; font-weight: bold; font-style: italic; color: #666; }

/* wysiwyg */

.gabarit .container-wysiwyg { margin-top: -21px; margin-bottom: 21px; }
.contour_calendrier .gabarit, .contour_calendrier .container-wysiwyg { margin-top: 0; margin-bottom: 0; }

/* photo */

.fichier_photo { max-width: 60%; max-height: 200px; }

/* formulaire dynamique */

.form_dyn_bloc { display: inline-block; min-height: 26px; position: relative; width: 100%; }
.form_dyn_bloc.largeur_fixe { width: 225px; } /* champs comme les dates, ... */
.form_dyn_champ { display: block; margin-right: 30px; }
.form_dyn_champ input { height: 21px; }
.form_dyn_champ_ { width: 100%; }
.maj_dyn_etat { display: block; width: 24px; height: 24px; float: right; margin-top: -21px; } /* margin-right: 18px; */
.maj_dyn_etat.on { background-image: url("../images/icones/update.png"); z-index: 1000; }
.maj_dyn_etat.ko { background-image: url("../images/icones/ko.png"); z-index: 1000; }

.calendrier_mois_colonne_mois .form_dyn_bloc { width: 100%; min-height: none; min-height: 0; }
.calendrier_mois_colonne_mois .form_dyn_champ { margin-right: 0; }
.calendrier_mois_colonne_mois .form_dyn_champ_ { background-color: transparent; border: none; text-align: center; font-size: 0.9em; font-style: italic; color: #333; }

textarea { min-height: 120px; resize: vertical; }

/* calendrier 1 */

.contour_calendrier {}

.calendrier_structure { text-align: center; border-spacing: 0; border-collapse: collapse; margin-top: 10px; width: 100%; table-layout:fixed; }

.calendrier_jour_structure {
    border: solid 1px #aaa;
    position: relative;
    vertical-align: top;
}

.calendrier_jour_contenu {
    padding: 5px 1%;
    padding-top: 15px;
    display: block;
    text-align: left;
    width: 98%;
    min-height: 100px;
    font: 12px Arial,sans-serif;
    word-wrap: break-word;
}

.calendrier_jour_contenu a {
    text-decoration: none;
    color: #000;
    text-align: center;
}

.calendrier_jour_legende {
    position: absolute;
    left: 5px;
    top: 0px;
    font-weight: bold;
    font-size: 1.1em;
    color: #aaa;
}

.zone_cliquable_calendrier { display: block; border: 1px solid #111; margin-top: 5px; }

.calendrier_structure button {
    border: 1px solid #111;

    padding: 5px 10px;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    
    cursor: pointer;
    margin: 5px 15px 10px 15px; 
}

/* calendrier 2 */

.calendrier_mois_structure {
    border-collapse: collapse;
    table-layout:fixed;
}

.calendrier_mois_structure, .calendrier_mois {
    width: 100%;
    font-family: Arial;
}

.calendrier_mois_colonne_mois {
    vertical-align: top;
}

.calendrier_mois {
    border-spacing: 1px;
    margin-top: 10px;
}

.calendrier_mois th {
    background-color: #a8b0bd;
    color: rgb(255, 255, 255);
    font-size: 16px;
}

.calendrier_mois td {
    background-color: rgb(218, 233, 248);
}

.calendrier_mois .j_Sa td, .calendrier_mois .j_Di td {
    background-color: rgb(203, 207, 207);
}

.calendrier_mois .j_Di td {
    border-bottom: #FF2121 1px solid;
}

.calendrier_mois td.calendrier_num_semaine, .calendrier_mois tr:HOVER td.calendrier_num_semaine {
    background: none; background-color: rgb(197, 210, 235);
}

.calendrier_mois td.calendrier_num_semaine.fin {
    border-bottom: #FF2121 1px solid;
}

.calendrier_num_jour, .calendrier_lib_jour, .calendrier_num_semaine { width: 22px; text-align: center; }

.calendrier_structure a.lien, .calendrier_mois_structure a.lien {
    text-decoration: none;
    color: black;
    font-size: 1em;
    display: block;
}

.calendrier_mois tr:HOVER td {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a9db80+0,96c56f+100;Green+3D+%232 */
    background: rgb(169,219,128); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(169,219,128,1) 0%, rgba(150,197,111,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(169,219,128,1) 0%,rgba(150,197,111,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(169,219,128,1) 0%,rgba(150,197,111,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9db80', endColorstr='#96c56f',GradientType=0 ); /* IE6-9 */
}

/* calendrier 3 */

.position_zone_planning a {
    color: #000;
    text-decoration: none;
}

.zone_planning {
    border: 1px solid #ccc;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    margin-left: -1px;
    margin-right: 0px;
}

.zone_planning .plage_horaire { font: bold 10px Arial,sans-serif; text-align: left; }
.zone_planning .informations { font: 12px Arial,sans-serif; text-align: left; word-wrap: break-word; }

.quadrillage_jour_ligne_1 { background-color: #bbb; }
.quadrillage_jour_ligne_2 { background-color: #ddd; }

.quadrillage_jour span { display: block; color: #bbb; font-weight: bold; }

.calendrier_3 .entete { height: 50px; font-size: 13px; font-weight: bold; border-right: 1px solid #ddd; }
.calendrier_3 .last .entete { border-right: none; }

.calendrier_3 .quadrillage_jour { border-right: 1px solid #ddd; }
.calendrier_3 .last .quadrillage_jour { border-right: none; }

.calendrier_3 .corps { overflow: hidden; margin-left: -1px; padding-left: 1px; }

.calendrier_3 .courant,
.calendrier_jour_structure.courant
{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f6f6f6+13,ededed+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(246,246,246,1) 13%, rgba(237,237,237,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(246,246,246,1) 13%,rgba(237,237,237,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(246,246,246,1) 13%,rgba(237,237,237,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
}

.calendrier_3 .passe .zone_planning { opacity: 0.6; }
.calendrier_jour_structure.passe .zone_cliquable_calendrier { opacity: 0.6; } /* calendrier 1 */

/* bouton mobile */

.bouton_mobile { display: inline-block; padding: 5px 10px; border: 1px solid #c1c1c1; text-decoration: none; color: gray; background: none; margin-bottom: 3px; }
.tableau_std tbody tr:HOVER .bouton_mobile {
    background-color: #fff;
    -moz-box-shadow: 0px 0px 3px 0px #656565;
    -webkit-box-shadow: 0px 0px 3px 0px #656565;
    -o-box-shadow: 0px 0px 3px 0px #656565;
    box-shadow: 0px 0px 3px 0px #656565;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=3);
}
.bouton_mobile:HOVER,
.bouton_mobile:focus,
.bouton_mobile:active,
.tableau_std tbody tr:HOVER .bouton_mobile:HOVER,
.tableau_std tbody tr:HOVER .bouton_mobile:focus,
.tableau_std tbody tr:HOVER .bouton_mobile:active { background: none; background-color: #e1ffe1; color: #005e00; }

.zone_planning .titre { font-weight: bold; font-size: 10px; }