/*
 * Styles pour BETA
*/

/* -------------------- Template ------------------------- */
/*
@font-face{
    font-family: "tangerine";
    src: url(/resources/fonts/Tangerine-Regular.ttf);
}

@font-face{
    font-family: "tangerineBold";
    src: url(/resources/fonts/Tangerine-Bold.ttf);
}
@font-face{
    font-family: "slabo";
    src: url(/resources/fonts/Slabo27px-Regular.ttf);
}
*/

@font-face{
    font-family: "cormorantGaramond";
    src: url(CormorantGaramond-Regular.ttf);
}


body{
    margin: 0px; background-color: #EEEEEE;
}

.header-mini{
    display: block;
    margin: 0px; 
    width: 100%; 
    /*padding: 0px;*/
    background: url(bannierebarre.png); 
    /*height: 120px; */
    background-repeat: repeat;
}

.header{
    display: none;
    margin: 0px; 
    width: 100%; 
    padding: 0px;
    background:  url(bannierebarre.png); 
    height: 120px; 
    background-repeat: repeat;
}

.btn-mini{
    display: inline-block; padding: 0.5em; font-size: 0.7em; text-align: center;
    background-color: #168107; color: white; text-decoration: none; border-radius: 3px;
}

.titre-mini{
    width: 93%; color: #FFF; font-size: 0.6em; font-family: sans-serif; text-align: center;
}

.drapeau-bande-rouge{
    display: block;
    margin: 0px; 
    width: 100%;
    background-color: #E2341D; 
    text-align: center; 
    font-size: 1.1em;
    height: 15px;
}

.drapeau-bande-verte{
    display: block;
    margin: 0px; 
    width: 100%; 
    background-color: #158212; 
    text-align: center; 
    font-size: 1.1em;
    height: 15px;
}

.barre-menu{
    display: none;
    width: 100%; 
    background: #FFFFFF; 
    margin-top: 2px; 
    /*height: 25px;*/
    border-top: #158212 solid 1px; 
    border-bottom: #158212 solid 2px; 
    padding-top: 5px;
}

.barre-utile{
    display: block;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    border-bottom: solid 1px #e1dcdc;
}

.contenu{
    display: block;
    margin-bottom: 20px; 
    width: 100%; 
    padding-top: 2%; 
    background-color: #FFFFFF;
    /*border: #0b4e77 solid 1px;*/
}

.content-utile-mini{
    display: block;
    width: 98%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 10px;     
    vertical-align: top;
}

.content-utile-gauche{
    display: none;
}

.content-utile-droite{
    display: none;
}

.footer{
    display: block;
    /*    border-radius: 20px 20px 0px 0px;*/
    background-color: #e9b70a;
    color: white;
    width: 100%;
    height: 20px;
    /*box-shadow: 0px 2px 2px #000;*/
}

.etat_header{
    position: fixed;
    overflow: auto;
    top: 103px;
    right: 0px;
    left: 0px;
    height: 150px;
}

.etat_body{
    position: fixed;
    overflow: auto;
    top: 254px;
    right: 0px;
    left: 0px;
    bottom: 1px;
}

.table_faces:hover{
    background-color: black;
}

.login {
    background: none repeat scroll 0 0 #fff;
    border-radius: 8px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    margin-left: 10em;
    filter: alpha(opacity=80);
    opacity: 0.8;
    padding: 1.5em 0 1em;
    width: 22em;
    margin-left: 40%;    
}

.page_title{
    width: 90%; 
    margin: auto; 
    font-size: 1.4em; /*1.8em; */
    color: #009933; 
    border-bottom: #009933 solid 1px; 
    font-family: serif;
}

.contenu-accueil{
    width: 90%; 
    margin: auto; 
    font-size: 20px; /*1.2em; */
    text-align: justify; 
    line-height: 1.6em;
    color: #000; /*#4c4d4c*/
    font-family: "cormorantGaramond";
}

