/*
* Styles personnalisés
* Custom styles
*/

:root{
    --button-default-height: 40px;
    --button-default-width: 40px;
    --button-default-padding : 4px;
    --button-mini-height: 35px;
    --button-mini-width: 35px;
    --button-mini-padding-bottom: 50px;
    --shadow-button : 0px 2px 10px 0px rgba(143,137,143,1);
} 

/* Style formulaire connexion principal*/
.form-connect{
    padding: 2rem;
    background-color: #ededef;
    -moz-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -webkit-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -o-box-shadow: 2px 2px 20px 0px #9b9b9b;
    box-shadow: 2px 2px 20px 0px #9b9b9b;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#9b9b9b, Direction=134, Strength=20);    
}

/* lasquage champ de sécurité */
.Maya{
    display : none;
}

/*
* STYLES POUR BANDEAUX :
* MENU LIENS
* BANDEAU BOUTONS COMMANDES
*/
.navbar{
    padding-bottom: 0rem;
    height: 80px;
}

.navbar-expand-md{
    border-bottom: 3px solid #ffbd0f;

}

.navbar-expand-md .itemcenter{
    font-size: 1.2rem;    
    text-transform: uppercase;
    padding-top: 20px;
}

.navbar-expand-md .itemcenter a{
    padding-bottom: 6px!important;
    color: black;
    border-bottom: 6px solid #f8f9fa ;   
}

.navbar-expand-md .itemcenter a:hover{
    border-bottom: 6px solid #ffbd0f;    
}

.navbar-expand-md .CurrentPage a{
    border-bottom: 6px solid #ffbd0f;    
}

.navbar-expand-md .itemcenter .nav-link{
    padding-left: 1.2rem;
    padding-right: 1.2rem;
}

/* Logos user, help, close */
.LogoStream{
    height: 56px;
    width: 218px;
}

.Menuitemlogo{
    width: 155px;
}

.Menuitemlogo .nav-link{
    /*top: 70px;*/
    padding-left: 2px!important;
    padding-right: 2px!important;
}

.Menuitemlogo #LogoUser,
.Menuitemlogo a:hover #LogoUser,
.Menuitemlogo #LogoContact,
.Menuitemlogo #LogoContact:hover,
.Menuitemlogo #LogoHelp,
.Menuitemlogo a:hover #LogoHelp,
.Menuitemlogo #LogoClose,
.Menuitemlogo a:hover #LogoClose{
    height: var(--button-mini-height);
    width: var(--button-mini-width);            
}

.Menuitemlogo #LogoUser{
    background-image: url(../../images/user-off.svg);          
}

.Menuitemlogo a:hover #LogoUser{
    background-image: url(../../images/user-on.svg);    
}        
/* logo contact interne */
.Menuitemlogo #LogoContact{
    background-image: url(../../images/contact-off.svg);          
}

.Menuitemlogo #LogoContact:hover{
    background-image: url(../../images/contact-on.svg);    
} 

/* logo contact externe */
#LogoContactExt{
    display: block;
    height: 48px;
    width: 48px;    
    background-image: url(../../images/contact-on.svg);          
}

#LogoContactExt:hover{
    display: block;    
    height: 48px;
    width: 48px;     
    background-image: url(../../images/contact-off.svg);    
} 

.Menuitemlogo #LogoHelp{
    background-image: url(../../images/help-off.svg);   
}

.Menuitemlogo a:hover #LogoHelp{
    background-image: url(../../images/help-on.svg);    
}           

.Menuitemlogo #LogoClose{
    background-image: url(../../images/close-off.svg);     
}

.Menuitemlogo a:hover #LogoClose{
    background-image: url(../../images/close-on.svg);   
}   

/*
* Bandeau boutons de commandes
*/

