@media (max-width: 1024px) {
    body[marketplace-path] .footer-bersedekah,
    body[marketplace-path] #navbarArrowLeft{
        display: none !important;
    }
    .footer-bersedekah {
        margin-top: -60px;
        margin-bottom: 65px;
        display: none;
    }
    .footer-bersedekah > label,
    .footer-bersedekah > span{
        font-size: 14px;
    }
    .footer-bersedekah > label{
        display: block;
        margin-bottom: 10px;
        font-size: 14px;
        line-height: 16px;
    }
    .footer-bersedekah > span{
        font-size: 11px;
    }
    .footer-bersedekah > a > img {
        height: 20px;
        margin-left: 3px;
        vertical-align: top;
        margin-top: -1px;
    }

    i#navbarArrowLeft {
        display: block;
        font-size: 24px;
        margin-bottom: -1px;
        color: #999;
        margin-right: -17px;
    }

    .navbar-toggler {
        border: none;
        margin: 0 5px 0 0;
        padding: 0;
    }

    header {
        position: relative;
        height: 55px;
    }

    /* NavBar */

    .navbar.navbar-expand-lg.navbar-light.bg-white {
        padding: 15px 10px 5px;
        box-shadow: 0px -3px 15px #999;
    }
    .navbar.navbar-expand-lg.navbar-light.bg-white > a > .logo_lembaga {
        transform: scale(0.7);
    }
    .navbar.navbar-expand-lg.navbar-light.bg-white > div.box-search-navbar.mobile {
        transform: scale(0.7);
        margin-right: -20px;
    }
    .navbar.navbar-expand-lg.navbar-light.bg-white > div.box-search-navbar.mobile > #searchNavbarBtnMobile.active {
        margin-right: -30px;
    }
    .navbar.navbar-expand-lg.navbar-light.bg-white > .navbar-toggler {
        transform: scale(0.7);
    }

    #navbar-content {
        position: fixed;
        background-color: #FFF;
        top: 0;
        left: 0;
        height: calc(100% - 60px);
        max-height: 100vh;
        width: 100%;
        display: none;
        margin: inherit;
        overflow-y: scroll;
        align-items: flex-start;
        z-index: 9999;
    }

    .navbar-nav {
        flex-direction: column;
    }

    .nav-link {
        /*color: white;*/
        margin-left: auto;
        margin-right: auto;
    }

    .nav-link-menu-bottom {
        color: inherit;
    }

    .nav-link-menu-bottom > label {
        margin-left: 10px;
        margin-right: 10px;
    }

    nav.navbar {
        padding: 10px 5% !important;
        z-index: 9999;
        position: fixed;
        width: 100%;
        background-color: #FFFFFF !important;
    }

    nav.navbar.navbar-expand-lg.navbar-light {
        padding: 10px 5% !important;
    }

    nav.navbar.navbar-expand-lg.navbar-light > a {
        margin-left: auto;
        margin-right: auto;
        padding-left: 30px;
    }

    nav.navbar > #navbar-content > ul.navbar-nav.top {
        position: unset;
        border-bottom: 1px solid var(--background-button-color-tranparent);
        padding: 0px 30px;
    }

    nav.navbar > #navbar-content > ul.navbar-nav.top {
        flex-wrap: inherit;
    }

    nav.navbar > #navbar-content > ul.navbar-nav.bottom {
        margin-top: 0px;
        /*flex-basis: 100%;*/
        /*flex-wrap: wrap;*/
        margin-bottom: 0px;
        padding: 0 30px;
    }

    nav.navbar > #navbar-content > ul > li {
        margin-left: auto;
        margin-right: auto;
        transform: scale(1) !important;
    }

    nav.navbar > #navbar-content > ul.top {
        padding: 20px 0;
    }

    nav.navbar > #navbar-content > ul.top > li {
        display: block;
        width: 100%;
        padding: 3px 0;
    }

    nav.navbar > #navbar-content > ul.top > li:last-child {
        display: none;
    }

    nav.navbar > #navbar-content > ul.bottom > li {
        display: block;
        width: 100%;
        padding: 3px 0;
        margin-left: 0px;
    }

    /*nav.navbar > #navbar-content > ul.bottom > li:first-child {*/
    /*padding-top: 15px;*/
    /*}*/

    nav.navbar > #navbar-content > ul.top > li:first-child,
    nav.navbar > #navbar-content > ul.bottom > li:first-child {
        padding-top: 10px;
    }

    nav.navbar > #navbar-content > ul.navbar-nav > li.nav-item > a {
        font-size: 18px;
        margin-right: 0;
        padding-left: 0px;
    }

    nav.navbar > a > .logo_lembaga,
    nav.navbar > a > img[alt='logo-donasi']{
        height: 35px;
        padding-left: 0px;
        padding-top: 0px;
    }

    nav.navbar > #navbar-content > ul.top > li:first-child,
    nav.navbar > #navbar-content > ul.bottom > li:first-child {
        padding-top: 10px;
    }

    nav.navbar > #navbar-content > ul.navbar-nav.bottom {
        /*border-bottom: 1px solid var(--background-button-color-tranparent);*/
        height: 190px;
        overflow-x: hidden;
        overflow-x: auto;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }

    nav.navbar > #navbar-content > ul.navbar-nav.top {
        /*border-bottom: 1px solid var(--background-button-color-tranparent);*/
        height: 163px;
        overflow-x: hidden;
        overflow-x: auto;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }

    nav.navbar > #navbar-content > ul.navbar-nav.footer {
        display: block;
        margin-top: 0px;
        flex-basis: 100%;
        flex-wrap: wrap;
    }

    /*nav.navbar > #navbar-content > ul.navbar-nav.bottom > li > a {*/
    /*font-weight: bold !important;*/
    /*padding: 3px 0;*/
    /*}*/

    nav.navbar > div.navbar-collapse > ul.top,
    nav.navbar > div.navbar-collapse > ul.bottom{
        border-top: var(--caption-light-color) thin solid;
        margin-left: -6px;
        margin-right: -10px;
        width: 100%;
        padding: 0 10px 10px 10px;
    }

    nav.navbar > #navbar-content > ul.navbar-nav.top > li > a,
    nav.navbar > #navbar-content > ul.navbar-nav > li.nav-item > a {
        padding: 3px 0 !important;
    }

    .navbar-nav .dropdown-menu {
        position: absolute;
    }

    #dropdown-menu-yatim {
        display: none;
    }

    div.box-search-navbar.mobile {
        display: block;
        margin-right: 0px;
        /*margin-left: auto;*/
    }

    div.box-search-navbar.mobile > input {
        display: none;
        margin-top: 2px;
        position: absolute;
        top: 75px;
        left: 10px;
        width: 95%;
        border-radius: 4px;
        box-shadow: 0 8px 40px 15px #000000;
        padding: 20px 15px;
    }

    div.box-search-navbar.mobile > label {
        margin-bottom: 0;
        font-size: 22px;
        color: #999;
        padding: 5px 5px;
    }

    #iconSearch {
        display: none;
        font-size: 20px;
        color: #999;
        position: absolute;
        top: 88px;
        right: 20px;
    }

    .changeCol {
        color: var(--button-color);
    }

    .kontak-mobile {
        bottom: 0px;
        color: var(--main-background-color);
        background-color: var(--caption-super-dark-color);
        width: 100%;
        /*height: 32vh;*/
        padding: 20px;
    }

    .kontak-mobile > label {
        margin-bottom: 10px;
        border-bottom : 1px solid var(--background-button-color-tranparent);
    }

    .kontak-mobile > div {
        font-size: 12px;
        padding: 3px 0px;
        display: flex;
    }

    .kontak-mobile > div.sosmed > label > a > i {
        padding-right: 10px;
    }

    .kontak-mobile > div > label{
        margin-bottom: 0px;
    }

    .kontak-mobile > div > i,
    .kontak-mobile > div.box > div > i{
        padding-right: 7px;
        padding-top: 3px;
    }

    .kontak-mobile > div.box > div {
        float: left;
        width: 100%;
        padding-right: 9px;
        display: flex;
        word-break: break-word;
    }

    .kontak-mobile > div.box > div > label {
        position: relative;
        top: -3px;
    }

    .change-div {
        top: 60px !important;
        height: 92% !important;
    }

    .absolute {
        position: absolute;
    }

    .no-absolute {
        position: relative;
    }

    /* End Nav Bar */

    /* Slick Custom */

    ul.slick-dots {
        bottom: 0px;
    }
    button.slick-arrow {
        display: none !important;
    }
    button.slick-next.slick-arrow {
        right: 0;
    }
    button.slick-prev.slick-arrow {
        left: 0;
    }

    section.program-list button.slick-prev.slick-arrow {
        left: 0;
    }

    section.program-list button.slick-next.slick-arrow {
        right: 0;
    }

    /* End Slick Custom */

    /*Youtube responsive */

    .ycp .belah .handap {
        height: calc(100% - 0px) !important;
        overflow-y: auto !important;
    }

    /*Menu Pembayaran*/

    section.form-pembayaran {
        padding: 30px 30%;
    }

    /* Menu Program */

    div.top-banner-program,
    div.top-banner-program div.content {
        width: 100%;
        height: 200px;
        background-size: cover;
    }

    div.top-banner-program div.content > div.title > div.detail-program-text{
        display: flex;
        color: white;
    }

    section.filter-form div.filter-kategori-div,
    section.filter-form div.filter-lokasi-div {
        margin-bottom: 10px;
    }

    /* End Menu Program */

    div.input-effect > span.input--filled > label > span {
        font-size: 15px;
    }

    div.input-effect > span {
        max-width: 100%;
    }

    /* Footer */

    section.footer {
        display: none;
        /*padding: 20px 0px 40px 0px !important;*/
    }

    section.footer > div.footer-bottom {
        display: none;
        padding: 20px 0px !important;
    }

    section.footer > div.box-1,
    section.footer > div.box-2,
    section.footer > div.box-3,
    section.footer > div.box-4{
        display: none;
    }

    /* End Footer */

}