@font-face {
    font-family: "Poppins";
    src: url("https://saliferayadb2cwe01.blob.core.windows.net/liferayadb2c/fonts/wof/VisitQatar-Medium.woff2") format("woff2");
    font-weight: "bold";
    font-style: normal;
    font-display: swap;
}


:root {
    --font-family-graphik: Poppins;
    --font-family-qatar: Poppins;
    --font-size-normal: 14px;
    --color-greenwhite: #eeeee5;
    --color-claret: #8a1538;
    --color-mineshaft: #252525;
    --color-torchred: #ff004c;
    --color-silver: #bfbfbf;
    --color-white: #fff;
    --color-toreabay: #2e6296;
}

body {
    font-family: var(--font-family-qatar);
    font-size: var(--font-size-normal);
    line-height: 24px;
    margin: 0;
    font-weight: 500;
    /* background: linear-gradient(90deg, #4D9EC3 0%, #134C3C 100%) !important; */
    background: #F5F5F5 !important;
}


.container.unified_container,
.container.self_asserted_container {
    width: 100%;
}

.container.unified_container .entry-item,
.container.self_asserted_container .attrEntry {
    position: relative;
    margin-top: 15px;
}

.container.unified_container .entry-item input,
.container.self_asserted_container .attrEntry input {
    border: 1px solid #313131;
    padding: 5px;
    border-radius: 8px;
    width: 100%;
}

.container.unified_container .entry-item input::placeholder,
.container.self_asserted_container .attrEntry input::placeholder {
    color: var(--color-silver);
}

.container.unified_container .entry-item label,
.container.self_asserted_container .attrEntry label {
    display: inline-block;
    width: 100%;
    color: #313131;
    font-size: 16px;
    font-family: var(--font-family-qatar);
    font-weight: 400;
}

.container.unified_container .entry-item .error p,
.container.self_asserted_container .attrEntry .error p {
    color: var(--color-torchred) !important;
    font-weight: normal;
}

.container.unified_container button,
.container.self_asserted_container button {
    justify-content: center;
    background-color: #8A1538;
    color: #FFFFFF;
    border: 0;

    padding: 3px 15px;
    border-radius: 10px;
}

/* .container.unified_container button::before,
.container.unified_container button::after,
.container.self_asserted_container button::before,
.container.self_asserted_container button::after {
    content: '';
    width: 22px;
    height: 22px;
    background: #d4cc74;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
}

.container.unified_container button::before,
.container.self_asserted_container button::before {
    background: #d4cc74;
    border-bottom: 2px solid #d4cc74;
    border-left: 2px solid #d4cc74;
    left: -10.5px;
} */

.container.unified_container button::after,
.container.self_asserted_container button::after {
    background: #d4cc74;
    border-top: 2px solid #d4cc74;
    border-right: 2px solid #d4cc74;
    right: -10.5px;
}

.container.unified_container .row,
.container.self_asserted_container .row {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 45px 0;
    background: none !important;
}

.container.unified_container .row .panel,
.container.self_asserted_container .row .panel {
    border-radius: 0;
    padding: 30px 40px;
    /* background-color: var(--color-greenwhite); */
    border-radius: 10px;
    ;
}

.container.unified_container .row .col-lg-6 {
    max-width: 575px;
    width: 100%;
}

.container.unified_container .row .panel .panel-body,
.container.self_asserted_container.row .panel .panel-body {
    max-width: 575px;
    width: 100%;
    position: relative;
}

.container.self_asserted_container .row .panel .panel-body .fwc_backlink,
.container.unified_container .row .panel .panel-body .fwc_backlink {
    color: var(--color-claret);
    text-decoration: none;
    top: 54px;
    position: absolute;
}

.container.unified_container .row .panel .panel-body img,
.container.self_asserted_container .row .panel .panel-body img {
    margin-left: auto;
    margin-right: auto;
    display: none;
}


.container.unified_container .row .panel .panel-body #api .heading {
    flex: none;
    width: 100%;
    display: none;
}

.container.unified_container .row .panel .panel-body #api {
    display: flex;
    flex-direction: column-reverse;
}

.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons,
.container.unified_container .row .panel .panel-body #api #localAccountForm {
    flex: none;
    width: 100%;
}

.unified_container .row .panel-default #api .divider {
    display: none;
}

.panel-default{
    background-color: #fff !important;
}

