@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');


body {
    background: #333; 
    /* background-image: url("../images/bg.png");*/
    background-attachment:fixed;
    height: 100vh;
    margin: 0;
    position: relative;
}

h1 {
    color: #6b6254;
}

h2 {font-size:22px;}


legend {
    text-transform: uppercase;
    padding: 10px 10px 0px 0px;
    font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif!important
}

fieldset {
    border-top:1px solid #efefef;
    border-left:none;
    border-right:none;
    border-bottom:none;

}
input[type="submit"], input[type="button"], button {
    border-color: #555;
    color: white;
    /* min-width: 80px;*/
    padding: 2px 7px;
    text-shadow: none;
}

a:link, a:visited {
    color: #000;
}
/*
a:hover {
    text-decoration: underline;
}
*/
a {color:#444;cursor:pointer;text-decoration: none;}
a:hover {color:#555;}


.titre_bloc {
    color: #fff;
    display: block;
    font-size: 12px;
    font-weight: bold;
    position: relative;
    text-shadow: none;
    top: 20px;
}
.titre_bloc:first-child {
    padding: 0 0 2px 5px;
}

.blocked {
    -moz-user-select: none;
}
.divNoPrint {
    display: none;
    visibility: hidden;
}

.arrondi {
    border-radius: 3px !important;
}
.bold {
    color: #333;
    font-weight: bold;
}
.boldWhite {
    color: #fff;
    font-weight: bold;
}

.loadPage {
    font-size: 35px;
    font-weight: bold;
    padding: 20px 0 50px;
    text-align: center;
}
.wrapperContainer {
    border-radius: 5px;
    display: block;
    margin: 0 0 20px;
    padding: 3px 3px 20px;
    background-color: #222d32;
}
#entete {
    background: white none repeat scroll 0 0;
    border-radius: 0 0 5px 5px;
}

.footer {
    color: #ccc;
    text-align: center;
}

.arrondi_ligne_5 {
    border-radius: 5px;
}
.arrondi_ligne_10 {
    border-radius: 10px;
}
.arrondi_ligne_15 {
    border-radius: 15px;
}
.espace {
    padding: 20px;
}
.bloc {
    margin: 30px -15px 30px -15px;
}

.bloc-interne {
    margin: 10px 0 0;
    padding: 10px;
}
.bloc-interne-2 {
    padding-left: 10px;
}
.bloc-interne-1 {
    padding: 0;
}
p.bloc-interne-3 {
    border: 1px solid rgba(5, 5, 5, 0.1);
    border-radius: 2px;
    font-size: 0.91em;
    margin-bottom: 5px;
    padding: 5px;
}
p.bloc-interne-3:hover {
    background-color: #f9f9f9;
    border: 1px solid rgba(5, 5, 5, 0.3);
    text-shadow: none;
    transition: all 0.2s ease-in-out 0s;
}
.bloc-interne-2 h2 {
    margin-bottom: 10px;
}
.bloc-interne-2 p {
    margin: 2px;
}

.titre_bloc_droit {
    border-bottom: 1px solid rgba(1, 1, 1, 0.63);
    color: rgba(1, 1, 1, 0.63);
    font-size: 1.12em;
    font-weight: bold;
    padding-left: 2px;
    position: relative;
    top: -8px;
}
.titre_bloc_droit a {
    color: rgba(1, 1, 1, 0.63);
    cursor: help;
    display: inline-block;
    font-size: 1em;
    font-weight: bold;
    text-decoration: none;
    width: 100%;
}
.wrapper-valign {
    height: 400px;
    line-height: 400px;
    text-align: center;
}
div.wrapper-valign:first-child {
    border: 1px solid #fff;
    display: inline-block;
    line-height: 1.2;
    text-align: left;
    vertical-align: middle;
    width: 600px;
}

h1.titre_n1 {
    /*    font: 600 22px/22px Roboto,sans-serif !important;*/
    border-radius: 5px;
    padding: 10px;
}
h2.titre_n2 {
    font-size: 16px;
    margin: 15px 0 7px;
    text-shadow: 1px 1px 1px #fff;
}

.button-link {
    -moz-user-select: none;
    border-radius: 4px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    font-style: normal;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    transition-duration: 0.2s;
}

a.zoom {
    color: #a3a2a8;
    text-decoration: underline;
    transition: all 1.1s ease-in-out 0s;
}
a.zoom:hover {
    color: #000;
    text-decoration: underline;
    transition: all 1s ease-in-out 0s;
}


.picto_plus, .picto_moins {
    cursor: pointer;
    float: right;
    position: relative;
    top: 15px;
}

a.underline {
    text-decoration: underline;
}

.overflow-y-300 {
    height: 200px;
    overflow-y: auto;
}


.espace-vertical{
    margin-top:20px;
}

a.link-white{
    color:#ccc;

}
a.link-white:hover{
    text-decoration: none;
}


#contenu{min-height: 500px;}
#principal{}



.printDatatableBody{background: none;}

.chargement{
    width:100%;
    min-height:200px;
    background-image: url(../images/Spinner.gif);
    background-repeat:no-repeat;
    background-position: center;
}

.action_impossible{
    cursor:not-allowed;
}

.click {
    cursor:pointer;
}

.gris_clair{color:#e8cdcd;}

b

.table_ul_nav{
    display: block;
    list-style: outside none none;
    padding-left: 40px;
    display: inline;
}
.table_ul_nav>li{
    width: 130px;
    display: inline-block;
    text-align: center;
    padding: 8px;
    margin-top: 10px;
    /* font-size: 18px;*/
    /*font-weight: bold;*/
    display: inline;
}


span.fa-info-circle { cursor:help;}

.cursor-pointer{
    cursor: pointer;
}


h1.titre_n1 {
    background: #F6F6F6 none repeat scroll 0 0;
    border-left: 6px solid #7ec50a;
    color: #7ec50a;
}


.jaune {color:#f1d600;}


.ev_hausse {
    color: #d9534f;
}
.ev_baisse {
    color: #5cb85c;
}
.ev_ferme {
    color: #904f7d;
}
.ev_nouveau {
    color: #ffd100;
}
.ev_egal {
    color: #e9a720;
}

.r1 {
    color: #689E25;
}
.r2 {
    color: #feff00;
}
.r3 {
    color: #EFC22E;
}
.r4 {
    color: #E48C21;
}
.r5 {
    color: #A63519;
}
.open_v {
    color: #6f5499;
}
.ferme_r {
    color: #78909c;
}
.valide_bleu {
    color: #337ab7;
}
.orange_bootstrap {
    color: #f0ad4e;
}
.violet_bootstrap {
    color: #6f5499;
}


.underline-red {border-bottom:2px solid rgba(89, 138, 9, 0.8);}

.rouge {
    color: #761c19;
    font-weight: bold;
}
.orange {
    color: #d58512;
    text-shadow: none !important;
}
.vert {
    color: #1a7f05;
}
.gris {
    color: #777;

}

.icon-supprimer{
    color:#d9534f;
}
.gris_login {
    color: #555;
    /* font-weight: bold;*/
    text-decoration: underline !important;
}
a.rouge {
    color: #761c19;
    font-weight: bold;
}

.type_2{color:#d9534f;font-weight: 800}

.titre{
    color:#ffffff;
}


#le_copyright {
    color: #fefefe;
}

.fond-bloc {
    background-color: #fff;
}
.fond-bloc2 {
    background-color: #f9f9f9;
}
.fond-bloc3 {
    background-color: #f9f9f9 !important;
    border-top: 1px solid #efefef;
}
.fond-bloc4 {
    background-color: #fefefe;
}

.fond-bloc5 {
    background-color: #f5f5f5!important;
}




.wrapperContainer {
    background: #ffffff none repeat scroll 0 0;
    box-shadow: 7px 7px 5px rgba(50, 50, 50, 0.75);
}

table.table_data_1 thead tr th{
    border-bottom: 1px solid #333;
}

table.table_data_1 tbody tr td {
    border-bottom: 1px solid #dedede;
}

h2.titre_bloc_tdb {
    border-bottom: 1px solid #ddd;
    display:block!important;

}
/* Nouveau pour orange bank*/

.JSUploadForm .JSFileChoos{
    background-color : #7ec50a!important;

}



.extra-margin-30{ margin: 30px 0px 30px 0px;}
.extra-margin-20{ margin: 20px 0px 20px 0px;}

.titre_orange_bank{font-size: 51px;}

.data-nada-ke-dalle{
    color:gray;
    font-size:10px;
}

.info-box-number, .info-box-text{
    font-size:27px;
}
.table tr td .progress {
    margin-top: 0px; 
}

.red{color:#d33724;}
.green{color:#008d4c;}
.orange{color:#f39c12;}
.blue-gray{color:#78909c;}
.bg-blue-gray{background: #78909c;}
.bg-black{background: #111111;}
.bg-red{background:#d33724;}
.bg-green{background:#008d4c;}
.bg-orange{background :#f39c12!important;}
.bg-violet {background: #6f5499;}
.white {color: #fff;}

.janvier{ color:#AFDFE4;}
.fevrier{color:#C2B59B;}
.mars{color:#9B8579;}
.avril{color:#92278F;}
.mai{color:#2BB673;}
.juin{color:#375BA4;}
.juillet{color:#FFF200;}
.aout{color:#C11A26;}
.septembre{color:#F9A165;}
.octobre{color:#9B8579;}
.novembre{color:#594A42;}
.decembre{color:#B1AFE2;}

.bg-janvier{ color:#AFDFE4;}
.bg-fevrier{color:#C2B59B;}
.bg-mars{color:#9B8579;}
.bg-avril{color:#92278F;}
.bg-mai{color:#2BB673;}
.bg-juin{color:#375BA4;}
.bg-juillet{color:#FFF200;}
.bg-aout{color:#C11A26;}
.bg-septembre{color:#F9A165;}
.bg-octobre{color:#9B8579;}
.bg-novembre{color:#594A42;}
.bg-decembre{color:#B1AFE2;}


.hideOverflow
{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    width:100%;
}


p, div {
    overflow-wrap: break-word;
}

.wrapper-form-generique{
    background: #f9f9f9;
    padding: 10px;
}

.titre-h2 {
    color:#888;
    border-bottom: 1px solid #ddd;
    text-transform: uppercase;
    font-size:21px;
    margin-bottom:20px;
    padding: 10px 10px 5px 0px;
    font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif!important;
    font-weight:400;
}

/* formulaire d'identification */
.form-signin-heading {
    color: #7ec50a;
}

/* template 2 */
.slogan1{font-size:36px;font-family:'Roboto', sans-serif;font-weight:900;font-style:italic;text-shadow: 1px 1px #7ec50a;}
.slogan2{font-size:24px;font-family:'Roboto', sans-serif;font-weight:300;font-style:italic;}


/***********************************  header **********************************/
#logo-header{margin-top: 20px;
             margin-left: 20px;
             margin-right: 20px;
             margin-bottom: 20px;
             /* width: 235px;*/
             /*height: 60px;*/
}

.drapeau_connexion {padding-right: 15px;}

.role-utilisateur{
    color:#171d50;
    font-size:30px;
    text-transform:uppercase;
    font-weight: bold;
    display:inline-block;
    position: relative;
    margin-bottom: 20px;
    top: 10px;
    left: 20px;

}

#identiteRole {font-size:150%;text-transform: uppercase;font-family:inherit;font-weight: 400;}

.bulletMenu { position: absolute; border-radius: 14px; line-height: 1.5em; font-size: 1.3em; top: 15px; background: rgb(85, 85, 85) none repeat scroll 0px 0px; padding: 1px 5px; right: 28px;}



/* thumbnails for bootstrap*/
.flex-row {
    display: flex;
    flex-wrap: wrap;
}
.flex-row > [class*='col-'] {
    display: flex;
    flex-direction: column;
}

.flex-row .thumbnail,
.flex-row .caption {
    flex-direction: column;
    display: flex;
    flex: 1 0 auto;
    height: auto;
    position: relative;
}
.flex-text {
    flex-grow: 1;
}
.flex-row img {
    min-width: 0;
    /* width: 100%;*/
}

/* make gutter sizes consistent */
.flex-row  {
    padding-left: 15px;
    padding-right: 15px;
}

.nova-thumbnails a {text-decoration: none;}
.nova-thumbnails a:hover, .nova-thumbnails a:hover h2 {color:#fff!important;}
.nova-thumbnails a:hover {background-color: #7ec50a;opacity: 0.8;}
.nova-thumbnails div {padding-top:5px;}

/* 
  Extra Small Devices, Phones { .col-xs-$ } 
    ~ 480px to 767px ~

  Extra Small Devices, Phones { .col-sm-$ } 
    ~ 768px to 991px ~

  Extra Small Devices, Phones { .col-md-$ } 
    ~ 992 to 1200px ~

  Extra Small Devices, Phones { .col-lg-$ } 
    ~ 1201px up ~
*/

/* Extra Media Query Below for Retina Iphones and Smaller */
@media only screen and (max-width : 480px){
    .flex-row > [class*='col-'] {
        width: 100%;
    }
    .flex-row  {
        padding-left: 0px;
        padding-right: 0px;
    }
}

/****************************** les tags / étiquettes  *************************/
.nova-tag-group>.nova-tag {
    float: left;
    margin: 0 6px 6px 0;
}

.nova-tag:before {
    content: "#";
    display: block;
    float: left;
    margin-right: 3px;
}

.nova-tag>.nova-truncate {
    display: inline-block;
}

.nova-truncate {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: normal;
}

.nova-tag, .nova-tag:visited {
    position: relative;
    display: inline-block;
    height: 20px;
    padding: 0 7px;
    background: #999;
    border: 1px solid #999;
    border-left-width: 0;
    color: #fff;
    font-family: "Interstate","Lucida Grande","Lucida Sans Unicode","Lucida Sans",Garuda,Verdana,Tahoma,sans-serif;
    font-weight: 100;
    font-size: 14px;
    line-height: 20px;
    white-space: nowrap;
    cursor: pointer;
    border-radius: 20px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


/************************************* SVG *************************************/
.svg-container {
    display: inline-block;
    position: relative;
    width: 100%;
    padding-bottom: 100%; /* aspect ratio */
    vertical-align: top;
    overflow: hidden;
}
.svg-content-responsive {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: 10px;
    bottom:10px;
    right:10px;
}


/*********************** surcharge bootstrap calendar **************************/
.bootstrap-datetimepicker-widget td.active, .bootstrap-datetimepicker-widget td.active:hover{
    background-color: #7ec50a;
}

.bootstrap-datetimepicker-widget td.today:before{
    border-bottom-color: #7ec50a;

}

.scrollY{
    max-height:300px;
    overflow-y:auto;  
}

/******************************** MENU ****************************************/


#menu-principale .navbar-nav>li>.dropdown-menu {
    margin-top:0px;
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    background: #333;
    background-image: url(../images/bg.png);
    background-attachment: fixed;
    box-shadow: none;
    border-color: #555;

}


.navbar-default .navbar-nav>li>a {
    width:150px;
    font-weight:bold;
}
.mega-dropdown {
    position: static !important;
    /*   width:100%;*/
}
.mega-dropdown-menu {
    padding: 20px 0px;
    width: 100%;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.mega-dropdown-menu > li > ul {
    padding: 0;
    margin: 0;
}
.mega-dropdown-menu > li > ul > li {
    list-style: none;
}
.mega-dropdown-menu > li > ul > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #999;
    white-space: normal;
}
.mega-dropdown-menu > li ul > li > a:hover,
.mega-dropdown-menu > li ul > li > a:focus {
    text-decoration: none;
    color: #444;
    background-color: #f5f5f5;
}
.mega-dropdown-menu .dropdown-header {
    color: #7ec50a;
    font-size: 15px;
    font-weight:bold;
}
.mega-dropdown-menu form {
    margin:3px 20px;
}
.mega-dropdown-menu .form-group {
    margin-bottom: 3px;
}

/* surcharge bootstrap pour la navbar */

.navbar-default{
    background: #333;
    background-image: url(../images/bg.png);
    color:#fff;
    border:none;

}

.navbar{
    margin-bottom:0px;
}
.navbar li{
    border-bottom: 4px solid transparent;
    height: 109px;
}

.navbar-nav > li > .dropdown-menu li{
    border-bottom: none;
}

.navbar-default .navbar-brand {
    color:#fff;
}
.navbar-default .navbar-nav>li>a, .navbar-default .navbar-text{
    color:#fff;
}

.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover{
    color:#ddd;
}

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{
    color:#ddd;
}

.dropdown-menu{
    font-size: 14px;
    text-align: left;

    border-radius: 4px;
    /*  background: #fff;*/
    /*color:#fff;*/
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{
    background: inherit;
    color:#fff;

}


.navbar-nav>li>a {
    margin-top: 0;
    text-align: center;
}

li.actif {
    border-bottom: 4px solid #7ec50a;
    border-radius: 4px;
    background-color: rgba(0,0,0,0.35);

}

.navbar-nav li:hover{
    background-color: rgba(255,255,255,0.10);
    border-bottom: 4px solid #7ec50a;
    border-radius: 4px;

}

.navbar-nav > li > .dropdown-menu li:hover,
#menu-haut ul.nav.navbar-nav > li:hover {
    background-color: transparent;
    border-bottom: 0px;
    border-radius: 0;

}

.navbar-collapse{
    padding-left:0px;
    padding-right:0px;
}

.mega-dropdown-menu > li ul > li > a:hover, .mega-dropdown-menu > li ul > li > a:focus{
    background-color: inherit;
    color:#fff;

}

.dropdown-menu .divider{
    background: #555;
}

.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{
    background-color: inherit;
}

.navbar-default .navbar-toggle .icon-bar{
    background-color: #fff;
}

/******************************** surcharge bootstrap général *******************/

.btn-warning.active.focus, .btn-warning.active:focus, .btn-warning.active:hover, .btn-warning:active.focus, .btn-warning:active:focus, .btn-warning:active:hover, .open>.dropdown-toggle.btn-warning.focus, .open>.dropdown-toggle.btn-warning:focus, .open>.dropdown-toggle.btn-warning:hover, .btn-warning:focus, .btn-warning.focus {
    color: #fff;
    background-color: #555;
    border-color: #333;
}


#loginbox .btn .glyphicon {
    left: -5px;
}
/*
.btn{
    margin: 3px 3px;
}

.btn.dropdown-toggle{
    margin: 3px 0px;
}
*/
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    color: #555;
    background-color: #e5e7e8;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
    cursor: default;
}

.has-danger .ui-combobox{
    border: solid 1px #dd4b39;
    box-shadow: none;
}

.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
    z-index: 3;
    color: #fff;
    background-color: #e5e7e8;
    border-color: #e5e7e8;
    cursor: default;
}

/********************************* rounded button ******************************/

.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}
.btn-circle.btn-lg {
    width: 50px;
    height: 50px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.33;
    border-radius: 25px;
}
.btn-circle.btn-xl {
    width: 70px;
    height: 70px;
    padding: 10px 16px;
    font-size: 24px;
    line-height: 1.33;
    border-radius: 35px;
}



/******************************** Combo jquery ui ******************************/

.wrapper {
    margin: 0 auto;
    max-width: 600px;
    padding: 0 50px;
}
.ui-combobox {
    position: relative;
}
.ui-combobox-input {
    box-sizing: border-box;
    cursor: pointer;
    font-size: 14px;
    font-weight: normal;
    padding: 6px 6px;
    width: 100%;
}
.ui-combobox-input:focus {
    cursor: inherit;
}
.ui-combobox-input.ui-input-invalid {
    border-color: red;
    color: red;
}
.ui-icon-triangle-1-s {
    left: auto;
    margin-top: -8px;
    position: absolute;
    right: 0.5em;
    top: 50%;
}
.ui-autocomplete {
    font-size: 80%;
    max-height: 300px;
    overflow-x: hidden;
    overflow-y: auto;
}
.ui-autocomplete .ui-state-focus {
    font-weight: normal;
}

.ui-dialog .ui-dialog-content{
    /*background: #f5f5f5;*/


}

.ui-widget-content{
    /*padding-bottom: 15px;*/
}



.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{
    background-color: #454545;
}

/* Supprime le bouton close de dialogu jquery ui */
.no-close .ui-dialog-titlebar-close {
    display: none;
}

/* corrige un bug de l'affiche des icons font-awsome dans jquery dialog */
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
}



/****************************** Surcharge font-awesome  4.3 et 5***********************/

.btn > .fa .svg-inline--fa{
    margin-right:0px;
}

/****************************** Surcharge admin LTE  **************************/

.box {
    /*background: #f5f5f5;*/
}

.info-box { background :#f9f9f9;}

.main-header{
    max-height:inherit;
}

.box.box-solid > .box-header a:hover  {
    background: none;
}

a:hover.btn.btn-app   {
    background: none;
    cursor:pointer;
}

.main-header {
    z-index: 50;
}

.btn-warning,.btn-warning:link,.btn-warning:active,.btn-warning:hover,.btn-warning:visited {
    background-color: #555;
    border-color: #333;
}
a.btn-warning {
    color:#fff;
}

/* bouton action */


/* vert */
.btn-action-nova{ color:#fff!important;}
.btn-action-nova,.btn-action-nova:link,.btn-action-nova:active,.btn-action-nova:hover,.btn-action-nova:visited {
    background-color: #7ec50a;
    border-color: #84C31D;
}
.btn-action-nova:hover{
    background-color: #73b508;
    border-color: #6dab08;
}

/* rouge */
.btn-action-nova-rouge{ color:#fff!important;}
.btn-action-nova-rouge,.btn-action-nova-rouge:link,.btn-action-nova-rouge:active,.btn-action-nova-rouge:hover,.btn-action-nova-rouge:visited {
    background-color: #d33724;
    border-color: #bf3120;
}
.btn-action-nova-rouge:hover{
    background-color: #bf3120;
    border-color: #ae2d1d;
}







.dl-horizontal dd {
    margin-bottom: 3px;
}

/* centre de notification */
div[role="message"] .dl-horizontal dd {
    margin-bottom: 3px;
    background: #fefefe;
    padding: 5px 10px 0px 10px;
    border: 1px solid #ccc;
    border-radius:3px;
}

div[role="message"] .dl-horizontal dt {
    margin-bottom: 3px;
    padding: 5px 10px 0px 10px;
    border-radius:3px;

}

div[role="message"] .dl-horizontal dd a,.qtip-content a{
    color:#E48C21;
    text-decoration: underline;

}

#liste_messages > ul.menu>li>a p,#liste_notifications > ul.menu>li>a p,#liste_taches > ul.menu>li>a p  {
    margin: 0 0 0 10px;
    font-size: 12px;
    color: #888888;
    overflow: hidden;
    text-overflow: ellipsis;

}

.non_lu {
    color: #000;
    font-weight: 600;
}


.message{color:#00a65a;}
.notification{color:#f39c12;}
.tache{color:#dd4b39;}


ul.navbar-nav > li.dropdown >  ul.dropdown-menu > li.novasecur-header {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    background-color: #ffffff;
    padding: 7px 10px;
    border-bottom: 1px solid #f4f4f4;
    color: #888888;
    font-size: 12px;
}


/****************************** Surcharge font awasome 5 ***********************/
.svg-inline--fa.fa-w-16,.svg-inline--fa.fa-w-14  {
    margin-right: .5rem;
}

.btn-circle .svg-inline--fa.fa-w-16,.btn-circle .svg-inline--fa.fa-w-14  {
    margin-right: 0rem;
}


/* taille icon font awesome */
.nova-thumbnails .nova-fa {font-size: 5em!important;}

/****************************** Surcharge datatable ****************************/
.dt-buttons.btn-group a{color: #7b6d57;}

div.dataTables_wrapper div.dataTables_info {
    padding-top: 8px;
    white-space:normal;
}

.dataTables_wrapper{
    margin-top: 5px!important;
}

.dataTables_length{margin-top: 7px;}


/****************************** Surcharge tooltipster ****************************/

.tooltipster-sidetip.tooltipster-punk.tooltipster-punk-customized .tooltipster-box {
    background: #fff;
    border-bottom: 3px solid #7ec50a;
    border-radius: 3px;
    box-shadow: 5px 5px 2px 0 rgba(0,0,0,0.4);
}

.tooltipster-sidetip.tooltipster-punk.tooltipster-punk-customized .tooltipster-content {
    color: #333;
    padding: 15px;
}

.tooltipster-sidetip.tooltipster-punk.tooltipster-punk-customized.tooltipster-top .tooltipster-arrow-border{
    border-top-color:#7ec50a;
}

/*********************** Personnalisation suivant matériel / taille écran *****/

@media only screen and (min-width: 768px) and (max-width: 992px)  {

    /* taille icon font awesome */
    .nova-thumbnails .nova-fa {font-size: 5em!important;}

    #wrapper-bloc-chevron-control {
        position: relative;
        top: 0px;
    }

    .navbar-default .navbar-nav>li>a {
        width: 120px;
        font-weight: normal;
    }

    .bulletMenu {
        position: absolute;
        border-radius: 14px;
        line-height: 1.5em;
        font-size: 1.1em;
        top: 15px;
        background: rgb(85, 85, 85) none repeat scroll 0px 0px;
        padding: 1px 5px;
        right: 9px;
    }

}

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

    .btn-group{
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .btn{
        padding: 6px 12px;
        font-size: 12px;  
    }



    /* taille icon font awesome */
    .nova-thumbnails .nova-fa {font-size: 5em!important;}

    #wrapper-bloc-chevron-control {
        position: relative;
        top: 0px;
    }



    b, optgroup, strong{
        font-weight: 300;
    }

    .h1, h1 {
        font-size: 29px;
    }

    .info-box-number, .info-box-text {
        font-size: 22px;
    }

    .icon-holder{
        display: inline-block;
        margin-right: 10px;
    }

    .icon-holder > span {
        font-size:2em;
        padding-right: 5px;
    }

    li.actif {
        border-bottom: 2px solid #7ec50a;
        border-radius: 2px;
        background-color: rgba(0,0,0,0.35);
    }

    .navbar li{
        border-bottom: 2px solid transparent;
        border-radius: 2px;
    }


    .navbar-nav{
        width:97%;
    }


    .navbar-nav li:hover{
        background-color: rgba(255,255,255,0.10);
        border-bottom: 2px solid #7ec50a;
        border-radius: 2px;

    }

    .navbar-default .navbar-nav > li > a{
        width: 100%;
    }

    .navbar-nav > li > .dropdown-menu li {
        text-align: center;

    }

    #bullet_pla, #bullet_signalisation{
        margin-right:5px;
    }


    dd{margin-bottom: 5px;}
}

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

    /* taille icon font awesome */
    .nova-thumbnails .nova-fa {font-size: 3em!important;}

    body {
        font-size: 13px;

    }

    .fa-3x{font-size: 2em;}

    div.dataTables_wrapper div.dataTables_filter label {
        white-space: inherit;
        text-align: center;
        margin-top: 5px;
    }

    div.dataTables_wrapper div.dataTables_filter input {
        display: inline;

    }

    .icon-holder > div.label{
        margin-left:5px;
    }


    .role-utilisateur {
        font-size: 20px;
    }

    h1.titre_n1 {
        font-size:18px;
    }

    .navbar-brand {
        font-size: 14px;

    }

    .info-box {
        min-height: 60px;

    }

    .info-box-icon {
        height: 60px;
        width: 60px;
        font-size: 22px;
        line-height: 60px;

    }

    .info-box-number, .info-box-text {
        font-size: 16px;
    }

    .info-box-content {
        padding: 5px 10px;
        margin-left: 60px;
    }




    .titre-h2 {
        font-size:15px;
        margin-bottom:10px;
        padding: 0px 10px 5px 0px;

    }


    dd{margin-bottom: 5px;}

    .checkbox input[type="checkbox"]{
        position: relative;
        top: 2px;
        left: -8px;
    }
}

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

    /* taille icon font awesome */
    .nova-thumbnails .nova-fa {font-size: 2em!important;}

    dd{margin-bottom: 7px;}

    body{font-size:11px;}

    .icon-holder {
        padding-right:7px;
    }

    .icon-holder > span {
        font-size:2em;

    }

    .fa-3x{font-size: 2em;}

    div.dataTables_wrapper div.dataTables_filter label {
        white-space: inherit;
        text-align: center;
        margin-top: 5px;
    }

    .role-utilisateur {
        font-size: 16px;
    }

    h1.titre_n1 {
        font-size:16px;
    }

    .navbar-brand {
        font-size: 13px;

    }

    blockquote {
        border-left: 5px solid #a3a2a8;
        margin-left: 0;
        font-size: 12.5px;
        /* padding-left: 10px; */
    }

    legend {
        font-size: 16px;
    }

    .btn {
        font-weight: 400;
        touch-action: manipulation;
        white-space: normal;
        padding: 6px 12px;
        font-size: 12px; 
        line-height: 1.42857143;

    }

    div.dataTables_wrapper div.dataTables_filter input {
        display: inline;

    }

    .icon-holder > div.label{
        margin-left:5px;
    }



    .info-box {
        min-height: 60px;

    }

    .info-box-icon {
        height: 60px;
        width: 60px;
        font-size: 22px;
        line-height: 60px;

    }

    .info-box-number, .info-box-text {
        font-size: 16px;
    }

    .info-box-content {
        padding: 5px 10px;
        margin-left: 60px;
    }

    .badge {
        min-width: 8px;
        padding: 3px 7px;
        font-size: 10px;

    }


    .checkbox input[type="checkbox"]{
        position: relative;
        top: 2px;
        left: -8px;
    }


}