/*
Theme Name: American Centuries
Author: the WordPress team + Juliet Jacobson + David Caldwell
Description: Built on Twenty Twenty-Two, for the new American Centuries website
Requires at least: 5.9
Tested up to: 6.3
Requires PHP: 5.6
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: americancenturies

Twenty Twenty-Two WordPress Theme, (C) 2021 WordPress.org
Twenty Twenty-Two is distributed under the terms of the GNU GPL.
*/

/*
 * Font smoothing.
 * This is a niche setting that will not be available via Global Styles.
 * https://github.com/WordPress/gutenberg/issues/35934
 */

body {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

/*
 * Text and navigation link styles.
 * Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */

a {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25ch;
}

a:hover,
a:focus {
  text-decoration-style: dashed;
}

a:active {
  text-decoration: none;
}

.wp-block-navigation .wp-block-navigation-item a:hover,
.wp-block-navigation .wp-block-navigation-item a:focus {
  text-decoration: underline;
  text-decoration-style: solid;
}

/*
 * Search and File Block button styles.
 * Necessary until the following issues are resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/36444
 * https://github.com/WordPress/gutenberg/issues/27760
 */

.wp-block-search__button,
.wp-block-file .wp-block-file__button {
  background-color: var(--wp--preset--color--primary);
  border-radius: 0;
  border: none;
  color: var(--wp--preset--color--background);
  font-size: var(--wp--preset--font-size--medium);
  padding: calc(.667em + 2px) calc(1.333em + 2px);
}

/*
 * Button hover styles.
 * Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */

.wp-block-search__button:hover,
.wp-block-file .wp-block-file__button:hover,
.wp-block-button__link:hover {
  opacity: 0.90;
}

/*
 * Alignment styles.
 * These rules are temporary, and should not be relied on or
 * modified too heavily by themes or plugins that build on
 * Twenty Twenty-Two. These are meant to be a precursor to
 * a global solution provided by the Block Editor.
 *
 * Relevant issues:
 * https://github.com/WordPress/gutenberg/issues/35607
 * https://github.com/WordPress/gutenberg/issues/35884
 */

.wp-site-blocks,
body > .is-root-container,
.edit-post-visual-editor__post-title-wrapper,
.wp-block-group.alignfull,
.wp-block-group.has-background,
.wp-block-cover.alignfull,
.is-root-container .wp-block[data-align="full"] > .wp-block-group,
.is-root-container .wp-block[data-align="full"] > .wp-block-cover {
  padding-left: var(--wp--custom--spacing--outer);
  padding-right: var(--wp--custom--spacing--outer);
}

.wp-site-blocks .alignfull,
.wp-site-blocks > .wp-block-group.has-background,
.wp-site-blocks > .wp-block-cover,
.wp-site-blocks > .wp-block-template-part > .wp-block-group.has-background,
.wp-site-blocks > .wp-block-template-part > .wp-block-cover,
body > .is-root-container > .wp-block-cover,
body > .is-root-container > .wp-block-template-part > .wp-block-group.has-background,
body > .is-root-container > .wp-block-template-part > .wp-block-cover,
.is-root-container .wp-block[data-align="full"] {
  margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  width: unset;
}

/* Blocks inside columns don't have negative margins. */
.wp-site-blocks .wp-block-columns .wp-block-column .alignfull,
.is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"],
/* We also want to avoid stacking negative margins. */
.wp-site-blocks .alignfull:not(.wp-block-group) .alignfull,
.is-root-container .wp-block[data-align="full"] > *:not(.wp-block-group) .wp-block[data-align="full"] {
  margin-left: auto !important;
  margin-right: auto !important;
  width: inherit;
}

/*
 * Responsive menu container padding.
 * This ensures the responsive container inherits the same
 * spacing defined above. This behavior may be built into
 * the Block Editor in the future.
 */

.wp-block-navigation__responsive-container.is-menu-open {
  padding-top: var(--wp--custom--spacing--outer);
  padding-bottom: var(--wp--custom--spacing--large);
  padding-right: var(--wp--custom--spacing--outer);
  padding-left: var(--wp--custom--spacing--outer);
}

body.home div.wp-site-blocks div.wp-container-7 {
  padding: 0;
}

body.home div.wp-site-blocks div.entry-content {
  margin-block-start: 0;
}
/* --------------------------------------
/* ------- WP breakpoints ---------------
/* --------------------------------------
/* $break-huge: 1440px; 
/* $break-wide: 1280px; 
/* $break-xlarge: 1080px; 
/* $break-large: 960px; // admin sidebar auto folds 
/* $break-medium: 782px;  // adminbar goes big 
/* $break-small: 600px;

/* --------------------------------------
/* --------------------------------------
 * ----- American Centuries Styles ------
/* --------------------------------------
/* --------------------------------------


/* -------------------------------- */
/* ------------ COLORS ------------ */
/* -------------------------------- 
orange: E87D00
blueberry: 3E4589
tomato: B93A03
wheat: F0D691
fog: F5F5F5
dim: D9D9D9
caption color: #727272

/* -------------------------------- */
/* FONTS
/* -------------------------------- 
font-family: 'SourceSansPro-Black’;
font-family: 'SourceSansPro-BlackItalic';
font-family: 'SourceSansPro-Bold’;
font-family: 'SourceSansPro-BoldItalic’;
font-family: 'SourceSansPro-ExtraLight’;
font-family: 'SourceSansPro-ExtraLightItalic’;
SourceSansPro-Italic
SourceSansPro-Light
SourceSansPro-LightItalic
SourceSansPro-Regular
SourceSansPro-SemiBold
SourceSansPro-SemiBoldItalic

/* -------------------------------- */
/* -- GLOBAL FEATURES & PATTERNS -- */
/* -------------------------------- */
body {
  margin: 0;
  padding: 0;
  font-family: "Source Sans Pro", sans-serif;
}

header.wp-block-template-part h1 a {
  color: #F0D691;
}

@media print {
  header.wp-block-template-part h1 a {
    color: #3E4589;
  }
}

.wp-block-post-title {
  padding-bottom: .25em;
  font-size: 2.5rem;
  line-height: 1.2em;
}

/* for menu page Gravitas titles that are too small on mobile */
@media screen and (max-width: 600px) { /* displays smaller than 600px */
  .wp-block-post-title.has-x-large-font-size.has-gravitas-font-family {
    font-size: 1.75em !important;
  }
}
/* for headings that we don't want to be all caps */
.ac-ulc {
  text-transform: none;
}

hr.wp-block-separator {
  border-bottom: 1px solid #D9D9D9;
}

.title-bar {
  background-color: #3E4589;
  color: #FFF;
  margin: 2em 0 0.25em 0;
  padding: 0.25em;
}

@media print {
  .title-bar {
    background-color: transparent;
    color: #3E4589;
  }
}

.wp-block-table td, .wp-block-table th {
  border-bottom: 1px solid #D9D9D9;
  border-top: none;
  border-left: none;
  border-right: none;
  padding-left: 0;
}

figure.ac-table table thead {
  border-bottom: 2px solid #D9D9D9;
  text-align: left;
  font-weight: 600;
}
/* for PVMA logo in global header */
.ac-logo {
  text-align: center;
}

.ac-logo a img {
  margin: 0;
}

@media print {
  .ac-logo a img {
    display: none;
  }
}

p.ac-logotype {
  font-size: 0.65em;
  line-height: 0.8em !important;
  margin: 0;
}

p.ac-logotype a {
  color: #F0D691;
  line-height: 1em !important;
  text-decoration: none;
}

@media print {
  p.ac-logotype a {
    color: #333;
  }
}

p.ac-logotype a:hover {
  text-decoration: underline;
}

.facetwp-dropdown {
  width: 100%;
  height: 2em;
}

/* ------- Search in Header -------*/
.ac-header-search {
  margin: 0 0 0 70px !important;
}

.ac-header-search-field {
  background-color: transparent;
  background-image: url("assets/images/icon-search.png");
  background-position: 1px 1px;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  border: none;
  cursor: pointer;
  font-size: 0.7em;
  height: 40px;
  margin: 3px 0;
  padding: 0 0 0 22px;
  position: relative;
  -webkit-transition: width 400ms ease, background 400ms ease;
  transition: width 400ms ease, background 400ms ease;
  width: 0px;
  cursor: pointer;
}

.ac-header-search-field:focus {
  background-color: #FFF;
  border: 1px solid #E87D00;
  cursor: text;
  outline: 0;
  width: 150px;/* this is the width of the open search field */
  color: #333;
}

.ac-header-search-form
.ac-header-search-submit { 
  display:none;
}

/* ------- Hamburger Menu --------- */
#ac-ham-menu--toggle {
  display: block;
  position: relative;
  top: 0px;
  left: 20px;
  z-index: 12;
  -webkit-user-select: none;
  user-select: none;
  float: left;
  width: 42px;
  margin-right: 24px;
}

