﻿/*@import '\theme.scss';*/
/*Table*/
.table {
  max-width: 1000px;
  overflow: scroll;
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  border: 1px solid #ddd; }

@media screen and (flex: 600px) {
  .table {
    max-width: 800px;
    overflow: scroll;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: 1px solid #ddd; } }

.table thead tr th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  font-weight: bold;
  color: black; }

.table th, td {
  text-align: left;
  padding: 16px; }

.table tr:nth-child(even) {
  background-color: ghostwhite; }

.table tbody tr:hover {
  color: black;
  background-color: ghostwhite; }

td button {
  border-radius: 5px;
  padding: 2px 2px 2px 2px;
  margin: 5px 0 5px 0; }

/*filter*/
.filter-div {
  background-color: white;
  border: 1px solid #f75012;
  border-radius: 5px;
  position: relative;
  text-align: center;
  z-index: 999; }

.filterinnerdiv {
  padding: 0; }

#filter-div, #button_div {
  background-color: white;
  /*#c3c3c3*/
  text-align: center; }

.filterinnerdiv input[type=text], .filterinnerdiv input[type=email], .filterinnerdiv input[type=password], .filterinnerdiv input[type=Tel], .filterinnerdiv input[type="date"], .filterinnerdiv select, .filterinnerdiv textarea {
  display: inline-block;
  font-size: 16px;
  min-height: 30px;
  background-color: white;
  padding: 4px;
  align-items: center;
  width: 200px; }

.filterinnerdiv span {
  padding-left: 10px;
  color: black;
  font-weight: bold;
  float: right;
  font-size: 20px; }

.filterinnerdiv span:hover {
  cursor: pointer; }

.filterinnerdiv {
  padding: 15px; }

.filterinnerdiv input, .filterinnerdiv select {
  display: inline-block;
  font-size: 16px;
  min-height: 50px;
  background-color: white;
  color: gray; }

.filterinnerdiv span {
  padding-left: 10px;
  color: black;
  font-weight: bold;
  float: right;
  font-size: 20px; }

.filterinnerdiv span:hover {
  cursor: pointer; }

.filterButton {
  background-color: white;
  border: 1px solid darkgray;
  border-radius: 5px;
  color: #f75012;
  cursor: pointer;
  font-family: "RedHatText", sans-serif;
  font-size: 14px;
  font-weight: bold;
  margin-right: 24px;
  padding: 13px 10px 13px;
  text-align: center; }

.filterButton:hover {
  border: 1px solid #f75012;
  border-radius: 5px;
  cursor: pointer; }

.topButtonSpan #Add_btn {
  background-color: white;
  border: 1px solid darkgray;
  border-radius: 5px;
  color: #f75012;
  cursor: pointer;
  font-family: "RedHatText", sans-serif;
  font-size: 14px;
  font-weight: bold;
  line-height: inherit;
  /*margin-left: 90px;*/
  margin-right: 24px;
  padding: 13px 10px 13px;
  text-align: center;
  width: 90px; }

.topButtonSpan #Add_btn:hover {
  border: 1px solid #f75012;
  border-radius: 5px;
  color: #f75012;
  cursor: pointer; }

.topButtonSpan #Add_btn::after {
  background: none;
  transition: none;
  transform: none; }

.button-div {
  padding: 10px;
  text-align: center; }

#button_div button {
  margin-top: 15px; }

.tableButtons button {
  background-color: white;
  border: 1px solid darkGray;
  border-radius: 5px;
  color: #f75012;
  cursor: pointer;
  font-family: "RedHatText", sans-serif;
  font-size: 14px;
  font-weight: 500 !important;
  line-height: 5px;
  padding: 13px 10px 13px;
  text-align: center;
  width: fit-content; }

.tableButtons button:hover {
  border: 1px solid #f75012;
  border-radius: 5px;
  color: #f75012;
  cursor: pointer; }

.tableButtons button::after {
  background: none;
  transition: none;
  transform: none; }

.collapsible {
  background-color: white;
  /*#f24405 #777*/
  color: #f75012;
  cursor: pointer;
  font-weight: bold;
  padding: 18px;
  width: 200px;
  border: 1px solid darkgray;
  border-radius: 5px;
  text-align: left;
  outline: none;
  font-size: 15px; }

.active, .collapsible:hover {
  /*border: 1px solid #f75012;*/
  /*border-radius: 5px;*/
  cursor: pointer; }

/* was adding an _ after the hamburger X */
/*.active:after {
        content: "\2212";
    }*/
.collapsible:after {
  content: '\002B';
  font-size: x-large;
  font-weight: 600;
  float: right;
  margin-left: 5px; }

.collapsiblecontent {
  max-height: 0;
  overflow: hidden;
  border-radius: 5px;
  transition: max-height 0.2s ease-out;
  background-color: white;
  width: 245px;
  position: absolute; }

.collapsiblecontent .close {
  color: #f75012;
  position: absolute;
  right: 0;
  top: -4px;
  border: none;
  background: transparent;
  font-size: x-large;
  font-weight: 600;
  z-index: 1000; }

.collapsibletitle {
  background-color: #777;
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 300px;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  border-style: outset;
  border-radius: 10px; }

/*.active, .collapsibletitle:hover {
        background-color: white;*/
/*#555*/
/*}*/
.collapsibletitle:after {
  content: '\002B';
  /*color: #c3c3c3;*/
  font-weight: bold;
  float: right;
  margin-left: 5px; }

/* was adding an _ after the hamburger X */
/*.active:after {
        content: "\2212";
    }*/
.collapsibledetails {
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  border: 0;
  border-style: outset;
  border-radius: 10px;
  /*border: 1px solid $mainhighlightcolor;*/
  transition: max-height 0.2s ease-out;
  background-color: white;
  width: 600px;
  position: relative; }

#ListTable {
  font-family: inherit;
  /*"Trebuchet MS", Arial, Helvetica, sans-serif;*/
  border-collapse: collapse;
  width: 100%;
  background-color: white; }

#ListTable td, #ListTable th {
  padding: 8px; }

#ListTable tr:nth-child(odd) {
  background-color: white; }

#ListTable tr:nth-child(even) {
  background-color: ghostwhite; }

#ListTable tr:hover {
  color: black;
  background-color: lightgray; }

#ListTable thead tr {
  background-color: green; }

.dataTable {
  max-width: 1000px;
  overflow: scroll; }

.dataTable thead tr th, .dataTables_scrollFoot {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: lightgray;
  font-weight: bold;
  color: black; }

.dataTables_length label, .dataTables_filter label, .dataTables_info, .dataTables_paginate {
  color: gray; }
