/* Minification failed. Returning unminified contents.
(2985,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '274466'
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/* Alp-Software version : 1.00 */

html {
    font-family: Segoe UI,Tahoma,Arial,Verdana; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
}

body {
    margin: 0;
    padding: 0;
    font-size: 14px;
    color: #3d3d3d;
    background-color: #fff;
    font-weight: 300;
}

p{
    margin-top:5px;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block;
}

a {
    background-color: transparent;
    text-decoration: none;
}

    a:active,
    a:hover {
        outline: 0;
    }

small {
    font-size: 80%;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

img {
    border: 0;
}


table {
    border-collapse: collapse;
    border-spacing: 0;
}

td,
th {
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
    border: 0;
}

:focus {
    outline-color: transparent;
    outline-style: none;
}

input[type="text"]::-ms-clear,
textarea::-ms-clear {
    display: none;
}


select::-ms-expand {
    display: none;
}

canvas {
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

/*#region Fonts*/

@font-face {
    font-family: "Quicksand-Bold";
    src: url('../fonts/Quicksand-Bold.eot') format('eot'), url('../fonts/Quicksand-Bold.woff') format('woff'), url('../fonts/Quicksand-Bold.ttf') format('truetype');
}

@font-face {
    font-family: "Quicksand-Regular";
    src: url('../fonts/Quicksand-Regular.eot') format('eot'), url('../fonts/Quicksand-Regular.woff') format('woff'), url('../fonts/Quicksand-Regular.ttf') format('truetype');
}

/*#endregion*/

/*#region Attributs standards */

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.clear {
    clear: both;
    height: 0;
    overflow: hidden;
}

.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    zoom: 1;
}

.none {
    display: none;
}

.txt-left, .align-0 {
    text-align: left !important;
}

.txt-center, .align-1 {
    text-align: center !important;
}

.txt-right, .align-2 {
    text-align: right !important;
}

.txt-justify {
    text-align: justify !important;
}

.txt-top {
    vertical-align: top !important;
}

.txt-bottom {
    vertical-align: bottom !important;
}

.txt-middle {
    vertical-align: middle !important;
}

/*#endregion*/


/*#region Colonnes */
.row,
.col-2,
.col-3,
.col-4 {
    zoom: 1;
}

    .row:before, .row:after,
    .col-2:before, .col-2:after,
    .col-3:before, .col-3:after,
    .col-4:before, .col-4:after {
        content: "";
        display: table;
    }

    .row:after,
    .col-2:after,
    .col-3:after,
    .col-4:after {
        clear: both;
    }

    .col-2 > :nth-child(1n) {
        float: left;
        width: 50%;
    }

    .col-3 > :nth-child(1n) {
        float: left;
        width: 33.333333%;
    }

    .col-4 > :nth-child(1n) {
        float: left;
        width: 25%;
    }

    .col-2 + aside {
        margin-right: 50%;
    }

/*#endregion*/


/*#region Couleur */

.color-transparent {
    color: transparent;
}

/*#endregion*/

/*#region Couleur de fond */

.bg-red {
    background-color: #FF2D19;
}

.bg-orange {
    background-color: #FFA440;
}

.bg-green {
    background-color: #afcc14;
}

.bg-blue-light {
    background-color: #1983ff;
}

.bg-grey-light {
    background-color: #bfbfc6;
}
/*#endregion*/



/* Version 2.01 (03/02/2017) 
Ajout des classes pour l'environnement
*/

/*#region Titre */
h1 {
    margin-top: 20px;
    margin-bottom: 10px;
    margin-left: 2%;
    font-size: 30px;
    text-transform: uppercase;
    color: #1983FF;
    font-weight: bold;
    font-family: "Quicksand-Bold";
}

h2 {
    font-size: 20px;
    color: #274466;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: normal;
}


/*#endregion*/

/*#region Header */
#upHeader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 80px;
    background-color: #fff;
    z-index: 100;
    zoom: 1;
}

    #upHeader:before,
    #upHeader:after {
        content: "";
        display: table;
    }

    #upHeader:after {
        clear: both;
    }


    #upHeader > .logo {
        float: left;
        background-image: url('../images/layout/logo-aura.png');
        background-position: left center;
        background-repeat: no-repeat;
        min-width: 116px;
        height: 80px;
        margin: 0 1%;
    }

    #upHeader > .logo-groupe {
        float: right;
        background-image: url('../images/layout/logo-groupe.png');
        background-position: left center;
        background-repeat: no-repeat;
        min-width: 116px;
        height: 80px;
        margin: 0 1%;
    }

    #upHeader > .top-header {
        float: left;
        padding-top: 20px;
        height: 60px;
    }

        #upHeader > .top-header > .title {
            color: #1983FF;
            font-weight: bold;
            font-size: 14px;
            font-variant: small-caps;
        }

        #upHeader > .top-header > .version {
            margin: 0 10px 0 5px;
            color: #274466;
            font-weight: bold;
            font-size: 10px;
            font-style: italic;
            font-variant: small-caps;
        }

        #upHeader > .top-header > .environment {
            padding: 2px 7px;
            color: #fff;
            font-weight: bold;
            font-size: 10px;
            border-radius: 4px;
        }


    #upHeader > .h-notification {
        float: right;
        position: relative;
        height: 60px;
        margin: 20px 15px 0 15px;
    }

        #upHeader > .h-notification .ico {
            display: inline-block;
            margin-top: 16px;
            width: 30px;
            height: 30px;
            background-position: center center;
            background-repeat: no-repeat;
        }

        #upHeader > .h-notification .nb {
            position: absolute;
            left: 16px;
            top: 8px;
            height: 20px;
            line-height: 20px;
            background-color: #FF2D19;
            border-radius: 4px;
            color: #fff;
            padding: 0 8px;
            font-size: 0.9em;
        }

    #upHeader > .link {
        float: right;
        width: 60px;
        height: 60px;
        background-repeat: no-repeat;
        background-position: center 35px;
        -moz-transition: background-color linear 50ms;
        -o-transition: background-color linear 50ms;
        -webkit-transition: background-color linear 50ms;
        transition: background-color linear 50ms;
        padding-top: 20px;
    }

        #upHeader > .link:hover,
        #upHeader > .link.active {
            background-color: #1983ff;
            -moz-transition: background-color linear 150ms;
            -o-transition: background-color linear 150ms;
            -webkit-transition: background-color linear 150ms;
            transition: background-color linear 150ms;
        }

#updtProgressOverlay > .overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0;
    z-index: 1000;
    cursor: wait;
}

#updtProgressLoading {
    float: right;
    margin-top: 20px;
}

    #updtProgressLoading > .loading {
        width: 60px;
        height: 60px;
        background-image: url('../images/ico/loading-32.gif');
        background-position: center center;
        background-repeat: no-repeat;
        opacity: 0;
    }

/*#endregion*/

/*#region En-tête de la page */
#upHeaderTitle {
    position: fixed;
    top: 80px;
    left: 0;
    right: 0;
    height: 70px;
    background-color: #EFF3F2;
    z-index: 89;
    zoom: 1;
}

    #upHeaderTitle:before,
    #upHeaderTitle:after {
        content: "";
        display: table;
    }

    #upHeaderTitle:after {
        clear: both;
    }


    #upHeaderTitle > h1 {
        float: left;
        padding-left: 1%;
        margin: 0;
        font-size: 20px;
        font-family: "Quicksand-Bold";
        line-height: 70px;
        color: #AEB8B9;
        display: inline;
        text-transform: capitalize;
        border-bottom: none;
    }

    #upHeaderTitle > div {
        float: right;
        padding-right: 1%;
        margin-top: 15px;
    }

/*#endregion*/

/*#region Menu */

#header-menu-btn {
    display: none;
}

#header-menu > ul {
    padding: 0;
    margin: 0;
}

    #header-menu > ul > li {
        display: inline-block;
        margin-left: 40px;
    }

        #header-menu > ul > li:first-child {
            margin-left: 0;
        }

        #header-menu > ul > li > a {
            position: relative;
            color: #274466;
            font-size: 20px;
            text-decoration: none;
            font-family: "Quicksand-Bold";
            font-weight: bold;
            text-transform: uppercase;
            height: 42px;
            line-height: 42px;
        }


        #header-menu > ul > li:hover > a {
            color: #1983FF;
        }

        #header-menu > ul > li:hover > .sub-menu,
        #header-menu > ul > li:hover > .sub-menu > .image {
            display: block;
        }

        #header-menu > ul > li > .sub-menu {
            display: none;
            position: absolute;
            left: auto;
            top: 80px;
            background-color: #fff;
            padding: 10px 30px 20px 5px;
            overflow-y: auto;
            -webkit-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
            -moz-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
            box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
            z-index: 1;
            border-bottom: solid 5px #274466;
            zoom: 1;
        }

            #header-menu > ul > li > .sub-menu:before,
            #header-menu > ul > li > .sub-menu:after {
                content: "";
                display: table;
            }

            #header-menu > ul > li > .sub-menu:after {
                clear: both;
            }

            #header-menu > ul > li > .sub-menu > .image {
                float: left;
                width: 64px;
                height: 64px;
                background-image: url(../images/layout/menu.png);
                background-repeat: no-repeat;
            }

            #header-menu > ul > li > .sub-menu > .group {
                float: left;
            }

                #header-menu > ul > li > .sub-menu > .group > .titre {
                    padding: 5px 10px;
                    color: #1983FF;
                    font-size: 15px;
                    font-weight: bold;
                    font-family: "Quicksand-Bold";
                    text-transform: uppercase;
                }

                #header-menu > ul > li > .sub-menu > .group > a {
                    display: block;
                    padding: 7px 10px;
                    color: #274466;
                    -moz-transition: background-color linear 50ms;
                    -o-transition: background-color linear 50ms;
                    -webkit-transition: background-color linear 50ms;
                    transition: background-color linear 50ms;
                    text-transform: uppercase;
                }

                    #header-menu > ul > li > .sub-menu > .group > a:hover {
                        background-color: #EFF3F2;
                        -moz-transition: background-color linear 100ms;
                        -o-transition: background-color linear 100ms;
                        -webkit-transition: background-color linear 100ms;
                        transition: background-color linear 100ms;
                    }

/*#endregion*/

/*#region Holder du contenu de la page */
#upPage {
    padding-top: 150px;
    margin: 2% 0 30px 0;
}
/*#endregion*/

/*#region Scroll to Top */
#scroll-to-top {
    opacity: 0;
    position: fixed;
    bottom: 5px;
    left: -9999px;
    right: auto;
    width: 30px;
    height: 30px;
    border-radius: 2px;
    -webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    -moz-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    background-image: url('../images/layout/scroll-top.png');
    background-color: #556877;
    background-position: center center;
    background-repeat: no-repeat;
    -moz-transition: all linear 150ms;
    -o-transition: all linear 150ms;
    -webkit-transition: all linear 150ms;
    transition: all linear 150ms;
}

    #scroll-to-top.visible {
        left: auto;
        right: 5px;
        opacity: 0.5;
        -moz-transition: opacity linear 150ms;
        -o-transition: opacity linear 150ms;
        -webkit-transition: opacity linear 150ms;
        transition: opacity linear 150ms;
    }

    #scroll-to-top:hover {
        opacity: 1;
        -moz-transition: opacity linear 500ms;
        -o-transition: opacity linear 500ms;
        -webkit-transition: opacity linear 500ms;
        transition: opacity linear 500ms;
    }
/*#endregion*/

/* Version 2.01 (04/11/2016) 
Correction des largeurs pour les box de 25% et 33% sur plusieurs lignes
*/

/*#region Box*/
section {
    border: 1px solid transparent;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 2% 2% 2%;
    padding: 2%;
}


    section.box {
        background-color: #EFF3F2;
    }

    section.filter {
        padding: 0 2%;
    }

div.col-1 {
    margin: 0 2% 2% 2%;
}

.col-2 > section:nth-child(1n) {
    float: left;
    width: 47%;
}

.col-2 > div:nth-child(1n) {
    float: left;
    width: 50%;
}

.col-4 > section:nth-child(n),
.col-3 > section:nth-child(n),
.col-2 > section:nth-child(n) {
    margin-right: 0;
}

.row > section:nth-child(1n),
.row > div:nth-child(1n) {
    float: left;
}

