/* Minification failed. Returning unminified contents.
(3375,34): run-time error CSS1030: Expected identifier, found ' '
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/* Alp-Software version : 1.00 */

html {
    font-family: Arial,sans-serif;
    /*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;
}

/* 
Version 2.02
Date : 11/07/2018

Ajout du style pour les aside après les col-2

*/


/*#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 margin */

.mt-10 {
    margin-top: 10px !important;
}

.mt-20 {
    margin-top: 20px !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 (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-bottom : 2%;
}


    section.box {
        border : 3px solid #808080;
        /*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:first-child,
.row > div.wp-66:first-child,
.row > div.wp-50:first-child,
.row > div.wp-33:first-child,
.row > div.wp-25:first-child {
    margin-left: 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: 76%;
}

.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 #ccc;
    color: #555;
    height: 35px;
    padding: 6px 12px;
    margin: 0;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
}

    input[type="text"]:focus,
    input[type="password"]:focus {
        border-color: #66afe9;
        outline: 0;
    }

    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-color: transparent;
        background-image: none;
    }

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

    input[type="text"] + input[type="text"],
    input[type="text"] + #dp-holder + input[type="text"]
    {
        margin-left: 5px;
    }

    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 center;
    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 {
    border: 1px solid #ccc;
    color: #555;
    padding: 6px 12px;
    margin: 0;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
    resize: none;
    font-family: Arial,sans-serif;
    min-height:35px;
}

    textarea:focus {
        border-color: #66afe9;
        outline: 0;
    }

    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-unselect.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-image: url(../images/layout/input-unselect-hover.png);
    }

    input[type="radio"]:checked + label {
        background-image: url(../images/layout/input-select-blue.png);
    }

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

    input[type="radio"][disabled]:hover + label {
        background-image: url(../images/layout/input-unselect.png);
    }

    input[type="radio"][disabled]:checked + label {
        background-image: url(../images/layout/input-select-grey.png);
        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/checkbox-unselect.png);
        background-repeat: no-repeat;
        background-position : 0 0;
        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-image: url(../images/layout/checkbox-unselect-hover.png);
    }

    input[type="checkbox"]:checked + label {
        background-image: url(../images/layout/checkbox-select-blue.png);
    }

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

    input[type="checkbox"][disabled]:hover + label {
        background-image: url(../images/layout/checkbox-unselect.png);
    }

    input[type="checkbox"][disabled]:checked + label {
        background-image: url(../images/layout/checkbox-select-grey.png);
        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 > b {
    display: block;
    text-transform: uppercase;
    padding-top: 10px;
}

article.form > div > span.lbl {
    position: relative;
    width: 50%;
    vertical-align: top;
    display: table-cell;
    padding-right: 2%;
    padding-top: 9px;
    font-size: 14px;
    line-height: 16px;
    color: #77777e;
    text-align: right;
}

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

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

    /*article.form.block > div > span.lbl.required:after {
        display: none;
    }

article.form.block > div > span.lbl.required:before {
    content: " *";
    font-weight: normal;
    color: #ff0000;
    padding-right: 5px;
}*/

    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;
    color: #000;
}

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;
    padding-top: 0;
}

    /*article.form.block > div > span.lbl:empty {
        display: none;
    }*/

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

article.form.block > div > span.wp-75,
article.form.block > div > span.wp-66,
article.form.block > div > span.wp-50,
article.form.block > div > span.wp-33,
article.form.block > div > span.wp-25 {
    width: 100%;
}


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

article.form.block > div > span.lbl .note {
    margin-top: 0;
    margin-bottom: 5px;
}

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 */

/*#region Tableau */
.table-01 {
    width: 100%;
    font-size: 14px;
    border-left: 1px solid #eeeeee;
    border-right: 1px solid #eeeeee;
    border-bottom: solid 5px #bb2255;
    margin-bottom: 10px;
}

    .table-01 td {
        padding: 5px;
        min-height: 20px;
        vertical-align: middle;
        font-weight: normal;
        background-color: #fff;
        border-bottom: 1px solid #eeeeee;
    }

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

    .table-01 thead th {
        padding: 7px 5px 5px 5px;
        min-height: 25px;
        font-weight: bold;
        color: #000;
        background-color: #eeeeee;
    }


        .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;
        text-decoration: none;
    }


    .table-01 tbody {
        background-color: #eeeeee;
    }

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

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

    /*.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: #0000ff;
        color: #fff;
    }*/

    .table-01 tfoot td {
        background-color: #242424;
        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;
    }

    /*#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*/

.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: #c0143c;
}

.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;
    }

/*#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*/
/* Version 2.01 (03/02/2017) 
Ajout des classes pour l'environnement
*/

/* Généralités */
html {
    position: relative;
    min-height: 100%;
}

#upPage {
    margin-bottom: 70px;
}


/* Tableau */
table input[type="text"] {
    width: 100% !important;
}

table tfoot input[type="text"] {
    color: #fff !important;
}


/* Bouton */
.btn {
    display: inline-block;
    padding: 23px 30px;
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
    vertical-align: top;
    letter-spacing: 5px;
    font-weight: bold;
    border: 2px solid #0000ff;
    background-color: #0000ff;
    transition: all 100ms linear;
}

    .btn.grey {
        border: 2px solid #77777e;
        background-color: #fff;
        color: #000;
    }

        .btn.grey:hover {
            border: 2px solid #77777e;
            background-color: #77777e;
            color: #fff;
        }

    .btn:hover,
    .btn.green:hover,
    .btn.red:hover,
    .btn-txt-ico:hover,
    .btn-txt-ico.green:hover {
        background-color: #fff;
        color: #000;
        transition: all 200ms linear;
    }


    .btn.small {
        padding: 2px 5px;
        font-size: 11px;
        margin-right: 5px;
        letter-spacing: normal;
        font-weight: normal;
    }

.btn-txt-ico {
    display: inline-block;
    padding: 23px 30px;
    padding-left: 50px;
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
    vertical-align: top;
    letter-spacing: 5px;
    font-weight: bold;
    border: 2px solid #0000ff;
    background-color: #0000ff;
    background-position: 10px center;
    background-repeat: no-repeat;
    vertical-align: top;
    transition: all 100ms linear;
}

    .btn-txt-ico.medium {
        padding: 10px 20px;
        padding-left: 50px;
    }


    .btn-txt-ico.green,
    .btn.green,
    .btn-ico.green {
        border: 2px solid #3bc43b;
        background-color: #3bc43b;
    }

.btn-ico.red:hover,
.btn-ico:hover {
    background-color: #fff;
    transition: all 200ms linear;
}


.btn-ico.red,
.btn.red {
    background-color: #bb2255;
    border: 2px solid #bb2255;
}

.btn.right,
.btn-txt-ico.right {
    float: right
}

h2 + .btn,
h2 + .btn-txt-ico {
    position: relative;
    float: right;
    margin: -85px 0 0 0;
}


.btn-ico {
    display: inline-block;
    color: #fff;
    height: 20px;
    width: 20px;
    background-color: #242424;
    border: 1px solid #242424;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 50%;
    vertical-align: top;
    padding: 2px;
    margin-right: 5px;
    text-decoration: none;
    transition: all 100ms linear;
}

/* Icones */

.ico-cross {
    background-image: url('../images/ico/cross-20.png');
}

a.ico-cross:hover {
    background-image: url('../images/ico/cross-black-20.png');
    transition: all 200ms linear;
}

.ico-add {
    background-image: url('../images/ico/add-20.png');
}

a.ico-add:hover {
    background-image: url('../images/ico/add-black-20.png');
}

.ico-edit {
    background-image: url('../images/ico/edit-20.png');
}

a.ico-edit:hover, .ico-black-edit {
    background-image: url('../images/ico/edit-black-20.png');
}

.ico-download {
    background-image: url('../images/ico/download-20.png');
}

a.ico-download:hover {
    background-image: url('../images/ico/download-black-20.png');
}

.ico-black-doc {
    background-image: url('../images/ico/doc-black-20.png');
}

.ico-black-lock {
    background-image: url('../images/ico/lock-black-20.png');
}

.ico-black-building {
    background-image: url('../images/ico/building-black-20.png');
}

.ico-black-info {
    background-image: url('../images/ico/info-black-20.png');
}

.ico-black-price {
    background-image: url('../images/ico/price-black-20.png');
}

.ico-black-credit {
    background-image: url('../images/ico/credit-black-20.png');
}

.ico-black-mail {
    background-image: url('../images/ico/mail-black-20.png');
}

.ico-black-shop {
    background-image: url('../images/ico/shop-black-20.png');
}



h2.h2-ico {
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 35px;
}

h2.no-margin-top {
    margin-top: 7px;
}


h3.h3-ico {
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 30px;
    line-height: 20px;
}

/* Pied de page */
.footer {
    position: absolute;
    width: 100%;
    bottom: 0;
    padding-top: 10px;
    background-color: #242424;
}

    .footer > .footer-content {
        margin: 0 20px;
        color: #fff;
    }

        .footer > .footer-content a {
            color: #fff;
            text-decoration: none;
        }

        .footer > .footer-content .float-right {
            font-size: 10px;
            margin-right: 280px;
        }

        .footer > .footer-content a:hover {
            color: #bfbfc6;
        }


/* Aide en ligne */
.info-bulle {
    width: 250px;
    z-index: 100;
    position: fixed;
    bottom: 5px;
    right: 5px;
    background-color: #bb2255;
    color: #fff;
    padding: 10px;
    border-radius: 5px;
}


    .info-bulle .title {
        display: block;
        line-height: 20px;
        padding-right: 25px;
        background-image: url(../images/ico/slide-up-20.png);
        background-repeat: no-repeat;
        background-position: center right;
        cursor: pointer;
    }


    .info-bulle .text {
        display: block;
        margin-top: 5px;
        font-style: italic;
    }

    .info-bulle .tel {
        font-size: 15px;
        color: #fff;
    }

    .info-bulle a {
        color: #fff;
        font-size: 14px;
        text-decoration: none;
    }

        .info-bulle a:hover {
            text-decoration: underline;
        }

    .info-bulle #info-bulle-content {
        display: none;
    }


/* Mise en forme */
.txt-yellow {
    text-transform: uppercase;
    background-color: #fff000;
    padding: 5px 10px 5px 10px;
    color: #000;
    letter-spacing: 3px;
    font-weight: bold;
    display: inline-block;
}

h2 + .txt-yellow {
    margin-top: -34px;
    margin-bottom: 34px;
}

h2 + div.accroche {
    margin-top: -24px;
    margin-bottom: 10px;
}


/* Uploader */
.uploader-holder a.parcourir {
    line-height: 20px;
    border: 1px solid #0000ff;
}

.uploader-holder a.voir {
    background-color: #bb2255;
    border: 1px solid #bb2255;
}

    .uploader-holder a.voir:hover {
        background-color: #fff;
    }