#ac-ham-menu--toggle a {
  text-decoration: none;
  color: #3E4589;
  transition: color 0.3s ease;
}

#ac-ham-menu--toggle a:hover {
  color: #E87D00;
}

#ac-ham-menu--toggle input {
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  cursor: pointer;
  opacity: 0; /* hide this */
  z-index: 12; /* and place it over the hamburger */
  -webkit-touch-callout: none;
}

#ac-ham-menu--toggle p.ac-menu-text {
  color: #E87D00;
  font-size: .75em;
  font-weight: 600;
  letter-spacing: 0.2em;
  margin: -6px 0 0 0;
  text-transform: uppercase;
  white-space: nowrap;
}

/* hamburger icon */
#ac-ham-menu--toggle span {
  display: block;
  width: 42px;
  height: 5px;
  margin-bottom: 7px;
  position: relative;
  background: #E87D00;
  border-radius: 1px;
  z-index: 10;
  transform-origin: 4px 0px;
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#ac-ham-menu--toggle:hover span {
  background: #ffb504;
}

#ac-ham-menu--toggle span:first-child {
  transform-origin: 0% 0%;
}

#ac-ham-menu--toggle span:nth-last-child(2) {
  transform-origin: 0% 100%;
}

/* transform the slices of hamburger into a crossmark */
#ac-ham-menu--toggle input:checked ~ span {
  opacity: 1;
  transform: rotate(45deg) translate(2px, 0);
  background: #3e4589;
}

