/*
Oblyon theme for Dolibarr
colortextbackhmenu=444
colortextbackvmenu=#FFFFFF
colortexttitle=444
colorshadowtitle=FFF
colortextbacktab=444
/*
colorbackbody=249,29,29
colorbackvmenu1=0,127,255
colorbackhmenu1=0,127,255
colorbacktitle1=230,230,230
colorbacklineimpair1=244,244,244
colorbacklineimpair2=250,250,250
colorbacklinepair1=248,248,248
colorbacklinepair2=246,246,246
colorbacklinepairhover=
colorbacklinepairchecked=230,237,244
$colortexttitlenotab=110,80,20
$colortexttitle=444
$colortext=40,40,40
$colortextlink=40,40,40
$colortextbackhmenu=444
$colortextbackvmenu=#FFFFFF
dol_hide_topmenu=
dol_hide_leftmenu=
dol_optimize_smallscreen=
dol_no_mouse_hover=
dol_screenwidth=
dol_screenheight=
fontsize=14
nbtopmenuentries=
fontsizesmaller=14topMenuFontSize=1.2em
toolTipBgColor=rgba(255, 255, 255, 0.96)
toolTipFontColor=#333
*/
/* <style type="text/css">
    */
    /* ============================================================================== */
    /* Default styles                                                                 */
    /* ============================================================================== */

    /*------------------------------------*\
#Eric Meyer's Reset CSS v2.0
\*------------------------------------*/

    html,
    body,
    div,
    span,
    applet,
    object,
    iframe,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    blockquote,
    pre,
    a,
    abbr,
    acronym,
    address,
    big,
    cite,
    code,
    del,
    dfn,
    em,
    img,
    ins,
    kbd,
    q,
    s,
    samp,
    small,
    strike,
    sub,
    sup,
    tt,
    var,
    b,
    u,
    i,
    center,
    dl,
    dt,
    dd,
    ol,
    ul,
    li,
    fieldset,
    form,
    label,
    legend,
    table,
    caption,
    tbody,
    tfoot,
    thead,
    tr,
    th,
    td,
    article,
    aside,
    canvas,
    details,
    embed,
    figure,
    figcaption,
    footer,
    header,
    hgroup,
    menu,
    nav,
    output,
    ruby,
    section,
    summary,
    time,
    mark,
    audio,
    video {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        font: inherit;
        vertical-align: middle;
    }

    /* HTML5 display-role reset for older browsers */
    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    hgroup,
    menu,
    nav,
    section {
        display: block;
    }

    body {
        line-height: 1;
    }

    ol,
    ul {
        list-style: none;
    }

    blockquote,
    q {
        quotes: none;
    }

    blockquote:before,
    blockquote:after,
    q:before,
    q:after {
        content: '';
        content: none;
    }

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

    /*------------------------------------*\
#BASE
\*------------------------------------*/

    html {
        box-sizing: border-box;
    }

    *,
    *:before,
    *:after {
        box-sizing: inherit;
    }

    html,
    body {
        height: 100%;
        font-size: 100%;
    }

    body {
        direction: ltr;
background-color: #FFFFFF !important;
        color: #444444 !important;
        font-family: "Open Sans",Tahoma,Arial,Helvetica, sans-serif;
        font-size: 14px;
        -webkit-font-smoothing: subpixel-antialiased;
        margin: 0;
    }

    .thumbstat {
        font-weight: bold !important;
    }

    /**
* Headings
*/

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
        font-weight: normal;
        font-style: normal;
        color: #444444;
        text-rendering: optimizeLegibility;
        margin-top: 0.2rem;
        margin-bottom: 0.5rem;
        line-height: 1.4;
    }

    h1 {
        font-size: 2.125rem;
    }

    h2 {
        font-size: 1.6875rem;
    }

    h3 {
        font-size: 1.375rem;
    }

    h4 {
        font-size: 1.125rem;
    }

    h5 {
        font-size: 1.125rem;
    }

    h6 {
        font-size: 1rem;
    }


    form {
        padding: 0px;
        margin: 0px;
    }

    div.float {
        float: left;
    }

    div.floatright {
        float: right;
    }

    .inline-block {
        display: inline-block;
    }

    /* th a, .thumbstat, a.tab { font-weight: bold !important; } */

    th .button {
        -moz-box-shadow: none !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        -moz-border-radius: 0px !important;
        -webkit-border-radius: 0px !important;
        border-radius: 0px !important;
    }

    .maxwidthsearch {
        /* Max width of column with the search picto */
        width: 54px;
    }

    .valigntop {
        vertical-align: top;
    }

    .valignmiddle {
        vertical-align: middle;
    }

    .valignbottom {
        vertical-align: bottom;
    }

    .valigntextbottom {
        vertical-align: text-bottom;
    }

    .centpercent {
        width: 100%;
    }

    .quatrevingtpercent,
    .inputsearch {
        width: 80%;
    }

    .soixantepercent {
        width: 60%;
    }

    .quatrevingtquinzepercent {
        width: 95%;
    }

    textarea.centpercent {
        width: 96%;
    }

    .small,
    small {
        font-size: 85%;
    }

    .h1 .small,
    .h1 small,
    .h2 .small,
    .h2 small,
    .h3 .small,
    .h3 small,
    h1 .small,
    h1 small,
    h2 .small,
    h2 small,
    h3 .small,
    h3 small {
        font-size: 65%;
    }

    .h1 .small,
    .h1 small,
    .h2 .small,
    .h2 small,
    .h3 .small,
    .h3 small,
    .h4 .small,
    .h4 small,
    .h5 .small,
    .h5 small,
    .h6 .small,
    .h6 small,
    h1 .small,
    h1 small,
    h2 .small,
    h2 small,
    h3 .small,
    h3 small,
    h4 .small,
    h4 small,
    h5 .small,
    h5 small,
    h6 .small,
    h6 small {
        font-weight: 400;
        line-height: 1;
        color: #777;
    }

    .center {
        text-align: center;
        margin: 0px auto;
    }

    .left {
        text-align: left;
    }

    .right {
        text-align: right;
    }

    .justify {
        text-align: justify;
    }

    .pull-left {
        float: left !important;
    }

    .pull-right {
        float: right !important;
    }

    .nowrap {
        white-space: nowrap;
    }

    .liste_titre .nowrap {
        white-space: nowrap;
    }

    .nowraponall {
        /* no wrap on all devices */
        white-space: nowrap;
    }

    .wrapimp {
        white-space: normal !important;
    }

    .wordwrap {
        word-wrap: break-word;
    }

    .wordbreak {
        word-break: break-all;
    }

    .bold {
        font-weight: bold !important;
    }

    .nobold {
        font-weight: normal !important;
    }

    .nounderline {
        text-decoration: none;
    }

    .paddingleft {
        padding-left: 4px;
    }

    .paddingleft2 {
        padding-left: 2px;
    }

    .paddingright {
        padding-right: 4px;
    }

    .paddingright2 {
        padding-right: 2px;
    }

    .marginleft2 {
        margin-left: 2px;
    }

    .marginright2 {
        margin-right: 2px;
    }

    .cursordefault {
        cursor: default;
    }

    .cursorpointer {
        cursor: pointer;
    }

    .cursormove {
        cursor: move;
    }

    .cursornotallowed {
        cursor: not-allowed;
    }

    .backgroundblank {
        background-color: #fff;
    }

    .nobackground,
    .nobackground tr {
        background: unset !important;
    }

    .checkboxattachfilelabel {
        font-size: 0.85em;
        opacity: 0.7;
    }

    .text-warning {
        color: #f39c12    }

    body[class*="colorblind-"] .text-warning {
        color: #f39c12    }

    .text-success {
        color: #28a745    }

    body[class*="colorblind-"] .text-success {
        color: #37de5d    }

    .text-danger {
        color: #dc3545    }

    .editfielda span.fa-pencil-alt,
    .editfielda span.fa-trash {
        /* color: #cccccc !important; */
    }

    .editfielda span.fa-pencil-alt:hover,
    .editfielda span.fa-trash:hover {
        color: rgb(444) !important;
    }

    .fa-toggle-on,
    .fa-toggle-off {
        font-size: 2em;
    }

    .websiteselectionsection .fa-toggle-on,
    .websiteselectionsection .fa-toggle-off,
    .asetresetmodule .fa-toggle-on,
    .asetresetmodule .fa-toggle-off {
        font-size: 1.5em;
        vertical-align: text-bottom;
    }

    /* Themes for badges */
    /* <style type="text/css" > */
/*
 Badge style is based on boostrap framework
 */

.badge {
    display: inline-block;
    padding: .1em .35em;
    font-size: 80%;
    font-weight: 700 !important;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    border-width: 2px;
    border-style: solid;
    border-color: rgba(255,255,255,0);
    box-sizing: border-box;
}

.badge-status {
    font-size: 1em;
    padding: .19em .35em;			/* more than 0.19 generate a change into heigth of lines */
}
.tabBar .arearef .statusref .badge-status, .tabBar .arearefnobottom .statusref .badge-status {
	font-size: 1.1em;
	padding: .4em .4em;
}
/* Force values for small screen 767 */
@media only screen and (max-width: 767px)
{
	.tabBar .arearef .statusref .badge-status, .tabBar .arearefnobottom .statusref .badge-status {
		font-size: 0.95em;
		padding: .3em .2em;
	}
}

.badge-pill, .tabs .badge {
    padding-right: .5em;
    padding-left: .5em;
    border-radius: 0.25rem;
}

.badge-dot {
    padding: 0;
    border-radius: 50%;
    padding: 0.45em;
    vertical-align: text-top;
}

a.badge:focus, a.badge:hover {
    text-decoration: none;
}

.liste_titre .badge:not(.nochangebackground) {
    background-color: #64dd17;
    color: #fff;
}


/* PRIMARY */
.badge-primary{
    color: #fff !important;
    background-color: #0083A2;
}
a.badge-primary.focus, a.badge-primary:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,131,162,0.5);
}
a.badge-primary:focus, a.badge-primary:hover {
    color: #fff !important;
    background-color: #006a89;
}

/* SECONDARY */
.badge-secondary, .tabs .badge {
    color: #fff !important;
    background-color: #64dd17;
}
a.badge-secondary.focus, a.badge-secondary:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(100,221,23,0.5);
}
a.badge-secondary:focus, a.badge-secondary:hover {
    color: #fff !important;
    background-color: #4bc400;
}

/* SUCCESS */
.badge-success {
    color: #fff !important;
    background-color: #28a745;
}
a.badge-success.focus, a.badge-success:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(40,167,69,0.5);
}
a.badge-success:focus, a.badge-success:hover {
    color: #fff !important;
    background-color: #0f8e2c;
}

/* DANGER */
.badge-danger {
    color: #fff !important;
    background-color:  #9f4705;
}
a.badge-danger.focus, a.badge-danger:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(159,71,5,0.5);
}
a.badge-danger:focus, a.badge-danger:hover {
    color: #fff !important;
    background-color: #862e00;
}

/* WARNING */
/* background-color de la advertencia cambiado por ricardo130 */
.badge-warning {
    color: #ffffff !important;
    /* background-color: #ffc107; */
    background-color: #ED5C65;
}
a.badge-warning.focus, a.badge-warning:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,193,7,0.5);
}
a.badge-warning:focus, a.badge-warning:hover {
    color: #212529 !important;
    background-color: #e6a800;
}

/* WARNING colorblind */
body[class^="colorblind-"] .badge-warning {
	  background-color: #e4e411;
  }
body[class^="colorblind-"] a.badge-warning.focus,body[class^="colorblind-"] a.badge-warning:focus {
	box-shadow: 0 0 0 0.2rem rgba(228,228,17,0.5);
}
body[class^="colorblind-"] a.badge-warning:focus, a.badge-warning:hover {
	background-color: #cbcb00;
}

/* INFO */
.badge-info {
    color: #fff !important;
    background-color: #00a8f3;
}
a.badge-info.focus, a.badge-info:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,168,243,0.5);
}
a.badge-info:focus, a.badge-info:hover {
    color: #fff !important;
    background-color: #008fda;
}

/* LIGHT */
.badge-light {
    color: #212529 !important;
    background-color: #f8f9fa;
}
a.badge-light.focus, a.badge-light:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(248,249,250,0.5);
}
a.badge-light:focus, a.badge-light:hover {
    color: #212529 !important;
    background-color: #dfe0e1;
}

/* DARK */
.badge-dark {
    color: #fff !important;
    background-color: #343a40;
}
a.badge-dark.focus, a.badge-dark:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(52,58,64,0.5);
}
a.badge-dark:focus, a.badge-dark:hover {
    color: #fff !important;
    background-color: #1b2127;
}

@media only screen and (max-width: 570px)
{
	span.badge.badge-status {
		overflow: hidden;
		max-width: 130px;
		text-overflow: ellipsis;
	}
}

/* STATUS BADGES */

/* STATUS0 */
.badge-status0 {
        color: #999999 !important;
        border-color: #cbd3d3 !important;
        background-color: #fff !important;
}
.font-status0 {
        color: #fff !important;
}
.badge-status0.focus, .badge-status0:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
.badge-status0:focus, .badge-status0:hover {
    color: #999999 !important;
        border-color: #b2baba !important;
}

/* STATUS1 */
.badge-status1 {
        color: #ffffff !important;
        background-color: #bc9526 !important;
}
.font-status1 {
        color: #bc9526 !important;
}
.badge-status1.focus, .badge-status1:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(188,149,38,0.5) !important;
}
.badge-status1:focus, .badge-status1:hover {
    color: #ffffff !important;
}

/* COLORBLIND STATUS1 */
body[class*="colorblind-"] .badge-status1 {
        color: #000 !important;
        background-color: #e4e411 !important;
}
body[class*="colorblind-"] .font-status1 {
        color: #e4e411 !important;
}
body[class*="colorblind-"] .badge-status1.focus, body[class*="colorblind-"] .badge-status1:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(228,228,17,0.5) !important;
}
body[class*="colorblind-"] .badge-status1:focus, body[class*="colorblind-"] .badge-status1:hover {
    color: #000 !important;
}

/* STATUS2 */
.badge-status2 {
        color: #212529 !important;
        background-color: #e6f0f0 !important;
}
.font-status2 {
        color: #e6f0f0 !important;
}
.badge-status2.focus, .badge-status2:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(230,240,240,0.5) !important;
}
.badge-status2:focus, .badge-status2:hover {
    color: #212529 !important;
}

/* STATUS3 */
.badge-status3 {
        color: #212529 !important;
        border-color: #bca52b !important;
        background-color: #fff !important;
}
.font-status3 {
        color: #fff !important;
}
.badge-status3.focus, .badge-status3:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
.badge-status3:focus, .badge-status3:hover {
    color: #212529 !important;
        border-color: #a38c12 !important;
}

/* STATUS4 */
.badge-status4 {
        color: #ffffff !important;
        background-color: #64dd17 !important;
}
.font-status4 {
        color: #64dd17 !important;
}
.badge-status4.focus, .badge-status4:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(100,221,23,0.5) !important;
}
.badge-status4:focus, .badge-status4:hover {
    color: #ffffff !important;
}

/* COLORBLIND STATUS4 */
body[class*="colorblind-"] .badge-status4 {
        color: #000 !important;
        background-color: #37de5d !important;
}
body[class*="colorblind-"] .font-status4 {
        color: #37de5d !important;
}
body[class*="colorblind-"] .badge-status4.focus, body[class*="colorblind-"] .badge-status4:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(55,222,93,0.5) !important;
}
body[class*="colorblind-"] .badge-status4:focus, body[class*="colorblind-"] .badge-status4:hover {
    color: #000 !important;
}

/* STATUS5 */
.badge-status5 {
        color: #999999 !important;
        border-color: #cad2d2 !important;
        background-color: #fff !important;
}
.font-status5 {
        color: #fff !important;
}
.badge-status5.focus, .badge-status5:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
.badge-status5:focus, .badge-status5:hover {
    color: #999999 !important;
        border-color: #b1b9b9 !important;
}

/* STATUS6 */
.badge-status6 {
        color: #777777 !important;
        background-color: #cad2d2 !important;
}
.font-status6 {
        color: #cad2d2 !important;
}
.badge-status6.focus, .badge-status6:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(202,210,210,0.5) !important;
}
.badge-status6:focus, .badge-status6:hover {
    color: #777777 !important;
}

/* STATUS7 */
.badge-status7 {
        color: #212529 !important;
        border-color: #baa32b !important;
        background-color: #fff !important;
}
.font-status7 {
        color: #fff !important;
}
.badge-status7.focus, .badge-status7:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
.badge-status7:focus, .badge-status7:hover {
    color: #212529 !important;
        border-color: #a18a12 !important;
}

/* COLORBLIND STATUS7 */
body[class*="colorblind-"] .badge-status7 {
        color: #212529 !important;
        border-color: #37de5d !important;
        background-color: #fff !important;
}
body[class*="colorblind-"] .font-status7 {
        color: #fff !important;
}
body[class*="colorblind-"] .badge-status7.focus, body[class*="colorblind-"] .badge-status7:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
body[class*="colorblind-"] .badge-status7:focus, body[class*="colorblind-"] .badge-status7:hover {
    color: #212529 !important;
        border-color: #1ec544 !important;
}

/* STATUS8 */
.badge-status8 {
        color: #ffffff !important;
        background-color: #be3013 !important;
}
.font-status8 {
        color: #be3013 !important;
}
.badge-status8.focus, .badge-status8:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(190,48,19,0.5) !important;
}
.badge-status8:focus, .badge-status8:hover {
    color: #ffffff !important;
}

/* STATUS9 */
.badge-status9 {
        color: #999999 !important;
        background-color: #e7f0f0 !important;
}
.font-status9 {
        color: #e7f0f0 !important;
}
.badge-status9.focus, .badge-status9:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(231,240,240,0.5) !important;
}
.badge-status9:focus, .badge-status9:hover {
    color: #999999 !important;
}

/* STATUS10 */
.badge-status10 {
        color: #212529 !important;
        border-color: #993013 !important;
        background-color: #fff !important;
}
.font-status10 {
        color: #fff !important;
}
.badge-status10.focus, .badge-status10:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
.badge-status10:focus, .badge-status10:hover {
    color: #212529 !important;
        border-color: #801700 !important;
}

/* STATUS1B */
.badge-status1b {
        color: #212529 !important;
        border-color: #bc9526 !important;
        background-color: #fff !important;
}
.font-status1b {
        color: #fff !important;
}
.badge-status1b.focus, .badge-status1b:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
.badge-status1b:focus, .badge-status1b:hover {
    color: #212529 !important;
        border-color: #a37c0d !important;
}

