:root {
--blue: #4e73df;
--indigo: #6610f2;
--purple: #6f42c1;
--pink: #e83e8c;
--red: #e74a3b;
--orange: #f8a308;
--yellow: #f6c23e;
--green: #1cc88a;
--teal: #20c9a6;
--cyan: #36b9cc;
--white: #fff;
--gray: #858796;
--gray-dark: #5a5c69;
--primary: #4e73df;
--secondary: #858796;
--success: #1cc88a;
--info: #36b9cc;
--warning: #ff7400;
--danger: #e74a3b;
--light: #f8f9fc;
--dark_0: #212529;
--dark_1: #313131;
--dark_2: #343a40;
--gray_1: #f0eff0;
--light_1: #525f6c;
--light_2: #525f6c;
--home: #525f6c;
--clts: #4e73df;
--frns: #AAD200;
--fcts:  #ff1010;
--cmds: #e86d08;
--arts: #ff0;
--cats: #EDED0C;
--stats: #f0f;
--comm: #00f;
}

/*@media (max-width: 576px) {
  #accordionSidebar {
    width: 0px!important;
  }
}*/
/*glyph*/
  .glyph_connect {
    padding: 11px;
    border: 1px solid #777;
    border-radius: 50%;
    margin: 0px 0.3em;
    cursor: pointer;
    color: 
  }
  .glyph_btn  {
    color: #aaa!important;
  }
  .glyph_connect:hover,.glyph_clicked {
    cursor:pointer;
    color: var(--dark-0)!important;
    background-color: var(--dark_0);
  }
  .fa-phone {
    /*margin-right: 1em!important;*/
    transform:rotate(90deg);
  }
  .fa-bullhorn {
    margin-right: 0.2em!important;
    transform:rotate(-11deg);
  }
/*glyph*/
#wrapper {
  background-color: var(--dark_0)!important;
}

