/* 
    Document   : global
    Created on : 26 sept. 2012, 10:14:57
    Author     : g.parmentier
    Description:
        Purpose of the stylesheet follows.
*/

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

html{
    font-family: Arial, sans-serif;
    font-size: 100%;
    background-color: #F7F7F7;
}
html, body, div, header, footer, menu, ul, li, h1, h2, h3, h4, h5, h6, p{
    padding: 0;
    margin: 0;
}

root { 
    display: block;
}

.help{
    position : relative;
    height: 20px;
    width: 20px;
    margin: 0 -20px -20px 0;
    background: transparent url(../img/help.png) no-repeat;
}
.clear{
    clear: both;
}

input[type="submit"], button, a.button
{
    /* Linear-Gradient */
    background: #404040; /* Old browsers */
    
    /*background: -moz-linear-gradient(top, #404040 0%, #202020 100%); /* FF3.6+ */
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#404040), color-stop(100%,#202020)); /* Chrome,Safari4+ */
    /*background: -webkit-linear-gradient(top, #404040 0%,#202020 100%); /* Chrome10+,Safari5.1+ */
    /*background: -o-linear-gradient(top, #404040 0%,#202020 100%); /* Opera 11.10+ */
    /*background: -ms-linear-gradient(top, #404040 0%,#202020 100%); /* IE10+ */
    /*background: linear-gradient(to bottom, #404040 0%,#202020 100%); /* W3C */
    
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#404040', endColorstr='#202020',GradientType=0 ); /* IE6-9 */

    border: 0px;
    padding: 15px 25px;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    /*font-size: 24px;*/
    font-size: 18px;

    font-weight: 300;

    color: white;
    /*border-radius: 4px;*/

    display: block;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;

    text-decoration: none;
    cursor: pointer;

    box-sizing: border-box;
    -moz-box-sizing:border-box;
}

/*input[type="submit"]:hover, button:hover, a.button:hover {background: #202020;}*/

a.button
{
    display: inline-block;
}

#form_actualite #form_container label,
#form_actualite #editor_container label
{
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    display: inline-block;
    width: 30%;
    font-size: 12px;
    font-weight: bold;
    color: #727272;
}

input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]),
#form_projet #adresse,
select
{
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    display: inline-block;
    background-color: #F7F7F7;
    box-shadow: 0px 1px 1px 0px #CECECE inset;
    line-height: 20px;
    border-radius: 4px;
    border: 0px;
    padding: 8px;

    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: #727272;
}

/* header */
#header{
    width: 100%;
    height: 50px;
    line-height: 50px;
    
    background: #404040!important;
}
#header #user{
    float: right;
    height: 50px;
    padding: 8px 15px 0px 0px;
    /*    max-width: 120px;*/
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    text-align: center;
    margin-left: 10px;
}
#header #user p
{
    margin: 0px;
    font-weight: bold;
    font-size: 0.8em;
    line-height: normal;
}
#header #user p a.deconnexion{
    font-size: 0.7em;
    font-weight: normal;
    color: #F7F7F7;
}

#header #logos
{
    height: 50px;
    display: inline-block;
}

#header #logos #logo_admin
{
    vertical-align: middle;
    height: 50px;
    position: relative;
    top: -2px;
}

#header #logos #logo_client
{
    max-height: 50px;
    max-width: 150px;
    vertical-align: middle;
    position: relative;
    top: -2px;
}

#select-programmes
{
    display: inline-block;
    height: 50px;
    vertical-align: top;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
}

#select-programmes #selecteur-programme
{
    height: 34px;
    margin-top: 8px;
    margin-bottom: 8px;
}



#select-programmes .dd{
    color: #1F1F1F;
    background: transparent url(../img/fond_dd.png) no-repeat;
    height: 50px
}

#select-programmes .dd .ddTitle{
    border: none;
    background: transparent;
    padding: 9px 6px;
    font-weight: bold;
}

#select-programmes .dd #selecteur-programme_child{
    margin: -8px 0 0 0;
    -webkit-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px; 
}
#select-programmes .dd .ddChild a {
    padding-top: 4px;
    padding-bottom: 4px;
    border-top: 1px solid #F2F2F2;
}

#select-programmes .dd .ddChild a.selected, #select-programmes .dd .ddChild a:hover {
    background-color: #F2F2F2;
}

#header #menu{
    font-size: 0.75em;
    display: inline-block;
    vertical-align: top;
}

#header #menu ul{
    list-style: none;
    display: inline-block;
}
#header #menu ul li{
    display: inline-block;
    /*padding: 0px 20px 0 20px;*/
}
#header #menu ul li a{
    color: #AFAEAE;
    text-decoration: none;
    text-shadow: -1px -1px 1px #000000;
    filter: dropshadow(color=#000000, offx=-1, offy=-1);
    
    display: inline-block;
    height: 50px;
    line-height: 50px;
    padding: 0px 20px 0 20px;
}
#header #menu ul li a:hover,
#header #menu ul li.active a{
    color: #FFFFFF;
/*    border-bottom: 3px solid #d12727;*/
}
.separateur-menu{
    float: left;
    padding: 21px 0 0 0;
}

/* content */
#content{
    position: relative;
    z-index: 200;
    clear: both;
    width: 980px;
    margin: 0 auto;
}
#content h2{
    font-size: 4em;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-weight: 200;
    text-align: center;
    margin: 60px 0 0 0;
}
#content h3{
    font-size: 1.5em;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-weight: 200;
}

div#action{
    clear: both;
    height: 35px;
    margin: -20px 0 0 0;
}
div#action .retour{
    float: left;
    width: 120px;
    height: 35px;
    cursor: pointer;
    background: transparent url( ../img/retour.png ) no-repeat;
}
div#action .export-xls{
    float: right;
    width: 120px;
    height: 35px;
    background: transparent url( ../img/export-xls.png ) no-repeat;
    cursor: pointer;
}

div#action .import-csv{
    float: right;
    width: 120px;
    height: 35px;
    background: transparent url( ../img/import-csv.png ) no-repeat;
    cursor: pointer;
}

#action #ajout-lot {
    display: inline-block;
    float: right;
    margin: 0;
    /*padding: 3px;*/
    padding: 7px;
    margin-left: 15px;
}
#action #ajout-lot:hover {background: #202020;}
/* login */
#login-form dl.zend_form{
    color: #727272;
    width: 360px;
    height: 240px;
    margin: 60px auto;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.5);
    padding: 0 25px;
    background-color: #FFFFFF;
}
#login-form dl.zend_form dt#username-label, dl.zend_form dd#username-element{
    margin-top: 37px;
}

#login-form dl.zend_form dt{
    width: 33%;
    padding: 8px 0;
    float: left;
    clear: left;
    margin-bottom: 20px;
    margin-left: 0;
}
#login-form dl.zend_form dd{
    width: 64%;
    float: left;
    clear: right;
    margin-bottom: 20px;
    margin-left: 0;
}
#login-form dl.zend_form dd input{
    height: 36px;
    width: 235px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: #f7f7f7;
}
#login-form dl.zend_form dt#login-label{
    width: 0;
}
#login-form dl.zend_form dd#login-element{
    width: 100%;
    text-align: center;
}
#login-form dl.zend_form dd input#login{
    background-color: #3d3d3d;
    color: #FFFFFF;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 1.7em;
    width: 160px;
    height: 60px;
    cursor: pointer;
    border-style: inset;
    margin-top: 10px;
}

/* home */
#liste-programme{
    color: #000000;
    background-color: #C3C3C3;
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.32, #a1a1a1), color-stop(0.8, #C3C3C3) );
    background-image: -moz-linear-gradient( center bottom, #a1a1a1 32%, #C3C3C3 80% );
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#C3C3C3', endColorstr='#a1a1a1');
    -webkit-border-radius: 5px;
    border-radius: 5px;
    width: 360px;
    margin: auto;
    margin-top: 60px;
    margin-bottom: 20px;
    padding: 0 0 10px 0;
}
#liste-programme h3{
    padding: 10px;
    font-weight: 500;
    margin: 0;
    text-shadow: 1px 1px 1px #FFFFFF;
    filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
}
#liste-programme ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
#liste-programme ul li{
    background: #ffffff; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIyMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIyMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI2OCUiIHN0b3AtY29sb3I9IiNmMmYyZjIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #ffffff 20%, #ffffff 20%, #f2f2f2 68%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(20%,#ffffff), color-stop(20%,#ffffff), color-stop(68%,#f2f2f2)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ffffff 20%,#ffffff 20%,#f2f2f2 68%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ffffff 20%,#ffffff 20%,#f2f2f2 68%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ffffff 20%,#ffffff 20%,#f2f2f2 68%); /* IE10+ */
    background: linear-gradient(to bottom,  #ffffff 20%,#ffffff 20%,#f2f2f2 68%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-8 */

    border: 0;
    font-size: 0.8em;
    color: #000000;
    border-top: 1px solid #717171;
    padding: 30px 20px;
    cursor: pointer;
}
#liste-programme ul li span.vignette{
    height: 70px;
    width: 85px;
    border: 1px solid #dbdbdb;
    float: left;
    overflow: hidden;
    margin: -28px 10px 0 -17px;
}
#liste-programme ul li span.vignette img{
    width: 100%;
}

#liste-programme ul li span.edit{
    color: #969696;
    padding: 0 20px 0 0;
    background: transparent url( ../img/editer.png ) no-repeat right center;
    float: right; 
}

#liste-programme ul li a.emulate_on
{
    float: right;
    font-weight: normal;
    font-size: 12px;
    font-family: Arial, sans-serif;
    text-decoration: none;
    color: #969696;
}

#liste-programme ul li a.emulate_on:after
{
    content: url(../img/editer.png);
    position: relative;
    top: 5px;
    left: 5px;
}

#liste-programme ul li span.logo
{
    height: 70px;
    width: 85px;
    float: left;
    overflow: hidden;
    margin: -28px 10px 0 -17px;
    line-height: 67px;
}

#liste-programme ul li span.logo img
{
    width: 85px;
    max-height: 70px;
    vertical-align: middle;
}

#liste-programme h3 a.projet_add,
#liste-programme h3 a.societe_add
{
    float: right;
    font-weight: normal;
    font-size: 12px;
    font-family: Arial, sans-serif;
    text-decoration: none;
    color: white;
    text-shadow: none;
    position: relative;
    bottom: 5px;
    right: 5px;
}

#liste-programme h3 a.projet_add:after,
#liste-programme h3 a.societe_add:after
{
    content: url(../img/plus.png);
    position: relative;
    top: 8px;
    left: 7px;
}


/* grilles */

table{
    margin: 60px 0 60px 0;
    border-collapse: collapse;
    width: 100%;
    background-color: transparent;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

table thead th{
    font-size: 0.75em;
    font-weight: bold;
    background-color: #212121;
    color: #FFFFFF;
    padding: 12px 0 8px 5px;
    text-align: left;
    cursor: pointer;
}

thead tr:first-child th:first-child{
    -webkit-border-radius: 5px  0 0;
    border-radius: 5px 0 0 0;
}
thead tr:first-child th:last-child{
    -webkit-border-radius: 0 5px 0 0;
    border-radius: 0 5px 0 0;
}

table tr td{
    color: #909090;
    font-size: 0.75em;
    padding: 5px 0 5px 5px;
    text-align: left;
    background-color: transparent;
    height: 40px;
}
table tr td.important{
    color: #000000;
}
table tr.odd td{
    background-color: #fffaf4;
    border-left: 2px solid #F7F7F7;
}
table tr.even td{
    background-color: #f4f0ea;
    border-left: 2px solid #F7F7F7;
}
table tr td:first-child{
    border: none;
}

table tfoot th{
    font-size: 0.8em;
    background-color: #FFFFFF;
    color: #FFFFFF;
    padding: 5px 0 8px 5px;
}
tfoot tr:last-child th:first-child{
    -webkit-border-radius: 0 0 0 5px;
    border-radius: 0 0 0 5px;
}
tfoot tr:last-child th:last-child{
    -webkit-border-radius: 0 0 5px 0;
    border-radius: 0 0 5px 0;
}

/* grille contact */
table#liste-contact .notes{
    display: none;
    height: 0;
    width: 1px;
    position: relative;
    top: 3px;
    left: -680px;
    overflow: visible;
}
table#liste-contact .notes span{
    display: block;
    background: #FFFFFF;
    width: 800px;
    padding: 12px;
}