/* 25% - 50% - 75% */
.row > .wp-25,
.row > .wp-33,
.row > .wp-50,
.row > .wp-66,
.row > .wp-75 {
    margin: 0 2% 2% 2%;
}

    .row > .wp-25 > section,
    .row > .wp-33 > section,
    .row > .wp-50 > section,
    .row > .wp-66 > section,
    .row > .wp-75 > section {
        margin: 0;
    }

.row > div.wp-75:nth-child(1n),
.row > div.wp-66:nth-child(1n),
.row > div.wp-50:nth-child(1n),
.row > div.wp-33:nth-child(1n),
.row > div.wp-25:nth-child(1n) {
    margin-right: 0;
    margin-bottom: 0;
}

.row > section:nth-child(1n) {
    margin-right: 0;
}

.row > .wp-25 > section {
    padding: 9.090909%;
    /*padding: calc(100% / 22% * 2%);*/
    margin-bottom: 9.090909%;
}

.row > .wp-50 + .wp-25 > section,
.row > .wp-25 + .wp-25 > section {
    padding: 8.695652%; /* 100% / 23% * 2% */
    margin-bottom: 8.695652%;
}

.row > .wp-33 > section {
    padding: 6.593407%; /* 100% / 30.3333333% * 2% */
    margin-bottom: 6.593407%;
}

.row > .wp-33 + .wp-33 section {
    padding: 6.382979%; /* 100% / 31.3333333% * 2% */
    margin-bottom: 6.382979%;
}

.row > .wp-75 > section {
    padding: 2.816901%; /* 100% / 71% * 2% */
    margin-bottom: 2.816901%;
}

.row > .wp-66 > section {
    padding: 3.141361%; /* 100% / 63.6666666% * 2% */
    margin-bottom: 3.141361%;
}

.row > .wp-50 > section {
    padding: 4.255319%; /* 100% / 47% * 2% */
    margin-bottom: 4.255319%;
}

.row > .wp-25 + .wp-50 > section {
    padding: 4.166666%; /* 100% / 48% * 2% */
    margin-bottom: 4.166666%;
}


.col-4 > section:nth-child(1n) + section:nth-child(1n) + section:nth-child(1n) + section:nth-child(1n),
.col-4 > section:nth-child(1n),
.row > .wp-25,
.max-wp-25 {
    width: 22%;
}

    .col-4 > section:nth-child(1n) + section:nth-child(1n),
    .row > .wp-50 + .wp-25,
    .row > .wp-25:nth-child(4n+1) + .wp-33,
    .row > .wp-25:nth-child(4n+2) + .wp-33 {
        width: 23%;
    }


.row > .wp-75,
.max-wp-75 {
    width: 72%;
}

.row > .wp-50,
.max-wp-50,
.row > .wp-25 + .wp-25 + .wp-50 {
    width: 47%;
}

.row > .wp-25 + .wp-50 {
    width: 48%;
}

.center-wp-25 {
    width: 23%;
    margin: 0 auto 2% auto;
}

.center-wp-50 {
    width: 48%;
    margin: 0 auto 2% auto;
}

.center-wp-75 {
    width: 72%;
    margin: 0 auto 2% auto;
}


/* 33% - 66% */


.col-3 > section:nth-child(1n) + section:nth-child(1n) + section:nth-child(1n),
.col-3 > section:nth-child(1n),
.row > .wp-33,
.max-wp-33 {
    width: 30.3333333%;
}

    .col-3 > section:nth-child(1n) + section:nth-child(1n),
    .row > .wp-33:nth-child(3n+1) + .wp-33 {
        width: 31.3333333%;
    }

.row > .wp-66,
.max-wp-66 {
    width: 63.6666666%;
}

.center-wp-33 {
    width: 31.3333333%;
    margin: 0 auto 2% auto;
}

.center-wp-66 {
    width: 63.6666666%;
    margin: 0 auto 2% auto;
}

/*#endregion*/

/*#region UC Collapsable*/
h1.uc-collapse {
    position: relative;
    padding-right: 30px;
    margin-left: 0;
    border-bottom: solid 1px #274466;
}

    h1.uc-collapse a {
        color: #274466;
        text-transform: uppercase;
        font-size: 20px;
    }

        h1.uc-collapse a:last-child {
            position: absolute;
            right: 5px;
            height: 22px;
            width: 22px;
            background-image: url('../images/layout/collapse.png');
            background-repeat: no-repeat;
            background-position: -22px 0;
        }

        h1.uc-collapse a.collapse:last-child {
            background-position: 0 0;
        }

            h1.uc-collapse a.collapse:last-child:hover {
                background-position: 0 -22px;
            }

        h1.uc-collapse a:last-child:hover {
            background-position: -22px -22px;
        }
/*#endregion*/



/*#region Aside */

aside:before,
aside:after {
    content: "";
    display: table;
}

aside:after {
    clear: both;
}

aside {
    zoom: 1;
}


    aside.section {
        border: 1px solid transparent;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 0 2% 0 2%;
        padding: 0;
    }

/*#endregion*/



/*#region Fullheight */

[data-fullheight] {
    height: 0px;
    overflow-y: auto;
}
/*#endregion*/



/*#region Dimensions */

.wp-25 {
    width: 25%;
}

.wp-33 {
    width: 33.3333333%;
}

.wp-50 {
    width: 50%;
}

.wp-66 {
    width: 66.6666666%;
}

.wp-75 {
    width: 75%;
}

.wp-100 {
    width: 100%;
}

.m-0 {
    margin: 0 !important;
}

