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

    /* Login */
    .log-section-top-content h2 {
        color: var(--Grayscale-White, #FFF);
        text-align: center;
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: 36px;
        text-transform: capitalize;
        margin-bottom:16px;
    }

    .log-section-top-content p {
        color: #F4F4F4;
        font-family: "Urbanist";
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 32px;
        margin-bottom: 0px;
        text-align: center;
    }

    .logc-section {
        padding: 57px 0px 0px;
        height: 432px;
        position: relative;
        margin-top: 100px;
    }

.log_2_s{
    display: flex;
    flex-direction: column;
    gap: 16px;
    width:100%;
}

.log_2_s h4{
            color: var(--Navy-H, #1F303F);
        text-align: center;
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: 36px;
        text-transform: capitalize;
        margin-bottom :8px;
}
    .log_tt {
        color: var(--Navy-H, #1F303F);
        text-align: center;
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: 36px;
        text-transform: capitalize;
    }

    .log_box {
        border: none;
        background: transparent;
        box-shadow: none;
        display: flex;
        width: 100%;
        max-width: 608px;
        padding: 0px;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        margin: auto;
    }


    .c_acc {
        color: var(--Functional-Info-Blue, #005BB9);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        text-transform: capitalize;
        margin-bottom: 0px;
        text-decoration: underline;
        text-underline-offset: 4px;
        margin: auto;
    }

    .btn_butoon {
        display: flex;
        padding: 12px 30px;
        justify-content: center;
        align-items: center;
        align-self: stretch;
        background: var(--Medium-Blue, #293F8C);
        color: var(--Light-Blue, #DEEFFF);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        text-transform: capitalize;
        margin-bottom: 0px;
        border-radius: 0px;
        margin-top: 0px !important;
        height: 40px;
    }

    .btn_butoon:hover {
        display: flex;
        padding: 12px 30px;
        justify-content: center;
        align-items: center;
        align-self: stretch;
        background: var(--Navy-H, #1F303F);
        color: var(--Light-Blue, #DEEFFF);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        text-transform: capitalize;
        margin-bottom: 0px;
        margin-top: 0px !important;
        border-radius: 0px;
        height: 40px;

    }

    /* RESET PASSWORD */


    .rs_log_box {
        border: none;
        background: transparent;
        box-shadow: none;
        display: flex;
        width: 100%;
        max-width: 608px;
        padding: 0px;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        margin: auto;
    }

    .log_for_r {
        background: var(--Grayscale-White, #FFF);
        padding: 24px;
    }

    .rs_log_tt {
        color: var(--Navy-H, #1F303F);
        text-align: center;
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: 36px;
        text-transform: capitalize;
    }


    .ipu_boox {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        align-self: stretch;
        margin-top: -24px;
    }

    .main_mod_body {
        display: flex;
        padding: 24px;
        align-items: center;
        flex: 1 0 0;
    }

    .btn_yellow_btn {
        padding: 12px 32px;
        justify-content: center;
        align-items: center;
        align-self: stretch;
        border: 1px solid var(--Medium-Blue, #293F8C);
        background: var(--Accent, #F6CA6B);
        border-radius: 0px;
        height: 40px;
        color: var(--Navy-H, #1F303F);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        text-transform: capitalize;
    }

    .log_for {
        background: linear-gradient(180deg, #E6E6EE 0%, #F0F0F4 15%, #FFF 100%);
        padding: 64px 24px;
    }

    .check_split_box {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        gap: 24px;
        width: 100%;
    }

    /* SGC  & bgc */
    /* ////////////////////////// */
    .bgc_log {
        padding: 24px;
        background: linear-gradient(180deg, #E6E6EE 0%, #F0F0F4 15%, #FFF 100%);
    }

    .filter_row {
        display: block;
        padding: 0px;
        justify-content: space-around;
        align-items: center;
        align-self: stretch;
    }

    .filter_sec {
        display: none;
        align-items: flex-start;
        gap: 32px;
        width: 100%;
        max-width: 993px;
        /* padding: 0px 24px; */
    }

    .filter_sec:hover {
        display: none;
        align-items: flex-start;
        gap: 32px;
        width: 100%;
        max-width: 993px;
        /* padding: 0px 24px; */

    }






    .btn_white {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        max-width: 100%;
        align-self: stretch;
        padding: 16px;
        align-items: center;
        border: 1px solid var(--Style, #F0F0F0);
        background: var(--Grayscale-White, #FFF);
        height: 68px;
        color: var(--Navy-H, #1F303F);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        text-transform: capitalize;
        margin-bottom: 0px;
    }

    .filter_head {
        color: var(--Navy-H, #1F303F);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 16px */
        text-transform: capitalize;
        margin-bottom: 0px;
        display: flex !important;
        justify-content: space-between;
        padding: 16px;
        align-items: center;
        border: 1px solid var(--Style, #F0F0F0);
        background: var(--Grayscale-White, #FFF);
    }

    .filter_sec .dropdown {
        margin-top: 8px;
    }

    .filter_sec .dropdown .btn_white {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        max-width: 100%;
        align-self: stretch;
        padding: 16px;
        align-items: center;
        border: 1px solid var(--Style, #F0F0F0);
        background: var(--Grayscale-White, #FFF);
        height: 68px;
        color: var(--Navy-H, #1F303F);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        text-transform: capitalize;
        margin-bottom: 0px;
        border-radius:0px;
    }

    .light_b {
        color: var(--Navy-H, #1F303F);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        text-transform: capitalize;
        margin-bottom: 0px;
        text-align: center;
        margin: 24px 0px;
    }

    .logbgc-section {
        padding: 32px 0px 0px;
        height: 473px;
        position: relative;
        margin-top: 100px;
    }

    .sgc-section-top-content h2 {
        color: var(--Grayscale-White, #FFF);
        text-align: center;
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: 36px;
        text-transform: capitalize;
        margin-bottom: 16px;
    }

    .sgc-section-top-content p {
        color: #F4F4F4;
        font-family: "Urbanist";
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 32px;
        margin-bottom: 0px;
        text-align: center;
    }

    .sgc-section {
        padding: 32px 0px 152px;
        height: 473px;
        position: relative;
        margin-top: 100px;
        margin-bottom: 32px;

    }


    .caro_1box {
        background-image: url(../image/mob_1.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 1038px;
        position: relative;
    }

    .caro_2box {
        background-image: url(../image/mob_2.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 1038px;
        position: relative;
    }

    .caro_3box {
        background-image: url(../image/mob_3.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 1038px;
        position: relative;
    }

    .caro_4box {
        background-image: url(../image/mob_4.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 1038px;
        position: relative;
    }

    .bold_res {
        color: var(--Neutral-Near-Black, #0E0E0E);
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: 36px;
        text-transform: capitalize;
    }

    .light_rs {
        color: var(--Medium-Blue, #293F8C);
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 32px;
    }


    .content_box {
        display: flex;
        width: 100%;
        max-width: 572px;
        height: auto;
        padding: 32px 24px;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        gap: 40px;
        position: absolute;
        top: 385px;
        left: 0%;
        right: 0%;
    }

    .details_box {
        display: flex;
        height: auto;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        flex-shrink: 0;
    }

    .contro_nex {
        position: absolute;
        width: 24px;
        right: 35px;
        right: 0px;
    }

    .contro_pre {
        position: absolute;
        bottom: 0;
        left: 7px;
        width: 24px;
        height: 24px;
    }

    .sgc_last {
        background-image: url(../image/lower_sec.png);
        background-color: linear-gradient(180deg, #E6E6EE 0%, #F0F0F4 15%, #FFF 100%);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        height: auto;
        padding: 32px 0px;
    }

    .syr_tit {
        color: var(--Navy-H, #1F303F);
        text-align: center;
        font-feature-settings: 'liga' off, 'clig' off;
        font-family: "Urbanist";
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: 36px;
        text-transform: capitalize;
        margin-bottom: 0px;
    }

    .syr_title_box {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        width: 327px;
    }

    .syr_col_box {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        align-self: stretch;
        width: 100%;
        max-width: 327px;
        margin: auto;
    }

    .syr_row {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        flex: 1 0 0;
        width: 100%;
    }

    .pay_out {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 24px;
        align-items: center;
        width: 100%;
        max-width: 327px;
        margin: auto;
        margin-top: 24px;
        align-content: center;
    }

    .btn_butoonsgc {
        display: flex;
        padding: 12px 26px;
        justify-content: center;
        align-items: center;
        align-self: stretch;
        background: var(--Medium-Blue, #293F8C);
        color: var(--Light-Blue, #DEEFFF);
        font-family: "Urbanist";
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        text-transform: capitalize;
        margin-bottom: 0px;
        border-radius: 0px;
        height: 48px;
        width: 100%;
        max-width: 100%;
    }

.pagiantion-r {
    display: flex;
    gap: 24px;
    display: flex;
    padding: 16px 23px;
    align-items: center;
    gap: 24px;
    border-radius: 10px;
    border: 1px solid var(--Style, #F0F0F0);
    background: var(--Grayscale-White, #FFF);
    margin-bottom: 0px;
    width: 198px;
    justify-content: left;
    align-items: center;
    overflow: scroll;
    margin: auto;
}
    .syr_box {
        display: flex;
        /* padding: 62px 0px; */
        flex-direction: column;
        align-items: center;
        gap: 24px;
        align-self: stretch;
    }
    .cards_row{
        gap:24px;
    }
/*    .cards_row {*/
/*    display: flex;*/
/*        flex-direction: column;*/
/*    align-items: flex-start;*/
/*    gap: 32px;*/
    /*flex-wrap: wrap;*/
/*    width: 100%;*/
/*    max-width: 1404px;*/
/*    justify-content: center;*/


/*}*/
    .filter_sec     .dropdown-menu.show {
        display: block;
        justify-content: center;
        margin: auto !important;
        left: 0px !important;
        right: 0px !important;
        top: 51px;
        padding: 0px;
        border-radius: 0px;
        border: 0px;
        background: #fff;
        width: 100%;
        left: 0px;
            position: absolute;
    inset: 0px auto auto 0px;
    margin: 0px;
    transform: translate3d(0px, 70px, 0px);
    }
}
@media (min-width: 769px) {
    .filter_sec {
      display: flex !important;
    }
    .filter_head{
      background-color: transparent !important;
    }
}
@media only screen and (min-device-width: 950px) and (max-device-width: 998px) {}


@media only screen and (min-device-width: 1000px) and (max-device-width: 1199px) {}



@media only screen and (min-device-width: 1200px) and (max-device-width: 1348px) {
    .card {
    display: flex;
    width: 100%;
    /*max-width: 268px;*/
    padding: 24px;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
}

@media only screen and (min-device-width: 1349px) and (max-device-width: 1439px) {}

@media only screen and (min-device-width: 1440px) and (max-device-width: 1499px) {
    .card {
    display: flex;
    width: 100%;
    /*max-width: 288px;*/
    padding: 24px;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}
}

@media only screen and (min-device-width: 1500px) and (max-device-width: 1699px) {}

@media only screen and (min-device-width: 1700px) and (max-device-width: 1799px) {}

@media only screen and (min-device-width: 1800px) and (max-device-width: 1919px) {}