/* ------------------------------ Frame general ------------------------------ */

*:focus 
{
    outline: none;
}

body
{
  background-image: url(../images/background.png);
  background-repeat:repeat;
  color:#222222;
}

.topBar 
{
    padding-left:15px;
    padding-right:15px;
    background-color: #D9F0FF;
    background-image: linear-gradient(#D9F0FF,#D6E9F7,#B8DBEE);
    height:45px;
}

.containerPersistant  { background-color: white; }

.ContextMenu
{
    background-color:white;
    border: 1px solid gray;
    overflow: hidden;
}

select:disabled,
optgroup:disabled,
option:disabled,
select[disabled] > option 
{
    color: lightgray;
}

/* ------------------------------ Tablette ------------------------------ */

.userProfile
{
    background-image:linear-gradient(#ffffff, #ffffff 60%, #f5f5f5);    
    border: 1px solid #a7a7a7;    
    height: 50px; 
    border-radius: 4px;
    cursor:pointer;  
}

.userProfileSelected
{
    background-image: linear-gradient(#0084dc, #0084dc 60%, #072e57);
    color:white;
    border: 1px solid #0a2a51;
}

.userProfile > .userProfilePhotoContainer 
{
   border-right:1px solid #a7a7a7; 
}

.userProfile > .userProfilePhotoContainer > .userProfilePhoto
{
   border-top-left-radius:4px;
   border-bottom-left-radius:4px;
}


.userProfile > .userProfileTextContainer 
{
   text-shadow:0 1px 0 rgba(0, 0, 0, 0.1);
}

.userProfile > .userProfileTextContainer > .userProfileText
{
   font-weight: bold; 
}

.userProfile > .userProfileTextContainer > .userProfileTitle
{
   font-style: italic;
   font-size: 8pt; 
}

.TabletteHeader
{
   background-color: #F2F2F2;
   color: white;
   border-bottom: 1px solid #BBBBBB;
   font-weight: bold;
   font-size: 12pt; 
   background-image: linear-gradient(to bottom,#FFFFFF,#ECECEC);
}

.TabletteHeader > .TabletteHeaderButton
{
   border-radius: 10px;
   border: 1px solid #555555;
   color: #222222;
   background-color:white;
   font-size: 28pt; 
}

.TabletteHeader > .TabletteHeaderButtonSelected
{

}

.TabletteMenuButton:hover
{
    box-shadow:inset 0px 0px 0px 1px #178ad0;
}

.TabletteMenuButton
{
    height: 69px; 
    border: 1px solid #bfbfbf; 
    border-radius: 4px; 
    padding: 12px 5px 5px 5px; 
    text-align: center; 
    margin-bottom:5px; 
    cursor:pointer; 
    background-color:white;
    position:relative;
}

.TabletteMenuButtonDisabled
{
    opacity:0.5;
}

.TabletteMenuButtonSelected
{
    border: 1px solid #005688;
    background-image: linear-gradient(white,#b9dbff);
}

.TabletteMenuButtonDisabled > .TabletteMenuButtonIcon
{
    color:gray;
    cursor:not-allowed;
}

.TabletteMenuButton > .TabletteMenuButtonIcon
{
    font-size:28pt; 
    display:block;
}

.TabletteMenuButton > .TabletteMenuButtonMicroIcon
{
    font-size: 14pt;
    position: absolute; 
    right: 3px; 
    top: 31px; 
    outline: none;
}
 
.TabletteMenuButton > .TabletteMenuButtonText
{
    margin-top:6px;
    font-size:8pt;
}


/* ------------------------------ Menu Principal ------------------------------ */

.navbar 
{
    /*background-image: linear-gradient(to bottom, #d1e8f9,#ffffff,#cee6f7); */
    background-image:linear-gradient(white,#DFDFDF);
    border: none;
    border-radius: 0px;      
    border-bottom: 1px solid #a2a2a2;
    box-shadow: none;
    margin-bottom: 0px;   
}

.navbar-header
{
    /*width: 30px;*/
    overflow: hidden;
    margin-right: 5px;    
}

.nav > li > a 
{
    padding-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
}

.navbar-default .navbar-text { color:#1995DC; }

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { background-color: transparent; color:black; }
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {  background-color: transparent; color:black; }   

/* Écran standard */
@media (min-width: 768px)
{
    
    #menuUser
    {
        box-shadow: 0px 2px 5px white;
        border: 1px solid #00A0E0;
        background-color: white;
    }
        
    .MenuItem:hover, .MenuItem.Hover
    {
        background-color: #ffffff82;
        border-bottom: 1px solid #e7e7e7;
    }
    
    .MenuItem.open
    {
        color: black;
        background-color: #ffffff82;
    }

}

/* ------------------------------ ONGLETS DÉTAIL ------------------------------ */

/* SideMenu */

.ListMenu
{
    width: 150px;
    border-right: 1px solid #8D8D8D;
    background-color: #EEEEEE;
    box-shadow: 3px 0px 3px rgba(0,0,0,0.1);
}
.ListMenuOption:hover
{
    background-color: #EAEAEA;
    color: black;
}

.ListMenuOption.ActiveMenu,
.ListMenuFonction.ActiveMenu 
{ 
    color: white;
    background-image: linear-gradient(90deg,#2A74A5,#5FA7D7); 
}

.ListMenuOption, .ListMenuFonction
{
    height: 50px;
    font-weight: bold;
    border-bottom: 1px solid #D8D8D8;
    border-top: 1px solid #D8D8D8;
    cursor: pointer;
    padding: 3px;
    overflow:hidden;
    white-space:nowrap;
}

.ListMenuFonction
{
    background-color: #0199D7;
    margin-bottom: 10px;
    margin-top: 10px;
    color: white;
}

.ListMenuOption
{
    background-color: #FFFFFF;
    margin-top: -1px;
    color: #444444;
}

.ListMenuFonction p { display:inline-block; }



.ListMenuFonction span
{
    float: right;
    height: 44px;
    line-height: 44px;
    padding-right: 5px;
    font-size: 17pt;  
}

.ListMenuOption span
{
    float: left;
    height: 44px;
    line-height: 44px;
    padding-left: 2px;   
    
}

/* Barres de boutons */

.ButtonBar > .TabControl
{
    white-space:initial;
    vertical-align:bottom;
    padding: 1px 5px;
}

.ButtonBar
{
    background-image: linear-gradient(#FFFFFF,#ECECEC);
    border: 1px solid #8D8D8D;
    margin-bottom: 10px;
    vertical-align: top;
    box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
    border-radius: 6px;
}

.ButtonBarLabel
{
    display: inline-block;
    line-height: 30px;
    vertical-align: top;
    font-weight: bold;
    font-size: 12pt;
    padding-right: 15px;
    padding-left: 15px;    
}

/* TabControl: Mode Icon */

.TabControl.nav-pills > li > a
{
    /*width: 31px;*/
    overflow: hidden;
    border-radius: 0px;
    border-bottom: 3px solid #00A0E0;
    color: #444444;
    height: 29px;
    font-size: 10pt;
    padding-top: 5px;
}

.TabControl.nav-pills > li.active > a,
.TabControl.nav-pills > li.active > a:hover,
.TabControl.nav-pills > li.active > a:focus 
{
    color: #231F20;
    background-color: #EAEAEA;
    border-bottom: 3px solid #FF8418;
    width: auto;
}

.TabControl.Agenda.nav-pills > li > a
{
    width: auto;
    font-weight:bold;
}

.TabControl.Agenda.nav-pills > li > a > span.badge
{
    color:white;
    vertical-align:initial;
}

.badgeImportant
{
    background-color: #D70606 !important;
    color: #FFFFFF !important;
    background-image: radial-gradient(#F80101,#831313);
    box-shadow: 0 0 3px 1px white;
}

/* TabControl: Mode Onglet */

.TabControl.nav-tabs > li.active > a, 
.TabControl.nav-tabs > li.active > a:hover,
.TabControl.nav-tabs > li.active > a:focus 
{
    border-color: #FF8418;
    border-bottom: 1px solid white;
    color: black;
    border-top: 3px solid #FF8418;
    z-index: 1;
}
.TabControl.nav-tabs.bigger > li.active > a, 
.TabControl.nav-tabs.bigger > li.active > a:hover,
.TabControl.nav-tabs.bigger > li.active > a:focus 
{
    border-top: 3px solid #FF8418;
    border-left: 1px solid #f98319;
    border-right: 1px solid #f98319;
    border-bottom: 0px;    
    background-image: linear-gradient(#ffffff, #ffffff 20%, #ff84185c);
}

.TabControl.nav-tabs 
{ 
    border-bottom: 1px solid #FF8418;
    padding-left: 10px; 
}
.TabControl.nav-tabs.bigger 
{ 
    font-size: 14px;
    border-bottom: 1px solid #FF8418;
}

.TabControl.nav-tabs > li > a:hover 
{   
    color: black;
    border-color: #0386BB;
    background-color: #F9F9F9;
    border-bottom: 1px solid #FF8418;    
}

.TabControl.nav-tabs > li > a 
{
    color: #444444;
    background-color: white;
    border: 1px solid #1995DC;
    border-bottom: 1px solid #FF8418;
    height: 25px;
    border-top-left-radius: 15px;
    border-top: 3px solid #37B3E4;
    margin-left: -5px;    
}

.TabControl.nav-tabs.bigger > li > a 
{
    color: #444444;
    background-color: white;
    border: 1px solid #1995DC;
    border-bottom: 1px solid #FF8418;
    height: 32px;
    line-height: 29px;
    border-top-left-radius: 15px;
    border-top: 3px solid #37B3E4;
    margin-left: -7px;
    padding: 0px 20px;
    background-image: linear-gradient(#ffffff, #ffffff 20%, #37b3e42b);
}

.TabCompteur
{
    display: inline-block;
    padding: 0px 4px 0px 4px;
    margin-right: 6px;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    background-color: #444444;
    color: #FFFFFF;
    text-align: center;
}

.bigger > li > a .TabCompteur
{
    padding: 0px 8px 0px 8px !important;
    margin-right: 10px !important;
    min-width: 32px !important;
    height: 32px !important;
    border-radius: 16px !important;
}

/* ------------------------------ Footer ------------------------------ */

.navbarFooterText 
{
    color: #157ab5;
    border: 1px solid #1995dc;
    margin-right: 0px;
    padding-left: 8px;
    padding-right: 8px;
    line-height: 24px;
    background-color: #ececec;
    border-radius: 3px;
    margin-top: 2px;
    margin-bottom: 2px;    
    
    /*
    color: rgb(25, 149, 220);
    padding-left: 15px;
    padding-right: 15px;
    background-color: #DDDDDD;
    border-radius: 6px;
    */
}


/* ------------------------------ Composants ------------------------------ */

.Ligne { border-top-color: #C6DFEF; margin: 10px 0px 10px 0px; }

.GroupBox
{
    border-radius:4px; 
    border: 1px solid #2A74A5; 
    margin:10px 5px 5px 5px;     
}

.GroupBoxTitre 
{
    background-color:#2A74A5; 
    color:white; 
    font-size:10pt; 
    height:20px; 
    padding-left:10px; 
    font-weight:bold;    
}

.GroupBoxContent
{
    padding:10px;
}

.well 
{    
    background-color: #FAFDFF;    
    border: 1px solid #8ECCE6;
}

.Banderolle
{
    font-size: 10pt;
    font-weight: bold;
    border-bottom: 1px solid #8D8D8D;
    border-left: 1px solid #8D8D8D;
    border-right: 1px solid #8D8D8D;
    background-image: linear-gradient(white,#DFDFDF);    
    box-shadow:0px 3px 3px rgba(0,0,0,0.1);    
}

.input-group-addon
{
    background-color:#F4F4F4;    
}

.componentLabel
{   
    font-weight: bold;
    color: #555555;
    border: 1px solid #cccccc;
    border-radius: 3px;
    background-color: #F4F4F4;   
}

.slider-track { border:1px solid #CCCCCC; }
.slider-tick { border:1px solid #CCCCCC; box-shadow:none; opacity: initial; }
.slider-selection { box-shadow:none; }
.slider-tick.in-selection { border: none; }

.btn-default:active, .btn-default.active, .btn-default.disabled.active, .open > .dropdown-toggle.btn-default 
{
    color: white;
    background-color: #0f92d4;
}

.btn-default:active:hover, .btn-default.active:hover, .open > .dropdown-toggle.btn-default:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .dropdown-toggle.btn-default:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .dropdown-toggle.btn-default.focus
{
    color: white;
    background-color: #0f92d4;
}

/* --------------------------- ScrollSpy SideBar --------------------------- */

.GroupSideBarNav 
{
    /*width: 110px; DÉSACTIVÉ A LA DEMANDE DE CE (MODE COMPACT)*/
    min-width:100px;
    max-width:400px;
    border-right: 1px solid #CCCCCC;
    margin-right: 10px;
    padding-right: 5px;
}

.GroupSideBarNav .nav>li>a 
{
    color: #444444;
    border-right: 5px solid transparent;
    padding: 4px 10px;
    font-size: 14px;
    font-weight: bold;
}

.GroupSideBarNav .nav .nav>li>a 
{
    padding-left: 10px;
    font-size: 12px;
    font-weight: normal;
    height:28px;
}

.GroupSideBarNav .nav>.active>a, 
.GroupSideBarNav .nav>li>a:focus 
{
    text-decoration: none;
    border-right-color: #FFA218;
}

.GroupSideBarNav .nav>li>a:hover { background-color: #EAEAEA; }

/* --------------------------- ScrollSpy SideBar Documentation --------------------------- */

.DocumentationBarNav
{
    width: 240px;
    min-width:240px;
    max-width:400px;
    margin-right: 10px;
    padding-right: 5px;
}

.DocumentationBarNav .nav>li>a
{
    color: #000000;
    list-style-type: none;
    padding: 4px 0px 4px 10px;
    height:28px;
    font-size: 14px;
    border-left: 2px solid transparent;
}

.DocumentationBarNav .nav .nav>li>a
{
    color: #000000;
    list-style-type: none;
    padding: 4px 0px 4px 25px;
    height:28px;
    font-size: 12px;
    border-left: 2px solid transparent;
}

.DocumentationBarNav .nav>.active>a,
.DocumentationBarNav .nav>li>a:focus
{
    font-weight: bold;
    border-left: 2px solid #FFCC00;
}

.DocumentationBarNav .nav .nav>.active>a,
.DocumentationBarNav .nav .nav>li>a:focus
{
    font-weight: normal;
    border-left: 2px solid #FFCC00;
}

.DocumentationBarNav .nav>li>a:hover { border-left: 2px solid #0088BB; background-color: transparent; }

.DocumentationSectionTitle
{
    color: #000000;
    font-size: 20px;
    font-weight: bold;
    border-bottom: 2px solid #000000;
    margin: 30px 0px;
}

.DocumentationSubSectionTitle
{
    color: #000000;
    font-size: 18px;
    font-weight: bold;
    border-bottom: 1px solid #CCCCCC;
    margin: 30px 0px;
}

/* --------------------------- ScrollSpy SideBar AideEnLigne --------------------------- */

.AideEnLigneNav
{
    width: 300px;
    min-width:300px;
    max-width:400px;
    padding-left: 0px;
    background-color:#f4f4f4;
    box-shadow:0px 0px 5px black;
    border-right:1px solid #00334c;
    margin-right:20px;
}

.AideEnLigneNav .nav-stacked > li + li
{
    margin-top:0px;
}

.AideEnLigneNav .nav>li>a
{
    color: white;
    list-style-type: none;
    padding: 4px 10px 4px 5px;
    height:28px;
    font-size: 14px;
    font-weight:bold;
    border-right: 0px;
    background-color: #0f92d4;
    background-image:linear-gradient(to right,#0f92d4,#a6e1ff);
    margin-top: 1px;
    border-top:1px solid #00334c;
    border-bottom:1px solid #00334c;
}

.AideEnLigneNav .nav .nav>li>a
{
    color: #222222;
    list-style-type: none;
    padding: 1px 25px 1px 10px;
    height:19px;
    font-size: 12px;
    background-color: white;
    background-image:none;
    border-top:none;
    border-bottom: 1px solid #bfcddb;
}

.AideEnLigneNav .nav>.active>a:before,
.AideEnLigneNav .nav>li>a:focus:before
{
    content: '\f111';
    font-family: FontAwesome;
    position: absolute;
    color:black;
    font-size: 10px;
    line-height: 1px;
    right: 6px;
    top: 13px;
    text-align:right    
}

.AideEnLigneNav .nav .nav>.active>a:before,
.AideEnLigneNav .nav .nav>li>a:focus:before
{
    content: '\f112';
    font-family: FontAwesome;
    position: absolute;
    font-size: 14px;
    line-height: 1px;
    left: 1px;
    top: 13px;
    text-align:right
}

.AideEnLigneNav .nav>li>a:hover 
{ 
    background-image: none;
}

.AideEnLigneNav .nav .nav>li>a:hover 
{
    background-color: #e4e4e4;
}

.AideEnLigneNav .nav>li>a:hover:after
{
    content: "";
    bottom: -11px;
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #033a54 transparent transparent transparent;
    z-index: -1;
    right: 0;
    border-width: .5em .5em 0 0;
}

.AideEnLigneSectionTitle
{
    color: white;
    font-size: 24px;
    font-weight: bold;
    padding-left: 5px;
    padding: 5px 10px;
    text-shadow: 0px 0px 5px black;
    border: 1px solid #101010;
    border-radius: 5px;
    background-image: linear-gradient(to right,#0f92d4,#a6e1ff);
}

.AideEnLigneSubSectionTitle
{
    color: #000000;
    font-size: 18px;
    font-weight: bold;
    border-bottom: 1px solid #000000;
    padding: 20px 5px 0px 0px;
    margin-left: 20px;
}

.AideEnLigneTitle
{
    padding: 10px;
    position: relative;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    letter-spacing: 0.05em;
    text-shadow: 0px 0px 1px rgb(0, 0, 0);
    background: linear-gradient(#1092d4, #0b91d6 90%, #0d72a4);
    background-color: #1093d4;
    border-bottom: 1px solid black;
    border-top: 1px solid black;
    border-right: 1px solid black;
    color: white;
    width: 311px;
    margin-bottom: 10px; 
    cursor:default;
    margin-top:10px;
}

.AideEnLigneTitle:after 
{
    content: "";
    bottom: -11px;
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #033a54 transparent transparent transparent;
    z-index: -1;
    right: 0;
    border-width: .5em .5em 0 0;
}


/* ------------------------------ Gestion des nouvelles listes Standard ------------------------------ */

.tableRowRed.i-table-grid-row:hover
{
    background-color: #CD5C5C;
    color: white;
}

.tableRowRed.i-table-grid-row-even {
    background-color: #ff6666;
}

.tableRowRed.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: #990000;
}

.tableRowRed.i-table-grid-row-odd {
    background-color: #ff8080;
}

.tableRowRed.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: #990000;
}

.tableRowBlue.i-table-grid-row:hover
{
    background-color:#00A0E0;  
    color: white;
    cursor: pointer;
}

.tableRowBlue.i-table-grid-row-even {
    background-color: #B0E0FF;
}

.tableRowBlue.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: #04519b;
}

.tableRowBlue.i-table-grid-row-odd {
    background-color: #A0D0FF;
}

.tableRowBlue.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: #04519b;
}

.tableRowRedPale.i-table-grid-row:hover
{
    background-color: rgba(255, 0, 0, 0.6);
    color: white;
}

.tableRowRedPale.i-table-grid-row-even {
    background-color: rgba(255, 0, 0, 0.2);
}

.tableRowRedPale.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: rgba(255, 0, 0, 0.7);
}

.tableRowRedPale.i-table-grid-row-odd {
    background-color: rgba(255, 0, 0, 0.4);
}

.tableRowRedPale.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: rgba(255, 0, 0, 0.7);
}

.tableRowOrange.i-table-grid-row:hover
{
    background-color: #f08200;
    color: white;
}

.tableRowOrange.i-table-grid-row-even {
    background-color: #F0BB00;
}

.tableRowOrange.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: #f05a00;
}

.tableRowOrange.i-table-grid-row-odd {
    background-color: #F0AA00;
}

.tableRowOrange.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: #f05a00;
}

.tableRowOrangePale.i-table-grid-row:hover
{
    background-color: rgba(255, 165, 0, 0.6);
    color: white;
}

.tableRowOrangePale.i-table-grid-row-even {
    background-color: rgba(255, 165, 0, 0.2);
}

.tableRowOrangePale.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: rgba(255, 165, 0, 0.7);
}

.tableRowOrangePale.i-table-grid-row-odd {
    background-color: rgba(255, 165, 0, 0.4);
}

.tableRowOrangePale.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: rgba(255, 165, 0, 0.7);
}

.tableRowYellow.i-table-grid-row-even {
    background-color: #FFFF00;
}

.tableRowYellow.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: #F0E000;
}

.tableRowYellow.i-table-grid-row-odd {
    background-color: #FFFF33;
}

.tableRowYellow.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: #F0E000;
}

.tableRowPurple.i-table-grid-row:hover
{
    background-color: #9191EA;
    color: white;
}

.tableRowPurple.i-table-grid-row-even {
    background-color: #BCBCF2;
}

.tableRowPurple.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: #7C7CE6;
}

.tableRowPurple.i-table-grid-row-odd {
   background-color: #A7A7EE;
}

.tableRowPurple.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: #7C7CE6;
}

.tableRowGreen.i-table-grid-row:hover
{
    background-color: #008200;
    color: white;
}

.tableRowGreen.i-table-grid-row-even {
    background-color: #00BB00;
}

.tableRowGreen.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: #005a00;
}

.tableRowGreen.i-table-grid-row-odd {
    background-color: #00AA00;
}

.tableRowGreen.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: #005a00;
}

.tableRowGreenPale.i-table-grid-row:hover
{
    background-color: rgba(0, 128, 0, 0.6);
    color: white;
}

.tableRowGreenPale.i-table-grid-row-even {
    background-color: rgba(0, 128, 0, 0.2);
;
}

.tableRowGreenPale.i-table-grid-row-even.i-table-grid-row-focus {
    background-color: rgba(0, 128, 0, 0.7);
}

.tableRowGreenPale.i-table-grid-row-odd {
    background-color: rgba(0, 128, 0, 0.4);
}

.tableRowGreenPale.i-table-grid-row-odd.i-table-grid-row-focus {
    background-color: rgba(0, 128, 0, 0.7);
}

/* ------------------------------ Gestion des listes Standard ------------------------------ */

table.dataTable tr.even.disabledRow { color: lightgray; }
table.dataTable tr.odd.disabledRow { color: lightgray; }
table.dataTable tr.even.inactiveRow { background-color: #ffe7b5; }
table.dataTable tr.odd.inactiveRow { background-color: #ffd890; }

table.dataTable tr.even.totalRow { background-color:#FDD180; font-weight:bold; }
table.dataTable tr.odd.totalRow { background-color:#FDD180; font-weight:bold; }

.ListeOnglets
{
    padding-top: 10px;
    padding-left:10px;
    padding-right:10px;
    height:42px;
    border-bottom: 1px solid #00A0E0;
    background-color: #BBDCEF;
    /*
       Plus pale: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAFUlEQVQImWNggIIb7/7+x8FgYGAAANs2C0dh5j0HAAAAAElFTkSuQmCC
       3x3 at http://www.patternify.com/
    */
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAFUlEQVQImWNggILdd97/x8FgYGAAAMy9CpAYIUVgAAAAAElFTkSuQmCC) repeat;    
}

table.dataTable { background-color: #fff; }

.dataTables_scrollHead
{
    color:black;
    font-weight: bold;  
}

table.dataTable tr.odd { background-color:#ECECEC; }
table.dataTable tr.even, table.dataTable tr.odd { color:#222222; }

table.dataTable tr.odd.tableRowOrange { background-color:#F0AA00; }
table.dataTable tr.even.tableRowOrange { background-color:#F0BB00; }
table.dataTable tr.odd.tableRowGreen { background-color:#C6E0B4; }
table.dataTable tr.even.tableRowGreen { background-color:#E2EFDA; }
table.dataTable tr.odd.tableRowBlue { background-color:#A0D0FF; }
table.dataTable tr.even.tableRowBlue { background-color:#B0E0FF; }
table.dataTable tr.odd.tableRowRed { background-color:#FF6B6B; }
table.dataTable tr.even.tableRowRed { background-color:#FF7A7A; }

table.dataTable tr.odd:hover, table.dataTable tr.even:hover
{
    background-color:#00A0E0;  
    color: white;
    cursor: pointer;
}


.CustomDataTable.Even { background-color:#FFFFFF; }
.CustomDataTable.Odd { background-color:#ECECEC; }
.CustomDataTable { color:#222222; }

.CustomDataTable.Odd:hover, .CustomDataTable.Even:hover
{
    background-color:#00A0E0;  
    color: white !important;
    cursor: pointer;
}

.dataTables_scrollBody
{    
   border-top: 1px solid black;
   border-bottom: 1px solid black;
}


/* ------------------------------ Liste spécialisées ------------------------------ */
.CustomTable { font-size:9pt; line-height: 1.42857143; }
.CustomTable > tr:nth-child(odd) { background-color:#ECECEC; }
.CustomTable > tr:nth-child(even) { background-color:white; }

.CustomTable > tbody > tr:nth-child(odd) { background-color:#ECECEC; }
.CustomTable > tbody > tr:nth-child(even) { background-color:white; }

.CustomTable tr.trBlue:nth-child(odd) { background-color:#E0EEFF; }
.CustomTable tr.trBlue:nth-child(even) { background-color:#CCDDFF; }
.CustomTable tr.trOrange:nth-child(odd) { background-color:#FFEE00; }
.CustomTable tr.trOrange:nth-child(even) { background-color:#FFDD00; }
.CustomTable tr.trRed:nth-child(odd) { background-color:#FFEEEE; }
.CustomTable tr.trRed:nth-child(even) { background-color:#FFDDDD; }
.CustomTable > tr:hover { background-color:#00A0E0; cursor:default; }

.CustomTable > tbody > tr > td { padding:3px; }
.CustomTable > tbody > tr:hover { background-color:#00A0E0; cursor:default; color:white; }

.CustomTable > thead > tr > th { cursor:pointer; user-select: none }
.CustomTable > thead > tr { border-bottom: 1px solid black; background-color:white; }
.CustomTable tr.ImportantHover:hover td { background-color:yellow !important; color:#222222 !important; }

.CustomSort {}
.CustomSortUp { text-decoration:underline; }
.CustomSortDown { text-decoration:underline; }

/*.CustomSortUp::after   { padding-left:3px; font:normal normal normal 14px/1 FontAwesome; text-decoration:none; content: "";}*/
/*.CustomSortDown::after { padding-left:3px; font:normal normal normal 14px/1 FontAwesome; text-decoration:none; content: "";}*/


.CustomRow { background-color:#FFFFFF; }
.CustomRowOdd { background-color:#F0FFF0; }
.CustomRowOrange { background-color:#FFEE00; }
.CustomRowOrangeOdd { background-color:#FFDD00; }
.CustomRowRed { background-color:#FFEEEE; }
.CustomRowRedOdd { background-color:#FFDDDD; }

.CustomRow:hover,
.CustomRowOdd:hover,
.CustomRowOrange:hover,
.CustomRowOrangeOdd:hover,
.CustomRowRed:hover,
.CustomRowRedOdd:hover
{
    background-color:yellow;
}

.RowRedText { color:red !important; }
.RowBlueText { color:blue !important; }
.RowGreenText { color:green !important; }
.RowHighlight { text-decoration:underline; }
.RowGrayText { color:#999999 !important; }
.RowTotalText { font-weight:bold; }
.RowDetailDisabled { cursor:default !important; }
.RowTDPaddingTop5px td { padding-top:5px; }
.RowImportant { background-color:#FFCC00 !important; }
.RowLargeText { font-size: 10pt; font-weight: bold; } 

/* ------------------------------ Agenda ------------------------------ */

.AgendaContextMenuHeader 
{
    border-bottom: 1px solid #8d8d8d;
    background-image: linear-gradient(#FFFFFF,#ECECEC);
    font-weight: bold;
    overflow: hidden;
    font-size: 10pt;
    display:flex;
    white-space:nowrap;
}

.AgendaContextMenuContent 
{
    padding: 5px;
    position: absolute;
    overflow-x:hidden;
    overflow-y:auto;
    width: 100%;
    bottom: 0px;
    top: 20px;
    background-color:white;
}

.AgendaContextMenuSectionInfoTitle
{
    color: #000000;
    font-size: 14px;
    font-weight: bold;
    border-bottom: 1px solid #CCCCCC;
    margin: 5px 0px 5px 0px;
    overflow-x: hidden;
    min-width: 250px;
}

.AgendaContextMenuButtonAction
{
    margin:2px; 
    width: 35px; 
    height: 35px; 
    font-size: 16pt; 
    border: 1px solid #CCCCCC; 
    background-image: linear-gradient(#fefefe,#eaeaea);
    outline:none;
}

.AgendaContextMenuButtonAction:hover
{
    border: 1px solid #019CDB; 
    z-index:10;
}

.AgendaContextMenuButtonAction:focus { outline: none; }

.AgendaContextMenuActionTitle
{
    font-weight: bold;
    text-align: center;
    background-image: linear-gradient(#FFFFFF,#ECECEC);
    padding: 0px 5px 0px 5px;
    overflow-x: hidden;
    border-bottom: 1px solid #cccccc;
    margin-bottom: 5px;
}

.AgendaDashboard
{
    border: 1px solid #8d8d8d;
    border-radius: 5px;
    /*background-image: linear-gradient(white 90%,#c1c1c1);*/
    background-color:#fefefe;
}

.AgendaDashboardHeader
{
    border-bottom: 1px solid #8d8d8d;
    background-image: linear-gradient(#FFFFFF,#ECECEC);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;    
    height:31px;
    text-align:center;
    font-weight:bold;
    font-size:12pt;     
    padding:4px;
    overflow:hidden;
    white-space:nowrap;
}

.AgendaDashboardHeaderTitle
{
    display: inline-block;
    position: absolute;
    left: 35px;
    right: 35px;
    z-index: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.AgendaDashboardButtonLeftContainer
{
    display: inline-block;
    position: absolute;
    left: 0;
    z-index: 2;
    padding-left: 5px;
}

.AgendaDashboardButtonRightContainer
{
    display: inline-block;
    position: absolute;
    right: 0;
    z-index: 3;
    padding-right: 5px;
}

.AgendaDashboardContent
{
    padding:5px;
}

.AgendaDashboardSectionTitle
{
    flex-grow:0;
    flex-shrink:0;
    color: #000000;
    font-size: 14px;
    font-weight: bold;
    border-bottom: 1px solid #CCCCCC;
    margin: 5px 0px 5px 0px;
    overflow-x: hidden;
    min-width: 250px;
}

.AgendaDashboardAction
{
    margin:2px; 
    width: 35px; 
    height: 35px; 
    font-size: 16pt; 
    border: 1px solid #CCCCCC; 
    background-image: linear-gradient(#fefefe,#eaeaea);
    outline:none;
}

.AgendaDashboardAction:hover
{
    border: 1px solid #019CDB; 
}

.AgendaDashboardAction:focus { outline: none; }

.AgendaDashboardShow
{
    background-color:#ececec;
    border: 1px solid #8d8d8d;
    border-radius: 5px;     
}    

.AgendaDashboardShow:hover { border: 1px solid #555555; }

.CustomSelectBoxContainer
{
    margin:5px 0px 20px 0px;
    border-width: 1px;
    border-style: solid;
    border-color: #CCCCCC;
    border-radius: 3px;
    background-color: #FFFFFF;
    max-height: 180px;
    overflow-y: auto;
}
.CustomSelectBox
{
    height: 18px;
    position: relative;
}
.CustomSelectBoxAjout
{
    cursor: pointer;
}
.CustomSelectBoxAjout:hover
{
    background-color: #FFFF00;
    color: #222222;
}
.CustomSelectBoxActive
{
    background-color: #00A0E0 !important;
    color: #F7F7F7 !important;
}
.CustomSelectBoxCode
{
    height: 17x;
    padding-top: 1px;
    display: inline-block;
    position: absolute;
    left: 0px;
    width: 25px;
    text-align: center;
    font-size: 8pt;
}
.CustomSelectBoxDescription
{
    height: 17px;
    top: 1px;
    display: inline-block;
    position: absolute;
    left: 25px;
    right: 0px;
    padding: 0px 3px;
    border-left: 1px solid #DDDDDD;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.CustomSelectBoxX
{
    height: 18px;
    padding-top: 2px;
    display: inline-block;
    position: absolute;
    right: 0px;
    width: 25px;
    text-align: center;
    font-size: 8pt;
    cursor: pointer;
    font-weight: bold;
    color: #FF0000;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}
.CustomSelectBoxX:hover
{
    background-color: #FF0000;
    color: #FFFFFF;
}

.AgendaDashboardAjoutRVButton
{
    position: absolute;
    right: 0px;
    top: 0px;
    cursor: pointer;
    border: 1px solid #CCCCCC;
    border-radius: 3px;
    padding: 2px 6px;
    background-color: #eeeeee;
}
.AgendaDashboardAjoutRVButton:hover
{
    background-color: #F5F5F5;
}

.AgendaHeaderButtonRight, .AgendaHeaderButtonLeft
{
    padding: 0px 5px 0px 5px; 
    height: 24px; 
    font-size: 10pt; 
    padding-top: 0px;
    color: black; 
    font-weight: normal;   
    line-height:0px;
}

.AgendaHeaderContent
{
   border: 1px solid #8d8d8d; 
   height:30px; 
   font-weight:bold; 
   text-align:center; 
   color:#333333; 
   font-size:13pt; 
   padding-top:2px; 
   border-radius:5px; 
   background-image: linear-gradient(#FFFFFF,#ECECEC);
   position:relative;
}

.AgendaBorder
{
    border: 1px solid #8d8d8d;
    border-radius: 5px;
    padding: 5px; 
}

.AgendaBox
{
    border: 1px solid #8d8d8d;
    border-radius: 5px;
    float:left;
    background-color:white;
}

.AgendaBoxTitle
{
    border-bottom: 1px solid #8d8d8d;
    background-image: linear-gradient(#f4f4f4,#cccccc);
    padding-left: 5px;
    font-weight: bold;
    font-size: 10pt;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    color:#515357;
}

.AgendaBoxContent
{
    margin: 5px;
    max-height:500px;
    overflow-y:auto;
    overflow-x:hidden;
    padding-left:1px;
}

.frameAgenda
{
   border:1px solid #8d8d8d; border-radius:5px;
}

.frameAgendaHeader
{
   border-bottom: 1px solid #8d8d8d;
   background-image: linear-gradient(#FFFFFF,#ECECEC);
   border-top-left-radius:5px;
   border-top-right-radius:5px;
}

.frameAgendaHeaderTime
{
   border-right: 1px solid #8d8d8d;
}

.frameAgendaHeaderColumn
{
   border-right:1px solid #8d8d8d; 
}
/*
.frameAgendaHeaderColumn.active::after
{
    float:right;
    font: normal normal normal 14px/1 FontAwesome;
    content: "\2a";   
}
*/
.frameAgendaHeaderColumn.active
{
    background-image:none !important; 
}

.frameAgendaContent { flex-direction:row; }

.frameAgendaContentTime 
{
   margin-bottom:2px;
   border-top-left-radius:5px; 
   border-bottom-left-radius:5px;
}

.frameAgendaContentBody
{
   border-bottom-right-radius:5px;
   margin-right:2px;
   margin-bottom:2px; 
   background-color:#EAEAEA;
}

.agendaRowHeader
{
   padding-left:2px;
   border-right:1px solid #8d8d8d;
   background-color:#e9f4fb;
   border-bottom: 1px dashed #CECECE;
}

.agendaRowHeader.section
{
   border-bottom: 1px solid #CECECE;
}

.agendaRowHeader.active
{
   background-color:#94d5ff;
}


.agendaRowColumn.section
{
   border-bottom: 1px solid #CECECE;
}

.agendaRowHeader.selectedPrev, .agendaRowColumn.selectedPrev
{
   border-bottom: 1px dotted black;
}

.agendaRowHeader.selected, .agendaRowColumn.selected
{
   border-bottom: 1px dotted black;
   background-image: linear-gradient(rgba(128, 128, 128, 0),rgba(128, 128, 128, 0.3));
}

.agendaRowColumn
{
   background-color: #EAEAEA;
   border-right:1px solid #8d8d8d; 
   border-bottom: 1px dashed #CECECE;
   cursor:pointer;
}

.agendaHeaderRowColumn 
{
   background-color: #FCFCFC;
   color: black;
   text-align: center;
   border-right:1px solid #8d8d8d; 
   border-bottom: 2px solid #000;
   font-weight: bold;
}

.agendaRowHeaderLabel
{
   background-color: #FCFCFC;
   border-bottom: 2px solid #000;
   border-right: 1px solid #000;
   font-weight: bold;
}
 
.agendaRDVPresence
{
    color: #222222;
    border: 1px solid black;
    display: inline-block;
    margin: 1px 2px 0px 0px;
    margin-left: 2px;
    width: 15px;
    height: 15px;
    line-height: 15px;
    background-color: white;
    text-align: center;
    vertical-align: top;
    border-radius: 3px;
}

.agendaRDV
{
    color: #222222;
    display:inline-block; 
    vertical-align:top;
    font-size:12px;
}

/* Styles pour l'affichage des dispo, TA et rendez-vous de l'agenda. L'ordre est important. */

.agendaBackgroudEventDispo
{
    background-image: none;
    background-position: initial;
    background-repeat: initial;          
    background-color: white;
    color:gray;
    font-size:9px;        
}

.agendaBackgroudEventDisabled 
{
    background-color: #BFBFBF;
    /*background-image: repeating-linear-gradient(45deg, transparent, transparent 2px, rgba(255, 255, 255, 0.5) 2px, rgba(255, 255, 255, 0.5) 4px);  */
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSc0JyBoZWlnaHQ9JzgnIHZpZXdCb3g9JzAgMCA1IDEwJz4KCTxyZWN0IHdpZHRoPScxMTAlJyB4PSctNSUnIHk9Jy01JScgaGVpZ2h0PScxMTAlJyBmaWxsPScjZmZmJy8+Cgk8bGluZSB4MT0nLTInIHkxPScxJyB4Mj0nNycgeTI9JzEwJyBzdHJva2U9JyNCRkJGQkYnIHN0cm9rZS13aWR0aD0nMycvPgoJPGxpbmUgeDE9Jy0yJyB5MT0nNicgeDI9JzcnIHkyPScxNScgc3Ryb2tlPScjQkZCRkJGJyBzdHJva2Utd2lkdGg9JzMnLz4KCTxsaW5lIHgxPSctMicgeTE9Jy00JyB4Mj0nNycgeTI9JzUnIHN0cm9rZT0nI0JGQkZCRicgc3Ryb2tlLXdpZHRoPSczJy8+Cjwvc3ZnPg==);
    /* background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSc1JyBoZWlnaHQ9JzEwJyB2aWV3Qm94PScwIDAgNSAxMCc+Cgk8cmVjdCB3aWR0aD0nMTEwJScgeD0nLTUlJyB5PSctNSUnIGhlaWdodD0nMTEwJScgZmlsbD0nI2ZmZicvPgoJPGxpbmUgeDE9Jy0yJyB5MT0nMScgeDI9JzcnIHkyPScxMCcgc3Ryb2tlPScjQkZCRkJGJyBzdHJva2Utd2lkdGg9JzMnLz4KCTxsaW5lIHgxPSctMicgeTE9JzYnIHgyPSc3JyB5Mj0nMTUnIHN0cm9rZT0nI0JGQkZCRicgc3Ryb2tlLXdpZHRoPSczJy8+Cgk8bGluZSB4MT0nLTInIHkxPSctNCcgeDI9JzcnIHkyPSc1JyBzdHJva2U9JyNCRkJGQkYnIHN0cm9rZS13aWR0aD0nMycvPgo8L3N2Zz4=);*/
    background-position: initial;
    background-repeat: initial;   
    color:gray;
    font-size:9px;
}

.agendaBackgroudEventReservation
{
    background-color: #e6ffff;
    background-image: none;   
    background-position: initial;
    background-repeat: initial;     
    color: #222222;
    font-size:11px;        
}

.agendaBackgroudEventConge
{
    background-color: #ffdbb6;
    background-image: none;   
    background-position: initial;
    background-repeat: initial;     
    color: #222222;
    font-size:11px;        
}

.ui-effects-transfer { border: 1px dotted black; background-color:#FBFBFB; opacity:1; z-index:9999; }

/* ------------------------------ Message ------------------------------ */

.MessageBase
{
    font-size: 8pt;
    font-weight:bold;
    border-style: solid;
    border-width: 1px;
    border-radius: 5px;
    padding: 3px 5px;
    margin-bottom: 5px;
}

/* ------------------------------ Dossiers médicaux ------------------------------ */

.DossiersMedicauxListElement
{
    padding: 5px;
    background-image: linear-gradient(white,#e1e1e1);
    border-bottom:1px solid #2a74a5;
    cursor: pointer;
}

.DossiersMedicauxListElement:hover
{
    background-image:linear-gradient(#ffffff,#ffe4af);
}

.DossiersMedicauxListElementChosen
{
    background-image: linear-gradient(#2a74a5,#5095c3 20%,#2a74a5) !important;
    color:white;
}

.DossiersMedicauxListElementExtra
{
    padding: 5px;
    background-image: linear-gradient(#f0f0f0,#d9d9d9);
    border-bottom:1px solid #2a74a5;
}

/* ------------------------------ Temps autres ------------------------------ */

.TempsAutresRowToday
{
    background-color:#FFFF00 !important;
}
.TempsAutresRowToday:hover
{
    background-color:#00A0E0 !important;
}

.TempsAutresRowDeleted
{
    color:#FF0000 !important;
}
.TempsAutresRowDeleted:hover
{
    color:#FFFFFF !important;
}

/* ------------------------------ Client finance ------------------------------ */

.ClientFinanceRow
{
    background-color:#FFFFFF !important;
}
.ClientFinanceRow:hover
{
    background-color:#00A0E0 !important;
}

.ClientFinanceRowAchat
{
    background-color:#EEFFEE !important;
}
.ClientFinanceRowAchat:hover
{
    background-color:#00A0E0 !important;
}

.ClientFinanceRowFinance
{
    background-color:#DDEEFF !important;
}
.ClientFinanceRowFinance:hover
{
    background-color:#00A0E0 !important;
}

.ClientFinanceRowDeleted
{
    color:#FF0000 !important;
}
.ClientFinanceRowDeleted:hover
{
    /* color:#FFFFFF !important; */
}

/* ------------------------------ Vertical tabs ------------------------------ */

.vTabContainer
{
    border: 1px solid #8D8D8D;
    border-radius: 6px;
}

.vTabMenu
{
    background-color: #FAFAFA;
    border-right: 1px solid #8D8D8D;
    overflow-y:auto;
    background-image:linear-gradient(white,#e6e4e4);
}

.vTabTab
{
    background-color: #CEE0FA;
    border-right: 7px solid #37B3E4;
    padding: 8px;
    cursor: pointer;
    background-image:linear-gradient(white,#ddddde);
    border-bottom:1px solid #8d8d8d;
}
.vTabTab:hover
{
    background-color: #D8EAFF;
    background-image: linear-gradient(#fefefe,#b2d8ec);
}
.vTabTab.active
{
    background-color: #FFFFFF !important;
    border-right-color: #FF8418 !important;
    font-weight:bold;
}

.vTabTab:before
{
    content:'•';
    margin-right:5px;
}

.vTabTabLine
{
    background-color: #DDDDDD;
    height:5px;
    border-bottom:1px solid #8d8d8d;
}

.vTabContent
{
    min-width:100px;
    padding:2px;
}

/* ------------------------------ Calendrier de présences CNESST ------------------------------ */

.CalendrierTableCNESST tr:nth-child(odd) { background-color:#FFFFFF; }
.CalendrierTableCNESST tr:nth-child(even) { background-color:#F9F9F9; }

/* ------------------------------ Personnalisations ------------------------------ */
.FilterBoxDiv
{
    border: 1px solid #8d8d8d;
    padding: 5px 5px 0px 5px;
    background-color: #f6f6f6;
    background-image: linear-gradient(#fefefe,#ececec);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;    
}    

.ListBoxDiv
{
    border-left: 1px solid #8d8d8d;
    border-right: 1px solid #8d8d8d;    
}

.ListBoxDivFooter
{
    border-left: 1px solid #8d8d8d;
    border-right: 1px solid #8d8d8d;        
    border-bottom: 1px solid #8d8d8d;   
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;   
}

.FooterBoxDiv
{
    border: 1px solid #8d8d8d;
    padding: 5px 5px 0px 5px;
    background-color: #ececec;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}    

.GraphHBar1 { background-image: linear-gradient(#033c73,#0b77e0 80%,#033c73); background-color:blue; }
.GraphHBar2 { background-image: linear-gradient(orange, yellow 80%, orange); background-color:orange; }
.GraphHBar3 { background-image: linear-gradient(#468847,#73a839 80%,#468847); background-color:green; }
.GraphHBar1:hover, .GraphHBar2:hover, .GraphHBar3:hover
{
    box-shadow:inset 0 0 10px 1px rgba(0, 0, 0, 0.5);
}

.dropdown-menu > li > a { /*padding: 3px 40px 3px 20px;*/ }


/* Journal de connexion des membres */

.AccesLigneJournal
{
    display:flex; 
    cursor:pointer; 
    background-image: linear-gradient(to bottom,#efefef 75%,#e0e0e0,#d4d1d1);
    border: 1px solid #b3b3b3;
    border-radius: 5px;
    margin-bottom: 5px;
}