/* Sous-titres & Empty des RadiobuttonList et CheckBoxList */
input[disabled="disabled"][value^="@SUBTITLE_"],
input[disabled="disabled"][value^="@EMPTY_"] {
    display: none;
}

    input[disabled="disabled"][value^="@SUBTITLE_"]:hover + label,
    input[disabled="disabled"][value^="@SUBTITLE_"] + label {
        font-weight: bold;
        cursor: default;
        background-image: none;
        padding-left: 0px;
        padding-right: 22px;
        color: #77777e;
    }

    input[disabled="disabled"][value^="@EMPTY_"] + label {
        visibility: hidden;
    }

span.title-block > span.aspNetDisabled {
    display: block;
    width: 100% !important;
}

    span.title-block > span.aspNetDisabled input[disabled="disabled"][value^="@EMPTY_"] + label {
        visibility: hidden;
        height: 0;
        max-height: 0;
        min-height: 0;
        margin-bottom: 5px;
        overflow: hidden;
        display: block;
    }


/* Période d'ouverture */
.periodeouverture-holder .item {
    border-bottom: 1px solid #a8a8a8;
    margin-bottom: 10px;
}

    .periodeouverture-holder .item .header:before,
    .periodeouverture-holder .item .header:after {
        content: "";
        display: table;
    }

    .periodeouverture-holder .item .header:after {
        clear: both;
    }

    .periodeouverture-holder .item .header {
        zoom: 1;
    }

        .periodeouverture-holder .item .header h3 {
            display: inline-block;
            float: left;
        }

        .periodeouverture-holder .item .header a {
            float: right;
            margin: 0;
        }

/* Dates de fermetures exceptionnelles */

.fermetureexceptionnelle-item {
    margin-bottom: 5px;
}

    .fermetureexceptionnelle-item a.btn-ico {
        margin-top: 4px;
        margin-left: 5px;
    }


/* Périodes de tarifs */
.periodetarif-holder .item {
    border-bottom: 1px solid #a8a8a8;
    margin-bottom: 10px;
}

    .periodetarif-holder .item div.header:before,
    .periodetarif-holder .item div.header:after {
        content: "";
        display: table;
    }

    .periodetarif-holder .item div.header:after {
        clear: both;
    }

    .periodetarif-holder .item div.header {
        zoom: 1;
    }

        .periodetarif-holder .item div.header h3 {
            display: inline-block;
            float: left;
        }

        .periodetarif-holder .item div.header a {
            float: right;
        }

.periodetarif-holder .table-01 td {
    vertical-align: top;
}

    .periodetarif-holder .table-01 td.header {
        padding: 7px 5px 5px 5px;
        line-height: 25px;
        color: #000;
        background-color: #eeeeee;
        text-align: right;
    }

    .periodetarif-holder .table-01 td.number {
        width: 15%;
        max-width: 100px;
    }

    .periodetarif-holder .table-01 td.text {
        width: 40%;
    }

/* HTML Tag */
div.separator-tag {
    height: 24px;
}

/* Mode forcé */
.mode-force {
    float: left;
    max-width: 650px;
    margin-top: 22px;
    margin-left: 20px;
    display: inline-block;
    padding: 15px;
    border-radius: 5px;
    color: #fff;
    font-size: 12px;
    background-color: #bb2255;
    text-transform: uppercase;
}

/* Titre avec bouton */
h2 + .btn-ico {
    position: relative;
    float: right;
    margin: -64px 0 0 0;
}

h3 + .btn-ico {
    position: relative;
    float: right;
    margin: -23px 0 0 0;
}

/* Affichage document */
.doc-show {
    height: 400px;
    overflow-y: scroll;
    border: 1px solid #ccc;
    padding: 10px;
    margin-bottom: 10px;
}

    .doc-show:focus {
        border: 1px solid #66afe9;
    }

.document-content input[type=checkbox] + label {
    font-weight: bold;
}

/* Tableau récapitulatif */
.table-01.recap > tbody td {
    vertical-align: top;
}

.table-01.recap .detail-titre {
    font-weight: bold;
    text-transform: uppercase;
    display: inline-block;
}

.table-01.recap .detail {
    color: #77777e;
    font-size: 12px;
    margin-top: 4px;
}


/*  Texte gris */
.txt-grey {
    color: #77777e;
}

.form-recap > div {
    margin-bottom: 10px;
}

.form-recap .lbl {
    display: inline-block;
    color: #77777e;
    font-size: 14px;
    margin-right: 10px;
}

.form-recap .champ {
    color: #3d3d3d;
    font-size: 14px;
}

/* Fil d'ariane */
.fil-ariane {
    width: 60%;
    min-width: 980px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}

    .fil-ariane > span {
        letter-spacing: 0.1em;
        margin-right: 25px;
        color: #b9b8b8;
        font-size: 16px;
    }

        .fil-ariane > span.active {
            color: #000;
            font-weight: bold;
        }

/* Non adhésion */

.table-01.recap .remove-line {
    width: 15px;
    height: 15px;
    background-image: url("../images/ico/clear-15.png")
}

.table-01.recap .add-line {
    width: 15px;
    height: 15px;
    background-image: url("../images/ico/back-15.png");
}

.ligne-barre,
.table-01.recap .ligne-barre .detail-titre {
    text-decoration: line-through;
}

.lien-01 {
    text-decoration: none;
    color: #0000ff;
}

    .lien-01:hover {
        text-decoration: underline;
    }

p.photo-info {
    color: #77777e;
    font-style: italic;
}

/* Header des questionnaires */
.questionnaire-header > div {
    display: flex;
    flex-direction: column;
    flex-flow: nowrap;
    margin-bottom: 20px;
}

    .questionnaire-header > div > img {
        align-self: center;
        height: 100%;
        margin-right: 15px;
    }

    .questionnaire-header > div > p {
        align-self: center;
        margin: 0;
    }


.info {
    line-height: 22px;
    color: #77777e;
}


    .info a {
        color: #77777e;
        text-decoration: underline;
    }


.table-pack {
    font-family: "Open Sans",sans-serif;
    border-collapse: separate;
    height: 1px;
}

    .table-pack thead {
        position: sticky;
        top: 0;
        z-index: 100;
        background-color: #fff;
    }

        .table-pack thead tr > td {
            background-color: #fff;
            color: #242424;
            text-transform: uppercase;
            font-size: 16px;
            font-weight: bold;
            text-align: center;
            padding: 5px 0;
            border-top: 5px solid #242424;
            border-right: 1px solid #a8a8a8;
            border-bottom: 1px solid #a8a8a8;
        }

            .table-pack thead tr > td:last-child {
                border-right: none;
            }

            .table-pack thead tr > td:nth-child(1) {
                background-color: #242424;
                color: #fff;
                border-top: 5px solid #242424;
            }

            /* Pack base : Noir */
            .table-pack thead tr > td:nth-child(2) {
                border-top: 5px solid #242424;
            }

            /* Pack essentiel : Rose */
            .table-pack thead tr > td:nth-child(3) {
                border-top: 5px solid #bb2255;
            }

            /* Pack avancé : Vert */
            .table-pack thead tr > td:nth-child(4) {
                border-top: 5px solid #3bc43b;
            }

            /* Pack premium : Bleu */
            .table-pack thead tr > td:nth-child(5) {
                border-top: 5px solid #0000ff;
            }

            /* Pack Mice + : Jaune */
            .table-pack thead tr > td:nth-child(6) {
                border-top: 5px solid #fff000;
            }

            /* Option affaire : Gris */
            .table-pack thead tr > td:nth-child(7) {
                /*border-top: 5px solid #77777e;*/
                border-top: 5px solid #2bf1f1;
            }



    .table-pack tbody tr > td {
        padding: 10px;
        font-weight: 500;
        border-right: 1px solid #a8a8a8;
    }

        .table-pack tbody tr > td:last-child {
            border-right: none;
        }

    .table-pack tbody tr:nth-child(2n) {
        background-color: #eae8e8
    }


    .table-pack tbody tr > td.check {
        position: relative;
    }

        .table-pack tbody tr > td.check::after {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            background-image: url(../images/ico/check-30.png);
            background-repeat: no-repeat;
            background-size: 30px;
            background-position: center center;
        }

        /* Pack essentiel : Rose */
        .table-pack tbody tr > td.check:nth-child(3) {
            background-color: #fce8ef;
        }

    .table-pack tbody tr:nth-child(2n) > td.check:nth-child(3) {
        background-color: #f2d2dd;
    }

    .table-pack tbody tr > td.check:nth-child(3)::after {
        filter: invert(23%) sepia(50%) saturate(3300%) hue-rotate(318deg) brightness(85%) contrast(97%);
    }

    /* Pack avancé : Vert */
    .table-pack tbody tr > td.check:nth-child(4) {
        background-color: #e6f2e6;
    }

    .table-pack tbody tr:nth-child(2n) > td.check:nth-child(4) {
        background-color: #d1ebd1;
    }

    .table-pack tbody tr > td.check:nth-child(4)::after {
        filter: invert(53%) sepia(59%) saturate(487%) hue-rotate(71deg) brightness(92%) contrast(93%);
    }


    /* Pack premium : Bleu */
    .table-pack tbody tr > td.check:nth-child(5) {
        background-color: #e8e8ff;
    }

    .table-pack tbody tr:nth-child(2n) > td.check:nth-child(5) {
        background-color: #d4d4f8;
    }

    .table-pack tbody tr > td.check:nth-child(5)::after {
        filter: invert(13%) sepia(86%) saturate(4387%) hue-rotate(243deg) brightness(100%) contrast(105%);
    }

    /* Pack Mice + : Jaune */
    .table-pack tbody tr > td.check:nth-child(6) {
        background-color: #fffee7;
    }

    .table-pack tbody tr:nth-child(2n) > td.check:nth-child(6) {
        background-color: #f7f5c8;
    }

    .table-pack tbody tr > td.check:nth-child(6)::after {
        filter: invert(91%) sepia(98%) saturate(2571%) hue-rotate(346deg) brightness(89%) contrast(95%);
    }

    /* Option : Cyan */
    .table-pack tbody tr > td.check:nth-child(7) {
        background-color: #edffff;
    }

    .table-pack tbody tr:nth-child(2n) > td.check:nth-child(7) {
        background-color: #d0fefe;
    }

    .table-pack tbody tr > td.check:nth-child(7)::after {
        filter: invert(81%) sepia(95%) saturate(405%) hue-rotate(134deg) brightness(95%) contrast(93%);
    }

    /* Pack Readonly */
    .table-pack tbody tr > td.readonly.check {
        background-color: #fff !important;
    }

    .table-pack tbody tr:nth-child(2n) > td.readonly.check {
        background-color: #eae8e8 !important;
    }

    .table-pack tbody tr > td.readonly.check::after {
        filter: invert(50%) sepia(5%) saturate(377%) hue-rotate(202deg) brightness(92%) contrast(91%);
    }

    .pack-footer input[type="radio"] + label {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        box-sizing: border-box;
        padding: 30px 20px;
        padding-bottom: 50px;
        margin: 0;
        text-align: center;
        text-decoration: none;
        background-image: url(../images/layout/radio-pack-unselected.png);
        background-position: center 95%;
        background-size: 30px;
        max-height: none;
    }


