:root {
    font-size: 16px;
    --ui-light-01: #ffffff; /* white */
    --ui-light-02: #f7f7f7;
    --ui-light-03: #a8b4bb;
    --ui-dark-01: #000000; /* black */
    --ui-background: #f1f4f4;
    --interactive-01: #4a585f;
    --interactive-02: #e6eaf2;
    --interactive-03: #7d95c7;
    --interactive-04: #dce1e4;
    --interactive-05: #728b96;
    --interactive-06: #364046;
    --link-01: hsla(220, 40%, 44%, 1); /* #43609b */
    --link-02: hsla(220, 40%, 44%, .90); /* #546ea4 */
    --ui-shadow-01: 0 2px 4px 0 rgba(12, 12, 13, 0.08);
    --ui-shadow-02: 0 4px 8px 0 rgba(12, 12, 13, 0.08);
    --ui-shadow-03: 0 8px 16px -4px rgba(12,12,13,0.09), 0 4px 8px -2px rgba(12,12,13,0.05);
    --support-01: hsla(354, 81%, 49%, 1); /* error, danger */
    --support-01-light: hsla(354, 81%, 49%, .10); /* error, danger */
    --support-02: hsla(88, 100%, 33%, 1);
    --text-on-light-01: hsla(206, 47%, 3%, .8);
    --text-on-light-02: hsla(0, 0%, 43%, 1);
    --text-on-light-03: hsla(204, 7%, 31%, 1);
    --text-on-light-04: hsla(209, 53%, 16%, .8);
    --text-on-light-05: hsla(202, 7%, 31%, 1);
    --label-on-light-01: #3a5465;
    --text-on-dark-01: #ffffff;
    --app-muted-font-color: hsla(204, 7%, 31%, .8);
    --scrim: hsla(0, 0%, 7%, .5);
    --baseline: .25rem; /* 4px */
    --baseline-2: .5rem; /* 8px */
    --baseline-3: .75rem; /* 12px */
    --baseline-4: 1rem; /* 16px */
    --baseline-6: 1.5rem; /* 24px */
    --baseline-8: 2rem; /* 32px */
    --baseline-9: 2.25rem; /* 36px */
    --baseline-11: 2.75rem; /* 44px */
    --baseline-12: 3rem; /* 48px */
    --brand-primary-01: #5978B8;
    --brand-primary-02: #349198;
    --brand-primary-03: #a3ce5e;
    --brand-accent-01: #a3dbe5;
    --brand-accent-02: #9999cb;
    --brand-gray-01: #6d6d6d;
    --brand-gray-02: #5c5c5c;

    /*FMS Colors Vars*/
    --fms-blue: #152EA9;
    --fms-darkblue: #102381;
    --fms-lightblue: #D1D9FF;
    --fms-grey: #8E9091;
    --fms-white: #F7F8F8;
    --fms-green: #09982D;
    --fms-lightgreen: #E4F9E9;
    --fms-red: #C92031;
    --fms-lightred: #FF6A6A;
    --fms-pink: #FFEBEB;
}

/* Global Remedies
******************/

/* Use border-box by default, globally */
*, ::before, ::after {
    box-sizing: border-box;
}

/*
* Consistent line spacing...
* CSS Inline Layout Module Level 3: https://drafts.csswg.org/css-inline-3/#line-sizing-property
*/
html {
    line-sizing: normal;
}

/* Remove the tiny space around the edge of the page - margin: 0; is set in the normalize.css file */
body {
    width: 100%;
    display: table;
}

/* Old Browsers
***************/

/* Remove the border on images inside links in IE 10 and earlier */
img {
    border-style: none;
}

/* Hide the overflow in IE 10 and earlier */
svg {
    overflow: hidden;
}

/* Default block display on HTML5 elements - main is set in the normalize.css file */
article, aside, figcaption, figure, footer, header, hgroup, nav, section {
    display: block;
}

/*
* 1. Add the correct box sizing in IE 10
* 2. Remove the padding in IE 10
*/
[type='checkbox'],
[type='radio'] {
    box-sizing: border-box;
    padding: 0;
}

/* Line Heights
***************/

