/* LOGIN */

.logc-section {
    padding: 235px 0px 152px;
    height: 550px;
    position: relative;
}




.log-section-top-content {
    width: 572px;
    max-width: 100%;
}

.sgc_log{
    background-image: url(../image/carolo_bg.jpeg);
    background-size: cover;
    background-position: center;
}

.log-section-top-content h2 {
    color: #FFF;
    font-family: "Urbanist";
    font-size: 70px;
    font-style: normal;
    font-weight: 700;
    line-height: 75px;
    text-transform: capitalize;
    margin-bottom: 24px;
}

.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;
}

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

.log_box {
    border: 1px solid var(--Style, #F0F0F0);
    background: var(--Grayscale-White, #FFF);
    box-shadow: 0px 100px 80px 0px rgba(0, 0, 0, 0.07), 0px 64.815px 46.852px 0px rgba(0, 0, 0, 0.05), 0px 38.519px 25.481px 0px rgba(0, 0, 0, 0.04), 0px 20px 13px 0px rgba(0, 0, 0, 0.04), 0px 8.148px 6.519px 0px rgba(0, 0, 0, 0.03), 0px 1.852px 3.148px 0px rgba(0, 0, 0, 0.02);
    display: flex;
    width: 100%;
    max-width: 608px;
    padding: 32px;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    margin: auto;
}

.log_2{
    display: flex;
    flex-direction: column;
    gap: 24px;
    width:100%;
}

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

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

.ipu_box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.inpi_boxx {
    border: 1px solid var(--Style, #F0F0F0);
    background-color: var(--Grayscale-White, #FFF);
    display: flex;
    padding: 16px;
    align-items: center;
    /* flex: 1 0 0; */
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 0px;
    border-radius: 0px;
    height: 64px;
}

.inpi_boxx:hover {
    border: 1px solid var(--Style, #F0F0F0);
    background-color: var(--Grayscale-200, #FBFBFB);
    box-shadow: 0px 38.519px 25.481px 0px rgba(0, 0, 0, 0.04), 0px 20px 13px 0px rgba(0, 0, 0, 0.04), 0px 8.148px 6.519px 0px rgba(0, 0, 0, 0.03), 0px 1.852px 3.148px 0px rgba(0, 0, 0, 0.02);
    display: flex;
    padding: 16px;
    align-items: center;
    /* flex: 1 0 0; */
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 0px;
    border-radius: 0px;
}

.forgee {
    color: var(--Functional-Info-Blue, #005BB9);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 23.5px;
    margin-bottom: 0px;
    margin-left: auto;
}

.forgee:hover {
    color: var(--Functional-Info-Blue, #005BB9);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 23.5px;
    margin-bottom: 0px;
    margin-left: auto;
}

.btn_butoon {
    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;
}

.btn_butoon:hover {
    display: flex;
    padding: 12px 26px;
    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;
    border-radius: 0px;
    height: 48px;

}

.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-right: auto;
}

.c_acc:hover {
    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-right: auto;
}

/* RESET  PASSWORD */


.rs_log_box {
    border: 1px solid var(--Style, #F0F0F0);
    background: var(--Grayscale-White, #FFF);
    box-shadow: 0px 100px 80px 0px rgba(0, 0, 0, 0.07), 0px 64.815px 46.852px 0px rgba(0, 0, 0, 0.05), 0px 38.519px 25.481px 0px rgba(0, 0, 0, 0.04), 0px 20px 13px 0px rgba(0, 0, 0, 0.04), 0px 8.148px 6.519px 0px rgba(0, 0, 0, 0.03), 0px 1.852px 3.148px 0px rgba(0, 0, 0, 0.02);
    display: flex;
    width: 100%;
    max-width: 743px;
    padding: 56px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px;
    margin: 118px auto;
}

.rs_log_tt {
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: 48px;
    /* 120% */
    text-transform: capitalize;
    margin-bottom: 16px;
    text-align: center;
}

.rs_sub {
    color: var(--Medium-Blue, #293F8C);
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 0px;

}

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

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




/* MODAL */

.main_mod_body {
    display: flex;
    padding: 56px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px;
    background: var(--Grayscale-White, #FFF);
    box-shadow: 0px 100px 80px 0px rgba(0, 0, 0, 0.07), 0px 64.815px 46.852px 0px rgba(0, 0, 0, 0.05), 0px 38.519px 25.481px 0px rgba(0, 0, 0, 0.04), 0px 20px 13px 0px rgba(0, 0, 0, 0.04), 0px 8.148px 6.519px 0px rgba(0, 0, 0, 0.03), 0px 1.852px 3.148px 0px rgba(0, 0, 0, 0.02);
}

.forget_content {
    width: 743px;
    margin: auto;
}

.rotate_arrow {
    position: absolute;
    top: 12px;
    right: 12px;
}

.modal-dialog {
    max-width: 100%;
}

.mod_btn_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    width: 100%;
}


/* SIGN UP */

.terms_line {
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 0px;
}

.blue_e {
    color: var(--Functional-Info-Blue, #005BB9);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 0px;

}

.blue_e:hover {
    color: var(--Functional-Info-Blue, #005BB9);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 0px;

}

.custom_checkbox {
    display: flex;
    justify-content: center;
    gap: 12px;
    align-items: center;
}

.form-check-input[type=checkbox] {
    width: 20px;
    height: 20px;
    border: 2px solid #1F303F;
}

.form-check-input:checked {
    background-color: transparent;
    border: 2px solid #1F303F;
}

.form-check-input:checked[type=checkbox] {
    background-image: url(../image/check_tick.png);
    background-size: 12px;
}

.check_split_box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

/* BGC */

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

.filter_head {
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    /* 116.667% */
    text-transform: capitalize;
    margin-bottom: 0px;
}

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

.filter_sec {
    display: flex;
    align-items: flex-start;
    gap: 32px;
    width: 100%;
    max-width: 993px;
}

.btn_white {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 173px;
    max-width: 173px;
    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;
}

.btn_white:hover {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 173px;
    max-width: 173px;
    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;
}

.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: 40px 0px;
}


.cards_box {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.cards_row {
    display: flex;
    align-items: flex-start;
    gap: 32px;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1404px;
    justify-content: center;

}

.card {
    display: flex;
    width: 100% !important;
    max-width:774px;
    padding: 24px;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}

.card:hover {
    display: flex;
    width: 327px;
    padding: 24px;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    border: 1px solid var(--Grayscale-400, #F4F4F4);
    background: var(--Grayscale-White, #FFF);
    box-shadow: 0px 100px 80px 0px rgba(0, 0, 0, 0.07), 0px 64.815px 46.852px 0px rgba(0, 0, 0, 0.05), 0px 38.519px 25.481px 0px rgba(0, 0, 0, 0.04), 0px 20px 13px 0px rgba(0, 0, 0, 0.04), 0px 8.148px 6.519px 0px rgba(0, 0, 0, 0.03), 0px 1.852px 3.148px 0px rgba(0, 0, 0, 0.02);
}

.card-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    padding: 0px;
}


.card-title {
    color: var(--Navy-H, #1F303F);
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Mazzard";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    margin-bottom: 0px;
}


.carsdd {
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Mazzard";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin-bottom: 0px;

}


.card-text {
    color: var(--Navy-H, #1F303F);
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Mazzard";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 0px;
}

.greem {
    color: #4EBF08;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Mazzard";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 0px;

}

/* PAGINATION */
.paginationn {
    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;
}

.page-link {
    border: none;
    color: var(--Navy-H, #1F303F);
    font-family: "Urbanist";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    text-transform: capitalize;
    padding: 0px;
}

.page-link:hover {
    border: none;
    color: var(--Navy-H, #1F303F);
    font-family: "Urbanist";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    text-transform: capitalize;
    padding: 0px;
}

.page-link.active {
    width: 33px;
    height: 33px;
    flex-shrink: 0;
    border-radius: 5px;
    background: var(--Accent, #F6CA6B);
    color: var(--Grayscale-White, #FFF);
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
}

.dropdown-toggle-split .caret {
    transition: transform 0.2s ease-in-out;
}

.dropdown-toggle-split.show .caret {
    transform: rotate(180deg);
}


/* SGC */

.logbgc-section {
    padding: 235px 0px 152px;
    height: 550px;
    position: relative;
}

.sgc-section {
    padding: 197px 0px 152px;
    height: 550px;
    position: relative;
}

.sgc-section-top-content {
    width: 661px;
    max-width: 100%;
}

.sgc-section-top-content h2 {
    color: #FFF;
    font-family: "Urbanist";
    font-size: 70px;
    font-style: normal;
    font-weight: 700;
    line-height: 75px;
    text-transform: capitalize;
    margin-bottom: 24px;
}

.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;
}


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

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

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

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

.content_box {
    display: flex;
    width: 100%;
    max-width: 572px;
    height: 776px;
    padding: 153px 0px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 40px;
    position: absolute;
    left: 51.5%;
    right: 357px;
}

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

.bold_res {
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 52px;
    font-style: normal;
    font-weight: 600;
    line-height: 68.5px;
    /* 131.731% */
    text-transform: capitalize;
    margin-bottom: 0px;
}


.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;
    /* 177.778% */
    margin-bottom: 0px;

}

.scrool_box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}


.carousel-control-prev-icon {
    background-image: url(../image/arrow_drop_prev.svg);
}

.carousel-control-next-icon {
    background-image: url(../image/arrow_drop_next.svg);
}

.icon_bx {
    position: relative;
    width: 100%;
    height: 24px;
}

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

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


.sgc_last {
    background-image: url(../image/last_sesse.png);
    background-color: #F8F8FA;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    /*height: 689px;*/
}

.syr_box {
    display: flex;
    /* padding: 62px 0px; */
    flex-direction: column;
    align-items: center;
    gap: 50px;
    align-self: stretch;
}

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

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

.syr_sub {
    color: var(--Medium-Blue, #293F8C);
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Urbanist";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    /* 177.778% */
    margin-bottom: 0px;

}

.syr_col_box {
    display: flex;
    align-items: flex-start;
    gap: 26px;
    align-self: stretch;
    width: 100%;
    max-width: 1076px;
    margin: auto;

}

.syr_row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 26px;
    flex: 1 0 0;
}

.form-select {
    background-image: url(../image/arro_drop_down.svg);
    background-size: 24px;
}

.pay_out {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1076px;
    margin: auto;
    margin-top: 24px;
    border: 1px solid var(--Grayscale-500, #D0D0D0);
    background-color: var(--Grayscale-White, #FFF);
    padding: 24px 16px;
}

.pay_ou {
    color: var(--Navy-H, #1F303F);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Montserrat";
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    margin-bottom: 0px;
}

.dollar {
    color: var(--Medium-Blue, #293F8C);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Montserrat";
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    margin-bottom: 0px;

}

.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: 177px;
}

.btn_butoonsgc:hover {
    display: flex;
    padding: 12px 26px;
    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;
    border-radius: 0px;
    height: 48px;
    width: 100%;
    max-width: 177px;

}

.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;
}

.pagiantion-r .page-item a {
    border: none;
    color: var(--Navy-H, #1F303F);
    font-family: "Urbanist";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    text-transform: capitalize;
    padding: 0px;
}

.pagiantion-r .active_page  {
    width: 33px !important;
    height: 33px !important;
    flex-shrink: 0;
    border-radius: 5px;
    background: var(--Accent, #F6CA6B) !important;
    color: var(--Grayscale-White, #FFF) !important;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
}