/*colors*/
  /*cmds*/
      .menu-active-cmds {
        color: var(--cmds)!important;
        border-right: 0.25rem solid var(--cmds) !important;
      }
      .menu-cmds:hover {  
        border-right: 0.25rem solid var(--cmds) !important;
      }
      .menu-cmds:hover>a {  
        color: var(--cmds)!important;
      }
      .bg-cmds-1 {
        /*background-color: var(--dark_1)!important;*/
        background-image: linear-gradient(45deg, transparent 90%, var(--cmds) 100%)!important;
        background-size: cover; 
      }
      .bg-cmds-2 {
        background-image: linear-gradient(45deg, var(--cmds) 0%, transparent 5%, transparent 95%, var(--cmds) 100%)!important;
        background-size: cover; 
      }
      .border-cmds {
        border-color: var(--cmds);
      }
      .txt-cmds {
        color: var(--cmds)!important;
      }
  /*fcts*/
      .menu-active-fcts {
        color: var(--fcts)!important;
        border-right: 0.25rem solid var(--fcts) !important;
      }
      .menu-fcts:hover {  
        color: var(--fcts)!important;
        border-right: 0.25rem solid var(--fcts) !important;
      }
      .menu-fcts:hover>a {  
        color: var(--fcts)!important;
      }      
      .link-fcts:hover > a {
       color:var(--fcts)!important; 
      }
      .bg-fcts-1 {
        background-color: var(--dark);
        background-image: linear-gradient(45deg,transparent 90%, var(--fcts) 100%)!important;
        background-size: cover; 
      }
      .bg-fcts-2 {
        background-color: var(--dark);
        background-image: linear-gradient(45deg, var(--fcts) 0%,transparent 5%,transparent 95%, var(--fcts) 100%)!important;
        background-size: cover; 
      }
      .border-fcts {
        border-color: var(--fcts);
      }
      .txt-fcts {
        color: var(--fcts)!important;
      }
  /*clts*/
      .menu-active-clts {
        color: var(--clts)!important;
        border-right: 0.25rem solid var(--clts) !important;
      }
      .menu-clts:hover {  
        border-right: 0.25rem solid var(--clts) !important;
      }
      .menu-clts:hover>a {  
        color: var(--clts)!important;
      }
      .bg-clts-1 {
        background-color: #fff;
        background-image: linear-gradient(45deg, transparent 90%, var(--clts) 100%)!important;
        background-size: cover; 
      }
      .bg-clts-2 {
        background-color: #fff;
        background-image: linear-gradient(45deg, var(--clts) 0%, transparent 5%, transparent 95%, var(--clts) 100%)!important;
        background-size: cover; 
      }
      .border-clts {
        border-color: var(--clts);
      }
      .txt-clts {
        color: var(--clts)!important;
      }
  /*frns*/
      .menu-active-frns {
        color: var(--frns)!important;
        border-right: 0.25rem solid var(--frns) !important;
      }
      .menu-frns:hover {  
        color: var(--frns)!important;
        border-right: 0.25rem solid var(--frns) !important;
      }
      .menu-frns:hover>a {  
        color: var(--frns)!important;
      }
      .bg-frns-1 {
        /*background-color: var(--dark);*/
        background-image: linear-gradient(45deg, transparent 90%, var(--frns) 100%)!important;
        background-size: cover; 
      }
      .bg-frns-2 {
        /*background-color: var(--dark);*/
        background-image: linear-gradient(45deg, var(--frns) 0%, transparent 5%, transparent 95%, var(--frns) 100%)!important;
        background-size: cover; 
      }
      .border-frns {
        border-color: var(--frns);
      }
      .txt-frns {
        color: var(--frns)!important;
      }
  /*arts*/
      .menu-active-cats,.menu-active-stocks_idFrn {
        color: var(--cats)!important;
        border-right: 0.25rem solid var(--cats) !important;
      }
      .menu-cats:hover,.menu-stocks_idFrn:hover {  
        border-right: 0.25rem solid var(--cats) !important;
      }
      .menu-cats:hover>a,.menu-stocks_idFrn:hover>a {  
        color: var(--cats)!important;
      }
      .bg-arts-1 {
        background-color: transparent;
        background-image: linear-gradient(45deg, transparent 90%, var(--arts) 100%)!important;
        background-size: cover; 
      }
      .bg-arts-2 {
        background-color: var(--dark);
        background-image: linear-gradient(45deg, var(--arts) 0%, transparent 2%, transparent 98%, var(--arts) 100%)!important;
        background-size: cover; 
      }
      .border-arts {
        border-color: var(--arts);
      }
      .txt-arts {
        color: var(--arts)!important;
      }
      .border-left-arts {
        border-left: 0.15rem solid var(--arts) !important;
      }
      .border-right-arts:hover {
        border-right: 0.15em solid var(--arts) !important;
      }
      .articles {
        border: 1px solid #777;
      }
      .articles img {
        width: 100%;
        border-radius: 7px;
        border: 1px solid var(--dark_2);
        box-shadow: 0.05em 0.05em var(--light_2);
      }
      .articles .icon {
        /*tag*/
        font-size: 1.1em;
        margin-top: 1.1em;
        transform: rotate(90deg);
        color: var(--light_2);
        /*bottle*/
        /*font-size: 2.1em;
        margin-top: 0.5em;
        transform: rotate(-45deg);*/
      }
      .change_art {
        cursor:pointer;
      }
      .change_art:hover {
        color:var(--light);
      }
      .articles span {
        line-height: 2em!important;
      }
      .articles select {
        /*padding: 0px;*/
        padding-top: 0px!important;
        padding-bottom: 0px!important;
        height: 2em!important;
        font-size: 0.97em!important;
        text-align:center;
        width:100%;
      }
  /*stats*/
      .menu-active-stats {
        color: var(--stats)!important;
        border-right: 0.25rem solid var(--stats) !important;
      }
      .menu-stats:hover {  
        color: var(--stats)!important;
        border-right: 0.25rem solid var(--stats) !important;
      }
      .menu-stats:hover>a {  
        color: var(--stats)!important;
      }
      .bg-stats-1 {
        background-color: transparent;
        background-image: linear-gradient(45deg, transparent 90%, var(--stats) 100%)!important;
        background-size: cover; 
      }
      .bg-stats-2 {
        background-color: var(--dark);
        background-image: linear-gradient(45deg, var(--stats) 0%, transparent 2%, transparent 98%, var(--stats) 100%)!important;
        background-size: cover; 
      }
      .chartsBtn {
        color: var(--light_2)!important;
      }
      .chartsBtn + .choosed {
        color: var(--white)!important;
      }
  /*home*/
      .menu-active-home {
        color: var(--home)!important;
        border-right: 0.25rem solid var(--home) !important;
      }
      .menu-home:hover {  
        color: var(--home)!important;
        border-right: 0.25rem solid var(--home) !important;
      }
      .menu-home:hover>a {  
        color: var(--home)!important;
      }
      .bg-home-2 {
        background-color: var(--home);
        background-image: linear-gradient(45deg, var(--home) 0%, transparent 2%, transparent 98%, var(--home) 100%)!important;
        background-size: cover; 
      }
  /*docs*/
      .menu-active-docs {
        color: var(--home)!important;
        border-right: 0.25rem solid var(--home) !important;
      }
      .menu-docs:hover {  
        color: var(--home)!important;
        border-right: 0.25rem solid var(--home) !important;
      }
      .menu-docs:hover>a {  
        color: var(--home)!important;
      }
  /*params*/
      .menu-active-params {
        color: var(--home)!important;
        border-right: 0.25rem solid var(--home) !important;
      }
      .menu-params:hover {  
        color: var(--home)!important;
        border-right: 0.25rem solid var(--home) !important;
      }
      .menu-params:hover>a {  
        color: var(--home)!important;
      }
  /*comm*/
      .menu-active-comm {
        color: var(--comm)!important;
        border-right: 0.25rem solid var(--comm) !important;
      }
      .menu-comm:hover {  
        color: var(--comm)!important;
        border-right: 0.25rem solid var(--comm) !important;
      }
      .menu-comm:hover>a {  
        color: var(--comm)!important;
      }
      .bg-comm-2 {
        background-color: var(--comm);
        background-image: linear-gradient(45deg, var(--comm) 0%, transparent 5%, transparent 95%, var(--comm) 100%)!important;
        background-size: cover; 
      }