/*
* The default `normal` line-height is tightly spaced, but takes font-metrics into account.
* Looser spacing may improve readability, but may cause problems in some scripts.
* See: https://github.com/mozdevs/cssremedy/issues/7
*/
html {
    line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 1.25;
}

caption, figcaption, label, legend {
    line-height: 1.375;
}

/* end remedy css */

@font-face {
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Noto Sans'), local('NotoSans-Regular'), url(https://fonts.gstatic.com/s/notosans/v27/o-0IIpQlx3QUlC5A4PNr5TRASf6M7Q.woff2) format('woff2');
    font-display: swap;
}

html,
body {
    font-family: "Noto Sans", sans-serif;
}

.fds-layout-container--auth {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    padding: 0;
}

    .fds-layout-container--auth main {
        margin: 0 auto;
        /* max-width: 380px; */
        padding: 96px 0 0 0;
        /* transition: all 0.25s ease 0s; */
        width: 100%;
    }

fieldset.borderless {
    border: 0;
    padding: 0 0 0 0;
    margin: 0;
    min-width: 0;
}

.logged-out iframe {
    display: none;
    width: 0;
    height: 0;
}

.page-consent .client-logo {
    float: left;
}

    .page-consent .client-logo img {
        width: 80px;
        height: 80px;
    }

.page-consent .consent-buttons {
    margin-top: 25px;
}

.page-consent .consent-form .consent-scopecheck {
    display: inline-block;
    margin-right: 5px;
}

.page-consent .consent-form .consent-description {
    margin-left: 25px;
}

    .page-consent .consent-form .consent-description label {
        font-weight: normal;
    }

.page-consent .consent-form .consent-remember {
    padding-left: 16px;
}

.grants .page-header {
    margin-bottom: 10px;
}

.grants .grant {
    margin-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid lightgray;
}

    .grants .grant img {
        width: 100px;
        height: 100px;
    }

    .grants .grant .clientname {
        font-size: 140%;
        font-weight: bold;
    }

    .grants .grant .granttype {
        font-size: 120%;
        font-weight: bold;
    }

    .grants .grant .created {
        font-size: 120%;
        font-weight: bold;
    }

    .grants .grant .expires {
        font-size: 120%;
        font-weight: bold;
    }

    .grants .grant li {
        list-style-type: none;
        display: inline;
    }

        .grants .grant li:after {
            content: ', ';
        }

        .grants .grant li:last-child:after {
            content: '';
        }

.fds-layout-container--auth .fms-branding {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 240px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 24px;
}

.text-2xl {
    font-size: 1.5rem;
}

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

svg.fms-logo-vertical {
    min-width: 224px;
    max-width: 224px;
    /* padding: var(--baseline-12) var(--baseline-12) var(--baseline-8); */
    margin-left: auto;
    margin-right: auto;
    /* max-height: 120px; */
    display: block;
    text-align: center;
}

.fms-branding #brand-logotype {
    fill: var(--brand-gray-02);
    font-family: 'Lato';
    font-weight: bold;
    font-size: 1.25rem;
    text-align: center;
    fill-opacity: 0;
    animation: 1.4s ease-in-out 2.2s forwards fillOpacity;
}

.fms-logotype {
    fill: var(--brand-gray-02);
    font-family: 'Lato';
    font-weight: bold;
    fill-opacity: 0;
}

.fms-logotype-link {
    fill: var(--brand-gray-02);
    font-family: 'Lato';
    font-weight: bold;
    fill-opacity: 0;
    text-decoration: none;
}

.header-size {
    font-size: var(--baseline-12);
}

a.fms-logotype-link:visited {
    color: var(--brand-gray-02);
}

.logo path:nth-child(n) {
    fill: var(--brand-primary-02);
    filter: drop-shadow(0 2px 4px var(--ui-shadow-01));
}

.logo path:nth-child(1) {
    animation: 1.4s ease-in-out .2s forwards fillOpacity;
    fill-opacity: 0;
}

.logo path:nth-child(2) {
    animation: 1.4s ease-in-out .6s forwards fillOpacity;
    fill-opacity: 0;
}

.logo path:nth-child(3) {
    animation: 1.4s ease-in-out 1s forwards fillOpacity;
    fill-opacity: 0;
}

