html, body{
    font-size: 16px;
    /*background: url(https://yapindo-cdn.b-cdn.net/Gambar%20Blog%20M3/motif%20background%20ojs.webp);*/
    background-size: 300px;
    background-color: #f2f2f2;
}
.index-list{
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
gap: 20px;
margin: auto;
align-items: center;
}
.icon img{
    max-width: 200px;
}


.pkp_structure_head{
    background-color: #ffffff;
    border-bottom: 4px solid #1B87E9;
}
.has_site_logo .pkp_head_wrapper{
    background-color:#ffffff ;
}
nav.pkp_site_nav_menu{
    padding-left: 10px;
    padding-right: 10px;
    background-color: #ffffff;
}
@media(min-width:992px){
    .pkp_navigation_user.pkp_navigation_user{
        padding:10px;
    }
}



a{
    color: #1B87E9;
}
.pkp_page_index .current_issue h2, .pkp_block .title, .obj_issue_toc>.galleys h2, .obj_issue_toc .section h2{
    border-bottom:2px solid #1B87E9;
    color:#000000;
}
.pkp_brand_footer{
	display:none;
}
.pkp_block{
    padding-top: 20px;
    padding-bottom: 0;
}

a.block_make_submission_link {
    padding: 15px;
    border-radius: 10px;
}
.pkp_page_index .current_issue .sections{
    margin-top:0;
}
@media (min-width: 992px) {
    .pkp_site_name .is_img img {
        max-height: 150px;
    }
    .pkp_navigation_search_wrapper a{
        color: white;
    }
    .pkp_navigation_search_wrapper a:active{
        background-color: #1B87E9;
    color: black;
    }
    .pkp_navigation_search_wrapper a:hover{
        background-color: #1B87E9;
    color: black;
    }
    .pkp_navigation_primary > li > a{
        color: black;
        border-bottom: 0;
    }
    .pkp_navigation_primary > li > a:active {
    background-color: #1B87E9;
    color: black;
}
.pkp_navigation_primary > li > a:hover {
    background-color: #1B87E9;
    color: black;
}
ul#navigationUser{
    background-color: #ffffff;
}
li.profile a{
    color: black;
}
li.profile a:hover{
    background-color: #1B87E9;
    color: white;
}
}

.pkp_site_nav_toggle>span:before, .pkp_site_nav_toggle>span:after{
    background:#ffffff;
}
.pkp_site_nav_toggle>span{
    border-bottom: 3px solid #ffffff;
}
.pkp_site_nav_menu a{
    color: black;
}

/*Header menu custom*/
/*.pkp_structure_head{
    border-bottom: 0;
}
nav.pkp_site_nav_menu{
        background-color: #ffffff;
    padding: 10px;
    border-radius: 10px 10px 0px 0px;
    border-top:1px solid #d5d5d5;
    border-left:1px solid #d5d5d5;
    border-right:1px solid #d5d5d5;
}*/
/*
@media (min-width:992px){
    .pkp_navigation_primary>li:first-child a{
        color: black;

}
.pkp_navigation_primary>li:first-child a:hover{
        color: black;

}
.pkp_navigation_primary>li>a{
    color: black;
}
.pkp_navigation_primary>li>a:hover{
    color: black;
}

}
*/
.pkp_structure_sidebar.left{
    /*background-color: #FAF3FF;*/
    margin-bottom:50px;
    /*border-radius: 5px 0px 0px 5px;*/
}
.pkp_block{
    padding-bottom: 20px;
    background-color: #ffffff;
    margin-bottom: 10px;
    border-radius: 5px;
    border-bottom: 3px solid #1B87E9;
}

.pkp_structure_content.has_sidebar{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: center;
    align-items: flex-start;
    border-left: 0px;
    border-right: 0px;
    background-color: transparent;
}
.pkp_structure_main{
        background-color: white;
    }
@media (max-width: 991px){
    .pkp_structure_content.has_sidebar{
        flex-direction: column;
    }
    .pkp_structure_sidebar.left{
        width: 100%;
        margin-top: 10px;
    }
}

@media (min-width: 992px){
    .pkp_structure_main{
        background-color: white;
        margin-right: 10px;
        border-radius: 5px;
        margin-bottom: 10px;
    }
}
@media (max-width: 767px){
    .pkp_structure_content.has_sidebar{
    flex-direction: column;
}
}
@media (min-width: 768px){
    .pkp_structure_main:before,.pkp_structure_main:after {
        background:transparent;
    }
}


/*css footer custom*/
.pkp_structure_footer_wrapper{
    background: white;
    padding-bottom:30px;
}
.pkp_structure_footer{
    background-color: white;
}
    .footer-container {
    display: flex;
    flex-wrap: wrap; /* Agar bisa responsive */
    gap: 20px; /* Jarak antar kolom */
/*    padding: 40px 20px;*/
}

