@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=DynaPuff:wght@400..700&display=swap');

:root {
  --main-logo-img: url('/content/_theme_images/default_logo.jpg');
  --main-logo-sizing: auto;
  --background-1: #FFFFFF;
  --dark-background-1: #000025;
  --background-2: #FCFCFC;
  --dark-background-2: #292929;
  --background-3: #F4F4F4;
  --dark-background-3: #1E1E1E;
  --header-1: #678D98;
  --dark-header-1: #FFFFFF;
  --header-2: #343479;
  --dark-header-2: #7171A1;
  --small-headers: #000000;
  --dark-small-headers: #FFFFFF;
  --paragraph: #000000;
  --dark-paragraph: #FFFFFF;
  --links: #678D98;
  --power-color-1-foreground: #FFFFFF;
  --power-color-1: #343479;
  --power-color-2-foreground: #ffffff;
  --power-color-2: #668a38;
  --power-color-3-foreground: #000000;
  --power-color-3: #678d98;
  --power-color-4-foreground: #000000;
  --power-color-4: #c2ac80;
  --power-color-5-foreground: #FFFFFF;
  --power-color-5: #5b4a42;
  --power-color-6-foreground: #000000;
  --power-color-6: #658A38;
  --power-color-7-foreground: #000000;
  --power-color-7: #678d98;
  --secondary-architecture: #010852;
  --dark-secondary-architecture: #A4A9E1;
  --image-placeholder-color: orange;
  --primary-header-font: 600 24px/32px 'Rubik', 'Verdana',sans-serif;
  --primary-header-font-variant: uppercase;
  --secondary-header-font: 600 20px/26px 'Roboto Slab', 'Arial',sans-serif;
  --secondary-header-font-variant: uppercase;
  --small-header-font: 500 15px/17px 'Roboto Slab', 'Arial',sans-serif;
  --small-header-font-variant: uppercase;
  --nav-text-font: 300 12px/14px 'Rubik', 'Arial',sans-serif;
  --paragraph-font: 300 14px/17px 'Rubik', 'Arial',sans-serif;
  --secondary-button-fonts: 400 13px/15px 'Rubik', 'Verdana',sans-serif;
}
/*======site-specific css======*/

	a[href*="//"]:not(.skip-offsite):not([href*="https://rosellepld.org/"]):after {
		content: "";
		width: 11px;
		height: 11px;
		margin: 0 0 0 3px;
		mask-image: url('/content/_theme_images/icon_external-link.svg');
		mask-repeat: no-repeat;
		mask-size: cover;
		display: inline-block;
		position: relative;
		z-index: 10;
	}
	.dark-mode a[href*="//"]:not(.skip-offsite):not([href*="https://rosellepld.org/"]):after{
		
	}
/*======end site-specific css======*/
/********//*======================================================================
    GLOBAL - styles | desktop
========================================================================*/
/*---------------------------------------------------------------------------------------------------
Global Fonts
font-family: "Inter Tight", sans-serif; (100,200,300,400,500,600,700,800) | (normal,italic)
----------------------------------------------------------------------------------------------------*/
* {
    box-sizing: border-box;
}
html {
    --theme-logo-img: url("/content/_site_images/roselle-logo.svg");
    --theme-primary-color-1: #EA4C32;
    --theme-primary-color-2: #153A45;
    --theme-primary-color-3: #A3DAD6;
    --theme-primary-color-4: #E5FE74;
    --theme-primary-color-4-dark-mode: #94ac28;
    --theme-primary-color-5: #ffbad0; /* pink was #EF87A8 */
    --theme-secondary-color-1: #F4F4F4;
    --theme-secondary-color-2: #023B46;
    --theme-secondary-color-3: #D3F1EF;
    --theme-secondary-color-4: #003B46;
    --theme-secondary-color-5: #EBEBEB;
    --theme-secondary-color-6: #C5C5C5;
    --theme-secondary-color-7: #658D94;
    --theme-secondary-color-8: #FFE5EE;
    --theme-secondary-color-9: #E2F5F3;
    --theme-default-bg: url(/content/_site_images/icon_lighten-repeat.svg) repeat;
    --theme-default-color: var(--theme-primary-color-3);
    --site-logo-container-width: 425px;
    --site-logo-height: 47px;
    --font-header-1: normal 600 35px / 42px "Inter Tight", sans-serif;
    --font-header-2: normal 600 30px / 36px "Inter Tight", sans-serif;
    --font-header-3: normal 600 26px / 31px "Inter Tight", sans-serif;
    --font-header-4: normal 600 22px / 26px "Inter Tight", sans-serif;
    --font-header-5: normal 600 18px / 21px "Inter Tight", sans-serif;
    --font-header-color: #003B46;
    --font-color-site-navigations: #003B46;
    --font-panels-subheader: normal 700 15px / 19px "Inter Tight", sans-serif;
    --font-panels-access-option: normal 400 15px / 19px "Inter Tight", sans-serif;
    --font-main-navigation: normal 500 14px / 15px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-media: normal 600 28px / 30px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-color: #003B46;
    --font-main-navigation-dropdown-heading: italic 500 13px / 16px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-list: normal 500 14px / 17px "Inter Tight", sans-serif;
    --font-utility-navigation: normal 300 12px / 15px "Inter Tight", sans-serif;
    --font-utility-navigation-dropdown: normal 500 13px / 17px "Inter Tight", sans-serif;
    
    
    --top-search-input-border-color: rgba(0,59,70,0.22);
    --font-top-search-input: normal 600 14px / 17px "Inter Tight", sans-serif;
    --font-top-search-results: normal 300 14px / 17px "Inter Tight", sans-serif;
    --font-top-search-results-color: #34626B;
    --font-top-search-results-heading: normal 500 24px / 29px "Inter Tight", sans-serif;
    --font-top-search-results-title: normal 400 17px / 20px "Inter Tight", sans-serif;
    
    --font-subheader: normal 300 14px / 16px "Inter Tight", sans-serif;
    --font-alert: normal 400 15px / 19px "Inter Tight", sans-serif;
    --alert-announcement-color: var(--theme-primary-color-4);
    --alert-emergency-color: var(--theme-primary-color-1);
    --alert-closing-color: var(--theme-primary-color-5);
    --font-body: normal 400 18px / 26px "Inter Tight", sans-serif;
    --font-body-color: #003B46;
    --font-body-opt-color: #fff;
    --font-body-alt-color: #0D0D0D;
    --font-body-intro-color: #34626B;
    --font-body-intro: italic 600 18px / 24px "Inter Tight", sans-serif;
    --font-body-attribution: normal 300 16px / 23px "Inter Tight", sans-serif;
    --font-event-date: normal 300 15px / 19px "Inter Tight", sans-serif;
    --font-link: var(--font-body);
    --font-link-color: #AD1501; /* was #FE391F */
    --font-ordered-list-marker: normal 600 18px / 26px "Inter Tight", sans-serif;
    --font-ordered-list-marker-color: #AD1501; /* was #FE391F */
    --font-select: normal 400 14px / 22px "Inter Tight", sans-serif;
    --font-color-select: #4C4C4C;
    --font-figcaption: normal 300 15px / 19px "Inter Tight", sans-serif;
    --select-bg-image: url(/content/_theme_images/icon_select-downarrow.svg) no-repeat calc(100% - 7px) center;
    --select-bg-color: #fff;
    --preload-cover-bg-color: var(--theme-secondary-color-4);
    --font-form-label: 600 18px / 22px "Inter Tight", sans-serif;
    --font-form-input: 400 14px / 16px "Inter Tight", sans-serif;
    --font-form-border-color: #D1D1D1;
    --font-acc-container: 600 18px / 22px "Inter Tight", sans-serif;
    --font-pullquote: 400 22px / 30px "Inter Tight", sans-serif;
    --font-pullquote-author: 500 18px / 25px 'Tahoma';
    --font-pullquote-author-title: 400 16px / 21px 'DM Sans';
    --font-tag-list: normal 300 12px / 14px "Inter Tight", sans-serif;
    --font-table-head: normal 600 18px / 22px "Inter Tight", sans-serif;
    --font-table-cell: normal 400 18px / 26px "Inter Tight", sans-serif;
    --font-eresource-entry: normal 300 16px / 23px "Inter Tight", sans-serif;
    --font-filter-label: normal 500 14px / 22px "Inter Tight", sans-serif;
    --font-event-bucket-body: normal 400 15px / 19px "Inter Tight", sans-serif;
    --font-button: normal 500 14px / 17px "Inter Tight", sans-serif;
    --font-prompt-button: normal 400 13px / 16px "Inter Tight", sans-serif;
    --font-button-color: #FFFFFF;
    --button-bg-color: #003B46;
    --button-hover-bg-color: #63878D;
    --font-secondary-button-color: #003B46;
    --button-secondary-bg-color: #FFFFFF;
    --button-secondary-hover-bg-color: #F0F2F2;
    --body-bg-color: #FCFCFC;
    /*--body-barrens-bg-color: var(--theme-secondary-color-3);*/
    --body-barrens-bg-color: #E9F8F7;
    --body-barrens-border-color: transparent;
    --body-barrens-border-opacity: 0;
    --wedge-height: 22px;
    --wedge-margin: 33px 0;
    --wedge-color: var(--body-barrens-border-color);
    --font-overflow-segment-perk-header: normal 400 25px / 35px "Inter Tight", sans-serif;
    --font-overflow-segment-benefit-body: normal 400 15px / 17px "Inter Tight", sans-serif;
    --font-overflow-segment-donation-heading: normal 400 28px / 30px "Inter Tight", sans-serif;
    --font-overflow-segment-donation-details: normal 400 15px / 18px "Inter Tight", sans-serif;
    --overflow-segment-width: calc(100% + 55px);
    --overflow-segment-maximum-width: 1490px;
    --overflow-segment-offset: -25px;
    --overflow-segment-media-max-width: 50%;
    --overflow-segment-media-ratio: 1.1 / 1;
    --overflow-segment-gradient-color-1: #A34A3F;
    --overflow-segment-gradient-color-2: #813A31;
    --font-full-segment-filter-item: normal 400 14px / 16px "Inter Tight", sans-serif;
    --font-full-segment-author: normal 400 13px / 14px "Inter Tight", sans-serif;
    --font-event-list-month: normal 400 14px / 16px "Inter Tight", sans-serif;
    --font-event-list-day: normal 400 20px / 20px "Inter Tight", sans-serif;
    --font-event-list-details: normal 400 16px / 18px "Inter Tight", sans-serif;
    --font-materials-header: normal 600 14px / 16px "Inter Tight", sans-serif;
    --font-materials-favorite: normal 400 10px / 12px "Inter Tight", sans-serif;
    --font-materials-favorite-color: #FFFFFF;
    --font-materials-description: normal 300 13px / 15px "Inter Tight", sans-serif;
    --font-staff-item-info: normal 400 14px / 17px "Inter Tight", sans-serif;
    --font-staff-discussion-question: normal 600 20px / 26px "Inter Tight", sans-serif;
    --font-book-item-author: normal 300 14px / 18px "Inter Tight", sans-serif;
    --discover-by-bg-color: var(--theme-secondary-color-9);
    --discover-by-tag-bg-color: #F4F4F4;
    --font-game-players: normal 300 14px / 16px "Inter Tight", sans-serif;
    --font-return-to-link: normal 400 14px / 18px "Inter Tight", sans-serif;
    --font-context-navigation-heading: normal 600 16px / 17px "Inter Tight", sans-serif;
    --font-context-navigation-group-heading: italic 500 14px / 15px "Inter Tight", sans-serif;
    --font-context-navigation-list-item: normal 500 14px / 15px "Inter Tight", sans-serif;
    --font-lineage-sub-heading: italic 500 12px / 15px "Inter Tight", sans-serif;
    --font-lineage-body: normal 400 14px / 18px "Inter Tight", sans-serif;
    --font-footer-sitemap-secondary: normal 500 14px / 17px "Inter Tight", sans-serif;
    --font-footer-sitemap-tertiary: normal 400 12px / 15px "Inter Tight", sans-serif;
    --font-footer-sitemap-header: italic 500 12px / 15px "Inter Tight", sans-serif;
    --swiper-pagination-bottom: 0;
    --swiper-pagination-bullet-size: 18px;
    --swiper-pagination-bullet-horizontal-gap: 0;
    --swiper-pagination-bullet-border-radius: 50%;
    --swiper-pagination-color: rgba(0,59,70,1);
    --swiper-pagination-bullet-inactive-opacity: 1;
    --swiper-pagination-bullet-inactive-color: rgba(0,59,70,0);
    --swiper-pagination-bullet-border-color: var(--theme-secondary-color-4);
    --brand-border-color: #000;
    --skeleton-color: rgba(211,211,211,1);
    --overlay-bg-color: var(--theme-secondary-color-9);
}
@media only screen and (max-width: 1490px) {
    html {
        --overflow-segment-maximum-width: 100vw;
        --overflow-segment-offset: calc(((100vw - 1440px) / 2) * -1); 
    }
}
@media only screen and (min-width: 1440px) {
    html {
        --body-barrens-border-opacity: 1;
    }
}
@media only screen and (max-width: 1440px) {
    html {
        --overflow-segment-width: 100%;
        --overflow-segment-maximum-width: none;
        --overflow-segment-offset: 0; 
        /*--overflow-segment-transform: translateX(var(--overflow-segment-offset));*/
    }
}
html:has(body.site-loaded) {
    scroll-behavior: smooth;
}
:root {
    /*lightmode */
    /*--desktop-light-logo:  var( --main-logo-img, "/_theme_images/default_logo.jpg");*/
    /*
    --desktop-light-logo:  var("/_theme_images/default_logo.svg");
    --tablet-light-logo: var( --main-logo-tablet-img, var(--desktop-light-logo) );
    --mobile-light-logo: var( --main-logo-mobile-img, var(--tablet-light-logo) );
    */
    
    /*darkmode*/
    /*
    --desktop-dark-logo:  var(--main-logo-darkmode-img);
    --tablet-dark-logo: var( --main-logo-tablet-darkmode-img, var(--desktop-dark-logo) );
    --mobile-dark-logo: var( --main-logo-mobile-darkmode-img, var(--tablet-dark-logo) );
    */
    
    /*default to lightmode (eeeeeeewwwwwww) */
    /*
    --desktop-logo:  var( --desktop-light-logo);
    --tablet-logo: var( --tablet-light-logo, var(--desktop-logo) );
    --mobile-logo: var( --mobile-light-logo, var(--tablet-logo) );
    
    --current-logo-image: var(--desktop-logo);
    --current-logo-width: 252px;
    --current-logo-height: 160px;
    */
}

/*======================================================================
    Accessibility - styles
=======================================================================*/
/*---------------------------------- Accessibility > Dark Mode ----------------------------------*/
body.dark-mode {
    /*switch to darkmode!*/
    --desktop-logo:  var( --desktop-dark-logo, var(--desktop-light-logo));
    --tablet-logo: var( --tablet-dark-logo, var(--tablet-light-logo, var(--desktop-logo) ) );
    --mobile-logo: var( --mobile-dark-logo, var(--mobile-light-logo, var(--tablet-logo)  ) );
    
    /*think we need to override since it probably will point to lightmode desktop otherwise*/
    --current-logo-image: var(--desktop-logo);
    --image-placeholder-icon-color: #aaaaaa;
}
/* dark mode updates: */
html:has(body.dark-mode) {
    --theme-logo-img: url("/content/_site_images/roselle-logo-dm.svg");
    --theme-primary-color-1: #CB2E15;
    --theme-primary-color-2: #9ED1E0;
    --theme-primary-color-3: #135C5F;
    --theme-primary-color-4: #B3DB00;
    --theme-primary-color-5: #B90041;
    --theme-secondary-color-1: #004956;
    --theme-secondary-color-2: #01242B;
    --theme-secondary-color-3: #135C5F;
    --theme-secondary-color-4: #135C5F;
    --theme-secondary-color-5: #1C1C1C;
    --theme-secondary-color-6: #003B46;
    --theme-secondary-color-7: #517176;
    --theme-secondary-color-8: #660025;
    --theme-secondary-color-9: #135C5F;
    --theme-default-bg: url(/content/_site_images/icon_darken-repeat.svg) repeat;
    /*--theme-default-color: var(--theme-primary-color-3);*/
    
    /*--alert-announcement-color: var(--theme-primary-color-4);*/
    /*--alert-emergency-color: var(--theme-primary-color-1);*/
    /*--alert-closing-color: var(--theme-primary-color-5);*/
    
    --font-header-color: #FFFFFF;/* was #135C5F */
    --font-color-site-navigations: #FFFFFF;/* was #135C5F */
    --font-main-navigation-dropdown-color: #FFFFFF;/* was #135C5F */
    
    --font-body-color: #FFFFFF;/* was #135C5F */
    --font-body-opt-color: #FFFFFF;
    --font-body-alt-color: #FFFFFF;
    --font-body-intro-color: #9C9C9C;
    /*--font-link: var(--font-body);*/
    --font-link-color: #CCCCCC; /* was #D51A01 */
    --font-ordered-list-marker-color: #D51A01;
    --font-color-select: #ADADAD;
    /* unchanged */--select-bg-image: url(/content/_theme_images/icon_select-downarrow.svg) no-repeat calc(100% - 7px) center;
    --select-bg-color: #000;
    --font-form-border-color: #D4D4D4;
    --font-button-color: #FFFFFF;
    --button-bg-color: #001B20;
    --button-hover-bg-color: #547478;
    --font-secondary-button-color: #FFFFFF;
    --button-secondary-bg-color: #001B20;
    --button-secondary-hover-bg-color: #1D2020;
    --body-bg-color: #002F38;
    /*--body-barrens-bg-color: var(--theme-secondary-color-3);*/
    /*--body-barrens-border-color: transparent;*/
    /*--wedge-color: var(--body-barrens-border-color);*/
    /*--discover-by-bg-color: #E2F5F3;*/
    --discover-by-tag-bg-color: #002F38;
    /* unchanged */--swiper-pagination-color: rgba(255, 255, 255, 0.34);
    /* unchanged */--swiper-pagination-bullet-inactive-opacity: 1;
    /* unchanged */--swiper-pagination-bullet-inactive-color: rgba(255, 255, 255, 0);
    /* unchanged */--swiper-pagination-bullet-border-color: #FFFFFF;
    --brand-border-color: #fff;
    --skeleton-color: rgba(100,100,100,1);
    /*--overlay-bg-color: #E2F5F3;*/
    
    --main-logo-img: var(--desktop-dark-logo);
}
html:has(body.dark-mode) hr:before, html:has(body.dark-mode) hr:after {
    border-color: #93DCD7;
}
html:has(body.dark-mode) .pullquote:before {
    background-image: url('data:image/svg+xml,<svg width="20px" height="17px" viewBox="0 0 20 17" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Page-Layouts" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><path d="M6.30957032,16.9526367 L9.36035156,0 L5.06152344,0 L0,16.9526367 L6.30957032,16.9526367 Z M16.8833008,16.9526367 L19.9340821,0 L15.6352539,0 L10.5737305,16.9526367 L16.8833008,16.9526367 Z" id="“" fill="%23FFFFFF" fill-rule="nonzero"></path></g></svg>');
}
html:has(body.dark-mode) header .main-navigation ul.nav-list li.search-option a {
    background-color: #001B20;
}
html:has(body.dark-mode) .tag-list li a, html:has(body.dark-mode) .tag-list li .tag {
    border-color: var(--font-body-color);
}
html:has(body.dark-mode) .tag-list li.active a, html:has(body.dark-mode) .tag-list li.active .tag {
    border-color: transparent;
}
html:has(body.dark-mode) .slider-container .swiper-button-prev:before, html:has(body.dark-mode) .slider-container .swiper-button-next:before {
    background-image: url(/content/_theme_images/icon_slider-arrow-darkmode.svg);
}
html:has(body.dark-mode) .acc-container details summary:before {
    /*background-image: url('data:image/svg+xml,<svg width="11px" height="5px" viewBox="0 0 11 5" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Page-Layouts" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Group" transform="translate(1.000000, 0.000000)" stroke="%23135C5F" stroke-width="0.5"><polyline id="Combined-Shape" points="0 0 4.6558267 4.6558267 9.3116534 0"></polyline></g></g></svg>');*/
    background-image: url('data:image/svg+xml,<svg width="11px" height="5px" viewBox="0 0 11 5" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Page-Layouts" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Group" transform="translate(1.000000, 0.000000)" stroke="%23FFFFFF" stroke-width="0.5"><polyline id="Combined-Shape" points="0 0 4.6558267 4.6558267 9.3116534 0"></polyline></g></g></svg>');
}
html:has(body.dark-mode) .lineage-container .lineage-content:after {
    background: url(/content/_site_images/icon_darken-repeat.svg) repeat;
    opacity: 1;
}
html:has(body.dark-mode) footer .footer-details {
    /*background-image: url(/content/_site_images/icon_lighten-repeat.svg);*/
    background-color: var(--theme-secondary-color-2);
}
/*html:has(body.dark-mode) footer .footer-details a.button-like.secondary {*/
/*    border-color: transparent;*/
/*}*/
.dark-mode .eresources-section .eresource-entities .eresource .eresource-media {
    background-color: #AAAAAA;
}
/*---------------------------------- Accessibility > Bigger Text ----------------------------------*/
/* for this option we just increase all know font variables +3 of their original value */
html:has(body.bigger-text) {
    --font-header-1: normal 600 38px / 45px "Inter Tight", sans-serif;
    --font-header-2: normal 600 33px / 39px "Inter Tight", sans-serif;
    --font-header-3: normal 600 29px / 34px "Inter Tight", sans-serif;
    --font-header-4: normal 600 25px / 29px "Inter Tight", sans-serif;
    --font-header-5: normal 600 21px / 24px "Inter Tight", sans-serif;
    --font-panels-subheader: normal 700 18px / 22px "Inter Tight", sans-serif;
    --font-panels-access-option: normal 400 18px / 21px "Inter Tight", sans-serif;
    --font-main-navigation: normal 500 17px / 18px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-media: normal 600 31px / 33px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-heading: italic 500 16px / 19px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-list: normal 500 17px / 20px "Inter Tight", sans-serif;
    --font-utility-navigation: normal 300 15px / 18px "Inter Tight", sans-serif;
    --font-utility-navigation-dropdown: normal 500 16px / 20px "Inter Tight", sans-serif;
    --font-top-search-input: normal 600 17px / 20px "Inter Tight", sans-serif;
    --font-top-search-results: normal 300 17px / 20px "Inter Tight", sans-serif;
    --font-top-search-results-heading: normal 500 27px / 32px "Inter Tight", sans-serif;
    --font-top-search-results-title: normal 400 20px / 23px "Inter Tight", sans-serif;
    --font-subheader: normal 300 17px / 19px "Inter Tight", sans-serif;
    --font-alert: normal 400 18px / 22px "Inter Tight", sans-serif;
    --font-body: normal 400 21px / 29px "Inter Tight", sans-serif;
    --font-body-intro: italic 600 21px / 27px "Inter Tight", sans-serif;
    --font-body-attribution: normal 300 19px / 26px "Inter Tight", sans-serif;
    --font-event-date: normal 500 18px / 22px "Inter Tight", sans-serif;
    --font-ordered-list-marker: normal 600 21px / 29px "Inter Tight", sans-serif;
    --font-select: normal 400 17px / 25px "Inter Tight", sans-serif;
    --font-figcaption: normal 300 18px / 22px "Inter Tight", sans-serif;
    --font-form-label: 600 21px / 25px "Inter Tight", sans-serif;
    --font-form-input: 400 17px / 19px "Inter Tight", sans-serif;
    --font-acc-container: 600 21px / 25px "Inter Tight", sans-serif;
    --font-pullquote: 400 25px / 33px "Inter Tight", sans-serif;
    --font-pullquote-author: 500 21px / 28px 'Tahoma';
    --font-pullquote-author-title: 400 19px / 24px 'DM Sans';
    --font-tag-list: normal 300 15px / 17px "Inter Tight", sans-serif;
    --font-table-head: normal 600 21px / 25px "Inter Tight", sans-serif;
    --font-table-cell: normal 400 21px / 29px "Inter Tight", sans-serif;
    --font-eresource-entry: normal 300 19px / 26px "Inter Tight", sans-serif;
    --font-filter-label: normal 500 17px / 25px "Inter Tight", sans-serif;
    --font-event-bucket-body: normal 400 18px / 22px "Inter Tight", sans-serif;
    --font-button: normal 500 17px / 20px "Inter Tight", sans-serif;
    --font-prompt-button: normal 400 16px / 19px "Inter Tight", sans-serif;
    --font-overflow-segment-perk-header: normal 400 28px / 38px "Inter Tight", sans-serif;
    --font-overflow-segment-benefit-body: normal 400 18px / 20px "Inter Tight", sans-serif;
    --font-overflow-segment-donation-heading: normal 400 31px / 33px "Inter Tight", sans-serif;
    --font-overflow-segment-donation-details: normal 400 18px / 21px "Inter Tight", sans-serif;
    --font-full-segment-filter-item: normal 400 17px / 19px "Inter Tight", sans-serif;
    --font-full-segment-author: normal 400 16px / 17px "Inter Tight", sans-serif;
    --font-event-list-month: normal 400 17px / 19px "Inter Tight", sans-serif;
    --font-event-list-day: normal 400 23px / 23px "Inter Tight", sans-serif;
    --font-event-list-details: normal 400 19px / 21px "Inter Tight", sans-serif;
    --font-materials-header: normal 600 17px / 19px "Inter Tight", sans-serif;
    --font-materials-favorite: normal 400 13px / 15px "Inter Tight", sans-serif;
    --font-staff-item-info: normal 400 17px / 20px "Inter Tight", sans-serif;
    --font-staff-discussion-question: normal 600 23px / 29px "Inter Tight", sans-serif;
    --font-book-item-author: normal 300 17px / 21px "Inter Tight", sans-serif;
    /*--font-game-players: normal 300 17px / 19px "Inter Tight", sans-serif;*/
    --font-return-to-link: normal 400 17px / 21px "Inter Tight", sans-serif;
    --font-context-navigation-heading: normal 600 19px / 20px "Inter Tight", sans-serif;
    --font-context-navigation-group-heading: italic 500 17px / 18px "Inter Tight", sans-serif;
    --font-context-navigation-list-item: normal 500 17px / 18px "Inter Tight", sans-serif;
    --font-lineage-sub-heading: italic 500 14px / 17px "Inter Tight", sans-serif;
    --font-lineage-body: normal 400 16px / 20px "Inter Tight", sans-serif;
    --font-footer-sitemap-secondary: normal 500 17px / 20px "Inter Tight", sans-serif;
    --font-footer-sitemap-tertiary: normal 400 15px / 18px "Inter Tight", sans-serif;
    --font-footer-sitemap-header: italic 500 15px / 18px "Inter Tight", sans-serif;
}
html:has(body.bigger-text) .home {
    --font-body: normal 400 18px / 23px "Inter Tight", sans-serif; /* +1 */
    --font-quicklink: normal 300 18px / 19px "Inter Tight", sans-serif; /* +3 */
}
html:has(body.bigger-text) .authors-list {
    --font-link: normal 300 16px / 18px "Inter Tight", sans-serif; /* +2 */
}
html:has(body.bigger-text) .calendar-region {
    --font-calendar-date: normal 400 16px / 18px "Inter Tight", sans-serif; /* +2 */
    --font-calendar-event: normal 400 16px / 20px "Inter Tight", sans-serif; /* +2 */
    --font-calendar-event-time: normal 400 16px / 17px "Inter Tight", sans-serif; /* +2 */
}
html:has(body.bigger-text) .calendar-day-event .event-details {
    --font-body: normal 300 16px / 18px "Inter Tight", sans-serif; /* +2 */
}
html:has(body.bigger-text) .staff-list {
    --font-body: normal 400 16px / 18px "Inter Tight", sans-serif; /* +2 */
}
html:has(body.bigger-text) footer {
    --font-header-5: normal 400 16px / 20px "Inter Tight", sans-serif; /* +2 */
    --font-body: normal 400 16px / 21px "Inter Tight", sans-serif; /* +2 */
    --font-link: normal 400 16px / 20px "Inter Tight", sans-serif; /* +1 */
}
html:has(body.bigger-text) footer .footer-sitemap {
    --font-link: normal 500 16px / 20px "Inter Tight", sans-serif; /* +1 */
}
html:has(body.bigger-text) footer .footer-sitemap .footer-credits {
    --font-link: normal 400 15px / 19px "Inter Tight", sans-serif; /* +3 */
}
html:has(body.bigger-text) footer .footer-details .hours .hours-list li .disclaimer {
    padding-left: calc(8px + var(--footer-hours-list-min-cell-size));
}

/*---------------------------------- Accessibility > High Contrast ----------------------------------*/
html:has(body.high-contrast) {
    --font-header-1: normal 700 35px / 42px "Inter Tight", sans-serif;
    --font-header-2: normal 700 30px / 36px "Inter Tight", sans-serif;
    --font-header-3: normal 700 26px / 31px "Inter Tight", sans-serif;
    --font-header-4: normal 700 22px / 26px "Inter Tight", sans-serif;
    --font-header-5: normal 700 18px / 21px "Inter Tight", sans-serif;
    --font-header-color: #000;
    --font-color-site-navigations: #000;
    /*--font-panels-subheader: normal 700 15px / 19px "Inter Tight", sans-serif;*/
    --font-panels-access-option: normal 500 15px / 19px "Inter Tight", sans-serif;
    --font-main-navigation: normal 600 14px / 15px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-media: normal 700 28px / 30px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-color: #000;
    --font-main-navigation-dropdown-heading: italic 600 13px / 16px "Inter Tight", sans-serif;
    --font-main-navigation-dropdown-list: normal 600 14px / 17px "Inter Tight", sans-serif;
    --font-utility-navigation: normal 400 12px / 15px "Inter Tight", sans-serif;
    --font-utility-navigation-dropdown: normal 600 13px / 17px "Inter Tight", sans-serif;
    --font-top-search-input: normal 700 14px / 17px "Inter Tight", sans-serif;
    --font-top-search-results: normal 400 14px / 17px "Inter Tight", sans-serif;
    --font-top-search-results-heading: normal 600 24px / 29px "Inter Tight", sans-serif;
    --font-top-search-results-title: normal 500 17px / 20px "Inter Tight", sans-serif;
    --font-subheader: normal 400 14px / 16px "Inter Tight", sans-serif;
    --font-alert: normal 600 15px / 19px "Inter Tight", sans-serif;
    /*--alert-announcement-color: var(--theme-primary-color-4);*/
    /*--alert-emergency-color: var(--theme-primary-color-1);*/
    /*--alert-closing-color: var(--theme-primary-color-5);*/
    --font-body: normal 500 18px / 26px "Inter Tight", sans-serif;
    --font-body-color: #000;
    /*--font-body-opt-color: #fff;*/
    --font-body-alt-color: #fff;
    --font-body-intro-color: #000;
    --font-body-intro: italic 700 18px / 24px "Inter Tight", sans-serif;
    --font-body-attribution: normal 400 16px / 23px "Inter Tight", sans-serif;
    --font-event-date: normal 600 15px / 19px "Inter Tight", sans-serif;
    /*--font-link-color: #FE391F;*/
    --font-ordered-list-marker: normal 700 18px / 26px "Inter Tight", sans-serif;
    /*--font-ordered-list-marker-color: #FE391F;*/
    --font-select: normal 600 14px / 22px "Inter Tight", sans-serif;
    --font-color-select: #000;
    --font-figcaption: normal 400 15px / 19px "Inter Tight", sans-serif;
    /*--select-bg-image: url(/content/_theme_images/icon_select-downarrow.svg) no-repeat calc(100% - 7px) center;*/
    /*--select-bg-color: #fff;*/
    /*--preload-cover-bg-color: var(--theme-secondary-color-4);*/
    --font-form-label: 700 18px / 22px "Inter Tight", sans-serif;
    --font-form-input: 500 14px / 16px "Inter Tight", sans-serif;
    /*--font-form-border-color: #D1D1D1;*/
    --font-acc-container: 700 18px / 22px "Inter Tight", sans-serif;
    --font-pullquote: 500 22px / 30px "Inter Tight", sans-serif;
    --font-pullquote-author: 600 18px / 25px 'Tahoma';
    --font-pullquote-author-title: 500 16px / 21px 'DM Sans';
    --font-tag-list: normal 400 12px / 14px "Inter Tight", sans-serif;
    --font-table-head: normal 700 18px / 22px "Inter Tight", sans-serif;
    --font-table-cell: normal 500 18px / 26px "Inter Tight", sans-serif;
    --font-eresource-entry: normal 400 16px / 23px "Inter Tight", sans-serif;
    --font-filter-label: normal 600 14px / 22px "Inter Tight", sans-serif;
    --font-event-bucket-body: normal 500 15px / 19px "Inter Tight", sans-serif;
    --font-button: normal 600 14px / 17px "Inter Tight", sans-serif;
    --font-prompt-button: normal 500 13px / 16px "Inter Tight", sans-serif;
    /*--font-button-color: #FFFFFF;*/
    --button-bg-color: #000;
    /*--button-hover-bg-color: #63878D;*/
    --font-secondary-button-color: #000;
    --font-full-segment-filter-item: normal 500 14px / 16px "Inter Tight", sans-serif;
    --font-full-segment-author: normal 500 13px / 14px "Inter Tight", sans-serif;
    --font-event-list-month: normal 500 14px / 16px "Inter Tight", sans-serif;
    --font-event-list-day: normal 500 20px / 20px "Inter Tight", sans-serif;
    --font-event-list-details: normal 500 16px / 18px "Inter Tight", sans-serif;
    --font-materials-header: normal 700 14px / 16px "Inter Tight", sans-serif;
    --font-materials-favorite: normal 500 10px / 12px "Inter Tight", sans-serif;
    /*--font-materials-favorite-color: #FFFFFF;*/
    --font-staff-item-info: normal 500 14px / 17px "Inter Tight", sans-serif;
    --font-staff-discussion-question: normal 700 20px / 26px "Inter Tight", sans-serif;
    --font-book-item-author: normal 400 14px / 18px "Inter Tight", sans-serif;
    --font-game-players: normal 400 14px / 16px "Inter Tight", sans-serif;
    --font-return-to-link: normal 500 14px / 18px "Inter Tight", sans-serif;
    --font-context-navigation-heading: normal 700 16px / 17px "Inter Tight", sans-serif;
    --font-context-navigation-group-heading: italic 600 14px / 15px "Inter Tight", sans-serif;
    --font-context-navigation-list-item: normal 600 14px / 15px "Inter Tight", sans-serif;
    --font-lineage-sub-heading: italic 600 12px / 15px "Inter Tight", sans-serif;
    --font-lineage-body: normal 600 14px / 18px "Inter Tight", sans-serif;
    --font-footer-sitemap-secondary: normal 600 14px / 17px "Inter Tight", sans-serif;
    --font-footer-sitemap-tertiary: normal 500 12px / 15px "Inter Tight", sans-serif;
    --font-footer-sitemap-header: italic 600 12px / 15px "Inter Tight", sans-serif;
    /*--swiper-pagination-color: rgba(255, 255, 255, 0.34);*/
    /*--swiper-pagination-bullet-inactive-opacity: 1;*/
    /*--swiper-pagination-bullet-inactive-color: rgba(255, 255, 255, 0);*/
}
html:has(body.high-contrast) img, html:has(body.high-contrast) .media, html:has(body.high-contrast) .has-image {
    opacity: 0.75 !important;
}
html:has(body.high-contrast) header .utility-navigation ul.nav-social-list li a {
    opacity: 0.7;
}
/*body.high-contrast h1, body.high-contrast .h1-like, body.high-contrast h2, body.high-contrast .h2-like, body.high-contrast h3, body.high-contrast .h3-like, body.high-contrast h4, body.high-contrast .h4-like, body.high-contrast h5, body.high-contrast .h5-like {*/
/*    font-weight: 700 !important;*/
/*    color: var(--font-body-color) !important;*/
/*}*/
/*body.high-contrast p, body.high-contrast a, body.high-contrast button, body.high-contrast ul li, body.high-contrast ol li, body.high-contrast div, body.high-contrast span, body.high-contrast label {*/
/*    font-weight: 600 !important;*/
/*    color: var(--font-body-color) !important;*/
/*}*/
/*body.high-contrast {*/
/*    --theme-primary-color-3: #74A259;*/
/*    --font-body-color: #000000;*/
/*    --font-body-intro-color: #000000;*/
/*    --font-button-color: #000000;*/
/*    --button-bg-color: #74A259;*/
/*    --button-secondary-bg-color: #DDE2DA;*/
/*    --swiper-pagination-color: rgba(255, 255, 255, 1);*/
/*}*/
/*body.high-contrast header .utility-navigation ul.nav-social-list {*/
/*    column-gap: 10px;*/
/*}*/
/*body.high-contrast footer a.button-like {*/
/*    --font-body-color: #000000;*/
/*}*/
/*body.high-contrast .overflow-segment.secondary-color-scheme {*/
/*    --overflow-segment-gradient-color-1: #3E5F2B;*/
/*    --overflow-segment-gradient-color-2: #304821;*/
/*}*/
/*body.high-contrast .authors-list,body.high-contrast .engagement-list, body.high-contrast .archives-component, body.high-contrast .overflow-segment.bare {*/
/*    --font-header-color: #000000;*/
/*    --font-body-color: #000000;*/
/*}*/
/*body.high-contrast header .utility-navigation ul.panel-options li:before, body.high-contrast header .utility-navigation ul.nav-list li .list-dropdown ul li a, body.high-contrast header .utility-navigation ul.nav-social-list li a, body.high-contrast .overflow-segment.banner .content-board .details, body.high-contrast .staff-list p, body.high-contrast .staff-component .staff-discussion .discussion-question {*/
/*    opacity: 1;*/
/*}*/
/*body.high-contrast figcaption {*/
/*    font-weight: 600;*/
/*}*/
/*body.high-contrast .basic-overlay .overlay-content .overlay-close-icon:before, body.high-contrast .basic-overlay .overlay-content .overlay-close-icon:after {*/
/*    width: 2px;*/
/*    background-color: var(--font-body-color);*/
/*}*/
/*body.high-contrast .discover-filters .current-filters .expand-filters:before, body.high-contrast .calendar .calendar-title .cal-arrow, body.high-contrast .discover-filters ul li label input:checked ~ .checkmark svg g, body.high-contrast .staff-component svg path, body.high-contrast a:after {*/
/*    background-color: var(--font-body-color);*/
/*    fill: var(--font-body-color);*/
/*}*/
/*body.high-contrast .discover-filters.eresources .tagged-list label, body.high-contrast .discover-filters ul li label {*/
/*    color: var(--font-body-color);*/
/*    font-weight: 600;*/
/*}*/
/*body.high-contrast .gallery-overlay .close-button:before {*/
/*    background-color: var(--font-body-color);*/
/*}*/
/*body.high-contrast img, body.high-contrast .books-slider .swiper-slide .book .book-media, body.high-contrast .section .column-two .column-item.blog.slim .blog-media, body.high-contrast .section .section-content .content-columns .column.newsletter .newletter-media, body.high-contrast .section .column-two .column-item .booklists .book .book-media .media-front, body.high-contrast .section .column-two .column-item.reserve .reserve-media, body.high-contrast .section .column-two .column-item.booklist .item-booklist .media, body.high-contrast .bucket .bucket-media, body.high-contrast .upcoming-event-image {*/
/*    opacity: 0.7;*/
/*}*/
/*---------------------------------- Accessibility > Desaturate ----------------------------------*/
body.desaturate img, body.desaturate .books-slider .swiper-slide .book .book-media, body.desaturate .section .column-two .column-item.blog.slim .blog-media, body.desaturate .section .section-content .content-columns .column.newsletter .newletter-media, body.desaturate .section .column-two .column-item .booklists .book .book-media .media-front, body.desaturate .section .column-two .column-item.reserve .reserve-media, body.desaturate .section .column-two .column-item.booklist .item-booklist .media, body.desaturate .bucket .bucket-media, body.desaturate .upcoming-event-image {
    filter: grayscale(1);
}
/*body.desaturate {*/
/*    filter: grayscale(1);*/
/*}*/
html:has(body.desaturate) {
    /*scroll-behavior: smooth;*/
    filter: grayscale(1);
}
/*---------------------------------- Accessibility > Highlight Links ----------------------------------*/
body.highlight-links a {
	background-color: #F0DF00 !important;
	color: #121212 !important;
}
body.highlight-links a > * {
	color: #121212 !important;
}
body.highlight-links {
    --font-link-color: #121212;
    --button-color: #121212;
    --button-bg-color: #F0DF00;
    --button-secondary-bg-color: #F0DF00;
    --button-secondary-hover-bg-color: #FCEC00;
}
body.highlight-links ul.nav-list li .link-backdrop, body.highlight-links header .utility-navigation ul.nav-list li .link-backdrop {
    display: none;
}

/*the thing to use as the initial load/bg of various image locations, that also serves as a fallback/placeholder for cases where there are no images*/
.placeholder-image {
    /*--image-placeholder-color from theme customization*/
    background-color: --image-placeholder-color;
}

h1, .h1-like {
    margin: 0 0 25px 0;
    color: var(--font-header-color);
    font: var(--font-header-1);
    --font-link: var(--font-header-1);
}
h2, .h2-like {
    margin: 31px 0 15px 0;
    color: var(--font-header-color);
    font: var(--font-header-2);
    --font-link: var(--font-header-2);
}
h3, .h3-like {
    margin: 25px 0 10px 0;
    color: var(--font-header-color);
    font: var(--font-header-3);
    --font-link: var(--font-header-3);
}
h3.styled, .h3-like.styled {
    padding: 9px 0 0 22px;
}
h3.styled:before, .h3-like.styled:before {
    width: 13px;
    aspect-ratio: 0.41 / 1;
    top: 1px;
}
h4, .h4-like {
    margin: 22px 0 12px 0;
    color: var(--font-header-color);
    font: var(--font-header-4);
    --font-link: var(--font-header-4);
}
h5, .h5-like {
    margin: 22px 0 10px 0;
    color: var(--font-header-color);
    font: var(--font-header-5);
    --font-link: var(--font-header-5);
}
.styled {
    padding: 5px 0 0 26px;
    position: relative;
}
.styled:before {
    content: "";
    width: 16px;
    background: url('/content/_theme_images/icon_styled-header-offset.svg') no-repeat center;
    background-size: cover;
    aspect-ratio: 0.47 / 1;
    position: absolute;
    top: 0;
    left: 0;
}
hr {
    width: 100%;
    height: var(--wedge-height);
    margin: var(--wedge-margin);
    border: none;
    outline: none;
    display: block;
    position: relative;
}
hr:before, hr:after {
    content: "";
    width: calc(50% + 1px);
    height: calc(var(--wedge-height) - -30px);
    border: 1px solid var(--theme-secondary-color-4);
    position: absolute;
    top: 0px;
}
hr:before {
    border-radius: 0 30px;
    left: -1px;
}
hr:after {
    border-radius: 30px 0;
    right: -2px;
}
input{
    font-family: inherit;  
}
p a.button-like {
    margin-right: 25px;
}
p {
    margin: 10px 0;
    color: var(--font-body-color);
    font: var(--font-body);
}
address {
    margin: 10px 0;
    color: var(--font-body-color);
    font: var(--font-body);
}
p.intro {
    margin: 0 0 30px 0;
    color: var(--font-body-intro-color);
    font: var(--font-body-intro);
}
p.attribution {
    opacity: 0.9;
    font: var(--font-body-attribution);
}
a {
    color: var(--font-link-color);
    font: var(--font-link);
    /*text-decoration: none;*/
    transition: color .3s;
}
a:after {
    background-color: var(--font-link-color);
}
a.skip-offsite:after {
    display: none;
}
form button.loader {
    border: none;
}
/*// general list styles //*/
ul, ol {
    margin: 12px 0 29px 0;
    color: var(--font-body-color);
    font: var(--font-body);
}
ul li, ol li {
    margin: 0;
    margin-bottom: 9px;
}
ul li:last-of-type, ol li:last-of-type {
    margin-bottom: 0;
}
/*/ unordered list styles /*/
ul {
    padding: 0;
    list-style-type: none;
}
ul li {
    padding-left: 23px;
    position: relative;
}
ul li:before {
    content: "";
    width: 10px;
    height: 10px;
    background-color: var(--font-ordered-list-marker-color);
    border-radius: 50%;
    position: absolute;
    top: 7px;
    left: 0;
}
ul li ul {
    margin: 9px 0 0 0;
}
ul li ul li:before {/* correct for 0.5px screens */
    width: 9px;
    height: 9px;
    background-color: transparent;
    border: 1px solid var(--font-ordered-list-marker-color);
}
ul li ul li ul {
    margin: 9px 0 0 0;
}
ul li ul li ul li:before {
    width: 10px;
    height: 10px;
    background-color: var(--font-ordered-list-marker-color);
    border: none;
}
/*/ ordered list styles /*/
ol {
    padding: 0 0 0 19px;
}
ol li {
    padding-left: 7px;
}
ol li::marker {
    width: 19px;
    color: var(--font-ordered-list-marker-color);
    font: var(--font-ordered-list-marker);
    display: inline-block;
}
ol li ol {
    margin: 10px 0 0 0;
    list-style: lower-alpha;
}
ol li ol li:last-of-type {
    margin: 0;
}
ol li ol li ol {
    margin: 10px 0 0 0;
    list-style: lower-roman;
}
/*// general "button" styles //*/
button, a.button-like {
    margin: 2px 12px 2px 16px;
    padding: 8px 14px;
    background-color: var(--button-bg-color);
    border: 1px solid transparent;
    border-radius: 15px 0 15px 0;
    color: var(--font-button-color);
    font: var(--font-button);
    text-decoration: none;
    display: inline-block;
    position: relative;
    transition: background-color .2s;
    cursor: pointer;
}
button:before, a.button-like:before {
    content: "";
    width: 32px;
    height: 37px;
    background: url(/content/_site_images/icon_button-offset.svg) no-repeat center;
    background-size: contain;
    display: inline-block;
    position: absolute;
    top: -3px;
    left: -21px;
}
button:after, a.button-like:after {
    background-color: var(--font-button-color);
}
button[disabled] {
    opacity: 0.4;
    pointer-events: none;
}
button:hover, a.button-like:hover {
    background-color: var(--button-hover-bg-color);
    transition: background-color .3s;
}
/*/ button "secondary" styles /*/
button.secondary, a.button-like.secondary {
    margin: 0 8px 0 0;
    background-color: var(--button-secondary-bg-color);
    border: 1px solid var(--font-secondary-button-color);
    color: var(--font-secondary-button-color);
}
button.secondary:before, a.button-like.secondary:before {
    display: none;
}
button.secondary:after, a.button-like.secondary:after {
    background-color: var(--font-secondary-button-color);
}
button.secondary:hover, a.button-like.secondary:hover {
    background-color: var(--button-secondary-hover-bg-color);
}
/* overwrite buttons spacing for body content */
p a.button-like, p a.button-like.secondary {
    margin-bottom: 10px;
}
p a.button-like.primary {
    margin-left: 15px;
}
/* widget overrides */
body .s-lch-widget-float-btn {
    width: 82px;
    height: 82px;
    padding: 0;
    background: no-repeat center;
    background-image: url('data:image/svg+xml,<svg width="31px" height="26px" viewBox="0 0 31 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Page-Layouts" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><path d="M8.31600013,0.250108983 C13.034698,-0.105300528 17.774293,-0.081892231 22.4892501,0.320108983 L25.3312501,0.561608983 C27.4771919,0.745128125 29.2186259,2.37374496 29.5452501,4.50260898 L29.7237501,5.67335898 C30.331005,9.64220145 30.2742311,13.684387 29.5557501,17.634609 C29.2025939,19.5846344 27.5037453,21.0019384 25.5220001,20.999859 L9.81400013,20.999859 C9.45175013,20.999859 9.09650013,21.089109 8.77800013,21.260609 L1.93375013,24.939109 C1.52689982,25.1577257 1.03508715,25.146408 0.638723933,24.9093075 C0.242360716,24.6722069 0,24.2442252 0,23.782359 L0,8.87760898 C0.000934311385,4.36531244 3.47874841,0.615925226 7.97825013,0.276358983 L8.31600013,0.250108983 Z M8.31250013,8.90735898 C7.10437724,8.90735898 6.12500013,9.88673609 6.12500013,11.094859 C6.12500013,12.3029819 7.10437724,13.282359 8.31250013,13.282359 C9.52062302,13.282359 10.5000001,12.3029819 10.5000001,11.094859 C10.5000001,9.88673609 9.52062302,8.90735898 8.31250013,8.90735898 M15.3125001,8.90735898 C14.1043772,8.90735898 13.1250001,9.88673609 13.1250001,11.094859 C13.1250001,12.3029819 14.1043772,13.282359 15.3125001,13.282359 C16.520623,13.282359 17.5000001,12.3029819 17.5000001,11.094859 C17.5000001,9.88673609 16.520623,8.90735898 15.3125001,8.90735898 M20.1250001,11.094859 C20.1250001,10.3133405 20.5419352,9.5911876 21.2187501,9.20042834 C21.895565,8.80966908 22.7294353,8.80966908 23.4062502,9.20042834 C24.083065,9.5911876 24.5000001,10.3133405 24.5000001,11.094859 C24.5000001,12.3029819 23.520623,13.282359 22.3125001,13.282359 C21.1043772,13.282359 20.1250001,12.3029819 20.1250001,11.094859" id="Shape" fill="%23003B46"></path></g></svg>');
    background-color: #fff;
    border-radius: 24px 0 35px 0;
    box-shadow: 0 0 14px rgba(0,0,0,0.14);
    transition: opacity .3s;
}
body .s-lch-widget-float-btn.online {
    background-color: #fff;
}
body .s-lch-widget-float-btn[title="Offline"] {
    opacity: 0.5;
    pointer-events: none;
}
body .s-lch-widget-float-btn:before {
    display: none;
}
body .s-lch-widget-float-btn svg {
    display: none;
}

img {
    max-width: 100%;
    height: auto;
}
.img_right_15 {
    float: right;
    width: 15%;
    margin: 20px 0 20px 25px;
    clear: right;
}
.img_right_20 {
    float: right;
    width: 20%;
    margin: 20px 0 20px 25px;
    clear: right;
}
.img_right_25 {
    float: right;
    width: 25%;
    margin: 20px 0 20px 25px;
    clear: right;
}
.img_right_35 {
    float: right;
    width: 35%;
    margin: 20px 0 20px 25px;
    clear: right;
}
.img_right_50 {
    float: right;
    width: 50%;
    margin: 20px 0 20px 35px;
    clear: right;
}
.img_right_65 {
    float: right;
    width: 65%;
    margin: 20px 0 20px 35px;
    clear: right;
}
.img_right_native {
    float: right;
    max-width: 100%;
    width: auto;
    /*margin: 20px 0 20px 35px;*/
    clear: right;
}
.img_left_15 {
    float: left;
    width: 15%;
    margin: 20px 25px 20px 0;
    clear: left;
}
.img_left_20 {
    float: left;
    width: 20%;
    margin: 20px 25px 20px 0;
    clear: left;
}
.img_left_25 {
    float: left;
    width: 25%;
    margin: 20px 25px 20px 0;
    clear: left;
}
.img_left_35 {
    float: left;
    width: 35%;
    margin: 20px 25px 20px 0;
    clear: left;
}
.img_left_50 {
    float: left;
    width: 50%;
    margin: 20px 35px 20px 0;
    clear: left;
}
.img_left_65 {
    float: left;
    width: 65%;
    margin: 20px 35px 20px 0;
    clear: left;
}
.img_left_native {
    float: left;
    max-width: 100%;
    width: auto;
    /*margin: 35px 35px 35px 0;*/
    clear: left;
}
.img_full_styled {
    width: 100%;
    float: none;
    margin: 15px auto;
}
.img_full_styled img {
    width: 100%;
}
.img_native_block {
    max-width: 100%;
    /*margin: 35px 0;*/
}

/*figure {*/
/*    margin-top: 0;*/
/*}*/
figure img {
    width: 100%;
}
figure.img_native_block {
    width: 100%;
    margin: 34px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}
figure.img_native_block img {
    width: auto;
}
figcaption {
    margin: 10px 0 0 0;
    /*opacity: 0.8;*/
    font: var(--font-figcaption);
    text-align: center;
}
figcaption p {
    margin: 0;
}
.desktop-small, .tablet, .mobile {
display: none;
}
.desktop {
display: block;
}
#is_desktop_small, #is_tablet, #is_mobile {
position: absolute;
}
.hidden {
display: none;
}
.darkmode {
display: none;
}

.default {
    /*background: url(/content/_site_images/icon_darken-repeat.svg) repeat;*/
    background: var(--theme-default-bg);
    /*background-color: var(--theme-primary-color-3);*/
    background-color: var(--theme-default-color);
}
.default-book-icon {
    background-image: url('/content/_site_images/icon_placeholder-mark.svg');
}
.has-image {
    background: transparent no-repeat center;
    background-size: cover;
}
.align-center {
    text-align: center;
}

/*/ custom divider element /*/
.wedge {
    width: 100%;
    height: var(--wedge-height);
    margin: var(--wedge-margin);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.wedge:before, .wedge:after {
    content: "";
    width: 50%;
    height: 1px;
    background-color: var(--wedge-color);
    display: block;
    position: absolute;
}
.wedge:before {
    top: 0;
    left: 0;
}
.wedge:after {
    bottom: 0;
    right: 0;
}
.wedge .wedge-center {
    width: 1px;
    height: 100%;
    background-color: var(--wedge-color);
    display: block;
}

.full-segment:has( .events-list) .wedge {
    display: none;
}

/* Style Guide Assets */
body {
    font-family: "Inter Tight", sans-serif;
    
    --font-style-guide: italic 400 36px/38px "Inter Tight", sans-serif;
    --font-color-style-guide: rgba(100,100,100,1);
    --style-guide-divider-grad: linear-gradient(to right, rgba(100,100,100,0) 0, rgba(100,100,100,1) 25%, rgba(100,100,100,1) 75%, rgba(100,100,100,0) 100%);
}
body.dark-mode {
    --font-color-style-guide: rgba(200,200,200,1);
    --style-guide-divider-grad: linear-gradient(to right, rgba(200,200,200,0) 0, rgba(200,200,200,1) 25%, rgba(200,200,200,1) 75%, rgba(200,200,200,0) 100%);
}
.guide-divider {
    width: 100%;
    margin-top: 100px;
    color: var(--font-color-style-guide);
    font: var(--font-style-guide);
    transition: color .3s;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.guide-divider:first-of-type {
    margin-top: 0;
}
.guide-divider:after {
    content: "";
    width: 100%;
    height: 1px;
    margin: 8px 0 20px 0;
    background: var(--style-guide-divider-grad);
    display: block;
    transition: background .3s;
}
.style-button-options {
    width: 100%;
    margin: 8px 0;
    display: flex;
    column-gap: 5px;
    align-items: flex-end;
}
.style-button-options a {
    margin-right: 25px;
}

/* home page favorited branches and audiences states */
.favorited:after,
.preferred-favorite:after {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    background: var(--favorited-star-icon);
    background-size: cover;
    display: block;
    top: 2px;
    left: -16px;
    /*background-color: orange;*/
    /*clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);*/
}

form {
    margin: 0 0 80px 0;
    /*margin-top: 70px;*/
    /*max-width: 813px;*/
}
.register-form-two {
    margin-top: unset;
}
form fieldset {
    margin: 0;
    padding: 0;
    border: none;
}
form fieldset[data-name="check_box"], form fieldset[data-name="new_element"] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}
form .field-row {
    margin-bottom: 25px;
    display: flex;
}
form .field-row .field-container {
flex-grow: 1;
margin-right: 10px;
}
form .field-row .field-container label {
width: 100%;
display: block;
}
form .field-row .field-container label .txt, form .field-row .field-container fieldset .txt {
    font: var(--font-form-label);
    margin-bottom: 5px;
}
form .field-row .field-container label:has( input[type="checkbox"]), form .field-row .field-container label:has( input[type="radio"]) {
    display: flex;
    gap: 5px;
    width: max-content;
}
.success-message {
    width: 100%;
    margin: 32px 0px;
    padding: 40px 37px;
    background-color: var(--theme-secondary-color-4);
    border-left: 15px solid var(--theme-primary-color-2);
}
.success-message h2, .success-message .h2-like,  {
    margin: 0;
}
input, input[type="text"], input[type="email"], input[type="password"], textarea {
    width: 100%;
    margin: 5px 0 10px 0;
    padding: 9px 13px;
    background-color: var(--select-bg-color);
    border: 1px solid var(--brand-border-color);
    color: var(--font-body-color);
    font: var(--font-form-input);
    display: block;
}
input[type="file"] {
    background-color: unset;
}
input[type="file" i]::-webkit-file-upload-button {
    font: var(--font-button);
    background-color: var(--button-secondary-bg-color);
    border: 1px solid var(--font-secondary-button-color);
    color: var(--font-secondary-button-color);
    padding: 9px 13px 10px;
    cursor: pointer;
}
input[type="file" i]::-webkit-file-upload-button:hover {
    background-color: var(--button-secondary-hover-bg-color);
}
textarea {
font-family: 'DM Sans', serif;
}
input[type="checkbox"], input[type="radio"] {
width: initial;
}
select {
    padding: 5px;
    border: 1px solid var(--brand-border-color);
    background-color: var(--select-bg-color);
    border-radius: 5px;
    color: var(--font-body-color);
    font: var(--font-button);
    position: relative;
}
select:before {
    position: absolute;
    content: '';
}
select.sort-by {
    width: 150px;
    margin-left: 8px;
    padding: 7px 10px;
    border: 0.5px solid var(--theme-secondary-color-6);
    border-radius: 6px 0 6px 0;
    font: var(--font-tag-list);
    text-transform: uppercase;
    -webkit-appearance: none;
    -moz-appearance: none;
}
form input[type="submit"] {
/*font: var(--small-header-font);*/
font-weight: 400;
color: var(--power-color-1-foreground);
background-color: var(--power-color-1);
border: unset;
padding: 6px 20px;
border-radius: 20px;
text-transform: capitalize;
width: fit-content;
}

/* mailchimp embed form css */
#mc_embed_signup {
    margin: 60px 0 0 0 !important;
    background-color: transparent !important;
    color: var(--font-body-color) !important;
    font: var(--font-body) !important;
}
#mc-embedded-subscribe {
    margin: 0 !important;
}
#mc_embed_signup form {
    margin: 0 !important;
}
@media only screen and (max-width: 750px) {
    #mc_embed_signup {
        width: auto !important;
    }
}

/* pullquote */
.pullquote {
    width: 100%;
    margin: 0 0 40px 0;
    padding: 54px 99px 60px 99px;
    background-color: var(--theme-secondary-color-8);
    border-radius: 0 79px 0px 79px;
    color: var(--font-body-color);
    font: var(--font-pullquote);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    position: relative;
}
.pullquote.secondary {
    background-color: var(--theme-secondary-color-3);
}
.pullquote:before, .pullquote:after {
    content: "";
    display: block;
    position: absolute;
}
.pullquote:before {
    width: 24px;
    height: 20px;
    /*background: url('data:image/svg+xml,<svg width="21px" height="18px" viewBox="0 0 21 18"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" font-family=".AppleSystemUIFont" font-size="71" font-weight="normal"><text fill="%23000000"><tspan x="-7" y="51">“</tspan></text></g></svg>') no-repeat center;*/
    /*background-image: url('data:image/svg+xml,<svg width="21px" height="18px" viewBox="0 0 21 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M7.25634766,17.9267578 L10.3071289,0.974121094 L6.00830078,0.974121094 L0.946777344,17.9267578 L7.25634766,17.9267578 Z M17.8300781,17.9267578 L20.8808594,0.974121094 L16.5820312,0.974121094 L11.5205078,17.9267578 L17.8300781,17.9267578 Z" id="“" fill="003B46" fill-rule="nonzero"></path></svg>');*/
    background-image: url('data:image/svg+xml,<svg width="24px" height="20px" viewBox="0 0 24 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="1280-Page-Layouts" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><path d="M23.714,1.917 C21.5366667,3.5736667 19.9865,5.1475 19.0635,6.6385 C18.1405,8.1295 17.679,9.7743333 17.679,11.573 C18.2943333,11.1943333 19.0043333,11.005 19.809,11.005 C20.8976667,11.005 21.7851667,11.3718333 22.4715,12.1055 C23.1578333,12.8391667 23.501,13.774 23.501,14.91 C23.501,16.188 23.0631667,17.2293333 22.1875,18.034 C21.3118333,18.8386667 20.1403333,19.241 18.673,19.241 C15.3123333,19.241 13.632,17.0163333 13.632,12.567 C13.632,11.3836667 13.774,10.2831667 14.058,9.2655 C14.342,8.2478333 14.8035,7.2538333 15.4425,6.2835 C16.0815,5.3131667 16.9453333,4.3191667 18.034,3.3015 C19.1226667,2.2838333 20.4716667,1.1833333 22.081,0 L23.714,1.917 Z M10.082,1.917 C7.9046667,3.5736667 6.3545,5.1475 5.4315,6.6385 C4.5085,8.1295 4.047,9.7743333 4.047,11.573 C4.6623333,11.1943333 5.3723333,11.005 6.177,11.005 C7.2656667,11.005 8.1531667,11.3718333 8.8395,12.1055 C9.5258333,12.8391667 9.869,13.774 9.869,14.91 C9.869,16.188 9.4311667,17.2293333 8.5555,18.034 C7.6798333,18.8386667 6.5083333,19.241 5.041,19.241 C1.6803333,19.241 0,17.0163333 0,12.567 C0,11.3836667 0.142,10.2831667 0.426,9.2655 C0.71,8.2478333 1.1715,7.2538333 1.8105,6.2835 C2.4495,5.3131667 3.3133333,4.3191667 4.402,3.3015 C5.4906667,2.2838333 6.8396667,1.1833333 8.449,0 L10.082,1.917 Z" id="Shape" fill="%23000000" fill-rule="nonzero"></path></g></svg>');
    background-size: contain;
    top: 61px;
    left: 58px;
}
/*.pullquote:after {*/
/*    width: 9px;*/
/*    height: calc(100% + 2px);*/
/*    background-color: var(--font-link-color);*/
/*    top: -1px;*/
/*    left: -1px;*/
/*}*/
.pullquote .pullquote-author {
    margin: 26px 0 0 0;
    color: var(--font-body-color);
    font: var(--font-pullquote-author);
}
.pullquote .pullquote-author:before {
    content: "";
    width: 37px;
    height: 5px;
    margin: 0 15px 6px 0;
    background-color: var(--font-body-color);
    display: inline-block;
}
.pullquote .pullquote-author:after {
    content: '';
    position: absolute;
    width: 66px;
    height: 66px;
    bottom: 0;
    left: 50px;
    border-radius: 40px;
    background-color: var(--brand-alternate-color-3);
}
.pullquote .pullquote-author-title {
    font: var(--font-pullquote-author-title);
    color: var(--font-body-color);
}

/* FORM */
/*form h3 {*/
/*    margin: 0;*/
/*}*/
input, input[type="text"], input[type="email"], input[type="password"], textarea {
    margin: 11px 0 0 0;
    border-radius: 0;
    border: 1px solid var(--font-form-border-color);
}
input[type="file"] {
    border: unset;
}
fieldset[data-name="checkboxes"], fieldset[data-name="radios"] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
fieldset[data-name="checkboxes"] legend, fieldset[data-name="radios"] legend {
    width: 100%;
    font-weight: 600;
    margin-bottom: 5px;
}
input[type="checkbox"], input[type="radio"] {
    margin: 2px 0 0 0;
}
form .field-row .field-container label.select {
    display: flex;
    flex-direction: column;
}
select {
    padding: 9px 13px;
    border-radius: 0;
    border: 1px solid var(--font-form-border-color);
}
form button.submit-button {
    margin: 0 8px;
    padding: 9px 13px 10px;
    background-color: var(--button-secondary-bg-color);
    border: 1px solid var(--font-secondary-button-color);
    color: var(--font-secondary-button-color);
    text-transform: capitalize;
}
form button.submit-button:before, form button.submit-button:after {
    content: unset;
}

.strike-through{
    text-decoration: line-through;
}

.visually-hidden {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.byte_content_embargo {
    background-color: #FF8800 !important;
    box-shadow: 0 0 3px #ccc !important;
}
.byte_content_postpone {
    display: none !important;
}
img.byte_img_embargo {
    box-shadow: 5px 5px 1px 2px #FF8800, 5px 5px 3px 2px #ccc !important;
}
img.byte_img_review {
    display: none !important;
}

/*======================================================================
    HEADER - styles | desktop
=======================================================================*/
header {
    width: 100%;
    /*max-width: 1440px;*/
    max-width: 1280px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    z-index: 30;
    /* JS - z index of header was overlapping overlays, and this seemed to fix it */
    transition: padding .3s ease-out;
}
/* override base styles for this section */
header a {
    text-decoration: none;
}
header a:after {
    background-color: var(--theme-secondary-color-4);
}
header ul {
    margin: 0;
    padding: 0;
}
header ul li ul {
    margin: 0;
    padding: 0;
}
header ul li {
    margin: 0;
    padding: 0;
}
header.close-notices {
    padding: 0;
}
header .header-panels {
    width: 100%;
    /*max-width: 1280px;*/
    padding: 0;
    background-color: var(--body-bg-color, #FCFCFC);
    border: none;
    display: block;
    position: relative;
    z-index: 5;
}
header .header-panels .close-icon {
    display: block;
    position: absolute;
    top: 27px;
    right: 31px;
    z-index: 15;
}
header .header-panels .panel {
    width: 100%;
    padding: 31px 39px;
    /*background-color: var(--body-bg-color);*/
    background-color: var(--theme-secondary-color-4);
    /*border: 1px solid var(--theme-primary-color-3);*/
    border-radius: 0 0 70px 70px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(5px);
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .2s, transform .2s;
}
header .header-panels .panel.show-panel {
    opacity: 1;
    pointer-events: all;
    position: relative;
    transform: translateY(0);
    transition: opacity .3s .1s, transform .3s;
    max-height: 100vh;
    overflow: auto;
}
/*header .header-panels .panel:has( .alert-messages) {*/
/*    padding: 20px 30px;*/
/*}*/
header .header-panels .panel .h3-like {
    margin: 0 0 25px 0;
    color: var(--font-body-opt-color);
    display: block;
}
header .header-panels .panel .access-options {
    width: 100%;
    display: flex;
    column-gap: 15px;
    align-items: flex-start;
}
header .header-panels .panel .access-options select {
    border: 1px solid var(--theme-primary-color-3);
    background: var(--select-bg-image);
    background-color: var(--select-bg-color);
    border-radius: initial;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: var(--font-color-select);
    font: var(--font-select);
}
header .header-panels .panel .access-options .access-section {
    display: flex;
    flex-wrap: wrap;
    column-gap: 10px;
    row-gap: 5px;
}
header .header-panels .panel .access-options .access-section .subheader {
    width: 100%;
    color: var(--font-body-opt-color);
    font: var(--font-panels-subheader);
    display: block;
}
header .header-panels .panel .access-options .access-section .option {
    color: var(--theme-primary-color-3);;
    display: flex;
    align-items: center;
    column-gap: 4px;
}
header .header-panels .panel .access-options .access-section .option .icon {
    width: 22px;
    height: 22px;
    /*background-color: var(--body-bg-color);*/
    border: 1px solid var(--font-body-opt-color);
    color: var(--font-body-opt-color);
    font: var(--font-panels-access-option);
    font-weight: 700;/* overwrites `font` set weight */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .3s, color .3s;
}
header .header-panels .panel .access-options .access-section .option.active .icon {
    background-color: var(--theme-primary-color-3);
    /*color: #fff;*/
}
header .header-panels .panel .access-options .access-section .option p {
    margin: 0;
    color: var(--font-body-opt-color);
    font: var(--font-panels-access-option);
}
header .header-panels .panel .access-options .access-section .option.mobile {
    display: none;
}
header .header-panels .panel .access-options .access-section .option.active .option.mobile {
    background-color: var(--theme-primary-color-3);
    color: var(--font-button-color);
}
header .header-panels .panel .branch-hours {
    width: 100%;
    display: flex;
    column-gap: 44px;
    /*align-items: center;*/
}
header .header-panels .panel .branch-hours p {
    margin: 0;
    padding-left: 15px;
    color: var(--font-body-opt-color);
    font: var(--font-alert);
    position: relative;
}
header .header-panels .panel .branch-hours p:before {
    content: "";
    width: 1px;
    height: 100%;
    background-color: var(--font-body-opt-color);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
header .header-panels .panel .branch-hours p .day {
    margin: 0 0 8px 0;
    font-weight: 700;
    display: block;
}
header .header-panels .panel .alert-messages {
    width: calc(100% - 38px);
    margin: 0;
    padding: 0 0 2px 0;
    display: flex;
    justify-content: center;
    overflow: hidden;
}
header .header-panels .panel .alert-messages .swiper-slide {
    padding: 0 0 0 24px;
    display: flex;
    justify-content: flex-start;
    overflow: visible;
}
header .header-panels .panel .alert-message {
    color: var(--font-body-opt-color);
    font: var(--font-alert);
    position: relative;
}
header .header-panels .panel .alert-message:before {
    content: "";
    width: 16px;
    height: 16px;
    background-color: var(--body-media-bg-color);
    border-radius: 50%;
    display: block;
    position: absolute;
    top: calc(50% - 7px);
    left: -24px;
}
header .header-panels .panel .alert-message.closing:after {
    background-color: var(--alert-closing-color);
}
header .header-panels .panel .alert-message.emergency:after {
    background-color: var(--alert-emergency-color);
}
header .header-panels .panel .alert-message.announcement:after {
    background-color: var(--alert-announcement-color);
}
header .header-panels .panel .alert-message.closing:before {
    background-color: var(--alert-closing-color);
}
header .header-panels .panel .alert-message.emergency:before {
    background-color: var(--alert-emergency-color);
}
header .header-panels .panel .alert-message.announcement:before {
    background-color: var(--alert-announcement-color);
}
header .header-panels .panel .alert-message a {
    text-decoration: underline;
}
header .header-panels .panel .alert-svg {
    position: relative;
    top: 6px;
}
header .header-wrapper {
    width: 100%;
    padding: 0 30px;
    background-color: var(--body-bg-color, #FCFCFC);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    position: relative;
    z-index: 10;
}
header .skip-navigation {
    opacity: 0;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 35;
    pointer-events: none;
    transition: opacity .2s;
}
header .skip-navigation:focus {
    opacity: 1;
    pointer-events: all;
}
header .site-logo {
    display: block;
}
header .site-logo .site-logo-link {
    display: flex;
    align-items: flex-end;
}
header .site-logo .site-logo-link img {
    content: var(--theme-logo-img);
    max-width: 100%;
    /*max-height: var(--site-logo-height);*/
}
header .site-navigations {
    /*width: calc(100% - 425px);*/
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: relative;
    /*margin-right: 25px;*/
    
    /*background-color: rgba(255,0,0,0.1);*/
}
header .ham-menu {
    width: 45px;
    flex-direction: column;
    position: relative;
    z-index: 100;
}
header .ham-menu .line {
    width: 100%;
    height: 3px;
    margin-bottom: 8px;
    border-radius: 15px;
    background-color: var(--power-color-2);
    opacity: 1;
    display: inline-block;
    transition: background-color .3s ease-out, opacity .2s ease-out, transform .3s ease-out;
}
header .ham-menu .line:nth-child(2) {
    background-color: var(--power-color-3);
}
header .ham-menu .line:nth-child(3) {
    background-color: var(--power-color-5);
}
header.open-menu .ham-menu .line {
    margin-bottom: 0;
    position: absolute;
    top: 11px;
}
header.open-menu .ham-menu .line:first-of-type {
    transform: rotate(45deg);
    top: 11px;
}
header.open-menu .ham-menu .line:nth-of-type(2) {
    transform: rotate(-45deg);
    top: 11px;
}
header.open-menu .ham-menu .line:last-of-type {
    opacity: 0;
}
header ul.nav-list li {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    position: initial;
}
header ul.nav-list li:before {
    display: none;
}
header ul.nav-list li.show-dropdown a.list-toggle {
    transform: scaleY(1);
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ Main Navigation \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
header .main-navigation {
    width: 100%;
    padding: 0;
    /*padding-right: 86px;*//* 40px (to align with utility) + 36px (width of search button) + 10px (spacing between nav and search icon) */
    /*background-color: var(--body-bg-color);*/
    position: initial;
}
header .main-navigation ul.nav-list {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    /*align-items: flex-end;*/
    justify-content: flex-end;
    position: initial;
}
header .main-navigation ul.nav-list li:hover, header .main-navigation ul.nav-list li:focus-within {
    z-index: 101;
}
header .main-navigation ul.nav-list li {
    background-color: var(--theme-secondary-color-1);
}
header .main-navigation ul.nav-list li:first-of-type {
    border-radius: 0 0 0 25px;
}
header .main-navigation ul.nav-list li a {
    padding: 16px 20px;
    color: var(--font-color-site-navigations);
    font: var(--font-main-navigation);
    letter-spacing: 0.5px;
    text-decoration: none;
    display: block;
    position: relative;
    z-index: 10;
    transition: padding .3s;
}
/*header .main-navigation ul.nav-list li:hover a {*/
/*    color: var(--font-body-opt-color);*/
/*}*/
header .main-navigation ul.nav-list li a.list-toggle {
    display: none;
}
header .main-navigation ul.nav-list li .link-name {
    text-align: center;
    display: block;
    position: relative;
    z-index: 5;
}
/*header .main-navigation ul.nav-list li .link-name:after {*/
/*    content: "";*/
/*    width: 100%;*/
/*    height: 1px;*/
/*    background-color: var(--theme-primary-color-2);*/
/*    display: none;*/
/*    position: absolute;*/
/*    bottom: -13px;*/
/*    left: 0;*/
/*    z-index: 1;*/
/*}*/
/*header .main-navigation ul.nav-list li.active .link-name:after {*/
/*    display: block;*/
/*}*/
header .main-navigation ul.nav-list li .link-backdrop {
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-3);
    /*border-radius: 0;*/
    border-radius: 0 25px 0 25px;
    opacity: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none;
    transition: border-radius .2s, opacity .2s;
}
header .main-navigation ul.nav-list li:hover .link-backdrop, header .main-navigation ul.nav-list li:focus-within .link-backdrop {
    border-radius: 0 25px 0 25px;
    opacity: 1;
    transition: border-radius .3s, opacity .3s;
}
header .main-navigation ul.nav-list li:hover .link-backdrop:after, header .main-navigation ul.nav-list li:focus-within .link-backdrop:after {
    bottom: -3px;
    transition: bottom .2s .1s;
}
header .main-navigation ul.nav-list .list-dropdown {
    width: 100%;
    margin: 0 auto;
    padding: 0 30px 0 0;
    background-color: var(--theme-secondary-color-3);
    border-radius: 25px 0 25px 0;
    opacity: 0;
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    z-index: 5;
    transform: translateY(-5px);
    transition: opacity .2s, transform .2s;
    pointer-events: none;
    /*overflow: hidden;*/
}
header .main-navigation ul.nav-list li:hover .list-dropdown, header .main-navigation ul.nav-list li:focus-within .list-dropdown {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .3s .2s, transform .3s .1s;
    pointer-events: all;
}
header ul.nav-list li .list-dropdown:before {
    content: "";
    width: 100%;
    height: 26px;
    display: block;
    position: absolute;
    top: -13px;
    left: 0;
}
header ul.nav-list li .list-dropdown ul {
    width: 100%;
    margin: 0px;
    /*background-color: var(--body-bg-color);*/
    list-style-type: none;
    position: relative;
}
header ul.nav-list li .list-dropdown .dropdown-groups {
    width: calc(100% - 260px);
    padding: 30px 0;
    display: flex;
    column-gap: 20px;
    row-gap: 10px;
    flex-wrap: wrap;
    /*justify-content: space-between;*/
}
header ul.nav-list li .list-dropdown .dropdown-groups .group {
    /*width: 100%;*/
    width: calc(33% - 20px);
    /*background: var(--body-bg-color);*/
}
header ul.nav-list li .list-dropdown .dropdown-groups .group .item-heading {
    margin: 0px 0px 3px;
    padding-bottom: 5px;
    border-bottom: 1px solid var(--font-main-navigation-dropdown-color);
    opacity: 0.7;
    color: var(--font-main-navigation-dropdown-color);
    font: var(--font-main-navigation-dropdown-heading);
    letter-spacing: 0.46px;
    text-transform: uppercase;
    display: block;
}
header ul.nav-list li .list-dropdown .dropdown-groups .group ul {
    padding: 0px;
}
header ul.nav-list li:hover .list-dropdown ul li, header ul.nav-list li:focus-within .list-dropdown ul li {
    opacity: 1;
}
header ul.nav-list li .list-dropdown ul li {
    margin: 0;
    opacity: 0;
    display: block;
    position: relative;
    z-index: 10;
    transition: opacity 0s;
}
header .main-navigation ul.nav-list li .list-dropdown ul li {
    /*width: calc(33% - 20px);*/
    background-color: transparent;
    border-radius: initial;
    opacity: 0;
    transform: translateY(-5px);
    transition: opacity .2s, transform .2s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li, header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .3s .4s, transform .3s .4s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li:nth-of-type(2),
header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li:nth-of-type(2) {
    transition: opacity .3s .45s, transform .3s .45s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li:nth-of-type(3),
header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li:nth-of-type(3) {
    transition: opacity .3s .5s, transform .3s .5s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li:nth-of-type(4),
header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li:nth-of-type(4) {
    transition: opacity .3s .55s, transform .3s .55s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li:nth-of-type(5),
header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li:nth-of-type(5) {
    transition: opacity .3s .6s, transform .3s .6s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li:nth-of-type(6),
header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li:nth-of-type(6) {
    transition: opacity .3s .65s, transform .3s .65s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li:nth-of-type(7),
header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li:nth-of-type(7) {
    transition: opacity .3s .7s, transform .3s .7s;
}
header .main-navigation ul.nav-list li:hover .list-dropdown ul li:nth-of-type(8),
header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li:nth-of-type(8) {
    transition: opacity .3s .75s, transform .3s .75s;
}
header .main-navigation ul.nav-list li .list-dropdown ul li a {
    width: 100%;
    padding: 4px 0;
    opacity: 0.8;
    color: var(--font-main-navigation-dropdown-color);
    font: var(--font-main-navigation-dropdown-list);
    transition: opacity .3s;
}
header .main-navigation ul.nav-list li .list-dropdown ul li a:hover {
    opacity: 1;
}
header .main-navigation ul.nav-list li .list-dropdown ul li a .nav-child-name {
    width: calc(100% - 70px);
    display: block;
}
header .main-navigation ul.nav-list li .list-dropdown .dropdown-media {
    max-width: 230px;
    width: 100%;
    padding: 40px 0 0 0;
    background: url(/content/_site_images/icon_darken-repeat.svg) repeat;
    background-color: var(--theme-secondary-color-2);
    border-radius: 25px 0 25px 0;
    display: flex;
    justify-content: center;
}
header .main-navigation ul.nav-list li .list-dropdown .dropdown-media .h2-like {
    width: calc(100% - 80px);
    margin: 0;
    opacity: 0.7;
    font: var(--font-main-navigation-dropdown-media);
    color: var(--font-body-opt-color);
    display: block;
}
/*header .main-navigation ul.nav-list li:hover .list-dropdown .dropdown-media, header .main-navigation ul.nav-list li:focus-within .list-dropdown .dropdown-media {*/
/*    opacity: 1;*/
/*    transform: translateY(0);*/
/*    transition: opacity .3s .4s, transform .3s .4s;*/
/*}*/
/* 'search-toggle'; nested in the main nav */
footer .show-more, footer .show-less {
    display: none;
}
footer .show-more svg, footer .show-less svg {
    fill: none;
    stroke: var(--font-secondary-button-color);
}
header .main-navigation ul.nav-list li.search-option {
    width: 54px;
    border-radius: 0 25px 0 0;
    z-index: 10;
    transition: background-color .2s, border-color .2s;
}
header .main-navigation ul.nav-list li.search-option a:not(.site-search-link) {
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-4);
    border-radius: 0 25px 0 25px;
    color: var(--font-body-opt-color);
    display: none;
    align-items: center;
    justify-content: center;
}
header .main-navigation ul.nav-list li.search-option a.desktop {
    display: flex;
}
header .main-navigation ul.nav-list li.search-option .option-icons {
    width: 100%;
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 10;
}
header.search-showing .main-navigation ul.nav-list li.search-option .option-icons .search-icon {/* 'hide' the normal search icon; if the search element has the "show-search" status */
    display: none;
}
header .main-navigation ul.nav-list li.search-option .option-icons .close-icon {/* by default, 'hide' the close icon (X) */
    display: none;
}
header.search-showing .main-navigation ul.nav-list li.search-option .option-icons .close-icon {/* 'show' the close icon; if the header has the "show-search" status */
    display: block;
}
header .main-navigation ul.nav-list li.search-option .option-backdrop {
    display: none;
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ Utility Navigation \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
header .utility-navigation {
    width: 100%;
    margin: 0 0 20px 0;
    padding: 20px 0 0;
    display: flex;
    column-gap: 18px;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    z-index: 1003;
}
header .utility-navigation.mobile-version {
    display: none;
}
header .utility-navigation .mobile-menu {
    width: 24px;
}
header .utility-navigation .mobile-menu .menu {
    width: 100%;
    display: flex;
    row-gap: 6px;
    flex-direction: column;
    position: relative;
}
header .utility-navigation .mobile-menu .menu .line {
    width: 100%;
    height: 1px;
    background-color: var(--theme-secondary-color-4);
    display: block;
}
header .utility-navigation .mobile-menu .menu .line:last-of-type {
    margin: 0;
}
/* highlight user options */
header .utility-navigation ul.panel-options {
    height: 100%;
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    column-gap: 18px;
    align-items: flex-start;
}
header .utility-navigation ul.panel-options li {
    height: 100%;
    margin: 0;
    display: flex;
    justify-content: center;
    position: relative;
}
header .utility-navigation ul.panel-options li.disabled {
    opacity: 0.3;
    pointer-events: none;
}
header .utility-navigation ul.panel-options li:before {
    content: "";
    width: 0;
    height: 0;
    background-color: transparent;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 7px solid var(--theme-secondary-color-4);
    border-radius: initial;
    opacity: 0.3;
    display: block;
    position: absolute; 
    top: -28px;
    left: calc(50% - 6px);
    transition: border-color .3s, opacity .3s;
}
header .utility-navigation ul.panel-options li:hover:before {
    opacity: 0.55;
}
header .utility-navigation ul.panel-options li.active:before{
    border-top-color: var(--theme-secondary-color-4);
    opacity: 1;
}
header .utility-navigation ul.panel-options li a {
    height: 20px;
    padding-top: 2px;
    color: var(--font-color-site-navigations);
    font: var(--font-utility-navigation);
    letter-spacing: 0.43px;
    text-transform: uppercase;
    opacity: 0.8;
    display: flex;
    align-items: center;
}
header .utility-navigation ul.panel-options li a:hover, header .utility-navigation ul.panel-options li.active a {
    opacity: 1;
    transition: opacity .3s;
}
/*header .utility-navigation ul.panel-options li.alert a {*/
/*    width: 20px;*/
/*    height: 17px;*/
/*    background: var(--alert-icon) no-repeat center;*/
/*    background-size: 100%;*/
/*    display: block;*/
/*}*/
header .utility-navigation ul.nav-list {
    margin: 0;
    list-style-type: none;
    display: flex;
    /*column-gap: 19px;*/
    justify-content: flex-end;
}
header .utility-navigation ul.nav-list li {
    position: relative;
}
/*header .utility-navigation ul.nav-list li.dropdown-included:after {*/
/*    content: "";*/
/*    border-left: 4px solid transparent;*/
/*    border-right: 4px solid transparent;*/
/*    border-top: 4px solid var(--font-color-site-navigations);*/
/*    position: absolute;*/
/*    top: calc(50% - (5px / 2) + 2px);*/
/*    right: 12px;*/
/*    pointer-events: none;*/
/*}*/
header .utility-navigation ul.nav-list li a {
    padding: 9px 11px 9px 3px;
    color: var(--font-color-site-navigations);
    font: var(--font-utility-navigation);
    letter-spacing: 0.43px;
    text-transform: uppercase;
    text-decoration: none;
    opacity: 1;
    display: flex;
    align-items: center;
    position: relative;
}
/*header .utility-navigation ul.nav-list li a:before {*/
/*    content: "";*/
/*    width: 0;*/
/*    height: 1px;*/
/*    background-color: var(--theme-primary-color-3);*/
/*    opacity: 0;*/
/*    display: block;*/
/*    position: absolute;*/
/*    bottom: 5px;*/
/*    left: 10px;*/
/*    transition: width .2s, opacity .2s;*/
/*    pointer-events: none;*/
/*}*/
/*header .utility-navigation ul.nav-list li a:after {*/
/*    background-color: var(--font-color-site-navigations);*/
/*}*/
/*header .utility-navigation ul.nav-list li:hover a:before {*/
/*    width: calc(100% - 20px);*/
/*    opacity: 1;*/
/*    transition: width .3s, opacity .3s;*/
/*}*/
header .utility-navigation ul.nav-list li.dropdown-included a {/* we increase the padding of list-item(s) with the "dropdown-included" class to make room for the down arrow pesudo element on the right of the text */
    /*padding-right: 7px;*/
}
header .utility-navigation ul.nav-list li div.list-toggle {
    width: 7px;
    height: 15px;
    padding: 0;
    position: absolute;
    top: calc(50% - (4px / 2));
    right: 3px;
    z-index: 5;
    pointer-events: none;
}
header .utility-navigation ul.nav-list li .list-dropdown {
    /*width: 100%;*/
    width: 174px;
    padding: 13px 19px;
    background-color: var(--theme-secondary-color-3);
    border-radius: 11px 0 31px 0;
    opacity: 0;
    position: absolute;
    top: 100%;
    left: 0;
    /*left: calc(50% - 125px);*/
    /*z-index: 99;*/
    transform: translateY(-15px);
    /*transition: opacity .2s, box-shadow .2s;*/
    transition: opacity .2s, box-shadow .2s, transform .2s;
    pointer-events: none;
}
header .utility-navigation ul.nav-list li:hover .list-dropdown, header .utility-navigation ul.nav-list li:focus-within .list-dropdown {
    /*box-shadow: 0 2px 4px #00000025;*/
    opacity: 1;
    transform: translateY(0);
    transition: opacity .3s .1s, box-shadow .3s .2s, transform .3s;
    pointer-events: all;
}
header .utility-navigation ul.nav-list li:last-of-type .list-dropdown {
    margin-right: 30px;
}
header .utility-navigation ul.nav-list li .list-dropdown ul:after {
    border: .5px solid var(--power-color-3);
    top: -1px;
}
header .utility-navigation ul.nav-list li .list-dropdown ul li a {
    width: 100%;
    padding: 2px 0;
    opacity: 0.7;
    font: var(--font-utility-navigation-dropdown);
    text-transform: initial;
    display: block;
    transition: opacity .3s;
}
header .utility-navigation ul.nav-list li .list-dropdown ul li a:hover {
    opacity: 1;
}
header .utility-navigation ul.nav-list li .list-dropdown ul li a:before {
    display: none;
}
header .utility-navigation ul.nav-social-list {
    margin: 0;
    display: flex;
    column-gap: 16px;
}
header .utility-navigation ul.nav-social-list li {
    text-align: center;
    display: flex;
}
header .utility-navigation ul.nav-social-list li:before {
    display: none;
}
header .utility-navigation ul.nav-social-list li a {
    opacity: 0.5;
    color: var(--font-color-site-navigations);
    font-size: 20px;
    line-height: 20px;
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: opacity .3s;
}
header .utility-navigation ul.nav-social-list li a:hover {
    opacity: 1;
}
header .utility-navigation ul.nav-social-list li a[href*="//"]:not(.skip-offsite):not([href*="https://www.milibrary.org/"]):not([href*="https://encore.milibrary.org/"]):after {
    display: none;
}
header .utility-navigation ul.nav-list li.dropdown-included:after {
    z-index: 5;
}
header .utility-navigation ul.nav-list li .link-name {
    display: block;
    position: relative;
    z-index: 5;
}
header .utility-navigation ul.nav-list li .link-backdrop {
    width: 100%;
    height: calc(100% - 7px);
    background-color: var(--theme-secondary-color-3);
    border-radius: 0 10px 0 10px;
    opacity: 0;
    display: block;
    position: absolute;
    top: 4px;
    left: 2px;
    z-index: 1;
    pointer-events: none;
    transition: opacity .2s, transform .2s;
}
header .utility-navigation ul.nav-list li:hover .link-backdrop {
    opacity: 1;
    transform: scaleX(1);
    pointer-events: all;
    transition: opacity .3s, transform .3s;
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ Top Searchbar \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.top-search-input {
    width: 100%;
    position: absolute;
    top: calc(100% - 47px);
    left: -999vh;
    z-index: 1;
    transition: left 0s .4s;
}
.top-search-input.show-search {
    left: 0;
    transition: none;
}
.top-search-input a.button-like.secondary {
    margin: 0;
}
.top-search-input .onsite-search {
    width: 100%;
    max-width: none;
    margin: 0;
    background-color: var(--body-bg-color);
    opacity: 0;
    transform: scaleX(0);
    transition: opacity .2s, transform .2s;
    pointer-events: none;
}
.top-search-input.show-search .onsite-search {
    opacity: 1;
    transform: scaleX(1);
    transition: opacity .3s .1s, transform .3s;
    pointer-events: all;
}
.top-search-input .onsite-search fieldset {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    /*opacity: 0;*/
    position: relative;
    /*transform: translateY(-5px);*/
    /*transition: opacity .2s, transform .2s;*/
}
/*.top-search-input.show-search .onsite-search fieldset {*/
/*    opacity: 1;*/
/*    transform: translateY(0);*/
/*    transition: opacity .3s .4s, transform .3s .4s;*/
/*}*/
.top-search-input .onsite-search fieldset:before {
    content: "";
    width: calc(100% - 2px);
    height: 100%;
    background-color: var(--body-bg-color, #FCFCFC);
    border: 1px solid var(--top-search-input-border-color);
    border-radius: 0 25px 0 0;
    opacity: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none;
    transition: opacity .2s;
}
.top-search-input.show-search.active .onsite-search fieldset:before {
    opacity: 1;
    transition: opacity .3s;
}
.top-search-input .onsite-search .onsite-search-icon {
    width: 70px;
    height: 70px;
    background-color: var(--theme-secondary-color-4);
    display: none;
    align-items: center;
    justify-content: center;
}
.top-search-input .onsite-search .onsite-search-label {
    width: 0px;
    height: 0px;
    text-indent: calc(-100vh + -9999px);
    display: block;
}
.top-search-input .onsite-search .onsite-search-input-container {
    width: 100%;
}
.top-search-input .onsite-search .onsite-search-input-container .onsite-search-input {
    margin: 0;
    padding: 14px 22px;
    background-color: transparent;
    border: 1px solid var(--top-search-input-border-color);
    border-radius: 0 24px 0 24px;
    color: var(--font-color-site-navigations);
    font: var(--font-top-search-input);
    position: relative;
    z-index: 10;
}
.top-search-input .onsite-search .onsite-search-input-container .onsite-search-input:focus {
    outline: none;
}
.top-search-input .onsite-search .onsite-search-input-container .onsite-search-input::placeholder {
    opacity: 0.5;
}
.top-search-input .search-results {
    width: 100%;
    padding: 45px;
    padding-top: 30px;
    display: none;
    flex-direction: column;
    position: relative;
    z-index: 5;
}
.top-search-input .search-results .title {
    font-size: 14px;
    line-height: 16px;
    font-weight: bold;
}
/*for tree mode*/
.top-search-input .search-results .onsite-search-catalog-results .category.title {
    flex: 0 0 100%;
    padding: 0 10px;
}
.search-results .result .cover-img {
    max-width: 35px;
    max-height: 70px;
    object-fit: cover;
    flex: 0 0 auto;
}   
.search-results .result .info-wrapper {
    flex: 1 1 0;
}
.search-results .result .title {
    font-weight: bold;
}
.search-results .result .author {
    font-style: italic;
}
.search-results .result .tag {
    margin: 0;
    display: inline-flex;
    gap: 3px;
    border-radius: 5px;
    padding: 0px 5px;
    align-items: center;
    border: 1px solid var(--brand-border-color);
    background-color: var(--brand-alternate-color-3);
}
.top-search-input .search-results .result .tag{
    font-size: .75em;
    font-weight: 300;
    opacity: .75;
}
.top-search-input .search-results .title i {
    margin: 0 5px 0 0;
    color: var(--font-top-search-results-color);
}
.top-search-input .search-results .catalog .result, .top-search-input .search-results .supplementary .result{
    display: flex;
    flex-direction: row;
    gap: 5px;   
}
.top-search-input .search-results .full-result-link:after{
    content: none; !important
}
.top-search-input .search-results .onsite-search-results, .top-search-input .search-results .onsite-search-catalog-results, .top-search-input .search-results .onsite-search-supplementary-results{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    column-gap: 30px;
    row-gap: 20px;
}
@keyframes search-spinner {
    0%   {transform: rotate(0deg);}
    25%  {transform: rotate(90deg);}
    50% {transform: rotate(180deg);}
    75%  {transform: rotate(270deg);}
    100% {transform: rotate(360deg);}
}
.top-search-input .search-results .result-category {
    flex-basis: calc(50% - 15px);
}
.top-search-input .search-results .result-category.direct-results {
    flex-basis: 100%;
}
.top-search-input .search-results .result-category.direct-results .result {
    margin-top: 0px;
    padding: 11px 17px 10px 17px;
    font: var(--font-top-search-results);
    display: inline-block;
}
.top-search-input .search-results .result-category.direct-results .result .icon {
    width: 18px;
    height: 18px;
    margin-right: 8px;
    display: inline-block;
    vertical-align: bottom;
}
.top-search-input .search-results .result-category.direct-results .result .icon svg {
    max-width: 100%;
    max-height: 100%;
}
.top-search-input .search-results .result-category .result {
    margin: 0 0 10px 0;
}
.top-search-input .search-results .result-category .result:last-of-type {
    margin: 0;
}
.top-search-input .search-results .onsite-search-results:before, .top-search-input .search-results .onsite-search-catalog-results:before , .top-search-input .search-results .onsite-search-supplementary-results:before {
    content: "";
    width: 10px;
    height: 10px;
    margin: 0 10px;
    border: 1px solid var(--hr-color);
    border-bottom: 1px solid var(--font-link-color);
    border-radius: 50%;
    display: none;
    transform-origin: 50% 50%;
    animation: search-spinner 1s infinite;
}
.top-search-input .search-results .onsite-search-results:after, .top-search-input .search-results .onsite-search-catalog-results:after, .top-search-input .search-results .onsite-search-supplementary-results:after{
    font-size: 10px;
    line-height: 12px;
    display: none;
    position: absolute;
    top: 0px;
    left: 25px;
}
.top-search-input .search-results .onsite-search-results:after {
    content: "Searching Site";
}
.top-search-input .search-results .onsite-search-catalog-results:after {
    content: "Searching Online Catalog";
}
.top-search-input .search-results .onsite-search-supplementary-results:after {
    content: "Searching EBSCO";
}
.top-search-input.searching-site .search-results .onsite-search-results:before, .top-search-input.searching-catalog .search-results .onsite-search-catalog-results:before, .top-search-input.searching-supplementary .search-results .onsite-search-supplementary-results:before, .top-search-input.searching-site .search-results .onsite-search-results:after, .top-search-input.searching-catalog .search-results .onsite-search-catalog-results:after, .top-search-input.searching-supplementary .search-results .onsite-search-supplementary-results:after {
    display: inline-flex;
}
.top-search-input .search-results .search-title-header {
    display: flex;
}
.top-search-input .search-results .search-title-header .search-link-to-catalog a {
    padding: 13px;
}
.top-search-input .search-results .onsite-search-results-title {
    margin: 21px 0 24px 0;
    font: var(--font-top-search-results-heading);
    flex-grow: 1;
}
.top-search-input .search-results .onsite-search-results-title:before {
    top: -6px;
}
.top-search-input .search-results .no-results {
    font: var(--font-top-search-results);
}
.top-search-input .search-results .onsite-search-results-title:first-of-type {
    margin: 0 0 24px 0;
}
/* search edits */
.top-search-input.search-open.active .search-results, .top-search-input.search-open.searching-site .search-results, .top-search-input.search-open.searching-catalog .search-results {
    display: inline-block;
}
.top-search-input.searching-site .search-results .no-results.site, .top-search-input.searching-catalog .search-results .no-results.catalog, .top-search-input.searching-site .onsite-search-results .result-category, .top-search-input.searching-catalog .onsite-search-catalog-results .result-category, .top-search-input.searching-supplementary .onsite-search-supplementary-results .result-category{
    display: none;
}
.top-search-input .onsite-search-results .result-category .title {
    margin: 0 0 13px 0;
    font: var(--font-top-search-results-title);
    display: flex;
    gap: 4px;
}
.top-search-input .summary {
    font-size: 12px;
    font-weight: 300;
    max-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-height: 18px;
    color: var(--font-body-color);
}
.top-search-input .onsite-search-results .result-category .result {
    margin-bottom: 5px;
    color: var(--font-top-search-results-color);
    font: var(--font-top-search-results);
}
.top-search-input .onsite-search-results .result-category .result strong{
    font-weight: 600;
}
.top-search-input .onsite-search-results .result-category .result a {
    padding: 0;
    background-color: transparent;
    color: var(--font-top-search-results-color);
    font: var(--font-top-search-results);
    font-weight: 600;
    text-decoration: none;
    display: block;
}
.top-search-input .onsite-search-results a.strike-through{
    text-decoration: line-through;  
}
.top-search-input .onsite-search-results .cancelled{
    font-size: 1em;
    margin-right: 3px;
}
header.show-mobile-menu .top-search-input.active .search-results, .top-search-input.show-search.active .search-results, .top-search-input.show-search.searching-site .search-results, .top-search-input.show-search.searching-catalog .search-results, .top-search-input.show-search.searching-supplementary .search-results{
    display: flex;
}
.top-search-input .onsite-search-results.active{
    display: flex;
    /*flex-direction: column;*/
}
.top-search-input.show-search.searching-site .direct-results.result-category {
    display: none;
}
.top-search-input .onsite-search fieldset a.button-like.full-results {
    width: auto;
    margin: 0 45px 45px 62px;
    padding: 8px 14px;
    border-radius: 15px 0 15px 0;
    opacity: 0;
    color: var(--font-button-color);
    font: var(--font-button);
    letter-spacing: initial;
    position: absolute;
    pointer-events: none;
    transition: opacity .2s;
}
.top-search-input.show-search.active .onsite-search fieldset a.button-like.full-results {
    opacity: 1;
    position: relative;
    pointer-events: all;
    transition: opacity .3s;
}
/*======================================================================
    BODY - styles | desktop
========================================================================*/
body {
    margin: 0;
    padding: 0;
    background-color: var(--body-barrens-bg-color);
    color: var(--font-body-color);
    font: var(--font-body);
    position: relative;
    overflow-x: hidden;
}
body:before {/* this pesudo element acts as a border for when the user's viewport is larger than the max (1440px)*/
    content: "";
    width: 100%;
    max-width: 1442px;
    height: 100%;
    background-color: var(--body-barrens-border-color);
    opacity: var(--body-barrens-border-opacity);
    display: block;
    position: absolute;
    top: 0;
    left: calc(50% - (1442px / 2));
    z-index: 1;
    pointer-events: none;
    transition: opacity .3s;
}
.main-content {
    width: 100%;
    /*max-width: 1440px;*/
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 30px 55px 30px;
    background-color: var(--body-bg-color, #FCFCFC);
    position: relative;
    z-index: 25;
}
.main-content.overlay-active {
    z-index: 35;
}
/* Page Banner; nested in the "main-content" */
.main-content .page-banner {
    width: 100%;
    margin: 0 0 48px 0;
    border-radius: 0px 90px 0px 90px;
    overflow: hidden;
}
.main-content .page-banner .banner-media {
    width: 100%;
    aspect-ratio: 3.87 / 1;
}
/* Page Content; nested in the "main-content", this element houses the page's...left sidebar, body content, and right sidebar(if present) */
.main-content .page-content {
    width: 100%;
    min-height: 400px;/* prevents the context navigation from being broken on pages that don't have any content set. */
    display: flex;
}
/* Page Content "home page" overrides; ensures the content isn't flexed */
.main-content.home .page-content {
    display: block;
}

.anchor-navigation {
    width: 100%;
    /*max-width: 183px;*/
    max-width: 1028px;
    /*margin-top: 15px;*/
    opacity: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    transform: translateY(-10px);
    transition: opacity .3s .1s, transform .3s;
    pointer-events: none;
    position: absolute;
    top: 50px;
    z-index: -1;
}
.anchor-navigation.fixed {
    position: fixed;
    /*right: 25px;*/
    z-index: 1;
}
.anchor-navigation.clip-to-bottom {
    position: absolute;
    top: auto;
    bottom: 91px;
}
.anchor-navigation.nav-loaded {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
}
.anchor-navigation a.button-like.list-toggle {
    width: 100%;
    max-width: 183px;
    margin: 0;
    padding-left: 19px;
    display: flex;
    column-gap: 5px;
    align-items: center;
}
.anchor-navigation a.button-like.list-toggle svg {
    /*transform: rotate(145deg);*/
    transform: rotate(180deg);
    /*transition: transform .3s;*/
}
/*.anchor-navigation.default-anchor-nav-show-state a.button-like svg, .anchor-navigation.show-anchor-nav a.button-like svg {*/
/*    transform: rotate(180deg);*/
/*}*/
.anchor-navigation ul {
    width: 100%;
    max-width: 183px;
    max-height: 0;
    margin: 0;
    padding: 0 20px;
    background-color: var(--theme-secondary-color-4);
    opacity: 0;
    transition: max-height .2s, padding .2s, opacity .2s;
    pointer-events: none;
}
.anchor-navigation.default-anchor-nav-show-state ul, .anchor-navigation.show-anchor-nav ul, .anchor-navigation ul:focus-within {
    max-height: 500px;
    padding: 17px 20px 22px;
    opacity: 1;
    transition: max-height .3s, padding .3s, opacity .3s;
    pointer-events: all;
}
.anchor-navigation.clip-to-bottom ul {
    transition: opacity .3s;
}
.anchor-navigation ul li {
    width: 100%;
    margin: 0;
    padding: 0;
}
.anchor-navigation ul li:before {
    display: none;
}
.anchor-navigation ul li a {
    padding: 5px 0;
    opacity: 0.75;
    font: var(--font-context-navigation-list-item);
    color: var(--font-body-alt-color);
    text-decoration: none;
    display: block;
    position: relative;
    transition: opacity .3s;
}
.anchor-navigation ul li a:before {
    content: "";
    width: 7px;
    height: 0;
    background-color: var(--theme-primary-color-3);
    position: absolute;
    top: 4px;
    left: -20px;
    transition: height .3s;
}
/*.anchor-navigation ul li a:focus:before {*/
/*    height: 23px;*/
/*}*/
.anchor-navigation ul li a:hover {
    opacity: 1;
}
.anchor-navigation a.button-like.return-to-top-button {
    width: 100%;
    max-width: 183px;
    margin: 0;
    display: none;
    column-gap: 8px;
    align-items: flex-end;
    justify-content: center;
}

/*======================================================================
    BODY - styles | desktop
========================================================================*/
/*----------------- Left Sidebar - styles | desktop -----------------*/
.left-sidebar {
    width: 100%;
    max-width: 200px;
    /*padding-left: 52px;*/
    position: relative;
    z-index: 10;
}
/*.left-sidebar:has( .event-preview-image) {*/
/*    max-width: 324px;*/
/*}*/
/* unique statuses for sidebar */
.left-sidebar.no-offset {/* this status is printed only when the page banner is not printed */
    margin-top: 0;
    padding-top: 50px;
}
.extended-sidebar .left-sidebar {
    max-width: 325px;
}
/* override base styles */
.left-sidebar ul {
    margin: 0;
}
.left-sidebar ul li {
    margin: 0;
    padding-left: 0;
}
.left-sidebar a.return-to {
    font: var(--font-return-to-link);
    text-underline-offset: 3px;
    /* position: relative; */
}
.left-sidebar .sidebar-media {
    margin: 48px 0 0 0;
}
/*
TODO! determine if this is worth using over a "<" key
.left-sidebar a.return-to:before {
    content: "";
    margin-right: 5px;
    width: 6px;
    height: 10px;
    background-color: var(--button-bg-color);
    display: inline-block;
    clip-path: polygon(0% 50%, 83.33% 0%, 100% 10%, 33.33% 50%, 100% 90%, 83.33% 100%);
}
.left-sidebar a.return-to:after {
    content: "";
    width: 100%;
    height: 1px;
    background-color: var(--button-bg-color);
    position: absolute;
    display: block;
    bottom: -1px;
    left: 0;
}
*/
.left-sidebar .event-preview-image {
    aspect-ratio: 1.6/1;
}
.left-sidebar .context-navigation {
    width: 100%;
    max-width: 183px;
    padding: 40px 38px;
    background-color: var(--theme-secondary-color-4);
    border-radius: 0 60px 0 60px;
    position: relative;
    z-index: 5;
}
.left-sidebar .context-navigation .styled {
    padding: 0;
}
.left-sidebar .context-navigation .styled:before {
    width: 8px;
    height: 18px;
    top: -2px;
    left: -13px;
}
.left-sidebar .context-navigation a {
    color: var(--font-body-opt-color);
    text-decoration: none;
    display: block;
}
.left-sidebar .context-navigation .nav-heading {
    margin-bottom: 15px;
    font: var(--font-context-navigation-heading);
    position: relative;
}
/*.left-sidebar .context-navigation .nav-heading:before {*/
/*    content: "";*/
/*    width: 7px;*/
/*    height: 20px;*/
/*    background-color: var(--theme-primary-color-3);*/
/*    display: none;*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: -20px;*/
/*}*/
/*.left-sidebar .context-navigation .nav-heading.active:before {*/
/*    display: block;*/
/*}*/
.left-sidebar .context-navigation .nav-group {
    width: 100%;
    margin: 0 0 15px 0;
}
.left-sidebar .context-navigation .nav-group:last-of-type {
    margin: 0;
}
.left-sidebar .context-navigation .nav-group .group-heading {
    margin: 0 0 9px 0;
    opacity: 0.8;
    color: var(--font-body-opt-color);
    font: var(--font-context-navigation-group-heading);
    letter-spacing: 0.58px;
    text-transform: uppercase;
    display: block;
}
.left-sidebar .context-navigation .nav-group ul.group-list {
    width: 100%;
}
.left-sidebar .context-navigation .nav-group ul.group-list li {
    width: 100%;
    position: relative;
}
.left-sidebar .context-navigation .nav-group ul.group-list li:before {
    display: none;
    border-radius: initial;
}
.left-sidebar .context-navigation .nav-group ul.group-list li.active:before {
    display: block;
}
.left-sidebar .context-navigation .nav-group ul.group-list li a {
    padding: 4px 0;
    font: var(--font-context-navigation-list-item);
    opacity: 0.8;
    transition: opacity .3s;
}
.left-sidebar .context-navigation .nav-group ul.group-list li a:hover {
    opacity: 1;
}
.left-sidebar .context-navigation .nav-group ul.group-list li a:after {
    background-color: var(--font-body-opt-color);
}
.left-sidebar .context-navigation .nav-group ul.group-list li.dropdown-toggle a {
    width: 31px;
    height: 31px;
    margin: 24px 0 0 0;
    background-image: url('/content/_theme_images/icon_button_arrow.svg');
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    transform: rotate(90deg);
}
/* show-all edits */
.left-sidebar .context-navigation ul.nav-list.show-all li {
    display: inline-block;
}
.left-sidebar .context-navigation ul.nav-list.show-all li.dropdown-toggle a {
    transform: rotate(-90deg);
}
/* multi edits */
.left-sidebar .context-navigation.multi a.nav-heading:first-of-type {
    padding: 0;
    font: var(--secondary-header-font);
}
.left-sidebar .context-navigation.multi .nav-heading.active:before {
    top: 17px;
}
.left-sidebar .context-navigation.multi .nav-heading.active:first-of-type:before {
    top: -3px;
}
/* fixed edits */
.left-sidebar .context-navigation.fixed {
    position: fixed;
    top: 50px;
}
.left-sidebar .context-navigation.clip-to-bottom {
    position: absolute;
    top: auto;
    bottom: 70px;
}
.return-to-top-segment {
    width: 100%;
    max-width: 235px;
    display: block;
    position: fixed;
    bottom: 40px;
    z-index: 1;
}
.return-to-top-segment.clip-to-bottom {
    position: absolute;
    /* bottom: -364px; */
    bottom: 0;
}
.return-to-top-segment a.button-like.return-to-top-button {
    width: 100%;
    max-width: 183px;
    margin: 0;
    opacity: 0;
    display: flex;
    column-gap: 8px;
    align-items: flex-end;
    justify-content: center;
    pointer-events: none;
    transition: opacity .2s;
}
.return-to-top-segment.reveal a.button-like.return-to-top-button {
    opacity: 1;
    pointer-events: all;
    transition: opacity .3s;
}
.return-to-top-segment a.button-like.return-to-top-button svg {
    transform: translateY(-1px);
}
/*----------------- Page Body - styles | desktop -----------------*/
.page-body {
    width: calc(100% - 520px);
    max-width: 936px;
    margin: 0 auto;
    position: relative;
    z-index: 5;
    margin-bottom: 50px;
}
.page-body.no-right-sidebar {
    width: calc(100% - 285px);
}
.page-body.enable-pesudo-right-sidebar {
    max-width: 1028px;
    margin: 0 25px;
    padding-right: calc(25% - 85px);
    transition: padding .3s;
}
.extended-sidebar .page-body.no-right-sidebar {
    /*width: calc(100% - 325px);*/
    width: calc(100% - 400px);
    padding-top: 82px;
}
.page-body:has( .single-event) {
    max-width: 847px;
}
.page-body.no-sidebar {
    max-width: 1179px;
    width: calc(100% - 70px);
}
/*----------------- Page Body > Assets - styles | desktop -----------------*/
/* Flippable Book; an attempt at creating a more global book element */
.flippable-book {
    color: var(--font-body-color);
    text-decoration: none;
    display: block;
}
.flippable-book figure {
    margin: 0 0 12px 0;
    position: relative;
}
.flippable-book figure img {
    display: block;
    position: relative;
    transform: scaleX(1);
    transform-origin: 50% 50%;
    transition: transform .2s;
}
.flippable-book:hover figure img {
    transform: scaleX(-1);
    transition: transform .3s;
}
.flippable-book figure figcaption {
    width: calc(100% + 1px);
    height: calc(100% + 1px);
    margin: 0;
    background-color: var(--theme-secondary-color-3);
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
    transform: scaleX(-1);
    transform-origin: 50% 50%;
    transition: transform .3s;
}
.flippable-book figure figcaption:before, .flippable-book figure figcaption:after {
    content: "";
    width: 100%;
    height: 5px;
    display: block;
    position: absolute;
    left: 0;
    z-index: 1;
    pointer-events: none;
}
.flippable-book figure figcaption:before {
    background: linear-gradient(var(--theme-secondary-color-3), transparent);
    top: 0;
}
.flippable-book figure figcaption:after {
    background: linear-gradient(transparent, var(--theme-secondary-color-3));
    bottom: 0;
}
.flippable-book:hover figure figcaption {
    opacity: 1;
    pointer-events: all;
    transform: scaleX(1);
    transition: transform .3s;
}
.flippable-book figure figcaption .book-description {
    width: 100%;
    max-height: 100%;
    padding: 5px;
    font: var(--font-materials-description);
    opacity: 0;
    text-align: center;
    display: block;
    overflow-y: auto;
    transition: opacity .3s;
}
.flippable-book:hover figure figcaption .book-description {
    opacity: 1;
    transition: opacity .3s .2s;
}
.flippable-book figure figcaption .book-description img {/* prevent images from showing in the cover description */
    display: none;
}
.flippable-book .book-title {
    width: 100%;
    max-height: 34px;
    margin: 0 0 5px 0;
    opacity: 0.8;
    color: var(--font-body-color);
    font: var(--font-materials-header);
    text-align: center;
    letter-spacing: 0.5px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: opacity .3s;
}
.flippable-book:hover .book-title {
    opacity: 1;
}
.flippable-book .book-author {
    width: 100%;
    max-height: 34px;
    color: var(--font-body-color);
    font: var(--font-full-segment-author);
    text-align: center;
    letter-spacing: 0.5px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.flippable-book .book-clickable-area {
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    
    background-color: rgba(255,0,0,0.4);
}

/* Overflow Segment; mainly used facilitate sections on the home page and the page banners */
.overflow-segment {
    width: var(--overflow-segment-width);
    max-width: var(--overflow-segment-maximum-width);
    margin: 0 auto;
    margin-bottom: 120px;/* ensure theres atleast enough margin to match the `content-board's` translate offset; this will prevent lower sections from getting covered */
    display: flex;
    transform: translateX(var(--overflow-segment-offset));
    
    /* override base variables */
    --font-header-color: #FFFFFF;
    --font-body-color: #FFFFFF;
    /*--wedge-height: 9px;*/
    --wedge-margin: 0 0 21px 0;
    --wedge-color: #FFFFFF;
}
/* different color schemes */
.overflow-segment.secondary-color-scheme {
    --overflow-segment-gradient-color-1: #52733F;
    --overflow-segment-gradient-color-2: #445C35;
}
.overflow-segment.tertiary-color-scheme {
    --overflow-segment-gradient-color-1: var(--theme-secondary-color-1);
    --overflow-segment-gradient-color-2: #80041B;
}
/* override base styles */
.overflow-segment h1, .overflow-segment .h1-like {
    opacity: 0.95;
}
.overflow-segment h3, .overflow-segment .h3-like {
    opacity: 0.95;
}
.overflow-segment .wedge {
    opacity: 0.95;
}
.overflow-segment .media-board {
    width: 100%;
    max-width: var(--overflow-segment-media-max-width);
    background: no-repeat center;
    background-size: cover;
    background-color: var(--theme-default-color);
    aspect-ratio: var(--overflow-segment-media-ratio);
    position: relative;
    /*transform: translateY(15px);*/
    /*transition: transform .3s .3s;*/
}
/*.overflow-segment.element-initialized .media-board {*/
/*    transform: translateY(0);*/
/*}*/
.overflow-segment .media-board:before {
    content: "";
    width: 100%;
    height: 100%;
    opacity: 1;
    background-color: var(--overflow-segment-gradient-color-1);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none;
    transition: opacity .3s .3s;
}
.overflow-segment .media-board.element-initialized:before {/* fade-out the media's pesudo cover after the image has been loaded */
    opacity: 0;
}
.overflow-segment .media-board .swiper {
    width: 100%;
    height: 100%;
}
.overflow-segment .media-board .swiper .swiper-wrapper .media-slide {
    width: 100%;
    height: 100%;
    background: no-repeat center;
    background-size: cover;
    aspect-ratio: var(--overflow-segment-media-ratio);
}
.overflow-segment .media-board .swiper .swiper-pagination {
    bottom: 30px;
}
.overflow-segment .media-board .swiper .swiper-pagination .swiper-pagination-bullet {
    padding: 24px;
    border: 1px solid var(--font-header-color);
    opacity: 0;
    transition: opacity .3s;
    transition-delay: .3s;
}
.overflow-segment.element-initialized .media-board .swiper .swiper-pagination .swiper-pagination-bullet {
    opacity: 1;
}
.overflow-segment .content-board {
    width: calc(100% - var(--overflow-segment-media-max-width));
    padding: 35px 0;
    padding-left: 15px;/* used to accommodate this block's pesudo `left-border` (:before) */
    background-image: linear-gradient(to right, var(--overflow-segment-gradient-color-1) 0%, var(--overflow-segment-gradient-color-2) 100%);
    /*border-left: 15px solid var(--theme-primary-color-2);*/
    display: flex;
    align-items: center;
    justify-content: center;
    /*transform: translateY(15px);*/
    position: relative;
    /*transition: transform .3s .3s;*/
}
/*.overflow-segment.element-initialized .content-board {*/
/*    transform: translateY(30px);*/
/*}*/
.overflow-segment .content-board:before {
    content: "";
    width: 15px;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    box-shadow: 5px 0 9px rgba(0,0,0,0.22);
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}
.overflow-segment .content-board .details {
    width: 100%;
    max-width: 420px;
}
/* Overflow Segment > Benefits List; used as a smaller horizontal list of items */
.overflow-segment .content-board .details .benefits-list {
    width: 100%;
    display: flex;
    column-gap: 28px;
    row-gap: 28px;
    flex-wrap: wrap;
}
/* override base styles */
.overflow-segment .content-board .details .benefits-list p {
    opacity: 0.8;
    font: var(--font-overflow-segment-benefit-body);
    text-align: center;
}
.overflow-segment .content-board .details .benefits-list .benefit-item {
    width: calc(33% - 28px);
    display: flex;
    flex-direction: column;
    row-gap: 11px;
    align-items: center;
}
.overflow-segment .content-board .details .benefits-list .benefit-item .item-icon {
    width: 50px;
    height: 50px;
    border: 1px solid var(--theme-primary-color-2);
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Overflow Segment > Donation List; used as a medium horizontal list of items */
.overflow-segment .content-board .details .donation-list {
    width: 100%;
    margin-top: 26px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 26px;
    row-gap: 35px;
}
.overflow-segment .content-board .details .donation-list .donate-option {
    width: calc(50% - 13px);
}
.overflow-segment .content-board .details .donation-list .donate-option .option-heading {
    margin: 0 0 10px 0;
    color: var(--theme-primary-color-2);
    font: var(--font-overflow-segment-donation-heading);
    display: flex;
    column-gap: 10px;
    align-items: center;
}
.overflow-segment .content-board .details .donation-list .donate-option p {
    font: var(--font-overflow-segment-donation-details);
}
/* Overflow Segment > Info Line; used to center svg next to text */
.overflow-segment .content-board .details .info-line {
    margin: 0 0 5px 0;
    /*font: var(--font-staff-item-info);*/
    display: flex;
    column-gap: 3px;
    align-items: center;
}
.overflow-segment .content-board .details .info-line .info-icon {
    width: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* "carousel" variant variables/styles - for `overflow segment` section */
.overflow-segment.carousel {
    --overflow-segment-media-max-width: 60%;
    --overflow-segment-media-ratio: 1.55 / 1;
}
.overflow-segment.carousel .content-board .details {
    max-width: 327px;
    padding-bottom: 13px;/* this padding accounts for the pagination underneath */
}
.overflow-segment.carousel .content-board .details .h1-like {
    max-height: 134px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.overflow-segment.carousel .content-board .details p {
    max-height: 134px;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.overflow-segment.carousel .swiper {
    width: 100%;
    padding: 0 0 30px 0;
    margin: 0;
}
.overflow-segment.carousel .swiper .swiper-wrapper {}
.overflow-segment.carousel .swiper .swiper-wrapper .swiper-slide {
    width: 100%;
    display: flex;
}
.overflow-segment.carousel .swiper .swiper-pagination {
    /*width: calc(100% - var(--overflow-segment-media-max-width));*/
    max-width: 327px;
    opacity: 0;
    line-height: 0;
    text-align: initial;
    display: flex;
    column-gap: 9px;
    justify-content: flex-start;
    bottom: 90px;
    /*left: calc(100% - (var(--overflow-segment-media-max-width) / 2));*/
    left: calc(var(--overflow-segment-media-max-width) + (((100% - var(--overflow-segment-media-max-width) - 327px)) / 2) + (15px / 2));
    /*right: calc((var(--overflow-segment-content-width) - 357px) / 2);*/
    transform: translateY(-15px);
    transition: opacity .3s .3s, transform .3s .3s;
    /*background-color: red;*/
}
.overflow-segment.carousel.element-initialized .swiper .swiper-pagination {
    opacity: 1;
    transform: translateY(0);
}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet {
    opacity: 0;
    transition: opacity .3s;
    transition-delay: .3s;
}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(2) {transition-delay: .4s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(3) {transition-delay: .5s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(4) {transition-delay: .6s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(5) {transition-delay: .7s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(6) {transition-delay: .8s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(7) {transition-delay: .9s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(8) {transition-delay: 1s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(9) {transition-delay: 1.1s;}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet:nth-of-type(10) {transition-delay: 1.2s;}
.overflow-segment.carousel.element-initialized .swiper .swiper-pagination .swiper-pagination-bullet {
    opacity: 1;
}
/* "banner" variant variables/styles - for `overflow segment` section */
.overflow-segment.banner {
    margin-bottom: 30px;
    
    /* override base variables */
    --font-header-1: normal 400 50px/51px "Inter Tight", sans-serif;
    --overflow-segment-media-max-width: 880px;
    --overflow-segment-media-ratio: 2.38 / 1;
}
/* override base styles */
.overflow-segment.banner h1, .overflow-segment.banner .h1-like {
    margin: 0;
}
.overflow-segment.banner .content-board .details {
    max-width: 327px;
    opacity: 0.7;
}
.overflow-segment.banner .media-banner {
    width: 100%;
    height: 318px;
    position: relative;
}
.overflow-segment.banner .media-banner.default {
    height: 100px;
    background-image: linear-gradient(to right, var(--overflow-segment-gradient-color-1) 0%, var(--overflow-segment-gradient-color-2) 100%);
    background-size: 100%;
}
.overflow-segment.banner .media-banner:before {
    content: "";
    width: 15px;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    top: 0;
    right: 0;
}
/* "bare" variant variables/styles - for `overflow segment` section; mainly used on the staff member pages */
.overflow-segment.bare {
    align-items: flex-start;
    
    /* ovverride base variables */
    --font-header-color: #0C0C0C;
    --font-body-color: #4B4B4B;
    --overflow-segment-gradient-color-1: var(--theme-secondary-color-4);
    --overflow-segment-gradient-color-2: var(--theme-secondary-color-4);
    --overflow-segment-media-ratio: 1 / 1;
}
/* override base styles */
.overflow-segment.bare h2, .overflow-segment.bare .h2-like {
    margin: 0 0 19px 0;
}
.overflow-segment.bare .content-board {
    padding: 40px 0;
    padding-left: 10px;
}
.overflow-segment.bare .content-board:before {
    width: 10px;
    box-shadow: none;
}
.overflow-segment.bare .content-board .details {
    max-width: 380px;
}

/* Perks List; used as a medium vertical list of items (by default) */
.perks-list {
    width: 100%;
    margin-top: 38px;
}
.perks-list .perk-item {
    width: 100%;
    margin-bottom: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.perks-list .perk-item:last-of-type {
    margin-bottom: 0;
}
.perks-list .perk-item .item-icon {
    width: 70px;
    height: 70px;
    border: 1px solid var(--theme-primary-color-2);
    display: flex;
    align-items: center;
    justify-content: center;
}
.perks-list .perk-item .item-info {
    width: calc(100% - 98px);
}
.perks-list .perk-item .item-info .item-info-heading {
    margin: 0 0 3px 0;
    font: var(--font-overflow-segment-perk-header);
    display: block;
}
/* Perks List > Row Variant; this changes the direction of which the perk items are flexed */
.perks-list.row-variant {
    display: flex;
    flex-wrap: wrap;
    column-gap: 63px;
    align-items: flex-start;
    justify-content: center;
}
.perks-list.row-variant .perk-item {
    width: calc(33% - 63px);
    flex-direction: column;
    justify-content: center;
}
.perks-list.row-variant .perk-item .item-icon {
    margin-bottom: 25px;
    border-color: var(--theme-primary-color-3);
}
.perks-list.row-variant .perk-item .item-info {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.perks-list.row-variant .perk-item .item-info .item-info-heading {
    margin: 0 0 5px 0;
    text-align: center;
}
.perks-list.row-variant .perk-item .item-info p {
    margin: 0;
    text-align: center;
}

/* Authors List; displays in tile form multiple authors */
.authors-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 50px;
    row-gap: 33px;
        
    
    --font-header-color: #4E4E4E;
    --font-header-4: normal 400 19px/24px "Inter Tight", sans-serif;
    --font-body: normal 400 16px/18px "Inter Tight", sans-serif;
    --font-body-color: #505050;/* was #878787 */
    --font-link-color: var(--font-header-color);
    --font-link: normal 300 14px/16px "Inter Tight", sans-serif;
}
/* override base styles */
.authors-list h4, .authors-list .h4-like {
    margin: 0 0 6px 0;
    text-align: center;
}
.authors-list p {
    margin: 0;
    text-align: center;
}
.authors-list .author-item {
    width: calc((100% - 100px) / 3);
    padding: 23px 10px 28px;
    background-color: var(--theme-secondary-color-4);
    border-left: 15px solid var(--theme-primary-color-3);
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}
.authors-list .author-item .item-media {
    /* width: 190px; */
    /* height: 190px; */
    width: 100%;
    height: auto;
    max-width: 190px;
    margin: 0 0 12px 0;
    border-radius: 50%;
    display: block;
    position: relative;
    aspect-ratio: 1/1;
}
.authors-list .author-item .item-media:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--theme-primary-color-3);
    border-radius: 50%;
    display: block;
    position: absolute;
    transition: opacity .3s .3s;
}
.authors-list .author-item .item-media.element-initialized:before {
    opacity: 0;
}
.authors-list .author-item .item-books {
    width: 100%;
    margin: 21px 0 0 0;
    display: flex;
    column-gap: 22px;
    justify-content: center;
}
.authors-list .author-item .item-books .book {
    display: flex;
    flex-direction: column;
    align-items: center;
    /*justify-content: center;*/
}
.authors-list .author-item .item-books .book .book-media {
    width: 57px;
    height: 88px;
    margin: 0 0 10px 0;
    box-shadow: -3px 7px 13px rgba(0,0,0,0.23);
    display: block;
    position: relative;
}
.authors-list .author-item .item-books .book .book-media:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--theme-primary-color-3);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .3s .3s;
}
.authors-list .author-item .item-books .book .book-media.element-initialized:before {
    opacity: 0;
}
.authors-list .author-item .item-books .book a {
    text-align: center;
}

/* Engagement List; atleast three column layout highlighting user call to actions */
.engagement-list {
    width: 100%;
    display: flex;
    justify-content: space-between;
    
    --font-header-color: #4E4E4E;
    --font-body-color: #505050;/* was #878787 */
}
/* override base styles */
.engagement-list h3, .engagement-list .h3-like {
    margin: 0 0 10px 0;
    text-align: center;
}
.engagement-list p {
    margin: 0;
    text-align: center;
}
.engagement-list a.button-like.secondary {
    margin: 20px 0 0 0;
}
.engagement-list .engagement-item {
    width: calc(33% - 30px);
    padding: 25px 15px 38px;
    background-color: var(--theme-secondary-color-4);
    border-left: 10px solid var(--theme-primary-color-3);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.engagement-list .engagement-item svg {
    margin: 0 0 19px 0;
}

/* Fixed Prompt; a fixed element that houses a 'prompt' styled button */
.fixed-prompt {
    width: 100%;
    max-width: 1440px;
    padding: 0 30px 30px 0;
    opacity: 0;
    display: flex;
    justify-content: flex-end;
    position: fixed;
    bottom: 0;
    left: calc(50% - (1440px / 2));
    z-index: 50;
    pointer-events: none;
    transition: opacity .3s;
}
.fixed-prompt.reveal {
    opacity: 1;
    pointer-events: all;
}

/* Basic Overlay; */
.overlay-content {
    display: none;
}
.basic-overlay {
    width: 100%;
    height: 100%;
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    animation: fade-in-basic-overlay .3s forwards;
    
    --body-bg-color: var(--theme-secondary-color-4);
}
.basic-overlay.hide-overlay {
    animation: fade-out-basic-overlay .3s forwards;
}
.basic-overlay .overlay-background {
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-3);
    opacity: 0.25;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.basic-overlay .overlay-content {
    width: 80%;
    max-width: 1171px;
    padding: 0 50px;
    padding-left: 60px;
    background-color: var(--overlay-bg-color);
    display: block;
    position: relative;
    z-index: 5;
    transform: translateY(15px);
    transition: transform .3s;
    animation: move-up-basic-overlay-content .3s forwards;
}
.basic-overlay.hide-overlay .overlay-content {
    animation: move-higher-up-basic-overlay-content .3s forwards;
}
.basic-overlay .overlay-content:before {
    content: "";
    width: 10px;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
.basic-overlay .overlay-content .overlay-close-icon {
    opacity: 0.75;
    font-size: 13px;
    line-height: 15px;
    text-decoration: none;
    position: absolute;
    top: 18px;
    right: 22px;
    z-index: 10;
    transition: opacity .3s;
}
.basic-overlay .overlay-content .overlay-close-icon:hover {
    opacity: 1;
}
.basic-overlay .overlay-content .overlay-close-icon:before,
.basic-overlay .overlay-content .overlay-close-icon:after {
    content: "";
    width: 1px;
    height: 14px;
    background-color: var(--theme-primary-color-3);
    display: block;
    position: absolute;
    top: 1px;
    left: -10px;
}
.basic-overlay .overlay-content .overlay-close-icon:before {
    transform: rotate(46deg);
}
.basic-overlay .overlay-content .overlay-close-icon:after {
    transform: rotate(-46deg);
}
/* Basic Overlay > Animations */
@keyframes fade-in-basic-overlay {
  0%   {opacity: 0;}
  100% {opacity: 1;}
}
@keyframes fade-out-basic-overlay {
  0%   {opacity: 1;}
  100% {opacity: 0;}
}
@keyframes move-up-basic-overlay-content {
  0%   {transform: translateY(15px);}
  100% {transform: translateY(0);}
}
@keyframes move-higher-up-basic-overlay-content {
  0%   {transform: translateY(0);}
  100% {transform: translateY(-15px);}
}
/* ===== CHESS GAME INTERFACE ===== */
/* Viewer Layout - now works within overlay */
.viewer-layout {
    flex: 1;
    overflow: hidden;
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 0;
}
/* Game Sidebar */
.game-sidebar {
    max-height: 100%;
    padding: 1rem;
    background-color: var(--theme-secondary-color-4);
    border-bottom: 1px solid var(--body-barrens-border-color);
    overflow-y: auto;
}
.game-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Game Main Content */
.game-main {
    padding: 1rem;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.game-item {
    padding: 0.75rem;
    background-color: var(--body-bg-color, #FCFCFC);
    border: 1px solid var(--body-barrens-border-color);
    /*font-size: 0.875rem;*/
    cursor: pointer;
    transition: all 0.2s ease;
}
.game-item:hover {
    background-color: var(--button-hover-bg-color);
    /*border-color: #adb5bd;*/
    color: var(--font-button-color);
    /*transform: translateY(-1px);*/
    /*box-shadow: 0 2px 4px rgba(0,0,0,0.1);*/
}
.game-item:focus {
    /*outline: none;*/
    background-color: var(--button-hover-bg-color);
    /*border-color: #007bff;*/
    color: var(--font-button-color);
    /*box-shadow: 0 0 0 3px rgba(0,123,255,0.25);*/
}
.game-item:focus:not(:hover) {
    transform: none;
}
.game-item.active {
    background-color: var(--button-bg-color);
    color: var(--font-button-color);
    border-color: var(--button-bg-color);
    /*box-shadow: 0 2px 8px rgba(0,123,255,0.3);*/
}
.game-item.active:focus {
    /*box-shadow: 0 2px 8px rgba(0,123,255,0.3), 0 0 0 3px rgba(255,255,255,0.5);*/
}
.game-item-header {
    margin-bottom: 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.game-item-header span:first-of-type {
    font: var(--font-header-5);
}
.game-item-players {
    font: var(--font-game-players);
}
.game-item-players div {
    margin-bottom: 4px;
}
.game-item-players div:last-of-type {
    margin-bottom: 0;
}
.game-result {
    padding: 2px 6px;
    font-size: 0.7rem;
    font-weight: bold;
    /*border-radius: 3px;*/
}
.game-result.white-win {
    background-color: #28a745;
    color: white;
}
.game-result.black-win {
    background-color: #343a40;
    color: white;
}
.game-result.draw {
    background-color: #6c757d;
    color: white;
}

/* Game Main Content */
.game-main {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.game-main #game-header h3 {
    margin: 0;
    color: #212529;
    font-size: 1.25rem;
}
.game-main #game-header p {
    margin: 0;
    color: #495057;
    font-size: 0.875rem;
}
.game-main .chess-interface {
    /*display: grid;*/
    display: flex;
    grid-template-columns: 1fr 300px;
    /*gap: 2rem;*/
    gap: 1rem;
    align-items: start;
}
.game-main .chess-interface .chess-board-container {
    /*width: min(400px, calc(100% - 2rem));*/
    width: calc(100% - 200px);
    max-width: 100%;
    height: auto;
    max-height: 100%;
    min-height: 400px;
    padding: 1rem;
    background-color: var(--theme-secondary-color-4);
    border: 1px solid var(--body-barrens-border-color);
    /*flex-shrink: 1;*/
    display: flex;
    row-gap: 10px;
    flex-direction: column;
    align-items: center;
    /*justify-content: center;*/
    /*aspect-ratio: 1 / 1;*/
    overflow: hidden;
}
.game-main .chess-interface .chess-board-container .chess-board {
    width: min(550px, 100%);
    height: min(400px, 100%);
    aspect-ratio: 1 / 1;
    border: 2px solid #333;
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(8, 1fr);
    background-color: #fff;
    max-width: 100%;
    max-height: 100%;
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.2s ease;
    position: relative;
    aspect-ratio: 1 / 1;
    min-height: 0;
    min-width: 0;
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square.light {
    background-color: #f0d9b5;
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square.dark {
    background-color: #b58863;
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square.highlight {
    background-color: #ffffcc !important;
    box-shadow: inset 0 0 8px rgba(255, 235, 59, 0.8);
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square.last-move {
    background-color: #ffeb3b !important;
    opacity: 0.7;
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square.from-square {
    background-color: #4caf50 !important;
    opacity: 0.8;
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square .chess-piece {
    user-select: none;
	font-size: 55px;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square .chess-piece.white {
    color: white;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.8), 
                 -1px -1px 1px rgba(0,0,0,0.8),
                 1px -1px 1px rgba(0,0,0,0.8),
                 -1px 1px 1px rgba(0,0,0,0.8);
}
.game-main .chess-interface .chess-board-container .chess-board .chess-square .chess-piece.black {
    color: #333;
    text-shadow: 1px 1px 1px rgba(255,255,255,0.3);
}
.game-main .chess-interface .chess-board-container .move-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    /*max-width: 400px;*/
}
.game-main .chess-interface .chess-board-container .move-navigation #move-counter {
    min-width: 80px;
    margin: 0 1rem;
    /*color: #495057;*/
    font-weight: 600;
    text-align: center;
	flex-grow: 1;
}
.game-main .chess-interface .chess-board-container .move-navigation button {
    margin: 0;
}
.game-main .chess-interface .game-controls {
    max-height: 600px;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
/*
.nav-btn {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: bold;
    transition: background-color 0.2s ease;
    min-width: 40px;
}
.nav-btn:hover {
    background-color: #0056b3;
}
.nav-btn:disabled {
    background-color: #6c757d;
    cursor: not-allowed;
}
*/
.game-main .chess-interface .game-controls .move-list-container {
    width: 200px;
    /*max-height: 400px;*/
    background-color: var(--theme-secondary-color-4);
    border: 1px solid var(--body-barrens-border-color);
    padding: 1rem;
    overflow-y: auto;
}
.game-main .chess-interface .game-controls .move-list-container h3 {
    margin: 0 0 10px 0;
    /*color: var(--font-button-color);*/
}
.game-main .chess-interface .game-controls .move-list-container .move-list {
    font-family: 'Courier New', monospace;
    font-size: 0.875rem;
    line-height: 1.6;
    /*max-height: 300px;*/
    overflow-y: auto;
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair {
    margin-bottom: 0.25rem;
    color: var(--font-body-color);
    display: flex;
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-number {
    font-weight: bold;
    /*color: #495057;*/
    width: 30px;
    flex-shrink: 0;
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item {
    margin-right: 8px;
    padding: 2px 4px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item:hover {
    background-color: var(--button-secondary-bg-color);
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item.current {
    background-color: var(--button-bg-color);
    color: var(--font-button-color);
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item.played {
    background-color: var(--button-secondary-bg-color);
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item.unplayed {
    /*color: #adb5bd;*/
}
/* Moves with annotations (NAGs) styling */
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item.move-with-annotation {
    position: relative;
    font-weight: 500;
}
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item.move-with-annotation::after {
    content: '•';
    color: #0056b3;
    font-size: 0.8em;
    margin-left: 2px;
    vertical-align: super;
}
/* Enhanced tooltip styling for better visibility */
.game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item.move-with-annotation[title]:hover::before {
    content: attr(title);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #333;
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 1000;
    margin-bottom: 4px;
    pointer-events: none;
    opacity: 0;
    animation: fadeIn 0.2s ease-in forwards;
}

@keyframes fadeIn {
    to {
        opacity: 1;
    }
}

/* Load Button Styling */
button[data-filename] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

button[data-filename]:hover {
    background-color: #0056b3;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    transform: translateY(-1px);
}

button[data-filename]:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Overlay Styles */
.viewer-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    display: none;
}
.viewer-overlay .overlay-backdrop {
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-3);
    opacity: 0.25;
    position: fixed;
    top: 0;
    left: 0;
    backdrop-filter: blur(4px);
}
.viewer-overlay .overlay-content {
    width: 95%;
    height: 90%;
    max-width: 1200px;
    margin: 2.5% auto;
    background-color: var(--body-bg-color, #FCFCFC);
    /*border-radius: 12px;*/
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}
.viewer-overlay .overlay-header {
    width: 100%;
    padding: 0;
    background-color: var(--theme-secondary-color-4);
    border-bottom: 1px solid var(--body-barrens-border-color);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.viewer-overlay .overlay-header-content {
    flex: 1;
}
.viewer-overlay .overlay-header h2 {
    margin: .25rem 1rem;
    /*color: #495057;*/
    font-size: 1.25rem;
}
.viewer-overlay .close-btn {
    width: 32px;
    height: 32px;
    padding: 0;
    background-color: transparent;
    color: var(--font-header-color);
    font-size: 28px;
    /*display: flex;*/
    display: block;
    /*align-items: center; */
    justify-content: center;
}
.viewer-overlay .close-btn:before {
    display: none;
}
.viewer-overlay .close-btn:hover {
    background-color: #e9ecef;
    color: #495057;
}
.viewer-overlay .close-btn:focus {
    outline: 2px solid #007bff;
    outline-offset: 2px;
}
.viewer-overlay .viewer-layout {
    flex: 1;
    overflow: hidden;
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 0;
}


/* Archives Component; has a `featured` element while having a column on the side with two other elements */
.archives-component {
    width: 100%;
    display: flex;
    justify-content: space-between;
    
    --font-header-color: #4E4E4E;
    --font-body-color: #505050;/* was #878787 */
}
.archives-component h4 {
    margin: 0 0 12px 0;
}
.archives-component h5 {
    margin: 0 0 5px 0;
}
.archives-component p {
    margin: 0;
}
.archives-component .featured-archive {
    width: calc(60% - 26px);
    position: relative;
}
.archives-component .featured-archive:before {
    content: "";
    width: calc(100% - 10px);
    height: 100%;
    background-color: var(--theme-secondary-color-4);
    border-left: 10px solid var(--theme-primary-color-2);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.archives-component .featured-archive p:first-of-type {
    margin: 0 0 14px 0;
}
.archives-component .featured-archive .media {
    width: 100%;
    aspect-ratio: 1.42 / 1;
    display: block;
    position: relative;
    z-index: 5;
}
.archives-component .featured-archive .media:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .3s .3s;
}
.archives-component .featured-archive .media.element-initialized:before {
    opacity: 0;
}
.archives-component .featured-archive .details {
    width: 100%;
    padding: 40px 43px 70px;
    position: relative;
    z-index: 5;
}
.archives-component .archives-list {
    width: 40%;
}
.archives-component .archives-list .archives-item {
    width: 100%;
    margin: 0 0 26px 0;
}
.archives-component .archives-list .archives-item:last-of-type {
    margin: 0;
}
.archives-component .archives-list .archives-item .item-media {
    width: 100%;
    aspect-ratio: 1.62 / 1;
    display: block;
    position: relative;
}
.archives-component .archives-list .archives-item .item-media:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .3s .3s;
}
.archives-component .archives-list .archives-item .item-media.element-initialized:before {
    opacity: 0;
}
.archives-component .archives-list .archives-item .item-details {
    width: 100%;
    padding: 26px 20px;
    background-color: var(--theme-secondary-color-4);
    border-left: 10px solid var(--theme-primary-color-2);
}

/* Special Collection Item; simple column element with centered assets */
.collection-item {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
/* override base styles */
.collection-item h3, .collection-item .h3-like {
    margin: 0 0 10px 0;
    text-align: center;
}
.collection-item p {
    margin: 0;
    text-align: center;
}
.collection-item .item-media {
    width: 100%;
    margin: 0 0 20px 0;
    aspect-ratio: 1 / 1;
    display: block;
}
.collection-item .timeframe {
    margin: 0 0 10px 0;
    opacity: 0.4;
    color: var(--font-body-alt-color);
    font: var(--font-event-list-details);
    text-align: center;
    display: block;
}

/* eResource Item; usually nested in a slider element */
.eresource-item h4 {
    margin: 0 0 12px 0;
    max-height: 29px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.eresource-item p {
    margin: 0;
    max-height: 57px;
    font: var(--font-baluster-description, --font-body);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.eresource-item a.button-like.secondary {
    margin: 9px 0 0 0;
}
.eresource-item .item-media {
    width: 100%;
    max-width: 300px;
    margin: 0 0 9px 0;
    /*aspect-ratio: 1.58 / 1;*/
    aspect-ratio: 30 / 19.1;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-size: calc(100% - 20px);
}
.eresource-item .item-media:not(.default) {
    background-color: var(--select-bg-color);
}
.eresource-item .item-media.default {
    background-size: auto;
    background-repeat: repeat;
}


.preload-cover {
    position: relative;
}
.preload-cover:before {
    content: "";
    width: 100%;
    height: 100%;
    background: url(/content/_site_images/icon_darken-repeat.svg) repeat;
    background-color: var(--preload-cover-bg-color);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    transition: opacity .3s .5s;
}
.site-loaded .preload-cover.element-initialized:before {
    opacity: 0;
}

/* turn the .segment-filter global */
.segment-filter {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    /*column-gap: 10px;*/
    row-gap: 10px;
    align-items: center;
    justify-content: center;
}
.segment-filter:has( .skeleton-placeholder) {
    background-color: gray;
}
.segment-filter li {
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 14px;
}
.segment-filter li:before {
    display: none;
}
.segment-filter li.favorited:after, .segment-filter li.preferred-favorite:after {
    top: -1px;
    left: 0px;
}
.segment-filter li.disabled {
    opacity: 0.25;
    pointer-events: none;
}
.segment-filter li a {
    padding: 2px 10px;
    background-color: transparent;
    color: var(--font-link-color);
    font: var(--font-full-segment-filter-item);
    text-decoration: none;
    display: block;
    transition: background-color .2s;
}
.segment-filter li a:hover, .segment-filter li.active a {
    background-color: var(--button-secondary-bg-color);
    color: var(--font-header-color);
    transition: background-color .3s, color .3s; /* replaces existing css */
}
.segment-filter li.skeleton-placeholder a, .segment-filter li.skeleton-placeholder a.active {
    background-color: gray !important;
    color: gray !important;
}

.tag-list {
    margin: 0 0 23px 0;
    display: flex;
}
.tag-list li {
    margin: 0 10px 0 0;
    padding: 0;
}
.tag-list li:last-of-type {
    margin: 0;
}
.tag-list li:before {
    display: none;
}
.tag-list li a, .tag-list li .tag {
    padding: 4px 8px;
    background-color: var(--body-bg-color, #FCFCFC);
    border: 0.5px solid var(--theme-secondary-color-6);
    border-radius: 0 6px 0 6px;
    color: var(--font-body-color);
    text-decoration: none;
    font: var(--font-tag-list);
    text-transform: uppercase;
    display: block;
    transition: background-color .3s, border-color .3s;
}
.tag-list li.active a, .tag-list li a:hover {
    background-color: var(--theme-secondary-color-1);
    border-color: transparent;
}

.full-segment {
    width: 100%;
    /*max-width: 1011px;*/
    margin: 0 auto 125px auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
/* override base styles */
.full-segment .h2-like {
    margin: 0 0 12px 0;
}
.full-segment a.button-like {
    margin: 25px 0 0 0;
}
.full-segment .segment-heading-row:not(:has( > *)) {
    margin: 0 !important;
}
.full-segment .segment-heading-row {
    width: 100%;
    max-width: 677px;
    margin: 0 0 28px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 20;
}
.full-segment:has( .events-list) .segment-heading-row {
    align-items: flex-start;
}
.full-segment .segment-heading-row p {
    margin: 0 0 15px 0;
    text-align: center;
}
.full-segment .segment-heading-row a.button-like.secondary {
    margin: 0 0 0 auto;
    /*transform: translateY(20px);*/
}
.full-segment .segment-heading-row.text-included a.button-like.secondary {
    transform: translateY(0);
}
.full-segment .segment-content-row {
    width: 100%;
    position: relative;
}
.full-segment .segment-content-row .content-elem {/* by default, these .content-elem elements are hidden; until they're given the "show" state */
    width: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: translateY(15px);
    transition: opacity .3s, transform .3s;
    pointer-events: none;
}
.full-segment .segment-content-row .content-elem.show {/* reveal the .content element when it has the "show" state */
    opacity: 1;
    position: relative;
    transform: translateY(0);
    transition: opacity .4s .1s, transform .4s;
    pointer-events: all;
}
.full-segment .segment-content-row .content-elem .segment-subheader {
    width: 100%;
    margin: 0 0 30px 0;
    font: var(--font-subheader);
    text-transform: uppercase;
    display: block;
}
/* full-segment skeleton styles */
.full-segment.has-skeleton {
    --skeleton-opacity: 0;
    --skeleton-transition: opacity .3s;
}
.full-segment.skeleton-active {
    --skeleton-opacity: 1;
    --skeleton-transition: opacity .3s;
}
.full-segment.has-skeleton .segment-heading-row:after, .full-segment.has-skeleton .personal-item .item-media:after, .full-segment.has-skeleton .personal-item .item-content .h3-like:after, .full-segment.has-skeleton .personal-item .item-content p:after, .full-segment.has-skeleton .personal-item .item-content a.button-like:after, .full-segment.has-skeleton .personal-item .quicklinks-paths a.path:after, .full-segment.has-skeleton .personal-item .item-content .booklist-books .book:after, .full-segment.has-skeleton .eresource-item .item-media:after, .full-segment.has-skeleton .eresource-item .item-content .h3-like:after, .full-segment.has-skeleton .eresource-item .item-content h4:after, .full-segment.has-skeleton .eresource-item .item-content p:after, .full-segment.has-skeleton .eresource-item .item-content .eresource-buttons:after, .full-segment.has-skeleton .upcoming-events .featured-event .event-media:after, .full-segment.has-skeleton .upcoming-events .featured-event .event-content .details h4:after, .full-segment.has-skeleton .upcoming-events .featured-event .event-content p:after, .full-segment.has-skeleton .upcoming-events .featured-event .event-content .event-buttons:after, .full-segment.has-skeleton .upcoming-events .basic-events .event:after, .full-segment.has-skeleton .segment-filter:after {
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(211,211,211,1);
    opacity: var(--skeleton-opacity);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none;
    transition: var(--skeleton-transition);
}
.full-segment.has-skeleton .segment-filter:after {
    opacity: 0;
}
.full-segment.has-skeleton.skeleton-rearranging-filters .segment-filter:after {
    opacity: 1;
}
/* make element has relative positioning for the skeleton */
.full-segment.has-skeleton .personal-item .item-media, .full-segment.has-skeleton .personal-item .item-content .h3-like, .full-segment.has-skeleton .personal-item .item-content p, .full-segment.has-skeleton .personal-item .quicklinks-paths a.path, .full-segment.has-skeleton .eresource-item .item-content .h3-like, .full-segment.has-skeleton .eresource-item .item-content h4, .full-segment.has-skeleton .eresource-item .item-content p, .full-segment.has-skeleton .upcoming-events .featured-event .event-content .details h4, .full-segment.has-skeleton .upcoming-events .featured-event .event-content p, .full-segment.has-skeleton .upcoming-events .featured-event .event-content .event-buttons, .full-segment.has-skeleton .upcoming-events .basic-events .event, .full-segment.has-skeleton .segment-filter {
    position: relative;
}
.full-segment.has-skeleton .skeleton-item {
    position: relative;
}
.full-segment.has-skeleton .skeleton-item:after {
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--skeleton-color);
    opacity: 1;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none;
    transition: opacity .3s;
}
.full-segment.segment-initialized .skeleton-item:before {
    opacity: 0;
}
/* when the segment has the 'segment-initialized'; always show the filter row(segment-heading-row) */
.full-segment.segment-initialized .segment-heading-row:after {
    opacity: 0;
    transition: none;
}
.full-segment.reveal-segment-content .segment-content-row .content-elem {
    opacity: 0;
    animation: reveal-for-you-content .3s ease-out forwards;
}
@keyframes reveal-for-you-content {
0%   {
        opacity: 0;
        transform: translateY(15px);
    }
100% {
        opacity: 1;
        transform: translateY(0);
    }
}
/* "pillar-variant" styles for the `Full Segment` */
.full-segment.pillar-variant {}
.full-segment.pillar-variant a.button-like {
    margin-top: 43px;
}
.full-segment.pillar-variant .segment-heading-row {
    row-gap: initial;
    justify-content: center;
}
.full-segment.pillar-variant .segment-heading-row p {
    width: calc(100% - 140px);
    margin-bottom: 27px;                                                                                                                                                                                                                                                                                                                                                                                                                                                                                
    text-align: center;
}
/* global style for the swiper.js sliders - https://swiperjs.com/ */
.slider-container {
    position: relative;
}
/* unique booklist style of the container - we force the container to the left because of the extra padding needed for this slider */
.slider-container:before {
    content: "";
    width: 50px;
    height: 50px;
    border: 1px solid var(--body-media-bg-color);
    border-bottom: 1px solid #000;
    border-radius: 50%;
    opacity: 0;
    display: block;
    transform-origin: 50% 50%;
    position: absolute;
    top: calc(50% - 25px);
    left: calc(50% - 25px);
    z-index: 25;
    pointer-events: none;
    animation: search-spinner .75s infinite linear;
    transition: opacity .3s;
}
body.resizing .slider-container:before {
    opacity: 1;
}
.slider-container .swiper {
    /*width: calc(100% - 20px);*/
    margin: 0;
    /*padding: 0 20px;*/
    padding: 0 55px;
    opacity: 1;
    transition: opacity .3s;
}
body.resizing .slider-container .swiper {
    opacity: .4;
}
.swiper-fade .swiper-slide {
    opacity: 0;
    pointer-events: none;
}
.swiper-fade .swiper-slide-active {
    opacity: 1;
    pointer-events: all;
}
/* book-themed sections */
.slider-container.materials .item-media-image.default {
    background-image: url('/content/_site_images/icon_placeholder-mark.svg');
}
/* skeleton unique styles */
.swiper-slide.skeleton-placeholder .item-media:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: gray;
}
.swiper-slide.skeleton-placeholder .item-heading, .swiper-slide.skeleton-placeholder .item-author {
    background-color: gray;
    color: gray;
}
/* unique sizing for different types of swipers */
.slider-container.booklists .swiper {/* used in the Book Lists segment (needs extra padding so that the book's box-shadow won't get cut-off) */
    width: calc(100% - 140px);
    margin: 0 auto;
    padding: 0;
}
.slider-container .swiper-wrapper .swiper-slide {
    width: auto;
    min-height: 180px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    order: 1;
}
.slider-container .swiper-wrapper .swiper-slide.favorited {
    order: 0;
}
.slider-container .swiper-wrapper .swiper-slide.favorited:after {
    left: 0px;
}
.slider-container .swiper-wrapper .swiper-slide.favorited .list-heading {
    margin-left: 17px;
}
.slider-container .swiper-button-prev, .slider-container .swiper-button-next {
    width: 36px;
    height: 100%;
    margin: 0;
    background-image: linear-gradient(to right, var(--body-bg-color) 0%, transparent 100%);
    top: 0;
    bottom: auto;
}
.slider-container .swiper-button-next {
    background-image: linear-gradient(to left, var(--body-bg-color) 0%, transparent 100%);
}
.slider-container .swiper-button-prev.swiper-button-disabled, .slider-container .swiper-button-next.swiper-button-disabled {
    opacity: 1;
}
.slider-container .swiper-button-prev {
    left: 0;
    right: auto;
}
/* unique positioning for different types of swipers */
.slider-container .swiper-button-next {
    left: auto;
    right: 0;
}
.slider-container .swiper-button-prev:before, .slider-container .swiper-button-next:before {
    content: "";
    width: 18px;
    height: 14px;
    background: url('/content/_theme_images/icon_slider-arrow.svg') no-repeat center;
    background-size: cover;
    display: block;
    position: absolute;
    top: calc(50% - 6px);
    left: calc(50% - 10px);
    z-index: 10;
    transition: opacity .3s;
}
.slider-container .swiper-button-prev:before {
    left: calc(50% - 8px);
    transform: scaleX(-1);
}
.slider-container .swiper-button-prev:after, .slider-container .swiper-button-next:after {
    content: "";
    width: 36px;
    height: 36px;
    background-color: var(--body-bg-color);
    border: 1px solid var(--theme-secondary-color-4);
    display: block;
    position: absolute;
    top: calc(50% - 18px);
    z-index: 5;
    transition: opacity .3s;
}
.slider-container .swiper-button-prev:after {
    left: 0;
}
.slider-container .swiper-button-next:after {
    right: 0;
}
.slider-container .swiper-button-prev.swiper-button-disabled:before, .slider-container .swiper-button-next.swiper-button-disabled:before, .slider-container .swiper-button-prev.swiper-button-disabled:after, .slider-container .swiper-button-next.swiper-button-disabled:after {
    opacity: 0.35;
}
.swiper .swiper-pagination {
    padding: 0 0 33px 40px;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 8px;
}
.swiper .swiper-pagination .swiper-pagination-bullet {
    border: 1px solid transparent;
    border-color: var(--swiper-pagination-bullet-border-color);
}

/* place .discover-filters styles here */
/*.discover-filters .personalize-option .tooltip, .discover-filters .apply-favorites .tooltip {*/
/*    left: auto;*/
/*    right: -20px;*/
/*    top: calc(100% + 9px);*/
/*}*/
/*.discover-filters .personalize-option .tooltip:after, .discover-filters .apply-favorites .tooltip:after {*/
/*    width: 100%;*/
/*    height: 18px;*/
/*    left: 0;*/
/*    top: -9px;*/
/*}*/
/*.discover-filters .personalize-option .tooltip:before, .discover-filters .apply-favorites .tooltip:before {*/
/*    transform: rotate(45deg);*/
/*    left: auto;*/
/*    right: 22px;*/
/*    top: -6px;*/
/*}*/
/* discover filters container (used for....blogs, event, eresources) */
.discover-filters {
    margin: 50px 0;
    position: relative;
}
.discover-filters .h5-like {
    margin: 0 0 13px 0;
}
.discover-filters ul {
    margin: 0;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.discover-filters ul li {
    margin: 0;
    padding: 0;
}
.discover-filters ul li:before {
    content: unset;
}
.discover-filters ul li label {
    padding: 7px 8px;
    padding-left: 28px;
    background-color: var(--discover-by-tag-bg-color);
    border: 0.5px solid var(--theme-secondary-color-6);
    border-radius: 0 6px 0 6px;
    color: var(--font-body-color);
    text-decoration: none;
    font: var(--font-tag-list);
    text-transform: uppercase;
    display: block;
    transition: background-color .3s, border-color .3s;
}
/*.segment-filter li a:hover, .segment-filter li.active a {*/
/*    background-color: var(--button-secondary-bg-color);*/
/*    color: var(--font-header-color);*/
/*    transition: background-color .3s, color .3s;*/
/*}*/
/*.discover-filters ul li label:before {*/
/*    content: "";*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    opacity: 0.44;*/
/*    border: 1px solid var(--theme-primary-color-3);*/
/*    display: block;*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    pointer-events: none;*/
/*}*/
.discover-filters .letters-list {
    width: 100%;
    padding: 0;
    display: flex;
    justify-content: space-between;
}
.discover-filters .letters-list li {
    opacity: .25;
    pointer-events: none;
}
.discover-filters .letters-list li.active {
    opacity: 1;
    pointer-events: all;
}
.discover-filters .letters-list li:last-of-type {
    margin: 0;
}
.discover-filters .letters-list li:before {
    display: none;
}
.discover-filters .letters-list li label {
    padding: 0;
    background-color: transparent;
    border: unset;
    font: var(--font-button);
    font-weight: 500;
    color: var(--font-body-color);
    text-transform: uppercase;
}
.discover-filters .letters-list li label .checkmark {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
}
.discover-filters .letters-list li a {
    font: 500 15px/15px 'DM Sans';
    color: var(--font-link-color);
    opacity: 0.3;
    pointer-events: none;
    cursor: pointer;
    text-decoration: none;
}
.discover-filters .letters-list li.active a {
    opacity: 1;
    pointer-events: all;
}
.discover-filters .letters-list li a:hover, .eresources-section .letters-list li.toggled a {
    color: var(--power-color-3);
}
.discover-filters .letters-list li a:after {
    display: none;
}
.discover-filters ul.letters-list li label {
    border-radius: 0;
}
.discover-filters ul.letters-list li label:has( input:checked) {
    border-bottom: 2px solid var(--font-body-color);
    /*font-weight: 900;*/
}
/*.discover-filters ul li.favorited:after {*/
/*    left: unset;*/
/*    right: 9px;*/
/*    top: 4px;*/
/*}*/
/*.discover-filters ul li.favorited label {*/
/*    padding-right: 27px;*/
/*}*/
/*.discover-filters ul li.favorited label:after {*/
/*    left: unset;*/
/*    right: 10px;*/
/*    top: 5px;*/
/*}*/
.discover-filters ul li label input {
    margin: 0;
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.discover-filters ul li label .checkmark {
    width: 12px;
    height: 12px;
    border: 1px solid var(--theme-secondary-color-6);
    top: 8px;
    left: 8px;
    position: absolute;
}
/*.discover-filters ul li label input:checked ~ .checkmark {*/
/*    background-color: rgba(102, 141, 78, .18);*/
/*}*/
.discover-filters ul li label input:checked ~ .checkmark svg g {
    fill: var(--button-bg-color);
}
.discover-filters ul li label .checkmark svg {
    margin: 0 0 3px 1px;
}
.discover-filters ul li label .checkmark svg g {
    fill: transparent;
}
.discover-filters .current-filters {
    padding: 18px 28px 18px 20px;
    background-color: var(--discover-by-bg-color);
    border: 0.5px solid var(--theme-secondary-color-4);
    display: flex;
    align-items: center;
    position: relative;
}
.discover-filters .current-filters .h4-like {
    width: fit-content;
    margin: 0;
    text-decoration: none;
    cursor: pointer;
}
.discover-filters .current-filters .tagged-list {
    padding: 0 10px;
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.discover-filters .current-filters .tagged-list .tag {
    padding: 7px 8px;
    /*padding-left: 28px;*/
    background-color: var(--discover-by-tag-bg-color);
    border: 0.5px solid var(--theme-secondary-color-6);
    border-radius: 0 6px 0 6px;
    cursor: pointer;
}
.discover-filters .current-filters .tagged-list .tag a {
    color: var(--font-body-color);
    font: var(--font-tag-list);
    text-transform: uppercase;
    text-decoration: none;
    display: flex;
    column-gap: 4px;
    align-items: center;
    position: relative;
}
.discover-filters .current-filters .tagged-list .tag a:before {
    content: '';
    width: 10px;
    height: 10px;
    background-color: var(--font-body-color);
    clip-path: polygon(10% 0%, 50% 40%, 90% 0%, 100% 10%, 60% 50%, 100% 90%, 90% 100%, 50% 60%, 10% 100%, 0% 90%, 40% 50%, 0% 10%);
    display: block;
}
/*.discover-filters .current-filters .tagged-list .tag a.favorited {*/
/*    padding-right: 17px;*/
/*}*/
/*.discover-filters .current-filters .tagged-list .tag a.favorited:after {*/
/*    left: auto;*/
/*    right: 0;*/
/*}*/
.discover-filters .current-filters .expand-filters {
    width: 40px;
    height: 40px;
    background-color: var(--select-bg-color);
    /*background-image: var(--button-icon);*/
    background-repeat: no-repeat;
    background-position: calc(50% + 1.5px) calc(50% - .5px);
    background-size: 8px;
    border-radius: 20px;
    display: inline-block;
    position: relative;
    cursor: pointer;
}
.discover-filters .current-filters .expand-filters:before {
    content: "";
    position: absolute;
    width: 12.5px;
    height: 6.6px;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    background-color: var(--theme-secondary-color-4);
    clip-path: polygon(0.48% 7.14%, 0% 4.46%, 0.71% 1.34%, 2.38% 0%, 3.81% 0.89%, 50% 87.5%, 96.19% 0.89%, 97.62% 0%, 99.29% 1.34%, 100% 4.46%, 99.52% 7.14%, 50% 100%);
    /*clip-path: polygon(10% 0%, 50% 66.67%, 90% 0%, 100% 16.67%, 50% 100%, 0% 16.67%);*/
    /*background-image: url('data:image/svg+xml,<svg width="10.5px" height="5.6px" viewBox="0 0 10.5 5.6"><g fill="%23003B46"><polygon points="0.4 0.05 5.25 4.9 10.1 0.05 10.25 1.7684465e-14 10.425 0.075 10.5 0.25 10.45 0.4 5.25 5.6 0.05 0.4 0 0.25 0.075 0.075 0.25 1.7684465e-14"></polygon></g></svg>');*/
    /*background-size: contain;*/
    /*background-position: center;*/
    /*background-repeat: no-repeat;*/
    transition: transform .3s;
}
.discover-filters.expanded .current-filters .expand-filters:before {
    transform: translate(-50%,-50%) scaleY(-1);
}
/*.discover-filters .current-filters a.personalize-button .tooltip {*/
/*    top: unset;*/
/*    bottom: 30px;*/
/*    left: -110px;*/
/*}*/
/*.discover-filters .current-filters a.personalize-button .tooltip:before {*/
/*    transform: rotate(-135deg);*/
/*    top: unset;*/
/*    bottom: -6px;*/
/*    left: calc(50% - 5.5px);*/
/*}*/
/*.discover-filters .current-filters a.personalize-button .tooltip:after {*/
/*    top: unset;*/
/*    bottom: -15px;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    height: 25px;*/
/*}*/
/*.discover-filters[open] .current-filters:before {*/
/*    transform: rotate(180deg);*/
/*}*/
.discover-filters .expandable-section {
    width: 100%;
    /*max-height: 300px;*/
    padding: 18px 28px 18px 20px;
    border: 0.5px solid var(--theme-secondary-color-4);
    border-top: none;
    display: none;
    position: relative;
    /*transition: margin .5s, opacity .5s, max-height .5s;*/
}
.discover-filters.expanded .expandable-section {
    display: block;
}
.discover-filters .expandable-section .tags {
    /*max-height: 243px;*/
    display: flex;
    gap: 25px;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}
.discover-filters .expandable-section .tags .tag-list {
    margin: 0;
    display: block;
}
.discover-filters .expandable-section .tags .tag-list .tag-scroll {
    width: 100%;
    max-height: 221px;
    overflow-y: auto;
    overflow-x: hidden;
}
.discover-filters ul li:last-child {
    padding: 0;
}


/* unique discover styles */
.discover-filters.eresources .tagged-list .tag {
    padding: 0;
}
.discover-filters.eresources .tagged-list .tag label:before {
    content: '';
    width: 12px;
    height: 12px;
    background-color: var(--font-body-color);
    position: absolute;
    top: calc(50% - 6px);
    left: 8px;
    clip-path: polygon(11.54% 0%, 50% 38.46%, 88.46% 0%, 100% 11.54%, 61.54% 50%, 100% 88.46%, 88.46% 100%, 50% 61.54%, 11.54% 100%, 0% 88.46%, 35.46% 50%, 0% 11.54%);
}
.discover-filters.eresources .tagged-list label {
    padding: 8px 8px 7px 25px;
    display: flex;
    color: var(--font-body-color);
    font: var(--font-tag-list);
    text-transform: uppercase;
    position: relative;
    cursor: pointer;
}
.discover-filters.eresources .tagged-list label input {
    margin: 0;
    position: absolute;
    opacity: 0;
    height: 0;
    width: 0;
}
.discover-filters.eresources .tagged-list label .checkmark svg g {
    fill: transparent;
}
/*.discover-filters.eresources .tags .tag-list.subjects {*/
/*    flex: 6 1 0px;*/
/*}*/
/*.discover-filters.blogs .tag-scroll {*/
/*    padding-bottom: 0px;*/
/*}*/


/* place .pagination styles here */
.content-pagination {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.all-books .content-pagination {
width: 100%;
}
.content-pagination.hide {
    display: none;
}
.content-pagination > * {
    font: 400 16px / 23px 'DM Sans';
    color: var(--font-body-color);
    opacity: .5;
    min-width: 14px;
    text-align: center;
}
.content-pagination a.active {
    opacity: 1;
    font-weight: 700;
}
.content-pagination a.link-prev, .content-pagination a.link-next {
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    background-color: var(--body-bg-color);
    border: 1px solid var(--tag-border-color);
    margin-right: 16px;
    opacity: 1;
}
.content-pagination a.link-next {
    transform: rotate(180deg);
    margin: 0 0 0 16px;
}
.content-pagination a.link-next.disabled, .content-pagination a.link-prev.disabled {
    opacity: .5;
    pointer-events: none;
}
.content-pagination a.link-prev:before, .content-pagination a.link-next:before {
    content: '';
    position: absolute;
    width: 10px;
    height: 18px;
    left: 14px;
    top: 11px;
    clip-path: polygon(9px 0px, 10px 1px, 2px 9px, 10px 17px, 9px 18px, 0px 9px);
    background-color: #9BB9B7;
}

/* Material Bio (New at the library) styles */
.material-item {
    width: 100%;
    max-width: 119px;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.material-item .item-media {
    width: 100%;
    height: 182px;
    margin: 0 0 12px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.material-item .item-media .item-media-image {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    box-shadow: -3px 7px 13px rgba(0,0,0,0.23);
}
.material-item .item-media .item-media-image.default {/* "default" is used as a placeholder if the material item doesn't come with an image */
    width: 100%;
    height: 100%;
    /*background-color: rgba(155,185,183,0.4);*/
    display: block;
}
.material-item .item-media .item-favorite {
    width: 100%;
    padding: 13px 0;
    background-color: var(--overflow-segment-gradient-color-2);
    border-left: 6px solid var(--theme-primary-color-2);
    color: var(--font-materials-favorite-color);
    font: var(--font-materials-favorite);
    display: flex;
    column-gap: 4px;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 0;
    left: 0;
}
.material-item .item-heading {
    width: 100%;
    max-height: 34px;
    margin: 0 0 5px 0;
    /*padding: 0 0 2px 0;*/
    opacity: 0.8;
    color: var(--font-body-color);
    font: var(--font-materials-header);
    text-align: center;
    letter-spacing: 0.5px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: opacity .3s;
}
.material-item:hover .item-heading {
    opacity: 1;
}
.material-item .item-author {
    width: 100%;
    max-height: 34px;
    font: var(--font-full-segment-author);
    text-align: center;
    letter-spacing: 0.5px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--font-body-color);
}

/* Root Pillars Segment; a three column section, that has a   */
.root-pillars-segment {
    width: 100%;
    margin: 55px 0 75px 0;
    opacity: 0.8;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
    transition: opacity .3s;
}
.root-pillars-segment.in-spotlight {
    opacity: 1;
}
/* override base style */
.root-pillars-segment h2, .root-pillars-segment .h2-like {
    margin: 0;
}
.root-pillars-segment h3, .root-pillars-segment .h3-like {
    margin: 0 0 10px 0;
}
.root-pillars-segment p {
    margin: 0;
}
.root-pillars-segment .segment-heading-row {
    width: 100%;
    padding: 0 0 25px 0;
}
.root-pillars-segment .segment-content-row {
    width: 100%;
    position: relative;
}
.root-pillars-segment .content-pillar {
    width: 100%;
    max-width: none;
    display: flex;
    /*row-gap: 76px;*/
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
    z-index: 5;
}
.root-pillars-segment .content-pillar:last-of-type {
    padding-top: 245px;
}
.root-pillars-segment .content-pillar .pillar-item {
    /*width: 100%;*/
    width: calc(50% - 88px);
    opacity: 0.5;
    position:  relative;
    transition: opacity .3s;
}
.root-pillars-segment .content-pillar .pillar-item:nth-of-type(odd) {
    /*top: -122px;*/
    margin-top: -122px;
}
.root-pillars-segment .content-pillar .pillar-item:nth-of-type(even) {
    /*top: 122px;*/
    margin-top: 122px;
}
.root-pillars-segment .content-pillar .pillar-item:first-of-type {
    top: auto;
    margin-top: 0;
}
.root-pillars-segment .content-pillar .pillar-item:nth-of-type(2) {
    /*top: 244px;*/
    margin-top: 244px;
}
/*.root-pillars-segment .content-pillar .pillar-item:nth-of-type(3) {*/
/*    top: -122px;*/
/*}*/
/*.root-pillars-segment .content-pillar .pillar-item:nth-of-type(4) {*/
/*    top: 122px;*/
/*}*/
.root-pillars-segment .content-pillar .pillar-item.highlighted,
.root-pillars-segment .content-pillar .pillar-item:hover {
    opacity: 1;
}
.root-pillars-segment .content-pillar .pillar-item .item-media {
    width: 100%;
    max-width: 320px;
    height: 314px;
    display: block;
    position: relative;
}
.root-pillars-segment .content-pillar .pillar-item .item-media:before,
.root-pillars-segment .content-pillar .pillar-item .item-media:after {
    content: "";
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
}
.root-pillars-segment .content-pillar .pillar-item .item-media:before {
    width: 88px;
    height: 1px;
    top: calc(50% - (1px / 2));
    right: -148px;
}
.root-pillars-segment .content-pillar .pillar-item .item-media:after {
    width: 100%;
    height: 100%;
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .3s .1s;
}
.root-pillars-segment .content-pillar .pillar-item.element-seen .item-media.element-initialized:after {
    opacity: 0;
}
/*
.root-pillars-segment .content-pillar:last-of-type .pillar-item .item-media:before {
    left: -108px;
}
*/
.root-pillars-segment .content-pillar .pillar-item:nth-of-type(even) .item-media:before {
    left: -88px;
}
.root-pillars-segment .content-pillar .pillar-item .item-details {
    width: 100%;
    max-width: 320px;
    margin: -33px 0 0 auto;
    padding: 33px 38px;
    opacity: 0;
    background-color: var(--theme-secondary-color-4);
    position: relative;
    transform: translateX(-15px);
    transition: opacity .3s .2s, transform .3s .2s;
}
.root-pillars-segment .content-pillar .pillar-item.element-seen.element-initialized .item-details {
    opacity: 1;
    transform: translateX(0);
}
.root-pillars-segment .content-pillar .pillar-item .item-details:before {
    content: "";
    width: 10px;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
.root-pillars-segment .content-pillar .pillar-item .item-details a.button-like.secondary {
    margin: 26px 0 0 0;
}
.root-pillars-segment .content-pillar .pillar-item .item-details .item-gallery {
    width: 100%;
    margin: 22px 0 0 0;
    display: flex;
    column-gap: 6px;
    row-gap: 6px;
}
.root-pillars-segment .content-pillar .pillar-item .item-details .item-gallery .media {
    width: 56px;
    aspect-ratio: 1.37 / 1;
}
.root-pillars-segment .root-pillar {
    width: 100%;
    max-width: 176px;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    position: absolute;
    top: 0;
    left: calc(50% - (176px / 2));
    z-index: 1;
}
.root-pillars-segment .root-pillar:before {
    content: "";
    width: 1px;
    height: calc(100% - 108px);
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    bottom: 0;
    left: calc(50% - (1px / 2));
    z-index: 5;
}
.root-pillars-segment .root-pillar .pillar-marker {
    width: 65px;
    height: 99px;
    /*background-color: var(--theme-primary-color-2);*/
    opacity: 0;
    display: block;
    position: relative;
    z-index: 10;
    transition: opacity .2s, top .3s;
}
.root-pillars-segment.in-spotlight .root-pillar .pillar-marker {
    opacity: 1;
    transition: opacity .3s .2s, top .3s;
}
.root-pillars-segment .root-pillar .jsgif canvas {
    width: 100%;
}
.root-pillars-segment .root-pillar .pillar-checkpoint {
    width: 65px;
    height: 99px;
    /*background-color: var(--theme-secondary-color-4);*/
    background-color: var(--body-bg-color, #FCFCFC);
    /*opacity: 0.50;*/
    display: block;
    position: absolute;
    z-index: 1;
}
.root-pillars-segment .root-pillar .pillar-checkpoint:before {
    content: "";
    width: calc(100% + 86px);
    height: 1px;
    background-color: var(--theme-primary-color-2);
    opacity: 0;
    display: block;
    position: absolute;
    top: calc(50% - (1px / 2));
    left: calc(-100% - 86px);
    z-index: 1;
    transform: scaleX(0);
    transform-origin: 100% 50%;
    transition: opacity .2s, transform .2s;
}
.root-pillars-segment .root-pillar .pillar-checkpoint:nth-of-type(odd):before {
    transform-origin: 0 50%;
    left: auto;
    right: calc(-100% - 86px);
}
.root-pillars-segment .root-pillar .pillar-checkpoint.point-seen:before {
    opacity: 1;
    transform: scaleX(1);
    transition: opacity .3s .1s, transform .3s;
}
/* "no-media" edits for .pillar-item */
.root-pillars-segment .content-pillar .pillar-item.no-media:after {
    content: "";
    width: 100%;
    /*height: 314px;*/
    height: 244px;
    background-color: var(--theme-primary-color-1);
    opacity: 0;
    display: block;
    pointer-events: none;
}
.root-pillars-segment .content-pillar .pillar-item.no-media:first-of-type:before {
    display: none;
}
.root-pillars-segment .content-pillar .pillar-item.no-media .item-media {
    display: none;
    opacity: 0;
    position: absolute;
    top: 0;
    pointer-events: none;
}
.root-pillars-segment .content-pillar .pillar-item.no-media .item-details {
    margin: 0;
}
.root-pillars-segment .content-pillar .pillar-item .item-media:before,
.root-pillars-segment .content-pillar .pillar-item .item-media:after {
    content: "";
    background-color: var(--theme-primary-color-2);
    display: none;
    position: absolute;
}
.root-pillars-segment .content-pillar .pillar-item .item-media:before {
    width: 88px;
    height: 1px;
    top: calc(50% - (1px / 2));
    right: -148px;
}

/* global styles for the .personal-item elements *used mainly in the "For You" segment on the home page */
.personal-items {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    column-gap: 29px;
    row-gap: 29px;
}
.personal-item {
    width: calc(30% - 29px);
    max-width: 374px;
    background-color: var(--body-bg-color);
    border: 0.5px solid var(--brand-border-color);
    border-radius: 40px;
    overflow: hidden;
}
.personal-item.forced-area {
    width: 100%;
}
.personal-item.sandbox {/* adding the "sandbox" class to this element should give you free rein to any content without the default styles getting in the way*/
    max-width: 374px;
    background-color: transparent;
    border: none;
    border-radius: initial;
    overflow: initial;
}
.personal-item .item-media {
    width: 100%;
    height: 192px;
    display: block;
}
.personal-item .item-media.has-image {
    background: var(--body-media-bg-color) no-repeat center;
    background-size: 95%;
}
.personal-item .item-content {
    width: 100%;
    padding: 22px 25px;
}
.personal-item .item-content .h3-like {
    margin-top: 0;
}
.personal-item .item-content p {
    /*color: var(--font-offset-color);*/
    /*font-size: 16px;*/
    /*line-height: 19px;*/
}
.personal-item .item-content p.detail {
    margin: 0 0 5px 0;
    display: flex;
    /*font-size: 15px;*/
    /*line-height: 18px;*/
    column-gap: 8px;
    align-items: center;
}
.personal-item .item-content p.detail .detail-icon {
    width: 15px;
    display: flex;
    align-items: center;
}
.personal-item .item-content a.button-like {
    margin: 15px 0 0 0;
}
.personal-item .item-content .item-buttons {
    position: relative;
}
.personal-item .item-content .booklist-books {
    width: 100%;
    margin: 0 0 25px 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 10px;
    row-gap: 10px;
}
.personal-item .item-content .booklist-books .book {
    width: 100px;
    height: 157px;
    position: relative;
}
.personal-item .item-content .booklist-books .book.has-image {
    background: transparent no-repeat center;
    background-size: 100%;
}
.personal-item .item-content .booklist-books .book.blank {
    background-color: var(--blank-book-bg-color);
    opacity: 0.3;
    pointer-events: none;
}
.personal-item .quicklinks-paths {
    width: 100%;
    display: flex;
    flex-direction: column;
    row-gap: 18px;
}
.personal-item .quicklinks-paths a.path {
    width: 100%;
    margin: 0;
    padding: 25px 23px;
    background-color: var(--body-bg-color);
    border: 0.4px solid var(--brand-border-color);
    border-radius: 35px;
    color: var(--font-body-color);
    /*font-size: 23px;*/
    /*line-height: 24px;*/
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;/* used to hide the edges of any skeleton pesudo elements */
}
.personal-item .quicklinks-paths a.path svg {
    display: block;
    transform: translateX(0);
    transition: transform .3s;
}
.personal-item .quicklinks-paths a.path:hover svg {
    transform: translateX(5px);
}

/* global styles for the upcoming events segment; this is manily used on the home page */
.upcoming-events {
    width: 100%;
}
.upcoming-events .featured-event {
    width: 100%;
    display: flex;
    align-items: center;
}
.upcoming-events .featured-event .event-media {
    width: 100%;
    max-width: 725px;
    min-height: 455px;
    border: 0.4px solid var(--brand-border-color);
    border-radius: 5px;
    position: relative;
    z-index: 5;
    overflow: hidden;
}
.upcoming-events .featured-event .event-media.has-image {
    background: var(--body-media-bg-color) no-repeat center;
    background-size: 95%;
    /*background-size: cover;*/
}
.upcoming-events .featured-event .event-content {
    width: calc(100% - 700px);
    margin: 0 43px 0 102px;
    position: relative;
    z-index: 1;
}
.upcoming-events .featured-event .event-content p {
    margin-bottom: 19px;
    color: var(--font-body-color);
}
.upcoming-events .featured-event .event-content p.detail {
    margin-bottom: 5px;
    color: var(--font-offset-color);
    font-size: 15px;
    line-height: 18px;
    display: flex;
    align-items: center;
    column-gap: 8px;
}
.upcoming-events .featured-event .event-content p.detail .detail-icon {
    width: 15px;
    display: flex;
    justify-content: center;
}
.upcoming-events .featured-event .event-content a.button-like {
    margin-top: 24px;
}
.upcoming-events .featured-event .event-content .details {
    position: relative;
    z-index: 5;
}
.upcoming-events .featured-event .event-content .details h4 {
    margin-top: 0;
}
.upcoming-events .basic-events {
    width: 100%;
    margin: 58px 0 0 0;
    display: flex;
    column-gap: 30px;
    align-items: flex-start;
    position: relative;
    z-index: 10;
}
.upcoming-events .basic-events .event {
    width: 100%;
    max-width: 374px;
    padding: 30px;
    background-color: var(--body-bg-color);
    border: 0.4px solid var(--brand-border-color);
    border-radius: 20px;
    overflow: hidden;
}
.upcoming-events .basic-events .event .h3-like {
    margin: 0 0 11px 0;
    padding: 0 0 0 22px;
    font-family: 'Aleo', serif;
    font-size: 23px;
    font-weight: 500;
    line-height: 24px;
    display: block;
    position: relative;
}
.upcoming-events .basic-events .event .h3-like:before {
    content: "";
    width: 12px;
    height: 12px;
    background-color: var(--font-link-color);
    border-radius: 50%;
    display: block;
    position: absolute;
    top: 5px;
    left: 0;
}
.upcoming-events .basic-events .event p {
    margin-bottom: 15px;
    color: var(--font-offset-color);
    font-size: 16px;
    line-height: 19px;
}
.upcoming-events .basic-events .event p.detail {
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 18px;
    display: flex;
    align-items: center;
    column-gap: 5px;
}
.upcoming-events .basic-events .event p.detail .detail-icon {
    width: 15px;
    display: flex;
    justify-content: center;
}
.upcoming-events .basic-events .event a.button-like {
    margin-top: 10px;
}

.events-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    row-gap: 35px;
    /*row-gap: 60px;*/
    justify-content: space-between;
    
    /* override base variables */
    --font-header-4: normal 400 17px/23px "Inter Tight", sans-serif;
    --font-body: normal 400 17px/22px "Inter Tight", sans-serif;
}
/* override base styles */
/*.display_archive {*/
/*    margin: 0 0 8px 0;*/
/*    color: var(--font-header-color);*/
/*    font: var(--font-header-4);*/
/*    --font-link: var(--font-header-4);*/
/*    text-decoration: none;*/
/*}*/
.events-list .event-item h4, .events-list .event-item .h4-like {
    margin: 0 0 8px 0;
    transition: color .3s;
}
.events-list .event-item:hover h4, .events-list .event-item:hover .h4-like {
    color: var(--font-link-color);
}
.events-list .event-item p {
    margin: 0;
    opacity: 1;
}
.events-list .event-item {
    width: calc(50% - 20px);
    color: var(--font-body-intro-color);
    text-decoration: none;
    display: flex;
    column-gap: 18px;
    align-items: flex-start;
    position: relative;
}
.events-list .event-item .item-date {
    width: 52px;
    height: 52px;
    border: 1px solid var(--font-form-border-color);
    display: flex;
    row-gap: 5px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.events-list .event-item .item-date .month {
    font: var(--font-event-list-month);
}
.events-list .event-item .item-date .day {
    font: var(--font-event-list-day);
}
/* dual date variant of the event > .item-date */
.events-list .event-item .item-dual-dates {
    width: 104px;
    height: 52px;
    border: 1px solid var(--font-form-border-color);
    display: flex;
    row-gap: 5px;
    align-items: center;
    justify-content: center;
    position: relative;
}
.events-list .event-item .item-dual-dates:before {
    content: " - ";
    width: 8px;
    height: 100%;
    line-height: 50px;
    text-align: center;
    position: absolute;
    top: 0;
    left: calc(50% - 4px);
    pointer-events: none;
}
.events-list .event-item .item-dual-dates .item-date {
    border: none;
}
.events-list .event-item .item-content {
    width: calc(100% - 70px);
    position: relative;
}
.events-list .event-item .item-content .details {
    font: var(--font-event-list-details);
}
.events-list .event-item .item-content .options {
    width: 100%;
    margin: 8px 0 0 0;
}
/*
.events-list .event-item .item-content .options {
    width: 100%;
    opacity: 0;
    position: absolute;
    bottom: -45px;
    left: 0;
    transform: translateY(-8px);
    pointer-events: none;
    transition: opacity .2s, transform .2s;
}
.events-list .event-item:hover .item-content .options {
    padding-top: 8px;
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
    transition: opacity .3s .1s, transform .3s;
}
.events-list .event-item .item-content .options a.button-like {
    margin: 0 4px 0 0;
}
.events-list .event-item .item-content .options a.button-like:last-of-type {
    margin-right: 0;
}
*/
.events-list .event-item .item-clickable-area {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}
/* 'offset-list' edits */
.events-list.offset-list {}
.events-list.offset-list .event-item {}
.events-list.offset-list .event-item:first-of-type {
    /*margin-top: -20px;*/
}
.events-list.offset-list .event-item .item-content {}
.events-list.offset-list .event-item .item-content .details {
    margin: 0 0 8px 0;
    opacity: 0.6;
}
.events-list.offset-list .event-item .item-content .options {
    margin: 15px 0 0 0;
    display: none;
    opacity: 0.5;
    transition: opacity .3s;
}
.events-list.offset-list .event-item:hover .item-content .options {
    opacity: 1;
}
.events-list.offset-list .event-item.show-options .item-content .options {
    display: flex;
}
.events-list.offset-list .event-item .item-content .options a.button-like {
    margin: 0 5px 0 0;
}
/* 'show-options' edits */
.events-list .event-item.show-options:hover h4 {
    color: var(--font-header-color);
}
.events-list .event-item.show-options .item-clickable-area {
    display: none;
}


.special-upcoming-events {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    /*align-items: center;*/
    justify-content: space-between;
    
    --swiper-pagination-color: rgba(184,184,184,0.34);
    --swiper-pagination-bullet-inactive-color: rgba(184,184,184,0);
    --swiper-pagination-bullet-border-color: #CFCFCF;
}
.special-upcoming-events .events-banner {
    width: 50%;
    aspect-ratio: 1.64 / 1;
    position: relative;
}
.special-upcoming-events .events-banner:before {
    content: "";
    width: 10px;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
.special-upcoming-events .events-content {
    width: calc(50% - 30px);
    padding: 6px 0 0 0;
}
.special-upcoming-events .events-content .subheader {
    width: 100%;
    margin: 0 0 21px 0;
    color: var(--font-body-alt-color);
    font: var(--font-subheader);
    letter-spacing: 0.5px;
    text-transform: uppercase;
    display: block;
}
.special-upcoming-events .events-content .slider-container {
    width: 100%;
}
.special-upcoming-events .events-content .slider-container .swiper {
    width: 100%;
    padding: 0 0 30px 0;
}
.special-upcoming-events .events-content .slider-container .swiper .swiper-pagination {
    justify-content: flex-start;
}
.special-upcoming-events .events-content .events-list {
    /*width: calc(50% - 30px);*/
    column-gap: initial;
    row-gap: 17px;
}
.special-upcoming-events .events-content .events-list .event-item {
    width: 100%;
    column-gap: 17px;
}

/* global style for a list of books for a specific booklist; mainly used on the home page in the "Book Lists" segment */
/* Books List; used in the full segment section(s), shown mostly on the booklists deeper level page. */
.books-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 30px;
    row-gap: 30px;
    
    /* override base variables */
    --preload-cover-bg-color: var(--theme-secondary-color-1);
}
/* override base styles (h5, p, button) */
.books-list h5, .books-list .h5-like {
    margin: 15px 0 3px 0;
}
.books-list p {
    margin: 0;
    font: var(--font-book-item-author);
}
.books-list a.button-like.secondary {
    margin: 5px 0 0 0;
}
.books-list .book-item {
    width: calc(20% - 20px);
    padding: 21px 16px;
    background-color: var(--theme-secondary-color-5);
    border-radius: 0 30px 0 30px;
    text-decoration: none;
    position: relative;
}
.books-list .book-item.unclickable {
    cursor: initial;
}
.books-list .book-item .item-cover {
    width: 100%;
    aspect-ratio: 0.69 / 1;
    position: relative;
    transition: box-shadow .2s, transform .2s;
}
.books-list .book-item .item-cover p {/* override base styles */
    
}
.books-list .book-item .item-cover .cover-media {
    width: 100%;
    height: 100%;
    display: block;
}
.books-list .book-item .item-cover .cover-details {
    display: none;
}
/* "flippable" edits for Books List > Item > Cover; enables the cover to flip to reveal it's details */
.books-list .book-item .item-cover.flippable .cover-media {
    position: relative;
    transition: transform .2s;
}
.books-list .book-item .item-cover.flippable:hover .cover-media {
    transform: scaleX(-1);
    transition: transform .3s;
}
.books-list .book-item .item-cover.flippable .cover-details {
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-3);
    padding: 0 8px;
    opacity: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transform: scaleX(-1);
    transition: opacity .2s, transform .2s;
    pointer-events: none;
}
.books-list .book-item .item-cover.flippable:hover .cover-details {
    opacity: 1;
    transform: scaleX(1);
    transition: opacity .3s .1s, transform .3s;
    pointer-events: all;
}
.books-list .book-item .item-cover.flippable .cover-details p {
    max-height: 100%;
    padding: 8px 0;
    text-align: center;
    position: relative;
    overflow-y: auto;
}
.books-list .book-item .item-cover.flippable .cover-details:before, .books-list .book-item .item-cover.flippable .cover-details:after {
    content: "";
    width: 100%;
    height: 8px;
    display: block;
    position: absolute;
    left: 0;
    z-index: 1;
    pointer-events: none;
}
.books-list .book-item .item-cover.flippable .cover-details:before {
    background-image: linear-gradient(to bottom, var(--theme-secondary-color-3) 0%, transparent 100%);
    top: 0;
}
.books-list .book-item .item-cover.flippable .cover-details:after {
    background-image: linear-gradient(to top, var(--theme-secondary-color-3) 0%, transparent 100%);
    bottom: 0;
}


.book-list {
    /*max-width: 425px;*/
    width: 100%;
    min-width: 175px;
}
.most-recent .book-list {
    flex-basis: calc((100% - 50px) / 2);
}
.most-recent .book-list:nth-child(n+3) {
    flex-basis: calc((100% - 100px) / 3);
}
.book-list .book-list-books {
    width: 100%;
    margin: 0 0 20px 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 12px;
    row-gap: 10px;
    align-items: flex-start;
}
.book-list .book-list-books .book {
    width: 106px;
    height: 175px;
    position: relative;
    z-index: 1;
    transform: scale(1);
    transform-origin: 50% 50%;
    transition: transform .2s;
}
.book-list .book-list-books .book:hover {/* expand the book on hover */
    transform: scale(1);
    z-index: 10;
    transition: transform .3s;
}
.book-list .book-list-books .book.blank {/* placeholder book; in case the booklist has less then 6 books showing */
    background: var(--theme-default-bg);
    background-color: var(--theme-default-color);
    pointer-events: none;
}
.book-list .book-list-books .book .book-link-area {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}
.book-list .book-list-books .book .book-link-area:after {
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    transform: scale(.75);
    transition: opacity .0s;
}
.book-list .book-list-books .book:hover .book-link-area:after {
opacity: 1;
transition: opacity .3s .1s;
}
.book-list .book-list-books .book .book-media {
    width: 100%;
    height: 100%;
    display: block;
    transition: box-shadow .2s, transform .2s;
    position: relative;
    z-index: 1;
}
.book-list .book-list-books .book .book-media.has-image {
background: transparent no-repeat center;
background-size: cover;
}
.book-list .book-list-books .book .book-media.default {
    background-image: url('/content/_site_images/icon_placeholder-mark.svg');
}
.book-list .book-list-books .book:hover .book-media {
box-shadow: -3px 7px 0 rgba(0,0,0,0);
transform: scaleX(-1);
transition: box-shadow .3s, transform .3s;
}
.book-list .book-list-books .book .book-info {
    width: calc(100% + 1px);
    height: calc(100% + 1px);
    padding: 5px;
    background-color: var(--theme-secondary-color-3);
    /*box-shadow: -3px 7px 0 rgba(0,0,0,0);*/
    opacity: 0;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0; 
    left: 0; 
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
    transform: scaleX(-1);
    transform-origin: 50% 50%;
    transition: box-shadow .2s, transform .2s;
}
.book-list .book-list-books .book:hover .book-info {
    box-shadow: unset; /* cancels existing css */
    opacity: 1;
    pointer-events: all;
    transform: scaleX(1);
    transition: box-shadow .3s, transform .3s;
    justify-content: center;
}
.book-list .book-list-books .book .book-info p {
    max-height: 156px;
    margin: 0;
    opacity: 0;
    color: var(--font-offset-color);
    font-size: 11px;
    line-height: 13px;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    transition: opacity .2s;
    overflow: hidden;
}
.book-list .book-list-books .book:hover .book-info p {
    opacity: 1;
    transition: opacity .3s .1s;
}
.book-list .book-list-subheader {
    margin: 0 0 10px 0;
    font-size: 15px;
    line-height: 20px;
    display: block;
    position: relative;
}
.book-list .book-list-subheader:before {
    content: "";
    width: 12px;
    height: 12px;
    margin: 0 8px 0 0;
    background-color: var(--tag-border-color);
    display: inline-block;
    position: relative;
}
.book-list h3 {
    margin-top: 0;
}
.book-list h4 {
    margin-top: 0;
}
.booklist-books .description {
    overflow: hidden;
    margin-bottom: 50px;
}
.booklist-books .booklist .books-list .booklist-item .book .book-media, .booklist-books .booklist .books-list .booklist-item .book:hover .book-info {
    box-shadow: unset;
}
.booklist .books-list .book:hover {
    transform: scale(1);
}
/* global styles for booklists; mainly used on the booklists page */
.featured-filter {
    margin-bottom: 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.featured-filter h2 {
    margin: 0;
}
.featured-filter label {
    font: var(--font-filter-label);
    position: relative;
    /*font: 400 16px/22px 'Palatino';*/
}
.featured-filter label:before {
    content: '';
    position: absolute;
    width: 10px;
    height: 6px;
    right: 6px;
    top: calc(50% - 3px);
    z-index: 1;
    background-color: var(--font-body-color);
    clip-path: polygon(10% 0%, 50% 66.67%, 90% 0%, 100% 16.67%, 50% 100%, 0% 16.67%);
}

/* book lists */
.book-lists {
display: none;
}
.book-lists.featured.active {
display: block;
}
/*.book-lists .featured-filter {*/
/*    align-items: flex-end;*/
/*}*/
.book-lists .featured-filter h2 {
    margin-bottom: 15px;
}
.booklist .books-list .book:hover {
    transform: unset;
}
.featured-books, .all-books {
display: none;
}
.featured-books.selected, .all-books.selected {
display: block;
}
.all-books .original-results {
display: flex;
flex-wrap: wrap;
gap: 40px;
}
.all-books .original-results .book-list {
flex-basis: calc((100% - 80px) / 3);
}
.featured-books > div {
    display: flex;
    gap: 50px;
    flex-wrap: wrap;
}
.featured-title {
margin: 50px 0 25px 0;
}
.book-lists .featured-list {
display: flex;
gap: 40px;
}
.book-lists .featured-list .book-list {
flex-basis: calc((100% - 80px) / 3);
}
.book-list .book-list-books .book {
flex-basis: calc((100% - 24px) / 3);
aspect-ratio: 128 / 200;
height: auto;
}
.book-list .book-list-books .book .book-info {
align-items: initial;
overflow: scroll;
}
.book-list .book-list-books .book .book-info .overflow {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: max-content;
min-height: 100%;
}
.book-list .book-list-books .book .book-info p.title {
    width: 100%;
    max-height: 34px;
    margin-bottom: 5px;
    font: var(--font-materials-header); /* replaces existing css */
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.book-list .book-list-books .book .book-info p.author {
    width: 100%;
    max-height: 34px;
    margin-bottom: 5px;
    font: var(--font-full-segment-author);
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.book-list .book-list-books .book .book-info a {
    text-decoration: none;
    color: var(--font-body-color);
}
.book-list .book-list-books .book .book-info a:hover {
    color: var(--font-link-color);
}
/* global styles for booklist books; mainly used on the booklit books page */
/* booklist/booklist_books page */
.booklist .books-list {
display: flex;
flex-wrap: wrap;
gap: 25px;
}
.booklist .books-list .intro {
width: 100%;
}
.booklist .books-list .book {
position: relative;
width: calc((100% - 100px) / 5);
aspect-ratio: 2/3;
height: auto;
z-index: 1;
transform: scale(1);
transform-origin: 50% 50%;
transition: transform .2s;
}
.booklist .books-list .book:hover {
transform: scale(1.2);
z-index: 10;
transition: transform .3s;
}
.booklist .books-list .book .book-link-area {
display: block;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 100;
}
.booklist .books-list .book .book-media {
display: block;
position: relative;
width: 100%;
height: 100%;
/*background-color: #DEE5E5;*/
box-shadow: -3px 7px 13px rgba(0,0,0,0.23);
z-index: 1;
transition: box-shadow .2s, transform .2s;
}
.booklist .books-list .book:hover .book-media {
box-shadow: -3px 7px 0 rgba(0,0,0,0);
transform: scaleX(-1);
transition: box-shadow .3s, transform .3s;
}
.booklist .books-list .book .book-media.default {
    background-image: url('/content/_site_images/icon_placeholder-mark.svg');
}
.booklist .books-list .book .book-info {
    width: calc(100% + 1px);
    height: calc(100% + 1px);
    padding: 10px;
    background-color: var(--body-media-bg-color);
    box-shadow: -3px 7px 0 rgba(0, 0, 0, 0);
    opacity: 0;
    display: flex;
    position: absolute;
    top: -.5px;
    left: -.5px;
    z-index: 1;
    pointer-events: none;
    transform: scaleX(-1);
    transform-origin: 50% 50%;
    transition: box-shadow .2s, transform .2s;
    overflow: scroll;
}
.booklist .books-list .book:hover .book-info {
box-shadow: -3px 7px 23px rgba(0,0,0,0.23);
opacity: 1;
pointer-events: all;
transform: scaleX(1);
transition: box-shadow .3s, transform .3s;
}
.booklist .books-list .book .book-info .overflow {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: max-content;
min-height: 100%;
}
.booklist .books-list .book .book-info p {
display: -webkit-box;
-webkit-line-clamp: 10;
-webkit-box-orient: vertical;
max-height: 156px;
margin: 0;
opacity: 0;
color: var(--font-offset-color);
font-size: 11px;
line-height: 13px;
text-align: center;
transition: opacity .2s;
overflow: hidden;
}
.booklist .books-list .book .book-info p.title {
font: 600 15px/18px 'Aleo';
color: var(--font-body-color);
margin-bottom: 5px;
}
.booklist .books-list .book .book-info p.author {
margin-bottom: 5px;
}
.booklist .books-list .book:hover .book-info p {
opacity: 1;
transition: opacity .3s .1s;
}


/* filtered booklists */
.book-lists.filtered {
flex-wrap: wrap;
gap: 40px;
}
.book-lists.filtered.active {
display: flex;
}
.book-lists.filtered .results {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}
.book-lists.filtered .book-list {
display: inline-block;
flex-basis: calc((100% - 80px) / 3);
flex-direction: column;
}
.book-lists.filtered .book-list.hide {
display: none;
}
.filtered-results .content-pagination a, .book-lists.filtered .content-pagination a {
cursor: pointer;
}
/* Booklist Books; this is the status we attach to the main-content to override specific styles on the deeper booklist page */
/* --TOREADD --*/
.booklist-books .all-booklist-books {
    margin-top: 50px;
}
.booklist-books .booklist .books-list {
    gap: 30px; /* replaces existing css */
}
.booklist-books .booklist .books-list .booklist-item {
    width: calc((100% - 120px) / 5);
    background-color: var(--background-3);
    border-left: 8px solid var(--theme-secondary-color-1);
    padding: 15px;
}
.booklist-books .booklist .books-list .booklist-item .book {
    width: 100%;
    margin-bottom: 15px;
}
.booklist-books .booklist .books-list .booklist-item .book .book-info {
    background-color: var(--select-bg-color);
}
.booklist-books .booklist .books-list .booklist-item .title {
    font: 400 16px/21px 'Palatino';
    text-decoration: none;
    color: var(--font-body);
    margin: 0 0 3px 0;
}
.booklist-books .booklist .books-list .booklist-item a.title {
    cursor: pointer;
}
.booklist-books .booklist .books-list .booklist-item a.title:hover {
    color: var(--font-link-color);
}
.booklist-books .booklist .books-list .booklist-item .author {
    font: 300 14px/18px 'Tahoma';
    margin: 0;
}


/* global styles for eresources; mainly used on the eresources page */
.eresources-section {
    width: 100%;
}
.eresources-section .eresource-entities {
    width: 100%;
    display: none;
    flex-wrap: wrap;
    gap: 15px;
}
/* override base styles */
/*.eresources-section .eresource-entities h4, .eresources-section .eresource-entities .h4-like {*/
/*    margin: 0 0 14px 0;*/
/*}*/
.eresources-section .eresource-entities p {
    margin: 0;
    max-height: 160px;
    font: var(--font-eresource-entry);
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.eresources-section .eresource-entities.active {
display: flex;
}
.eresources-section .eresource-entities .eresource, .eresources-embed .eresource-entities .eresource-item {
    width: calc((100% - 30px) / 3);
    padding: 20px;
    background-color: var(--theme-secondary-color-5);
    border-radius: 0 30px 0 30px;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}
.eresources-section .eresource-entities .eresource.active {
    display: flex;
}
.eresources-section .eresource-entities .eresource .eresource-media {
    width: 100%;
    margin: 0 0 9px 0;
    height: auto;
    background-size: calc(100% - 20px);
    background-repeat: no-repeat;
    background-position: center;
    aspect-ratio: 30/19.1;
    background-color: var(--select-bg-color);
}
.eresources-section .eresource-entities .eresource .eresource-name {
    margin: 0 0 12px 0;
}
.eresources-section .eresource-entities .eresource .eresource-media.placeholder {
    width: 100%;
    height: auto;
    background-size: auto;
    background-repeat: repeat;
    background-color: var(--theme-secondary-color-6);
    display: block;
}
/*.eresources-section .eresource-entities .eresource .eresource-name {*/
/*    color: var(--font-body-color);*/
/*    text-decoration: none;*/
/*    width: 100%;*/
/*    margin: 17px 0 15px 0;*/
/*    padding: 0;*/
/*    font: 400 18px/23px 'Palatino';*/
/*}*/
.eresources-section .eresource-entities .eresource .eresource-buttons {
    margin: 20px 0 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.eresources-section .eresource-entities .eresource .eresource-buttons a {
    margin: 0;
}
.eresources-section .eresource-entities .eresource .eresource-description {
    width: 100%;
    padding: 0;
    margin: 0 0 20px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    display: -moz-box;
    font: 300 16px/23px 'Tahoma'; /* TODO: setup as var */
    color: var(--font-offset-color);
}
.eresources-section .eresource-entities p.no-results {
    display: none;
}
.eresources-section .eresource-entities p.no-results.show {
    display: inline-block;
}

/* global styles for eresources overlay */
.main-content:has( #eresource_overlay) {
    z-index: 30;
}
.main-content .page-body:has( #eresource_overlay) {
    z-index: 11;
}
.eresource-overlay {
    position: fixed;
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    z-index: 100;
}
.eresource-overlay a.button-like {
    margin: 15px 0 0 16px;
}
.eresource-overlay .clickable-background {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-6);
    opacity: .75;
    cursor: pointer;
}
.eresource-overlay .container {
    position: absolute;
    width: 800px;
    max-width: calc(100vw - 50px);
    max-height: calc(100vh - 50px);
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
    background-color: var(--theme-secondary-color-1);
    border-radius: 0 50px 0 50px;
    padding: 25px 25px 0px 25px;
    overflow-y: scroll;
    overflow-x: hidden;
}
.eresource-overlay .close {
    display: block;
    position: absolute;
    width: 20px;
    height: 20px;
    right: 25px;
    top: 25px;
    cursor: pointer;
}
.eresource-overlay .container .content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 50px;
  padding-bottom: 25px;
}
.eresource-overlay .main {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0 20px;
}
.eresource-overlay .container .main .main-image {
    width: 300px;
}
.eresource-overlay img {
    display: block;
}
.eresource-overlay .eresource-media {
    display: block;
    width: 100%;
    height: auto;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.eresource-overlay .eresource-media.default {
    background-size: auto;
    aspect-ratio: 30/19.1;
}
.eresource-overlay .eresource-name {
    width: 100%;
    margin: 0px 0px 15px 0px;
    padding-right: 45px;
    text-decoration: none;
}
.eresource-overlay .description-button {
    flex: 1 1 0px;
}
.eresource-overlay .eresource-description {
    margin: 0;
}
.eresource-overlay .related-container {
    width: calc(100% + 25px);
    overflow-x: scroll;
    padding-bottom: 5px;
}
.eresource-overlay .related-title {
    /*opacity: .8;*/
    margin: 0 0 5px 0;
}
.eresource-overlay .related-eresources {
    display: flex;
    justify-content: flex-start;
    gap: 15px;
}
.eresource-overlay .related-eresources .related {
    flex: unset;
    width: calc((100% - 30px) / 3);
    max-width: 275px;
    min-width: 225px;
    opacity: .8;
}
.eresource-overlay .related-eresources .related:last-child {
    box-sizing: content-box;
    padding-right: 25px;
}
.eresource-overlay .related-eresources .related:hover {
    opacity: 1;
}
.eresource-overlay .related-eresources .related .image {
    width: 100%;
    margin-bottom: 5px;
}
.eresource-overlay .related-eresources .related .image > * {
    /*border-radius: 9px;*/
}
.eresource-overlay .related-eresources .related .eresource-name {
    cursor: pointer;
}
.eresource-overlay .related-eresources .related p {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

/* global styles for blogs; mainly used on the blog page */
.blog-posts {
    width: 100%;
}
/* override base styles */
.blog-posts .h3-like {
    margin: 0 0 10px 0;
    display: block;
}
.blog-posts p {
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.blog-posts a {
    text-decoration: none;
}
.blog-posts a.button-like {
    margin: 25px 0 0 0;
}
.blog-posts .hide {/* basic style to hide filter blogs and the pagination when there's only one page */
    display: none;
}
.blog-posts .post {
    width: 100%;
    margin: 0 0 60px 0;
    display: flex;
    gap: 50px;
    align-items: center;
}
.blog-posts .post .post-media {
    width: 50%;
    margin: 0;
    background: no-repeat center;
    display: block;
    aspect-ratio: 1.67 / 1;
}
.blog-posts .post .post-media .media {
    width: 100%;
    height: 100%;
    background: no-repeat top center;
    background-size: cover;
    display: block;
}
.blog-posts .post .post-content {
    width: 50%;
}
.blog-posts .post .post-content .post-info {
    margin: 15px 0 0 0;
    font: var(--font-event-date);
    display: flex;
    flex-direction: column;
}
.blog-posts .post .post-content .post-info span {
    width: 100%;
    display: flex;
    column-gap: 6px;
    align-items: center;
}
.blog-posts .post .post-content .post-info span.author:before {
    background-image: url('/content/_theme_images/icon_pen.svg');
}
/* - even edits - */
.blog-posts .post:nth-child(2n) .post-media {
    margin: 0;
    order: 1;
}
.blog-posts .post:nth-child(2n) .post-content {
    order: 0;
}
/* Blog Post > Post Information; only seen on blog post page */
.post-about {
    width: 100%;
    max-width: 250px;
    margin: 0 0 25px 25px;
    padding: 25px 24px;
    background-color: var(--theme-secondary-color-3);
    border-radius: 37px 0 37px 0;
    float: right;
    position: relative;
}
.post-about h4 {
    margin: 0 0 15px 0;
}
.post-about .author {
    margin: 0;
    padding: 0 0 0 20px;
    font: var(--font-event-date);
    position: relative;
}
.post-about .author svg {
    position: absolute;
    top: 2px;
    left: 0;
}
.post-about .author a {
    font-weight: 500;
}
.post-about .date:before {
    background-image: url('/content/_theme_images/icon_calendar.svg');
}
.post-about .tags {
    margin: 14px 0 0 0;
}
.post-about .tags ul.tag-list {
    width: 100%;
    margin: 18px 0 0 0;
    display: flex;
    flex-wrap: wrap;
}
.post-about .tags ul.tag-list li {
    margin: 0 7px 7px 0;
    padding: 0;
}
.post-about .tags ul.tag-list li:before {
    display: none;
}
.post-about .tags ul.tag-list li .tag {
    background-color: var(--body-bg-color);
    border: 0.5px solid var(--theme-secondary-color-6);
}
.post-about .tags ul.tag-list li a.tag:hover {
    background-color: var(--theme-secondary-color-6);
    border-color: transparent;
}
.post-about .tags ul.tag-list li a.tag:after {
    display: none;
}

/* Staff List; shows the staff item(s) in it's respective `subtype` */
.staff-segment {
    width: 100%;
    margin: 0 0 60px 0;
}
.staff-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 28px;
    row-gap: 35px;
    
    /* override base variables */
    /*--font-header-5: normal 400 17px/23px "Inter Tight", sans-serif;*/
    --font-body: normal 300 12px/15px "Inter Tight", sans-serif;
    --preload-cover-bg-color: var(--theme-primary-color-2);
}
/* override base styles */
.staff-list h5, .staff-list .h5-like {
    margin: 0 0 5px 0;
}
.staff-list p {
    margin: 0 0 9px 0;
    /*opacity: 0.5;*/
    /*color: var(--font-body-alt-color);*/
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.staff-list a.button-like.secondary {
    margin: 15px 0 0 0;
}
.staff-list .staff-item {
    width: calc(25% - 21px);
    position: relative;
    overflow: hidden;
}
.staff-list .staff-item .item-media {
    width: 100%;
    margin: 0 0 15px 0;
    aspect-ratio: 1 / 1;
    display: block;
    position: relative;
    z-index: 5;
}
.staff-list .staff-item .item-details {
    width: 100%;
    /*padding: 15px;*/
    position: relative;
    z-index: 5;
}
.staff-list .staff-item .item-details .item-info {
    margin: 0 0 5px 0;
    opacity: 1;
    font: var(--font-staff-item-info);
    text-transform: initial;
    letter-spacing: initial;
    display: flex;
    column-gap: 8px;
    align-items: center;
    overflow-wrap: anywhere;
}
.staff-list .staff-item .item-details .item-info .info-icon {
    width: 16px;
    /*padding-top: 4px;*/
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Staff Component; used to showcase a specific staff record's information */
.staff-component {
    width: 100%;
    
    /* override base variables */
    --overflow-segment-width: 100%;
    --overflow-segment-offset: 0;
}
/* overrride base styles */
.staff-component h1, .staff-component .h1-like {
    margin: 0 0 8px 0;
}
.staff-component .subheader {
    width: 100%;
    margin: 0 0 22px 0;
    color: var(--font-body-alt-color);
    font: var(--font-subheader);
    letter-spacing: 0.5px;
    text-transform: uppercase;
    display: block;
}
.staff-component .staff-discussion {
    width: 100%;
    margin: 0 0 32px 0;
}
.staff-component .staff-discussion p {
    margin: 0;
}
.staff-component .staff-discussion:last-of-type {
    margin: 0;
}
.staff-component .staff-discussion .discussion-question {
    margin: 0 0 15px 0;
    opacity: 0.7;
    color: var(--font-body-alt-color);
    font: var(--font-staff-discussion-question);
}
.staff-component .staff-details {
    width: 100%;
}
.staff-component .staff-details h2 {
    margin-top: 0;
}
/* staff component other element overrides */
.staff-component .substance-component {
    margin: 0 0 75px 0;
}
.staff-component .substance-component .component-media.has-image {
    background-size: cover;
}
.staff-component .full-segment {
    margin: 0 0 100px 0;
}
.staff-component .full-segment .segment-heading-row {
    margin: 0;
}

.lib-overlay {
width: 100vw;
height: 100vh;
display: none;
position: fixed;
top: 0;
left: 0;
z-index: 1000;
}
.lib-overlay.active {
display: block;
min-height: 300px;
}
.overlay-content .already-registered-note{
    border: 1px solid red;
    padding: 5px;
    border-radius: 5px;
}
.overlay-content .already-registered-note i {
    color: red;
}
.lib-overlay .overlay-content a.back-button {
width: 31px;
height: 31px;
background-image: url('/content/_theme_images/icon_button_arrow.svg');
background-repeat: no-repeat;
background-size: cover;
position: absolute;
top: 21px;
left: 21px;
z-index: 20;
transform: rotate(180deg);
transition: opacity .3s;
}
.lib-overlay .overlay-content a.back-button:after {
display: none;
}
.lib-overlay .overlay-content.step-one a.back-button {
opacity: 0.4;
pointer-events: none;
}
.lib-overlay .overlay-content.step-three a.back-button {
opacity: 0;
pointer-events: none;
}
.lib-overlay a.button-like {
margin: 10px 0 0 0;
}
.lib-overlay a.close-icon {
display: block;
position: absolute;
top: 25px;
right: 25px;
width: 25px;
height: 25px;
z-index: 20;
background-color: transparent;
}
.lib-overlay a.close-icon:before {
position: absolute;
content: '';
width: 100%;
height: 100%;
clip-path: polygon(calc(0%) calc(0% + 1px), calc(0% + 1px) calc(0%), calc(50%) calc(50% - 1px), calc(100% - 1px) calc(0%), calc(100%) calc(0% + 1px), calc(50% + 1px) calc(50%), calc(100%) calc(100% - 1px), calc(100% - 1px) calc(100%), calc(50%) calc(50% + 1px), calc(0% + 1px) calc(100%), calc(0%) calc(100% - 1px), calc(50% - 1px) calc(50%));
background-color: #000000;
}
.lib-overlay input[type="text"], .lib-overlay input[type="password"], .lib-overlay input[type="email"] {
width: 100%;
margin: 0 0 10px 0;
padding: 5px 13px;
box-sizing: border-box;
border: 1px solid #CFCFCF;
border-radius: 5px;
font: var(--paragraph-font);
display: block;
}
.lib-overlay input[type="text"]::placeholder {
color: #999999;
}
.lib-overlay .password-input {
width: 100%;
position: relative;
}
.lib-overlay .password-input .show-hide-password {
position: absolute;
top: 5px;
right: 0;
}
.lib-overlay .password-input.password-shown .show-hide-password {
top: 0;
}
.lib-overlay .password-input .show-hide-password .hide-password, .lib-overlay .password-input.password-shown .show-hide-password .show-password {
display: none;
}
.lib-overlay .password-input.password-shown .show-hide-password .hide-password {
display: inline-block;
}
.lib-overlay .password-input .show-hide-password .hide-password, .lib-overlay .password-input .show-hide-password .show-password {
padding: 5px 10px;
border-radius: 5px;
color: #999;
}
.lib-overlay form .success-message {
display: none;
}
.lib-overlay form.form-submitted .success-message {
display: block;
}
.lib-overlay form.form-submitted input, .lib-overlay form.form-submitted label, .lib-overlay form.form-submitted .password-input, .lib-overlay form.form-submitted .custom-radio, .lib-overlay form.form-submitted button, .lib-overlay form.form-submitted a.button-like {
display: none;
}
.lib-overlay .additional-form-fields {
width: 100%;
margin: 0 0 20px 0;
}
.lib-overlay .additional-form-fields .add-new-field {
font: var(--small-header-font);
text-decoration: none;
}
.lib-overlay .additional-form-fields .add-new-field:before {
content: "";
width: 20px;
height: 20px;
margin: 0 8px 0 0;
background-image: url('/content/_theme_images/icon_plus.svg');
background-repeat: no-repeat;
background-size: cover;
opacity: 0.8;
display: inline-block;
position: relative;
top: 4px;
transition: opacity .3s;
}
.lib-overlay .additional-form-fields .add-new-field:after {
display: none;
}
.lib-overlay .additional-form-fields .add-new-field:hover:before {
opacity: 1;
}
.lib-overlay .overlay-bkgd {
width: 100%;
height: 100%;
background-color: #00000065;
opacity: 0.6;
position: absolute;
top: 0;
left: 0;
}
.lib-overlay .overlay-content {
max-width: 863px;
width: calc(100vw - 20px);
/* JS - changed the height to max and added a percent-based value and top values so it works better in shorter screens */
max-height: 709px;
height: calc(100vh - 20px);
padding: 50px;
box-sizing: border-box;
background-color: var(--background-1);
border: 0.5px solid var(--secondary-architecture);
display: block;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
left: 50%;
z-index: 5;
/* overflow: scroll; */
flex-direction: column;
margin: 0;
font: var(--paragraph-font);
}
.lib-overlay .overlay-content .overlay-step {
width: 100%;
height: 100%;
padding: 38px 38px 51px 38px;
padding: clamp(10px, 3.5%, 35px) ;
box-sizing: border-box;
background-color: var(--background-3);
border: 0.5px solid #A3A3A3;
display: none;
position: relative;
z-index: 15;
overflow: auto;
}
.lib-overlay .overlay-content.step-one .overlay-step.one, .lib-overlay .overlay-content.step-two .overlay-step.two, .lib-overlay .overlay-content.step-three .overlay-step.three {
display: block;
}
.lib-overlay .overlay-content .overlay-columns {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
position: relative;
z-index: 15;
}
.lib-overlay .overlay-content .column.form {
width: 100%;
max-width: 363px;
display: flex;
flex-direction: column;
}
.lib-overlay .overlay-content .column a.button-like {
margin: 15px 0 0 0;
}
.lib-overlay .overlay-content .column a.button.dropdown, .lib-overlay .overlay-content .column a.button-like.dropdown {
margin: 0;
}
.lib-overlay .overlay-content .column .form-flex {
width: 100%;
display: flex;
justify-content: space-between;
}
.lib-overlay .overlay-content .column .form-text-fields {
display: flex;
flex-direction: column;
}
.lib-overlay .overlay-content .column .form-half-field {
width: 48%;
display: inline-block;
}
.lib-overlay .overlay-content .column .form-field-remove {
padding: 29px 0 0 5px;
box-sizing: border-box;
display: inline-block;
}
.lib-overlay .overlay-content .column .form-radio-option {
display: flex;
position: relative;
}
.lib-overlay .overlay-content .column .form-radio-option input {
width: 16px;
height: 16px;
margin: 0 6px 0 0;
opacity: 0;
}
.lib-overlay .overlay-content .column .form-radio-option .custom-radio {
width: 16px;
height: 16px;
background-color: var(--background-1);
border: 1px solid var(--font-offset-color);
border-radius: 3px;
display: block;
position: absolute;
top: calc(50% - 10px);
left: 0;
}
.lib-overlay .overlay-content .column .form-radio-option .custom-radio:before {
content: "";
width: 8px;
height: 8px;
background-color: var(--background-1);
border-radius: 3px;
opacity: 0.8;
display: block;
position: absolute;
top: calc(50% - 4px);
left: calc(50% - 4px);
}
.lib-overlay .overlay-content .column .form-radio-option input:checked ~ .custom-radio {
background-color: #2196F3;
}
.lib-overlay .overlay-content .column.sign-in {
width: 100%;
max-width: 361px;
padding: 30px;
box-sizing: border-box;
background-color: var(--background-1);
border-top: 5px solid #2489AF;
display: flex;
flex-direction: column;
}
.lib-overlay .overlay-content .column.sign-in.alt {
padding: 13px;
border-top: 5px solid #2489AF;
}
.lib-overlay .overlay-content .column.sign-in.hidden {
display: none;
}
.lib-overlay .overlay-content .column.sign-in .sign-in-content {
padding: 18px 20px;
box-sizing: border-box;
}
.lib-overlay .overlay-content .column.sign-in h4 {
margin: 0 0 15px 0;
}
.lib-overlay .overlay-content .column.sign-in a.button-like, .lib-overlay .overlay-content .column.sign-in button {
margin: 15px 0 12px 0;
}
.lib-overlay .overlay-content .column.sign-in a.button-like.social {
margin: 0;
}
.lib-overlay .overlay-content .column.form.center {
max-width: 417px;
margin: 0 auto;
align-items: center;
}
.lib-overlay .overlay-content .column.form.center form {
width: 100%;
}
.lib-overlay .overlay-content .column.form.center form {
width: 100%;
}
.lib-overlay .overlay-content .column.sign-in.center {
max-width: 417px;
/* margin: 22px 0 0 0; */
margin: 22px auto 0 auto;
padding: 16px 21px;
}
.lib-overlay .overlay-content .column.center {
margin: 22px 0 0 0;
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
}
.lib-overlay ul li {
font: var(--paragraph-font);
}
.lib-overlay .disclaimer {
margin: 0 0 5px 0;
color: #707070;
font: var(--paragraph-font);
display: block;
}
/* edits for the bucket version of the lib-overlay */
.lib-overlay.bucket-overlay .overlay-content {
max-height: 300px;
padding: 40px 30px;
background-color: var(--body-offset-bg-color);
border: 1px solid var(--brand-border-color);
border-radius: 40px;
box-shadow: 0 2px 10px rgba(0,0,0,0.3);
font: inherit;
}
.lib-overlay.bucket-overlay .overlay-bkgd {
background-color: var(--body-offset-bg-color);
}
.lib-overlay.bucket-overlay a.close-icon:before {
display: none;
}

/*---------------------------------- Body > Page Element(s) -----------------------------------*/
/* -- Page Element: Accordion; has been reworked for this theme's layout, opting to use the more semantic html element `details`  -- */
.acc-container {
    margin-top: 83px;
}
.acc-container details {
    margin-bottom: 20px;
}
.acc-container details summary {
    /* padding: 10px 20px; */
    padding: 11px 43px 11px 16px;
    background-color: var(--select-bg-color);
    border: 1px solid var(--font-form-border-color);
    font: var(--font-acc-container);
    list-style: none;
    position: relative;
    cursor: pointer;
}
.acc-container details summary:before {
    content: '';
    width: 27px;
    height: 27px;
    background: no-repeat center;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="11px" height="5px" viewBox="0 0 11 5" version="1.1"><g id="Page-Layouts" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round"><polyline id="Combined-Shape" stroke="%23003B46" stroke-width="0.5" points="1 0 5.6558267 4.6558267 10.3116534 0"/></g></svg>');
    background-color: var(--theme-secondary-color-3);
    border-radius: 50%;
    position: absolute;
    top: calc(50% - (27px / 2));
    right: 16px;
    transition: transform .3s;
}
.acc-container details[open] summary:before {
    transform: rotate(180deg);
}
.acc-container details .details-content {
    padding: 14px 16px 23px;
    background-color: var(--body-bg-color);
    border: 1px solid var(--font-form-border-color);
    border-top: unset;
}

/* tab element */
.acc-container.tabs {
    margin: 0 0 25px 0;
}
.acc-container [role="tablist"] {
    min-width: 100%;
    margin: 0;
    display: flex;
    align-items: stretch;
}
.acc-container [role="tablist"] {
    width: 100%;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    overflow: hidden;
}
.acc-container [role="tab"] {
    width: 100%;
    margin: 0;
    padding: 12px;
    background-color: var(--body-bg-color);
    border: 1px solid var(--font-form-border-color);
    border-bottom: none;
    border-radius: initial;
    color: var(--font-body-color);
    font: var(--font-acc-container);
    flex: 1 1 0px;
    transition: background-color .3s;
}
.acc-container [role="tab"][aria-selected="true"] {
    background-color: var(--theme-secondary-color-3);
}
.acc-container [role="tab"]:before {
    content: unset;
}
.acc-container [role="tabpanel"] {
    width: 100%;
    margin: 0;
    padding: 24px 30px;
    background-color: var(--theme-secondary-color-3);
    border: 1px solid var(--font-form-border-color);
}
.acc-container [role="tabpanel"].is-hidden {
    display: none;
}
.acc-container [role="tabpanel"] article {
    height: auto;
}

/* -- Page Element: Alternating Image with Text; ... -- */
.alternate-image-text {
    margin: 75px 0;
}
.alternating-image-plus-text-block {
    /*margin-top: 60px;*/
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.alternating-image-plus-text-block div {
    width: calc(100% - 365px);
}
.alternating-image-plus-text-block > img {
    max-width: 50%;
}
.alternating-image-plus-text-block:first-of-type {
    margin-top: 30px;
}
.alternating-image-plus-text-block.right-alignment {
    flex-flow: row-reverse;
}
/*.alternating-image-plus-text-block>div {*/
    /*width: 50%;*/
/*    width: 55%;*/
/*    margin-left: 40px;*/
/*    align-self: center;*/
/*}*/
/*.alternating-image-plus-text-block>img {*/
    /*width: 50%;*/
/*    width: 45%;*/
/*    align-self: center;*/
/*}*/
/*.alternating-image-plus-text-block>div h3 {*/
/*    margin-top: 0;*/
/*}*/

/* -- Page Element: wysiwyg across; ...  -- */
.wysiwygs-across {
    width: 100%;
    margin: 75px 0 60px 0;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.wysiwygs-across h2 {
    margin: 0 0 40px 0;
}
.wysiwygs-across .wysiwyg h3 {
    /*margin-top: 0;*/
    /*font: 400 20px/24px 'Palatino'*/
}
.wysiwygs-across .wysiwygs {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.wysiwygs-across .wysiwygs .wysiwyg {
    flex: 0 1 auto;
    position: relative;
    overflow: hidden;
}
/* "call-to-action" variant edits (Page Element: wysiwyg across) */
.wysiwygs-across.call-to-action {
    margin: 30px 0 40px 0;
}
.wysiwygs-across.call-to-action .wysiwygs {
    padding: 30px 30px;
    background-color: var(--body-bg-color);
    border: 1px solid rgba(26,70,76,.27);
    border-radius: 40px;
}
.wysiwygs-across.call-to-action .wysiwygs .wysiwyg {
    flex: 1 1 0px;
}
.wysiwygs-across.call-to-action .wysiwygs .wysiwyg:not(:last-child) {
    padding-right: 5px;
    border: unset;
}
.wysiwygs-across.call-to-action h3 {
    margin-top: 0;
    font: 500 22px/24px 'DM Sans';
}
.wysiwygs-across.call-to-action .wysiwygs .divider {
    width: 1px;
    background-color: var(--hr-color);
}
.wysiwygs-across.call-to-action .wysiwygs .divider:last-child {
    display: none;
}
/* unique colmun sizes */
.wysiwygs-across .wysiwygs.column-1-across {
    grid-template-columns: repeat(1, 1fr);
}
.wysiwygs-across .wysiwygs.column-2-across {
    grid-template-columns: repeat(2, 1fr);
}
.wysiwygs-across .wysiwygs.column-3-across {
    grid-template-columns: repeat(3, 1fr);
}
.wysiwygs-across .wysiwygs.column-4-across {
    grid-template-columns: repeat(4, 1fr);
}
.wysiwygs-across .wysiwygs.column-5-across {
    grid-template-columns: repeat(5, 1fr);
}
.wysiwygs-across .wysiwygs.column-6-across {
    grid-template-columns: repeat(6, 1fr);
}
.wysiwygs-across .wysiwygs.column-7-across {
    grid-template-columns: repeat(7, 1fr);
}
.wysiwygs-across .wysiwygs.column-8-across {
    grid-template-columns: repeat(8, 1fr);
}
.wysiwygs-across .wysiwygs.column-9-across {
    grid-template-columns: repeat(9, 1fr);
}
.wysiwygs-across .wysiwygs.column-10-across {
    grid-template-columns: repeat(10, 1fr);
}
/* -- Page Element: galleries; TODO: ensure these styles have been reviewed after galleries are back and working  -- */
.image-container {
    position: relative;
}
.photo-container {
    float: left;
    position: relative;
    overflow: hidden;
}
.image-thumb {
    position: relative;
    background-color: #eee;
}
.gallery-wrapper {
position: relative;
margin-top: 100px;
}
.gallery-wrapper .gallery-slider-container {
margin: 20px auto 0px auto;
top: 0px;
left: 0px;
height: 500px;
visibility: visible;
margin-bottom: 15px;
position: relative;
overflow-x: hidden;
overflow-y: visible;
}
.gallery-slider-window {
position: absolute;
left: 0;
height:100%;
transition: transform 1s ease-in-out;
}
.gallery-wrapper .gallery-slide {
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-repeat: no-repeat;
background-position: center center;
height: 100%;
position: relative;
cursor: pointer;
z-index: 10;
}
.gallery-wrapper .gallery-arrow {
position: absolute;
top: calc(50% - 20px);
left: 25px;
bottom: 0px;
cursor: pointer;
height: 40px;
padding: 0px 5px;
z-index: 11;
font-size: 40px;
width: 40px;
display: flex;
color: inherit;
align-items: center;
margin: 0px;
border-radius: 0;
/*border: 1px solid var(--tag-border-color);*/
border: 1px solid var(--button-color);
background-color: var(--button-secondary-bg-color);
}
.gallery-wrapper .gallery-arrow.right {
left: unset;
right: 25px;
}
.gallery-wrapper .gallery-arrow:before, button.swiper-slide:before, .gallery-wrapper .thumbnail-arrow:before {
content: unset;
}
.gallery-wrapper .swiper-button-next:after, .gallery-wrapper .swiper-button-prev:after {
font-size: 20px;
/*color: var(--tag-border-color);*/
color: var(--button-color);
font-weight: 100;
}
.gallery-arrow i {
position: relative;
margin-top: -20px;
}
.gallery-nav-left {
left: 0;
}
.gallery-nav-right {
right: 0;
}
.slide_before {
left: -100%;
}
.slide_after {
left: 100%;
}
.slider-preview-line {
height: 130px;
width:	100%;
max-width: 940px;
padding: 15px 60px;
position: relative;
box-sizing: border-box;
overflow: hidden;
margin-bottom: 25px;
display: flex;
}
.gallery-wrapper .gallery-thumbnail {
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
cursor: pointer;
opacity: .75;
background-color: unset;
border-radius: 5px;
width: 100px;
height: 100px;
transition: all .25s ease-in-out;
outline: unset;
border: unset;
}
.gallery-thumbnail:hover, .gallery-thumbnail.active {
opacity: 1;
transform: scale(1.15);
}
.gallery-thumb-left {
left: 0;
}
.gallery-thumb-right {
right: 0;
}
.gallery-wrapper .thumbnail-arrow {
position: absolute;
cursor: pointer;
height: 40px;
padding: 0px 5px;
z-index: 8;
font-size: 25px;
display: flex;
justify-content: center;
align-items: center;
margin: 0px;
top: 50%;
bottom: 0px;
width: 40px;
color: inherit;	
background-color: rgb(253, 252, 248, .5);
border-radius: 0;
border: 1px solid var(--tag-border-color);
left: 0;
}
.gallery-wrapper .thumbnail-arrow.right {
left: unset;
right: 0;
}
.thumbnail-arrow i {
position: relative;
margin-top: 0px;
}
.slider-preview-container {
height:100%;
display: flex;
}
.gallery-slider-view-window {
width: 100%;
}
.gallery-grid {
    display: grid;
    gap: 25px;
    grid-template-columns: repeat(3, 1fr);

    --cell-size: 350px;
}
.gallery-grid .gallery-grid-image {
    padding-top: 75%;/*4:3 ratio*/
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    display: inline-flex;
    cursor: pointer;
}
.slider-caption {
position: absolute;
bottom: 0;
height: auto;
width: 100%;
padding: 5px 10px;
display: block;
}

body .gallery-overlay-bg {
    width: 100%;
    height: 100%;
    margin: 0;
    border: none;
    border-radius: initial;
    background-color: var(--theme-secondary-color-3);
    opacity: 0.3;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
body .gallery-overlay {
    width: 100vw;
    height: 100vh;
    padding: 22px;
    background-color: rgba(0,0,0,.25);
    padding: 50px; /* replaces existing css */
    top: 0px;
    left: 0px;
    z-index: 10000;
    cursor: pointer;
    display: none;
    justify-content: center;
    position: fixed;
}
body .gallery-overlay.open {
    display: flex;
}
body .gallery-overlay figure {
    width: calc(100vw - 100px);
    height: calc(100vh - 100px);
    max-width: 100%;
    max-height: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 100;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
body .gallery-overlay figure figcaption {
    background-color: white;
    border-radius: 5px;
    padding: 5px;
    font-size: 20px;
    width: 100%;
    text-align: center;
    margin-top: 10px;
}
body .gallery-overlay figure figcaption span {
    font-size: 16px;
}
body .gallery-overlay img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
}
body .gallery-overlay .close-button {
    width: auto;
    width: 25px;
    height: 25px;
    margin: 0;
    /*padding: 0 0 0 14px;*/
    background: transparent;
    /*background-image: url('/content/_theme_images/icon_button_close.svg');*/
    /*background-size: 50%;*/
    /*background-repeat: no-repeat;*/
    /*background-position: center;*/
    /*background-color: unset;*/
    color: var(--font-body-color);
    position: relative;
    top: 0;
    right: 0;
    z-index: 100000;
}
body .gallery-overlay .close-button:before {
    content: '';
    width: 100%;
    height: 100%;
    background: none;
    background-color: var(--font-body-color);
    clip-path: polygon(9% 0%, 50% 41%, 91% 0%, 100% 9%, 59% 50%, 100% 91%, 91% 100%, 50% 59%, 9% 100%, 0 91%, 41% 50%, 0% 9%);
    top: 0;
    left: 0;
    display: block;
    transform: unset;
}
body .gallery-overlay .close-button i {
    display: none;
}
body .image-container > .picrow > .photo-container > figure > a > img {}
body .gallery-overlay > .photo-caption > .caption, .gallery-overlay figcaption {
    display: block;
    font-size: 16px;
}
body .gallery-overlay > .photo-caption > .credit {
    display: block;
    font-size: 16px;
}
body .gallery-overlay > .photo-caption {
    position: absolute;
    padding: 5px;
    text-align: left;
}

.source-segment {
    width: 100%;
    margin: 0 auto 100px;
}
.source-segment .booklist-source {
    width: 100%;
    padding: 10px;
    padding-left: 20px;
    background-color: var(--theme-primary-color-1);
    position: relative;
}
.source-segment .booklist-source:before {
    content: "";
    width: 10px;
    height: 100%;
    background-color: var(--theme-secondary-color-1);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
.source-segment .booklist-source .source-books {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    row-gap: 5px;
    justify-content: space-between;
}
.source-segment .booklist-source .source-books .book {
    width: calc(33% - 5px);
    aspect-ratio: 0.69 / 1;
}


/*---------------------------------- Body > Bucket(s) -----------------------------------*/
/* -- Bucket: Full Bucket Segment; takes up the full width of the body w/ a content + image area horizontally flexed -- */
/*     - has similiar styles as the `.full-segment` element */
.full-bucket-segment {
    width: 100%;
    max-width: 1011px;
    margin: 0 auto 125px auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    
    --preload-cover-bg-color: var(--theme-primary-color-3);
}
.full-bucket-segment:last-of-type {
    margin-bottom: 0;
}
/* override base styles */
.full-bucket-segment h2, .full-bucket-segment .h2-like {
    margin: 0 0 16px 0;
    position: relative;
}
.full-bucket-segment .bucket-content {
    width: 100%;
    max-width: 415px;
    padding-left: 25px;
}
.full-bucket-segment .bucket-content h3:before {
    content: "";
    width: 10px;
    height: 30px;
    background-color: var(--theme-primary-color-3);
    display: block;
    position: absolute;
    top: -1px;
    left: -25px;
}
.full-bucket-segment .bucket-content .social-list {
    margin: 0;
    display: flex;
    column-gap: 9px;
    
}
.full-bucket-segment .bucket-content .social-list li {
    padding: 0;
    text-align: center;
    display: flex;
}
.full-bucket-segment .bucket-content .social-list li:before {
    display: none;
}
.full-bucket-segment .bucket-content .social-list li a {
    opacity: 0.5;
    color: var(--font-body-alt-color);
    font-size: 23px;
    line-height: 23px;
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: opacity .3s;
}
.full-bucket-segment .bucket-content .social-list li a:hover {
    opacity: 1;
}
.full-bucket-segment .bucket-content .social-list li a svg {
    width: 20px;
    height: 20px;
}
.full-bucket-segment .bucket-media {
    width: 100%;
    max-width: 445px;
    aspect-ratio: 1/1;
    position: relative;
}
.full-bucket-segment .bucket-media .bucket-media-image {
    width: 100%;
    display: block;
}
.full-bucket-segment .bucket-media .bucket-media-image.default {
    height: 445px;
}
/* "page-body" edits; these styles are for the secondary/tertiary page(s) */
.page-body .full-bucket-segment {
    width: 100%;
    margin: 75px 0 0 0;
    padding: 30px;
    background-color: var(--theme-secondary-color-4);
    border-left: 10px solid var(--theme-primary-color-3);
    align-items: flex-start;
    
    --font-header-2: var(--font-header-3);
}
.page-body .full-bucket-segment .bucket-media {
    max-width: 215px;
    display: none;
}
.page-body .full-bucket-segment.has-media .bucket-media {
    display: block;
}
.page-body .full-bucket-segment .bucket-content {
    width: 100%;
    max-width: none;
    padding-left: 0;
}
.page-body .full-bucket-segment.has-media .bucket-content {
    width: calc(100% - 275px);
}
.page-body .full-bucket-segment .bucket-content h3:before {
    display: none;
}

/* freeform bucket */
.freeform-bucket-segment {
    width: 100%;
    max-width: 1011px;
    margin-top: 40px;
    margin: 0 auto 125px auto;
}
.page-body .freeform-bucket-segment {
    margin-top: 40px;
}

/* -- Bucket: Alert Block; it's our 'overlay' bucket -- */
.alert-block {
    width: 100%;
    height: 100%;
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 1000;
    transition: opacity .25s;
}
/* override base styles */
.alert-block h3, .alert-block .h3-like {
    margin: 0 0 15px 0;
}
.alert-block p {
    margin: 0;
}
.alert-block button, .alert-block a.button-like {
    margin: 20px 0 0 16px;
}
.alert-block.active {
    pointer-events: all;
    opacity: 1;
}
.alert-block.hidden {
    display: none;
}
.alert-block .alert-block-bkgd {
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-3);
    opacity: 0.3;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.alert-block .alert-block-content {
    max-width: 720px;
    min-width: 720px;
    padding: 35px 30px;
    background-color: var(--theme-secondary-color-3);
    border: 0.5px solid var(--theme-secondary-color-2);
    border-radius: 40px 0 40px 0;
    position: relative;
    z-index: 5;
}
.alert-block .alert-block-content ol {
    margin-bottom: 10px;
    padding: 0 0 0 35px;
}
.alert-block .alert-block-content .close-icon {
    color: var(--font-body-color);
    font: var(--font-utility-navigation);
    text-transform: uppercase;
    text-decoration: none;
    display: flex;
    align-items: center;
    column-gap: 3px;
    position: absolute;
    top: 25px;
    right: 25px;
}
@media only screen and (max-width: 800px) {
    .alert-block .alert-block-content {
        width: calc(100% - 60px);
        min-width: unset;
        max-height: calc(100% - 25px);
        overflow: scroll;
    }
    .alert-block .alert-block-content .close {
        position: fixed;
        top: 21px;
        right: 43px;
    }
}
@media only screen and (max-width: 450px) {
    .alert-block .alert-block-content {
        width: calc(100% - 20px);
        padding: 35px 20px 15px 15px;
        top: 15px;
        left: 10px;
        overflow: scroll;
    }
    .alert-block .alert-block-content .close {
        top: 15px;
        right: 17px;
    }
    .alert-block .alert-block-content p {
        font: var(--paragraph-font);
    }
    .alert-block .alert-block-content ol li {
        font: var(--secondary-button-fonts);
    }
}

.body iframe {
max-width: 100%;
}
.body.no-sidebar{
    width: 100%;   
}
.body p.full-width {
max-width: none;
}
.body img {
border-radius: 5px;
}
.main-content.tertiary .body:not(.no-right-sidebar) {
/* width: calc(100% - 700px); */
/* width: calc(100% - 610px); */
width: calc(100% - 571px);
flex: 1;
}
.main-content.calendar .body, .main-content.search-page .body {
width: 100%;
}
.body bs_editable {
max-width: 587px;
}
.body bs_editable img {
max-width: 100%;
height: auto;
}

.lineage-container {
    width: 100%;
    margin: 80px 0 0 0;
}
.lineage-container .lineage-content {
    width: 100%;
    padding: 44px 30px;
    border-radius: 0 50px 0 50px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 24px;
    /*row-gap: 24px;*/
    position: relative;
    overflow: hidden;
}
.lineage-container .lineage-content:before, .lineage-container .lineage-content:after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none;
}
.lineage-container .lineage-content:before {
    background-color: var(--theme-primary-color-5);
    opacity: 0.4;
}
.lineage-container .lineage-content:after {
    background: url(/content/_site_images/icon_lighten-repeat.svg) repeat;
    opacity: 0.75;
}
/* override base styles */
.lineage-container h4, .lineage-container .h4-like {
    margin: 0;
}
.lineage-container h5, .lineage-container .h5-like {
    margin: 0;
}
.lineage-container p {
    margin: 5px 0 15px 0;
    color: var(--font-body-intro-color);
    font: var(--font-lineage-body);
}
.lineage-container button.secondary, .lineage-container a.button-like.secondary {
    margin: 0;
}
.lineage-container .lineage-content .item-header {
    width: 100%;
    margin: 0 0 12px 0;
    font: var(--font-lineage-sub-heading);
    letter-spacing: 0.5px;
    text-transform: uppercase;
    display: block;
    position: relative;
    z-index: 5;
}
.lineage-container .lineage-content .item {
    width: calc(33% - 17px);
    /*margin: 0 24px 24px 0; */
    margin: 0 0 24px 0;
    display: inline-block;
    position: relative;
    z-index: 5;
}
.lineage-container .lineage-content .item .item-media {
    width: 100%;
    margin: 0 0 10px 0;
    background-color: var(--theme-primary-color-5);
    aspect-ratio: 1.57 / 1;
    display: block;
}
/*.lineage-container .lineage-group {*/
/*    width: 100%;*/
/*    margin: 0 0 28px 0;*/
/*}*/
/*.lineage-container .lineage-group:last-of-type {*/
/*    margin: 0;*/
/*}*/
/*.lineage-container .lineage-group .group-subheader {*/
/*    width: 100%;*/
/*    margin: 0 0 12px 0;*/
/*    font: var(--font-baluster-subheader);*/
/*    letter-spacing: 0.5px;*/
/*    text-transform: uppercase;*/
/*    display: block;*/
/*}*/
/*.lineage-container .lineage-group .group-items {*/
/*    width: 100%;*/
/*    display: flex;*/
/*    flex-wrap: wrap;*/
/*    column-gap: 24px;*/
/*    row-gap: 24px;*/
/*}*/
/*.lineage-container .lineage-group .group-items .item {*/
/*    margin: 0;*/
/*}*/

/* TODO: move to global */
.body .styled_rounded {
box-sizing: border-box;
display: inline-block;
position: relative;
z-index: 5;
}
.body .styled_rounded img {
width: 100%;
display: block;
position: relative;
z-index: 10;
}

.bucket-segment {
    width: 100%;
    /*padding: 0 54px 0 0;*/
    padding: 0;
    background-color: var(--theme-secondary-color-1);
    border-radius: 5px 30px 30px 110px;
    display: flex;
    /*column-gap: 30px;*/
    /*align-items: center;*/
    justify-content: space-between;
    overflow: hidden;
}
.home .bucket-segment {
    padding: 0 54px 0 0;
    column-gap: 30px;
    align-items: center;
}
.bucket-segment p {
    margin: 0;
}
.bucket-segment .bucket-media {
    width: calc(100% - 375px);
    max-width: 790px;
    min-width: 400px;
    aspect-ratio: 1.78 / 1;
    display: block;
}
.bucket-segment .bucket-media .bucket-media-image {
    width: 100%;
    height: 100%;
    display: block;
}
.bucket-segment .bucket-media .bucket-media-image.has-image {
    background: no-repeat center;
    aspect-ratio: 1;
    height: auto;
    background-size: cover;
}
.bucket-segment .bucket-content {
    width: calc(100% - 400px);
    max-width: 315px;
    padding: 42px 46px;
}
.home .bucket-segment .bucket-content {
    padding: 0;
}
.bucket-segment .bucket-content .bucket-subheader {
    margin: 0 0 18px 0;
    font: var(--font-subheader);
    text-transform: uppercase;
    display: block;
}
.bucket-segment .bucket-content .bucket-heading {
    margin: 0 0 12px 0;
    font: var(--font-header-3);
    display: block;
}
.bucket-segment .bucket-content a.button-like {
    margin: 20px 0 0 17px;
}
.bucket-segment .bucket-content a.button-like.secondary {
    margin-left: 0;
}
/* override(s) for "bucket-segment" (upcoming-event variant) */
.bucket-segment.upcoming-event {
    /*padding: 0 0 0 54px;*/
    flex-direction: row-reverse;
}
.bucket-segment.upcoming-event p {
    max-height: 104px;
    font: var(--font-event-bucket-body);
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.bucket-segment.upcoming-event .bucket-media {
    width: calc(100% - 300px);
    max-width: 350px;
    aspect-ratio: 1.17 / 1;
}
.bucket-segment.upcoming-event .bucket-content .bucket-heading {
    margin: 0 0 9px 0;
    font: var(--font-header-5);
}
/* override(s) for "bucket-segment" set in the "Below Page Content" region */
.page-body .bucket-segment {
    margin: 50px 0 0 0;
}

/* ride-sidebar */
.right-sidebar {
    width: 100%;
    max-width: 235px;
}
/* overwrite "bucket-segment" styles when it's nested in the right-sidebar */
.right-sidebar .bucket-segment {
    margin: 0 0 50px 0;
    padding: 0;
    border-radius: 0 40px 0 40px;
    display: block;
    
    --font-body: var(--font-full-segment-author);
}
.right-sidebar .bucket-segment:last-of-type {
    margin: 0;
}
.right-sidebar .bucket-segment .bucket-media {
    width: 100%;
    min-width: auto;
    margin: 0;
}
.right-sidebar .bucket-segment .bucket-content {
    width: 100%;
    padding: 20px;
}
.right-sidebar .bucket-segment .bucket-content p {
    margin: 0;
}
.right-sidebar .bucket-segment .bucket-content .bucket-subheader {
    margin: 0 0 12px 0;
    font: var(--font-subheader);
    text-transform: uppercase;
    display: block;
}
.right-sidebar .bucket-segment .bucket-content .bucket-heading {
    margin: 0 0 6px 0;
    font: var(--font-header-5);
}
.right-sidebar .bucket-segment .bucket-content a.button-like {
    margin-top: 12px;
}

/* home top-right column(.more-events) edits */
.more-events .bucket {
width: 100%;
margin: 0 0 18px 0;
padding: 25px 25px 15px 25px;
box-sizing: border-box;
border: 1px solid var(--secondary-architecture);
background-color: var(--background-1);
display: inline-block;
transition: padding .3s;
position: relative;
}
.more-events .bucket:before {
content: "";
width: 1px;
height: 20px;
background-color: var(--secondary-architecture);
display: block;
position: absolute;
top: -21px;
left: 50%;
z-index: 1;
}
.more-events .bucket img {
margin: 0 0 2px 0;
}
.more-events .bucket .bucket-media {
width: 351px;
/*height: 119px;*/
height: 141px;
margin: 0 0 5px 0;
transition: width .3s, height .3s;
}
.more-events .bucket .bucket-content {
width: 100%;
}
.more-events .bucket .bucket-content .bucket-heading {
margin: 0;
font: var(--secondary-header-font);
font-weight: 400;
letter-spacing: initial;
display: block;
}

/* the table element (TODO: move to base styles) */
table {
    /*width: calc(100% + 45px);*/
    margin: 0 0 80px 0;
    /*padding-right: 45px;*/
    border: unset;
    border-spacing: unset;
    display: block;
    overflow: auto;
}
table caption {
    margin-bottom: 10px;
}
table thead {
    border: unset;
}
table thead tr th {
    padding: 11px 13px;
    background-color: var(--theme-secondary-color-9);
    border: unset;
    border: 0.5px solid var(--theme-secondary-color-7);
    border-right: none;
    font: var(--font-table-head);
    text-align: left;
}
table thead tr th:last-child {
    border-right: 0.5px solid var(--theme-secondary-color-4);
}
table td {
    padding: 9px 13px;
    background-color: var(--body-bg-color, #FCFCFC);
    border: unset;
    border-top: 0.5px solid var(--font-form-border-color);
    border-left: 0.5px solid var(--font-form-border-color);
    font: var(--font-table-cell);
}
table tr:last-child td {
    border-bottom: 0.5px solid var(--font-form-border-color);
}
table tr td:last-child {
    border-right: 0.5px solid var(--font-form-border-color);
}

/* events embed page element */
.upcoming-events-embed {
width: 100%;
margin: 50px 0;
}
.upcoming-events-embed .day-section {
width: 100%;
margin: 0 0 30px 0;
padding: 0;
display: flex;
align-items: flex-start;
justify-content: space-between;
position: relative;
}
.upcoming-events-embed .day-section .section-date {
width: 75px;
height: 75px;
border-radius: 50%;
background-color: var(--body-bg-color);
border: 1px solid var(--brand-border-color);
font: 600 20px / 22px 'DM Sans';
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.upcoming-events-embed .day-section .section-events {
width: calc(100% - 100px);
display: flex;
flex-wrap: wrap;
/*align-items: flex-start;*/
column-gap: 15px;
row-gap: 15px;
}
.upcoming-events-embed .day-section .section-events .event {
width: calc(50% - 15px);
padding: 20px 25px;
background-color: var(--body-bg-color);
border-radius: 40px;
border: 1px solid var(--brand-border-color);
display: block;
position: relative;
}
.upcoming-events-embed .day-section .section-events .event .h3-like {
margin: 0 0 5px 0;
font-size: 20px;
line-height: 22px;
}
.upcoming-events-embed .day-section .section-events .event .event-info {
margin: 5px 0 10px 0;
font: 400 16px / 18px 'DM Sans';
color: var(--font-offset-color);
}
.upcoming-events-embed .day-section .section-events .event .event-info .date:after {
content: " | ";
}
.upcoming-events-embed .day-section .section-events .event .event-info .location {
margin: 5px 0 0 0;
display: flex;
column-gap: 5px;
align-items: center;
}

/* booklists embed page element */
.booklists-embed {
    width: 100%;
    /*margin-top: 40px;*/
    margin: 0px auto 75px;
}
.booklists-embed .embed-top-panel {
    width: 100%;
    margin: 0 0 25px 0;
    padding: 17px 30px;
    background-color: var(--body-bg-color);
    border: 1px solid var(--brand-border-color);
    border-radius: 20px;
}
.booklists-embed .embed-top-panel ul {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 15px;
    row-gap: 15px;
}
.booklists-embed .embed-top-panel ul li {
    margin: 0;
    padding: 0 0 3px 0;
}
.booklists-embed .embed-top-panel ul li:before {
    /*display: none;*/
    width: 100%;
    height: 3px;
    background-color: var(--brand-border-color);
    border-radius: initial;
    opacity: 0;
    top: auto;
    bottom: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: opacity .2s, transform .2s;
}
.booklists-embed .embed-top-panel ul li:hover:before, .booklists-embed .embed-top-panel ul li.active:before {
    opacity: 1;
    transform: scaleX(1);
    transition: opacity .3s, transform .3s;
}
.booklists-embed .embed-top-panel ul li a {
    text-decoration: none;
}
.booklists-embed .embed-content {
    width: 100%;
    position: relative;
}
.booklists-embed .embed-content .embed-item {
    opacity: 0;
    position: absolute;
    top: -100vh;
    transform: translateY(-15px);
    pointer-events: none;
    transition: opacity 0s;
}
.booklists-embed .embed-content .embed-item.active {
    opacity: 1;
    position: relative;
    top: 0;
    transform: translateY(0);
    pointer-events: all;
    transition: opacity .3s, transform .3s;
}
.booklists-embed .book-list .book-list-books .book {
    height: 175px;
    flex-basis: initial;
    aspect-ratio: initial;
}

/* eresource embed page element */
.eresources-embed {
    width: 100%;
    margin: 50px 0;
}
.eresources-embed .eresource-entities {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 15px;
    row-gap: 15px;
}
.eresources-embed .eresource-entities .eresource-item {
    padding: 15px;
    /*max-width: 275px;*/
    max-width: 215px;
    align-items: initial;
}
@media only screen and (max-width: 600px) {
    .eresources-embed .eresource-entities {
        gap: 10px;
    }
    .eresources-embed .eresource-entities .eresource-item {
        width: calc(50% - 5px);
    }
}
.eresources-embed .eresource-entities .eresource-item h4 {
    margin: 0 0 5px 0;
}
.eresources-embed .eresource-entities .eresource-item p {
font-size: 15px;
line-height: 17px;
}
.eresources-embed .eresource-entities .eresource-item .item-content {
    /*padding: 13px;*/
}
.eresources-embed .eresource-entities .eresource-item .item-content .eresource-buttons {
gap: 5px;
}

/* blog posts embed page element */
.blog-posts-embed {
width: 100%;
margin: 50px 0;
}
.blog-posts-embed .personal-items {
align-items: initial;
column-gap: 15px;
row-gap: 15px;
}
.blog-posts-embed .personal-items .personal-item {
width: 100%;
/*max-width: 215px;*/
max-width: 440px;
}
.blog-posts-embed .personal-items .personal-item h4 {
margin: 0 0 5px 0;
}
.blog-posts-embed .personal-items .personal-item .item-media {
height: 275px;
}
.blog-posts-embed .personal-items .personal-item .item-media.has-image {
background-size: cover;
}
.blog-posts-embed .personal-items .personal-item .item-content {
padding: 13px;
}
.blog-posts-embed .personal-items .personal-item .item-content p {
font-size: 15px;
line-height: 17px;
}
.blog-posts-embed .personal-items .personal-item .item-content .date {
color: var(--font-offset-color);
font: 400 15px / 17px "DM Sans";
display: flex;
column-gap: 5px;
align-items: center;
}

/* pathfinder styles */
.source-container {
    margin: 50px 0 0 0;
    --source-skeleton-opacity: 1;
}
.source-container.sources-hydrated {
    --source-skeleton-opacity: 0;
}
.source-container .swiper-slide {
margin-right: 35px;
}
.source-container .h3-like:before, .source-container h4:before, .source-container p:before, .source-container .item-media:before, .source-container .date:before, .source-container .source-event .event-info:before, .source-container .personal-item .item-content .booklist-books .book:before, .source-container .personal-item .item-content .item-buttons:before, .source-container .source-event .event-buttons:before, .source-container .eresource-item .item-content .eresource-buttons:before {
content: "";
width: 100%;
height: 100%;
background-color: rgba(211,211,211,1);
opacity: var(--source-skeleton-opacity);
display: block;
position: absolute;
top: 0;
left: 0;
z-index: 15;
pointer-events: none;
transition: opacity .3s;
}
.source-container h3, .source-container h4 {
position: relative;
}
.source-container p {
position: relative;
}
/*.source-container .eresource-item {*/
/*max-width: 300px;*/
/*}*/
.source-container .blog-source {
width: 100%;
/*max-width: 440px;*/
max-width: 370px;
background-color: var(--body-bg-color);
border: 0.5px solid var(--brand-border-color);
border-radius: 40px;
overflow: hidden;
}
.source-container .blog-source h4 {
margin: 0 0 5px 0;
}
.source-container .blog-source p {
color: var(--font-offset-color);
font-size: 15px;
line-height: 17px;
}
.source-container .blog-source a.button-like {
margin: 15px 0 0 0;
}
.source-container .blog-source .item-media {
width: 100%;
display: block;
height: 275px;
position: relative;
}
.source-container .blog-source .item-media.has-image {
background-size: cover;
}
.source-container .blog-source .item-content {
padding: 13px;
}
.source-container .blog-source .item-content .date {
margin: 0 0 8px 0;
color: var(--font-offset-color);
font: 400 15px / 17px "DM Sans";
display: flex;
column-gap: 5px;
align-items: center;
position: relative;
}
.source-container .skeleton {
min-height: 20px;
background-color: #000;
}
.source-container .error-message {
margin: 20px 0;
padding: 5px 25px;
background-color: var(--body-offset-bg-color);
border-radius: 15px;
display: inline-block;
text-align: center;
}
.source-container .error-message.warning {
background-color: rgba(141,99,165,0.25);
border: 1px solid #8D63A5;
font-weight: 600;
}
.source-container .source-event {
width: 100%;
padding: 20px 25px;
background-color: var(--body-bg-color);
border-radius: 40px;
border: 1px solid var(--brand-border-color);
display: flex;
column-gap: 0.5em;
position: relative;
}
.source-container .source-event .event-date {
width: 75px;
height: 75px;
border-radius: 50%;
background-color: var(--body-bg-color);
border: 1px solid var(--brand-border-color);
font: 600 20px / 22px 'DM Sans';
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.source-container .source-event .event-content {
width: calc(100% - (75px + 0.5em));
}
.source-container .source-event .h3-like {
margin: 0 0 5px 0;
font-size: 20px;
line-height: 22px;
position: relative;
}
.source-container .source-event p {}
.source-container .source-event .event-info {
margin: 5px 0 10px 0;
font: 400 16px / 18px 'DM Sans';
color: var(--font-offset-color);
position: relative;
}
.source-container .source-event .event-info .date::after {
content: " | ";
}
.source-container .source-event .event-buttons {
position: relative;
}

.upcoming-events-embed .section-events .event-buttons a:nth-child(2) {
    display: none;
}

/*////////////////////////////////////*/

/* masonry test */
.masonry-wrapper {
position: relative;
transition: opacity .25s ease-in-out;
opacity: 0;
display: none;
}
.masonry-wrapper.obscure {
opacity: 0;
}
.masonry-wrapper.loaded {
opacity: 1;
}
.masonry {
position: relative;
display: grid;
}
.masonry-item {
position: relative;
display: block;
width: 33.3333333333%;
opacity: 1;
transition: opacity .25s ease-in-out;
}
.masonry-item:hover {
opacity: .75;
}
.masonry-item img {
display: flex;
max-width: 100%;
max-height: 100%;
width: 100%;
}

.gallery-loader {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;	
margin-top: 10px;		
}
.gallery-loader div {
    margin-top: 17px;	
}
@keyframes l {
    from {
        transform: rotate(0deg);
    } to {
        transform: rotate(360deg);
    }
}

/* search page */

/*======================================================================================================
    FOOTER STYLES - desktop TODO: move styles to global
======================================================================================================*/
/*/// footer variables TODO:move these to be with the rest ///*/
html {
    --footer-logo: url(/content/_site_images/site-logo_footer.png);
    --footer-hours-list-min-cell-size: 40px;
    --footer-hours-list-max-cell-size: 160px;
}
footer {
    width: 100%;
    /*max-width: 1490px;*/
    max-width: 1280px;
    margin: 0 auto;
    margin-top: -40px;
    padding: 0 30px 22px;
    background-color: var(--body-bg-color, #FCFCFC);
    position: relative;
    z-index: 25;
    
    /* overwrite `base` variables */    
    --font-header-5: normal 400 14px / 18px "Inter Tight", sans-serif;
    /*--font-header-color: #fff;*/
    /*--font-body-color: #fff;*/
    --font-body: normal 400 14px/19px "Inter Tight", sans-serif;
    --font-link: normal 400 15px/19px "Inter Tight", sans-serif;
    /*--font-link-color: #EDC531;*/
}
/* overwrite `base` styles */
footer h4, footer .h4-like {
    margin: 0 0 8px 0;
}
footer h5, footer .h5-like {
    margin: 0;
    opacity: 0.9;
}
footer p {
    margin: 0;
}
footer a {
    transition: opacity .3s;
}
footer ul {
    margin: 0;
    padding: 0;
}
footer ul li ul {
    margin: 0;
    padding: 0;
}
footer ul li {
    margin: 0;
    padding: 0;
}
footer .footer-details .nav-list > li {
    margin-top: 15px;
}
footer ul li:before {
    display: none;
}
footer .footer-wrapper {
    width: 100%;
    /*background-color: var(--body-bg-color, #FCFCFC);*/
    /*border-radius: 5px 5px 110px 68px;*/
    display: flex;
    /*position: relative;*/
}
/*footer .footer-offset-icon {*/
/*    opacity: 0.5;*/
/*    display: block;*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*}*/
footer .footer-offset-icon {
    width: 200px;
    height: calc(100% - 22px);
    background-color: var(--body-bg-color, #FCFCFC);
    display: flex;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 255px;
    z-index: 1;
}
footer .footer-details {
    width: 100%;
    max-width: 325px;
    padding: 50px 0 50px 35px;
    /*background-color: var(--theme-secondary-color-2);*/
    background: url(/content/_site_images/icon_darken-repeat.svg) repeat;
    background-color: var(--theme-primary-color-2);
    border-radius: 5px 110px 0 110px;/* curve element - large */
    display: flex;
    flex-direction: column;
    /*row-gap: 45px;*/
    align-items: flex-start;
    position: relative;
    z-index: 5;
    
    /* override base variables */
    --font-header-color: var(--font-body-opt-color);
    --font-body-color: var(--font-body-opt-color);
    --font-color-site-navigations: var(--font-body-opt-color);
    --button-secondary-bg-color: var(--font-link-color);
}
/* override base styles */
footer .footer-details .site-logo {
    width: 100%;
    margin: 0 0 33px 0;
}
footer .footer-details .site-logo img {
    content: var(--footer-logo);
    max-width: 220px;
}
footer .footer-details .social-list {
    margin: 16px 0 26px 0;
    display: flex;
    column-gap: 9px;
}
footer .footer-details .social-list li {
    text-align: center;
    display: flex;
}
footer .footer-details .social-list li a {
    opacity: 0.5;
    color: var(--font-body-color);
    font-size: 23px;
    line-height: 23px;
    text-decoration: none;
    display: flex;
    align-items: center;
    transition: opacity .3s;
}
footer .footer-details .social-list li a[href*="//"]:not(.skip-offsite):not([href*="http://milibrary.org/"]):not([href*="https:encore.milibrary.org"]):after {
    display: none;
}
footer .footer-details .social-list li a:hover {
    opacity: 1;
}
footer .footer-details .social-list li a svg {
    width: 26px;
    height: 26px;
}
footer .branch-hours p, footer .branch-hours address {
    margin: 0;
}
footer .info p, footer .info address {
    opacity: 0.7;
    margin: 0 0 10px 0;
}
footer .info address {
    margin: 0;
}
footer .info .branch-hours {
    /*margin-top: 10px;*/
}
footer .info .branch-hours p {
    margin: 0;
}
footer .footer-sitemap {
    width: calc(100% - 325px);
    /*padding: 36px 40px;*/
    padding: 50px 40px 36px 50px; /* updated for new requested layout */
    background-color: var(--theme-secondary-color-3);
    border-radius: 110px 5px 110px 0;/* curve element - large */
    position: relative;
    z-index: 5;
    
    /* overwrite `base` variables */    
    --font-link: normal 500 15px/19px "Inter Tight", sans-serif;
    /*--font-header-color: #fff;*/
    /*--font-body-color: #fff;*/
}
footer .footer-sitemap .info-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
footer .footer-sitemap .info-list .info:last-child {
    padding-top: 30px;
    /*grid-column: span 2;*/
}
footer .footer-sitemap hr {
    margin: 20px 0;
}
/* overwrite `base` styles */
footer .footer-sitemap h5, footer .footer-sitemap .h5-like {
    opacity: 1;
}
footer a {
    color: var(--font-body-color);
    text-decoration: none;
}
footer a:after {
    background-color: var(--font-body-color);
}
footer .footer-sitemap nav {
    width: 100%;
}
footer .footer-sitemap nav ul.nav-list {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 18px;
    row-gap: 20px;
}
footer .footer-sitemap nav ul.nav-list li {
    /*width: calc((100% / 6) - 15px);*/
    /*max-width: 172px;*/
}
footer nav ul.nav-list li a {
    font: var(--font-footer-sitemap-secondary);
}
footer nav ul.nav-list li .list-dropdown {
    width: 100%;
    margin: 5px 0 0 0;
}
footer .footer-details nav ul.nav-list li .list-dropdown {
    margin-top: 5px;
}
footer nav ul.nav-list li .list-dropdown ul li {
    width: 100%;
    display: flex;
    margin-bottom: 2px;
}
footer nav ul.nav-list li .list-dropdown ul li a {
    opacity: 0.8;
    font: var(--font-footer-sitemap-tertiary);
}
footer nav ul.nav-list li .list-dropdown ul li a:hover {
    opacity: 1;
}
footer .footer-sitemap nav ul.nav-list li .list-dropdown .dropdown-groups .group {
    margin: 0 0 7px 0;
}
footer .footer-sitemap nav ul.nav-list li .list-dropdown .dropdown-groups .group:last-of-type {
    margin: 0;
}
footer .footer-sitemap nav ul.nav-list li .list-dropdown .dropdown-groups .group .item-heading {
    margin: 0 0 2px 0;
    opacity: 0.7;
    font: var(--font-footer-sitemap-header);
    letter-spacing: 0.5px;
    text-transform: uppercase;   
    display: block;
}
/*footer .footer-sitemap nav ul.nav-list li .list-dropdown .dropdown-groups .group ul {*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    row-gap: 3px;*/
/*}*/
/*footer .footer-sitemap nav ul.nav-list li .list-dropdown .dropdown-groups .group ul li a {*/
/*    opacity: 0.8;*/
/*    font: var(--font-footer-sitemap-tertiary);*/
/*}*/
/*footer .footer-sitemap nav ul.nav-list li .list-dropdown .dropdown-groups .group ul li a:hover {*/
/*    opacity: 1;*/
/*}*/

footer .footer-sitemap .footer-credits {
    opacity: .7;
    /*width: calc(100% - 120px);*/
    /*margin: 50px auto 0 auto;*/
}
footer .footer-sitemap .footer-credits ul.nav-list {
    display: flex;
    flex-wrap: initial;
    /*column-gap: 70px;*/
    /*row-gap: initial;*/
    justify-content: space-between;
}
footer .footer-sitemap .footer-credits ul.nav-list li {
    width: auto;
    max-width: none;
}
footer .footer-sitemap .footer-credits ul.nav-list li:last-of-type {/* needed for "Site by Byte" list-item */
    display: flex;
    align-items: center;
    column-gap: 3px;
}
footer .footer-sitemap .footer-credits ul.nav-list li a {
    font: var(--font-footer-sitemap-tertiary);
}
footer .footer-sitemap .footer-credits ul.nav-list li .link-text {
    font: var(--font-footer-sitemap-tertiary);
}


/*======================================================================================================
    MEDIA QUERIES
======================================================================================================*/
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ 2x screens \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
/* these are styles for mainly mac users (allows pixel amounts to go as low as 0.5px)*/
/*@media only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {}*/

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1490px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
/*
@media only screen and (max-width: 1490px) {
    footer {
        max-width: 100%;
    }
    footer .footer-details {
        border-radius: 5px 110px 0 0;
    }
}
*/

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1440px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1440px) {
    header .header-panels {
        left: 0;
    }
    .fixed-prompt {
        left: 0;
    }
}

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1315px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1315px) {
    .anchor-navigation.fixed {
        right: 25px;
    }
}

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1280px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1280px) {
    /*------------------ Global - styles | @1280 ------------------*/
    html {
        /*--site-logo-container-width: 380px;*/
        /*--site-logo-height: auto;*/
        
        /*--font-main-navigation: normal 700 13px/14px "Palatino", serif*/
    }
    /*------------------ Header - styles | @1280 ------------------*/
    
    /*header .site-logo {*/
    /*    padding: 28px 28px 0 28px;*/
    /*}*/
    /*header .site-navigations {*/
    /*    width: calc(100% - 380px);*/
    /*}*/
    /*header .main-navigation {*/
    /*    padding-right: 15px;*/
    /*}*/
    /*header .main-navigation ul.nav-list li a {*/
    /*    padding: 12px 6px;*/
    /*    padding-left: 11px;*/
    /*}*/
    /*header .main-navigation ul.nav-list .list-dropdown {*/
    /*    width: calc(100% - 30px);*/
    /*    left: 15px;*/
    /*}*/
    /*header .main-navigation ul.nav-list li.search-option {*/
    /*    height: 37px;*/
    /*}*/
    /*header .utility-navigation {*/
    /*    padding-right: 15px;*/
    /*}*/
    /*.top-search-input {*/
    /*    width: calc(100% - 30px);*/
    /*}*/
    /*.top-search-input.show-search {*/
    /*    left: 15px;*/
    /*}*/
    /*.left-sidebar {*/
    /*    padding-left: 35px;*/
    /*}*/
    /*.bucket-segment {*/
    /*    padding: 15px 0;*/
    /*    flex-direction: column;*/
    /*}*/
    .bucket-segment .bucket-content {
        width: 100%;
        max-width: 400px;
        margin-top: 10px;
    }
    .bucket-segment.upcoming-event {
        padding: 0;
        /*flex-direction: column;*/
    }
    .bucket-segment.upcoming-event .bucket-media {
        min-width: auto;
    }
}

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1140px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1140px) {
    /*------------------ Global - styles | @1140 ------------------*/
    html {
        /*--site-logo-container-width: 315px;*/
        
        /*--font-main-navigation: normal 700 12px/13px "Inter Tight", sans-serif;*/
        /*--font-utility-navigation-dropdown: normal 300 12px/13px "Inter Tight", sans-serif;*/
    }
    /*------------------ Header - styles | @1140 ------------------*/
    header .header-wrapper {
        justify-content: flex-end;
    }
    header .site-logo {
        position: absolute;
        bottom: 0;
        left: 30px;/* ensure this padding matches the one side padding of the .header=wrapper element */
        z-index: 5;
    }
    header .main-navigation {
        width: auto;
    }
    header .main-navigation ul.nav-list {
        width: auto;
        position: relative;
    }
    header .main-navigation ul.nav-list li a {
        padding: 16px 13px;
    }
    /*header .site-navigations {*/
    /*    width: calc(100% - var(--site-logo-container-width));*/
    /*}*/
    /*header .main-navigation {*/
    /*    padding-right: 10px;*/
    /*}*/
    /*header .main-navigation ul.nav-list .list-dropdown {*/
    /*    width: calc(100% - 20px);*/
    /*    left: 10px;*/
    /*}*/
    /*header .main-navigation ul.nav-list li.search-option {*/
    /*    height: 37px;*/
    /*}*/
    /*header .utility-navigation {*/
    /*    padding-right: 10px;*/
    /*}*/
    /*header .utility-navigation ul.panel-options {*/
    /*    display: none;*/
    /*}*/
    /*.top-search-input {*/
    /*    width: calc(100% - 20px);*/
    /*}*/
    /*.top-search-input.show-search {*/
    /*    left: 10px;*/
    /*}*/
    
    /*------------------ Body - styles | @1140 ------------------*/
    .overflow-segment.banner {
        /* override base variables */
        --overflow-segment-media-ratio: 1.76 / 1;
    }
    
    .root-pillars-segment .content-pillar .pillar-item {
        width: calc(50% - 65px);
    }
    .root-pillars-segment .content-pillar .pillar-item .item-media {
        width: 100%;
        height: auto;
        aspect-ratio: 1.02 / 1;
    }
    .root-pillars-segment .content-pillar .pillar-item:nth-of-type(even) .item-media {
        margin-left: auto;
    }
    .root-pillars-segment .content-pillar .pillar-item .item-details {
        margin: 0;
    }
    .root-pillars-segment .content-pillar .pillar-item:nth-of-type(even) .item-details {
        margin-left: auto;
    }
    
    .staff-list .staff-item {
        width: calc(33% - 21px);
    }
    
    footer .footer-sitemap .footer-credits ul.nav-list {
        flex-wrap: wrap;
        justify-content: initial;
        align-items: center;
    }
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1024px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (width: 1024px) {
    header .main-navigation ul.nav-list li a {
        padding: 16px 12px;
    }
    .main-content {
        padding-left: 20px;
        padding-right: 20px;
    }
    header .header-wrapper {
        padding-right: 10px;
    }
    header .site-logo {
        left: 20px;
    }
    footer {
        padding-left: 20px;
        padding-right: 20px;
    }
    footer .footer-offset-icon {
        left: 245px;
    }
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1023px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1023px) {
    /*------------------ Global - styles | @1023 ------------------*/
    html {
        --site-logo-height: 57px;
    }
    .desktop {
        display: none;
    }
    .tablet {
        display: block;
    }

    .wysiwygs-across.call-to-action .wysiwygs {
        padding: 30px 20px;
    }
    /*------------------ Header - styles | @1023 ------------------*/
    header {
        /*padding: 15px;*/
        background-color: transparent;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 35;
        transition: background-color .3s;
    }
    /*
    body.page-scrolled header {
        background-color: var(--blob-bg-color);
    }
    header.show-mobile-menu {
        background-color: var(--blob-bg-color);
    }
    */
    header .header-panels .panel {
        padding: 22px 30px 35px 30px;
        border-radius: 0 0 35px 35px;
    }
    header .header-panels .panel .access-options {
        column-gap: 25px;
    }
    header .header-panels .notice-hour .branch-item .change-week {
        opacity: .25;
        max-width: 300px;
        
    }
    header .header-panels .notice-hour .branch-item .change-week * {
        flex: unset;
    }
    header .header-wrapper {
        /*max-height: 68px;*/
        padding: 12px 30px;
        background-color: var(--body-bg-color, #FCFCFC);
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    header.show-mobile-menu .header-wrapper {
        max-height: initial;
        /*overflow-y: scroll;*/
    }
    header .header-wrapper:before, header .header-wrapper:after {
        content: "";
        width: 100%;
        opacity: 0;
        display: block;
        position: absolute;
        left: 0;
    }
    header .header-wrapper:before {
        height: 25px;
        background-color: var(--body-bg-color, #FCFCFC);
        transform: none;
        top: calc(100% - 25px);
        z-index: 10;
        transition: height .2s, opacity .2s;
    }
    body.page-scrolled header .header-wrapper:before {
        opacity: 1;
        transition: height .3s, opacity .3s;
    }
    body header.show-mobile-menu .header-wrapper:before {
        height: 100vh;
        opacity: 1;
        transition: height .3s, opacity .3s;
    }
    header .header-wrapper:after {
        height: 10px;
        box-shadow: 0 0 5px rgba(0,0,0,0.25);
        top: calc(100% - 10px);
        z-index: 5;
        transition: opacity .2s;
    }
    body.page-scrolled header .header-wrapper:after {
        opacity: 1;
        transition: opacity .2s .2s;
    }
    body header.show-mobile-menu .header-wrapper:after {
        opacity: 0;
        transition: opacity .2s;
    }
    header .site-logo {
        position: relative;
        left: auto;
        z-index: 15;
    }
    /*header .site-logo img {*/
    /*    width: auto;*/
    /*}*/
    header .site-navigations {
        width: calc(100% + 30px);
        height: calc(100vh - 77px);
        max-height: calc(100vh - 60px);
        padding: 0 0 30px 0;
        background-color: var(--blob-bg-color);
        opacity: 0;
        align-items: flex-start;
        position: absolute;
        top: 100%;
        left: -15px;
        z-index: 15;
        overflow-x: hidden;
        overflow-y: scroll;
        transform: translateY(-15px);
        pointer-events: none;
        transition: opacity .3s, transform .3s;
    }
    body.resizing header .site-navigations {
        transition: none;
    }
    header.show-mobile-menu .site-navigations {
        opacity: 1;
        transform: translateY(0);
        pointer-events: all;
        transition: opacity .3s, transform .3s;
    }
    header ul.nav-list li {}
    /*header ul.nav-list li a.list-toggle {*/
    /*    width: 25px;*/
    /*    height: 23px;*/
    /*    display: flex;*/
    /*    align-items: center;*/
    /*    justify-content: center;*/
    /*}*/
    header ul.nav-list li .list-dropdown:before {
        content: initial;
    }
    header ul.nav-list li .list-dropdown ul li {
        opacity: 1;
    }
    header .header-panels .panel .access-options .access-section {
        flex-direction: column;
        row-gap: 5px;
    }
    header .header-panels .panel .access-options .access-section .option {
        margin: 0;
    }
    header .header-panels .panel .access-options .access-section button.option {
        display: none;
    }
    /*--------- Header > Utility Navigation - styles | @1023 ---------*/
    header .utility-navigation {
        padding: 0 15px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        order: 3;
    }
    header .utility-navigation ul.panel-options {
        display: none;
        column-gap: 15px;
    }
    header .utility-navigation ul.panel-options li {
        padding: 0;
    }
    header .utility-navigation ul.panel-options li:before {
        top: -25px;
    }
    header .utility-navigation ul.panel-options li.mobile-menu:before {
        display: none;
    }
    header .utility-navigation ul.nav-list {
        width: 100%;
        padding: 0 25px;
        flex-direction: column;
        column-gap: initial;
    }
    header .utility-navigation ul.nav-list li {
        width: 100%;
        padding: 0;
        flex-wrap: wrap;
        align-items: initial;
        justify-content: space-between;
    }
    header .utility-navigation ul.nav-list li a {
        padding: 10px 15px;
    }
    header .utility-navigation ul.nav-list li .list-dropdown ul li a {
        padding: 5px 10px;
    }
    header .utility-navigation ul.nav-list li.dropdown-included:after {
        display: none;
    }
    header .utility-navigation ul.nav-list li.dropdown-included .link-backdrop {
        display: none;
    }
    header .utility-navigation ul.nav-list li a {
        padding: 5px 15px;
    }
    header .utility-navigation ul.nav-list li a:before {
        display: none;
    }
    header .utility-navigation ul.nav-list li a.list-toggle {
        width: auto;
        height: auto;
        padding: 0 15px;
        display: flex;
        position: relative;
        top: auto;
        right: auto;
        pointer-events: all;
    }
    header .utility-navigation ul.nav-list li a.list-toggle svg {
        transition: transform .3s;
    }
    header .utility-navigation ul.nav-list li.show-dropdown a.list-toggle svg {
        transform: rotate(180deg);
    }
    header .utility-navigation ul.nav-list li .list-dropdown, header .utility-navigation ul.nav-list li:hover .list-dropdown, header .utility-navigation ul.nav-list li:focus-within .list-dropdown {
        width: calc(100% - 30px);
        margin-top: 0;
        padding: 15px 0;
        opacity: 0;
        border: none;
        /*border-left: 5px solid var(--theme-primary-color-3);*/
        box-shadow: none;
        position: absolute;
        top: -9999px;
        left: auto;
        transform: none;
        transition: none;
        pointer-events: none;
    }
    header .utility-navigation ul.nav-list li.show-dropdown .list-dropdown {
        margin: 10px auto 12px;
        opacity: 1;
        position: relative;
        top: auto;
        transition: margin .3s, opacity .3s;
        pointer-events: all;
    }
    header .utility-navigation ul.nav-list li .list-dropdown ul li a {
        padding: 3px 15px;
    }
    header .utility-navigation ul.nav-social-list {
        margin: 24px 0 0 0;
        padding-left: 15px;
    }
    header .utility-navigation a.button-like.prompt {
        margin: 28px 0 0 30px;
    }
    /*--------- Header > Main Navigation - styles | @1023 ---------*/
    header .main-navigation {
        width: 100%;
        padding: 0 15px 9px;
        order: 2;
        right: auto;
    }
    header .main-navigation ul.nav-list {
        padding: 0 25px;
        flex-direction: column;
        align-items: flex-start;
    }
    header .main-navigation ul.nav-list li {
        width: 100%;
        margin: 0 0 15px 0;
        padding: 0;
        background-color: transparent;
        /*border-bottom: 0.4px var(--brand-border-color);*/
        flex-wrap: wrap;
        align-items: initial;
        justify-content: space-between;
        order: 1;
        position: relative;
    }
    header .main-navigation ul.nav-list li:before {
        content: "";
        width: 100%;
        height: 45px;
        background-color: var(--theme-secondary-color-1);;
        border-radius: 0 25px 0 25px;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        pointer-events: none;
    }
    header .main-navigation ul.nav-list li:first-of-type {
        border-radius: initial;
    }
    header .main-navigation ul.nav-list li:last-of-type {
        margin: 0;
    }
    header .main-navigation ul.nav-list li.search-option {
        width: 100%;
        padding: 8px 0 25px 0;
        order: 0;
    }
    header .main-navigation ul.nav-list li.search-option:before {
        display: none;
    }
    header .main-navigation ul.nav-list li.search-option a {
        max-width: 54px;
        max-height: 47px;
        position: absolute;
        z-index: 15;
        top: 8px;
        right: 0;
        z-index: 20;
    }
    header .main-navigation ul.nav-list li.search-option a.desktop {
        display: none;
    }
    header .main-navigation ul.nav-list li.search-option a.tablet {
        display: flex;
    }
    header .main-navigation ul.nav-list li.active .link-name:after {
        display: none;
    }
    header .main-navigation ul.nav-list li a {
        padding: 15px 17px;
    }
    header .main-navigation ul.nav-list li .link-backdrop {
        display: none;
    }
    header .main-navigation ul.nav-list li a.list-toggle {
        padding: 0 15px;
        display: flex;
        align-items: center;
    }
    header .main-navigation ul.nav-list li a.list-toggle svg {
        transition: transform .3s;
    }
    header .main-navigation ul.nav-list li.show-dropdown a.list-toggle svg {
        transform: rotate(180deg);
    }
    header .main-navigation ul.nav-list .list-dropdown, header .main-navigation ul.nav-list .list-dropdown:hover .list-dropdown, header .main-navigation ul.nav-list li:focus-within .list-dropdown {
        width: calc(100% - 30px);
        margin-top: 0;
        padding: 20px;
        box-shadow: none;
        opacity: 0;
        flex-direction: column;
        row-gap: 18px;
        position: absolute;
        top: -9999px;
        left: auto;
        pointer-events: none;
        transition: margin 0s, opacity 0s;
    }
    /*header ul.nav-list li.show-dropdown .list-dropdown {*/
    header .main-navigation ul.nav-list li.show-dropdown .list-dropdown {
        margin: 10px auto 14px;
        opacity: 1;
        position: relative;
        top: auto;
        pointer-events: all;
        transform: initial;
        transition: margin .3s, opacity .3s;
    }
    header ul.nav-list li .list-dropdown .dropdown-groups {
        width: 100%;
        padding: 0;
        flex-direction: column;
        row-gap: 15px;
    }
    header ul.nav-list li .list-dropdown .dropdown-groups .group {
        width: 100%;
        /*padding: 15px;*/
        background-color: transparent;
    }
    header .main-navigation ul.nav-list li .list-dropdown ul li {
        opacity: 1;
        transform: initial;
    }
    header .main-navigation ul.nav-list li .list-dropdown ul li:before {
        display: none;
    }
    /*header .main-navigation ul.nav-list li .list-dropdown ul {*/
    /*    width: 100%;*/
    /*    column-gap: initial;*/
    /*    row-gap: 10px;*/
    /*    justify-content: space-between;*/
    /*}*/
    /*header .main-navigation ul.nav-list li .list-dropdown ul li, header .main-navigation ul.nav-list li:hover .list-dropdown ul li, header .main-navigation ul.nav-list li:focus-within .list-dropdown ul li {*/
    /*    opacity: 1;*/
    /*    transform: translateY(0);*/
    /*    transition: opacity .3s .4s, transform .3s .4s;*/
    /*}*/
    /*header .main-navigation ul.nav-list li .list-dropdown ul li {*/
    /*    width: calc(50% - 5px);*/
    /*    padding: 0;*/
    /*}*/
    /*header .main-navigation ul.nav-list li .list-dropdown ul li a {*/
    /*    padding: 10px;*/
    /*}*/
    header .main-navigation ul.nav-list li .list-dropdown .dropdown-media, header .main-navigation ul.nav-list li:hover .list-dropdown .dropdown-media, header .main-navigation ul.nav-list li:focus-within .list-dropdown .dropdown-media {
        display: none;
    }
    /*--------- Header > Top Search - styles | @1023 ---------*/
    .top-search-input {
        width: 100%;
        margin: 0;
        /*padding: 28px 15px 18px;*/
        /*background-color: var(--body-bg-color);*/
        opacity: 0;
        position: relative;
        top: auto;
        left: auto;
        z-index: 15;
        transform: translateY(-5px);
        transition: opacity .2s, transform .2s;
        order: 1;
        pointer-events: none;
    }
    header.show-mobile-menu .top-search-input {
        opacity: 1;
        /*position: relative;*/
        /*left: auto;*/
        transform: translateY(0);
        transition: opacity .3s, transform .3s;
        pointer-events: all;
    }
    .top-search-input .onsite-search {
        padding: 0;
        background-color: transparent;
        border: none;
        opacity: 1;
        transform: none;
    }
    .top-search-input .onsite-search fieldset {
        opacity: 1;
        transform: none;
    }
    .top-search-input .search-toggle {
        display: none;
    }
    .top-search-input .onsite-search .onsite-search-icon {
        display: none;
    }
    .top-search-input .onsite-search .onsite-search-input, .top-search-input .onsite-search .onsite-search-button {
        opacity: 1;
        transform: none;
        pointer-events: none;
    }
    .top-search-input .onsite-search .onsite-search-input-container .onsite-search-input {
        /*padding: 0;*/
        /*padding-bottom: 5px;*/
    }
    header.show-mobile-menu .top-search-input .onsite-search .onsite-search-input, header.show-mobile-menu .top-search-input .onsite-search .onsite-search-button {
        pointer-events: all;
    }
    .top-search-input .onsite-search .onsite-search-input {
        max-width: none;
        background-color: var(--body-bg-color);
    }
    .top-search-input .search-results {
        padding: 10px 0 0 0;
        display: none;
    }
    header.show-mobile-menu .top-search-input.active .search-results, .top-search-input.show-search.active .search-results, .top-search-input.show-search.searching-site .search-results, .top-search-input.show-search.searching-catalog .search-results, .top-search-input.show-search.searching-supplementary .search-results {
        display: none;
    }
    
    header .utility-navigation.mobile-version {
        width: calc(100% - 195px);
        margin: 0;
        padding: 0;
        /*padding-right: 15px;*/
        opacity: 1;
        display: flex;
        align-items: flex-end;
        position: relative;
        /*transform: translateY(-7px);*/
        order: 0;
        pointer-events: all;
        z-index: 105;
    }
    header .utility-navigation.mobile-version ul.panel-options {
        display: flex;
    }
    header .utility-navigation .mobile-menu .menu {
        min-height: 17px;
        position: relative;
    }
    header .utility-navigation .mobile-menu .menu .line {
        transition: opacity .2s, transform .2s;
    }
    header.show-mobile-menu .utility-navigation .mobile-menu .menu .line {
        margin: 0;
        position: absolute;
        top: 9px;
        transition: opacity 0s, transform .3s;
    }
    header.show-mobile-menu .utility-navigation .mobile-menu .menu .line:first-of-type {
        transform: rotate(45deg);
    }
    header.show-mobile-menu .utility-navigation .mobile-menu .menu .line:nth-of-type(2) {
        transform: rotate(-45deg);
    }
    header.show-mobile-menu .utility-navigation .mobile-menu .menu .line:nth-of-type(3) {
        opacity: 0;
    }

    /*----------------- Body - styles | @1023 -----------------*/
    .main-content {
        padding-top: 70px;
        overflow-x: hidden;
    }
    body.alerts-showing .main-content {
        padding-top: 155px;
    }
    .main-content.home {/* tomove: home.css */
        overflow: hidden;
    }
    .main-content .page-banner {
        margin: 0 0 30px 0;
    }
    .main-content .page-content {
        /*padding: 18px 0 0 0;*/
        flex-direction: column;
    }
    
    .page-body {
        width: 100%;
        margin-bottom: 0;
    }
    .page-body.no-right-sidebar {
        width: 100%;
    }
    .extended-sidebar .page-body.no-right-sidebar {
        width: 100%;
        padding-top: 0;
    }
    .page-banner {
        margin-bottom: 75px;
        flex-direction: column;
        row-gap: 25px;
    }
    .page-banner h1 {
        text-align: center;
    }
    .page-banner p {
        text-align: center;
    }
    .page-banner .banner-content {
        max-width: none;
    }

    .branch-favorites-section .information {
        width: calc(100% - 30px);
        height: 100vh;
        padding: 0 35px 0 35px;
        overflow-x: hidden;
        overflow-y: scroll;
    }
    .branch-favorites-section.show-overlay .information {
        padding: 35px 35px 120px 35px;
    }
    .branch-favorites-section .information .close-icon {
        position: fixed;
        right: 60px;
    }
    .branch-favorites-section .information .check-groups {
        flex-direction: column;
    }
    .branch-favorites-section .information .branches {
        width: 100%;
        margin: 0 0 25px 0;
        padding: 0 0 25px 0;
        border: none;
        border-bottom: 1px solid var(--hr-color);
        flex: initial;
    }
    .branch-favorites-section .information .explanation {
        /*width: calc(100% - (30px + 110px));*/
        width: calc(100% - 30px);
        padding: 15px;
        background-color: var(--body-bg-color);
        border: 0.4px solid var(--brand-border-color);
        border-top: none;
        border-radius: 0 0 70px 70px;
        position: fixed;
        bottom: 0;
        left: 15px;
    }
    .branch-favorites-section .information .explanation:before {
        content: "";
        width: 100%;
        height: 25px;
        background-image: var(--personalize-explanation-gradient);
        display: block;
        position: absolute;
        top: -25px;
        left: 0;
        z-index: 1;
        pointer-events: none;
    }
    .branch-favorites-section .information .explanation p, .branch-favorites-section .information .explanation a.button-like {
        position: relative;
        z-index: 5;
    }

    .slider-container {
        width: 100%;
        margin-left: 0;
    }
    .slider-container.booklists {
        margin-left: 0;
    }
    .slider-container .swiper {
        width: 100%;
        margin-left: 0;
    }
    .slider-container.materials .swiper {
        padding: 0 21px;
    }
    .slider-container.booklists .swiper {
        width: calc(100% - 140px);
        margin: 0 auto;
        padding: 0;
    }
    .slider-container.booklists .swiper-button-prev {
        left: 0;
    }
    .slider-container.branches .swiper-button-prev, .slider-container.branches .swiper-button-next {
        height: 50%;
        top: 50%;
        transform: translateY(-50%);
    }

    .full-segment {
        max-width: 100%;
        margin: 0 auto 85px;
        padding: 0;
    }
    
    .events-list .event-item:hover h4, .events-list .event-item:hover .h4-like {
        color: var(--font-header-color);
    }
    .events-list.offset-list .event-item .item-content .options {
        opacity: 1;
        display: block;
    }
    .events-list .event-item .item-clickable-area {
        display: none;
    }

    .upcoming-events .featured-event {
        flex-direction: column;
        align-items: unset;
    }
    .upcoming-events .featured-event .event-content {
        width: 100%;
        max-width: 725px;
        margin: 25px 0 0 0;
    }
    .upcoming-events .featured-event .event-content a.button-like {
        background-color: var(--button-secondary-bg-color);
    }
    .upcoming-events .featured-event .event-content a.button-like:before {
        background-color: var(--button-secondary-bg-color);
    }

    .book-lists.filtered .book-list {
        flex-basis: calc((100% - 40px) / 2);
    }
    
    .eresources-section .eresource-entities {
        align-items: unset;
        justify-content: center;
    }
    .eresources-section .eresource-entities .eresource {
        max-width: 315px;
    }

    .personal-item {
        width: 100%;
        max-width: 311px;
    }
    .personal-item .item-content .booklist-books .book {
        width: 80px;
        height: 137px;
    }

    .blog-posts .post {
        column-gap: 35px;
    }
    .blog-posts .post .post-media {
        order: 0;
    }
    .blog-posts .post:nth-child(2n+1) .post-media {
        order: 0;
    }
    .blog-posts .post .post-content {
        width: 100%;
        order: 1;
    }
    .blog-posts .post:nth-child(2n+1) .post-content {
        order: 1;
    }
    .blog-posts .post.main .post-media {
        width: auto;
        max-width: none;
        /*height: auto;*/
        margin: 0 0 10px 0;
        position: relative;
        top: auto;
        left: auto;
    }
    .blog-posts .post .post-about {
        max-width: none;
        margin: 0 0 15px 0;
        float: none;
    }
    .blog-post .left-sidebar {
        max-width: 250px;
        order: 0;
    }
    .blog-post .body {
        margin-top: 0;
        width: calc(100% - 275px);
        order: 1;
    }
    .blog-post .related-posts .posts-list {
        flex-wrap: wrap;
        gap: initial;
        column-gap: 15px;
        row-gap: 15px;
    }
    .blog-post .related-posts .posts-list .post {
        max-width: 350px;
    }
    
    .viewer-overlay .overlay-content {
        width: 98%;
        height: 95%;
        margin: 1% auto;
    }
    .viewer-overlay .viewer-layout {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .game-main .chess-interface .chess-board-container .chess-board {
        width: min(350px, 100%);
        height: min(350px, 100%);
        max-width: calc(100% - 2rem);
        max-height: calc(100% - 2rem);
    }
    .game-sidebar {
        padding: .5em 1em;
        max-height: 200px;
        order: -1;
        border-right: none;
        border-bottom: 1px solid #dee2e6;
    }
    .game-list {
        flex-direction: row;
        overflow-x: auto;
        /*padding-bottom: 0.25rem;*/
    }
    .game-item {
        min-width: 200px;
        flex-shrink: 0;
        padding: .5em .5em .75em .5em;;
    }
    .game-main .chess-interface .chess-board-container .chess-board .chess-square .chess-piece {
        font-size:33px;
    }

    .lineage-container .lineage-group {
        flex-direction: column;
        row-gap: 25px;
    }
    .lineage-container .lineage-group .group-media.default {
        height: 250px;
    }
    .lineage-container .lineage-group .group-items {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        column-gap: 15px;
        align-items: flex-start;
    }
    .lineage-container .lineage-group .group-items .item {
        max-width: 316px;
        margin: 0 0 15px 0;
    }
    
    .return-to-top-segment {
        left: 35px;
        bottom: 20px;
    }
    
    .page-body.enable-pesudo-right-sidebar {
        margin: 0 auto;
        padding: 0;
    }
    
    .anchor-navigation {
        position: fixed;
        top: auto;
        bottom: 20px;
        right: 35px;
        z-index: 15;
    }
    .anchor-navigation a.button-like.list-toggle {
        /*max-width: none;*/
    }
    .anchor-navigation ul {
        /*max-width: none;*/
    }
    .anchor-navigation.default-anchor-nav-show-state ul {
        max-height: 0;
        padding: 0 20px;
        opacity: 0;
        transition: max-height .2s, padding .2s, opacity .2s;
        pointer-events: none;
    }
    .anchor-navigation.show-anchor-nav ul, .anchor-navigation ul:focus-within {
        max-height: 500px;
        padding: 17px 20px 22px;
        opacity: 1;
        transition: max-height .3s, padding .3s, opacity .3s;
        pointer-events: all;
    }
    .anchor-navigation a.button-like.return-to-top-button {
        max-width: none;
        display: flex;
    }

    .bucket {
        flex-direction: column;
        row-gap: 15px;
    }
    .bucket .bucket-media {
        max-width: 100%;
        margin: 0;
    }
    .bucket.has-image .bucket-content {
        width: 100%;
    }
    .bucket-segment.upcoming-event .bucket-media {
        width: 100%;
    }
    
    /* tomove */
    .main-content.home .bucket.action {
        width: calc(100% - 30px);
        margin: 30px 0 0 15px;
        padding: 0;
    }
    .main-content.home .bucket.action .bucket-content {
        max-width: 700px;
        margin: 0;
    }

    .secondary.staff .page-content .body {
        display: flex;
        flex-direction: column;
    }
    .main-content.staff .staff-segment {
        width: calc(100% - 5px);
        padding-bottom: 50px;
    }
    .main-content.staff .staff-questions {
        position: relative;
        top: unset;
        left: unset;
        width: calc(100% - 5px);
        flex-direction: column;
        align-items: center;
        gap: 80px;
        margin-top: 100px;
        /*margin-bottom: -350px;*/
        order: 2;
    }
    .main-content.staff .staff-questions .question {
        height: unset;
        transform: translate(0,0);
    }
    .main-content.staff .staff-fav-books {
        position: relative;
        height: 330px;
        width: auto;
        top: unset;
        right: unset;
        margin: auto;
        order: 1;
    }

    /* - blog posts page - */
    .blog-posts .post .post-media {
        width: 100%;
    }
    /* individual blog post */
    .blog-post .blog-posts .post.main .post-media {
        aspect-ratio: 3/2;
        height: auto;
    }

    /* recommended-reads page */
    .blog-posts.recommended-reads .post .post-media {
        width: 100%;
    }
    .blog-posts.recommended-reads .post .post-media.default {
        width: 50%;
    }
    .blog-posts.recommended-reads .post .post-media .media {
        background-position: left center;
    }
    .blog-posts.recommended-reads .post .post-content {
        width: 100%;
    }
    
    /*----------------- Left Sidebar - styles | @1023 -----------------*/
    .left-sidebar {
        margin-top: 25px;
        order: 0;
        display: none;
    }
    
    /*----------------- Right Sidebar - styles | @1023 -----------------*/
    .right-sidebar {
        margin-top: 50px;
        max-width: initial;
        display: flex;
        column-gap: 15px;
    }
    .right-sidebar .bucket-segment {
        max-width: 235px;
        margin: auto;
    }
    .right-sidebar .bucket-segment:last-of-type {
        margin: auto;
    }

    /* @1023 footer styles */
    footer {
        background-color: var(--body-bg-color, #FCFCFC);
        padding: 0;
    }
    footer .footer-offset-icon {
        width: 140px;
    }

    footer .footer-hours {
        padding: 35px 30px 12px 30px;
    }
    footer .footer-info {
        max-width: none;
        margin-top: -30px;
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        position: relative;
        top: auto;
        left: auto;
    }
    footer .footer-nav ul.footer-right-side {
        margin: 0;
    }
} /* end 1023px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @950px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 950px) {
    header .header-wrapper {
        padding: 12px 15px;
    }
    .main-content {
        padding: 70px 15px 75px 15px;
    }
    body.alerts-showing .main-content {
        padding-top: 155px;
    }
    
    .bucket-segment, .bucket-segment.upcoming-event {
        /*padding: 15px 0;*/
        border-radius: 5px 30px 30px 50px;
        /*flex-direction: column;*/
    }
    .bucket-segment .bucket-media {
        width: 100%;
        max-width: 315px;
        /*margin: 0 0 15px 0;*/
    }
    
    .lineage-container .lineage-content .item {
        width: calc(50% - 14px);
    }
    
    /* @950 footer styles */
    footer .footer-sitemap .info-list, footer .footer-sitemap nav ul.nav-list {
        grid-template-columns: repeat(2, 1fr);
    }
    footer .footer-sitemap .info-list .info:last-child {
        grid-column: unset;
    }
    footer .footer-sitemap nav ul.nav-list li {
        /*width: calc((100% / 2) - 36px);*/
    }
}

@media only screen and (max-width: 750px) {
    /*------------------ Base - styles | @750 ------------------*/
    html {
        /*// header variables //*/
        /*
        --font-header-1: normal 400 26px/30px "Inter Tight", sans-serif;
        --font-header-2: normal 400 22px/27px "Inter Tight", sans-serif;
        --font-header-3: normal 400 18px/23px "Inter Tight", sans-serif;
        --font-header-4: normal 400 16px/21px "Inter Tight", sans-serif;
        --font-header-5: normal 400 14px/19px "Inter Tight", sans-serif;
        */
        /*// header > assets variables //*/
        /*--font-panels-subheader: normal 400 14px/16px "Inter Tight", sans-serif;*/
        /*--font-panels-access-option: normal 400 14px/16px "Inter Tight", sans-serif;*/
        /*--font-main-navigation: normal 700 14px/15px "Inter Tight", sans-serif;*/
        /*--font-main-navigation-dropdown-list: normal 400 15px/15px "Inter Tight", sans-serif;*/
        /*--font-utility-navigation: normal 300 13px/15px "Inter Tight", sans-serif;*/
        /*--font-utility-navigation-dropdown: normal 300 14px/15px "Inter Tight", sans-serif;*/
        /*--font-top-search-input: normal 300 18px/20px "Inter Tight", sans-serif;*/
        /*--font-subheader: normal 300 14px/16px "Inter Tight", sans-serif;*/
        /*// font body variables //*/
        --font-body: normal 300 16px/22px "Inter Tight", sans-serif;
        --font-body-intro: normal 300 18px/22px "Inter Tight", sans-serif;
        --font-ordered-list-marker: normal 600 16px/22px "Inter Tight", sans-serif;
        /*--font-select: normal 400 14px/22px "Inter Tight", sans-serif;*/
        /*// button variables //*/
        --font-button: normal 400 14px/16px "Inter Tight", sans-serif;
        --font-prompt-button: normal 400 13px/16px "Inter Tight", sans-serif;
        /*// wedge variables //*/
        --wedge-margin: 33px 0;
        /*// overflow segment //*/
        --font-overflow-segment-perk-header: normal 400 25px/35px "Inter Tight", sans-serif;
        --font-overflow-segment-benefit-body: normal 400 15px/17px "Inter Tight", sans-serif;
        --font-overflow-segment-donation-heading: normal 400 28px/30px "Inter Tight", sans-serif;
        --font-overflow-segment-donation-details: normal 400 15px/18px "Inter Tight", sans-serif;
        /*// full segment //*/
        --font-full-segment-filter-item: normal 400 14px/16px "Inter Tight", sans-serif;
        --font-full-segment-author: normal 400 13px/14px "Inter Tight", sans-serif;
        --font-event-list-month: normal 400 14px/16px "Inter Tight", sans-serif;
        --font-event-list-day: normal 400 20px/20px "Inter Tight", sans-serif;
        --font-event-list-details: normal 400 16px/18px "Inter Tight", sans-serif;
        --font-materials-header: normal 600 14px/15px "Inter Tight", sans-serif;
        --font-materials-favorite: normal 400 10px/12px "Inter Tight", sans-serif;
        --font-staff-item-info: normal 300 14px/16px "Inter Tight", sans-serif;
        --font-staff-discussion-question: normal 600 20px/26px "Inter Tight", sans-serif;
        --font-book-item-author: normal 300 14px/18px "Inter Tight", sans-serif;
        --font-form-label: 600 16px/22px "Inter Tight", sans-serif;
        /*--font-acc-container: 600 16px/22px 'Tahoma', sans-serif;*/
        /*--font-pullquote: 400 15px / 22px 'Palatino';*/
        /*--font-pullquote-author: 500 16px/20px 'Tahoma';*/
        /*--font-pullquote-author-title: 400 15px/20px 'DM Sans';*/
        /*// left sidebar variables //*/
        --font-return-to-link: normal 400 14px/18px "Inter Tight", sans-serif;
        --font-context-navigation-heading: normal 600 16px/17px "Inter Tight", sans-serif;
        --font-context-navigation-list-item: normal 500 14px/15px "Inter Tight", sans-serif;
    }
    
    .desktop, .tablet {
        display: none;
    }
    .mobile {
        display: block;
    }
    
    .pullquote {
        padding: 65px 24px 30px 34px;
    }
    .pullquote:before {
        top: 30px;
        left: 34px;
    }
    
    /*------------------ Body - styles | @750 ------------------*/
    .page-body .full-bucket-segment {
        /*width: calc(100% - 30px);*/
        width: 100%;
        margin: 75px auto 0;
    }
    
    /* "banner" variant variables/styles - for `overflow segment` section */
    .overflow-segment.banner {
        /* override base variables */
        --font-header-1: normal 400 26px/30px "Inter Tight", sans-serif;
    }
    
    .branch-information-section .information .event-info .info-top {
        margin: 0 0 6px 0;
    }
    .branch-information-section .information .info-top a.personalize-button {
        margin: 0 11px;
    }
    .branch-information-section .information .event-info .info-top a.button-like {
        margin: 0;
    }
    
    .staff-list {
        column-gap: initial;
        justify-content: space-between;
    }
    .staff-list .staff-item {
        width: calc(50% - 10px);
    }
    
    .blog-posts .post {
        max-width: 400px;
        margin: 0 auto 45px auto;
        flex-direction: column;
        row-gap: initial;
    }
    .blog-posts .post:last-of-type {
        margin-bottom: 0;
    }
    .blog-posts .post .post-media,
    .blog-posts .post:nth-child(2n) .post-media {
        margin: 0 0 15px 0;
        order: 0;
    }
    .blog-posts .post .post-content,
    .blog-posts .post:nth-child(2n) .post-content {
        order: 1;
    }
    
    .events-list {
        flex-direction: column;
        row-gap: 25px;
    }
    .events-list .event-item {
        width: 100%;
        column-gap: 14px;
    }
    .events-list.offset-list .event-item:first-of-type {
        margin-top: 0;
    }

    .authors-list {
        column-gap: 30px;
    }
    .authors-list .author-item {
        width: calc((100% - 30px) / 2);
    }

    .eresources-section .letters-list li {
        width: calc((100% - 130px) / 13);
    }

    .book-lists .featured-filter {
        flex-direction: column;
        align-items: flex-start;
    }

    .wysiwygs-across .wysiwygs.column-4-across,
    .wysiwygs-across .wysiwygs.column-5-across,
    .wysiwygs-across .wysiwygs.column-6-across,
    .wysiwygs-across .wysiwygs.column-7-across,
    .wysiwygs-across .wysiwygs.column-8-across,
    .wysiwygs-across .wysiwygs.column-9-across,
    .wysiwygs-across .wysiwygs.column-10-across {
        grid-template-columns: repeat(3, 1fr);
    }

    .gallery-overlay.open {
        display: block;
    }
    .gallery-overlay-bg {
        height: calc(100vh - 150px);
    }
    .gallery-overlay figure {
        margin: 0;
        width: calc(100vw - 100px);
        height: calc(100vh - 150px);
        background-color: var(--select-bg-color);
        border-left: 10px solid var(--theme-primary-color-2);
        display: flex;
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 100;
        transform: translate(-50%, -50%);
        padding: 50px;
    }
    .gallery-overlay .close-button {
        position: absolute;
        top: 95px;
        right: 80px;
    }
    
    .game-main .chess-interface .chess-board-container {
        width: 100%;
    }
    .game-main .chess-interface .game-controls {
        width: 100%;
    }
    .game-main .chess-interface .game-controls .move-list-container {
        width: 100%;
    }
    
    .books-list .book-item {
        width: calc(33% - 20px);
    }
    
    /* @750 footer styles */
    footer .footer-offset-icon {
        display: none;
    }
    footer .footer-sitemap {
        padding: 50px 20px;
        border-radius: initial;
    }
    footer .footer-sitemap .info-list, footer .footer-sitemap nav ul.nav-list {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media only screen and (max-width: 750px) {
    .img_right_20, .img_right_25, .img_right_50, .img_right_native, .img_left_20, .img_left_25, .img_left_50, .img_left_native, .img_full_styled {
        float: none;
        width: auto;
        max-width: 100%;
        margin: 10px 0;
    }
    .img_native_block {
        max-width: 100%;
        margin: 0;
    }
    img {
        max-width: 100%;
    }

    header .header-panels .close-icon {
        right: 15px;
    }
    header .header-panels .panel .alert-messages .swiper-slide {
        padding: 0 30px;
    }
    header .header-panels .panel .access-options {
        flex-direction: column;
        row-gap: 15px;
    }
    header .header-panels .panel .access-options .access-section {
        flex-direction: row;
        column-gap: 15px;
    }
    header .header-panels .panel .access-options .access-section .h3-like {
        margin: 0;
    }
    header .header-panels .panel .access-options .access-section .option .icon {
        display: none;
    }
    header .header-panels .panel .access-options .access-section .option p {
        display: none;
    }
    header .header-panels .panel .access-options .access-section .option.mobile {
        color: var(--font-secondary-button-color);
        display: inline-block;
    }

    .page-content {
        flex-direction: column;
        /*row-gap: 50px;*/
    }
    .left-sidebar {
        /*margin-top: 50px;*/
        order: 1;
    }
    .left-sidebar .context-navigation {
        margin-top: 50px;
    }
    .return-to-top-segment, .return-to-top-segment.clip-to-bottom {
        position: relative;
        bottom: -80px;
    }
    .return-to-top-segment a.button-like.return-to-top-button {
        opacity: 1;
        pointer-events: all;
    }
    .body {
        width: 100%;
        order: 0;
    }
    
    .overflow-segment.banner .media-banner {
        height: 175px;
    }
    
    .booklist-books .body {
        order: 2;
        width: 100%;
        margin-top: 25px;
    }
    .booklist .books-list .book {
        width: calc((100% - 75px) / 4);
    }
    .blog-tag .body {
        width: 100%;
    }
    .page-content .body:has( .discover-filters.expanded) {
        z-index: 20;
    }


    /*.page-banner .banner-media {*/
    /*    width: 95vw;*/
    /*    height: 95vw;*/
    /*    min-width: initial;*/
    /*    min-height: initial;*/
    /*}*/
    table {
        /*width: 100vw !important;*/
        max-width: unset;
        /*margin: 30px 0 40px -35px;*/
        /*padding: 0 35px;*/
        overflow-x: scroll;
    }

    .full-segment {
        max-width: none;
        margin: 0 auto 91px;
    }
    .full-segment .segment-heading-row {
        row-gap: 14px;
    }
    /* @750 pillar-variant edits */
    .full-segment.pillar-variant .segment-heading-row {
        align-items: center;
        justify-content: center;
    }
    .full-segment.pillar-variant .segment-heading-row .h2-like {
        width: 100%;
        margin: 0 0 5px 0;
        text-align: center;
    }
    .full-segment.pillar-variant .segment-heading-row a.button-like {
        margin: 10px auto 0 auto;
    }
    
    .eresources-section .eresource-entities .eresource {
        width: calc(50% - 25px);
        padding: 15px;
    }

    .upcoming-events .featured-event .event-media.default {
        min-height: 300px;
    }
    .upcoming-events .basic-events {
        margin: 30px 0 0 0;
        column-gap: initial;
        row-gap: 15px;
        flex-direction: column;
        align-items: center;
    }
    .upcoming-events .basic-events .event {
        max-width: none;
    }
    .blog-post .body {
        width: 100%;
    }
    .blog-posts .post.main .post-media {
        height: 300px;
    }
    .tertiary.blog-post h1 {
        margin-top: 25px;
    }
    
    .most-recent .book-list:nth-child(n+3) {
        flex-basis: calc((100% - 100px) / 2);
    }
    
    .bucket-segment {
        flex-direction: column;
    }
    .bucket-segment .bucket-media {
        max-width: initial;
    }
    .bucket-segment .bucket-content {
        max-width: initial;
        margin: 0;
        padding: 32px 46px;
    }

    .lineage-container {
        column-gap: initial;
        row-gap: 15px;
        justify-content: space-between;
    }
    .lineage-container .lineage-item {
        width: calc(50% - 7px);
    }

    /* - individual staff - */
    .main-content.staff .page-content {
        padding-bottom: 200px;
    }
    .main-content.staff .staff-questions {
        margin-bottom: unset;
    }
    
    .alternating-image-plus-text-block,
    .alternating-image-plus-text-block.right-alignment {
        max-width: 315px;
        margin: 0 auto;
        margin-bottom: 30px;
        flex-direction: column;
    }
    .alternating-image-plus-text-block div {
        width: 100%;
    }
    .alternating-image-plus-text-block > img {
        width: 100%;
        max-width: none;
    }

    /* @750 - footer */
    footer .footer-wrapper {
        flex-direction: column;
    }
    footer .footer-details {
        max-width: none;
        padding: 60px 0;
        border-radius: 100px 100px 0 0;
        align-items: center;
    }
    footer .footer-details .site-logo {
        width: auto;
        display: inline-block;
    }
    footer .footer-details .site-logo img {
        max-width: 257px;
    }
    footer .footer-details nav {
        width: 100%;
        max-width: 257px;
    }
    footer .footer-details .nav-list {
        /*text-align: center;*/
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 3px 18px;
    }
    footer .footer-sitemap .info-list .info:last-child {
        grid-column: span 2;
    }
    footer .footer-sitemap {
        width: 100%;
        margin-top: 0;
    }
}

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @600px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 600px) {
    /*------------------ Global - styles | @600 ------------------*/
    html {
        --site-logo-container-width: 250px;
        --site-logo-height: 30px;
    }
    /*------------------ Header - styles | @600 ------------------*/
    header .header-wrapper {
        /*max-height: 59px;*/
    }
    header .utility-navigation.mobile-version {
        width: calc(100% - 250px);
        padding-right: 8px;
    }
    header .utility-navigation ul.panel-options {
        column-gap: 8px;
    }
    /*header .utility-navigation ul.panel-options li:before {*/
    /*    top: -20px;*/
    /*}*/
    .main-content .page-banner {
        border-radius: 0 36px 0 36px;
    }
    .main-content .page-banner .banner-media {
        aspect-ratio: 2.87 / 1;
    }
    .eresources-section .eresource-entities {
        align-items: unset;
        gap: 10px;
    }
    .eresources-section .eresource-entities .eresource {
        width: calc(50% - 10px);
    }
    
    .engagement-list {
        row-gap: 15px;
    }
    .engagement-list .engagement-item {
        width: 100%;
    }
    
    .page-body .full-bucket-segment {
        padding: 15px;
        flex-direction: column;
        row-gap: 15px;
    }
    .page-body .full-bucket-segment .bucket-content {
        order: 1;
    }
    .page-body .full-bucket-segment.has-media .bucket-content {
        width: 100%;
    }
    .page-body .full-bucket-segment .bucket-media {
        order: 0;
    }
    
    .viewer-layout {
        gap: 0.5rem;
    }
    .viewer-layout .overlay-content {
        width: 100%;
        height: 100%;
        margin: 0;
        border-radius: 0;
    }
    .viewer-overlay .overlay-header {
        padding: 0.5rem 1rem;
    }
    .viewer-overlay .overlay-header h2 {
        height: 20px;
        overflow-x: hidden;
        margin: 0;
        font-size: 1.1rem;
        margin-bottom: 0.25rem;
    }
    .viewer-overlay .overlay-header h3 {
        font-size: 0.8rem;
    }
    .viewer-overlay .close-btn {
        font-size: 1.5rem;
        width: 28px;
        height: 18px;
    }
    .viewer-overlay .close-btn:before {
        content: '';
        height: unset;
    }
    .game-sidebar {
        padding: 0.75rem;
        max-height: 150px;
    }
    .game-item {
        min-width: 180px;
        padding: 0.5rem;
    }
    .game-main {
        padding: 0.5rem;
    }
    .game-main .chess-interface .chess-board-container {
        width: 100%;
    }
    .game-main .chess-interface .chess-board-container .chess-board .chess-square {
        aspect-ratio: 1 / 1;
        font-size: min(1.8rem, 3.5vw);
    }
    .game-main .chess-interface {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
    .game-main .chess-interface .chess-board-container {
        order: 1;
        align-self: center;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1rem;
        overflow: hidden;
        padding: 0.5rem;
        box-sizing: border-box;
    }
    .game-main .chess-interface .game-controls {
        order: 2;
    }
    .game-main .chess-interface .chess-board-container .chess-board {
        width: min(90vw - 2rem, 400px);
        height: min(90vw - 2rem, 400px);
        max-width: calc(100vw - 4rem);
        max-height: calc(100vw - 4rem);
        margin: 0 auto;
    }
    .game-main .chess-interface .chess-board-container .chess-board .chess-square {
        font-size: 1.8rem;
    }
    .game-main .chess-interface .chess-board-container .move-navigation {
        flex-wrap: wrap;
        gap: 0.25rem;
    }
    .game-main .chess-interface .chess-board-container .chess-board .chess-square .chess-piece {
        font-size: 33px;
    }
    /*
    .game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-number {
        font-weight: bold;
        width: auto;
        flex-shrink: 0;
        margin-right: 0.25rem;
    }
    .game-main .chess-interface .game-controls .move-list-container .move-list .move-pair .move-item {
        cursor: pointer;
        padding: 1px 3px;
        margin-right: 0;
        transition: background-color 0.2s ease;
        font-size: 0.8rem;
        white-space: nowrap;
    }
    */
    .game-main .chess-interface .chess-board-container .chess-board {
        max-width: none;
        max-height: none;
        width: 100%;
        height: 100%;
    }
    
    .perks-list.row-variant {
        flex-direction: column;
        row-gap: 20px;
    }
    .perks-list.row-variant .perk-item {
        width: 100%;
    }

    .authors-list {
        column-gap: 0;
    }
    .authors-list .author-item {
        width: 100%;
        max-width: 300px;
    }
    
    .bucket-segment.upcoming-event {
        flex-direction: column;
    }
    .bucket-segment.upcoming-event .bucket-media {
        max-width: initial;
    }
    
    .left-sidebar {
        max-width: none;
    }
    .left-sidebar .context-navigation {
        max-width: none;
    }
        
    .wysiwygs-across.call-to-action .wysiwygs .wysiwyg {
        flex: initial !important;
    }
    .wysiwygs-across.call-to-action .wysiwygs .divider {
        width: 100%;
        height: 1px;
    }
    .wysiwygs-across .wysiwygs.column-3-across, .wysiwygs-across .wysiwygs.column-4-across, .wysiwygs-across .wysiwygs.column-5-across, .wysiwygs-across .wysiwygs.column-6-across, .wysiwygs-across .wysiwygs.column-7-across, .wysiwygs-across .wysiwygs.column-8-across, .wysiwygs-across .wysiwygs.column-9-across, .wysiwygs-across .wysiwygs.column-10-across {
        grid-template-columns: repeat(2, 1fr);
    }
    

    .personal-item .item-content .booklist-books .book {
        width: calc(33% - 6px);
        height: 31vw;
    }

    .featured-books > div, .book-lists .featured-list {
        flex-direction: column;
    }
    .book-lists.filtered {
        gap: 20px;
    }
    .all-books .original-results .book-list {
        flex-basis: calc((100% - 40px) / 2);
    }
    .books-list {
        column-gap: 20px;
        row-gap: 20px;
    }
    .books-list .book-item {
        max-width: calc((100% - 20px) / 2);
    }
    
    .staff-list {
        justify-content: center;
    }
    .staff-list .staff-item {
        width: 100%;
        max-width: 315px;
    }

    .upcoming-events-embed .day-section {
        flex-direction: column;
        row-gap: 15px;
    }
    .upcoming-events-embed .day-section .section-events {
        width: 100%;
    }

    .lineage-container .lineage-group .group-items .item {
        max-width: none;
    }
    
    .return-to-top-segment {
        max-width: calc(50vw - 37px);
    }
    .return-to-top-segment a.button-like.return-to-top-button {
        max-width: none;
    }
    
    .anchor-navigation {
        max-width: calc(50vw - 37px);
    }
    .anchor-navigation a.button-like.list-toggle {
        max-width: none;
    }
    .anchor-navigation ul {
        max-width: none;
    }
    
    .books-list .book-item {
        width: calc(50% - 20px);
    }
    
    .lineage-container .lineage-content {
        padding: 50px 20px;
    }
    /*
    .lineage-container .lineage-content .item {
        width: 100%;
    }
    */
    
    /* @600 footer styles */
    footer .footer-sitemap .info-list, footer .footer-sitemap nav ul.nav-list {
        grid-template-columns: repeat(2, 1fr);
    }
    footer .footer-sitemap .info-list .info:last-child {
        grid-column: unset;
        padding-top: 0;
    }
    .right-sidebar {
        max-width: 100%;
    }
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @450px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 450px) {
    header .site-logo {
        max-width: 150px;
    }
    header .utility-navigation ul.panel-options li:before {
        top: -21px;
    }
    
    .wysiwygs-across .wysiwygs.column-2-across, .wysiwygs-across .wysiwygs.column-3-across, .wysiwygs-across .wysiwygs.column-4-across, .wysiwygs-across .wysiwygs.column-5-across, .wysiwygs-across .wysiwygs.column-6-across, .wysiwygs-across .wysiwygs.column-7-across, .wysiwygs-across .wysiwygs.column-8-across, .wysiwygs-across .wysiwygs.column-9-across, .wysiwygs-across .wysiwygs.column-10-across {
        grid-template-columns: repeat(1, 1fr);
    }
    .all-books .original-results .book-list {
        flex-basis: 100%;
    }
    .lineage-container .lineage-content {
        border-radius: 0 10px 0 10px;   
    }
    .lineage-container .lineage-content .item {
        /*width: 100%;*/
    }
    
    footer .footer-sitemap .info-list, footer .footer-sitemap nav ul.nav-list {
        /*display: flex;*/
        /*flex-direction: column;*/
        /*align-items: center;*/
        /*text-align: center;*/
    }
    footer h4, footer .h4-like {
        font: var(--font-body-intro);
        font-weight: 500;
    }
    footer .info p, footer .info address {
        font: var(--font-footer-sitemap-tertiary);
    }
    footer nav ul.nav-list a {
        padding: 7px 0;
    }
    /*footer .footer-sitemap .main-navigation .list-dropdown {*/
    /*    display: none;*/
    /*}*/
    /*footer .footer-sitemap .main-navigation.show-nav .list-dropdown {*/
    /*    display: block;*/
    /*}*/
    footer .footer-sitemap nav {
        position: relative;
        max-height: 100px;
        overflow: hidden;
        transition: max-height .3s;
    }
    footer .footer-sitemap nav.main-navigation:before {
        content: '';
        position: absolute;
        width: 100%;
        height: 50px;
        bottom: 0;
        left: 0;
        background: linear-gradient(to bottom, transparent 0%, var(--theme-secondary-color-3) 100%);
        z-index: 1;
    }
    footer .footer-sitemap.show-nav nav {
        max-height: 10000px;
    }
    footer .footer-sitemap.show-nav nav.main-navigation:before {
        background: transparent;
    }
    footer .footer-sitemap.show-nav .show-more, footer .footer-sitemap .show-less {
        display: none;
    }
    footer .footer-sitemap .show-more, footer .footer-sitemap.show-nav .show-less {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        font: var(--font-utility-navigation);
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: .5px;
        margin-top: 10px;
        opacity: .7;
    }
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @350px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 350px) {
    /*------------------ Global - styles | @1023 ------------------*/
    html {
        --site-logo-container-width: 221px;
        --site-logo-height: 26px;
    }
    /*------------------ Header - styles | @350 ------------------*/
    header .header-wrapper {
        max-height: 55px;
    }
    header .utility-navigation.mobile-version {
        width: calc(100% - 221px);
    }
    
    .main-content .page-banner .banner-media {
        aspect-ratio: 1.80 / 1;
    }
}

/* KIDS & TEENS PAGES */
.main-content.kids .page-banner .banner-media, 
.main-content.teens .page-banner .banner-media {
    display: none;
}
.main-content.kids h1, 
.main-content.teens h1 {
    font-weight: 400;
    font-family: 'DynaPuff';
}
.main-content.kids .full-segment, 
.main-content.teens .full-segment {
    position: relative;
    display: block;
    width: 100%;
    margin: 0 0 125px 0;
}
.main-content.kids .full-segment.event, 
.main-content.teens .full-segment.event {
    padding-bottom: 115px;
    margin: 50px 0 0 0;
}
.main-content.kids .full-segment.event:before, .main-content.kids .full-segment.event:after,
.main-content.teens .full-segment.event:before, .main-content.teens .full-segment.event:after {
    content: '';
    position: absolute;
    width: 141px;
    height: 191px;
    bottom: -20px;
    right: 40px;
    background-image: url('/content/_site_images/headphones.svg');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}
.main-content.kids .full-segment.event:before, .main-content.kids .full-segment.event:after {
    /*
    width: 230px;
    height: 190px;
    right: 0px;
    bottom: -20px;
    */
    width: 162px;
    height: 150px;
    right: 30px;
    bottom: -30px;
    /*background-image: url('/content/_site_images/triceratops.png');*/
    /* Jason wants to swap rose and sun images */
    /*background-image: url('/content/background-sun-clouds-color.png');*/
    background-image: url('/content/background-rose-color.png');
}
.main-content.kids .full-segment.event:after, 
.main-content.teens .full-segment.event:after {
    width: calc(100% - 255px);
    height: 100%;
    bottom: unset;
    top: 18px;
    right: unset;
    left: 140px;
    background-image: url('/content/_site_images/teens_dashed_line_1.png');
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}
.main-content.kids .full-segment.event:after {
    background-image: url('/content/_site_images/kids_dashed_line_1.png');
    width: calc(100% - 355px);
}
.main-content.kids .full-segment .wedge, 
.main-content.teens .full-segment .wedge {
    display: none;
}
.main-content.kids .full-segment .segment-heading-row, 
.main-content.teens .full-segment .segment-heading-row {
    align-items: flex-start;
    max-width: unset;
    margin: 0;
}
.main-content.kids .full-segment .segment-heading-row .h2-like, 
.main-content.teens .full-segment .segment-heading-row .h2-like {
    position: relative;
    font: var(--font-header-2);
    font-weight: 400;
    font-family: 'DynaPuff';
    padding-left: 20px;
}
.main-content.kids .full-segment .segment-heading-row .h2-like:before, 
.main-content.teens .full-segment .segment-heading-row .h2-like:before {
    content: '';
    display: block;
    position: absolute;
    width: 15px;
    height: 34px;
    left: 0px;
    bottom: 4px;
    background-image: url('data:image/svg+xml,<svg width="15.254383px" height="34.4px" viewBox="0 0 15.254383 34.4" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="1280" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><path d="M15.2499198,34.396833 L15.2499198,17.1985076 C15.321391,15.1206049 14.5344878,12.2910305 12.8892102,8.70978436 C9.8055419,3.28819041 5.50913849,0.384928954 0,3.55271368e-15 L0,16.285054 C0,21.5390858 1.69530002,25.8928364 5.08590007,29.346306 C8.47650012,32.7997756 11.8645067,34.4832846 15.2499198,34.396833 Z" id="Path-8-Copy" fill="%23FE391F"></path></g></svg>');
}
.main-content.kids .full-segment.event .segment-content-row, 
.main-content.teens .full-segment.event .segment-content-row {
    background: url(/content/_site_images/icon_lighten-repeat.svg) repeat;
    background-color: var(--theme-secondary-color-3);
    border-radius: 0 110px 0 110px;
    padding: 40px 40px 70px 40px;
}
.main-content.kids .full-segment.event .segment-content-row .events-list.offset-list, 
.main-content.teens .full-segment.event .segment-content-row .events-list.offset-list {
    gap: 30px;
}
.main-content.kids .full-segment.event .segment-content-row .events-list.offset-list .event-item, 
.main-content.teens .full-segment.event .segment-content-row .events-list.offset-list .event-item {
    flex: 1;
}
.main-content.kids .full-segment.event .segment-content-row .events-list.offset-list .event-item:first-of-type, 
.main-content.teens .full-segment.event .segment-content-row .events-list.offset-list .event-item:first-of-type {
    margin: 0;
}
.main-content.kids .full-segment.event .segment-content-row .events-list .event-item .item-content, 
.main-content.teens .full-segment.event .segment-content-row .events-list .event-item .item-content {
    width: 100%;
}
.main-content.kids .full-segment.event .segment-content-row .events-list .event-item .item-date, 
.main-content.teens .full-segment.event .segment-content-row .events-list .event-item .item-date {
    display: none;
}
.main-content.kids .full-segment.event .segment-content-row .image, 
.main-content.teens .full-segment.event .segment-content-row .image {
    width: 100%;
    max-width: 200px;
    aspect-ratio: 1;
    height: auto;
    margin-bottom: 20px;
    background-image: url('/content/_site_images/icon_lighten-repeat.svg');
    background-color: var(--theme-primary-color-5);
}
.main-content.kids .full-segment .segment-content-row .h4-like, 
.main-content.teens .full-segment .segment-content-row .h4-like {
    font: var(--font-header-4);
    font-weight: 400;
    font-family: "DynaPuff";
}
.main-content.kids .full-segment.event .events-list .details, 
.main-content.teens .full-segment.event .events-list .details {
    position: relative;
}
.main-content.kids .full-segment.event .events-list .details:before, 
.main-content.teens .full-segment.event .events-list .details:before {
    content: '';
    display: inline-block;
    width: 15px;
    height: 13px;
    margin-right: 3px;
    background-image: url('data:image/svg+xml,<svg width="14.957697px" height="13.1246955px" viewBox="0 0 14.957697 13.1246955" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="1280" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.800000012"><g id="Untitled-1-01" transform="translate(0, 0)" stroke="%23003B46"><rect id="Rectangle" x="0.151906198" y="1.33677454" width="14.8057908" height="11.787921" rx="1.28999996"></rect><line x1="0" y1="4.46604223" x2="14.9374428" y2="4.44578807" id="Path"></line><line x1="3.51409672" y1="2.42037209" x2="3.50396964" y2="0" id="Path" stroke-linecap="round"></line><line x1="11.5651252" y1="2.42037209" x2="11.5549981" y2="0" id="Path" stroke-linecap="round"></line></g></g></svg>');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.main-content.kids .full-segment.event .events-list.offset-list .event-item .item-content .options ,
.main-content.teens .full-segment.event .events-list.offset-list .event-item .item-content .options {
    flex-wrap: wrap;
    gap: 10px;
}
/* Teens page Resources section */
.main-content.kids .full-segment.eresources:before, .main-content.kids .full-segment.eresources:after, 
.main-content.teens .full-segment.eresources:before, .main-content.teens .full-segment.eresources:after {
    content: '';
    display: block;
    position: absolute;
    width: 208px;
    height: 235px;
    left: -238px;
    top: -10px;
    background-image: url('/content/_site_images/paint_tubes.svg');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}
.main-content.kids .full-segment.eresources:before, .main-content.kids .full-segment.eresources:after {
    width: 165px;
    height: 143px;
    left: -200px;
    top: 100px;
    /*background-image: url('/content/_site_images/monkey.png');*/
    background-image: url('/content/background-butterfly-color.png');
}
.main-content.kids .full-segment.eresources:after, 
.main-content.teens .full-segment.eresources:after {
    width: calc(50vw - 10px);
    /*height: 943px;*/
    height: 623px;
    left: -220px;
    top: 250px;
    background-image: url('/content/_site_images/teens_dashed_line_2.png');
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.main-content.kids .full-segment.eresources:after {
    width: calc(50% + 50px);
    height: 600px;
    top: 280px;
    background-image: url('/content/_site_images/kids_dashed_line_2.png');
}
.main-content.kids .full-segment.eresources .eresources-list, 
.main-content.teens .full-segment.eresources .eresources-list {
    display: flex;
    gap: 33px;
}
.main-content.kids .full-segment.eresources .eresources-list .item-media, 
.main-content.teens .full-segment.eresources .eresources-list .item-media {
    border: 1px solid rgba(0,0,0,.4);
}
.main-content.kids .full-segment.eresources .eresources-list .item-media .item-media-image, 
.main-content.teens .full-segment.eresources .eresources-list .item-media .item-media-image {
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    background-size: contain;
    margin: 5px;
}
/* Teens Book Lists */
.main-content.kids .full-segment.book-lists .booklists-list, 
.main-content.teens .full-segment.book-lists .booklists-list {
    display: flex;
    gap: 33px;
}
.main-content.kids .full-segment.book-lists .booklists-list .booklist-item, 
.main-content.teens .full-segment.book-lists .booklists-list .booklist-item {
    flex: 1;
    /*max-width: 50%;*/
}
.main-content.kids .full-segment.book-lists .booklists-list .booklist-item .books, 
.main-content.teens .full-segment.book-lists .booklists-list .booklist-item .books {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 5px;
}
.main-content.kids .full-segment.book-lists .booklists-list .booklist-item .books .book, 
.main-content.teens .full-segment.book-lists .booklists-list .booklist-item .books .book {
    aspect-ratio: 7/11;
}
.main-content.kids .full-segment.book-lists .booklists-list .booklist-item .books .book.placeholder, 
.main-content.teens .full-segment.book-lists .booklists-list .booklist-item .books .book.placeholder {
    background: url('/content/_site_images/icon_lighten-repeat.svg');
    background-color: var(--theme-primary-color-5);
}
/* Teens News Posts */
.main-content.kids .full-segment.news:before, .main-content.kids .full-segment.news:after, 
.main-content.teens .full-segment.news:before, .main-content.teens .full-segment.news:after {
    content: '';
    display: block;
    position: absolute;
    /*width: 208px;*/
    /*height: 237px;*/
    width: 165px;
    height: 188px;
    top: -145px;
    left: calc(50% + 20px);
    transform: translateX(-50%);
    background-image: url('/content/_site_images/shoes.svg');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}
.main-content.kids .full-segment.news:before, .main-content.kids .full-segment.news:after {
    /*
    width: 162px;
    height: 150px;
    left: calc(50% - 25px);
    */
    width: 200px;
    height: 160px;
    top: -120px;
    left: calc(50% - 35px);
    /*background-image: url('/content/_site_images/butterfly.png');*/
    /* Jason wants to swap rose and sun images */
    /*background-image: url('/content/background-rose-color.png');*/
    background-image: url('/content/background-sun-clouds-color.png');
}
.main-content.kids .full-segment.news:after, 
.main-content.teens .full-segment.news:after {
    width: 300px;
    /*height: 801px;*/
    /*max-height: calc(100% + 100px);*/
    height: calc(100% + 100px);
    top: -40px;
    left: calc(50% + 30px);
    transform: unset;
    background-image: url('/content/_site_images/teens_dashed_line_3.png');
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.main-content.kids .full-segment.news:after {
    height: calc(100% + 110px);
    width: calc(50% - 120px);
    top: -40px;
    left: calc(50% + 10px);
    background-image: url('/content/_site_images/kids_dashed_line_3.png');
}
.main-content.kids .full-segment.news .segment-content-row, 
.main-content.teens .full-segment.news .segment-content-row {
    position: relative;
    background: url('/content/_site_images/icon_lighten-repeat.svg');
    background-color: var(--theme-secondary-color-8);
    border-radius: 0 110px 0 110px;
    padding: 40px 40px 70px 40px;
}

.main-content.kids .full-segment.news .segment-content-row.red, 
.main-content.teens .full-segment.news .segment-content-row.red {
    background-color: var(--theme-primary-color-1);
}
.main-content.kids .full-segment.news .segment-content-row.navy, 
.main-content.teens .full-segment.news .segment-content-row.navy {
    background-color: var(--theme-primary-color-2);
}
.main-content.kids .full-segment.news .segment-content-row.blue, 
.main-content.teens .full-segment.news .segment-content-row.blue {
    background-color: var(--theme-primary-color-3);
}
.main-content.kids .full-segment.news .segment-content-row.green, 
.main-content.teens .full-segment.news .segment-content-row.green {
    background-color: var(--theme-primary-color-4);
}
.main-content.kids .full-segment.news .segment-content-row.pink, 
.main-content.teens .full-segment.news .segment-content-row.pink {
    background-color: var(--theme-secondary-color-8);
}

.main-content.kids .full-segment.news .segment-content-row:after, 
.main-content.teens .full-segment.news .segment-content-row:after {
    content: '';
    display: block;
    position: absolute;
    width: 210px;
    height: 141px;
    bottom: -64px;
    left: calc(50% + 190px);
    background-image: url('/content/_site_images/controller.svg');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.main-content.kids .full-segment.news .segment-content-row:after {
    width: 140px;
    height: 130px;
    bottom: -102px;
    /*right: 60px;*/
    left: calc(50% + 250px);
    transform: rotate(45deg);
    /*background-image: url('/content/_site_images/pterosaurs.png');*/
    background-image: url('/content/background-bee-color.png');
}
.main-content.kids .full-segment.news .news-list, 
.main-content.teens .full-segment.news .news-list {
    display: flex;
    gap: 33px;
}
.main-content.kids .full-segment.news .news-list .news-item, 
.main-content.teens .full-segment.news .news-list .news-item {
    flex: 1;
}
.main-content.kids .full-segment.news .news-list .image, 
.main-content.teens .full-segment.news .news-list .image {
    width: 100%;
    max-width: 500px;
    aspect-ratio: 44/25;
    background: url('/content/_site_images/icon_lighten-repeat.svg');
    background-color: var(--theme-primary-color-5);
}
.main-content.kids .full-segment.news .news-list .details, 
.main-content.teens .full-segment.news .news-list .details {
    font: var(--font-event-list-details);
    margin-top: 15px;
}
.main-content.kids .full-segment.news .news-list .details .date, 
.main-content.teens .full-segment.news .news-list .details .date {
    display: block;
    position: relative;
    font: var(--font-event-bucket-body);
    color: var(--font-header-color);
    margin-bottom: 5px;
    opacity: .75;
}
.main-content.kids .full-segment.news .news-list .details .date:before, 
.main-content.teens .full-segment.news .news-list .details .date:before {
    content: '';
    display: inline-block;
    width: 15px;
    height: 13px;
    margin-right: 3px;
    background-image: url('data:image/svg+xml,<svg width="14.957697px" height="13.1246955px" viewBox="0 0 14.957697 13.1246955" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="1280" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.800000012"><g id="Untitled-1-01" transform="translate(0, 0)" stroke="%23003B46"><rect id="Rectangle" x="0.151906198" y="1.33677454" width="14.8057908" height="11.787921" rx="1.28999996"></rect><line x1="0" y1="4.46604223" x2="14.9374428" y2="4.44578807" id="Path"></line><line x1="3.51409672" y1="2.42037209" x2="3.50396964" y2="0" id="Path" stroke-linecap="round"></line><line x1="11.5651252" y1="2.42037209" x2="11.5549981" y2="0" id="Path" stroke-linecap="round"></line></g></g></svg>');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.main-content.kids .full-segment.news .news-list .button-like, 
.main-content.teens .full-segment.news .news-list .button-like {
    margin-top: 8px;
}

/* KIDS & TEENS PAGES DARK MODE */
.dark-mode .main-content.kids .full-segment.event:after, 
.dark-mode .main-content.teens .full-segment.event:after, 
.dark-mode .main-content.kids .full-segment.eresources:after, 
.dark-mode .main-content.teens .full-segment.eresources:after, 
.dark-mode .main-content.kids .full-segment.news:after, 
.dark-mode .main-content.teens .full-segment.news:after {
    filter: contrast(0);
}

.dark-mode .main-content.kids .full-segment.event .segment-content-row, 
.dark-mode .main-content.teens .full-segment.event .segment-content-row, 
.dark-mode .main-content.kids .full-segment.news .segment-content-row, 
.dark-mode .main-content.teens .full-segment.news .segment-content-row, 
.dark-mode .main-content.kids .full-segment.event .segment-content-row .image, 
.dark-mode .main-content.teens .full-segment.event .segment-content-row .image {
    background-image: url('/content/_site_images/icon_darken-repeat.svg');
    background-color: var(--theme-primary-color-4-dark-mode);
}

.dark-mode .main-content.kids .full-segment.event .events-list .details:before, 
.dark-mode .main-content.teens .full-segment.event .events-list .details:before, 
.dark-mode .main-content.kids .full-segment.news .news-list .details .date:before, 
.dark-mode .main-content.teens .full-segment.news .news-list .details .date:before {
    filter: brightness(100);
}

.dark-mode .main-content.kids .full-segment.eresources .eresources-list .item-media, 
.dark-mode .main-content.teens .full-segment.eresources .eresources-list .item-media {
    background-color: #AAAAAA;
}

.dark-mode .main-content.kids .full-segment.event:before, 
.dark-mode .main-content.kids .full-segment.eresources:before, 
.dark-mode .main-content.kids .full-segment.news:before, 
.dark-mode .main-content.kids .full-segment.news .segment-content-row:after {
    opacity: .7;
}

@media only screen and (min-width: 1280px) {
    .main-content.teens .full-segment.eresources:after {
        width: 640px;
    }
}

@media only screen and (max-width: 1200px) {
    .main-content.kids .full-segment.news:before {
        width: 170px;
        height: 140px;
        left: calc(50% - 25px);
    }
}
@media only screen and (max-width: 1140px) {
    /* KIDS & TEENS PAGES */
    /* events */
    .main-content.kids .full-segment.event:before {
        /*width: 175px;*/
        /*height: 143px;*/
        /*bottom: -12px;*/
        right: 10px;
    }
    .main-content.kids .full-segment.event:after {
        width: calc(100% - 330px);
        height: calc(100% - 30px);
    }
    .main-content.teens .full-segment.event:before {
        width: 99px;
        height: 134px;
        bottom: 40px;
    }
    /* resources */
    .main-content.kids .full-segment.eresources:before {
        width: 150px;
        height: 131px;
        left: -190px;
    }
    .main-content.kids .full-segment.eresources:after {
        top: 240px;
        left: -210px;
        width: calc(50% + 100px);
        height: 610px;
    }
    .main-content.teens .full-segment.eresources:before {
        width: 146px;
        height: 165px;
        /*top: -35px;*/
        left: -176px;
    }
    .main-content.teens .full-segment.eresources:after {
        width: calc(50vw - 90px);
        height: 680px;
        left: -150px;
        top: 180px;
    }
    /* news */
    .main-content.kids .full-segment.news:before {
        /*
        from rose and sun swap
        width: 120px;
        height: 110px;
        */
        width: 150px;
        height: 125px;
        top: -110px;
        left: calc(50% - 10px);
    }
    .main-content.kids .full-segment.news .segment-content-row:after {
        width: 125px;
        height: 116px;
        bottom: -93px;
        left: unset;
        right: 30px;
    }
    .main-content.kids .full-segment.news:after {
        /*height: 640px;*/
        height: calc(100% + 100px);
        left: calc(50% + 10px);
        top: -30px;
    }
    .main-content.teens .full-segment.news:before {
        /*width: 146px;*/
        /*height: 166px;*/
        /*top: -140px;*/
    }
    .main-content.teens .full-segment.news:after {
        width: calc(50vw - 180px);
        max-height: calc(100% + 110px);
        top: -60px;
        /*left: calc(50% + 10px);*/
        left: unset;
        right: 0;
    }
    .main-content.teens .full-segment.news .segment-content-row:after {
        width: 147px;
        height: 99px;
        bottom: -34px;
        left: unset;
        right: 20px;
    }
}

@media only screen and (max-width: 1023px) {
    /* KIDS & TEENS PAGES */
    /* events */
    .main-content.kids .full-segment.event:before {
        width: 175px;
        height: 143px;
        bottom: 20px;
    }
    .main-content.kids .full-segment.event:after {
        width: calc(100% - 310px);
        height: calc(100% - 40px);
    }
    .main-content.teens .full-segment.event {
        padding-bottom: 65px;
    }
    .main-content.teens .full-segment.event:before {
        /*width: 71px;*/
        /*height: 96px;*/
        bottom: 0px;
        right: 15px;
    }
    .main-content.teens .full-segment.event:after {
        width: calc(100% - 285px);
    }
    /* resources */
    .main-content.kids .full-segment.eresources:before {
        width: 130px;
        height: 113px;
        left: -20px;
        top: -130px;
    }
    .main-content.kids .full-segment.eresources:after {
        top: -10px;
        left: -60px;
        width: calc(100% - 500px);
        height: 940px;
    }
    .main-content.teens .full-segment.eresources {
        margin-top: 50px;
    }
    .main-content.teens .full-segment.eresources:before {
        width: 109px;
        height: 123px;
        top: -140px;
        left: -30px;
    }
    .main-content.teens .full-segment.eresources:after {
        left: -45px;
        top: 10px;
        width: calc(50vw - 30px);
        /*height: 1220px;*/
        height: 850px;
    }
    /* news */
    .main-content.kids .full-segment.news:before {
        width: 125px;
        height: 117px;
        top: -85px;
    }
    .main-content.kids .full-segment.news:after {
        height: calc(100% + 90px);
        left: calc(50% - 20px);
        width: calc(50% - 140px);
    }
    .main-content.kids .full-segment.news .segment-content-row:after {
        /*width: 140px;*/
        /*height: 130px;*/
        /*bottom: -102px;*/
        right: 100px;
    }
    .main-content.teens .full-segment.news:before {
        width: 151px;
        height: 175px;
        top: -139px;
    }
    .main-content.teens .full-segment.news:after {
        width: calc(50vw - 100px);
        right: 60px;
        /*left: calc(50% - 20px);*/
        top: -50px;
    }
    .main-content.teens .full-segment.news .segment-content-row:after {
        /*width: 105px;*/
        /*height: 71px;*/
        bottom: -34px;
        right: 80px;
    }
}

@media only screen and (max-width: 950px) {
    /* TEEN PAGE */
    /* resources */
    .main-content.kids .full-segment.eresources:before {
        left: 0;
        top: -120px;
        width: 125px;
        height: 109px;
    }
    .main-content.kids .full-segment.eresources:after {
        left: -30px;
        width: calc(50% - 60px);
        height: 910px;
    }
    .main-content.teens .full-segment.eresources:before {
        left: -10px;
    }
    .main-content.teens .full-segment.eresources:after {
        left: -20px;
        top: 0px;
        width: calc(50vw - 40px);
        /*height: 1180px;*/
        height: 840px;
    }
    /* news */
    .main-content.kids .full-segment.news:before {
        top: -95px;
    }
}

@media only screen and (max-width: 850px) {
    .main-content.kids .full-segment.eresources:after {
        width: calc(50% - 70px);
        height: 880px;
    }
    .main-content.teens .full-segment.eresources:after {
        width: calc(50vw - 50px);
    }
    .main-content.kids .full-segment.news:after {
        /*height: 620px;*/
        top: -30px;
        left: calc(50% - 60px);
        width: 390px;
    }
    
    .main-content.kids .full-segment.news:after {
        left: calc(50% - 30px);
        width: calc(50% - 40px);
    }
    .main-content.kids .full-segment.news .segment-content-row:after {
        right: 50px;
    }
}
/*@media only screen and (max-width: 790px) {*/
/*    .main-content.kids .full-segment.eresources:after {*/
/*        height: 960px;*/
/*    }*/
/*}*/
@media only screen and (max-width: 750px) {
    /* KIDS & TEENS PAGE */
    /* events */
    .main-content.teens .full-segment.event:before {
        width: 118px;
        height: 160px;
        bottom: -40px;
    }
    .main-content.kids .full-segment.event:before {
        width: 175px;
        height: 143px;
        bottom: -12px;
        right: 25px;
    }
    .main-content.kids .full-segment.event .event-item .item-content, 
    .main-content.teens .full-segment.event .event-item .item-content {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .main-content.kids .full-segment.event .events-list.offset-list .event-item .item-content .options, 
    .main-content.teens .full-segment.event .events-list.offset-list .event-item .item-content .options {
        justify-content: center;
    }
    /* resources */
    .main-content.teens .full-segment.eresources:before {
        width: 130px;
        height: 147px;
        top: unset;
        bottom: -120px;
        left: 0;
    }
    .main-content.kids .full-segment.eresources:before {
        /*width: 150px;*/
        /*height: 130px;*/
        top: unset;
        bottom: -115px;
    }
    .main-content.kids .full-segment.eresources, 
    .main-content.teens .full-segment.eresources {
        margin-top: 75px;
    }
    .main-content.teens .full-segment.eresources:after {
        left: 0px;
        top: 0px;
        height: 1020px;
    }
    .main-content.kids .full-segment .segment-heading-row, 
    .main-content.teens .full-segment .segment-heading-row {
        align-items: center;
    }
    .main-content.kids .full-segment.eresources .eresources-list, 
    .main-content.teens .full-segment.eresources .eresources-list {
        flex-direction: column;
        align-items: center;
    }
    .main-content.kids .full-segment.eresources .eresource-item, 
    .main-content.teens .full-segment.eresources .eresource-item {
        max-width: 400px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .main-content.kids .full-segment.eresources .eresource-item .item-content, 
    .main-content.teens .full-segment.eresources .eresource-item .item-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .main-content.kids .full-segment.eresources .eresource-item p, 
    .main-content.teens .full-segment.eresources .eresource-item p {
        max-height: unset;
    }
    /* book lists */
    .main-content.kids .full-segment.book-lists .booklists-list, 
    .main-content.teens .full-segment.book-lists .booklists-list {
        flex-direction: column;
        align-items: center;
    }
    .main-content.kids .full-segment.book-lists .booklists-list .booklist-item, 
    .main-content.teens .full-segment.book-lists .booklists-list .booklist-item {
        width: 100%;
        max-width: 400px;
    }
    .main-content.kids .full-segment.book-lists .booklists-list .booklist-item .item-content, 
    .main-content.teens .full-segment.book-lists .booklists-list .booklist-item .item-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .main-content.kids .full-segment.book-lists .booklists-list .booklist-item .item-content .books, 
    .main-content.teens .full-segment.book-lists .booklists-list .booklist-item .item-content .books {
        width: 100%;
    }
    
    /* news */
    .main-content.teens .full-segment.news:before {
        width: 135px;
        height: 157px;
        left: calc(50% + 140px);
        top: -160px;
    }
    .main-content.kids .full-segment.news:before {
        left: unset;
        /*right: -25px;*/
        /*top: -125px;*/
        width: 150px;
        height: 125px;
        right: -50px;
        top: -140px;
    }
    .main-content.teens .full-segment.news:after {
        width: calc(50% + 10px);
        left: unset;
        right: 0;
    }
    .main-content.teens .full-segment.news .segment-content-row:after {
        right: 45px;
    }
    .main-content.kids .full-segment.news .news-list, 
    .main-content.teens .full-segment.news .news-list {
        flex-direction: column;
        align-items: center;
    }
    .main-content.kids .full-segment.news .news-list .news-item, 
    .main-content.teens .full-segment.news .news-list .news-item {
        max-width: 400px;
    }
    .main-content.kids .full-segment.news .news-list .news-item .item-content, 
    .main-content.teens .full-segment.news .news-list .news-item .item-content {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .main-content.kids .full-segment.news .news-list .details, 
    .main-content.teens .full-segment.news .news-list .details {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    /* maybe just hide the dashed lines from here on out? */
    .main-content.kids .full-segment.event:after, .main-content.kids .full-segment.eresources:after, .main-content.kids .full-segment.news:after, 
    .main-content.teens .full-segment.event:after, .main-content.teens .full-segment.eresources:after, .main-content.teens .full-segment.news:after {
        display: none;
    }
}