.logo path:nth-child(4) {
    animation: 1.4s ease-in-out 1.4s forwards fillOpacity;
    fill-opacity: 0;
}

.logo path:nth-child(5) {
    animation: 1.4s ease-in-out 1.8s forwards fillOpacity;
    fill-opacity: 0;
}

@keyframes fillOpacity {
    100% {
        fill-opacity: 1;
    }
}

.fds-layout-container--auth .fds-form-container,
.fds-layout-container--auth .container {
    background: #fff;
    border-radius: 0;
    padding: 24px;
    box-shadow: var(--ui-shadow-01);
    min-width: 28rem;
    margin: 0 auto;
    /* transition: all .2s ease; */
}

.fds-form-container {
    border-bottom: 1px solid var(--ui-light-03);
}

.fds-form-container label {
    display: block;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1rem;
    margin-bottom: var(--baseline-2);
    color: var(--label-on-light-01);
    /* text-transform: uppercase; */
}

.fds-form-container input:last-of-type {
    margin-bottom: var(--baseline-8);
}

.fds-form-container input {
    font-family: "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    display: block;
    font-size: 16px;
    line-height: 1.25;
    margin: 0 0 var(--baseline-4);
    padding: var(--baseline-2) var(--baseline-3);
    border: 1px solid #c7c7c7;
    border-radius: 4px;
    width: 100%;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .1);
}

.fms-btn {
    display: block;
    width: 100%;
    margin: auto;
    padding: .5rem;
    border: none;
    font-family: "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 700;
    font-size: 1rem;
    text-align: center;
    border-radius: 4px;
    line-height: 1.5;
}

/*.fms-btn-primary {
    text-transform: uppercase;
    background-color: #16828a;
    color: white;
    margin-top: 24px;
}*/

.fds-form-container .fms-btn-primary {
    text-transform: uppercase;
    background-color: #16828a;
    color: #fff;
    margin-top: 24px;
}

