/* ========================================================= IJELS CUSTOM THEME CSS OJS 3.5.x - responsive journal header Header behavior : follows the uploaded image's natural ratio Recommended image : 3125 x 625 px (OJS may display it as 1260 x 252 px) Primary palette : blue-violet gradient sampled from IJELS artwork ========================================================= */ /* === GLOBAL VARIABLES === */ :root { --ijels-primary: #2A2BA5; --ijels-primary-dark: #212292; --ijels-primary-light: #3737C1; --ijels-sky: #6868E8; --ijels-navy: #19195F; --ijels-green: #3737C1; --ijels-soft-bg: #F4F9FC; --ijels-card-soft: #F6F7FE; --ijels-border: #D9DBFF; --ijels-text: #292A42; --ijels-muted: #696A85; --ijels-white: #ffffff; --ijels-shadow: 0 6px 18px rgba(33, 34, 146, 0.09); --ijels-shadow-hover: 0 10px 26px rgba(33, 34, 146, 0.15); --ijels-radius: 14px; } /* === PAGE HEADER === */ .pkp_structure_head { width: 100%; height: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; background: var(--ijels-white) !important; border: 0 !important; box-shadow: none !important; } .pkp_head_wrapper { width: 100%; max-width: none !important; height: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } /* === OJS 3.5 HEADER IMAGE / LOGO: NATURAL-RATIO FIT === */ .pkp_site_name_wrapper { display: block !important; width: 100% !important; max-width: none !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; line-height: 0 !important; background: var(--ijels-white) !important; box-sizing: border-box; } .pkp_site_name { display: block !important; position: static !important; width: 100% !important; max-width: none !important; height: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important; line-height: 0 !important; text-align: center; } .pkp_site_name > a, .pkp_site_name .is_img { display: block !important; width: 100% !important; max-width: none !important; height: auto !important; margin: 0 !important; padding: 0 !important; line-height: 0 !important; } .pkp_site_name .is_img img, .pkp_site_name > a > img, .pkp_site_name img { display: block !important; width: 100% !important; max-width: none !important; height: auto !important; max-height: none !important; aspect-ratio: auto !important; margin: 0 auto !important; padding: 0 !important; border: 0 !important; object-fit: contain !important; object-position: center center !important; background: var(--ijels-white); box-sizing: border-box; } /* Inspect-specific rule for OJS 3.5 output: ... */ body.has_site_logo .pkp_structure_head .pkp_head_wrapper, body.has_site_logo .pkp_structure_head .pkp_site_name_wrapper, body.has_site_logo .pkp_structure_head .pkp_site_name, body.has_site_logo .pkp_structure_head .pkp_site_name > a.is_img { width: 100% !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 0 !important; } body.has_site_logo .pkp_structure_head .pkp_site_name > a.is_img > img { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 auto !important; padding: 0 !important; aspect-ratio: auto !important; object-fit: contain !important; object-position: center !important; } /* === PRIMARY NAVIGATION === */ .pkp_navigation_primary_row { width: 100%; margin: 0 !important; padding: 0 24px !important; box-sizing: border-box; background: linear-gradient( 135deg, var(--ijels-primary-dark), var(--ijels-primary), var(--ijels-primary-light) ) !important; box-shadow: var(--ijels-shadow); } .pkp_navigation_primary_wrapper { max-width: 1200px; margin: 0 auto; } .pkp_navigation_primary > li > a { color: var(--ijels-white) !important; font-weight: 600; letter-spacing: 0.2px; border-radius: 8px; transition: background-color 0.2s ease, color 0.2s ease; } .pkp_navigation_primary > li > a:hover, .pkp_navigation_primary > li > a:focus, .pkp_navigation_primary > li > a[aria-current="page"] { color: var(--ijels-white) !important; background: rgba(255, 255, 255, 0.16) !important; } .pkp_nav_list ul { margin: 0 !important; overflow: hidden; background: var(--ijels-white) !important; border: 1px solid var(--ijels-border) !important; border-radius: 10px; box-shadow: var(--ijels-shadow); } .pkp_nav_list ul a { color: var(--ijels-navy) !important; } .pkp_nav_list ul a:hover, .pkp_nav_list ul a:focus { color: var(--ijels-white) !important; background: var(--ijels-primary) !important; } /* === PAGE STRUCTURE === */ .pkp_structure_page { margin-top: 0 !important; background: var(--ijels-soft-bg); } .pkp_structure_content { background: transparent !important; } /* === LINKS AND BUTTONS === */ a { color: var(--ijels-primary-dark); } a:hover, a:focus { color: var(--ijels-primary); } .cmp_button, .pkp_button, button, input[type="submit"] { border-color: var(--ijels-primary) !important; background: linear-gradient( 135deg, var(--ijels-primary-dark), var(--ijels-primary-light) ) !important; color: var(--ijels-white) !important; border-radius: 8px; } .cmp_button:hover, .pkp_button:hover, button:hover, input[type="submit"]:hover { border-color: var(--ijels-primary-dark) !important; background: var(--ijels-primary-dark) !important; } /* === TABLE OF CONTENTS / ARTICLE CARDS === */ .obj_issue_toc .articles > li { margin-bottom: 22px; padding: 20px; background: var(--ijels-white) !important; border: 1px solid var(--ijels-border); border-left: 5px solid var(--ijels-primary); border-radius: var(--ijels-radius); box-shadow: var(--ijels-shadow); transition: transform 0.25s ease, box-shadow 0.25s ease; } .obj_issue_toc .articles > li:hover { transform: translateY(-2px); box-shadow: var(--ijels-shadow-hover); } .obj_issue_toc .articles > li .title a { color: var(--ijels-navy) !important; font-weight: 700; text-decoration: none; } .obj_issue_toc .articles > li .title a:hover, .obj_issue_toc .articles > li .title a:focus { color: var(--ijels-primary) !important; } .obj_issue_toc .section h2, .obj_issue_toc .section h3 { color: var(--ijels-navy); border-bottom-color: var(--ijels-primary-light); } /* === ARTICLE DETAILS PAGE === */ .obj_article_details .main_entry, .obj_article_details .entry_details { background: var(--ijels-white); border: 1px solid var(--ijels-border); border-radius: var(--ijels-radius); box-shadow: var(--ijels-shadow); } .obj_article_details .main_entry { padding: 20px; } .obj_article_details .entry_details { padding: 18px; } .obj_article_details .page_title, .obj_article_details h2, .obj_article_details h3 { color: var(--ijels-navy); } /* === TEXT FORMATTING === */ .description, .abstract > p, .obj_article_details .abstract p { color: var(--ijels-text); line-height: 1.75; text-align: justify; } p { line-height: 1.7; } /* === ANNOUNCEMENTS === */ .pkp_block.block_announcements, .obj_announcement_summary, .obj_announcement_full { margin-bottom: 20px; padding: 18px; background: var(--ijels-white); border: 1px solid var(--ijels-border); border-left: 5px solid var(--ijels-green); border-radius: 12px; box-shadow: var(--ijels-shadow); } .obj_announcement_summary .title a, .obj_announcement_full h1 { color: var(--ijels-navy) !important; font-size: 16px; font-weight: 700; text-decoration: none; } .obj_announcement_summary .title a:hover { color: var(--ijels-primary) !important; } .obj_announcement_summary p, .obj_announcement_full p { color: var(--ijels-text); line-height: 1.7; text-align: justify; } .obj_announcement_summary .date { color: var(--ijels-muted); font-size: 13px; } /* === ISSUE CARDS === */ .obj_issue_summary { margin-bottom: 20px; padding: 20px; background: var(--ijels-white); border: 1px solid var(--ijels-border); border-radius: var(--ijels-radius); box-shadow: var(--ijels-shadow); } .obj_issue_summary .title, .obj_issue_summary .title a { color: var(--ijels-navy) !important; font-weight: 700; } .obj_issue_summary .cover img { border: 1px solid var(--ijels-border); border-radius: 10px; box-shadow: var(--ijels-shadow); } .obj_issue_summary .description { color: var(--ijels-text); text-align: justify; } /* === SIDEBAR BLOCKS === */ .pkp_block { border-radius: 12px; } .pkp_block .title { color: var(--ijels-navy); } .pkp_block .content { color: var(--ijels-text); } /* === IJELS SUBMISSION BLOCK === */ .pkp_block.block_make_submission { overflow: hidden; padding: 0 !important; background: var(--ijels-white) !important; border: 1px solid var(--ijels-border); border-radius: var(--ijels-radius); box-shadow: var(--ijels-shadow); } .pkp_block.block_make_submission .title { display: block; margin: 0 !important; padding: 18px 20px; color: var(--ijels-white) !important; background: linear-gradient( 135deg, var(--ijels-primary-dark), var(--ijels-primary-light) ) !important; font-size: 20px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; } .pkp_block.block_make_submission .content { padding: 20px 18px; background: var(--ijels-white); } .pkp_block.block_make_submission .content a { display: block; padding: 14px 16px; color: var(--ijels-primary-dark) !important; background: var(--ijels-card-soft) !important; border: 1px solid var(--ijels-border); border-radius: 9px; font-size: 16px; font-weight: 700; text-decoration: none; transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease; } .pkp_block.block_make_submission .content a:hover, .pkp_block.block_make_submission .content a:focus { color: var(--ijels-white) !important; background: var(--ijels-primary) !important; border-color: var(--ijels-primary) !important; } /* === FACEBOOK IFRAME PLUGIN === */ ._5pat { background-color: var(--ijels-white) !important; border-radius: 10px; } /* === COOKIE BANNER === */ .ce-banner { position: fixed; z-index: 9999; top: 0; right: 0; left: 0; padding: 14px 20px; color: var(--ijels-white); background: var(--ijels-navy); box-shadow: var(--ijels-shadow); font-family: Arial, sans-serif; } a.ce-accept:link, a.ce-accept:visited { color: var(--ijels-white); text-decoration: none; } .ce-accept { float: right; margin: 6px 12px; padding: 8px 14px; color: var(--ijels-white) !important; background: linear-gradient( 135deg, var(--ijels-primary), var(--ijels-primary-light) ); border-radius: 8px; font-style: normal; font-weight: 600; } /* === REMOVE OJS FOOTER BRANDING === */ .pkp_brand_footer { display: none; } /* === DESKTOP ARTICLE LAYOUT === */ @media (min-width: 751px) { .obj_article_details .main_entry { float: right; width: 60%; border-right: none; } .obj_article_details .entry_details { float: left; width: 30%; margin-left: 30px; border-top: none; border-left: none; } } @media (min-width: 992px) { .obj_article_details .main_entry { width: 60%; } .obj_article_details .entry_details { width: 260px; } } /* === TABLET AND MOBILE === */ @media (max-width: 768px) { .pkp_structure_head, .pkp_head_wrapper, .pkp_site_name_wrapper, .pkp_site_name { width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 0 !important; } .pkp_site_name .is_img img, .pkp_site_name > a > img, .pkp_site_name img { width: 100% !important; height: auto !important; max-height: none !important; aspect-ratio: auto !important; object-fit: contain !important; object-position: center !important; } .pkp_navigation_primary_row { padding: 0 16px !important; } .obj_issue_toc .articles > li { padding: 16px; border-radius: 12px; } .obj_article_details .main_entry, .obj_article_details .entry_details { float: none; width: 100%; margin: 0 0 18px; box-sizing: border-box; } } /* === SMALL MOBILE: KEEP THE COMPLETE BANNER VISIBLE === */ @media (max-width: 480px) { .pkp_site_name .is_img img, .pkp_site_name > a > img, .pkp_site_name img { min-height: 0 !important; object-fit: contain !important; } .pkp_navigation_primary_row { padding: 0 12px !important; } }