/* STATUS4B */
.badge-status4b {
        color: #212529 !important;
        border-color: #64dd17 !important;
        background-color: #fff !important;
}
.font-status4b {
        color: #fff !important;
}
.badge-status4b.focus, .badge-status4b:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.5) !important;
}
.badge-status4b:focus, .badge-status4b:hover {
    color: #212529 !important;
        border-color: #4bc400 !important;
}
    /**
* Links
*/

    a {
        color: #444444;
        /* @new */
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        font-weight: normal;
        text-decoration: none;
    }

    a:hover {
        cursor: pointer;
    }

    a:hover,
    a:focus {
        color: #0072CE;
        text-decoration: underline;
    }

    a.commonlink {
        /* color: #444444 !important; */
        color: #ffffff !important;
        text-decoration: none;
    }

    hr {
        border: 1px dashed #777;
        height: 0;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    /**
* Hide/display
*/

    div.visible,
    tr.visible {
        display: block;
    }

    div.hidden,
    td.hidden {
        display: none;
    }

    .opacityhigh {
        opacity: 0.85;
    }

    .optiongrey,
    .opacitymedium {
        opacity: 0.7;
    }

    .opacitytransp {
        opacity: 0;
    }

    select:invalid {
        color: gray;
    }

    input:disabled,
    textarea:disabled,
    select[disabled='disabled'] {
        background: #eee;
    }

    input.liste_titre {
        box-shadow: none !important;
    }

    input.removedfile {
        padding: 0px !important;
        border: 0px !important;
        vertical-align: text-bottom;
    }

    input[type=file] {
        background-color: transparent;
        border-top: none;
        border-left: none;
        border-right: none;
        box-shadow: none;
    }

    input[type=checkbox] {
        background-color: transparent;
        border: none;
        box-shadow: none;
    }

    input[type=radio] {
        background-color: transparent;
        border: none;
        box-shadow: none;
    }

    input[type=image] {
        background-color: transparent;
        border: none;
        box-shadow: none;
    }

    input:-webkit-autofill {
        background-color: #FDFFF0 !important;
        background-image: none !important;
        -webkit-box-shadow: 0 0 0 50px #FDFFF0 inset;
    }

    ::-webkit-input-placeholder {
        color: #ccc;
    }

    input:-moz-placeholder {
        color: #ccc;
    }

    input[name=price],
    input[name=weight],
    input[name=volume],
    input[name=surface],
    input[name=sizeheight],
    input[name=net_measure],
    select[name=incoterm_id] {
        margin-right: 6px;
    }

    fieldset {
        border: 1px solid #AAAAAA !important;
    }

    .legendforfieldsetstep {
        padding-bottom: 10px;
    }

    input#onlinepaymenturl,
    input#directdownloadlink {
        opacity: 0.7;
    }

    div#moretabsList,
    div#moretabsListaction {
        z-index: 5;
    }

    hr {
        border: 0;
        border-top: 1px solid #ccc;
    }

    .tabBar hr {
        margin-top: 20px;
        margin-bottom: 17px;
    }

    .button,
    .buttonDelete,
    input[name="sbmtConnexion"] {
        margin-bottom: 0;
        margin-top: 0;
        margin-left: 5px;
        margin-right: 5px;
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        display: inline-block;
        padding: 4px 14px;
        text-align: center;
        cursor: pointer;
        text-decoration: none !important;
        background-color: #f5f5f5;
        /*
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    */

        background-repeat: repeat-x;
        border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25) -webkit-border-radius: 2px;
        border-radius: 1px;

        font-weight: bold;
        /* text-transform: capitalize; */
        color: #444;
    }

    .button:focus,
    .buttonDelete:focus {
        -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 60, 0.2), 0px 0px 0px rgba(60, 60, 60, 0.1);
        box-shadow: 0px 0px 5px 1px rgba(0, 0, 60, 0.2), 0px 0px 0px rgba(60, 60, 60, 0.1);
    }

    .button:hover,
    .buttonDelete:hover {
        /* warning: having a larger shadow has side effect when button is completely on left of a table */
        -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.2), 0px 0px 0px rgba(60, 60, 60, 0.1);
        box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.2), 0px 0px 0px rgba(60, 60, 60, 0.1);
    }

    .button:disabled,
    .buttonDelete:disabled,
    .button.disabled {
        opacity: 0.4;
        box-shadow: none;
        -webkit-box-shadow: none;
        cursor: auto;
    }

    .buttonRefused {
        pointer-events: none;
        cursor: default;
        opacity: 0.4;
        box-shadow: none;
        -webkit-box-shadow: none;
    }

    .button_search,
    .button_removefilter {
        border: unset;
        background-color: unset;
        line-height: 2;
    }

    .button_search:hover,
    .button_removefilter:hover {
        cursor: pointer;
    }

    td button.liste_titre span {
        color: #fff;
    }

    /* ============================================================================== */
    /*	Module website 																  */
    /* ============================================================================== */

    .websitebar {
        border-bottom: 1px solid #888;
        background: #eee;
    }

    .websitebar .button,
    .websitebar .buttonDelete {
        padding: 2px 5px 3px 5px !important;
        margin: 2px 4px 2px 4px !important;
        line-height: normal;
    }

    .websiteselection {
        display: inline-block;
        padding-left: 10px;
        vertical-align: middle;
        line-height: 29px;
    }

    .websitetools {
        float: right;
        padding-top: 2px;
    }

    .websiteiframenoborder {
        border: 0px;
    }

    /**
* RTL direction
*/

    td[align="left"] {
        text-align: left;
    }

    td[align="right"] {
        text-align: right;
    }

    /**
* Dragging lines
*/

    .dragClass {
        color: #002255;
    }

    td.showDragHandle {
        cursor: move;
    }

    .tdlineupdown {
        white-space: nowrap;
    }


    /**
* Images Styles
*/

    img {
        border: 0;
        vertical-align: middle;
    }

    img[src*=pdf] {
        vertical-align: sub !important;
    }

    img[src*=globe] {
        vertical-align: sub !important;
    }

    img[src*=star] {
        vertical-align: baseline;
    }

    input[type=image] {
        vertical-align: middle;
    }

    img[src*=stcomm] {
        vertical-align: text-top;
    }


    /**
* Graphs Styles
*/

    .dolgraphtitlecssboxes+div,
    #stats {
        margin: 0 auto;
    }

    .pieLabelBackground {
        background-color: #333 !important;
        color: #f7f7f7;
        opacity: 1;
    }

    .jPicker .Icon {
        margin-left: .5em;
    }

    /**
* Form Elements
*/

    input:focus,
    textarea:focus,
    button:focus,
    select:focus {
        box-shadow: 0 0 2px #8091bf;
    }

    textarea,
    input[type=text],
    input[type=password],
    input[type=email],
    input[type=number],
    input[type=search],
    input[type=tel],
    input[type=url],
    .titlewrap input,
    select {
        border-color: rgba(0, 0, 0, .24);
        box-shadow: inset 0 1px 2px rgba(0, 0, 0, .07);
        padding: 1px;
    }

    input,
    input.flat,
    textarea,
    textarea.flat,
    form.flat select,
    select,
    select.flat,
    .dataTables_length label select {
        background-color: #FDFDFD;
        color: #444;
    }

    textarea:focus,
    button:focus {
        /* v6 box-shadow: 0 0 4px #8091BF; */
        border: 1px solid #aaa !important;
    }

    input:focus,
    textarea:focus,
    button:focus,
    select:focus {
        border-bottom: 1px solid #666;
    }

    input.select2-input {
        border-bottom: none ! important;
    }

    .select2-choice {
        border: none;
        border-bottom: solid 1px rgba(0, 0, 0, .2) !important;
        /* required to avoid to lose bottom line when focus is lost on select2. */
    }

    textarea.cke_source:focus {
        box-shadow: none;
    }

    .liste_titre input[name=month_date_when],
    .liste_titre input[name=monthvalid],
    .liste_titre input[name=search_ordermonth],
    .liste_titre input[name=search_deliverymonth],
    .liste_titre input[name=search_smonth],
    .liste_titre input[name=search_month],
    .liste_titre input[name=search_emonth],
    .liste_titre input[name=smonth],
    .liste_titre input[name=month],
    .liste_titre input[name=month_lim],
    .liste_titre input[name=month_start],
    .liste_titre input[name=month_end],
    .liste_titre input[name=month_create],
    .liste_titre input[name=search_month_lim],
    .liste_titre input[name=search_month_start],
    .liste_titre input[name=search_month_end],
    .liste_titre input[name=search_month_create],
    .liste_titre input[name=search_month_create],
    .liste_titre input[name=search_month_start],
    .liste_titre input[name=search_month_end],
    .liste_titre input[name=day_date_when],
    .liste_titre input[name=dayvalid],
    .liste_titre input[name=search_orderday],
    .liste_titre input[name=search_deliveryday],
    .liste_titre input[name=search_sday],
    .liste_titre input[name=search_day],
    .liste_titre input[name=search_eday],
    .liste_titre input[name=sday],
    .liste_titre input[name=day],
    .liste_titre select[name=day],
    .liste_titre input[name=day_lim],
    .liste_titre input[name=day_start],
    .liste_titre input[name=day_end],
    .liste_titre input[name=day_create],
    .liste_titre input[name=search_day_lim],
    .liste_titre input[name=search_day_start],
    .liste_titre input[name=search_day_end],
    .liste_titre input[name=search_day_create],
    .liste_titre input[name=search_day_create],
    .liste_titre input[name=search_day_start],
    .liste_titre input[name=search_day_end],
    .liste_titre input[name=search_day_date_when],
    .liste_titre input[name=search_month_date_when],
    .liste_titre input[name=search_year_date_when],
    .liste_titre input[name=search_dtstartday],
    .liste_titre input[name=search_dtendday],
    .liste_titre input[name=search_dtstartmonth],
    .liste_titre input[name=search_dtendmonth],
    select#date_startday,
    select#date_startmonth,
    select#date_endday,
    select#date_endmonth,
    select#reday,
    select#remonth {
        margin-right: 4px;
    }

    input,
    input.flat,
    textarea,
    textarea.flat,
    form.flat select,
    select,
    select.flat,
    .dataTables_length label select {
        font-size: 14px;
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        border: none;
        border-bottom: solid 1px rgba(0, 0, 0, .1);
        outline: none;
        margin: 0px 0px 0px 0px;
    }

    .liste_titre .flat,
    .liste_titre select.flat {
        margin: 2px;
        padding: 2px 4px;
    }

    input,
    textarea,
    select {
        border-color: rgba(0, 0, 0, .24);
        box-shadow: inset 0 1px 2px rgba(0, 0, 0, .07);
        margin: 3px 10px 3px 0;
    }

        /* end if (empty($dol_use_jmobile)) */

    select.flat,
    form.flat select {
        font-weight: normal;
        font-size: unset;
        height: 2em;
    }

    input:disabled,
    select:disabled {
        background-color: #ddd;
        cursor: not-allowed;
    }

    input.liste_titre {
        box-shadow: none !important;
    }

    .listactionlargetitle .liste_titre {
        line-height: 24px;
    }

    input.removedfile {
        border: 0 !important;
        padding: 0 !important;
    }

    input.buttongen {
        vertical-align: middle;
    }

    input.buttonpayment {
        min-width: 320px;
        margin-bottom: 15px;
        background-image: none;
        line-height: 24px;
        padding: 8px;
        background: none;
        padding-left: 30px;
        text-align: left;
        border: 2px solid #666666;
        white-space: normal;
    }

    input.buttonpaymentcb {
        background-image: url(/htdocs/theme/common/credit_card.png);
        background-size: 26px;
        background-repeat: no-repeat;
        background-position: 5px 5px;
    }

    input.buttonpaymentcheque {
        background-image: url(/htdocs/theme/common/cheque.png);
        background-repeat: no-repeat;
        background-position: 8px 7px;
    }

    input.buttonpaymentcb {
        background-image: url(/htdocs/theme/common/credit_card.png);
        background-size: 24px;
        background-repeat: no-repeat;
        background-position: 5px 4px;
    }

    input.buttonpaymentcheque {
        background-image: url(/htdocs/paypal/img/object_paypal.png);
        background-repeat: no-repeat;
        background-position: 5px 4px;
    }

    input.buttonpaymentpaypal {
        background-image: url(/htdocs/paypal/img/object_paypal.png);
        background-repeat: no-repeat;
        background-position: 8px 7px;
    }

    input.buttonpaymentpaybox {
        background-image: url(/htdocs/paybox/img/object_paybox.png);
        background-repeat: no-repeat;
        background-position: 8px 7px;
    }

    input.buttonpaymentstripe {
        background-image: url(/htdocs/stripe/img/object_stripe.png);
        background-repeat: no-repeat;
        background-position: 8px 7px;
    }

    /* Used for timesheets */
    span.timesheetalreadyrecorded input {
        border: none;
        border-bottom: solid 1px rgba(0, 0, 0, 0.1);
        margin-right: 1px !important;
    }

    td.onholidaymorning,
    td.onholidayafternoon {
        background-color: #fdf6f2;
    }

    td.onholidayallday {
        background-color: #f4eede;
    }

    td.actionbuttons a {
        padding-left: 6px;
    }

    td.leftborder,
    td.hide0 {
        border-left: 1px solid #ccc;
    }

    td.leftborder,
    td.hide6 {
        border-right: 1px solid #ccc;
    }

    td.rightborder {
        border-right: 1px solid #ccc;
    }

    td.actionbuttons a {
        padding-left: 6px;
    }

    select.flat,
    form.flat select {
        font-weight: normal;
        font-size: unset;
    }

    .optionblue {
        color: rgb(40,40,40);
    }

    .select2-results .select2-highlighted.optionblue {
        color: #FFF !important;
    }

    select:invalid {
        color: gray;
    }

    input:disabled {
        background: #ddd;
    }

    input.liste_titre {
        box-shadow: none !important;
    }

    input.removedfile {
        padding: 0px !important;
        border: 0px !important;
        vertical-align: text-bottom;
    }

    textarea:disabled {
        background: #ddd;
    }

    input[type=file] {
        background-color: transparent;
        border-top: none;
        border-left: none;
        border-right: none;
        box-shadow: none;
    }

    input[type=checkbox] {
        background-color: transparent;
        border: none;
        box-shadow: none;
    }

    input[type=radio] {
        background-color: transparent;
        border: none;
        box-shadow: none;
    }

    input[type=image] {
        background-color: transparent;
        border: none;
        box-shadow: none;
    }

    input:-webkit-autofill {
        background-color: #FDFFF0 !important;
        background-image: none !important;
        -webkit-box-shadow: 0 0 0 50px #FDFFF0 inset;
    }

    ::-webkit-input-placeholder {
        color: #ccc;
    }

    input:-moz-placeholder {
        color: #ccc;
    }

    input[name=price],
    input[name=weight],
    input[name=volume],
    input[name=surface],
    input[name=sizeheight],
    select[name=incoterm_id] {
        margin-right: 6px;
    }

    input[name=surface] {
        margin-right: 4px;
    }

    fieldset {
        border: 1px solid #AAAAAA !important;
    }

    .legendforfieldsetstep {
        padding-bottom: 10px;
    }

    input#onlinepaymenturl,
    input#directdownloadlink {
        opacity: 0.7;
    }

        /**
* Buttons
*/

    .button,
    .button:link,
    .button:active,
    .button:visited {
        background-color: #0072CE;
        /* border: 1px solid #c0c0c0; */
        border-color: #0072CE;
        /* box-shadow: inset 0 1px 0 rgba(235,235,235, .6);
    -webkit-box-shadow: inset 0 1px 0 rgba(235,235,235, .6); */
        -webkit-border-radius: 0.30em;
        -moz-border-radius: 0.30em;
        border-radius: 0.30em;
        color: #fff;
        cursor: pointer;
        font-size: 14px;
        /* margin: .2em .5em; */
        margin: 2px 1px;
        padding: .5em 1em;
        transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -webkit-transition: all .3s ease-in-out;
    }

    .button:hover,
    .button:focus {
        background-color: #0062B3;
        border-color: #0062B3;
        box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
        -webkit-box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
        color: #fff;
    }

    .button:disabled {
        background-color: #ddd;
        cursor: not-allowed;
    }

    table[summary] .button[name=viewcal] {
        width: inherit !important;
        min-width: 120px;
    }

    .liste_titre input[type=submit] {
        background-color: #444;
        border-color: #555;
        box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
        -webkit-box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
        color: #fff;
        padding: .4em .8em;
    }

    .liste_titre input[type=submit]:hover {
        background-color: #333;
        border-color: #444;
    }

    div.noborder .button {
        padding: .4em .8em;
    }

    #blockvmenusearch .button {
        background-color: #444;
        border: 1px solid #c0c0c0;
        border-color: #555;
        box-shadow: inset 0 1px 0 rgba(150, 172, 180, .6);
        -webkit-box-shadow: inset 0 1px 0 rgba(150, 172, 180, .6);
        color: #fff;
        font-size: inherit;
        margin: 0em .5em;
        padding: 7px 8px;
    }

    #blockvmenusearch .button:hover {
        background-color: #333;
        border-color: #444;
        box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
        -webkit-box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
        color: #fff;
    }

    .buttonajax {
        background-image: url();
        background-position: bottom;
        border: 0;
        border-radius: 0 5px 0 5px;
        -moz-border-radius: 0 5px 0 5px;
        -webkit-border-radius: 0 5px 0 5px;
        box-shadow: 4px 4px 4px rgba(0, 0, 0, .24);
        -moz-box-shadow: 4px 4px 4px rgba(0, 0, 0, .24);
        -webkit-box-shadow: 4px 4px 4px rgba(0, 0, 0, .24);
        margin: 0em .5em;
        padding: .1em .7em;
    }

    form {
        padding: 0;
        margin: 0;
    }

    th .button {
        border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        -webkit-border-radius: 0 !important;
        box-shadow: none !important;
        -moz-box-shadow: none !important;
        -webkit-box-shadow: none !important;
    }

    /**
* Action Buttons
*/

    div.divButAction {
        margin-bottom: 1.5em;
    }

    a.butActionNew>span.fa-plus-circle {
        padding-left: 6px;
        font-size: 1.5em;
    }

    a.butActionNewRefused>span.fa-plus-circle {
        padding-left: 6px;
        font-size: 1.5em;
    }

    .butAction,
    .butActionDelete,
    .butActionRefused,
    .butActionNewRefused {
        background-color: #FFFFFF;
        color: #444444;
        font-weight: 500;
        margin: 0 .5em;
        padding: .3em .7em;
        white-space: nowrap;
        transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -webkit-transition: all .3s ease-in-out;
    }

    .butAction:hover,
    .butActionNew:hover,
    .butActionDelete:hover,
    .butActionRefused:hover {
        color: #f7f7f7;
        text-decoration: none;
    }

    .butAction {
        -webkit-box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
        box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
    }

    .butAction:hover,
    .butAction:active {
        background-color: #0072CE;
        -webkit-box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
        box-shadow: inset 0 1px 0 rgba(235, 235, 235, .6);
    }

    .butActionDelete {
        border: 1px solid #f07b6e;
        -webkit-box-shadow: inset 0 1px 0 rgba(210, 170, 170, .6);
        box-shadow: inset 0 1px 0 rgba(210, 170, 170, .6);
    }

    .butActionDelete:hover,
    .butActionDelete:active {
        background-color: #f07b6e;
        -webkit-box-shadow: inset 0 1px 0 rgba(210, 170, 170, .6);
        box-shadow: inset 0 1px 0 rgba(210, 170, 170, .6);
    }

    .butActionRefused {
        font-weight: normal !important;
        background-color: #ddd;
        border: 1px solid rgba(0, 0, 0, .12);
        -webkit-box-shadow: inset 0 1px 0 rgba(170, 170, 170, .6);
        box-shadow: inset 0 1px 0 rgba(170, 170, 170, .6);
        color: #444444;
        opacity: .6;
    }

    .butActionRefused:hover,
    .butActionRefused:active {
        background-color: #666;
        cursor: not-allowed;
    }

    span.butAction,
    span.butActionDelete {
        cursor: pointer;
    }


    /**
* State Ok, Warning, Error
*/

    .ok {
        color: #114466;
    }

    .warning {
        color: #f07b6e !important
    }

    .error {
        color: #7e1515 !important;
        font-weight: bold;
    }

    .bloc_success {
        background-color: #33cc66;
        color: #fff;
        display: inline-block;
        margin-bottom: .5em;
        padding: 1em;
    }

    .bloc_warning {
        background-color: #f07b6e;
        color: #fff;
        display: inline-block;
        margin-bottom: .5em;
        padding: 1em;
    }

    div.ok {
        color: #114466;
    }

    /* Warning message */
    div.warning {
        border-left: solid 5px #d8c59a;
        padding-top: 8px;
        padding-left: 10px;
        padding-right: 4px;
        padding-bottom: 8px;
        margin: 0.5em 0em 0.5em 0em;
        background: rgb(255, 218, 135);
    }

    /* Error message */
    div.error {
        border-left: solid 5px #e0796e;
        padding-top: 8px;
        padding-left: 10px;
        padding-right: 4px;
        padding-bottom: 8px;
        margin: 0.5em 0em 0.5em 0em;
        background: #f07b6e;
    }

    /* Info admin */
    div.info {
        border-left: solid 5px #87cfd2;
        padding-top: 8px;
        padding-left: 10px;
        padding-right: 4px;
        padding-bottom: 8px;
        margin: 0.5em 0em 0.5em 0em;
        background: #eff8fc;
    }

    /* Warning message */
    div.warning {
        border-left: solid 5px #f2cf87;
        padding-top: 8px;
        padding-left: 10px;
        padding-right: 4px;
        padding-bottom: 8px;
        margin: 0.5em 0em 0.5em 0em;
        background: #fcf8e3;
    }

    div.warning a,
    div.info a,
    div.error a {
        color: rgb(40,40,40);
    }

    /* Error message */
    div.error {
        border-left: solid 5px #f28787;
        padding-top: 8px;
        padding-left: 10px;
        padding-right: 4px;
        padding-bottom: 8px;
        margin: 0.5em 0em 0.5em 0em;
        background: #EFCFCF;
    }


    /*
 *   Liens Payes/Non payes
 */

    a.normal:link {
        font-weight: normal
    }

    a.normal:visited {
        font-weight: normal
    }

    a.normal:active {
        font-weight: normal
    }

    a.normal:hover {
        font-weight: normal
    }

    a.impayee:link {
        font-weight: bold;
        color: #550000;
    }

    a.impayee:visited {
        font-weight: bold;
        color: #550000;
    }

    a.impayee:active {
        font-weight: bold;
        color: #550000;
    }

    a.impayee:hover {
        font-weight: bold;
        color: #550000;
    }


    /*
*  External web site
*/

    .framecontent {
        width: 100%;
        height: 100%;
    }

    .framecontent iframe {
        width: 100%;
        height: 100%;
    }

    /*
*  Other
*/
    .movable {
        cursor: move;
    }

    .borderrightlight {
        border-right: 1px solid #DDD;
    }

    #formuserfile {
        margin-top: 4px;
    }

    #formuserfile_link {
        margin-left: 1px;
    }

    .listofinvoicetype {
        height: 28px;
        vertical-align: middle;
    }

    .divsocialnetwork:not(:first-child) {
        padding-left: 20px;
    }

    div.divsearchfield {
        float: left;
        margin-right: 12px;
        margin-left: 2px;
        margin-top: 4px;
        margin-bottom: 4px;
        padding-left: 2px;
    }

    .divsearchfieldfilter {
        text-overflow: clip;
        overflow: auto;
        padding-bottom: 5px;
        opacity: 0.6;
    }

    div.confirmmessage {
        padding-top: 6px;
    }

    ul.attendees {
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 0;
        margin-top: 0;
        margin-bottom: 0;
    }

    ul.attendees li {
        list-style-type: none;
        padding-top: 1px;
        padding-bottom: 1px;
    }

    .googlerefreshcal {
        padding-top: 4px;
        padding-bottom: 4px;
    }

    .paddingtopbottom {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .checkallactions {
        margin-top: 2px;
        /* left must be same than right to keep checkbox centered */
        margin-left: 2px;
        /* left must be same than right to keep checkbox centered */
        vertical-align: middle;
    }

    select.flat.selectlimit {
        max-width: 62px;
    }

    .selectlimit,
    .marginrightonly {
        margin-right: 10px !important;
    }

    .marginleftonly {
        margin-left: 10px !important;
    }

    .marginleftonlyshort {
        margin-left: 4px !important;
    }

    .nomarginleft {
        margin-left: 0px !important;
    }

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

    .marginbottomonly {
        margin-bottom: 10px !important;
    }

    .selectlimit,
    .selectlimit:focus {
        border-left: none !important;
        border-top: none !important;
        border-right: none !important;
        outline: none;
    }

    .strikefordisabled {
        text-decoration: line-through;
    }

    .widthdate {
        width: 130px;
    }

    /* using a tdoverflowxxx make the min-width not working */
    .tdoverflow {
        max-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tdoverflowmax50 {
        /* For tdoverflow, the max-midth become a minimum ! */
        max-width: 50px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tdoverflowmax100 {
        max-width: 100px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tdoverflowmax150 {
        /* For tdoverflow, the max-midth become a minimum ! */
        max-width: 150px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tdoverflowmax200 {
        /* For tdoverflow, the max-midth become a minimum ! */
        max-width: 200px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tdoverflowmax300 {
        max-width: 300px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tdoverflowauto {
        max-width: 0;
        overflow: auto;
    }

    .divintdwithtwolinesmax {
        width: 75px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .twolinesmax {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .tablelistofcalendars {
        margin-top: 25px !important;
    }

    .amountalreadypaid {}

    .amountpaymentcomplete {
        color: #008800;
        font-weight: bold;
        font-size: 1.2em;
    }

    .amountremaintopay {
        color: #880000;
        font-weight: bold;
        font-size: 1.2em;
    }

    .amountremaintopayback {
        font-weight: bold;
        font-size: 1.2em;
    }

    .amountpaymentneutral {
        font-weight: bold;
        font-size: 1.2em;
    }

    .savingdocmask {
        margin-top: 6px;
        margin-bottom: 12px;
    }

    #builddoc_form~.showlinkedobjectblock {
        margin-top: 20px;
    }

    /* For the long description of module */
    .moduledesclong p img,
    .moduledesclong p a img {
        max-width: 90% !important;
        height: auto !important;
    }

    .imgdoc {
        margin: 18px;
        border: 1px solid #ccc;
        box-shadow: 1px 1px 25px #aaa;
        max-width: calc(100% - 56px);
    }

    .fa-file-text-o,
    .fa-file-code-o,
    .fa-file-powerpoint-o,
    .fa-file-excel-o,
    .fa-file-word-o,
    .fa-file-o,
    .fa-file-image-o,
    .fa-file-video-o,
    .fa-file-audio-o,
    .fa-file-archive-o,
    .fa-file-pdf-o {
        color: #0072CE;
    }

    .fa-trash,
    .fa-crop,
    .fa-pencil {
        font-size: 1.4em;
    }

    /* DOL_XXX for future usage (when left menu has been removed). If we do not use datatable */
    /*.table-responsive {
width: calc(100% - 330px);
margin-bottom: 15px;
overflow-y: hidden;
-ms-overflow-style: -ms-autohiding-scrollbar;
}*/

    /* Style used for most tables */
    .div-table-responsive,
    .div-table-responsive-no-min {
        overflow-x: auto;
        min-height: 0.01%;
    }

    .div-table-responsive {
        line-height: 120%;
    }

    /* Style used for full page tables with field selector and no content after table (priority before previous for such tables) */
    div.fiche>form>div.div-table-responsive,
    div.fiche>form>div.div-table-responsive-no-min {
        overflow-x: auto;
    }

    div.fiche>form>div.div-table-responsive {
        min-height: 392px;
    }

    div.fiche>div.tabBar>form>div.div-table-responsive {
        min-height: 392px;
    }

    div.fiche {
        /* text-align: justify; */
    }

    .flexcontainer {
        flex-flow: row wrap;
        justify-content: flex-start;
    }

    .sensiblehtmlcontent * {
        position: static !important;
    }

    .thumbstat {
        flex: 1 1 116px;
    }

    .thumbstat150 {
        flex: 1 1 150px;
    }

    .thumbstat,
    .thumbstat150 {
        flex-grow: 1;
        flex-shrink: 1;
        /* flex-basis: 140px; */
        min-width: 150px;
        justify-content: flex-start;
        align-self: flex-start;
    }

    select.selectarrowonleft {
        direction: rtl;
    }

    select.selectarrowonleft option {
        direction: ltr;
    }

    /* ============================================================================== */
    /* Styles to hide objects														  */
    /* ============================================================================== */

    .clearboth {
        clear: both;
    }

    .hideobject {
        display: none;
    }

    .minwidth50 {
        min-width: 50px;
    }

    /* rule for not too small screen only */
    @media only screen and (min-width: 7px) {
        .width25 {
            width: 25px;
        }

        .width50 {
            width: 50px;
        }

        .width75 {
            width: 75px;
        }

        .width100 {
            width: 100px;
        }

        .width200 {
            width: 200px;
        }

        .minwidth100 {
            min-width: 100px;
        }

        .minwidth200 {
            min-width: 200px;
        }

        .minwidth300 {
            min-width: 300px;
        }

        .minwidth400 {
            min-width: 400px;
        }

        .minwidth500 {
            min-width: 500px;
        }

        .minwidth50imp {
            min-width: 50px !important;
        }

        .minwidth75imp {
            min-width: 75px !important;
        }

        .minwidth100imp {
            min-width: 100px !important;
        }

        .minwidth200imp {
            min-width: 200px !important;
        }

        .minwidth300imp {
            min-width: 300px !important;
        }

        .minwidth400imp {
            min-width: 400px !important;
        }

        .minwidth500imp {
            min-width: 500px !important;
        }
    }

    .widthauto {
        width: auto;
    }

    .width25 {
        width: 25px;
    }

    .width50 {
        width: 50px;
    }

    .width75 {
        width: 75px;
    }

    .width100 {
        width: 100px;
    }

    .width150 {
        width: 150px;
    }

    .width200 {
        width: 200px;
    }

    .maxwidth25 {
        max-width: 25px;
    }

    .maxwidth50 {
        max-width: 50px;
    }

    .maxwidth75 {
        max-width: 75px;
    }

    .maxwidth100 {
        max-width: 100px;
    }

    .maxwidth125 {
        max-width: 125px;
    }

    .maxwidth150 {
        max-width: 150px;
    }

    .maxwidth200 {
        max-width: 200px;
    }

    .maxwidth300 {
        max-width: 300px;
    }

    .maxwidth400 {
        max-width: 400px;
    }

    .maxwidth500 {
        max-width: 500px;
    }

    .maxwidth50imp {
        max-width: 50px !important;
    }

    .maxwidth75imp {
        max-width: 75px !important;
    }

    .minheight20 {
        min-height: 20px;
    }

    .minheight40 {
        min-height: 40px;
    }

    .titlefieldcreate {
        width: 20%;
    }

    .titlefield {
        width: 25%;
    }

    .titlefieldmiddle {
        width: 50%;
    }

    .imgmaxwidth180 {
        max-width: 180px;
    }

    .imgmaxheight50 {
        max-height: 50px;
    }

    .maxheight150 {
        max-height: 150px;
    }

    .width20p {
        width: 20%;
    }

    .width25p {
        width: 25%;
    }

    .width40p {
        width: 40%;
    }

    .width50p {
        width: 50%;
    }

    .width60p {
        width: 60%;
    }

    .width75p {
        width: 75%;
    }

    .width80p {
        width: 80%;
    }

    .width100p {
        width: 100%;
    }

    /* Force values for small screen 1400 */
    @media only screen and (max-width: 1400px) {
        .titlefield {
            width: 30% !important;
        }

        .titlefieldcreate {
            width: 30% !important;
        }

        .minwidth50imp {
            min-width: 50px !important;
        }

        .minwidth75imp {
            min-width: 75px !important;
        }

        .minwidth100imp {
            min-width: 100px !important;
        }

        .minwidth200imp {
            min-width: 200px !important;
        }

        .minwidth300imp {
            min-width: 300px !important;
        }

        .minwidth400imp {
            min-width: 300px !important;
        }

        .minwidth500imp {
            min-width: 300px !important;
        }
    }

    /* Force values for small screen 1000 */
    @media only screen and (max-width: 1000px) {
        .maxwidthonsmartphone {
            max-width: 100px;
        }

        .minwidth50imp {
            min-width: 50px !important;
        }

        .minwidth75imp {
            min-width: 70px !important;
        }

        .minwidth100imp {
            min-width: 80px !important;
        }

        .minwidth150imp {
            min-width: 100px !important;
        }

        .minwidth200imp {
            min-width: 110px !important;
        }

        .minwidth300imp {
            min-width: 120px !important;
        }

        .minwidth400imp {
            min-width: 150px !important;
        }

        .minwidth500imp {
            min-width: 250px !important;
        }
    }

    /* Force values for small screen 767 */
    @media only screen and (max-width: 767px) {
        body {
            font-size: 17px;
        }

        div.refidno {
            font-size: 17px !important;
        }
    }

    /* Force values for small screen 570 */
    @media only screen and (max-width: 570px) {
        body {
            font-size: 17px;
        }

        div.refidno {
            font-size: 17px !important;
        }

        .divmainbodylarge {
            margin-left: 20px !important;
            margin-right: 20px !important;
        }

        .tdoverflowonsmartphone {
            max-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .border tbody tr,
        .border tbody tr td,
        div.tabBar table.border tr,
        div.tabBar table.border tr td,
        div.tabBar div.border .table-border-row,
        div.tabBar div.border .table-key-border-col,
        div.tabBar div.border .table-val-border-col {
            height: 40px !important;
        }

        .quatrevingtpercent,
        .inputsearch {
            width: 95%;
        }

        select {
            padding-top: 4px;
            padding-bottom: 5px;
        }

        .login_table .tdinputlogin {
            min-width: unset !important;
        }

        input,
        input[type=text],
        input[type=password],
        select,
        textarea {
            min-width: 20px;
        }

        .trinputlogin input[type=text] {
            max-width: 140px;
        }

        .vmenu .searchform input {
            max-width: 138px;
            /* length of input text in the quick search box when using a smartphone and without dolidroid */
        }

        .hideonsmartphone {
            display: none;
        }

        .hideonsmartphoneimp {
            display: none !important;
        }

        .noenlargeonsmartphone {
            width: 50px !important;
            display: inline !important;
        }

        .maxwidthonsmartphone,
        #search_newcompany.ui-autocomplete-input {
            max-width: 100px;
        }

        .maxwidth50onsmartphone {
            max-width: 40px;
        }

        .maxwidth75onsmartphone {
            max-width: 50px;
        }

        .maxwidth100onsmartphone {
            max-width: 70px;
        }

        .maxwidth150onsmartphone {
            max-width: 120px;
        }

        .maxwidth150onsmartphoneimp {
            max-width: 120px !important;
        }

        .maxwidth200onsmartphone {
            max-width: 200px;
        }

        .maxwidth300onsmartphone {
            max-width: 300px;
        }

        .maxwidth400onsmartphone {
            max-width: 400px;
        }

        .minwidth50imp {
            min-width: 50px !important;
        }

        .minwidth75imp {
            min-width: 60px !important;
        }

        .minwidth100imp {
            min-width: 80px !important;
        }

        .minwidth150imp {
            min-width: 90px !important;
        }

        .minwidth200imp {
            min-width: 100px !important;
        }

        .minwidth300imp {
            min-width: 120px !important;
        }

        .minwidth400imp {
            min-width: 150px !important;
        }

        .minwidth500imp {
            min-width: 250px !important;
        }

        .titlefield {
            width: auto;
        }

        .titlefieldcreate {
            width: auto;
        }

        #tooltip {
            position: absolute;
            width: 300px;
        }

        /* intput, input[type=text], */
        select {
            width: 98%;
            min-width: 40px;
        }

        div.divphotoref {
            padding-right: 5px;
            padding-bottom: 5px;
        }

        img.photoref,
        div.photoref {
            border: none;
            -webkit-box-shadow: none;
            box-shadow: none;
            padding: 4px;
            height: 20px;
            width: 20px;
            object-fit: contain;
        }

        div.statusref {
            padding-right: 10px;
        }

        div.statusref img {
            padding-right: 3px !important;
        }

        div.statusrefbis {
            padding-right: 3px !important;
        }

        /* TODO
    div.statusref {
        padding-top: 0px !important;
        padding-left: 0px !important;
        border: none !important;
       }
    */

        input.buttonpayment {
            min-width: 300px;
        }
    }

    .linkobject {
        cursor: pointer;
    }

    table.tableforfield tr>td:first-of-type,
    div.tableforfield div.tagtr>div.tagtd:first-of-type {
        color: #666;
    }

    >
    /* ============================================================================== */
    /* Styles for dragging lines													  */
    /* ============================================================================== */

    .dragClass {
        color: #002255;
    }

    td.showDragHandle {
        cursor: move;
    }

    .tdlineupdown {
        white-space: nowrap;
        min-width: 10px;
    }

    /*------------------------------------*\
#Positioning Areas
\*------------------------------------*/

    #id-container:before,
    #id-container:after {
        content: ' ';
        display: table;
    }

    #id-container:after {
        clear: both;
    }

    #id-container {
        table-layout: fixed;
    }

    .login_block_getinfo {
        text-align: center;
    }

    .login_block_getinfo div.login_block_user {
        display: block;
    }

    .login_block_getinfo .atoplogin,
    .login_block_getinfo .atoplogin:hover {
        color: #444444 !important;
        font-weight: normal !important;
    }

    #id-right,
    #id-left,
    .side-nav {
        display: table-cell;
        float: left;
        vertical-align: top;
    }

    .side-nav {
        background-color: #0072CE;
            }

    #id-right {
        padding-top: 10px;
        width: 100%;
            }

    #id-left {
        z-index: 90;
            }

    #id-top {
        background-color: #0072CE;
        z-index: 91;
    }

    div.fiche {
        margin-left: 15px;
        margin-right: 15px;
            }

    body.onlinepaymentbody div.fiche {
        /* For online payment page */
        margin: 20px !important;
    }

    div.fiche>table:first-child {
        margin-bottom: 15px !important;
    }

    div.fichecenter {
        clear: both;
        /* This is to have div fichecenter that are true rectangles */
        width: 100%;
    }

    div.fichecenterbis {
        margin-top: 8px;
    }

    div.fichethirdleft {
        float: left;
width: 50%;
    }

    div.fichetwothirdright {
        float: right;
width: 50%;
    }

    div.fichetwothirdright div.ficheaddleft {
        padding-left: 20px;
    }

    div.fichehalfleft {
        float: left;
width: calc(50% - 10px);
    }

    div.fichehalfright {
        float: right;
width: calc(50% - 10px);
    }

    div.fichehalfright {
            }

    div.firstcolumn div.box {
        padding-right: 10px;
    }

    div.secondcolumn div.box {
        padding-left: 10px;
    }

    /* Force values for small screen */
    @media only screen and (max-width: 1000px) {
        div.fiche {
            /* margin-left: 20px; */
            margin-left: 6px;
            margin-right: 6px;
        }

        div.fichecenter {
            width: 100%;
            clear: both;
            /* This is to have div fichecenter that are true rectangles */
        }

        div.fichecenterbis {
            margin-top: 8px;
        }

        div.fichethirdleft {
            float: none;
            width: auto;
            padding-bottom: 6px;
        }

        div.fichetwothirdright {
            float: none;
            width: auto;
            padding-bottom: 6px;
        }

        div.fichetwothirdright div.ficheaddleft {
            padding-left: 0;
        }

        div.fichehalfleft {
            float: none;
            width: auto;
        }

        div.fichehalfright {
            float: none;
            width: auto;
        }

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

        div.firstcolumn div.box {
            padding-right: 0px;
        }

        div.secondcolumn div.box {
            padding-left: 0px;
        }
    }

    /* Force values on one colum for small screen */
    @media only screen and (max-width: 1599px) {
        div.fichehalfleft-lg {
            float: none;
            width: auto;
        }

        div.fichehalfright-lg {
            float: none;
            width: auto;
        }

        .fichehalfright-lg .fichehalfright {
            padding-left: 0;
        }
    }

    /* For table into table into card */
    div.fichehalfright tr.liste_titre:first-child td table.nobordernopadding td {
        padding: 0 0 0 0;
    }

    div.nopadding {
        padding: 0 !important;
    }

    .containercenter {
        display: table;
        margin: 0px auto;
    }

    #pictotitle,
    .pictotitle {
        margin-right: 8px;
        margin-bottom: 4px;
    }

    .pictoobjectwidth {
        width: 14px;
    }

    .pictosubstatus {
        padding-left: 2px;
        padding-right: 2px;
    }

    .pictostatus {
        width: 15px;
        vertical-align: middle;
        margin-top: -3px
    }

    .pictowarning,
    .pictopreview {
        padding-left: 3px;
    }

    .pictowarning {
        vertical-align: text-bottom;
    }

    .pictomodule {
        width: 14px;
    }

    .fiche .arearef img.pictoedit,
    .fiche .arearef span.pictoedit,
    .fiche .fichecenter img.pictoedit,
    .fiche .fichecenter span.pictoedit,
    .tagtdnote span.pictoedit {
        opacity: 0.4;
    }

    .colorthumb {
        padding-left: 1px !important;
        padding-right: 1px;
        padding-top: 1px;
        padding-bottom: 1px;
        width: 44px;
        text-align: center;
    }

    div.attacharea {
        padding-top: 18px;
        padding-bottom: 10px;
    }

    div.attachareaformuserfileecm {
        padding-top: 0;
        padding-bottom: 0;
    }

    div.arearef {
        padding-top: 2px;
        margin-bottom: 10px;
        padding-bottom: 10px;
    }

    div.arearefnobottom {
        padding-top: 2px;
        padding-bottom: 4px;
    }

    div.heightref {
        min-height: 80px;
    }

    div.divphotoref {
        padding-right: 20px;
    }

    div.paginationref {
        padding-bottom: 10px;
    }

    /* TODO
div.statusref {
   	padding: 10px;
   	border: 1px solid #bbb;
   	border-radius: 6px;
} */
    div.statusref {
        float: right;
        padding-left: 12px;
        margin-top: 8px;
        margin-bottom: 10px;
        clear: both;
    }

    div.statusref img {
        vertical-align: text-bottom;
        width: 18px;
    }

    div.statusrefbis {
        padding-left: 8px;
        padding-right: 9px;
        vertical-align: text-bottom;
    }

    img.photoref,
    div.photoref {
        border: 1px solid #DDD;
        -webkit-box-shadow: 0px 0px 6px #DDD;
        box-shadow: 0px 0px 6px #DDD;
        padding: 4px;
        height: 80px;
        width: 80px;
        object-fit: contain;
    }

    img.fitcontain {
        object-fit: contain;
    }

    div.photoref {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }

    img.photorefnoborder {
        padding: 2px;
        height: 48px;
        width: 48px;
        object-fit: contain;
        border: 1px solid #AAA;
        border-radius: 100px;
    }

    .underrefbanner {}

    .underbanner {
        border-bottom: 2px solid #0072CE;
        /* border-bottom: 2px solid rgb(0,127,255); */
    }

    .trextrafieldseparator td {
        /* border-bottom: 2px solid rgb(0,127,255) !important; */
        border-bottom: 2px dashed rgb(200,200,200) !important;
    }

    .tdhrthin {
        margin: 0;
        padding-bottom: 0 !important;
    }

    /*------------------------------------*\
#Top Menu
\*------------------------------------*/

    #tmenu_tooltipinvert .db-menu__society,
    #tmenu_tooltip .db-menu__society {
        /* for v3.5 */
        display: inline-block;
        float: left;
        /*margin: 0 10px;*/
        padding: 0 5px 0 5px;
        max-width: 210px;
        text-align: left;

        -webkit-touch-callout: none;
        /* iOS Safari */
        -webkit-user-select: none;
        /* Safari */
        -khtml-user-select: none;
        /* Konqueror HTML */
        -moz-user-select: none;
        /* Firefox */
        -ms-user-select: none;
        /* Internet Explorer/Edge */
        user-select: none;
        /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
    }

    #tmenu_tooltipinvert .db-menu__society a,
    #tmenu_tooltip .db-menu__society a {
        /* for v3.5 */
        color: #fff;
        display: inline;
        font-weight: 500;
        height: 40px;
        line-height: 40px;
        padding: 0 5px;
        text-decoration: none;
        overflow: hidden;
        text-overflow: ellipsis;
        transition: all .4s ease-in-out;
        -moz-transition: all .4s ease-in-out;
        -webkit-transition: all .4s ease-in-out;
    }

    #tmenu_tooltipinvert .db-menu__society a:hover,
    #tmenu_tooltip .db-menu__society a:hover {
        /* for v3.5 */
        color: #0072CE;
    }

    /*
* Main Navigation
*/

    #tmenu_tooltip {
        display: block;
        overflow: auto;
        width: 100%;
        background-color: #0072CE;
        max-height: 54px;
        margin: 0;
        padding-right: 195px;
        z-index: 95;
        position: relative;
            }

    #tmenu_tooltip:hover {
        max-height: 540px;
    }

    .main-nav {
                /*background-color: rgb();*/
        color: #fcfcfc;
        font-size: 13px;
        margin: 0;
        padding: 0;
        position: relative;
        text-decoration: none;
        white-space: nowrap;
            }

    .main-nav__list {
        list-style: none;
        margin-bottom: 20px;
        padding: 0;
    }

    .main-nav__item {
        float: left;
        height: px;
        display: block;
        margin: 0;
        padding: 0;
        position: relative;
    }

    .main-nav__item {
        background-color: #0072CE;
    }

    .main-nav__item:hover {
        background-color: #0062B3;
        color: #FFFFFF;
    }

    .main-nav__item.is-sel {
        background-color: #0062B3;
        color: #FFFFFF;
            }


    #tmenu_tooltip .main-nav__list {
        margin: 0;
        padding: 0;
        text-align: center;
        z-index: 30;
    }

    #tmenu_tooltip .main-nav__item {
        display: block;
        float: left;
        position: relative;
        height: 54px;
            }

    .main-nav__item.tmenusel {
        background-color: #0062B3;
    }

    .main-nav__item.tmenusel .main-nav__link {
        font-weight: bold !important;
    }

    .main-nav__item.tmenusel:hover {
        color: #fff;
    }

    .main-nav__item.tmenusel .main-nav__link:hover {
        color: #fff;
        font-weight: bold;
    }



    /*
.main-nav__item:hover a,
.main-nav__list:visited li a {
color: #eee;
display: block;
font-weight: normal;
height: 54px;
padding: 0 6px;
text-decoration: none;
transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
}*/

    #tmenu_tooltip .tmenu li:hover .main-nav__link,
    .main-nav__item:hover .main-nav__link,
    .main-nav__item .main-nav__link:focus {
        color: #0072CE;
    }

    .main-nav__link {
        color: #f4f4f4;
        display: block;
        font-family: "Open Sans",Verdana,Arial,Helvetica;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
    }

    #tmenu_tooltip .main-nav__link {
        height: 54px;
        padding: 0 6px;
            }

    .main-nav__link.is-disabled {
        cursor: not-allowed;
        opacity: .6;
    }

    .main-nav__link.is-disabled:hover {
        color: #888;
    }

    .db-nav .main-nav__link {
        text-decoration: none;
    }

    /**
* Secondary Navigation
*/

    #tmenu_tooltipinvert .pushy-btn,
    #tmenu_tooltip .pushy-btn {
        /* for v3.5 */
        font-size: 18px !important;
        height: 54px;
        line-height: 54px;
            }

    #tmenu_tooltipinvert {
        display: inline-table;
        overflow: auto;
        width: 100%;
        background-color: #0072CE;
        max-height: 40px;
        left: 0;
        margin: 0;
        padding-right: 160px;
        z-index: 95;
        position: relative;
            }

    #tmenu_tooltipinvert:hover {
        max-height: 400px;
    }

    .sec-nav.is-inverted {
        display: inline-block;
        margin-left: 10px;
            }

    .sec-nav.is-inverted .sec-nav__item.item-heading,
    .sec-nav.is-inverted .sec-nav__item.is-disabled {
        background-color: #0072CE;
        float: left;
        position: relative;
        padding: 0;
        z-index: 40;
    }

    .sec-nav.is-inverted .sec-nav__item.item-heading:hover {
        background-color: #0072CE;
    }

    .sec-nav.is-inverted .sec-nav__link {
        font-size: 13px;
        white-space: nowrap;
    }

    .sec-nav.is-inverted .sec-nav__link:hover,
    .sec-nav.is-inverted .sec-nav__link:focus {
        /* color: #0072CE; */
    }

    .sec-nav.is-inverted .sec-nav__item.item-heading>.sec-nav__link,
    .sec-nav.is-inverted .sec-nav__item.is-disabled>.sec-nav__link {
        display: block;
        line-height: 40px;
        font-weight: normal;
        padding: 0 8px;
    }

    .sec-nav.is-inverted .sec-nav__item.is-disabled>.sec-nav__link {
        cursor: not-allowed;
    }

    li.item-heading:hover>.sec-nav__link {
        background-color: #0072CE;
        color: #FFFFFF;
    }

    li.sec-nav__sub-item {
        color: #FFFFFF;
    }

    .caret {
        content: '';
        color: inherit;
        display: inline-block;
        height: 0;
        vertical-align: baseline;
        width: 0;
        padding-bottom: 2px;
    }

    .caret--top {
        border-top: 4px solid #eee;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
    }

    .caret--left {
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
        border-left: 4px solid #eee;
        margin-right: .1em;
    }

    .caret--right {
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
        border-right: 4px solid #eee;
        margin-left: .1em;
    }

    .sec-nav.is-inverted li.item-heading:hover .caret--top {
        border-top-color: #0072CE;
    }

    .sec-nav__sub-list .item-level2:hover .caret--left {
        border-left-color: #0072CE;
    }

    .sec-nav__sub-list .item-level2:hover .caret--right {
        border-right-color: #0072CE;
    }

    .sec-nav__sub-list .item-level3:hover .caret--left {
        border-left-color: #0072CE;
    }

    .sec-nav__sub-list .item-level3:hover .caret--right {
        border-right-color: #0072CE;
    }

    /**
* Submenus
*/

    .sec-nav.is-inverted .sec-nav__sub-list {
        background-color: #0072CE;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
        display: none;
        opacity: 0;
        padding-top: 0;
        padding-bottom: 5px;
        padding-inline-start: 0;
        -webkit-transiton: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -ms-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;
        -transition: opacity 0.2s;
    }

    .sec-nav.is-inverted .sec-nav__item:hover .sec-nav__sub-list {
        display: block;
        position: absolute;
        opacity: 1;
        visibility: visible;
    }

    .sec-nav.is-inverted .sec-nav__sub-item {
        float: none;
        padding: 0;
    }

    .sec-nav.is-inverted .sec-nav__sub-list .item-level1 .sec-nav__link {
        display: block;
        padding: 0.6em 1em;

    }

    .sec-nav.is-inverted .sec-nav__sub-list .item-level2 .sec-nav__link {
        display: block;
        padding: 0.5em 1.2em;
    }

    .sec-nav.is-inverted .sec-nav__sub-list .item-level3 .sec-nav__link {
        display: block;
        padding: 0.4em 1.4em;
    }

    .sec-nav.is-inverted .sec-nav__link.is-disabled {
        display: block;
        padding: 0.6em 1em;
    }


    /**
* Login Block
*/
    div.login_block {
        background-color: #0072CE;
        height: 54px;
                /* padding-right: 10px; */
        position: absolute !important;
        top: 0;
        right: 0px;
        z-index: 100;
            }

    div.login_block a {
        color: #FFFFFF;
        display: inline-block;
    }

    div.login_block span.aversion {
        color: #FFFFFF;
        filter: contrast(0.7);
    }

    div.login_block table {
        display: inline;
    }

    div.login {
        white-space: nowrap;
        font-weight: bold;
        float: right;
    }

    div.login a {
        color: #FFFFFF;
    }

    div.login a:hover {
        color: #0072CE;
        text-decoration: underline;
    }

    div.login_block:after {
        /*content: '\f013';*/
        color: #FFFFFF;
        font-family: "Font Awesome 5 Free";
         !important;
        font-size: 20px;
        line-height: 54px;
            }

    div.login_block:hover:after {
        color: #0072CE;
    }

    div.login_block_user {
        clear: left;
        float: left;
        margin-right: 0px;
    }

    div.login_block_user .login a,
    div.login_block_user a {
        display: table-cell;
        font-family: "Open Sans",Verdana,Arial,Helvetica;
        font-weight: 500;
        height: 54px;
        max-width: 300px;
        overflow: hidden;
        padding: 0 3px;
        text-overflow: ellipsis;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
        vertical-align: middle;
    }

    div.login_block_user>.classfortooltip.login_block_elem2 {
        height: 54px;
            }

    div.login_block_other {
        display: inline-block;
        clear: both;
    }

    .login_block_other {
        background: #0072CE;
                /* position: absolute; */
        right: 0;
        top: 54px;
        height: 54px;
        line-height: 50px;
        padding-top: 0;
        text-align: right;
        margin-right: 3px;
    }

    .login_block:hover>.login_block_other {
        /* display: block; */
    }

    .login_block_user a img.loginphoto {
        display: none;
    }

    .login_block_elem {
        float: left;
        background-color: #0072CE;
        height: 54px;
        padding: 0;
    }

    .login_block_elem.classfortooltip {
        margin: 0;
    }

    .login_block_elem a,
    .login_block td.classfortooltip a {
        color: #FFFFFF;
        font-size: 18px;
        height: 54px;
        line-height: 50px;
        display: block;
        font-family: "Open Sans",Verdana,Arial,Helvetica;
        padding: 0 3px;
        text-decoration: none;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
    }

    /* hover de texto en la ventana de logout modificado por ricardo */
    /* .login_block_elem a:hover,
    .login_block td.classfortooltip a:hover {
        color: #FFFFFF;
            } */

    .atoplogin,
    .atoplogin:hover {
        color: #FFFFFF !important;
            }

    .login_block_getinfo {
        text-align: center;
    }

    .login_block_getinfo div.login_block_user {
        display: block;
    }

    .login_block_getinfo .atoplogin,
    .login_block_getinfo .atoplogin:hover {
        color: #333 !important;
        font-weight: normal !important;
    }

    .alogin,
    .alogin:hover {
        font-weight: normal !important;
        padding-top: 2px;
    }

    .alogin:hover,
    .atoplogin:hover {
        text-decoration: underline !important;
    }

    span.fa.atoplogin,
    span.fa.atoplogin:hover {
        font-size: 16px;
        text-decoration: none !important;
    }

    .atoplogin #dropdown-icon-down,
    .atoplogin #dropdown-icon-up {
        font-size: 0.7em;
    }

    .login_block_elem img.printer,
    .login_block_elem img.login,
    .login_block_elem img.help,
    .login_block td.classfortooltip img.printer,
    .login_block td.classfortooltip img.login,
    .login_block td.classfortooltip img.help {
        vertical-align: baseline;
    }

    img.login,
    img.printer,
    img.help,
    img.entity {
        /* padding: 0px 0px 0px 4px; */
        /* margin: 0px 0px 0px 8px; */
        text-decoration: none;
        color: #FFFFFF;
        font-weight: bold;

    }

    .userimg.atoplogin img.userphoto,
    .userimgatoplogin img.userphoto {
        /* size for user photo in login bar */
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background-size: contain;
        border: 1px solid;
        border-color: rgba(255, 255, 255, 0.2);
    }

    img.userphoto {
        /* size for user photo in lists */
        border-radius: 0.72em;
        width: 1.4em;
        height: 1.4em;
        background-size: contain;
        vertical-align: middle;
    }

    img.userphotosmall {
        /* size for user photo in lists */
        border-radius: 0.6em;
        width: 1.2em;
        height: 1.2em;
        background-size: contain;
        vertical-align: middle;
        background-color: #FFF;
    }

    img.userphoto[alt="Gravatar avatar"],
    img.photouserphoto.dropdown-user-image[alt="Gravatar avatar"] {
        background: #fff;
    }

    form[name="addtime"] img.userphoto {
        border: 1px solid #444;
    }

    .span-icon-user {
        background-image: url(/htdocs/theme/oblyon/img/object_user.png);
        background-repeat: no-repeat;
    }

    .span-icon-password {
        background-image: url(/htdocs/theme/oblyon/img/lock.png);
        background-repeat: no-repeat;
    }

    /*
.span-icon-user input, .span-icon-password input {
margin-right: 30px;
}
*/

    .login_block td.classfortooltip {
        height: 40px;
    }

    .login_block .classfortooltip:hover,
    .login_block .classfortooltip:focus {
        background-color: #0062B3;
            }

    div.login_block table {
        display: inline;
    }

    /* db inf v3.5 */
    td div.login {
        white-space: nowrap;
        padding: 0;
        margin: 0;
        font-weight: bold;
        color: #f4f4f4;
    }

    div.login a,
    div.login_block_user a {
        color: #f4f4f4;
        font-size: 13px;
    }

    div.login a:hover {
        color: #0072CE;
        text-decoration: inherit;
    }

    .alogin {
        font-weight: normal !important;
        font-size: 14px !important;
    }

    .alogin:hover {
        text-decoration: underline !important;
        color: #0072CE !important;
    }


    /*------------------------------------*\
#Left Menu
\*------------------------------------*/

    /**
* Company Name
*/

    .db-menu__society {
        margin: 0;
        padding: 0;
    }

    .db-menu__society h1 {
        color: #fff;
        font-size: 1.5em;
        font-weight: bold;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .vmenu .db-menu__society {
        padding: 10px 0;
    }


    /**
* Logo Block
*/

    .db-menu__logo {
        background-color: #FFFFFF;
        padding: 0;
        max-height: 200px;
            }

    .db-menu__logo__link {
        display: block;
        background: #FFFFFF;
        margin: 0;
    }

    .db-menu__logo__img {
        max-height: 120px;
        height: auto;
        max-width: 100%;
        width: auto;
    }


    /**
* Secondary Navigation
*/

    .sec-nav__list {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .sec-nav__item {
        display: block;
    }

    .vmenu .sec-nav__item.item-heading>.sec-nav__link {
        background-color: #0072CE;
        font-weight: bold;
        display: block;
        line-height: 1em;
        padding: 10px;
            }

    .sec-nav {
        color: #0072CE;
    }

    .sec-nav .sec-nav__link {
        color: #FFFFFF;
        font-size: 14px;
        font-family: Verdana,Arial,Helvetica;
        font-weight: normal;
        text-align: left;
        text-decoration: none;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
    }

    /* color on hover sobre la barra izquierda modificado por ricardo130 */

    .sec-nav .sec-nav__link:hover,
    .sec-nav .sec-nav__link:focus {
        /* color: #0072CE; */
        color: #ffffff;
    }

    .vmenu .sec-nav__item.item-heading {
        margin-bottom: 15px;
    }

    .sec-nav__sub-list {
        background-color: #0072CE;
        padding-top: 5px;
        /* padding-inline-start: 1.5em; */
    }

    .sec-nav__sub-list .item-level1 {
        padding: 0.3em 0.8em;
    }

    .sec-nav__sub-list .item-level2 {
        padding: 0.2em 1em;
    }

    .sec-nav__sub-list .item-level3 {
        padding: 0.2em 1em;
    }

    .sec-nav__sub-item.is-disabled {
        opacity: .6;
        padding: 0.3em 0.8em;
    }

    .sec-nav .sec-nav__link.is-disabled {
        cursor: not-allowed;
    }


    /**
* Main Navigation
*/

    .main-nav.is-inverted .main-nav__link {
        line-height: 35px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .main-nav.is-inverted {
        font-size: 14px;
    }

    /**
* Society Name Block
*/
    .blockvmenusocietyname {
        background-color: #0072CE;
        padding: 10px 0 10px 0;
    }

    .blockvmenusocietyname span {
        color: #FFFFFF;
        padding: 5px 10px 5px 10px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: bold;
    }

    /**
* Search Block
*/

    .blockvmenusearch {
        background-color: #0072CE;
        border-bottom: 1px solid #0072CE;
        box-shadow: 0 0 1px rgba(0, 0, 0, .04);
        -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .04);
        clear: both;
        padding: 10px;
        text-decoration: none;
    }

    .blockvmenusearch .menu_titre {
        margin: 8px 0 1px 0;
    }

    .blockvmenusearch a:link,
    .blockvmenusearch a:visited,
    .blockvmenusearch a:active {
        color: #eee;
        font-family: "Open Sans",Verdana,Arial,Helvetica;
        font-size: 14px;
        text-align: left;
    }

    .blockvmenusearch a:hover {
        color: #0072CE;
    }


    /**
* Bookmarks Block
*/

    .blockvmenubookmarks {
        background-color: #0072CE;
        border-bottom: 1px solid #0072CE;
        box-shadow: 0 0 1px rgba(0, 0, 0, .04);
        -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .04);
        clear: both;
        padding: 5px 10px 5px 10px;
        text-decoration: none;
    }

    .blockvmenubookmarks .menu_titre {
        margin: 8px 0 1px 0;
        text-align: left;
    }

    .blockvmenubookmarks .menu_titre a {
        font-size: 13px;
    }

    .blockvmenubookmarks .menu_titre img:hover {
        background-image: url(img/object_bookmark_full.png);
    }

    .blockvmenubookmarks .menu_contenu {
        max-width: 230px;
        overflow: hidden;
        padding: 2px 6px;
        text-overflow: ellipsis;
    }

    .blockvmenubookmarks a:link,
    .blockvmenubookmarks a:visited,
    .blockvmenubookmarks a:active {
        color: #444444;
        font-family: Verdana,Arial,Helvetica;
        font-size: 14px;
    }

    .blockvmenubookmarks a.vmenu:link,
    .blockvmenubookmarks a.vmenu:visited {
        color: #444444;
    }

    .blockvmenubookmarks a.vmenu:hover,
    .blockvmenubookmarks a.vsmenu:hover {
        color: #0072CE;
    }


    /**
* Help Block
*/

    .blockvmenuhelp {
        background-color: #0072CE;
        color: #0072CE;
        font-family: Verdana,Arial,Helvetica;
        margin: 0;
        text-align: center;
            }

    .blockvmenuhelp a {
        font-family: Verdana,Arial,Helvetica;
        font-size: 14px;
        display: inline-block;
    }

    .blockvmenuhelp a.help:link,
    .blockvmenuhelp a.help:visited,
    .blockvmenuhelp a.help:active {
        color: #FFFFFF;
        font-size: 14px;
        font-weight: normal;
        text-align: left;
        text-decoration: none;
    }

    .blockvmenuhelp a:hover {
        color: #0072CE !important;
    }

    .blockvmenuhelp a[href*="http://www.dolibarr."] {
        padding: 15px 0 5px;
        font-size: 15px;
    }

    .blockvmenuhelp a.help img {
        vertical-align: top;
    }

    .blockvmenuhelp:last-child {
        padding: 10px 0 10px 0;
    }

    /*------------------------------------*\
#Pushy Left Menu
\*------------------------------------*/

    #id-left {
        position: absolute;
        top: 54px;
        background-color: #0072CE;
        max-width: 265px;
        overflow: hidden;
        -webkit-overflow-scrolling: touch;
        left: -270px;
            }

    #id-left,
    #id-container,
    .push {
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        transition: all 0.3s ease;
            }

    .container-push {
            }

    /**
    * Coming Feature: OVERLAY when LEFTMENU hidden
    */
    /*.pushy-active .site-overlay {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99;
    background-color: rgba(0,0,0,0.5);
    -webkit-animation: fade 500ms;
    -moz-animation: fade 500ms;
    -ms-animation: fade 500ms;
    -o-animation: fade 500ms;
    animation: fade 500ms;
    }*/

    .pushy-active {
        -webkit-animation: fade 500ms;
        -moz-animation: fade 500ms;
        -ms-animation: fade 500ms;
        -o-animation: fade 500ms;
        animation: fade 500ms;
        overflow-x: hidden;
        overflow-y: auto;
        height: 100%;
    }

    .pushy-open {
        left: 0 !important;
            }

    /**
    * Coming Feature: OVERLAY when LEFTMENU hidden
    */
    /*
        */


    .pushy-btn {
        background-color: #0072CE;
        color: #FFFFFF;
        display: inline-block;
        float: left;
        font-size: 24px;
        height: 54px;
        line-height: 54px;
        padding: 0 10px;
        cursor: pointer;
    }

    .pushy-btn:hover {
        background-color: #0062B3;
        color: #FFFFFF;
    }

    .pushy-active .pushy-btn {
        background-color: #0062B3;
        color: #FFFFFF;
    }

        /* end HIDE_LEFTMENU */

    /*------------------------------------*\
    #Oblyon Main and Sec Nav Icons
\*------------------------------------*/

    .main-nav .icon {
        display: block;
        float: none;
        height: 34px;
        line-height: 36px;
        min-width: 40px;
        position: relative;
    }

    .main-nav.is-inverted .icon {
        float: left;
        height: 35px;
        line-height: 35px;
        margin: 0;
        position: relative;
        text-align: center;
        width: 40px;
    }

    .main-nav .icon {
        font-size: 18px;
    }

    .sec-nav .icon {
        float: left;
        margin-right: 5px;
    }

    .sec-nav.is-inverted .icon {
        height: 40px;
        line-height: 40px;
    }

    .sec-nav .icon {
        font-size: 14px;
    }


    .mainmenu.accounting {
        background: none !important;
    }

    /* ============================================================================== */
    /* Fa-icons                                                                       */
    /* ============================================================================== */
    /* <style type="text/css" > */