/*  and hide the middle one */
#ac-ham-menu--toggle input:checked ~ span:nth-last-child(4) {
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/* last one goes in the other direction */
#ac-ham-menu--toggle input:checked ~ span:nth-last-child(3) {
  transform: rotate(-45deg) translate(-2px, 0);
}

/* absolute positioned at the top left of the screen */
#ac-ham-menu {
  color: #3e4589;
  position: absolute;
  width: 300px;
  margin: -100px 0 0 -50px;
  padding: 50px;
  padding-top: 105px;
  background: #F5F5F5;
  border: 1px solid #D9D9D9;
  border-radius: 2px;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;/* to stop flickering of text in safari */
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

#ac-ham-menu li {
  padding: 0.25em 0;
  font-size: .9em;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}

#ac-ham-menu li.ac-ham-menu-group {
  font-weight: 600;
  border-top: 3px solid;
  margin-top: 0.5em;
}

#ac-ham-menu li.other-website {
  text-transform: capitalize;
}

/* slide it in from the left */
#ac-ham-menu--toggle input:checked ~ ul {
  transform: none;
}

/* ----- Bottom Global Navigation ------ */
footer.wp-block-template-part {
  background-color: #B93A03;
  text-align: center;
  margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  width: unset;
}

@media print {
  footer ul { display: none }
}

footer ul {
  list-style-type: none;
}

footer ul.primary-btm-menu {
    padding: 0.5em 0;
    margin-top: 2em;
}

footer ul.secondary-btm-menu {
    padding: 0 0 1em 0;
}

footer ul.primary-btm-menu li, footer ul.secondary-btm-menu li {
  color: #feedbd;
  display: inline-block;
  font-size: .8em;
}

footer ul.primary-btm-menu li a {
  border-right: 1px solid #F0D691;
  color: #feedbd;
  padding: 0 1em;
}

footer ul.primary-btm-menu li:last-child a {
  border-right: none;
}

footer ul.secondary-btm-menu li a {
  color: #feedbd;
  padding: 0 1em;
}

footer ul.secondary-btm-menu li::after {
    content: "•";  
}

footer ul.secondary-btm-menu li:last-child::after {
    content: "";  
}

footer ul.primary-btm-menu li a {
  text-transform: uppercase;
  letter-spacing: 0.025em;
}

footer p.copyright {
  color: #feedbd;
  font-size: .8em;
  padding: 1em 0 2em 0;
}

footer p.copyright a {
  color: #feedbd;
}

@media print {
  footer p.copyright, footer p.copyright a {
    color: #333;
  }
}

/* ---------- Image Captions -----*/
.wp-block-image figcaption {
  color: #727272;
  line-height: 1.2em;
  text-align: left;
}

.footnote, .image-credit {
  font-size: .8em;
  color: #727272;
  line-height: 1.2;
}

.ac-figure div img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  object-position: top;
}

.ac-figure figcaption {
  font-size: .8em;
  font-weight: 600;
}

.ac-figure figcaption a {
  font-weight: normal;
}

/* ------ Featured Image as Illustrations, ex: People, Places, Events pages -------*/
.ac-figure div {
  max-height: 40vh;
  overflow: hidden;
}

/* ---------- Breadcrumbs -------- */
.breadcrumbs, .ac-searchlink {
  font-size: .75em;
  font-weight: 600;
}

.ac-searchlink a:before {
  content: '\2190';
  font-size: 1.25em;
}

/* ------ Scrolling Panel used for AfrAm map page ------- */
.ac-scroll-panel {
  height: 80vh;
  overflow-y: scroll;
}

/* Mobile Portrait */
.ac-scroll-panel {
  @media only screen  
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
    height: 40vh;
    overflow-y: scroll;
  }
}
/* ---------- Accordians - used on oral history pages, curriculum menus, "cite this" feature -------- */
.title-bg,
.title-bg ~ .content span{
  background-color: #3E4589;
  color: white;
  cursor: pointer;
  font-weight: 600;
}

.cite-this {
  font-size: .8em;
  margin-top: 0;
}

.cite-this-title {
  color: #3E4589;
  font-weight: 600;
  padding-left: 24px !important;
}

.title-bg:hover {
  background-color: #E87D00;
}

@media print {
  .title-bg {
    background-color: transparent;
    color: #3E4589;
  }
}

div.accordian {
  clear: left;
  margin: 1em 0;
}

.accordian-content {
  background-color: white;
  color: #333333;
  width: 100%;
}

.accordian-content .accordian {
 position: relative;
 overflow: hidden;
}

.accordian-content .accordian label {
  position: relative;
  z-index: 8;
  display: block;
  padding: 0 0 0 40px;
}

.accordian-content .accordian label,
.accordian-content .accordian i.fa-circle-chevron-down {
  height: 40px;
  line-height: 40px;
}

.accordian-content .accordian i.fa-circle-chevron-down {
  color: white;
  cursor: pointer;
  position: absolute;
  z-index: 9;
  top:0;
  left:0;
  width: 40px;
  text-align: center;
  -moz-transition:all .2s linear 0s;
  -webkit-transition:all .2s linear 0s;
  transition:all .2s linear 0s;
}