table#liste-contact td
{
    text-align: center;
}

table#liste-contact td.important
{
    font-weight: bold;
}

table#liste-contact .autre_message
{
    display: none;
}

table#liste-contact .messages
{
    padding: 0px;
    margin: 0px;
}

table#liste-contact .message
{
    display: table;
    width: 980px;
    background-color: #929292;
    border-top: 1px solid #A6A6A6;
    color: #242424;
    text-align: left;
}

table#liste-contact .message h4
{
    color: white;
    font-weight: bold;
    font-size: 12px;
}

table#liste-contact .message h4 small
{
    font-size: 12px;
    font-weight: normal;
}

table#liste-contact .message .message_content,
table#liste-contact .message .message_action
{
    display: table-cell;
    vertical-align: middle;
    background-position: center;
}

table#liste-contact .message .message_action
{
    width: 50px;
}

table#liste-contact .message .message_action *
{
    margin: auto;
}

table tr td div.notes-on
{
    color: white;
    width: 21px;
    height: 18px;
    line-height: 16px;
    text-align: center;
    font-weight: bold;
    margin: auto;
    cursor: pointer;
    background: transparent url(../img/message_on.png) no-repeat;
}

table tr td.notes-td,
table tr td.stats-td
{
    position: relative;
}

table tr td div.notes-on.note-active:after
{
    content: url(../img/fleche_haut.png);
    position: absolute;
    bottom: -4px;
    left: 35px;
}

table tr td span.stats_contact.active:after
{
    content: url(../img/fleche_haut.png);
    position: absolute;
    bottom: -3px;
    left: 40px;
}

table tr td div.notes-off{
    width: 21px;
    height: 18px;
    margin: auto;
    background: transparent url(../img/message_off.png) no-repeat;
}
table tr td span.remove_contact,
table tr td span.remove_compte{
    display: block;
    padding: 0;
    margin: auto;
    width: 20px;
    height: 20px;
    background: transparent url( ../img/supprimer_on.png ) no-repeat 0 -2px;
    cursor: pointer;
}

table tr td span.stats_contact
{
    display: block;
    padding: 0;
    margin: auto;
    width: 30px;
    height: 25px;
    background: transparent url( ../img/stats_off.png ) no-repeat;
    cursor: pointer;
}
table tr td span.stats_contact.active
{
    background: transparent url( ../img/stats_on.png ) no-repeat;
}
table tr.notes{
    background-color: #9C9C9C;
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.32, #9C9C9C), color-stop(0.8,#696969 ) );
    background-image: -moz-linear-gradient( center bottom, #9C9C9C 32%, #696969 80% );
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#696969', endColorstr='#9C9C9C');
}
table tr.notes td{
    color: #FFFFFF;
    padding-left: 8px;
}

table tr.stats
{
    display: none;
}

table#liste-contact td.stats
{
    padding-left: 128px;
    height: 150px;
    text-align: left;
    background: #929292 url(../img/stats_watch.png) 16px 20px no-repeat;
}

table td.stats>h4
{
    color: white;
    font-size: 14px;
    font-weight: bold;
    border-bottom: 1px solid #A6A6A6;
    width: 97%;
    margin-top: 15px;
    padding-bottom: 9px;
    margin-bottom: 10px;
}

table td.stats>div
{
    display: inline-block;
    vertical-align: top;
    color: #242424;
    width: 20%;
    margin-right: 4%;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
}

table td.stats>div h5
{
    font-size: 12px;
    font-weight: bold;
}

table td.stats>div li
{
    list-style: none;
    line-height: 24px;
}

table td.stats>div .stats_total,
table td.stats>div .stats_total
{
    color: white;
}

table td.stats>div .stats_lot_dispo
{
    color: #65D116;
    font-weight: bold;
}

table td.stats>div .stats_lot_reserve
{
    color: #FF7D13;
    font-weight: bold;
}

table td.stats>div .stats_total .bold,
table td.stats>div .stats_lot_type
{
    font-weight: bold;
}

span.rappel{
    display: block;
    margin: 2px auto;
    width: 25px;
    height: 25px;
    background: transparent url( ../img/phone.png ) no-repeat;
}

span.no-rappel{
    display: block;
    margin: 2px auto;
    width: 46px;
    height: 46px;
    background: transparent url( ../img/no_phone.png ) no-repeat;
}


/* grille lot */
#help_listeLot{
    float: right;
    margin: -20px -10px -20px 0;
}

table#liste-lot{
    /*table-layout: fixed;*/
    margin-top: 20px;
}

#liste-lot td{
    word-wrap: break-word;
}

#liste-lot tr td form{
    padding: 0;
    margin: 0;
    width: 100% !important;
}
#liste-lot tr td form input{
    font-size: 0.9em;
    border: none;
    background-color: #FFFFFF;
    margin: 0;
    width: 95% !important;
}
#liste-lot tr td form select{
    font-size: 0.9em;
    margin: 0;
}
#liste-lot tr td form select option{
    width: 95%;
}
/*
#liste-lot .cat3{
    width: 55px !important;
}
#liste-lot .col-nom{
    width: 60px !important;
}
#liste-lot .col-tva{
    width: 60px !important;
}
#liste-lot .col-prix{
    width: 110px !important;
}
#liste-lot .col-loyer{
    width: 70px !important;
}
#liste-lot .col-etage{
    width: 60px !important;
}
#liste-lot .col-type{
    width: 55px !important;
}
#liste-lot .col-typelot{
    width: 120px !important;
}
#liste-lot .col-exposition{
    width: 95px !important;
    padding-right: 0;
}
#liste-lot .col-energie{
    width: 90px !important;
}
#liste-lot .infoPlus{
    width: 115px !important;
    overflow: hidden;
    text-overflow: ellipsis;
}
#liste-lot .col-statut{
    width: 113px !important;
}
#liste-lot .col-online,
#liste-lot .col-selection {
    width: 90px !important;
}
*/
/* colorisation colonnes */
#liste-lot tr.odd td{
    background-color: #FFFFFF;
}
#liste-lot tr.even td{
    background-color: #F4F4F4;
}
#liste-lot tr.odd td.cat1{
    background-color: #fffaf4;
}
#liste-lot tr.even td.cat1{
    background-color: #f4f0ea;
}
#liste-lot tr.odd td.cat2{
    background-color: #f7fcf3;
}
#liste-lot tr.even td.cat2{
    background-color: #edf1e9;
}
#liste-lot tr.odd td.cat3{
    background-color: #f3fcfb;
}
#liste-lot tr.even td.cat3{
    background-color: #e9f1f1;
}
/* colorisation colonnes offline */
#liste-lot tr.offline td{
    background: #ffefef url( ../img/motif_offline.png ) repeat;
}
#liste-lot tr.offline.odd td{
    background-color: #ffefef;
}
#liste-lot tr.offline.even td{
    background-color: #f4e5e4;
}
#liste-lot tr.offline.odd td.cat1{
    background-color: #ffebe4;
}
#liste-lot tr.offline.even td.cat1{
    background-color: #f4e1db;
}
#liste-lot tr.offline.odd td.cat2{
    background-color: #f7ece4;
}
#liste-lot tr.offline.even td.cat2{
    background-color: #ede2da;
}
#liste-lot tr.offline.odd td.cat3{
    background-color: #f3eceb;
}
#liste-lot tr.offline.even td.cat3{
    background-color: #e9e2e2;
}

/* documents */
#document{
    margin: 60px 0;
}
#liste-document{
    color: #000000;
    background-color: #C3C3C3;
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.32, #C3C3C3), color-stop(0.8, #6E6E6E) );
    background-image: -moz-linear-gradient( center bottom, #C3C3C3 32%, #6E6E6E 80% );
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#6E6E6E', endColorstr='#C3C3C3');
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#liste-document #addDocument{
    float: right;
    width: 156px;
    height: 49px;
    line-height: 29px;
    box-sizing: border-box;

    margin-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    cursor: pointer;

    font-size: 12px;
    color: white;

    background: url("../img/ajout_doc.png") right 0px no-repeat content-box;
    /*background-position: right 10px;
    background-repeat: no-repeat;
    background-clip: content-box;*/
}

#liste-document #addDocument:hover {
    background-position: right -30px;
}

#liste-document h3{
    padding: 10px;
    font-weight: 500;
    margin: 0;
    text-shadow: 1px 1px 1px #FFFFFF;
    filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
}
#liste-document table{
    margin: 0 0 5px 0;
    width: 480px;
}

#liste-document tbody tr:hover, #liste-document tbody tr.active{
    -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.5);
}
#liste-document thead tr th.online-document{
    text-align: center;
}
#liste-document tbody tr td.online-document{
    width: 60px;
}
#liste-document thead tr th.action-document{
    text-align: right;
    padding-right: 5px;
}
#liste-document tbody tr td.action-document{
    width: 115px;
}
#liste-document tr .statut-document{
    width: 50px;
    text-align: center;
}
#liste-document tr td.statut-document{
    color: #6ead1c;
}
#liste-document tbody tr td span.error{
    display: block;
    width: 100%;
    color: #FF0000;
    font-size: 0.8em;
}
#liste-document tbody tr td span.loading{
    display: block;
    width: 100%;
    color: #ecc50d;
    font-size: 0.8em;
}

#liste-document tbody tr div.attribuer{
    float: right;
    width: 25px;
    height: 25px;
    margin: 0 5px;
    background: transparent url(../img/attribuer_off.png) no-repeat;
    cursor: pointer;
}
#liste-document tbody tr div.show{
    float: left;
    width: 25px;
    height: 25px;
    margin: 0 5px;
    background: transparent url(../img/show.png) no-repeat;
    cursor: pointer;
}
#liste-document tbody tr div.supprimer{
    float: left;
    width: 25px;
    height: 25px;
    margin: 0 5px;
    background: transparent url(../img/supprimer_off.png) no-repeat;
    cursor: pointer;
}
#liste-document tbody tr div.supprimer:hover{
    background: url(../img/supprimer_on.png);
}

#liste-document tbody tr:hover div.attribuer, #liste-document tbody tr.active div.attribuer{
    background-image: url(../img/attribuer_on.png);
}

#liste-document tbody{
    display: block;
    max-height: 491px;
    width: 480px;
    overflow-y:scroll;
}
#liste-document thead{
    display: block;
    width: 480px;
}
#liste-document .dnom{
    width: 207px;
}

#liste-document .dpoids{
    width: 75px;
}
#liste-document .dstatut{
    width: 50px;
}
#liste-document .daction{
    width: 107px;
}
#liste-document th.daction{
    width: 123px;
}
#liste-document thead{
    width: 480px;
}

#liste-document tfoot tr th, #liste-document thead tr th{
    -webkit-border-radius: 0px;
    border-radius: 0px;
}
#liste-document tfoot tr th{
    background-color: transparent;
}
/* lot document */

.attribute-dossier-ready,
.attribute-lot-ready{
    background-color:#eaeaea !important;
    font-weight: bolder !important;
}