.container.unified_container .row .panel .panel-body #api .intro h2 {
    color: #1f4e60;
    font-weight: 400;
    font-size: 18px;
    font-family: var(--font-family-qatar);
    line-height: 30px;
    margin-bottom: 24px;
    text-align: center;
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .entry-item a[id="forgotPassword"] {
    display: block;

    color: #8A1538
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .entry .buttons {
    text-align: right;
    margin-top: 24px;
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .entry .buttons button {
    margin-left: auto;
    margin-right: auto;
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .create p {
    text-align: center;
}


.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons .intro h2 {
    text-align: center;
}


.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button {
    background-color: var(--color-greenwhite);
    margin-left: auto;
    margin-right: auto;
    border: 2px solid var(--color-toreabay);
    color: var(--color-toreabay);
}

.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button::before {
    background: var(--color-greenwhite);
    border-bottom: 2px solid var(--color-toreabay);
    border-left: 2px solid var(--color-toreabay);
    left: -12.5px;
}

.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button::after {
    background: var(--color-greenwhite);
    border-top: 2px solid var(--color-toreabay);
    border-right: 2px solid var(--color-toreabay);
    right: -12.5px;
}

.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:hover,
.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:active,
.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:focus {
    background-color: var(--color-toreabay);
    color: var(--color-white);
}

.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:hover::before,
.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:hover::after,
.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:focus::before,
.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:focus::after,
.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:active::before,
.container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons button:active::after {
    background: var(--color-toreabay);
}


@media(max-width:767px) {
    .container.unified_container .row .panel .panel-body #api {
        flex: wrap;
        flex-direction: column-reverse;
    }

    .container.unified_container .row .panel .panel-body #api .claims-provider-list-buttons,
    .container.unified_container .row .panel .panel-body #api #localAccountForm {
        width: 100%;
    }

    .container.unified_container .row .panel .panel-body #api #localAccountForm .intro h2 {
        text-align: center;
    }
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul {
    list-style: none;
    padding: 0;
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul li {
    padding: 0;
}

.container.self_asserted_container .row .panel .panel-body #api .attrEntry .helpLink {
    display: none;
}

.container.self_asserted_container .row .col-lg-6 {
    max-width: 575px;
    width: 100%;
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification button {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    margin-top: 20px;
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification .buttons {
    display: flex;
    justify-content: space-between;
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification .buttons button {
    min-width: 180px;
}

.container.self_asserted_container .row .panel .panel-body #api #emailVerificationControl button[aria-hidden="false"] {
    display: block !important;
    margin-bottom: 30px;
    margin-top: 20px;
}

.container.self_asserted_container .row .panel .panel-body .heading h1 {
    font-family: var(--font-family-qatar);
    font-size: 28px;
    font-weight: 900;
    line-height: 40px;
    text-align: center;
    margin-bottom: 0;
    color: #1f4e60;
}

.container.self_asserted_container .row .panel .panel-body #api .intro p {
    font-size: 14px;
    font-weight: normal;
    line-height: 22px;
    margin-bottom: 32px;
    text-align: center;
    color: #1f4e60;
}

.container.self_asserted_container .attrEntry .error[aria-hidden="false"] {
    margin-bottom: 10px;
    margin-top: -10px;
    color: var(--color-torchred) !important;
    font-weight: normal;
}

.container.self_asserted_container .row .panel #api #attributeVerification .ReadOnlyEmail_li .attrEntry .buttons.verify {
    position: relative;
    flex-wrap: wrap;
    margin-bottom: 60px;
}

.container.self_asserted_container .row .panel #api #attributeVerification .ReadOnlyEmail_li .attrEntry .buttons.verify input {
    width: 100%;
}

.container.self_asserted_container .row .panel #api #attributeVerification .ReadOnlyEmail_li .attrEntry .buttons.verify button[aria-hidden="false"] {
    display: block !important;
    min-width: 225px;
}

.container.self_asserted_container .row .panel #api #attributeVerification .ReadOnlyEmail_li .attrEntry .buttons.verify button#ReadOnlyEmail_ver_but_resend[aria-hidden="false"],
.container.self_asserted_container .row .panel #api #attributeVerification .ReadOnlyEmail_li .attrEntry .buttons.verify button#ReadOnlyEmail_ver_but_verify[aria-hidden="false"] {
    margin-bottom: 0px;
}

@media(max-width:767px) {
    .container.self_asserted_container .row .panel .panel-body #api #attributeVerification .buttons {
        display: block;
    }

    .container.self_asserted_container .row .panel .panel-body #api #attributeVerification .buttons button {
        min-width: 225px;
    }

    .container.self_asserted_container .row .panel #api #attributeVerification .ReadOnlyEmail_li .attrEntry .buttons.verify {
        margin-bottom: 30px;
    }

    .container.unified_container .row .panel .panel-body,
    .container.self_asserted_container .row .panel .panel-body {
        padding: 0;
    }

    .container.self_asserted_container .row .panel .panel-body .fwc_backlink,
    .container.unified_container .row .panel .panel-body .fwc_backlink {
        top: 20px;
        left: -20px;
    }

    .container.unified_container .row .panel .panel-body img,
    .container.self_asserted_container .row .panel .panel-body img {
        width: 130px;
    }
}

