/* =========================
TOP BAR
========================= */

body::before{
content:"ISSN: xxxx-xxxx | eISSN: xxxx-xxxx";
display:block;
background:#1f6fd1;
color:white;
text-align:center;
font-size:13px;
padding:6px 0;
letter-spacing:.5px;
}

/* =========================
ARTICLE TYPOGRAPHY
========================= */

.obj_article_details h1{
font-size:32px;
font-weight:700;
color:#060933;
}

.obj_article_details .authors{
font-size:15px;
margin-bottom:20px;
}

.obj_article_details .abstract{
background:#f6faf7;
padding:20px;
border-radius:8px;
border-left:4px solid #1c216b;
}


/* =========================
PROFESSIONAL HERO HEADER
========================= */

.pkp_structure_head{
background:#ffffff;
border-bottom:1px solid #e5e5e5;
padding-top:15px;
padding-bottom:15px;
}

/* Journal Title */

.pkp_site_name a{
color:#1a2b24 !important;
font-size:26px;
font-weight:700;
letter-spacing:.3px;
}

/* Navigation Menu */

.pkp_navigation_primary > li > a{
color:#070b47 !important;
font-weight:500;
font-size:15px;
padding:10px 14px;
}

.pkp_navigation_primary > li > a:hover{
color:#1f6fd1 !important;
}

/* Active Menu */

.pkp_navigation_primary > li.current > a{
color:#1f6fd1 !important;
font-weight:600;
}

/* Search */

.pkp_search input{
border-radius:6px;
border:1px solid #d8e2dc;
}

/* Background Website */

body{
background:#f5f7f6;
font-family: "Segoe UI", Roboto, Arial, sans-serif;
}

/* =========================
ARTICLE CARDS
========================= */

.obj_article_summary{
background:white;
padding:22px;
border-radius:12px;
box-shadow:0 3px 10px rgba(0,0,0,0.05);
margin-bottom:20px;
transition:all .3s ease;
border:1px solid #edf1ee;
}

.obj_article_summary:hover{
transform:translateY(-4px);
box-shadow:0 8px 20px rgba(0,0,0,0.08);
}

.obj_article_summary .title{
font-size:18px;
font-weight:700;
color:#1c2e28;
margin-bottom:10px;
}

.obj_article_summary .meta{
font-size:13px;
color:#6a7c74;
}

/* =========================
SIDEBAR STYLE
========================= */

.pkp_block{
background:white;
padding:10px;
border-radius:10px;
margin-bottom:20px;
border:1px solid #e6ece8;
}

.pkp_block .title{
font-weight:700;
font-size:16px;
color:#0e1249;
margin-bottom:12px;
}


/* =========================================================
   JDITH - FULL CSS (STABLE BANNER VERSION) FOR OJS 3.5
   Banner tampil di homepage content, header dibuat clean
   ========================================================= */

/* =========================
   1. ROOT / GLOBAL
   ========================= */
:root{
  --jdith-primary: #3c51ca;
  --jdith-primary-dark: #233981;
  --jdith-primary-soft: #edf9ee;
  --jdith-secondary: #0f455b;
  --jdith-secondary-dark: #0a3745;
  --jdith-gold: #d7b04a;
  --jdith-text: #24313a;
  --jdith-muted: #6f7c86;
  --jdith-border: #e4ece6;
  --jdith-bg: #f6faf7;
  --jdith-white: #ffffff;
  --jdith-shadow-sm: 0 6px 18px rgba(0,0,0,0.05);
  --jdith-shadow-md: 0 12px 32px rgba(0,0,0,0.08);
  --jdith-shadow-lg: 0 20px 48px rgba(0,0,0,0.12);
  --jdith-radius-sm: 10px;
  --jdith-radius-md: 16px;
  --jdith-radius-lg: 22px;
  --jdith-transition: all 0.30s ease;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  background: linear-gradient(180deg, #f7fbf8 0%, #ffffff 100%);
  color: var(--jdith-text);
  line-height: 1.7;
  font-size: 15px;
}

a {
  color: var(--jdith-primary-dark);
  text-decoration: none;
  transition: var(--jdith-transition);
}

a:hover,
a:focus {
  color: var(--jdith-secondary);
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
}

/* =========================
   2. PAGE WRAPPER
   ========================= */
.pkp_structure_page {
  background: transparent;
}

.pkp_structure_content {
  padding-top: 0;
}

.pkp_structure_main:before,
.pkp_structure_main:after {
  display: none !important;
}

.pkp_structure_main {
  padding-top: 28px;
  padding-bottom: 30px;
}

/* =========================
   3. TOP USER MENU
   ========================= */
.pkp_navigation_user_wrapper {
  background: linear-gradient(90deg, #06138b 0%, #2032db 100%);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.pkp_navigation_user > li > a,
.pkp_navigation_user_register,
.pkp_navigation_user_login,
.pkp_navigation_user_wrapper a,
.pkp_search .search_prompt {
  color: #ffffff !important;
  font-size: 13px;
  font-weight: 600;
}

.pkp_navigation_user > li > a:hover,
.pkp_navigation_user_register:hover,
.pkp_navigation_user_login:hover,
.pkp_navigation_user_wrapper a:hover {
  color: #0b96a8 !important;
}

/* =========================
   4. HEADER CLEAN
   ========================= */
.pkp_structure_head {
  background: transparent;
  border-bottom: none;
  box-shadow: none;
}

/* Hilangkan teks keyword/deskripsi yang muncul di atas */
.pkp_site_name_wrapper .pkp_site_description,
.pkp_site_name_wrapper .site_description,
.pkp_site_name_wrapper .journal-description,
.pkp_site_name_wrapper .journalDescription,
.pkp_site_name_wrapper .description,
.pkp_site_name_wrapper p {
  display: none !important;
}

/* Hilangkan logo kecil bawaan OJS */
.pkp_site_name {
  display: none !important;
}

/* Header atas clean, tanpa banner image */
.pkp_site_name_wrapper {
  position: relative;
  overflow: hidden;
  padding: 0 !important;
  min-height: 120px;
  background:
    radial-gradient(circle at top right, rgba(67,182,73,0.18), transparent 30%),
    linear-gradient(135deg, #edf4ef 0%, #dfe8e2 45%, #cdd8d2 100%);
  border-bottom: none;
}

/* efek glow halus */
.pkp_site_name_wrapper:before {
  content: "";
  position: absolute;
  top: -60px;
  left: -60px;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0) 72%);
  animation: jdithFloatOne 8s ease-in-out infinite;
  pointer-events: none;
  opacity: 0.7;
}

.pkp_site_name_wrapper:after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -70px;
  width: 260px;
  height: 260px;
  background: radial-gradient(circle, rgba(67,182,73,0.18) 0%, rgba(67,182,73,0) 72%);
  animation: jdithFloatTwo 9s ease-in-out infinite;
  pointer-events: none;
  opacity: 0.7;
}

@keyframes jdithFloatOne {
  0% { transform: translate(0,0); }
  50% { transform: translate(12px,10px); }
  100% { transform: translate(0,0); }
}

@keyframes jdithFloatTwo {
  0% { transform: translate(0,0); }
  50% { transform: translate(-10px,-8px); }
  100% { transform: translate(0,0); }
}

/* =========================
   5. MAIN NAVIGATION
   ========================= */
.pkp_navigation_primary_wrapper {
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  border-bottom: 1px solid #edf2ed;
  position: relative;
  z-index: 20;
}

.pkp_navigation_primary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.pkp_navigation_primary > li > a {
  color: var(--jdith-text);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.2px;
  padding: 16px 16px;
  position: relative;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li > a[aria-expanded="true"] {
  color: var(--jdith-primary-dark);
  background: transparent;
}

.pkp_navigation_primary > li > a:after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 8px;
  height: 3px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--jdith-primary), var(--jdith-gold));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.28s ease;
}