#lot{
    background: #FFFFFF;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding: 10px 0;
}
#lot #encart{
    margin: 0 10px;
    background: #eaeaea url( ../img/infos.png) no-repeat right center;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;

}
#lot #encart h4{
    font-size: 0.8em;
    text-shadow: 1px 1px 1px #FFFFFF;
    filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
}
#lot #encart p{
    font-size: 0.7em;
    text-shadow: 1px 1px 1px #FFFFFF;
    filter: dropshadow(color=#FFFFFF, offx=1, offy=1);
}
#lot #formCreateDossier{
    display: none;

    position: absolute;
    right: 5px;

    z-index: 200;
    height: 40px;
    width: 240px;
    line-height: 38px;

    border: 5px solid #6E6E6E;
    border-radius: 5px;
    background-color: #EAEAEA;
}

#lot div#formCreateDossier input[type="text"]
{
    background-color: white;
}

#lot #addDossier
{
    text-align: right;
    font-size: 0.75em;
    color: #414141;
    padding: 0 20px 0 0;
    margin: 5px 0 0 0;
    cursor: pointer;
}

#lot #addDossier .plus{
    display: inline-block;
    width: 14px;
    height: 14px;
    margin: 0 0 0 12px;
    background: transparent url(../img/plus_small.png) no-repeat;
}

#lot .ui-widget {
    font-family: Arial, sans-serif;
    font-size: 1em;
}
#lot #liste h3{
    border: 0;
    height: 40px;
    width: 100%;
    clear: both;
    border-bottom: 1px solid #DBDBDB;
    background-color: #FFFFFF;
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.32, #F2F2F2), color-stop(0.8, #FFFFFF) );
    background-image: -moz-linear-gradient( center bottom, #F2F2F2 32%, #FFFFFF 80% );
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#F2F2F2', endColorstr='#FFFFFF');
}
#lot #liste h3 a{
    float: left;
    color: #000000;
    padding-top: 4px;
    padding-bottom: 4px;
}
#lot #liste h3 span.attribute_all{
    float: left;
    clear: right;
    width: 34px;
    height: 40px;
    background: transparent url( ../img/big_check_off.png ) no-repeat center center;
}
#lot #liste h3.docok span.attribute_all{
    background: transparent url( ../img/big_check_on.png ) no-repeat center center;
}

#lot #liste h3 span.supprimerDossier{
    display: block;
    float: right;
    margin: 15px 15px 0 0;
    background: url("../img/supprimer_off.png") no-repeat scroll center bottom transparent;
    height: 20px;
    padding: 0;
    width: 18px;
}
#lot #liste h3 span.supprimerDossier:hover{
    background: url("../img/supprimer_on.png") no-repeat scroll center bottom transparent;
}

#lot #liste div.listeLots{
    clear: both;
    overflow: auto;
    padding: 5px 10px;
    border: 0;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.32, #F2F2F2), color-stop(0.8, #FFFFFF) );
    background-image: -moz-linear-gradient( center bottom, #F2F2F2 32%, #FFFFFF 80% );
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#F2F2F2', endColorstr='#FFFFFF');
}
#lot #liste div.listeLots ul{
    margin: 0 12px;
    padding: 0;
    max-height: 400px;
    list-style: none;
    color: #626262;
    font-weight: normal;
    cursor: pointer;
    font-size: 0.75em;
}

#lot #liste div.listeLots ul li{
    height: 24px;
    padding: 3px 0;
}
#lot #liste div.listeLots ul li:hover{
    color: #000000;
    font-weight: bold;
}
#lot #liste div.listeLots ul li span{
    padding: 2px;
    display: inline-block;
}
#lot #liste div.listeLots ul li span.col1{
    width: 60px;
}
#lot #liste div.listeLots ul li span.col2{
    width: 200px;
    height: 11px;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
#lot #liste div.listeLots ul li span.attribute_lot{
    width: 18px;
    height: 13px;
    /*background: transparent url( /img/check_off.png ) no-repeat bottom center;*/
}
#lot #liste div.listeLots ul li.docok span.attribute_lot{
    /*background: transparent url( /img/check_on.png ) no-repeat bottom center;*/
}
#lot #liste div.listeLots ul li span.remove_lot{
    padding: 0;
    margin: 0 0 0 25px;
    width: 20px;
    height: 20px;
    background: transparent url( ../img/supprimer_off.png ) no-repeat 0 -5px;
}
#lot #liste div.listeLots ul li span.remove_lot:hover{
    background-image: url( ../img/supprimer_on.png );
}
#lot #liste div.listeLots ul li span.show{
    display: none;
    padding: 0;
    margin: 0 0 0 25px;
    width: 25px;
    height: 20px;
    background: transparent url( ../img/show.png ) no-repeat 0 -5px;
}
#lot #liste div.listeLots ul li.docok span.show{
    display: inline-block;
}
.ui-widget-header{
    z-index: 1000;
}

.etiquette-draggable{
    background-color: rgba(50,50,50,0.6);
    background-image: none;
    z-index: 3000;
    font-size: 0.85em;
    font-weight: bold;
    padding: 7px;
    color: #FFFFFF;
}

/* footer */
#footer{
    padding: 15px 0;
    text-align: center;
    clear: both;
}
/* degrades */
.dark-gradient{
    color: #FFFFFF;
    background-color: #313131;
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.32, #1F1F1F), color-stop(0.8, #414141) );
    background-image: -moz-linear-gradient( center bottom, #1F1F1F 32%, #414141 80% );
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#414141', endColorstr='#1F1F1F');
}

.shadow-block{
    -webkit-box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.5);
}

/* online toogle */
.online-toggle{
    width: 50px;
    margin: 0 auto;
}
.online-toggle.ui-slider-horizontal .ui-slider-handle {
    top: -0.1em;
    margin-left: -1px;
    width: 40%;
    background: #E5E5E5;
    border: #909090 1px outset;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    z-index: 110;
}
.online-toggle.ui-slider-horizontal {
    height: 1.2em;
}
.online-toggle.ui-widget-content{
    background: #C1C1C1 url(../img/non.png) no-repeat 24px 4px;
    border: 1px #414141 inset;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

.online-toggle.ui-slider .ui-slider-range{
    background: #6EAD1C url(../img/oui.png) no-repeat 2px 4px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

/* layout */
.layout2col{
    width: 100%;
    padding: 0 5px;
}
.col1_2{
    float: left;
    width: 49%;
    margin: 0;
}
.col2_2{
    float: left;
    width: 48%;
    margin: 0 0 0 2%;
}

/** galerie admin **/
.galerie-div{
    width: 209px;
    height: 209px;

    padding: 4px;

    border: 1px solid #ddd;

    line-height: 209px;

    text-align: center;

    background-color: #fff;

    position: relative;
}


.galerie-delete{
    width: 35px;
    height: 35px;

    position: absolute;

    top: 0px;
    right: 0px;

    background-color: #fff;
    background-image: url('../img/supprimer_off.png');
    background-position: center center;
    background-repeat: no-repeat;
    
    cursor: pointer;
}

.galerie-delete:hover{
    background-image: url('../img/supprimer_on.png');
}


#document ul.galerie-sortable{list-style: none;float:left;}
#document ul.galerie-sortable li{
    float:left;
    margin: 0px 40px;
    margin-bottom: 40px;
}


#document ul li{
    display: inline-block;
    margin: 10px 10px;
    list-style: none;
}

.list-galerie {
    clear: both;
}

.galerie-div-addDoc{
    float: left;
    margin: 0px 40px;
    margin-bottom: 40px;
    background-image: url("../img/ajout_galerie.png");
}

.galerie-div-addDoc:hover {
    background-position: 0px -209px;
}

.galerie-div img{
    width: 100%;
}

.layout-galerie-col{
    background-color: #fff;
    border-radius: 5px;
    border:1px solid #ddd;
    box-shadow: 0px 0px 10px 1px #aaa;
    padding: 35px;
}

.uploadOverlay{
    width:100%;
    height:100%;

    position: fixed;

    z-index: 1000;

    top: 0;
    left: 0;

    background-image: url('../img/upload_overlay_back.png');
    background-position: top left;
    background-repeat: repeat;
}

.uploadOverlay-content{
    width:600px;
    height:350px;

    position: relative;

    top: 50%;
    left: 50%;

    margin-top: -175px;
    margin-left: -300px;

    background-color: #fff;

    border-radius: 5px;

    border:1px solid #ddd;
}

.uploadOverlay-smaller{
    font-size: 12px;
}
.uploadOverlay-content p.warning {
    width: 73%;
    margin: 10px auto;
}
.uploadOverlay-complete{
    text-align: center;

    font-size: 18px;

    margin-top: 70px;
}

.uploadOverlay-legende{
    width: 73%;
    margin:35px auto;
}

.uploadOverlay-legende input{
    width: 100%;
    height: 50px;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 0px 2%;
    color: #666;
    font-size: 16px;
    font-weight: 300;
    box-shadow: inset 0px 10px 20px -17px #222;
}