a:-webkit-any-link:focus-visible {
    outline: none;
}

a:focus-visible,
button:focus-visible {
    outline: none;
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .entry-item a[id="forgotPassword"],
.container.unified_container .row .panel .panel-body #api #localAccountForm .create p a {
    color: #8A1538
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .create p a {
    font-weight: 600;
    text-decoration: underline;
    font-size: 15px;
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .create p {
    margin-top: 10px;
    border: 1px solid #C0C0C0;
    background: #FAF8F4;
    border-radius: 8px;
    padding: 15px;
    font-size: 13px;
    text-align: left;
}

.fwc-forget-password-wrapper {
    margin-top: 5px;
}

span.fwc-eye-btn {
    position: absolute;
    top: 25px;
    right: 15px;
}

span.fwc-eye-btn::after {
    content: '';
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: 15px;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='16' viewBox='0 0 20 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.31056 8.98551C1.10841 8.69651 1 8.35235 1 7.99967C1 7.647 1.10841 7.30284 1.31056 7.01384C2.62139 5.15801 5.84889 1.33301 10.1664 1.33301C14.4839 1.33301 17.7114 5.15801 19.0222 7.01384C19.2244 7.30284 19.3328 7.647 19.3328 7.99967C19.3328 8.35235 19.2244 8.69651 19.0222 8.98551C17.7114 10.8413 14.4839 14.6663 10.1664 14.6663C5.84889 14.6663 2.62139 10.8413 1.31056 8.98551Z' stroke='%23C4C4C4' stroke-miterlimit='10' stroke-linecap='square'%3E%3C/path%3E%3Cpath d='M10.1654 11.3332C12.0063 11.3332 13.4987 9.84079 13.4987 7.99984C13.4987 6.15889 12.0063 4.6665 10.1654 4.6665C8.32442 4.6665 6.83203 6.15889 6.83203 7.99984C6.83203 9.84079 8.32442 11.3332 10.1654 11.3332Z' stroke='%23C4C4C4' stroke-miterlimit='10' stroke-linecap='square'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
}

span.fwc-eye-btn.closed::before {
    /* content: '';
    position: absolute;
    width: 1px;
    height: 20px;
    background-color: var(--color-mineshaft);
    right: 10px;
    transform: rotate(45deg); */
}

#passwordEntryMismatch,
#requiredFieldMissing,
#claimVerificationServerError,
#emailVerificationControl_error_message,
#fieldIncorrect,
#ReadOnlyEmail_fail_retry,
#ReadOnlyEmail_fail_no_retry,
#ReadOnlyEmail_fail_throttled,
.class {
    color: var(--color-torchred) !important;
    font-weight: normal;
}

.container.unified_container .row .panel .panel-body #api #localAccountForm .error.pageLevel p {
    color: var(--color-torchred);
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul li.checkbox .attrEntry {
    position: relative;
    display: inline-block;
    padding: 10px 0;
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul li.checkbox label {
    pointer-events: all;
    position: initial;
    line-height: 18px;
    transform: none;
    padding-left: 45px;
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul li.checkbox label::before {
    content: '';
    position: absolute;
    left: 0;
    display: inline-block;
    background-color: transparent;
    border-radius: 3px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none'%3E%3Cpath d='M19.9933 38.7066C14.0116 33.7744 6.10869 26.2915 1.25615 19.995C6.10892 13.7079 14.0117 6.22547 19.9933 1.29342C26.8047 6.92511 33.0698 13.1867 38.7053 19.995C33.0723 26.8085 26.807 33.0737 19.9933 38.7066Z' stroke='%239BA0A0' stroke-width='2'/%3E%3C/svg%3E");
    background-size: contain;
    height: 40px;
    width: 40px;
    top: 50%;
    transform: translateY(-50%);
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul li.checkbox input:checked+label::before {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M0 19.9946C5.03664 13.2754 13.7313 5.09091 19.9945 0C27.3138 5.98027 34.0158 12.6785 40 19.9946C34.0185 27.3164 27.3163 34.0185 19.9945 40C13.7313 34.9091 5.03664 26.7246 0 19.9946Z' fill='%238A1538'/%3e%3cpath d='M13 20.5L18.5 25.5L27.5 15' stroke='white' stroke-width='4'/%3e%3c/svg%3e ");
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul li.checkbox input {
    position: absolute;
    width: 100%;
    height: 40px;
    margin: 0;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    z-index: 2;
}

.container.self_asserted_container .row .panel .panel-body #api #attributeVerification ul li.checkbox label a {
    position: relative;
    z-index: 3;
}


/* redesign update wraper */
.header-container {
    background-color: white;
    text-align: center;
}