@import url('https://fonts.googleapis.com/css2?family=Alegreya:wght@700&family=Fira+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Londrina+Solid&display=swap');

/* ===== Base ===== */
html, body {
  background: #ddd;
}

body {
  font-family: 'Fira Sans', sans-serif;
  font-size: clamp(14px, calc(14px + 2 * ((100vw - 320px) / 1006)), 16px);
  line-height: 1.7;
}

.pkp_structure_main p,
.pkp_structure_main li,
.pkp_structure_main td,
.pkp_structure_main th {
  line-height: 1.7;
}

/* ===== Header ===== */
.pkp_structure_head {
  background: rgba(0, 100, 0, 1);
}

.pkp_navigation_user_wrapper a {
  color: #fff;
}

.pkp_site_name .is_text {
  font-family: 'Londrina Solid', sans-serif;
  font-size: clamp(24px, calc(24px + 12 * ((100vw - 320px) / 1006)), 36px);
  font-weight: 400;
  line-height: 1.2;
  padding: 20px 10px;
  text-align: center;
  text-transform: none;
  text-rendering: optimizeLegibility;
  text-shadow: 0px 1px 0px rgba(255, 255, 255, .3), 0px -1px 0px rgba(0, 0, 0, .7);
}

/* ===== Sidebar and navigation ===== */
.pkp_block .title,
#navigationPrimary a {
  font-family: 'Fira Sans', sans-serif;
  font-size: 14px;
}

.block_make_submission div {
  text-align: center;
}

/* ===== Headings ===== */
/* Sizes assume the theme's 14px root font size */
.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_structure_main h4,
.pkp_structure_main h5,
.pkp_structure_main h6 {
  font-family: 'Alegreya', serif;
  font-weight: 700;
  line-height: 1.25;
}

.pkp_structure_main h1 {
  font-size: 1.9rem;
  line-height: 1.2;
}

.pkp_structure_main h2 {
  font-size: 1.5rem;
}

.pkp_structure_main h3 {
  font-size: 1.25rem;
}

/* Spacing on content pages: more space above headings than below,
   so each heading sits with the section it introduces */
.pkp_structure_main .page h1 {
  margin: 0 0 0.6em;
}

.pkp_structure_main .page h2 {
  margin: 1.8em 0 0.5em;
}

.pkp_structure_main .page h3 {
  margin: 1.5em 0 0.4em;
}

/* Page title: whichever of h1 or h2 is the first element in the page.
   Static pages have no breadcrumb above the title, so it needs its own
   top spacing and should look like a title (h2 here would otherwise
   match the section headings). Pages with a breadcrumb are unaffected
   because their title is not the first child. */
.pkp_structure_main .page > h1:first-child,
.pkp_structure_main .page > h2:first-child {
  font-size: 1.9rem;
  line-height: 1.2;
  margin: 1.2em 0 0.6em;
}

/* A section heading directly under the title needs less space above it */
.pkp_structure_main .page > h1:first-child + h2,
.pkp_structure_main .page > h2:first-child + h2 {
  margin-top: 0.8em;
}

/* ===== Lists ===== */
ul, ol, dd {
  margin: 0;
  padding: 0 0 0 2em;
}

#pkp_content_main > div > ul > li,
#pkp_content_main > div > ol > li {
  padding-left: 1em;
  margin: 0 0 0.5em;
}

#pkp_content_main li > ul,
#pkp_content_main li > ol {
  margin-top: 0.5em;
}

/* ===== Issue table of contents ===== */
.obj_issue_toc .articles,
.obj_issue_toc .published {
  margin-top: 0;
}

@media (min-width: 768px) {
  .obj_issue_toc .galleys > h2,
  .obj_issue_toc .section > h2,
  .obj_issue_toc .galleys > h3,
  .obj_issue_toc .section > h3 {
    font-size: 1.4rem;
  }
}

/* ===== Footer ===== */
.pkp_structure_footer_wrapper {
  color: #fff;
  background: #2b2b2b;
  border-top: 1px solid #ddd;
  border-bottom: 10px solid rgba(0, 100, 0, 1);
}

.pkp_footer_content {
  padding: 10px 30px;
}

.pkp_footer_content p {
  font-size: 14px;
  line-height: 24px;
}

.pkp_footer_content a {
  color: #fff;
  text-decoration: underline;
}

.pkp_brand_footer {
  display: none;
}

#wajofel-footer {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
}

#wajofel-footer img {
  max-width: 100px;
}

#wajofel-footer-cc_license {
  padding: 10px;
  text-align: center;
}

#wajofel-footer .wajofel-footer-cell {
  box-sizing: border-box;
  padding: 10px;
  color: #fff;
  text-align: center;
  flex: 1;
}

#wajofel-footer .wajofel-footer-cell:nth-child(2) {
  flex: 8;
}

#wajofel-footer .wajofel-footer-cell:nth-child(3) {
  flex: 1;
}

@media screen and (max-width: 768px) {
  #wajofel-footer {
    flex-wrap: wrap;
  }

  #wajofel-footer .wajofel-footer-cell:nth-child(2) {
    flex-basis: 100%;
  }
}

@media screen and (max-width: 660px) {
  #wajofel-footer {
    flex-flow: column;
  }

  #wajofel-footer .wajofel-footer-cell {
    flex-basis: 100%;
  }
}