.mt-0 {
    margin-top: 0 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.ml-0 {
    margin-left: 0 !important;
}

.mr-0 {
    margin-right: 0 !important;
}

.p-0 {
    padding: 0 !important;
}

.pt-0 {
    padding-top: 0 !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.pl-0 {
    padding-left: 0 !important;
}

.pr-0 {
    padding-right: 0 !important;
}

/*#endregion*/



/* 
Version 2.04
Date : 23/06/2017

Ajout du support des class col-x sur les RadioButtonList et CheckBoxList

*/

/*#region Textbox */
input[type="text"],
input[type="password"] {
    border: 1px solid #bfbfc6;
    color: #3d3d3d;
    border-radius: 2px;
    height: 30px;
    padding: 4px 8px;
    margin: 0;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    input[type="text"]:focus,
    input[type="password"]:focus {
        border: 1px solid #274466;
    }

    input[type="text"][disabled],
    input[type="password"][disabled] {
        color: #3d3d3d;
        background-color: #eee;
    }

    input[type="text"].readonly,
    input[type="password"].readonly {
        visibility: hidden;
    }

    input[type='text'].jsonly {
        border: 1px solid transparent;
        background-image: none;
        background-color:transparent;
    }

    input[type="text"][data-case="upper"]{
        text-transform : uppercase;
    }

div.form-readonly.input-text {
    padding: 4px 0;
    display: inline-block;
}

input[type="text"][data-type="date"] {
    max-width: 150px;
    padding-right: 30px;
    background-image: url('../images/layout/input-date.png');
    background-position: right 0;
    background-repeat: no-repeat;
}

input[type="text"][data-type="number"],
input[type="text"][data-type="int"] {
    width: 55%;
    max-width: 150px;
    text-align: right;
}

input[type="text"][data-type="time"] {
    width: 55%;
    max-width: 100px;
    padding-right: 30px;
    background-image: url('../images/layout/input-time.png');
    background-position: right 0;
    background-repeat: no-repeat;
}


input[type="text"][data-type="date"] + input[type="text"][data-type="time"],
#dp-holder + input[type="text"][data-type="time"] {
    width: 43%;
    max-width: 100px;
    margin-left: 2%;
}

/*#endregion */

/*#region Textbox conditionnel */
span.conditional {
    position: relative;
}

    span.conditional > input[type="checkbox"] + label {
        position: absolute;
        top: 2px;
        left: 6px;
        width: 20px;
        height: 20px;
        margin: 0;
        padding: 0;
    }

    span.conditional + input[type="text"] {
        padding-left: 26px;
    }

/*#endregion */

/*#region Multiligne */
textarea {
    font-family: Segoe UI,Tahoma,Arial,Verdana;
    border: 1px solid #bfbfc6;
    color: #3d3d3d;
    border-radius: 2px;
    padding: 4px 8px;
    margin: 0;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    resize: none;
}

    textarea:focus {
        border: 1px solid #274466;
    }

    textarea[disabled] {
        color: #3d3d3d;
        background-color: #eee;
    }

    textarea.readonly {
        visibility: hidden;
    }


div.form-readonly.input-textarea {
    padding: 4px 0;
}

/*#endregion */

/*#region Radio bouton */
input[type="radio"] {
    position: absolute;
    left: -9999px;
    height: 0;
}

    input[type="radio"] + label {
        background-image: url(../images/layout/input-form.png);
        background-position: 0 0;
        background-repeat: no-repeat;
        cursor: pointer;
        display: inline-block;
        margin: 5px 4% 0 0;
        padding-left: 22px;
        max-height: 30px;
        min-height: 20px;
    }

    input[type="radio"]:hover + label {
        background-position: 0 -30px;
    }

    input[type="radio"]:checked + label {
        background-position: 0 -60px;
    }

    input[type="radio"][disabled] + label {
        color: #bfbfc6;
        cursor: default;
    }

    input[type="radio"][disabled]:hover + label {
        background-position: 0 0;
    }

    input[type="radio"][disabled]:checked + label {
        background-position: 0 -90px;
        color: #3d3d3d;
    }

span.readonly > input[type="radio"],
span.readonly > input[type="radio"] + label,
span.readonly > input[type="radio"] + label + br {
    display: none;
}

    span.readonly > input[type="radio"]:checked + label {
        display: inline-block;
        background-image: none;
        padding-left: 0;
        cursor: default;
    }


span.col-2 > input[type="radio"] + label {
    min-width: calc(46% - 22px);
    max-width: calc(46% - 22px);
    overflow: hidden;
    line-height: 20px;
    max-height: 20px;
}

span.col-3 > input[type="radio"] + label {
    min-width: calc(29.33% - 22px);
    max-width: calc(29.33% - 22px);
    overflow: hidden;
    line-height: 20px;
    max-height: 20px;
}

span.col-4 > input[type="radio"] + label {
    min-width: calc(21% - 22px);
    max-width: calc(21% - 22px);
    overflow: hidden;
    line-height: 20px;
    max-height: 20px;
}

/*#endregion */

/*#region Checkbox */
input[type="checkbox"] {
    position: absolute;
    left: -9999px;
    height: 0;
}

    input[type="checkbox"] + label {
        background-image: url(../images/layout/input-form.png);
        background-position: 0 -120px;
        background-repeat: no-repeat;
        cursor: pointer;
        display: inline-block;
        margin: 5px 4% 0 0;
        padding-left: 22px;
        max-height: 30px;
        min-height: 20px;
    }

    input[type="checkbox"]:hover + label {
        background-position: 0 -150px;
    }

    input[type="checkbox"]:checked + label {
        background-position: 0 -180px;
    }

    input[type="checkbox"][disabled] + label {
        color: #bfbfc6;
        cursor: default;
    }

    input[type="checkbox"][disabled]:hover + label {
        background-position: 0 -120px;
    }

    input[type="checkbox"][disabled]:checked + label {
        background-position: 0 -210px;
        color: #3d3d3d;
    }

span.readonly > input[type="checkbox"],
span.readonly > input[type="checkbox"] + label {
    display: none;
}

    span.readonly > input[type="checkbox"]:checked + label {
        display: inline-block;
        background-image: none;
        padding-left: 0;
        cursor: default;
    }

span.conditional > span.readonly > input[type="checkbox"]:checked + label {
    display: none;
}

span.col-2 > input[type="checkbox"] + label {
    min-width: calc(46% - 22px);
    max-width: calc(46% - 22px);
    overflow: hidden;
    line-height: 20px;
    max-height: 20px;
}

span.col-3 > input[type="checkbox"] + label {
    min-width: calc(29.33% - 22px);
    max-width: calc(29.33% - 22px);
    overflow: hidden;
    line-height: 20px;
    max-height: 20px;
}

span.col-4 > input[type="checkbox"] + label {
    min-width: calc(21% - 22px);
    max-width: calc(21% - 22px);
    overflow: hidden;
    line-height: 20px;
    max-height: 20px;
}


/*#endregion */

/*#region Liste déroulante */
select {
    border: 1px solid #bfbfc6;
    color: #3d3d3d;
    border-radius: 2px;
    height: 30px;
    padding: 4px 8px;
    margin: 0;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-image: url('../images/layout/input-select.png');
    background-position: right 0;
    background-repeat: no-repeat;
}

    select[size] {
        visibility: hidden;
    }

    select.loaded {
        position: absolute;
        left: -9999px;
        height: 0;
    }

    select[disabled] {
        color: #3d3d3d;
        background-color: #eee;
    }

/*#endregion */

/*#region Formulaire */
article.form > div {
    margin-bottom: 10px;
    display: table;
    width: 100%;
}

    article.form > div > span.lbl {
        text-align: right;
        vertical-align: top;
        display: table-cell;
        width: 50%;
        color: #4D4D4D;
        padding-right: 2%;
        padding-top: 5px;
    }

        article.form > div > span.lbl.left {
            text-align: left;
        }

        article.form > div > span.lbl.required:after {
            content: " *";
            font-weight: normal;
            color: #FFA440;
        }

        article.form > div > span.lbl.wp-75 {
            width: 75%;
        }

        article.form > div > span.lbl.wp-66 {
            width: 66.666666%;
            width: calc(100% * 200% / 300%);
        }

        article.form > div > span.lbl.wp-33 {
            width: 33.333333%;
            width: calc(100% / 3);
        }

        article.form > div > span.lbl.wp-25 {
            width: 25%;
        }

    article.form > div > span.ctl.lbl {
        text-align: left;
        font-weight: normal;
    }

    article.form > div > span.ctl {
        display: table-cell;
    }

        article.form > div > span.ctl.wpx-30 {
            width: 30px;
            vertical-align : middle;
        }

article.form.block > div > span.lbl {
    text-align: left;
    display: block;
    width: auto;
    padding-right: 0;
}

article.form.block > div > span.ctl {
    display: block;
}


article.form .note {
    display: block;
    font-size: 11px;
    margin-top: 1%;
    color: #4d4d4d;
}

article.form > div > .ctl .msg {
    margin-top: 2%;
}




/*#endregion */

/*#region Formulaire */

.formvalidation-error,
.formvalidation-error + .search-input,
.formvalidation-error + .search-holder,
.formvalidation-error + .search-holder .search-input {
    -moz-transition: background-color 500ms;
    -o-transition: background-color 500ms;
    -webkit-transition: background-color 500ms;
    transition: background-color 500ms;
    background-color: #ffe9e9;
}

/*#endregion */

/*#region Filtres */

article.form > div > span.ctl.wp-50.less-wpx-30 {
    width: calc(50% - 30px);
}

article.form > div > span.ctl.wp-75.less-wpx-30 {
    width: calc(75% - 30px);
}

/*#endregion */

/* Icones 20x20 */
.ico-bell { background-image:url('../images/ico/bell-20.png'); }
.ico-add { background-image:url('../images/ico/add-20.png'); }
.ico-cross { background-image:url('../images/ico/cross-20.png'); }
.ico-edit { background-image:url('../images/ico/edit-20.png'); }
.ico-upload { background-image:url('../images/ico/upload-20.png'); }
.ico-download { background-image:url('../images/ico/download-20.png'); }
.ico-warning { background-image:url('../images/ico/warning-20.png'); }
.ico-check { background-image:url('../images/ico/check-20.png'); }
.ico-check2 { background-image:url('../images/ico/check2-20.png'); }
.ico-reload { background-image:url('../images/ico/reload-20.png'); }
.ico-etc { background-image:url('../images/ico/etc-20.png'); }
.ico-minus { background-image:url('../images/ico/minus-20.png'); }
.ico-up { background-image:url('../images/ico/up-20.png'); }
.ico-down { background-image:url('../images/ico/down-20.png'); }
.ico-left { background-image:url('../images/ico/left-20.png'); }
.ico-right { background-image:url('../images/ico/right-20.png'); }
.ico-copy { background-image:url('../images/ico/copy-20.png'); }
.ico-paste { background-image:url('../images/ico/paste-20.png'); }
.ico-export { background-image:url('../images/ico/export-20.png'); }
.ico-search { background-image:url('../images/ico/search-20.png'); }
.ico-back { background-image:url('../images/ico/back-20.png'); }
.ico-agency { background-image:url('../images/ico/agency-20.png'); }
.ico-book { background-image:url('../images/ico/book-20.png'); }
.ico-building { background-image:url('../images/ico/building-20.png'); }
.ico-chat { background-image:url('../images/ico/chat-20.png'); }
.ico-checklist { background-image:url('../images/ico/checklist-20.png'); }
.ico-code { background-image:url('../images/ico/code-20.png'); }
.ico-cog { background-image:url('../images/ico/cog-20.png'); }
.ico-database { background-image:url('../images/ico/database-20.png'); }
.ico-energy { background-image:url('../images/ico/energy-20.png'); }
.ico-factory { background-image:url('../images/ico/factory-20.png'); }
.ico-home { background-image:url('../images/ico/home-20.png'); }
.ico-hourglass { background-image:url('../images/ico/hourglass-20.png'); }
.ico-list { background-image:url('../images/ico/list-20.png'); }
.ico-lock { background-image:url('../images/ico/lock-20.png'); }
.ico-manager { background-image:url('../images/ico/manager-20.png'); }
.ico-manyfiles { background-image:url('../images/ico/manyfiles-20.png'); }
.ico-map { background-image:url('../images/ico/map-20.png'); }
.ico-network { background-image:url('../images/ico/network-20.png'); }
.ico-photo { background-image:url('../images/ico/photo-20.png'); }
.ico-pie { background-image:url('../images/ico/pie-20.png'); }
.ico-pinpoint { background-image:url('../images/ico/pinpoint-20.png'); }
.ico-counter { background-image:url('../images/ico/counter-20.png'); }
.ico-uncheckedlist { background-image:url('../images/ico/uncheckedlist-20.png'); }
.ico-unlock { background-image:url('../images/ico/unlock-20.png'); }
.ico-user { background-image:url('../images/ico/user-20.png'); }
.ico-wrench { background-image:url('../images/ico/wrench-20.png'); }
.ico-excel { background-image:url('../images/ico/excel-20.png'); }
.ico-pdf { background-image:url('../images/ico/pdf-20.png'); }
.ico-trash { background-image:url('../images/ico/trash-20.png'); }
.ico-sign { background-image:url('../images/ico/sign-20.png'); }
.ico-document { background-image: url('../images/ico/document-20.png'); }
.ico-open { background-image: url('../images/ico/open-20.png'); }
.ico-mail { background-image: url('../images/ico/mail-20.png'); }
.ico-file-check { background-image: url('../images/ico/file-check-20.png'); }
.ico-ticket-facture { background-image: url('../images/ico/ticket-facture-20.png');}

/* Icones 30x30 */
.ico-calendar-30 { background-image:url('../images/ico/calendar-30.png'); }
.ico-firstday-30 { background-image:url('../images/ico/firstday-30.png'); }
.ico-usercheck-30 { background-image:url('../images/ico/usercheck-30.png'); }
.ico-file-30 { background-image:url('../images/ico/file-30.png'); }
.ico-account-30 {background-image: url('../images/ico/account-30.png');}
.ico-help-30 {background-image: url('../images/ico/help-30.png');}
.ico-notification { background-image:url('../images/ico/notification-30.png'); }

/* Icones menu */
.ico-menu-livre{ background-position: 0 0;}
.ico-menu-dossier{ background-position: 0 -64px;}
.ico-menu-param{ background-position: 0 -128px;}
.ico-menu-stat{ background-position: 0 -192px;}
.ico-menu-user {background-position: 0 -256px;}
/* Version 2.01 (03/02/2017) 
Ajout des classes pour l'environnement
*/

.indicators {
    margin-bottom: 20px;
}

    .indicators > .indicator {
        float: left;
        padding-right: 6%;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

        .indicators > .indicator:nth-child(2n) {
            padding-right: 0;
        }

        .indicators > .indicator > .icone {
            float: left;
            margin-top: 5px;
            margin-right: 20px;
            width: 30px;
            height: 30px;
            background-repeat: no-repeat;
            background-position: center center;
        }

        .indicators > .indicator > .content {
            margin-left: 50px;
            text-align: center;
        }

            .indicators > .indicator > .content > .chiffre {
                padding-bottom: 4px;
                margin-bottom: 4px;
                border-bottom: solid 2px #1983FF;
                font-weight: bold;
                font-family: "Quicksand-Bold";
                font-size: 25px;
                color: #1983FF;
            }

            .indicators > .indicator > .content > .title {
                font-size: 14px;
            }

/* Couleur des environnements */
#upHeader [data-env="DEV"].environment {
    background-color: #e9592c;
}

#upHeader [data-env="RECETTE"].environment {
    background-color: #AFCC14;
}

/* Mon Compte */
div[data-ctxmenu="a-ctx-account"] div.content {
    background-image: url('../images/layout/ctx-account.png');
    background-position: center top;
    background-repeat: no-repeat;
    padding: 128px 20px 0 20px;
    text-align: center;
}

    div[data-ctxmenu="a-ctx-account"] div.content a {
        display: inline-block;
        padding: 0 5px;
        font-size: 12px;
        line-height: 24px;
        text-transform: none;
        font-weight: 400;
        border-radius: 2px;
        margin: 10px;
        min-width: 100px;
    }

.margin-top-10 {
    margin-top: 10px;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.cp {
    width: 29% !important;
    float: left;
    margin-right: 1% !important;
}

.ville {
    width: 70% !important;
    float: left;
}

.link-black {
    color: #4d4d4d;
}

    .link-black:hover {
        color: #1983ff;
    }

.link-underline-black {
    color: #4d4d4d;
    text-decoration: underline;
}

.tab-materielgammeetape {
}

    .tab-materielgammeetape td {
        padding: 0 !important;
        vertical-align: middle !important;
    }

        .tab-materielgammeetape td input[type=checkbox] + label {
            min-height: 20px;
        }


.table-01 tr.selected td {
    background-color: #afcc14 !important;
}

/* Tous / Aucun */
.chk-all, .chk-none {
    font-size: 10px;
    font-weight: normal;
    color: #bfbfc6;
}

/*Icones*/
.edocumenticone-1-16 {
    background-image: url(../images/edocumenticone/1_16.png);
}

.edocumenticone-1-20 {
    background-image: url(../images/edocumenticone/1_20.png);
}

.edocumenticone-2-16 {
    background-image: url(../images/edocumenticone/2_16.png);
}

.edocumenticone-2-20 {
    background-image: url(../images/edocumenticone/2_20.png);
}

.edocumenticone-3-16 {
    background-image: url(../images/edocumenticone/3_16.png);
}

.edocumenticone-3-20 {
    background-image: url(../images/edocumenticone/3_20.png);
}

.edocumenticone-4-16 {
    background-image: url(../images/edocumenticone/4_16.png);
}

.edocumenticone-4-20 {
    background-image: url(../images/edocumenticone/4_20.png);
}

.edocumenticone-5-16 {
    background-image: url(../images/edocumenticone/5_16.png);
}

.edocumenticone-5-20 {
    background-image: url(../images/edocumenticone/5_20.png);
}

.edocumenticone-6-16 {
    background-image: url(../images/edocumenticone/6_16.png);
}

.edocumenticone-6-20 {
    background-image: url(../images/edocumenticone/6_20.png);
}

.line-separator {
    border-bottom: 1px solid #bfbfc6;
    margin-top: 20px;
    margin-bottom: 20px;
}

.ctl-lbl {
    vertical-align: top;
    padding-top: 5px;
}

/*Espace client*/
#accueil-client .logo {
    padding: 50px;
    background-color: #fff;
    border: solid 2px #274466;
    border-radius: 5px;
}

    #accueil-client .logo img {
        width: 100%;
        height: auto;
    }

#accueil-client a.contrat {
    position: relative;
    display: inline-block;
    margin-right: 20px;
}

    #accueil-client a.contrat > .icone {
        width: 150px;
        height: 189px;
        background-image: url('../images/layout/contrat.png');
        background-repeat: no-repeat;
    }

    #accueil-client a.contrat > .contrat-nom {
        position: absolute;
        top: 80px;
        left: 20px;
        width: 110px;
        color: #274466;
        text-transform: uppercase;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 14px;
        font-weight: bold;
    }

    #accueil-client a.contrat > .contrat-code {
        position: absolute;
        top: 100px;
        left: 20px;
        width: 110px;
        color: #274466;
        text-transform: uppercase;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 14px;
        font-weight: bold;
    }

    #accueil-client a.contrat > .contrat-date {
        position: absolute;
        top: 130px;
        left: 20px;
        color: #274466;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 14px;
    }