.pack-footer > td.pack-choix,
.pack-footer > td.pack-choix input[type="radio"] + label {
    height: 100%;
}

    .pack-footer > td.pack-choix input[type="radio"] + label {
        border-bottom: 1px solid #a8a8a8;
        border-right: 1px solid #a8a8a8;
    }

.pack-footer > td:nth-child(2) input[type="radio"] + label {
    border-bottom-left-radius: 10px;
    border-left: 1px solid #a8a8a8;
}

.pack-footer > td:nth-child(6) input[type="radio"] + label {
    border-bottom-right-radius: 10px;
}

.pack-footer input[type="radio"]:hover + label {
    background-color: #f5f5f5;
    transition: all 200ms linear;
}

.pack-footer input[type="radio"]:checked + label {
    background-image: url(../images/layout/radio-pack-selected.png);
    background-color: #f5f5f5;
}

.pack-footer > td:nth-child(3) input[type="radio"]:checked + label {
    background-image: url(../images/layout/radio-pack-selected-red.png);
}

.pack-footer > td:nth-child(4) input[type="radio"]:checked + label {
    background-image: url(../images/layout/radio-pack-selected-green.png);
}

.pack-footer > td:nth-child(5) input[type="radio"]:checked + label {
    background-image: url(../images/layout/radio-pack-selected-blue.png);
}

.pack-footer > td:nth-child(6) input[type="radio"]:checked + label {
    background-image: url(../images/layout/radio-pack-selected-yellow.png);
}

.pack-footer input[type="radio"] + label > span {
    margin-bottom: 10px;
}


    .pack-footer input[type="radio"] + label > span.titre,
    .pack-footer input[type="radio"] + label > span.tarif {
        font-weight: bold;
        color: #242424;
        font-size: 18px;
    }


.pack-footer input[type="radio"][disabled="disabled"] + label{
    background: none;
}

.mr-20{
    margin-right: 20px;
}
/* Copyright 2014 Mozilla Foundation
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.textLayer {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    opacity: 0.2;
}

    .textLayer > div {
        color: transparent;
        position: absolute;
        white-space: pre;
        cursor: text;
        -webkit-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
    }

    .textLayer .highlight {
        margin: -1px;
        padding: 1px;
        background-color: rgb(180, 0, 170);
        border-radius: 4px;
    }

        .textLayer .highlight.begin {
            border-radius: 4px 0px 0px 4px;
        }

        .textLayer .highlight.end {
            border-radius: 0px 4px 4px 0px;
        }

        .textLayer .highlight.middle {
            border-radius: 0px;
        }

        .textLayer .highlight.selected {
            background-color: #1983ff;
        }

    .textLayer ::selection {
        background: #1983ff;
    }

    .textLayer ::-moz-selection {
        background: #1983ff;
    }


.annotationLayer .annotLink > a:hover {
    opacity: 0.2;
    background: #ff0;
    box-shadow: 0px 2px 10px #ff0;
}

.annotationLayer .annotText > img {
    position: absolute;
    cursor: pointer;
}

.annotationLayer .annotTextContentWrapper {
    position: absolute;
    width: 20em;
}

.annotationLayer .annotTextContent {
    z-index: 200;
    float: left;
    max-width: 20em;
    background-color: #FFFF99;
    box-shadow: 0px 2px 5px #333;
    border-radius: 2px;
    padding: 0.6em;
    cursor: pointer;
}

    .annotationLayer .annotTextContent > h1 {
        font-size: 1em;
        border-bottom: 1px solid #000000;
        padding-bottom: 0.2em;
    }

    .annotationLayer .annotTextContent > p {
        padding-top: 0.2em;
    }

.annotationLayer .annotLink > a {
    position: absolute;
    font-size: 1em;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.annotationLayer .annotLink > a /* -ms-a */ {
    background: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7") 0 0 repeat;
}

.pdfViewer .canvasWrapper {
    overflow: hidden;
}

.pdfViewer .page {
    direction: ltr;
    width: 816px;
    height: 1056px;
    margin: 1px auto -8px auto;
    position: relative;
    overflow: visible;
    border: 9px solid transparent;
    background-clip: content-box;
    border-image: url(images/shadow.png) 9 9 repeat;
    background-color: white;
}

.pdfViewer.removePageBorders .page {
    margin: 0px auto 10px auto;
    border: none;
}

.pdfViewer .page canvas {
    margin: 0;
    display: block;
}

.pdfViewer .page .loadingIcon {
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: url('images/loading-icon.gif') center no-repeat;
}

.pdfPresentationMode:-webkit-full-screen .pdfViewer .page {
    margin-bottom: 100%;
    border: 0;
}

.pdfPresentationMode:-moz-full-screen .pdfViewer .page {
    margin-bottom: 100%;
    border: 0;
}

.pdfPresentationMode:-ms-fullscreen .pdfViewer .page {
    margin-bottom: 100% !important;
    border: 0;
}

.pdfPresentationMode:fullscreen .pdfViewer .page {
    margin-bottom: 100%;
    border: 0;
}


.hidden {
    display: none !important;
}

[hidden] {
    display: none !important;
}

#viewerContainer.pdfPresentationMode:-webkit-full-screen {
    top: 0px;
    border-top: 2px solid transparent;
    background-color: #000;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: none;
    -webkit-user-select: none;
}

#viewerContainer.pdfPresentationMode:-moz-full-screen {
    top: 0px;
    border-top: 2px solid transparent;
    background-color: #000;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: none;
    -moz-user-select: none;
}

#viewerContainer.pdfPresentationMode:-ms-fullscreen {
    top: 0px !important;
    border-top: 2px solid transparent;
    width: 100%;
    height: 100%;
    overflow: hidden !important;
    cursor: none;
    -ms-user-select: none;
}

    #viewerContainer.pdfPresentationMode:-ms-fullscreen::-ms-backdrop {
        background-color: #000;
    }

#viewerContainer.pdfPresentationMode:fullscreen {
    top: 0px;
    border-top: 2px solid transparent;
    background-color: #000;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.pdfPresentationMode:-webkit-full-screen a:not(.internalLink) {
    display: none;
}

.pdfPresentationMode:-moz-full-screen a:not(.internalLink) {
    display: none;
}

.pdfPresentationMode:-ms-fullscreen a:not(.internalLink) {
    display: none !important;
}

.pdfPresentationMode:fullscreen a:not(.internalLink) {
    display: none;
}

.pdfPresentationMode:-webkit-full-screen .textLayer > div {
    cursor: none;
}

.pdfPresentationMode:-moz-full-screen .textLayer > div {
    cursor: none;
}

.pdfPresentationMode:-ms-fullscreen .textLayer > div {
    cursor: none;
}

.pdfPresentationMode:fullscreen .textLayer > div {
    cursor: none;
}

.pdfPresentationMode.pdfPresentationModeControls > *,
.pdfPresentationMode.pdfPresentationModeControls .textLayer > div {
    cursor: default;
}

/* outer/inner center provides horizontal center */
.outerCenter {
    pointer-events: none;
    position: relative;
}

html[dir='ltr'] .outerCenter {
    float: right;
    right: 50%;
}

html[dir='rtl'] .outerCenter {
    float: left;
    left: 50%;
}

.innerCenter {
    pointer-events: auto;
    position: relative;
}

html[dir='ltr'] .innerCenter {
    float: right;
    right: -50%;
}

html[dir='rtl'] .innerCenter {
    float: left;
    left: -50%;
}

#outerContainer {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 500;
    background-color: #ebeef2;
}

#sidebarContainer {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 200px;
    visibility: hidden;
    -webkit-transition-duration: 200ms;
    -webkit-transition-timing-function: ease;
    transition-duration: 200ms;
    transition-timing-function: ease;
}

html[dir='ltr'] #sidebarContainer {
    -webkit-transition-property: left;
    transition-property: left;
    left: -200px;
}

html[dir='rtl'] #sidebarContainer {
    -webkit-transition-property: right;
    transition-property: right;
    right: -200px;
}

#outerContainer.sidebarMoving > #sidebarContainer,
#outerContainer.sidebarOpen > #sidebarContainer {
    visibility: visible;
}

html[dir='ltr'] #outerContainer.sidebarOpen > #sidebarContainer {
    left: 0px;
}

html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer {
    right: 0px;
}

#mainContainer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    min-width: 320px;
    -webkit-transition-duration: 200ms;
    -webkit-transition-timing-function: ease;
    transition-duration: 200ms;
    transition-timing-function: ease;
}

html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
    -webkit-transition-property: left;
    transition-property: left;
    left: 200px;
}

html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer {
    -webkit-transition-property: right;
    transition-property: right;
    right: 200px;
}

#sidebarContent {
    top: 64px;
    bottom: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    position: absolute;
    width: 200px;
    background-color: #556877;
}

html[dir='ltr'] #sidebarContent {
    left: 0;
    box-shadow: inset -1px 0 0 hsla(0,0%,0%,.25);
}

html[dir='rtl'] #sidebarContent {
    right: 0;
    box-shadow: inset 1px 0 0 hsla(0,0%,0%,.25);
}

#viewerContainer {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    position: absolute;
    top: 64px;
    right: 0;
    bottom: 0;
    left: 0;
    outline: none;
}

html[dir='ltr'] #viewerContainer {
    box-shadow: inset 1px 0 0 hsla(0,0%,100%,.05);
}

html[dir='rtl'] #viewerContainer {
    box-shadow: inset -1px 0 0 hsla(0,0%,100%,.05);
}

.toolbar {
    position: relative;
    left: 0;
    right: 0;
    z-index: 9999;
    cursor: default;
}

#toolbarContainer {
    width: 100%;
}

#toolbarSidebar {
    width: 200px;
    height: 64px;
    background-color: #274466; /* fallback */
}

html[dir='ltr'] #toolbarSidebar {
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25), inset 0 -1px 0 hsla(0,0%,100%,.05), 0 1px 0 hsla(0,0%,0%,.15), 0 0 1px hsla(0,0%,0%,.1);
}

html[dir='rtl'] #toolbarSidebar {
    box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25), inset 0 1px 0 hsla(0,0%,100%,.05), 0 1px 0 hsla(0,0%,0%,.15), 0 0 1px hsla(0,0%,0%,.1);
}