.accordian-content .accordian i.cite-this-chevron {
  color: unset;
  width: 20px;
}

.accordian-content .accordian input {
  display:none;
}

.accordian-content .content {
  background-color: #F5F5F5;
  position: relative;
  overflow: hidden;
  -moz-transition: height 1s linear 0s;
  -webkit-transition: height 1s linear 0s;
  transition: height 1s linear 0s;
  height: 0;
  direction: ltr;
}

.accordian-content .content span.square { /* this makes the little down triangle */
  display: block;
  position: absolute;
  left: 10px;
  top: -17px;
  width: 20px;
  height: 20px;
  transform: rotate(45deg);
}

.accordian-content input[type="checkbox"]:checked ~ div.content {
  height: auto;
  overflow-y: scroll;
  padding: 1em;
}

.accordian-content input[type="checkbox"]:checked ~ i.fa-circle-chevron-down {
  transform: rotate(180deg);
}

ul.bio {
  margin: 0;
  padding: 1em;
  list-style-type: none;
}

ul.bio li {
  margin-bottom: 1.5em;
}

/* ---- Visual Breadcrumbs/Linkback (found on resource set item page, exhibit pages, activities pages) ---- */
div.ac-menu-linkback {
  display: inline-block;
  margin: 0;
  overflow-x: hidden;
  overflow-y: hidden;
  position: relative;
  width: 100%;
}

div.ac-menu-linkback ul {
  height: 100px;
}

ul.ac-menu-horiz-scroll {
  margin-bottom: 0;
}

div.ac-menu-linkback ul.ac-menu-horiz-scroll li.item {
  width: 60px;
  height: 60px;
}

div.ac-menu-linkback ul.ac-menu-horiz-scroll li.item a img {
  border: 1px solid #D9D9D9;
  margin-right: 1px;
  width: 60px;
}

div.ac-menu-linkback .arrow {
  width: 2em;
  top: 22%;
}

div.ac-menu-linkback ul.ac-menu-horiz-scroll li.current-item {
  background-color: #E87D00;
}

/* current item */
div.ac-menu-linkback ul.ac-menu-horiz-scroll li.current-item a img {
  mix-blend-mode: multiply;
}

/* --------- Tool Tips --------- */
.ac-menu-collection ul li a span.ac-item-tooltip, 
div.ac-menu-linkback ul.ac-menu-horiz-scroll li a span.ac-item-tooltip, 
div.ac-grid li.ac-results--item span.ac-results--item-blurb {
  background-color: white;
  border: 1px solid #D9D9D9;
  color: #333;
  display: inline-block;
  font-size: 0.75em;
  line-height: 1.2em;
  font-style: normal;
  box-shadow: 2px 2px 2px 0px #333;
  left: 0;
  padding: 0.25em;
  position: absolute;
  top: 0;
  visibility: hidden;
  white-space: break-spaces;
  width: 150px;
  z-index: 15;
}

.ac-menu-collection ul li a:hover span.ac-item-tooltip,
div.ac-menu-linkback ul.ac-menu-horiz-scroll li:hover a span.ac-item-tooltip,
li.ac-results--item:hover span.ac-results--item-blurb {
  visibility: visible;
}

.facetwp-facet input.facetwp-search {
  padding: 0px !important;
  width: 100% !important;
} */

/* --------------------------- */
/* ------ LANDING PAGE ------- */
/* --------------------------- */

/* remove the margin at the top of the main content */
body.home .wp-site-blocks > * + * {
  margin-block-start: 0;
}

.ac-landing-group {
  margin: 0;
}

/* We need to set the margin used on flex items to 0 as we have gaps in grid.  */
@supports (display: grid) {
  .ac-landing > * {
    margin: 0;
  }
}

/* displays smaller than 800px */
.ac-landing {
  display: grid;
  margin: 0;
  grid-gap: 0px;
  grid-template-columns: repeat(auto-fill, minmax(33.3333%, 1fr));
  grid-template-rows: auto auto auto 160px 160px auto;
  text-align: center;
}

/* displays larger than 800px */
@media only screen and (min-width: 800px) { 
  .ac-landing {
    grid-template-columns: repeat(auto-fill, minmax(16.6666%, 1fr));
    grid-template-rows: repeat(4, 200px);
  }
}

.ac-landing-welcome {
  grid-column: 1 / 7;
  grid-row: 1;
}

.ac-landing img.ac-landing-pic1 {
  grid-column: 1;
  grid-row: 2;
  max-width: 100%;}

.ac-landing img.ac-landing-pic2 {
  grid-column: 2;
  grid-row: 2;
  max-width: 100%;
}

.ac-landing img.ac-landing-pic3 {
  grid-column: 3;
  grid-row: 2;
  max-width: 100%;
}

.ac-landing img.ac-landing-pic4 {
  display: none;
}

.ac-landing-find {
  grid-column: 1 / 7;
  grid-row: 3;
}

.ac-landing-features.collection {
  grid-column: 1 / 2;
  background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-sw-chest.jpg");
  grid-row: 4;
}