/* sous bandeau mauve */
.bandeaucouleur{  
  height: 81px;
  background: linear-gradient(90deg, #2F7481 0%, #70A8B8 49.75%, #66A0AF 60.17%, #4B8A99 77.91%, #2F7481 92.92%);  
}

/* Texte dans bandeau */
.bandeauinterne{
    height: 81px;
    display: flex;
    flex-direction: row; 
    font-size: 1.1rem;
    font-style: italic;
    font-weight: bold;
    color: white;
}

/*
* Navigation pour menu manager
*/

/* sous bandeau mauve Manager*/
.bandeaucouleurmanager{  
  height: 31px;
  background: linear-gradient(90deg, #2F7481 0%, #70A8B8 49.75%, #66A0AF 60.17%, #4B8A99 77.91%, #2F7481 92.92%);  
}

/* Texte dans bendeau manager*/
.bandeauinternemanager{
    height: 31px;
    display: flex;
    flex-direction: row; 
    font-size: 1.1rem;
    font-style: italic;
    font-weight: bold;
    color: white;
}

#navbarmanager li.nav-item{
    padding-left: 1.4rem;
    padding-right: 1.4rem;
    font-size: 1.2rem;
}

/* hauteur onglets & tableau pour manager */
#jqxTabsData, 
#jqxTabsUsersRights{
    width: 95%!important;
}

#jqxTabsData .jqx-tabs-content{
    height: 100%;
}

.bandeauinterne > [class^="col-"],
.bandeauinterne > [class*=" col-"] {
  display: flex;
  align-items: center;
}        

#jqxTabsSettings{
    height: 100%!important;
}

/* Champ search*/
#SearchHome{
    border-radius: 1rem;
    height: 30px;
    background-color: #8bb6be;
    border: 1px solid #cecece;
}

/* Logos Unit Assign, Unit Follow-up*/
.bandeauinterne .TitleBandeau{
    padding-right: 0.2rem;
}

.bandeauinterne .col-md-3,
.bandeauinterne .col-md-2,
.bandeauinterne .col-md-1{
    padding-left: 10px;
    padding-right: 10px;
}

.bandeauinterne #LogoUnitAssignAdd,
.bandeauinterne a:hover #LogoUnitAssignAdd,
.bandeauinterne #LogoUnitAssignFilter,
.bandeauinterne a:hover #LogoUnitAssignFilter,
.bandeauinterne #LogoUnitFollowAdd,
.bandeauinterne a:hover #LogoUnitFollowAdd,
.bandeauinterne #LogoUnitFollowFilter,
.bandeauinterne a:hover #LogoUnitStatus,
.bandeauinterne #LogoUnitStatus,
.bandeauinterne a:hover #LogoLog,
.bandeauinterne #LogoLog,
.bandeauinterne #LogoRefresh,
.bandeauinterne a:hover #LogoRefresh,
.bandeauinterne #LogoExport,
.bandeauinterne a:hover #LogoExport, 
.bandeauinterne #LogoGrid,
.bandeauinterne a:hover #LogoGrid, 
.bandeauinterne #LogoGridSave,
.bandeauinterne a:hover #LogoGridSave,
.bandeauinterne #LogoGridDetails,
.bandeauinterne a:hover #LogoGridDetails{
    height: var(--button-default-height);
    width: var(--button-default-width);
    margin: var(--button-default-padding); 
    border: 1px solid #cecece;
    border-radius: 3px;
}

.bandeauinterne #LogoUnitAssignAdd{
    background-image: url(../../images/UnitassignAdd-off.svg);   
    height : 40px;
    width: 40px;
}
.bandeauinterne a:hover #LogoUnitAssignAdd{
    background-image: url(../../images/UnitassignAdd-on.svg);   
}          
.bandeauinterne #LogoUnitAssignFilter{
    background-image: url(../../images/UnitassignFilt-off.svg);   
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoUnitAssignFilter{
    background-image: url(../../images/UnitassignFilt-on.svg);   
}          
.bandeauinterne #LogoUnitFollowAdd{
    background-image: url(../../images/UnitfollowAdd-off.svg);  
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoUnitFollowAdd{
    background-image: url(../../images/UnitfollowAdd-on.svg);   
}            
.bandeauinterne #LogoUnitFollowFilter{
    background-image: url(../../images/UnitfollowFilt-off.svg); 
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoUnitFollowFilter{
    background-image: url(../../images/UnitfollowFilt-on.svg);   
}  
.bandeauinterne #LogoUnitStatus{
    background-image: url(../../images/status-off.svg);
    height : 40px;
    width: 40px;

}
.bandeauinterne a:hover #LogoUnitStatus{
    background-image: url(../../images/status-on.svg);   
}
.bandeauinterne #LogoLog{
    background-image: url(../../images/log-off.svg);  
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoLog{
    background-image: url(../../images/log-on.svg);   
}   
.bandeauinterne .BlockBtRefresh{
    margin-left: 16px;
}