.icon {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: "Font Awesome 5 Free"; !important;
    font-weight: 900;
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    speak: none;
    text-transform: none;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.icon--home:before {
    content: '\f015';
}

.icon--ftp:before {
    content: '\f362';
}

.icon--contracts:before {
    content: '\f56c';
}

.icon--commercial:before {
    content: '\f0f2';
}

.icon--cat:before,
.icon--tags:before {
    content: '\f02c';
}

.icon--externalsite:before {
    content: '\f360';
}

.icon--websites:before, .icon--website:before {
    content: '\f542';
}

.icon--filemanager:before {
    content: '\f802';
}

.icon--members:before {
    content: '\f0c0';
}

.icon--subscriptions:before {
    content: '\f65c';
}

.icon--tools:before {
    content: '\f0ad';
}

.icon--geopipmaxmind:before {
    content: '\f601';
}

.icon--cashdesk:before,
.icon--cashcontrol:before,
.icon--shop:before,
.icon--orders:before,
.icon--orders_suppliers:before {
    content: '\f788';
}

.icon--margins:before {
    content: '\f643';
}

.icon--project:before,
.icon--projects:before {
    content: '\f0e8';
}
.icon--tasks:before {
    content: '\f828';
}

.icon--product:before,
.icon--products:before {
    content: '\f1b2';
}

.icon--mrp:before {
    content: '\f1b3';
}

.icon--companies:before,
.icon--thirdparties:before {
    content: '\f1ad';
}

.icon--billing:before {
    content: '\f51e';
}

.icon--accountancy:before,
.icon--accounting:before {
    content: '\f53d';
}

.icon--bank:before {
    content: '\f19c';
}

.icon--hrm:before,
.icon--holiday:before {
    content: '\f508';
}

.icon--service:before {
    content: '\f4c4';
}

.icon--withdraw:before,
.icon--ticket:before{
    content: '\f3ff';
}

.icon--agenda:before {
    content: '\f073';
}

.icon--ecm:before {
    content: '\f07c';
}

.icon--checks:before {
    content: '\f53c';
}

.icon--click2dial:before {
    content: '\f67d';
}

.icon--paypal:before {
    font-family: "Font Awesome 5 Brands";
    content: '\f1ed';
}

.icon--stripe:before {
    font-family: "Font Awesome 5 Brands";
    content: '\f42a';
}

.icon--google:before {
    font-family: "Font Awesome 5 Brands";
    content: '\f1a0';
}

.icon--webservices:before {
    content: '\f719';
}

.icon--contacts:before {
    content: '\f0c0';
}

.icon--sendings:before {
    content: '\f472';
}

.icon--ficheinter:before {
    content: '\f479';
}

.icon--tax:before {
    content: '\f295';
}

.icon--donations:before {
    content: '\f4b9';
}

.icon--ca:before {
    content: '\f53a';
}

.icon--mailing:before,
.icon--email_templates:before {
    content: '\f658';
}

.icon--export:before {
    content: '\f56e';
}

.icon--import:before,
.icon--transfer:before {
    content: '\f56f';
}

.icon--propals:before {
    content: '\f571';
}

.icon--suppliers_bills:before {
    content: '\f570';
}

.icon--customers_bills:before,
.icon--members_subscription:before{
    content: '\f507';
}

.icon--stock:before {
    content: '\f480';
}

.icon--tripsandexpenses:before,
.icon--expensereport:before {
    content: '\f63c';
}

.icon--opensurvey:before {
    content: '\f682';
}

.icon--asset:before {
    content: '\f467';
}

.icon--webhost:before {
    content: '\f233';
}

/* Secondary Nav */
.icon--setup:before {
    content: '\f7d9';
}

.icon--admintools:before,
.icon--accountancy_admin:before {
    content: '\f0ad';
}

.icon--modulesadmintools:before{
    content: '\f0ad';
}

.icon--users:before {
    content: '\f500';
}

.icon--email_templates:before {
    content: '\f674';
}

.icon--resource:before {
    content: '\f79c';
}

/* External modules */
.icon--cron:before {
    content: '\f017';
}

.icon--scanner:before {
    content: '\f8f3';
}

.icon--reports:before {
    content: '\f65a';
}

/* Generic modules */
.icon--generic:before {
    content: '\f07c';
}

/* Compatibility */
.mainmenu::before{
    /* font part */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 26px;
	font-size: 1.2em;
    -webkit-font-smoothing: antialiased;
    text-align:center;
	text-decoration:none;
	color: #444;
}


div.mainmenu.menu {
	background-image: none;
}

div.mainmenu.menu::before {
	content: "\f0c9";
}


div.mainmenu.home::before{
	content: "\f015";
}

div.mainmenu.billing::before {
    content: "\f51e";
}

div.mainmenu.accountancy::before {
    content: "\f53d";
}

div.mainmenu.agenda::before {
    content: "\f073";
}

div.mainmenu.bank::before {
    content: "\f19c";
}

div.mainmenu.takepos::before {
    content: "\f788";
}

div.mainmenu.companies::before {
    content: "\f1ad";
}

div.mainmenu.commercial::before {
    content: "\f0f2";
}

div.mainmenu.ecm::before {
    content: "\f07c";
}

div.mainmenu.externalsite::before {
    content: "\f360";
}

div.mainmenu.ftp::before {
    content: "\f362";
}

div.mainmenu.hrm::before {
    content: "\f508";
}

div.mainmenu.members::before {
    content: "\f0c0";
}

div.mainmenu.products::before {
    content: "\f1b2";
}

div.mainmenu.mrp::before {
    content: "\f1b3";
}

div.mainmenu.project::before {
    content: "\f0e8";
}

div.mainmenu.ticket::before {
    content: "\f3ff";
}

div.mainmenu.tools::before {
    content: "\f0ad";
}

div.mainmenu.website::before {
    content: "\f542";
}
    /*------------------------------------*\
#Top Menu (eldy style)
\*------------------------------------*/

    /**
* Main Navigation
*/

    .tmenudiv {
        color: #fcfcfc;
        display: block;
        font-size: 13px;
        font-weight: normal;
        margin: 0;
        padding: 0;
        position: relative;
        text-decoration: none;
        white-space: nowrap;
            }

    #tmenu_tooltip ul.tmenu {
        list-style: none;
        margin: 0;
        padding: 0;
        text-align: center;
        z-index: 30;
    }

    .vmenu ul.tmenu {
        margin-bottom: 20px;
    }

    li.tmenu,
    li.tmenusel {
        display: block;
        margin: 0;
        padding: 0;
        position: relative;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
    }

    #tmenu_tooltip li.tmenu,
    #tmenu_tooltip li.tmenusel {
        display: block;
        float: left;
        position: relative;
        height: 54px;
        min-width: 66px;
            }

    li.tmenusel {
        background-color: #0072CE;
        color: #fff;
    }

    li.tmenu:hover {
        background-color: #0062B3;
        color: #0072CE;
    }

    #tmenu_tooltip li.tmenu {
        background-color: #0072CE;
    }

    #tmenu_tooltip li.tmenu:hover {
        background-color: #0062B3;
    }


    /* Liens menu vertical */

    div.tmenudisabled,
    a.tmenudisabled {
        cursor: not-allowed;
        opacity: .6;
    }

    a.tmenu:link,
    a.tmenu:visited,
    a.tmenudisabled {
        color: #FFFFFF !important;
        display: block;
        font-weight: normal;
        /* padding: 0 5px; */
        text-decoration: none;
        white-space: nowrap;
    }

    a.tmenu:active {
        color: #FFFFFF !important;
        margin: 0;
    }

    a.tmenu:hover {
        color: #FFFFFF !important;
        margin: 0;
    }

    a.tmenuimage:hover+a.tmenu {
        color: #0072CE !important;
    }

    .tmenu li a,
    .tmenu:visited li a,
    .tmenu:hover li a {
        font-weight: normal;
    }

    a.tmenusel:hover,
    a.tmenusel:active {
        color: #fff;
        font-weight: bold !important;
    }

    li.tmenusel a,
    li.tmenusel a:hover,
    li.tmenusel a:active,
    li.tmenusel a:link {
        color: #fff !important;
        font-weight: bold !important;
    }

    li.tmenuend {
        display: none;
    }

    div.tmenuleft {
        float: left;
        height: 56px;
        margin-top: -4px;
    }

    div.tmenucenter {
        height: 54px;
        padding: 0;
        width: 100%;
    }

    /*
.main-nav__list .mainmenuaspan {
                padding: 14px 0 !important;
        }
*/


    /**
* Secondary Navigation
*/
    div.blockvmenulogo {
        border-bottom: 0 !important;
    }

    .menulogocontainer {
        margin: 3px;
        margin-left: 11px;
        margin-right: 9px;
        padding: 0;
        height: 32px;
        /* width: 100px; */
        max-width: 100px;
        vertical-align: middle;
    }

    .backgroundforcompanylogo {
        background-color: #FFFFFF;
        /* padding: 0;
         */

    }

    .menulogocontainer img.mycompany {
        object-fit: contain;
        width: inherit;
        height: inherit;
    }

    #mainmenutd_companylogo::after,
    #mainmenutd_menu::after {
        content: unset !important;
    }

    li#mainmenutd_companylogo .tmenucenter {
        width: unset;
        background-color: #FFFFFF;
    }

    li#mainmenutd_companylogo {
        min-width: unset !important;
    }

    .blockvmenupairinvert {
        margin: 0;
        padding: 0;
        position: relative;
    }

    #tmenu_tooltipinvert div.menu_titre {
        float: left;
    }

    #tmenu_tooltipinvert a.vmenu {
        color: ;
        display: block;
        font-size: 13px;
        line-height: 40px;
        padding: 0 9px;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
    }

    #tmenu_tooltipinvert div.menu_contenu {
        /*display: none; @bug improve display lev 1 and 2 */
    }

    #tmenu_tooltipinvert div.menu_titre:hover {
        background-color: #0072CE;
    }

    #tmenu_tooltipinvert div.menu_titre:hover+div.menu_contenu {
        display: block;
    }

    #tmenu_tooltipinvert img {
        vertical-align: text-bottom;
    }



    /*------------------------------------*\
#Left Menu (eldy style)
\*------------------------------------*/

    /**
* Secondary Navigation
*/

    div.vmenu {
        background-color: #0072CE;
        float: left;
        margin-right: 0;
        padding: 0;
        padding-bottom: 0;
        position: relative;
        z-index: 5;
        min-width: 230px;
        max-width: 230px;
        width: 230px;
        min-height: 100vh;
        -webkit-transition-property: max-width;
        -webkit-transition-duration: 0.2s;
        -webkit-transition-timing-function: linear;
        transition-property: max-width;
        transition-duration: 0.2s;
        transition-timing-function: linear;
    }

    .vmenu {
            }

    .vmenu .blockvmenupair div.menu_titre,
    .vmenu .blockvmenuimpair div.menu_titre {
        display: block;
    }

    .vmenu .blockvmenupair div.menu_titre a,
    .vmenu .blockvmenuimpair div.menu_titre a {
        background-color: #0072CE;
        color: #eee;
        display: block;
        padding: 8px;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
    }

    a.vmenu:link,
    a.vmenu:visited,
    a.vmenu:hover,
    a.vmenu:active,
    span.vmenu {
        font-size: 14px;
        font-weight: normal;
        text-align: left;
        text-decoration: none;
    }

    .vmenu div.blockvmenupair div.menu_titre a:hover,
    .vmenu div.blockvmenuimpair div.menu_titre a:hover {
        color: #0072CE;
    }

    font.vmenudisabled {
        color: #93a5aa;
        font-size: 14px;
        font-weight: bold;
        text-align: left;
    }


    /* sub-items */

    .vmenu div.blockvmenupair .menu_contenu,
    .vmenu div.blockvmenuimpair .menu_contenu {
        padding: 4px;
    }

    .vmenu div.blockvmenupair .menu_contenu:first-child,
    .vmenu div.blockvmenuimpair .menu_contenu:first-child {
        margin-top: 10px;
    }

    .vmenu .blockvmenupair div.menu_contenu a,
    .vmenu .blockvmenuimpair div.menu_contenu a {
        color: #eee;
        font-weight: normal;
        margin: 1px 1px 1px 8px;
        text-decoration: none;
    }

    a.vsmenu:link,
    a.vsmenu:visited,
    a.vsmenu:active {
        font-weight: normal;
    }

    .vmenu .blockvmenupair div.menu_contenu a:hover,
    .vmenu .blockvmenuimpair div.menu_contenu a:hover {
        color: #0072CE;
    }

    font.vsmenudisabled {
        color: #93a5aa;
        font-size: 14px;
        font-weight: normal;
        text-align: left;
    }

    font.vsmenudisabledmargin {
        margin: 1px 1px 1px 8px;
    }

    a.vsmenu img {
        vertical-align: bottom;
    }



    .vmenu div.blockvmenupair,
    .vmenu div.blockvmenuimpair {
        background-color: #0072CE;
        padding: 0;
        text-align: left;
    }

    div.blockvmenuimpair:first-child {
        padding: 0;
    }

    .vmenu .menu_top {
        margin-top: 2.5px;
    }

    .vmenu .menu_end {
        margin-bottom: 5px;
    }


    td.barre {
        background-color: #b3c5cc;
        border-right: 1px solid #000;
        border-bottom: 1px solid #000;
        color: #000;
        text-align: left;
        text-decoration: none;
    }

    td.barre_select {
        background-color: #b3c5cc;
        color: #000;
    }

    td.photo {
        background-color: #f4f4f4;
        border: 1px solid #b3c5cc;
        color: #000;
    }

    .vmenusearchselectcombo {
        width: 100%;
    }

    /**
* Main Navigation
*/

    /*------------------------------------*\
#Eldy Navigation Icons
\*------------------------------------*/

    .mainmenu {
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 24px;
        margin-left: 0;
        height: 36px;
        min-width: 40px;
        display: block;
            }

    /* A mainmenu entry but img file api.png not found (check /api/img/api.png), so we use a generic one */
