html {
  /* Make sure the footer stays at the bottom of the page */
  position: relative;
  min-height: 100%;
  overflow-x: hidden;
}

body {
  margin-bottom: 170px; /* Margin bottom by footer height */
  height: 100%;
}

h1, h2, h3, h4, h5 {
  color: #432460;
}

a {
  color: #4f3388;
}

a:hover {
  color: #9e9e9e;
}

.attention-link {
  color: #007bff !important;
}

.attention-link:hover {
  color: #0056b3 !important;
  text-decoration: underline;
}

.text-darkgreen {
  color: #1d8635 !important;
}

.text-darkblue {
  color: #0d6efd !important;
}

.text-darkteal {
  color: #028179 !important;
  /* color: #027981 !important; */
}

.text-darkpurple {
  color: #3c1d58;
}

.visually-hidden {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  padding: 0 !important;
  border: 0 !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden;
}

/*=============================================================================
    Everything on header page
=============================================================================*/

#logoContainer {
  width: 100%;
  background-color: rgba(79,51,136, 1);
}

#logo {
  padding: 16px 20px 16px 5px;
  max-width: 100%;
}

a.skip-main, .keyboard-msg {
  opacity: 0;
  margin-left: auto;
  margin-right: auto;
}

a.skip-main:not(:focus),
.keyboard-msg:not(:focus) {
  opacity: 0;
  font-size: 0;
}

a.skip-main:focus,
.keyboard-msg:focus  {
  opacity: 1;
}

#headerContainer {
  background-color: #3C1D58;
  margin-bottom: 20px;
}

#header {
  font-size: calc(16px + 0.3vw);
  padding: 5px 0px 5px 5px;
}

#header, .footertext {
  color: #FFFFFF;
}

.nav-link, #header a {
  color: rgba(255,255,255,.7) !important;
}

.nav-link:hover, #header a:hover {
  color: rgba(255,255,255,1) !important;
}

.nav-item {
  justify-content: end;
}

.navbar {
  justify-content: flex-start !important;
}

.navbar-toggler {
  color: rgba(255,255,255,1) !important;
}

#main-menu-navlink-top, #skip-menu-navlink-top {
  display: none !important;
}

#main-menu-navlink-collapse, #skip-menu-navlink-collapse {
  display: inline !important;
}

#skip-menu-navlink-collapse a:not(:focus) {
  font-size: 0;
  padding: 0;
}

#skip-menu-navlink-collapse a:focus {
  font-size: 1rem;
  padding: .5rem 1rem;
}

@media (min-width: 992px) {
  #main-menu-navlink-top, #skip-menu-navlink-top {
    display: inline !important;
    font-size: 1.2em !important;
  }
  #main-menu-navlink-collapse, #skip-menu-navlink-collapse {
    display: none !important;
  }
}

.container-fluid {
  height: 100%;
}

/*=============================================================================
    Below header page but still near top
=============================================================================*/

.noscript {
  width: 100%;
  height: 30px;
  line-height: 30px;
  text-align: center;
  background-color: indianred;
  color: white;
  font-weight: bold;
}

#instructions {
  font-size: 1.2rem;
}

#secondary-msg {
  font-size: 2rem;
  line-height: 1.2;
  color: #5b5b5b;
}

#login-greeting-container {
  vertical-align: middle;
}

#printlogo {
  display: none;
}

#printheader {
  display: none;
}

.login-greeting {
  padding: 0px 0px 0px 0px;
}

/* Increasing contrast for text in Bootstrap 4 alerts */

.alert-success {
  color: #0e3c18 !important;
}

.alert-warning {
  color: #5d4501 !important;
}

.alert-info {
  color: #083a42 !important;
}

/* Server-side errors */
.errors {
  color: red;
  background: #FFFFFF;
  width: 100%;
  list-style: inside;
}

.errors ul {
  margin-bottom: 0;
  padding-left: 1em;
  background: #FFFFFF;
}

/*=============================================================================
    Loading Spinner
=============================================================================*/

.loader {
  position: absolute;
  left: calc(50% - 75px);
  top: 40vh;
  z-index: 1;
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #2BBBAD; /* Teal */
  border-radius: 50%;
  width: 150px;
  height: 150px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*=============================================================================
    Forms and buttons
=============================================================================*/

#form_container {
  padding: 0;
}

label {
  font-weight: bold;
}

li > label {
  font-weight: normal;
  margin: 0;
}

select {
  color: #212529 !important;
}