.ac-landing-features.activities {
  background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-dressup-girl.jpg");
  grid-column: 2 / 3;
  grid-row: 4;
}

.ac-landing-features.exhibits {
  background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-1899_06_01.jpg");
  grid-column: 3 / 4;
  grid-row: 4;
}

.ac-landing-features.lessons {
  background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-chloe.jpg");
  grid-column: 1 / 2;
  grid-row: 5;
}

.ac-landing-features.expert-sets {
  background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-musicians.jpg");
  grid-column: 2 / 3;
  grid-row: 5;
}

.ac-landing-features.essays {
  background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-L01_103.jpg");
  grid-column: 3 /4 ;
  grid-row: 5;
}

.ac-landing-whats-new {
  grid-column: 1 / 7;
  grid-row: 6;
  justify-self: center;
}

/* displays larger than 800px */
@media only screen and (min-width: 800px) {
  .ac-landing-welcome {
    grid-column: 2 / 6;
    grid-row: 1;
  }

  .ac-landing-find {
    grid-column: 2 / 6;
    grid-row: 2;
  }

  .ac-landing-whats-new {
    grid-column: 2 / 6;
    grid-row: 4;
  }

  .ac-landing img.ac-landing-pic1 {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
  }

  .ac-landing img.ac-landing-pic2 {
    grid-column: 6;
    grid-row: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
  }

  .ac-landing img.ac-landing-pic3 {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
  }

  .ac-landing img.ac-landing-pic4 {
    display: unset;
    grid-column: 6;
    grid-row: 2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
  }

  .ac-landing-features.collection {
    grid-column: 1 / 2;
    grid-row: 3;
    background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-sw-chest.jpg");
    background-position: center top;
  }

  .ac-landing-features.activities {
    background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-dressup-girl.jpg");
    grid-row: 3;
    grid-column: 2 / 3;
    background-position: center top;
  }

  .ac-landing-features.exhibits {
    background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-1899_06_01.jpg");
    grid-column: 3 / 4;
    grid-row: 3;
    background-position: center top;
  }

  .ac-landing-features.lessons {
    background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-chloe.jpg");
    grid-column: 4 / 5;
    grid-row: 3;
    background-position: center top;
  }

  .ac-landing-features.expert-sets {
    background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-musicians.jpg");
    grid-column: 5 / 6;
    grid-row: 3;
    background-position: center top;
  }

  .ac-landing-features.essays {
    background-image: url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/hm-L01_103.jpg");
    grid-column: 6 / 7;
    grid-row: 3;
    background-position: center top;
  }
}

.ac-landing-welcome {
  background-color: #3E4589;
  padding: .75em 1.5em;
}

.ac-landing-find {
  background-color: #E87D00;
  padding: .75em 1.5em;
}

.ac-landing-whats-new {
  padding: .75em 1.5em;
}

.ac-landing-whats-new ul.display-posts-listing {
  list-style-type: none;
  padding: 0;
}

.ac-landing-find a:link, .ac-landing-find a:visited {
  color: white;
}

.ac-landing-find a:hover {
  color: #B93A03;
  text-decoration: underline;
}

.ac-landing-whats-new ul.display-posts-listing li {
  display: inline-block;
  float: left;
  line-height: .9em;
  margin-right: .25em;
  padding: 0.25em;
  width: 120px;
  height: 120px;
}

.ac-landing-whats-new ul.display-posts-listing li a.title {
  font-weight: 600;
  font-size: .8em;
  line-height: unset;
  text-decoration: none;
}

.ac-landing-whats-new ul.display-posts-listing li a.image img {
  width: 100%;
  height: auto;
}

.ac-landing h2 { /* sub-heads - displays smaller than 600px font is small */
  font-family:  "Gravitas", serif;
  text-transform: uppercase;
  font-size: 1em;
  letter-spacing: 0.025em;
  margin: 0;
}

 /* displays between 601 - 799px */
@media only screen and (min-width: 601px) and (max-width: 799px) {
  .ac-landing h2 {
    font-size: 1.25rem;
  }
}

/* displays larger than 800px */
@media only screen and (min-width: 800px) {
  .ac-landing h2 {
    font-size: 1.5rem;
  }
}

.ac-landing-welcome h2 {
  color: white;
}

.ac-landing p {
  color: white;
  font-size: 0.9em;
  line-height: 1.4em;
  margin: .25em;
}

@media only print {
  .ac-landing-welcome h2, .ac-landing p {
    color: #333;
  }
}

.ac-landing-features {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100%;
  text-align: center;
}

.ac-landing-features a:link, .ac-landing-features a:visited {
  color: white;
  display: block;
  font-size: 1em;
  line-height: 1.2em;
  font-weight: 600;
  text-decoration: none;
  text-transform: uppercase;
  padding-top: 35%;
}

@media only print {
  .ac-landing-features a:link, .ac-landing-features a:visited {
    color: #333;
  }
}

@media screen and (min-width: 800px) { /* displays larger than 800px */
  .ac-landing-features a:link, .ac-landing-features a:visited {
    font-size: 1.25em;
  }
}

.ac-landing-features a:hover {
  color: #E87D00;
  text-decoration: underline;
}