.bandeauinterne #LogoRefresh{
    background-image: url(../../images/refresh0-off.svg);  
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoRefresh{
    background-image: url(../../images/refresh0-on.svg);   
}          
.bandeauinterne #LogoExport{
    background-image: url(../../images/Export-off.svg);   
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoExport{
    background-image: url(../../images/Export-on.svg); 
} 

.bandeauinterne #LogoGrid,
.bandeauinterne #LogoGridDetails{
    background-image: url(../../images/Grid-off.svg);   
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoGrid,
.bandeauinterne a:hover #LogoGridDetails{
    background-image: url(../../images/Grid-on.svg); 
}  

.bandeauinterne #LogoGridDetails,
.bandeauinterne a:hover #LogoGridDetails{
    margin-left: 20px;
    display: none;
}    

.bandeauinterne #LogoGridSave{
    background-image: url(../../images/Grid-save-off.svg);   
    height : 40px;
    width: 40px;    
}
.bandeauinterne a:hover #LogoGridSave{
    background-image: url(../../images/Grid-save-on.svg); 
} 

.bandeauinterne .TitleUnitDetail{
    font-size: 1.6rem;
}

/* Style pour bouton lors de la selection */
.LogoUnitSelectBorder{
    border: 2px solid #ffbd0f!important;
}

.BtFilterActive{
    border: 1px solid red!important;
}

/* Logos user, help, close */
.Menuitemlogo{
    /*background-image: url(../../images/logo-carestream-40.png);
    background-repeat: no-repeat;
    background-position: top; 
    min-height: 42px;*/
}

.Menuitemlogo .nav-link{
    margin-bottom: 40px;
    padding-left: 2px!important;
    padding-right: 2px!important;
}

.Menuitemlogo #LogoUser,
.Menuitemlogo a:hover #LogoUser,
.Menuitemlogo #LogoHelp,
.Menuitemlogo a:hover #LogoHelp,
.Menuitemlogo #LogoClose,
.Menuitemlogo a:hover #LogoClose{
    height: var(--button-mini-height);
    width: var(--button-mini-width);            
}

.Menuitemlogo #LogoUser{
    background-image: url(../../images/user-off.svg);          
}

.Menuitemlogo a:hover #LogoUser{
    background-image: url(../../images/user-on.svg);    
}        

.Menuitemlogo #LogoHelp{
    background-image: url(../../images/help-off.svg);   
}

.Menuitemlogo a:hover #LogoHelp{
    background-image: url(../../images/help-on.svg);    
}           

.Menuitemlogo #LogoClose{
    background-image: url(../../images/close-off.svg);     
}

.Menuitemlogo a:hover #LogoClose{
    background-image: url(../../images/close-on.svg);   
}   

/*
* Style datatables
*/
#ListUnit{
    border: 1px solid #cecece;
}

#ListUnit th{
    background-color: #cecece;
}

/* Fond pour ligne de tableau */
.zebra{
    background-color: #E4E4E4;
}

/*
* STYLES CARD
*/
.BlockDetailUnit, 
.BlockDetailAlert{
    width: 98%;
    margin-left: auto;
    margin-right: auto;
}
/* */
.BlockDetailUnit .col-4{
    padding-right: 5px;
    padding-left: 5px;
}



.detailunit .card,
.detailalert .card{
    font-size: 0.90rem;
    overflow: hidden;
    padding-bottom: 0.35rem;
    border: none;
    border-radius: .28571429rem;
    box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
    margin-top: 1.5rem;
    margin-right: 0.5rem;
    margin-bottom: 1.5rem;
    margin-left: 0.5rem;
    -moz-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -webkit-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -o-box-shadow: 2px 2px 20px 0px #9b9b9b;
    box-shadow: 2px 2px 20px 0px #9b9b9b;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#9b9b9b, Direction=134, Strength=20);     
}