.mainmenu.api:before, .icon--api:before {
  content: '\f152';
}
/* A mainmenu entry but img file modulebuilder.png not found (check /modulebuilder/img/modulebuilder.png), so we use a generic one */
.mainmenu.modulebuilder:before, .icon--modulebuilder:before {
  content: '\f152';
}
/* A mainmenu entry but img file whatsapp.png not found (check /whatsapp/img/whatsapp.png), so we use a generic one */
.mainmenu.whatsapp:before, .icon--whatsapp:before {
  content: '\f152';
}
/* A mainmenu entry but img file smstemplate.png not found (check /smstemplate/img/smstemplate.png), so we use a generic one */
.mainmenu.smstemplate:before, .icon--smstemplate:before {
  content: '\f152';
}
/* A mainmenu entry but img file template.png not found (check /template/img/template.png), so we use a generic one */
.mainmenu.template:before, .icon--template:before {
  content: '\f152';
}
/* A mainmenu entry but img file emailcollector.png not found (check /emailcollector/img/emailcollector.png), so we use a generic one */
.mainmenu.emailcollector:before, .icon--emailcollector:before {
  content: '\f152';
}
/* A mainmenu entry but img file reportmodule.png not found (check /reportmodule/img/reportmodule.png), so we use a generic one */
.mainmenu.reportmodule:before, .icon--reportmodule:before {
  content: '\f152';
}
/* A mainmenu entry but img file socialnetworks.png not found (check /socialnetworks/img/socialnetworks.png), so we use a generic one */
.mainmenu.socialnetworks:before, .icon--socialnetworks:before {
  content: '\f152';
}
/* A mainmenu entry but img file sendgrid.png not found (check /sendgrid/img/sendgrid.png), so we use a generic one */
.mainmenu.sendgrid:before, .icon--sendgrid:before {
  content: '\f152';
}
.mainmenu.oblyon, .icon--oblyon {
  background: url(/htdocs/custom/oblyon/img/oblyon.png) no-repeat center;
  background-size: 22px;
}
    /*------------------------------------*\
#Login Page
\*------------------------------------*/
    /* <style type="text/css" > */

    /* Login */

    .bodylogin
    {
        background: #f0f0f0;
        display: table;
        position: absolute;
        height: 100%;
        width: 100%;
        font-size: 1em;
    }
    .login_center {
        display: table-cell;
        vertical-align: middle;
    }
    .login_vertical_align {
        padding: 10px;
        padding-bottom: 80px;
    }
    form#login {
        padding-bottom: 30px;
        font-size: 14px;
        vertical-align: middle;
    }
    .login_table_title {
        max-width: 530px;
        color: #eee !important;
        padding-bottom: 20px;
        text-shadow: 1px 1px #444;
    }
    .login_table label {
        text-shadow: 1px 1px 1px #FFF;
    }
    .login_table {
        margin: 0px auto;  /* Center */
        padding-left:6px;
        padding-right:6px;
        padding-top:16px;
        padding-bottom:12px;
        max-width: 560px;
    	background-color: #FFFFFF;
        -webkit-box-shadow: 0 2px 23px 2px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(60,60,60,0.15);
        box-shadow: 0 2px 23px 2px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(60,60,60,0.15);

        border-radius: 5px;
        /*border-top:solid 1px rgba(180,180,180,.4);
        border-left:solid 1px rgba(180,180,180,.4);
        border-right:solid 1px rgba(180,180,180,.4);
        border-bottom:solid 1px rgba(180,180,180,.4);*/
    }
    .login_table input#username, .login_table input#password, .login_table input#securitycode {
        border: none;
        border-bottom: solid 1px rgba(180,180,180,.4);
        padding: 5px;
        margin-left: 10px;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    .login_table input#username:focus, .login_table input#password:focus, .login_table input#securitycode:focus {
        outline: none !important;
    }
    .login_table .trinputlogin {
        font-size: 1.2em;
        margin: 8px;
    }
    .login_table .tdinputlogin {
        background-color: transparent;
        /* border: 2px solid #ccc; */
        min-width: 220px;
        border-radius: 2px;
    }
    .login_table .tdinputlogin .fa {
        padding-left: 10px;
        width: 14px;
    }
    .login_table .tdinputlogin input#username, .login_table .tdinputlogin input#password {
        font-size: 1em;
    }
    .login_table .tdinputlogin input#securitycode {
        font-size: 1em;
    }
    .login_main_home {
        word-break: break-word;
    }
    .login_main_message {
        text-align: center;
        max-width: 570px;
        margin-bottom: 22px;
    }
    .login_main_message .error {
        /* border: 1px solid #caa; */
        padding: 10px;
    }
    div#login_left, div#login_right {
        display: inline-block;
        min-width: 245px;
        padding-top: 10px;
        padding-left: 16px;
        padding-right: 16px;
        text-align: center;
        vertical-align: middle;
    }
    div#login_right select#entity {
        margin-top: 10px;
    }
    table.login_table tr td table.none tr td {
        padding: 2px;
    }
    table.login_table_securitycode {
        border-spacing: 0px;
    }
    table.login_table_securitycode tr td {
        padding-left: 0px;
        padding-right: 4px;
    }
    #securitycode {
        min-width: 60px;
    }
    #img_securitycode {
        border: 1px solid #DDDDDD;
    }
    #img_logo, .img_logo {
        max-width: 170px;
        max-height: 90px;
    }

    div.backgroundsemitransparent {
        background:rgba(255,255,255,0.6);
        padding-left: 10px;
        padding-right: 10px;
    }
    div.login_block {
        position: absolute;
        text-align: right;
    right: 0;
        top: 0;
        line-height: 10px;
            }
    div.login_block a {
        color: #FFFFFF;
        display: inline-block;
    }
    div.login_block span.aversion {
            color: #FFFFFF;
        }
    div.login_block table {
        display: inline;
    }
    div.login {
        white-space:nowrap;
        font-weight: bold;
        float: right;
    }
    div.login a {
        color: #FFFFFF;
    }
    div.login a:hover {
        color: #FFFFFF;
        text-decoration:underline;
    }

/*------------------------------------------------------------------
[ Responsive ]*/

@media (max-width: 900px) {
    .login100-form {
        width: 100%;
    }

    .login100-more {
        display: none;
    }

    #img_logo {
        margin-top: 10%;
    }
}

@media (max-width: 576px) {
    .login100-form {
        padding-left: 15px;
        padding-right: 15px;
        padding-top: 10px;
    }

    .login100-more {
        display: none;
    }
}
    /*------------------------------------*\
#Main Panes
\*------------------------------------*/

    /*
*	PANES and CONTENT-DIVs
*/

    #mainContent,
    #leftContent .ui-layout-pane {
        overflow: auto;
        padding: 0;
    }

    #mainContent,
    #leftContent .ui-layout-center {
        overflow: auto;
        /* add scrolling to content-div */
        padding: 0;
        position: relative;
        /* contain floated or positioned elements */
    }


    #containerlayout .layout-with-no-border {
        border: 0 !important;
        border-width: 0 !important;
    }

    #containerlayout .layout-padding {
        padding: 2px !important;
    }

    #containerlayout .ui-layout-pane {
        /* all 'panes' */
        background-color: #fff;
        border: 1px solid #bbb;
        /* DO NOT add scrolling (or padding) to 'panes' that have a content-div,
otherwise you may get double-scrollbars - on the pane AND on the content-div
*/
        padding: 0;
        overflow: auto;
    }

    /* (scrolling) content-div inside pane allows for fixed header(s) and/or footer(s) */
    #containerlayout .ui-layout-content {
        overflow: auto;
        /* add scrolling to content-div */
        padding: 10px;
        position: relative;
        /* contain floated or positioned elements */
    }


    /**
* Toolbar ECM and Filemanager
*/

    .largebutton {
        background-repeat: repeat-x !important;
        border: 1px solid rgba(0, 0, 0, .32) !important;
        box-shadow: 4px 4px 4px rgba(0, 0, 0, .24);
        -moz-box-shadow: 4px 4px 4px rgba(0, 0, 0, .24);
        -webkit-box-shadow: 4px 4px 4px rgba(0, 0, 0, .24);
        padding: 0 4px 0 4px !important;
        margin-bottom: 1em;
    }

    a.toolbarbutton {
        height: 30px;
        margin-top: 0;
        margin-left: 4px;
        margin-right: 4px;
    }

    img.toolbarbutton {
        height: 30px;
        margin-top: 1px;
    }


    /**
* RESIZER-BARS
*/

    .ui-layout-resizer {
        /* all 'resizer-bars' */
        width: 8px !important;
    }

    .ui-layout-resizer-hover {
        /* affects both open and closed states */
    }

    /* NOTE: It looks best when 'hover' and 'dragging' are set to the same color,
otherwise color shifts while dragging when bar can't keep up with mouse */
    /*.ui-layout-resizer-open-hover ,*/
    /* hover-color to 'resize' */
    .ui-layout-resizer-dragging {
        /* resizer beging 'dragging' */
        background-color: #ddd;
        width: 8px;
    }

    .ui-layout-resizer-dragging {
        /* CLONED resizer being dragged */
        border-left: 1px solid #bbb;
        border-right: 1px solid #bbb;
    }

    /* NOTE: Add a 'dragging-limit' color to provide visual feedback when resizer hits min/max size limits */
    .ui-layout-resizer-dragging-limit {
        /* CLONED resizer at min or max size-limit */
        background-color: #e1a4a4;
        /* red */
    }

    .ui-layout-resizer-closed {
        background-color: #ddd;
    }

    .ui-layout-resizer-closed:hover {
        background-color: #edd;
    }

    .ui-layout-resizer-sliding {
        /* resizer when pane is 'slid open' */
        filter: alpha(opacity=10);
        opacity: .10;
        /* show only a slight shadow */
    }

    .ui-layout-resizer-sliding-hover {
        /* sliding resizer - hover */
        filter: alpha(opacity=100);
        opacity: 1;
        /* on-hover, show the resizer-bar normally */
    }

    /* sliding resizer - add 'outside-border' to resizer on-hover */
    /* this sample illustrates how to target specific panes and states */
    /*.ui-layout-resizer-north-sliding-hover	{ border-bottom-width:	1px; }
.ui-layout-resizer-south-sliding-hover	{ border-top-width:		 1px; }
.ui-layout-resizer-west-sliding-hover	 { border-right-width:	 1px; }
.ui-layout-resizer-east-sliding-hover	 { border-left-width:		1px; }
*/


    /**
* TOGGLER-BUTTONS
*/

    .ui-layout-toggler {
        background-color: #ddd;
        border-top: 1px solid #aaa;
        /* match pane-border */
        border-right: 1px solid #aaa;
        /* match pane-border */
        border-bottom: 1px solid #aaa;
        /* match pane-border */
        top: 5px !important;
            }

    .ui-layout-toggler-open {
        height: 54px !important;
        width: 7px !important;
        -moz-border-radius: 0 10px 10px 0;
        -webkit-border-radius: 0 10px 10px 0;
        border-radius: 0 10px 10px 0;
    }

    .ui-layout-toggler-closed {
        height: 54px !important;
        width: 7px !important;
        -moz-border-radius: 0 10px 10px 0;
        -webkit-border-radius: 0 10px 10px 0;
        border-radius: 0 10px 10px 0;
    }

    .ui-layout-toggler .content {
        /* style the text we put INSIDE the togglers */
        color: #666;
        font-size: 14px;
        font-weight: bold;
        width: 100%;
        padding-bottom: .35ex;
        /* to 'vertically center' text inside text-span */
    }

    /* hide the toggler-button when the pane is 'slid open' */
    .ui-layout-resizer-sliding ui-layout-toggler {
        display: none;
    }

    .ui-layout-north {
        height: 54px !important;
    }


    /**
* ECM
*/

    #containerlayout .ecm-layout-pane {
        /* all 'panes' */
        background-color: #fff;
        border: 1px solid #bbb;
        /* DO NOT add scrolling (or padding) to 'panes' that have a content-div,
    otherwise you may get double-scrollbars - on the pane AND on the content-div
    */
        overflow: auto;
        padding: 0;
    }

    /* (scrolling) content-div inside pane allows for fixed header(s) and/or footer(s) */
    #containerlayout .ecm-layout-content {
        overflow: auto;
        /* add scrolling to content-div */
        padding: 10px;
        position: relative;
        /* contain floated or positioned elements */
    }

    .ecm-layout-toggler {
        background-color: #ccc;
        border-top: 1px solid #aaa;
        /* match pane-border */
        border-right: 1px solid #aaa;
        /* match pane-border */
        border-bottom: 1px solid #aaa;
        /* match pane-border */
    }

    .ecm-layout-toggler-open {
        border-radius: 0 10px 10px 0;
        -moz-border-radius: 0 10px 10px 0;
        -webkit-border-radius: 0 10px 10px 0;
        height: 48px !important;
        width: 6px !important;
    }

    .ecm-layout-toggler-closed {
        height: 48px !important;
        width: 6px !important;
    }

    .ecm-layout-toggler .content {
        /* style the text we put INSIDE the togglers */
        color: #666;
        font-size: 14px;
        font-weight: bold;
        width: 100%;
        padding-bottom: .35ex;
        /* to 'vertically center' text inside text-span */
    }

    #ecm-layout-west-resizer {
        width: 6px !important;
    }

    .ecm-layout-resizer {
        /* all 'resizer-bars' */
        border: 1px solid #bbb;
        border-width: 0;
    }

    .ecm-layout-resizer-closed {}

    .ecm-in-layout-center {
        border-left: 1px !important;
        border-right: 0 !important;
        border-top: 0 !important;
    }

    .ecm-in-layout-south {
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 0 !important;
        padding: 4px 0 4px 4px !important;
    }


    /*------------------------------------*\
#Tabs
\*------------------------------------*/

    div.tabs {
        text-align: left;
        margin-top: 15px;
        margin-left: 6px;
        margin-bottom: -3px;
        padding-left: 3px;
        padding-right: 6px;
        clear: both;
        font-weight: normal;
        height: 100%;
    }

    div.tabsElem {
        margin-top: 1px;
        margin-left: 5px;
    }

    /* To avoid overlap of tabs when not browser */

    div.tabBar {
        background-color: #FFFFFF;
        border: 1px solid rgba(0, 0, 0, .16);
        box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        color: #444444;
        margin-bottom: 10px;
        padding-top: 8px;
        padding-left: 8px;
        padding-right: 8px;
        padding-bottom: 8px;
        width: auto;
    }

    div.tabsAction {
        margin: 20px 0 10px 0;
        padding: 0;
        text-align: right;
    }

    a.tabTitle {
        color: #666;
        font-weight: normal;
        margin: 0 10px;
        padding: 4px 6px;
        text-decoration: none;
        white-space: nowrap;
    }

    .imgTabTitle {
        max-height: 14px;
    }

    a.tab {
        color: #444444;
        font-weight: normal;
    }

    a.tab:hover,
    a.tab:focus {
        background-color: rgba(0, 0, 0, .16);
        color: #0072CE;
        paddinf
    }

    a.tabimage {
        color: #434956;
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        text-decoration: none;
        white-space: nowrap;
    }

    td.tab {
        background-color: #FFFFFF;
        border: 1px solid rgba(0, 0, 0, .16) !important;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        margin: 5px;
        padding: 0 .5em;
    }

    table.notopnoleft td.liste_titre {
        border: 1px solid rgba(0, 0, 0, .16) !important;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        margin: 0 0 2px 0;
        padding: .8em .5em !important;
    }

    span.tabspan {
        background-color: #dee7ec;
        color: #434956;
        margin: 0 .2em;
        padding: 0 6px;
        text-decoration: none;
        white-space: nowrap;
    }

    div.tabBar ul li {
        margin-left: 30px !important;
    }

    /* Payment Screen : Pointer cursor in the autofill image */
    .AutoFillAmount {
        cursor: pointer;
    }

    div.popuptabset {
        background-color: #FFFFFF;
        padding: 5px;
        border: 1px solid #e5e5e5;
    }

    div.popuptab {
        padding-top: 5px;
        padding-bottom: 5px;
        padding-left: 5px;
        padding-right: 5px;
    }

    @media only screen and (max-width: 570px) {}

    /* ============================================================================== */
    /* Buttons for actions                                                            */
    /* ============================================================================== */

    div.tabsAction {
        margin: 20px 0em 30px 0em;
        padding: 0em 0em;
        text-align: right;
    }

    div.tabsActionNoBottom {
        margin-bottom: 0px;
    }

    div.tabsAction>a {
        margin-bottom: 16px !important;
    }

    a.tabTitle {
        color: rgba(0, 0, 0, 0.4) !important;
        text-shadow: 1px 1px 1px #ffffff;
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        font-weight: normal !important;
        padding: 4px 6px 2px 0px;
        margin-right: 10px;
        text-decoration: none;
        white-space: nowrap;
    }

    .tabTitleText {
        display: none;
    }

    .imgTabTitle {
        max-height: 14px;
    }

    div.tabs div.tabsElem:first-of-type a.tab {
        margin-left: 0px !important;
    }

    a.tabunactive {
        color: var(--colortextlink) !important;
    }

    a.tab:link,
    a.tab:visited,
    a.tab:hover,
    a.tab#active {
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        padding: 12px 14px 13px;
        text-decoration: none;
        white-space: nowrap;

        background-image: none !important;
    }

    .tabactive,
    a.tab#active {
        background-color: #FFFFFF;
        margin: 0 0.2em 0 0.2em !important;
        text-decoration: none;

        border: 1px solid rgba(0, 0, 0, .16);
        border-bottom: none;
    }

    .tabunactive,
    a.tab#unactive {
        border: 1px solid rgba(0, 0, 0, .16);
        border-bottom: 0px !important;
    }

    a.tabimage {
        color: #434956;
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        text-decoration: none;
        white-space: nowrap;
    }

    td.tab {
        background: #dee7ec;
    }

    span.tabspan {
        background: #dee7ec;
        color: #434956;
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        padding: 0px 6px;
        margin: 0em 0.2em;
        text-decoration: none;
        white-space: nowrap;
        -webkit-border-radius: 4px 4px 0px 0px;
        border-radius: 4px 4px 0px 0px;

        border-right: 1px solid #555555;
        border-left: 1px solid #D8D8D8;
        border-top: 1px solid #D8D8D8;
    }

    /* ============================================================================== */
    /* Buttons for actions                                                            */
    /* ============================================================================== */
    /* <style type="text/css" > */



/* ============================================================================== */
/* Buttons for actions                                                            */
/* ============================================================================== */

div.divButAction {
    margin-bottom: 1.4em;
}
div.tabsAction > a.butAction, div.tabsAction > a.butActionRefused, div.tabsAction > a.butActionDelete,
div.tabsAction > span.butAction, div.tabsAction > span.butActionRefused, div.tabsAction > span.butActionDelete {
    margin-bottom: 1.4em !important;
}
div.tabsActionNoBottom > a.butAction, div.tabsActionNoBottom > a.butActionRefused {
    margin-bottom: 0 !important;
}

span.butAction, span.butActionDelete {
    cursor: pointer;
}

.butAction {
    background: #0072CE;
}
.butActionRefused, .butAction, .butAction:link, .butAction:visited, .butAction:hover, .butAction:active, .butActionDelete, .butActionDelete:link, .butActionDelete:visited, .butActionDelete:hover, .butActionDelete:active {
    text-decoration: none;
    /* text-transform: capitalize; */
    font-weight: bold;

    margin: 0em 0.9em !important;
    padding: 0.6em 0.7em;
    font-family: "Open Sans",Tahoma,Arial,Helvetica;
    display: inline-block;
    text-align: center;
    cursor: pointer;
    color: #fff;
    background: #0072CE;
    border: 0px;

    border-top-right-radius: 0.30em !important;
    border-bottom-right-radius: 0.30em !important;
    border-top-left-radius: 0.30em !important;
    border-bottom-left-radius: 0.30em !important;
}

.butActionNew, .butActionNewRefused, .butActionNew:link, .butActionNew:visited, .butActionNew:hover, .butActionNew:active {
    text-decoration: none;
    /* text-transform: capitalize; */
    font-weight: normal;

    margin: 0em 0.3em 0 0.3em !important;
    padding: 0.2em 0.7em 0.3em;
    font-family: "Open Sans",Tahoma,Arial,Helvetica;
    display: inline-block;
    /* text-align: center; New button are on right of screen */
    background: #0062B3;
    cursor: pointer;
}

.tableforfieldcreate a.butActionNew>span.fa-plus-circle, .tableforfieldcreate a.butActionNew>span.fa-plus-circle:hover,
.tableforfieldedit a.butActionNew>span.fa-plus-circle, .tableforfieldedit a.butActionNew>span.fa-plus-circle:hover,
span.butActionNew>span.fa-plus-circle, span.butActionNew>span.fa-plus-circle:hover,
a.butActionNewRefused>span.fa-plus-circle, a.butActionNewRefused>span.fa-plus-circle:hover,
span.butActionNewRefused>span.fa-plus-circle, span.butActionNewRefused>span.fa-plus-circle:hover,
a.butActionNew>span.fa-list-alt, a.butActionNew>span.fa-list-alt:hover,
span.butActionNew>span.fa-list-alt, span.butActionNew>span.fa-list-alt:hover,
a.butActionNewRefused>span.fa-list-alt, a.butActionNewRefused>span.fa-list-alt:hover,
span.butActionNewRefused>span.fa-list-alt, span.butActionNewRefused>span.fa-list-alt:hover
{
	font-size: 1em;
	padding-left: 0px;
}

/*a.butActionNew>span.fa-plus-circle, a.butActionNew>span.fa-plus-circle:hover,
span.butActionNew>span.fa-plus-circle, span.butActionNew>span.fa-plus-circle:hover,
a.butActionNewRefused>span.fa-plus-circle, a.butActionNewRefused>span.fa-plus-circle:hover,
span.butActionNewRefused>span.fa-plus-circle, span.butActionNewRefused>span.fa-plus-circle:hover,
a.butActionNew>span.fa-list-alt, a.butActionNew>span.fa-list-alt:hover,
span.butActionNew>span.fa-list-alt, span.butActionNew>span.fa-list-alt:hover,
a.butActionNewRefused>span.fa-list-alt, a.butActionNewRefused>span.fa-list-alt:hover,
span.butActionNewRefused>span.fa-list-alt, span.butActionNewRefused>span.fa-list-alt:hover,
a.butActionNew>span.fa-comment-dots, a.butActionNew>span.fa-comment-dots:hover,
span.butActionNew>span.fa-comment-dots, span.butActionNew>span.fa-comment-dots:hover,
a.butActionNewRefused>span.fa-comment-dots, a.butActionNewRefused>span.fa-comment-dots:hover,
span.butActionNewRefused>span.fa-comment-dots, span.butActionNewRefused>span.fa-comment-dots:hover,*/
a.butActionNew>span.fa, a.butActionNew>span.fa:hover,
span.butActionNew>span.fa, span.butActionNew>span.fa:hover,
a.butActionNewRefused>span.fa, a.butActionNewRefused>span.fa:hover,
span.butActionNewRefused>span.fa, span.butActionNewRefused>span.fa:hover
{
	padding-left: 6px;
	font-size: 1.5em;
	border: none;
	box-shadow: none; webkit-box-shadow: none;
}

.butAction:hover   {
    background: #0062B3;
    -webkit-box-shadow: 0px 1px 4px 1px rgba(50, 50, 50, 0.4), 0px 0px 0px rgba(60,60,60,0.1);
    box-shadow: 0px 1px 4px 1px rgba(50, 50, 50, 0.4), 0px 0px 0px rgba(60,60,60,0.1);
}
.butActionNew:hover   {
    text-decoration: underline;
    box-shadow: unset !important;
}

.butActionDelete, .butActionDelete:link, .butActionDelete:visited, .butActionDelete:hover, .butActionDelete:active, .buttonDelete {
    background: #E74C3C;
    color: #ffffff;
}

.butActionDelete:hover {
    background: #E3301C;
    -webkit-box-shadow: 0px 1px 4px 1px rgba(50, 50, 50, 0.4), 0px 0px 0px rgba(60,60,60,0.1);
    box-shadow: 0px 1px 4px 1px rgba(50, 50, 50, 0.4), 0px 0px 0px rgba(60,60,60,0.1);
}

.butActionRefused {
    text-decoration: none !important;
    /* text-transform: capitalize; */
    font-weight: bold !important;

    white-space: nowrap !important;
    cursor: not-allowed !important;
    margin: 0em 0.9em;
    padding: 0.6em 0.7em;
    font-family: "Open Sans",Tahoma,Arial,Helvetica !important;
    display: inline-block;
    text-align: center;
    cursor: pointer;
    color: #999 !important;
    background: unset;
    border: 0px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-box-shadow: 0px 1px 4px 1px rgba(50, 50, 50, 0.4), 0px 0px 0px rgba(60,60,60,0.1);
    box-shadow: 0px 1px 4px 1px rgba(50, 50, 50, 0.4), 0px 0px 0px rgba(60,60,60,0.1);
}