.fds-form-container input:focus {
    border: 1px solid var(--ui-primary-01, #349198);
    outline: none;
}

.fds-form-container .fms-btn-primary:focus {
    outline: none;
}

.fds-layout-container--auth .external-providers .list-inline {
    margin: var(--baseline-4) 0 0 0;
    padding: var(--baseline-4) 0 0 0;
    /* border-top: 1px solid var(--ui-light-03); */
}

.fds-layout-container--auth  .external-providers .list-inline li {
        margin: 0;
        padding: 0;
    }

.fds-layout-container--auth  .external-providers .list-inline li {
        display: block;
    }

.fds-layout-container--auth  .external-providers .fms-btn-outline {
    background-color: var(--ui-light-01);
    color: #5e5e5e;
    box-shadow: inset 0 0 0 1px #8c8c8c;
}

@media only screen and (min-width: 480px) {
    .fds-layout-container--auth {
        /* max-width: 100%; */
    }

        .fds-layout-container--auth main {
            padding: 64px 0 0 0;
        }

        .fds-layout-container--auth .fds-form-container,
        .fds-layout-container--auth .container {
            border-radius: 4px;
            box-shadow: var(--ui-shadow-03);
            max-width: 24rem;
        }

    .fds-form-container .fms-branding {
        padding-top: 24px;
    }
}

@media only screen and (max-width: 480px) {
    .fds-layout-container--auth .fds-form-container {
        min-width: 0;
    }
}

.navbar-header {
    padding: 1rem 2.25rem 1rem 2.25rem;
}

.fms-content {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    min-height: 300px;
}

.fms-body {
    background-image: url("./../splashPage-D.jpg");
    background-position: center;
    background-size: cover;
    min-height: 100vh;
    min-width: 100%;
    display: flex;
    flex-flow: column;
    align-items: end;
    justify-content: center;
}

.fms-body-row {
    margin: 0;
    padding-right: 75px;
}
.fms-card-title {
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.08px;
    vertical-align: middle;
    margin-bottom: 10px;
}

.fms-card {
    display: flex;
    flex-flow: column;
    align-items: end;
        width: 500px;
        min-height: 400px;
        background-color: #FFF;
    border-radius: 4px;
}

.fms-card-logo {
    padding: 15px;
}

.fms-card-form {
    width: 100%;
    background-color: #FFFFFF;
    margin: 0 auto;
    padding: 20px 20px;
}

.fms-card-form fieldset {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0 0 10px 0;
}

.fms-card-form fieldset,
.fms-card-form input,
.fms-card-form button {
    width: 100%;
}

.fms-card-form input {
    height: 40px;
    border: 0;
    border-bottom: 2px solid #1B33AB;
    border-radius: 0;
}

.fms-card-body {
    display: flex;
    flex-flow: column;
    align-items: center;
    margin: 0;
    padding: 20px;
    gap: 10px;
}

.fms-card-footer {
    line-height: 0;
}

.fms-card-extlogin {
    background-color: #FFFFFF;
    border-radius: 4px;
    margin: 0 auto;
    width: 500px;
    margin-top: 25px;
}

.form-group label {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.035px;
    color: #1B33AB;
}

.form-control {
    height: 48px;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.035px;
    background-color: #F7F8F8;
    border: 1px solid #8E9091;
    vertical-align: middle;
}

.form-control:not(.is-invalid):focus, .form-control:not(.is-valid):focus {
    box-shadow: 0 0 0 3px rgba(100, 169, 255, 0.4);
}

.btn {
    color: white;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.035px;
    vertical-align: middle;
}

.btn-primary {
    background-color: var(--fms-blue);
    border-color: var(--fms-blue);
}

    .btn-primary:hover:not(.dropdown-toggle-split) {
        background-color: var(--fms-darkblue);
        border-color: var(--fms-darkblue);
    }

    .btn-primary.focus:not(.dropdown-toggle-split), .btn-primary:focus:not(.dropdown-toggle-split) {
        color: var(--fms-white);
        border-color: var(--fms-darkblue);
        box-shadow: 0 0 0 3px rgba(100, 169, 255, 0.4);
    }

    .btn-primary:not(:disabled):not(.disabled):active {
        box-shadow: 0 0 0 3px rgba(100, 169, 255, 0.4);
    }

    .btn-primary:not(:disabled):not(.disabled):active:focus {
        box-shadow: 0 0 0 3px rgba(100, 169, 255, 0.4);
    }

    .btn-primary:active {
        background-color: var(--fms-darkblue) !important;
        border-color: var(--fms-darkblue) !important;
    }

    .btn-primary:focus {
        background-color: var(--fms-darkblue) !important;
        border-color: var(--fms-darkblue) !important;
    }

.btn-secondary {
    color: var(--fms-blue);
    background-color: var(--fms-white);
    border-color: var(--fms-blue);
}

    .btn-secondary:hover:not(.dropdown-toggle-split) {
        color: var(--fms-white);
        background-color: var(--fms-darkblue);
        border-color: var(--fms-darkblue);
    }

    .btn-secondary.focus:not(.dropdown-toggle-split), .btn-secondary:focus:not(.dropdown-toggle-split) {
        color: var(--fms-white);
        border-color: var(--fms-darkblue);
        box-shadow: 0 0 0 3px rgba(100, 169, 255, 0.4);
    }

    .btn-secondary:not(:disabled):not(.disabled):active {
        box-shadow: 0 0 0 3px rgba(100, 169, 255, 0.4);
    }

    .btn-secondary:not(:disabled):not(.disabled):active:focus {
        box-shadow: 0 0 0 3px rgba(100, 169, 255, 0.4);
    }

    .btn-secondary:active {
        background-color: var(--fms-darkblue) !important;
        border-color: var(--fms-darkblue) !important;
    }

    .btn-secondary:focus {
        background-color: var(--fms-darkblue) !important;
        border-color: var(--fms-darkblue) !important;
    }

.btn-card {
    height: 36px;
    border-radius: 5px;
}

.alert {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.035px;
    vertical-align: middle;
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border-radius: 0.25rem;
}

.alert-info {
    background-color: #e4f1f9;
    border: 1px solid #152EA9;
    margin-bottom: 0;
}

.alert-danger {
    background-color: #FFEBEB;
    border: 1px solid #FF6A6A;
}

.danger.validation-summary-errors ul {
    display: contents;
    list-style-type: none;
 }

 .screen-reader-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: 0px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}