.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: transparent!important;
  background-clip: border-box;
  border: 1px solid var(--dark_3);
  border-radius: 0.1rem!important;
}
.card-header {
  padding: 0.15rem 1.25rem;
  background-color:transparent;
  color: #777!important;
}

.border {
  border: 1px solid #858796!important;
}
  .card-body h1 {
    font-size:1.4em!important;
  }
/*  .card-body a {
    color: #f0f!important;
    font-size:0.7em!important;
  }
  .card-body h5 {
    color: #f00!important;
    font-size:1.3em!important;
  }*/
.navbar-nav {
  z-index:10;
}

.nav-link {
  padding: 0.25rem 1rem;
}

.text-warning {
  color: var(--warning)!important;
}
.border-success {
  border-color: var(--success)!important;
}
.small, small{
  font-size: 0.9em;
}
.small-xs{
  font-size: 0.7em;
}
/*bg text*/
  .bg-dark_0_1 {
    background-color: var(--dark_0);
    background-image: linear-gradient(180deg, var(--dark_0) 10%, var(--dark_1) 100%);
    background-size: cover;
  }
  .bg-dark_0_2 {
    background-color: var(--dark_0);
    background-image: linear-gradient(180deg, var(--dark_0) 10%, var(--dark_2) 100%)!important;
    background-size: cover;
  }
  .bg-dark_1_2 {
    background-color: var(--dark_1);
    background-image: linear-gradient(180deg, var(--dark_1) 10%, var(--dark_2) 100%);
    background-size: cover;
  }
  .text-light-0 {
    color: var(--light_0);
  }
  .text-light-1 {
    color: var(--light_1);
  }
  .text-light-2 {
    color: var(--light_2);
  }
  .text-dark {
    color: var(--dark_0)!important;
  }
  .text-dark-1 {
    color: var(--dark_1)!important;
  }
/*pages*/
  .sidebar .sidebar-brand {
    height: 4.375rem;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500!important;
    padding: 1.5rem 1rem;
    text-align: center;
    text-transform: none;
    letter-spacing: 0.05rem;
    z-index: 1;
  }
  .sidebar-brand-text {
    line-height: 1.3em;
    font-weight:none!important;
  }
  footer.sticky-footer {
    /*padding: 1.3rem 0!important;*/
    flex-shrink: 0;
    z-index: 0;
  }

/*all*/
  .width-auto {
    width: auto;
  }
  .cursor {
    cursor:pointer;
  }
  .fa-star,.fa-hourglass {
    cursor:pointer;
  }
  .favoris_on {
      color: #ff0!important;
    }
  .attente_on {
      color: #fff;
    }
  .border-radius {
    border-radius:1px!important;
  }