#accueil-client a.document {
    display: inline-block;
    width: 200px;
    margin-right: 20px;
    margin-bottom: 20px;
    padding: 10px;
    background-color: #274466;
}

#accueil-client .document > .icone {
    float: left;
    width: 30px;
    margin-right: 10px;
}

    #accueil-client .document > .icone img {
        display: block;
        width: 100%;
    }

#accueil-client .document > .document-nom {
    float: left;
    width: 160px;
    height: 40px;
    color: #fff;
    overflow: hidden;
}

#accueil-client .box-clt {
    position: relative;
}

    #accueil-client .box-clt .deconnexion {
        position: absolute;
        bottom: 40px;
        left: 9.09%;
        margin-right: 0;
        margin-bottom: 0;
        width: 40%;
        text-align: center;
        padding-left: 0;
        padding-right: 0;
        font-size: 0.8em;
    }

    #accueil-client .box-clt .mon-compte {
        position: absolute;
        bottom: 40px;
        right: 9.09%;
        margin-right: 0;
        margin-bottom: 0;
        width: 40%;
        text-align: center;
        padding-left: 0;
        padding-right: 0;
        font-size: 0.8em;
    }

    #accueil-client .box-clt .espace-clt {
        position: absolute;
        bottom: 40px;
        left: 9.09%;
        margin-right: 0;
        margin-bottom: 0;
        width: 40%;
        text-align: center;
        padding-left: 0;
        padding-right: 0;
        font-size: 0.8em;
    }

#accueil-client .box-document .signer {
    margin-top: 20px;
    margin-right: 0;
    margin-bottom: 0;
    text-align: right;
    font-size: 0.8em;
}

#espace-client #upPage {
    padding-top: 60px;
}

#espace-client #upHeader > .logo-groupe {
    position: absolute;
    top: 10px;
    right: 0px;
    float: none;
    background-image: url('../images/layout/logo-groupe-big.png');
    min-width: 250px;
    height: 112px;
}

.accueil-retour {
    display: inline-block;
    margin-left: 2%;
    margin-top: -10px;
    margin-bottom: 15px;
    padding: 5px 12px;
    background-color: #54a8dd;
    border-radius: 5px;
    color: #fff;
    text-decoration: none;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: bold;
}

    .accueil-retour:hover {
        background-color: #ECEDEE;
        color: #24a1d8;
    }

@media screen and (max-width:1024px) {

    #espace-client #upHeader > .logo-groupe {
        display: none;
    }

    #accueil-client .box-clt {
        position: relative;
        min-height: initial;
    }

        #accueil-client .box-clt .deconnexion {
            position: initial;
            bottom: 0;
            left: 0;
            margin-top: 10px;
            margin-right: 10px;
        }

        #accueil-client .box-clt .mon-compte {
            position: initial;
            bottom: 0;
            right: 0;
            margin-top: 10px;
        }

        #accueil-client .box-clt .espace-clt {
            position: initial;
            bottom: 0;
            right: 0;
            margin-top: 10px;
        }
}

/*Fluide*/
.ico-echargesens-1 {
    height: 20px;
    width: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url('../images/ico/echargesens-1.png');
}

.ico-echargesens-2 {
    height: 20px;
    width: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url('../images/ico/echargesens-2.png');
}

.ico-ebouteilletype-1 {
    height: 20px;
    width: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url('../images/ico/ebouteilletype-1.png');
}

.ico-ebouteilletype-2 {
    height: 20px;
    width: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url('../images/ico/ebouteilletype-2.png');
}

.ico-ebouteilletype-3 {
    height: 20px;
    width: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url('../images/ico/ebouteilletype-3.png');
}


.color-grey {
    color: #bfbfc6;
}


/*Historique des interventions de maintenance*/
.mois-1 td:nth-child(4),
.mois-2 td:nth-child(5),
.mois-3 td:nth-child(6),
.mois-4 td:nth-child(7),
.mois-5 td:nth-child(8),
.mois-6 td:nth-child(9),
.mois-7 td:nth-child(10),
.mois-8 td:nth-child(11),
.mois-9 td:nth-child(12),
.mois-10 td:nth-child(13),
.mois-11 td:nth-child(14),
.mois-12 td:nth-child(15) {
    background-color: #1983ff !important;
    color: #fff !important;
}


/*Ticket*/
.ticket-historique {
    margin-bottom: 10px;
    background-color: #fff;
    padding: 10px;
}

    .ticket-historique.ticket-border-orange {
        border-top: solid 1px #ff8500;
        border-right: solid 1px #ff8500;
        border-bottom: solid 1px #ff8500;
    }

    .ticket-historique.ticket-border-blue {
        border-top: solid 1px #1983FF;
        border-right: solid 1px #1983FF;
        border-bottom: solid 1px #1983FF;
    }

    .ticket-historique.ticket-border-gray {
        border-top: solid 1px #bfbfc6;
        border-right: solid 1px #bfbfc6;
        border-bottom: solid 1px #bfbfc6;
    }

    .ticket-historique .title {
        float: left;
        font-weight: bold;
    }

    .ticket-historique commentaire {
        color: #4D4D4D;
    }

    .ticket-historique .mail {
        margin-left: 5px;
        float: right;
    }

    .ticket-historique .sms {
        float: right;
    }

.ticket-border-orange,
textarea.ticket-border-orange:focus {
    border-left: solid 13px #ff8500;
}

.ticket-border-blue,
textarea.ticket-border-blue:focus {
    border-left: solid 13px #1983FF;
}

.ticket-border-gray,
textarea.ticket-border-gray:focus {
    border-left: solid 13px #bfbfc6;
}

/*Ticket statut*/
.row-ticketstatut > .col-ticketstatut {
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 25px;
}

.row-ticketstatut.ticketstatut-1 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/1.png');
}

.row-ticketstatut.ticketstatut-2 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/2.png');
}

.row-ticketstatut.ticketstatut-3 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/3.png');
}

.row-ticketstatut.ticketstatut-4 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/4.png');
}

.row-ticketstatut.ticketstatut-5 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/5.png');
}

.row-ticketstatut.ticketstatut-6 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/6.png');
}

.row-ticketstatut.ticketstatut-7 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/7.png');
}

.row-ticketstatut.ticketstatut-8 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/8.png');
}

.row-ticketstatut.ticketstatut-9 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/9.png');
}

.row-ticketstatut.ticketstatut-10 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/10.png');
}

.row-ticketstatut.ticketstatut-11 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/11.png');
}

.row-ticketstatut.ticketstatut-12 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/12.png');
}

.row-ticketstatut.ticketstatut-13 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/13.png');
}

.row-ticketstatut.ticketstatut-14 > .col-ticketstatut {
    background-image: url('../images/eticketstatut/14.png');
}

/*Evaluation*/
.evaluation {
}

    .evaluation .star {
        display: inline-block;
        margin-right: 5px;
        width: 30px;
        height: 30px;
        background-image: url('../images/ico/star-empty-30.png');
        background-repeat: no-repeat;
    }

        .evaluation .star.hover,
        .evaluation .star.active {
            background-image: url('../images/ico/star-full-30.png');
        }

/*Photographie*/
.thumbnail-photo {
    width:150px;
    height:auto;
    margin-right:15px;
}
/*#region DatePicker*/

#dp-holder {
    position: absolute;
    background-color: #fff;
    padding: 5px;
    border:1px solid #eee;
    -webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    -moz-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    border-radius: 2px;
    margin-top: 10px;
    z-index: 1050;
    width: 210px; /* 30 * 7 */
}



    #dp-holder .dp-header .dp-prev,
    #dp-holder .dp-header .dp-next {
        float: left;
        width: 10px;
        height: 10px;
        padding: 10px;
        border-radius: 4px;
        -moz-transition: background-color linear 50ms;
        -o-transition: background-color linear 50ms;
        -webkit-transition: background-color linear 50ms;
        transition: background-color linear 50ms;
    }

    #dp-holder .dp-header .dp-next {
        float: right;
    }

        #dp-holder .dp-header .dp-prev:hover,
        #dp-holder .dp-header .dp-next:hover {
            background-color: #eee;
            -moz-transition: background-color linear 150ms;
            -o-transition: background-color linear 150ms;
            -webkit-transition: background-color linear 150ms;
            transition: background-color linear 150ms;
        }


        #dp-holder .dp-header .dp-prev span,
        #dp-holder .dp-header .dp-next span {
            display: block;
            width: 0;
            height: 0;
            border-style: solid;
            -moz-transition: border-color linear 50ms;
            -o-transition: border-color linear 50ms;
            -webkit-transition: border-color linear 50ms;
            transition: border-color linear 50ms;
        }

    #dp-holder .dp-header .dp-prev span {
        border-width: 5px 8.7px 5px 0;
        border-color: transparent #eee transparent transparent;
    }

    #dp-holder .dp-header .dp-next span {
        border-width: 5px 0 5px 8.7px;
        border-color: transparent transparent transparent #eee;
    }

    #dp-holder .dp-header .dp-prev:hover span {
        border-color: transparent #bfbfc6 transparent transparent;
    }

    #dp-holder .dp-header .dp-next:hover span {
        border-color: transparent transparent transparent #bfbfc6;
    }

    #dp-holder .dp-view-day .dp-header .dp-month-year {
        float: left;
        width: 110px;
        text-align: center;
    }

        #dp-holder .dp-view-day .dp-header .dp-month-year .dp-content {
            display: inline-block;
            height: 20px;
            padding: 5px;
            border-radius: 4px;
            cursor: pointer;
            -moz-transition: background-color linear 50ms;
            -o-transition: background-color linear 50ms;
            -webkit-transition: background-color linear 50ms;
            transition: background-color linear 50ms;
        }

            #dp-holder .dp-view-day .dp-header .dp-month-year .dp-content:hover {
                background-color: #eee;
                -moz-transition: background-color linear 150ms;
                -o-transition: background-color linear 150ms;
                -webkit-transition: background-color linear 150ms;
                transition: background-color linear 150ms;
            }

    #dp-holder .dp-header .dp-month {
        color: #3d3d3d;
    }

    #dp-holder .dp-header .dp-year {
        padding-left: 5px;
        color: #bfbfc6;
    }


    #dp-holder .dp-header .dp-today {
        float: right;
        width: 20px;
        height: 20px;
        padding: 5px;
    }

        #dp-holder .dp-header .dp-today a {
            display: block;
            height: 16px;
            width: 16px;
            border: 2px solid #eee;
            border-radius: 16px;
            color: #eee;
            line-height: 16px;
            font-size: 12px;
            font-weight: bold;
            text-align: center;
        }

            #dp-holder .dp-header .dp-today a:hover {
                border: 2px solid #bfbfc6;
                background-color: #bfbfc6;
                color: #fff;
            }


    #dp-holder .dp-weekday span {
        float: left;
        width: 30px;
        line-height: 30px;
        height: 30px;
        color: #1983ff;
        font-size: 11px;
        text-align: center;
        text-transform: uppercase;
    }

    #dp-holder .dp-view-day-holder a,
    #dp-holder .dp-view-day-holder span {
        float: left;
        width: 30px;
        line-height: 30px;
        height: 30px;
        color: #3d3d3d;
        font-size: 12px;
        text-align: center;
    }

        #dp-holder .dp-view-day-holder a.dp-current,
        #dp-holder .dp-view-day-holder a:hover {
            border-radius: 4px;
            background-color: #1983ff;
            color: #fff;
        }


        #dp-holder .dp-view-day-holder a.dp-other {
            color: #bfbfc6;
        }

        #dp-holder .dp-view-day-holder a.dp-today {
            color: #afcc14;
        }


            #dp-holder .dp-view-day-holder a.dp-other:hover,
            #dp-holder .dp-view-day-holder a.dp-today:hover {
                color: #fff;
            }

    #dp-holder .dp-view-day-holder span {
        color: #eee;
    }

    /*#endregion */
    