.column-footer {
    flex: 1 1 calc(25% - 20px); /* 4 kolom per baris */
    min-width: 250px; /* Minimal lebar kolom */
    box-sizing: border-box;
}
.column-footer .about{
    max-width: 100px;
}

.column-footer h3 {
    margin-top: 0;
    font-size: 18px;
    color: #333;
}

.column-footer p {
    font-size: 14px;
    color: #555;
    line-height: 1.5;
}

.column-footer ul {
    list-style: none;
    padding-left: 0;
}

.column-footer ul li {
    margin-bottom: 8px;
}

.column-footer ul li a {
    text-decoration: none;
    color: #555;
}

/* Responsive: 2 kolom untuk layar kecil */
@media (max-width: 768px) {
    .column-footer {
        flex: 1 1 calc(50% - 20px);
    }
}

/* Responsive: 1 kolom untuk mobile */
@media (max-width: 480px) {
    .column-footer {
        flex: 1 1 100%;
    }
}
/*css footer custom*/

/*form register style*/
@media (min-width: 480px) {
    .cmp_form input[type="text"], .cmp_form input[type="email"], .cmp_form input[type="password"], .cmp_form input[type="url"], .cmp_form input[type="tel"], .cmp_form select {
        max-width: 40em;
        height: 40px;
        border-radius: 5px;
    }
}

/*button tambahan*/
/* Container untuk kedua tombol */
.button-tambahan {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px; /* jarak antar tombol */
}

/* Gaya umum untuk tombol */
.button-link {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: 12px 24px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
    color: white;
    width: 100%;
    max-width: 300px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* Ikon dalam tombol */
.button-link img {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

/* Tombol Contact Us */
.contact-us-button {
    background: linear-gradient(to right, #30bb44, #005e46);
}

.contact-us-button:hover {
    background: linear-gradient(to right, #005e46, #30bb44);
    color:#ffffff;
}

/* Tombol Article Template */
.article-template-button {
    background: linear-gradient(to right, #000099, #506cff);
}

.article-template-button:hover {
    background: linear-gradient(to right, #506cff, #000099);
    color:#ffffff;
}
/*make submission button */
.make-submission-button{
        background: linear-gradient(to right, #2497FF, #1B87E9);
}
.make-submission-button:hover{
        background: linear-gradient(to right, #1B87E9, #2497FF);
        color:#ffffff;
}
/*button tambahan*/
/*custom menu sidebar css*/

    /* Styling khusus untuk ul dengan class journal-menu */
    .journal-menu {
      list-style-type: none;
      padding: 0;
    }

    /* Styling khusus untuk li dalam menu */
    .journal-menu li {
      margin-bottom: 0px;
    }

    .journal-menu a {
      text-decoration: none;
      display: block;
      padding: 12px 20px;
      background-color: #ffffff;
      color: #2c3e50;
      border-radius: 8px;
      transition: background-color 0.3s ease, transform 0.2s ease;
    }

    .journal-menu a:hover {
      background-color: #1B87E9;
      color: white;
      transform: translateX(5px);
    }

/*single artikel*/

@media (min-width:992px){
    .obj_article_details .row{
        display: flex;
    }
}

/*buat full width di single article*/
.pkp_structure_main:first-child:last-child{
    width: 100%;
}

@media (min-width:992px){
    .obj_article_details .main_entry{
        width: 700px;
    }
}
@media (min-width:768px){
    .obj_article_details .main_entry{
        width: 100%;
    }
}
@media (min-width:992px){
.obj_article_details .entry_details{
    width: 300px;
}
}
@media (max-width:991px){
.obj_article_details .entry_details{
    width: 100%;
}
}

/*Css editorial team*/
.wrapper-editor {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 1000px;
    margin: 0 auto;
}

/* Setiap blok editor */
.block-editor {
    display: flex;
    background: #ffffff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    align-items: flex-start;
    gap: 20px;
}

/* Gambar editor */
.gambar-editor img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 8px;
}

/* Detail editorial */
.detail-editorial {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Nama dan jabatan */
.nama-editor h2 {
    margin: 0;
    font-size: 20px;
}
.nama-editor h3 {
    margin: 5px 0;
    font-size: 16px;
    color: #555;
}
.nama-editor p {
    margin: 0;
    font-size: 14px;
    color: #777;
}

/* Akun editor */
.akun-editor ul {
    list-style: none;
    padding: 0;
    margin-top: 15px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.akun-editor li {
    display: flex;
    align-items: center;
}
.akun-editor a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #0066cc;
    font-size: 14px;
}
.akun-editor img {
    max-width: 20px;
    width: 100%;
    height: auto;
    margin-right: 5px;
}
@media (max-width: 767px){
    .block-editor{
        flex-direction: column;
    }
}
/*Css editorial team*/