.acccbg {color:#666666;font-weight: bold;background-color: #f0f1f3};
.my-primary{color: #00396C;}
.my-primary:focus, .my-primary:hover{color: #0056a5;}
.acccfooter, button.btn, button.btn:focus, nav.navbar {background:#1c8287;opacity:1;color:white; font-weight:bold;}
button.btn:hover {background-color: white; color: #07B5C3; border-color: #07B5C3; font-weight:bold;}
button.btn.disabled:hover {color: #000; background-color: #efefef; border-color: #efefef;}

/*a {color:lightslategray;font-weight: bold;}
a:hover {color:lightslategray;}
a:link {color:lightslategray;}
a:nohover {color:lightslategray;}
button.btn {color:white;background-color: lightslategray;border-color:lightslategray;}
button.btn:hover {background-color: white;color: lightslategray;border-color: lightslategray;}*/

a {color:#1c8287;font-weight: bold;}
a:hover {color:#1c8287;}
a:link {color:#1c8287;}
a:nohover {color:#1c8287;}
button.btn {color:white;background-color: #1c8287;border-color:#1c8287;opacity:1}
button.btn:hover {background-color: white;color: lightslategray;border-color: lightslategray;}

/*.tinytext {font-size:9pt;}*/
.stackem div {width: 100%;}
body { padding-top: 55px; padding-bottom: 35px; min-height: 100vh; position: relative; margin: 0;}
footer {position: absolute; bottom: 0;}
 /* bootstrap tooltip change colors */
.tooltip-inner {color: #222;background-color: #ccc;text-align:left;}
 /* bootstrap tooltip change color of arrows (top, etc.) */
.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before, .tooltip.bs-tooltip-top .arrow::before {border-top-color: #ccc;}
.tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before, .tooltip.bs-tooltip-right .arrow::before {border-right-color: #ccc;}
.tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .tooltip.bs-tooltip-bottom .arrow::before {border-bottom-color: #ccc;}
.tooltip.bs-tooltip-auto[x-placement^=left] .arrow::before, .tooltip.bs-tooltip-left .arrow::before {border-left-color: #ccc;}

/* this overrides bootstrap hiding the footer */
.d-none {display: block !important;}

/* styling of data tables <table> */
table.dataTable {
  font-size:11pt;
}
#partTable {
  font-size: 10pt;
}
#historyTable {
    font-size: 10pt;
}
table.dataTable td {font-weight: normal; font-size:11pt;}
table.dataTable td.dtbold {font-weight: bold; font-size:12pt;}
table#historyTable td {font-weight: normal; font-size:10pt;}
.dataTables_info {font-size: 9pt;}
.paginate_button {font-size: 10pt;}
.buttons-edit {font-size: 11pt;}

/* modal error message */
div.DTE div.DTE_Form_Error {
    color: #b11f1f;
    font-size: 11pt;
    padding-right: 20px;
}
/* color of selected drop down item */
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: lightslategray;
}

/* sizing for data entry modals
  #meetEdit.container {width:800px;}
  .modal-dialog {width:900px;}
*/

.modal-header {background-color:#522a7f;color:white;}
.modal-header .close {
    color:white; /* make x white for closing model */
    opacity:0.5;
  }
.modal-body {font-size:11pt;color:#666666}
.DTE_Body.modal-body {font-size:10pt;color:#666666;}
div.DTE_Form_Buttons button {
    background-color: #1c8287;
    color: white;
    margin-right: 10px;
  }
  modal-header .close:focus, .close:hover {
    color: #fff;
    opacity:0.8;
  }

/* size modals */
@media screen and (max-width: 999px)  {
  .modal-dialog {width:95%;}
  .modal-content {width:95%;}
}
@media screen and (min-width: 1000px)  {
  .modal-dialog {width:800px;position:relative;left:-60px;}
  .modal-content {width:800px;position:relative;left:-60px;}
}
.modal1300 {width:1200px;position:relative;left:-175px;}


@media screen and (max-width: 500px) {
    .adjustlogo {width:200px;}
    .tinytext {font-size:7pt;}
    .daisy {width:260px;}
}
@media screen and (min-width: 501px) {
    .adjustlogo {width:300px;}
    .tinytext {font-size:9pt;}
    .daisy {width:340px;}
}


/* CSS based busy signal */
.busytext {
  text-align: center;
  padding-top:10px;
  color:white;
}

.busytextcard {
  text-align: center;
  padding-top:20px;
  color:black;
}

.busy-css {
  position: relative;
  display: block;
  text-align:center;
  width:60px;
  margin-left:auto;
  margin-right:auto;
}

.busy-css span {
  position: absolute;
  display: inline-block;
  bottom: 0px;
  left: 0px;
  width: 9px;
  height: 5px;
  background: #fff;
  -webkit-animation: busy 1.5s infinite ease-in-out;
  -moz-animation: busy 1.5s infinite ease-in-out;
  animation: busy 1.5s infinite ease-in-out;
}

.busy-css span:nth-child(2) {
  left: 11px;
  animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
}

.busy-css span:nth-child(3) {
  left: 22px;
  animation-delay: 0.4;
  -webkit-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
}

.busy-css span:nth-child(4) {
  left: 33px;
  animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
  -moz-animation-delay: 0.6s;
}

.busy-css span:nth-child(5) {
  left: 44px;
  animation-delay: 0.6s;
  -webkit-animation-delay: 0.8s;
  -moz-animation-delay: 0.8s;
}

@-moz-keyframes busy {
  0% {height: 5px; transform: translateY(0px); background: #7498c0;}
  25% {height: 20px; transform: translateY(10px); background: #23408f;}
  50% {height: 5px; transform: translateY(0px); background: #7498c0;}
  100% {height: 5px; transform: translateY(0px); background: #7498c0;}
}

@-webkit-keyframes busy {
  0% {height: 5px; transform: translateY(0px); background: #7498c0;}
  25% {height: 20px; transform: translateY(10px); background: #23408f;}
  50% {height: 5px; transform: translateY(0px); background: #7498c0;}
  100% {height: 5px; transform: translateY(0px); background: #7498c0;}
}

@keyframes busy {
  0% {height: 5px; transform: translateY(0px); background: #7498c0;}
  25% {height: 20px; transform: translateY(10px); background: #23408f;}
  50% {height: 5px; transform: translateY(0px); background: #7498c0;}
  100% {height: 5px; transform: translateY(0px); background: #7498c0;}
}

 /* override bootstrap button styles */
.btn-secondary {
  color: #000;
  background-color: #efefef;
  border-color: #efefef;
  font-size: 9pt;
}
.btn-secondary:hover {
  color: #000;
  background-color: #aaa;
  border-color: #919191;
}
.btn-secondary:focus, .btn-secondary.focus {
  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}
.btn-secondary.disabled, .btn-secondary:disabled {
  color: #000;
  background-color: #efefef;
  border-color: #efefef;
}
.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle {
  color: #000;
  background-color: #919191;
  border-color: #919191;
}
.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}

.page-item.active .page-link {
    background-color: lightslategray;
    border-color: lightslategray;
}

.page-item .page-link {
    color: #666666;
}

/* this styles the tiny plus sign or minus sign that appears when a table is set to remove columns as the device gets smaller, the default color is a light blue */
table.dataTable.dtr-inline.collapsed tbody tr[role="row"] td:first-child::before, table.dataTable.dtr-inline.collapsed tbody tr[role="row"] th:first-child::before {
    background-color: lightslategray;
}

/* this styles the background color of the selected data tables row */
table.dataTable tbody tr.selected,  {
    background-color: #f2f2f2 !important;
    color: #666666 !important;
}
table#userTable tbody tr.selected, table#trainTable tbody tr.selected, table#meetTable tbody tr.selected, table#partTable tbody tr.selected, table#agencyTable tbody tr.selected  {
    background-color: lightslategray !important;
    color: white !important;
}

table.dataTable tbody>tr.selected,table.dataTable tbody>tr>.selected {
 background-color:#f2f2f2 !important;
 color: #666666 !important;
}
table#userTable tbody>tr.selected,table#dataTable tbody>tr>.selected {
    background-color: lightslategray !important;
    color: white !important;
}