/* ---------- Text Animation ------ */
#spin {
  padding-left: 0.25em;
}

#spin:after {
  content:"";
  animation: spin 16s linear infinite;
}

@keyframes spin {
  0% { content: "amazing"; }
  10% { content: "surprising"; }
  20% { content: "awesome"; }
  30% { content: "intriguing"; }
  40% { content: "really old"; }
  50% { content: "to learn"; }
  60% { content: "strange"; }
  70% { content: "inspiring"; }
  80% { content: "funny"; }
  90% { content: "curious"; }
}

/* --- Search form on home page --- */
.ac-home-search input.facetwp-search {
  background-color: #eee;
  border: 1px solid lightgrey;
  border-radius: 2px;
  height: 3em;
  margin: 1em 0;
  padding-left: 0.5em;
  width: 70%;
  max-width: 400px;
}

.ac-home-search button {
  background-color: #3e4589;
  border: none;
  border-radius: 2px;
  color: white;
  cursor: pointer;
  height: 3em;
}
.ac-home-search button:hover {
  filter: brightness(75%);
  color: white;
}

/* --------------------------- */
/* ---------- MENUS ---------- */
/* --------------------------- */

/* - MENU: Horizontal list without images for sibling links - */
.ac-menu-siblings ul {
  font-size: .8em;
  padding: 0;
  margin-bottom: 1.5em;
}

.ac-menu-siblings li {
  background-color: #3e4589;
  display: inline-block;
  margin-top: 0.25em;
  margin-right: 0.25em;
  padding: 0.5em;
  white-space: nowrap;
}

.ac-menu-siblings li:last-child {
  border-right: none;
}

/* - MENU: Vertical list without images - */
.ac-menu-basic ul {
  padding: 0;
}

.ac-menu-basic ul li {
  padding: .25em 0;
  width: 100%;
}

.ac-menu-basic ul li a span, .ac-menu-basic ul li a {
  color: #3E4589;
}

.ac-menu-basic ul li a:hover, .ac-menu-basic ul li a span:hover {
  color: #E87D00;
  text-decoration-style: dashed;
}

.ac-menu-basic ul li:nth-child(odd) {
 background: #F5F5F5;
}

.ac-menu-basic ul li:nth-child(even) {
 background: #FFFFFF;
}

/* - MENU: Vertical list with images and blurb - */
.ac-menu-list ul{
  padding: 0;
  margin: 0;
  list-style-type: none;
}

.ac-menu-list ul li {
  display: block;
  line-height: 1.2em;
  overflow: auto;
  page-break-inside: avoid;
}

.ac-menu-list ul li img {
  float: left;
  margin-right: 1em;
  width: 35%;
}
/* displays larger than 400px */
@media screen and (min-width: 400px) {
  .ac-menu-list ul li img {
    width: 25%;
  }
}

.ac-menu-list ul li a span, .ac-menu-list ul li a h4 {/* for title */
  vertical-align: top;
  color: #3E4589;
  margin: 0;
  padding-top: .25em;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25ch;
}

.ac-menu-list ul li a span:hover {
  color: #E87D00;
  text-decoration-style: dashed;
}

.ac-menu-list ul li span.blurb {
  display: block;
  font-size: .8em;
  padding: 0 0 1em 0;
  margin-left: calc(35% + 1.5em);
}
/* displays larger than 400px */
@media screen and (min-width: 400px) {
  .ac-menu-list ul li span.blurb {
    margin-left: calc(25% + 1.5em);
  }
}

.ac-menu-list ul li span.blurb-nomargin {
  padding-bottom: 2em;
  display: block;
  font-size: .8em;
}

/* - MENU: Horizontal scrolling menu with images - */
div.ac-menu-horiz-wrapper {
  position: relative;
  width: 100%;
  margin: 0 auto;
  overflow-x: hidden;
  overflow-y: hidden;
}

