/* ==========================================================================
NUST Corporate Identity overrides for the Bootstrap3 theme plugin,
built on the Flatly Bootswatch base (journal: PNUSTRW).
Flatly's stock navbar (#2C3E50) is close to NUST navy already - this
pushes it and every accent to the exact CI guide values.
Selectors target standard Bootstrap 3 classes (stable, well-documented;
Bootswatch themes only recompile variables, never the markup itself).
Source: NUST Brand Identity and House Style Guidelines, 2021/V.03
========================================================================== */
:root {
--nust-blue: #1d2758;
--nust-gold: #f6b11f;
--nust-red: #d9272d;
}
/* Typography --------------------------------------------------------------- */
/* Ropa Soft Pro requires a licensed webfont (myfonts.com). Using the
guide's approved fallback, Calibri, until that's sourced. */
body,
.navbar,
h1, h2, h3, h4, h5, h6,
.page_title, .pkp_page_title {
font-family: "Calibri", "Segoe UI", Arial, sans-serif;
}
/* Header / navbar ----------------------------------------------------------- */
.navbar,
.navbar-default,
.navbar-inverse {
background-color: var(--nust-blue) !important;
border-color: var(--nust-blue) !important;
}
.navbar-brand,
.navbar-default .navbar-brand,
.navbar-inverse .navbar-brand {
color: #ffffff !important;
}
/* Logo is an inside .navbar-brand-logo (confirmed from live source) -
cap its height so it doesn't blow out the navbar now that height:auto
is set below. */
.navbar-brand-logo img,
.navbar-brand img {
max-height: 42px;
width: auto;
}
.navbar-default .navbar-nav > li > a,
.navbar-inverse .navbar-nav > li > a {
color: #ffffff !important;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > .active > a {
color: var(--nust-gold) !important;
background-color: transparent !important;
}
/* Dropdown submenus (About, etc.) */
.navbar .dropdown-menu {
background-color: var(--nust-blue);
border-color: rgba(255, 255, 255, 0.15);
}
.navbar .dropdown-menu > li > a {
color: #ffffff !important;
}
.navbar .dropdown-menu > li > a:hover {
color: var(--nust-gold) !important;
background-color: rgba(255, 255, 255, 0.08) !important;
}
/* Search box + Register/Login in the navbar */
.navbar-form .form-control {
border-color: rgba(255, 255, 255, 0.3);
}
.navbar .btn-default {
background-color: var(--nust-gold);
border-color: var(--nust-gold);
color: var(--nust-blue);
font-weight: bold;
}
.navbar .btn-default:hover {
background-color: #ffffff;
border-color: #ffffff;
}
/* Breathing room around the logo and the right-hand nav items */
.navbar-header {
padding: 8px 16px;
}
.navbar-brand {
height: auto;
padding: 10px 16px;
}
.navbar-nav > li > a {
padding-top: 18px;
padding-bottom: 18px;
}
/* Sticky footer: on short pages (the journal homepage, an empty Archives
list) the footer floated partway up the window with white below it.
.pkp_structure_page wraps header + content + footer, so making it a
full-height column and letting the content region absorb the slack
pins the footer to the bottom without changing normal long pages. */
.pkp_structure_page {
display: flex;
flex-direction: column;
min-height: 100vh;
}
.pkp_structure_page > .pkp_structure_content {
flex: 1 0 auto;
}
.pkp_structure_page > .footer,
.pkp_structure_page > #footer {
flex-shrink: 0;
}
/* Page content --------------------------------------------------------------- */
/* The theme puts main content in col-md-8 and reserves the remaining third
for a sidebar. No sidebar content is configured on this journal, so that
third renders empty and the content looks squeezed to the left.
REMOVE THIS BLOCK if a sidebar is ever enabled, or the sidebar will wrap
underneath the content instead of sitting beside it. */
.pkp_structure_content .pkp_structure_main {
width: 100%;
float: none;
}
a {
color: var(--nust-blue);
}
a:hover {
color: var(--nust-red);
}
.btn-primary {
background-color: var(--nust-blue) !important;
border-color: var(--nust-blue) !important;
}
.btn-primary:hover,
.btn-primary:focus {
background-color: var(--nust-red) !important;
border-color: var(--nust-red) !important;
}
/* Footer ---------------------------------------------------------------------- */
#footer,
.footer {
background-color: var(--nust-blue) !important;
color: #ffffff;
width: 100%;
}
#footer a,
.footer a {
color: var(--nust-gold);
}
/* Social icon row.
The icons live HERE, as CSS background images, NOT in the Page Footer
HTML. OJS sanitises that field against an allowed-tags list that does
not include