.pkp_navigation_primary > li > a:hover:after,
.pkp_navigation_primary > li > a:focus:after,
.pkp_navigation_primary > li.current > a:after {
  transform: scaleX(1);
}

.pkp_navigation_primary .dropdown-menu {
  border: 1px solid #ebf1ec;
  border-radius: 14px;
  padding: 8px;
  box-shadow: 0 18px 38px rgba(0,0,0,0.10);
  background: #fff;
}

.pkp_navigation_primary .dropdown-menu li a {
  border-radius: 10px;
  padding: 10px 14px;
  color: var(--jdith-text);
  font-weight: 500;
}

.pkp_navigation_primary .dropdown-menu li a:hover {
  background: var(--jdith-primary-soft);
  color: var(--jdith-primary-dark);
}

/* =========================
   6. BREADCRUMB
   ========================= */
.cmp_breadcrumbs {
  background: transparent;
  border: none;
  padding: 14px 0 10px;
  font-size: 13px;
  color: var(--jdith-muted);
}

.cmp_breadcrumbs a {
  color: var(--jdith-primary-dark);
  font-weight: 500;
}

/* =========================
   7. HOMEPAGE BANNER
   ========================= */
/* Homepage image ditampilkan lagi */
.page_index_journal .homepage_image {
  display: block !important;
  background: #fff;
  border: 1px solid #ecf2ec;
  border-radius: 28px;
  box-shadow: 0 14px 38px rgba(0,0,0,0.08);
  padding: 22px;
  margin-bottom: 24px;
  position: relative;
  overflow: hidden;
}

.page_index_journal .homepage_image:before {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(67,182,73,0.10) 0%, rgba(67,182,73,0) 70%);
  pointer-events: none;
}

.page_index_journal .homepage_image img {
  display: block;
  width: 100%;
  max-width: 100%;
  border-radius: 20px;
  box-shadow: 0 14px 34px rgba(0,0,0,0.12);
}

/* =========================
   8. CONTENT CARDS
   ========================= */
.page_index_journal .current_issue,
.page_index_journal .cmp_announcements,
.page_index_journal .additional_content,
.page_issue_archive .issues_archive,
.page_issue .issue_toc,
.page_search .search_results,
.page_catalog_category .category,
.obj_article_details,
.obj_issue_details {
  background: #fff;
  border: 1px solid #ecf2ec;
  border-radius: var(--jdith-radius-lg);
  box-shadow: var(--jdith-shadow-sm);
  padding: 26px;
  margin-bottom: 24px;
}

/* =========================
   9. ABOUT / INTRO TEXT
   ========================= */
.page_index_journal .additional_content,
.page_index_journal .homepage_about {
  position: relative;
  overflow: hidden;
}

.page_index_journal .additional_content:before,
.page_index_journal .homepage_about:before {
  content: "";
  position: absolute;
  top: -60px;
  right: -60px;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(67,182,73,0.10) 0%, rgba(67,182,73,0) 70%);
  pointer-events: none;
}

.page_index_journal .additional_content p,
.page_index_journal .homepage_about p {
  font-size: 15.5px;
  color: #41505a;
  margin-bottom: 1em;
}

.page_index_journal .additional_content h2,
.page_index_journal .homepage_about h2 {
  color: var(--jdith-secondary);
  font-size: 28px;
  font-weight: 800;
  margin-bottom: 12px;
}

/* =========================
   10. SECTION TITLE
   ========================= */
.current_issue h2,
.cmp_announcements h2,
.page_index_journal h2,
.page_issue_archive h2,
.page_search h1,
.page h1,
.obj_article_details h1 {
  color: var(--jdith-secondary);
  font-weight: 800;
  letter-spacing: 0.2px;
  margin-bottom: 18px;
  position: relative;
}