/*forms*/ 
  .btnAction:hover {
    background-color:var(--danger);
  }
  .dropdown {
    display:inline;
  }
  select {
    cursor:pointer;
  }
  .form-control {
    display: inline;
  }
  button {
    color:var(--dark_2)!important;
  }
  .form-control:disabled {
    background-color: var(--dark_2);
    color: var(--light_2)!important;
    cursor: not-allowed;
  }
  .cent {
    width: 71px!important;
  }
  .thous {
    width: 91px!important;
  }
  .h-thous {
    width:101px!important;
  }
  .telephone {
    width:151px;
  }
  label {
    cursor: pointer;
  }
  /*auto complete*/
    .ui-menu {
      z-index: 10000!important;
      width: 121px;
      max-height: 311px!important;
      margin-bottom: 0px!important;
      overflow-y: scroll!important;
      overflow-x: hidden!important;
    }
    .ui-menu:hover {
      overflow-x: hidden!important;
      overflow-y: scroll!important;
    }
    .ui-widget-content {
      overflow-y: scroll!important;
      overflow-x: hidden!important;
    }
    .ui-menu .ui-menu-item {
        text-align: center;
        position: relative;
        cursor: pointer;
        margin-left:-41px;
        width: auto!important;
        list-style: none;
        z-index: 100000;
    }
    .ui-menu-item-wrapper {
      color: #ccc!important;
      background-color: var(--dark_0);
      padding-left: 7px!important;
    }
    .ui-menu-item-wrapper:hover {
      background-color: var(--dark_1)!important;
      color: var(--light_0)!important;
      border:1px solid #fff!important;
    }
    .ui-widget-content {
      overflow: auto!important;
    }
    /*.ui-menu .ui-menu-item:hover {
        background:white!important;
        color:#313131!important;
        }*/

  /*docs*/
    /*tabs*/
      .nav-tabs {
        border-bottom-color: transparent;
        margin-bottom: 0px;
        margin-left: 3px;
      }
      .nav-tabs .nav-item {
        border-top-left-radius: 7px;
        border-top-right-radius: 7px;
        border: 1px solid;
      }
      .nav-tabs .nav-item .nav-link {
        color: var(--light_2);
      }
      .nav-tabs .nav-item .nav-link {
        color: var(--light_1)!important;
      }
      .nav-tabs .nav-item .active,.nav-tabs .nav-item :hover {
        background-image: linear-gradient(0deg, var(--dark_1) 0%, var(--dark_0) 100%);
        color: var(--light_0)!important;
        border-color:var(--light_0);
      }
      .tab-pane-header {
        font-size: 1.1em;
        margin-top: 1.3em;
        margin-bottom: 0.7em;
      }
      .tab-pane-body {
        font-size: 1em;
        margin-bottom: 0px;
      }

    /*docs.php*/ 
      .open_input {
        border-bottom:1px solid #fff!important;
      }
      .open_input:hover {
        border-bottom:1px solid #000!important;
      }
      .text-bold {
        font-weight:bold;
      }
      #choose_infos {
        position: fixed;
        top: 87px;right: 0px;
        width: 301px;
        background-color: #212529;color: #fff;
        padding: 11px;
        border:1px solid #fff;border-radius: 7px;
        z-index: 10000;
        height: auto;
        /*height: 0px;*/
        /*opacity: 0;*/
      }
      #choose_infos .row {
        border-top: 1px solid #fff;
        margin: 11px;
        padding-top: 11px;
      }
      #choose_infos button {
        margin-bottom: 7px;
      }
      #choose_infos #liste li {
        cursor: -webkit-grab; cursor: grab;
      }
      /*pdf*/
        .td_et_pp {
          border: 1px solid #fff;
        }
      .drop-zone {
        border: 1px solid #fff;
      }
      /*docs_scripts.js*/
        .drag-over {
          border: 1px solid #000;
        }
 
/*map*/     
  /*#map { position: absolute; top: 0; bottom: 0; width: 100%;}*/
  #map-container {
      position: relative;
      height: 601px;
      width: 100%;
  }
  #map {
      position: relative;
      height: 100%;
      width: inherit;
  }
  .coordinates {
    width: 201px;
  }
  #coordinates_lng, #coordinates_lat {
      z-index: 100000
  }
  .mapboxgl-popup-content {
      text-align:center;
      background-color: #eee!important;
      color: #333;
      padding: 0px 0px!important;
      border-radius: 7px!important;
      box-shadow: 0.1em 0.1em 0.1em #777!important;
  }
  .mapboxgl-popup-content img {
    height:71px;
  }
  .mapboxgl-popup-content:hover {
      box-shadow: 0.3em 0.3em 0.3em #777!important;
  }
  .mapboxgl-popup-content a {
    display: block;
    padding: 11px 11px!important;
    color: #333!important;
    font-size: 1.1em;
  }
  .mapboxgl-popup-content a:hover {
    color: #000!important;
    /*font-weight:bold;*/
    text-decoration:none;
  }
  .mapboxgl-popup-close-button {display:none;}
    /*search*/
    .mapboxgl-ctrl-geocoder--suggestion:hover {
      color: #000!important;
    }
  .mapboxgl-ctrl {
    /*background-color: #f0f!important;*/
    box-shadow: 2px 2px 2px rgba(0,0,0,0.7)!important;
  }
  .mapboxgl-ctrl:hover {
    /*background-color: #f0f!important;*/
    box-shadow: 4px 4px 4px rgba(0,0,0,0.7)!important;
  }
  /* satelitte */
  #change_view { 
      margin: 0 auto;
      background-color: #fff;
      color: #333;
      font-weight: bold;
      padding: 0.2em;
      border: 2px solid #fff;
      border-radius: 0.3em;
      /*box-shadow: 9px 0px 5px rgba(0,0,0,0.5);*/
      cursor: pointer;
      position: absolute;
      right: 0.3em;
      top: 7.5em;
      /*width:2.5em;*/
      font-size: 1.5em;
      z-index: 1000;
  }
  .change_view-small {
    /*font-size: 1em!important;
    right: 0.9em!important;
    top: 11.2em!important;*/
  }