input[type="text"], input[type="number"], input[type="email"],
input[type="checkbox"], input[type="date"], input[type="password"],
input[type="radio"], input[type="range"], input[type="time"],
select, textarea {
  border: 1px solid #045ebe !important;
  /* border: 1px solid #4f3388 !important; */
  /* border: 1px solid #8156cf !important; */
  background-color: #f5f8fc !important;
  /* background-color: #f7f6fa !important; */
}

.form-control {
  color: #000000 !important;
}

input:-internal-autofill-selected  {
    background-color: white !important;
    color: #495057 !important;
}

input::placeholder, .placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #515151 !important;
  opacity: 1 !important; /* Firefox */
}

.input-group-text {
  border: 1px solid #045ebe !important;
  background: #b0d7ff !important;
  color: black;
}

.card {
  border: 1px solid #045ebe !important;
}

.li-label:focus-within {
  box-shadow: 0 0 0 .2rem rgba(0,123,255,.25) !important;
}

.list-group-item-success .li-label:focus-within {
  box-shadow: 0 0 0 .2rem rgba(21,87,36,.25) !important;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #515151 !important;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #515151 !important;
}

.btn-primary,
.btn-primary:active,
.btn.active,
.show > .btn-primary:focus,
.show > .btn-primary:active {
  background-color: #724cb5 !important;
  border: 1px solid #4f3388 !important;
  box-shadow: none;
}

.btn-primary:hover,
input:hover[type=“submit”] .btn-primary,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:focus {
  background-color: #4d288f !important;
}

.btn-paleblue,
.btn-paleblue:active,
.btn.active,
.show > .btn-paleblue:focus,
.show > .btn-paleblue:active {
  background-color: rgba(0, 123, 255, .1);
  background-color: transparent !important;
  border: 1px solid black;
  color: black;
  box-shadow: none;
}

.btn-paleblue:hover,
input:hover[type=“submit”] .btn-paleblue,
.btn-paleblue:not(:disabled):not(.disabled):active,
.btn-paleblue:focus {
  background-color: rgba(0, 123, 255, .3) !important;
  color: black;
}

.btn-bluewhite,
.btn-bluewhitee:active,
.btn.active,
.show > .btn-bluewhite:focus,
.show > .btn-bluewhite:active {
  background-color: rgb(235, 242, 250);
  border: 1px solid black;
  color: black;
  box-shadow: none;
  border-radius: 2.6em;
}

.btn-bluewhite:hover,
input:hover[type=“submit”] .btn-paleblue,
.btn-bluewhite:not(:disabled):not(.disabled):active,
.btn-bluewhite:focus {
  background-color: rgb(255, 255, 255) !important;
  color: black;
}

.dropdown-item.active {
  background-color: #8e75ba;
}

.inline-save {
  background-color: #75cc89;
  border: 1px solid darkgreen !important;
  border-radius: .2rem;
  padding-top: .15rem;
  padding-bottom: .15rem;
  color: #000000 !important;
}

.inline-save:hover {
  background-color: #2bb84b;
}

input:not(.invalid):not(:focus), button:not(:focus), select:not(.invalid):not(:focus) {
  box-shadow: none;
}

.tox-tinymce {
	border: 1px solid #045ebe !important;
}

.tox-edit-area__iframe {
  background-color: #f5f8fc !important;
  border-top: 1px solid #045ebe !important;
}

.tox .tox-statusbar {
  border-top: 1px solid #045ebe !important;
}

.tox .tox-menubar + .tox-toolbar, .tox .tox-menubar + .tox-toolbar-overlord .tox-toolbar__primary {
  border-top: 1px solid #045ebe !important;
}

.ohnohoney {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  height: 0;
  width: 0;
  z-index: -1;
}

/* Client-Side Error styles */

.invalid, input.invalid, select.invalid {
  box-shadow: none !important;
  border: 2px solid firebrick !important;
}

.invalid:focus {
  border: 2px solid #ff5959 !important;
  outline: 0;
  box-shadow: 0 0 0 .2rem #fb7a7a !important;
}

.error {
  display: none;
  color: darkred;
  font-size: 0.9em;
  margin-top: .25rem;
}

.invalid + .error {
  display: block;
}

.datepicker-dropdown {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}
.form-group.required .control-label:after {
    content:" *";
    color: #f52323;
}
.scroll{
    max-height: 200px;
    overflow-y: scroll;
}

/* Select2 custom styling */
.select2 {
  max-width: 100%;
}