#toolbarContainer, .findbar, .secondaryToolbar {
    position: relative;
    height: 64px;
    background-color: #274466;
    /*overflow: hidden;*/
    -webkit-box-shadow: 0 0 7px 2px rgba(0,0,0,0.10);
    -moz-box-shadow: 0 0 7px 2px rgba(0,0,0,0.10);
    box-shadow: 0 0 7px 2px rgba(0,0,0,0.10);
    border-bottom: 1px solid #bfbfc6;
}


#toolbarViewer {
    height: 64px;
    -webkit-box-shadow: 0 0 7px 2px rgba(0,0,0,0.10);
    -moz-box-shadow: 0 0 7px 2px rgba(0,0,0,0.10);
    box-shadow: 0 0 7px 2px rgba(0,0,0,0.10);
    border-bottom: 1px solid #bfbfc6;
}

#loadingBar {
    position: relative;
    width: 100%;
    height: 4px;
    background-color: #333;
    border-bottom: 1px solid #333;
}

    #loadingBar .progress {
        position: absolute;
        top: 0;
        left: 0;
        width: 0%;
        height: 100%;
        background-color: #ddd;
        overflow: hidden;
        -webkit-transition: width 200ms;
        transition: width 200ms;
    }

@-webkit-keyframes progressIndeterminate {
    0% {
        left: 0%;
    }

    50% {
        left: 100%;
    }

    100% {
        left: 100%;
    }
}

@keyframes progressIndeterminate {
    0% {
        left: 0%;
    }

    50% {
        left: 100%;
    }

    100% {
        left: 100%;
    }
}

#loadingBar .progress.indeterminate {
    background-color: #999;
    -webkit-transition: none;
    transition: none;
}

#loadingBar .indeterminate .glimmer {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 50px;
    background-image: linear-gradient(to right, #999 0%, #fff 50%, #999 100%);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    -webkit-animation: progressIndeterminate 2s linear infinite;
    animation: progressIndeterminate 2s linear infinite;
}

.findbar, .secondaryToolbar {
    top: 45px;
    position: absolute;
    z-index: 10000;
    height: 32px;
    min-width: 16px;
    padding: 0px 6px 0px 6px;
    margin: 4px 2px 4px 2px;
    color: hsl(0,0%,85%);
    font-size: 12px;
    line-height: 14px;
    text-align: left;
    cursor: default;
}

html[dir='ltr'] .findbar {
    left: 62px;
    top: 68px;
}

html[dir='rtl'] .findbar {
    right: 68px;
}


.findbar label {
    -webkit-user-select: none;
    -moz-user-select: none;
}

#findInput[data-status="pending"] {
    background-image: url(images/loading-small.png);
    background-repeat: no-repeat;
    background-position: right;
}

html[dir='rtl'] #findInput[data-status="pending"] {
    background-position: left;
}

.secondaryToolbar {
    padding: 6px;
    height: auto;
    z-index: 30000;
}

html[dir='ltr'] .secondaryToolbar {
    right: 4px;
}

html[dir='rtl'] .secondaryToolbar {
    left: 4px;
}

#secondaryToolbarButtonContainer {
    max-width: 200px;
    max-height: 400px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: -4px;
}

.doorHanger,
.doorHangerRight {
    border-radius: 2px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
    background-color: #3d3d3d;
}

    .doorHanger:after, .doorHanger:before,
    .doorHangerRight:after, .doorHangerRight:before {
        bottom: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
    }

    /*.doorHanger:after,
    .doorHangerRight:after {
        border-bottom-color: hsla(0,0%,32%,.99);
        border-width: 8px;
    }*/

    .doorHanger:before,
    .doorHangerRight:before {
        border-bottom-color: #3d3d3d;
        border-width: 9px;
    }

html[dir='ltr'] .doorHanger:after,
html[dir='rtl'] .doorHangerRight:after {
    left: 13px;
    margin-left: -8px;
}

html[dir='ltr'] .doorHanger:before,
html[dir='rtl'] .doorHangerRight:before {
    left: 13px;
    margin-left: -9px;
}

html[dir='rtl'] .doorHanger:after,
html[dir='ltr'] .doorHangerRight:after {
    right: 13px;
    margin-right: -8px;
}

html[dir='rtl'] .doorHanger:before,
html[dir='ltr'] .doorHangerRight:before {
    right: 13px;
    margin-right: -9px;
}

#findMsg {
    font-style: italic;
    color: #A6B7D0;
}

#findInput.notFound {
    background-color: #FF2D19;
}



html[dir='ltr'] #toolbarViewerLeft {
    margin-left: -1px;
}

html[dir='rtl'] #toolbarViewerRight {
    margin-right: -1px;
}

html[dir='ltr'] #toolbarViewerLeft,
html[dir='rtl'] #toolbarViewerRight {
    position: absolute;
    top: 0;
    left: 0;
    height: 64px;
}

html[dir='ltr'] #toolbarViewerRight,
html[dir='rtl'] #toolbarViewerLeft {
    position: absolute;
    top: 0;
    right: 0;
    height: 64px;
}

    html[dir='ltr'] #toolbarViewerLeft > *,
    html[dir='ltr'] #toolbarViewerMiddle > *,
    html[dir='ltr'] #toolbarViewerRight > *,
    html[dir='ltr'] .findbar > * {
        position: relative;
        float: left;
    }

    html[dir='rtl'] #toolbarViewerLeft > *,
    html[dir='rtl'] #toolbarViewerMiddle > *,
    html[dir='rtl'] #toolbarViewerRight > *,
    html[dir='rtl'] .findbar > * {
        position: relative;
        float: right;
    }

.splitToolbarButton {
    margin: 0 2px 0 4px;
    display: inline-block;
}

    .splitToolbarButton > .toolbarButton {
        border-radius: 0;
        float: left;
    }

.toolbarButton,
.secondaryToolbarButton,
.overlayButton {
    border: 0 none;
    background: none;
    width: 50px;
    height: 25px;
    cursor: pointer;
}

    .toolbarButton > span {
        display: inline-block;
        width: 0;
        height: 0;
        overflow: hidden;
    }

    .toolbarButton[disabled],
    .secondaryToolbarButton[disabled],
    .overlayButton[disabled] {
        opacity: .5;
    }

    .toolbarButton.group {
        margin-right: 0;
    }

.splitToolbarButton.toggled .toolbarButton {
    margin: 0;
}

.splitToolbarButton > .toolbarButton {
    position: relative;
}

    .splitToolbarButton > .toolbarButton:first-child {
        position: relative;
        margin: 0;
        margin-right: -1px;
    }

    .splitToolbarButton > .toolbarButton:last-child {
        position: relative;
        margin: 0;
        margin-left: -1px;
    }

.splitToolbarButtonSeparator {
    padding: 8px 0;
    width: 1px;
    background-color: hsla(0,0%,0%,.5);
    z-index: 99;
    box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
    display: inline-block;
    margin: 5px 0;
}

html[dir='ltr'] .splitToolbarButtonSeparator {
    float: left;
}

html[dir='rtl'] .splitToolbarButtonSeparator {
    float: right;
}

.splitToolbarButton:hover > .splitToolbarButtonSeparator,
.splitToolbarButton.toggled > .splitToolbarButtonSeparator {
    padding: 12px 0;
    margin: 1px 0;
    box-shadow: 0 0 0 1px hsla(0,0%,100%,.03);
    -webkit-transition-property: padding;
    -webkit-transition-duration: 10ms;
    -webkit-transition-timing-function: ease;
    transition-property: padding;
    transition-duration: 10ms;
    transition-timing-function: ease;
}

.toolbarButton,
.dropdownToolbarButton,
.secondaryToolbarButton,
.overlayButton {
    min-width: 16px;
    padding: 0;
    color: hsla(0,0%,100%,.8);
    font-size: 12px;
    line-height: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    cursor: pointer;
    -webkit-transition-property: background-color, border-color, box-shadow;
    -webkit-transition-duration: 150ms;
    -webkit-transition-timing-function: ease;
    transition-property: background-color, border-color, box-shadow;
    transition-duration: 150ms;
    transition-timing-function: ease;
}

.toolbarButton,
.overlayButton,
.dropdownToolbarButton {
    height: 64px;
    background-repeat: no-repeat;
    background-position: center center;
}

.findbar .toolbarButton,
.findbar .overlayButton,
.findbar .dropdownToolbarButton {
    width: 30px;
    height: 32px;
    margin-right: 4px;
    background-repeat: no-repeat;
    background-position: center center;
}

.toolbarButton.toggled,
.toolbarButton:hover,
.toolbarButton:focus,
.overlayButton,
.secondaryToolbarButton:hover,
.secondaryToolbarButton:focus {
    background-color: #274466;
}

#scaleSelectContainer {
    margin-top: 15px;
}

.dropdownToolbarButton {
    width: 120px;
    max-width: 120px;
    padding: 0;
    /*overflow: hidden;*/
    /*background: url(images/toolbarButton-menuArrows.png) no-repeat;*/
}

html[dir='ltr'] .dropdownToolbarButton {
    background-position: 95%;
}

html[dir='rtl'] .dropdownToolbarButton {
    background-position: 5%;
}

.dropdownToolbarButton > select {
    min-width: 140px;
    font-size: 12px;
    color: hsl(0,0%,95%);
    margin: 0;
    padding: 3px 2px 2px;
    border: none;
    background: rgba(0,0,0,0); /* Opera does not support 'transparent' <select> background */
}

    .dropdownToolbarButton > select > option {
        background: hsl(0,0%,24%);
    }

#customScaleOption {
    display: none;
}

#pageWidthOption {
    border-bottom: 1px rgba(255, 255, 255, .5) solid;
}

/*html[dir='ltr'] .splitToolbarButton:first-child,
html[dir='ltr'] .toolbarButton:first-child,
html[dir='rtl'] .splitToolbarButton:last-child,
html[dir='rtl'] .toolbarButton:last-child {
    margin-left: 4px;
}

html[dir='ltr'] .splitToolbarButton:last-child,
html[dir='ltr'] .toolbarButton:last-child,
html[dir='rtl'] .splitToolbarButton:first-child,
html[dir='rtl'] .toolbarButton:first-child {
    margin-right: 4px;
}*/

.toolbarButtonSpacer {
    width: 30px;
    display: inline-block;
    height: 1px;
}

.toolbarButtonFlexibleSpacer {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    min-width: 30px;
}

.toolbarButton#sidebarToggle {
    background-image: url(images/sidebarToggle.png);
}

.toolbarButton#secondaryToolbarToggle {
    background-image: url(images/toolbarButton-secondaryToolbarToggle.png);
}

.toolbarButton.findPrevious {
    background-image: url(images/previous.png);
}

.toolbarButton.findNext {
    background-image: url(images/next.png);
}

.toolbarButton.pageUp {
    width: 30px;
    background-image: url(images/pageUp.png);
}

.toolbarButton.pageDown {
    width: 30px;
    background-image: url(images/pageDown.png);
}

.toolbarButton.zoomOut {
    background-image: url(images/zoomOut.png);
}

.toolbarButton.zoomIn {
    background-image: url(images/zoomIn.png);
}

/*.toolbarButton.close:hover{
    background-color: #274466;
}*/

.toolbarButton.close {
    background-image: url(../../images/ico/cross-20.png);
}

.toolbarButton.presentationMode,
.secondaryToolbarButton.presentationMode {
    background-image: url(images/toolbarButton-presentationMode.png);
}

.toolbarButton.print,
.secondaryToolbarButton.print {
    background-image: url(images/toolbarButton-print.png);
}

.toolbarButton.openFile,
.secondaryToolbarButton.openFile {
    background-image: url(images/toolbarButton-openFile.png);
}

.toolbarButton.download,
.secondaryToolbarButton.download {
    background-image: url(images/download.png);
}

.toolbarButton.bookmark,
.secondaryToolbarButton.bookmark {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    padding-top: 4px;
    text-decoration: none;
    background-image: url(images/toolbarButton-bookmark.png);
}

.secondaryToolbarButton.bookmark {
    padding-top: 5px;
}

.bookmark[href='#'] {
    opacity: .5;
    pointer-events: none;
}

#viewThumbnail.toolbarButton {
    background-image: url(images/toolbarButton-viewThumbnail.png);
}

html[dir="ltr"] #viewOutline.toolbarButton {
    background-image: url(images/toolbarButton-viewOutline.png);
}

html[dir="rtl"] #viewOutline.toolbarButton {
    background-image: url(images/toolbarButton-viewOutline-rtl.png);
}

#viewAttachments.toolbarButton {
    background-image: url(images/toolbarButton-viewAttachments.png);
}

#viewFind.toolbarButton {
    background-image: url(images/search.png);
}

.secondaryToolbarButton {
    position: relative;
    margin: 0 0 4px 0;
    padding: 3px 0 1px 0;
    height: auto;
    min-height: 25px;
    width: auto;
    min-width: 100%;
    white-space: normal;
}

html[dir="ltr"] .secondaryToolbarButton {
    padding-left: 24px;
    text-align: left;
}

html[dir="rtl"] .secondaryToolbarButton {
    padding-right: 24px;
    text-align: right;
}

html[dir="ltr"] .secondaryToolbarButton.bookmark {
    padding-left: 27px;
}

html[dir="rtl"] .secondaryToolbarButton.bookmark {
    padding-right: 27px;
}

html[dir="ltr"] .secondaryToolbarButton > span {
    padding-right: 4px;
}

html[dir="rtl"] .secondaryToolbarButton > span {
    padding-left: 4px;
}

.secondaryToolbarButton.firstPage {
    background-image: url(images/secondaryToolbarButton-firstPage.png);
}

.secondaryToolbarButton.lastPage {
    background-image: url(images/secondaryToolbarButton-lastPage.png);
}

.secondaryToolbarButton.rotateCcw {
    background-image: url(images/secondaryToolbarButton-rotateCcw.png);
}

.secondaryToolbarButton.rotateCw: {
    background-image: url(images/secondaryToolbarButton-rotateCw.png);
}

.secondaryToolbarButton.handTool {
    background-image: url(images/secondaryToolbarButton-handTool.png);
}

.secondaryToolbarButton.documentProperties {
    background-image: url(images/secondaryToolbarButton-documentProperties.png);
}

.verticalToolbarSeparator {
    display: block;
    padding: 8px 0;
    margin: 8px 4px;
    width: 1px;
    background-color: hsla(0,0%,0%,.5);
    box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
}

html[dir='ltr'] .verticalToolbarSeparator {
    margin-left: 2px;
}

html[dir='rtl'] .verticalToolbarSeparator {
    margin-right: 2px;
}

.horizontalToolbarSeparator {
    display: block;
    margin: 0 0 4px 0;
    height: 1px;
    width: 100%;
    background-color: hsla(0,0%,0%,.5);
    box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
}

.toolbarField {
    margin: 5px 0 5px 0;
    /*padding: 3px 6px;
    border: 1px solid transparent;
    border-radius: 2px;
    background-color: hsla(0,0%,100%,.09);
    background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
    border: 1px solid hsla(0,0%,0%,.35);
    border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
    box-shadow: 0 1px 0 hsla(0,0%,0%,.05) inset, 0 1px 0 hsla(0,0%,100%,.05);
    color: hsl(0,0%,95%);
    font-size: 12px;
    line-height: 14px;
    outline-style: none;*/
    /*transition-property: background-color, border-color, box-shadow;
    transition-duration: 150ms;
    transition-timing-function: ease;*/
}

    .toolbarField[type=checkbox] {
        display: inline-block;
        margin: 8px 0px;
    }

    .toolbarField.pageNumber {
        -moz-appearance: textfield; /* hides the spinner in moz */
        min-width: 16px;
        text-align: right;
        width: 40px;
    }

        .toolbarField.pageNumber.visiblePageIsLoading {
            /*background-image: url(images/loading-small.png);
  background-repeat: no-repeat;
  background-position: 1px;*/
        }

        .toolbarField.pageNumber::-webkit-inner-spin-button,
        .toolbarField.pageNumber::-webkit-outer-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }

input[type="text"].toolbarField {
    margin-top: 15px;
    min-height: 25px;
    background-color: #fff;
}

.toolbarField:hover {
    /*background-color: hsla(0,0%,100%,.11);
  border-color: hsla(0,0%,0%,.4) hsla(0,0%,0%,.43) hsla(0,0%,0%,.45);*/
}

.toolbarField:focus {
    /*background-color: hsla(0,0%,100%,.15);
  border-color: hsla(204,100%,65%,.8) hsla(204,100%,65%,.85) hsla(204,100%,65%,.9);*/
}

.toolbarLabel {
    min-width: 16px;
    padding: 3px 6px 3px 2px;
    margin: 20px 2px 4px 0;
    border: 1px solid transparent;
    border-radius: 2px;
    color: hsl(0,0%,85%);
    font-size: 12px;
    line-height: 14px;
    text-align: left;
    -webkit-user-select: none;
    -moz-user-select: none;
    cursor: default;
}

.findbar .toolbarLabel {
    margin: 4px 2px 4px 0;
}

input[type='checkbox'] + label.toolbarLabel {
    margin: 4px 2px 4px 0;
}

#thumbnailView {
    position: absolute;
    width: 120px;
    top: 0;
    bottom: 0;
    padding: 10px 40px 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.thumbnail {
    float: left;
    margin-bottom: 5px;
}

#thumbnailView > a:last-of-type > .thumbnail {
    margin-bottom: 10px;
}

    #thumbnailView > a:last-of-type > .thumbnail:not([data-loaded]) {
        margin-bottom: 9px;
    }

.thumbnail:not([data-loaded]) {
    border: 1px dashed rgba(255, 255, 255, 0.5);
    margin: -1px -1px 4px -1px;
}

.thumbnailImage {
    border: 1px solid transparent;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
    opacity: 0.8;
    z-index: 99;
    background-color: white;
    background-clip: content-box;
}

.thumbnailSelectionRing {
    border-radius: 2px;
    padding: 7px;
}

a:focus > .thumbnail > .thumbnailSelectionRing > .thumbnailImage,
.thumbnail:hover > .thumbnailSelectionRing > .thumbnailImage {
    opacity: .9;
}

a:focus > .thumbnail > .thumbnailSelectionRing,
.thumbnail:hover > .thumbnailSelectionRing {
    background-color: hsla(0,0%,100%,.15);
    background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
    background-clip: padding-box;
    box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset, 0 0 1px hsla(0,0%,100%,.2) inset, 0 0 1px hsla(0,0%,0%,.2);
    color: hsla(0,0%,100%,.9);
}

.thumbnail.selected > .thumbnailSelectionRing > .thumbnailImage {
    box-shadow: 0 0 0 1px hsla(0,0%,0%,.5);
    opacity: 1;
}

.thumbnail.selected > .thumbnailSelectionRing {
    /*background-color: #fff;*/
    background-color: hsla(0,0%,100%,.3);
    background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
    background-clip: padding-box;
    box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset, 0 0 1px hsla(0,0%,100%,.1) inset, 0 0 1px hsla(0,0%,0%,.2);
    color: hsla(0,0%,100%,1);
}

#outlineView,
#attachmentsView {
    position: absolute;
    width: 192px;
    top: 0;
    bottom: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-user-select: none;
    -moz-user-select: none;
}

#outlineView {
    padding: 4px 4px 0;
}

#attachmentsView {
    padding: 3px 4px 0;
}

html[dir='ltr'] .outlineWithDeepNesting > .outlineItem,
html[dir='ltr'] .outlineItem > .outlineItems {
    margin-left: 20px;
}

html[dir='rtl'] .outlineWithDeepNesting > .outlineItem,
html[dir='rtl'] .outlineItem > .outlineItems {
    margin-right: 20px;
}

.outlineItem > a,
.attachmentsItem > button {
    text-decoration: none;
    display: inline-block;
    min-width: 95%;
    min-width: calc(100% - 4px); /* Subtract the right padding (left, in RTL mode)
                                  of the container. */
    height: auto;
    margin-bottom: 1px;
    border-radius: 2px;
    color: hsla(0,0%,100%,.8);
    font-size: 13px;
    line-height: 15px;
    -moz-user-select: none;
    white-space: normal;
}

.attachmentsItem > button {
    border: 0 none;
    background: none;
    cursor: pointer;
    width: 100%;
}

html[dir='ltr'] .outlineItem > a {
    padding: 2px 0 5px 4px;
}

html[dir='ltr'] .attachmentsItem > button {
    padding: 2px 0 3px 7px;
    text-align: left;
}

html[dir='rtl'] .outlineItem > a {
    padding: 2px 4px 5px 0;
}

html[dir='rtl'] .attachmentsItem > button {
    padding: 2px 7px 3px 0;
    text-align: right;
}

.outlineItemToggler {
    position: relative;
    height: 0;
    width: 0;
    color: hsla(0,0%,100%,.5);
}

    .outlineItemToggler::before {
        content: url(images/treeitem-expanded.png);
        display: inline-block;
        position: absolute;
    }

html[dir='ltr'] .outlineItemToggler.outlineItemsHidden::before {
    content: url(images/treeitem-collapsed.png);
}

html[dir='rtl'] .outlineItemToggler.outlineItemsHidden::before {
    content: url(images/treeitem-collapsed-rtl.png);
}

.outlineItemToggler.outlineItemsHidden ~ .outlineItems {
    display: none;
}

html[dir='ltr'] .outlineItemToggler {
    float: left;
}

html[dir='rtl'] .outlineItemToggler {
    float: right;
}

html[dir='ltr'] .outlineItemToggler::before {
    right: 4px;
}

