@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,200..800;1,200..800&display=swap");

/* CSS Document */

    *:not(i):not(em):not(.fa):not(.fas):not(.fab):not(.far):not(.fal):not([class^="fa-"]):not([class*=" fa-"]) {
        font-family: "Karla", cursive, sans-serif !important;
    }

    /* Restore home icon specific for OJS */
    .pkp_navigation_primary_row li:first-child>a::before,
    #navigationPrimary>li>a[href$="/index"]::before,
    #navigationPrimary>li>a[href$="/index/"]::before {
        font-family: 'FontAwesome' !important;
        font-weight: 900 !important;
    }

    html,
    body {
        font-size: 14px;
        color: #474747;
        margin: 0;
        padding: 0;
        overflow-x: clip;
        line-height: 1.6;
    }

    body .pkp_structure_page {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    /* Ubah semua font jadi ukuran proporsional */
    .page_contact .address,
    .page_contact .phone,
    .page_contact .email {
        margin-top: 10px;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .pkp_structure_head {
        background-color: transparent;
        padding: 0;
        margin: 0;
        width: 100%;
    }

    .pkp_structure_page {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body {
        margin: 0;
        padding: 0;
    }

    /* Judul artikel di daftar artikel */
    .obj_article_summary>.title {
        font-size: 14px;
        font-weight: 700
    }

    .pkp_structure_main h1,
    .obj_issue_toc .galleys h2,
    .obj_issue_toc .section h2,
    .pkp_block .title,
    .obj_article_summary>.title a,
    .current_issue h2,
    .pkp_page_index .cmp_announcements h2,
    .obj_announcement_summary h3 a,
    .obj_announcement_summary h4 a,
    .obj_article_details .main_entry .item .label,
    .obj_article_details .entry_details .item .label,
    .pkp_structure_main h3 {
        font-family: "Karla", cursive;
    }

    /* Bagian Judul Announcement di Announcements */
    .obj_announcement_summary h2 a {
        font-size: 16px;
    }

    /* Bagian Judul Volume di Archives */
    .obj_issue_summary .title {
        font-size: 16px;
    }

    /* Header background fix */
    .pkp_structure_head {
        background-color: transparent;
        padding: 0;
        margin: 0;
        width: 100%;
    }

    .pkp_structure_page {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body {
        margin: 0;
        padding: 0;
    }

    /* MENU REGISTER dan LOGIN */
    .pkp_head_wrapper {
        position: relative !important;
        max-width: 100%;
        padding: 0;
        margin: 0;
        margin-bottom: 0;
        width: 100vw;
        margin-left: calc(-50vw + 50%);
        margin-right: calc(-50vw + 50%);
        display: flex;
        flex-direction: column;
    }

    /* Memastikan tidak ada jarak tambahan di atas elemen container yang umum pada OJS */
    .pkp_structure_page {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    /* Ubah logo agar teks di sebelah kanan gambar OJS */
    .pkp_site_name {
        width: 100%;
        padding: 0px;
        margin: 0px;
        display: block;
    }

    .pkp_site_name a.is_img {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
        align-items: center;
        column-gap: 12px;
        row-gap: 2px;
        text-decoration: none;
        width: max-content;
        max-width: 100%;
    }

    .pkp_site_name a.is_img img {
        grid-column: 1 / 2;
        grid-row: 1 / 3;
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 60px;
        display: block;
        margin: 0;
        padding: 0;
    }

    .pkp_site_name a.is_img::before {
        content: "JOISTECH";
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        font-family: "Karla", sans-serif;
        font-size: 22px;
        font-weight: 700;
        color: #474747;
        align-self: end;
        line-height: 1.1;
        letter-spacing: 0.5px;
    }

    .pkp_site_name a.is_img::after {
        content: "Journal of Information Systems and Technology";
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        font-family: "Karla", sans-serif;
        font-size: 11px;
        font-weight: 400;
        color: #666666;
        align-self: start;
        line-height: 1.1;
        letter-spacing: 0.2px;
    }

    /* Ubah font di Navigasi */
    .pkp_navigation_user_wrapper a {
        font-family: "Karla", cursive;
        font-size: 12px;
    }

    /* Menu User di atas logo (Register / Login / Admin) */
    .pkp_head_wrapper {
        position: relative !important;
    }

    .pkp_navigation_user_wrapper,
    #navigationUserWrapper,
    .pkp_navigation_user,
    #navigationUser {
        position: absolute !important;
        right: calc(50% - 580px) !important;
        top: 10px !important;
        z-index: 9999 !important;
        left: auto !important;
        margin: 0 !important;
        transform: none !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: flex-end !important;
        align-items: center !important;
        width: auto !important;
    }

    @media (max-width: 1200px) {
        .pkp_navigation_user_wrapper,
        #navigationUserWrapper,
        .pkp_navigation_user,
        #navigationUser {
            right: 20px !important;
        }
    }

    .pkp_navigation_user_wrapper .pkp_navigation_user,
    #navigationUserWrapper #navigationUser,
    .pkp_navigation_user_wrapper ul,
    #navigationUserWrapper ul {
        position: static !important;
        right: auto !important;
        top: auto !important;
        left: auto !important;
        transform: none !important;
        margin: 0 !important;
    }

    .pkp_navigation_user {
        padding-right: 0px;
        margin: 0;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        list-style: none !important;
    }

    .pkp_navigation_user li {
        background: rgba(255, 255, 255, 0.9);
        text-align: left;
        border: 1px solid #e5e7eb;
        border-radius: 4px;
        margin-left: 5px;
        white-space: nowrap !important;
        display: inline-block !important;
    }

    @media (min-width: 769px) {
        .pkp_navigation_user > li {
            position: relative !important;
        }

        .pkp_navigation_user ul {
            position: absolute !important;
            top: 100% !important;
            right: 0 !important;
            left: auto !important;
            display: none !important;
            flex-direction: column !important;
            background: #ffffff !important;
            border: 1px solid #e5e7eb !important;
            border-radius: 4px !important;
            padding: 5px 0 !important;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
            min-width: 160px !important;
            z-index: 9999 !important;
            margin-top: 5px !important;
        }

        .pkp_navigation_user > li:hover ul,
        .pkp_navigation_user > li[aria-expanded="true"] ul,
        .pkp_navigation_user > li:focus-within ul {
            display: flex !important;
        }

        .pkp_navigation_user ul li {
            display: block !important;
            margin: 0 !important;
            border: none !important;
            background: transparent !important;
            width: 100% !important;
            box-sizing: border-box !important;
            border-radius: 0 !important;
            white-space: normal !important;
        }

        .pkp_navigation_user ul li a {
            display: block !important;
            padding: 8px 15px !important;
            width: 100% !important;
            box-sizing: border-box !important;
            text-align: left !important;
            font-weight: normal !important;
            font-size: 13px !important;
            color: #474747 !important;
            line-height: 1.4 !important;
        }

        .pkp_navigation_user ul li a:hover,
        .pkp_navigation_user ul li a:focus {
            background-color: #f3f4f6 !important;
            color: #0060ae !important;
        }
    }

    .pkp_navigation_user > li > a {
        padding: 6px 12px;
        font-family: "Karla", cursive;
        font-size: 12px;
        white-space: nowrap !important;
        display: inline-flex !important;
        align-items: center !important;
        line-height: 1.2 !important;
    }

    .pkp_navigation_user>li:last-child>a {
        margin-right: 0px;
        font-family: "Karla", cursive;
        font-size: 12px;
    }

    .pkp_navigation_user>li>a,
    .pkp_navigation_user>li.in_focus>a,
    .pkp_navigation_user>li>a:hover,
    .pkp_navigation_user>li>a:focus {
        color: #474747;
    }

    .pkp_navigation_user>li:last-child>a {
        color: #474747;
        background: transparent;
    }

    /* TOMBOL PENCARIAN */
    .pkp_search {
        margin: 0;
        padding: 0;
        margin-left: auto;
        /* Dorong kotak pencarian ke ujung paling kanan */
    }

    .pkp_head_wrapper .pkp_search .search_controls .search_prompt {
        font-family: "Karla", cursive;
        color: #fff;
        border-color: rgba(255, 255, 255, 0.5);
        background: transparent;
    }

    /* MENU */

    /* MENU UTAMA di ATAS */
    #navigationPrimary {
        background: transparent;
        border-radius: 0;
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: flex-start;
        border-bottom: none;
        align-items: center;
        flex-wrap: wrap;
        /* Pastikan tidak berantakan di layar kecil */
        flex: 1;
        /* Biarkan menu mengisi ruang kiri yang tersedia */
    }

    #navigationPrimary>li {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #navigationPrimary>li>a {
        font-size: 13px;
        font-weight: 500;
        color: #ffffff !important;
        text-decoration: none;
        position: relative;
        display: block;
        padding: 10px 15px;
        transition: all 0.3s ease;
        background-color: transparent !important;
    }

    #navigationPrimary>li[aria-haspopup="true"]>a::after {
        content: '\f107';
        /* FontAwesome down arrow */
        font-family: 'FontAwesome';
        margin-left: 5px;
        display: inline-block;
        position: static;
        width: auto;
        height: auto;
        background-color: transparent;
        transform: none;
    }

    #navigationPrimary>li>a:hover,
    #navigationPrimary>li:focus>a {
        background-color: transparent !important;
        color: #ffffff !important;
    }

    #navigationPrimary>li>a::before {
        display: none;
    }

    #navigationPrimary>li[aria-haspopup="true"]>a::before {
        display: none;
    }

    #navigationPrimary>li>a:hover::before,
    #navigationPrimary>li:focus>a::before {
        display: none;
    }

    /* Dropdown Menu */
    #navigationPrimary ul {
        background-color: #fff;
        border: 1px solid #ddd;
        border-radius: 4px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }

    #navigationPrimary ul li a {
        padding: 10px 20px;
        color: #474747 !important;
        font-size: 13px;
    }

    #navigationPrimary ul li a:hover {
        background-color: #f3f4f6 !important;
        color: #0060ae !important;
    }

    #navigationPrimary ul li a::after,
    #navigationPrimary ul li a::before {
        display: none;
        /* Hilangkan garis bawah animasi di dropdown menu */
    }

    /* Home Icon Automation (menggunakan atribut href ke beranda jural/index) */
    #navigationPrimary>li>a[href$="/index"]:not([href*="about"]),
    #navigationPrimary>li>a[href$="/index/"]:not([href*="about"]) {
        font-size: 0;
        padding: 10px 15px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #navigationPrimary>li>a[href$="/index"]::before,
    #navigationPrimary>li>a[href$="/index/"]::before {
        content: '\f015';
        /* FontAwesome home icon */
        font-family: 'FontAwesome';
        font-size: 16px;
        color: #ffffff;
        transition: color 0.3s ease;
        display: inline-block;
    }

    #navigationPrimary>li>a[href$="/index"]:hover::before,
    #navigationPrimary>li>a[href$="/index/"]:hover::before {
        color: #ffffff;
    }

    .pkp_navigation_primary_wrapper {
        background-color: #0060ae;
        /* Warna biru sesuai dengan header logo */
        display: flex;
        /* Tambahkan kembali */
        justify-content: center;
        /* Posisikan ke tengah */
        align-items: center;
        border-top: none;
        /* Hilangkan garis jika menempel pada logo */
        border-bottom: none;
        /* Hilangkan border bottom */
        padding: 0;
        margin-top: 0;
        /* Ubah margin-top jadi 0 karena sudah ditarik oleh line-height: 0 pada logo */
        margin-bottom: 25px;
        /* Tambahkan kembali jarak di bawah area menu ke body content */
        width: 100vw;
        /* Buat kembali full-width layar secara paksa */
        margin-left: calc(-50vw + 50%);
        margin-right: calc(-50vw + 50%);
        box-sizing: border-box;
        z-index: 2;
        /* Angkat area navigasi di atas elemen yang bertumpuk */
        position: relative;
    }

    /* Kita akan menggunakan properti before/after atau pseudo trick jika strukturnya membandel, tapi di sini kita styling ul utamanya */
    #navigationPrimary {
        background: transparent;
        border-radius: 0;
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: flex-start;
        border-bottom: none;
        align-items: center;
        flex-wrap: nowrap;
        /* Jangan wrap agar tetap sejajar */
        flex: 1;
        /* Biarkan menu mengisi ruang kiri yang tersedia */
        margin-left: -15px;
        /* Kompensasi padding container agar rata kiri dengan logo */
    }

    /* Container untuk menjaga konten menu & search di tengah sebatas area konten */
    .pkp_navigation_primary_row,
    /* Nama class jika kita membuat wrapper manual (sebaiknya gunakan yang ada) */
    .pkp_navigation_primary_wrapper>* {
        /* Karena kita tak bisa edit HTML, kita batasi elemen anak langsung dari wrapper-nya */
    }

    /* Trik agar elemen di dalam wrapper tetap di tengah selebar konten */
    .pkp_navigation_primary_wrapper {
        background-color: #0060ae;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 max(15px, calc((100vw - 1200px) / 2));
        /* Menjaga padding kiri-kanan menyesuaikan lebar maksimum 1200px */
        width: 100vw;
        margin-left: calc(-50vw + 50%);
        margin-right: calc(-50vw + 50%);
        border-bottom: none;
        margin-top: 0;
        margin-bottom: 0;
        /* Menghilangkan area kosong di bawah navigasi */
        z-index: 999;
        position: sticky;
        top: 0;
        box-sizing: border-box;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        /* Tambahkan sedikit bayangan agar terlihat melayang */
    }

    /* Pseudo-elemen untuk membatasi ruang konten */
    .pkp_navigation_primary_wrapper::before,
    .pkp_navigation_primary_wrapper::after {
        content: " ";
        display: table;
    }

    .pkp_navigation_primary_wrapper::after {
        clear: both;
    }

    /* Penyesuaian Responsif Layar Kecil (Mobile / Tablet) */
    @media (max-width: 768px) {

        /* 1. Header Banner & Logo Teks di KIRI Header Mobile */
        .pkp_site_name {
            position: absolute !important;
            left: 15px !important;
            top: 0 !important;
            height: 50px !important;
            width: max-content !important;
            max-width: calc(100vw - 70px) !important;
            display: block !important;
            margin: 0 !important;
            padding: 0 !important;
            z-index: 2 !important;
        }

        .pkp_site_name a.is_img {
            display: grid !important;
            grid-template-columns: auto 1fr !important;
            grid-template-rows: auto auto !important;
            align-items: center !important;
            column-gap: 10px !important;
            row-gap: 0px !important;
            height: 50px !important;
            text-decoration: none !important;
        }

        .pkp_site_name a.is_img img {
            grid-column: 1 / 2 !important;
            grid-row: 1 / 3 !important;
            height: 34px !important;
            width: auto !important;
            max-height: 34px !important;
            display: block !important;
            margin: 0 !important;
            padding: 0 !important;
        }

        .pkp_site_name a.is_img::before {
            font-size: 16px !important;
            color: #ffffff !important;
        }

        .pkp_site_name a.is_img::after {
            font-size: 9px !important;
            color: rgba(255, 255, 255, 0.9) !important;
            white-space: normal !important;
            display: -webkit-box !important;
            -webkit-line-clamp: 2 !important;
            -webkit-box-orient: vertical !important;
            overflow: hidden !important;
        }

        .pkp_structure_head {
            background-color: #0060ae !important;
            width: 100% !important;
        }

        .pkp_head_wrapper {
            background-color: #0060ae !important;
            width: 100% !important;
            height: 50px !important;
            min-height: 50px !important;
            position: relative !important;
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            padding: 0 15px !important;
            box-sizing: border-box !important;
            margin: 0 !important;
        }

        .pkp_site_name_wrapper {
            position: static !important;
            height: 50px !important;
            width: 100% !important;
        }

        /* 2. Ikon Toggle Menu Mobile di KANAN Header */
        .pkp_site_nav_toggle {
            position: absolute !important;
            top: 12px !important;
            right: 15px !important;
            left: auto !important;
            z-index: 99999 !important;
            width: auto !important;
            height: auto !important;
            background: transparent !important;
            border: none !important;
            border-radius: 0 !important;
            padding: 0 !important;
            margin: 0 !important;
            box-shadow: none !important;
            cursor: pointer !important;
            display: inline-block !important;
        }

        .pkp_site_nav_toggle span {
            display: none !important;
        }

        .pkp_site_nav_toggle::before {
            content: "\f0c9" !important;
            font-family: 'FontAwesome' !important;
            font-size: 26px !important;
            color: #ffffff !important;
            display: block !important;
            line-height: 1 !important;
        }

        /* 3. Pembungkus Navigasi Seluler saat Tertutup */
        .pkp_site_nav_menu:not(.pkp_site_nav_menu--isOpen):not(.pkp_site_nav_menu--is_open) {
            display: none !important;
        }

        /* Pembungkus Navigasi Seluler saat DIBUKA */
        .pkp_site_nav_menu.pkp_site_nav_menu--isOpen,
        .pkp_site_nav_menu.pkp_site_nav_menu--is_open,
        .pkp_site_nav_toggle[aria-expanded="true"] ~ .pkp_site_nav_menu {
            display: flex !important;
            flex-direction: column !important;
            position: absolute !important;
            top: 50px !important;
            left: 0 !important;
            right: 0 !important;
            width: 100vw !important;
            margin-left: calc(-50vw + 50%) !important;
            margin-right: calc(-50vw + 50%) !important;
            background-color: #004b87 !important;
            z-index: 999999 !important;
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25) !important;
            box-sizing: border-box !important;
            padding: 0 !important;
        }

        /* Pastikan Seluruh Isi Menu Terbuka (Register/Login, Search, Nav Primary) */
        .pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_user_wrapper,
        .pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_search,
        .pkp_site_nav_menu.pkp_site_nav_menu--isOpen #navigationPrimary,
        .pkp_site_nav_menu.pkp_site_nav_menu--is_open .pkp_navigation_user_wrapper,
        .pkp_site_nav_menu.pkp_site_nav_menu--is_open .pkp_search,
        .pkp_site_nav_menu.pkp_site_nav_menu--is_open #navigationPrimary {
            display: flex !important;
            visibility: visible !important;
            opacity: 1 !important;
        }

        /* Primary wrapper harus tetap display:contents agar order bekerja lintas wrapper */
        .pkp_site_nav_menu.pkp_site_nav_menu--isOpen .pkp_navigation_primary_wrapper,
        .pkp_site_nav_menu.pkp_site_nav_menu--is_open .pkp_navigation_primary_wrapper {
            display: contents !important;
        }

        /* 4. Daftar Menu Utama (Di Atas Register/Login & Search) */
        .pkp_navigation_primary_wrapper {
            display: contents !important;
        }

        #navigationPrimary {
            order: 1 !important;
            display: flex !important;
            flex-direction: column !important;
            width: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            list-style: none !important;
        }

        #navigationPrimary > li {
            width: 100% !important;
            display: block !important;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
            margin: 0 !important;
        }

        #navigationPrimary > li > a {
            display: flex !important;
            align-items: center !important;
            width: 100% !important;
            padding: 12px 16px !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #ffffff !important;
            background-color: transparent !important;
            box-sizing: border-box !important;
            text-align: left !important;
        }

        /* Teks "Home" pada Ikon Beranda - Rata Kiri & Jarak Ikon Dekat */
        #navigationPrimary > li > a[href$="/index"]:not([href*="about"]),
        #navigationPrimary > li > a[href$="/index/"]:not([href*="about"]) {
            font-size: 0 !important;
            font-weight: 600 !important;
            justify-content: flex-start !important;
            text-align: left !important;
            gap: 4px !important;
        }

        #navigationPrimary > li > a[href$="/index"]:not([href*="about"])::before,
        #navigationPrimary > li > a[href$="/index/"]:not([href*="about"])::before {
            margin-right: 4px !important;
            display: inline-block !important;
            font-size: 16px !important;
        }

        #navigationPrimary > li > a[href$="/index"]:not([href*="about"])::after,
        #navigationPrimary > li > a[href$="/index/"]:not([href*="about"])::after {
            content: "Home" !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #ffffff !important;
        }

        /* Sub-Menu (Dropdown Inline under About) */
        #navigationPrimary ul {
            position: static !important;
            float: none !important;
            width: 100% !important;
            background-color: #003660 !important;
            border: none !important;
            border-radius: 0 !important;
            box-shadow: none !important;
            padding: 0 !important;
            margin: 0 !important;
            box-sizing: border-box !important;
            list-style: none !important;
        }

        #navigationPrimary ul li {
            width: 100% !important;
            display: block !important;
            border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
            margin: 0 !important;
        }

        #navigationPrimary ul li a {
            display: block !important;
            width: 100% !important;
            padding: 10px 24px !important;
            color: #e2e8f0 !important;
            font-size: 13px !important;
            background-color: transparent !important;
            box-sizing: border-box !important;
            text-align: left !important;
        }

        #navigationPrimary ul li a:hover {
            background-color: rgba(255, 255, 255, 0.1) !important;
            color: #ffffff !important;
        }

        /* 5. Tombol Search (Di Bawah Login, UI/UX Sama Seperti Menu Biasa) */
        .pkp_search {
            order: 2 !important; 
            width: 100% !important;
            padding: 0 !important;
            box-sizing: border-box !important;
            background-color: transparent !important;
            border-top: none !important;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
            margin: 0 !important;
            float: none !important;
            display: block !important;
            position: relative !important;
        }

        /* Mengubah styling prompt sepenuhnya untuk menjamin presisi layaknya menu lain */
        .pkp_search .search_prompt,
        .pkp_search a.search_prompt {
            display: flex !important;
            align-items: center !important;
            justify-content: flex-start !important;
            width: 100% !important;
            padding: 12px 16px !important;
            font-size: 0 !important; /* HIDE original text nodes to prevent misalignment */
            color: transparent !important; /* HIDE original text */
            background-color: transparent !important;
            border: none !important;
            border-radius: 0 !important;
            box-sizing: border-box !important;
            text-decoration: none !important;
            text-align: left !important;
            height: auto !important;
            line-height: 1.6 !important;
            cursor: pointer !important;
            text-indent: 0 !important;
            margin: 0 !important;
            gap: 8px !important;
        }

        /* HIDE all child elements (spans, old icons) to start clean */
        .pkp_search .search_prompt > *,
        .pkp_search a.search_prompt > * {
            display: none !important;
        }

        /* CREATE fresh, perfectly aligned Icon */
        .pkp_search .search_prompt::before,
        .pkp_search a.search_prompt::before {
            content: "\f002" !important;
            font-family: 'FontAwesome' !important;
            font-size: 16px !important;
            color: #ffffff !important;
            display: inline-block !important;
            margin: 0 !important;
            padding: 0 !important;
            line-height: 1 !important;
        }

        /* CREATE fresh, perfectly aligned Text */
        .pkp_search .search_prompt::after,
        .pkp_search a.search_prompt::after {
            content: "Search" !important;
            font-family: "Karla", cursive, sans-serif !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #ffffff !important;
            display: inline-block !important;
            margin: 0 !important;
            padding: 0 !important;
            line-height: 1 !important;
        }

        .pkp_search .search_prompt:hover,
        .pkp_search a.search_prompt:hover {
            background-color: rgba(255, 255, 255, 0.1) !important;
        }

        /* Form Pencarian Melayang agar tidak mengganggu spasi/garis menu */
        .pkp_search .search_controls {
            position: absolute !important;
            top: 100% !important;
            left: 0 !important;
            right: 0 !important;
            background-color: #003660 !important;
            padding: 12px 16px !important;
            box-sizing: border-box !important;
            box-shadow: 0 4px 6px rgba(0,0,0,0.2) !important;
            margin: 0 !important;
            width: 100% !important;
            display: none !important;
            z-index: 9999 !important;
            border-bottom: 1px solid rgba(255,255,255,0.1) !important;
        }

        /* Tampilkan form HANYA saat dibuka */
        .pkp_search.is_open .search_controls {
            display: block !important;
        }

        .pkp_search form {
            display: flex !important;
            width: 100% !important;
            gap: 8px !important;
            margin: 0 !important;
            padding: 0 !important;
        }

        .pkp_search input[type="text"] {
            flex: 1 !important;
            width: 100% !important;
            height: 36px !important;
            box-sizing: border-box !important;
            border-radius: 4px !important;
            padding: 0 12px !important;
            background-color: rgba(255, 255, 255, 0.15) !important;
            border: 1px solid rgba(255, 255, 255, 0.25) !important;
            color: #ffffff !important;
            font-size: 13px !important;
            margin: 0 !important;
        }

        .pkp_search .search_submit,
        .pkp_search button[type="submit"] {
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            width: 36px !important;
            height: 36px !important;
            background-color: rgba(255, 255, 255, 0.15) !important;
            border: 1px solid rgba(255, 255, 255, 0.25) !important;
            border-radius: 4px !important;
            color: #ffffff !important;
            cursor: pointer !important;
            padding: 0 !important;
            margin: 0 !important;
            text-indent: 0 !important;
            flex-shrink: 0 !important;
        }

        .pkp_search .search_submit:hover,
        .pkp_search button[type="submit"]:hover {
            background-color: rgba(255, 255, 255, 0.3) !important;
        }

        .pkp_search .search_submit::before,
        .pkp_search button[type="submit"]::before {
            display: block !important;
            text-indent: 0 !important;
            color: #ffffff !important;
        }

        /* 6. Menu Register & Login (Di Bawah Contact, UI/UX Sama Seperti Menu Biasa) */
        .pkp_navigation_user_wrapper,
        #navigationUserWrapper,
        .pkp_navigation_user,
        #navigationUser {
            position: static !important;
            width: 100% !important;
            order: 3 !important;
            background-color: transparent !important;
            padding: 0 !important;
            margin: 0 !important;
            transform: none !important;
            display: flex !important;
            flex-direction: column !important;
            box-sizing: border-box !important;
        }

        .pkp_navigation_user ul,
        #navigationUser {
            display: flex !important;
            flex-direction: column !important;
            width: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            list-style: none !important;
        }

        .pkp_navigation_user li {
            width: 100% !important;
            display: block !important;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
            border: none !important;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
            border-radius: 0 !important;
            margin: 0 !important;
            background: transparent !important;
        }

        .pkp_navigation_user li a,
        .pkp_navigation_user > li > a {
            display: flex !important;
            align-items: center !important;
            width: 100% !important;
            padding: 12px 16px !important;
            font-size: 14px !important;
            font-weight: 600 !important;
            color: #ffffff !important;
            background-color: transparent !important;
            border-radius: 0 !important;
            box-sizing: border-box !important;
            text-decoration: none !important;
            text-align: left !important;
            line-height: 1.6 !important;
            white-space: normal !important;
        }

        .pkp_navigation_user li a:hover,
        .pkp_navigation_user > li > a:hover {
            background-color: rgba(255, 255, 255, 0.1) !important;
            color: #ffffff !important;
        }
    }

    /* KONTEN UTAMA */
    /* Beranda */
    /* Hilangkan border di Beranda */
    .pkp_page_index .additional_content {
        border: 0
    }

    /* Pindahkan Urutan Konten Beranda */
    .page_index_journal {
        display: flex;
        flex-direction: column;
    }

    .cmp_announcements {
        flex: 1;
        order: 2;
    }

    .current_issue {
        order: 3;
    }

    .additional_content {
        order: 1;
    }

    /* Tentang Jurnal */
    .responsive-content {
        padding: 15px 0;
        font-family: "Karla", cursive, Arial, sans-serif;
    }

    .content-container {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 30px;
        margin-bottom: 25px;
    }

    .image-container {
        flex: 0 0 200px;
    }

    .responsive-img {
        max-width: 100%;
        height: auto;
        display: block;
        border-radius: 2px;
    }

    .table-container {
        flex: 1;
        min-width: 0;
    }

    .responsive-table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .responsive-table table {
        width: 100%;
        border-collapse: collapse;
        font-size: 14px;
        line-height: 1.6;
    }

    .responsive-table td {
        padding: 12px 8px;
        vertical-align: top;
        border-bottom: 1px solid #f3f4f6;
        color: #474747;
    }

    .responsive-table tr:last-child td {
        border-bottom: none;
    }

    .responsive-table td:nth-child(1) {
        font-weight: 600;
        width: 25%;
        color: #374151;
    }

    .responsive-table td:nth-child(2) {
        text-align: center;
        width: 20px;
        font-weight: 600;
        color: #9ca3af;
    }

    .responsive-table td:nth-child(3) a {
        color: #0060ae;
        text-decoration: none;
        font-weight: 500;
    }

    .responsive-table td:nth-child(3) a:hover {
        text-decoration: underline;
    }

    .additional_content ul {
        list-style: none;
        padding-left: 0;
        margin-top: 15px;
        margin-bottom: 25px;
    }

    .additional_content ul li.show {
        position: relative;
        padding-left: 25px;
        margin-bottom: 8px;
        line-height: 1.5;
    }

    .additional_content ul li.show::before {
        content: "\f00c";
        font-family: 'FontAwesome';
        position: absolute;
        left: 0;
        top: 2px;
        color: #0060ae;
        font-size: 14px;
    }

    .additional_content h3 {
        margin-top: 25px;
        margin-bottom: 15px;
        font-size: 18px;
        color: #1f2937;
        font-weight: 600;
    }

    .additional_content p {
        margin-bottom: 20px;
        line-height: 1.7;
        color: #4b5563;
    }

    @media screen and (max-width: 768px) {
        .content-container {
            flex-direction: column;
            align-items: center;
            gap: 20px;
        }

        .image-container {
            flex: 0 0 auto;
            width: 160px;
            max-width: 100%;
        }

        .responsive-table td:nth-child(1) {
            width: 35%;
        }
    }

    /* KONTAK */
    .page_contact .address {
        font-size: 14px;
    }

    .pkp_structure_main h3 {
        font-size: 16px;
    }

    /* Seputar Pengumuman */
    .pkp_page_index .cmp_announcements {
        border-top: 1px solid #e5e7eb;
        border-bottom: 1px solid #e5e7eb
    }

    .pkp_page_index .cmp_announcements h2+.obj_announcement_summary,
    .pkp_page_index .cmp_announcements .more {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .pkp_page_index .cmp_announcements .more::before,
    .pkp_page_index .cmp_announcements .more:before {
        border-left: none !important;
        border: none !important;
        background: none !important;
    }

    .cmp_announcements .obj_announcement_summary h3 {
        font-size: 14px;
    }

    .pkp_page_index .cmp_announcements .more h4 {
        font-size: 13px;
    }

    .cmp_announcements .date {
        font-size: 12px;
    }

    /* Current Issue */
    .pkp_page_index .current_issue .current_issue_title {
        font-family: "Karla", cursive;
        font-size: 16px;
    }

    /* KOLOM ARCHIVES */
    .page_issue_archive .issues_archive {
        display: flex;
        flex-wrap: wrap
    }

    .page_issue_archive .issues_archive,
    .page_issue_archive .issues_archive>li {
        border: none;
        flex: 50%
    }

    .page_issue_archive .obj_issue_summary .description p {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        line-clamp: 2;
        -webkit-box-orient: vertical
    }

    /* ARTIKEL */
    .cmp_manuscript_button,
    .block_make_submission a,
    .obj_galley_link {
        font-weight: 700;
        text-transform: uppercase;
        background: #fff;
        color: #fff;
        border: 1px solid #0060ae;
        padding: 0px 5px 0px 5px;
    }

    .pkp_page_index .current_issue .read_more {
        font-family: "Karla", cursive;
        display: inline-block;
        position: relative;
        padding-right: 30px;
        font-size: 13px;
        line-height: 30px;
        color: #0060ae;
        text-decoration: none;
        margin-bottom: 0px
    }

    .obj_issue_toc .sections:not(:first-child) {
        margin-top: 0px;
    }

    @media (min-width: 768px) {

        .obj_issue_toc .heading:before,
        .obj_issue_toc .heading:after {
            content: " ";
            display: table
        }

        .obj_issue_toc .heading:after {
            clear: both
        }

        .obj_issue_toc .cover {
            float: left;
            width: 25%;
            height: auto;
            max-height: none;
            margin-right: 1.43rem
        }

        .obj_issue_toc .galleys,
        .obj_issue_toc .section {
            position: relative;
            margin: 2.143rem -1.43rem;
            padding: 2.143rem
        }

        .obj_issue_toc .galleys:before,
        .obj_issue_toc .section:before {
            content: '';
            position: absolute;
            top: 45px;
            left: 0;
            width: 100%;
            border-top: 1px solid #e5e7eb
        }

        .obj_issue_toc .galleys>h2,
        .obj_issue_toc .section>h2,
        .obj_issue_toc .galleys>h3,
        .obj_issue_toc .section>h3 {
            display: inline-block;
            position: relative;
            margin-top: 0;
            background: #fff;
            font-size: 1.143rem;
            line-height: 2.143rem;
            color: rgba(0, 0, 0, 0.54)
        }
    }

    .obj_issue_toc .pages {
        font-size: 12px;
    }

    /* SIDEBAR & KONTEN CUSTOMIZATION - BALANCED SPACING DARI GARIS PEMBATAS */

    .pkp_structure_main {
        padding-right: 24px !important;
        box-sizing: border-box;
    }

    .pkp_structure_sidebar {
        padding-left: 24px !important;
        box-sizing: border-box;
    }

    .pkp_structure_sidebar .pkp_block {
        margin: 0 0 24px 0;
        padding: 0;
        background: transparent;
        border: none;
        box-shadow: none;
    }

    .pkp_structure_sidebar .pkp_block:hover {
        border-color: transparent;
        box-shadow: none;
    }

    @media (max-width: 768px) {
        .pkp_structure_main {
            padding-left: 15px !important;
            padding-right: 15px !important;
        }

        .pkp_structure_sidebar {
            padding-left: 15px !important;
            padding-right: 15px !important;
            margin-top: 40px !important;
        }

        .pkp_structure_sidebar .pkp_block {
            margin: 0 0 20px 0;
            padding: 0;
        }

        .pkp_page_index .current_issue .read_more {
            margin-top: 24px !important;
            display: inline-block !important;
        }
    }

    .pkp_block .title,
    .pkp_block .title h2 {
        display: block;
        margin-bottom: 14px;
        margin-top: 0;
        line-height: 1.3;
        padding-bottom: 8px;
        border-bottom: 2px solid #eef6fc;
        font-weight: 700;
        font-size: 13px;
        text-transform: uppercase;
        color: #0060ae !important;
        letter-spacing: 0.5px;
        position: relative;
    }

    .pkp_block .title::after,
    .pkp_block .title h2::after {
        content: '';
        position: absolute;
        bottom: -2px;
        left: 0;
        width: 32px;
        height: 2px;
        background-color: #0060ae;
    }

    /* Sidebar List Container */
    .pkp_block .content ul {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .pkp_block .content ul li {
        display: block !important;
        cursor: pointer;
        line-height: 1.4;
        padding: 0 !important;
        margin: 0 !important;
        position: relative;
        border: none !important;
    }

    /* Each item formatted as a sharp rectangular card / box button */
    .pkp_block .content ul li a,
    .pkp_block .content p a:not(:has(img)) {
        font-family: "Karla", cursive, sans-serif;
        display: flex !important;
        align-items: center;
        padding: 9px 12px !important;
        background-color: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 0 !important;
        color: #334155 !important;
        font-size: 13px;
        font-weight: 500;
        text-decoration: none !important;
        transition: all 0.2s ease-in-out;
        position: relative;
        box-sizing: border-box;
        width: 100%;
    }

    .pkp_block .content ul li a:hover,
    .pkp_block .content p a:not(:has(img)):hover {
        background-color: #0060ae !important;
        border-color: #0060ae !important;
        color: #ffffff !important;
        transform: translateY(-1px);
        box-shadow: 0 4px 6px -1px rgba(0, 96, 174, 0.25);
        text-decoration: none !important;
    }

    /* Icons inside the item boxes with vertical separator line */
    .pkp_block .content ul li a em,
    .pkp_block .content ul li a i,
    .pkp_block .content ul li a [class^="fa-"],
    .pkp_block .content ul li a [class*=" fa-"],
    .pkp_block .content p a em,
    .pkp_block .content p a i {
        box-sizing: border-box;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        font: 1.05em / 1 FontAwesome;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        margin: 0 10px 0 0 !important;
        padding-right: 10px !important;
        border-right: 1px solid #cbd5e1 !important;
        width: 28px !important;
        height: 18px !important;
        color: #0060ae;
        transition: color 0.2s ease, border-color 0.2s ease;
        flex-shrink: 0;
    }

    .pkp_block .content ul li a:hover em,
    .pkp_block .content ul li a:hover i,
    .pkp_block .content ul li a:hover [class^="fa-"],
    .pkp_block .content ul li a:hover [class*=" fa-"],
    .pkp_block .content p a:hover em,
    .pkp_block .content p a:hover i {
        color: #ffffff !important;
        border-right-color: rgba(255, 255, 255, 0.4) !important;
    }

    /* Image links inside sidebar blocks (e.g., Mendeley, Turnitin, Statcounter, Crossref) */
    .pkp_block .content img {
        max-width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
        border-radius: 4px;
    }

    .pkp_block .content a:has(img),
    .pkp_block .content p a:has(img) {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        box-shadow: none !important;
        transform: none !important;
        display: block !important;
    }

    .pkp_block .content a:has(img):hover,
    .pkp_block .content p a:has(img):hover {
        background: transparent !important;
        transform: scale(1.02) !important;
        box-shadow: none !important;
    }


    em {
        box-sizing: border-box;
        display: inline-block;
        font: 1.09em / 1 FontAwesome;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        margin: 0px 10px 0px -10px;
        border-right: 1px solid #e7e5e5;
        width: 25px;
    }

    /* WARNA LINK */
    .pkp_structure_content.has_sidebar a {
        color: #0060ae;
        text-decoration: none;
    }

    .pkp_structure_content.has_sidebar a:hover {
        color: #004b87;
        background-color: transparent;
        text-decoration: underline;
    }

    .pkp_structure_content.has_sidebar a:active {
        color: #004b87;
        background-color: transparent;
    }

    /**************************FOOTER*********************************/

    /* Sembunyikan logo OJS Bawaan */
    .pkp_brand_footer {
        display: none !important;
    }

    .pkp_structure_footer {
        background-color: #f8fafc !important;
        border-top: 1px solid #e2e8f0 !important;
        box-shadow: none;
        max-width: 100%;
        width: 100%;
        float: none;
        clear: both;
    }

    .pkp_structure_footer_wrapper {
        background-color: #f8fafc !important;
        border-top: 1px solid #e2e8f0 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        clear: both;
        overflow: hidden;
        display: flex;
        justify-content: center;
    }

    .pkp_structure_footer_wrapper::before {
        display: none;
    }

    .pkp_footer_content {
        background-color: transparent;
        padding: 0;
        width: 100% !important;
        max-width: 100% !important;
        display: flex;
        justify-content: center;
    }

    /* CSS Khusus Footer Kustom */
    .joistech-footer {
        padding: 36px 20px 28px 20px;
        color: #475569;
        font-family: "Karla", cursive, sans-serif;
        background-color: transparent !important;
        border-top: none;
        width: 100% !important;
        max-width: 1200px !important;
        margin: 0 auto !important;
        box-sizing: border-box;
    }

    .footer-container {
        max-width: 1200px;
        margin: 0 auto !important;
        display: flex;
        flex-direction: column;
        gap: 22px;
    }

    /* --- Bagian Atas --- */
    .footer-top {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        border-bottom: 1px solid #e2e8f0 !important;
        padding-bottom: 18px !important;
        gap: 24px !important;
        flex-direction: row !important;
    }

    .footer-title {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }

    .footer-title h2 {
        margin: 0 0 4px 0 !important;
        font-size: 1.1rem !important;
        font-weight: 700 !important;
        color: #0060ae !important;
        line-height: 1.3 !important;
    }

    .footer-title .footer-subtitle {
        font-size: 0.85rem !important;
        color: #64748b !important;
        font-weight: 400 !important;
        display: block !important;
    }

    .footer-logo {
        flex: 0 0 180px !important;
        width: 180px !important;
        max-width: 180px !important;
    }

    .footer-logo img {
        width: 100% !important;
        max-width: 180px !important;
        height: auto !important;
        max-height: 55px !important;
        object-fit: contain !important;
        display: block !important;
        margin: 0 0 0 auto !important;
    }

    /* --- Bagian Tengah --- */
    .footer-middle {
        display: grid;
        grid-template-columns: 1fr 260px;
        gap: 32px;
        align-items: flex-start;
    }

    .footer-address {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .footer-address h3 {
        font-size: 0.95rem;
        font-weight: 700;
        color: #1e293b;
        margin: 0;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .footer-address h3 i {
        color: #0060ae;
    }

    .footer-address .university-name {
        font-size: 0.9rem;
        font-weight: 600;
        color: #334155;
        margin: 0;
    }

    .footer-address .address-text {
        font-size: 0.85rem;
        color: #64748b;
        line-height: 1.6;
        margin: 4px 0 0 0;
        display: flex;
        align-items: flex-start;
        gap: 8px;
    }

    .footer-address .address-text i {
        color: #0060ae;
        margin-top: 3px;
        flex-shrink: 0;
    }

    /* Kontak */
    .footer-contact {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .footer-contact h3 {
        font-size: 0.95rem;
        font-weight: 700;
        color: #1e293b;
        margin: 0 0 4px 0;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .footer-contact h3 i {
        color: #0060ae;
    }

    .footer-contact .contact-item {
        margin: 0;
        font-size: 0.85rem;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .footer-contact .contact-item i {
        color: #0060ae;
        width: 14px;
    }

    .footer-contact a {
        color: #0060ae;
        text-decoration: none;
        font-weight: 500;
        transition: color 0.2s ease;
    }

    .footer-contact a:hover {
        color: #004b87;
        text-decoration: underline;
    }

    /* --- Bagian Bawah --- */
    .footer-bottom {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: left;
        font-size: 0.82rem;
        color: #64748b;
        border-top: 1px solid #e2e8f0;
        padding-top: 18px;
        margin-top: 6px;
        line-height: 1.6;
    }

    .footer-bottom .license-text {
        margin: 0;
        flex: 1;
    }

    .footer-bottom .back-to-top {
        display: inline-block;
        padding: 6px 16px;
        background-color: #0060ae;
        color: #ffffff !important;
        border-radius: 4px;
        font-weight: 600;
        text-decoration: none;
        transition: background-color 0.2s;
        white-space: nowrap;
        margin-left: 20px;
    }

    .footer-bottom .back-to-top:hover {
        background-color: #004b87;
        text-decoration: none !important;
        color: #ffffff !important;
    }

    .footer-bottom .license-text i {
        color: #0060ae;
        margin-right: 4px;
    }

    .footer-bottom a {
        color: #0060ae;
        text-decoration: none;
        font-weight: 500;
    }

    .footer-bottom a:hover {
        text-decoration: underline;
    }

    /* Responsif Footer untuk HP/Tablet */
    @media (max-width: 768px) {
        .footer-top {
            flex-direction: column-reverse !important;
            gap: 16px !important;
            text-align: center !important;
        }

        .footer-logo {
            flex: 0 0 auto !important;
            width: auto !important;
            max-width: 100% !important;
            margin: 0 auto !important;
        }

        .footer-logo img {
            margin: 0 auto !important;
            max-width: 160px !important;
        }

        .footer-middle {
            grid-template-columns: 1fr;
            gap: 24px;
            text-align: center;
        }

        .footer-logo img {
            margin: 0 auto;
            max-width: 180px;
        }

        .footer-address h3,
        .footer-contact h3,
        .footer-contact .contact-item,
        .footer-address .address-text {
            justify-content: center;
        }

        .footer-bottom {
            flex-direction: column;
            text-align: center;
            gap: 16px;
            justify-content: center;
        }
        
        .footer-bottom .back-to-top {
            margin-left: 0;
        }
    }

    /*****************************************************************/


    /* Tombol WhatsApp Melayang */
    .wp-button {
        margin-top: 14px;
    }

    .float {
        position: fixed;
        width: 60px;
        height: 60px;
        bottom: 40px;
        right: 40px;
        background-color: #25d366;
        color: #FFF;
        border-radius: 50px;
        text-align: center;
        font-size: 35px;
        box-shadow: 2px 2px 3px #999;
        z-index: 100;
    }

    /************************** MOBILE *********************************/
    @media screen and (max-width: 1024px) and (min-width: 768px) {
        .pkp_structure_sidebar {
            padding-left: 15px;
            padding-right: 15px;
        }
    }

    @media screen and (max-width: 767px) {
        .pkp_structure_sidebar {
            padding-left: 15px;
            padding-right: 15px;
        }
    }

    /* DARI LUAR */

    /* HALAMAN EDITOR */
    .editorial-list {
        position: relative;
        list-style: none;
    }

    .editorial-list li {
        margin-bottom: 1.125rem;
    }

    .editorial-list .img-profile {
        position: absolute;
        width: 95px;
        height: 105px;
        border: 1px solid #ddd;
        padding: .5rem;
    }

    .editorial-list .img-profile .imgthumb {
        width: 80px;
        height: 90px;
        overflow: hidden;
        margin: 0 auto;
        object-fit: fill;
    }

    .editorial-list .img-profile img {
        width: 100%;
        height: 100%;
    }

    .team-content {
        margin-left: 100px;
        min-height: 130px;
    }

    .team-content .ico-label {
        width: 18px;
        height: 18px;
        margin-right: .5rem;
    }

    .team-aff ul li {
        margin-bottom: 0;
    }

    .team-aff ul li .tm_label {
        display: inline-block;
        width: 80px;
    }

    .team-aff ul li .ico-label {
        width: 18px;
        height: 18px;
        margin-right: .5rem;
    }

    .pkp_navigation_primary_wrapper {
        position: -webkit-sticky !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 9999 !important;
    }
    /* FORCE USER NAV TO RIGHT (DESKTOP ONLY) */
    @media (min-width: 769px) {
        .pkp_head_wrapper { position: relative !important; }
        .pkp_navigation_user_wrapper, #navigationUserWrapper, .pkp_navigation_user, #navigationUser { position: absolute !important; right: calc(50% - 580px) !important; top: 10px !important; left: auto !important; width: auto !important; z-index: 9999 !important; margin: 0 !important; }
    }
    @media (min-width: 769px) and (max-width: 1200px) {
        .pkp_navigation_user_wrapper, #navigationUserWrapper, .pkp_navigation_user, #navigationUser { right: 20px !important; }
    }