/*#region Vue par mois */
    #dp-holder .dp-view-month .dp-header {
        height: 30px;
        text-align: center;
    }

        #dp-holder .dp-view-month .dp-header .dp-year {
            float:left;
            width:140px;
            height: 20px;
            padding: 5px;
            border-radius: 4px;
            cursor: pointer;
            -moz-transition: background-color linear 50ms;
            -o-transition: background-color linear 50ms;
            -webkit-transition: background-color linear 50ms;
            transition: background-color linear 50ms;
        }

            #dp-holder .dp-view-month .dp-header .dp-year:hover {
                background-color: #eee;
                -moz-transition: background-color linear 150ms;
                -o-transition: background-color linear 150ms;
                -webkit-transition: background-color linear 150ms;
                transition: background-color linear 150ms;
            }


    #dp-holder .dp-view-month-holder a,
    #dp-holder .dp-view-month-holder span {
        float: left;
        width: 70px;
        line-height: 30px;
        height: 30px;
        color: #3d3d3d;
        font-size: 12px;
        text-align: center;
    }

        #dp-holder .dp-view-month-holder a:hover {
            border-radius: 4px;
            background-color: #1983ff;
            color: #fff;
        }
        
    #dp-holder .dp-view-month-holder span {
        color: #eee;
    }
    
    /*#endregion*/
     
/*#region Vue par ann�e */   
    #dp-holder .dp-view-month .dp-header {
        height: 30px;
    }

       
    #dp-holder .dp-view-year-holder a,
    #dp-holder .dp-view-year-holder span {
        float: left;
        width: 70px;
        line-height: 30px;
        height: 30px;
        color: #3d3d3d;
        font-size: 12px;
        text-align: center;
    }

        #dp-holder .dp-view-year-holder a:hover {
            border-radius: 4px;
            background-color: #1983ff;
            color: #fff;
        }
        
    #dp-holder .dp-view-year-holder span {
        color: #eee;
    }
/*#endregion */
/*#region Liste d�roulante - Zone de recherche */
select + .search-input {
    padding-right: 30px;
    background-image: url('../images/layout/input-select.png');
    background-position: right 0;
    background-repeat: no-repeat;
}

select.readonly {
    display: none;
}
/*#endregion*/

/*#region Multiselection & Multicomplete - Zone de recherche */
.search-holder {
    background-color: #fff;
}

select[size] + .search-holder:before,
select[size] + .search-holder:after,
div.multicomplete.search-holder:before,
div.multicomplete.search-holder:after {
    content: "";
    display: table;
}

select[size] + .search-holder:after,
div.multicomplete.search-holder:after {
    clear: both;
}

select[size] + .search-holder {
    border: 1px solid #bfbfc6;
    color: #3d3d3d;
    border-radius: 2px;
    min-height: 30px;
    padding: 4px 30px 0 4px;
    margin: 0;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-image: url('../images/layout/input-select.png');
    background-position: right 0;
    background-repeat: no-repeat;
    background-size: 30px;
    cursor: text;
    zoom: 1;
}


div.multicomplete.search-holder {
    border: 1px solid #bfbfc6;
    color: #3d3d3d;
    border-radius: 2px;
    min-height: 30px;
    padding: 4px 30px 0 4px;
    margin: 0;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-image: url('../images/layout/input-autocomplete.png');
    background-position: right 0;
    background-repeat: no-repeat;
    background-size: 30px;
    cursor: text;
    zoom: 1;
}

    select[size] + .search-holder.active,
    div.multicomplete.search-holder.active {
        border: 1px solid #274466;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    select[size].aspNetDisabled + .search-holder,
    div.multicomplete.search-holder.aspNetDisabled {
        color: #3d3d3d;
        background-color: #eee;
        cursor: default;
    }

    div.multicomplete.search-holder.readonly {
        visibility: hidden;
    }


    select[size] + .search-holder > .search-items,
    div.multicomplete.search-holder > .search-items {
        float: left;
    }

        select[size] + .search-holder > .search-items > .search-item,
        div.multicomplete.search-holder > .search-items > .search-item {
            float: left;
            position: relative;
            border-radius: 4px;
            background-color: #1983ff;
            margin: 0 4px 4px 0;
            font-size: 12px;
            padding: 0 24px 0 8px;
            line-height: 20px;
            color: #fff;
        }

    select[size].aspNetDisabled + .search-holder > .search-items > .search-item,
    div.multicomplete.search-holder.aspNetDisabled > .search-items > .search-item {
        padding: 0 8px 0 8px;
        background-color: #bfbfc6;
        color: #3d3d3d;
    }

    select[size] + .search-holder > .search-items > .search-item a,
    div.multicomplete.search-holder > .search-items > .search-item a {
        position: absolute;
        right: 4px;
        top: 3px;
        width: 14px;
        height: 14px;
        line-height: 10px;
        text-align: center;
        display: inline-block;
        color: #3d3d3d;
        border-radius: 16px;
        background-color: #eff3f2;

    }

        select[size] + .search-holder > .search-items > .search-item a:hover,
        div.multicomplete.search-holder > .search-items > .search-item a:hover {
            background-color: #274466;
            color:#fff;
        }

    select[size] + .search-holder > input.search-input,
    div.multicomplete.search-holder > input.search-input {
        float: right;
        min-width: 120px;
        margin-bottom: 4px;
        font-size: 12px;
        padding: 0;
        height: 22px;
        border: none;
        border-radius: 0;
    }

/*#endregion*/

/*#region autocomplete */
input[type="text"].autocomplete {
    padding-right: 30px;
    background-image: url('../images/layout/input-autocomplete.png');
    background-position: right 0;
    background-repeat: no-repeat;
}
/*#endregion*/

/*#region Zone de recherche */
.lc-holder {
    position: absolute;
    background-color: #fff;
    padding-top: 3px;
    border-left: 1px solid #274466;
    border-bottom: 1px solid #274466;
    border-right: 1px solid #274466;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    margin-top: 10px;
    z-index: 85;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .lc-holder > .lc-list {
        overflow-y: auto;
        max-height: 150px;
    }

        .lc-holder > .lc-list > a {
            padding: 4px 8px;
            display: block;
            color: #3d3d3d;
            min-height: 20px;
        }

            .lc-holder > .lc-list > a:hover,
            .lc-holder > .lc-list > a.hover,
            .lc-holder > .lc-list > a.no-hover.hover:hover {
                color: #3d3d3d;
                background-color: #eee;
            }

            .lc-holder > .lc-list > a.no-hover:hover {
                color: #3d3d3d;
                background-color: #fff;
            }


            .lc-holder > .lc-list > a.selected {
                background-color: #1983ff;
                color: #fff;
            }

        .lc-holder > .lc-list > .no-result {
            font-size: 11px;
            color: #bfbfc6;
            text-align: center;
            padding: 5px;
        }


    .lc-holder > .lc-const:before,
    .lc-holder > .lc-const:after {
        content: "";
        display: table;
    }

    .lc-holder > .lc-const:after {
        clear: both;
    }

    .lc-holder > .lc-const {
        zoom: 1;
        height: 30px;
    }


        .lc-holder > .lc-const > a {
            float: right;
            line-height: 14px;
            height: 14px;
            color: #fff;
            background-color: #1983ff;
            margin-top: 6px;
            margin-right: 8px;
            padding: 2px 8px;
            font-size: 11px;
            border-radius: 2px;
        }

            .lc-holder > .lc-const > a[data-action] {
                float: left;
                margin-left: 8px;
                margin-right: 0;
            }

            .lc-holder > .lc-const > a:hover {
                background-color: #274466;
            }

/*#endregion*/



/*#region Tooltip */

.tooltip-holder {
    position: absolute;
    z-index: 920;
    max-width: 30%;
}

    .tooltip-holder.invisible {
        visibility: hidden;
        left: -9999px;
        top:0;
    }

    .tooltip-holder > .content {
        position: relative;
        z-index: 919;
        overflow: hidden;
        padding: 4px 7px 4px 7px;
        border-radius: 2px;
        background-color: #3d3d3d;
        color: #fff;
        font-size: 11px;
        -webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
        -moz-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
        box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    }

    .tooltip-holder > .arrow {
        position: absolute;
        left: 0;
        bottom: -4px;
        z-index: 920;
        width: 0;
        height: 0;
        border-width: 8px 10px 0 10px;
        border-style: solid;
        border-color: #3d3d3d transparent transparent transparent;
    }
    
/*#endregion*/

.ctxaction,
[data-ctxmenu] {
    display: none;
    position: absolute;
    z-index: 101;
}

    .ctxaction.fixed,
    [data-ctxmenu].fixed {
        position: fixed;
    }

/* Menu contextuel dans la page */
#upPage .ctxaction,
#upPage [data-ctxmenu] {
    z-index: 85;
}

article.form > div.ctxaction,
article.form > div[data-ctxmenu] {
    display: none;
    width: auto;
    margin-bottom: 0
}

.ctxaction[data-location="bottom"] .content,
[data-ctxmenu][data-location="bottom"] .content {
    margin-top: 10px;
    border-bottom: solid 5px #274466;
}

.ctxaction[data-location="top"] .content,
[data-ctxmenu][data-location="top"] .content {
    margin-top: 0;
    margin-bottom: 10px;
    border-top: solid 5px #274466;
}

.ctxaction[data-location="right"] .content,
[data-ctxmenu][data-location="right"] .content {
    margin-top: 0;
    margin-left: 10px;
    border-right: solid 5px #274466;
}

.ctxaction[data-location="left"] .content,
[data-ctxmenu][data-location="left"] .content {
    margin-top: 0;
    margin-right: 10px;
    border-left: solid 5px #274466;
}

.ctxaction > .content,
[data-ctxmenu] > .content {
    z-index: 10;
    margin-top: -1px;
    position: relative;
    padding: 5px;
    background-color: #fff;
    -webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.10);
    box-shadow: 0 0 3px 3px rgba(0,0,0,0.10);
    border: 1px solid #bfbfc6;
}

    .ctxaction > .content > a,
    [data-ctxmenu] > .content > a {
        display: block;
        text-decoration: none;
        color: #274466;
        padding: 5px 10px;
        text-transform: uppercase;
        font-size: 13px;
        text-align: center;
    }

        .ctxaction > .content > a:hover,
        [data-ctxmenu] > .content > a:hover {
            background-color: #EFF3F2;
            -moz-transition: background-color linear 100ms;
            -o-transition: background-color linear 100ms;
            -webkit-transition: background-color linear 100ms;
            transition: background-color linear 100ms;
        }

    .ctxaction > .content > hr,
    [data-ctxmenu] > .content > hr {
        height: 1px;
        background-color: #bfbfc6;
        border: none;
        margin: 5px 20px;
        padding: 0;
    }

#ctxhelp {
    position: fixed;
    padding-bottom: 10px;
    width: 100%;
    z-index: 1;
    top: -340px;
    height: 340px;
    -webkit-transition: top 150ms linear;
    -moz-transition: top 150ms linear;
    -ms-transition: top 150ms linear;
    -o-transition: top 150ms linear;
    transition: top 150ms linear;
    background-color: #fff;
}

    #ctxhelp > section.box {
        overflow-y: auto;
        padding: 10px;
        height: 280px;
    }


body.ctxhelp-visible #ctxhelp {
    top: 150px;
    -webkit-transition: top 250ms linear;
    -moz-transition: top 250ms linear;
    -ms-transition: top 250ms linear;
    -o-transition: top 250ms linear;
    transition: top 250ms linear;
}

body.ctxhelp-visible #upPage {
    -webkit-transition: all 250ms linear;
    -moz-transition: all 250ms linear;
    -ms-transition: all 250ms linear;
    -o-transition: all 250ms linear;
    transition: all 250ms linear;
    padding-top: 490px;
}

body #upPage {
    -webkit-transition: padding-top 150ms linear;
    -moz-transition: padding-top 150ms linear;
    -ms-transition: padding-top 150ms linear;
    -o-transition: padding-top 150ms linear;
    transition: padding-top 150ms linear;
    padding-top: 150px;
}

