html,
body {
    background-image: url(https://img.freepik.com/free-vector/white-abstract-background_23-2148833155.jpg?t=st=1747931161~exp=1747934761~hmac=3e96cff…&w=1380);
    background-size: cover;
}

a {
    color: #136839;
}

a:hover,
a:focus {
    color: #136839a6;
}

.cmp_notification {

    border-left: .357rem solid #126839;

    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}


/* ---------- KONTEN LAIN DI SIDEBAR (tetap) ---------- */
#menu {
    width: 100%;
    list-style: none;
}

#menu li {
    width: 100%;
    background: #F6F6F6;
}

#menu li a:link,
#menu li a:visited {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border-left: 5px solid #166c3b;
    border-bottom: 1px solid #98c873;
    text-decoration: none;
    display: block;
    width: 100%;
    padding: 12px;
    margin-right: 30px;
    font-family: Tahoma;
    color: #000;
    transition: width 0.3s ease-in-out;
    -webkit-transition: width 0.3s ease-in-out;
    -moz-transition: width 0.3s ease-in-out;
}

#menu li a:hover,
#tq-menu li a:active {
    /* background: #166c3b00; */
    color: #166c3b;
    border-left: 5px solid #166c3b96;
    border-bottom: 1px solid #8da138;
    width: 100%;
}

/* ---------- EOF KONTEN LAIN DI SIDEBAR (tetap) ---------- */
/* ---------- Other -------------------------- */
p {
    text-align: justify;
}