.uploadOverlay-valide{
    padding: 10px 25px;
    width: 100px;
    margin: auto;
    background-color: #aaa;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

.uploadOverlay-valid{
    padding: 10px 25px;
    width: 100px;
    margin: auto;
    margin-top: 65px;
    background-color: #aaa;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

.uploadOverlay-valide:hover,.uploadOverlay-valid:hover{
    background-color: #b1b1b1;
}

/***** PROJET *****/
#projet .shadow-block
{
    border-radius: 5px;
    margin-bottom: 15px;
}

#projet .shadow-block h3
{
    /* Linear-Gradient */
    background: #c4c4c4; /* Old browsers */
    background: -moz-linear-gradient(top, #c4c4c4 0%, #a5a5a5 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c4c4c4), color-stop(100%,#a5a5a5)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #c4c4c4 0%,#a5a5a5 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #c4c4c4 0%,#a5a5a5 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #c4c4c4 0%,#a5a5a5 100%); /* IE10+ */
    background: linear-gradient(to bottom, #c4c4c4 0%,#a5a5a5 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4c4c4', endColorstr='#a5a5a5',GradientType=0 ); /* IE6-9 */

    height: 50px;
    line-height: 50px;
    font-weight: bold;

    padding-left: 20px;
    padding-right: 20px;

    cursor: pointer;
}

#projet .shadow-block h3 .edit
{
    float: right;
    font-weight: normal;
    font-size: 12px;
    color: white;
    font-family: Arial, sans-serif;
    text-decoration: none;
}

#projet .shadow-block h3 .edit:after
{
    content: url(../img/editer.png);
    position: relative;
    top: 5px;
    left: 5px;
}

#projet .shadow-block h3 small
{
    font-weight: normal;
    font-size: 14px;
    font-family: sans-serif;
    margin-left: 5px;
}

#projet .shadow-block h3 small.vignette
{
    background-color: red;
    border-radius: 10px;
    height: 20px;
    min-width: 13px;
    padding-left: 2px;
    padding-right: 5px;
    display: inline-block;
    line-height: 20px;
    text-align: center;
    color: white;
    margin-left: 10px;
    position: relative;
    top: -3px;
}

#projet .shadow-block img
{
    width: 100%;
}

#projet .shadow-block .desc
{
    padding: 10px;
}

#projet .shadow-block .desc p
{
    color: gray;
}
/*
#projet #graph-periode
{
    text-align: center;
}

#projet #graph-periode li
{
    display: inline-block;
    list-style: none;
    margin: 5px;
}

#projet #graph-periode li a
{
    color: gray;
    text-decoration: none;
}

#projet #graph-periode li a.active
{
    color: black;
}

#projet #graph-periode li:nth-child(n+2)
{
    border-left: 1px solid gray;
    padding-left: 8px;
    margin-left: 0px;
}*/

#projet #graph-periode
{
    width: 470px;
    height: 250px;
}

/***** admin/access *****/
#index_access .shadow-block
{
    width: 360px;
    margin: auto;
    margin-bottom: 20px;
    border-radius: 5px;
    cursor: pointer;
}

#index_access .shadow-block h3
{
    padding: 10px;
    font-weight: 500;

    /* Linear-Gradient */
    background: #c4c4c4; /* Old browsers */
    background: -moz-linear-gradient(top, #c4c4c4 0%, #a5a5a5 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c4c4c4), color-stop(100%,#a5a5a5)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #c4c4c4 0%,#a5a5a5 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #c4c4c4 0%,#a5a5a5 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #c4c4c4 0%,#a5a5a5 100%); /* IE10+ */
    background: linear-gradient(to bottom, #c4c4c4 0%,#a5a5a5 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4c4c4', endColorstr='#a5a5a5',GradientType=0 ); /* IE6-9 */

    text-shadow: 1px 1px 1px white;
}

#index_access .shadow-block h3 .edit
{
    float: right;
    font-weight: normal;
    font-size: 12px;
    color: white;
    font-family: Arial, sans-serif;
    text-decoration: none;
    text-shadow: none;
    margin-right: 15px;
}

#index_access .shadow-block h3 .edit:after
{
    content: url(../img/editer.png);
    position: relative;
    top: 5px;
    left: 5px;
}

#index_access
{
    margin-bottom: 60px;
}

/***** Form Projet *****/
#form_projet
{
    background-color: white;
    padding: 15px;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
}
.seo_wrapper label,
#form_projet label,
#popover_localisation label
{
    font-family: arial, sans-serif;
    display: inline-block;
    font-size: 14px;
    width: 20%;
    color: black;
}

#form_projet label.radioLabel {
    width: auto;
    position: relative;
    top: -2px;
    padding: 0 10px;
}

#form_projet label.checkboxLabel {
    display: block;
    width: auto;
    height: 30px;
    line-height: 30px;
    cursor: pointer;
}

#form_projet label.checkboxLabel input {
    position: relative;
    top: 2px;
}

#form_projet input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]),
#form_projet select,
#popover_localisation input
{
    width: 15%;
    margin-right: 54%;
}

#form_projet input.medium,
#form_projet select.medium {
    width: 39%!important;
    margin-right: 30%!important;
}

#form_projet input.short,
#form_projet select.short {
    width: 20%!important;
    margin-right: 49% !important;
}
.seo_wrapper input.long,
#form_projet input.long,
#form_projet #adresse,
#form_projet select.long,
#popover_localisation input.long
{
    width: 79% !important;
    margin-right: 0px !important;
}

.seo_wrapper fieldset,
#form_projet fieldset
{
    border: 0px;
    margin: 0px;
    padding: 0px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #F4F4F4;
    
    padding-top: 40px;
    position: relative;    
    overflow: hidden;
    /*
    -webkit-transition: 1s height;
    -moz-transtion: 1s height;
    transition: 1s height;
    */
}
#form_projet fieldset.closed {
    height: 0!important;    
    padding-bottom: 0;   
}
.seo_wrapper fieldset.closed {
    height: 0!important;    
    padding-bottom: 0;   
    padding-top: 30px;
}

.seo_wrapper fieldset.internal_link legend:hover {
    text-decoration: underline;
}

.seo_wrapper fieldset legend,
#form_projet fieldset legend
{
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-weight: bold;
    font-size: 24px;
    margin-bottom: 10px;
    
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    line-height: 30px;
    cursor: pointer;
}
.seo_wrapper fieldset legend span,
#form_projet fieldset legend span {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 20px;
    float: right;
    cursor: pointer;
}
#form_projet .center
{
    text-align: center;
}

#form_projet .mceLayout
{
    display: inline-table;
    border-radius: 0px;
}

#form_projet #vv-texte_tbl,
#form_projet #dl-texte_tbl
{
    margin-bottom: 20px;
}
/*
#form_projet #programme_config
{
    width: 50%;
    float: right;
    padding-top: 50px;
}*/

#form_projet #programme_config label
{
    display: block;
    width: 100%;
    line-height: 25px;
}

#form_projet #programme_config label input
{
    display: inline-block;
    margin-right: 0px;
    position: relative;
    top: 2px;
}

#form_projet #mentions,
#form_projet #vv-texte,
#form_projet #dl-texte,
#form_projet #dl-content
{
    width: 79%;
    height: 400px;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
}

#form_projet #dl-texte
{
    height: 200px;
}

#form_projet label[for="vv-img"].hasImg
{
    width: 100%;
    line-height: 100px;
}

#form_projet label[for="vv-img"].hasImg img
{
    display: inline-block;
    width: 79%;
    padding-right: 5px;
    float: right;
}

#form_projet #vv-img.hasImg
{
    margin-left: 20.5%;
}

#form_projet #mentions .main-content
{
    padding: 5px;
}

#form_projet #menu-config
{

}

#form_projet #menu-config label
{
    display: block;
    width: 100%;
    margin-top: 2px;
    margin-bottom: 2px;
    line-height: 36px;
}

#form_projet #menu-config input,
#form_projet #menu-config select,
#form_projet #menu-config p,
#form_projet #menu-config .handle
{
    display: inline-block;
    margin: 0px;
}

#form_projet #menu-config input[type="text"],
#form_projet #menu-config select,
#form_projet #menu-config p
{
    width: 40%;
}


#form_projet #menu-config select,
#form_projet #menu-config p
{
    margin-right: 10%;
}

#form_projet #menu-config input[type="checkbox"]
{
    margin-right: 2%;
}

#form_projet #menu-config .handle
{
    width: 36px;
    height: 36px;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    border-radius: 4px;
    background-color: #F7F7F7;
    box-shadow: 0px 1px 1px 0px #CECECE;
    cursor: move;
    margin-left: 10px;
    background-image: url(../img/draggable-arrows.png);
    background-repeat: no-repeat;
    background-position: 8px 8px;
}

.form_projet #popover_localisation #coordonnees
{
    width: 79%;
    display: inline-block;
}

.form_projet #popover_localisation #localiser
{
    width: 20%;
    float: right;
    display: inline-block;
    height: 80px;
    padding: auto;
    margin-top: 0px;
    margin-bottom: 0px;
}

.form_projet .ui-dialog
{
    background-color: white;
}

.form_projet #popover_localisation
{
    padding: 5px;
    background: white;
}

.form_projet #popover_localisation #map
{
    margin: auto;
    height: 300px;
}

.form_projet.ui-widget-content
{
    border: 1px solid #666666; 
    background: #ffffff;
}

#form_projet .error
{
    border: 1px solid red !important;
}

/***** FORM_PROGRAMME *****/
#form_programme label
{
    display: inline-block;
    width: 19%;
    color: rgb(104, 104, 104);
    font-weight: bold;
    font-size: 14px;
}

#form_programme input:not([type="submit"])
{
    margin-bottom: 20px;
    width: 80%;
}

#form_programme textarea
{
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    width: 80%;
}

#form_programme .mceLayout
{
    display: inline-table;
    border-radius: 0px;
}

#form_programme
{
    background: white;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    border-radius: 0px 4px 4px 4px;
    border: 1px solid #BDBDBD;
    border-top: 0px;
}

#form_programme #container-tabs
{
    min-height: 500px;
}

#tabs_programme
{
    background: transparent;
    border: none;
}

#tabs_programme .ui-tabs-nav li, #tabs_programme #add_tab
{
    border: 1px solid #BDBDBD;
    border-bottom: 0px;
}

#tabs_programme .ui-tabs-nav li.ui-state-active
{
    -webkit-box-shadow: 0px -2px 2px 1px rgba(219, 219, 219, 0.7);
    box-shadow: 0px -2px 2px 1px rgba(219, 219, 219, 0.7);
}


#tabs_programme .ui-widget-header
{
    background: transparent;
    border: none;
    padding: 0;
}

#tabs_programme .ui-state-default
{
    margin-right: 10px;
}

#tabs_programme .ui-state-default a
{
    height: 23px;
}

#tabs_programme .ui-state-default, #tabs_programme #add_tab
{
    background: #c4c4c4; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M0YzRjNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhMmEyYTIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #c4c4c4 0%, #a2a2a2 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c4c4c4), color-stop(100%,#a2a2a2)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #c4c4c4 0%,#a2a2a2 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #c4c4c4 0%,#a2a2a2 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #c4c4c4 0%,#a2a2a2 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #c4c4c4 0%,#a2a2a2 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4c4c4', endColorstr='#a2a2a2',GradientType=0 ); /* IE6-8 */
    opacity: 1;
}

#tabs_programme .ui-state-default a, #tabs_programme #add_tab
{
    color: rgb(40, 40, 40);
    font-family: 'Yanone Kaffeesatz', sans-serif;
}

#tabs_programme #add_tab a
{
    content: url(../img/plus.png);
    padding-top: 9px;
    padding-right: 12px;
    padding-left: 12px;
}

#tabs_programme .ui-state-hover
{
    border: 1px solid #666666;
}

#tabs_programme .ui-state-active
{
    background: white;
    border: 1px solid black;
}

/***** FORM_SOCIETE *****/
#form_societe
{
    background: white;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    border-radius: 4px;
    border: 1px solid #BDBDBD;
    border-top: 0px;
}

#form_societe>div
{
    display: inline-block;
    width: 50%;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    vertical-align: top;
    padding-top: 10px;
}

#form_societe fieldset
{
    border: none;
}

#form_societe fieldset legend
{
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-weight: bold;
    font-size: 20px;
}

#form_societe fieldset#infos label
{
    display: inline-block;
    width: 24%;
}

#form_societe fieldset#infos input
{
    width: 75%;
    margin-bottom: 20px;
}

#form_societe fieldset#logos
{

}

#form_societe fieldset#logos label
{
    display: inline-block;
    line-height: 50px;
    width: 100%;
    margin-bottom: 10px;
}

#form_societe fieldset#logos label img
{
    display: inline-block;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    float: right;
    max-width: 200px;
    max-height: 200px;
}

#form_societe fieldset#logos input
{
    width: 100%;
    margin-bottom: 20px;
}

#form_societe #programmes ul li
{
    list-style: none;
}

#form_societe #programmes ul li a
{
    color: black;
    text-decoration: none;
}

#form_societe #programmes ul li a:hover
{
    text-decoration: underline;
}

/***** UTILISATEUR *****/
#utilisateur
{
    height: 550px;
    background: white;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    border-radius: 4px;
    border: 1px solid #BDBDBD;
}

#utilisateur>div
{
    width: 50%;
    padding: 5px;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    display: inline-block;
    height: 100%;
    vertical-align: top;
}

#utilisateur>div:first-child
{
    border-right: 1px solid #E0E0E0;
    padding: 0px;
}

#utilisateur h3
{
    background: #c4c4c4; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M0YzRjNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhMWExYTEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #c4c4c4 0%, #a1a1a1 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c4c4c4), color-stop(100%,#a1a1a1)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #c4c4c4 0%,#a1a1a1 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #c4c4c4 0%,#a1a1a1 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #c4c4c4 0%,#a1a1a1 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #c4c4c4 0%,#a1a1a1 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4c4c4', endColorstr='#a1a1a1',GradientType=0 ); /* IE6-8 */

    padding: 10px;
    color: #202020;
    font-weight: bold;
}

#utilisateur h3 a
{
    float: right;
    font-weight: normal;
    font-size: 12px;
    color: white;
    font-family: Arial, sans-serif;
    text-decoration: none;
    margin-right: 15px;
    margin-top: -6px;
    padding-bottom: 10px;
}