/*#region Tableau */
.table-01 {
    width: 100%;
    font-size: 12px;
    border-bottom: solid 5px #274466;
}

    .table-01 td {
        padding: 5px;
        min-height: 20px;
        vertical-align: top;
        font-weight: normal;
        background-color: #fff;
    }

        .table-01 td > a {
            color: #3d3d3d;
            text-decoration: underline;
            display: block;
        }

    .table-01 thead th {
        padding: 7px 5px 5px 5px;
        min-height: 18px;
        vertical-align: top;
        font-weight: normal;
        color: #fff;
        background-color: #274466;
        font-family: "Quicksand-Bold";
        text-align: left;
    }

        .table-01 thead th a {
            display: block;
            color: #fff;
            text-decoration: none;
        }


        .table-01 thead th.sortable {
            background-image: url(../images/layout/input-form.png);
            background-repeat: no-repeat;
            background-position: right 9999px;
        }

            .table-01 thead th.sortable:hover {
                background-position: right -230px;
            }

            .table-01 thead th.sortable.asc {
                background-position: right -290px;
            }

                .table-01 thead th.sortable.asc:hover {
                    background-position: right -230px;
                }

            .table-01 thead th.sortable.desc {
                background-position: right -350px;
            }

                .table-01 thead th.sortable.desc:hover {
                    background-position: right -410px;
                }


    .table-01.editable tbody tr > td.td-action > a {
        margin-top: 5px;
    }

    .table-01 tbody tr > td.td-action > a {
        display: inline-block;
        color: #fff;
        margin-left: 4px;
        height: 20px;
        width: 20px;
        border-radius: 4px;
        background-color: #274466;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 50%;
        text-decoration: none;
    }

    .table-01 tbody tr[data-key] > td,
    .table-01 tbody tr[data-href] > td {
        cursor: pointer;
    }

    .table-01 tbody tr.even td,
    .table-01 tbody tr:nth-child(even) td {
        background-color: #ebeef2;
    }

    .table-01 tbody tr.odd td,
    .table-01 tbody tr:nth-child(odd) td {
        background-color: #fff;
    }


    .table-01 tbody tr:hover td {
        background-color: #AFCC14;
        color: #fff;
    }

    .table-01 tfoot td {
        background-color: #274466;
        color: #fff;
    }

    /*#endregion */

    /*#region Multiselection */
    .table-01.multiselect label {
        margin: 0;
        min-height: 20px;
        padding-left: 16px;
    }

    .table-01.multiselect tr > th:first-child {
        width: 20px;
        274466
    }

    /*#endregion */

    /*#region Lecture seule */

    .table-01.readonly tbody td.td-action,
    .table-01.readonly td.td-action,
    .table-01.multiselect.readonly tr > th:first-child,
    .table-01.multiselect.readonly tr > td:first-child,
    .table-01.readonly thead th.th-action {
        display: none;
    }


    .table-01.readonly tbody tr[data-key] > td,
    .table-01.readonly tbody tr[data-href] > td {
        cursor: default;
    }



/*endregion*/

.drilldown {
    width: 100%;
    font-size: 12px;
    border: 1px solid #ebeef2;
}

    .drilldown thead th {
        padding: 5px;
        min-height: 20px;
        vertical-align: top;
        font-weight: normal;
        color: #fff;
        background-color: #274466;
        text-align: center;
        width: 100px;
    }

        .drilldown thead th a {
            display: block;
            color: #fff;
            text-decoration: none;
        }

    .drilldown tbody tr.open td {
        font-weight: bold;
    }

    .drilldown tbody tr.selected td {
        background-color: #556877 !important;
        font-weight: bold;
        color: #fff;
    }

    .drilldown tbody td {
        padding: 5px;
        min-height: 20px;
        font-weight: normal;
        cursor: pointer;
        background-color: #fff;
    }

    .drilldown td div {
        position: relative;
    }

    .drilldown td:hover div {
        text-decoration: underline;
    }

    .drilldown td div span {
        position: absolute;
        width: 16px;
        height: 16px;
        left: -21px;
    }

        .drilldown td div span.btn-ico {
            padding: 0;
        }

    .drilldown tr.no-action td:hover div {
        text-decoration: none;
    }

    .drilldown tr.no-action td {
        cursor: default;
    }

    .drilldown tbody tr.even td {
        background-color: #ebeef2;
    }

    .drilldown tbody tr:hover td {
        background-color: #AFCC14;
        color: #fff;
    }

    .drilldown tfoot td {
        padding: 5px;
        min-height: 20px;
        font-weight: normal;
        background-color: #274466;
        color: #fff;
    }


    .drilldown .btn-ico:hover {
        background-color: #1983ff;
    }

/*#region Bouton avec du texte*/

.btn {
    display: inline-block;
    padding: 10px 20px;
    color: #fff;
    text-transform: uppercase;
    margin-right: 10px;
    background-color: #1983FF;
    font-size: 14px;
    /*font-family: "Quicksand-Regular";*/
    vertical-align: top;
    border-radius: 3px;
    margin-bottom: 1%;
}

    .btn.small {
        padding: 2px 5px;
        font-size: 11px;
        line-height: 20px;
        text-transform: none;
        margin-right: 5px;
    }

h2 + .btn {
    position: relative;
    float: right;
    margin: -45px 0 0 0;
    padding: 5px 10px;
}

article.form > div + aside > .btn,
article.form > div + aside > .btn-txt-ico,
article.form > div + aside > .btn-ico {
    margin-bottom: 0;
}


/*#endregion*/

/*#region Bouton avec du texte et un icone*/
.btn-txt-ico {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 1%;
    padding: 10px 20px;
    padding-left: 40px;
    color: #fff;
    text-transform: uppercase;
    background-color: #1983FF;
    font-size: 14px;
    /*font-family: "Quicksand-Regular";*/
    background-position: 10px center;
    background-repeat: no-repeat;
    border-radius: 3px;
    vertical-align: top;
}


h2 + .btn-txt-ico {
    position: relative;
    float: right;
    margin: -45px 0 0 0;
    padding: 5px 10px 5px 30px;
    background-size: 12px;
}


/*#endregion*/

/*#region Bouton avec un icone */

.btn-ico {
    display: inline-block;
    padding: 10px;
    color: #fff;
    height: 20px;
    width: 20px;
    margin-right: 10px;
    border-radius: 3px;
    background-color: #1983FF;
    background-position: center center;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-bottom: 1%;
}

    .btn-ico.small {
        padding: 2px;
        background-size: 50%;
        margin-right: 5px;
    }


    .btn-ico.round {
        border-radius: 50%;
    }

h2 + .btn-ico {
    position: relative;
    float: right;
    margin: -45px 0 0 0;
    padding: 5px;
    background-size: 50%;
}


article.form > div > .ctl + .wpx-30 > .btn-ico {
    margin: 0;
    margin-left: 10px;
    vertical-align: middle;
}

article.form > div > .lbl + .wpx-30 > .btn-ico {
    margin: 0;
    margin-right: 10px;
    vertical-align: middle;
}

/*#endregion*/

/*#region Général*/

.btn-ico:hover,
.btn-txt-ico:hover,
.btn:hover {
    background-color: #274466;
}


.btn-ico.right,
.btn-txt-ico.right,
.btn.right {
    float: right;
    margin-right: 0;
    margin-left: 10px;
}

.btn-ico.left,
.btn-txt-ico.left,
.btn.left {
    float: left;
}


/*#endregion*/

/*#region Couleur des boutons */

.table-01 tbody tr > td.td-action > a.grey-dark,
.btn-ico.grey-dark,
.btn-txt-ico.grey-dark,
.btn.grey-dark {
    background-color: #556877;
}

    .btn-ico.grey-dark:hover,
    .btn-txt-ico.grey-dark:hover,
    .btn.grey-dark:hover {
        background-color: #bfbfc6;
    }

.table-01 tbody tr > td.td-action > a.grey-light,
.btn-ico.grey-light,
.btn-txt-ico.grey-light,
.btn.grey-light {
    background-color: #bfbfc6;
}

    .btn-ico.grey-light:hover,
    .btn-txt-ico.grey-light:hover,
    .btn.grey-light:hover {
        background-color: #556877;
    }

.table-01 tbody tr > td.td-action > a.blue,
.btn-ico.blue,
.btn-txt-ico.blue,
.btn.blue {
    background-color: #274466;
}

    .btn-ico.blue:hover,
    .btn-txt-ico.blue:hover,
    .btn.blue:hover {
        background-color: #1983FF;
    }
    
.table-01 tbody tr > td.td-action > a.green,
.btn-ico.green,
.btn-txt-ico.green,
.btn.green {
    background-color: #afcc14;
}

    .btn-ico.green:hover,
    .btn-txt-ico.green:hover,
    .btn.green:hover {
        background-color: #32a43f;
    }

.table-01 tbody tr > td.td-action > a.red,
.btn-ico.red,
.btn-txt-ico.red,
.btn.red {
    background-color: #FF2D19;
}

    .btn-ico.red:hover,
    .btn-txt-ico.red:hover,
    .btn.red:hover {
        background-color: #C60C02;
    }

.table-01 tbody tr > td.td-action > a.brown,
.btn-ico.brown,
.btn-txt-ico.brown,
.btn.brown {
    background-color: #B27300;
}

    .btn-ico.brown:hover,
    .btn-txt-ico.brown:hover,
    .btn.brown:hover {
        background-color: #ec9800;
    }

.table-01 tbody tr > td.td-action > a.orange,
.btn-ico.orange,
.btn-txt-ico.orange,
.btn.orange {
    background-color: #FFA440;
}

    .btn-ico.orange:hover,
    .btn-txt-ico.orange:hover,
    .btn.orange:hover {
        background-color: #ff8500;
    }

/*#endregion*/

/*#region Controles désactivés */

.btn.aspNetDisabled,
.btn-ico.aspNetDisabled,
.btn-txt-ico.aspNetDisabled,
.btn.aspNetDisabled:hover,
.btn-ico.aspNetDisabled:hover,
.btn-txt-ico.aspNetDisabled:hover {
    background-color: #eee;
    color: #3d3d3d;
}


/*#endregion*/

/*#region msg */

.msg {
    position: relative;
    border-radius: 4px;
    padding: 10px 30px 10px 45px;
    background-repeat: no-repeat;
    background-position: 10px 15px;
    color: #fff;
    font-weight: 300;
    min-height: 50px;
    margin-bottom: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.msg > .title{
    font-weight: 600;
}

.msg > a{
    position: absolute;
    top: 5px;
    right: 5px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('../images/ico/cross-20.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50%;
}

.msg > .titre{
    font-weight: bold;
}

/*#endregion*/


/*#region notification*/
.notification {
    z-index: 900;
    position: fixed;
    max-width: 20%;
}

/*#endregion*/
.tab > .header {
    display: table;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 2% 1% 2%;
}

section.box > .tab > .header {
    margin: 0;
}

.tab > .header > a {
    display: table-cell;
    text-align: center;
    color: #274466;
    font-weight: 600;
    padding: 10px 0 10px 0;
    font-size: 18px;
    border-bottom: 5px solid transparent;
    text-transform: uppercase;
}

section.box > .tab > .panel {
    border: 1px solid #eee;
    padding: 2%;
}

    section.box > .tab > .panel > section {
        margin-right: 0;
        margin-left: 0;
    }

        section.box > .tab > .panel > section:last-child {
            margin-bottom: 0;
        }


.tab > .header > span {
    display: table-cell;
}

.tab > .header > a:hover {
    color: #1983ff;
}

.tab > .header > a.selected {
    border-bottom: 5px solid #1983ff;
    color: #1983ff;
}

.tab > .panel {
    border: none;
    border-radius: 2px;
}

.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 800;
    background-image: url(../images/layout/popup-background.png);
    overflow-y: auto;
}

    .popup-overlay > .holder {
        position: absolute;
        top: 0;
        left: 0;
        max-width: 96%;
    }

    .popup-overlay .holder > .content {
        position: relative;
        background-color: #fff;
        -webkit-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
        -moz-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
        box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
        border: 1px solid #bfbfc6;
        border-radius: 4px;
        padding: 20px;
        padding-top: 50px;
    }

div.no-header > .popup-overlay .holder > .content {
    padding-top: 20px;
}


.popup-overlay > .holder > .content > .title {
    display: block;
    padding: 0 80px 2px 0;
    margin: -35px 0 10px 0;
    font-size: 22px;
    text-transform: uppercase;
    color: #274466;
}

.popup-overlay > .holder > .content > .close {
    position: absolute;
    top: 20px;
    right: 20px;
    height: 20px;
    width: 20px;
    background-image: url('../images/layout/popup-cross.png');
    background-position: top center;
    background-repeat: no-repeat;
}

    .popup-overlay > .holder > .content > .close:hover {
        background-position: bottom center;
    }



.popup-overlay > .holder > .content > .move {
    position: absolute;
    top: 20px;
    right: 60px;
    height: 20px;
    width: 20px;
    background-image: url('../images/layout/popup-move.png');
    background-position: top center;
    background-repeat: no-repeat;
    cursor: pointer;
}

    .popup-overlay > .holder > .content > .move:hover {
        background-position: bottom center;
    }

.photoviewer-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 1000;
    background-image: url(../images/layout/popup-background.png);
    overflow-y: auto;
}

    .photoviewer-overlay.invisible > .photoviewer-overlay * {
        visibility: hidden;
    }

    .photoviewer-overlay .holder {
        z-index: 1000;
        position: absolute;
        top: 0;
        left: 0;
        max-width: 100%;
    }

        .photoviewer-overlay .holder > .content {
            position: relative;
            background-color: #fff;
            -webkit-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
            -moz-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
            box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
            border: 1px solid #bfbfc6;
            border-radius: 4px;
            margin: 2%;
            padding: 2%;
            padding-top: 35px;
        }


            .photoviewer-overlay .holder > .content > img {
                width: 100%;
                height: auto;
            }

        .photoviewer-overlay .holder .content > .close {
            position: absolute;
            top: 12px;
            right: 12px;
            height: 20px;
            width: 20px;
            background-image: url('../images/layout/popup-cross.png');
            background-position: top center;
            background-repeat: no-repeat;
        }

        .photoviewer-overlay .holder > .close:hover {
            background-position: bottom center;
        }