html[dir='rtl'] .outlineItemToggler::before {
    left: 4px;
}

.outlineItemToggler:hover,
.outlineItemToggler:hover + a,
.outlineItemToggler:hover ~ .outlineItems,
.outlineItem > a:hover,
.attachmentsItem > button:hover {
    background-color: hsla(0,0%,100%,.02);
    background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
    background-clip: padding-box;
    box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset, 0 0 1px hsla(0,0%,100%,.2) inset, 0 0 1px hsla(0,0%,0%,.2);
    border-radius: 2px;
    color: hsla(0,0%,100%,.9);
}

.outlineItem.selected {
    background-color: hsla(0,0%,100%,.08);
    background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
    background-clip: padding-box;
    box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset, 0 0 1px hsla(0,0%,100%,.1) inset, 0 0 1px hsla(0,0%,0%,.2);
    color: hsla(0,0%,100%,1);
}

.noResults {
    font-size: 12px;
    color: hsla(0,0%,100%,.8);
    font-style: italic;
    cursor: default;
}


#errorWrapper {
    background: none repeat scroll 0 0 #FF5555;
    color: white;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 1000;
    padding: 3px;
    font-size: 0.8em;
}

.loadingInProgress #errorWrapper {
    top: 37px;
}

#errorMessageLeft {
    float: left;
}

#errorMessageRight {
    float: right;
}

#errorMoreInfo {
    background-color: #FFFFFF;
    color: black;
    padding: 3px;
    margin: 3px;
    width: 98%;
}

.overlayButton {
    width: auto;
    margin: 3px 4px 2px 4px !important;
    padding: 2px 6px 3px 6px;
}

#overlayContainer {
    display: table;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: hsla(0,0%,0%,.2);
    z-index: 40000;
}

    #overlayContainer > * {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    #overlayContainer > .container {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }

        #overlayContainer > .container > .dialog {
            display: inline-block;
            padding: 15px;
            border-spacing: 4px;
            color: hsl(0,0%,85%);
            font-size: 12px;
            line-height: 14px;
            background-color: #474747; /* fallback */
            background-image: url(images/texture.png), linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
            box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08), inset 0 1px 1px hsla(0,0%,0%,.15), inset 0 -1px 0 hsla(0,0%,100%,.05), 0 1px 0 hsla(0,0%,0%,.15), 0 1px 1px hsla(0,0%,0%,.1);
            border: 1px solid hsla(0,0%,0%,.5);
            border-radius: 4px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
        }

.dialog > .row {
    display: table-row;
}

    .dialog > .row > * {
        display: table-cell;
    }

.dialog .toolbarField {
    margin: 5px 0;
}

.dialog .separator {
    display: block;
    margin: 4px 0 4px 0;
    height: 1px;
    width: 100%;
    background-color: hsla(0,0%,0%,.5);
    box-shadow: 0 0 0 1px hsla(0,0%,100%,.08);
}

.dialog .buttonRow {
    text-align: center;
    vertical-align: middle;
}

.dialog :link {
    color: white;
}

#passwordOverlay > .dialog {
    text-align: center;
}

#passwordOverlay .toolbarField {
    width: 200px;
}

#documentPropertiesOverlay > .dialog {
    text-align: left;
}

#documentPropertiesOverlay .row > * {
    min-width: 100px;
}

html[dir='ltr'] #documentPropertiesOverlay .row > * {
    text-align: left;
}

html[dir='rtl'] #documentPropertiesOverlay .row > * {
    text-align: right;
}

#documentPropertiesOverlay .row > span {
    width: 125px;
    word-wrap: break-word;
}

#documentPropertiesOverlay .row > p {
    max-width: 225px;
    word-wrap: break-word;
}

#documentPropertiesOverlay .buttonRow {
    margin-top: 10px;
}

.clearBoth {
    clear: both;
}

.fileInput {
    background: white;
    color: black;
    margin-top: 5px;
    visibility: hidden;
    position: fixed;
    right: 0;
    top: 0;
}

#PDFBug {
    background: none repeat scroll 0 0 white;
    border: 1px solid #666666;
    position: fixed;
    top: 32px;
    right: 0;
    bottom: 0;
    font-size: 10px;
    padding: 0;
    width: 300px;
}

    #PDFBug .controls {
        background: #EEEEEE;
        border-bottom: 1px solid #666666;
        padding: 3px;
    }

    #PDFBug .panels {
        bottom: 0;
        left: 0;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        position: absolute;
        right: 0;
        top: 27px;
    }

    #PDFBug button.active {
        font-weight: bold;
    }

.debuggerShowText {
    background: none repeat scroll 0 0 yellow;
    color: blue;
}

.debuggerHideText:hover {
    background: none repeat scroll 0 0 yellow;
}

#PDFBug .stats {
    font-family: courier;
    font-size: 10px;
    white-space: pre;
}

    #PDFBug .stats .title {
        font-weight: bold;
    }

#PDFBug table {
    font-size: 10px;
}

#viewer.textLayer-visible .textLayer > div,
#viewer.textLayer-hover .textLayer > div:hover {
    background-color: white;
    color: black;
}

#viewer.textLayer-shadow .textLayer > div {
    background-color: rgba(255,255,255, .6);
    color: black;
}

.grab-to-pan-grab {
}

    .grab-to-pan-grab *:not(input):not(textarea):not(button):not(select):not(:link) {
        cursor: inherit !important;
    }

    .grab-to-pan-grab:active,
    .grab-to-pan-grabbing {
        position: fixed;
        background: transparent;
        display: block;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
        z-index: 50000; /* should be higher than anything else in PDF.js! */
    }

#printContainer {
    display: none;
}


.visibleLargeView,
.visibleMediumView,
.visibleSmallView {
    display: none;
}

@media all and (max-width: 960px) {
    html[dir='ltr'] #outerContainer.sidebarMoving .outerCenter,
    html[dir='ltr'] #outerContainer.sidebarOpen .outerCenter {
        float: left;
        left: 205px;
    }

    html[dir='rtl'] #outerContainer.sidebarMoving .outerCenter,
    html[dir='rtl'] #outerContainer.sidebarOpen .outerCenter {
        float: right;
        right: 205px;
    }
}

@media all and (max-width: 900px) {
    .sidebarOpen .hiddenLargeView {
        display: none;
    }

    .sidebarOpen .visibleLargeView {
        display: inherit;
    }
}

@media all and (max-width: 860px) {
    .sidebarOpen .hiddenMediumView {
        display: none;
    }

    .sidebarOpen .visibleMediumView {
        display: inherit;
    }
}

@media all and (max-width: 770px) {
    #sidebarContainer {
        top: 32px;
        z-index: 100;
    }

    .loadingInProgress #sidebarContainer {
        top: 37px;
    }

    #sidebarContent {
        top: 32px;
        background-color: hsla(0,0%,0%,.7);
    }

    html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
        left: 0px;
    }

    html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer {
        right: 0px;
    }

    html[dir='ltr'] .outerCenter {
        float: left;
        left: 205px;
    }

    html[dir='rtl'] .outerCenter {
        float: right;
        right: 205px;
    }

    #outerContainer .hiddenLargeView,
    #outerContainer .hiddenMediumView {
        display: inherit;
    }

    #outerContainer .visibleLargeView,
    #outerContainer .visibleMediumView {
        display: none;
    }
}

@media all and (max-width: 700px) {
    #outerContainer .hiddenLargeView {
        display: none;
    }

    #outerContainer .visibleLargeView {
        display: inherit;
    }
}

@media all and (max-width: 660px) {

    #pageNumberLabel, #pageNumber, #numPages {
        display: none;
    }

    #outerContainer .visibleMediumView {
        display: inherit;
    }
}

@media all and (max-width: 600px) {
    .hiddenSmallView {
        display: none;
    }

    .visibleSmallView {
        display: inherit;
    }

    html[dir='ltr'] #outerContainer.sidebarMoving .outerCenter,
    html[dir='ltr'] #outerContainer.sidebarOpen .outerCenter,
    html[dir='ltr'] .outerCenter {
        left: 156px;
    }

    html[dir='rtl'] #outerContainer.sidebarMoving .outerCenter,
    html[dir='rtl'] #outerContainer.sidebarOpen .outerCenter,
    html[dir='rtl'] .outerCenter {
        right: 156px;
    }

    .toolbarButtonSpacer {
        width: 0;
    }
}


/* 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 */



 
    /* Page */
    #upPage {
        margin: 2% 0 130px 0;
        padding-top: 20px !important;
        min-width:unset;
    }

    #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: 5px;
        margin-bottom: 5px;
        font-size: 18px;
    }

    h2 {
        font-size: 14px;
    }

        h2.h2-ico{
            min-height: 35px;
            margin : 0 0 5px 0;
            padding-top: 18px;
        }

        /* 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;
    }


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


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

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

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

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

  
    #upPage {
        width: 96%;
        margin-right: 2%;
        margin-left: 2%;
    }

    #upHeader {
        min-height: 90px;
    }

        #upHeader > .page-content > .logo {
            width: 72px;
            height: 57px;
            background-size: cover;
            margin: 16px 1%;
        }

    .page-content,
    .footer > .footer-content {
        width: 100%;
        padding: 0 20px;
        margin: 0;
        box-sizing: border-box;
    }

        .footer > .footer-content .float-left {
            float: none;
        }

        .footer > .footer-content .float-right {
            margin-right: 0;
            float: none;
        }

    
    /* Mode forcé */
    .mode-force {
        float: left;
        max-width: calc(-130px + 100%);
        margin-top: 10px;
        margin-left:10px;
        font-size: 10px;
    }

    /* force le block dans les formulaires */
    article.form > div > span.lbl,
    article.form > div > span.ctl {
        text-align: left;
        display: block;
        width: auto;
        padding-right: 0;
        padding-top: 0;
    }

        article.form > div > span.lbl.wp-75,
        article.form > div > span.lbl.wp-66,
        article.form > div > span.lbl.wp-50,
        article.form > div > span.lbl.wp-33,
        article.form > div > span.lbl.wp-25 {
            width: 100%;
        }

    span.col-3 > input[type='checkbox'] + label{
        min-width: initial;
        max-width: initial;
    }

    .txt-yellow{
        font-size: 10px;
    }

    .btn-txt-ico{
        font-size: 12px;
    }

    .btn-txt-ico.medium{
        padding: 5px 15px;
        padding-left: 40px;
    }

    h3 + .btn-ico {
        margin: -5px 0 0 0;
    }

    .hide-s{
        display: none;
    }


}

/* 
Version 1.00
Date : 14/12/2020
*/


/*#region commun */

h2 {
    display: inline-block;
    padding: 10px;
    margin: 0 0 34px 0;
    font-size: 30px;
    font-family: Arial, sans-serif;
    letter-spacing: 0.1em;
    color: #000;
    text-transform: uppercase;
    font-weight: bold;
    background-color: #fff000;
}

