:root {
  --light-grey: #aaaaaa;
}

#sidebar .nav-item a {
  color: white !important;
  font-size: 16px;
  transition: .2s ease-in-out;
}

#sidebar {
  position: relative;
}

#sidebar .nav-item a:hover,
#sidebar .nav-item a.active {
  background: white !important;
  color: black !important;
  font-size: 17px;
}

span.label,
span.label {
  width: 155px;
  display: inline-block;
  padding: 3px;
  margin: 3px;
  font-weight: 600;
}

span.invoice-client::after {
  content: "";
}

/* #quotation-details table tfoot,
#invoice-details table tfoot {
  border-color: transparent;
}

table {
  border-color: transparent !important;
  ;
}
*/
.table thead th {
  background: #212529 !important;
  color: #ffffff !important;
  border: 1px solid #69727a
}

/* HOME PAGE ACTIONS [QUOTATIONS,INVOICES,QUOTATION] */
#quick-menu #options a {
  font-size: 1.4rem;
  text-align: center;
  text-decoration: none;
  transition: .2s ease-in-out;
}

#quick-menu #options #quotations:hover {
  color: #0d6efd !important;
  ;
  background-color: #fff !important;
  ;
  border: 1px solid #0d6efd !important;
}

#quick-menu #options #approved-quotations:hover {
  background-color: #fff !important;
  color: #8f6d07 !important;
  ;
  border: 1px solid #8f6d07 !important;
}

#quick-menu #options #invoices:hover {
  background-color: #fff !important;
  color: #198754 !important;
  border: 1px solid #198754 !important;
  ;
}

#action-main #options a i {
  font-size: 2.5rem;
}

.slim {
  font-weight: 300;
}

.strong {
  font-weight: bold;
}

#quotation-details #client-info span,
#invoice-details #client-info span {
  display: inline-block;
  width: 77px;
}

#quotation-details #quotation-info span,
#invoice-details #invoice-info span {
  display: inline-block;
  width: 120px;
}

.separator {
  text-align: center;
}

/* FORM ERROR(S) */
.form-error {
  color: red;
  margin-bottom: 3px;
}

.item-tbl-control>a,
.item-tbl-control>button {
  width: 333px;
}



/* table td:nth-child(8) {
  min-width: 140px !important;
} */

/* scroll to top of page */
#back-to-top {
  display: none !important;
  position: fixed;
  bottom: 80px;
  transition: .2s ease-in-out;
  left: 20px;
  height: 100%;
}

.item-tbl-control a:hover,
.item-tbl-control button:hover {
  transition: .2s ease-in-out;
  background-color: #ffffff !important;
  color: #198754;
}

#logo {
  padding-top: 7px;
  width: 30%;
}

/* table tr {
  border-bottom-color: transparent;
} */

/* table th,
table td {
  padding: 10px;
  border-right: 1px solid white !important;
  ;
} */

#content-control>* {
  margin: 0px 1px;
}

#content-control>*:nth-child(1),
#content-control>*:nth-child(2),
#content-control>*:nth-child(3),
#content-control>*:nth-child(4) {
  background-color: #198754 !important;
  color: white;
}

#content-control>*:nth-child(1):hover,
#content-control>*:nth-child(2):hover,
#content-control>*:nth-child(3):hover,
#content-control>*:nth-child(4):hover {
  color: #198754;
  background-color: white !important;
  border: 1px solid #198754;
}

.table {
  min-width: 1030px;
}

table#search-results {
  min-width: 1102px;
}

span.count {
  border-radius: 30px;
  margin: 0px auto;
  position: relative;
  line-height: 55px;
  color: inherit;
  font-weight: bolder;
  font-size: 2rem;
}

#data-table-controls #data-table-length {
  min-width: 160px;
}

.auto-width {
  min-width: auto !important;
}

.dt-layout-row:nth-child(1) select {
  margin-left: 10px;
  margin-right: 5px;
}

#dt-search-0 {
  background-color: #fff;
  border-radius: 6px !important;
  color: #000 !important;
  ;
}

@media (min-width: 1200px) {
  #sidebar {
    height: 1200px;
    overflow: hidden;
    position: fixed;
    /*     border: 1px solid red; */
  }
}

@media (max-width: 1199px) {
  #sidebar>div {
    /*     border: 1px solid red !important; */
    margin-top: 73px;
  }
}

footer {
  position: fixed;
  display: none;
  left: 0;
  bottom: 0;
  width: 100%;
  /* background-color: red; */
  color: white;
  text-align: center;
}

form#login {
  max-width: 500px;
  margin: 20px auto;
}

button#logout {
  background-color: transparent;
  border: none;
  border-top: 1px solid gray;
  width: 100%;
  text-align: left;
  padding: 5px 0px 7px 16px;
  color: white;
  font-weight: bold;
}

button#logout:hover {
  background-color: #a51d2d;
  font-weight: bold;
  color: #fff !important;
  ;
  transition: .3s ease-in-out;
}

button#logout i {
  color: rgb(255, 100, 150);
}

form div#optional span {
  position: relative;
  top: -18px;
  background-color: var(--light-grey) !important;
}

form div#optional {
  border-color: var(--light-grey) !important;
  border-width: 1px !important;
}

#prepared-for,
#prepared-by {
  min-height: 183.6px !important;
}

#login-logo {
  max-width: 260px;
  margin: 10px auto;
}

.classik th, .classik td{
  padding: 5px;
  border: 1px solid black;
  border-width: 2px;
}