.detailunit .TxtBold{
    font-weight: bolder;
}

/* Style Card manager */
.managercss .card {
    font-size: 1em;
    overflow: hidden;
    border: none!important;    
    border-radius: 0.5rem; 
    padding-bottom: 0.35rem;
    background:none!important;    
}

.managercss .card-header{
    padding-bottom: 0.35rem!important;
    padding-top: 0.35rem!important;
    background-color: #dcdcdc;
}

.managercss .card-body{

}

.card-block {
    font-size: 1em;
    position: relative;
    margin: 0;
    padding: 1em;
    border: none;
    border-top: 1px solid rgba(34, 36, 38, .1);
    box-shadow: none;
}

.card-img-top {
    display: block;
    width: 100%;
    height: auto;
}

.card-title {
    color : white;
    font-weight: 700;
    text-indent: 1rem;
    background: linear-gradient(90deg, #2F7481 0%, #70A8B8 49.75%, #66A0AF 60.17%, #4B8A99 77.91%, #2F7481 92.92%);  
    height: 2rem;
}

.card-text {
    clear: both;
    margin-top: .5em;
    color: rgba(0, 0, 0, .68);
}

.card-footer {
    font-size: 1em;
    position: static;
    top: 0;
    left: 0;
    max-width: 100%;
    padding: .75em 1em;
    color: rgba(0, 0, 0, .4);
    border-top: 1px solid rgba(0, 0, 0, .05) !important;
    background: #fff;
}

.tablealertdetails th{
    width: 190px;
}

/* div pour info du changement de status dans alertdetail*/
#MessageAlertStatus{
    margin-left: 25px;
    color:red;
    font-style: italic;
}

/* 
* STYLE TABLEAU JQXGRID
*/

/* Style lien dans cellule */
.JqxLinkCel{
    display: block;
    margin-top: 6px;
    padding-left: 0rem!important;
}


/* Couleur arrière plan */
.jqx-widget-content, 
.jqx-tabs{
    background-color: #f8f9fa!important;
}
#tabsJustified li{
   padding: 8px;
   border-left: 1px solid #cecece;
   border-right: 1px solid #cecece; 
   border-top: 1px solid #cecece;   
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;   
}