/*#region Uploader */

.uploader-holder{
    display:block;
    padding-top:4px;
    min-height:16px;
}

.uploader-holder > input[type="file"] {
    position: absolute;
    left: -9999px;
    height: 0;
}

.uploader-holder > a.valider{
    display:none;
}

.uploader-holder > .loading
{
    display:none;
}
  
.uploader-holder.readonly > a.valider,
.uploader-holder.readonly > a.parcourir,
.uploader-holder.readonly > a.remove,
.uploader-holder.readonly > input[type="file"]{
    display:none;
}

/*#endregion */

.treeview {
    border: 1px solid #bfbfc6;
    border-radius: 2px;
    min-height: 112px;
    background-color:#fff;
}

    .treeview.aspNetDisabled {
        background-color: #eee;
    }

        .treeview.aspNetDisabled a {
            cursor: default;
        }


    .treeview .node {
        display: block;
        min-height: 20px;
        line-height: 20px;
        padding: 4px 8px 4px 0;
        border-left: 8px solid transparent;
        cursor: pointer;
        color: #3d3d3d;
        background-image: url(../images/ico/circle-right-black.png);
        background-position: left center;
        background-repeat: no-repeat;
        text-decoration: none;
    }

        .treeview .item:hover,
        .treeview .node:hover {
            background-color: #afcc14;
            border-left: 8px solid #afcc14;
        }

        .treeview .node.open {
            background-image: url(../images/ico/circle-down-black.png);
        }

        .treeview .node.selected {
            border-left: 8px solid #1983ff;
            background-color: #1983ff;
            color: #fff;
            background-image: url(../images/ico/circle-down.png);
        }

    .treeview .item.selected {
        border-left: 8px solid #1983ff;
        background-color: #1983ff;
        color: #fff;
    }

    .treeview.aspNetDisabled .selected {
        border-left: 8px solid #bfbfc6;
        background-color: #bfbfc6;
    }


    .treeview .item {
        display: block;
        min-height: 20px;
        line-height: 20px;
        padding: 4px 8px 4px 0;
        border-left: 8px solid transparent;
        color: #3d3d3d;
        text-decoration: none;
    }

    .treeview span {
        display: block;
        padding-left: 30px;
        background-position: 2px 2px;
        background-repeat: no-repeat;
    }

    .treeview .ico-folder {
        background-image: url(../images/ico/folder-black.png);
    }

    .treeview > .selected > .ico-folder {
        background-image: url(../images/ico/folder.png);
    }

.imagelist:before,
.imagelist:after {
    content: "";
    display: table;
}
.imagelist:after {
    clear: both;
}

.imagelist > a{
    float: left;
    margin:  3px 5px 2px 0; 
    height: 23px;
    width: 23px;
    background-position:center center;
    background-repeat:no-repeat;
    opacity:0.5;
    border:1px solid transparent;  

}

.imagelist > a:hover{
    opacity:1;
}

.imagelist.aspNetDisabled > a:hover{
    opacity:0.5;
    cursor:default;
}

.imagelist > a.selected,
.imagelist.aspNetDisabled > a.selected
{
    opacity:1;
    border:1px solid #bfbfc6;
    border-radius:4px;
    background-color:#eee;
}

.imagelist.readonly > a{
    display:none;
}

.imagelist.readonly > a.selected{
    display:inline;
    opacity:1;
    border:none;
    border-radius:0;
    cursor:default;
    background-color:transparent;
}



.userform{
    padding: 0 50px 0 0;
    padding-right: calc(60px - 2%);
}

.userbtn{
    position: fixed;
    width: 60px;
    top: 45%;
    right: 0;
}

.userbtn > a{
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    margin-bottom: 5px;
    -webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    -moz-box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    box-shadow: 0 0 5px 2px rgba(0,0,0,0.10);
    -webkit-transition: all 100ms linear;
    -moz-transition: all 100ms linear;
    -ms-transition: all 100ms linear;
    -o-transition: all 100ms linear;
    transition: all 100ms linear;
}

.userbtn > a:hover{
    padding: 13px;
    margin-top: 2px;
    margin-bottom: 2px;
    -webkit-transition: all 150ms linear;
    -moz-transition: all 150ms linear;
    -ms-transition: all 150ms linear;
    -o-transition: all 150ms linear;
    transition: all 150ms linear;
}



/* Version 2.02 (03/02/2017) 
Ajout des classes pour l'environnement
*/

@media screen and (max-width:1024px) {

    html {
        min-width: 320px;
    }

    body {
        font-size: 12px;
    }

    p {
        margin-top: 8px;
    }

    /* COMMON */

    .col-2 > div:nth-child(1n),
    .col-3 > div:nth-child(1n),
    .col-4 > div:nth-child(1n),
    .row > :nth-child(1n),
    .col-2 > :nth-child(1n),
    .col-3 > :nth-child(1n),
    .col-4 > :nth-child(1n),
    .row > :nth-child(1n) {
        float: none;
        display: block;
        width: auto;
    }

    .max-wp-66,
    .max-wp-75 {
        max-width: none;
        margin-right: 2%;
    }

    .center-wp-33,
    .center-wp-50,
    .center-wp-66,
    .center-wp-75 {
        width: 100%;
        margin-bottom: 2%;
    }

    .row > div.wp-75 > section.box,
    .row > div.wp-66 > section.box,
    .row > div.wp-33 > section.box,
    .row > div.wp-25 > section.box {
        padding: 2%;
    }


    .row > .wp-25 > section,
    .row > .wp-50 + .wp-25 > section,
    .row > .wp-25 + .wp-25 > section,
    .row > .wp-33 > section,
    .row > .wp-33 + .wp-33 section,
    .row > .wp-75 > section,
    .row > .wp-66 > section,
    .row > .wp-50 > section,
    .row > .wp-25 + .wp-50 > section {
        padding: 2%;
        margin-bottom: 2%;
    }


    .row > .wp-25,
    .max-wp-25,
    .row > .wp-25 + .wp-25 + .wp-25 + .wp-25,
    .row > .wp-50 + .wp-25 + .wp-25,
    .row > .wp-25 + .wp-50 + .wp-25,
    .row > .wp-50 + .wp-25,
    .row > .wp-25 + .wp-25,
    .row > .wp-75,
    .max-wp-75,
    .row > .wp-50,
    .max-wp-50,
    .row > .wp-25 + .wp-25 + .wp-50,
    .row > .wp-25 + .wp-50,
    .center-wp-25,
    .center-wp-50,
    .center-wp-75,
    .row > .wp-33,
    .max-wp-33,
    .row > .wp-33 + .wp-33 + .wp-33,
    .row > .wp-33 + .wp-33,
    .row > .wp-66,
    .max-wp-66,
    .center-wp-33,
    .center-wp-66 {
        width: 96%;
        margin: 0 2% 2% 2%;
    }

    /* HEADER */
    #upHeader {
        height: 50px;
    }

        #upHeader > .logo {
            min-width: inherit;
            width: 87px;
            height: 34px;
            margin: 8px 0 8px 8px;
            background-size: contain;
        }

        #upHeaderTitle > .page-header .search,
        #upHeader > .top-header .title {
            display: none;
        }

        #upHeader > .top-header {
            float: right;
            padding-top: 0;
            margin-right: 1%;
            width: auto;
            height: 50px;
        }

            #upHeader > .top-header > .title {
                display: none;
            }

            #upHeader > .top-header > .version {
                display: none;
            }

            #upHeader > .top-header > .environment {
                display: none;
            }

        #upHeader > .h-notification {
            float: right;
            padding: 0 3px 0 3px;
            margin: 0;
            height: 50px;
            margin-top: 0;
            background-position: center center;
        }

            #upHeader > .h-notification .ico {
                margin: 0;
                width: 35px;
                height: 50px;
                background-size: 70%;
            }

            #upHeader > .h-notification .nb {
                font-size: 0.7em;
                padding: 0 5px;
                height: 15px;
                line-height: 15px;
            }

        #upHeader > .link {
            margin: 0 3px 0 3px;
            width: 35px;
            height: 50px;
            background-size: 70%;
            padding-top: 0;
            background-position: center center;
        }


        #upHeader > [data-env] {
            height: 30px;
            margin: 5px;
            padding: 5px 5px;
            border-radius: 4px;
        }

    #updtProgressLoading {
        margin-top: 0;
    }

        #updtProgressLoading > .loading {
            height: 50px;
            width: 30px;
        }

    /* MENU */

    /*#region Menu */

    #header-menu-btn {
        float: left;
        display: inline-block;
        margin-top: 13px;
        margin-left: 8px;
        margin-right: 5px;
    }

    #header-menu {
        position: fixed;
        display: none;
        top: 50px;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #fff;
        -webkit-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
        -moz-box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
        box-shadow: 0 0 7px 2px rgba(0,0,0,0.30);
        z-index: 999;
        overflow-y: auto;
        border-bottom: solid 5px #274466;
    }

        #header-menu.active {
            display: block;
        }

        #header-menu > ul > li {
            display: block;
            padding: 5px 15px;
            margin: 0;
        }

            #header-menu > ul > li > a {
                display: block;
                color: #274466;
                font-size: 15px;
            }

            #header-menu > ul > li > .sub-menu {
                position: initial;
                padding: 10px 0 20px 5px;
                box-shadow: none;
                border-bottom: none;
            }

            #header-menu > ul > li:hover > .sub-menu {
                display: block;
            }

                #header-menu > ul > li:hover > .sub-menu > .image {
                    display: none;
                }


            #header-menu > ul > li > .sub-menu > .image {
                display: none;
            }

            #header-menu > ul > li > .sub-menu > .group {
                float: none;
            }

                #header-menu > ul > li > .sub-menu > .group > .titre {
                    padding: 5px 10px;
                }

                #header-menu > ul > li > .sub-menu > .group > a {
                    display: block;
                    padding: 7px 10px;
                }


    /* Icones menu */
    .ico-menu-livre {
        background-position: -7px -7px;
    }

    li:hover .ico-menu-livre {
        background-position: -7px -71px;
    }

    .ico-menu-dossier {
        background-position: -7px -135px;
    }

    li:hover .ico-menu-dossier {
        background-position: -7px -199px;
    }

    .ico-menu-param {
        background-position: -7px -263px;
    }

    li:hover .ico-menu-param {
        background-position: -7px -327px;
    }

    .ico-menu-stat {
        background-position: -7px -391px;
    }

    li:hover .ico-menu-stat {
        background-position: -7px -455px;
    }

    /* Page */
    #upPage {
        margin: 2% 0 30px 0;
        padding-top: 50px !important;
    }

    #upHeaderTitle {
        position: relative;
        top: 50px;
        height: auto;
        padding: 10px 0;
        z-index: auto;
    }

        #upHeaderTitle > h1 {
            font-size: 18px;
            line-height: 30px;
        }

        #upHeaderTitle > div {
            margin-top: 0;
        }


    /* BOX */
    .col-2 > section:nth-child(n) + section:nth-child(n),
    .col-3 > section:nth-child(n) + section:nth-child(n),
    .col-4 > section:nth-child(n) + section:nth-child(n),
    .row > .wp-33 + .wp-33,
    .col-3 > section:nth-child(n) + section:nth-child(n) + section:nth-child(n),
    .col-3 > section:nth-child(n), .row > .wp-33,
    .max-wp-33, .row > .wp-33 + .wp-33 + .wp-33,
    .col-2 > section:nth-child(n),
    .col-3 > section:nth-child(n),
    .col-4 > section:nth-child(n),
    .col-2 > section.box:nth-child(n),
    .col-3 > section.box:nth-child(n),
    .col-4 > section.box:nth-child(n),
    .row > :nth-child(3n+1).wp-33 + .wp-33 {
        width: 96%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: 0 2% 2% 2%;
    }

    .center-wp-33 > section.box,
    .center-wp-50 > section.box,
    .center-wp-75 > section.box {
        padding: 2%;
    }


    /* Titre */
    h1 {
        margin-top: 10px;
        margin-bottom: 5px;
        font-size: 18px;
    }

    h2 {
        font-size: 14px;
    }


    /* Boutons */

    .btn {
        padding: 8px 14px;
        margin-right: 5px;
        font-size: 12px;
        font-weight: 600;
    }

    h2 + .btn {
        float: none;
        margin: 0 0 0 0;
        padding: 8px 14px;
    }

    .btn-txt-ico {
        padding: 8px 14px;
        padding-left: 40px;
        margin-right: 5px;
        font-size: 12px;
    }

    .btn-ico {
        padding: 6px 10px;
    }

        .btn-ico.round {
            padding: 10px;
        }

    article.form > div > span.lbl {
        padding-top: 8px;
    }

    article.form > div > .lbl + .wpx-30 > .btn-ico,
    article.form > div > .ctl + .wpx-30 > .btn-ico {
        padding: 2px;
    }

    h2 + .btn-txt-ico {
        float: none;
        padding: 8px 14px;
        padding-left: 40px;
        margin: 0 0 0 0;
        background-size: auto;
    }

    h2 + .btn-ico,
    h2 + .btn-ico.round {
        margin: -30px 0 0 0;
        padding: 2px;
    }

    /* MESSAGE */

    .notification {
        max-width: none;
    }


    /* ONGLET*/
    .tab > .header > a {
        font-size: 12px;
    }

    section.box > .tab > .header > .wp-75,
    section.box > .tab > .header > .wp-66,
    section.box > .tab > .header > .wp-50,
    section.box > .tab > .header > .wp-33,
    section.box > .tab > .header > .wp-25 {
        width: 0;
    }




    /* Radio button / checkbox */
    input[type='checkbox'] + label,
    input[type='radio'] + label {
        min-height: 20px;
    }


    /* Scroll to top */
    #scroll-to-top {
        position: fixed;
        bottom: 2%;
        left: -9999px;
        right: auto;
        height: 30px;
        width: 96%;
    }

        #scroll-to-top.visible {
            left: 2%;
            right: 2%;
            opacity: 0.5;
        }

    /* TABLE BLOCK */
    /*table.smallscreen-block thead tr {
        background-color: #274466;
    }

    table.smallscreen-block th {
        display: block;
        margin-right: auto;
        margin-left: auto;
    }

    table.smallscreen-block td {
        display: block;
    }*/

    /* PDF Viewer */
    #toolbarViewerMiddle {
        display: none;
    }

    /* Aide contextuelle */
    #ctxhelp {
        display: none;
    }

        #ctxhelp > section.box {
            overflow-y: auto;
            margin: 10px;
            padding: 10px;
            height: 100%;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }


    body.ctxhelp-visible #ctxhelp {
        display: block;
        position: relative;
        top: 50px;
        left: 0;
        height: auto;
    }

    body.ctxhelp-visible #upPage {
        padding-top: 50px;
    }

    /* Userform */
    .userform {
        padding: 0;
    }

    .userbtn {
        position: relative;
        width: 96%;
        top: auto;
        right: auto;
        padding: 0 2% 2% 2%;
        text-align: right;
    }

        .userbtn > a {
            display: inline-block;
            margin: 0 auto 10px 2%;
        }

            .userbtn > a:hover {
                padding: 10px;
                margin-top: 0;
            }

    .ctxaction > .content,
    .ctxaction[data-location="right"] .content,
    .ctxaction[data-location="left"] .content,
    [data-ctxmenu][data-location="right"] .content,
    [data-ctxmenu][data-location="left"] .content {
        margin-top: 10px;
        margin-left: 0;
        margin-right: 0;
    }
}