.homepage_atas {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 2%;
    line-height: 1.75rem;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

.homepage_atas table.desc-class {
    width: 70%;
}

.pkp_page_index .homepage_about h2 {
    display: none;
}

table.desc-class th {
    text-align: left;
}

.pkp_structure_main h3,
.section>h3 {
    margin: 7px 0;
    font-stretch: extra-condensed;
    text-decoration: underline;
    font-weight: bold !important;
    color: black !important;
    background: transparent !important;
}

.sections .section>h3 {
    margin-left: 1%;
}

.homepage_atas .image-home {
    width: 30%;
}

.pkp_structure_footer {
    display: flex;
}

.pkp_footer_content {
    display: flex;
    width: 80%;
}

.col-md-1 {
    display: contents;
    flex-direction: row;
}

.col-md-1 p {
    width: 56%;
}

.box-text {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    padding: 2%;
    margin-top: 2%;
}

.box-text h2 {
    margin: 0;
    background: #166c3b40;
    padding: 2%;
    text-align: center;
    margin-bottom: 2%;
}

.obj_issue_summary {
    padding: 2%;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.author_guidelines,
.submission_checklist,
.section_policy,
.copyright_notice,
.privacy_statement {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    padding: 1% 2%;
    margin-top: 4%;
}

.submission_checklist>h2,
.author_guidelines>h2,
.section_policy>h2,
.copyright_notice>h2,
.privacy_statement>h2 {
    margin: 0;
    background: #166c3b40;
    text-align: center;
    padding: 2%;
}

.authors>li {
    list-style: decimal;
    margin-bottom: 1px !important;
}

.userGroup {
    display: none !important;
}

.obj_article_details .entry_details .item {
    box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px !important;
}

.obj_article_details .entry_details .sub_item:first-child>.label,
.obj_article_details .entry_details .item>.label {
    background: #166c3b;
    color: white;
    font-weight: 900;
}

.obj_article_details .entry_details .item.galleys {
    background: transparent;
    box-shadow: none !important;
}

.obj_article_details .entry_details .galleys_links>li {
    width: 100% !important;
}

.obj_article_details .entry_details .item.copyright {
    background: #f2f2f2;
}

.obj_article_details .entry_details .item.copyright p {
    padding: 0 7%;
}

.obj_article_details .entry_details .item.copyright img {
    margin: 0 27%;
}

.pkp_structure_main .page h1 {
    text-align: center;
    margin-top: 1%;
    background: #166c3b29;
    padding: 2% 0;
}

/* Login */

.page_login .login {
    width: 100%;
    max-width: none;
}

.cmp_form fieldset {
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 20px;
}

.cmp_form fieldset label {
    margin: 5px 10px 5px 0;
}

.cmp_form .fields>div {
    padding-bottom: 0;
}

.cmp_form .label {
    font-size: 1.2rem;
    font-weight: 500;
}

.cmp_form .label .required {
    color: red;
}

.page_login .login input[type="text"],
.page_login .login input[type="password"],
.cmp_form input[type="text"],
.cmp_form input[type="email"],
.cmp_form input[type="password"],
.cmp_form select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    max-width: none;
    height: 20% !important;
}

.cmp_form legend {

    text-align: center;

    padding-top: 7%;

    font-size: 1.6rem;
}

.page_login .remember .label {
    font-size: 13px;
    text-align: left;
}

.cmp_form .buttons {
    margin-top: 2%;
}

.page_login .buttons button,
.page_login .buttons a,
.cmp_form .buttons button,
.cmp_form .buttons a {
    width: 15%;
    background-color: #4CAF50;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 17px;
    float: left;
    box-shadow: inset 0 -1em 1em rgba(0, 0, 0, 0.1);
    line-height: calc(2.143rem - 2px);
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
    margin-left: 35%;
}

.page_login .buttons a,
.cmp_form .buttons a {
    background-color: #136839;
    text-align: center;
    text-decoration: none;
    width: 15%;
    margin-left: 2%;
}

/* Sidebar */
.pkp_block {
    box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    margin: 5% 3%;
    padding: 0;
}

.pkp_block>h2 {
    width: 100%;
    background: #166c3b;
    color: white !important;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    text-align: center;
    padding: 9% 0;
}

.pkp_block .content {
    padding: 6%;
}

/* Panel Editor */

.panel-editor {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.item-editor {
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    padding: 3%;
    display: flex;
    width: 48%;
    margin: 1%;
}

.item-editor .col-editor-img {
    width: 25%;
}

.item-editor .col-editor-content {
    width: 100%;
}

.item-editor .col-editor-content label {
    display: block;
    line-height: 1.9rem;
}

.item-editor .col-editor-content label a {
    text-decoration: none !important;
}

.item-editor .col-editor-content img {
    width: 80px;
    padding: 3px;
    box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
    height: 30px;
}

.label-editor {
    width: 100%;
    font-size: 23px;
    font-weight: bold;
    padding: 4% 0;
    vertical-align: middle;
    border-top: 1px dashed #00000075;
    border-bottom: 1px dashed #00000075;
}

.label-editor p {
    text-align: center;
    line-height: 0;
    margin: 0;
}

/* index  */
.panel-index {
    padding: 2%;
    margin-top: 4%;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

.panel-index p {
    width: 20% !important;
    padding: 1.5%;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.panel-index h3 {
    margin: 0;
}

/* Article */
.obj_article_summary {
    padding: 2%;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}

.obj_galley_link {
    background-color: #13aa52;
    border: 1px solid #13aa52;
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, .1) 0 2px 4px 0;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: lighter;
    outline: none;
    outline: 0;
    padding: 4px 15px;
    text-align: center;
    transform: translateY(0);
    transition: transform 150ms, box-shadow 150ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
}

.obj_galley_link:hover {
    box-shadow: rgba(0, 0, 0, .15) 0 3px 9px 0;
    transform: translateY(-2px);
    background: #166c3be3;
}

.read_more {
    margin-top: 2%;
    color: #136839 !important;
}

.read_more a {
    color: #136839;
}

.read_more a:hover,
.read_more a:focus {
    color: #136839a6;
}

.heading,
.galleys {
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
    padding: 2% !important;
    margin-bottom: 2% !important;
}

.galleys>h3 {
    color: #000000 !important;
    background: transparent !important;
    font-weight: bold !important;
}

.pkp_page_index .current_issue h2 {
    width: 100%;
    border-bottom: 3px solid #136839ad;
    color: #000000;
}

.obj_issue_toc .cover img {
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.cmp_article_list>li {
    margin-bottom: 1rem !important;
}

.obj_issue_toc .section {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    padding: 2%;
}


/* Breadcrumb */
.cmp_breadcrumbs,
.cd-multi-steps {
    width: 100%;
    padding: 0.5em 1em;
    margin: 1em auto;
    background-color: #5e977408;
    border-radius: .25em;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.cmp_breadcrumbs::after,
.cd-multi-steps::after {
    clear: both;
    content: "";
    display: table;
}

.cmp_breadcrumbs li,
.cd-multi-steps li {
    display: inline-block;
    float: left;
    margin: 0.5em 0;
}

.cmp_breadcrumbs li::after,
.cd-multi-steps li::after {
    /* this is the separator between items */
    display: inline-block;
    content: '\00bb';
    margin: 0 .6em;
    color: #959fa5;
}

.cmp_breadcrumbs li:last-of-type::after,
.cd-multi-steps li:last-of-type::after {
    /* hide separator after the last item */
    display: none;
}

.cmp_breadcrumbs li>*,
.cd-multi-steps li>* {
    /* single step */
    display: inline-block;
    font-size: 1.4rem;
    color: #799c88;
}

.cmp_breadcrumbs li.current>*,
.cd-multi-steps li.current>* {
    /* selected step */
    color: #126839;
    font-weight: bold;
}

.no-touch .cmp_breadcrumbs a:hover,
.no-touch .cd-multi-steps a:hover {
    /* steps already visited */
    color: #96c03d;
}

.cmp_breadcrumbs.custom-icons li:not(.current):nth-of-type(2)>*::before,
.cd-multi-steps.custom-icons li:not(.current):nth-of-type(2)>*::before {
    /* change custom icon using image sprites */
    background-position: -20px 0;
}

.cmp_breadcrumbs.custom-icons li:not(.current):nth-of-type(3)>*::before,
.cd-multi-steps.custom-icons li:not(.current):nth-of-type(3)>*::before {
    background-position: -40px 0;
}

.cmp_breadcrumbs.custom-icons li:not(.current):nth-of-type(4)>*::before,
.cd-multi-steps.custom-icons li:not(.current):nth-of-type(4)>*::before {
    background-position: -60px 0;
}

.cmp_breadcrumbs.custom-icons li.current:first-of-type>*::before,
.cd-multi-steps.custom-icons li.current:first-of-type>*::before {
    /* change custom icon for the current item */
    background-position: 0 -20px;
}

.cmp_breadcrumbs.custom-icons li.current:nth-of-type(2)>*::before,
.cd-multi-steps.custom-icons li.current:nth-of-type(2)>*::before {
    background-position: -20px -20px;
}

.cmp_breadcrumbs.custom-icons li.current:nth-of-type(3)>*::before,
.cd-multi-steps.custom-icons li.current:nth-of-type(3)>*::before {
    background-position: -40px -20px;
}

.cmp_breadcrumbs.custom-icons li.current:nth-of-type(4)>*::before,
.cd-multi-steps.custom-icons li.current:nth-of-type(4)>*::before {
    background-position: -60px -20px;
}

.cmp_breadcrumbs .separator {
    display: none;
}

@media only screen and (min-width: 768px) {

    .cmp_breadcrumbs,
    .cd-multi-steps {
        padding: 0 1.2em;
    }

    .cmp_breadcrumbs li,
    .cd-multi-steps li {
        margin: 1.2em 0;
    }

    .cmp_breadcrumbs li::after,
    .cd-multi-steps li::after {
        margin: 0 1em;
    }

    .cmp_breadcrumbs li>*,
    .cd-multi-steps li>* {
        font-size: 14px;
    }
}

@media (min-width: 992px) {
    .pkp_site_name .is_img img {
        max-height: 176px;
    }

    .pkp_site_name_wrapper {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

@media (min-width: 400px) and (max-device-width:990px) {
    .homepage_atas table.desc-class {
        width: 100% !important;
    }

    .homepage_atas .image-home {
        width: 100%;
    }

    .obj_issue_toc .galleys_links {
        display: block;
    }

    .panel-index p {
        width: 30% !important;
    }

    .obj_issue_toc .galleys_links li {
        display: flow;
    }

    .pkp_footer_content {
        display: block;
    }

    .col-md-1 p {
        width: 100%;
        text-align: left;
    }

    .pkp_site_name .is_img img {
        display: none;
    }

    .pkp_screen_reader {
        display: contents;
        font-size: 1.2rem;
        color: white;
    }

    .pkp_site_name_wrapper {
        padding-left: 14%;
        padding-top: 1%;
    }
}