/*breadcrumb*/
  .breadcrumb {
    background-color:transparent!important;
  }
  .breadcrumb-item + .breadcrumb-item::before {
    content: ">";
  }
  .breadcrumb-img img {
    /*width:31px;*/
  }
/*tables*/
  .hidden_absolute {
    visibility:hidden;position:absolute;
  }
  table.dataTable th {
    font-weight: normal!important;
  }
  table.dataTable tbody td {
      vertical-align:middle;
    }
  table.dataTable tbody td a {
      padding: 3px;
    }
  table.dataTable tbody td img {
      width:21px;
      margin-right: 7px;
    }
  .td-fav-att{
    width:101px!important;
  }
  .td-maj {
    width:11px!important;
  }
/*img icon*/
  .img_frns_clts {
    width: 100%;
    margin-right: 7px;
  }
  td >.row>div>.img_frns_clts,td >a>.img_frns_clts,.breadcrumb-item>.img_frns_clts, .icon_small-11, .icon_small-11 img  {
    width: 31px!important;
    margin-right: 0.7em;
    /*padding-bottom: 0.7em;*/
  }
  .icon_small-21 img,.icon_small-21  {
    max-width: 21px!important;
    margin-right: 0.7em;
    /*padding-bottom: 0.7em;*/
  }
  .icon_small-31 img,.icon_small-31  {
    max-width: 31px!important;
    margin-right: 0.7em;
    /*padding-bottom: 0.7em;*/
  }
  .icon_small-71 img ,.icon_small-71 i {
    font-size: 1.3em;
    max-width: 71px!important;
    /*padding-bottom: 0.7em;*/
  }
  .breadcrumb span img, .breadcrumb img {
    max-height:21px!important;
    width: auto;
    /*padding-bottom: 0.7em;*/
  }
  td >.row>div {
    vertical-align:bottom;
  }
  .vignette img {
    width: 91%;
  }
  .vignette .img_frns_clts {
    vertical-align: middle;
  }
/*wave*/
  .wave_center {
    height: 50vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .wave {
    width: 5px;
    height: 100px;
    background: linear-gradient(45deg, cyan, #fff);
    margin:0px 10px 10px 10px;
    animation: wave 1s linear infinite;
    border-radius: 20px;
  }
  .wave:nth-child(2) {
    animation-delay: 0.1s;
  }
  .wave:nth-child(3) {
    animation-delay: 0.2s;
  }
  .wave:nth-child(4) {
    animation-delay: 0.3s;
  }
  .wave:nth-child(5) {
    animation-delay: 0.4s;
  }
  .wave:nth-child(6) {
    animation-delay: 0.5s;
  }
  .wave:nth-child(7) {
    animation-delay: 0.6s;
  }
  .wave:nth-child(8) {
    animation-delay: 0.7s;
  }
  .wave:nth-child(9) {
    animation-delay: 0.8s;
  }
  .wave:nth-child(10) {
    animation-delay: 0.9s;
  }

  @keyframes wave {
    0% {
      transform: scale(0);
    }
    50% {
      transform: scale(1);
    }
    100% {
      transform: scale(0);
    }
  }
/*graphs*/ 
  .graph_h1 {
    height: 301px!important;
  }
  .pane_legends {
    font-size: 0.87em!important;
    display: none;
  }
  .legends {
    display: inline-flex;
    margin-right: 7px;
  }
  .legends_carres {
    float: left;
    width:15px;
    height:15px;
    border:1px solid #fff;
    border-radius: 21px;
    margin-right: 7px;
  }
  .legends_txt {
    padding-bottom:5px;
    /*text-overflow:ellipsis;*/
  }
  canvas {
    background-color: transparent!important;
  }