/* DATATABLES */
.dataTables_wrapper .dataTables_processing {
    position: fixed !important;
    top: 50% !important;
    background: transparent !important;
}
/*BROWN*/
.bg-brown{
    background-color: rgb(165, 42, 42) !important;
    opacity: 1;
}
.text-brown{
    color: rgb(165, 42, 42) !important;
    opacity: 1;
}
.border-brown{
    border-color: rgb(165, 42, 42) !important;
    opacity: 1;
}
.badge-brown-lighten {
    --ct-badge-color: rgb(165, 42, 42);
    background-color: #f1f2fe;
}
/*DARKBLUE*/
.bg-darkblue{
    background-color: rgb(0, 102, 255) !important;
    opacity: 1;
}
.text-darkblue{
    --ct-bg-opacity: 1;
    color: rgb(0, 102, 255) !important;
}
.border-darkblue{
    --ct-bg-opacity: 1;
    border-color: rgb(0, 102, 255) !important;
}
.badge-darkblue-lighten {
    --ct-badge-color: rgb(0, 102, 255);
    background-color: #f1f2fe;
}
/*DARKSUCCESS*/
.bg-darksuccess{
    background-color: rgb(0, 102, 0) !important;
    opacity: 1;
}
.text-darksuccess{
    --ct-bg-opacity: 1;
    color: rgb(0, 102, 0) !important;
}
.border-darksuccess{
    --ct-bg-opacity: 1;
    border-color: rgb(0, 102, 0) !important;
}
.badge-darksuccess-lighten {
    --ct-badge-color: rgb(0, 102, 0);
    background-color: #f1f2fe;
}
/*PURPLE*/
.bg-purple{
    background-color: rgb(128, 0, 128) !important;
    opacity: 1;
}
.text-purple{
    --ct-bg-opacity: 1;
    color: rgb(128, 0, 128) !important;
}
.border-purple{
    --ct-bg-opacity: 1;
    border-color: rgb(128, 0, 128) !important;
}
.badge-purple-lighten {
    --ct-badge-color: rgb(128, 0, 128);
    background-color: #f1f2fe;
}
/*DIAGRAM*/
.bg-diagram{
    background-color: rgb(21, 40, 75) !important;
    opacity: 1;
}
.text-diagram{
    --ct-bg-opacity: 1;
    color: rgb(21, 40, 75) !important;
}
.border-diagram{
    --ct-bg-opacity: 1;
    border-color: rgb(21, 40, 75) !important;
}
.badge-diagram-lighten {
    --ct-badge-color: rgb(21, 40, 75);
    background-color: #f1f2fe;
}

/* BACKGROUND DIAGRAM */

.bg-dia-blue{
    --ct-bg-opacity: 1;
    background-color: var(--ct-menu-bg);
}

/* BACKGROUND NETSENS */

.bg-ns-menu{
    --ct-bg-opacity: 1;
    background-color: #15284B !important;
}
.bg-ns-street{
    --ct-bg-opacity: 1;
    color: #323a47 !important;
}
.bg-ns-wall{
    --ct-bg-opacity: 1;
    color: #8391a2 !important;
}
.bg-ns-cloud{
    --ct-bg-opacity: 1;
    color: #b5b5b5 !important;
}
.bg-ns-dark{
    --ct-bg-opacity: 1;
    color: #0a0a0a !important;
}
.bg-ns-sea{
    --ct-bg-opacity: 1;
    color: #6577ec !important;
}
.bg-ns-sky{
    --ct-bg-opacity: 1;
    color: #06aff2 !important;
}
.bg-ns-pink{
    --ct-bg-opacity: 1;
    color: #fa5c7c !important;
}
.bg-ns-red{
    --ct-bg-opacity: 1;
    color: #ff5533 !important;
}
.bg-ns-olive{
    --ct-bg-opacity: 1;
    color: #09aa7c !important;
}
.bg-ns-field{
    --ct-bg-opacity: 1;
    color: #34a430 !important;
}

/* ELEMENTS */

.modal-auto {
  max-width: 180px;
  margin: auto;
}
.bg-options{
    background: var(--ct-menu-bg);
    color: var(--ct-menu-item-active-color);
    border: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color)!important;
    font-family: var(--ct-font-bold);
}
.help_button{
    position: fixed;
    bottom: 0px;
    right: 30px;
    z-index: 10;
    align-items: center;
    justify-content: center;
}
.scroll_button {
  position: fixed;
  top: 0px;
  right: 30px;
  z-index: 9999;
  cursor: pointer;
  display: none; /* nascosto di default */
  opacity: 0.8;
}

.table-sm th,
.table-sm td {
  padding: 0.3rem;
}

.table-xs th,
.table-xs td {
  padding: 0.1rem;
}

@media screen and (min-width: 768px) {
    .grid-item {
        width: 20%;
    }
    .grid-item-2 {
        width: 45%;
    }
    .modal-auto {
        max-width: 300px;
    }
}

/*@media (max-width: 575.98px) {
    .dropdown-menu .dropdown-menu-end {
        position: relative!important;
        left: -80px!important;
        right: auto!important;
    }
}*/
/*@media screen and (min-width: 375px) {
    .grid-item {
        width: 100%;
    }
}*/
/*@media screen and (min-width: 200px) {
   5 columns for larger screens 
  .grid-sizer { width: 100%; }
}*/