.lien-utile{
    display: table-row;
    text-decoration: none; 
    color: #5d6154;
    font-size: 11pt;
    border-bottom: #5d6154 solid 1px;
    font-family: arial;
}

.lien-utile:hover{
    text-decoration: none; 
    color: #7f8389;
    font-size: 11pt;
    font-family: arial;
}

.element_de_cote{
    border: #CCC ridge 1px;
    background-color: white;
}

.entete_element_de_cote{
    border-bottom: #CCC solid 1px;
    padding: 0.9em;
    padding-bottom: 1.1em;
    font-family: monospace;
    font-size: 1.3em;
    color: #009933;
}

.corps_element_de_cote{
    padding: 0.5em;
}

.btn-utile-first{
    display: inline-block;
    text-align: center;
    vertical-align: middle;    
    border-left: solid 1px #e1dcdc;
    border-right: solid 1px #e1dcdc;
    padding: 0.3em;/*0.4em;*/
    cursor: pointer;
    color: #858383;
    font-size: 0.8em;/*1.2em;*/
    text-decoration: none;
    font-family: arial;
}
.btn-utile{
    display: inline-block;
    text-align: center;
    vertical-align: middle;    
    border-right: solid 1px #e1dcdc;
    padding: 0.3em;/*0.4em;*/
    cursor: pointer;
    color: #858383;
    font-size: 0.8em;/*1.2em;*/
    text-decoration: none;
    font-family: arial;
}

.btn-utile-lien{
    display: none;
    text-align: center;
    vertical-align: middle;    
    border-right: solid 1px #e1dcdc;
    padding: 0.3em;/*0.4em;*/
    cursor: pointer;
    color: #858383;
    font-size: 0.8em;/*1.2em;*/
    text-decoration: none;
    font-family: arial;
}

.btn-inscrire{
    font-size: 0.8em; color: #009936; text-decoration: none;
}

.btn-communique{
    font-size: 0.8em; text-decoration: none;
}

.title-liste-concours{
    font-size: 1em; color: #009936;
}

.row-liste-concours-1{
    background-color: #FFF !important;
    padding: 0.5em;
}

.row-liste-concours-2{
    background-color: #e6fae4 !important;
    padding: 0.5em;
}

.col-liste-concours-1{
}

.liste-concours{
    border: #f0f0f0 1px solid; padding:0px;
    font-size: 0.8em;
}

.sepator{
    width: 100%; border-bottom: #8b8b8b 1px solid;margin-top: 7px; margin-bottom: 7px;
}

.panel-champs-admin{
    width: 92%; margin: auto; background: #f6f6f6; box-shadow: 0px 0px 3px #000;
}

.entete-panel-champs-admin{
    width: 92%; margin: auto; font-size: 0.9em;
}

.panel-champs-items-group-admin{
    width: 98%; margin: auto; font-size: 0.8em;
}

.avis-paragrahe{
    background: #F2F2F2; width: 90%; 
    padding: 10px;
    text-align: justify;
    line-height: 1.4em;
    margin: auto; overflow: auto; font-size: 0.9em;
}

.page-explain{
    width: 85%; margin: auto; font-size: 0.9em;
    line-height: 1.4em;
    text-align: center;
}
.page-explain-gauche{
    width: 85%; margin: auto; font-size: 0.9em;
    line-height: 1.4em;
    text-align: left;
}
.tel-telsecond-1{
    display: table-cell;
    vertical-align: top;
    width: 45%;    
}

.tel-telsecond-2{
    display: table-cell;
    vertical-align: top;
    width: 1%;
}

.tel-telsecond-3{
    display: table-cell;
    vertical-align: top;
    width: 46%;
    padding-left: 2%;
}
.text-warning{
    width: 90%; margin: auto; font-size: 1em;
    line-height: 1.4em;
    text-align: center;
    color: #cc0000 !important;

}