/*#endregion*/

/*#region header */

#upHeader {
    min-height: 90px;
    background-color: #242424;
}

    #upHeader > .header {
        position: relative;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

        #upHeader > .header > .logo {
            background-image: url(../images/layout/logo-white.png);
            background-position: left center;
            background-repeat: no-repeat;
            width: 112px;
            height: 80px;
            margin: 5px 1%;
        }

        /*#endregion*/

        /*#region header - header-menu  */

        #upHeader > .header > #header-menu {
            display: block;
            flex: 1;
            text-align: right;
            margin-right: 20px;
        }

            #upHeader > .header > #header-menu > ul {
                padding: 0;
                margin: 0;
                list-style: none;
            }

                #upHeader > .header > #header-menu > ul > li {
                    display: inline-block;
                    margin: 0 8px;
                    list-style: none;
                }

                    #upHeader > .header > #header-menu > ul > li > a {
                        position: relative;
                        padding: 10px 20px;
                        font-size: 0.9em;
                        color: #fff;
                        text-decoration: none;
                        font-weight: normal;
                        text-transform: uppercase;
                        transition: all 100ms ease-out;
                    }

                        #upHeader > .header > #header-menu > ul > li > a:hover {
                            background-color: #fff000;
                            color: #000;
                            transition: all 150ms ease-in;
                        }


body[data-menu="1"] nav > ul > li a[data-menu="1"],
body[data-menu="2"] nav > ul > li a[data-menu="2"],
body[data-menu="3"] nav > ul > li a[data-menu="3"],
body[data-menu="4"] nav > ul > li a[data-menu="4"],
body[data-menu="5"] nav > ul > li a[data-menu="5"],
body[data-menu="6"] nav > ul > li a[data-menu="6"] {
    background-color: #fff000 !important;
    color: #000 !important;
    transition: all 150ms ease-in;
}

body[data-menu="0"] #header-menu,
body[data-menu="0"] .header-account,
body[data-menu="0"] .menu-small {
    display: none !important;
}

/*#endregion*/

/*#region header - header-account  */
#upHeader > .header > .header-account {
    display: block;
    width: 30px;
    height: 30px;
    margin-right: 30px;
    background-image: url('../images/ico/user-circle-30.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 30px;
}

#upHeader > .header > .header-account {
    display: block;
    width: 30px;
    height: 30px;
    margin-right: 30px;
    background-image: url('../images/espaceclient/espaceclient-account.png');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 30px;
}

    #upHeader > .header > .header-account:hover {
        background-position: center bottom;
    }

/*body[data-menu="6"] .header-account[data-menu="6"] {
    background-position: center bottom;
}
*/
/*#endregion*/

/*#region page-holder */

.page-holder {
}
    /*#endregion*/

    /*#region page-holder - page-top (Haut d'une page : photo et titre) */

        .page-holder > .page-top > div {
            width: 60%;
            min-width: 980px;
            margin: 0 auto 0 auto;
            padding-top: 90px;
        }

            .page-holder > .page-top > div .content {
                color: #000;
                font-size: 16px;
                background-color: rgba(255, 255, 255, 0.8);
                padding: 10px;
            }

                .page-holder > .page-top > div .content a {
                    color: #000;
                    text-decoration: underline;
                }

.page-holder > .page-top > .background {
    position: absolute;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
    top : 0;
}

    .page-holder > .page-top > div {
        min-height: 210px;
    }

    .page-holder.accueil > .page-top > div {
        /*min-height: 410px;*/
    }

    .page-holder.accueil > .page-top > .background {
        height: 300px;
        background-image: url('../images/espaceclient/background-accueil.jpg');
        background-position: center bottom;
    }

    .page-holder.partenaire > .page-top > .background {
        height: 300px;
        background-image: url('../images/espaceclient/background-partenaire.jpg');
        background-position: center bottom;
    }

    .page-holder.telechargement > .page-top > .background {
        height: 300px;
        background-image: url('../images/espaceclient/background-accueil.jpg');
        background-position: right top;
    }

    .page-holder.newsletter > .page-top {
        height: 300px;
        background-image: url('../images/espaceclient/background-partenaire.jpg');
        background-position: center bottom;
    }

    .page-holder.evenement > .page-top > .background {
        height: 300px;
        background-image: url('../images/espaceclient/background-accueil.jpg');
        background-position: right top;
    }

    /*#endregion*/

    /*#region page-holder - page-content  */

    .page-holder > .page-content {
        width: 60%;
        min-width: 980px;
        margin-right: auto;
        margin-left: auto;
    }

    .page-holder.calendrier > .page-content,
    .page-holder.accueil > .page-content {
        margin-top: 30px;
    }


        .page-holder.accueil > .page-content .col-btn {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            flex-wrap: wrap;
        }

    .page-holder > .page-content > .entete {
        margin-top: 20px;
    }

    /*#endregion*/

    /*#region page-holder - page-content - left-menu */

    .page-holder > .page-content .left-menu {
        list-style: none;
        margin: 30px 0 0 0;
        padding: 0;
    }

        .page-holder > .page-content .left-menu > li {
            list-style: none;
            margin: 0;
            padding: 2px 0;
        }

            .page-holder > .page-content .left-menu > li > a {
                padding: 0 10px;
                font-size: 16px;
                color: #000;
                line-height: 26px;
                font-weight: bold;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                text-overflow: ellipsis;
                overflow: hidden;
            }

                .page-holder > .page-content .left-menu > li > a:hover {
                    background-color: #fff000;
                }

                .page-holder > .page-content .left-menu > li > a.selected {
                    background-color: #fff000;
                }


/*#endregion*/

/*#region index-holder (Page de connection) */
.index-holder {
    display: flex;
    position: fixed;
    top: 90px;
    left: 0;
    right: 0;
    bottom: 45px;
}

    .index-holder > div {
        min-height: calc(100vh - 125px);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

        .index-holder > div:first-child {
            width: 25%;
            background-image: url('../images/espaceclient/abstract-login.png');
        }

        .index-holder > div:last-of-type {
            width: 75%;
            background-image: url('../images/espaceclient/background-login.jpg');
        }

    .index-holder > .index-box {
        position: absolute;
        top: calc(50% - 125px);
        left: 5%;
        width: 500px;
        padding: 20px 20px 10px 20px;
        background: #fff;
        border: none !important;
        box-sizing: border-box;
    }

        .index-holder > .index-box > h2 {
            position: absolute;
            top: -25px;
            left: -40px;
        }

        .index-holder > .index-box > article {
            position: relative;
            height: 320px;
            overflow: hidden;
        }

            .index-holder > .index-box > article > div {
                position: absolute;
                left: 0;
                top: 30px;
                width: 460px;
                height: 260px;
            }

            .index-holder > .index-box > article > div[data-frame] {
                left: -9999px;
            }

                .index-holder > .index-box > article > div[data-frame].visible {
                    left: 0 !important;
                }

                .index-holder > .index-box > article > div > .action {
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    left: 0;
                    height: 40px;
                    margin-top: 10px;
                    zoom: 1;
                }

                article > div > .error {
                    margin-top: 10px;
                    font-weight: bold;
                    color: #d61414;
                }


                .index-holder > .index-box > article > div[data-frame] > .using {
                    display: flex;
                    flex-direction: row;
                    justify-content: space-between;
                    align-items: center;
                }

                    .index-holder > .index-box > article > div[data-frame] > .using > span {
                        flex: 1;
                    }


    /*#endregion*/

    /*#region index-holder - btn-txt */

    .index-holder .btn-txt {
        color: #3d3d3d;
        font-size: 12px;
        line-height: 40px;
    }

        .index-holder .btn-txt:hover {
            text-decoration: underline;
        }

/*#endregion*/

/*#region card-holder-01  */
.card-holder-01 {
}

    .card-holder-01.overflow-top {
        margin-top: -50px;
    }

    .card-holder-01:before,
    .card-holder-01:after {
        content: "";
        display: table;
    }

    .card-holder-01:after {
        clear: both;
    }

    .card-holder-01 > a,
    .card-holder-01 > div {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-start;
        float: left;
        width: 49%;
        margin-left: 2%;
        margin-bottom: 15px;
        height: 280px;
        padding: 10px;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        box-sizing: border-box;
        zoom: 1;
        overflow: hidden;
        transition: all 100ms ease-out;
    }

        .card-holder-01 > a:hover,
        .card-holder-01 > div:hover {
            justify-content: space-between;
            box-shadow: 0px 2px 7px 2px rgba(40,40,40,0.3);
            transition: all 150ms ease-in;
        }

        .card-holder-01 > a:nth-child(2n+1),
        .card-holder-01 > div:nth-child(2n+1) {
            margin-left: 0 !important;
        }

        .card-holder-01 > a > .bg-black,
        .card-holder-01 > div > .bg-black {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0,0,0,0.5);
            opacity: 0;
            z-index: 1;
            transition: all 100ms ease-out;
        }

        .card-holder-01 > a:hover > .bg-black,
        .card-holder-01 > div:hover > .bg-black {
            opacity: 1;
            transition: all 100ms ease-in;
        }

        .card-holder-01 > a > .title,
        .card-holder-01 > div > .title {
            margin-bottom: 5px;
            color: #fff;
            font-size: 20px;
            font-weight: 600;
            text-transform: uppercase;
            z-index: 2;
        }

            .card-holder-01 > a > .title.info-hover,
            .card-holder-01 > div > .title.info-hover {
                display: none;
                font-size: 14px;
                color: #000;
                background-color: #ffffffc7;
                padding: 5px;
                text-align: center;
            }

        .card-holder-01 > a:hover > .title.info-hover,
        .card-holder-01 > div:hover > .title.info-hover {
            display: block;
        }

        .card-holder-01 > a > .tag,
        .card-holder-01 > div > .tag {
            display: block;
            transition: all 100ms ease-out;
        }

        .card-holder-01 > a:hover > .info + .tag,
        .card-holder-01 > div:hover > .info + .tag {
            display: none;
            transition: all 150ms ease-in;
        }

        .card-holder-01 > a .tag,
        .card-holder-01 > div .tag {
            padding: 3px;
            color: #000;
            background-color: #fff000;
            z-index: 2;
        }

        .card-holder-01 > a > .info,
        .card-holder-01 > div > .info {
            display: none;
            margin-bottom: 5px;
            color: #fff;
            font-size: 13px;
            z-index: 2;
        }

        .card-holder-01 > a:hover > .info,
        .card-holder-01 > div:hover > .info {
            display: block;
        }

        .card-holder-01 > a > .info > .tag,
        .card-holder-01 > div > .info > .tag {
            display: inline-block;
            margin: 3px 0;
        }
/*#endregion*/

/*#region card-holder-02  */