.butActionNewRefused, .butActionNewRefused:link, .butActionNewRefused:visited, .butActionNewRefused:hover, .butActionNewRefused:active {
    text-decoration: none !important;
    /* text-transform: capitalize; */
    font-weight: normal !important;

    white-space: nowrap !important;
    cursor: not-allowed !important;
    margin: 0em 0.9em;
    padding: 0.2em 0.7em;
    font-family: "Open Sans",Tahoma,Arial,Helvetica !important;
    display: inline-block;
    /* text-align: center;  New button are on right of screen */
    cursor: pointer;
    color: #999 !important;
    padding-top: 0.2em;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.butActionTransparent {
    color: #222 ! important;
    background-color: transparent ! important;
}


/*
TITLE BUTTON
 */
/* 
    color y background-color del boton modificado por ricardo130
*/
.btnTitle, a.btnTitle {
    display: inline-block;
    border-radius: 5px;
    padding: 4px 12px 4px 12px;
    font-weight: 400;
    /* line-height: 1; */
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    box-shadow: none;
    text-decoration: none;
    position: relative;
    margin: 0 0 0 10px;
    min-width: 80px;
    text-align: center;
    /* color: rgb(40,40,40); */
    color: #ffffff;
    border: none;
    font-size: 12px;
    font-weight: 300;
    /* background-color: #fbfbfb; */
    background-color: #0072CE;
	border: 1px solid #fff;
}

.btnTitle > .btnTitle-icon{

}

.btnTitle > .btnTitle-label{
    color: #ffffff;
}
.btnTitle:hover, a.btnTitle:hover {
	border: 0px;
    position: relative;
    margin: 0 0 0 10px;
    text-align: center;
    color: #ffffff;
    /* background-color: #0072CE; */
    background-color: #0062B3;
    font-size: 12px;
    text-decoration: none;
    box-shadow: none;
}

.btnTitle:hover, a.btnTitle:hover {
    background-color: #0062B3 !important;
    color: #ffffff !important;
}


.btnTitle.refused, a.btnTitle.refused, .btnTitle.refused:hover, a.btnTitle.refused:hover {
    color: #ffffff;
    cursor: not-allowed;
    background-color: #E74C3C;
}

.btnTitle:hover .btnTitle-label{
    color: #ffffff;
}

.btnTitle.refused .btnTitle-label, .btnTitle.refused:hover .btnTitle-label{
    color: #8a8a8a;
}

.btnTitle>.fa,
.btnTitle>.fal,
.btnTitle>.far {
    font-size: 20px;
    display: block;
}

div.pagination li:first-child a.btnTitle{
    margin-left: 10px;
}


.imgforviewmode {
	color: #ffffff;
}

/* rule to reduce top menu - 2nd reduction: Reduce width of top menu icons again */
@media only screen and (max-width: 130px)	/* reduction 2 */
{
	.btnTitle, a.btnTitle {
	    display: inline-block;
	    padding: 4px 4px 4px 4px;
		min-width: unset;
	}
}



/*
 * BTN LINK
 */

.btn-link{
	margin-right: 5px;
	border: 1px solid #ddd;
	color: #333;
	padding: 5px 10px;
	border-radius:1em;
	text-decoration: none !important;
}

.btn-link:hover{
	background-color: #ddd;
	border: 1px solid #ddd;
}

    /* ============================================================================== */
    /* Tables                                                                         */
    /* ============================================================================== */
    .allwidth {
        width: 100%;
    }

    #undertopmenu {
        background-repeat: repeat-x;
        margin-top: 0px;
    }

    .paddingrightonly {
        border-collapse: collapse;
        border: 0;
        margin-left: 0;
        spacing-left: 0;
        padding-left: 0;
        padding-right: 4px;
    }

    .nocellnopadd {
        list-style-type: none;
        margin: 0 !important;
        padding: 0 !important;
    }

    .notopnoleft {
        border: 0;
        border-collapse: collapse;
        margin-bottom: 10px;
        padding-top: 0;
        padding-left: 0;
        padding-right: 16px;
        padding-bottom: 4px;
    }

    .notopnoleftnoright {
        border: 0;
        border-collapse: collapse;
        margin: 0;
        padding-top: 0;
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 4px;
    }

    table.border {
        border: 1px solid #f2f2f2;
        border-collapse: collapse;
    }

    table.border td {
        border: 1px solid #E0E0E0;
        border-collapse: collapse;
        padding: 5px 2px 5px 2px;
        vertical-align: middle;
    }

    table.border td img {
        margin: 0 .1em;
    }

    td.border {
        border: 1px solid #000;
    }

    /* Main boxes */

    table.noborder,
    table.formdoc,
    div.noborder {
        border: 1px solid rgba(0, 0, 0, .16);
        border-collapse: separate !important;
        border-spacing: 0;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .08);
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .08);
        margin: 0 0 2px 0;
        /*padding: 1px 2px 1px 2px;*/
        width: 100%;
    }

    table.noborder[summary="list_of_modules"] tr.oddeven {
        line-height: 2.2em;
    }

    table.noborder tr,
    div.noborder form {
        line-height: 1.7em;
    }

    /* boxes padding */
    /* table titles main page */
    table.noborder th {
        padding: 3px;
    }

    table.noborder th:first-child {
        padding-left: 10px;
    }

    table.noborder th:last-child {
        padding-right: 10px;
    }

    /* table content all pages */
    table.noborder td,
    div.noborder form,
    div.noborder form div,
    table.tableforservicepart1 td,
    table.tableforservicepart2 td {
        padding: 4px 6px 4px 6px;
        /* t r b l */
        vertical-align: unset;
    }

    table.noborder td:first-child {
        padding-left: 10px !important;
    }

    table.noborder td:last-child,
    div.noborder form div:last-child {
        padding-right: 10px;
    }

    /* titles others pages */
    table.noborder .liste_titre td {
        padding: 3px;
    }

    table.noborder .liste_titre td:first-child {
        padding-left: 10px;
    }

    table.noborder .liste_titre td:last-child {
        padding-right: 10px;
    }

    form#searchFormList div.liste_titre {
        padding: 3px 10px;
    }

    .liste_titre_filter {
        background: #0072CE !important;
    }

    /* table liste -bank- e-mailing */
    table.liste .liste_titre td,
    table.liste .liste_total td {}

    table.liste .liste_titre th {
        padding: 5px;
    }


    /* templates avec form au lieu de table */
    div.noborder form div {
        padding: 3px;
    }

    div.noborder form>div:first-child {
        padding-left: 10px;
    }

    div.noborder form div:last-child {
        padding-right: 10px;
    }

    table.nobordernopadding td img {
        margin-left: .2em;
    }

    .flat+img {
        margin-left: .4em;
    }

    table.nobordernopadding {
        border-collapse: collapse !important;
        border: 0;
    }

    table.nobordernopadding tr {
        border: 0 !important;
        padding: 0;
    }

    table.nobordernopadding tr td {
        border: 0 !important;
        padding: 0 0px 0 0;
        vertical-align: unset !important;
    }

    table.border tr td table.nobordernopadding tr td {
        padding-top: 0;
        padding-bottom: 0;
    }

    td.borderright {
        border: none;
        /* to erase value for table.nobordernopadding td */
        border-right-width: 1px !important;
        border-right-color: #BBB !important;
        border-right-style: solid !important;
    }


    /* For lists */
    table.liste {
        border: 1px solid rgba(0, 0, 0, .42);
        border-collapse: collapse;
        margin-bottom: 2px;
        margin-top: 2px;
        width: 100%;
    }

    table.liste .oddeven td {
        padding: 5px 10px;
    }

    table .liste_titre td {
        padding: 2px;
    }



    table.liste td a img {
        vertical-align: middle;
    }


    .tagtable,
    .table-border {
        display: table;
    }

    .tagtr,
    .table-border-row {
        display: table-row;
    }

    .tagtd,
    .table-border-col,
    .table-key-border-col,
    .table-val-border-col {
        display: table-cell;
    }

    .confirmquestions .tagtr .tagtd:not(:first-child) {
        padding-left: 10px;
    }


    tr.liste_titre,
    tr.liste_titre_sel,
    form.liste_titre,
    form.liste_titre_sel {
        height: 20px !important;
    }

    div.liste_titre {
        padding: 6px;
        margin-bottom: 12px;
    }

    tr.liste_titre,
    tr.liste_titre_sel,
    form.liste_titre,
    form.liste_titre_sel {
        background-color: #0072CE;
        color: #f4f4f4;
        font-family: Oswald,Verdana,Arial,Helvetica;
        font-size: 1em;
        font-weight: normal;
        line-height: 1em;
        text-align: left;
        white-space: normal;
    }

    /* background-color de la primera barra de leads cambiada por ricardo130 */
    div.liste_titre {
        background-color: #ffffff;
        color: #0072CE;
    }

    div.liste_titre a,
    tr.liste_titre a,
    tr.liste_titre th a,
    tr.liste_titre_sel a,
    th.liste_titre_sel a,
    form.liste_titre a,
    form.liste_titre_sel a {
        color: #f4f4f4;
    }

    .liste_titre_sel {
        font-weight: bold !important;
    }

    tr.liste_titre th,
    th.liste_titre,
    tr.liste_titre td,
    td.liste_titre,
    form.liste_titre div,
    div.liste_titre {
        font-family: Oswald,Verdana,Arial,Helvetica;
        font-weight: normal;
        /* border-bottom: 1px solid #FDFFFF;*/
        white-space: normal;
        padding-left: 5px;
    }

    table td.liste_titre a:link,
    table td.liste_titre a:visited,
    table td.liste_titre a:active {
        color: #eee;
    }

    table td.liste_titre a:hover {
        color: #0072CE;
    }

    table.noborder tr td a:link,
    table.noborder tr td a:visited,
    table.noborder tr td a:active,
    table.noborder tr th a:link,
    table.noborder tr th a:visited,
    table.noborder tr th a:active {
        color: #444444;
        font-family: Oswald,Verdana,Arial,Helvetica;
    }

    table.noborder tr td a:hover {
        color: #222222;
    }

    table.noborder tr td a.button,
    table.noborder tr td a.button:hover {
        color: #fff;
    }


    .liste tr.liste_titre:nth-child(3) {
        background-color: #333;
    }

    tr.liste_titre:nth-child(3) {
        background-color: #333;
    }

    /* 
    background-color cambiado de #333 a #0072CE 
    modificado por ricardo130 
*/
    tr.liste_titre_sel th,
    /* th.liste_titre_sel, */
    tr.liste_titre_sel td,
    td.liste_titre_sel,
    form.liste_titre_sel div {
        background-color: #0062B3;
        color: #f7f7f7;
        font-weight: normal;
        text-decoration: none;
        white-space: normal;
    }

    /* 
    color para columna seleccionada
    por ricardo130
*/
    th.liste_titre_sel {
        background-color: #ffffff;
        border: 1px solid #0062B3;
        color: #0072CE;
    }

    th.liste_titre_sel a.reposition {
        color: #0072CE !important;
    }

    tr.liste_titre_sel {
        border: 1px solid #0062B3;
        color: #0072CE;
    }

    th.liste_titre>img,
    th.liste_titre_sel>img {
        padding-left: 5px;
    }

    input.liste_titre {
        background: transparent;
        border: 0;
        margin: inherit;
        padding: 0;
    }

    tr.liste_total,
    form.liste_total {
        background-color: #FFFFFF;
    }

    tr.liste_total td,
    form.liste_total div {
        height: 20px;
        border-top: 1px solid rgba(0, 0, 0, .42);
        color: #0072CE;
        font-weight: normal;
        white-space: normal;
        padding: 0 5px 0 5px;
    }

    tr.liste_total td[align=right],
    form.liste_total td[align=right] {
        color: #3c6;
        font-weight: bold;
    }

    /* Disable shadows */
    .noshadow,
    div.tabBar .noborder {
        box-shadow: 0 0 0 rgba(0, 0, 0, .24) !important;
        -moz-box-shadow: 0 0 0 rgba(0, 0, 0, .24) !important;
        -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .24) !important;
    }

    div .tdtop {
        vertical-align: top !important;
        padding-top: 5px !important;
        padding-bottom: 0px !important;
    }

    #tablelines tr.liste_titre td,
    .paymenttable tr.liste_titre td,
    .margintable tr.liste_titre td,
    .tableforservicepart1 tr.liste_titre td {
        border-bottom: 1px solid #AAA !important;
    }

    #tablelines tr td {
        height: unset;
    }

    /*
 *  Boxes
 */

    .box {
        overflow-x: auto;
        min-height: 40px;
        padding-right: 0px;
        padding-left: 0px;
        /*padding-bottom: 25px;*/
        padding-bottom: 10px;
    }

    .ficheaddleft div.boxstats,
    .ficheaddright div.boxstats {
        border: none;
    }

    .boxstatsborder {
        /* border: 1px solid #CCC !important; */
    }

    .boxstats,
    .boxstats130 {
        display: inline-block;
        margin-left: 8px;
        margin-right: 8px;
        margin-top: 5px;
        margin-bottom: 5px;
        text-align: center;

        background: #fcfcfc;
        border: 1px solid #eee;
        border-left: 6px solid #0072CE;
        box-shadow: 1px 1px 8px #ddd;
        border-radius: 0px;
    }

    .boxstats,
    .boxstats130,
    .boxstatscontent {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .boxstats {
        width: 100%;
        height: 59px;
        /* padding: 3px; */
    }

    .boxstats {
        padding-left: 3px;
        padding-right: 3px;
        padding-top: 2px;
        padding-bottom: 2px;
        width: 118px;
    }

    .tabBar .fichehalfright .boxstats {
        padding-top: 8px;
        padding-bottom: 4px;
    }

    .boxstatscontent {
        padding: 3px;
    }

    .boxstatsempty {
        width: 121px;
        padding-left: 3px;
        padding-right: 3px;
        margin-left: 8px;
        margin-right: 8px;
    }

    .boxstats150empty {
        width: 158px;
        padding-left: 3px;
        padding-right: 3px;
        margin-left: 8px;
        margin-right: 8px;
    }

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

        .boxstats,
        .boxstats130 {
            margin: 3px;
            border: 1px solid rgba(0, 0, 0, .24);
            box-shadow: none;
            background: #ddd;
        }

        .thumbstat {
            flex: 1 1 110px;
        }

        .thumbstat150 {
            flex: 1 1 110px;
        }

        .dashboardlineindicator {
            float: left;
            padding-left: 5px;
        }

        .boxstats130 {
            width: 148px;
        }

        .boxstats {
            width: 100px;
        }
    }

    .boxstats:hover {
        box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.20);
    }

    span.boxstatstext {
        opacity: 0.7;
        line-height: 18px;
        color: #000;
    }

    span.boxstatstext img,
    a.dashboardlineindicatorlate img {
        border: 0;
    }

    a img {
        border: 0;
    }

    .boxstatsindicator.thumbstat150 {
        /* If we remove this, box position is ko on ipad */
        display: inline-flex;
    }

    span.boxstatsindicator {
        font-size: 130%;
        font-weight: normal;
        line-height: 29px;
    }

    span.dashboardlineindicator,
    span.dashboardlineindicatorlate {
        font-size: 130%;
        font-weight: normal;
    }

    a.dashboardlineindicatorlate:hover {
        text-decoration: none;
    }

    .dashboardlineindicatorlate img {
        width: 16px;
    }

    span.dashboardlineok {
        color: #008800;
    }

    span.dashboardlineko {
        color: #FFF;
        /*color: #8c4446 ! important;
    padding-left: 1px;*/

        font-size: 80%;
    }

    .dashboardlinelatecoin {
        float: right;
        position: relative;
        text-align: right;
        top: -27px;
        right: 2px;
        padding: 0px 5px 0px 5px;
        border-radius: .25em;

        background-color: #9f4705;
    }

    .imglatecoin {
        padding: 1px 3px 1px 1px;
        margin-left: 4px;
        margin-right: 2px;
        background-color: #8c4446;
        color: #FFFFFF ! important;
        border-radius: .25em;
        display: inline-block;
        vertical-align: middle;
    }

    .boxtable {
        margin-bottom: 8px !important;
        border-bottom-width: 1px;

        border-top: 2px solid rgb(200,200,200);
        /* border-top: 2px solid rgb(0,127,255) !important; */
    }

    table.noborder.boxtable tr td {
        height: unset;
    }

    .boxtablenotop {
        border-top-width: 0 !important;
    }

    .boxtablenobottom {
        border-bottom-width: 0 !important;
    }

    .boxtable .fichehalfright,
    .boxtable .fichehalfleft {
        min-width: 275px;
        /* increasing this, make chart on box not side by side on laptops */
    }

    .tdboxstats {
        text-align: center;
    }

    .boxworkingboard .tdboxstats {
        padding-left: 1px !important;
        padding-right: 1px !important;
    }

    a.valignmiddle.dashboardlineindicator {
        line-height: 30px;
    }

    tr.box_titre {
        height: 26px;

        /* TO MATCH BOOTSTRAP */
        /*background: #ddd;
    color: #000 !important;*/

        /* TO MATCH ELDY */
        background: rgb(230,230,230) color: rgb(444);
        font-family: "Open Sans",Tahoma,Arial,Helvetica, sans-serif;
        font-weight: bold;
        border-bottom: 1px solid #FDFFFF;
        white-space: nowrap;
    }

    tr.box_titre td.boxclose {
        width: 90px;
    }

    img.boxhandle,
    img.boxclose {
        padding-left: 5px;
    }

    .formboxfilter {
        vertical-align: middle;
        margin-bottom: 6px;
    }

    .formboxfilter input[type=image] {
        top: 5px;
        position: relative;
    }

    .boxfilter {
        margin-bottom: 2px;
        margin-right: 1px;
    }

    .prod_entry_mode_free,
    .prod_entry_mode_predef {
        height: 26px !important;
        vertical-align: middle;
    }

    .modulebuilderbox {
        border: 1px solid #888;
        padding: 16px;
    }

    /*
*  External web site
*/

    .framecontent {
        width: 100%;
        height: 100%;
    }

    .framecontent iframe {
        width: 100%;
        height: 100%;
    }



    /*
*  Other
*/
    .opened-dash-board-wrap {
        margin-bottom: 25px;
    }

    div.boximport {
        min-height: unset;
    }

    .product_line_stock_ok {
        color: #33cc66;
    }

    .product_line_stock_too_low {
        color: #f07b6e;
    }

    .fieldrequired {
        color: #444444;
        font-weight: bold;
    }

    .widthpictotitle {
        width: 40px;
        font-size: 1.5em;
        text-align: left;
    }

    .dolgraphtitle {
        margin-top: 6px;
        margin-bottom: 4px;
    }

    .dolgraphtitlecssboxes {
        /* margin: 0px; */
    }

    .legendColorBox,
    .legendLabel {
        border: none !important;
    }

    div.dolgraph div.legend,
    div.dolgraph div.legend div {
        background-color: rgba(255, 255, 255, 0) !important;
    }

    div.dolgraph div.legend table tbody tr {
        height: auto;
    }

    td.legendColorBox {
        padding: 2px 2px 2px 0 !important;
    }

    td.legendLabel {
        padding: 2px 2px 2px 0 !important;
    }

    label.radioprivate {
        white-space: nowrap;
    }

    .photo {
        border: 0px;
    }

    .photowithmargin {
        margin-bottom: 2px;
        margin-top: 2px;
    }

    .photowithborder {
        border: 1px solid #f0f0f0;
    }

    .photointoolitp {
        margin-top: 8px;
        float: left;
        /*text-align: center; */
    }

    .photodelete {
        margin-top: 6px !important;
    }

    .nographyet {
        content: url(/htdocs/theme/oblyon/img/nographyet.svg);
        display: inline-block;
        opacity: 0.1;
        background-repeat: no-repeat;
    }

    .nographyettext {
        opacity: 0.5;
    }

    table.notopnoleftnoright div.titre {
        font-size: 13px;
        text-transform: uppercase;
    }

    div.titre {
        color: #0072CE;
        font-weight: bold;
        font-size: 1.1em;
        text-decoration: none;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    table.table-fiche-title .col-title div.titre {
        line-height: 40px;
    }

    table.table-fiche-title {
        margin-bottom: 5px;
    }


    div.backgreypublicpayment {
        background-color: #f0f0f0;
        padding: 20px;
        border-bottom: 1px solid #ddd;
    }

    .backgreypublicpayment a {
        color: #222 !important;
    }

    .poweredbypublicpayment {
        float: right;
        top: 8px;
        right: 8px;
        position: absolute;
        font-size: 0.8em;
        color: #222;
        opacity: 0.3;
    }

    #dolpaymenttable {
        min-width: 320px;
        font-size: 16px;
    }

    /* Width must have min to make stripe input area visible */
    #tablepublicpayment {
        border: 1px solid #CCCCCC !important;
        width: 100%;
        padding: 20px;
    }

    #tablepublicpayment .CTableRow1 {
        background-color: #F0F0F0 !important;
    }

    #tablepublicpayment tr.liste_total {
        border-bottom: 1px solid #CCCCCC !important;
    }

    #tablepublicpayment tr.liste_total td {
        border-top: none;
    }

    div#login_left,
    div#login_right {
        min-width: 150px !important;
        max-width: 200px !important;
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    div.login_block {
        height: 40px !important;
    }

    .divmainbodylarge {
        margin-left: 40px;
        margin-right: 40px;
    }

    #divsubscribe {
        max-width: 900px;
    }

    #tablesubscribe {
        width: 100%;
    }

    div#card-element {
        border: 1px solid #ccc;
    }

    div#card-errors {
        color: #fa755a;
        text-align: center;
        padding-top: 3px;
        max-width: 320px;
    }

    /*
*   Liens Payes/Non payes
*/

    a.normal:link {
        font-weight: normal
    }

    a.normal:visited {
        font-weight: normal
    }

    a.normal:active {
        font-weight: normal
    }

    a.normal:hover {
        font-weight: normal
    }

    a.impayee:link {
        font-weight: bold;
        color: #550000;
    }

    a.impayee:visited {
        font-weight: bold;
        color: #550000;
    }

    a.impayee:active {
        font-weight: bold;
        color: #550000;
    }

    a.impayee:hover {
        font-weight: bold;
        color: #550000;
    }



    /*------------------------------------*\
#Form confirmation
\*------------------------------------*/

    /**
* When Ajax JQuery is used
*/

    .ui-dialog-titlebar {}

    .ui-dialog-content {
        font-size: 14px !important;
    }


    /**
* When HTML is used
*/

    table.valid {
        background-color: #f07b6e;
        border: 1px solid #e0796e;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        margin: .5em 0em;
        padding: 1.2em 1.5em;
    }

    table.valid img {
        vertical-align: sub;
    }

    .validtitre {
        font-weight: bold;
    }

    /*------------------------------------*\
#Tooltips
\*------------------------------------*/
    /* For tooltip using dialog */
    .ui-dialog.highlight.ui-widget.ui-widget-content.ui-front {
        z-index: 97;
    }

    div.ui-tooltip {
        max-width: 600px !important;
    }

    .mytooltip {
        width: 450px;
        border-top: solid 1px #BBBBBB;
        border-left: solid 1px #BBBBBB;
        border-right: solid 1px #444444;
        border-bottom: solid 1px #444444;
        padding: 5px 20px;
        border-radius: 0;
        box-shadow: 0 0 4px grey;
        margin: 2px;
        font-stretch: condensed;
    }

    /*------------------------------------*\
#Calc Module
\*------------------------------------*/

    #imageCalc {}

    .login_block_elem img.calculator-trigger,
    .login_block_other img.calculator-trigger {
        display: block;
        margin: 0 !important;
        padding: 12px !important;
    }

    .calculator-popup {
        top: 56px !important;
        width: 260px !important;
    }


    /*------------------------------------*\
#BreadCrumb Module
\*------------------------------------*/

    .breadCrumb {
        border: none !important;
        margin-bottom: 10px;
        /* margin-left: 20px;
    margin-right: 15px;*/
    }

    /* ============================================================================== */
    /* Calendar                                                                       */
    /* ============================================================================== */

    .ui-datepicker-calendar .ui-state-default,
    .ui-datepicker-calendar .ui-widget-content .ui-state-default,
    .ui-datepicker-calendar .ui-widget-header .ui-state-default,
    .ui-datepicker-calendar .ui-button,
    html .ui-datepicker-calendar .ui-button.ui-state-disabled:hover,
    html .ui-button.ui-state-disabled:active {
        border: unset;
    }

    img.datecallink {
        padding-right: 2px !important;
    }

    .ui-datepicker-trigger {
        vertical-align: middle;
        cursor: pointer;
        padding-left: 2px;
        padding-right: 2px;
    }

    .bodyline {
        -webkit-border-radius: 4px;
        border-radius: 4px;
        border: 1px #E4ECEC outset;
        padding: 0px;
        margin-bottom: 5px;
    }

    table.dp {
        width: 180px;
        background-color: #FFFFFF;
        /*border-top: solid 2px #f4f4f4;
    border-left: solid 2px #f4f4f4;
    border-right: solid 1px #222222;
    border-bottom: solid 1px #222222; */
        padding: 0px;
        border-spacing: 0px;
        border-collapse: collapse;
    }

    .dp td,
    .tpHour td,
    .tpMinute td {
        padding: 2px;
        font-size: 10px;
    }

    /* Barre titre */
    .dpHead,
    .tpHead,
    .tpHour td:Hover .tpHead {
        font-weight: bold;
        background-color: #888;
        color: white;
        font-size: 11px;
        cursor: auto;
    }

    /* Barre navigation */
    .dpButtons,
    .tpButtons {
        text-align: center;
        background-color: #888;
        color: #FFFFFF;
        font-weight: bold;
        cursor: pointer;
    }

    .dpButtons:Active,
    .tpButtons:Active {
        border: 1px outset black;
    }

    .dpDayNames td,
    .dpExplanation {
        background-color: #D9DBE1;
        font-weight: bold;
        text-align: center;
        font-size: 11px;
    }

    .dpExplanation {
        font-weight: normal;
        font-size: 11px;
    }

    .dpWeek td {
        text-align: center
    }

    .dpToday,
    .dpReg,
    .dpSelected {
        cursor: pointer;
    }

    .dpToday {
        font-weight: bold;
        color: black;
        background-color: #f4f4f4;
    }

    .dpReg:Hover,
    .dpToday:Hover {
        background-color: black;
        color: white
    }

    /* Jour courant */
    .dpSelected {
        background-color: #0B63A2;
        color: white;
        font-weight: bold;
    }

    .tpHour {
        border-top: 1px solid #f4f4f4;
        border-right: 1px solid #f4f4f4;
    }

    .tpHour td {
        border-left: 1px solid #f4f4f4;
        border-bottom: 1px solid #f4f4f4;
        cursor: pointer;
    }

    .tpHour td:Hover {
        background-color: black;
        color: white;
    }

    .tpMinute {
        margin-top: 5px;
    }

    .tpMinute td:Hover {
        background-color: black;
        color: white;
    }

    .tpMinute td {
        background-color: #D9DBE1;
        text-align: center;
        cursor: pointer;
    }

    /* Bouton X fermer */
    .dpInvisibleButtons {
        border-style: none;
        background-color: transparent;
        padding: 0px;
        font-size: 0.85em;
        border-width: 0px;
        color: #eee;
        vertical-align: middle;
        cursor: pointer;
    }

    .datenowlink {
        color: rgb(40,40,40);
    }

    .categtextwhite,
    .treeview .categtextwhite.hover {
        color: #fff !important;
    }

    .categtextblack {
        color: #000 !important;
    }


    /* ============================================================================== */
    /*  Show/Hide                                                                     */
    /* ============================================================================== */

    div.visible {
        display: block;
    }

    div.hidden,
    td.hidden,
    img.hidden,
    span.hidden,
    div.showifmore {
        display: none;
    }

    .unvisible {
        visibility: hidden;
    }

    tr.visible {
        display: block;
    }

    /* ============================================================================== */
    /*  Module website                                                                */
    /* ============================================================================== */

    .phptag {
        background: #ddd;
        border: 1px solid #ccc;
        border-radius: 4px;
    }

    .nobordertransp {
        border: 0px;
        background-color: transparent;
        background-image: none;
        color: #000 !important;
        text-shadow: none;
    }

    .websitebar {
        border-bottom: 1px solid #ccc;
        background: #eee;
    }

    .websitebar .button,
    .websitebar .buttonDelete {
        padding: 2px 4px 2px 4px !important;
        margin: 2px 4px 2px 4px !important;
        line-height: normal;
    }

    .websiteselection {
        display: inline-block;
        padding-left: 10px;
        vertical-align: middle;
    }

    .websitetools {
        float: right;
    }

    .websiteselection,
    .websitetools {
        margin-top: 3px;
        padding-top: 3px;
        padding-bottom: 3px;
    }

    .websiteinputurl {
        display: inline-block;
        vertical-align: top;
    }

    .websiteiframenoborder {
        border: 0px;
    }

    span.websitebuttonsitepreview img,
    a.websitebuttonsitepreview img {
        width: 26px;
        display: inline-block;
    }

    span.websitebuttonsitepreviewdisabled img,
    a.websitebuttonsitepreviewdisabled img {
        opacity: 0.2;
    }

    .websiteiframenoborder {
        border: 0px;
    }

    .websitehelp {
        vertical-align: middle;
        float: right;
        padding-top: 8px;
    }

    /* ============================================================================== */
    /*  Module agenda                                                                 */
    /* ============================================================================== */

    .dayevent .tagtr:first-of-type {
        height: 24px;
    }

    .agendacell {
        height: 60px;
    }

    table.cal_month {
        border-spacing: 0px;
    }

    table.cal_month td:first-child {
        border-left: 0px;
    }

    table.cal_month td:last-child {
        border-right: 0px;
    }

    .cal_current_month {
        border-top: 0;
        border-left: solid 1px #E0E0E0;
        border-right: 0;
        border-bottom: solid 1px #E0E0E0;
    }

    .cal_current_month_peruserleft {
        border-top: 0;
        border-left: solid 2px #6C7C7B;
        border-right: 0;
        border-bottom: solid 1px #E0E0E0;
    }

    .cal_current_month_oneday {
        border-right: solid 1px #E0E0E0;
    }

    .cal_other_month {
        border-top: 0;
        border-left: solid 1px #C0C0C0;
        border-right: 0;
        border-bottom: solid 1px #C0C0C0;
    }

    .cal_other_month_peruserleft {
        border-top: 0;
        border-left: solid 2px #6C7C7B !important;
        border-right: 0;
    }

    .cal_current_month_right {
        border-right: solid 1px #E0E0E0;
    }

    .cal_other_month_right {
        border-right: solid 1px #C0C0C0;
    }

    .cal_other_month {
        /* opacity: 0.6; */
        background: #EAEAEA;
        padding-left: 2px;
        padding-right: 1px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .cal_past_month {
        /* opacity: 0.6; */
        background: #EEEEEE;
        padding-left: 2px;
        padding-right: 1px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .cal_current_month {
        background: #FFFFFF;
        border-left: solid 1px #E0E0E0;
        padding-left: 2px;
        padding-right: 1px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .cal_current_month_peruserleft {
        background: #FFFFFF;
        border-left: solid 2px #6C7C7B;
        padding-left: 2px;
        padding-right: 1px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .cal_today {
        background: #FDFDF0;
        border-left: solid 1px #E0E0E0;
        border-bottom: solid 1px #E0E0E0;
        padding-left: 2px;
        padding-right: 1px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .cal_today_peruser {
        background: #FDFDF0;
        border-right: solid 1px #E0E0E0;
        border-bottom: solid 1px #E0E0E0;
        padding-left: 2px;
        padding-right: 1px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .cal_today_peruser_peruserleft {
        background: #FDFDF0;
        border-left: solid 2px #6C7C7B;
        border-right: solid 1px #E0E0E0;
        border-bottom: solid 1px #E0E0E0;
        padding-left: 2px;
        padding-right: 1px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .cal_past {}

    .cal_peruser {
        padding: 0px;
    }

    .cal_impair {
        background: #F8F8F8;
    }

    .cal_today_peruser_impair {
        background: #F8F8F0;
    }

    .peruser_busy {
        background: #CC8888;
    }

    .peruser_notbusy {
        background: #EEDDDD;
        opacity: 0.5;
    }

    table.cal_event {
        border: none;
        border-collapse: collapse;
        margin-bottom: 1px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        min-height: 20px;
    }

    table.cal_event td {
        border: none;
        padding-left: 2px;
        padding-right: 2px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    table.cal_event td.cal_event {
        padding: 4px 4px !important;
    }

    table.cal_event td.cal_event_right {
        padding: 4px 4px !important;
    }

    .cal_event {
        font-size: 1em;
    }

    .cal_event a:link {
        color: #111111;
        font-weight: normal !important;
    }

    .cal_event a:visited {
        color: #111111;
        font-weight: normal !important;
    }

    .cal_event a:active {
        color: #111111;
        font-weight: normal !important;
    }

    .cal_event_busy a:hover {
        color: #111111;
        font-weight: normal !important;
        color: rgba(255, 255, 255, .75);
    }

    .cal_event_busy {}

    .cal_peruserviewname {
        max-width: 140px;
        height: 22px;
    }

    .topmenuimage {
        background-size: 28px auto;
    }

    /* ============================================================================== */
    /*  Ajax - Liste deroulante de l'autocompletion                                   */
    /* ============================================================================== */

    .ui-widget-content {
        border: solid 1px rgba(0, 0, 0, .3);
        background: #fff !important;
    }

    .ui-autocomplete-loading {
        background: white url(/htdocs/theme/oblyon/img/working.gif) right center no-repeat;
    }

    .ui-autocomplete {
        position: absolute;
        width: auto;
        font-size: 1.0em;
        background-color: white;
        border: 1px solid #888;
        margin: 0px;
        /*	       padding:0px; This make combo crazy */
    }

    .ui-autocomplete ul {
        list-style-type: none;
        margin: 0px;
        padding: 0px;
    }

    .ui-autocomplete ul li.selected {
        background-color: #D3E5EC;
    }

    .ui-autocomplete ul li {
        list-style-type: none;
        display: block;
        margin: 0;
        padding: 2px;
        height: 18px;
        cursor: pointer;
    }

    /* ============================================================================== */
    /*  Holiday                                                                       */
    /* ============================================================================== */

    #types .btn {
        cursor: pointer;
    }

    #types .btn-primary {
        font-weight: bold;
    }

    #types form {
        padding: 20px;
    }

    #types label {
        display: inline-block;
        width: 100px;
        margin-right: 20px;
        padding: 4px;
        text-align: right;
        vertical-align: top;
    }

    #types input.text,
    #types textarea {
        width: 400px;
    }

    #types textarea {
        height: 100px;
    }


    /*------------------------------------*\
#cashdesk module
\*------------------------------------*/

    .conteneur {
        background-color: #FFFFFF !important;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
    }

    .conteneur_img_gauche {
        background: none !important;
    }

    .conteneur_img_droite {
        background: none !important;
    }


    .entete {
        background: none !important;
        height: 0 !important;
    }


    .menu_principal {
        background-color: #0072CE !important;
        background-image: none !important;
        margin: 0 0 20px !important;
        width: 100% !important;
        height: 90px !important;
    }

    .menu_principal .logopos {
        padding-top: 5px !important;
        max-height: 80px !important;
    }

    .menu_principal .menu {
        padding: 15px 0 !important;
    }

    .menu_principal .menu li {
        line-height: 1.5em;
        margin: 0 10px;
    }

    .menu_principal .menu_choix1,
    .menu_principal .menu_choix2 {
        padding: 0;
        font-size: 1.3em !important;
        width: initial !important;
    }

    .menu_principal .menu_choix1 a,
    .menu_principal .menu_choix2 a {
        border: 1px solid #eee;
        border-radius: 5px;
        margin: 5px;
        padding: 14px 5px 14px 54px;
        height: 38px;
        width: initial !important;
    }

    .menu_principal .menu_choix1 a:hover,
    .menu_principal .menu_choix1 a:focus,
    .menu_principal .menu_choix2 a:hover,
    .menu_principal .menu_choix2 a:focus {
        background-color: #00409c;
    }

    .menu_principal .menu_choix1 a {
        background: url("/htdocs/theme/oblyon/img/cashdesk/new.png") top left no-repeat;
    }

    .menu_principal .menu_choix2 a {
        background: url("/htdocs/theme/oblyon/img/cashdesk/gescom.png") top left no-repeat;
    }

    .menu_principal .menu_choix1 a span,
    .menu_principal .menu_choix2 a span {
        color: #eee;
        display: inline-block;
        padding: 13px 0;
    }

    .menu_principal .menu_choix1 a:hover span,
    .menu_principal .menu_choix1 a:focus span,
    .menu_principal .menu_choix2 a:hover span,
    .menu_principal .menu_choix2 a:focus span {
        color: #fcfcfc !important;
    }

    .menu_principal .menu_choix0 {
        color: #eee !important;
        float: right !important;
        font-style: normal !important;
        font-size: 13px !important;
        margin-right: 20px !important;
        text-align: left !important;
        min-width: 235px !important;
        max-width: 50% !important;
    }

    .menu_principal .menu_choix0 a {
        color: #444444;
        font-weight: bold !important;
    }

    .menu_principal .menu_choix0 a:hover,
    .menu_principal .menu_choix0 a:focus {
        color: #222222;
        text-decoration: underline;
    }

    .menu_principal .menu_choix0 a img {
        vertical-align: sub;
    }

    .liste_articles {
        border: none !important;
        width: 245px !important;
    }

    .liste_articles_bas {
        background-color: #333;
        border: 1px solid rgba(0, 0, 0, .24) !important;
        color: #eee;
        padding-bottom: 15px;
    }

    p.titre {
        background-color: #0072CE;
        border-bottom: none !important;
        color: #f4f4f4 !important;
        padding: 8px;
    }

    .liste_articles .cadre_article {
        border-bottom: 1px solid #eee !important;
        width: 200px !important;
    }

    .liste_articles .cadre_article p {
        color: #eee !important;
    }

    .liste_articles .cadre_article p a {
        color: #eee !important;
    }

    .cadre_article p a:hover,
    .cadre_article p a:focus {
        text-decoration: underline;
    }

    .cadre_prix_total {
        background-color: #f6f6f6;
        border: 1px solid rgba(0, 0, 0, .24) !important;
        color: #33cc66 !important;
        margin-left: 23px !important;
        margin-right: 23px !important;
    }

    .bouton_login input {
        background-color: #0072CE !important;
        background-image: none !important;
        border: 1px solid #c0c0c0 !important;
        box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
        -webkit-box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
        color: #eee;
        cursor: pointer;
        font-weight: bold;
        padding: 1em;
        text-decoration: none;
        white-space: nowrap;
    }

    .bouton_login input:hover,
    .bouton_login input:focus,
    .bouton_login input:active {
        background-color: $bgbutton_hover !important;
        padding: 1em;
    }

    .principal {
        margin: 0 20px !important;
    }

    .titre1 {
        color: #f07b6e !important;
        font-size: 1.3em !important;
    }

    .cadre_facturation {
        border: 2px solid rgba(0, 0, 0, .32) !important;
        background-color: #FFFFFF;
        color: #444444;
        padding: 1em;
    }

    .cadre_facturation table {
        width: 100%;
        margin: 0.5em 0;
    }

    .cadre_facturation table tr td {
        padding: 0.5em;
    }

    .cadre_facturation .label1 {
        color: #444444;
    }

    .select_tva select {
        width: 70px !important;
    }

    .texte1_off,
    .texte2_off {
        cursor: not-allowed;
    }


    /* Force values for small screen 767 */
    @media only screen and (max-width: 767px) {
        .menu_principal .menu {
            padding: 8px 0 !important;
        }

        .menu_principal .menu li.menu_choix1,
        .menu_principal .menu li.menu_choix2 {
            padding: 15px 0 5px 0;
            margin: 0 5px;
        }

        .menu_principal .menu_choix1 a,
        .menu_principal .menu_choix2 a {
            background-size: 36px 36px;
            height: 30px;
            padding: 8px 38px 8px 0;
        }

        .menu_principal .menu_choix1 a span.hideonsmartphone,
        .menu_principal .menu_choix2 a span.hideonsmartphone {
            display: none;
        }

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

        .menu_principal .menu_choix0 {
            max-width: 66% !important;
        }

        .menu_principal .menu_choix0 select {
            width: auto;
        }

        /* Do not force width for cashdesk */
        .cadre_facturation .maxwidthonsmartphone {
            max-width: fit-content;
        }
    }


    /*
* Buttons
*/

    .bouton_ajout_article {
        background-color: #FFFFFF !important;
        background-image: none !important;
        border: 1px solid #0072CE !important;
        color: #0072CE;
        box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
        -webkit-box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
        cursor: pointer;
        display: block;
        font-weight: bold !important;
        margin: 15px auto 0 !important;
        text-decoration: none;
        text-transform: uppercase;
        width: initial !important;
        white-space: nowrap;
    }

    .bouton_ajout_article:hover,
    .bouton_ajout_article:active,
    .bouton_ajout_article:focus {
        background-color: #0072CE !important;
        background-image: none !important;
        border-color: #0072CE;
        color: #f7f7f7;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .bouton_mode_reglement,
    .bouton_validation {
        background-color: #f8f8f8 !important;
        background-image: none !important;
        border: 1px solid #c0c0c0 !important;
        -webkit-box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
        box-shadow: inset 0 1px 0 rgba(170, 200, 210, .6);
        color: #434956;
        cursor: pointer;
        font-weight: bold;
        text-decoration: none;
        white-space: nowrap;
    }

    .bouton_mode_reglement:hover,
    .bouton_mode_reglement:active,
    .bouton_mode_reglement:focus,
    .bouton_validation:hover,
    .bouton_validation:active,
    .bouton_validation:focus {
        background-image: none !important;
        border: 1px solid #0072CE !important;
        color: #0072CE;
        -webkit-box-shadow: inset 0 5px 0 #0072CE88;
        box-shadow: inset 0 5px 0 #0072CE88;
    }

    .bouton_mode_reglement_disabled {
        background-color: #ddd !important;
        border: 1px solid #aaa !important;
        box-shadow: inset 0 1px 0 rgba(170, 170, 170, .6);
        -webkit-box-shadow: inset 0 1px 0 rgba(170, 170, 170, .6);
        color: #777 !important;
        cursor: not-allowed;
        font-weight: normal !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }

    .pied {
        background: none !important;
        height: 0 !important;
    }

    /*------------------------------------*\
#jQuery Modules
\*------------------------------------*/

    /**
* Tooltips
*/

    #tooltip {
        background-color: #fffff0;
        border-top: solid 1px #bbb;
        border-left: solid 1px #bbb;
        border-right: solid 1px #444;
        border-bottom: solid 1px #444;
        opacity: 1;
        padding: 2px;
        position: absolute;
        width: 450px;
        z-index: 97;
    }


    /**
* Ajax - Liste deroulante de l'autocompletion
*/

    .ui-widget-content {
        border: solid 1px rgba(0, 0, 0, .3);
        background: #fff !important;
    }

    .ui-autocomplete-loading {
        background: white url(/htdocs/theme/oblyon/img/working.gif) right center no-repeat;
    }

    .ui-autocomplete {
        background-color: white;
        border: 1px solid #888;
        font-size: 1.0em;
        margin: 0;
        padding: 0;
        position: absolute;
        width: auto;
    }

    .ui-autocomplete ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

    .ui-autocomplete ul li.selected {
        background-color: #d3e5ec;
    }

    .ui-autocomplete ul li {
        cursor: pointer;
        display: block;
        height: 18px;
        list-style-type: none;
        margin: 0;
        padding: 2px;
    }

    /**
* Gantt
*/

    td.gtaskname {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /**
* jQuery - jeditable
*/

    .editkey_textarea,
    .editkey_ckeditor,
    .editkey_string,
    .editkey_email,
    .editkey_numeric,
    .editkey_select,
    .editkey_autocomplete {
        background: url(/htdocs/theme/oblyon/img/edit.png) right top no-repeat;
        cursor: pointer;
    }

    .editkey_datepicker {
        background: url(/htdocs/theme/oblyon/img/calendar.png) right center no-repeat;
        cursor: pointer;
    }

    .editval_textarea.active:hover,
    .editval_ckeditor.active:hover,
    .editval_string.active:hover,
    .editval_email.active:hover,
    .editval_numeric.active:hover,
    .editval_select.active:hover,
    .editval_autocomplete.active:hover,
    .editval_datepicker.active:hover {
        background-color: white;
        cursor: pointer;
    }

    .viewval_textarea.active:hover,
    .viewval_ckeditor.active:hover,
    .viewval_string.active:hover,
    .viewval_email.active:hover,
    .viewval_numeric.active:hover,
    .viewval_select.active:hover,
    .viewval_autocomplete.active:hover,
    .viewval_datepicker.active:hover {
        background-color: white;
        cursor: pointer;
    }

    .viewval_hover {
        background-color: white;
    }


    /**
* Treeview - Admin Menu
*/

    .treeview ul {
        background-color: transparent !important;
        margin-top: 0;
    }

    .treeview li {
        background-color: transparent !important;
        min-height: 20px;
        padding: 0 0 0 16px !important;
    }

    .treeview .hover {
        color: black !important;
    }


    /**
* Excel tabs
*/

    .table_data {
        border-style: ridge;
        border: 1px solid;
    }

    .tab_base {
        background-color: #c5d0dd;
        border: 1px solid;
        border-style: ridge;
        cursor: pointer;
        font-weight: bold;
    }

    .table_sub_heading {
        background-color: #ccc;
        border: 1px solid;
        border-style: ridge;
        font-weight: bold;
    }

    .table_body {
        background-color: #f0f0f0;
        border: 1px solid;
        border-collapse: collapse;
        border-spacing: 0;
        border-style: ridge;
        font-family: sans-serif;
        font-weight: normal;
    }

    .tab_loaded {
        background-color: #222;
        border: 1px solid;
        border-style: groove;
        color: white;
        cursor: pointer;
        font-weight: bold;
    }


    /**
* Color picker
*/

    A.color,
    A.color:active,
    A.color:visited {
        border: 1px inset white;
        display: block;
        height: 10px;
        line-height: 10px;
        margin: 0;
        padding: 0;
        position: relative;
        text-decoration: none;
        width: 10px;
    }

    A.color:hover,
    A.color:focus {
        border: 1px outset white;
    }

    A.none,
    A.none:active,
    A.none:visited,
    A.none:hover,
    A.none:focus {
        border: 1px solid #b3c5cc;
        cursor: default;
        display: block;
        height: 10px;
        line-height: 10px;
        margin: 0;
        padding: 0;
        position: relative;
        text-decoration: none;
        width: 10px;
    }

    .tblColor {
        display: none;
    }

    .tdColor {
        padding: 1px;
    }

    .tblContainer {
        background-color: #b3c5cc;
    }

    .tblGlobal {
        background-color: #b3c5cc;
        border: 2px outset;
        display: none;
        left: 0;
        position: absolute;
        top: 0;
    }

    .tdContainer {
        padding: 5px;
    }

    .tdDisplay {
        border: 1px outset white;
        height: 20px;
        line-height: 20px;
        width: 50%;
    }

    .tdDisplayTxt {
        color: black;
        font-size: 8pt;
        height: 24px;
        line-height: 12px;
        text-align: center;
        width: 50%;
    }

    .btnColor {
        font-size: 10pt;
        margin: 0;
        padding: 0;
        width: 100%;
    }

    .btnPalette {
        font-size: 8pt;
        margin: 0;
        padding: 0;
        width: 100%;
    }


    /**
* Overwriting JQuery styles
*/

    .ui-menu .ui-menu-item a {
        display: block;
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        font-size: 1em;
        font-weight: normal;
        line-height: 1.5;
        padding: .2em .4em;
        text-decoration: none;
        zoom: 1;
    }

    .ui-widget {
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        font-size: 14px;
    }

    .ui-button {
        margin-left: -2px;
        padding-top: 1px;
    }

    .ui-button-icon-only .ui-button-text {
        height: 8px;
    }

    .ui-button-icon-only .ui-button-text,
    .ui-button-icons-only .ui-button-text {
        padding: 2px 0 6px 0;
    }

    .ui-button-text {
        line-height: 1em !important;
    }

    .ui-autocomplete-input {
        margin: 0;
        padding: 1px;
    }


    /* confirmation box */
    .ui-widget-content {
        background-color: #f7f7f7 !important;
    }

    .ui-state-default,
    .ui-widget-header .ui-state-default,
    .ui-widget-content .ui-state-default {
        background-color: #e6e6e6 !important;
    }

    .ui-widget-header {
        background-color: #ccc !important;
    }

    .ui-dialog .ui-dialog-content {
        padding-top: 1em !important
    }

    .ui-corner-all,
    .ui-corner-bottom,
    .ui-corner-right,
    .ui-corner-br {
        border-bottom-right-radius: 0 !important;
        -moz-border-radius-bottomright: 0 !important;
        -webkit-border-bottom-right-radius: 0 !important;
        -khtml-border-bottom-right-radius: 0 !important;
    }

    .ui-corner-all,
    .ui-corner-bottom,
    .ui-corner-left,
    .ui-corner-bl {
        border-bottom-left-radius: 0 !important;
        -moz-border-radius-bottomleft: 0 !important;
        -webkit-border-bottom-left-radius: 0 !important;
        -khtml-border-bottom-left-radius: 0 !important;
    }

    .ui-corner-all,
    .ui-corner-top,
    .ui-corner-right,
    .ui-corner-tr {
        border-top-right-radius: 0 !important;
        -moz-border-radius-topright: 0 !important;
        -webkit-border-top-right-radius: 0 !important;
        -khtml-border-top-right-radius: 0 !important;
    }

    .ui-corner-all,
    .ui-corner-top,
    .ui-corner-left,
    .ui-corner-tl {
        border-bottom-top-radius: 0 !important;
        -moz-border-radius-topleft: 0 !important;
        -webkit-border-top-left-radius: 0 !important;
        -khtml-border-top-left-radius: 0 !important;
    }



    /**
* CKEditor
*/

    span.cke_skin_kama {
        border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        -webkit-border-radius: 0 !important;
        padding: 0 !important;
    }

    .cke_skin_kama .cke_wrapper {
        border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        -webkit-border-radius: 0 !important;
    }

    .cke_wrapper.cke_ltr {
        background-color: #444 !important;
    }

    .cke_skin_kama a.cke_toolbox_collapser,
    .cke_skin_kama a:hover.cke_toolbox_collapser,
    .cke_skin_kama a:focus.cke_toolbox_collapser {
        background-color: #eee !important;
        border: none !important;
    }

    .cke_skin_kama .cke_toolgroup,
    .cke_skin_kama .cke_rcombo a,
    .cke_skin_kama .cke_rcombo a:active,
    .cke_skin_kama .cke_rcombo a:hover,
    .cke_skin_kama .cke_rcombo a:focus {
        background-color: #eee !important;
        background-image: none !important;
        background-repeat: no-repeat !important;
        background-position: initial !important;
        border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        -webkit-border-radius: 0 !important;
    }

    .cke_skin_kama a.cke_toolbox_collapser_min,
    .cke_skin_kama a:hover.cke_toolbox_collapser_min,
    .cke_skin_kama a:focus.cke_toolbox_collapser_min {}

    .cke_editor table,
    .cke_editor tr,
    .cke_editor td {
        border: 0 !important;
    }

    .cke_wrapper {
        padding: 4px !important;
    }

    .cke_skin_kama .cke_contents iframe {
        border-style: solid;
        border-width: 1px;
        color: #777;
        line-height: 1em;
        outline: 0;
    }

    a.cke_dialog_ui_button {
        background-image: url() !important;
        background-position: bottom !important;
        font-family: "Open Sans",Tahoma,Arial,Helvetica !important;
        margin: 0em .5em !important;
        padding: .1em .7em !important;
    }

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



    /* ============================================================================== */
    /*  File upload                                                                   */
    /* ============================================================================== */

    .template-upload {
        height: 72px !important;
    }


    /* ============================================================================== */
    /*  JSGantt                                                                       */
    /* ============================================================================== */

    div.scroll2 {
        width: 450px !important;
    }

    .gtaskname div,
    .gtaskname {
        font-size: unset !important;
    }

    div.gantt,
    .gtaskheading,
    .gmajorheading,
    .gminorheading,
    .gminorheadingwkend {
        font-size: unset !important;
        font-weight: normal !important;
        color: #000 !important;
    }

    div.gTaskInfo {
        background: #f0f0f0 !important;
    }

    .gtaskblue {
        background: rgb(108, 152, 185) !important;
    }

    .gtaskgreen {
        background: rgb(160, 173, 58) !important;
    }

    td.gtaskname {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    td.gminorheadingwkend {
        color: #888 !important;
    }

    td.gminorheading {
        color: #666 !important;
    }

    .glistlbl,
    .glistgrid {
        width: 582px !important;
    }

    .gtaskname div,
    .gtaskname {
        min-width: 250px !important;
        max-width: 250px !important;
        width: 250px !important;
    }

    .gpccomplete div,
    .gpccomplete {
        min-width: 40px !important;
        max-width: 40px !important;
        width: 40px !important;
    }

    /* ============================================================================== */
    /*  jFileTree                                                                     */
    /* ============================================================================== */

    .ecmfiletree {
        width: 99%;
        height: 99%;
        padding-left: 2px;
        font-weight: normal;
    }

    .fileview {
        width: 99%;
        height: 99%;
        background: #FFF;
        padding-left: 2px;
        padding-top: 4px;
        font-weight: normal;
    }

    div.filedirelem {
        position: relative;
        display: block;
        text-decoration: none;
    }

    ul.filedirelem {
        padding: 2px;
        margin: 0 5px 5px 5px;
    }

    ul.filedirelem li {
        list-style: none;
        padding: 2px;
        margin: 0 10px 20px 10px;
        width: 160px;
        height: 120px;
        text-align: center;
        display: block;
        float: left;
        border: solid 1px #f4f4f4;
    }

    .ui-layout-north {}

    ul.ecmjqft {
        line-height: 16px;
        padding: 0px;
        margin: 0px;
        font-weight: normal;
    }

    ul.ecmjqft li {
        list-style: none;
        padding: 0px;
        padding-left: 20px;
        margin: 0px;
        display: block;
    }

    ul.ecmjqft a {
        line-height: 24px;
        vertical-align: middle;
        color: #333;
        padding: 0px 0px;
        font-weight: normal;
        display: inline-block !important;
    }

    ul.ecmjqft a:active {
        font-weight: bold !important;
    }

    ul.ecmjqft a:hover {
        text-decoration: underline;
    }

    div.ecmjqft {
        vertical-align: middle;
        display: inline-block !important;
        text-align: right;
        float: right;
        right: 4px;
        clear: both;
    }

    div#ecm-layout-west {
        width: 380px;
        vertical-align: top;
    }

    div#ecm-layout-center {
        width: calc(100% - 390px);
        vertical-align: top;
        float: right;
    }

    .ecmjqft LI.directory {
        font-weight: normal;
        background: url(/htdocs/theme/common/treemenu/folder2.png) left top no-repeat;
    }

    .ecmjqft LI.expanded {
        font-weight: normal;
        background: url(/htdocs/theme/common/treemenu/folder2-expanded.png) left top no-repeat;
    }

    .ecmjqft LI.wait {
        font-weight: normal;
        background: url(/htdocs/theme/oblyon/img/working.gif) left top no-repeat;
    }


    /* ============================================================================== */
    /*  jNotify                                                                       */
    /* ============================================================================== */

    .jnotify-container {
        position: fixed !important;
        text-align: center;
        min-width: 480px;
        width: auto;
        max-width: 1024px;
        padding-left: 10px !important;
        padding-right: 10px !important;
        word-wrap: break-word;
    }

    .jnotify-container .jnotify-notification .jnotify-message {
        font-weight: normal;
    }

    .jnotify-container .jnotify-notification-warning .jnotify-close,
    .jnotify-container .jnotify-notification-warning .jnotify-message {
        color: #a28918 !important;
    }

    /* use or not ? */
    div.jnotify-background {
        opacity: 0.95 !important;
        -webkit-box-shadow: 2px 2px 4px #888 !important;
        box-shadow: 2px 2px 4px #888 !important;
    }

    /* ============================================================================== */
    /*  blockUI                                                                      */
    /* ============================================================================== */

    /*div.growlUI { background: url(check48.png) no-repeat 10px 10px }*/
    div.dolEventValid h1,
    div.dolEventValid h2 {
        color: #567b1b;
        background-color: #e3f0db;
        padding: 5px 5px 5px 5px;
        text-align: left;
    }

    div.dolEventError h1,
    div.dolEventError h2 {
        color: #a72947;
        background-color: #d79eac;
        padding: 5px 5px 5px 5px;
        text-align: left;
    }

    /* ============================================================================== */
    /*  Maps                                                                          */
    /* ============================================================================== */

    .divmap,
    #google-visualization-geomap-embed-0,
    #google-visualization-geomap-embed-1,
    #google-visualization-geomap-embed-2 {
        box-shadow: 0 0 10px #aaa;
        -moz-box-shadow: 0 0 10px #aaa;
        -webkit-box-shadow: 0 0 10px #aaa;
    }

    /* ============================================================================== */
    /*  Datatable                                                                     */
    /* ============================================================================== */

    table.dataTable tr.odd td.sorting_1,
    table.dataTable tr.even td.sorting_1 {
        background: none !important;
    }

    .sorting_asc {
        background: url('/htdocs/theme/oblyon/img/sort_asc.png') no-repeat center right !important;
    }

    .sorting_desc {
        background: url('/htdocs/theme/oblyon/img/sort_desc.png') no-repeat center right !important;
    }

    .sorting_asc_disabled {
        background: url('/htdocs/theme/oblyon/img/sort_asc_disabled.png') no-repeat center right !important;
    }

    .sorting_desc_disabled {
        background: url('/htdocs/theme/oblyon/img/sort_desc_disabled.png') no-repeat center right !important;
    }

    .dataTables_paginate {
        margin-top: 8px;
    }

    .paginate_button_disabled {
        opacity: 1 !important;
        color: #888 !important;
        cursor: default !important;
    }

    .paginate_disabled_previous:hover,
    .paginate_enabled_previous:hover,
    .paginate_disabled_next:hover,
    .paginate_enabled_next:hover {
        font-weight: normal;
    }

    .paginate_enabled_previous:hover,
    .paginate_enabled_next:hover {
        text-decoration: underline !important;
    }

    .paginate_active {
        text-decoration: underline !important;
    }

    .paginate_button {
        font-weight: normal !important;
        text-decoration: none !important;
    }

    .paging_full_numbers {
        height: inherit !important;
    }

    .paging_full_numbers a.paginate_active:hover,
    .paging_full_numbers a.paginate_button:hover {
        background-color: #DDD !important;
    }

    .paging_full_numbers,
    .paging_full_numbers a.paginate_active,
    .paging_full_numbers a.paginate_button {
        background-color: #FFF !important;
        border-radius: inherit !important;
    }

    .paging_full_numbers a.paginate_button_disabled:hover,
    .paging_full_numbers a.disabled:hover {
        background-color: #FFF !important;
    }

    .paginate_button,
    .paginate_active {
        border: 1px solid #ddd !important;
        padding: 6px 12px !important;
        margin-left: -1px !important;
        line-height: 1.42857143 !important;
        margin: 0 0 !important;
    }

    /* For jquery plugin combobox */
    /* Disable this. It breaks wrapping of boxes
.ui-corner-all { white-space: nowrap; } */

    .ui-state-disabled,
    .ui-widget-content .ui-state-disabled,
    .ui-widget-header .ui-state-disabled,
    .paginate_button_disabled {
        opacity: .35;
        background-image: none;
    }

    div.dataTables_length {
        float: right !important;
        padding-left: 8px;
    }

    div.dataTables_length select {
        background: #fff;
    }

    .dataTables_wrapper .dataTables_paginate {
        padding-top: 0px !important;
    }

    /* ============================================================================== */
    /*  Select2                                                                       */
    /* ============================================================================== */

    .select2-container--focus span.select2-selection.select2-selection--single {
        border-bottom: 1px solid #666 !important;
    }

    .blockvmenusearch .select2-container--default .select2-selection--single,
    .blockvmenubookmarks .select2-container--default .select2-selection--single {
        background-color: #ffffff;
    }

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        /* color: unset; */
    }

    .select2-default {
        color: #999 !important;
    }

    .select2-choice,
    .select2-container .select2-choice {
        border-bottom: solid 1px rgba(0, 0, 0, .4);
    }

    .select2-container .select2-choice>.select2-chosen {
        margin-right: 23px;
    }

    .select2-container .select2-choice .select2-arrow {
        border-radius: 0;
        background: transparent;
    }

    .select2-container-multi .select2-choices {
        background-image: none;
    }

    .select2-container .select2-choice {
        color: #000;
        border-radius: 0;
    }

    .selectoptiondisabledwhite {
        background: #FFFFFF !important;
    }

    .select2-arrow {
        border: none;
        border-left: none !important;
        background: none !important;
    }

    .select2-choice {
        border-top: none !important;
        border-left: none !important;
        border-right: none !important;
    }

    .select2-drop.select2-drop-above {
        box-shadow: none !important;
    }

    .select2-container--open .select2-dropdown--above {
        border-bottom: solid 1px rgba(0, 0, 0, .2);
    }

    .select2-drop.select2-drop-above.select2-drop-active {
        border-top: 1px solid #ccc;
        border-bottom: solid 1px rgba(0, 0, 0, .2);
    }

    .select2-container--default .select2-selection--single {
        outline: none;
        border-top: none;
        border-left: none;
        border-right: none;
        border-bottom: solid 1px rgba(0, 0, 0, .2);
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .select2-container--default .select2-selection--multiple {
        border: solid 1px rgba(0, 0, 0, .2);
        border-radius: 0 !important;
    }

    .select2-search__field {
        outline: none;
        border-top: none !important;
        border-left: none !important;
        border-right: none !important;
        border-bottom: solid 1px rgba(0, 0, 0, .2) !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .select2-container-active .select2-choice,
    .select2-container-active .select2-choices {
        outline: none;
        border-top: none;
        border-left: none;
        border-bottom: none;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }

    .select2-dropdown {
        border: 1px solid #ccc;
        box-shadow: 1px 2px 10px #ddd;
    }

    .select2-dropdown-open {
        background-color: #fff;
    }

    .select2-dropdown-open .select2-choice,
    .select2-dropdown-open .select2-choices {
        outline: none;
        border-top: none;
        border-left: none;
        border-bottom: none;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        background-color: #fff;
    }

    .select2-disabled {
        color: #888;
    }

    .select2-drop.select2-drop-above.select2-drop-active,
    .select2-drop {
        border-radius: 0;
    }

    .select2-drop.select2-drop-above {
        border-radius: 0;
    }

    .select2-dropdown-open.select2-drop-above .select2-choice,
    .select2-dropdown-open.select2-drop-above .select2-choices {
        background-image: none;
        border-radius: 0 !important;
    }

    div.select2-drop-above {
        background: #fff;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }

    .select2-drop-active {
        border: 1px solid #ccc;
        padding-top: 4px;
    }

    .select2-search input {
        border: none;
    }

    a span.select2-chosen {
        font-weight: normal !important;
    }

    .select2-container .select2-choice {
        background-image: none;
        /* line-height: 24px; */
    }

    .select2-results .select2-no-results,
    .select2-results .select2-searching,
    .select2-results .select2-ajax-error,
    .select2-results .select2-selection-limit {
        background: #FFFFFF;
    }

    .select2-results {
        max-height: 400px;
    }

    .select2-container.select2-container-disabled .select2-choice,
    .select2-container-multi.select2-container-disabled .select2-choices {
        background-color: #FFFFFF;
        background-image: none;
        border: none;
        cursor: default;
    }

    .select2-container-disabled .select2-choice .select2-arrow b {
        opacity: 0.4;
    }

    .select2-container-multi .select2-choices .select2-search-choice {
        margin-bottom: 3px;
    }

    .select2-dropdown-open.select2-drop-above .select2-choice,
    .select2-dropdown-open.select2-drop-above .select2-choices,
    .select2-container-multi .select2-choices,
    .select2-container-multi.select2-container-active .select2-choices {
        border-bottom: 1px solid #ccc;
        border-right: none;
        border-top: none;
        border-left: none;

    }

    .select2-container--default .select2-results>.select2-results__options {
        max-height: 400px;
    }

    /* Special case for the select2 add widget */
    #addbox .select2-container .select2-choice>.select2-chosen,
    #actionbookmark .select2-container .select2-choice>.select2-chosen {
        text-align: left;
        opacity: 0.4;
    }

    .select2-container--default .select2-selection--single .select2-selection__placeholder {
        color: unset;
        opacity: 0.4;
    }

    span#select2-boxbookmark-container,
    span#select2-boxcombo-container {
        text-align: left;
        opacity: 0.4;
    }

    .select2-container .select2-selection--single .select2-selection__rendered {
        padding-left: 6px;
    }

    /* Style used before the select2 js is executed on boxcombo */
    #boxbookmark.boxcombo,
    #boxcombo.boxcombo {
        text-align: left;
        opacity: 0.4;
        border-bottom: solid 1px rgba(0, 0, 0, .4) !important;
        height: 26px;
        line-height: 24px;
        padding: 0 0 2px 0;
        vertical-align: top;
    }

    /* To emulate select 2 style */
    .select2-container-multi-dolibarr .select2-choices-dolibarr .select2-search-choice-dolibarr {
        padding: 3px 5px 3px 5px;
        margin: 0 0 2px 3px;
        position: relative;
        line-height: 13px;
        color: #333;
        cursor: default;
        border: 1px solid #aaaaaa;
        border-radius: 3px;
        -webkit-box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
        box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
        background-clip: padding-box;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-color: #e4e4e4;
        background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eee));
        background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
        background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
        background-image: linear-gradient(to bottom, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
    }

    .select2-container-multi-dolibarr .select2-choices-dolibarr .select2-search-choice-dolibarr a {
        font-weight: normal;
    }

    .select2-container-multi-dolibarr .select2-choices-dolibarr li {
        float: left;
        list-style: none;
    }

    .select2-container-multi-dolibarr .select2-choices-dolibarr {
        height: auto !important;
        height: 1%;
        margin: 0;
        padding: 0 5px 0 0;
        position: relative;
        cursor: text;
        overflow: hidden;
    }

    .select2-container--default .select2-selection--multiple {
        color: #222 !important;
    }

    /* ============================================================================== */
    /*  For categories                                                                */
    /* ============================================================================== */

    .noborderoncategories {
        border: none !important;
        border-radius: 5px !important;
        box-shadow: none;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }

    span.noborderoncategories a,
    li.noborderoncategories a {
        line-height: normal;
    }

    span.noborderoncategories {
        padding: 3px 5px 3px 5px;
    }

    .categtextwhite,
    .treeview .categtextwhite.hover {
        color: #fff !important;
    }

    .categtextblack {
        color: #000 !important;
    }


    /* ============================================================================== */
    /*  External lib multiselect with checkbox                                        */
    /* ============================================================================== */

    .multi-select-container {
        display: inline-block;
        position: relative;
    }

    .multi-select-menu {
        position: absolute;
        left: 0;
        top: 0.8em;
        float: left;
        min-width: 100%;
        background: #fff;
        margin: 1em 0;
        padding: 0.4em 0;
        border: 1px solid #aaa;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
        display: none;
    }

    .multi-select-menu input {
        margin-right: 0.3em;
        vertical-align: 0.1em;
    }

    .multi-select-button {
        display: inline-block;
        max-width: 20em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        vertical-align: middle;
        background-color: #fff;
        cursor: default;

        border: none;
        border-bottom: solid 1px rgba(0, 0, 0, .2);
        padding: 5px;
        padding-left: 2px;
        height: 17px;
    }

    .multi-select-button:focus {
        outline: none;
        border-bottom: 1px solid #666;
    }

    .multi-select-button:after {
        content: "";
        display: inline-block;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0.5em 0.23em 0em 0.23em;
        border-color: #444 transparent transparent transparent;
        margin-left: 0.4em;
    }

    .multi-select-container--open .multi-select-menu {
        display: block;
    }

    .multi-select-container--open .multi-select-button:after {
        border-width: 0 0.4em 0.4em 0.4em;
        border-color: transparent transparent #999 transparent;
    }

    .multi-select-menuitem {
        clear: both;
        float: left;
        padding-left: 5px
    }

    /* ============================================================================== */
    /*  Native multiselect with checkbox                                              */
    /* ============================================================================== */

    ul.ulselectedfields {
        z-index: 95;
        /* To have the select box appears on first plan even when near buttons are decorated by jmobile */
    }

    dl.dropdown {
        margin: 0px;
        padding: 0px;
        margin-left: 2px;
        margin-right: 2px;
        vertical-align: middle;
        display: inline-block;
    }

    .dropdown dd,
    .dropdown dt {
        margin: 0px;
        padding: 0px;
    }

    .dropdown ul {
        margin: -1px 0 0 0;
        text-align: left;
    }

    .dropdown dd {
        position: relative;
    }

    .dropdown dt a {
        display: block;
        overflow: hidden;
        border: 0;
    }

    .dropdown dt a span,
    .multiSel span {
        cursor: pointer;
        display: inline-block;
        padding: 0 3px 2px 0;
    }

    .dropdown span.value {
        display: none;
    }

    .dropdown dd ul {
        background-color: #fff;
        box-shadow: 1px 1px 10px #aaa;
        display: none;
        right: 0px;
        /* pop is align on right */
        padding: 0 0 0 0;
        position: absolute;
        top: 2px;
        list-style: none;
        max-height: 264px;
        overflow: auto;
        border-radius: 2px;
    }

    .dropdown dd ul li {
        white-space: nowrap;
        font-weight: normal;
        padding: 7px 8px 7px 8px;
        color: #505050;
    }

    .dropdown dd ul li:hover {
        background: #eee;
    }

    .dropdown dd ul li input[type="checkbox"] {
        margin-right: 3px;
    }

    .dropdown dd ul li a,
    .dropdown dd ul li span {
        padding: 3px;
        display: block;
    }

    .dropdown dd ul li span {
        color: #888;
    }

    .dropdown dd ul li a:hover {
        background-color: #eee;
    }

    /* ============================================================================== */
    /*  Markdown rendering                                                             */
    /* ============================================================================== */

    .imgmd {
        width: 90%;
    }

    .moduledesclong h1 {
        padding-top: 10px;
        padding-bottom: 20px;
    }

    /* ============================================================================== */
    /*  JMobile                                                                       */
    /* ============================================================================== */

    li.ui-li-divider .ui-link {
        color: #FFF !important;
    }

    .ui-btn {
        margin: 0.1em 2px
    }

    a.ui-link,
    a.ui-link:hover,
    .ui-btn:hover,
    span.ui-btn-text:hover,
    span.ui-btn-inner:hover {
        text-decoration: none !important;
    }

    .ui-body-c {
        background: #fff;
    }

    .ui-btn-inner {
        min-width: .4em;
        padding-left: 6px;
        padding-right: 6px;
        font-size: 14px;
        /* white-space: normal; */
        /* Warning, enable this break the truncate feature */
    }

    .ui-btn-icon-right .ui-btn-inner {
        padding-right: 30px;
    }

    .ui-btn-icon-left .ui-btn-inner {
        padding-left: 30px;
    }

    .ui-select .ui-btn-icon-right .ui-btn-inner {
        padding-right: 30px;
    }

    .ui-select .ui-btn-icon-left .ui-btn-inner {
        padding-left: 30px;
    }

    .ui-select .ui-btn-icon-right .ui-icon {
        right: 8px;
    }

    .ui-btn-icon-left>.ui-btn-inner>.ui-icon,
    .ui-btn-icon-right>.ui-btn-inner>.ui-icon {
        margin-top: -10px;
    }

    select {
        /* display: inline-block; */
        /* We can't set this. This disable ability to make */
        overflow: hidden;
        white-space: nowrap;
        /* Enabling this make behaviour strange when selecting the empty value if this empty value is '' instead of '&nbsp;' */
        text-overflow: ellipsis;
    }

    .fiche .ui-controlgroup {
        margin: 0px;
        padding-bottom: 0px;
    }

    div.ui-controlgroup-controls div.tabsElem {
        margin-top: 2px;
    }

    div.ui-controlgroup-controls div.tabsElem a {
        -webkit-box-shadow: 0 -3px 6px rgba(0, 0, 0, .2);
        box-shadow: 0 -3px 6px rgba(0, 0, 0, .2);
    }

    div.ui-controlgroup-controls div.tabsElem a#active {
        -webkit-box-shadow: 0 -3px 6px rgba(0, 0, 0, .3);
        box-shadow: 0 -3px 6px rgba(0, 0, 0, .3);
    }

    a.tab span.ui-btn-inner {
        border: none;
        padding: 0;
    }

    .ui-link {
        color: rgb(40,40,40);
    }

    .liste_titre .ui-link {
        color: rgb(444) !important;
    }

    a.ui-link {
        word-wrap: break-word;
    }

    /* force wrap possible onto field overflow does not works */
    .formdoc .ui-btn-inner {
        white-space: normal;
        overflow: hidden;
        text-overflow: clip;
        /* "hidden" : do not exists as a text-overflow value (https://developer.mozilla.org/fr/docs/Web/CSS/text-overflow) */
    }

    /* Warning: setting this may make screen not beeing refreshed after a combo selection */
    /*.ui-body-c {
background: #fff;
}*/

    div.ui-radio,
    div.ui-checkbox {
        display: inline-block;
        border-bottom: 0px !important;
    }

    .ui-checkbox input,
    .ui-radio input {
        height: auto;
        width: auto;
        margin: 4px;
        position: static;
    }

    div.ui-checkbox label+input,
    div.ui-radio label+input {
        position: absolute;
    }

    .ui-mobile fieldset {
        padding-bottom: 10px;
        margin-bottom: 4px;
        border-bottom: 1px solid #AAAAAA !important;
    }

    ul.ulmenu {
        border-radius: 0;
        -webkit-border-radius: 0;
    }

    .ui-field-contain label.ui-input-text {
        vertical-align: middle !important;
    }

    .ui-mobile fieldset {
        border-bottom: none !important;
    }

    /* Style for first level menu with jmobile */
    .ui-li .ui-btn-inner a.ui-link-inherit,
    .ui-li-static.ui-li {
        padding: 1em 15px;
        display: block;
    }

    .ui-btn-up-c {
        font-weight: normal;
    }

    .ui-focus,
    .ui-btn:focus {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .ui-bar-b {
        /*border: 1px solid #888;*/
        border: none;
        background: none;
        text-shadow: none;
        color: rgb(110,80,20) !important;
    }

    .ui-bar-b,
    .lilevel0 {
        background-repeat: repeat-x;
        border: none;
        background: none;
        text-shadow: none;
        color: rgb(110,80,20) !important;
    }

    .alilevel0 {
        font-weight: normal !important;
    }

    .ui-li.ui-last-child,
    .ui-li.ui-field-contain.ui-last-child {
        border-bottom-width: 0px !important;
    }

    .alilevel0 {
        color: rgb(444) !important;
    }

    .ulmenu {
        box-shadow: none !important;
        border-bottom: 1px solid #ccc;
    }

    .ui-btn-icon-right {
        border-right: 1px solid #ccc !important;
    }

    .ui-body-c {
        border: 1px solid #ccc;
        text-shadow: none;
    }

    .ui-btn-up-c,
    .ui-btn-hover-c {
        /* border: 1px solid #ccc; */
        text-shadow: none;
    }

    .ui-body-c .ui-link,
    .ui-body-c .ui-link:visited,
    .ui-body-c .ui-link:hover {
        color: rgb(40,40,40);
    }

    .ui-btn-up-c .vsmenudisabled {
        color: #FFF !important;
        text-shadow: none !important;
    }

    /*
.ui-btn-up-c {
background: transparent;
}

div.tabsElem a.tab {
background: transparent;
}

.ui-controlgroup-horizontal .ui-btn.ui-first-child {
-webkit-border-top-left-radius: 6px;
border-top-left-radius: 6px;
}
.ui-controlgroup-horizontal .ui-btn.ui-last-child {
-webkit-border-top-right-radius: 6px;
border-top-right-radius: 6px;
}*/

    .alilevel1 {
        color: rgb(110,80,20) !important;
    }

    .lilevel1 {
        border-top: 2px solid #444;
        background: #fff ! important;
    }

    .lilevel1 div div a {
        font-weight: bold !important;
    }

    .lilevel2 {
        padding-left: 22px;
        background: #fff ! important;
    }

    .lilevel3 {
        padding-left: 44px;
        background: #fff ! important;
    }

    .lilevel4 {
        padding-left: 66px;
        background: #fff ! important;
    }

    .lilevel5 {
        padding-left: 88px;
        background: #fff ! important;
    }

    /* ============================================================================== */
    /*  POS                                                                           */
    /* ============================================================================== */

    .menu_choix1 a {
        background: url('/htdocs/theme/oblyon/img/menus/money.png') top left no-repeat;
        background-position-y: 15px;
    }

    .menu_choix2 a {
        background: url('/htdocs/theme/oblyon/img/menus/home.png') top left no-repeat;
        background-position-y: 15px;
    }

    .menu_choix1,
    .menu_choix2 {
        font-size: 1.4em;
        text-align: left;
        border: 1px solid #666;
        margin-right: 20px;
    }

    .menu_choix1 a,
    .menu_choix2 a {
        display: block;
        color: #fff;
        text-decoration: none;
        padding-top: 18px;
        padding-left: 54px;
        font-size: 14px;
        height: 40px;
    }

    .menu_choix1 a:hover,
    .menu_choix2 a:hover {
        color: #6d3f6d;
    }

    .menu li.menu_choix1 {
        padding-top: 6px;
        padding-right: 10px;
        padding-bottom: 2px;
    }

    .menu li.menu_choix2 {
        padding-top: 6px;
        padding-right: 10px;
        padding-bottom: 2px;
    }

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

        .menu_choix1 a,
        .menu_choix2 a {
            background-size: 36px 36px;
            background-position-y: 6px;
            padding-left: 40px;
        }

        .menu li.menu_choix1,
        .menu li.menu_choix2 {
            padding-left: 4px;
            padding-right: 0;
        }

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

    /* ============================================================================== */
    /*  Public                                                                        */
    /* ============================================================================== */

    /* The theme for public pages */
    .public_body {
        margin: 20px;
    }

    .public_border {
        border: 1px solid #888;
    }



    ::-webkit-scrollbar {
        width: 12px;
    }

    ::-webkit-scrollbar-button {
        background: #aaa
    }

    ::-webkit-scrollbar-track-piece {
        background: #fff
    }

    ::-webkit-scrollbar-thumb {
        background: #ddd
    }

    /* ============================================================================== */
    /* Ticket module                                                                  */
    /* ============================================================================== */
    .ticketpublicarea {
        width: 100%;
    }

    .publicnewticketform {
        /* margin-top: 25px !important; */
    }

    .ticketlargemargin {
        padding-top: 10px;
        padding-left: 5px;
        padding-right: 5px;
    }

    @media only screen and (max-width: 767px) {
        .ticketlargemargin {
            padding-left: 5px;
            padding-right: 5px;
        }

        .ticketpublicarea {
            width: 100%;
        }
    }

    #cd-timeline {
        position: relative;
        padding: 2em 0;
        margin-bottom: 2em;
    }

    #cd-timeline::before {
        /* this is the vertical line */
        content: '';
        position: absolute;
        top: 0;
        left: 18px;
        height: 100%;
        width: 4px;
        background: #d7e4ed;
    }

    @media only screen and (min-width: 1170px) {
        #cd-timeline {
            margin-bottom: 3em;
        }

        #cd-timeline::before {
            left: 50%;
            margin-left: -2px;
        }
    }

    .cd-timeline-block {
        position: relative;
        margin: 2em 0;
    }

    .cd-timeline-block:after {
        content: "";
        display: table;
        clear: both;
    }

    .cd-timeline-block:first-child {
        margin-top: 0;
    }

    .cd-timeline-block:last-child {
        margin-bottom: 0;
    }

    @media only screen and (min-width: 1170px) {
        .cd-timeline-block {
            margin: 4em 0;
        }

        .cd-timeline-block:first-child {
            margin-top: 0;
        }

        .cd-timeline-block:last-child {
            margin-bottom: 0;
        }
    }

    .cd-timeline-img {
        position: absolute;
        top: 0;
        left: 0;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
        background: #d7e4ed;
    }

    .cd-timeline-img img {
        display: block;
        width: 24px;
        height: 24px;
        position: relative;
        left: 50%;
        top: 50%;
        margin-left: -12px;
        margin-top: -12px;
    }

    .cd-timeline-img.cd-picture {
        background: #75ce66;
    }

    .cd-timeline-img.cd-movie {
        background: #c03b44;
    }

    .cd-timeline-img.cd-location {
        background: #f0ca45;
    }

    @media only screen and (min-width: 1170px) {
        .cd-timeline-img {
            width: 60px;
            height: 60px;
            left: 50%;
            margin-left: -30px;
            /* Force Hardware Acceleration in WebKit */
            -webkit-transform: translateZ(0);
            -webkit-backface-visibility: hidden;
        }

        .cssanimations .cd-timeline-img.is-hidden {
            visibility: hidden;
        }

        .cssanimations .cd-timeline-img.bounce-in {
            visibility: visible;
            -webkit-animation: cd-bounce-1 0.6s;
            -moz-animation: cd-bounce-1 0.6s;
            animation: cd-bounce-1 0.6s;
        }
    }

    @-webkit-keyframes cd-bounce-1 {
        0% {
            opacity: 0;
            -webkit-transform: scale(0.5);
        }

        60% {
            opacity: 1;
            -webkit-transform: scale(1.2);
        }

        100% {
            -webkit-transform: scale(1);
        }
    }

    @-moz-keyframes cd-bounce-1 {
        0% {
            opacity: 0;
            -moz-transform: scale(0.5);
        }

        60% {
            opacity: 1;
            -moz-transform: scale(1.2);
        }

        100% {
            -moz-transform: scale(1);
        }
    }

    @keyframes cd-bounce-1 {
        0% {
            opacity: 0;
            -webkit-transform: scale(0.5);
            -moz-transform: scale(0.5);
            -ms-transform: scale(0.5);
            -o-transform: scale(0.5);
            transform: scale(0.5);
        }

        60% {
            opacity: 1;
            -webkit-transform: scale(1.2);
            -moz-transform: scale(1.2);
            -ms-transform: scale(1.2);
            -o-transform: scale(1.2);
            transform: scale(1.2);
        }

        100% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1);
        }
    }

    .cd-timeline-content {
        position: relative;
        margin-left: 60px;
        background: white;
        border-radius: 0.25em;
        padding: 1em;
        background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
    }

    .cd-timeline-content:after {
        content: "";
        display: table;
        clear: both;
    }

    .cd-timeline-content h2 {
        color: #303e49;
    }

    .cd-timeline-content .cd-date {
        font-size: 13px;
        font-size: 0.8125rem;
    }

    .cd-timeline-content .cd-date {
        display: inline-block;
    }

    .cd-timeline-content p {
        margin: 1em 0;
        line-height: 1.6;
    }

    .cd-timeline-content .cd-date {
        float: left;
        padding: .2em 0;
        opacity: .7;
    }

    .cd-timeline-content::before {
        content: '';
        position: absolute;
        top: 16px;
        right: 100%;
        height: 0;
        width: 0;
        border: 7px solid transparent;
        border-right: 7px solid white;
    }

    @media only screen and (min-width: 768px) {
        .cd-timeline-content h2 {
            font-size: 20px;
            font-size: 1.25rem;
        }

        .cd-timeline-content {
            font-size: 16px;
            font-size: 1rem;
        }

        .cd-timeline-content .cd-read-more,
        .cd-timeline-content .cd-date {
            font-size: 14px;
            font-size: 0.875rem;
        }
    }

    @media only screen and (min-width: 1170px) {
        .cd-timeline-content {
            margin-left: 0;
            padding: 1.6em;
            width: 43%;
        }

        .cd-timeline-content::before {
            top: 24px;
            left: 100%;
            border-color: transparent;
            border-left-color: white;
        }

        .cd-timeline-content .cd-read-more {
            float: left;
        }

        .cd-timeline-content .cd-date {
            position: absolute;
            width: 55%;
            left: 115%;
            top: 6px;
            font-size: 16px;
            font-size: 1rem;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content {
            float: right;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
            top: 24px;
            left: auto;
            right: 100%;
            border-color: transparent;
            border-right-color: white;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
            float: right;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
            left: auto;
            right: 115%;
            text-align: right;
        }

    }

    /* Pagination */
    div.refidpadding {
        padding-top: 3px;
    }

    div.refid {
        font-weight: bold;
        color: rgb(110,80,20);
        font-size: 160%;
    }

    div.refidno {
        padding-top: 2px;
        font-weight: normal;
        color: #444444;
        font-size: 14px;
        line-height: 21px;
    }

    div.refidno form {
        display: inline-block;
    }

    div.pagination {
        float: right;
    }

    div.pagination a {
        font-weight: normal;
    }

    div.pagination ul {
        list-style: none;
        display: inline-block;
        padding-left: 0px;
        padding-right: 0px;
        margin: 0;
    }

    div.pagination li {
        display: inline-block;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 6px;
        padding-bottom: 5px;
    }

    .pagination {
        display: inline-block;
        padding-left: 0;
        border-radius: 4px;
    }

    div.pagination li.pagination a,
    div.pagination li.pagination span {
        padding: 6px 12px;
        padding-top: 8px;
        line-height: 1.42857143;
        color: #000;
        text-decoration: none;
    }

    div.pagination li.pagination span.inactive {
        cursor: default;
        color: #ccc;
    }

    div.pagination li.litext {
        padding-top: 8px;
    }

    div.pagination li.litext a {
        border: none;
        padding-right: 10px;
        padding-left: 4px;
        font-weight: bold;
    }

    div.pagination li.noborder a:focus,
    div.pagination li.noborder a:hover {
        border: none;
        background-color: transparent;
    }

    div.pagination li:first-child a,
    div.pagination li:first-child span {
        margin-left: 0;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
    }

    div.pagination li:last-child a,
    div.pagination li:last-child span {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    /* color y background-color modificado por ricardo130 */
    div.pagination li a:hover,
    div.pagination li span:hover,
    div.pagination li a:focus,
    div.pagination li span:focus {
        /* color: #000;
        background-color: #eee; */
        border-color: rgba(0, 0, 0, .24);
    }

    div.pagination li .active a,
    div.pagination li .active span,
    div.pagination li .active a:hover,
    div.pagination li .active span:hover,
    div.pagination li .active a:focus,
    div.pagination li .active span:focus {
        z-index: 2;
        color: #fff;
        cursor: default;
        background-color: ;
        border-color: #337ab7;
    }

    div.pagination .disabled span,
    div.pagination .disabled span:hover,
    div.pagination .disabled span:focus,
    div.pagination .disabled a,
    div.pagination .disabled a:hover,
    div.pagination .disabled a:focus {
        color: #777;
        cursor: not-allowed;
        background-color: #fff;
        border-color: rgba(0, 0, 0, .24);
    }

    div.pagination li.pagination .active {
        text-decoration: underline;
        box-shadow: none;
    }

    .paginationafterarrows .nohover {
        box-shadow: none !important;
    }

    div.pagination li.paginationafterarrows {
        margin-left: 10px;
    }

    .paginationatbottom {
        margin-top: 9px;
    }

    /* Set the color for hover lines */
    .oddeven:hover,
    .evenodd:hover,
    .impair:hover,
    .pair:hover {
        background: rgb() !important;
        /* Must be background to be stronger than background of odd or even */
    }

    .tredited,
    .tredited td {
        background: rgb(230,237,244) !important;
        /* Must be background to be stronger than background of odd or even */
        border-bottom: 0 !important;
    }

    .treditedlinefordate {
        background: rgb(230,237,244) !important;
        /* Must be background to be stronger than background of odd or even */
        border-bottom: 0px;
    }

    .highlight {
        background: rgb(230,237,244) !important;
        /* Must be background to be stronger than background of odd or even */
    }

    .nohover:hover {
        background: unset;
    }

    .nohoverborder:hover {
        border: unset;
        box-shadow: unset;
        -webkit-box-shadow: unset;
    }

    .oddeven,
    .evenodd,
    .impair,
    .nohover .impair:hover,
    tr.impair td.nohover,
    .tagtr.oddeven {
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        margin-bottom: 1px;
        color: #202020;
    }

    .impair,
    .nohover .impair:hover,
    tr.impair td.nohover {
        background: #f4f4f4;
    }

    #GanttChartDIV {
        background-color: #f4f4f4;
    }

    .oddeven,
    .evenodd,
    .pair,
    .nohover .pair:hover,
    tr.pair td.nohover,
    .tagtr.oddeven {
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        margin-bottom: 1px;
        color: #202020;
    }

    .pair,
    .nohover .pair:hover,
    tr.pair td.nohover {
        background-color: #f8f8f8;
    }

    table.dataTable tr.oddeven {
        background-color: #f8f8f8 !important;
    }

    /* For no hover style */
    td.oddeven,
    tr.nohover td,
    form.nohover,
    form.nohover:hover {
        /*
    background-color: #f4f4f4 !important;
    background: #f4f4f4 !important;
    */
    }

    td.evenodd {
        background-color: #f8f8f8 !important;
        background: #f8f8f8 !important;
    }

    .trforbreak td {
        background-color: #e9e4e6 !important;
    }

    .trforbreak td,
    table.noborder tr.trforbreak td a:link {
        color: #000;
    }

    table.dataTable td {
        padding: 5px 8px 5px 8px !important;
    }

    tr.pair td,
    tr.impair td,
    form.impair div.tagtd,
    form.pair div.tagtd,
    div.impair div.tagtd,
    div.pair div.tagtd,
    div.liste_titre div.tagtd {
        padding: 7px 8px 7px 8px;
        border-bottom: 1px solid #ddd;
    }

    form.pair,
    form.impair {
        font-weight: normal;
    }

    form.tagtr:last-of-type div.tagtd,
    tr.pair:last-of-type td,
    tr.impair:last-of-type td {
        border-bottom: 0px !important;
    }

    tr.nobottom td {
        border-bottom: 0px !important;
    }

    div.tableforcontact form.tagtr:last-of-type div.tagtd {
        border-bottom: 1px solid #ddd !important;
    }

    tr.pair td .nobordernopadding tr td,
    tr.impair td .nobordernopadding tr td {
        border-bottom: 0px !important;
    }

    table.nobottomiftotal tr.liste_total td {
        background-color: #fff;
        border-bottom: 0px !important;
    }

    table.nobottom,
    td.nobottom {
        border-bottom: 0px !important;
    }

    div.liste_titre .tagtd {
        vertical-align: middle;
    }

    div.liste_titre {
        min-height: 26px !important;
        /* We cant use height because it's a div and it should be higher if content is more. but min-height does not work either for div */

        padding-top: 2px;
        padding-bottom: 2px;
    }

    div.liste_titre_bydiv {
        border-top-width: 2px;
        border-top-color: rgb(200,200,200);
        border-top-style: solid;

        border-collapse: collapse;
        display: table;
        padding: 2px 0px 2px 0;
        box-shadow: none;
        /*width: calc(100% - 1px);	1px more, i don't know why so i remove */
        width: calc(100%);
    }

    tr.liste_titre,
    tr.liste_titre_sel,
    form.liste_titre,
    form.liste_titre_sel,
    table.dataTable.tr,
    tagtr.liste_titre {
        height: 26px !important;
    }

    div.colorback

    /* for the form "assign user" on time spent view */
        {
        background: #f8f8f8;
        padding: 10px;
        margin-top: 5px;
        border: 1px solid #ddd;
    }

    div.liste_titre_bydiv,
    .liste_titre div.tagtr,
    tr.liste_titre,
    tr.liste_titre_sel,
    .tagtr.liste_titre,
    .tagtr.liste_titre_sel,
    form.liste_titre,
    form.liste_titre_sel,
    table.dataTable thead tr {
        /*background: rgb(230,230,230);*/
        /*font-weight: bold;*/
        font-weight: normal;

        color: rgb(444);
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        text-align: left;
    }

    tr.liste_titre th,
    tr.liste_titre td,
    th.liste_titre {
        border-bottom: 1px solid rgb(200,200,200);
    }

    tr.liste_titre:first-child th,
    tr:first-child th.liste_titre {
        /*    border-bottom: 1px solid #ddd ! important; */
        border-bottom: unset;
    }

    tr.liste_titre th,
    th.liste_titre,
    tr.liste_titre td,
    td.liste_titre,
    form.liste_titre div {
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        font-weight: bold;
        vertical-align: middle;
        height: 24px;
    }

    tr.liste_titre th a,
    th.liste_titre a,
    tr.liste_titre td a,
    td.liste_titre a,
    form.liste_titre div a,
    div.liste_titre a {
        text-shadow: none !important;
    }

    tr.liste_titre_topborder td {
        border-top-width: 2px;
        border-top-color: rgb(200,200,200);
        border-top-style: solid;
    }

    .liste_titre td a {
        text-shadow: none !important;
        color: rgb(444);
    }

    .liste_titre td a.notasortlink {
        color: rgb(40,40,40);
    }

    .liste_titre td a.notasortlink:hover {
        background: transparent;
    }

    tr.liste_titre:last-child th.liste_titre,
    tr.liste_titre:last-child th.liste_titre_sel,
    tr.liste_titre td.liste_titre,
    tr.liste_titre td.liste_titre_sel,
    form.liste_titre div.tagtd {
        /* For last line of table headers only */
        /* border-bottom: 1px solid #ddd; */
        border-bottom: unset;
    }

    div.liste_titre {
        padding-left: 3px;
    }

    tr.liste_titre_sel th,
    th.liste_titre_sel,
    tr.liste_titre_sel td,
    td.liste_titre_sel,
    form.liste_titre_sel div {
        font-family: "Open Sans",Tahoma,Arial,Helvetica;
        font-weight: normal;
        border-bottom: 1px solid #FDFFFF;
        text-decoration: underline;
    }

    input.liste_titre {
        background: transparent;
        border: 0px;
    }

    .listactionlargetitle .liste_titre {
        line-height: 24px;
    }

    .noborder tr.liste_total td,
    tr.liste_total td,
    form.liste_total div,
    .noborder tr.liste_total_wrap td,
    tr.liste_total_wrap td,
    form.liste_total_wrap div {
        color: #551188;
        font-weight: normal;
    }

    .noborder tr.liste_total td,
    tr.liste_total td,
    form.liste_total div {
        white-space: nowrap;
    }

    .noborder tr.liste_total_wrap td,
    tr.liste_total_wrap td,
    form.liste_total_wrap div {
        white-space: normal;
    }

    form.liste_total div {
        border-top: 1px solid #DDDDDD;
    }

    tr.liste_sub_total,
    tr.liste_sub_total td {
        border-bottom: 1px solid #aaa;
    }

    /* to avoid too much border on contract card */
    .tableforservicepart1 .impair,
    .tableforservicepart1 .pair,
    .tableforservicepart2 .impair,
    .tableforservicepart2 .pair {
        background: #FFF;
    }

    .tableforservicepart1 tbody tr td,
    .tableforservicepart2 tbody tr td {
        border-bottom: none;
    }

    table.tableforservicepart1:first-of-type tr:first-of-type td {
        border-top: 1px solid #888;
    }

    table.tableforservicepart1 tr td {
        border-top: 0px;
    }

    .paymenttable,
    .margintable {
        /*border-top-width: 2px !important;
	border-top-color: rgb(200,200,200) !important;
	border-top-style: solid !important;*/
        border-top: none !important;
        margin: 0px 0px 0px 0px !important;
    }

    table.noborder.paymenttable {
        border-bottom: none !important;
    }

    .paymenttable tr td:first-child,
    .margintable tr td:first-child {
        padding-left: 2px;
    }

    .paymenttable,
    .margintable tr td {
        height: 22px;
    }

    /* Disable-Enable shadows */
    .noshadow {
        -webkit-box-shadow: 0px 0px 0px #DDD !important;
        box-shadow: 0px 0px 0px #DDD !important;
    }

    .shadow {
        -webkit-box-shadow: 2px 2px 5px #CCC !important;
        box-shadow: 2px 2px 5px #CCC !important;
    }

    div.tabBar .noborder {
        -webkit-box-shadow: 0px 0px 0px #DDD !important;
        box-shadow: 0px 0px 0px #DDD !important;
    }

    #tablelines tr.liste_titre td,
    .paymenttable tr.liste_titre td,
    .margintable tr.liste_titre td,
    .tableforservicepart1 tr.liste_titre td {
        border-bottom: 1px solid rgb(200,200,200) !important;
    }

    #tablelines tr td {
        height: unset;
    }

    /* Prepare to remove class pair - impair */
    .noborder>tbody>tr:nth-child(even):not(.liste_titre),
    .liste>tbody>tr:nth-child(even):not(.liste_titre),
    div:not(.fichecenter):not(.fichehalfleft):not(.fichehalfright):not(.ficheaddleft)>.border>tbody>tr:nth-of-type(even):not(.liste_titre),
    .liste>tbody>tr:nth-of-type(even):not(.liste_titre),
    div:not(.fichecenter):not(.fichehalfleft):not(.fichehalfright):not(.ficheaddleft) .oddeven.tagtr:nth-of-type(even):not(.liste_titre) {
        background: linear-gradient(bottom, rgb(244,244,244) 85%, rgb(250,250,250) 100%);
        background: -o-linear-gradient(bottom, rgb(244,244,244) 85%, rgb(250,250,250) 100%);
        background: -moz-linear-gradient(bottom, rgb(244,244,244) 85%, rgb(250,250,250) 100%);
        background: -webkit-linear-gradient(bottom, rgb(244,244,244) 85%, rgb(250,250,250) 100%);
        background: -ms-linear-gradient(bottom, rgb(244,244,244) 85%, rgb(250,250,250) 100%);
    }

    .noborder>tbody>tr:nth-child(even):not(:last-child) td:not(.liste_titre),
    .liste>tbody>tr:nth-child(even):not(:last-child) td:not(.liste_titre),
    .noborder .oddeven.tagtr:nth-child(even):not(:last-child) .tagtd:not(.liste_titre) {
        border-bottom: 1px solid #e0e0e0;
    }

    .noborder>tbody>tr:nth-child(odd):not(.liste_titre),
    .liste>tbody>tr:nth-child(odd):not(.liste_titre),
    div:not(.fichecenter):not(.fichehalfleft):not(.fichehalfright):not(.ficheaddleft)>.border>tbody>tr:nth-of-type(odd):not(.liste_titre),
    .liste>tbody>tr:nth-of-type(odd):not(.liste_titre),
    div:not(.fichecenter):not(.fichehalfleft):not(.fichehalfright):not(.ficheaddleft) .oddeven.tagtr:nth-of-type(odd):not(.liste_titre) {
        background: linear-gradient(bottom, rgb(248,248,248) 85%, rgb(246,246,246) 100%);
        background: -o-linear-gradient(bottom, rgb(248,248,248) 85%, rgb(246,246,246) 100%);
        background: -moz-linear-gradient(bottom, rgb(248,248,248) 85%, rgb(246,246,246) 100%);
        background: -webkit-linear-gradient(bottom, rgb(248,248,248) 85%, rgb(246,246,246) 100%);
        background: -ms-linear-gradient(bottom, rgb(248,248,248) 85%, rgb(246,246,246) 100%);
    }

    .noborder>tbody>tr:nth-child(odd):not(:last-child) td:not(.liste_titre),
    .liste>tbody>tr:nth-child(odd):not(:last-child) td:not(.liste_titre),
    .noborder .oddeven.tagtr:nth-child(odd):not(:last-child) .tagtd:not(.liste_titre) {
        border-bottom: 1px solid #e0e0e0;
    }

    ul.noborder li:nth-child(even):not(.liste_titre) {
        background-color: rgb(246,246,246) !important;
    }

    /* ============================================================================== */
    /*	Multiselect with checkbox													  */
    /* ============================================================================== */

    ul.ulselectedfields {
        z-index: 90;
        /* To have the select box appears on first plan even when near buttons are decorated by jmobile */
    }

    dl.dropdown {
        margin: 0px;
        padding: 0px;
        margin-left: 2px;
        margin-right: 2px;
        vertical-align: text-bottom;
        display: inline-block;
    }

    .dropdown dd,
    .dropdown dt {
        margin: 0px;
        padding: 0px;
    }

    .dropdown ul {
        margin: -1px 0 0 0;
        text-align: left;
    }

    .dropdown dd {
        position: relative;
    }

    .dropdown dt a {
        display: block;
        overflow: hidden;
        border: 0;
    }

    .dropdown dt a span,
    .multiSel span {
        cursor: pointer;
        display: inline-block;
        padding: 0 3px 2px 0;
    }

    .dropdown span.value {
        display: none;
    }

    .dropdown dd ul {
        color: #444444;
        background-color: #FFF;
        border: 1px solid #888;
        display: none;
        right: 0px;
        /* pop is align on right */
        padding: 2px 15px 2px 5px;
        position: absolute;
        top: 2px;
        list-style: none;
        max-height: 264px;
        overflow: auto;
    }

    .dropdown dd ul li {
        white-space: nowrap;
        font-weight: normal;
        padding: 2px;
        color: #000;
    }

    .dropdown dd ul li input[type="checkbox"] {
        margin-right: 3px;
    }

    .dropdown dd ul li a,
    .dropdown dd ul li span {
        padding: 3px;
        display: block;
    }

    .dropdown dd ul li span {
        color: #888;
    }

    .dropdown dd ul li a:hover,
    .dropdown dd ul li a:focus {
        background-color: #fff;
    }

    img.loginphoto {
        border-radius: 2px;
        width: 16px;
        height: 16px;
    }

    .span-icon-user {
        background: url(/htdocs/theme/oblyon/img/object_user.png) no-repeat scroll 7px 7px;
    }

    .span-icon-password {
        background-image: url(/htdocs/theme/oblyon/img/lock.png);
        background-repeat: no-repeat;
    }

    /* ============================================================================== */
    /* Compatibility Multicompany													  */
    /* ============================================================================== */
    #entity {
        width: 280px !important;
        padding-left: 10px;
    }

    .dropdown-mc-image {
        color: #ffffff;
    }

    .atoplogin #mc-dropdown-icon {
        color: #FFFFFF;
            }

    /* ============================================================================== */
    /* Compatibility Infrassearch													  */
    /* ============================================================================== */
    input#sew_keyword {
        background-color: #fff !important;
        width: 100% !important;
        line-height: 28px;
    }

    /* ============================================================================== */
    /*  Markdown rendering                                                             */
    /* ============================================================================== */

    .imgmd {
        width: 90%;
    }

    .moduledesclong h1 {
        padding-top: 10px;
        padding-bottom: 20px;
    }


    /* ============================================================================== */
    /*  JMobile - Android                                                             */
    /* ============================================================================== */

    .searchpage .tagtr .tagtd {
        padding-bottom: 3px;
    }

    .searchpage .tagtr .tagtd .button {
        background: unset;
        border: unset;
    }

    li.ui-li-divider .ui-link {
        color: #FFF !important;
    }

    .ui-btn {
        margin: 0 2px;
    }

    a.ui-link,
    a.ui-link:hover,
    .ui-btn:hover,
    span.ui-btn-text:hover,
    span.ui-btn-inner:hover {
        text-decoration: none !important;
    }

    .ui-body-c {
        background: #fff;
    }

    .ui-btn-inner {
        min-width: .4em;
        padding-left: 6px;
        padding-right: 6px;
        font-size: 14px;
        /* white-space: normal; */
        /* Warning, enable this break the truncate feature */
    }

    .ui-btn-icon-right .ui-btn-inner {
        padding-right: 30px;
    }

    .ui-btn-icon-left .ui-btn-inner {
        padding-left: 30px;
    }

    .ui-select .ui-btn-icon-right .ui-btn-inner {
        padding-right: 30px;
    }

    .ui-select .ui-btn-icon-left .ui-btn-inner {
        padding-left: 30px;
    }

    .ui-select .ui-btn-icon-right .ui-icon {
        right: 8px;
    }

    .ui-btn-icon-left>.ui-btn-inner>.ui-icon,
    .ui-btn-icon-right>.ui-btn-inner>.ui-icon {
        margin-top: -10px;
    }

    select {
        /* display: inline-block; */
        /* We can't set this. This disable ability to make */
        overflow: hidden;
        white-space: nowrap;
        /* Enabling this make behaviour strange when selecting the empty value if this empty value is '' instead of '&nbsp;' */
        text-overflow: ellipsis;
    }

    .fiche .ui-controlgroup {
        margin: 0px;
        padding-bottom: 0px;
    }

    div.ui-controlgroup-controls div.tabsElem {
        margin-top: 2px;
    }

    div.ui-controlgroup-controls div.tabsElem a {
        -webkit-box-shadow: 0 -3px 6px rgba(0, 0, 0, .2);
        box-shadow: 0 -3px 6px rgba(0, 0, 0, .2);
    }

    div.ui-controlgroup-controls div.tabsElem a#active {
        -webkit-box-shadow: 0 -3px 6px rgba(0, 0, 0, .3);
        box-shadow: 0 -3px 6px rgba(0, 0, 0, .3);
    }

    a.tab span.ui-btn-inner {
        border: none;
        padding: 0;
    }

    .ui-link {
        color: var(--colortext);
    }

    .liste_titre .ui-link {
        color: var(--colortexttitle) !important;
    }

    a.ui-link {
        word-wrap: break-word;
    }

    /* force wrap possible onto field overflow does not works */
    .formdoc .ui-btn-inner {
        white-space: normal;
        overflow: hidden;
        text-overflow: clip;
        /* "hidden" : do not exists as a text-overflow value (https://developer.mozilla.org/fr/docs/Web/CSS/text-overflow) */
    }

    /* Warning: setting this may make screen not beeing refreshed after a combo selection */
    /*.ui-body-c {
	background: #fff;
}*/

    div.ui-radio,
    div.ui-checkbox {
        display: inline-block;
        border-bottom: 0px !important;
    }

    .ui-checkbox input,
    .ui-radio input {
        height: auto;
        width: auto;
        margin: 4px;
        position: static;
    }

    div.ui-checkbox label+input,
    div.ui-radio label+input {
        position: absolute;
    }

    .ui-mobile fieldset {
        padding-bottom: 10px;
        margin-bottom: 4px;
        border-bottom: 1px solid #AAAAAA !important;
    }

    ul.ulmenu {
        border-radius: 0;
        -webkit-border-radius: 0;
    }

    .ui-field-contain label.ui-input-text {
        vertical-align: middle !important;
    }

    .ui-mobile fieldset {
        border-bottom: none !important;
    }

    /* Style for first level menu with jmobile */
    .ui-li .ui-btn-inner a.ui-link-inherit,
    .ui-li-static.ui-li {
        padding: 1em 15px;
        display: block;
    }

    .ui-btn-up-c {
        font-weight: normal;
    }

    .ui-focus,
    .ui-btn:focus {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .ui-bar-b {
        /*border: 1px solid #888;*/
        border: none;
        background: none;
        text-shadow: none;
        color: var(--colortexttitlenotab) !important;
    }

    .ui-bar-b,
    .lilevel0 {
        background-repeat: repeat-x;
        border: none;
        background: none;
        text-shadow: none;
        color: var(--colortexttitlenotab) !important;
    }

    .alilevel0 {
        font-weight: normal !important;
    }

    .ui-li.ui-last-child,
    .ui-li.ui-field-contain.ui-last-child {
        border-bottom-width: 0px !important;
    }

    .alilevel0 {
        color: var(--colortexttitle) !important;
        background: var(--colorbackmobilemenu);
    }

    .ulmenu {
        box-shadow: none !important;
        border-bottom: 1px solid #ccc;
    }

    .ui-btn-icon-right {
        border-right: 1px solid #ccc !important;
    }

    .ui-body-c {
        border: 1px solid #ccc;
        text-shadow: none;
    }

    .ui-btn-up-c,
    .ui-btn-hover-c {
        /* border: 1px solid #ccc; */
        text-shadow: none;
    }

    .ui-body-c .ui-link,
    .ui-body-c .ui-link:visited,
    .ui-body-c .ui-link:hover {
        color: var(--colortextlink);
    }

    .ui-btn-up-c .vsmenudisabled {
        color: #FFF !important;
        text-shadow: none !important;
    }

    div.tabsElem a.tab {
        background: transparent;
    }

    .alilevel1 {
        color: var(--colortexttitlenotab) !important;
    }

    .lilevel1 {
        border-top: 2px solid #444;
        background: #fff ! important;
    }

    .lilevel1 div div a {
        font-weight: bold !important;
    }

    .lilevel2 {
        padding-left: 22px;
        background: #fff ! important;
    }

    .lilevel3 {
        padding-left: 44px;
        background: #fff ! important;
    }

    .lilevel4 {
        padding-left: 66px;
        background: #fff ! important;
    }

    .lilevel5 {
        padding-left: 88px;
        background: #fff ! important;
    }



    /* ============================================================================== */
    /*  POS                                                                           */
    /* ============================================================================== */

    .menu_choix1,
    .menu_choix2 {
        font-size: 1.4em;
        text-align: left;
        border: 1px solid #666;
        margin-right: 20px;
    }

    .menu_choix1 a,
    .menu_choix2 a {
        display: block;
        color: #fff;
        text-decoration: none;
        padding-top: 18px;
        padding-left: 10px;
        font-size: 14px;
        height: 38px;
    }

    .menu_choix1 a:hover,
    .menu_choix2 a:hover {
        color: #6d3f6d;
    }

    .menu li.menu_choix1 {
        padding-top: 6px;
        padding-right: 10px;
        padding-bottom: 2px;
    }

    .menu li.menu_choix2 {
        padding-top: 6px;
        padding-right: 10px;
        padding-bottom: 2px;
    }

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

        .menu_choix1 a,
        .menu_choix2 a {
            background-size: 36px 36px;
            height: 30px;
            padding-left: 40px;
        }

        .menu li.menu_choix1,
        .menu li.menu_choix2 {
            padding-left: 4px;
            padding-right: 0;
        }

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


    /* ============================================================================== */
    /*  Public                                                                        */
    /* ============================================================================== */

    /* The theme for public pages */
    .public_body {
        margin: 20px;
    }

    .public_border {
        border: 1px solid #888;
    }



    /* ============================================================================== */
    /* Ticket module                                                                  */
    /* ============================================================================== */

    .ticketpublictable td {
        height: 28px;
    }

    .ticketpublicarea {
        margin-left: 15%;
        margin-right: 15%;
    }

    .publicnewticketform {
        /* margin-top: 25px !important; */
    }

    .ticketlargemargin {
        padding-left: 50px;
        padding-right: 50px;
        padding-top: 30px;
    }

    @media only screen and (max-width: 767px) {
        .ticketlargemargin {
            padding-left: 5px;
            padding-right: 5px;
            padding-top: 10px;
        }

        .ticketpublicarea {
            margin-left: 10px;
            margin-right: 10px;
        }
    }

    #cd-timeline {
        position: relative;
        padding: 2em 0;
        margin-bottom: 2em;
    }

    #cd-timeline::before {
        /* this is the vertical line */
        content: '';
        position: absolute;
        top: 0;
        left: 18px;
        height: 100%;
        width: 4px;
        background: #d7e4ed;
    }

    @media only screen and (min-width: 1170px) {
        #cd-timeline {
            margin-bottom: 3em;
        }

        #cd-timeline::before {
            left: 50%;
            margin-left: -2px;
        }
    }

    .cd-timeline-block {
        position: relative;
        margin: 2em 0;
    }

    .cd-timeline-block:after {
        content: "";
        display: table;
        clear: both;
    }

    .cd-timeline-block:first-child {
        margin-top: 0;
    }

    .cd-timeline-block:last-child {
        margin-bottom: 0;
    }

    @media only screen and (min-width: 1170px) {
        .cd-timeline-block {
            margin: 4em 0;
        }

        .cd-timeline-block:first-child {
            margin-top: 0;
        }

        .cd-timeline-block:last-child {
            margin-bottom: 0;
        }
    }

    .cd-timeline-img {
        position: absolute;
        top: 0;
        left: 0;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
        background: #d7e4ed;
    }

    .cd-timeline-img img {
        display: block;
        width: 24px;
        height: 24px;
        position: relative;
        left: 50%;
        top: 50%;
        margin-left: -12px;
        margin-top: -12px;
    }

    .cd-timeline-img.cd-picture {
        background: #75ce66;
    }

    .cd-timeline-img.cd-movie {
        background: #c03b44;
    }

    .cd-timeline-img.cd-location {
        background: #f0ca45;
    }

    @media only screen and (min-width: 1170px) {
        .cd-timeline-img {
            width: 60px;
            height: 60px;
            left: 50%;
            margin-left: -30px;
            /* Force Hardware Acceleration in WebKit */
            -webkit-transform: translateZ(0);
            -webkit-backface-visibility: hidden;
        }

        .cssanimations .cd-timeline-img.is-hidden {
            visibility: hidden;
        }

        .cssanimations .cd-timeline-img.bounce-in {
            visibility: visible;
            -webkit-animation: cd-bounce-1 0.6s;
            -moz-animation: cd-bounce-1 0.6s;
            animation: cd-bounce-1 0.6s;
        }
    }

    @-webkit-keyframes cd-bounce-1 {
        0% {
            opacity: 0;
            -webkit-transform: scale(0.5);
        }

        60% {
            opacity: 1;
            -webkit-transform: scale(1.2);
        }

        100% {
            -webkit-transform: scale(1);
        }
    }

    @-moz-keyframes cd-bounce-1 {
        0% {
            opacity: 0;
            -moz-transform: scale(0.5);
        }

        60% {
            opacity: 1;
            -moz-transform: scale(1.2);
        }

        100% {
            -moz-transform: scale(1);
        }
    }

    @keyframes cd-bounce-1 {
        0% {
            opacity: 0;
            -webkit-transform: scale(0.5);
            -moz-transform: scale(0.5);
            -ms-transform: scale(0.5);
            -o-transform: scale(0.5);
            transform: scale(0.5);
        }

        60% {
            opacity: 1;
            -webkit-transform: scale(1.2);
            -moz-transform: scale(1.2);
            -ms-transform: scale(1.2);
            -o-transform: scale(1.2);
            transform: scale(1.2);
        }

        100% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1);
        }
    }

    .cd-timeline-content {
        position: relative;
        margin-left: 60px;
        background: white;
        border-radius: 0.25em;
        padding: 1em;
        background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
        background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.1) 0%, rgba(230, 230, 230, 0.4) 100%);
    }

    .cd-timeline-content:after {
        content: "";
        display: table;
        clear: both;
    }

    .cd-timeline-content h2 {
        color: #303e49;
    }

    .cd-timeline-content .cd-date {
        font-size: 13px;
        font-size: 0.8125rem;
    }

    .cd-timeline-content .cd-date {
        display: inline-block;
    }

    .cd-timeline-content p {
        margin: 1em 0;
        line-height: 1.6;
    }

    .cd-timeline-content .cd-date {
        float: left;
        padding: .2em 0;
        opacity: .7;
    }

    .cd-timeline-content::before {
        content: '';
        position: absolute;
        top: 16px;
        right: 100%;
        height: 0;
        width: 0;
        border: 7px solid transparent;
        border-right: 7px solid white;
    }

    @media only screen and (min-width: 768px) {
        .cd-timeline-content h2 {
            font-size: 20px;
            font-size: 1.25rem;
        }

        .cd-timeline-content {
            font-size: 16px;
            font-size: 1rem;
        }

        .cd-timeline-content .cd-read-more,
        .cd-timeline-content .cd-date {
            font-size: 14px;
            font-size: 0.875rem;
        }
    }

    @media only screen and (min-width: 1170px) {
        .cd-timeline-content {
            margin-left: 0;
            padding: 1.6em;
            width: 43%;
        }

        .cd-timeline-content::before {
            top: 24px;
            left: 100%;
            border-color: transparent;
            border-left-color: white;
        }

        .cd-timeline-content .cd-read-more {
            float: left;
        }

        .cd-timeline-content .cd-date {
            position: absolute;
            width: 55%;
            left: 115%;
            top: 6px;
            font-size: 16px;
            font-size: 1rem;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content {
            float: right;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
            top: 24px;
            left: auto;
            right: 100%;
            border-color: transparent;
            border-right-color: white;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
            float: right;
        }

        .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
            left: auto;
            right: 115%;
            text-align: right;
        }

    }


    /* ============================================================================== */
    /* CSS style for debugbar                                                         */
    /* ============================================================================== */

    div.phpdebugbar * {
        font-weight: unset;
    }

    span.phpdebugbar-tooltip.phpdebugbar-tooltip-extra-wide,
    span.phpdebugbar-tooltip.phpdebugbar-tooltip-wide {
        width: 250px !important;
    }

    .phpdebugbar-indicator span.phpdebugbar-tooltip {
        opacity: .95 !important;
    }

    a.phpdebugbar-tab.phpdebugbar-active {
        background-image: unset !important;
    }

    .phpdebugbar-fa-tags:before {
        content: "\f121";
        font-weight: 600 !important;
    }

    .phpdebugbar-fa-tasks:before {
        content: "\f550";
        font-weight: 600 !important;
    }

    .phpdebugbar-fa-tags,
    .phpdebugbar-fa-tasks,
    .phpdebugbar-indicator .fa {
        font-family: "Font Awesome 5 Free";
        font-weight: 600;
    }

    div.phpdebugbar-widgets-messages li.phpdebugbar-widgets-list-item span.phpdebugbar-widgets-value.phpdebugbar-widgets-warning:before,
    div.phpdebugbar-widgets-messages li.phpdebugbar-widgets-list-item span.phpdebugbar-widgets-value.phpdebugbar-widgets-error:before,
    div.phpdebugbar-widgets-exceptions a.phpdebugbar-widgets-editor-link:before,
    div.phpdebugbar-widgets-sqlqueries span.phpdebugbar-widgets-database:before,
    div.phpdebugbar-widgets-sqlqueries span.phpdebugbar-widgets-duration:before,
    div.phpdebugbar-widgets-sqlqueries span.phpdebugbar-widgets-memory:before,
    div.phpdebugbar-widgets-sqlqueries span.phpdebugbar-widgets-row-count:before,
    div.phpdebugbar-widgets-sqlqueries span.phpdebugbar-widgets-copy-clipboard:before,
    div.phpdebugbar-widgets-sqlqueries span.phpdebugbar-widgets-stmt-id:before,
    div.phpdebugbar-widgets-templates span.phpdebugbar-widgets-render-time:before,
    div.phpdebugbar-widgets-templates span.phpdebugbar-widgets-memory:before,
    div.phpdebugbar-widgets-templates span.phpdebugbar-widgets-param-count:before,
    div.phpdebugbar-widgets-templates span.phpdebugbar-widgets-type:before,
    div.phpdebugbar-widgets-templates a.phpdebugbar-widgets-editor-link:before {
        font-family: "Font Awesome 5 Free" !important;
    }

    /* ============================================================================== */
    /* CSS style used for jCrop                                                       */
    /* ============================================================================== */

    .jcrop-holder {
        background: unset !important;
    }


    /* ============================================================================== */
    /* CSS style used for jFlot                                                       */
    /* ============================================================================== */

    .dol-xaxis-vertical .flot-x-axis .flot-tick-label.tickLabel {
        text-orientation: sideways;
        font-weight: 400;
        writing-mode: vertical-rl;
        white-space: nowrap;
    }

    /* ============================================================================== */
    /* For copy-paste feature                                                         */
    /* ============================================================================== */

    span.clipboardCPValueToPrint {
        display: inline-block;
    }

    span.clipboardCPValue.hidewithsize {
        width: 0 !important;
        display: inline-block;
        color: transparent;
        white-space: nowrap;
    }

    .clipboardCPShowOnHover .clipboardCPButton {
        display: none;
    }

    /* ============================================================================== */
    /* CSS style used for small screen												  */
    /* ============================================================================== */

    .topmenuimage {
        background-size: 22px auto;
        top: 2px;
    }

    .imgopensurveywizard {
        padding: 0 4px 0 4px;
    }

    /* rule to reduce inverted top menu */
    @media only screen and (max-width: 1200px) {
        #tmenu_tooltipinvert .sec-nav__item {
            max-width: 120px;
        }

        #tmenu_tooltipinvert .sec-nav__item .icon {
            display: none;
        }

        .sec-nav__link {
            overflow: hidden;
            text-overflow: ".";
        }
    }

    /* rule to reduce inverted top menu */
    @media only screen and (max-width: 1024px) {
        #tmenu_tooltipinvert .sec-nav__item {
            max-width: 100px;
        }

        #tmenu_tooltipinvert .sec-nav__item .icon {
            display: none;
        }

        .sec-nav__sub-item {
            overflow-wrap: break-word;
        }

        div.vmenu {
            min-width: 210px;
            max-width: 100%;
                    }

        .vmenusearchselectcombo {
            min-width: 150px;
            max-width: 100%;
        }

        .sec-nav.is-inverted {
            margin-left: 10px;
                    }

        #id-left {
            z-index: 96;
        }

            }

    /* rule to reduce inverted top menu */
    @media only screen and (max-width: 905px) {
        #tmenu_tooltip {
            padding-right: 92px;
        }

        #tmenu_tooltipinvert .sec-nav__item {
            max-width: 80px;
        }
    }

    /* rule to reduce top menu */
    @media only screen and (max-width: 767px) {
        #tmenu_tooltip .main-nav__item {
            max-width: 66px;
        }

        .main-nav__link {
            overflow: hidden;
            text-overflow: '.';
        }

        #tmenu_tooltipinvert .sec-nav__item {
            max-width: 60px;
        }

        #tmenu_tooltipinvert .sec-nav__item .icon {
            display: none;
        }

        div.vmenu {
            min-width: 130px;
                    }

        .vmenusearchselectcombo {
            min-width: 110px;
        }

        .sec-nav.is-inverted {
            margin-left: 5px;
                    }

        .imgopensurveywizard,
        .imgautosize {
            width: 95%;
            height: auto;
        }

        #tooltip {
            position: absolute;
            width: 350px;
        }

        div.tabBar {
            padding-left: 0px;
            padding-right: 0px;
            -webkit-border-radius: 0;
            border-radius: 0px;
            border-right: none;
            border-left: none;
        }

        .box-flex-container {
            margin: 0 0 0 -8px !important;
        }

        #tmenu_tooltipinvert .pushy-btn,
        #tmenu_tooltip .pushy-btn {
            /* for v3.5 */
            font-size: 18px !important;
            height: 54px;
            line-height: 54px;
                    }

        div.login_block {
            font-size: 16px !important;
            padding-right: 5px;
        }

        .menulogocontainer {
            display: none;
        }

        .main-nav .icon {
            font-size: 14px;
        }

        /*modificado rg*/
        #tmenu_tooltip .main-nav__link {
            padding: 0 1px;
            max-width: 70px;
        }
    }

    /* nboftopmenuentries = , fontsize=14 */
    /* rule to reduce top menu - 1st reduction */
    @media only screen and (max-width: 8px) {
        div.tmenucenter {
            max-width: 56px;
            /* size of viewport */
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            color: #444;
        }

        .mainmenuaspan {
            font-size: 10px;
        }

        .topmenuimage {
            background-size: 26px auto;
            margin-top: 0px;
        }

        li.tmenu,
        li.tmenusel {
            min-width: 32px;
        }

        div.mainmenu {
            min-width: auto;
        }

        div.tmenuleft {
            display: none;
        }

        #tmenu_tooltipinvert .sec-nav__item .icon {
            display: none;
        }
    }

    /* rule to reduce top menu - 2nd reduction */
    @media only screen and (max-width: 8px) {
        div.tmenucenter {
            max-width: 28px;
            /* size of viewport */
            text-overflow: clip;
        }

        .mainmenuaspan {
            font-size: 10px;
            padding-left: 0;
            padding-right: 0;
        }

        .topmenuimage {
            background-size: 20px auto;
            margin-top: 2px;
        }

        #tmenu_tooltipinvert .sec-nav__item .icon {
            display: none;
        }
    }

    /* rule to reduce top menu - 3rd reduction */
    @media only screen and (max-width: 570px) {
        #id-right {
            padding-left: unset;
        }

        /* Reduce login top right info */
        .usertext.atoplogin {
            display: none;
        }

        div#tmenu_tooltip,
        #tmenu_tooltipinvert {
            padding-right: 92px;
                    }

        div.login_block {
            max-width: 120px;
            padding-right: 3px;
        }

        /* div.login_block_other {
        display: block;
        width: auto;
        min-width: 40px; aqui modifique
    } */
        div.login_block_other {
            display: contents;
            width: auto;
            min-width: 40px;
        }

        div.login_block_other .inline-block {
            display: inline-block;
            width: auto;
        }

        li.tmenu,
        li.tmenusel {
            min-width: 30px;
        }

        div.tmenucenter {
            text-overflow: clip;
        }

        .topmenuimage {
            background-size: 20px auto;
            margin-top: 2px !important;
        }

        div.mainmenu {
            min-width: 20px;
        }

        #tooltip {
            position: absolute;
            width: 300px;
        }

        select {
            width: 98%;
            min-width: 0 !important;
        }

        div.divphotoref {
            padding-right: 5px;
        }

        img.photoref,
        div.photoref {
            border: none;
            -webkit-box-shadow: none;
            box-shadow: none;
            padding: 4px;
            height: 20px;
            width: 20px;
            object-fit: contain;
        }

        .titlefield {
            width: auto !important;
            /* We want to ignore the 30%, try to use more if you can */
        }

        .tableforfield>tr>td:first-child {
            max-width: 100px;
            /* but no more than 100px */
        }

        #tmenu_tooltipinvert .sec-nav__item {
            max-width: 50px;
        }

        #tmenu_tooltipinvert .sec-nav__item .icon {
            display: none;
        }

        .sec-nav.is-inverted {
            margin-left: 1px;
                    }

        #tmenu_tooltipinvert div.menu_contenu {
            display: none;
        }

        div.fiche {
            margin: 0 3px 0 3px;
        }

        table.table-fiche-title .col-title div.titre {
            line-height: unset;
        }

        input#addedfile {
            width: 95%;
        }
    }

    
/* <style type="text/css" > dont remove this line it's an ide hack */
/*
 * Dropdown
 */

.open>.dropdown-menu, .dropdown dd ul.open {
    display: block;
}

.dropdown-menu {
    border-color: #eee;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

.dropdown-toggle{
    text-decoration: none !important;
}
.dropdown-toggle::after {
    /* font part */
    font-family: "Font Awesome 5 Free";
    font-size: 0.7em;
    font-weight: 900;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    text-align:center;
    text-decoration:none;
    margin:  auto 3px;
    display: inline-block;
    /*content: "\f078";*/
    -webkit-transition: -webkit-transform .2s ease-in-out;
    -ms-transition: -ms-transform .2s ease-in-out;
     transition: transform .2s ease-in-out;
}

.open>.dropdown-toggle::after {
    transform: rotate(180deg);
}


/*
* MENU Dropdown
*/
.login_block.usedropdown .logout-btn{
    display: none;
}

.tmenu .open.dropdown, .login_block .open.dropdown, .tmenu .open.dropdown, .login_block .dropdown:hover{
    background: rgba(z, 0, 0, 0.1);
}
.tmenu .dropdown-menu, .login_block .dropdown-menu {
    position: absolute;
    right: 0;
    left: auto;
    line-height:1.3em;
}
.tmenu .dropdown-menu, .login_block  .dropdown-menu .user-body {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}
.user-body {
    color: #333;
}
.side-nav-vert .user-menu .dropdown-menu {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    padding: 1px 0 0 0;
    border-top-width: 0;
    width: 300px;
}
.side-nav-vert .user-menu .dropdown-menu {
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.side-nav-vert .user-menu .dropdown-menu > .user-header {
    min-height: 175px;
    padding: 10px;
    text-align: center;
    white-space: normal;
}

#topmenu-global-search-dropdown .dropdown-menu{
    width: 300px;
    max-width: 100%;
}

.dropdown-user-image {
    border-radius: 50%;
    vertical-align: middle;
    z-index: 5;
    height: 90px;
    width: 90px;
    border: 3px solid;
    border-color: transparent;
    border-color: rgba(255, 255, 255, 0.2);
    max-width: 100%;
    max-height :100%;
}

.dropdown-menu > .user-header{
    background: rgb(0,127,255);
}

.dropdown-menu .dropdown-header{
    padding: 5px 10px 10px 10px;
}

.dropdown-menu > .user-footer {
    background-color: #f9f9f9;
    padding: 10px;
}

.user-footer:after {
    clear: both;
}

.dropdown-menu > .bookmark-footer{
    padding: 10px;
}

.dropdown-menu > .user-body, .dropdown-body{
    padding: 15px;
    border-bottom: 1px solid #f4f4f4;
    border-top: 1px solid #dddddd;
    white-space: normal;
}

.dropdown-menu > .bookmark-body, .dropdown-body{
    padding: 10px 0;
    overflow-y: auto;
    max-height: 60vh ; /* fallback for browsers without support for calc() */
    max-height: calc(90vh - 110px) ;
    white-space: normal;
}
#topmenu-bookmark-dropdown .dropdown-menu > .bookmark-body, #topmenu-bookmark-dropdown .dropdown-body{
    max-height: 60vh ; /* fallback for browsers without support for calc() */
    max-height: calc(90vh - 200px) ;
}