@media screen and (min-width: 300px){
    .btn-mini{
        display: block; padding: 0.5em; margin: 0.5em; font-size: 0.7em; text-align: center;
        background-color: #168107; color: white; text-decoration: none; border-radius: 3px;
    }

    .titre-mini{
        width: 97%; color: #FFF; font-size: 0.9em; font-family: sans-serif; text-align: center;
    }
}

@media screen and (min-width: 400px){
    .btn-mini{
        display: block; padding: 0.5em; margin: 0.5em; font-size: 0.8em; text-align: center;
        background-color: #168107; color: white; text-decoration: none; border-radius: 3px;
    }

    .titre-mini{
        width: 97%; color: #FFF; font-size: 1em; font-family: sans-serif; text-align: center;
    }
    .btn-inscrire{
        font-size: 0.9em; color: #009936; text-decoration: none;
    }

    .btn-communique{
        font-size: 0.9em; text-decoration: none;
    }
    .liste-concours{
        border: #f0f0f0 1px solid; padding:0px;
        font-size: 0.9em;
    }
}

@media screen and (min-width: 750px){
    .header-mini{
        display: none;
        margin: 0px; 
        width: 100%; 
        /*padding: 0px;*/
        background: url(bannierebarre.png); 
        /*height: 120px; */
        background-repeat: repeat;
    }

    .header{
        display: block;
        margin: 0px; 
        width: 100%; 
        padding: 0px;
        background: url(bannierebarre.png); 
        height: 120px; 
        background-repeat: repeat;
    }

    .header-gauche{
        width: 50%; 
        color: #FFFFFF; 
        font-size: 1.2em;/*1.7em; */
        font-family: serif; 
        vertical-align: top;
        padding-top: 1em; 
        padding-left: 3em;/*4em;*/
    }

    .header-droite{
        width: 50%; 
        vertical-align: top;
        padding: 0px;
        margin: 0px; 
    }

    .header-droite-image{
        width: 100%; height: 118px;
    }

    .barre-menu{
        display: block;
        width: 100%; 
        background: #FFFFFF; 
        margin-top: 2px; 
        /*height: 25px;*/
        border-top: #158212 solid 3px; 
        border-bottom: #158212 solid 3px; 
        padding-top: 5px;
    }

    .item-menu-fisrt{
        display: inline-block;
        /*min-width: 50px;*/
        text-align: center;
        vertical-align: middle;    
        border-right: solid 3px #FFF;
        border-left:  solid 3px #FFF;
        border-top:  solid 3px #FFF;
        border-bottom: none;
        background: #fffff9;/*#E2341D; #e10606;*/
        padding: 0.3em;/*0.4em;*/
        cursor:pointer;
        color: #009933;
        font-size: 1em;/*1.2em;*/
        text-decoration: none;
        font-family: serif;
          -webkit-box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
        box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
    }

    .item-menu{
        display: inline-block;
        /*min-width: 50px;**/
        text-align: center;
        vertical-align: middle;    
        border-right: solid 3px #FFF;
        border-top:  solid 3px #FFF;
        border-bottom: none;
        background:  #fffff9;/*#E2341D;  #e10606;**/
        padding: 0.3em;/**0.4em;**/
        cursor: pointer;
        color: #009933; /* #FFFFFF;*/
        font-size: 1em;/**1.2em;**/
        text-decoration: none;
        font-family: serif;
          -webkit-box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
        box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
    }

    .item-menu-fisrt:hover, item-menu-fisrt:active, .item-menu:hover, .item-menu:active, .btn-utile:hover, .btn-utile:active{ 
        display: inline-block;
        background: #f0f6f0; /* #f70909;   */ 
    }

    .barre-utile{
        display: block;
        margin-left: auto;
        margin-right: auto;
        background-color: white;
        border-bottom: solid 1px #e1dcdc;
    }

    .content-utile-gauche{
        display: none;
    }

    .content-utile-droite{
        display: none;
    }

    .content-utile-mini{
        display: block;
        width: 98%;
        margin-right: auto;
        margin-left: auto;
        margin-top: 10px;     
        vertical-align: top;
    }

    .btn-utile-first{
        display: inline-block;
        text-align: center;
        vertical-align: middle;    
        border-left: solid 1px #e1dcdc;
        border-right: solid 1px #e1dcdc;
        padding: 0.3em;/*0.4em;*/
        cursor: pointer;
        color: #858383;
        font-size: 1em;/*1.2em;*/
        text-decoration: none;
        font-family: arial;
    }
    .btn-utile{
        display: inline-block;
        text-align: center;
        vertical-align: middle;    
        border-right: solid 1px #e1dcdc;
        padding: 0.3em;/*0.4em;*/
        cursor: pointer;
        color: #858383;
        font-size: 1em;/*1.2em;*/
        text-decoration: none;
        font-family: arial;
    }

    .btn-utile-lien{
        display: inline-block;
        text-align: center;
        vertical-align: middle;    
        border-right: solid 1px #e1dcdc;
        padding: 0.3em;/*0.4em;*/
        cursor: pointer;
        color: #858383;
        font-size: 1em;/*1.2em;*/
        text-decoration: none;
        font-family: arial;
    }
    .liste-concours{
        border: #f0f0f0 1px solid; padding:0px;
        font-size: 12pt;
    }
}

@media screen and (min-width: 800px){
    .header-mini{
        display: none;
        margin: 0px; 
        width: 100%; 
        /*padding: 0px;*/
        background: url(bannierebarre.png); 
        /*height: 120px; */
        background-repeat: repeat;
    }

    .header{
        display: block;
        margin: 0px; 
        width: 100%; 
        padding: 0px;
        background: url(bannierebarre.png); 
        height: 120px; 
        background-repeat: repeat;
    }

    .header-gauche{
        width: 50%; 
        color: #FFFFFF; 
        font-size: 1.3em;/*1.7em;*/ 
        font-family: serif; 
        vertical-align: top;
        padding-top: 1em; 
        padding-left: 3em;/*4em;*/
    }
    
    .titre_admin{      
        padding-top: 1em;
        padding-bottom: 0.5em;
        padding-left: 2%;
        width: 30%;
        color: #009933; 
        font-size: 1.3em;
    }

    .titre_table{      
        color: #009933; 
        font-size: 1.2em;
}
}

@media screen and (min-width: 1100px){
    .header-gauche{
        width: 50%; 
        color: #FFFFFF; 
        font-size: 1.7em;/*1.7em; */
        font-family: serif; 
        vertical-align: top;
        padding-top: 1em; 
        padding-left: 3em;/*4em;*/
    }
    .contenu{
        display: inline-block;
        margin-top: 1%; 
        width: 55%; 
        margin-right: 1%;
        margin-left: 1%; 
        padding-top: 2%; 
        background-color: #FFFFFF;
        border: #0b4e77 solid 1px;
    }

    .content-utile-gauche{
        display: inline-block;
        margin-top: 1%;
        margin-left: 1%;
        width: 20%; 
        vertical-align: top;
    }

    .content-utile-droite{
        display: inline-block;
        margin-top: 1%; 
        width: 20%; 
        vertical-align: top;
    }

    .page_title{
        width: 90%; 
        margin: auto; 
        font-size: 1.5em; 
        color: #009933; 
        border-bottom: #009933 solid 1px; 
        font-family: serif;
    }

    .contenu-accueil{
        width: 90%; 
        margin: auto; 
        font-size:  20px; 
        text-align: justify; 
        line-height: 1.6em;
        color: #000; /*#5d6154*/
        font-family: "cormorantGaramond";
    }

    .item-menu-fisrt{
        display: inline-block;
        text-align: center;
        vertical-align: middle;    
        border-right: solid 3px  #fff;/*#800505;*/
        border-left:  solid 3px #fff;/*#800505;*/
        border-top:  solid 3px #fff;/*#800505;*/
        border-bottom: none;
        background:  #fffff9;/*#E2341D;  #e10606;**/
        padding: 0.4em;
        cursor:pointer;
        color:  #009933; /*#FFFFFF;*/
        font-size: 1.2em;/*1.2em;*/
        text-decoration: none;
        font-family: serif;
          -webkit-box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
        box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
    }

    .item-menu{
        display: inline-block;
        /*min-width: 50px;*/
        text-align: center;
        vertical-align: middle;    
        border-right: solid 3px #fff;/*#800505;*/
        border-top: solid 3px #fff;/*#800505;*/
        border-bottom: none;
        background: #fffff9;/*#E2341D;  #e10606;**/
        padding: 0.4em;
        padding: 0.4em;/*0.4em;*/
        cursor: pointer;
        color: #009933; /*#FFFFFF;*/
        font-size: 1.2em;/*1.2em;*/
        text-decoration: none;
        font-family: serif;
        -webkit-box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
        box-shadow: 0 8px 20px 0 rgba(84,84,84,0.2);
    }

    .item-menu-fisrt:hover, item-menu-fisrt:active, .item-menu:hover, .item-menu:active, .btn-utile:hover, .btn-utile:active{
        display: inline-block;
        background: #f0f6f0; /*#f70909; */   
    }

    .barre-utile{
        display: none;
        margin-left: auto;
        margin-right: auto;
        background-color: white;
        border-bottom: solid 1px #e1dcdc;
    }

    .element_de_cote{
        border: #CCC ridge 1px;
        background-color: white;
    }

    .entete_element_de_cote{
        border-bottom: #CCC solid 1px;
        padding: 0.9em;
        padding-bottom: 1.1em;
        font-family: serif;
        font-size: 1.3em;
        color: #009933;
    }

    .corps_element_de_cote{
        padding: 0.5em;
        font-family: arial;
        font-size: 9pt;
        color: #5d6154;
        line-height: 1.5em;
    }

    .btn-inscrire{
        font-size: 1em; color: #009936; text-decoration: none;
    }

    .title-liste-concours{
        font-size: 1.1em; color: #009936;
    }

    .liste-concours{
        border: #f0f0f0 1px solid; padding:0px;
        font-size: 12pt;
    }
    
    .content-utile-mini{
        display: none;
    }
    
    .titre{
        display: inline-block;
        padding-top: 1.3em;
        padding-bottom: 0.5em;
        padding-left: 10%;
        width: 30%;
        vertical-align: top;
        color: #009933; 
    }

    .titre_table{      
        color: #009933; 
        font-size: 1.2em;
    }
}

