@media only screen and (max-width: 999px) {

    html {
        font-size: 16px;
    }    

    .panel-title {
        display: none !important;
    }

}

@media only screen and (min-width: 1000px) {

    html {
        font-size: 16px;
    }
    
}

.stats .card {
    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #000000), var(--tw-ring-shadow, 0 0 #000000), var(--tw-shadow);
}

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

main {
    min-height: 75vh;
}

.link-username, .link-logout {
    font-size: 20px;
    text-decoration: none !important;
}

h1 {
    font-size: 28px;
}

h2 {
    font-size: 24px;
}

h3 {
    font-size: 20px;
}

footer h3 {
    font-size: 18px;
}

h4, .accordion-button {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #000 !important;
}

    .accordion-button:not(.collapsed) {
        color: #000;
        background-color: #e9ecef !important;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
    }

.logo {
    width: 100%;
}

.icon-page {
    width: 156px;
}

.header-custom, .footer-custom {
    background-color: #178aa3;
}

header .nav-link {
    font-size: 20px;
}

footer .fab {
    font-size: 28px;
}

.icon {
    font-size: 48px;
    color: #00982d;
}

.feature-title {
    font-size: 36px;
    line-height: 38px;
    margin: 0px 0px;
}

.feature-subtitle {
    font-size: 16px;
    margin: 0px 0px;
}

.field-validation-error, label.error {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    display: block;
    color: #ff0000;
    margin: 5px;
}

    .field-validation-error a {
        font-weight: bold;
        color: #ff0000;
        text-decoration: none;
    }

        .field-validation-error a:hover {
            text-decoration: underline;
        }

.field-validation-valid {
    display: none;
}

.input-validation-error, input.error, select.error {
    border: 1px solid #ff0000 !important;
    border-radius: 5px;
}

.webgrid a {
    color: #000 !important;
    text-decoration: none;
}

    .webgrid a:hover {
        color: #17a460 !important;
    }

.field-validation-error, label.error {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    display: block;
    color: #ff0000;
    margin: 5px;
}

    .field-validation-error a {
        font-weight: bold;
        color: #ff0000;
        text-decoration: none;
    }

        .field-validation-error a:hover {
            text-decoration: underline;
        }

.field-validation-valid {
    display: none;
}

.input-validation-error, input.error, select.error {
    border: 1px solid #ff0000 !important;
}

.required > label:after {
    content: "*";
    color: red;
}

.disabled {
    background-color: #e9ecef !important;
}

    .disabled:focus {
        background-color: #e9ecef !important;
        outline: none;
    }

div[class^="col"] {
    padding-bottom: 10px;
}

.btn-primary {
    background-color: #17a460 !important;
    border-color: #17a460 !important;
    --mdb-btn-box-shadow: 0 4px 9px -4px #17a460 !important;
    box-shadow: 0 4px 9px -4px #17a460 !important;
}

    .btn-primary:disabled {
        background-color: #17a460 !important;
    }

    .btn-primary:hover {
        background-color: #00521b;
    }

.bg-primary {
    background-color: #17a460 !important;
}

.btn-outline-primary {
    color: #17a460;
    border-color: #17a460;
}

a.password-forgot {
    color: #17a460 !important;
}

.nav-link:hover, .nav-link:focus {
    color: #fff !important;
    background-color: #17a460 !important;
}

.sidebar-menu li.dropdown.open > a:hover {
    color: #fff !important;
}

.page-item.active .page-link {
    color: #fff;
    background-color: #17a460 !important;
    border-color: #17a460 !important;
}

@media only screen and (max-width: 999px) {

    .container-custom {
        width: 100%;
    }

    .support-button {
        position: fixed;
        bottom: 30px;
        right: 30px;
        width: 100px;
        height: 100px;
        background-image: url(../images/precisa-de-ajuda.png);
        background-size: cover;
    }

}

@media only screen and (min-width: 1000px) {

    .container-custom {
        width: 1200px;
    }

    .support-button {
        position: fixed;
        bottom: 30px;
        right: 30px;
        width: 140px;
        height: 140px;
        background-image: url(../images/precisa-de-ajuda.png);
        background-size: cover;
    }
}