.nav-tabs { border-bottom: 2px solid #DDD; }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover { border-width: 0; }
.nav-tabs > li > a { border: none; color: #666; }
.nav-tabs > li.active > a, .nav-tabs > li > a:hover { border: none; color: #4285F4 !important; background: transparent; }
.tab-nav > li > a::after { background: #21527d none repeat scroll 0% 0%; color: #fff; }
.tab-pane { padding: 15px 0; }
.tab-content{padding:20px}

.icongreen{
    color: #31b131!important;
}
.iconred{
    color: red!important
}

/* Masquage champ filtrage dans Section manager */
#filter3JqxGridMonit,
#filter2JqxGridMonit,
.filtertext2JqxGridMonit
{
    display: none!important;
}

/* MANAGER : Masquage champ filtrage section manager pour champ standard (1 champ)*/
#filter2ListDealers,
.filtertext2ListDealers,
#filter3ListDealers,
#filter2ListUnits,
.filtertext2ListUnits,
#filter3ListUnits,
#filter2ListEndUsers,
.filtertext2ListEndUsers,
#filter3ListEndUsers,
#filter2ListServices,
.filtertext2ListServices,
#filter3ListServices,
#filter2ListChannels,
.filtertext2ListChannels,
#filter3ListChannels,
#filter2ListGroups,
.filtertext2ListGroups,
#filter3ListGroups,
#filter2ListUsers,
.filtertext2ListUsers,
#filter3ListUsers,
#filter2ListCountry,
.filtertext2ListCountry,
#filter3ListCountry
{
   display: none!important;
}

/* MANAGER :  ombre portée menu trie et filtres Manager Hauteur limitée*/
#gridmenuListDealers, 
#gridmenuListUnits,
#gridmenuListEndUsers, 
#gridmenuListServices,
#gridmenuListChannels, 
#gridmenuListGroups, 
#gridmenuListUsers,
#gridmenuListCountry
{
    max-height: 220px!important;
    -moz-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -webkit-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -o-box-shadow: 2px 2px 20px 0px #9b9b9b;
    box-shadow: 2px 2px 20px 0px #9b9b9b;        
}

/* MANAGER :  ombre portée pour filtres custom (date) Grande hauteur*/
#gridmenuListServices
{
    -moz-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -webkit-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -o-box-shadow: 2px 2px 20px 0px #9b9b9b;
    box-shadow: 2px 2px 20px 0px #9b9b9b;        
}

/* USERS : Style masquage filtres section utilisateurs */
#filter2ListDefAlerts, 
.filtertext2ListDefAlerts, 
#filter3ListDefAlerts{
   display: none!important;    
}

/* USERS :  Style ombre portée pour filtres section utilisateurs Hauteur limitée*/
#gridmenuJqxGridMonit, 
#gridmenuListDefAlerts{
    max-height: 220px!important;
    -moz-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -webkit-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -o-box-shadow: 2px 2px 20px 0px #9b9b9b;
    box-shadow: 2px 2px 20px 0px #9b9b9b;      
}
/* USERS :  ombre portée pour filtres custom section utilisateurs Grande hauteur*/
#gridmenuJqxGridAlerts, 
#gridmenuJqxGridErrors, 
#gridmenujqxgriderrors, 
#gridmenujqxgridacqui, 
#gridmenujqxgrid3drec, 
#gridmenujqxgridalerts, 
#gridmenujqxgridhistory, 
#gridmenujqxgridnotification{
    -moz-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -webkit-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -o-box-shadow: 2px 2px 20px 0px #9b9b9b;
    box-shadow: 2px 2px 20px 0px #9b9b9b;       
}

#JqListColumnsErrors .overlay{
    background: none!important;
}


/* USERS : border listbox */
.jqx-grid-column-header, 
.jqx-grid-pager,
.card-header{
    background: #D3D3D3
}

.JqxLink{
    padding-left:1.2rem;
    margin-top: 0.6rem;
    display: block;
}

/* Taille caractéres entétes colonnes */
.jqx-grid-column-header, .jqx-grid-columngroup-header{
    text-indent: 0.5rem;
    font-size: 1.1rem;    
}

/* Taille caractéres entêtes colonnes page détail */
.jqxTabsDetailsUnit > .jqx-grid-column-header{
    font-size: 0.8rem;      
}
/* couleur fond ligne séléctionnée */
#contenttablejqxgrid .jqx-fill-state-pressed{
    background-color: #B2DBE7!important;
    opacity: 0.8;
}

/* Couleur des status errors */

.ColorAlertStatusNew,
.ColorAlertStatusPending,
.ColorAlertStatusInprogress,
.ColorAlertStatusDone, 
.ColorAlertStatusNoaction,
.ColorAlertStatusnew,
.ColorAlertStatuspending,
.ColorAlertStatusinprogress,
.ColorAlertStatusdone, 
.ColorAlertStatusnoaction{
    margin-left: 15px; 
    display: block;
    text-transform: capitalize;
}
.ColorAlertStatusNew, 
.ColorAlertStatusnew{
    color: #0078FF;
}
.ColorAlertStatusPending, 
.ColorAlertStatuspending{
    color: #606060;
}
.ColorAlertStatusInprogress, 
.ColorAlertStatusinprogress{
    color: #FFBD0F;
}
.ColorAlertStatusDone, 
.ColorAlertStatusdone{
    color: #40C140;
}
.ColorAlertStatusNoaction{
    
}

/* jqxgrid import manager */
#contenttableListLogImport{
    min-height: 100% !important;
}

/* Visuel connectivity */
.connectivity{
    padding-top: 5px;
    display: block;
    width: 15px;
    margin: auto;
}

#iconscontainer{
    /*width: -40px!important;*/
}

/* Hauteur tableau du log des import */
#ListLogImport{
    height: 100%!important;
}


/*
* Fenêtres modal 
*/
.modal .btn-light:hover{
    background-color: #ffc853;
}