.current_issue h2:after,
.cmp_announcements h2:after,
.page_index_journal h2:after,
.page_issue_archive h2:after,
.page_search h1:after,
.page h1:after,
.obj_article_details h1:after {
  content: "";
  display: block;
  width: 84px;
  height: 4px;
  margin-top: 10px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--jdith-primary), var(--jdith-gold));
}

/* =========================
   11. CURRENT ISSUE / ARTICLE CARD
   ========================= */
.current_issue .current_issue_title,
.obj_issue_summary .title,
.obj_article_summary .title {
  font-size: 21px;
  font-weight: 800;
  line-height: 1.4;
}

.current_issue .current_issue_title a,
.obj_issue_summary .title a,
.obj_article_summary .title a {
  color: var(--jdith-secondary);
}

.current_issue .current_issue_title a:hover,
.obj_issue_summary .title a:hover,
.obj_article_summary .title a:hover {
  color: var(--jdith-primary-dark);
}

.current_issue .cover img,
.obj_issue_summary .cover img {
  border-radius: 16px;
  box-shadow: 0 12px 28px rgba(0,0,0,0.10);
}

.obj_issue_summary .meta,
.obj_article_summary .meta,
.published,
.sub_item,
.item .meta,
.current_issue .published {
  color: var(--jdith-muted);
  font-size: 13px;
  line-height: 1.6;
}

.obj_article_summary,
.obj_issue_summary {
  background: linear-gradient(180deg, #ffffff 0%, #fbfdfb 100%);
  border: 1px solid #ebf1eb;
  border-radius: 18px;
  padding: 18px 20px;
  margin-bottom: 18px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.04);
  transition: var(--jdith-transition);
}

.obj_article_summary:hover,
.obj_issue_summary:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px rgba(0,0,0,0.08);
  border-color: #dceadc;
}

/* =========================
   12. ISSUE TOC
   ========================= */
.issue_toc_section h2 {
  color: var(--jdith-secondary);
  font-size: 20px;
  font-weight: 800;
  margin-top: 24px;
  margin-bottom: 14px;
  padding: 12px 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, #f3fbf4, #fbfefb);
  border: 1px solid #e4eee5;
}

.obj_article_summary .pages {
  display: inline-block;
  margin-top: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #f2f8f3;
  color: var(--jdith-primary-dark);
  font-size: 12px;
  font-weight: 700;
}

/* =========================
   13. BUTTONS GLOBAL
   ========================= */
.cmp_button,
a.cmp_button,
button,
input[type="submit"],
.cmp_form .buttons button {
  display: inline-block;
  background: linear-gradient(135deg, var(--jdith-primary-dark), var(--jdith-primary));
  color: #ffffff !important;
  border: none;
  border-radius: 999px;
  padding: 11px 18px;
  font-weight: 700;
  letter-spacing: 0.2px;
  box-shadow: 0 10px 20px rgba(35,129,58,0.18);
  transition: var(--jdith-transition);
}

.cmp_button:hover,
a.cmp_button:hover,
button:hover,
input[type="submit"]:hover,
.cmp_form .buttons button:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(35,129,58,0.24);
  background: linear-gradient(135deg, #1d6a2f, #54c85b);
  color: #ffffff !important;
}

.cmp_button_wire,
a.cmp_button_wire {
  background: #fff !important;
  color: var(--jdith-primary-dark) !important;
  border: 1px solid #d7e6d8 !important;
  box-shadow: none !important;
}

.cmp_button_wire:hover,
a.cmp_button_wire:hover {
  background: var(--jdith-primary-soft) !important;
}

/* =========================
   14. SIDEBAR
   ========================= */
.pkp_structure_sidebar {
  padding-top: 4px;
}

.pkp_block {
  background: #ffffff;
  border: 1px solid #e8efe9;
  border-radius: 16px;
  box-shadow: 0 12px 26px rgba(0,0,0,0.06);
  margin-bottom: 6px;
  overflow: hidden;
  transition: var(--jdith-transition);
}

.pkp_block:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(0,0,0,0.08);
}