.card-holder-02 {
}


    .card-holder-02.overflow-top {
        margin-top: -50px;
    }

    .card-holder-02:before,
    .card-holder-02:after {
        content: "";
        display: table;
    }

    .card-holder-02:after {
        clear: both;
    }

    .card-holder-02 > div {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-start;
        float: left;
        width: 32%;
        margin-left: 2%;
        margin-bottom: 15px;
        padding: 10px;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        box-sizing: border-box;
        zoom: 1;
        overflow: hidden;
        box-sizing: border-box;
        transition: all 100ms ease-out;
    }

        .card-holder-02 > div:nth-child(3n+1) {
            margin-left: 0 !important;
        }

        .card-holder-02 > div > img {
            display: block;
            width: 213px;
            height: 280px;
            margin-left: auto;
            margin-right: auto;
        }

        .card-holder-02 > div > .title {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            margin: 8px auto;
            font-size: 16px;
            color: #000;
            font-weight: 600;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        .card-holder-02 > div > a {
            display: block;
            width: 30px;
            height: 30px;
            margin-left: auto;
            margin-right: auto;
            background-color: #fff000;
            background-image: url('../images/espaceclient/download.png');
            background-position: center center;
            background-repeat: no-repeat;
            background-size: 18px;
            border-radius: 50%;
            transition: all 100ms ease-out;
        }

        .card-holder-02 > div > a.link {
            background-image: url('../images/espaceclient/link.png');
        }

            .card-holder-02 > div > a.youtube {
                background-image: url('../images/espaceclient/youtube.png');
            }

            .card-holder-02 > div > a:hover {
                background-color: #eadd03;
                transition: all 150ms ease-in;
            }

/*#endregion*/

/*#region btn */

.btn-big {
    display: inline-block;
    padding: 23px 30px 23px 60px;
    margin-bottom: 10px;
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
    vertical-align: top;
    letter-spacing: 2px;
    font-weight: bold;
    background-position: 20px center;
    background-repeat: no-repeat;
    background-size: 20px;
    transition: all 100ms linear;
    width: 100%;
}

    .btn-big > span:first-child {
        display: block;
        font-size: 10px;
    }

    .btn-big > span:last-of-type {
        display: block;
        font-size: 20px;
        margin-top: 5px;
    }


    .btn-big b {
        font-weight: 800;
    }


    .btn-big.yellow {
        color: #000;
        background-color: #fff000;
        border: solid 1px #000;
    }

    .btn-big:hover {
        box-shadow: 0px 2px 7px 2px rgba(40,40,40,0.3);
        transition: all 200ms linear;
    }

/*#endregion*/

/*#region ico */

.ico-hourglass {
    background-image: url('../images/espaceclient/hourglass.png');
}

.ico-bill {
    background-image: url('../images/espaceclient/bill.png');
}
/*#endregion*/

/*#region popup */

.popup-overlay > .holder > .content > .title {
    color: #000;
}

.popup-overlay .holder > .content {
    min-width: 500px;
}

/*#endregion*/

/*#region table */

.table-01 {
    border-left: none;
    border-right: none;
    border-bottom: solid 5px #fff000;
}

    .table-01 thead {
        border-left: solid 1px #fff000;
        border-right: solid 1px #fff000;
    }

    .table-01 tbody {
        border-left: solid 1px #eeeeee;
        border-right: solid 1px #eeeeee;
    }


    .table-01 thead th {
        background-color: #fff000;
    }

        .table-01 thead th a {
            color: #000;
        }

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

    .table-01 tbody tr:hover td{
        background-color: #eeeeee;
    }
    /*#endregion*/
    /*#region screensmall */
    @media screen and (max-width:1200px) {
        #upHeader > .header > #header-menu > ul > li {
        margin: 0;
    }

        #upHeader > .header > #header-menu > ul > li > a {
            padding: 10px;
        }
}

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

    #upPage {
        width: 100% !important;
        margin: 0 0 130px 0;
        padding-top: 0 !important;
    }

    .page-holder > .page-top > div {
        width: 96%;
        min-width: unset !important;
        margin: 50px 2% 0 2%;
    }

    .page-holder > .page-content {
        width: 96% !important;
        min-width: unset !important;
        margin-left: 2%;
        margin-right: 2%;
        padding: 0 !important;
    }

    .row > .wp-33,
    .row > .wp-66 {
        width: 100% !important;
        margin: 0 !important;
    }

    #upHeader > .header > .logo {
        flex: 1;
    }

    /*#region header - header-menu */

    #upHeader > .header > #header-menu {
        position: absolute;
        top: 90px;
        left: 0px;
        right: 0px;
        display: block;
    }

    #upHeader > .header > #header-menu {
        margin: 0;
    }

        #upHeader > .header > #header-menu > ul > li {
            display: block !important;
            margin: 0;
            background-color: #242424;
        }

            #upHeader > .header > #header-menu > ul > li > a {
                display: block !important;
                font-size: 12px;
                text-align: left;
            }

    /*#endregion*/

    /*#region header - menu-small */
    #upHeader > .header > .menu-small {
        display: block;
        width: 30px;
        height: 30px;
        margin-right: 30px;
    }

        #upHeader > .header > .menu-small > .btn-menu {
            display: inline-block;
            cursor: pointer;
            text-decoration: none;
        }

            #upHeader > .header > .menu-small > .btn-menu > #menu-bar1,
            #upHeader > .header > .menu-small > .btn-menu > #menu-bar2,
            #upHeader > .header > .menu-small > .btn-menu > #menu-bar3 {
                width: 30px;
                height: 4px;
                background-color: #fff;
                margin: 6px 0;
                transition: 0.4s;
                border-radius: 2px;
            }

                #upHeader > .header > .menu-small > .btn-menu > #menu-bar1.change {
                    -webkit-transform: rotate(-45deg) translate(-6.5px, 6px);
                    transform: rotate(-45deg) translate(-6.5px, 6px);
                }

                #upHeader > .header > .menu-small > .btn-menu > #menu-bar2.change {
                    opacity: 0;
                }

                #upHeader > .header > .menu-small > .btn-menu > #menu-bar3.change {
                    -webkit-transform: rotate(45deg) translate(-8px, -8px);
                    transform: rotate(45deg) translate(-8px, -8px);
                }


    /*#endregion*/

    /*#region index-holder (Page de connection) */

    .index-holder > .index-box {
        left: 50px !important;
        width: 400px !important;
        min-width: 320px !important;
    }

        .index-holder > .index-box > article > div[data-frame] {
            width: 360px;
        }


        /*#endregion*/
        /*#region card */
    .card-holder-01 > a,
    .card-holder-01 > div,
    .card-holder-02 > div {
        width: 100% !important;
        margin: 0 0 10px 0;
    }

        .card-holder-01.overflow-top {
            margin-top: 0 !important;
        }

    /*#endregion*/

    /*#region left-menu */

    .page-holder > .page-content .left-menu {
        margin: 15px 0 15px 0;
    }


    /*#endregion*/


    .btn-big {
        width: 49%;
        box-sizing: border-box;
        margin-left: 2%;
    }

        .btn-big:nth-child(2n+1) {
            margin-left: 0;
        }

    .popup-overlay .holder > .content{
        min-width : 300px;
    }
}

/*#endregion*/

.frame-youtube {
    width: 854px;
    height: 480px;
}

.player {
    background: #666;
    border: 1px solid #000;
    height: 228px;
    overflow: hidden;
    position: relative;
    width: 100%;
    box-sizing: border-box;
    z-index: 1;
}

    .player > .background {
        background-size: cover;
        background-position: bottom;
        display: block;
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 1;
        filter: blur(10px);
    }

        .player > .background::before {
            background: #333;
            content: '';
            display: block;
            height: 100%;
            opacity: 0.5;
            position: absolute;
            width: 100%;
        }

        .player > .background::after {
            content: '';
            display: block;
            height: 100%;
            position: absolute;
            width: 100%;
            background: rgba(0, 0, 0, 0);
            background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(50, 50, 50, 1) 100%);
        }

    .player > .container {
        margin: 10px;
        z-index: 2;
        position: relative;
        overflow: hidden;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: stretch;
        align-content: stretch;
        text-align: center;
    }

        .player > .container > .audio-image {
            width: 200px;
            height: 200px;
        }

        .player > .container > .audio-content {
            width: calc(100vw - 200px);
            display: flex;
            flex-direction: column;
            align-items: center;
            align-content: space-between;
        }

            .player > .container > .audio-content > .audio-infos {
                width: 100%;
                height: 100px;
                color: #fff;
                text-shadow: 1px 1px 2px #000;
            }

                .player > .container > .audio-content > .audio-infos p.audio-title {
                    font-size: 20px;
                    font-weight: 600;
                    text-transform: uppercase;
                    margin: 10px 0 5px;
                }

                .player > .container > .audio-content > .audio-infos p.audio-description {
                    color: #b3b3b3;
                    font-size: 12px;
                    margin: 0;
                }

            .player > .container > .audio-content > .audio-controls {
                display: block;
                width: 100%;
                height: 80px;
                color: #fff;
                text-align: center;
            }

                .player > .container > .audio-content > .audio-controls .play-btn {
                    display: block;
                    vertical-align: middle;
                    margin-left: auto;
                    margin-right: auto;
                    width: 34px;
                    font-size: 20px;
                    margin-top: 13px;
                    padding: 10px;
                    cursor: pointer;
                }

            .player > .container > .audio-content > .timeline {
                position: relative;
                margin: 0;
                width: 96%;
            }

                .player > .container > .audio-content > .timeline span {
                    color: #b3b3b3;
                    font-size: 11px;
                    position: absolute;
                    top: -20px;
                }

                    .player > .container > .audio-content > .timeline span.current-time {
                        left: 0;
                    }

                    .player > .container > .audio-content > .timeline span.total-time {
                        right: 0;
                    }

                .player > .container > .audio-content > .timeline div.slider {
                    background-color: #808080;
                    cursor: pointer;
                    height: 2px;
                    position: relative;
                    width: 100%;
                }

                    .player > .container > .audio-content > .timeline div.slider div.progress {
                        background-color: #fff000;
                        height: 100%;
                        pointer-events: none;
                        position: absolute;
                        width: 0;
                    }

                        .player > .container > .audio-content > .timeline div.slider div.progress div.pin {
                            background-color: #fff;
                            border-radius: 8px;
                            height: 8px;
                            position: absolute;
                            pointer-events: all;
                            right: -5px;
                            top: -3px;
                            width: 8px;
                            transition: transform 0.25s ease;
                        }

                            .player > .container > .audio-content > .timeline div.slider div.progress div.pin:active {
                                transform: scale(1.5);
                            }


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

    .frame-youtube {
        width: 430px;
        height: 240px;
    }
}
/*

.page-holder.evenement .alert-info {
    background-color: red;
}*/