.ac-menu-horiz-scroll {
  display: flex;
  scroll-behavior: smooth;
  overflow-x: scroll;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  padding: 0;
  box-sizing: border-box;
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.ac-menu-horiz-scroll > li, .item {
  display: inline-block;
  scroll-snap-align: center;
}

.item a {
  position: relative;
  color: white;
}

.item a img {
  width: 240px;
}

@media only print {
  .ac-menu-horiz-scroll li.item a img {
    width: 100px;
    height: 100px;
  }
}

.item a span.ac-item-title {
  background-color: rgba(0,0,0,.75);
  bottom: 0;
  font-size: 0.8em;
  font-weight: 600;
  height: 3em;
  left: 0;
  line-height: 1.2em;
  padding: 0.25em 0;
  position: absolute;
  text-align: center;
  white-space: break-spaces;
  width: 100%;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

 /* Hide scrollbar for Chrome, Safari and Opera */
.ac-menu-horiz-scroll::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.ac-menu-horiz-scroll {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.arrow {
  position: absolute;
  top: 30%;
  bottom: 0;
  border: none;
  width: 5em;
  cursor: pointer;
}

.left-arrow, .right-arrow {
  display: none;
}

/* displays larger than 600px */
@media only screen and (min-width: 600px) { 
  .left-arrow {
    background-image: url("assets/images/arrow-left.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
    display: unset;
    left: 0;
  }

  .right-arrow {
    background-image: url("assets/images/arrow-right.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
    display: unset;
    right: 0;
  }
}

.hidden {
  display: none;
}

/* -------------------------------- */
/* ----- SEARCH / FIND PAGE ------- */
/* -------------------------------- */
/* ------ Search Input Fields ----- */
.ac-search-input .facetwp-checkbox {
  font-size: .8em;
  margin-left: 1em;
}

.ac-search-input p {
  display: none;
}

input.facetwp-search {
  height: 24px;
}

.facetwp-facet {
  margin: 0 0 1em 0 !important;
}

.ac-search-input .facetwp-dropdown {
  font-size: .8em;
}

.ac-additional-filters {
  background-color: #3E4589;
  padding: .75em;
}

div.ac-additional-filters h5.wp-block-heading {
  color: white;
}

div.ac-additional-filters h6.wp-block-heading {
  color: white;
  font-size: .8em;
}

/* clear filters button */
.facetwp-reset {
  background-color: #E87D00;
  border: none;
  border-radius: 2px;
  color: white;
  cursor: pointer;
  height: 3em;
}

.facetwp-reset:hover {
  filter: brightness(75%);
}

/* ------ Date fields -------- */
.facetwp-number {
  width: 4.5em;
  margin-right: .5em;
}

.ac-date-range {
  font-weight: 400;
}       

/* --- ac-menu-results without icon on image (eg Explainers menu) --*/
ul.ac-menu-results img {
    width: 20%;
    float: left;
    margin-right: 1em;
}        

ul.ac-menu-results {
  padding: 0;
  font-size: 0;
}

/* ------ List Display (default) ------- */
ul.ac-menu-results li.ac-results--item {
  display: inline-block;
  width: 100%;
  font-size: initial;
}

ul.ac-menu-results img {
  margin-right: 1em;
}

ul.ac-menu-results li div.ac-results--item-info {
  font-size: 0.8em;
  line-height: 1.4em;
}

ul.ac-menu-results li div.ac-results--item-info span {
  display: block;
}

ul.ac-menu-results li div.ac-results--item-info span.ac-results--item-type {
  font-style: italic;
}

ul.ac-menu-results li div.ac-results--item-info span.ac-results--item-date {
  font-weight: 600;
}

/* for essays menu to indicate length of essay  */
span.ac-results—item-length {
  font-size: .85em;
  font-style: italic;
}

span.ac-results—item-length:after {
  content: " read";
}

ul.ac-menu-results h3 {
  font-size: 1em;
  margin: 0.25em 0;
  text-transform: none;
}

ul.ac-menu-results li:nth-child(even), .ac-menu-list ul li:nth-child(even) {
 background: #F5F5F5;
}

ul.ac-menu-results li:nth-child(odd), .ac-menu-list ul li:nth-child(odd) {
 background: #FFFFFF;
}

/* ------ Grid Display ------- */
/* the overall layout goes from two to one column at displays less than 782 */
/* two columns for displays smaller than 400px */
div.ac-grid li.ac-results--item {
  position: relative;
  width: 50%;
  margin-bottom: -7px;
}
/* 3 columns for displays between 401px and 500px */
@media only screen and (min-width: 401px) and (max-width: 500px) {
  div.ac-grid li.ac-results--item {
    width: 33.33%;
  }
}
/* 4 columns for displays between 501px and 999px */
@media only screen and (min-width: 501px) and (max-width: 999px) {
  div.ac-grid li.ac-results--item {
    width: 25%;
  }
}
 /* 5 columns for displays larger than 1000px */
@media only screen and (min-width: 1000px) {
  div.ac-grid li.ac-results--item {
    width: 20%;
  }
}

 /* 5 columns for printing */
@media only print {
  div.ac-grid li.ac-results--item {
    width: 20%;
  }
}

div.ac-grid li.ac-results--item div.ac-results--item-info {
 display: none;
}

div.ac-grid img {
  border: none;
  float: none;
  margin-right: 0;
  width: 100%;
}

div.ac-grid li.ac-results--item h3 {
  background-color: rgba(0,0,0,.65);
  bottom: 6px;
  color: white;
  font-size: 0.75em;
  font-weight: 600;
  left: 0;
  margin: 0;
  position: absolute;
  text-align: center;
  text-transform: capitalize;
  white-space: break-spaces;
  width: 100%;
  line-height: 1.1em;
  height: 3.4em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  padding-top: .1em;
  overflow: hidden;
}

div.ac-grid div.ac-menu-thumb {
  width: inherit;
  float: none;
  margin: 0;
}

/* ------ Grid/List Icons --------- */
#ac-icon-list, #ac-icon-grid {
  margin: 0;
}

.ac-icon {
  width: 25px;
}

#ac-icon-list:hover .ac-icon-ground, #ac-icon-grid:hover .ac-icon-ground {
  fill: #E87D00
}

.ac-icon-figure {
  fill: #D9D9D9;
}

.ac-icon-ground {
  fill: #3E4589;
}

.ac-selected .ac-icon-figure {
  fill: white;
}

/* ------ Paging Features --------- */
.facetwp-facet-pagination, .facetwp-facet-pages_found {
  font-weight: 600;
  font-size: 0.8em;
  line-height: 1.2em;
  padding-top: 4px;
}
/* features in blue band above search results */
.facetwp-page {
  display: none !important;
}

.facetwp-page.prev, .facetwp-page.next {
  display: inline-block !important;
}

@media only screen and (min-width: 800px) {
  .facetwp-page {
    display: inline-block !important;
  }
}

/* -------------------------------- */
/* COLLECTION ITEM PAGE
/* -------------------------------- */
/* to remove right margin from image viewer:
body.page-template-wp-custom-template-collection-item .wp-site-blocks {padding-right: 0px;}
*/
.mirador-mosaic .mosaic-root {
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}
.mirador-mosaic .mosaic-root .mosaic-tile {
  margin: 0px;
}

.mosaic-window-body {
  border: 1px solid #F5F5F5;
}

.MuiToolbar-root, .MuiToolbar-dense, .mirador-window-top-bar, .mui-1nhm5ev {
  border-top: unset !important;
}

@media only print {
  div.openseadragon-canvas canvas {
    height: auto !important;
    width: 100% !important;
  }
}

/* to get rid of the more link in transcription search --*/
button.mui-1fdrwej {
  display: none;
}

/*MuiToolbar-root MuiToolbar-dense mirador-window-top-bar mui-1nhm5ev*/


/* -------- Related Items --------- */
.ac-menu-related ul {
  list-style-type: none;
  padding: 0;
  font-size: .8em;
}

.ac-menu-related ul li a img {
  border: 1px solid #D9D9D9;
  margin-right: .25em;
  vertical-align: top;
  width: 60px;
}

.ac-menu-related ul li a span.ac-item-tooltip {
  display: inline-block;
  width: 80%;
  line-height: 1.2em;
}

/* --------- Item Details Tables -----*/
.ac-meta-block, .pp-meta-block {
  width: 100%;
}

.ac-meta-block td, .pp-meta-block td {
  font-size: .8em;
  height: 1.5em;
  line-height: 1.2em;
  vertical-align: top;
}

.ac-meta-block tr:nth-child(even), .pp-meta-block tr:nth-child(even) {background: #FFFFFF}
.ac-meta-block tr:nth-child(odd), .pp-meta-block tr:nth-child(odd) {background: #F5F5F5}

.ac-meta-block td:first-child, .pp-meta-block td:first-child {
  width: 30%;
  color: #3E4589;
}

.ac-pp-link {
  font-size: .8em;
  font-weight: 600;
}

/* -------------------------------- */
/* -- ONLINE COLLECTION MENU PAGE
/* -------------------------------- */

.ac-menu-collection ul {
  list-style-type: none;
  padding: 0;
}

.ac-menu-collection ul li {
  display: inline-block;
  width: 60px;
}

.ac-menu-collection ul li a {
  position: relative;
}

.ac-menu-collection ul li a img {
  border: 1px solid #D9D9D9;
  max-width: 100%;
}

/* -------------------------------- */
/* ----------- LESSONS ------------ */
/* -------------------------------- */
.lesson-info table tr td:first-child {
  width: 20%;
}

.lesson-info table tr td h5 {
  margin: 0;
}

.lesson-info table tr td code span {
  font-family: "Source Sans Pro";
}

.ac-child-count, .ac-grade-level {
  display: block;
  font-size: .8em;
  font-weight: 600;
}

a[href$=".pdf"]::after { /* puts a pdf icon after the link */
  content: "";
  background:url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/pdf.png")  right center no-repeat;
  background-size: contain;
  padding-left: 0.8em;
  margin: 0 5px 0 3px;
}

/* temporary */
a[href^="http://www.americancenturies.mass.edu"],
a[href^="http://americancenturies.mass.edu"] {  /* highlights link to old Centuries */
  background:lightseagreen;
}

.wp-site-blocks > div a[target^="_blank"]::after { /* puts an external icon after the link */
  content: "";
  background:url("https://americancenturies.org/wp-content/themes/americancenturies-2025/assets/images/external.png")  right center no-repeat;
  background-size: contain;
  padding-left: 0.8em;
  margin: 0 5px 0 3px;
}

/* -------- Oral History --------- */
.ac-oralhistory-audio-transcription {
  overflow-y: auto;
  height: 275px;
  border: thin solid #D9D9D9;
  background-color: #F5F5F5;
  padding: 0 1em .75em 1em;
  margin-bottom: 4em;
}

.ac-oralhistory-clip-title {
  font-style: italic;
  font-weight: 600;
  font-size: 1.25em;
  line-height: 1.2;
}

.ac-oh-clip h4, p.ac-oralhistory-clip-title {
  margin: 0 0 .25em 0;
}

/* -------- Essays --------------*/
.essay-body p {
  margin-bottom: 1.25em;
}

/* ------- Contact Us ----------*/
.everest-forms .everest-forms-notice--success {
  background-color: #E87D00 !important;
}

/* ------Architecture Glossary pops ----- */
#arch_glossary {
  width: 100%;
  height: 100px;
  overflow: auto;
  border: 1px dotted gray;
  padding: 2em;
  display: block;
}