.pkp_block .title {
  background: linear-gradient(135deg, #09428d, #3461dd);
  color: #fff;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  border: none;
}

.pkp_block .content {
  padding: 10px 14px 12px;
  color: #4b5861;
  font-size: 14px;
}

.pkp_block ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.pkp_block li {
  margin-bottom: 2px;
}

.pkp_block li:last-child {
  margin-bottom: 0;
}

.pkp_block a {
  display: block;
  background: linear-gradient(180deg, #fbfefb 0%, #f5fbf5 100%);
  border: 1px solid #e4eee5;
  border-radius: 12px;
  padding: 8px 10px;
  color: var(--jdith-text);
  font-weight: 600;
  position: relative;
}

.pkp_block a:hover {
  background: linear-gradient(135deg, #eef9ef, #f8fff8);
  color: var(--jdith-primary-dark);
  border-color: #cfe4d1;
  padding-left: 17px;
}

.pkp_block a:before {
  content: "›";
  color: var(--jdith-primary-dark);
  font-size: 18px;
  font-weight: 800;
  margin-right: 6px;
}

/* Search block */
.block_search .query {
  width: 100%;
  border: 1px solid #d7e3d8;
  border-radius: 999px;
  background: #fcfffc;
  padding: 11px 14px;
}

.block_search button {
  width: 100%;
  margin-top: 10px;
}

/* =========================
   15. MAKE A SUBMISSION FIX
   ========================= */
.block_make_submission {
  border: 1px solid #d7ead8;
}

.block_make_submission .content {
  background:
    radial-gradient(circle at top right, rgba(67, 103, 182, 0.12), transparent 42%),
    linear-gradient(180deg, #fcfffc 0%, #f2fbf4 100%);
  padding: 18px !important;
}

/* tombol/link make a submission harus jelas */
.block_make_submission a,
.block_make_submission .cmp_button,
.block_make_submission .content a {
  display: block !important;
  width: 100%;
  text-align: center;
  background: linear-gradient(135deg, #0f2a5b, #2a6194) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  font-weight: 800 !important;
  letter-spacing: 0.2px;
  box-shadow: 0 10px 20px rgba(15,91,87,0.18) !important;
  text-indent: 0 !important;
  opacity: 1 !important;
}

.block_make_submission a:hover,
.block_make_submission .cmp_button:hover,
.block_make_submission .content a:hover {
  background: linear-gradient(135deg, #0c2149, #10406d) !important;
  color: #ffffff !important;
  transform: translateY(-2px);
}

/* icon panah submission jangan bikin teks hilang */
.block_make_submission a:before,
.block_make_submission .content a:before {
  color: #ffffff !important;
  margin-right: 8px;
}

/* =========================
   16. FORMS
   ========================= */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
input[type="url"],
select,
textarea {
  width: 100%;
  border: 1px solid #dbe5dc;
  border-radius: 14px;
  background: #fff;
  color: var(--jdith-text);
  padding: 11px 13px;
  transition: var(--jdith-transition);
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
  border-color: var(--jdith-primary);
  box-shadow: 0 0 0 4px rgba(67,182,73,0.12);
  outline: none;
}

label {
  font-weight: 700;
  color: var(--jdith-text);
  margin-bottom: 6px;
}

/* =========================
   17. TABLES
   ========================= */
table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 18px rgba(0,0,0,0.03);
}

table th {
  background: #f1f8f2;
  color: var(--jdith-secondary);
  font-weight: 800;
  padding: 13px 14px;
  border-bottom: 1px solid #e5ede6;
}

table td {
  background: #fff;
  padding: 13px 14px;
  border-bottom: 1px solid #edf2ee;
}

/* =========================
   18. PAGINATION
   ========================= */
.cmp_pagination a,
.cmp_pagination .current {
  border-radius: 999px;
  padding: 8px 12px;
  border: 1px solid #e1e9e2;
  background: #fff;
  margin-right: 6px;
}

.cmp_pagination a:hover {
  background: var(--jdith-primary-soft);
  color: var(--jdith-primary-dark);
}

.cmp_pagination .current {
  background: linear-gradient(135deg, var(--jdith-primary-dark), var(--jdith-primary));
  color: #fff;
  border-color: transparent;
}

/* =========================
   19. ANNOUNCEMENTS
   ========================= */
.obj_announcement_summary {
  background: #fff;
  border: 1px solid #ebf1ec;
  border-radius: 18px;
  padding: 18px 20px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.04);
  margin-bottom: 16px;
  transition: var(--jdith-transition);
}

.obj_announcement_summary:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 30px rgba(0,0,0,0.07);
}

.obj_announcement_summary h3 a {
  color: var(--jdith-secondary);
  font-weight: 800;
}

.obj_announcement_summary h3 a:hover {
  color: var(--jdith-primary-dark);
}

/* =========================
   20. ARTICLE DETAIL
   ========================= */
.obj_article_details .main_entry {
  background: transparent;
}

.obj_article_details .entry_details {
  background: #fff;
  border: 1px solid #ebf1ec;
  border-radius: 18px;
  box-shadow: var(--jdith-shadow-sm);
  padding: 20px;
}

.obj_article_details .item_title {
  color: var(--jdith-secondary);
  font-weight: 800;
}

.obj_galley_link,
a.obj_galley_link {
  border-radius: 999px;
  border: none;
  background: linear-gradient(135deg, var(--jdith-primary-dark), var(--jdith-primary));
  color: #fff !important;
  box-shadow: 0 10px 18px rgba(35,129,58,0.16);
}

.obj_galley_link:hover,
a.obj_galley_link:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, #1f6d30, #57ca5d);
}

/* =========================
   21. FOOTER
   ========================= */
.pkp_structure_footer_wrapper {
  margin-top: 42px;
  background: linear-gradient(135deg, #08204d 0%, #042592 55%, #2e69d8 100%);
  color: rgba(255,255,255,0.94);
  border-top: none;
  position: relative;
  overflow: hidden;
}

.pkp_structure_footer_wrapper:before {
  content: "";
  position: absolute;
  top: -100px;
  left: -60px;
  width: 260px;
  height: 260px;
  background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0) 72%);
}

.pkp_structure_footer_wrapper:after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -90px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(215,176,74,0.14) 0%, rgba(215,176,74,0) 72%);
}