#utilisateur h3 a::after
{
    content: url(../img/plus.png);
    position:relative;
    top: 8px;
    left: 9px;
}

#utilisateur #liste-utilisateur
{
    border-radius: 0px;
    /*    height: 466px;*/
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    overflow: auto;
}

#utilisateur #liste-utilisateur_wrapper .dataTables_scrollHead
{
    background-color: #212121;
}

#utilisateur #liste-utilisateur_wrapper table
{
    margin: 0px;
}

#utilisateur #liste-utilisateur th
{
    border-radius: 0px;
}

#utilisateur #liste-utilisateur tbody
{
    /*max-height: 466px;
    overflow: auto;*/
}

#utilisateur #liste-utilisateur tr.user
{
    cursor: pointer;
}

#utilisateur #liste-utilisateur tr.user td
{
    border: none;
}

#utilisateur #liste-utilisateur tr.user td span
{
    display: block;
    margin: auto;
}

#utilisateur #liste-utilisateur div.societe>h4
{
    display: block;
    line-height: 35px;
    text-align: center;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-weight: lighter;
    font-size: 20px;
    height: 30px;
}

#utilisateur #liste-utilisateur tr.user.modified td
{
    background-color: lightcoral;
}

#utilisateur #liste-utilisateur tr.user:hover td,
#utilisateur #liste-utilisateur tr.user.active td
{
    background-color: #F0F0F0;
}

#utilisateur #liste-utilisateur tr.user span
{
    display: block;
    height: 30px;
}

#utilisateur #liste-utilisateur tr.user span.suppr
{
    width: 30px;
    background-image: url(../img/supprimer_off.png);
    background-position: center;
    background-repeat: no-repeat;
}

#utilisateur #liste-utilisateur tr.user span.suppr:not(.inactive):hover
{
    background-image: url(../img/supprimer_on.png);
}

#utilisateur #liste-utilisateur tr.user span.edit
{
    font-size: 14px;
    line-height: 30px;
    color: #909090;
    background-image: url(../img/editer.png);
    background-position: right center;
    background-repeat: no-repeat;
}

#utilisateur #liste-utilisateur tr.user span.client
{
    background-image: url(../img/user_client.png);
}

#utilisateur form label.client::before
{
    content: url(../img/user_client.png);
}

#utilisateur #liste-utilisateur tr.user span.admin
{
    background-image: url(../img/user_admin.png);
}

#utilisateur form label.admin::before
{
    content: url(../img/user_admin.png);
}

#utilisateur #liste-utilisateur tr.user span.superadmin
{
    background-image: url(../img/user_superadmin.png);
}

#utilisateur form label.superadmin::before
{
    content: url(../img/user_superadmin.png);
}

#utilisateur #liste-utilisateur tr.user span.client,
#utilisateur #liste-utilisateur tr.user span.admin,
#utilisateur #liste-utilisateur tr.user span.superadmin
{
    background-position: center;
    background-repeat: no-repeat;
}

#utilisateur form label.client::before,
#utilisateur form label.admin::before,
#utilisateur form label.superadmin::before
{
    position: relative;
    right: 3px;
}

#utilisateur form
{
    display: none;
}

#utilisateur form
{
    display: none;
}

#utilisateur form.active
{
    display: block;
}

#utilisateur form fieldset
{
    border: 0px;
    border-bottom: 1px solid #E0E0E0;
    margin-bottom: 12px;
    padding-bottom: 15px;
}

#utilisateur form fieldset:last-of-type
{
    border-bottom: 0px;
}

#utilisateur form fieldset legend
{
    font-weight: bold;
    color: #6E6E6E;
}

#utilisateur form fieldset.role legend
{
    float: left;
    width: 20%;
    line-height: 30px;
}

#utilisateur form label
{
    display: block;
    width: 100%;
    font-size: 14px;
    clear: both;
    line-height: 30px;
    margin-bottom: 10px;
    color: #6E6E6E;
}

#utilisateur form fieldset label:last-child
{
    margin-bottom: 0px;
}

#utilisateur form label.radio
{
    display: inline-block;
    width: 25%;
    text-align: right;
    margin-bottom: 0px;
}

#utilisateur form label.radio input
{
    position: relative;
    top: 3px;
}

#utilisateur form label input:not([type="radio"]), #utilisateur form label select
{
    width: 75%;
    float: right;
    height: 34px;
}

#utilisateur form label select
{
    width: 25%;
    margin-right: 50%;
}

#utilisateur form label select.long
{
    width: 75%;
    margin-right: 0%;
}

#utilisateur form input[type="submit"]
{
    margin-top: 0px;
}

/***** UTILISATEUR *****/
#societe_fille
{
    /*height: 550px;*/
    min-height: 550px;
    background: white;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    border-radius: 4px;
    border: 1px solid #BDBDBD;
}

#societe_fille>div
{
    width: 50%;
    padding: 5px;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    display: inline-block;
    height: 100%;
    vertical-align: top;
}

#societe_fille>div:first-child
{
    border-right: 1px solid #E0E0E0;
    padding: 0px;
}

#societe_fille h3
{
    background: #c4c4c4; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M0YzRjNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhMWExYTEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #c4c4c4 0%, #a1a1a1 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c4c4c4), color-stop(100%,#a1a1a1)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #c4c4c4 0%,#a1a1a1 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #c4c4c4 0%,#a1a1a1 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #c4c4c4 0%,#a1a1a1 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #c4c4c4 0%,#a1a1a1 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4c4c4', endColorstr='#a1a1a1',GradientType=0 ); /* IE6-8 */

    padding: 10px;
    color: #202020;
    font-weight: bold;
}

#societe_fille h3 a
{
    float: right;
    font-weight: normal;
    font-size: 12px;
    color: white;
    font-family: Arial, sans-serif;
    text-decoration: none;
    margin-right: 15px;
    margin-top: -6px;
    padding-bottom: 10px;
}

#societe_fille h3 a::after
{
    content: url(../img/plus.png);
    position:relative;
    top: 8px;
    left: 9px;
}

#societe_fille #liste-societe
{
    height: 501px;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    overflow: auto;
}

#societe_fille #liste-societe div.societe
{
    display: block;
    line-height: 35px;
    padding: 10px;
    cursor: pointer;
}

#societe_fille #liste-societe div.societe.modified
{
    background-color: lightcoral;
}

#societe_fille #liste-societe div.societe:hover,
#societe_fille #liste-societe div.societe.active
{
    background-color: #F0F0F0;
}

#societe_fille #liste-societe div.societe>*
{
    display: inline-block
}

#societe_fille #liste-societe div.societe span
{
    display: none;
}

#societe_fille #liste-societe div.societe.active span,
#societe_fille #liste-societe div.societe:hover span
{
    display: inline-block;
    height: 30px;
}

#societe_fille #liste-societe div.societe h4
{
    width: 45%;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 20px;
    height: 30px;
}

#societe_fille #liste-societe div.societe span.suppr::after
{
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    top: 6px;
    content: url(../img/supprimer_off.png);
}

#societe_fille #liste-societe div.societe span.suppr:not(.inactive):hover::after
{
    content: url(../img/supprimer_on.png);
}

#societe_fille #liste-societe div.societe span.edit
{
    width: 20%;
    margin-left: 25%;
    font-size: 14px;
    color: #909090;
}

#societe_fille #liste-societe div.societe span.edit::after
{
    content: url(../img/editer.png);
    position: relative;
    top: 5px;
    left: 10px;
}

#societe_fille form
{
    display: none;
}

#societe_fille form
{
    display: none;
}

#societe_fille form.active
{
    display: block;
}

#societe_fille form fieldset
{
    border: 0px;
    border-bottom: 1px solid #E0E0E0;
    margin-bottom: 15px;
    padding-bottom: 15px;
}

#societe_fille form fieldset:first-of-type
{
    margin-top: 10px;
}

#societe_fille form fieldset:last-of-type
{
    border-bottom: 0px;
}

#societe_fille form fieldset legend
{
    font-weight: bold;
    color: #6E6E6E;
}

#societe_fille form label
{
    display: block;
    width: 100%;
    font-size: 14px;
    clear: both;
    line-height: 30px;
    margin-bottom: 10px;
    color: #6E6E6E;
}

#societe_fille form fieldset label:last-child
{
    margin-bottom: 0px;
}

#societe_fille form label input
{
    width: 75%;
    float: right;
    height: 34px;
}

#societe_fille form label > div {padding-left: 30px; display: none;}


#societe_fille form label input[type="checkbox"] {
    width: auto;
    height: auto;
    float: none;
}

#societe_fille form label > div label {
    display: inline-block;
    width: 25%;
    height: 34px;
    line-height: 34px;
}

#societe_fille form label > div input {
    width: 75%;
    height: 34px;
    float: none;
}

#societe_fille form label.img img
{
    max-height: 50px;
    max-width: 50%;
    margin-right: 25%;
    display: inline-block;
    float: right;
    border-radius: 4px;
}

#societe_fille form label.img img.uploaded
{
    box-shadow: 0px 0px 10px green;
}

#societe_fille form label.img
{
    height: 50px;
    line-height: 50px;
}

/***** actualites *****/
#actualites
{
    background: white;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    border-radius: 4px;
    border: 1px solid #BDBDBD;
}

#actualites #add_actualite
{
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
}

