:root {
    --gray-50: #F5F5F5;
    --red-light-1: #f1e1e1;
    --green-light-1: #eaf9ea;
    --green-gray-50: #f5f5f5;
    --green-gray-200: #dfe9df;
    --mud-appbar-height: 99px !important;
    --app-success-failure-feedback-component: 150px;
    --app-mud-default-borderradius: 24px !important;
}

html, body {
    height: 100% !important;
    margin: 0px !important;
}

body {
    font-size: 62.5%;
}


.active-link-class {
    background-color: red;
}

.mud-appbar {
    background-color: #2A2A2A45 !important;
}


.mud-main-content {
    height: 100vh !important;
    padding-top: 0px !important;
}

.mud-button-no-hyperlink:hover {
    text-decoration: none;
    color: inherit;
}

.no-link {
    text-decoration: none !important;
    color: inherit !important;
}

.validation-message {
    color: red !important;
    padding-top: 5px !important;
    font-size: 0.75rem !important;
}

.en-page-container {
    margin-top: var(--mud-appbar-height) !important;
}

.gap-1 {
    gap: 4px !important;
}

.gap-2 {
    gap: 8px !important;
}

.gap-3 {
    gap: 12px !important;
}

.gap-4 {
    gap: 16px !important;
}

.gap-5 {
    gap: 20px !important;
}

.app-link {
    font-family: var(--ff-600);
    font-size: 1rem;
    color: #2A2A2A;
    text-decoration: underline;
}
.validation-message {
    font-family: var(--ff-500);
    font-size: 0.875rem;
    color: red;
}

.app-mis-image{
    border-radius: 16px;
    width:100%;
    height: auto;
}

.app-mis-header{
    font-size: 2.25rem !important;
}

.app-mis-content {
    font-size: 1.125rem !important;
    color: #757575;
    font-family: var(--ff-500) !important;
}

@media (max-width: 960px) {
    :root {
        --mud-appbar-height: 60px !important;
        --app-success-failure-feedback-component: 92px;
        --app-mud-default-borderradius: 12px !important;
    }

    .app-nav-menu {
        color: #1E1E1E !important;
        font-family: var(--ff-500) !important;
        font-size: 0.75rem !important;
    }
    .app-link {
        font-size: 0.75rem;
    }
    .validation-message {
        font-size: 0.75rem !important;
    }

    .app-mis-header {
        font-size: 1.5rem !important;
    }

    .app-mis-content {
        font-size: 0.75rem !important;
    }
}

@media (min-width: 961px) {

    .gap-md-12 {
        gap: 48px !important;
    }
}