.dropdown-body::-webkit-scrollbar {
    width: 8px;
}
.dropdown-body::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0;
    border-radius: 0;
    background: rgb(0,127,255);
}
.dropdown-body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    -webkit-border-radius: 0;
    border-radius: 0;
    background: #aaa;
}

#topmenu-login-dropdown, #topmenu-bookmark-dropdown, #topmenu-quickadd-dropdown, #topmenu-global-search-dropdown, #topmenu-tool-dropdown {
    padding: 0 5px 0 5px;
}
#topmenu-login-dropdown a:hover{
    text-decoration: none;
}

#topmenuloginmoreinfo-btn, #topmenulogincompanyinfo-btn {
    display: block;
    text-aling: right;
    color:#666;
    cursor: pointer;
}

#topmenuloginmoreinfo, #topmenulogincompanyinfo {
    display: none;
    clear: both;
    font-size: 0.95em;
}

.button-top-menu-dropdown {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

.user-footer .button-top-menu-dropdown {
    color: #666666;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-width: 1px;
    background-color: #f4f4f4;
    border-color: #ddd;
}

    .dropdown-menu a.top-menu-dropdown-link {
        color: rgb(40,40,40) !important;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        display: block;
        margin: 5px 0px;
    }
    .dropdown-item {
        display: block !important;
        box-sizing: border-box;
        width: 100%;
        padding: .25rem 1.5rem .25rem 1rem;
        clear: both;
        font-weight: 400;
        color: #212529  !important;
        text-align: inherit;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }
    .dropdown-item::before {
        /* font part */
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        text-align:center;
        text-decoration:none;
        margin-right: 5px;
        display: inline-block;
        content: "\f0da";
        color: rgba(0,0,0,0.3);
    }
    .dropdown-item.active, .dropdown-item:hover, .dropdown-item:focus  {
        color: #000000 !important;
        text-decoration: none;
        background: rgb(0,127,255);
    }
    /*
     * SEARCH
     */
    .dropdown-search-input {
        width: 100%;
        padding: 10px 35px 10px 20px;
        background-color: transparent;
        font-size: 14px;
        line-height: 16px;
        box-sizing: border-box;
        color: #575756;
        background-color: transparent;
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-size: 16px 16px;
        background-position: 95% center;
        border-radius: 50px;
        border: 1px solid #c4c4c2 !important;
        transition: all 250ms ease-in-out;
        backface-visibility: hidden;
        transform-style: preserve-3d;
    }
    .dropdown-search-input::placeholder {
        color: color(#575756 a(0.8));
        letter-spacing: 1.5px;
    }
    .hidden-search-result{
        display: none !important;
    }

    /*
     * QUICK ADD
     */
    #topmenu-quickadd-dropdown .dropdown-menu {
        width: 300px !important;
        color: #444;
    }

    .quickadd-header {
        color: #444 !important;
    }

    div.quickadd {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    div.quickadd a {
        color: #444;
    }

    div.quickadd a:hover, div.quickadd a:active {
        color: #000000;
    }

    div.quickaddblock {
        width: 80px;
        display: block ruby;
    }

    div.quickaddblock:hover,
    div.quickaddblock:active,
    div.quickaddblock:focus {
        background: #0072CE;
    }

    /*
     * Responsive
     */
    @media only screen and (max-width: 570px) {
        #topmenu-login-dropdown, #topmenu-bookmark-dropdown, #topmenu-quickadd-dropdown, #topmenu-global-search-dropdown, #topmenu-tool-dropdown {
            padding: 0 2px 0 2px;
        }
    }
/* <style type="text/css" > */

/*
 * Component: Info Box
 * -------------------
 */
.info-box {
	display: block;
    position: relative;
	min-height: 90px;
	background: #fff;
	width: 100%;
	box-shadow: 0 0 1px rgba(0,0,0,.125),0 1px 3px rgba(0,0,0,.2);
    border-top-right-radius: 0.25em;
    border-top-left-radius: 0.50em;
    border-bottom-left-radius: 0.50em;
    border-bottom-right-radius: 0.25em;
    margin-bottom: 15px;
}
.info-box.info-box-sm{
    min-height: 80px;
    margin-bottom: 10px;
}

.info-box small {
	font-size: 14px;
}
.info-box .progress {
	background: rgba(0, 0, 0, 0.2);
	margin: 5px -10px 5px -10px;
	height: 2px;
}
.info-box .progress,
.info-box .progress .progress-bar {
	border-radius: 0;
}

.info-box .progress .progress-bar {
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}
.info-box-icon {
	border-top-left-radius: 0.25em;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0.25em;
	display: block;
    overflow: hidden;
	float: left;
	height: 90px;
	width: 90px;
	text-align: center;
	font-size: 45px;
	line-height: 90px;
	background: rgba(0, 0, 0, 0.2);
}
.info-box-sm .info-box-icon{
    height: 80px;
    width: 80px;
    font-size: 25px;
    line-height: 80px;
}
.info-box-icon > img {
	max-width: 100%;
}
.info-box-module .info-box-icon > img {
    max-width: 50%;
}

.info-box-icon-text{
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 90px;
    bottom: 0px;
    color: #ffffff;
    background-color: rgba(0,0,0,0.1);
    cursor: default;

    font-size: 10px;
    line-height: 15px;
    padding: 0px 3px;
    text-align: center;
    opacity: 0;
    -webkit-transition: opacity 0.5s, visibility 0s 0.5s;
    transition: opacity 0.5s, visibility 0s 0.5s;
}

.info-box-icon-version {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 80px;
    top: 58px;
    color: #ffffff;
    background-color: rgba(0,0,0,0.1);
    cursor: default;

    font-size: 10px;
    line-height: 22px;
    padding: 0px 3px;
    text-align: center;
    opacity: 1;
    -webkit-transition: opacity 0.5s, visibility 0s 0.5s;
    transition: opacity 0.5s, visibility 0s 0.5s;
}
.box-flex-item.info-box-module.info-box-module-disabled {
    opacity: 0.6;
}

.info-box-actions {
    position: absolute;
    right: 0;
    bottom: 0;
}


.info-box-sm .info-box-icon-text{
    overflow: hidden;
    width: 80px;
}
.info-box:hover .info-box-icon-text{
    opacity: 1;
}

.info-box-content {
	padding: 5px 10px;
	margin-left: 90px;
}

.info-box-sm .info-box-content{
    margin-left: 80px;
}
.info-box-sm .info-box-module-enabled {
	background: linear-gradient(0.35turn, #fff, #fff, #f6faf8, #e4efe8);
}
.info-box-content-warning span.font-status4 {
	color: #bc9526 !important;
}

.info-box-number {
	display: block;
	font-weight: bold;
	font-size: 18px;
}
.progress-description,
.info-box-text,
.info-box-title{
	display: block;
	font-size: 12px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.info-box-title{
	text-transform: uppercase;
	font-weight: bold;
}
.info-box-text{
	font-size: 0.92em;
}
.info-box-text:first-letter{text-transform: uppercase}
a.info-box-text{ text-decoration: none;}


.info-box-more {
	display: block;
}
.progress-description {
	margin: 0;
}



/* ICONS INFO BOX */
.info-box-icon {
		color: #fff !important;
	    opacity: 0.95;
}

.customer-back {
	background-color: #55955d !important;
	color: #FFF !important;
	padding: 2px;
	margin: 2px;
	border-radius: 3px;
}
.vendor-back {
	background-color: #599caf !important;
	color: #FFF !important;
	padding: 2px;
	margin: 2px;
	border-radius: 3px;
}
.user-back {
	background-color: #79633f !important;
	color: #FFF !important;
	padding: 2px;
	margin: 2px;
	border-radius: 3px;
}

.bg-infobox-project{
	background-color: #808080 !important;
}
.bg-infobox-propal,
.bg-infobox-facture,
.bg-infobox-commande{
	background-color: #808080  !important;
}
.bg-infobox-supplier_proposal,
.bg-infobox-invoice_supplier,
.bg-infobox-order_supplier{
	background-color: #808080  !important;
}
.bg-infobox-contrat{
	background-color: #808080  !important;
}
.bg-infobox-bank_account{
	background-color: #808080  !important;
}
.bg-infobox-adherent{
	background-color: #808080  !important;
}
.bg-infobox-expensereport{
	background-color: #808080  !important;
}
.bg-infobox-holiday{
	background-color: #808080  !important;
}


.fa-dol-action:before {
	content: "\f073";
}
.fa-dol-propal:before,
.fa-dol-supplier_proposal:before {
	content: "\f2b5";
}
.fa-dol-facture:before,
.fa-dol-invoice_supplier:before {
	content: "\f571";
}
.fa-dol-project:before {
	content: "\f0e8";
}
.fa-dol-commande:before,
.fa-dol-order_supplier:before {
	content: "\f570";
}
.fa-dol-contrat:before {
	content: "\f1e6";
}
.fa-dol-bank_account:before {
	content: "\f19c";
}
.fa-dol-member:before {
	content: "\f0c0";
}
.fa-dol-expensereport:before {
	content: "\f555";
}
.fa-dol-holiday:before {
	content: "\f5ca";
}
.fa-dol-ticket:before {
    content: "\f3ff";
}


/* USING FONTAWESOME FOR WEATHER */
.info-box-weather .info-box-icon{
	background: #7DFFAD !important;
}
.fa-weather-level0:before{
	content: "\f185";
}
.fa-weather-level1:before{
	content: "\f6c4";
}
.fa-weather-level2:before{
	content: "\f0c2";
}
.fa-weather-level3:before{
	content: "\f740";
}
.fa-weather-level4:before{
	content: "\f0e7";
}




.box-flex-container{
	display: flex; /* or inline-flex */
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	margin: 0 0 0 -15px;
	/*justify-content: space-between;*/
}
.box-flex-item{
	flex-grow : 1;
	flex-shrink: 1;
	flex-basis: auto;

	width: 280px;
	margin: 5px 0px 0px 15px;
}
.box-flex-item.filler{
	margin: 0px 0px 0px 15px !important;
	height: 0;
}

/* Disabled. This break the responsive on smartphone
.box{
	overflow: visible;
}
*/
/* <style type="text/css" > */
/*
 progress style is based on boostrap and admin lte framework
 */


/*
 * Component: Progress Bar
 * -----------------------
 */

.progress * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.progress {
    height: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    background-color: rgba(128, 128, 128, 0.1);
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

.progress.spaced{
    margin-bottom: 20px;
}

.progress-bar {
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}



.progress-group > .progress{
    clear: both;
}

.progress,
.progress > .progress-bar {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.progress,
.progress > .progress-bar,
.progress .progress-bar,
.progress > .progress-bar .progress-bar {
    border-radius: 1px;
}
/* size variation */
.progress.sm,
.progress-sm {
    height: 10px;
}
.progress.sm,
.progress-sm,
.progress.sm .progress-bar,
.progress-sm .progress-bar {
    border-radius: 1px;
}
.progress.xs,
.progress-xs {
    height: 7px;
}
.progress.xs,
.progress-xs,
.progress.xs .progress-bar,
.progress-xs .progress-bar {
    border-radius: 1px;
}
.progress.xxs,
.progress-xxs {
    height: 3px;
}
.progress.xxs,
.progress-xxs,
.progress.xxs .progress-bar,
.progress-xxs .progress-bar {
    border-radius: 1px;
}


/* Vertical bars */
.progress.vertical {
    position: relative;
    width: 30px;
    height: 200px;
    display: inline-block;
    margin-right: 10px;
}
.progress.vertical > .progress-bar {
    width: 100%;
    position: absolute;
    bottom: 0;
}
.progress.vertical.sm,
.progress.vertical.progress-sm {
    width: 20px;
}
.progress.vertical.xs,
.progress.vertical.progress-xs {
    width: 10px;
}
.progress.vertical.xxs,
.progress.vertical.progress-xxs {
    width: 3px;
}
.progress-group .progress-text {
    font-weight: 600;
}
.progress-group .progress-number {
    float: right;
}



/* Remove margins from progress bars when put in a table */
.table tr > td .progress {
    margin: 0;
}
.progress-bar-light-blue,
.progress-bar-primary {
    background-color: #3c8dbc;
}
.progress-striped .progress-bar-light-blue,
.progress-striped .progress-bar-primary {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-green,
.progress-bar-success {
    background-color: #00a65a;
}
.progress-striped .progress-bar-green,
.progress-striped .progress-bar-success {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-aqua,
.progress-bar-info {
    background-color: #00c0ef;
}
.progress-striped .progress-bar-aqua,
.progress-striped .progress-bar-info {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-yellow,
.progress-bar-warning {
    background-color: #f39c12;
}
.progress-striped .progress-bar-yellow,
.progress-striped .progress-bar-warning {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-red,
.progress-bar-danger {
    background-color: #dd4b39;
}
.progress-striped .progress-bar-red,
.progress-striped .progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-consumed {
    background-color: rgb(0, 0, 0, 0.15);
}
/* <style type="text/css" > */


/*
* Component: Timeline
* -------------------
*/
.timeline {
    position: relative;
    margin: 0 0 30px 0;
    padding: 0;
    list-style: none;
}
.timeline:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 4px;
    background: #ddd;
    left: 31px;
    margin: 0;
    border-radius: 2px;
}
.timeline > li {
    position: relative;
    margin-right: 0;
    margin-bottom: 15px;
}
.timeline > li:before,
.timeline > li:after {
    content: " ";
    display: table;
}
.timeline > li:after {
    clear: both;
}
.timeline > li > .timeline-item {
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    box-shadow:  0 1px 3px rgba(0, 0, 0, 0.1);
    border:1px solid #d2d2d2;
    border-radius: 3px;
    margin-top: 0;
    background: #fff;
    color: #444;
    margin-left: 60px;
    margin-right: 0px;
    padding: 0;
    position: relative;
}

.timeline > li.timeline-code-ticket_msg_private  > .timeline-item {
		background: #fffbe5;
        border-color: #d0cfc0;
}


.timeline > li > .timeline-item > .time{
    color: #6f6f6f;
    float: right;
    padding: 10px;
    font-size: 12px;
}


.timeline > li > .timeline-item > .timeline-header-action{
    color: #6f6f6f;
    float: right;
    padding: 7px;
    font-size: 12px;
}


a.timeline-btn:link,
a.timeline-btn:visited,
a.timeline-btn:hover,
a.timeline-btn:active
{
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    border-radius: 0;
    box-shadow: none;
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    user-select: none;
    background-image: none;
    text-decoration: none;
    background-color: #f4f4f4;
    color: #444;
    border: 1px solid #ddd;
}

a.timeline-btn:hover
{
    background-color: #e7e7e7;
    color: #333;
    border-color: #adadad;;
}


.timeline > li > .timeline-item > .timeline-header {
    margin: 0;
    color: #333;
    border-bottom: 1px solid #f4f4f4;
    padding: 10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.1;
}
.timeline > li.timeline-code-ticket_msg_private  > .timeline-item > .timeline-header {
    border-color: #ecebda;
}

.timeline > li > .timeline-item > .timeline-header > a {
    font-weight: 600;
}
.timeline > li > .timeline-item > .timeline-body,
.timeline > li > .timeline-item > .timeline-footer {
    padding: 10px;
}
.timeline > li > .fa,
.timeline > li > .glyphicon,
.timeline > li > .ion {
    width: 30px;
    height: 30px;
    font-size: 15px;
    line-height: 30px;
    position: absolute;
    color: #666;
    background: #d2d6de;
    border-radius: 50%;
    text-align: center;
    left: 18px;
    top: 0;
}
.timeline > .time-label > span {
    font-weight: 600;
    padding: 5px;
    display: inline-block;
    background-color: #fff;
    border-radius: 4px;
}
.timeline-inverse > li > .timeline-item {
    background: #f0f0f0;
    border: 1px solid #ddd;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.timeline-inverse > li > .timeline-item > .timeline-header {
    border-bottom-color: #ddd;
}

.timeline-icon-todo,
.timeline-icon-in-progress,
.timeline-icon-done{
    color: #fff !important;
}

.timeline-icon-not-applicble{
    color: #000;
    background-color: #f7f7f7;
}

.timeline-icon-todo{
    background-color: #dd4b39 !important;
}

.timeline-icon-in-progress{
    background-color: #00c0ef !important;
}
.timeline-icon-done{
    background-color: #00a65a !important;
}


.timeline-badge-date{
    background-color: #0073b7 !important;
    color: #fff !important;
}