@charset "utf-8";
/* CSS Document */
/* This document validates as CSS level 3 + SVG on 13 Feb 2024 */
/* Saved to thor on 13 Feb 2024 */
/* Typography */
:root {
  /* Typography scale and color variables */
  --base-font-size: 16px;
  --font-weight-normal: 400;
  --line-height: 1.6em;
  --scale-minor-second: 1.067; /* Minor second scale factor */
  /* Color scheme */
  --main-brand-blue: #0057b8;
  --main-accessible-blue: #0e4a7d;
  --main-accessible-gray: #657581;
  --main-accessible-ltgray: #d2d5d8;
  --main-accessible-orange: #c25325;
  --secondary-brand-red: #C8102E;
  --landingpage-bentobox-outline-gray: #cccccc;
  --white: #ffffff;
  --black: #25282B;
  /* Font family variables */
  --font-family-OpenSans: 'Open Sans', sans-serif;
  --font-family-Merriweather: 'Merriweather', serif;
}
/* Base link colors */
--link-color: #0e4a7d;
--link-visited-color: #0e4a7d; /* Adjust if you want a different color for visited links */
--link-hover-color: darken(#2F6FA7, 10%); /* Example: Darken on hover, replace with actual color */
--link-active-color: darken(#2F6FA7, 15%); /* Example: Darken more on active, replace with actual color */
/* Background */
--link-background: transparent;
/* Scroll */
html {
  scroll-padding: 20px;
  scroll-behavior: smooth;
}
/* end scroll */
body {
  font-family: var(--font-family-OpenSans);
  font-size: var(--base-font-size);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height);
  color: var(--black); /* Primary color for body text */
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family-Merriweather);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height);
}
h1 {
  font-size: calc(var(--base-font-size) * pow(var(--scale-minor-second), 10));
  color: var(--main-accessible-orange);
  font-weight: 500;
}
h2 {
  font-size: calc(var(--base-font-size) * pow(var(--scale-minor-second), 4));
  color: var(--main-accessible-orange);
}
h3 {
  font-size: calc(var(--base-font-size) * pow(var(--scale-minor-second), 3));
  color: var(--secondary-brand-red);
}
h4 {
  font-size: calc(var(--base-font-size) * pow(var(--scale-minor-second), 2));
  color: var(--main-accessible-gray);
}
h5 {
  font-size: calc(var(--base-font-size) * pow(var(--scale-minor-second), 1));
  color: var(--black); /* Adjusted for visibility */
}
h6 {
  font-size: var(--base-font-size); /* Keeping H6 at the base font size for consistency */
  color: var(--main-accessible-ltgray);
}
a:link {
  color: var(--link-color);
  background-color: var(--link-background);
}
a:visited {
  color: var(--link-visited-color);
  background-color: var(--link-background);
}
a:hover {
  color: var(--link-hover-color);
  background-color: var(--link-background);
}
a:active {
  color: var(--link-active-color);
  background-color: var(--link-background);
}
a:focus, button:focus, input:focus, select:focus, textarea:focus {
  outline: 3px solid var(--main-accessible-blue); /* More visible than browser default */
  outline-offset: 2px;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--main-brand-blue);
  box-shadow: 0 0 0 2px rgba(0, 87, 184, 0.25);
}
hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid;
  border-color: var(--main-accessible-gray);
}
#mastheadnav {
  /*border-bottom: 1px solid var(--main-accessible-gray);*/
  margin-bottom: 15px;
}
.volIssuetext {
  font-weight: 600;
  color: var(--main-accessible-orange);
  background-color: transparent;
}
/* this ensures there will be no overlap of text and cover image in the masthead */
.grid-container {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 10px;
    align-items: center;
    padding: 10px;
} 
@media (max-width: 600px) {
    .grid-container {
        grid-template-columns: 1fr;
        text-align: center;
    }
}
/* end this ensures there will be no overlap of text and cover image in the masthead */