#actualites #add_actualite a
{
    background: #85c91e; /* Old browsers */
    background: -moz-linear-gradient(top, #85c91e 0%, #53a80f 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#85c91e), color-stop(100%,#53a80f)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #85c91e 0%,#53a80f 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #85c91e 0%,#53a80f 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #85c91e 0%,#53a80f 100%); /* IE10+ */
    background: linear-gradient(to bottom, #85c91e 0%,#53a80f 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#85c91e', endColorstr='#53a80f',GradientType=0 ); /* IE6-9 */

    display: inline-block;
    padding: 12px 25px;
    color: white;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    font-size: 24px;
    text-decoration: none;
    border-radius: 4px;
    text-shadow: 0px -1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 1px 1px 0px rgb(99, 103, 106);
}

#actualites .actualite
{
    border-top: 1px solid #F4F4F4;
    padding: 7px;
    height: 125px;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
}

#actualites .actualite .infos,
#actualites .actualite .content,
#actualites .actualite .image
{
    display: inline-block;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    vertical-align: middle;
}

#actualites .actualite .infos
{
    width: 19%;
    color: #6E6E6E;
    padding-left: 25px;
}

#actualites .actualite .infos .date
{
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 5px;
}

#actualites .actualite .infos .etat
{
    font-size: 12px;
}

#actualites .actualite .infos .etat .online
{
    color: green;
}

#actualites .actualite .infos .etat .offline
{
    color: red;
}

#actualites .actualite .infos .actions
{
    list-style: none;
}

#actualites .actualite .infos .actions a
{
    text-decoration: none;
    color: inherit;
    font-size: 12px;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    display: inline-block;
}

#actualites .actualite .infos .actions a.edit:before
{
    content: url(../img/actu_edit.png);
    position: relative;
    top: 2px;
    right: 5px;
}

#actualites .actualite .infos .actions a.delete:before
{
    content: url(../img/actu_delete.png);
    position: relative;
    top: 2px;
    right: 5px;
}

#actualites .actualite .content
{
    width: 60%;
}

#actualites .actualite .content h3
{
    font-weight: bold;
    font-size: 24px;
    color: #1D1D1D;
}

#actualites .actualite .content p
{
    color: #727272;
    font-size: 12px;
}

#actualites .actualite .image
{
    width: 19%;
}

#actualites .actualite .image img
{
    max-width: 100%;
    max-height: 96px;
    padding: 4px;
    border: 1px solid #DFDFDF;
}

#actualites #pages
{
    border-top: 1px solid #F4F4F4;
    text-align: center;
    padding: 15px;
}

#actualites #pages li
{
    display: inline-block;
    list-style: none;
    background-color: #CCCCCC;
    border-radius: 15px;
    margin-right: 5px;
    margin-left: 5px;
}

#actualites #pages li a
{
    color: #2B2B2B;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    padding: 8px;
    line-height: 24px;
}

#actualites #pages li.active
{
    background-color: #363636;
}

#actualites #pages li.active a
{
    color: white;
}

#actualites #pages li.separateur
{
    font-weight: bold;
    width: 24px;
    line-height: 24px;
}

/***** form_actualite *****/
#form_actualite
{
    background: white;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    border-radius: 4px;
    border: 1px solid #BDBDBD;
    padding: 30px;
}

#form_actualite #form_container
{
    width: 60%;
    display: inline-block;
}

#form_actualite #form_container .row
{
    width: 100%;
    display: block;
    margin-bottom: 10px;
}

#form_actualite #form_container label,
#form_actualite #editor_container label
{
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    display: inline-block;
    width: 30%;
    font-size: 12px;
    font-weight: bold;
    color: #727272;
}

#form_actualite #form_container input
{
    width: 69%;
}

#form_actualite #form_container input[type="radio"]
{
    width: auto;
    margin-left: 31%;
    position: relative;
    top: 2px;
}

#form_actualite #form_container label + input[type="radio"]
{
    margin-left: 0px;
}

#form_actualite #image_container
{
    float: right;
    width: 35%;
}

#form_actualite #image_container img
{
    max-width: 100%;
    max-height: 150px;
    border: 1px solid #E0E0E0;
    padding: 4px;
}

#form_actualite #editor_container
{
    clear: both;
}

#form_actualite #editor_container label
{
    width: 18%;
}

#form_actualite #editor_container textarea
{
    display: inline-block;
    width: 80%;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
}

#form_actualite #editor_container .mce-tinymce.mce-container.mce-panel
{
    display: inline-block;
}

/***** form_actualite *****/

/***** form_actualite_bloc_title *****/
#form_actualite_bloc_title
{
    background: white;
    padding: 30px;
    border-bottom: 1px solid #F4F4F4;
}

#form_actualite_bloc_title #form_container
{
    width: 85%;
    display: inline-block;
}

#form_actualite_bloc_title #form_container .row
{
    width: 100%;
    display: block;
    margin-bottom: 10px;
}

#form_actualite_bloc_title #form_container label
{
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    display: inline-block;
    width: 20%;
    font-size: 12px;
    font-weight: bold;
    color: #727272;
}

#form_actualite_bloc_title #form_container input
{
    width: 79%;
}
#form_actualite_bloc_title input[type=submit] {
    height: 36px;
    line-height: 36px;
    float: right;
    padding: 0 25px;
    font-size: 18px;
    margin: 0;
}
/***** /form_actualite_bloc_title *****/

#page-stats
{
    background: white;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    box-shadow: 0px 0px 2px 1px rgba(219, 219, 219, 1);
    border-radius: 4px;
    border: 1px solid #BDBDBD;
    padding: 30px;
}

#page-stats #graph-visite
{
    width: 100%;
    height: 350px;
    padding-bottom: 10px;
    border-bottom: 2px solid #F3F3F3;
    margin-bottom: 30px;
}

#page-stats #graph-ecran
{
    width: 100%;
    height: 200px;
    position: relative;
    bottom: 57px;
    margin-left: -25px;
}

#page-stats h3
{
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
}

#page-stats #classement-visite,
#page-stats #classement-lot,
#page-stats #visiteur,
#page-stats #type-ecran
{
    display: inline-block;
    vertical-align: top;
    width: 40%;
    margin-right: 4%;
    margin-left: 4%;
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    margin-bottom: 50px;
    min-height: 70px;
}

#page-stats #classement-visite
{
    background: transparent url(../img/winner_podium.png) 0px 25px no-repeat;
    padding-left: 120px;

}

#page-stats #visiteur
{
    background: transparent url(../img/picto_user.png) 0px 25px no-repeat;
    padding-left: 120px;
    min-height: 100px;
}

#page-stats #classement-lot
{
    background: transparent url(../img/winner_podium.png) 0px 25px no-repeat;
    padding-left: 120px;
}

#page-stats ul, #page-stats ol
{
    padding-left: 0px;
    list-style: none;
    margin: 0;
    margin-top: 10px;
    font-size: 12px;
}

#page-stats #type-ecran
{
    margin-bottom: -80px;
}

#page-stats ul li, #page-stats ol li
{
    line-height: 25px
}

/***** datepicker *****/ /* TODO: Design */
/*.ui-datepicker table
{*/
    /* RàZ table */
    /*border-radius: 0px;
}*/

/*.ui-datepicker table tr td
{*/
    /* RàZ td */
    /*font-size: 1em;
    height: auto;
}*/

/*.ui-datepicker table tr th
{*/
    /* RàZ th */
    /*background: white;
    color: black;
    cursor: default;
}*/

/*.ui-datepicker.ui-widget-content
{
    background: white;
    color: black;
}*/

/*.ui-datepicker .ui-datepicker-header
{
    background: white;
    color: black;
}*/

/*.ui-datepicker .ui-datepicker-header .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-header .ui-datepicker-next
{
    background: gray;
}*/

/*.ui-datepicker .ui-datepicker-header .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-header .ui-datepicker-next-hover
{
    border: 1px solid black;
}*/

/*.ui-datepicker .ui-datepicker-calendar .ui-state-default
{
    background: gray;
    border: 1px solid lightgray;
}*/

/*.ui-datepicker .ui-datepicker-calendar .ui-state-default.ui-state-hover
{
    background: lightskyblue;
    border: 1px solid lightblue;
}*/

/*.ui-datepicker .ui-datepicker-calendar .ui-state-default.ui-state-active
{
    background: lightgreen;
    border: 1px solid lightgrey;
    color: red;
}*/

/*.ui-datepicker .ui-datepicker-calendar .ui-state-highlight
{
    color: red;
}*/

/***** Mentions Légales Admin. *****/
a.mentions-legales
{
    text-decoration: none;
    color: black;
}

a.mentions-legales:hover
{
    text-decoration: underline;
}

#mentions-legales
{

}

#mentions-legales h3
{
    font-weight: bold;
}

#mentions-legales a
{
    text-decoration: none;
    color: black;
}

#mentions-legales a:hover
{
    text-decoration: underline;
}

#mentions-legales * + h3
{
    margin-top: 25px;
}

#mentions-legales address
{
    font-style: normal;
}

#mentions-legales ul
{
    list-style: none;
    padding-left: 10px;
}

#mentions-legales ul li:before
{
    content: '- ';
}

#mentions-legales ul,
#mentions-legales p,
#mentions-legales address
{
    margin: 5px 0px 5px 0px;
}

/***** errorManager *****/
#error-display
{

}

#error-display .error
{
    background-color: #f2dede;
    color: #a94442;
    border: 1px solid #ebccd1;
    /**    background-color: #c26464;
        color: #2f1312;
        border: 1px solid #bb5263;*/
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 5px;
}

#error-display .error:last-of-type
{
    margin-bottom: 10px;
}

#error-display .error .error-close
{
    float: right;
    cursor: pointer;
}

.invalid
{
    border: 1px solid #a94442 !important;
    background-color: #f2dede !important;
    outline-color: #a94442;
    /*   border: 1px solid #2f1312 !important;
       background-color: #c26464 !important;
       color: #2f1312 !important;
       outline-color: #2f1312;*/
}

/* GESTION DES PAGES */
.menu-container {
    position: relative;
}

#content .menu-container h3 {font-size: 30px;}
/*
#F5F5F5
#D5D5D5
#FFFFFF
#333333
*/

.list-menu {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}

.list-menu .my-custom-placeholder {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 50px;
    font-size: 13px;
    line-height: 20px;
    background-color: #FFFFFF;  
    vertical-align: bottom;
    border: 1px dashed #D5D5D5;
}

.list-menu li {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 20px;
    font-size: 13px;
    line-height: 20px;
}

.list-menu li.ui-sortable-helper  .handle {
    cursor: -webkit-grabbing;
}

.list-menu li.ui-sortable-helper .content {
    margin: 0;
}
.list-menu li .handle {
    position: absolute;
    margin: 0;
    left: 0;
    bottom: 0;
    cursor: pointer;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    overflow: hidden;
    border: 1px solid #ccc;
    background: #D5D5D5;
    color: #FFFFFF;
    vertical-align: bottom;
    cursor: -webkit-grab;    
}
.list-menu li .handle:hover {
    background: #404040;
    border: 1px solid #404040;
}
.list-menu li .content {
    display: block;
    height: 40px;
    margin: 10px 0;
    padding: 0px 10px 0px 40px;
    color: #333;
    text-decoration: none;
    font-weight: bold;
    border: 1px solid #ccc;
    background: #F5F5F5;   
}

.list-menu li .content .deleter {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    color: #808080;
    font-weight: 300;
    font-size: 17px;
    cursor: pointer;
    border-left: 1px solid #D5D5D5;
}

.list-menu li .content .deleter:hover {
    color: #FFFFFF;
    background-color: #404040;
}

.list-menu li .content input[type="text"] {
    border-radius: 0;
    background-color: white;
    border: none;
    box-shadow: none;
    height: 40px;
    line-height: 40px;
    outline: none;
    border-right: 1px solid #D5D5D5;
    width: 730px;
    font-size: 14px;
    font-weight: 300;
}

.list-menu li .content span.page {
    font-size:12px;
    font-weight: 300;
    margin-left: 20px;
}

.list-menu li span {
    color: gray;
    font-size: 12px;
}

.pages-container .add-pages,
.menu-container .add-menu {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 12px;    
    height: 40px;
    border: 1px solid #D5D5D5;
    background: #F5F5F5;
    width: 208px;
    line-height: 40px;
}
.pages-container .add-pages {top: 35px;}

.pages-container .add-pages span.text,
.menu-container .add-menu span.text {
    color: gray;
    margin-left: 10px;
}
.pages-container .add-pages span.adder,
.menu-container .add-menu span.adder {
    margin-left: 5px;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #D5D5D5;
    color: white;
    font-weight: 600;
    font-size: 20px;
    top: 0;
    right: 0;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
}
.pages-container .add-pages span.adder.active,
.pages-container .add-pages span.adder:hover,
.menu-container .add-menu span.adder.active,
.menu-container .add-menu span.adder:hover {
    background-color: #404040;
}
.listing-new-pages,
.listing-new-menu {
    width: 208px;
    position: absolute;
    top: 40px;
    right: 0;
    list-style: none;
    background-color: #FFFFFF;
    border: 1px solid lightgray;
    /*box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);*/
    display: none;
}

.listing-new-pages {top: 76px; z-index: 1;}

.listing-new-pages li,
.listing-new-menu li {
    display: block;
    height: 40px;
    font-size: 12px;
    color: #000000;
    text-align: left;
    line-height: 40px;
    padding: 0 10px;
    cursor: pointer;
    border-bottom: 1px solid lightgray;
}
.listing-new-pages li:last-of-type,
.listing-new-menu li:last-of-type {
    border-bottom: 0;
}
.listing-new-pages li:hover,
.listing-new-menu li:hover {
    background-color: #F5F5F5;
}
.listing-new-pages li span,
.listing-new-menu li span {
    font-size: 11px;
    color: gray;
    float: right;
}

/* CSS Bloc ADMIN */

.bloc-wrapper {
    overflow: hidden;
}
.bloc-wrapper-header {
    height: 42px;
    background-color: #F5F5F5;
    background-clip: content-box;
    color: #808080;
    font-size: 16px;
    z-index: 2;
}

.bloc-wrapper .border-wrapper {
    border: 1px solid #CCCCCC;
}

.bloc-wrapper-header p {
    line-height: 40px;
    margin-left: 50px;    
}

.bloc-wrapper-header .bloc-action {
    position: absolute;
    right: 7px;
    top: 0;
}

.bloc-wrapper-header .handle {
    position: absolute;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #FFFFFF;
    background-color: #d5d5d5;
    cursor: -webkit-grab;
}
.bloc-wrapper-header .handle:hover {
    background-color: #404040;
}


.bloc-wrapper-header .bloc-action .fa {    
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    font-size: 20px;
    color: #808080;
    cursor: pointer;
    border-left: 1px solid #CCCCCC;
    float: left;
    /*margin-top: 1px;*/
    /*text-shadow: 1px 1px 0 #A7A7A7;*/
}

.bloc-wrapper-header .bloc-action .fa:last-of-type {margin-right: 1px;}

.bloc-wrapper-header .bloc-action .fa:hover {
    background-color: #404040;
    color: #FFFFFF;
}

.bloc-form {    
    position: absolute;
    z-index: 1;
    top: -270px;
    -webkit-transition: top 0.5s ease-in; /* Safari */
    transition: top 0.5s ease-in;
}

.bloc-form.active {
    top:42px;
}

.bloc-form form {
    background-color: #FFFFFF;
    border-right: 1px solid #CCCCCC;
    border-left: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    padding-bottom: 7px;
}
.bloc-edit-content {
    display: inline-block;
    height: 30px;
    font-size: 16px;
    line-height: 30px;
}

.modal-body .img-container {position: relative;}
.modal-body .img-container .deleter {
    position: absolute;
    width: 50px;
    height: 50px;
    line-height: 50px;
    color: #FFFFFF;
    text-align: center;
    right: 0;
    top: 0;    
    font-size: 20px;
    cursor: pointer;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.85);
    z-index: 1;
}