.pkp_footer_content {
  position: relative;
  z-index: 2;
  padding: 30px 20px;
  font-size: 14px;
  line-height: 1.8;
}

.pkp_footer_content a {
  color: #ddffdf;
  font-weight: 600;
}

.pkp_footer_content a:hover {
  color: #fff;
}

/* =========================
   22. ANIMATION
   ========================= */
.page_index_journal .homepage_image,
.page_index_journal .current_issue,
.page_index_journal .cmp_announcements,
.page_index_journal .additional_content,
.pkp_block,
.obj_issue_summary,
.obj_article_summary,
.obj_announcement_summary {
  animation: jdithFadeUp 0.7s ease both;
}

@keyframes jdithFadeUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =========================
   23. MOBILE
   ========================= */
@media (max-width: 991px) {
  .pkp_site_name_wrapper {
    min-height: 78px;
  }

  .pkp_navigation_primary > li > a {
    padding: 12px 14px;
    font-size: 13px;
  }

  .page_index_journal .homepage_image,
  .page_index_journal .current_issue,
  .page_index_journal .cmp_announcements,
  .page_index_journal .additional_content,
  .page_issue_archive .issues_archive,
  .page_issue .issue_toc,
  .page_search .search_results,
  .obj_article_details,
  .obj_issue_details,
  .pkp_block {
    border-radius: 16px;
    padding: 18px;
  }

  .page_index_journal .additional_content h2,
  .page_index_journal .homepage_about h2 {
    font-size: 24px;
  }

  .current_issue .current_issue_title,
  .obj_issue_summary .title,
  .obj_article_summary .title {
    font-size: 18px;
  }
}