.paginator {
    margin-top: 10px;
}

    .paginator > .holder {
        float: right;
        visibility: hidden;
        zoom: 1;
    }

    .paginator:before,
    .paginator:after {
        content: "";
        display: table;
    }

    .paginator:after {
        clear: both;
    }

    .paginator > .holder > .pages {
        position: relative;
        float: left;
        overflow: hidden;
        height: 20px;
    }

        .paginator > .holder > .pages a {
            position: absolute;
            display: block;
            margin-right: 2px;
            margin-left: 2px;
            width: 16px;
            height: 16px;
            background-color: #274466;
            border: solid 2px #274466;
            color: #fff;
            text-align: center;
            line-height: 16px;
            font-size: 11px;
            border-radius: 3px;
            font-weight: bold;
        }

            .paginator > .holder > .pages a.active,
            .paginator > .holder > .pages a:hover {
                background-color: transparent;
                color: #274466;
            }

    .paginator > .holder > .arrow {
        display: block;
        float: left;
        width: 16px;
        height: 20px;
        background-image: url(../images/layout/paginator.png);
        background-repeat: no-repeat;
        margin-right: 2px;
        margin-left: 2px;
    }

        .paginator > .holder > .arrow.disabled {
            cursor: default;
        }


    .paginator > .holder > .full-left {
        background-position: 0 center;
    }

        .paginator > .holder > .full-left:hover {
            background-position: -64px center;
        }

        .paginator > .holder > .full-left.disabled,
        .paginator > .holder > .full-left.disabled:hover {
            background-position: -128px center;
        }

    .paginator > .holder > .full-right {
        background-position: -16px center;
    }

        .paginator > .holder > .full-right:hover {
            background-position: -80px center;
        }

        .paginator > .holder > .full-right.disabled,
        .paginator > .holder > .full-right.disabled:hover {
            background-position: -144px center;
        }

    .paginator > .holder > .one-right {
        background-position: -32px center;
    }

        .paginator > .holder > .one-right:hover {
            background-position: -96px center;
        }

        .paginator > .holder > .one-right.disabled,
        .paginator > .holder > .one-right.disabled:hover {
            background-position: -160px center;
        }

    .paginator > .holder > .one-left {
        background-position: -48px center;
    }

        .paginator > .holder > .one-left:hover {
            background-position: -112px center;
        }

        .paginator > .holder > .one-left.disabled,
        .paginator > .holder > .one-left.disabled:hover {
            background-position: -176px center;
        }


/*#region Emp intervention*/

.planning-utilisateurintervention {
    display: flex;
}

    .planning-utilisateurintervention > .holder {
        overflow-y: scroll;
        width: 100%;
        /*height: calc(90vh - 150px - 40px);*/ /* 90 = Marge des sections, 150px = Header, 40px = Titre de la section */
        background-color: #fff;
    }

        .planning-utilisateurintervention > .holder .content {
            position: relative;
        }


            .planning-utilisateurintervention > .holder .content .header {
                display: flex;
                position: sticky;
                top: 0;
                z-index: 99;
            }


                .planning-utilisateurintervention > .holder .content .header .day {
                    position: sticky;
                    top: 0;
                }

                .planning-utilisateurintervention > .holder .content .header .utilisateur,
                .planning-utilisateurintervention > .holder .content .header .day {
                    background-color: #274466;
                    font-weight: normal;
                    color: #fff;
                    background-color: #274466;
                    font-family: "Quicksand-Bold";
                    text-align: center;
                    font-size: 12px;
                }

                    .planning-utilisateurintervention > .holder .content .header .utilisateur > div,
                    .planning-utilisateurintervention > .holder .content .header .day > div {
                        height: 40px;
                        line-height: 40px;
                    }


                .planning-utilisateurintervention > .holder .content .header .utilisateur {
                    position: sticky;
                    left: 0;
                    top: 0;
                    border-right: 1px solid #bfbfc6;
                    width: 149px;
                    height: 40px;
                    z-index: 50;
                }

                .planning-utilisateurintervention > .holder .content .header .day {
                    position: sticky;
                    top: 0;
                    border-right: 1px solid #bfbfc6;
                    height: 40px;
                    z-index: 25;
                    width: calc(((100% - 150px) / 7) - 1px);
                }


            .planning-utilisateurintervention > .holder .content .line {
                display: flex;
                position: relative;
                z-index: 90;
                height: 30px;
            }

                .planning-utilisateurintervention > .holder .content .line:hover {
                    z-index: 98;
                }


                .planning-utilisateurintervention > .holder .content .line .utilisateur {
                    background-color: #fff;
                    color: #3d3d3d;
                    font-weight: bold;
                    font-size: 10px;
                    height: 30px;
                    width: 149px;
                }


                    .planning-utilisateurintervention > .holder .content .line .utilisateur > div,
                    .planning-utilisateurintervention > .holder .content .line .day > div {
                        height: 30px;
                        line-height: 30px;
                    }


                .planning-utilisateurintervention > .holder .content .line .utilisateur {
                    position: sticky;
                    left: 0;
                    border-right: 1px solid #bfbfc6;
                    border-bottom: 1px solid #ebeef2;
                    height: 29px;
                    z-index: 100;
                    overflow: hidden;
                }

                    .planning-utilisateurintervention > .holder .content .line .utilisateur > div {
                        padding: 0 2px;
                    }

                .planning-utilisateurintervention > .holder .content .line .day {
                    height: 29px;
                    border-right: 1px solid #bfbfc6;
                    border-bottom: 1px solid #ebeef2;
                    cursor: pointer;
                    width: calc(((100% - 150px) / 7) - 1px);
                }

                    .planning-utilisateurintervention > .holder .content .line .day.grey {
                        background-color: #ebeef2;
                    }

                    .planning-utilisateurintervention > .holder .content .line .day.selected {
                        background-color: #AFCC14 !important;
                    }

                    .planning-utilisateurintervention > .holder .content .line .day.preselected {
                        background-color: #AFCC14 !important;
                    }

                .planning-utilisateurintervention > .holder .content .line .point {
                    position: absolute;
                    top: 0;
                    width: 96px;
                    font-size: 10px;
                    font-weight: normal;
                    line-height: 12px;
                    padding: 2px;
                    height: 26px;
                    overflow: hidden;
                    cursor: pointer;
                }

                    .planning-utilisateurintervention > .holder .content .line .point:hover {
                        width: auto !important;
                        height: auto !important;
                        min-height: 34px;
                        border: 1px solid #bfbfc6;
                        z-index: 100;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-0 {
                        background-color: #e9f2d6;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-1 {
                        background-color: #d9e7bb;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-2 {
                        background-color: #c5d999;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-3 {
                        background-color: #b2cb7c;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-4 {
                        background-color: #9fbb62;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-5 {
                        background-color: #8ead4c;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-6 {
                        background-color: #80a139;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-7 {
                        background-color: #709226;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-8 {
                        background-color: #628516;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.entree.bg-color-9 {
                        background-color: #527309;
                    }

                    .planning-utilisateurintervention > .holder .content .line .point.absence {
                        background-color: #ffc000;
                    }

                .planning-utilisateurintervention > .holder .content .line .clt {
                    padding-right: 2px;
                    display: block;
                    margin-right: 20px;
                    font-weight: bold;
                }

                .planning-utilisateurintervention > .holder .content .line .periode {
                    display: block;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    overflow: hidden;
                }

                .planning-utilisateurintervention > .holder .content .line .description {
                    display: block;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    overflow: hidden;
                }

/*#endregion Emp intervention */

/*#region Planification*/

.planification-mode-hour input[type='radio'] {
    position: absolute;
    left: -9999px;
    height: 0;
}

    .planification-mode-hour input[type='radio'] + label {
        padding: 0;
        margin-right: 10px;
        height: 30px;
        width: 30px;
        line-height: 30px;
        text-align: center;
        border: solid 1px #274466;
        color: #274466;
        background-image: none;
    }

    .planification-mode-hour input[type="radio"]:checked + label:hover,
    .planification-mode-hour input[type="radio"]:checked + label {
        background-color: #274466;
        color: #fff;
    }

    .planification-mode-hour input[type="radio"] + label:hover,
    .planification-mode-hour input[type="checkbox"] + label:hover {
        background-color: #274466;
        color: #fff;
    }

/*#endregion Planification */