.modal-body .img-container #dropper {
    height: 150px;
    line-height: 150px;
    text-align: center;
    font-size: 20px;
    border: 2px dashed lightgray;
    border-radius: 10px;
    color: gray;
    font-weight: 600;
    cursor: pointer;
}
.modal-body .img-container #dropper:hover {
    background-color: rgba(0, 0, 0, 0.1);
}
.modal-body .img-container #dropper.hidden {display: none;}

.modal-body .file-container {position: relative;}
.modal-body .file-container .deleter {
    position: absolute;
    width: 50px;
    height: 50px;
    line-height: 50px;    
    text-align: center;
    right: 0;
    top: 0;    
    font-size: 20px;
    cursor: pointer;
}

.modal-body .file-container #dropper {
    height: 150px;
    line-height: 150px;
    text-align: center;
    font-size: 20px;
    border: 2px dashed lightgray;
    border-radius: 10px;
    color: gray;
    font-weight: 600;
    cursor: pointer;
}

.modal-body .file-container p {line-height: 50px;}
.modal-body .file-container p span {font-size: 18px; margin-right: 10px; position: relative; top: 1px;}
.modal-body .file-container #dropper:hover {
    background-color: rgba(0, 0, 0, 0.1);
}
.modal-body .file-container #dropper.hidden {display: none;}

.modal-body iframe {
    max-width: 100%;
    max-height: 320px;
}

#content .bloc h2 {
    font-size: 24px;
    color: #4B4B4B;
    font-weight: 600;
    text-align: left;
    font-family: 'Source Sans Pro';
    margin: 0;
    margin-top: 20px;
    margin-bottom: 10px;
}

#liste-pages {    
    width: 980px;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 30px;
}

#liste-pages td{
    word-wrap: break-word;
}

#liste-pages tr td form{
    padding: 0;
    margin: 0;
    width: 100% !important;
}
#liste-pages tr td form input{
    font-size: 0.9em;
    border: none;
    background-color: #FFFFFF;
    margin: 0;
    width: 95% !important;
}
#liste-pages tr td form select{
    font-size: 0.9em;
    margin: 0;
}
#liste-pages tr td form select option{
    width: 95%;
}
#liste-pages .cat3{
    width: 55px !important;
}
#liste-pages .col-visualiser,
#liste-pages .col-editer{
    width: 60px !important;
}

#liste-pages .col-editer span, 
#liste-pages .col-visualiser span {
    font-size: 20px;
    color: #808080;
}
#liste-pages .col-editer span:hover, 
#liste-pages .col-visualiser span:hover {
    color: #000000;
}

#liste-pages tr.odd td.cat1{
    background-color: #F5F5F5;
}
#liste-pages tr.even td.cat1{
    background-color: #ECECEC;
}

.menu-container p span.helper {cursor: help;}
.menu-container p span.helper:hover {text-decoration: underline;}

.page-container .bloc > div.border {        
    border: 1px solid #CCC;
    border-top: 0;
}

.placeholder {
    height: 300px;
    background-color: #F5F5F5;
    background-clip: content-box;
    margin-bottom: 15px;
}

.placeholder > div {        
    border: 1px solid #CCCCCC;
    line-height: 300px;
    padding: 0;
    text-align: center;
}

/* CAROUSEL ADMIN */
.carousel-container {}
.carousel-container .item-list {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}

.carousel-container .item-list li {
    
}

.carousel-container .item-list .my-custom-placeholder {
    display: block;
    position: relative;
    margin: 10px 0;
    padding: 0;
    min-height: 90px;
    line-height: 90px;
    background-color: #FFFFFF;  
    vertical-align: bottom;
    border: 1px dashed #D5D5D5;
}

.carousel-container .item-list li {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 50px;
    font-size: 13px;
    line-height: 75px;
}

.carousel-container .item-list li img {height: 73px; vertical-align: top; margin-right: 15px;}

.carousel-container .item-list li.ui-sortable-helper  .handle {
    cursor: -webkit-grabbing;
}

.carousel-container .item-list li.ui-sortable-helper .content {
    margin: 0;
}
.carousel-container .item-list li .handle {
    position: absolute;
    margin: 0;
    left: 0;
    bottom: 0;
    cursor: pointer;
    width: 50px;
    height: 75px;
    line-height: 75px;
    text-align: center;
    overflow: hidden;
    border: 1px solid #ccc;
    background: #D5D5D5;
    color: #FFFFFF;
    vertical-align: bottom;
    cursor: -webkit-grab;    
    font-size: 20px;
}
.carousel-container .item-list li .handle:hover {
    background: #404040;
    border: 1px solid #404040;
}
.carousel-container .item-list li .content {
    display: block;
    height: 75px;
    margin: 10px 0;
    padding: 0px 10px 0px 49px;
    color: #333;
    text-decoration: none;
    font-weight: bold;
    border: 1px solid #ccc;
    background: #F5F5F5;   
}

.carousel-container .item-list li .content .editable,
.carousel-container .item-list li .content .deleter {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 51px;
    height: 75px;
    line-height: 75px;
    text-align: center;
    color: #808080;
    font-weight: 300;
    font-size: 20px;
    cursor: pointer;
    border-left: 1px solid #D5D5D5;
}
.carousel-container .item-list li .content .editable {right: 51px;}

.carousel-container .item-list li .content .editable:hover,
.carousel-container .item-list li .content .deleter:hover {
    color: #FFFFFF;
    background-color: #404040;
}

.carousel-container #dropper {    
    height: 100px;
    line-height: 100px;
    background-color: #FFFFFF;
    border: 2px dashed #CCCCCC;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    color: #CCCCCC;
    cursor: pointer;
}

.bloc-placeholder {position: relative; margin-bottom: 15px;}

.bloc-placeholder > div {
    padding: 0;
    min-height: 90px;
    line-height: 90px;
    background-color: #FFFFFF;  
    vertical-align: bottom;
    border: 1px dashed #D5D5D5;
    background-clip: content-box;
    margin-bottom: 15px;
}

.pages-container {
    margin: 60px 0 25px 0;
}

#content .pages-container h3 {
    font-size: 30px;
    line-height: 42px;
}

.pages-container ul.pages-list {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;    
}

.pages-container ul.pages-list li {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 20px;
    font-size: 13px;
    line-height: 20px;
}

.pages-container ul.pages-list .fa-file {
    position: absolute;
    margin: 0;
    left: 0;
    bottom: 0;    
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    overflow: hidden;
    border: 1px solid #ccc;
    background: #D5D5D5;
    color: #FFFFFF;
    vertical-align: bottom;    
}
.pages-container ul.pages-list .content {
    display: block;
    height: 40px;
    margin: 10px 0;
    padding: 0px 10px 0px 40px;
    color: #333;
    text-decoration: none;
    font-weight: bold;
    border: 1px solid #ccc;
    background: #F5F5F5;
}

.pages-container ul.pages-list li p {
    line-height: 40px;
    margin-left: 10px;
    color: gray;
    font-weight: 300;
}

.pages-container ul.pages-list li span {
    position: absolute;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-left: 1px solid #CCCCCC;
    color: gray;
    cursor: pointer;
    font-size: 17px;
}

.pages-container ul.pages-list li span:hover {
    color: #FFFFFF;
    background-color: #404040;
}


.pages-container ul.pages-list li span.fa-times {
    right: 0;
    top: 1px;
}
.pages-container ul.pages-list li .toggleSEOInputs {
    right: 0;
    top: 0;
}

.pages-container ul.pages-list li span.fa-eye {
    right: 41px;
    top: 1px;
}

.pages-container ul.pages-list li span.fa-pencil {
    right: 82px;
    top: 1px;
}

.pages-container ul.pages-list li a.unavailable span {
    cursor: not-allowed;
}

/* CSS Allotement */

.lot-container,
.comm-container {
    width: 50%;
    float: left;
    display: block;
    position: relative;
}

.lot-container .header,
.comm-container .header {
    padding: 10px 10px 10px 0;
}

.comm-container .comm-wrapper,
.lot-container .lot-wrapper {
    height: 504px;
    overflow: auto;
}

.list-lot .item,
.comm-container .item,
.lot-container .item {
    padding: 0 0 0 40px;    
    display: block;
    position: relative;
    line-height: 40px;
    border: 1px solid #CCCCCC;
    margin-bottom: 4px;
    background: #F5F5F5;
}

.list-lot .item .handle,
.comm-container .item .handle,
.lot-container .item .handle {
    position: absolute;
    left: 0;
    top: 0px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #FFFFFF;
    background-color: #D5D5D5;
    border: 1px solid #CCCCCC;
    cursor: -webkit-grab;
    vertical-align: bottom;
}

.comm-container .item .handle{cursor: pointer;}

.list-lot .item .handle:hover,
.comm-container .item .handle:hover,
.lot-container .item .handle:hover {
    background-color: #404040;
    border-color: #404040;
}

.comm-container .item .content,
.lot-container .item .content {margin-left: 15px;}

.list-lot {
    display: none;
    position: relative;
    list-style: none;
    min-height: 40px;
    padding-left: 41px;
}

.list-lot.active {
    display: block;
}

.list-lot .item .content .deleter {
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: gray;
    border-left: 1px solid #CCCCCC;
    cursor: pointer;
}

.list-lot .item .content .deleter:hover {
    background-color: #404040;
    color: #FFFFFF;
}

.my-placeholder {
    height: 45px;
    background: white;
    margin-bottom: 5px;
    border: 1px dashed #CCCCCC;
}

.my-placeholder.drop-hover {
    background: rgba(0, 0, 0, 0.2);
}

