@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300);
#cssmenu {
  position: relative;
  margin: 0;
  font-family: 'Roboto Condensed';
  line-height: 1;
  width: 250px;
}

.pkp_nav_list ul li {
    display: block;
    background: #1A7A67;
}

.pkp_site_nav_menu{
    background: #1A7A67;
}

#navigationPrimary ul>li>a:hover, #navigationPrimary ul>li>a:focus {
    color: #1A7A67;
    background: white;
}

.pkp_site_name .is_img img {
display: inline-block;
max-height: 100%;
max-width: 100%;
width: auto;
height: auto;
}

.pkp_structure_head{
    background: #1A7A67;
}

.pkp_site_name{
    background: #1A7A67;
}

.pkp_site_name_wrapper{
    background: #1A7A67;
}

.align-right {
  float: right;
}

.pkp_navigation_primary_row{
    background: #1A7A67;
}

.pkp_structure_footer_wrapper{
    background: rgba(0,0,0,0.05);
    border-top: 1px solid #ddd;
    border-bottom: 20px solid #1A7A67;
}

.pkp_head_wrapper .pkp_search .search_controls .search_prompt:before {
    color: white;
}
.pkp_head_wrapper .pkp_search.is_open .search_controls .search_prompt {
    color: black;
}

.pkp_head_wrapper .pkp_search .search_controls .search_prompt{
    color: white;
}

.pkp_head_wrapper .pkp_search .search_controls .search_prompt:hover, .pkp_head_wrapper .pkp_search .search_controls .search_prompt:focus {
    color: black;
}

#navigationPrimary>li>a:hover,
#navigationPrimary>li>a:focus {
    border-color: white;
    color: white;
}

#navigationPrimary li a{
    color: black;
}

.pkp_structure_page{
    background: #FCFCDB;
    border-color: #FAE472;
}

@media (min-width: 1200px){
    .pkp_page_index .cmp_announcements>.more:before, .pkp_page_index .cmp_announcements>.obj_announcement_summary:before {
        display: none;
    }
}

body{
    border-color: #fffbe2;
}

#cssmenu ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: block;
}

#cssmenu ul li {
  position: relative;
  margin: 0;
  padding: 0;
}

#cssmenu ul li a {
  text-decoration: none;
  cursor: pointer;
}

#cssmenu > ul > li > a {
  color: black;
  text-transform: uppercase;
  display: block;
  padding: 20px;
  border-top: 1px solid #ffffff;
  border-left: 1px solid #ffffff;
  border-right: 1px solid #ffffff;
  background: #f08619;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  letter-spacing: 1px;
  font-size: 16px;
  font-weight: bold;
  -webkit-transition: all 0.25s ease-in;
  -moz-transition: all 0.25s ease-in;
  -ms-transition: all 0.25s ease-in;
  -o-transition: all 0.25s ease-in;
  transition: all 0.25s ease-in;
  position: relative;
}

#cssmenu > ul > li:first-child > a {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

#cssmenu > ul > li:last-child > a {
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  border-bottom: 1px solid #000000;
}

#cssmenu > ul > li:hover > a,
		#cssmenu > ul > li.open > a,
		#cssmenu > ul > li.active > a {
  background: #f08619;
  color: white;
}

#cssmenu ul > li.has-sub > a::after {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-top: 13px solid #000000;
  border-botom: 13px solid transparent;
  border-left: 125px solid transparent;
  border-right: 125px solid transparent;
  left: 0;
  bottom: -13px;
  bottom: 0px;
  z-index: 1;
  opacity: 0;
  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
}

#cssmenu ul > li.has-sub > a::before {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-top: 13px solid #211201;
  border-botom: 13px solid transparent;
  border-left: 125px solid transparent;
  border-right: 125px solid transparent;
  left: 0;
  bottom: -12px;
  bottom: -1px;
  z-index: 3;
  opacity: 0;
  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
}

#cssmenu ul > li.has-sub::after {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border: 7px solid transparent;
  border-top-color: black;
  z-index: 2;
  right: 20px;
  top: 24.5px;
  pointer-events: none;
}

#cssmenu ul > li:hover::after,
		#cssmenu ul > li.active::after,
		#cssmenu ul > li.open::after {
  border-top-color: #ffffff;
}

#cssmenu ul > li.has-sub.open > a::after {
  opacity: 1;
  bottom: -13px;
}

#cssmenu ul > li.has-sub.open > a::before {
  opacity: 1;
  bottom: -12px;
}

#cssmenu ul ul {
  display: none;
}

#cssmenu ul ul li {
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
}

#cssmenu ul ul li a {
  background: #f1f1f1;
  display: block;
  position: relative;
  font-size: 15px;
  padding: 14px 20px;
  border-bottom: 1px solid #dddddd;
  color: #777777;
  font-weight: 300;
  -webkit-transition: all 0.25s ease-in;
  -moz-transition: all 0.25s ease-in;
  -ms-transition: all 0.25s ease-in;
  -o-transition: all 0.25s ease-in;
  transition: all 0.25s ease-in;
}

#cssmenu ul ul li:first-child > a {
  padding-top: 18px;
}

#cssmenu ul ul ul li {
  border: 0;
}

#cssmenu ul ul li:hover > a,
		#cssmenu ul ul li.open > a,
		#cssmenu ul ul li.active > a {
  background: #e4e4e4;
  color: #666666;
}

.pkp_block{
    padding: 10px 30px;
}

#cssmenu ul ul > li.has-sub > a::after {
  border-top: 13px solid #dddddd;
}

#cssmenu ul ul > li.has-sub > a::before {
  border-top: 13px solid #e4e4e4;
}

#cssmenu ul ul ul li a {
  padding-left: 30px;
}

#cssmenu ul ul > li.has-sub::after {
  top: 18.5px;
  border-width: 6px;
  border-top-color: #FA0D0D;
}

#cssmenu ul ul > li:hover::after,
		#cssmenu ul ul > li.active::after,
		#cssmenu ul ul > li.open::after {
  border-top-color: #FA0D0D;
}

.pkp_brand_footer{
    display: none;
}

/*
==================================================
SIJEL GLOBAL TYPOGRAPHY
Professional typography for OJS 3
==================================================
*/

/* Memuat font profesional */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');


/* ------------------------------------------------
1. FONT UTAMA SELURUH HALAMAN PUBLIK OJS
------------------------------------------------ */

html,
body,
.pkp_structure_page,
.pkp_structure_head,
.pkp_structure_content,
.pkp_structure_main,
.pkp_structure_sidebar,
.pkp_structure_footer_wrapper,
.pkp_site_name,
.pkp_site_nav_menu,
.pkp_navigation_primary,
.pkp_navigation_user,
.pkp_block,
.page,
.obj_issue_toc,
.obj_article_summary,
.obj_article_details,
.cmp_breadcrumbs,
.cmp_form,
.cmp_notification,
button,
input,
select,
textarea {
    font-family: 'Source Sans 3', 'Segoe UI', Arial, sans-serif !important;
}


/* ------------------------------------------------
2. TEKS UTAMA
------------------------------------------------ */

body {
    color: #2c3035;
    font-size: 15.5px;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 0;
}

p {
    margin-top: 0;
    margin-bottom: 14px;
    line-height: 1.65;
}

li {
    line-height: 1.6;
}


/* ------------------------------------------------
3. JUDUL DAN SUBJUDUL
------------------------------------------------ */

h1,
h2,
h3,
h4,
h5,
h6,
.page_title,
.title,
.pkp_page_title {
    font-family: 'Source Sans 3', 'Segoe UI', Arial, sans-serif !important;
    color: #20252a;
    font-weight: 650;
    line-height: 1.3;
    letter-spacing: -0.01em;
}

h1,
.page_title,
.pkp_page_title {
    font-size: 30px;
}

h2 {
    font-size: 24px;
}

h3 {
    font-size: 20px;
}

h4 {
    font-size: 17px;
}


/* ------------------------------------------------
4. NAMA JURNAL PADA HEADER
------------------------------------------------ */

.pkp_site_name,
.pkp_site_name a,
.pkp_site_name .is_text {
    font-family: 'Source Sans 3', 'Segoe UI', Arial, sans-serif !important;
    font-weight: 700;
    letter-spacing: -0.02em;
}


/* ------------------------------------------------
5. MENU NAVIGASI
------------------------------------------------ */

.pkp_navigation_primary > li > a,
.pkp_navigation_user > li > a {
    font-family: 'Source Sans 3', 'Segoe UI', Arial, sans-serif !important;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.01em;
}


/* ------------------------------------------------
6. SIDEBAR
------------------------------------------------ */

.pkp_structure_sidebar {
    font-size: 14.5px;
    line-height: 1.55;
}

.pkp_block .title {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.01em;
}


/* ------------------------------------------------
7. DAFTAR ARTIKEL DAN ISSUE
------------------------------------------------ */

.obj_article_summary .title,
.obj_article_summary .title a,
.obj_issue_toc .title,
.obj_issue_toc .title a {
    font-family: 'Source Sans 3', 'Segoe UI', Arial, sans-serif !important;
    font-weight: 650;
    line-height: 1.4;
}

.obj_article_summary .authors,
.obj_article_details .authors {
    font-size: 14.5px;
    line-height: 1.5;
}


/* ------------------------------------------------
8. ABSTRAK DAN ISI HALAMAN
------------------------------------------------ */

.obj_article_details .abstract,
.page_about,
.page_information,
.page_contact,
.page_submissions {
    font-size: 15.5px;
    line-height: 1.65;
}


/* ------------------------------------------------
9. FORM DAN TOMBOL
------------------------------------------------ */

button,
input,
select,
textarea {
    font-size: 14.5px;
}

.cmp_button,
.cmp_form .buttons button,
button.submit {
    font-family: 'Source Sans 3', 'Segoe UI', Arial, sans-serif !important;
    font-weight: 600;
    letter-spacing: 0.01em;
}


/* ------------------------------------------------
10. TAMPILAN PONSEL
------------------------------------------------ */

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

    body {
        font-size: 15px;
        line-height: 1.58;
    }

    p {
        line-height: 1.6;
    }

    h1,
    .page_title,
    .pkp_page_title {
        font-size: 25px;
    }

    h2 {
        font-size: 21px;
    }

    h3 {
        font-size: 18px;
    }

    .pkp_structure_sidebar {
        font-size: 14px;
    }
}