.select2-selection--single  {
  border: 1px solid #045ebe !important;
  background-color: #f5f8fc !important;
	width: 100%;
	height: calc(1.5em + .75rem + 2px) !important;
	padding: .375rem .75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.select2-selection__placeholder {
  color: #515151 !important;
  opacity: 1 !important;
}

.select2-selection__arrow {
  height: 36px !important;
  width: 30px !important;
}

.select2-selection__arrow b {
  border-color: #343a40 transparent transparent transparent !important;
}

.select2-dropdown--below {
  border-bottom: 1px solid #045ebe;
  border-right: 1px solid #045ebe;
  border-left: 1px solid #045ebe;
  background-color: #cfdeee;
}

.select2-dropdown--above {
  border-top: 1px solid #045ebe;
  border-right: 1px solid #045ebe;
  border-left: 1px solid #045ebe;
  background-color: #cfdeee;
}

.select2-search__field {
  border: 1px solid #045ebe !important;
}

.select2-results__option, .select2-results__message, .loading-results {
  color: black !important;
}

/*=============================================================================
    Table styles
=============================================================================*/

td {
  border-top: 1px solid #c8ddfa !important;
  border-bottom: none !important;
}

.col-td {
  /* border-top: 1px solid #acccf9 !important; */
  border-bottom: none !important;
  padding: 0.75rem;
}

.row-tr {
  border-top: 1px solid #acccf9 !important;
  border-left: 1px solid #acccf9 !important;
  border-right: 1px solid #acccf9 !important;
  margin-left: 0 !important;
}

.hiddenColumn {
  display: none;
}

.false-table .row-tr:nth-of-type(odd) {
  background-color: #e4f0ff;
}

.row-tr:last-child {
  border-bottom: 1px solid #acccf9 !important;
}

.row-collapse {
  background-color: #cee1fb;
}

.collapse:last-child {
  border-top: none !important;
}

.results_item_table td {
  border-top: 1px solid #c8ddfa !important;
  border-bottom: 1px solid #c8ddfa !important;
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: #d9e8fc;
}

.table-striped tbody tr:last-child, #response_list_table tbody tr:last-child {
  border-bottom: 2px solid #8156cf;
}

.table-striped tbody td {
  border-top: 1px solid #c8ddfa !important;
  border-bottom: none !important;
}

.table-striped tr:hover {
  background-color: #b0ccf2 !important;
  border-top: 1px solid #d9e8fc !important;
}

.table-striped tbody tr:nth-of-type(odd):hover {
  background-color: #b0ccf2 !important;
  border-top: 1px solid #d9e8fc !important;
}

#inline-form-flexbox {
  display: flex;
  flex-wrap: wrap;
}

.table thead th {
  border-bottom: 2px solid #8156cf;
  border-top: 1px solid #8156cf;
}

.invisible {
  display: none;
}

.info-message-row {
  margin-right: 0px;
  margin-left: 0px;
}

/* .actions-column {
  padding-left: 1.5rem !important;
} */

.deletebutton {
  color: indianred;
  font-weight: bold;
  /* border: 2px solid indianred;
  background-color: white; */
}

.deletebutton:hover, .deletebutton:focus {
  background-color: indianred;
}

.deletebutton:hover,
.deletebutton:focus {
  color: white;
}

.viewbutton {
  color: royalblue;
  font-weight: bold;
  /* border: 2px solid royalblue;
  background-color: white; */
}

.viewbutton:hover, .viewbutton:focus {
  background-color: royalblue;
  color: #FFFFFF;
}

.viewbutton:hover,
.viewbutton:focus {
  color: #FFFFFF !important;
}

.viewlink:hover{
  text-decoration: none;
}

.spreadsheet td, .spreadsheet th {
  white-space: nowrap;
  border-left: 1px solid #8fb1df !important;
  border-color: #8fb1df !important;
}

.spreadsheet tr td:last-child, .spreadsheet tr th:last-child {
  border-right: 1px solid #8fb1df !important;
}

.spreadsheet tr:last-child td {
  border-bottom: 1px solid #8fb1df !important;
}

.excelButton, .backButton, .colvisButton {
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: #4f3388;
  margin-bottom: 1rem;
}

.excelButton:hover, .backButton:hover {
  color: #9e9e9e;
  text-decoration: underline;
}

div.dt-buttons .dropdown-toggle::after {
  display: none;
}

@media screen and (max-width: 992px) {
  .colvisButton, .excelButton, .backButton {
    display: block !important;
    width: 100% !important;
    text-align: left;
  }
}