.ui-selecting { background: #FECA40; }
.ui-selected { background: #F39814; color: white; }

.lot-wrapper li {cursor: pointer;}

.lot-wrapper li.selected {
    background: #ADADAD;
}
.helper {
    cursor: help;
}
.helper:hover {
    text-decoration: underline;
}

/* GUIDE */
#guide_opener {
    float: right;
    height: 50px;
    line-height: 50px;
    padding: 0 20px;    
    background: #D12727;
    color: white;
    cursor: pointer;
    /*display: none;*/
}

#guide_opener:hover {    
    background-color: #FF5959;
    color: white;
    /*cursor: help;*/
}

#guide_popover {
    display: none;
    position: fixed;
    width: 95%;
    height: 95%;
    top: 2.5%;
    left: 2.5%;    
    z-index: 9999;
    text-align: center;
    overflow: hidden;
}
#guide_popover.active{display: block;}
#guide_popover .guide_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: black;
    opacity: 0.8;
    z-index: -1;
    cursor: pointer;
}
#guide_popover .guide_closer {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;    
    
    position: absolute;
    top 0;
    right: 0;
    
    font-size: 40px;
    cursor: pointer;
    z-index: 1;
    color: black;
}

#guide_popover .guide_wrapper {
    position: relative;
    height: 100%;
}

#guide_popover .guide_closer:hover {color: #D12727;}
#guide_popover img {
    max-width: 100%;   
    max-height: 100%;
}

#guide_popover .guide_toolbar {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 30px;
    text-align: right;
    bottom: 0;
}

#guide_popover .guide_toolbar .guide_left,
#guide_popover .guide_toolbar .guide_right {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #D12727;
    font-size: 16px;
    cursor: pointer;
}
#guide_popover .guide_toolbar .guide_left.active,
#guide_popover .guide_toolbar .guide_right.active {
    color: white;
    background-color: #D12727;
}

/* displayResult */
.displayResult {
    display: block;
    width: 100%;
    height: 0px;
        
    position: fixed;
    z-index: 1000;
    bottom: 0;
    left: 0;
    
    text-align: center;
    background: #54CC54;
    color: #FFFFFF;
    font-size: 16px;
    
    transition: 0.5s height;
}
.displayResult.error {background: #a22222;}

.displayResult p {line-height: 50px;}

.displayResult.active {
    height: 50px;
    line-height: 50px;
}
/* AJOUT / IMPORTATION DE BLOC */
.add_import_blocs {
    text-align: right;
    height: 40px;
    line-height: 40px;
    color: #808080;
}

.add_import_blocs span.add,
.add_import_blocs span.import {
    display: inline-block;
    overflow: hidden;
    width: 40px; 
    height: 40px;
    line-height: 40px;
    /*padding: 0 10px;*/
    cursor: pointer;
    border: 1px solid #CCCCCC;
    text-align: left;
    transition: 0.8s width;    
}

.add_import_blocs span.add:hover{
    width: 145px;
}

.add_import_blocs span.import:hover {
    width: 150px;
}

.add_import_blocs span.add:hover span.fa,
.add_import_blocs span.import:hover span.fa {
    color: #FFFFFF;
    background-color: #404040;
}

.add_import_blocs span.fa {
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;    
}

.add_import_blocs span.fa {
    margin-right: 5px;
}


/* Filters Lots */
/*.filters-container {margin-top: 15px;}*/
.filters-container #form_projet fieldset {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
    padding-top: 30px;
}

.filters-container #form_projet fieldset legend {margin-bottom: 0;}

.filters-container label {
    cursor: pointer;    
    height: 30px;
    line-height: 30px;
}

.filters-container label input {
    width: 15px;
    height: 15px;
    margin: 0;
    position: relative;
    top: 2px;
}

.filters-container .toggleFilters {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 150px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #FFFFFF;
    background: #404040;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    cursor: pointer;
    font-size: 18px;
}

.filters-container .toggleFilters:hover {background: #202020;}

.filters-container fieldset.closed .toggleFilters{display: none;}

/* ********************** */
/* CSS ADMIN LANDING PAGE */
/* ********************** */

#landing-page-wrapper {
    position: relative;
    padding-top: 50px;
    background-color: #FFFFFF;
}

#landing-page-wrapper h3 {
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    line-height: 50px;

    padding: 0 20px;
    box-sizing: border-box;

    background-color: #404040;
    color: #FFFFFF;

    font-size: 20px;
    font-weight: 600;
}

#landing-page-wrapper .fa {font-family: "FontAwesome";}
#landing-page-wrapper .add_import_blocs {
    position: absolute;
    top: 0;
    right: 0;
    height: 50px;
    line-height: 50px;
    color: #FFFFFF;
}

#landing-page-wrapper .add_import_blocs span.add,
#landing-page-wrapper .add_import_blocs span.import {
    width: 50px;
    height: 50px;
    line-height: 50px;
    border: 0;
}

#landing-page-wrapper .add_import_blocs span.add .fa,
#landing-page-wrapper .add_import_blocs span.import .fa {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
}
#landing-page-wrapper .add_import_blocs span.import .fa {margin-right: 5px;}
#landing-page-wrapper .add_import_blocs span.add:hover {width: 150px;}
#landing-page-wrapper .add_import_blocs span.import:hover {width: 160px;}

#landing-page-wrapper #societes .bloc-placeholder,
#landing-page-wrapper .bloc-container .bloc-placeholder {display: inline-block; height: 100%;}

#landing-page-wrapper #societes .bloc-placeholder:after,
#landing-page-wrapper .bloc-container .bloc-placeholder:after {
    content: "";
    display: block;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    margin: 10px;
    border: 1px dashed #C3C3C3;
}

#landing-page-wrapper .bloc-wrapper {border: 1px solid #C3C3C3; border-bottom: 0;}
#landing-page-wrapper .bloc-wrapper .bloc-action {
    position: relative;
    height: 40px;
    line-height: 40px;
    background-color: #F5F5F5;
    color: #808080;
    font-size: 16px;
    border-bottom: 1px solid #C3C3C3;
}

#landing-page-wrapper .bloc-wrapper .bloc-action .handle {
    width: 39px;
    height: 39px;
    line-height: 39px;
    text-align: center;
    background-color: #D5D5D5;
    color: #FFFFFF;
    cursor: -webkit-grab;
    vertical-align: top;
    margin-right: 10px;
}

#landing-page-wrapper .bloc-wrapper .bloc-action .handle:hover {background-color: #404040;}

#landing-page-wrapper .bloc-wrapper .bloc-action .action {
    width: 80px;
    height: 38px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}

#landing-page-wrapper .bloc-wrapper .bloc-action .action div {
    display: inline-block;
    width: 40px;
    height: 39px;
    line-height: 39px;
    text-align: center;
    vertical-align: top;
    cursor: pointer;
    border-left: 1px solid #C3C3C3;
}
#landing-page-wrapper .bloc-wrapper .bloc-action .action div:hover {background-color: #404040; color: #FFFFFF;}

#landing-page-wrapper .section#societes {height: 640px; border: 1px solid #C3C3C3;}
#landing-page-wrapper .section#societes .bloc-wrapper {display: inline-block; width: calc(100% / 3); height: 100%; border: 0;}
#landing-page-wrapper .section#societes .bloc-wrapper .bloc-content {height: calc(100% - 40px);}
#landing-page-wrapper .section#societes .bloc-wrapper .bloc-content .societe {width: 100%!important; height: 100%;}
#landing-page-wrapper .section#societes .bloc-wrapper:nth-child(even) .bloc-content .societe {background-color: #FFFFFF;}
#landing-page-wrapper .section#societes .bloc-wrapper:nth-child(odd) .bloc-content .societe {background-color: #F4F4F4;}

/* ********************** */
/* CSS ADMIN PAGE V5      */
/* ********************** */

#page-v5-wrapper {
    position: relative;
    padding-top: 50px;
    background-color: #FFFFFF;
}

#page-v5-wrapper h3 {
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    line-height: 50px;

    padding: 0 20px;
    box-sizing: border-box;

    background-color: #404040;
    color: #FFFFFF;

    font-size: 20px;
    font-weight: 600;
}

#page-v5-wrapper .fa {font-family: "FontAwesome";}
#page-v5-wrapper .add_import_blocs {
    position: absolute;
    top: 0;
    right: 0;
    height: 50px;
    line-height: 50px;
    color: #FFFFFF;
}

#page-v5-wrapper .add_import_blocs span.add,
#page-v5-wrapper .add_import_blocs span.import {
    width: 50px;
    height: 50px;
    line-height: 50px;
    border: 0;
}

#page-v5-wrapper .add_import_blocs span.add .fa,
#page-v5-wrapper .add_import_blocs span.import .fa {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
}
#page-v5-wrapper .add_import_blocs span.import .fa {margin-right: 5px;}
#page-v5-wrapper .add_import_blocs span.add:hover {width: 150px;}
#page-v5-wrapper .add_import_blocs span.import:hover {width: 160px;}

#page-v5-wrapper #societes .bloc-placeholder,
#page-v5-wrapper .bloc-container .bloc-placeholder {display: inline-block; height: 100%;}

#page-v5-wrapper #societes .bloc-placeholder:after,
#page-v5-wrapper .bloc-container .bloc-placeholder:after {
    content: "";
    display: block;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    margin: 10px;
    border: 1px dashed #C3C3C3;
}

#page-v5-wrapper .bloc-wrapper.small {
    height: 40px!important;
}

#page-v5-wrapper .bloc-wrapper.ghost .bloc-action {
    background-color: rgba(64, 64, 64, 0.53);
    color: #FFFFFF;
}

#page-v5-wrapper .bloc-wrapper {border: 1px solid #C3C3C3; border-bottom: 0;}
#page-v5-wrapper .bloc-wrapper .bloc-action {
    position: relative;
    height: 40px;
    line-height: 40px;
    background-color: #F5F5F5;
    color: #808080;
    font-size: 16px;
    border-bottom: 1px solid #C3C3C3;
}

#page-v5-wrapper .bloc-wrapper .bloc-content {pointer-events: none;}

#page-v5-wrapper .bloc-wrapper .bloc-action .handle {
    width: 39px;
    height: 39px;
    line-height: 39px;
    text-align: center;
    background-color: #D5D5D5;
    color: #FFFFFF;
    cursor: -webkit-grab;
    vertical-align: top;
    margin-right: 10px;
}

#page-v5-wrapper .bloc-wrapper .bloc-action .handle:hover {background-color: #404040;}

#page-v5-wrapper .bloc-wrapper .bloc-action .action {
    width: 80px;
    height: 38px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}

#page-v5-wrapper .bloc-wrapper .bloc-action .action div {
    display: inline-block;
    width: 40px;
    height: 39px;
    line-height: 39px;
    text-align: center;
    vertical-align: top;
    cursor: pointer;
    border-left: 1px solid #C3C3C3;
}
#page-v5-wrapper .bloc-wrapper .bloc-action .action div:hover {background-color: #404040; color: #FFFFFF;}

#page-v5-wrapper .section#societes {height: 640px; border: 1px solid #C3C3C3;}
#page-v5-wrapper .section#societes .bloc-wrapper {display: inline-block; width: calc(100% / 3); height: 100%; border: 0;}
#page-v5-wrapper .section#societes .bloc-wrapper .bloc-content {height: calc(100% - 40px);}
#page-v5-wrapper .section#societes .bloc-wrapper .bloc-content .bloc-societes {width: 100%!important; height: 100%;}
#page-v5-wrapper .section#societes > .bloc-wrapper:nth-child(even) .bloc-content .bloc-societes {background-color: #FFFFFF!important;}
#page-v5-wrapper .section#societes > .bloc-wrapper:nth-child(odd) .bloc-content .bloc-societes {background-color: #F4F4F4!important;}