.modal-header, 
.modal-footer{
  background: #dcdcdc;
}

.modal-header .modal-title{
    color: #24737f;
}

/* Largeur modal export 2 colonnes */
@media (min-width: 576px){
    #ModalLog .modal-dialog{
        max-width: 850px;
        margin: 1.75rem auto;
    }
}
.modal-content #MsgExport{
    text-align: center;
    vertical-align: top;
    display: block;
    height: 120px;
}

.modal-content #loader, 
.modal-content #LoaderExport,
.modal-content #download, 
.modal-content #DownloadExport{
    display: none;
    position: absolute;
    left: 50%;
    top: 60%;
    transform: translate(-50%, -50%);    
}
.modal-content #DownloadExport{
    margin-top: 20px;
    width: 80%;
}


.modal-content #message, 
.modal-content #MessageExport{
    width: 90%;
    margin: auto;
}

#ModalLog .modal-body{
    min-height: 250px;
}

.body-export{
    min-height: 200px;
}

.modal-body .ListCatLog{
    border : 2px solid #8bb6be;
    border-radius: 6px;
    width: 90%;
    margin: auto;
}

.modal-body .ListCatLog .form-check{
    width: 90%;
    margin: auto;
    padding-bottom: 0.2rem;
    padding-top: 0.2rem;
    border-bottom: 1px solid #cecece;
}

.modal-body .ListCatLog .form-check-label{
    padding-left: 1rem;
}

.modal-body .selectfiles, 
.modal-body .selectdates{
    width: 90%;
    margin: auto;
    padding-bottom: 0.8rem;
    padding-top: 0.8rem;
    text-align: center;
}

.modal-body .selectdates{
    border-radius: 6px;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    background-color: #8bb6be;
    color: white;
}

.modal-body .selectradio{
    width: 90%;
    margin: auto;
    padding-bottom: 0.8rem;
    padding-top: 0.8rem;
}
.modal-body .selectradio{
    border-radius: 6px;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    background-color: #8bb6be;
    color: white;
}

.modal-body .selectradio .checkmark{
    background-color: white;
}

.modal-body .selectradio .form-check-label{
    margin-left: 30px;
    color: black;
}

#ModalUpdateIndex #LoaderExportIndex{
    height: 130px;
    margin: auto;
    al
}
/* Largeur Modal Assign */
#ModalAssign .modal-dialog,
#ModalStatus .modal-dialog{
    width: 650px!important;
    max-width: 650px!important;
}

/* Entête tableau assign */
#TableAssignUsers{
    margin-bottom: 0px;
  display:block;    
}

#TableAssignUsers td, 
#ListUnitsAssignPerUsers td{
    font-weight: bold;
    font-size: 0.8rem;
    font-style: italic;
}

#ListUnitsAssignPerUsers{
    margin-bottom: 0rem!important;
}

/*
* STYLE FORMULAIRES DEFINITION ALERTE
*/
#TabsDefAlert #criteria{
    min-height: 600px;
}


#BlockBtSequential{
    margin-top: 30px;
}
#BlockBtSequential .btn{
    margin-top: 10px;
    margin-left: 10px;
}    

#TxtHelpSequential .text-muted{
    margin-left: 70px;
}

#TxtHelpSequential .form-check{
    margin-left: 70px;
}

#BlocFrequencyNotification{
    border: 1px solid #cecece;
    padding: 10px;
}

#BlocFrequencyNotification .form-check{
    margin-left: 20px;
}
#BlocFrequencyNotification #BlockDays{
    margin-left: 16px;
}
.labelOnlineTop{
   padding-top: 0px; 
}


/* Bouton Switch checkbox */
.material-switch{
    margin-top: 10px;
}

.material-switch > input[type="checkbox"] {
    display: none;   
}

.material-switch > label {
    cursor: pointer;
    height: 0px;
    position: relative; 
    width: 40px;  
    background: rgb(255, 255, 255);
}