/* Adapted from Adrian Roselli's Responsive Table
https://codepen.io/aardrian/pen/YEKmxP */

.collapsible-table {
  border-collapse: collapse;
}

.collapsible-table caption {
  padding: 0.75rem 0.5em 0.75rem 0.5em;
  color: #6638b9 !important;
  font-weight: bold;
}

.collapsible-table th, td {
  /* padding: 0.25em 0.5em 0.25em 1em; */
  vertical-align: text-top;
  text-align: left;
}

.collapsible-table th {
  vertical-align: bottom;
}

.collapsible-table td::before {
  display: none;
}

#table-inner-wrapper {
  overflow: auto;
}

.collapsible-table .form-inline {
  width: 100%;
}

/* Turn on responsive table mode when screen is smaller than 768px */
@media screen and (max-width: 767.98px), print and (max-width: 5in) {

  #table-container-fluid {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }

  .collapsible-table tbody {
    border-bottom: 2px solid #8156cf;
    width: 100%;
  }

  .collapsible-table th {
    display: none;
  }

  .collapsible-table tr {
    border-top: 1px solid #8156cf;
    border-bottom: 1px solid #8156cf;
  }

  .collapsible-table tr:nth-child(even) {
    background-color: #FFFFFF !important;
  }

  .collapsible-table tr:nth-child(odd) {
    background-color: #d9e8fc !important;
  }

  .collapsible-table td {
    display: grid;
    /* grid-template-columns: 150px auto; */
    border-top: 1px solid #c8ddfa !important;
    border-bottom: none !important;
    /* grid-gap: 1em 0.5em; */
  }

  .collapsible-table td:nth-of-type(6) {
    margin-bottom: 15px;
  }

  .collapsible-table td::before {
    display: inline;
    font-weight: bold;
  }

  .collapsible-table caption {
    caption-side: top !important;
    font-style: normal;
    color: #000000;
    padding: 0.5em 0.75em 0.5em 0.75em;
    font-weight: bold;
    border-bottom: 2px solid #8156cf;
    border-top: 1px solid #8156cf;
  }

  .collapsible-table  td:nth-child(6)::before {
    min-width: 150px;
  }

}

/* End of CSS from Adrian Roselli */

/*=============================================================================
      Login Page / Default Page
=============================================================================*/

/* #loginContainer {
  margin-top: 7%;
} */

#ssn, #dob {
  outline: 0 !important;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) !important;
}

.form-signin {
  width: 100%;
  max-width: 500px;
  padding: 50px;
  background-color:#ebe4f7;
  border-radius: .3rem;
  border: 1px solid rebeccapurple;
}

.form-signin h2 {
  margin-bottom: 1rem !important;
}

.form-signin h1 {
  line-height: 1.4;
}

.form-signin .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
  border: 1px solid #c9b0f5;
}

/* .form-signin input[type="text"] {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
  margin-top: 15px;
  margin-bottom: 15px;
} */

.form-signin input[type="submit"] {
  margin-top: .5rem;
  margin-bottom: 10px;
  display: block;
  width: 100%;
}

#proceed-btn {
  max-width: 350px;
  width: 100%;
}

.form-signin small {
  font-size: 90% !important;
}

/*=============================================================================
      Bottom of pages
=============================================================================*/

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
}

#logout-reminder {
  font-size: 1.3rem;
}

footer .footer-strip {
  padding-top: 1.5rem;
  padding-bottom: 1rem;
  width: 100%;
  min-height: 70px;
  max-height: 170px;
  line-height: 70px;
  background-color: rgba(79,51,136, 1);
}

/*=============================================================================
      Print View
=============================================================================*/

@media print {

  @page {
    margin: 2cm;
    {

    }
    @top-center {
        content: element(pageHeader);
    }

    @bottom-center {
        content: element(pageFooter);
    }
}

  body {
  -webkit-print-color-adjust: exact !important;
  }

  #logout {
    display: none;
  }

  #topNavBar {
    display: none;
  }

  #logo {
    display: none;
  }

  #printlogo {
    display: block !important;
  }

  #printheader {
    display: block !important;
  }

  #headerContainer {
    display: none;
  }

  #staff_header {
    display: none;
  }

  h1 {
    max-width: 600px;
  }

  .back-link {
    display: none;
  }

  button {
    display: none;
  }

  .btn {
    display: none;
  }

  .footer, footer, #footer {
    display: none;
  }

}