.pdfdownloadlink {
  font-size: 0.7em;
  margin-top: 5px;
  text-align: left;
}
#noticover {
  padding-right: 20px !important;
  max-width: 200px;
}
#issueNav {
  margin-left: 30%;
}
#mastheadText {
  display: table-cell;
  padding-left: 10px !important;
}
#mastheadText a {
  /* Your styles here */
  color: var(--main-accessible-blue); /* Example: changes link color */
  background-color: transparent;
  text-decoration: underline; /* Removes underline */
}
#mastheadText a:hover, #mastheadText a:focus {
  /* Styles for when the link is hovered over or focused */
  color: var(--main-accessible-blue); /* Example: changes link color on hover/focus */
  background-color: transparent;
  text-decoration: underline; /* Adds underline on hover/focus */
}
.sectionhead {
  color: var(--white);
  background-color: var(--main-accessible-orange);
  display: inline-block;
  padding-top: 3px;
  padding-right: 5px;
  padding-bottom: 3px;
  padding-left: 5px;
}
/* end typography */
/* Bento box grid for landing pages */
.layout-grid {
  display: grid;
  grid-template-rows: auto; /* Let the content dictate the row's height, but ensure a minimum height */
  grid-template-columns: repeat(4, 1fr); /* Four columns with equal width */
  gap: 15px; /* 15 pixel gap between the grid items */
}
/* Class for the grid items */
.grid-item {
  border: 1px solid var(--landingpage-bentobox-outline-gray); /* Border to visually separate the items*/
  border-radius: 4px;
  padding-top: 7px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
  display: flex; /* Use flexbox layout to control the main content and footer */
  flex-direction: column; /* Stack main content and footer vertically */
  min-height: 150px; /* Set a minimum height for all grid items */
}
/* First item that spans two columns */
.grid-item--double-wide {
  grid-column: 1 / span 2; /* Starts at column line 1 and spans 2 columns */
}
.item-footer {
  margin-top: auto; /* Pushes the footer to the bottom of the grid item */
  padding: 5px; /* Add some padding inside the footer */
  text-align: left; /* Flush left the footer content */
}
.card {
  display: flex;
  flex-direction: column;
  background-color: var(--white);
  border: 1px solid var(--landingpage-bentobox-outline-gray);
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  color: var(--black);
  transition: all .1s ease-in;
}
.card img {
  max-width: 100%;
  height: auto;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.card-content {
  flex-grow: 1;
  padding: 20px;
}
.card h2 {
  color: var(--main-accessible-gray);
  /*font-size: 1.9rem;*/
  margin-bottom: 15px;
}
.card p {
  margin: 10px 0;
}
.grid-item.card ul h2 {
  font-family: var(--font-family-Merriweather) !important;
}
.grid-item.card ul h2 {
  font-family: var(--font-family-Merriweather);
}
.grid-item.card li {
  margin-bottom: 15px;
  line-height: 1.3em;
}
.grid-item.card a {
  color: var(--main-accessible-blue); /* Sets link color to blue */
  background-color: transparent; /* Ensures the background is transparent */
  text-decoration: none; /* Removes underline from links */
  font-size: 1em;
  padding-right: 7px;
}
.grid-item.card a:hover {
  text-decoration: underline; /* Adds underline on hover */
}
.card-footer {
  padding: 10px;
  text-align: center;
  border-top: 1px solid #ccc;
  text-transform: uppercase;
}
/* end grid */
/* add further styles for grid items here */
/* on noti homepage, make the previous issue and next issue a little farther apart from the vol and issue info */
.list-inline .nav-right {
  margin-right: 25px;
}
.list-inline .nav-left {
  margin-left: 25px;
}
.commerceitems > .orange {
  color: var(--main-accessible-orange) !important;
}
/* end link styles */
/* well styles */
.well {
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
}
/* end well styles */
.panel .panel-heading .zip {
  border-width: 1px;
  border-style: solid;
  border-color: var(--landingpage-bentobox-outline-gray);
  padding: 6px;
  border-radius: 5px;
  margin-left: 10px;
  margin-right: 10px;
}
a[href$=".pdf"]::after {
  content: " (PDF)";
  /*font-style: italic;*/
  font-size: 0.8em
}
/* all issues dropdown list items */
.pager li > a, .pager li > span {
  display: inline-block;
  padding: 5px 14px;
  background-color: var(--white);
  border: 1px solid #fff;
  border-radius: 15px
}
.dropdown-header {
  display: block;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
  font-size: 1.3em;
  line-height: 1.42857143;
  color: var(--black);
  background-color: var(--main-accessible-ltgray);
}
.dropdown-header:focus, .pager li > a:focus, .pager li > span:focus {
  background-color: var(--main-accessible-ltgray);
  color: var(--white);
}
/* Responsive design adjustments */
@media (max-width: 768px) {
  #landingh1 {
    font-size: 2.7em;
  }
  .layout-grid {
    /* Adjust to two columns for tablet and down */
    grid-template-columns: repeat(2, 1fr);
  }
  .grid-item--double-wide {
    /* Have the double wide item span the full width on smaller screens */
    grid-column: 1 / -1;
  }
  .dropdown-header {
    font-size: 1.3em;
  }
}
@media (max-width: 480px) {
  #landingh1 {
    /*font-size: 2.7em;*/
  }
  .layout-grid {
    /* Stack the items on top of each other for mobile */
    grid-template-columns: 1fr;
  }
}
/* end Bento box grid for landing pages */
/* Left nav rail */
/* Full issues */
.aboutnoti li {
  margin-left: 10px;
  margin-right: 10px;
}
/* end left nav rail */
/* Styles for Notices home page */
/* Page header and Features title */
.page-header {
  padding-bottom: 4px;
  margin: 5px 0 5px;
  text-align: center;
  max-width: 100ch;
  margin-left: auto;
  margin-right: auto;
}
.page-header h1 small {
  line-height: 0.5em !important;
  max-width: 50%;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.7em;
  font-weight: lighter;
}
h2.sectionheader {
  text-align: center;
  color: var(--main-accessible-gray);
  font-size: 2.0em
}
/* end page header and Features title */
/* Feature articles */
#features {
  margin-bottom: 30px;
  text-align: left;
}
.panel {
  margin-bottom: 10px;
  background-color: var(--white);
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .00);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .00)
}
.panel-title {
  color: var(--main-accessible-orange);
  font-weight: 600;
}
.panel-body {
  color: var(--black);
  /*font-size: 1.1em;
  line-height: 1.5em;*/
}
.notiauthor {
  font-size: 0.8em;
  font-weight: bold;
}
/* end feature articles */
/* Collections */
/* Style the "View full collection" link */
.fullcollectionlink a {
  font-size: 0.9em;
  font-weight: 600;
  color: var(--main-accessible-orange)
}
/* end style the "View full collection" link */
/* Styles for columns Invitations, Early Carer, Education, Commentary, Latest, Secretary, Topical, Adverts */
section h2 {
  color: var(--main-accessible-orange);
  background-color: transparent;
}
section h3 {
  color: var(--main-accessible-orange);
  background-color: transparent;
  text-transform: uppercase;
  /*font-size: 1.0em;*/
}
.sectionheadertiertwo {
  /*text-transform: uppercase;*/
  font-size: 1.5em;
  border-left: 3px solid var(--main-accessible-orange);
  padding-left: 10px;
  color: var(--black);
  text-align: left;
}
.galleryColum {
  column-count: 3;
  column-gap: 40px;
  column-rule: 1px solid var(--main-accessible-gray);
  column-width: 200px;
}
.galleryColum dl {
  break-inside: avoid;
}
.galleryColum a {
  color: var(--main-accessible-blue);
  background-color: transparent;
}
.caption a {
  color: var(--main-accessible-blue);
  background-color: transparent;
}
.careerarticle {
  margin-bottom: 20px;
}
/* reduced motion for accessibility */
@media (prefers-reduced-motion: reduce) {
  .card, .card:focus, .card:hover {
    transform: none !important;
    transition: none !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3) !important;
  }
}

/* support for BS5 configuration */

.nav-link:hover {
    border-left: 2px solid #c25325;
    margin-left: 5px; /* Adds a 1px left margin on hover */
    padding-left: calc(0.7rem - 1px - 2px); /* Adjust padding to compensate for the border and margin */
    font-size: 1.2em
}
ul.galleryColum li {
    line-height: 2.0em;
}
.no-underline a {
    text-decoration: none;
}
/* Custom class to set margin-bottom on <li> elements */
.mb-li-1-6em li {
    margin-bottom: 1.0em;
}
.mb-li-1-6em li:last-child {
    margin-bottom: 0; /* Optional */
}

/* Support for Full Issues page */
/* Apply hover effect to links within the #fullissues section */
#fullissues a:hover {
    transform: translateY(-10px);
    transition: transform 0.2s ease-in-out;
}
#issueSelect:focus {
border-color: #0d6efd; /* Bootstrap primary color */
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
optgroup {
font-weight: bold;
color: #0d6efd; /* Bootstrap primary color */
}

option {
padding: 5px 10px;
}

option:hover {
background-color: #f0f0f0; /* Light grey */
}

label {
margin-bottom: 8px;
}

select {
margin-top: 4px;
}