.material-switch > label::before {
    background: rgb(255, 255, 255);
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);       
    border-radius: 8px;
    content: '';
    height: 16px;
    margin-top: -8px;
    position:absolute;
    /* opacity: 0.9; */
    transition: all 0.4s ease-in-out;
    width: 40px;
}
.material-switch > label::after {
    background: rgb(255, 255, 255);
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);    
    border-radius: 16px;
    content: '';
    height: 24px;
    left: -4px;
    margin-top: -8px;
    position: absolute;
    top: -4px;
    transition: all 0.3s ease-in-out;
    width: 24px;
}
.material-switch > input[type="checkbox"]:checked + label::before {
    background: rgb(0, 166, 78);       
    opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label::after {
    background: rgb(235,236,237); 
    background: inherit;
    left: 20px;
}


/* Style pour scroll dans modal assignment Liste des unités assignées */
.my-tbodyassign,
.my-tbodystatus{
  max-height: 295px;
  display:block;
  overflow-y:scroll;
  width:100%;
} 

.my-tbodystatus td{
    font-size: 0.8rem;
}
/* Style pour scroll dans modal assignment Liste de recherche */
.my-tbody {
  height:295px;
  display:block;
  overflow-y:scroll;
  width:100%;
}   

/* Style pour champ de recherche */
#SearchAssign{
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;    
background: url(../../images/logo-search.png) no-repeat scroll 5px 5px;
padding-left:30px;
margin-bottom: 15px;
margin-top: 15px;
}

/* Styles pour cases à cocher dans les modals*/
.containercheck {
  display: block;
  position: relative;
  padding-left: 12px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.containercheck input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  border: 1px solid #cecece;
}

/* On mouse-over, add a grey background color */
.containercheck:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.containercheck input:checked ~ .checkmark {
  /*background-color: #2196F3;*/
  background-color: #fff;  
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none; 
}

/* Show the checkmark when checked */
.containercheck input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.containercheck .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 14px;
  border: solid #31b131;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* texte pour content */
.TxtAssignFollowUnits{
    color : #70A8B8;
    font-size: 0.9rem;
    margin-left: 15px;
}

/* Style ligne séparation pour liste des user assigné à une unités */
#UserAssignSelect hr{
   margin: 0.2rem; 
}

/*
* STYLES ONGLETS DEFINITION ALERTES
*/
#TabsDefAlert .bigbox{
    height: 1200px;
}

#TabsDefAlert .nav-tabs .nav-item :hover{
    margin-bottom: 0px!important;
    box-sizing: content-box;
}

#TabsDefAlert .nav-tabs{
    border-bottom: 2px solid #70A8B8;
}

#TabsDefAlert .nav-tabs .nav-link{
    border-bottom: none!important;
}

#TabsDefAlert .nav-tabs .nav-link.active, 
#TabsDefAlert .nav-tabs .nav-item.show {
    background-color: #FFBD0F;
    border-color: #F4F4F4!important; 
}

#TitleAlert .BlockField{
    padding: 10px 20px 10px 20px;
    margin-bottom: 16px;    
}

#TabsDefAlert .BlockField{
    border: 1px solid #cecece;
    padding: 10px 20px 10px 20px;
    margin-bottom: 16px;
}

#TabsDefAlert .BlockField legend, 
#TitleAlert .BlockField legend{
    color: #666;
    font-size: 1.2rem;
    padding: 0px 10px 0px -20px; /* To give a bit of padding on the left and right */
    border-bottom:none;    
}    

.ui-autocomplete{
    background-color: white;
    width: 410px;
    -moz-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -webkit-box-shadow: 2px 2px 20px 0px #9b9b9b;
    -o-box-shadow: 2px 2px 20px 0px #9b9b9b;
    box-shadow: 2px 2px 20px 0px #9b9b9b;            
}
.ui-autocomplete li{
    list-style: none;
    /* text-indent: 10px;*/
    padding-left: 10px;
}

.ui-autocomplete li :hover{
    background-color: #dcdcdc;
}

.ui-helper-hidden-accessible{
    visibility: hidden;
}

/*
* STYLE MANAGER
*/

.managercss .titletemplate{
    background-color: #cecece;
    padding-bottom: 0.25rem;
    padding-top: 0.25rem;
    margin-bottom: 1.2rem;
}