@media screen and (min-width: 1200px){
    .corps_element_de_cote{
        padding: 0.5em;
        font-family: arial;
        font-size: 11pt;
        color: #5d6154;
        line-height: 1.5em;
    }
    .titre{
        display: inline-block;
        padding-top: 1.5em;
        padding-bottom: 0.5em;
        padding-left: 10%;
        width: 30%;
        vertical-align: top;

    }
}




/*------------------- prime faces -------------------*/


.ui-widget-content.menu{
    background: #fee5aa;
}
.ui-menuitem-text{
    color: #009933; 
    font-size: 1em;
}

.ui-menuitem-text:hover{
    color: #FFFFFF;
}

.ui-menuitem-link:hover{
    background: #B00000;
    color: #FFFFFF;
}


.ui-panel{
    width: 90%; margin: auto;  font-size: 1em; font-family: serif;
    border: none;
}
.ui-panel-titlebar {
    padding: 0.5em 1em 0.3em;
    background-color: #ffffff;

}


.ui-tabs .ui-tabs-nav LI A {
font-size: 1em; color: #009936; text-decoration: none; line-height: 1.2em;
}
/*.u
i-menuitem-text:active{
    color: #FFFFFF;
}

.ui-menuitem-link:active{
    background: #009933;
    color: #FFFFFF;
}*/


/*.ui-menuitem-link ui-corner-all ui-state-hover {
    background-color: black;
}*/
