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%;
}

footer {
    margin-bottom: 20px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}


.filter-red {
    filter: brightness(0) invert(15%) sepia(69%) saturate(7495%) hue-rotate(357deg) brightness(89%) contrast(130%);
}

.filter-orange {
    filter: brightness(0) invert(50%) sepia(91%) saturate(1660%) hue-rotate(359deg) brightness(100%) contrast(107%);
}

.filter-green {
    filter: brightness(0) invert(30%) sepia(96%) saturate(2028%) hue-rotate(105deg) brightness(94%) contrast(105%);
}

.filter-white {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(357deg) brightness(132%) contrast(100%);
}

h2, h3, h4, .q-head1 {
    color:var(--zd-navy);
    font-weight: 500;
}

h1, .q-text {
    font-weight: 200;
    color: var(--bootstrap-primary)
}

.q-text-dark {
    font-weight: 200;
    color: var(--zd-navy)
}

:root {
    --zd-default-highlight: #c4daff;
    --zd-default-highlight-hover: #a2c4ff;
    --zd-true-view-height: 100vh;
    --zd-border: 1px solid #ccc;
    --bootstrap-primary: #337ab7;
    --zd-box-shadow: 4px 4px 6px 0px rgb(0 0 0 / 15%);
    --zd-tree-width: 226px;
    --zd-default-highlight: #c4daff;
    --zd-navy: #002554;
    --zd-navy-light: #002554c2;
    --zd-white-on-navy: #e5e5e5;
    --zd-header-height: 50px;
}

.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}

footer {
    background-color: var(--zd-navy);
    margin-bottom: unset;
}
.nav-link active {
    color: var(--bs-nav-pills-link-active-color);
    background-color: var(--zd-navy);
}
.nav-link img {
    width:400px;
    height:100px;
}
@media only screen
  and (min-device-width: 100px)
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
    .nav-link img{
        margin-top:20px;
        margin-left:20px;
        width:200px;
        height:50px;
    }
}
@media only screen
and (min-device-width: 568px) {
    .shiftUp{
        margin-top: -34px;
    }
}

/**
    Styles for login page
*/

.login-separator {
    display: flex;
    flex-direction: row;
    height: auto;
    margin-top: 1em;
    margin-bottom: 1em;
}

.login-separator-line {
    margin: auto;
    flex-grow: 4;
}

.login-separator-text {
    text-align: center;
}

.login-separator-line::after {
    content: "";
    width: 100%;
    height: 1px;
    background-color: grey;
    display: block;
}

@media only screen and (min-width: 768px) {
    .login-separator {
        flex-direction: column;
        height: 100%;
        margin-top: unset;
        margin-bottom: unset;
    }

    .login-separator-line::after {
        height: 100%;
        width: 1px;
    }
}

/* hide up/down arrows ("spinners") on input fields marked type="number" */
.no-spinners {
    -moz-appearance: textfield;
}

    .no-spinners::-webkit-outer-spin-button,
    .no-spinners::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }