:root{
    --web-color: #343A40 ;
    --dark-color: #868e96 ;
    --hover-color: rgba(134, 142, 150, 0.3); 
    --border-color: #CECECE;
}

body{
    overflow-x: hidden;
    overflow-y: scroll;
}

.nav-tabs {
    border-bottom: 1px solid transparent;
}

.nav-tabs .nav-item .nav-link{
    color: var(--web-color);
}

.nav-tabs .nav-item .nav-link.active{
    background-color: var(--web-color);
    color: white;
    border-color: var(--web-color);
}

.tab-content{
    border: 1px solid var(--border-color);
    padding: 20px 20px;
}


.website-alert{
    position: fixed;
    right: 20px;
    bottom: 20px;
}

.navbar{
    z-index: 1400;
    border-bottom: 1px solid white;
    position: fixed;
    top: 0px;
    width: 100%;
}

.sidebar{
    width: 18vw;
    height: 100%;
    background-color: var(--web-color);
    position: fixed;
    top: 0px;
    left: 0px;
    padding: 57px 0px;
    border-right: 3px solid var(--web-color);
}

.sidebar i{
    width: 25px;
}

.sidebar p,
.sidebar a{
    color: white;
    display: block;
    padding: 10px 10px;
}

.sidebar p{border-bottom: 1px solid white;}
.sidebar a{
    padding-left: 40px;
}
.sidebar a:hover{
    padding-left: 40px;
    text-decoration: none;
}

.sidebar .list-group-item{
    background-color: var(--web-color);
    color: white;
    border-radius: 0px;
}

.sidebar .list-group-item.collapsed{
    background-color: var(--web-color);
    color: white;
}

.sidebar .collapse.show .list-group-item{
     background-color: var(--web-color) !important;
     color: white !important;
}

.sidebar .collapse a{
    padding-left: 40px;
}

.page-wrapper{
    z-index: 1400 !important;
    margin-top: 70px;
    margin-left: 19vw;
    width: 80vw;
    margin-bottom: 100px;
}

.dt-button.buttons-print,
.dt-button.buttons-print:hover,
.dt-button.buttons-print:active,
.dt-button.buttons-print::after,
.dt-button.buttons-print::before{
    background-image: none !important;
    background-color: var(--web-color) !important;
    color: white !important;
    border: 1px solid var(--web-color) !important;
}

.dt-button.buttons-csv.buttons-html5,
.dt-button.buttons-csv.buttons-html5:hover,
.dt-button.buttons-csv.buttons-html5:active,
.dt-button.buttons-csv.buttons-html5::after,
.dt-button.buttons-csv.buttons-html5::before{
    background-image: none !important;
    background-color: var(--web-color) !important;
    color: white !important;
    border: 1px solid var(--web-color) !important;
}

.dt-button.buttons-copy.buttons-html5,
.dt-button.buttons-copy.buttons-html5:hover,
.dt-button.buttons-copy.buttons-html5:active,
.dt-button.buttons-copy.buttons-html5::after,
.dt-button.buttons-copy.buttons-html5::before{
    background-image: none !important;
    background-color: var(--web-color) !important;
    color: white !important;
    border: 1px solid var(--web-color) !important;
}




@media print {
  .sidebar{
      display: none;
  }
  nav{
      display: none;
  }
  .controls button{
      display: none;
  }

  table{
      width:100%
  }

  table {
  table-layout: fixed ;
  width: 100% ;
    }
    td {
    width: 20% ;
    }

  .page-wrapper{
    margin-left: 0vw;
    width: 100vw;
}

  body .printable {
    display:block;
  }
}