html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

#applicationForm div .is-invalid, #c-1-home-div.is-invalid, #c-2-home-div.is-invalid, #c-3-home-div.is-invalid, #c-4-home-div.is-invalid, #c-20-home-div.is-invalid {
  border: 1px solid #dc3545;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/></svg>");
  background-repeat: no-repeat;
  background-position: right calc(.375em + .1875rem) center;
  background-size: calc(.75em + .375rem) calc(.75em + .375rem);
  border-radius: .25rem;
}

.ui-autocomplete {
  z-index:99999999 !important;
}

/*Table*/

table th {
  border: 2px solid black;
  border-collapse: collapse;
  text-align: center;
  vertical-align: middle;
  background-color: lightgray !important;
}

td {
  border: 1px solid grey;
  font-size: smaller;
  vertical-align: middle;
}

.wi-data tr:nth-child(even) td {
  background-color: #f1f3f5;
}

/* Nav bar */

.navbar-collapse ul li a:hover, a[class=navbar-brand]:hover {
  background-color: #dfdedc;
}

/* Collapsible area*/

.text-toggle[aria-expanded=false] .text-expanded {
  display: none;
}

.text-toggle[aria-expanded=true] .text-collapsed {
  display: none;
}

/* Modal window for confirmation number */

.modal-confirmation-number
{
  max-width: 600px;
}

/* Overlay loader */

#overlay {
    position: fixed;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.03); /* Semi-transparent background */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3000; /* Ensure it is above other content */
}

.loader {
    width: 66px;
    height: 66px;
    display: grid;
    border-radius: 50%;
    -webkit-mask: radial-gradient(farthest-side,#0000 40%,#000 41%);
    background: linear-gradient(0deg,#766DF480 50%,#766DF4FF 0) center/4px 100%, linear-gradient(90deg,#766DF440 50%,#766DF4BF 0) center/100% 4px;
    background-repeat: no-repeat;
    animation: s3 1.5s infinite steps(12);
}

    .loader::before,
    .loader::after {
        content: "";
        grid-area: 1/1;
        border-radius: 50%;
        background: inherit;
        opacity: 0.915;
        transform: rotate(30deg);
    }

    .loader::after {
        opacity: 0.83;
        transform: rotate(60deg);
    }

@keyframes s3 {
    100% {
        transform: rotate(1turn)
    }
}