.Box {
margin: auto; display: block;
}

.tablet .Box {
width: 100%; margin: auto; display: block;
}

.phone .Box {
width: 100%; margin: auto; display: block;
}

.ut_header_container{
    display: flex;
    flex-direction: column;
    gap: var(--gap-gap-3xl, 32px);
}

.ut_forgetpassword_container{
    display: flex !important;
    width: 512px !important;
    padding: var(--padding-padding-4xl, 32px) !important;
    flex-direction: column;
    align-items: center;
    gap: var(--gap-gap-3xl, 32px);
    border-radius: var(--radius-md, 16px);
    background: var(--surface-surface, #FFF);
    margin: auto !important;
}

.ut_forgetpassword_header{
    align-self: stretch;
    color: var(--surface-on-surface, #000);
    text-align: center;
    /* H3/Regular */
    font-size: var(--font-size-h3, 32px);
    line-height: var(--line-height-h3, 40px); /* 125% */
    letter-spacing: -0.16px;
}

.ut_forgetpassword_subHeader{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: var(--surface-on-surface-variant, #4C4544);
    font-size: var(--font-size-body, 14px);
    line-height: var(--line-height-body, 20px);
}

.ut_forgetpassword_subHeader_container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: var(--surface-on-surface-variant, #000);
    line-height: var(--line-height-body, 20px);
}

.ut_subheader_content{
    display: inline-block;
    text-align: start;
    font-size: var(--font-size-body, 14px);
}

.ut_inputs_container{
    display: flex;
    flex-direction: column;
    gap: var(--gap-gap-xxl, 24px);
    align-self: stretch;
}
.ut_input{
    display: flex;
    padding: var(--padding-padding-sm, 8px) var(--padding-padding-lg, 16px);
    align-items: center;
    align-self: stretch;
    border-radius: var(--radius-xs, 8px);
    font-size: 16px !important;
    height: 56px !important;
}

.ut_username_container{
    display: flex;
    flex-direction: column;
    gap: var(--gap-gap-sm, 8px);
    align-self: stretch;
}

.ut_sendPassword{
    display: flex;
    padding: var(--padding-padding-lg, 16px) var(--padding-padding-3xl, 28px);
    justify-content: center;
    align-items: center;
    gap: var(--gap-gap-sm, 8px);
    align-self: stretch;
    border-radius: var(--radius-pill, 999px);
    background: var(--primary-primary, #C0392B);
    border: none;
    color: var(--surface-on-surface, #FFF);
    height: 56px;
    margin: 0 !important;
    line-height: var(--line-height-h6, 24px); 
}

.ut_hidden{
    display: none !important;
}

.ValidationMessage{
    text-align: start;
}

.ut_success_error_container{
    display: flex;
    justify-content: center;
}

.UT_Footer_Container {
    display: none;
}

html{
    background: var(--background-color) !important;
}

.UT_dda_footer span div .primary--text{
    display: none;
}

.err_msg_ctn{
    display: flex;
}

.ut-SubTitle {
    margin: 0;
}

.OSAutoMarginTop {
    margin: 0 !important;
}

.ThemeGrid_Container .clearfix > div:nth-child(4) {
    margin: 0 !important;
}

.ValidationMessage{
    display: none;
}

input[type="text"].Not_Valid, input[type="email"].Not_Valid
{
    border: 1px solid #ccc;
}

input[type="email"].Not_Valid:focus{
    border: 1px solid #ccc;
}
/*================= For small screens ============*/
@media (max-width: 512px) {
    .ut_forgetpassword_container{
        width: auto !important;
    }


    .ut_sendPassword{
        display: flex;
        justify-content: center;
        padding: 0;
        align-items: center;
        gap: var(--gap-gap-sm, 8px);
        align-self: stretch;
        border-radius: var(--radius-pill, 999px);
        background: var(--primary-primary, #C0392B);
        border: none;
        color: var(--surface-on-surface, #FFF);
        height: 40px;
        margin: 0 !important;
        line-height: var(--line-height-h6, 24px); 
    }


    .ut_input{
        display: flex;
        padding: var(--padding-padding-sm, 8px) var(--padding-padding-lg, 16px);
        align-items: center;
        align-self: stretch;
        border-radius: var(--radius-xs, 8px);
        font-size: 16px !important;
        height: 48px !important;
    }

    .ut_forgetpassword_container{
   
        padding: 24px !important;
    }

    .ut_content{
        font-size: var(--font-size-h6, 16px);
    }

}


@media (min-width: 992px) and (max-width: 1199px) {
    html, body, div, span, a, img, ul, li, form, table, tbody, thead, tr, th, td, a, a:link, a:visited {
        font-size: unset !important;
    }
}

@media (max-width: 405px) {
    .ut_input{
        font-size: 13px !important;
    }
}