body{
    font-family: 'Nunito', sans-serif;
}
.navbar{
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
}
.btnAuth{
    margin-left: 10px;
    margin-right: 10px;
}
.navUserName{
    height: 40px;
    line-height: 20px;
    color: #F18921 !important;
    font-weight: 800;
}
.nav-item{
    margin-top: 5px;
    margin-bottom: 5px;
}
.nav-item .menu{
    font-family: 'Nunito', sans-serif !important;
    font-size: 18px;
    font-weight: 700;
    color: #1A1A1A !important;
    margin-right: 10px;
}
.nav-item .active{
    color: #F18921 !important;
    border-bottom: 3px solid #F18921;
}
.btnCustomPrimaryOutline{
    height: 40px;
    line-height: 20px;
    border: 3px solid #F18921;
    color: #F18921 !important;
}
.btnCustomPrimary{
    height: 40px;
    line-height: 20px;
    background-color: #F18921;
    border: 3px solid #F18921;
    color: white !important;
}
.btnCustomSecondary{
    height: 40px;
    line-height: 20px;
    background-color: #228EEF;
    border: 3px solid #228EEF;
    color: white !important;
}
.btnCustomSecondaryOutline{
    height: 40px;
    line-height: 20px;
    border: 3px solid #228EEF;
    color: #228EEF !important;
}
.btnCustomPrimaryOutline:hover{
    background-color: #FCE7D3 !important;
    border: 3px solid #F18921;
}
.btnCustomPrimary:hover{
    background-color: #D97B1E !important;
    border: 3px solid #D97B1E;
}
.btnCustomPrimary:disabled{
    color: black !important;
    background-color: #bebdbd !important;
    border: 3px solid #acacac;
}
.btnCustomSecondary:hover{
    background-color: #2777bd !important;
    border: 3px solid #2777bd;
}
.btnCustomSecondaryOutline:hover{
    background-color: #bad8f3 !important;
    border: 3px solid #228EEF;
}
.topContainer{
    margin-top: 150px;
}
.titleBlue{
    font-size: 48px;
    font-weight: 700;
    color: #14558F;
}
.subTitleBlue{
    font-size: 24px;
    font-weight: 700;
    color: #14558F;
}
.titleOrange{
    font-size: 48px;
    font-weight: 700;
    color: #F18921;
}
.subTitleOrange{
    font-size: 24px;
    font-weight: 700;
    color: #F18921;
}
.sakumasDesc{
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 500;
    color: #666666;
}
.daftarSekarang{
    width: 220px;
    line-height: 30px;
    height: fit-content;
    border-radius: 10px;
    font-size: 24px;
    font-weight: 600;
}
@media (max-width: 992px) { 
    .advertisceContainer{
        display: none;
    }
}
.hargaEmasContainer{
    margin-top: 80px;
    padding: 0 100px;
}
.hargaEmasCard{
    overflow: hidden;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    padding: 10px 20px 20px 20px;
}
.hargaLabel{
    margin-top: 10px;
}
.hargaTitle{
    font-size: 18px;
    font-weight: 700;
}
.hargaTitle span{
    color: #F18921;
}
.expandGraphCard{
    text-decoration: none;
    color: inherit !important;
}
.expandGraph{
    float: right;
    outline: none;
    border: none;
    margin-top: 20px;
    background-color: white;
}
.expandGraph:focus{
    float: right;
    outline: none;
    border: none;
    background-color: white;
}
.hargaGraph{
    float: left;
    margin-top: 20px;
    width: 100%;
}
@media (max-width: 992px) { 
    .hargaEmasContainer{
        padding: 0 0;
    }
}
/* Kenapa Sakumas Section */
.custom-shape-divider-top-1630908905 {
    margin-top: 100px;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.custom-shape-divider-top-1630908905 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 90px;
}
.custom-shape-divider-top-1630908905 .shape-fill {
    fill: #FFFFFF;
}
.kenapaSection{
    margin-top: -90px;
    background-color: #E3F2FF;
    padding: 90px 0px;
}
.kenapaCardContainer{
    margin-top: 40px;
    margin-bottom: 100px;
}
.kenapaCardContainer .col-lg-3{
    margin-top: 10px;
}
.kenapaCardContainer .col-lg-3 .card{
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
}
.cardTitle{
    font-size: 24px;
    font-weight: 700;
}
.cardDesc{
    font-family: 'Montserrat', sans-serif;
    margin-top: 5px;
    font-size: 18px;
    font-weight: 500;
    color: #666666;
}
.custom-shape-divider-bottom-1630909241 {
    margin-top: -90px;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.custom-shape-divider-bottom-1630909241 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 90px;
}
.custom-shape-divider-bottom-1630909241 .shape-fill {
    fill: #FFFFFF;
}
/* Bertransaksi Di Sakumas Section */
.caraSection{
    background-color: white;
}
.caraTransaksiContainer{
    margin-top: 90px;
    background-image: url("../images/v2/guide.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 85%;
}
.caraTransaksiStep{
    width: 400px;
}
.caraTransaksiStep h3{
    font-size: 24px;
    font-weight: 700;
}
.caraTransaksiStep p{
    font-size: 18px;
    font-family: 'Montserrat', sans-serif;
    color: #666666;
    font-weight: 500;
}
.transaksiStep1{
    margin-left: 600px;
}
.transaksiStep2{
    margin-right: 600px;
}
.transaksiStep3{
    margin-left: 600px;
}
@media (max-width: 1400px) { 
    .transaksiStep1{
        margin-left: 550px;
    }
    .transaksiStep2{
        margin-right: 550px;
    }
    .transaksiStep3{
        margin-left: 550px;
    }
}
@media (max-width: 992px) { 
    .caraTransaksiStep{
        width: 100%;
    }
    .caraTransaksiContainer{
        margin-top: 50px;
        background-image: none;
    }
    .transaksiStep1{
        margin-left: 0;
    }
    .transaksiStep2{
        margin-right: 0;
    }
    .transaksiStep3{
        margin-left: 0;
    }
}
/* FAQ Sakumas Section */
.custom-shape-divider-top-1630916284 {
    margin-top: 50px;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}
.custom-shape-divider-top-1630916284 svg {
    position: relative;
    display: block;
    width: calc(140% + 1.3px);
    height: 90px;
}
.custom-shape-divider-top-1630916284 .shape-fill {
    fill: #FFFFFF;
}
.faqSection{
    margin-top: -90px;
    background-color: #FCE7D3;
    padding: 90px 0px;
}
.faqIllustration{
    width: 500px;
}
.faqCard{
    margin-top: 20px;
    width: 80%;
    padding: 10px 20px;
    background-color: white;
    border-radius: 10px;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
    text-decoration: none;
    color: inherit !important;
}
.faqDrop{
    float: right;
    outline: none;
    border: none;
    background-color: white;
}
.faqDrop:focus{
    float: right;
    outline: none;
    border: none;
    background-color: white;
}
.faqTitle{
    font-size: 24px;
    font-weight: 700;
}
.faqCardAnswer{
    margin-top: 10px;
}
.faqAnswerDesc{
    font-family: 'Montserrat', sans-serif;
    color: #666666;
    font-size: 18px;
    font-weight: 500;
}
@media (max-width: 1200px) { 
    .faqCard{
        width: 100%;
    }
}
@media (max-width: 576px) { 
    .faqIllustration{
        width: 100%;
    }
}
/* Trust Sakumas Section */
.trustItemCon{
    margin-top: 50px;
}
.trustItemCon h5{
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #666666;
    margin-bottom: 10px;
}
.trustItemCon a{
    text-decoration: none;
}

/* BLOG List Page */
.blogPost{
    text-decoration: none;
    font-family: 'Nunito', sans-serif;
    color: inherit;
}
.blogPost:hover{
    text-decoration: none;
    color: inherit;
}
.blogCard{
    border-radius: 10px;
    transition: 0.2s ease;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}
.blogCard:hover{
    text-decoration: none;
    color: inherit;
    transform: translateY(-5px);
}
.blogCard img{
    object-fit: cover;
    height: 200px;
}
.blogCard .card-body h5{
    font-family: 'Nunito', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: #F18921;
}
.blogCard .card-body p{
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #666666;
}
.blogWriteDate{
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #666666;
}
.blogImg{
    object-fit: cover;
    height: 300px;
    border-radius: 10px;
}
.blogDetailPostBy{
    font-family: 'Nunito', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #666666;
}
.shareBlogLink{
    text-decoration: none;
    display: inline-block;
    margin-left: 2px;
}
.shareBlogCircle{
    width: 40px !important;
    height: 40px !important;
    border-radius: 100px;
    color: white;
}
.blogContent h2{
    font-family: 'Nunito', sans-serif;
    font-size: 30px;
    font-weight: 700;
}
.blogContent p{
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #666666;
}

/* Tentang Kami Page */
.tentangKamiTopContainer{
    margin-top: 70px;
    background: url(../images/v2/backgroundTentangKami.svg);
    background-size: 100%;
}
.officeImage{
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.labelPT{
    padding: 10px;
    border-radius: 10px;
    background-color: #14558F;
    color: #14558F;
    font-family: 'Nunito', sans-serif;
    font-size: 24px;
    font-weight: 700;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.25);
}
.labelPT::before{
    content: 'PT Sehati Indonesia Sejahtera';
    position: absolute;
    margin-top: -20px;
    padding: 10px;
    border-radius: 10px;
    background-color: #F18921;
    color: white;
}
.tentangKamiLogo{
    margin-bottom: 50px;
}
@media (max-width: 992px) { 
    .tentangKamiTopContainer{
        background: white;
    }
    .officeImage{
        display: none;
    }
}
@media (max-width: 410px) { 
    .labelPT{
        display: none;
    }
    .labelPT::before{
        content: '';
        position: absolute;
        height: 0;
        width: 0;
    }
    .tentangKamiLogo{
        width: 90%;
        margin-bottom: 0;
    }
}
.quoteVision{
    width: 60px;
    position: absolute;
    margin-top: 30px;
    margin-left: -50px;
}
@media (max-width: 992px) { 
    .visiMisiImage{
        display: none;
    }
    .quoteVision{
        margin-top: 120px;
        margin-left: -10px;
    }
}
@media (max-width: 768px) {
    .quoteVision{
        display: none;
    }
    .misiSakumas{
        padding-left: 0px !important;
    }
    .visiMisiCon{
        padding-left: 0px !important;
    }
}

/* Tentang Kami Page - Perjalanan */
.custom-shape-divider-top-1630908905-tentang {
    margin-top: 100px;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.custom-shape-divider-top-1630908905-tentang svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 90px;
}
.custom-shape-divider-top-1630908905-tentang .shape-fill {
    fill: #FFFFFF;
}
.tentangKamiSection{
    margin-top: -90px;
    background-color: #FCE7D3;
    padding: 90px 0px;
}
.custom-shape-divider-bottom-1630909241-tentang {
    margin-top: -90px;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.custom-shape-divider-bottom-1630909241-tentang svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 90px;
}
.custom-shape-divider-bottom-1630909241-tentang .shape-fill {
    fill: #FFFFFF;
}
.timelineCard{
    width: 300px;
    height: 180px;
    border-radius: 10px;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
}
.timelineCard .card-body .card-title{
    color: #F18921;
    font-family: 'Nunito', sans-serif;
    font-size: 24px;
    font-weight: 700;
}
.timelineCard .card-body .card-text{
    color: #666666;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 500;
}
.timelineDes20{
    margin-right: 60px;
}
.timelineJul21{
    margin-left: 60px;
}
.timelineLine{
    border: 2px solid #ffffff;
    opacity: 100%;
    margin: 30px 100px;
}
.timelineArrow{
    color: white;
    font-size: 36px;
    float: right;
    margin-top: 7px;
    margin-right: 150px;
}
.timelineCardAtas::before{
    content: '';
    width: 25px;
    height: 25px;
    border: 5px solid #ffd0a0;
    border-radius: 15px;
    background-color: #F18921;
    position: absolute;
    bottom: -45px;
    left: 135px;
}
.timelineCardBawah::before{
    content: '';
    width: 25px;
    height: 25px;
    border: 5px solid #ffd0a0;
    border-radius: 15px;
    background-color: #F18921;
    position: absolute;
    top: -45px;
    left: 135px;
}
@media (max-width: 1400px) { 
    .timelineDes20{
        margin-right: 30px;
    }
    .timelineJul21{
        margin-left: 30px;
    }
}
@media (max-width: 1200px) { 
    .timelineDes20{
        margin-right: 0px;
    }
    .timelineJul21{
        margin-left: 0px;
    }
}
@media (max-width: 992px) { 
    .timelineHorizontal{
        display: none;
    }
    .timelineVertical{
        display: block;
    }
}
@media (min-width: 993px) { 
    .timelineVertical{
        display: none;
    }
}

/* Tentang Kami Page - Partner Section */
.partnerSakumasImg{
    width: 340px;
}
.partnerTitle{
    font-size: 30px;
    font-weight: 700;
}
.partnerDesc{
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 500;
    color: #666666;
}
@media (max-width: 992px) { 
    .partnerSakumasImg{
        display: none;
    }
}

/* Tentang Kami Page - Bekerja Section */
.custom-shape-divider-top-1630916284-bekerja {
    margin-top: 50px;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}
.custom-shape-divider-top-1630916284-bekerja svg {
    position: relative;
    display: block;
    width: calc(140% + 1.3px);
    height: 90px;
}
.custom-shape-divider-top-1630916284-bekerja .shape-fill {
    fill: #FFFFFF;
}
.bekerjaSection{
    margin-top: -90px;
    background-color: #E3F2FF;
    padding: 90px 0px;
}

/* FAQ Page - Bekerja Section */
.faqFaqCard{
    margin-bottom: 20px;
    width: 90%;
    padding: 10px 20px;
    background-color: white;
    border-radius: 10px;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
    text-decoration: none;
    color: inherit !important;
}
@media (max-width: 992px) { 
    .faqFaqCard{
        width: 100%;
    }
}

/* Footer */
footer{
    background-color: #14558F;
}
.footerLabel{
    font-size: 18px;
    font-weight: 700;
}
.footerText{
    color: white;
    font-size: 14px;
    font-weight: 500;
}
.mailLink{
    color: inherit;
    text-decoration: none;
}
.mailLink:hover{
    color: #d8d0c7;
    text-decoration: none;
}
hr{
    color: white !important;
}


/* FONT SETUP MOBILE */
@media (max-width: 576px) { 
    .titleBlue{
        font-size: 36px;
    }
    .subTitleBlue{
        font-size: 18px;
    }
    .titleOrange{
        font-size: 36px;
    }
    .subTitleOrange{
        font-size: 18px;
    }
    .sakumasDesc{
        font-size: 18px;
    }
    .daftarSekarang{
        font-size: 18px;
    }
    .faqCard{
        padding: 6px 8px;
        border-radius: 5px;
    }
    .faqFaqCard{
        padding: 6px 8px;
        border-radius: 5px;
    }
    .trustItemCon h5{
        font-size: 18px;
    }
    .blogDetailPostBy{
        font-size: 18px;
    }
    .blogContent h2{
        font-size: 24px;
    }
    .partnerTitle{
        font-size: 24px;
    }
    .partnerDesc{
        font-size: 18px;
    }
}
@media (max-width: 370px) { 
    .titleBlue{
        font-size: 30px;
    }
    .titleOrange{
        font-size: 30px;
    }
}
/* UPDATE TABLE STYLE */
.tableheadSakumas{
    background-color: #F18921;
    color: white;
}