@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500;1,600&family=Bricolage+Grotesque:wght@300;400;500;600;700&display=swap');

:root {
  --main-favicon: url('/content/_site_images/favicon.icopng');
  --main-logo-img: url('/content/_site_images/site_logo.png');
  --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://rutlandfree.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://rutlandfree.org/"]):after{
		
	}
/*======end site-specific css======*/
/********//*======================================================================
    GLOBAL - styles | desktop
========================================================================*/
/*---------------------------------------------------------------------------------------------------
Global Fonts
font-family: "Bricolage Grotesque", sans-serif; (300,400,500,600,700) | (normal)
font-family: "Barlow", sans-serif; (300,400,500,600) | (normal,italic)
----------------------------------------------------------------------------------------------------*/
* {
    box-sizing: border-box;
}
html {
    /*scroll-behavior: smooth;*/
    /*overflow-x: hidden;*/

    /*// theme variables //*/
    --theme-primary-color-1: #FF016E;
    --theme-primary-color-2: #095F92;
    --theme-primary-color-2-rgb: 9,95,146;
    --theme-primary-color-3: #4C7026;
    --theme-primary-color-3-rgb: 76,112,38;
    --theme-primary-color-4: 145,172,203;
    --theme-secondary-color-1: #DEEDCF;
    --theme-secondary-color-1-rgb: 222,237,207;
    --theme-secondary-color-2: 239,244,226;
    --theme-secondary-color-3: #DFE6EF;
    --theme-secondary-color-4: #E8EDF2;
    --theme-secondary-color-5: #F5F7F9;
    --theme-default-color: #D1D1D1;
    
    --site-logo-container-width: 215px;
    --site-logo-height: 86px;

    /* font shorthand example (convenient for setting font variables)... */
    /* font: ['font-style'] ['font-variant'] ['font-weight'] ['font-size']/['line-height'] ['font-family'] */
    /*// header variables //*/
    --font-header-1: normal 500 35px/40px "Bricolage Grotesque", sans-serif;
    --font-header-2: normal 500 28px/33px "Bricolage Grotesque", sans-serif;
    --font-header-3: normal 500 24px/29px "Bricolage Grotesque", sans-serif;
    --font-header-4: normal 500 20px/25px "Bricolage Grotesque", sans-serif;
    --font-header-5: normal 500 18px/23px "Bricolage Grotesque", sans-serif;
    --font-header-color: #000000;
    /*// header > assets variables //*/
    --font-color-site-navigations: #000000; /* TODO */
    --font-panels-header: normal 500 23px/27px "Bricolage Grotesque", sans-serif;
    --font-panels-subheader: normal 500 15px/18px "Bricolage Grotesque", sans-serif;
    --font-panels-access-option: normal 400 15px/15px "Barlow", sans-serif;
    --panel-list-options-color: var(--font-color-site-navigations); /* TODO */
    --font-main-navigation: normal 400 15px/15px "Bricolage Grotesque", serif;
    --font-main-navigation-dropdown: normal 400 13px/16px "Bricolage Grotesque", sans-serif;
    --font-utility-navigation: normal 300 13px/16px "Barlow", sans-serif;
    --font-utility-navigation-dropdown: normal 300 13px/16px "Barlow", sans-serif;
    --font-top-search-input: normal 400 14px/17px "Bricolage Grotesque", sans-serif;
    --font-subheader: normal 300 14px/16px "Bricolage Grotesque", sans-serif;
    --alert-announcement-color: #EDC531;
    --alert-emergency-color: #EDC531;
    --alert-closing-color: #EDC531;

    /*// font body variables //*/
    --font-body: normal 400 18px/25px "Barlow", sans-serif;
    --font-body-color: #000000;
    --font-body-alt-color: #0D0D0D; /* TODO */
    /*--font-body-intro-color: #4B4B4B;*/
    --font-body-intro: normal 400 18px/25px "Barlow", sans-serif;
    --font-body-attribution: normal 300 15px/20px "Barlow", sans-serif;
    --font-link: var(--font-body);
    --font-link-color: var(--theme-primary-color-2);
    --font-ordered-list-marker: normal 600 18px/25px "Barlow", sans-serif;
    --font-ordered-list-marker-color: var(--theme-primary-color-1);
    --font-select: normal 400 14px/16px "Barlow", sans-serif;
    --font-color-select: #4C4C4C; /* TODO */
    --select-bg-image: url('/content/_theme_images/icon_select-downarrow.svg') no-repeat calc(100% - 7px) center; /* TODO */
    --select-bg-color: #FFFFFF;
    --preload-cover-bg-color: var(--theme-secondary-color-4); /* TODO */
    --font-form-label: normal 500 18px/22px "Bricolage Grotesque", sans-serif;
    --font-acc-container: normal 500 18px/22px 'Bricolage Grotesque', sans-serif;
    --pullquote-color: var(--theme-primary-color-3);
    --font-pullquote: normal 400 22px/29px 'Bricolage Grotesque';
    --font-pullquote-author: normal 400 18px/25px 'Barlow';
    
    /*// button variables //*/
    --font-button: normal 400 13px/16px "Bricolage Grotesque", sans-serif;
    --font-prompt-button: normal 400 13px/16px "Bricolage Grotesque", sans-serif;
    --font-button-color: #FFFFFF;
    --button-bg-color: var(--theme-primary-color-3);
    /*--button-bg-image: url('data:image/svg+xml,<svg width="32.43px" height="41px" viewBox="0 0 32.43 41" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M32.4305628,4.57642251 C30.4332908,1.80454109 27.1773653,0 23.4999679,0 C19.8250038,0 16.570954,1.80215374 14.5733561,4.57092129 C17.1641809,5.55201494 20.7507516,7.56417724 23.4988551,10.5711649 C26.231427,7.72905429 29.2664064,5.75324488 32.4305628,4.57642251 Z" fill="%23FF016E"></path><path d="M17,41 C17,39.766843 17,35.1001763 17,27 C17,21.2498803 19.0469544,16.0386584 22.1821353,12.0955186 C18.1619734,7.73295639 12.4001448,5 6,5 C3.3971744,5 1.3971744,5 0,5 L0,41 L17,41 Z" fill="%23095F92"></path></svg>');*/
    --button-bg-image: url('data:image/svg+xml,<svg width="32.4307786px" height="104.999899px" viewBox="0 0 32.4307786 104.999899" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M23.5,0 C27.1775151,0 30.4335326,1.80464604 32.4307786,4.57666433 C29.0081302,5.88392883 25.9628386,7.95281833 23.5003861,10.5754114 C21.0371087,7.95276219 17.9917395,5.88384026 14.5702988,4.57543816 C16.5664674,1.80464604 19.8224849,0 23.5,0 Z" fill="%23FF016E"></path><path d="M6,4.99989869 C12.4019156,4.99989869 18.1651617,7.73436759 22.1854718,12.0990388 C18.9387919,16.1921826 17,21.3696767 17,27 L17,104.999899 L0,104.999899 L0,4.99989869 L6,4.99989869 Z" fill="%23095F92"></path></svg>');
    --button-hover-bg-color: #00743C; /* TODO */
    --font-secondary-button-color: var(--theme-primary-color-2);
    --button-secondary-bg-color: rgba(182,228,236,0);
    --button-secondary-hover-bg-color: rgba(182,228,236,.38);
    
    --body-bg-color: #FCFCFC;
    --body-barrens-bg-color: var(--theme-primary-color-1); /* TODO */
    --body-barrens-border-color: var(--theme-primary-color-2);
    --body-barrens-border-opacity: 0; /* TODO */

    /*// wedge variables //*/
    /*--wedge-height: 22px;*/
    --wedge-height: 1px; /* TODO */
    --wedge-margin: 0 0 30px 0; /* TODO */
    --wedge-color: var(--body-barrens-border-color); /* TODO */
    
    /*// upcoming events segment //*/
    --font-sub-header: normal 300 16px/20px "Bricolage Grotesque", sans-serif;
    --font-events-time: normal 300 14px/17px "Barlow", sans-serif;
    
    --overflow-segment-media-max-width: 50%; /* TODO */
    --overflow-segment-media-ratio: 1.1 / 1; /* TODO */
    --overflow-segment-gradient-color-1: #A34A3F; /* TODO */
    --overflow-segment-gradient-color-2: #813A31; /* TODO */
    
    /*// full segment // */
    --font-full-segment-filter-item: normal 400 14px/17px "Bricolage Grotesque", sans-serif;
    --font-full-segment-author: normal 400 13px/15px "Bricolage Grotesque", sans-serif;
    --font-event-list-month: normal 400 14px/14px "Barlow", sans-serif;
    --font-event-list-day: normal 600 25px/30px "Bricolage Grotesque", sans-serif;
    --font-event-list-details: normal 400 16px/20px "Barlow", sans-serif;
    --font-materials-header: normal 500 14px/15px "Bricolage Grotesque", sans-serif;
    --font-materials-favorite: normal 400 13px/15px "Bricolage Grotesque", sans-serif;
    --font-materials-favorite-color: #FFFFFF; /* TODO */
    --font-staff-item-info: normal 300 14px/17px "Barlow", sans-serif;
    --font-book-item-author: normal 400 14px/18px "Barlow", sans-serif;
    --segment-filter-color: var(--theme-primary-color-2);

    /*// "discover by" variables //*/
    --discover-by-bg-color: var(--theme-secondary-color-4);

    /*// left sidebar variables //*/
    --font-return-to-link: normal 400 14px/17px "Bricolage Grotesque", sans-serif;
    --font-context-navigation-heading: normal 500 17px/21px "Bricolage Grotesque", sans-serif;
    --font-context-navigation-list-item: normal 400 15px/18px "Bricolage Grotesque", sans-serif;
    
    /* `swiperjs` overrides - https://swiperjs.com/ */
    --swiper-pagination-bottom: 0; /* TODO */
    --swiper-pagination-bullet-size: 10px;
    --swiper-pagination-bullet-horizontal-gap: 0; /* TODO */
    --swiper-pagination-bullet-border-radius: 100%;
    --swiper-pagination-color: rgba(0,0,0,1);
    --swiper-pagination-bullet-inactive-opacity: .5;
    --swiper-pagination-bullet-inactive-color: rgba(0,0,0,0);
    --swiper-pagination-bullet-border-color: #000000;
    
    --brand-border-color: #000; /* TODO */
    --primary-border-color: rgba(var(--theme-primary-color-2-rgb),.35);
    --secondary-border-color: rgba(var(--theme-primary-color-3-rgb),.3);
}

html:has(body.site-loaded) {
    scroll-behavior: smooth;
}
:root{
    /*lightmode */
    --desktop-light-logo:  var( --main-logo-img, "/content/_site_images/site_logo.png");
    --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;
    
    
    --image-placeholder-icon-color: white;
    
    --san-serif-font:  "Barlow";
    --serif-font:  "Bricolage Grotesque";
}

/*======================================================================
    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: */
body.dark-mode {
    color-scheme: dark;
    --main-logo-img: url('/content/_site_images/logo-dark_mode.png');
    
    /*--theme-primary-color-1: #FF6BAB;*/
    --theme-primary-color-2: #BEE5F9;
    --theme-primary-color-2-rgb: 190,229,249;
    /*--theme-primary-color-3:*/ /* TODO */
    /*--theme-primary-color-3-rgb:*/ /* TODO */
    /*--theme-primary-color-4:*/ /* TODO */
    
    --theme-secondary-color-1: #2D3E19;
    --theme-secondary-color-1-rgb: 45,62,25;
    --theme-secondary-color-2: 53,73,36;
    --theme-secondary-color-3: #123E59;
    --theme-primary-color-3-rgb: 73,88,50;
    --theme-secondary-color-4: #24465E;
    --theme-secondary-color-5: #0F354D;
    --font-header-color: #FFFFFF;
    --font-color-site-navigations: #FFFFFF; /* TODO */
    --panel-list-options-color: #FFFFFF; /* TODO */
    --font-body-color: #FFFFFF;
    --font-body-alt-color: #F2F2F2; /* TODO */
    --font-body-intro-color: #999999;
    --font-link-color: #9FD8F9;
    /* --font-ordered-list-marker-color: rgba(139,179,117,.9); */ /* TODO */
    --select-bg-color: #144461;
    --pullquote-color: #77AF3C;
    --font-button-color: #000000;
    --button-bg-color: #77AF3C;
    /*--button-bg-image: url('data:image/svg+xml,<svg width="32.4305628px" height="41px" viewBox="0 0 32.4305628 41" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Rutland" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Group-51"><path d="M32.4305628,4.57642251 C30.4332908,1.80454109 27.1773653,0 23.4999679,0 C19.8250038,0 16.570954,1.80215374 14.5733561,4.57092129 C17.1641809,5.55201494 20.7507516,7.56417724 23.4988551,10.5711649 C26.231427,7.72905429 29.2664064,5.75324488 32.4305628,4.57642251 Z" id="Oval" fill="%23FF1A7D"></path><path d="M17,41 C17,39.766843 17,35.1001763 17,27 C17,21.2498803 19.0469544,16.0386584 22.1821353,12.0955186 C18.1619734,7.73295639 12.4001448,5 6,5 C3.3971744,5 1.3971744,5 0,5 L0,41 L17,41 Z" id="Oval" fill="%2366BEF4"></path></g></g></svg>');*/
    --button-bg-image: url('data:image/svg+xml,<svg width="32.4307786px" height="104.999899px" viewBox="0 0 32.4307786 104.999899" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M23.5,0 C27.1775151,0 30.4335326,1.80464604 32.4307786,4.57666433 C29.0081302,5.88392883 25.9628386,7.95281833 23.5003861,10.5754114 C21.0371087,7.95276219 17.9917395,5.88384026 14.5702988,4.57543816 C16.5664674,1.80464604 19.8224849,0 23.5,0 Z" fill="%23FF1A7D"></path><path d="M6,4.99989869 C12.4019156,4.99989869 18.1651617,7.73436759 22.1854718,12.0990388 C18.9387919,16.1921826 17,21.3696767 17,27 L17,104.999899 L0,104.999899 L0,4.99989869 L6,4.99989869 Z" fill="%2367BEF4"></path></svg>');
    /* --button-hover-bg-color: #486F30; */ /* TODO */
     --font-secondary-button-color: var(--theme-primary-color-2);
    /* --button-secondary-bg-color: #202D1A; */ /* TODO */
    /* --button-secondary-hover-bg-color: #14210F; */ /* TODO */
    --body-bg-color: #0C3046;
    --wedge-color: #FFFFFF;
    /* --overflow-segment-gradient-color-1: #000439; */ /* TODO */
    /* --overflow-segment-gradient-color-2: #090924; */ /* TODO */
     --discover-by-bg-color: var(--theme-secondary-color-4);
    
    /* --body-barrens-bg-color: #3D3D3D; */ /* TODO */
    /* --body-barrens-border-color: #1F1F1F; */ /* TODO */
    
    /* `swiperjs` overrides - https://swiperjs.com/ */
    --swiper-pagination-color: rgba(255,255,255,1);
    --swiper-pagination-bullet-border-color: #FFFFFF;
    
    --primary-border-color: rgb(46,82,102);
    --secondary-border-color: var(--primary-border-color);
    
    --segment-filter-color: #FFFFFF;
    
    --footer-logo: url(/content/_site_images/footer_logo-dark_mode.png);
}
body.dark-mode .home {
    --font-header-color: #F4F4F4; /* TODO */
    --quicklink-color: #B4B4B4; /* TODO */
}
body.dark-mode .home .button.alternate, body.dark-mode .home a.button-like.alternate {
    --button-bg-color: #002B4D; /* TODO */
}
body.dark-mode .overflow-segment.secondary-color-scheme {
    --overflow-segment-gradient-color-1: #2C4C19; /* TODO */
    --overflow-segment-gradient-color-2: #1D360F; /* TODO */
}
body.dark-mode .overflow-segment.tertiary-color-scheme {
    --overflow-segment-gradient-color-1: #7C0000; /* TODO */
    --overflow-segment-gradient-color-2: #570000; /* TODO */
}
body.dark-mode .authors-list {
    --font-header-color: #B1B1B1; /* TODO */
    --font-body-color: #A8A8A8; /* TODO */
}
body.dark-mode .engagement-list {
    --font-header-color: #B1B1B1; /* TODO */
    --font-body-color: #A8A8A8; /* TODO */
}
body.dark-mode .archives-component {
    --font-header-color: #B1B1B1; /* TODO */
    --font-body-color: #A8A8A8; /* TODO */
}
body.dark-mode .overflow-segment {
    --font-header-color: #FFFFFF;
    --font-body-color: #FFFFFF;
}

body.dark-mode header .utility-navigation ul.panel-options li:before {
    opacity: .3;
}
body.dark-mode header .utility-navigation ul.panel-options li.active:before {
    opacity: 1;
}

body.dark-mode .left-sidebar .context-navigation {
    background-color: rgba(var(--theme-secondary-color-1-rgb),.78);
}
body.dark-mode .left-sidebar .context-navigation .nav-heading:before {
    background-color: #495832;
    opacity: 1;
}
body.dark-mode .left-sidebar .context-navigation ul.nav-list li:before {
    opacity: .6;
}

body.dark-mode select:not(.goog-te-combo), body.dark-mode input:not([type="file"]), body.dark-mode input[type="text"], body.dark-mode input[type="email"], body.dark-mode input[type="password"], body.dark-mode textarea {
    background-color: rgba(255,255,255,.14);
}
body.dark-mode select:not(.goog-te-combo) {
    background-image: url('data:image/svg+xml,<svg width="10px" height="6px" viewBox="0 0 10 6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="1 0 0 1 5 6 10 1 9 0 5 4" fill="white"></polygon></svg>');
}

body.dark-mode .acc-container details:not([open]) summary {
    background-color: var(--select-bg-color);
}

body.dark-mode .acc-container details summary:after {
    background-color: #144461;
}
body.dark-mode .acc-container details .details-content {
    border: .5px solid #2E5266;
}

body.dark-mode .top-search-input .onsite-search .onsite-search-input-container .onsite-search-input, body.dark-mode header .main-navigation .top-search-input .onsite-search a.button-like {
    border-color: rgba(0, 0, 0, .5);
}

/*body.dark-mode .content-board .details svg path {*/
/*    fill: #B4B4B4;*/
/*}*/
body.dark-mode footer {
    --theme-secondary-color-2: 36,51,20;
    --wedge-color: #FFFFFF;
}
body.dark-mode footer .footer-sitemap:after {
    background-color: transparent;
}
/*---------------------------------- Accessibility > Bigger Text ----------------------------------*/
body.bigger-text {
    /*// header variables //*/
    --font-header-3: normal 500 26px/31px "Bricolage Grotesque", sans-serif; /* +2 */
    --font-header-4: normal 500 22px/27px "Bricolage Grotesque", sans-serif; /* +2 */
    --font-header-5: normal 500 20px/25px "Bricolage Grotesque", sans-serif; /* +2 */
    /*// header > assets variables //*/
    --font-panels-header: normal 500 25px/29px "Bricolage Grotesque", sans-serif; /* +2 */
    --font-panels-subheader: normal 500 18px/21px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-panels-access-option: normal 400 18px/18px "Barlow", sans-serif; /* +3 */
    --font-main-navigation: normal 400 18px/18px "Bricolage Grotesque", serif; /* +3 */
    --font-main-navigation-dropdown: normal 400 16px/19px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-utility-navigation: normal 300 16px/19px "Barlow", sans-serif; /* +3 */
    --font-utility-navigation-dropdown: normal 300 16px/19px "Barlow", sans-serif; /* +3 */
    --font-top-search-input: normal 400 17px/20px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-subheader: normal 300 17px/19px "Bricolage Grotesque", sans-serif; /* +3 */
    /*// font body variables //*/
    --font-body: normal 400 20px/27px "Barlow", sans-serif; /* +2 */
    --font-body-intro: normal 400 20px/27px "Barlow", sans-serif; /* +2 */
    --font-body-attribution: normal 300 18px/23px "Barlow", sans-serif; /* +3 */
    --font-link: var(--font-body); /* +2 */
    --font-ordered-list-marker: normal 600 20px/27px "Barlow", sans-serif; /* +2 */
    --font-select: normal 400 17px/19px "Barlow", sans-serif; /* +3 */
    --font-form-label: normal 500 20px/24px "Bricolage Grotesque", sans-serif; /* +2 */
    --font-acc-container: normal 500 20px/24px 'Bricolage Grotesque', sans-serif; /* +2 */
    --font-pullquote: normal 400 24px/31px 'Bricolage Grotesque'; /* +2 */
    --font-pullquote-author: normal 400 20px/27px 'Barlow'; /* +2 */
    /*// button variables //*/
    --font-button: normal 400 16px/19px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-prompt-button: normal 400 16px/19px "Bricolage Grotesque", sans-serif; /* +3 */
    /*// upcoming events segment //*/
    --font-sub-header: normal 300 19px/23px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-events-time: normal 300 17px/20px "Barlow", sans-serif; /* +3 */
    /*// full segment // */
    --font-full-segment-filter-item: normal 400 17px/20px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-full-segment-author: normal 400 16px/18px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-event-list-month: normal 400 17px/17px "Barlow", sans-serif; /* +3 */
    --font-event-list-day: normal 600 27px/32px "Bricolage Grotesque", sans-serif; /* +2 */
    --font-event-list-details: normal 400 19px/23px "Barlow", sans-serif; /* +3 */
    --font-materials-header: normal 500 17px/18px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-materials-favorite: normal 400 16px/18px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-staff-item-info: normal 300 17px/20px "Barlow", sans-serif; /* +3 */
    --font-book-item-author: normal 400 17px/21px "Barlow", sans-serif; /* +3 */
    /*// left sidebar variables //*/
    --font-return-to-link: normal 400 17px/20px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-context-navigation-heading: normal 500 20px/24px "Bricolage Grotesque", sans-serif; /* +3 */
    --font-context-navigation-list-item: normal 400 18px/21px "Bricolage Grotesque", sans-serif; /* +3 */
}
body.bigger-text button.primary, 
body.bigger-text a.button-like.primary {
    padding: 9.5px 15px 7.5px 17px;
}
body.bigger-text .campaign .hours-quicklinks .quicklinks .campaign-bucket {
    --font-body: normal 400 16px/23px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .authors-list {
    --font-header-4: normal 500 20px/25px "Bricolage Grotesque", sans-serif; /* +1 */
    --font-body: normal 400 18px/25px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .discover-filters {
    --font-header-5: normal 500 18px/23px "Bricolage Grotesque", sans-serif; /* +2 */
    --font-body: normal 400 16px/16px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .content-pagination > * {
    font: normal 400 18px/25px 'Bricolage Grotesque', sans-serif; /* +2 */
}
body.bigger-text .events-list {
    --font-body: normal 300 18px/22px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .eresources-section .eresource-overlay {
    --font-body: normal 400 18px/25px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .eresources-section .eresource-entities {
    --font-body: normal 400 18px/25px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .staff-segment .staff-items {
    --font-subheader: normal 400 15px/18px "Barlow", sans-serif; /* +3 */
    --font-body: normal 300 17px/20px "Barlow"; /* +3 */
}
body.bigger-text .lineage-container {
    --font-body: normal 400 18px/23px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .bucket {
    --font-subheader: normal 400 15px/18px "Barlow", sans-serif; /* +3 */
}
body.bigger-text .source-container {
    --font-body: normal 300 18px/25px "Barlow", sans-serif; /* +2 */
}
body.bigger-text .eresources-embed {
    --font-body: normal 300 18px/25px "Barlow", sans-serif; /* +2 */
}
body.bigger-text footer {
    /* overwrite `base` variables */    
    --font-header-5: normal 500 20px/24px "Bricolage Grotesque", sans-serif; /* +2 */
    --font-body: normal 300 18px/22px "Barlow", sans-serif; /* +2 */
}
body.bigger-text footer .footer-sitemap {
    /* overwrite `base` variables */    
    --font-body: normal 400 16px/19px "Barlow", sans-serif; /* +3 */
}
body.bigger-text footer .footer-sitemap nav.footer-credits {
    --font-link: normal 400 15px/17px "Barlow", sans-serif; /* +3 */
}

/*---------------------------------- Accessibility > High Contrast ----------------------------------*/
body.high-contrast {
    /*// theme variables //*/
    --theme-primary-color-1: #AD004B;
    --theme-primary-color-2: #094E77;
    --theme-primary-color-2-rgb: 9,78,119;
    --theme-primary-color-3: #415F21;
    --theme-primary-color-3-rgb: 65,95,33;
    --theme-primary-color-4: 191,207,225;
    --theme-secondary-color-3: #ECF0F5;
    --theme-secondary-color-4: #F0F4F8;
    /*// header > assets variables //*/
    --alert-announcement-color: #D4A700;
    --alert-emergency-color: #D4A700;
    --alert-closing-color: #D4A700;
    /*// font body variables //*/
    --font-body-alt-color: #000000;
    --font-body-intro-color: #000000;
    --font-link-color: var(--theme-primary-color-2);
    --font-ordered-list-marker-color: var(--theme-primary-color-1);
    --font-color-select: #000000;
    --select-bg-color: #FFFFFF;
    --preload-cover-bg-color: var(--theme-secondary-color-4);
    --pullquote-color: var(--theme-primary-color-3);
    /*// button variables //*/
    --button-bg-color: var(--theme-primary-color-3);
    --font-secondary-button-color: var(--theme-primary-color-2);
    --button-secondary-bg-color: rgba(215,249,255,0);
    --body-barrens-bg-color: var(--theme-primary-color-1);
    --body-barrens-border-color: var(--theme-primary-color-2);
    /*// wedge variables //*/
    --wedge-color: var(--body-barrens-border-color);
    /*// full segment // */
    --segment-filter-color: var(--theme-primary-color-2);
    /*// "discover by" variables //*/
    --discover-by-bg-color: var(--theme-secondary-color-4);
    --primary-border-color: rgba(var(--theme-primary-color-2-rgb),.35);
    --secondary-border-color: rgba(var(--theme-primary-color-3-rgb),.3);
}
/* generic styles */
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, 
body.high-contrast dt { /* added to query */
    font-weight: 700 !important;
}
body.high-contrast p, 
body.high-contrast a, 
body.high-contrast figcaption, 
body.high-contrast dd, 
body.high-contrast ul li, 
body.high-contrast ol li, 
body.high-contrast div, 
body.high-contrast span, 
body.high-contrast label { /* added to query */
    font-weight: 600 !important;
}
body.high-contrast .slider-container .swiper-button-prev:after, 
body.high-contrast .slider-container .swiper-button-next:after, 
body.high-contrast .blog-posts .post .post-about .tags ul.tag-list li a.tag, 
body.high-contrast .discover-filters .current-filters .expand-filters, 
body.high-contrast .featured-filter label select {
    border-width: 1px;
}
body.high-contrast header .utility-navigation ul.panel-options li a svg, 
body.high-contrast header .utility-navigation ul.panel-options li:before, 
body.high-contrast header .utility-navigation ul.nav-social-list li a, 
body.high-contrast .home .book-item .item-author, 
body.high-contrast .home .eresource-item .item-content p, 
body.high-contrast .blog-posts .post .post-info span svg, 
body.high-contrast .calendar-day-event .event-time, 
body.high-contrast .source-container .blog-source p, 
body.high-contrast .full-segment.page-element .segment-content-row .events-list .event-item .item-content .short-description, 
body.high-contrast footer .footer-details .address p, 
body.high-contrast footer .footer-sitemap nav ul.nav-list li a, 
body.high-contrast footer .footer-sitemap nav ul.nav-list li .list-dropdown ul, 
body.high-contrast footer .footer-sitemap nav ul.nav-list li .list-dropdown ul li a {
    opacity: 1;
}
body.high-contrast .home .full-segment.green-variant .segment-filter li a {
    --theme-primary-color-3: #000000;
}
body.high-contrast .overflow-segment.bare {
    --font-header-color: #000000;
    --font-body-color: #000000;
}
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 {
    fill: 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;
}
body.high-contrast input:not([type="file"]), 
body.high-contrast input[type="text"], 
body.high-contrast input[type="email"], 
body.high-contrast input[type="password"], 
body.high-contrast textarea {
    border: 1px solid #000000;
}
body.high-contrast header ul.nav-list li .list-dropdown ul li {
    padding: 2px 0;
}
body.high-contrast header ul.nav-list li .list-dropdown ul li a {
    padding: 3px 0;
}
/*---------------------------------- 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);
}
/*---------------------------------- Accessibility > Highlight Links ----------------------------------*/
body.highlight-links a, 
body.highlight-links a > *, 
body.highlight-links .discover-filters ul li label, 
body.highlight-links input:not([type="file"]), 
body.highlight-links select, 
body.highlight-links input[type="text"], 
body.highlight-links input[type="email"], 
body.highlight-links input[type="password"], 
body.highlight-links textarea, 
body.highlight-links .acc-container details summary:after {
	background-color: #F0DF00 !important;
	color: #000000 !important;
}
body.highlight-links .acc-container details summary:before {
    background-color: #000000;
}
body.highlight-links {
    --font-link-color: #000000;
    --button-color: #000000;
    --button-bg-color: #F0DF00;
    --button-secondary-bg-color: #F0DF00;
    --button-secondary-hover-bg-color: #FCEC00;
}
body.highlight-links header .main-navigation ul.nav-list > li:not(.search-option) > a {
    text-shadow: -1.5px 2px 0px #F0DF00, 1.5px 2px 0 #F0DF00, 0px 2px 0 #F0DF00;
}
body.highlight-links button.primary:after, 
body.highlight-links a.button-like.primary:after {
    background-color: #000000;
}
body.highlight-links .button-dropdown .toggle-area {
    mix-blend-mode: multiply;
    border-radius: 0 15px 0 0;
}

/*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 20px 0;
    color: var(--font-header-color);
    font: var(--font-header-1);
    --font-link: var(--font-header-1);
}
h2, .h2-like {
    margin: 25px 0 15px 0;
    color: var(--font-header-color);
    font: var(--font-header-2);
    --font-link: var(--font-header-2);
}
h3, .h3-like {
    margin: 20px 0 9px 0;
    color: var(--font-header-color);
    font: var(--font-header-3);
    --font-link: var(--font-header-3);
}
h4, .h4-like {
    margin: 18px 0 8px 0;
    color: var(--font-header-color);
    font: var(--font-header-4);
    --font-link: var(--font-header-4);
}
h5, .h5-like {
    margin: 16px 0 5px 0;
    color: var(--font-header-color);
    font: var(--font-header-5);
    --font-link: var(--font-header-5);
}
hr {
    width: 100%;
    height: 1px;
    margin: 15px 0;
    background-color: var(--wedge-color);
    border: none;
}
input{
    font-family: inherit;  
}
p a.button-like {
    margin-right: 25px;
}
p {
    margin: 15px 0;
    color: var(--font-body-color);
    font: var(--font-body);
}
p.intro {
    margin: 0 0 30px 0;
    font: var(--font-body-intro);
    font-style: italic;
}
p.attribution {
    opacity: 0.9;
    font: var(--font-body-attribution);
}
a {
    color: var(--font-link-color);
    font: var(--font-link);
    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: 10px 0 29px 0;
    color: var(--font-body-color);
    font: var(--font-body);
}
ul li, ol li {
    margin: 0;
    margin-bottom: 5px;
}
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: 20px;
    position: relative;
}
ul li:before {
    content: "";
    width: 10px;
    height: 10px;
    background-color: var(--theme-primary-color-1);
    border-radius: 100%;
    position: absolute;
    top: 8px;
    left: 0;
}
ul li ul {
    margin: 5px 0 0 0;
}
ul li ul li:before {/* correct for 0.5px screens */
    width: 6px;
    height: 6px;
    background-color: transparent;
    border: 2px solid var(--theme-primary-color-1);
}
ul li ul li ul {
    margin: 5px 0 0 0;
}
ul li ul li ul li:before {
    width: 10px;
    height: 10px;
    background-color: var(--theme-primary-color-1);
    border: none;
}
ul.bulletless li, .home ul.bulletless li {
    margin: 0;
    padding: 0;
    opacity: 1;
}
ul.bulletless li:before {
    content: unset;
}
/*/ 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: 5px 0 0 0;
    list-style: lower-alpha;
}
ol li ol li:last-of-type {
    margin: 0;
}
ol li ol li ol {
    margin: 5px 0 0 0;
    list-style: lower-roman;
}
/*// general "button" styles //*/
button, a.button-like {
    padding: 9.5px 15px 8.5px 15px;
    background-color: var(--button-secondary-bg-color);
    border: 1px solid var(--font-secondary-button-color);
    border-radius: 0 17px 0 0;
    color: var(--font-secondary-button-color);
    font: var(--font-button);
    text-decoration: none;
    display: inline-block;
    position: relative;
    transition: background-color .2s;
    cursor: pointer;
}
button[disabled] {
    opacity: 0.4;
    pointer-events: none;
}
button:hover, a.button-like:hover {
    background-color: var(--button-secondary-hover-bg-color);
    transition: background-color .3s;
}
/*/ button "primary" styles /*/
button.primary, a.button-like.primary {
    font-weight: 500;
    border: unset;
    color: var(--font-button-color);
    background-color: var(--button-bg-color);
    border-radius: 22px 0 0 0;
    padding: 11px 15px 9px 17px;
    margin: 6px 0 0 19px;
}
button.primary:before, button.primary:after, a.button-like.primary:before, a.button-like.primary:after {
    content: '';
    position: absolute;
}
button.primary:after, a.button-like.primary:after {
    background-color: var(--font-button-color);
}
button.primary:before, a.button-like.primary:before {
    height: calc(100% + 5px);
    width: 32.5px;
    background-image: var(--button-bg-image);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top left;
    left: -19px;
    bottom: 0;
    z-index: -1;
    transition: background-color .3s;
}
button.primary:hover, a.button-like.primary:hover {
    background-color: color-mix(in lab, var(--button-bg-color) 100%, #000000 25%);
}

/* overwrite buttons spacing for body content */
p a.button-like, p a.button-like.secondary {
    margin-bottom: 10px;
}
p a.button-like.primary {
    margin: 6px 10px 0 20px;
}

img {
    max-width: 100%;
    height: auto;
}
.img_right_25 {
    float: right;
    width: 25%;
    margin: 15px 0 15px 20px;
    clear: right;
}
.img_right_50 {
    float: right;
    width: 50%;
    margin: 15px 0 15px 25px;
    clear: right;
}
.img_right_native {
    float: right;
    max-width: 100%;
    width: auto;
    /*margin: 20px 0 20px 35px;*/
    clear: right;
}
.img_left_25 {
    float: left;
    width: 25%;
    margin: 15px 20px 15px 0;
    clear: left;
}
.img_left_50 {
    float: left;
    width: 50%;
    margin: 15px 25px 15px 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;*/
}

figcaption {
    margin: 0;
    font: var(--font-body-attribution);
    font-weight: 400;
    text-align: center;
}
figcaption p {
    margin: 0;
    font-size: 16px;
    line-height: normal;
}

.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_placeholder-mark.svg') var(--theme-default-color) no-repeat center;*/
    /*/content/_site_images/icon_placeholder-mark-eresources.svg*/
    background-color: var(--theme-secondary-color-3) !important;
    background-image: url('data:image/svg+xml,<svg width="63.0952381px" height="50px" viewBox="0 0 63.0952381 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="%2391ACCB"><path d="M63.0952381,19.8214286 L63.0952381,31.6666667 L56.1904762,31.6666667 C46.1765219,31.6666667 38.0377725,39.6953727 37.8601081,49.6669044 L37.8571429,50 L25.952381,50 C25.952381,33.3328352 39.4637876,19.8214286 56.1309524,19.8214286 L63.0952381,19.8214286 Z M6.96428571,27.797619 C15.5447579,27.797619 23.0180664,32.53795 26.9082489,39.5426495 C26.1448127,41.5322573 25.5720148,43.6156493 25.2109276,45.7707983 C23.0797656,37.6536247 15.6914282,31.6666667 6.9047619,31.6666667 L2.52242671e-13,31.6666667 L2.52242671e-13,27.797619 L6.96428571,27.797619 Z M6.96428571,23.6309524 C16.0807005,23.6309524 24.1404482,28.1550818 29.0208522,35.0806638 C28.2600675,36.4130688 27.5912226,37.8046801 27.0223393,39.2466543 C23.0596035,32.2336647 15.534986,27.5 6.9047619,27.5 L0,27.5 L0,23.6309524 L6.96428571,23.6309524 Z M6.96428571,19.8214286 C16.8323352,19.8214286 25.6155581,24.4661231 31.2470476,31.6886054 C30.4913019,32.6960899 29.7933424,33.7491817 29.1572436,34.8426995 C24.2187565,27.8784014 16.092538,23.3333333 6.9047619,23.3333333 L0,23.3333333 L0,19.8214286 L6.96428571,19.8214286 Z M31.8452381,0 C37.9269452,0 42.8571429,4.9301977 42.8571429,11.0119048 C42.8571429,17.0936118 37.9269452,22.0238095 31.8452381,22.0238095 C25.763531,22.0238095 20.8333333,17.0936118 20.8333333,11.0119048 C20.8333333,4.9301977 25.763531,0 31.8452381,0 Z"></path></g></svg>') !important;
    background-size: 50px !important;
    background-repeat: no-repeat;
    background-position: center !important;
}
.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: .5px;
    background-color: var(--wedge-color);
    display: block;
    position: absolute;
}
.wedge:before {
    top: 0;
    left: 0;
}
.wedge:after {
    top: 0;
    right: 0;
}
.wedge .wedge-center {
    /*width: 1px;*/
    /*height: 100%;*/
    /*background-color: var(--wedge-color);*/
    /*display: block;*/
}

/* Style Guide Assets */
body {
    --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);
    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: 70px 0 50px 0;
    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 {
    display: flex;
    margin-bottom: 10px;
    gap: 15px;
}
form .field-row h2 {
    margin-top: 0;
}
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: 13px;
}
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: 12px 0 10px 0;
    padding: 9px 15px 8px 15px;
    background-color: var(--select-bg-color);
    border: 1px solid #D1D1D1; /* TODO */
    color: var(--font-body-color);
    font: var(--font-select);
    display: block;
}
input[type="date"] {
    padding: 8px 15px 7px 15px;
}
input[type="file" i]::-webkit-file-upload-button {
    background-color: var(--button-secondary-bg-color);
    border: 1px solid var(--font-secondary-button-color);
    padding: 9px 15px 8px 15px;
    border-radius: 0 17px 0 0;
    color: var(--font-secondary-button-color);
    font: var(--font-button);
    text-decoration: none;
    display: inline-block;
    position: relative;
    transition: background-color .2s;
    cursor: pointer;
}
input[type="file" i]::-webkit-file-upload-button:hover {
    background-color: var(--button-secondary-hover-bg-color);
}
input[type="checkbox"], input[type="radio"] {
    width: initial;
}
select:not(.goog-te-combo) {
    padding: 9.5px 15px 7.5px 15px;
    margin: 2px 0 0 0;
    border: 1px solid var(--theme-default-color);
    border-radius: 0;
    background-color: var(--select-bg-color);
    color: var(--font-body-color);
    font: var(--font-button);
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('data:image/svg+xml,<svg width="10px" height="6px" viewBox="0 0 10 6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="1 0 0 1 5 6 10 1 9 0 5 4"></polygon></svg>');
    background-repeat: no-repeat;
    background-position: calc(100% - 10px) calc(50% + 1px);
    cursor: pointer;
}
/*select:after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    width: 10px;*/
/*    height: 6px;*/
/*    right: 10px;*/
/*    top: calc(50% - 3px);*/
/*    z-index: 1;*/
/*    mask-image: url('data:image/svg+xml,<svg width="10px" height="6px" viewBox="0 0 10 6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="1 0 0 1 5 6 10 1 9 0 5 4"></polygon></svg>');*/
/*    background-color: var(--font-body-color);*/
/*}*/
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;
}

/* pullquote */
.pullquote {
    width: 100%;
    margin: 0 0 35px 0;
    padding: 68px 50px 60px 95px;
    background-color: rgb(var(--theme-secondary-color-2));
    border-radius: 50px 0 50px 0;
    color: var(--pullquote-color);
    font: var(--font-pullquote);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    position: relative;
}
.pullquote:before {
    content: "";
    display: block;
    position: absolute;
    width: 24px;
    height: 20px;
    mask-image: url('data:image/svg+xml,<svg width="23.714px" height="19.241px" viewBox="0 0 23.714 19.241" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M23.714,1.917 C21.5366667,3.57366667 19.9865,5.1475 19.0635,6.6385 C18.1405,8.1295 17.679,9.77433333 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.24783333 14.8035,7.25383333 15.4425,6.2835 C16.0815,5.31316667 16.9453333,4.31916667 18.034,3.3015 C19.1226667,2.28383333 20.4716667,1.18333333 22.081,0 L23.714,1.917 Z M10.082,1.917 C7.90466667,3.57366667 6.3545,5.1475 5.4315,6.6385 C4.5085,8.1295 4.047,9.77433333 4.047,11.573 C4.66233333,11.1943333 5.37233333,11.005 6.177,11.005 C7.26566667,11.005 8.15316667,11.3718333 8.8395,12.1055 C9.52583333,12.8391667 9.869,13.774 9.869,14.91 C9.869,16.188 9.43116667,17.2293333 8.5555,18.034 C7.67983333,18.8386667 6.50833333,19.241 5.041,19.241 C1.68033333,19.241 0,17.0163333 0,12.567 C0,11.3836667 0.142,10.2831667 0.426,9.2655 C0.71,8.24783333 1.1715,7.25383333 1.8105,6.2835 C2.4495,5.31316667 3.31333333,4.31916667 4.402,3.3015 C5.49066667,2.28383333 6.83966667,1.18333333 8.449,0 L10.082,1.917 Z" fill="%23668D4E"></path></g></svg>');
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    background-color: var(--theme-primary-color-2);
    top: 70px;
    left: 50px;
}
.pullquote .pullquote-author {
    margin: 20px 0 0 0;
    font: var(--font-pullquote-author);
}
.pullquote .pullquote-author:before {
    content: "";
    width: 37px;
    height: 5px;
    margin: 0 15px 4px 0;
    background-color: var(--theme-primary-color-2);
    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.blue-alt {
    background-color: var(--theme-secondary-color-3);
    color: var(--theme-primary-color-2);
}
.pullquote.blue-alt:before, .pullquote.blue-alt .pullquote-author:before {
    background-color: var(--theme-primary-color-1);
}

/* FORM */
form h3 {
    margin: 0;
}
input[type="file"] {
    border: unset;
    background-color: unset;
    margin: 0;
    padding: 0;
}
fieldset[data-name="checkboxes"], fieldset[data-name="radios"] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 14px;
}
fieldset[data-name="checkboxes"] legend, fieldset[data-name="radios"] legend {
    width: 100%;
    font-weight: 600;
    margin-bottom: 10px;
}
input[type="checkbox"], input[type="radio"] {
    margin: 2px 0 0 0;
}
form .field-row .field-container label.select {
    display: flex;
    flex-direction: column;
}

form button.submit-button { /* TODO */
    font-weight: 500;
    border: unset;
    color: var(--font-button-color);
    background-color: var(--button-bg-color);
    border-radius: 22px 0 0 0;
    padding: 11.5px 15px 10.5px 17px;
    margin: 6px 0 0 19px;
    text-transform: capitalize;
}
form button.submit-button:before {
    content: '';
    position: absolute;
    height: 41px;
    width: 32.5px;
    background-image: var(--button-bg-image);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top left;
    left: -19px;
    bottom: 0;
    z-index: -1;
    transition: background-color .3s;
}

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

.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: calc(100% - 60px);*/
    width: 100%;
    max-width: 1440px;
    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 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;*/
    position: relative;
    z-index: 5;
}
header .header-panels .close-icon {
    opacity: 0; 
    display: block;
    position: absolute;
    top: 34px;
    right: 30px;
    z-index: 15;
    /* pointer-events: none; */
    /* transition: opacity 0s; */
}
header .header-panels:has( .panel[aria-hidden="false"] .alert-messages) .close-icon {
    transform: translateY(-50%);
    top: 50%;
}
header .header-panels .close-icon[aria-hidden="false"] {
    opacity: 1;
}
header .header-panels .close-icon svg {
    fill: var(--font-body-color);
}
header .header-panels .panel {
    width: 100%;
    padding: 30px;
    background-color: var(--body-bg-color);
    background-color: var(--discover-by-bg-color);
    border-bottom: 1px solid var(--theme-primary-color-2);
    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;
}
header .header-panels .panel[data-panel-type="hours"] {
    display: flex;
    flex-wrap: wrap;
    padding: 30px 74px 30px 30px;
}
header .header-panels .panel:has( .alert-messages) {
    padding: 29px 74px 27px 30px;
}
header .header-panels .panel .header {
    margin: 3px 0 26px 0;
    display: block;
    font: var(--font-panels-header);
}
header .header-panels .panel[data-panel-type="hours"] .header {
    width: 100%;
}
/* header panel accessibility */
header .header-panels .panel .access-options {
    width: calc(100% - 42px);
    display: flex;
    column-gap: 15px;
    align-items: flex-start;
}
header .header-panels .panel .access-options select {
    padding: 3px 5px;
    margin: 0;
    /*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: 15px;
    row-gap: 10px;
}
header .header-panels .panel .access-options .access-section .subheader {
    width: 100%;
    color: var(--font-color-site-navigations);
    font: var(--font-panels-subheader);
    display: block;
}
header .header-panels .panel .access-options .access-section .option {
    display: flex;
    align-items: center;
    column-gap: 4px;
}
header .header-panels .panel .access-options .access-section .option .icon {
    width: 20px;
    height: 20px;
    background-color: var(--theme-primary-color-2);
    color: var(--font-button-color);
    font: var(--font-panels-access-option);
    font-weight: 600;/* 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;/* TODO: turn this into a var */
}
header .header-panels .panel .access-options .access-section .option p {
    margin: 0;
    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 panel alerts */
header .header-panels .panel .alert-messages {
    width: 100%;
    margin: 0;
    padding: 0 0 2px 0;
    display: flex;
    justify-content: center;
    overflow: hidden;
}
header .header-panels .panel .alert-messages .swiper-slide {
    display: flex;
    justify-content: space-between;
    overflow: visible;
    font: var(--font-main-navigation);
    font-weight: 300;
}
header .header-panels .panel .alert-message {
    position: relative;
    /*font: var(--font-main-navigation);*/
    font-weight: 400;
    padding: 0 0 0 20px;
}
header .header-panels .panel .alert-message strong {
    font-weight: 600;
}
header .header-panels .panel .alert-message:before {
    content: "";
    width: 15px;
    height: 15px;
    background-color: #EDC531;
    border-radius: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
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 {
    font: var(--font-main-navigation);
    text-decoration: underline;
}
header .header-panels .panel .alert-svg {
    position: relative;
    top: 6px;
}
/* header panel hours */
header .header-panels .panel .hours-list {
    width: fit-content;
}
header .header-panels .panel .branch-hours {
    display: flex;
    gap: 38px;
    margin: 0;
}
header .header-panels .panel .branch-hours div {
    border-left: .5px solid var(--theme-primary-color-2);
    padding-left: 15px;
    font: var(--font-panels-subheader);
}
header .header-panels .panel .branch-hours .day {
    /*font: var(--font-panels-subheader);*/
    margin: 1px 0 10px 0;
}
header .header-panels .panel .branch-hours .time {
    font: var(--font-panels-access-option);
    font-weight: 400;
    margin: 0;
}
header .header-panels .panel .closed-days-list {
    flex: 1;
    margin-left: 38px;
    padding: 0 0 0 15px;
    border-left: .5px solid var(--theme-primary-color-2);
}
header .header-panels .panel .closed-days-list .subheader {
    display: block;
    margin: 1px 0 10px 0;
    font: var(--font-panels-subheader);
}
header .header-panels .panel .closed-days-list p {
    margin: 0;
    font: var(--font-panels-access-option);
    line-height: 18px;
}

header .header-wrapper {
    width: 100%;
    padding: 0 30px;
    display: flex;
    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 {
    width: var(--site-logo-container-width);
    /*margin: 38px 0 0 0;*/
    margin: 27px 0 0 0;
    /*padding: 28px 32px 0 28px;*/
    /*background-color: rgba(0,0,255,0.1);*/
    /*background-color: var(--body-bg-color);*/
    display: block;
}
header .site-logo .site-logo-link {
    display: block;
}
header .site-logo .site-logo-link img {
    content: var(--main-logo-img);
    max-width: 100%;
    max-height: var(--site-logo-height);
}
header .site-navigations {
    width: calc(100% - 245px);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: initial;
    /*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: relative;
}
header ul.nav-list li:before {
    display: none;
}
header ul.nav-list li .list-toggle {
    display: block;
    /*transform: scaleY(-1);*/ /* when present, dropdown arrows are pointing wrong direction in mobile */
    transition: transform .3s;
}
header ul.nav-list li.show-dropdown .list-toggle {
    transform: scaleY(-1);
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ Main Navigation \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
header .main-navigation {
    width: 100%;
    padding: 9px 0px 0px 0px;
    /*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;
    /*gap: 17px;*/
    gap: 5px;
    align-items: center;
    justify-content: space-between;
    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 a {
    padding: 0;
    color: var(--font-color-site-navigations);
    font: var(--font-main-navigation);
    /*text-decoration: underline;*/
    display: block;
    position: relative;
    z-index: 10;
}
header .main-navigation ul.nav-list li.active > a, header .main-navigation ul.nav-list li:hover > a {
    color: var(--theme-primary-color-2);
}
header .main-navigation ul.nav-list li:not(.search-option).active a span {
    border-color: var(--theme-primary-color-2);
}
header .main-navigation ul.nav-list > li:not(.search-option) > a {
    text-shadow: -1.5px 2px 0px var(--body-bg-color), 1.5px 2px 0 var(--body-bg-color), 0px 2px 0 var(--body-bg-color);
}
header .main-navigation ul.nav-list li:not(.search-option) a span {
    border-bottom: .5px solid var(--font-body-color);
}
header .main-navigation ul.nav-list li .list-toggle {
    display: none;
}
header nav ul.nav-list li .link-name {
    text-align: center;
    display: block;
    position: relative;
    z-index: 5;
}
header nav ul.nav-list .list-dropdown {
    width: max-content;
    padding: 15px 15px 18px 15px;
    background-color: var(--theme-primary-color-2);
    opacity: 0;
    position: absolute;
    top: calc(100% + 11px);
    left: 0px;
    z-index: 5;
    transform: translateY(-5px);
    transition: opacity .2s, transform .2s;
    border-radius: 0 0 23px 0;
    pointer-events: none;
}
header .main-navigation ul.nav-list li:nth-last-child(-n + 2) .list-dropdown {
    left: unset;
    right: 0;
    border-radius: 0 0 0 23px;
}
header nav ul.nav-list .list-dropdown:after {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    left: 8px;
    top: -5px;
    transform: rotate(45deg);
    background-color: var(--theme-primary-color-2);
}
header .main-navigation ul.nav-list li:nth-last-child(-n + 2) .list-dropdown:after {
    left: unset;
    right: 8px;
}
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: 41px;
    display: block;
    position: absolute;
    top: -13px;
    left: 0;
}
header .utility-navigation ul.nav-list li .list-dropdown:before {
    top: -12px;
    height: 20px;
}
header ul.nav-list li .list-dropdown ul {
    width: 100%;
    margin: 0px;
    list-style-type: none;
    position: relative;
}
header ul.nav-list li .list-dropdown .dropdown-group {
    width: 100%;
}
/* hides empty nav items */
header ul.nav-list li .list-dropdown .dropdown-group:not(header ul.nav-list li .list-dropdown .dropdown-group:has(li)) {
    display:none;
}
header ul.nav-list li .list-dropdown .dropdown-group .h5-like {
    color: #FFFFFF; /* TODO */
    margin: 0;
    /*font-size: 15px;*/
    /*line-height: 16px;*/
    display: block;
}
header ul.nav-list li .list-dropdown .dropdown-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 ul.nav-list li .list-dropdown ul li a {
    width: auto;
    padding: 2px 0;
    font: inherit;
    /*font-size: 14px;*/
    /*line-height: 16px;*/
}
header ul.nav-list li .list-dropdown .dropdown-group ul li a {
    width: auto;
    padding: 3px 0;
    white-space: wrap;
    transition: opacity .3s;
}
header ul.nav-list li .list-dropdown .dropdown-group ul li.active a {
    color: var(--font-button-color);
}
/*header ul.nav-list li .list-dropdown .dropdown-group ul li:first-child a {*/
/*    padding-top: 0;*/
/*}*/
header ul.nav-list li .list-dropdown .dropdown-group ul li:last-child a {
    padding-bottom: 0;
}



/*header .main-navigation ul.nav-list li .list-dropdown ul {*/
/*    width: calc(100% - 347px);*/
/*    display: flex;*/
/*    flex-wrap: wrap;*/
/*    column-gap: 20px;*/
/*    row-gap: 20px;*/
/*    align-items: flex-start;*/
/*}*/
header .main-navigation ul.nav-list li .list-dropdown ul li {
    /*width: calc(33% - 20px);*/
    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 nav ul.nav-list li .list-dropdown ul li a {
    width: 100%;
    font: var(--font-main-navigation-dropdown);
    text-decoration: none;
    color: var(--font-button-color);
    opacity: .87;
}
header nav ul.nav-list li .list-dropdown ul li a:hover {
    color: var(--font-button-color);
    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: 347px;
    width: 100%;
    height: 242px;
    background-color: var(--theme-default-color);
    opacity: 0;
    display: block;
    transform: translateY(-5px);
    transition: opacity .2s, transform .2s;
}
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 */
header .main-navigation ul.nav-list li.search-option {
    width: 36px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    transition: background-color .2s, border-color .2s;
}
header .main-navigation ul.nav-list li.search-option a {
    width: 38px;
    height: 38px;
    aspect-ratio: 1/1;
    background-color: var(--theme-primary-color-2);
    border-radius: 100%;
}
header .main-navigation ul.nav-list li.search-option a.search-bar-item {
    width: unset;
    height: unset;
    aspect-ratio: unset;
    background-color: transparent;
    border-radius: 0;
    display: inline;
    font: var(--paragraph-font);
    font-weight: 500;
}
header .main-navigation ul.nav-list li.search-option .option-icons {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 10;
    border-radius: 50%;
}
header .main-navigation ul.nav-list li.search-option .option-icons svg {
    fill: var(--font-button-color);
}
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 {
    width: 100%;
    height: 100%;
    background-color: var(--theme-primary-color-2);
    border-radius: 100%;
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transform: scaleY(0);
    transform-origin: 50% 0;
    pointer-events: none;
    transition: opacity .2s, transform .2s;
}
header.search-showing .main-navigation ul.nav-list li.search-option .option-backdrop {
    opacity: 1;
    transform: scaleY(1);
    transition: opacity .3s .1s, transform .3s;
    z-index: 15;
    fill: var(--font-button-color);
}
/*header .main-navigation ul.nav-list li.search-option .option-backdrop:after {*/
/*    content: "";*/
/*    width: 100%;*/
/*    height: 6px;*/
/*    background-color: var(--body-bg-color);*/
/*    display: block;*/
/*    position: absolute;*/
/*    bottom: 0;*/
/*    left: 0;*/
/*    z-index: 5;*/
/*    pointer-events: none;*/
/*    transition: bottom .2s;*/
/*}*/
/*header.search-showing .main-navigation ul.nav-list li.search-option .option-backdrop:after {*/
/*    bottom: -3px;*/
/*    transition: bottom .2s .1s;*/
/*}*/
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ Utility Navigation \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
header .utility-navigation {
    width: 100%;
    padding: 21px 0 19px;
    display: flex;
    column-gap: 24px;
    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: 26px;
}
header .utility-navigation .mobile-menu .menu {
    width: 100%;
    display: flex;
    row-gap: 6.5px;
    flex-direction: column;
    position: relative;
}
header .utility-navigation .mobile-menu .menu .line {
    width: 100%;
    height: 1px;
    background-color: var(--panel-list-options-color);
    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;
    gap: 26px;
    align-items: center;
}
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.active {
    --panel-list-options-color: var(--theme-primary-color-3);
}
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: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 10px solid var(--theme-primary-color-2);
    border-radius: initial;
    opacity: 0.1;
    display: block;
    position: absolute; 
    top: -21px;
    left: calc(50% - 8px);
    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{
    opacity: 1;
}
header .utility-navigation ul.panel-options li a {
    color: var(--font-color-site-navigations);
    font: var(--font-utility-navigation);
    display: flex;
    align-items: center;
    text-align: center;
}
header .utility-navigation ul.panel-options li a svg {
    opacity: 0.3;
    fill: var(--font-color-site-navigations);
}
header .utility-navigation ul.panel-options li.active a svg {
    opacity: 1;
}
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;
    gap: 25px;
    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: 0;
    opacity: .4;
    pointer-events: none;
}
header .utility-navigation ul.nav-list li a {
    /*padding: 0;*/
    color: var(--font-color-site-navigations);
    font: var(--font-utility-navigation-dropdown);
    text-decoration: none;
    opacity: 1;
    display: flex;
    align-items: center;
    position: relative;
}
header .utility-navigation ul.nav-list li .list-toggle {
    display: none;
}
header .utility-navigation ul.nav-list li a:after {
    background-color: var(--font-color-site-navigations);
}
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: 11px;
}
/*header .utility-navigation ul.nav-list li .list-dropdown {*/
/*    width: 100%;*/
/*    padding: 9px 0;*/
/*    background-color: var(--theme-secondary-color-4);*/
/*    border: 1px solid var(--theme-primary-color-3);*/
/*    border-left-width: 5px;*/
    /*opacity: 0;*/
/*    position: absolute;*/
/*    top: 100%;*/
/*    left: 0;*/
    /*z-index: 99;*/
/*    transition: opacity .2s, box-shadow .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;
    pointer-events: all;
    transition: opacity .2s .1s, box-shadow .3s .6s;
}
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: 5px 15px;*/
/*    opacity: 0.7;*/
/*    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: 10px;
}
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 svg {
    fill: var(--font-color-site-navigations);
}
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 .list-dropdown {*/
/*    width: 250px;*/
/*    opacity: 0;*/
/*    left: calc(50% - 125px);*/
/*    transform: translateY(-15px);*/
/*    transition: opacity .2s, box-shadow .2s, transform .2s;*/
/*}*/
header .utility-navigation ul.nav-list li:hover .list-dropdown, header .utility-navigation ul.nav-list li:focus-within .list-dropdown {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .3s .1s, box-shadow .3s .2s, transform .3s;
}
header .utility-navigation ul.nav-list li .list-dropdown ul:after {
    /* TODO: remove this style from main */
    /*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;*/
/*}*/
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ Top Searchbar \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.top-search-input {
    width: calc(100vw - 60px);
    max-width: 1380px;
    position: absolute;
    top: calc(100% + 20px);
    right: 0;
    z-index: 1;
    transition: right 0s .4s;
    pointer-events: none;
}
.top-search-input.show-search {
    right: 0px;
    transition: none;
    pointer-events: all;
}
.top-search-input a.button-like.secondary {
    margin: 0;
}
.top-search-input .onsite-search {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    opacity: 0;
    transform: translateY(-5px);
    transition: opacity .2s, transform .2s;
    pointer-events: none;
}

.top-search-input.show-search .onsite-search {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .3s .2s, transform .3s .1s;
    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;
    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;
    display: flex;
}
.top-search-input .onsite-search .onsite-search-icon {
    width: 70px;
    height: 70px;
    background-color: var(--theme-secondary-color-4);
    display: flex;
    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 {
    flex: 1;
    padding: 15px 64px 15px 20px;
    background-color: var(--theme-primary-color-2);
}
header .main-navigation .top-search-input .onsite-search a.button-like {
    position: absolute;
    aspect-ratio: unset;
    height: 37px;
    /*width: 53px;*/
    width: 44px;
    top: 15px;
    right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0;
    background-color: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.5);
    border-left: unset;
    fill: var(--font-button-color);
}
header .main-navigation .top-search-input .onsite-search .full-result-link-container {
    width: 100%;
}
header .main-navigation .top-search-input .onsite-search a.button-like.full-result-link {
    padding: 9.5px 15px 8.5px 15px;
    background-color: var(--button-secondary-bg-color);
    border: 1px solid var(--font-secondary-button-color);
    border-radius: 0 17px 0 0;
    color: var(--font-secondary-button-color);
    font: var(--font-button);
    text-decoration: none;
    display: inline-block;
    position: relative;
    height: fit-content;
    width: unset;
    top: unset;
    right: unset;
}
.top-search-input .onsite-search .onsite-search-input-container .onsite-search-input {
    margin: 0;
    padding: 10px 20px 8px 20px;
    background-color: rgba(255,255,255,.07); /* TODO */
    border: 1px solid rgba(255,255,255,.5); /* TODO */
    border-right: unset;
    color: var(--font-button-color);
    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 {
    color: var(--font-button-color);
    opacity: 0.5;
}
.top-search-input .search-results {
    width: 100%;
    margin: 0;
    padding: 0;
    display: none;
    flex-wrap: wrap;
    background-color: var(--theme-secondary-color-4);
    border-radius: 0 0 0 50px;
}
.top-search-input .search-results .title {
    font: var(--font-context-navigation-heading);
    margin-bottom: 10px;
}
/*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: 50px;
    min-width: 50px;
    max-height: 70px;
    min-height: 70px;
    object-fit: cover;
    flex: 0 0 auto;
    /*background-color: var(--body-barrens-border-color);*/
}   
.search-results .result .cover-img:not(img) {
    background-color: rgba(0, 0, 0, .1);
    /*background-image: url('data:image/svg+xml,<svg width="63.0952381px" height="50px" viewBox="0 0 63.0952381 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="%2391ACCB"><path d="M63.0952381,19.8214286 L63.0952381,31.6666667 L56.1904762,31.6666667 C46.1765219,31.6666667 38.0377725,39.6953727 37.8601081,49.6669044 L37.8571429,50 L25.952381,50 C25.952381,33.3328352 39.4637876,19.8214286 56.1309524,19.8214286 L63.0952381,19.8214286 Z M6.96428571,27.797619 C15.5447579,27.797619 23.0180664,32.53795 26.9082489,39.5426495 C26.1448127,41.5322573 25.5720148,43.6156493 25.2109276,45.7707983 C23.0797656,37.6536247 15.6914282,31.6666667 6.9047619,31.6666667 L2.52242671e-13,31.6666667 L2.52242671e-13,27.797619 L6.96428571,27.797619 Z M6.96428571,23.6309524 C16.0807005,23.6309524 24.1404482,28.1550818 29.0208522,35.0806638 C28.2600675,36.4130688 27.5912226,37.8046801 27.0223393,39.2466543 C23.0596035,32.2336647 15.534986,27.5 6.9047619,27.5 L0,27.5 L0,23.6309524 L6.96428571,23.6309524 Z M6.96428571,19.8214286 C16.8323352,19.8214286 25.6155581,24.4661231 31.2470476,31.6886054 C30.4913019,32.6960899 29.7933424,33.7491817 29.1572436,34.8426995 C24.2187565,27.8784014 16.092538,23.3333333 6.9047619,23.3333333 L0,23.3333333 L0,19.8214286 L6.96428571,19.8214286 Z M31.8452381,0 C37.9269452,0 42.8571429,4.9301977 42.8571429,11.0119048 C42.8571429,17.0936118 37.9269452,22.0238095 31.8452381,22.0238095 C25.763531,22.0238095 20.8333333,17.0936118 20.8333333,11.0119048 C20.8333333,4.9301977 25.763531,0 31.8452381,0 Z"></path></g></svg>') !important;*/
    /*background-size: 70%;*/
    /*background-repeat: no-repeat;*/
    /*background-position: center;*/
    /*opacity: .7;*/
    display: flex;
    justify-content: center;
    align-items: center;
}
.search-results .result .cover-img:not(img) i {
    font-size: 20px;
}
.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;
}
.top-search-input .search-results .result {
    margin: 0 0 5px 0;
    font: var(--font-events-time);
    display: block;
    opacity: .8;
}
.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;
    width: calc(100% - 230px);
    padding: 30px;
    gap: 25px;
}
.top-search-input .search-results .onsite-search-catalog-results {
    background-color: var(--theme-secondary-color-5);
}
@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((100% - 25px) / 2);
}
.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;
    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: 10px;*/
    width: unset;
    height: unset;
    aspect-ratio: unset;
    background-color: unset;
    border-radius: 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 .onsite-search-results-title {
    margin: 0;
    padding: 30px 20px;
    background-color: var(--bucket-section-bg-color);
    display: flex;
    /*justify-content: space-between;*/
    width: 230px;
    flex-direction: column;
    gap: 25px;
}
.top-search-input .search-results .no-results {
    width: calc(100% - 20px);
    margin: 0 10px;
    font-size: 14px;
    line-height: 16px;
}
.top-search-input .search-results .onsite-search-results-title:first-of-type {
    margin: 0;
    background-color: rgba(var(--theme-primary-color-2-rgb),.05);
}
.top-search-input .search-results .onsite-search-results-title span {
    width: 100px;
}
.top-search-input .search-results .onsite-search-results-title span:after {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: var(--theme-primary-color-1);
    border-radius: 100%;
    margin-left: 2px;
}
/* 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-bottom: 12px;
    display: flex;
    gap: 4px;
    align-items: center;
    font: var(--font-context-navigation-heading);
}
.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 strong{
    font-weight: 600;
}
.top-search-input .onsite-search-results a{
    text-decoration: none;  
    color: var(--font-link-color);
    /*font: var(--small-header-font);*/
    font-size: 14px;
}
.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;
    gap: 25px;
}
.top-search-input.show-search.searching-site .direct-results.result-category {
    display: none;
}
/*======================================================================
    BODY - styles | desktop
========================================================================*/
body {
    margin: 0;
    padding: 0;
    background-color: var(--body-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;
    margin: 0 auto;
    padding: 23px 0 388px 0;
    background-color: var(--body-bg-color, #FCFCFC);
    position: relative;
    z-index: 25;
}
.main-content:not(.home):not(:has( .banner)) {
    padding-top: 60px;
}
.main-content.overlay-active {
    z-index: 35;
}
/* 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: 275px;
    padding-left: 60px;
    position: relative;
    z-index: 10;
}
.left-sidebar:has( .single-preview-image) {
    max-width: 360px;
    padding-left: 60px;
}
.left-sidebar.no-offset {/* this status is printed only when the page banner is not printed */
    margin-top: 0;
    /*padding-top: 50px;*/
}
/* 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: 7px;
    text-decoration-thickness: .5px;
    /* position: relative; */
}
/*
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 .single-preview-image {
    width: 100%;
    margin-top: 40px;
    aspect-ratio: 1/1;
    display: block;
}
.left-sidebar .context-navigation {
    width: 100%;
    max-width: 215px;
    padding: 35px 30px 35px 25px;
    background-color: rgba(var(--theme-secondary-color-1-rgb),1);
    border-radius: 0 50px 0 0;
    position: relative;
    z-index: 5;
}
.left-sidebar .context-navigation a {
    color: var(--font-body-alt-color);
    text-decoration: none;
    display: block;
}
.left-sidebar .context-navigation .nav-heading {
    margin-bottom: 6px;
    font: var(--font-context-navigation-heading);
    position: relative;
}
.left-sidebar .context-navigation .nav-heading:before {
    content: "";
    width: calc(100% + 10px);
    height: calc(100% + 3px);
    background-color: var(--theme-primary-color-3);
    opacity: .2;
    display: none;
    position: absolute;
    top: -1px;
    left: -5px;
    z-index: -1;
    border-radius: 0 20px 0 0;
}
.left-sidebar .context-navigation .nav-heading:hover:before, .left-sidebar .context-navigation .nav-heading.active:before {
    display: block;
}
.left-sidebar .context-navigation .nav-heading:hover:before {
    opacity: .1;
}
.left-sidebar .context-navigation ul.nav-list {
    width: 100%;
}
.left-sidebar .context-navigation ul.nav-list li {
    width: 100%;
    position: relative;
}
.left-sidebar .context-navigation ul.nav-list li:before {
    content: "";
    width: calc(100% + 10px);
    height: calc(100% - 4px);
    background-color: var(--theme-primary-color-3);
    border-radius: unset;
    opacity: .2;
    display: none;
    position: absolute;
    top: 2px;
    left: -5px;
    z-index: -1;
}
.left-sidebar .context-navigation ul.nav-list li:hover:before, .left-sidebar .context-navigation ul.nav-list li.active:before {
    display: block;
}
.left-sidebar .context-navigation ul.nav-list li:hover:before {
    opacity: .1;
}
.left-sidebar .context-navigation ul.nav-list li .header {
    display: block;
    margin-top: 10px;
    font: var(--font-sub-header);
    font-weight: 500;
}
.left-sidebar .context-navigation ul.nav-list li a {
    padding: 5px 0;
    font: var(--font-context-navigation-list-item);
}
.left-sidebar .context-navigation ul.nav-list li a:hover {
    opacity: 1;
}
.left-sidebar .context-navigation ul.nav-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;
    background-color: var(--select-bg-color);
}
.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% - 285px);
    max-width: 912px;
    margin: 0 45px;
    position: relative;
    z-index: 5;
}
.page-content:has( .right-sidebar) .page-body {
    width: calc(100% - 625px);
}
.page-body.enable-pesudo-right-sidebar {
    max-width: 1028px;
    margin: 0 25px;
    padding-right: calc(25% - 85px);
    transition: padding .3s;
}
.page-body:has( .single-event) {
    max-width: 847px;
    margin: 0 60px;
}
.page-body.no-sidebar {
    max-width: 1179px;
    width: calc(100% - 70px);
}
/*----------------- Page Body > Assets - styles | desktop -----------------*/
/* Overflow Segment; mainly used facilitate sections on the home page and the page banners */
.overflow-segment {
    width: 100%;
    margin: 0 auto;
    /* ensure theres atleast enough margin to match the `content-board's` translate offset; this will prevent lower sections from getting covered */
    /*margin-bottom: 120px;*/
    display: flex;
    
    /* override base variables */
    --font-header-color: #000000;
    --font-body-color: #000000;
    /*--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: 50%;
    margin: auto;
    /*border-radius: 0 70px 0 0;*/
    background: no-repeat center;
    background-size: cover;
    background-color: var(--theme-primary-color-3);
    aspect-ratio: var(--overflow-segment-media-ratio);
    position: relative;
    /*transform: translateY(15px);*/
    /*transition: transform .3s .3s;*/
}
.overflow-segment.banner .media-board {
    width: calc(100% - 60px);
    height: 350px;
    border-radius: 0 70px 0 0;
}
/*.overflow-segment.element-initialized .media-board {*/
/*    transform: translateY(0);*/
/*}*/
.overflow-segment .media-board:before {
    content: "";
    width: 100%;
    height: 100%;
    opacity: 1;
    border-radius: 0 70px 0 0;
    background-color: var(--theme-primary-color-3);
    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 {
    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: 100%;
    padding: 21px 25px 40px 25px;
    padding-left: 15px; /* used to accommodate this block's pesudo `left-border` (:before) */
    background-color: var(--theme-secondary-color-4);
    border-radius: 50px 0 0 0;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    position: relative;
    flex: 1;
    z-index: 0;
}
/*.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%;
}
/* 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;
    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);
    display: flex;
    column-gap: 10px;
    align-items: center;
}
.overflow-segment .content-board .details .donation-list .donate-option p {}
/* 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;
}
.overflow-segment .content-board .details .info-line .info-icon svg {
    fill: var(--font-body-color);
}
.overflow-segment .content-board .details .bio-text {
    max-height: 254px;
    overflow: auto;
    margin-top: 19px;
}
.overflow-segment .content-board .details .bio-text > *:first-child {
    margin-top: 0;
}
/* campaign section */
.campaign {
    margin: 0 auto 100px auto;
    width: calc(100% - 60px);
    display: flex;
}
.campaign .overflow-segment.carousel {
    position: relative;
    width: 43.3%;
    margin: 0;
}
.campaign .overflow-segment.carousel .media-board {
    width: 100%;
    height: 445px;
}
.campaign .overflow-segment.carousel .content-board {
    background-color: var(--select-bg-color);
    border: .5px solid var(--primary-border-color);
    border-right: unset;
    padding: 0;
    border-radius: 0;
}
.campaign .overflow-segment.carousel #pause_play_button {
    position: absolute;
    width: 20px;
    height: 20px;
    padding: 0;
    border-radius: 100%;
    border: 1px solid var(--font-body-alt-color);
    bottom: 16px;
    right: 25px;
    z-index: 1;
}
.campaign .overflow-segment.carousel #pause_play_button:before {
    position: absolute;
    content: '';
    width: 6px;
    height: 8px;
    mask-image: url('data:image/svg+xml,<svg width="5.34732549px" height="7.148186px" viewBox="0 0 5.34732549 7.148186" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M3.99680289e-15,7.148186 L3.99680289e-15,-1.77635684e-15 L0.957512012,-1.77635684e-15 L0.957512012,7.148186 L3.99680289e-15,7.148186 Z M4.38981347,7.148186 L4.38981347,-1.77635684e-15 L5.34732549,-1.77635684e-15 L5.34732549,7.148186 L4.38981347,7.148186 Z" ></path></svg>');
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    background-color: var(--font-body-color);
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
}
.campaign .overflow-segment.carousel #pause_play_button.paused:before {
    mask-image: url('data:image/svg+xml,<svg width="6px" height="7px" viewBox="0 0 6 7" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon id="Rectangle" points="0 0 6 3.5 0 7"></polygon></svg>');
}
.campaign .upcoming-events {
    width: 30.71%;
    background-color: rgba(var(--theme-primary-color-4),.26);
    border: .5px solid var(--primary-border-color);
    border-radius: 50px 0 0 0;
    padding: 37px 35px;
}
.campaign .upcoming-events ul {
    display: flex;
    flex-direction: column;
    gap: 25px;
}
.campaign .upcoming-events ul a {
    text-decoration: none;
    color: var(--font-body-color);
}
.campaign .upcoming-events .title {
    font: var(--font-sub-header);
}
.campaign .upcoming-events .time {
    font: var(--font-events-time);
}
.campaign .hours-quicklinks {
    width: 26%;
    display: flex;
    flex-direction: column;
}
.campaign .hours-quicklinks .hours {
    padding: 37px 35px;
    background-color: rgba(var(--theme-primary-color-4),.19);
    border: .5px solid var(--primary-border-color);
    border-left: unset;
}
.campaign .hours-quicklinks .hours p {
    margin-bottom: 8px;
    font: var(--font-sub-header);
}
.campaign .hours-quicklinks .hours p strong {
    font-weight: 400;
}
.campaign .hours-quicklinks .hours p:last-child {
    margin-bottom: 0;
}
.campaign .hours-quicklinks .quicklinks {
    flex: 1;
    padding: 35px;
    background-color: var(--theme-secondary-color-5);
    border-right: .5px solid var(--primary-border-color);
    border-bottom: .5px solid var(--primary-border-color);
    border-radius: 0 0 50px 0;
}
.campaign .hours-quicklinks .quicklinks ul {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.campaign .hours-quicklinks .quicklinks ul li a {
    position: relative;
    font: var(--font-sub-header);
    font-weight: 400;
    color: var(--font-body-color);
    text-decoration: none;
    padding-left: 35px;
}
.campaign .hours-quicklinks .quicklinks ul li a:after {
    background-color: var(--font-body-color);
}
.campaign .hours-quicklinks .quicklinks ul li a svg:not(.arrow), .campaign .hours-quicklinks .quicklinks ul li a svg:not(.arrow) path {
    position: absolute;
    top: 0;
    left: 0;
    max-height: 20px;
    max-width: 20px;
    fill: var(--font-body-color);
}
.campaign .hours-quicklinks .quicklinks ul li svg.arrow {
    margin-left: 5px;
    fill: var(--font-body-color);
}
.campaign .hours-quicklinks .quicklinks .campaign-bucket {
    --font-body: normal 400 14px/21px "Barlow", sans-serif;
    --font-body-color: var(--theme-primary-color-2);
    background-color: var(--select-bg-color);
    border-radius: 0 0 37px 0;
    padding: 20px 18px;
}
.campaign .hours-quicklinks .quicklinks .campaign-bucket .sub-header {
    display: flex;
    gap: 5px;
    font: var(--font-header-4);
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--theme-primary-color-1);
    margin-bottom: 7px;
}
.campaign .hours-quicklinks .quicklinks .campaign-bucket .sub-header svg {
    fill: var(--theme-primary-color-1);
}
.campaign .hours-quicklinks .quicklinks .campaign-bucket a.h5-like {
    display: block;
    position: relative;
    margin: 0 0 7px 0;
    text-decoration: none;
    color: var(--font-link-color);
}
.campaign .hours-quicklinks .quicklinks .campaign-bucket a.h5-like:after {
    content: '';
    display: inline-block;
    /*position: absolute;*/
    width: 7px;
    height: 11px;
    /*top: 4px;*/
    /*right: -11px;*/
    mask-image: url('data:image/svg+xml,<svg class="arrow" width="6.25px" height="11px" viewBox="0 0 6.25 11" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="0 0.75 0.75 0 6.25 5.5 0.75 11 0 10.25 4.75 5.5"></polygon></svg>');
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: center;
    background-color: var(--font-link-color);
    margin-left: 5px;
}
/* "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: 21px 25px 50px 25px;
}
.overflow-segment.carousel .content-board .details h1 {
    /*max-height: 134px;*/
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.overflow-segment.carousel .content-board .details p {
    /*max-height: 38px;*/
    /* for campaign description text */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 5px;
}
.overflow-segment.carousel .content-board .details a.button-like {
    margin-top: 16px;
}
.overflow-segment.carousel .swiper {
    width: 100%;
    margin: 0;
    border-radius: 0 70px 0 0;
}
.overflow-segment.carousel .swiper .swiper-wrapper {}
.overflow-segment.carousel .swiper .swiper-wrapper .swiper-slide {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.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: 20px;
    left: 26px;
    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);
    gap: 12px;
}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet {
    opacity: var(--swiper-pagination-bullet-inactive-opacity);
    transition: opacity .3s;
    transition-delay: .3s;
}
.overflow-segment.carousel .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    opacity: 1;
}
.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;}

/* "banner" variant variables/styles - for `overflow segment` section */
.overflow-segment.banner {
    margin-bottom: 60px;
    
    /* override base variables */
    --font-header-1: normal 500 50px/55px "Bricolage Grotesque", sans-serif;
    --overflow-segment-media-max-width: 880px;
    --overflow-segment-media-ratio: 3.5 / 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: stretch;
    
    /* 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: 35px;
}
.overflow-segment.bare .content-board:before {
    width: 10px;
    box-shadow: none;
}
.overflow-segment.bare .content-board .details {
    /*max-width: 380px;*/
}
.overflow-segment.bare .content-board .details:before {
    display: block;
    position: absolute;
    content: '';
    width: 100%;
    height: 10px;
    bottom: 35px;
    left: 0;
    /*background: linear-gradient(0deg, rgba(232, 237, 242, 1) 0%, rgba(232, 237, 242, 0) 100%);*/
    background: linear-gradient(0deg, var(--theme-secondary-color-4) 0%, rgba(232, 237, 242, 0) 100%);
}

/* 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;
    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 500 19px/24px "Bricolage Grotesque", sans-serif;
    --font-body: normal 400 16px/23px "Barlow", sans-serif;
    --font-body-color: #505050;/* was #878787 */
    --font-link-color: var(--font-header-color);
}
/* 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);
    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(--theme-secondary-color-4);
    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);}
}

@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);
    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);
}

/* 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 {
    width: calc(100% - 10px);
    padding: 35px;
    background-color: var(--theme-secondary-color-4);
    
    --preload-cover-bg-color: rgb(var(--theme-secondary-color-2));
}
.eresource-item h4 {
    margin: 0 0 15px 0;
}
.eresource-item p {
    margin: 0;
}
.eresource-item a.button-like.secondary {
    margin: 20px 0 0 0;
}
.eresource-item .item-media {
    width: 100%;
    margin: 0 0 15px 0;
    aspect-ratio: 1.58 / 1;
    display: block;
    background-size: calc(100% - 20px);
    background-position: center;
    background-repeat: no-repeat;
    background-color: #FFFFFF;
}


.preload-cover {
    position: relative;
}
.preload-cover:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgb(var(--preload-cover-bg-color));
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    transition: opacity .3s .3s;
}
.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;
}
.full-segment.green-variant .segment-filter {
    width: 100%;
    flex-direction: column;
    padding: 15px;
    align-items: flex-start;
    gap: 3px;
    background-color: rgb(var(--theme-secondary-color-2));
    border-radius: 0 0 37px 0;
}
.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, .segment-filter li button {
    padding: 2px 10px;
    background-color: transparent;
    color: var(--segment-filter-color);
    font: var(--font-full-segment-filter-item);
    text-decoration: none;
    display: block;
    transition: background-color .2s;
    border-radius: 0;
    border: unset;
    cursor: pointer;
}
.segment-filter li a:hover, 
.segment-filter li button:hover, 
.segment-filter li.active a, 
.segment-filter li.active button {
    background-color: var(--theme-secondary-color-4);
    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;
}

.full-segment {
    width: calc(100% - 120px);
    /*max-width: 1011px;*/
    margin: 0 auto 100px auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.full-segment.green-variant {
    width: calc(100% - 60px);
    flex-direction: row;
    align-items: stretch;
}
.lineage {/* edits for the `What's Inside` */
    margin: 100px 0 0 0;
}
.lineage h3, .lineage .h3-like {
    margin-bottom: 20px;
}
/* override base styles */
.full-segment h2, .full-segment .h2-like {
    margin: 0;
}
.full-segment .segment-heading-row {
    width: 100%;
    margin: 0 0 23px 0;
    display: flex;
    flex-direction: column;
    gap: 17px;
    align-items: center;
    position: relative;
    z-index: 20;
}
.full-segment.green-variant .segment-heading-row {
    background-color: var(--theme-secondary-color-1);
    border-radius: 0 58px 0 0;
    padding: 50px 35px;
    margin: 0;
    width: 265px;
    align-items: flex-start;
}
.full-segment.green-variant .segment-heading-row h2 {
    text-decoration: underline;
}
.full-segment.green-variant .segment-heading-row h2:after {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: var(--theme-primary-color-1);
    border-radius: 100%;
    margin-left: 2px;
}
.full-segment.green-variant .segment-heading-row p {
    text-align: left;
}
.full-segment .segment-heading-row p {
    margin: 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.green-variant .segment-content-row {
    background-color: rgba(var(--theme-secondary-color-2),.21);
    border: .5px solid var(--secondary-border-color);
    border-radius: 57px 0 0 0;
    max-width: calc(100% - 265px);
}
.full-segment.green-variant#for_you_segment .segment-content-row {
    display: flex;
    border-radius: 57px 0 50px 0;
}
.full-segment.green-variant#for_you_segment .swiper-button-prev, .full-segment.green-variant#for_you_segment .swiper-button-next {
    position: absolute;
    width: calc((100% / 2) - 10px);
    height: 35px;
    top: unset;
    bottom: 20px;
    background-image: unset;
}
.full-segment.green-variant#for_you_segment .swiper-button-prev:after {
    left: unset;
    right: 0;
}
.full-segment.green-variant#for_you_segment .swiper-button-prev:before {
    left: unset;
    right: 10px;
}
.full-segment.green-variant#for_you_segment .swiper-button-next:after {
    right: unset;
    left: 0;
}
.full-segment.green-variant#for_you_segment .swiper-button-next:before {
    left: 18px;
}
.full-segment.green-variant#for_you_segment .segment-content-row .slider-container .swiper {
    width: 100%;
    padding: 0;
}
.full-segment.green-variant#for_you_segment .segment-content-row .slider-container .swiper-wrapper .swiper-slide {
    flex: 1;
    height: auto;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item {
    padding: 52px 36px;
    border-right: .5px solid var(--secondary-border-color);
    /*flex: 1;*/
    /*max-width: 34%;*/
    width: 100%;
    height: 100%;
}
.full-segment.green-variant#for_you_segment .segment-content-row .swiper-slide:last-child .component-item {
    border: unset;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content .item-media {
    display: block;
    width: 100%;
    aspect-ratio: 1/1;
    background-size: cover;
    background-position: center;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content h4 {
    margin: 15px 0 10px 0;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content p {
    font-weight: 300;
    margin: 10px 0;
    opacity: .7;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content p.detail {
    position: relative;
    font-weight: 400;
    margin: 5px 0;
    padding-left: 20px;
    opacity: 1;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content p.detail:before {
    content: '';
    position: absolute;
    width: 15px;
    height: 15px;
    left: 0;
    top: 0;
    background-color: var(--font-body-color);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content p.detail.date:before {
    mask-image: url('data:image/svg+xml,<svg width="16px" height="14px" viewBox="0 0 16 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M12,0 C12.2761424,-5.07265313e-17 12.5,0.223857625 12.5,0.5 L12.5,1.5 L14,1.5 C15.1045695,1.5 16,2.3954305 16,3.5 L16,12 C16,13.1045695 15.1045695,14 14,14 L2,14 C0.8954305,14 1.3527075e-16,13.1045695 0,12 L0,3.5 C-1.3527075e-16,2.3954305 0.8954305,1.5 2,1.5 L3.5,1.5 L3.5,0.5 C3.5,0.223857625 3.72385763,5.07265313e-17 4,0 C4.27614237,-5.07265313e-17 4.5,0.223857625 4.5,0.5 L4.5,1.5 L11.5,1.5 L11.5,0.5 C11.5,0.223857625 11.7238576,5.07265313e-17 12,0 Z M15,6 L1,6 L1,12 C1,12.5522847 1.44771525,13 2,13 L14,13 C14.5522847,13 15,12.5522847 15,12 L15,6 Z M3.5,2.5 L2,2.5 C1.44771525,2.5 1,2.94771525 1,3.5 L1,5 L15,5 L15,3.5 C15,2.94771525 14.5522847,2.5 14,2.5 L12.5,2.5 L12.5,3.5 C12.5,3.77614237 12.2761424,4 12,4 C11.7238576,4 11.5,3.77614237 11.5,3.5 L11.5,2.5 L4.5,2.5 L4.5,3.5 C4.5,3.77614237 4.27614237,4 4,4 C3.72385763,4 3.5,3.77614237 3.5,3.5 L3.5,2.5 Z"></path></svg>');
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content p.detail.location:before {
    mask-image: url('data:image/svg+xml,<svg width="12px" height="15.3326004px" viewBox="0 0 12 15.3326004" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="%23000000"><path d="M6,1.82964754e-13 C9.3137085,1.82964754e-13 12,2.6862915 12,6 C12,8.01983046 10.3280867,10.9794386 6.9842602,14.8788245 C6.94320831,14.9295815 6.89700369,14.9757861 6.84752606,15.0183259 C6.30311238,15.4864016 5.48232755,15.4245175 5.01425183,14.8801038 C1.67191327,10.9794386 0,8.01983046 0,6 C0,2.6862915 2.6862915,1.82964754e-13 6,1.82964754e-13 Z M6,1 C3.23857625,1 1,3.23857625 1,6 C1,7.84094917 2.66666667,10.6076158 6,14.3 C9.33333333,10.6076158 11,7.84094917 11,6 C11,3.23857625 8.76142375,1 6,1 Z M6,3 C7.65685425,3 9,4.34314575 9,6 C9,7.65685425 7.65685425,9 6,9 C4.34314575,9 3,7.65685425 3,6 C3,4.34314575 4.34314575,3 6,3 Z M6,4 C4.8954305,4 4,4.8954305 4,6 C4,7.1045695 4.8954305,8 6,8 C7.1045695,8 8,7.1045695 8,6 C8,4.8954305 7.1045695,4 6,4 Z"></path></g></svg>');
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item .item-content a.button-like {
    margin: 10px 0 0 0;
}
/*.full-segment.green-variant#for_you_segment .segment-content-row .component-item.book-list .booklist-books {*/
/*    height: 251px;*/
/*    display: flex;*/
/*    gap: 7px;*/
/*    flex-wrap: wrap;*/
/*}*/
.full-segment.green-variant#for_you_segment .segment-content-row .component-item.book-list .booklist-books .book {
    width: calc((100% - 14px) / 3);
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item.book-list .booklist-books .book.blank {
    background-color: var(--theme-secondary-color-3);
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item.quicklinks .quicklinks-paths {
    display: flex;
    flex-direction: column;
    gap: 11px;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item.quicklinks .quicklinks-paths a {
    margin: 0;
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item.quicklinks .quicklinks-paths a:after {
    background-color: var(--font-body-color);
}
.full-segment.green-variant#for_you_segment .segment-content-row .component-item.quicklinks .quicklinks-paths svg {
    margin-left: 5px;
    fill: var(--font-body-color);
}
.full-segment.green-variant#booklists_segment .segment-content-row {
    padding: 50px 40px 50px 50px;
}
.full-segment.green-variant#booklists_segment .segment-content-row .content-elem {
    padding: 0 35px 0 0;
}
.full-segment.green-variant#booklists_segment .segment-content-row .swiper {
    padding: 0;
}
.full-segment.green-variant#booklists_segment .segment-content-row .swiper-button-prev, .full-segment.green-variant#booklists_segment .segment-content-row .swiper-button-next {
    height: calc((100% - 15px) / 2);
    left: unset;
    right: -40px;
    background-image: unset;
}
.full-segment.green-variant#booklists_segment .segment-content-row .swiper .book-list {
    width: 100%;
}
.full-segment.green-variant#booklists_segment .segment-content-row .swiper-button-prev {
    top: unset;
    bottom: 0;
    transform: rotate(180deg);
}
.full-segment.green-variant#booklists_segment .segment-content-row .swiper-button-prev:after, .full-segment.green-variant#booklists_segment .segment-content-row .swiper-button-next:after {
    transform: unset;
    top: unset;
    bottom: 0;
}

.full-segment.green-variant .segment-content-row .swiper-button-prev:after, .full-segment.green-variant .segment-content-row .swiper-button-next:after {
    background-color: transparent;
}

.full-segment.green-variant#booklists_segment .segment-content-row .swiper-button-prev:before, .full-segment.green-variant#booklists_segment .segment-content-row .swiper-button-next:before {
    transform: translateX(-50%);
    top: unset;
    bottom: 11.5px;
}
.full-segment.green-variant#booklists_segment .book-list .book-list-books {
    margin-bottom: 15px;
}
.full-segment.green-variant#booklists_segment .book-list .h3-like {
    margin: 15px 0 11px 0;
}
.full-segment.green-variant#booklists_segment .book-list p {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    opacity: .7;
}
.full-segment.green-variant#booklists_segment .book-list p:not(:first-of-type) {
    display: none;
}
.full-segment.green-variant#booklists_segment .book-list .button-like {
    margin-top: 13px;
}
.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 .button-like.primary {
    margin: 23px 0 0 19px;
}
/* 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.green-variant.has-skeleton .segment-heading-row:after {
    border-radius: 0 58px 0 0;
}
.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;
}
/* 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;
}
/* "perks" */

/* 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);*/
    width: 100%;
    margin: 0;
    padding: 0 20px;
    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: 35px;
    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: 8px;
    height: 12px;
    mask-image: url('data:image/svg+xml,<svg width="7px" height="12px" viewBox="0 0 7 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="0 1 1 0 7 6 1 12 0 11 5 6"></polygon></svg>');
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    background-color: var(--theme-primary-color-2);
    display: block;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    z-index: 10;
    transition: opacity .3s;
}
.slider-container .swiper-button-prev:before {
    transform: translate(-50%,-50%) scaleX(-1);
}
.slider-container .swiper-button-prev:after, .slider-container .swiper-button-next:after {
    content: "";
    width: 33px;
    height: 33px;
    background-color: var(--select-bg-color);
    border: .5px solid var(--font-link-color);
    display: block;
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    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 {
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 9px;
}
.swiper .swiper-pagination .swiper-pagination-bullet {
    border: 1px solid transparent;
    border-color: var(--swiper-pagination-bullet-border-color);
    width: 12px;
    height: 12px;
}

/* 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;
}
/* filters container */
.discover-filters {
    position: relative;
    margin: 25px 0 35px 0;
    --font-header-5: normal 500 16px/21px "Bricolage Grotesque", sans-serif;
    --font-body: normal 400 14px/14px "Barlow", sans-serif;
}
.discover-filters .current-filters {
    padding: 18px 20px 19px 20px;
    background-color: var(--theme-secondary-color-5);
    border: .5px solid var(--primary-border-color);
    list-style: none;
    display: flex;
    align-items: center;
    gap: 13px;
    position: relative;
}
.discover-filters .current-filters .h3-like {
    width: fit-content;
    margin: 0;
    text-decoration: none;
    cursor: pointer;
}
.discover-filters .current-filters .tagged-list {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.discover-filters .current-filters .tagged-list .tag {
    background-color: var(--body-bg-color);
    border: .5px solid var(--theme-primary-color-2);
    cursor: pointer;
}
.discover-filters .current-filters .tagged-list .tag a {
    display: block;
    position: relative;
    font: var(--font-body);
    text-decoration: none;
    padding: 5px 8px 6px 25px;
}
.discover-filters .current-filters .tagged-list .tag a:before {
    content: '';
    width: 12px;
    height: 12px;
    background-color: var(--font-link-color);
    top: 7px;
    left: 8px;
    position: absolute;
    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%);
}
.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: 30px;
    height: 30px;
    border: .5px solid var(--theme-primary-color-2);
    display: inline-block;
    position: relative;
    cursor: pointer;
    border-radius: 0;
    padding: unset;
}
.discover-filters .current-filters .expand-filters:before {
    content: "";
    width: 10px;
    height: 6px;
    mask-image: url('data:image/svg+xml,<svg width="9px" height="5px" viewBox="0 0 9 5" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g fill="%23095F92"><polygon points="-2.49800181e-16 0.5 0.5 0 4.5 4 8.5 0 9 0.5 4.5 5"></polygon></g></g></svg>');
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    background-color: var(--theme-primary-color-2);
    
    position: absolute;
    top: calc(50% - 3px);
    left: calc(50% - 5px);
    transition: transform .3s;
}
.discover-filters.expanded .current-filters .expand-filters:before {
    transform: rotate(180deg);
}


.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 {
    padding: 20px;
    background-color: var(--select-bg-color);
    border: .5px solid var(--secondary-border-color);
    display: none;
    border-top: unset;
    position: relative;
    transition: margin .5s, opacity .5s, max-height .5s;
}
.discover-filters.expanded .expandable-section {
    width: 100%;
    margin-top: 0;
    max-height: 300px;
    opacity: 1;
    display: block;
    pointer-events: all;
}
.discover-filters .tags {
    max-height: 243px;
    display: flex;
    gap: 19px;
    flex-direction: column;
    position: relative;
    overflow: auto;
}
.discover-filters.blogs .tags {
    max-height: 220px;
    /*margin-bottom: 25px;*/
    /*position: relative;*/
    /*overflow: hidden;*/
}
.discover-filters.blogs .tags:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 10px;
    bottom: 0;
    left: 0;
    background: linear-gradient(0deg, var(--select-bg-color) 0%, rgba(232, 237, 242, 0) 100%);
    z-index: 1;
}
.discover-filters.blogs .tags-container {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 19px;
    overflow: auto;
    padding-bottom: 10px;
}
.discover-filters .tags .tag-list {
    position: relative;
    flex: 1 1 0px;
}
.discover-filters.blogs .tags .tag-list.branches {
    flex: 2 1 0px;
}
.discover-filters .dates h3 {
    margin: 0;
}
.discover-filters .dates .after-before, .discover-filters .dates .after-before label {
    display: flex;
    align-items: center;
    gap: 10px;
}
.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-link-color); /* replaces existing css */
    position: absolute;
    top: 8px;
    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: 6px 8px 7px 25px; /* replaces existing css */
    display: flex;
    color: var(--font-link-color);
    font: var(--font-body);
    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 .tags .tag-list .h4-like {
    margin: 0 0 11px 0;
}
.discover-filters .tag-scroll {
    max-height: 221px;
    /*overflow: scroll;*/
    overflow-y: auto;
    overflow-x: hidden;
}
.discover-filters.blogs .tag-scroll {
    padding-bottom: 0px;
}
.eresources-section .discover-filters .tag-scroll {
    max-height: 131px;
}
.discover-filters ul li:last-child {
    padding: 0;
}
.tag-list .filter {
    padding: 2px 0;
    align-items: unset;
    justify-content: unset;
}
.discover-filters ul {
    margin: 0;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}
.discover-filters ul li {
    padding: 0;
    margin: 0;
}
.discover-filters ul li:before {
    content: unset;
}
.discover-filters ul li label {
    padding: 7px 8px;
    background-color: var(--select-bg-color);
    color: var(--theme-primary-color-2);
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    position: relative;
}
.discover-filters ul li label:before {
    content: "";
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border: .5px solid var(--theme-primary-color-2);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}
.discover-filters ul.letters-list li label {
    border-radius: 0;
    padding-right: 2px;
}
.discover-filters ul.letters-list li label:has( input:checked) {
    border-bottom: 2px solid var(--theme-primary-color-2);
    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 rgba(var(--theme-primary-color-2-rgb),.5);
    /*top: 10px;*/
    /*left: 8px;*/
    /*position: absolute;*/
}
.discover-filters ul li label input:checked ~ .checkmark {
    background-color: var(--theme-secondary-color-4);
}
.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 4.5px 1px;
}
.discover-filters ul li label .checkmark svg g {
    fill: transparent;
}

/* place .pagination styles here */
.content-pagination {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 56px;
}
.all-books .content-pagination {
width: 100%;
}
.content-pagination.hide {
    display: none;
}
.content-pagination > * {
    font: normal 400 16px/23px 'Bricolage Grotesque', sans-serif;
    color: var(--font-link-color);
    opacity: .5;
    min-width: 14px;
    text-align: center;
    text-decoration: none;
}
.content-pagination a.active {
    opacity: 1;
    font-weight: 700;
}
.content-pagination a.link-prev, .content-pagination a.link-next {
    position: relative;
    display: block;
    width: 35px;
    height: 35px;
    background-color: var(--body-bg-color);
    border: 1px solid rgba(var(--theme-primary-color-2-rgb),.5);
    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: 8px;
    height: 12px;
    left: 50%;
    top: 50%;
    mask-image: url('data:image/svg+xml,<svg width="7px" height="12px" viewBox="0 0 7 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="0 1 1 0 7 6 1 12 0 11 5 6"></polygon></svg>');
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
    background-color: rgba(var(--theme-primary-color-2-rgb),.5);
    transform: translate(-50%,-50%) rotate(180deg);
}

/* 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 15px 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 6px 0;
    padding: 0 0 2px 0;
    color: var(--font-body-alt-color);
    font: var(--font-materials-header);
    text-decoration: underline;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color .3s;
}
.material-item:hover .item-heading {
    color: var(--font-link-color);
}
.material-item .item-author {
    width: 100%;
    max-height: 34px;
    font: var(--font-full-segment-author);
    text-align: center;
    opacity: .7;
    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;
    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;*/
    gap: 30px;
    justify-content: flex-start;
}
.events-list li {
    flex: 1;
    background-color: var(--theme-secondary-color-4);
    border-radius: 0 50px 0 0;
}
.events-list li .details-media {
    width: 100%;
    aspect-ratio: 1 / 1;
    height: auto;
    border-radius: 0 50px 0 0;
    background-size: cover;
    background-position: center;
}
.events-list li .details-content {
    padding: 25px;
}
.events-list li .details-content h3 {
    margin: 0 0 7px 0;
}
.events-list li .details-content p {
    margin: 7px 0 15px 0;
}
/* override base styles */
.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: .7;*/
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.events-list .event-item {
    width: calc((100% - 60px) / 3);
    /*color: var(--font-body-intro-color);*/
    text-decoration: none;
    display: flex;
    column-gap: 18px;
    align-items: flex-start;
    position: relative;
    flex-direction: column;
    gap: 20px;
}
.events-list .event-item .item-image {
    width: 100%;
    aspect-ratio: 1/1;
    height: auto;
    background-size: cover;
    background-position: center;
    /*margin-bottom: 20px;*/
}
.events-list .event-item .item-date {
    width: 52px;
    height: 52px;
    border: 1px solid var(--theme-default-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(--theme-default-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 {
    position: relative;
}
.events-list .event-item .item-content .details {
    font: var(--font-event-list-details);
    margin: 12px 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.events-list .event-item .item-content .button-like.secondary {
    margin: 20px 0 0 0;
}
.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 .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: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 25px;
    
    /* 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 {
    display: block;
    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;
}
.book-item {
    width: 100%;
    padding: 15px;
    background-color: rgba(var(--theme-primary-color-4),.19);
    text-decoration: none;
    position: relative;
}
.book-item.unclickable {
    cursor: initial;
}
.book-item .item-cover {
    width: 100%;
    aspect-ratio: 0.69 / 1;
    position: relative;
    transition: box-shadow .2s, transform .2s;
}
.book-item .item-cover p {/* override base styles */
    
}
.book-item .item-cover .cover-media {
    width: 100%;
    height: 100%;
    display: block;
}
.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 */
.book-item .item-cover.flippable .cover-media {
    position: relative;
    transition: transform .2s;
}
.book-item .item-cover.flippable:hover .cover-media {
    transform: scaleX(-1);
    transition: transform .3s;
}
.book-item .item-cover.flippable .cover-details {
    width: 100%;
    height: 100%;
    background-color: var(--theme-secondary-color-3);
    padding: 17px 14px;
    opacity: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transform: scaleX(-1);
    transition: opacity .2s, transform .2s;
    pointer-events: none;
}
.book-item .item-cover.flippable:hover .cover-details {
    opacity: 1;
    transform: scaleX(1);
    transition: opacity .3s .1s, transform .3s;
    pointer-events: all;
}
.book-item .item-cover.flippable .cover-details p {
    max-height: 100%;
    position: relative;
    overflow-y: auto;
    font-weight: 300;
    overflow-wrap: break-word;
}
.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;
}
.book-item .item-cover.flippable .cover-details:before {
    background-image: linear-gradient(to bottom, var(--theme-secondary-color-3) 0%, transparent 100%); /* TODO */
    top: 0;
}
.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 {
    width: calc((100% - 76px) / 3);
}
.most-recent .book-list:nth-child(-n + 2) {
    width: calc((100% - 38px) / 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 19px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-start;
}
.most-recent .book-list:nth-child(-n + 2) .book-list-books {
    gap: 15px;
}
.most-recent .book-list:nth-child(-n + 2) .book-list-books .book {
    flex-basis: calc((100% - 30px) / 3);
}
.book-list .book-list-books .book {
    position: relative;
    flex-basis: calc((100% - 24px) / 3);
    aspect-ratio: 1/1.48;
    height: auto;
    transform: scale(1);
    transform-origin: 50% 50%;
    transition: transform .2s;
    z-index: 1;
}
.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-color: var(--button-secondary-bg-color);
    opacity: 0.3;
    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: 100%; */
/* height: 100%; */
padding: 5px;
background-color: var(--theme-secondary-color-4);
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;


    width: calc(100% + 1px); /* replaces existing css */
    height: calc(100% + 1px); /* replaces existing css */
    top: -.5px; /* replaces existing css */
    left: -.5px; /* replaces existing css */
}
.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-like {
    margin: 0 0 14px 0;
}
.book-list .h4-like {
    margin: 0 0 18px 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: 29px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.featured-filter h2 {
    margin: 0;
}
.featured-filter label {
    position: relative;
    font: var(--font-select);
    color: var(--theme-primary-color-2);
}
/*.featured-filter label:before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    width: 10px;*/
/*    height: 6px;*/
/*    right: 10px;*/
/*    top: calc(50% - 3px);*/
/*    z-index: 1;*/
/*    mask-image: url('data:image/svg+xml,<svg width="10px" height="6px" viewBox="0 0 10 6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="1 0 0 1 5 6 10 1 9 0 5 4"></polygon></svg>');*/
/*    background-color: var(--font-link-color);*/
/*}*/
.featured-filter label select {
    border: .5px solid var(--theme-primary-color-2);
    font: var(--font-select);
    color: var(--theme-primary-color-2);
    margin: 0 0 0 8px;
    padding: 5px 25px 6px 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('data:image/svg+xml,<svg width="10px" height="6px" viewBox="0 0 10 6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="%23095F92"><polygon transform="translate(5, 3) rotate(90) translate(-5, -3)" points="3 -2 8 3 3 8 2 7 6 3 2 -1"></polygon></g></svg>');
}

/* book lists */
.book-lists {
display: none;
}
.book-lists.featured.active {
display: block;
}
.book-lists .featured-filter {
    align-items: center;
}
.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: 38px;
    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 .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 {
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: 35px;
    --font-header-5: normal 500 16px/21px "Bricolage Grotesque", sans-serif;
}
.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 {
    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 {
    margin: 0;
}


.eresources-section {
    width: 100%;
}
/* eresrouces overlay */
.main-content:has( #eresource_overlay), .page-body:has( #eresource_overlay), #eresource_overlay {
    z-index: 100;
}
.eresources-section .eresource-overlay {
    --font-body: normal 400 16px/23px "Barlow", sans-serif;
    position: fixed;
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
}
.eresources-section .eresource-overlay .clickable-background {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--select-bg-color);
    border: unset;
    border-radius: 0;
    opacity: .75;
    cursor: pointer;
    z-index: -1;
}
.eresources-section .eresource-overlay .container {
    position: absolute;
    max-width: 800px;
    max-height: calc(100% - 60px);
    width: calc(100% - 60px);
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    background-color: var(--theme-secondary-color-4);
    border-radius: 50px 0 0 0;
    padding: 37px 40px;
    overflow: auto;
}
.eresources-section .eresource-overlay .container .close {
    position: absolute;
    top: 37px;
    right: 40px;
    cursor: pointer;
    padding: unset;
    border: unset;
}
.eresources-section .eresource-overlay .container .close:hover {
    background-color: unset;
}
.eresources-section .eresource-overlay .container .close svg g {
    fill: var(--font-body-color);
}
.eresources-section .eresource-overlay .container .content .eresource-name {
    display: block;
    margin: 0 0 10px 0;
}
.eresources-section .eresource-overlay .container .content .main {
    display: flex;
    gap: 25px;
}
.eresources-section .eresource-overlay .container .content .main .main-image {
    min-width: 250px;
    max-width: 50%;
    background-color: #FFFFFF;
    position: relative;
}
.eresources-section .eresource-overlay .container .content .main .main-image img {
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    max-width: calc(100% - 20px);
    max-height: calc(100% - 20px);
}
.eresources-section .eresource-overlay .container .content .main .description-button .eresource-description {
    margin-top: 0;
}
.eresources-section .eresource-overlay .container .content .eresource-media.default {
    display: block;
    aspect-ratio: 30/19;
    width: 300px;
    max-width: 100%;
    height: auto;
}
.eresources-section .eresource-overlay .container .content .related-container {
    margin-top: 30px;
}
.eresources-section .eresource-overlay .container .content .related-container .h3-like {
    display: block;
}
.eresources-section .eresource-overlay .container .content .related-eresources {
    display: flex;
    /*grid-template-columns: repeat(3, 1fr);*/
    gap: 15px;
}
.eresources-section .eresource-overlay .container .content .related-eresources .related {
    width: calc((100% - 30px) / 3);
}
.eresources-section .eresource-overlay .container .content .related-eresources .related .image {
    position: relative;
    width: 100%;
    aspect-ratio: 2/1;
    height: auto;
    background-color: #FFFFFF;
}
.eresources-section .eresource-overlay .container .content .related-eresources .related .image img {
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    max-width: calc(100% - 20px);
    max-height: calc(100% - 20px);
}
.eresources-section .eresource-overlay .container .content .related-eresources .eresource-name {
    margin: 10px 0 5px 0;
}
.eresources-section .eresource-overlay .container .content .related-eresources p {
    margin: 5px 0 10px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.eresources-section .filters {
    background-color: var(--body-bg-color);
    border-radius: 34px;
    border: 1px solid var(--brand-border-color);
    padding: 20px 30px;
    margin-top: 25px;
}
.eresources-section .eresource-types {
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    gap: 15px 25px;
    margin: 0 0 20px 0;
}
.eresources-section .eresource-types li {
margin: 0; 
position: relative;
padding: 0;
}
.eresources-section .eresource-types li:before {
display: none;
}
.eresources-section .eresource-types li a {
background-color: transparent;
color: var(--font-link-color);
font-size: 14px;
line-height: 14px;
font-weight: 400;
text-decoration: none;
cursor: pointer;
padding-left: 20px;
position: relative;
}
.eresources .eresources-section .eresource-types li a {
padding-left: 0;
}
.page-content .body .booklists .column-two {
margin-top: 25px;
width: unset;
}
/* global styles for eresources; mainly used on the eresources page */
.eresources-section .eresource-types li a svg {
position: absolute;
left: 0;
top: 0;
}
.eresources-section .eresource-types li a:hover, .eresources-section .eresource-types li.active a {
border-bottom: 2px solid var(--filter-underline-color);
}
.eresources-section .eresource-types li a:after {
display: none;
}
.eresources-section .eresource-types li.active a {
pointer-events: none;
}
.eresources-section .letters-list {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    gap: unset;
}
.eresources-section .letters-list li {
margin: 0;
padding: 0;
opacity: .25;
pointer-events: none;
}
.eresources-section .letters-list li.active {
opacity: 1;
pointer-events: all;
}
.eresources-section .letters-list li:last-of-type {
margin: 0;
}
.eresources-section .letters-list li:before {
display: none;
}
.eresources-section .letters-list li label {
    display: block;
    padding: 0;
    background-color: transparent;
    border: unset;
    font: var(--font-button);
    font-weight: 500;
    text-transform: uppercase;
}
.eresources-section .letters-list li label:before {
    content: unset;
}
.eresources-section .letters-list li label .checkmark {
width: 100%;
height: 100%;
top: 0;
left: 0;
opacity: 0;
}
.eresources-section .letters-list li.active a {
opacity: 1;
pointer-events: all;
}
.eresources-section .letters-list li a:hover, .eresources-section .letters-list li.toggled a {
color: var(--power-color-3);
}
.eresources-section .letters-list li a:after {
display: none;
}
.eresources-section .eresource-entities {
    --font-body: normal 400 16px/23px "Barlow", sans-serif;
    width: 100%;
    display: none;
    flex-wrap: wrap;
    gap: 25px;
}
.eresources-section .eresource-entities.active {
display: flex;
}
.eresources-section .eresource-entities .eresource {
    width: calc((100% - 50px) / 3);
    padding: 35px;
    background-color: var(--theme-secondary-color-4);
    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;
    height: auto;
    background-size: calc(100% - 20px);
    background-repeat: no-repeat;
    background-position: center;
    aspect-ratio: 30/19.1;
    background-color: #FFFFFF;
}
.eresources-section .eresource-entities .eresource .eresource-media.default {
    background-image: url('/content/_site_images/icon_placeholder-mark-eresources.svg');
}
.eresources-section .eresource-entities .eresource .eresource-media.placeholder.default {
background-size: auto;
}
.eresources-section .eresource-entities .eresource .eresource-media.placeholder {
display: block;
width: 100%;
height: auto;
}
.eresources-section .eresource-entities .eresource .eresource-name {
    text-decoration: none;
    width: 100%;
    margin: 17px 0 10px 0;
    font: var(--font-header-5);
}
.eresources-section .eresource-entities .eresource .eresource-buttons {
display: flex;
flex-wrap: wrap;
gap: 5px;
padding: 0;
}
.eresources-section .eresource-entities .eresource .eresource-buttons a {
    margin: 0;
}
.eresources-section .eresource-entities .eresource .eresource-description {
    width: 100%;
    padding: 0;
    margin: 0 0 15px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    display: -moz-box;
}
.eresources-section .eresource-entities p.no-results {
display: none;
}
.eresources-section .eresource-entities p.no-results.show {
display: inline-block;
}

/* global styles for blogs; mainly used on the blog page */
.blog-post .body {
width: calc(100% - 400px);
margin-top: 69px;
}
.blog-post .page-body {
    margin: 0 60px;
    width: calc(100% - 480px);
}
.blog-post h1 {
    margin-top: 68px;
}
.blog-posts {
width: 100%;
}
.blog-posts.landing-page {
    margin: 0;
}
.blog-posts.landing-page .discover-filters {
    margin-bottom: 60px;
}
.blog-posts .original-results.hide, .blog-posts .filtered-results.hide {
    display: none;
}
.blog-posts .post {
    width: 100%;
    margin: 0 0 50px 0;
    display: flex;
    align-items: center;
    background-color: var(--theme-secondary-color-4);
    text-decoration: none;
    color: var(--font-body-color);
}
.blog-post-label, .blog-info .date {
opacity: 1;
letter-spacing: 0.2px;
font: var(--paragraph-font);
}
.blog-post-blurb {
letter-spacing: 0.2px;
opacity: 1;
-webkit-font-smoothing: antialiased;
}
.blog-posts .post .post-media {
    width: 50%;
    aspect-ratio: 1/1;
    height: auto;
    max-height: 100%;
    margin: 0;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center;
    display: block;
    position: relative;
}
.blog-posts .post .post-media .media {
    width: 100%;
    height: 100%;
    background: no-repeat top center;
    background-size: cover;
    display: block;
}
.blog-posts .post .post-media.placeholder {
    background-color: var(--power-color-1);
    background-image: url(/content/_theme_images/logo_wht.svg);
    background-position: center;
    background-size: 40%;
    width: 50%;
    border-radius: 5px;
}
.blog-posts .post .post-content {
    width: 50%;
    padding: 57px;
}
.blog-posts.recommended-reads .post .post-media {
width: calc(50% - 100px);
}
.blog-posts.recommended-reads .post .post-media .media {
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.blog-posts.recommended-reads .post .post-content {
width: calc(50% + 100px);
}
.blog-posts .post .post-title {
    margin: 0 0 15px 0;
    display: block;
    font: var(--font-header-2);
    color: var(--font-body-color);
    text-decoration: none;
}
.blog-posts .post .post-info {
    margin: 15px 0 0 0;
    display: flex;
    flex-direction: column;
}
.blog-posts .post .post-info span {
    position: relative;
    font: var(--font-event-list-details);
    padding: 0;
    margin: 0;
    display: flex;
    gap: 6px;
    align-items: center;
}
.blog-posts .post .post-info span svg {
    fill: var(--font-body-color);
    opacity: .48;
}
.blog-posts .post .post-info span.author:before {
    background-image: url('/content/_theme_images/icon_pen.svg');
}
.blog-posts .post .post-description {
    margin: 10px 0 15px 0;
    font: var(--font-body);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.blog-posts .post .button-like.third-about {
width: 100%;
}
.blog-posts .post .post-about {
    width: 100%;
    max-width: 250px;
    margin: 0 0 10px 15px;
    padding: 21px 25px 16px 25px;
    background-color: var(--theme-secondary-color-3);
    border-radius: 0 50px 0 0;
    float: right;
    position: relative;
}
.blog-posts .post .post-about .h4-like {
    display: block;
    margin: 0 0 14px 0;
}
.blog-posts .post .post-about .author, .blog-posts .post .post-about .date {
    position: relative;
    margin-top: 5px;
    padding: 0 0 0 20px;
    font: var(--font-body-attribution);
}
.blog-posts .post .post-about .author a, .blog-posts .post .post-about .date a {
    font: var(--font-body-attribution);
}
.blog-posts .post .post-about .author svg {
    position: absolute;
    left: 0;
    top: 2px;
    fill: var(--font-body-color);
}
.blog-posts .post .post-about .author a {
    font-weight: 400;
}
.blog-posts .post .post-about .date:before {
    background-image: url('/content/_theme_images/icon_calendar.svg');
}
.blog-posts .post .post-about .tags {
    margin: 12px 0 0 0;
}
.blog-posts .post .post-about .tags ul.tag-list {
    width: 100%;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}
.blog-posts .post .post-about .tags ul.tag-list li {
    margin: 0 7px 7px 0;
    padding: 0;
}
.blog-posts .post .post-about .tags ul.tag-list li:before {
    display: none;
}
.blog-posts .post .post-about .tags ul.tag-list li a.tag {
    text-decoration: none;
    display: inline-block;
    font: var(--font-full-segment-filter-item);
    color: var(--font-link-color);
    padding: 3.5px 6px;
    /*border: .5px solid rgba(0,0,0,.44);*/
    border: .5px solid var(--theme-primary-color-2);
}
.blog-posts .post .post-about .tags ul.tag-list li a.tag:hover {
    background-color: rgba(var(--theme-primary-color-4),.36);
}
.blog-posts .post .post-about .tags ul.tag-list li a.tag:after {
    display: none;
}
.blog-posts .post p:first-of-type {
    margin-top: 0;
}
/* - odd edits - */
.blog-posts .post:nth-child(2n) {
    flex-direction: row-reverse;
}
/* - first of type edits - */
.blog-posts .post.first {
margin: 0 0 50px 0;
display: block;
}
.blog-posts .post.first .post-media {
max-width: none;
height: 350px;
width: 100%;
margin: 0;
}
.blog-posts .post.first .post-content {
width: 100%;
}
.blog-posts .post.first .post-title {
margin: 14px 0 0 0;
font: var(--primary-header-font);
color: var(--header-1);
}
/* - main edits - */
.blog-posts .post.main {
    background-color: transparent;
}
.blog-posts .post.main .post-media {
width: 350px;
position: absolute;
left: -400px;
top: 5px;
}
.blog-posts .post.main .post-content {
    margin: 0;
    padding: 0;
    width: 100%;
}
/* - blog filters - */
.blog-posts .post.hide {
display: none;
}
/* - blog tags / blog authors - */
.blog-tag .left-sidebar {
max-width: 250px;
}
.blog-tag .body {
width: calc(100% - 320px);
}
/* - blog post page - */
.blog-post .alignright, .fusion-alignright {/* from previous site - things for the old wordpress import */
    display: inline;
    float: right;
    margin: 15px 0 15px 15px;
}

.blog-post .blog-posts .post .post-about .author a, .blog-posts .post .post-about .date a {
color: var(--font-offset-color);
}
.blog-post .blog-posts p.no-results.hide {
display: none;
}
.blog-post .related-posts .posts-list {
display: flex;
gap: 30px;
}
.blog-post .related-posts .posts-list .post {
margin: 0;
padding: 0;
flex-direction: column;
gap: 0;
}
.blog-post .related-posts .posts-list .post:before {
content: unset;
}
.blog-post .related-posts .posts-list .post .img {
width: 100%;
height: 200px;
border-radius: 40px 40px 0 0;
}
.blog-post .related-posts .posts-list .post .text {
background-color: var(--body-bg-color);
border: 1px solid var(--brand-border-color);
border-top: unset;
border-radius: 0 0 40px 40px;
padding: 20px 20px 30px 20px;
}
.blog-post .related-posts .posts-list .post .text h3 {
margin-bottom: 5px;
}
.blog-post .related-posts .posts-list .post .text .date {
display: flex;
gap: 5px;
}

/* Staff List; shows the staff item(s) in it's respective `subtype` */
.staff-segment {
    display: flex;
    flex-direction: column;
    margin-top: 55px;
}
.staff-segment .staff-items {
    margin: 120px 50px 60px 50px;
    --font-subheader: normal 400 12px/15px "Barlow", sans-serif;
    --font-body: normal 300 14px/17px "Barlow", sans-serif;
}
.staff-segment .staff-items.split-alt {
    display: flex;
    margin: 0 0 60px 0;
}
.staff-segment .staff-items .staff-heading {
    text-align: center;
    margin-bottom: 27px;
}
.staff-segment .staff-items.split-alt .staff-heading {
    text-align: unset;
    margin: 0;
    width: 265px;
    background-color: rgba(var(--theme-primary-color-4), .19);
    border: .5px solid var(--primary-border-color);
    border-radius: 0 57px 0 0;
    padding: 53px 36px;
}
.staff-segment .staff-items.split-alt .staff-heading h2 {
    margin: 0;
    text-decoration: underline;
    width: 175px;
}
.staff-segment .staff-items.split-alt .staff-heading h2:after {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: var(--theme-primary-color-1);
    border-radius: 100%;
    margin-left: 5px;
}
.staff-segment .staff-items .staff-content {
    display: flex;
    flex-wrap: wrap;
    gap: 40px 35px;
}
.staff-segment .staff-items.split-alt .staff-content {
    flex: 1;
    background-color: var(--theme-secondary-color-5);
    border: .5px solid var(--primary-border-color);
    border-radius: 57px 0 0 0;
    padding: 60px;
    gap: 35px;
}
.staff-segment .staff-items .staff-content .item {
    width: calc((100% - 70px) / 3);
}
.staff-segment .staff-items.split-alt .staff-content .item {
    width: calc((100% - 35px) / 2);
}
.staff-segment .staff-items .staff-content .item .item-media {
    display: block;
    width: 100%;
    aspect-ratio: 1/1;
    height: auto;
    background-size: cover;
    background-position: center;
}
.staff-segment .staff-items .staff-content .item h4, .staff-segment .staff-items .staff-content .item .h4-like {
    margin: 20px 0 3px 0;
}
.staff-segment .staff-items .staff-content .item .title {
    font: var(--font-subheader);
    text-transform: uppercase;
    letter-spacing: .5px;
    margin: 3px 0 10px 0;
}
.staff-segment .staff-items .staff-content .item .item-details {
    font: var(--font-body);
    margin: 3px 0;
}
.staff-segment .staff-items .staff-content .item .item-details .detail-icon {
    display: inline-block;
    width: 16px;
    margin-right: 5px;
}
.staff-segment .staff-items .staff-content .item .item-details .detail-icon svg path {
    fill: var(--font-body-color);
}
.staff-segment .staff-items .staff-content .item .button-like {
    margin: 11px 0 0 0;
}

.staff-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 28px;
    row-gap: 35px;
    
    /* override base variables */
    --font-header-5: normal 500 17px/22px "Bricolage Grotesque", sans-serif;
    --font-body: normal 400 14px/21px "Barlow", 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 13px 0;
    opacity: 0.5;
    color: var(--font-body-alt-color);
    letter-spacing: 0.25px;
}
.staff-list a.button-like.secondary {
    margin: 15px 0 0 0;
}
.staff-list .staff-item {
    width: calc(33% - 21px);
    position: relative;
    overflow: hidden;
}
.staff-list .staff-item .item-media {
    width: 100%;
    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);
    letter-spacing: initial;
    display: flex;
    column-gap: 3px;
    align-items: flex-start;
    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%;
    
    
}
.staff-component .overflow-segment .media-board {
    max-width: 450px;
    border-radius: 0 50px 0 0;
}
.staff-component .overflow-segment .media-board:before {
    border-radius: 0 50px 0 0;
}
.staff-component .full-segment {
    margin-top: 50px;
    width: 100%;
}
/* 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;
    font: var(--font-header-3);
}

.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;
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;
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;
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;
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: 10px;
}
.acc-container h2 {
    margin-bottom: 20px;
}
.acc-container details {
    margin-bottom: 15px;
}
.acc-container details summary {
    position: relative;
    padding: 11px 65px 11px 15px;
    background-color: var(--theme-secondary-color-5);
    border: .5px solid var(--primary-border-color);
    font: var(--font-acc-container);
    list-style: none;
    cursor: pointer;
}
.acc-container details summary:before, .acc-container details summary:after {
    content: '';
    position: absolute;
    width: 24px;
    height: 24px;
    transform: translateY(-50%);
    right: 15px;
    top: 50%;
}
.acc-container details summary:before {
    mask-image: url('data:image/svg+xml,<svg width="9px" height="5px" viewBox="0 0 9 5" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g fill="%23095F92"><polygon points="-2.49800181e-16 0.5 0.5 0 4.5 4 8.5 0 9 0.5 4.5 5"></polygon></g></g></svg>');
    mask-repeat: no-repeat;
    mask-size: 9px 5px;
    mask-position: center;
    background-color: var(--theme-primary-color-2);
    transition: transform .5s;
    opacity: .75;
    right: 16px;
    z-index: 1;
}
.acc-container details summary:after {
    border: .5px solid var(--theme-primary-color-2);
}
.acc-container details[open] summary:before {
    transform: translateY(-50%) rotate(180deg);
}
.acc-container details .details-content {
    padding: 15px 20px 21px 15px;
    background-color: var(--select-bg-color);
    border: .5px solid var(--secondary-border-color);
    border-top: unset;
}
.acc-container details .details-content > *:first-child {
    margin-top: 0;
}
.acc-container details .details-content > *:last-child {
    margin-bottom: 0;
}
/* -- Page Element: Tab Element -- */
.acc-container.tabs > *[role="tablist"] {
    display: flex;
}
.acc-container.tabs > *[role="tablist"] button {
    border-radius: 0;
    border: .5px solid var(--primary-border-color);
    border-bottom: unset;
    border-right: unset;
    font: var(--font-form-label);
    color: var(--font-header-color);
    padding: 13px 15px 15px 15px;
    text-align: left;
}
.acc-container.tabs > *[role="tablist"] button:last-child {
    border-right: 1px solid rgba(var(--theme-primary-color-2-rgb),.18);
}
.acc-container.tabs > *[role="tablist"] button[aria-selected="true"] {
    background-color: var(--theme-secondary-color-5);
}
.acc-container.tabs .tabpanel[role="tabpanel"] {
    background-color: var(--theme-secondary-color-5);
    border: .5px solid var(--primary-border-color);
    /*border-top: unset;*/
    padding: 25px 25px 28px 25px;
    display: none;
}
.acc-container.tabs .tabpanel[role="tabpanel"] article > *:first-child {
    margin-top: 0;
}
.acc-container.tabs .tabpanel[role="tabpanel"] article > *:last-child {
    margin-bottom: 0;
}
.acc-container.tabs .tabpanel:not(.is-hidden) {
    display: block;
}

/* -- Page Element: Alternating Image with Text; ... -- */
.alternate-image-text {
    margin-top: 100px;
}
.alternating-image-plus-text-block {
    display: flex;
    flex-flow: row-reverse;
    gap: 40px;
    margin-top: 20px;
}
.alternating-image-plus-text-block:first-of-type {
    margin-top: 35px;
}
.alternating-image-plus-text-block.left-alignment {
    flex-flow: row;
}
.alternating-image-plus-text-block>div {
    width: 55%;
    margin-left: 40px;
    align-self: center;
}
.alternating-image-plus-text-block>img {
    width: 330px;
    max-width: 50%;
    align-self: center;
}


.alternating-image-plus-text-block.right-alignment>div {
    margin-right: 40px;
    margin-left: 0px;
}
.alternating-image-plus-text-block>div h3 {
    margin-top: 0;
}
.alternating-image-plus-text-block > div, .alternating-image-plus-text-block.right-alignment > div {
    margin: 0;
}


/* -- Page Element: wysiwyg across; ...  -- */
.wysiwygs-across {
    width: 100%;
    margin: 100px 0 60px 0;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.wysiwygs-across h2 {
    margin: 0 0 34px 0;
}
.wysiwygs-across .wysiwyg h3 {
    margin-top: 0;
}
.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;
}
.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;
}
.gallery-wrapper .image-container .picrow:not(:first-of-type) {
    margin-top: -3px;
}
.picrow .photo-container {
    float: left;
    position: relative;
    overflow: hidden;
    margin-right: 0 !important;
}
.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: 480px;
    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;
    border-left: 10px solid var(--body-bg-color);
    border-right: 10px solid var(--body-bg-color);
}
.gallery-wrapper .gallery-arrow {
    position: absolute;
    top: calc(50% - 20px);
    left: 0px;
    bottom: 0px;
    cursor: pointer;
    height: 35px;
    width: 35px;
    padding: 0px 5px;
    z-index: 11;
    font-size: 40px;
    display: flex;
    color: inherit;
    align-items: center;
    margin: 0px;
    border-radius: 0;
    /*border: 1px solid var(--tag-border-color);*/
    border: .5px solid var(--theme-primary-color-2);
    background-color: var(--select-bg-color);
}
.gallery-wrapper .gallery-arrow.right {
    left: unset;
    right: 0px;
}
.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: 13px;
    color: var(--theme-primary-color-2);
    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%;
}
.gallery-wrapper .slider-preview-line {
    height: 80px;
    width:	calc(100% - 120px);
    max-width: 940px;
    margin: 15px 60px 0px 60px;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
}
.slider-preview-container .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;
    border-radius: 0;
}
.slider-preview-container .gallery-thumbnail:hover, .slider-preview-container .gallery-thumbnail.active {
    opacity: 1;
    transform: scale(1.1);
}
.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-wrapper .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;
}
.slider-preview-container {
    justify-content: center;
}

body .gallery-overlay {
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,.25);
    padding: 50px;
    top: 0px;
    left: 0px;
    z-index: 10000;
    cursor: pointer;
    display: none;
    justify-content: center;
    position: fixed;
}
body .gallery-overlay .gallery-overlay-bg {
    margin: 0;
    width: calc(100vw - 100px);
    height: calc(100vh - 100px);
    background-color: var(--select-bg-color);
    display: flex;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 100;
    transform: translate(-50%, -50%);
    border-radius: 70px 0 0 0;
}
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;
    padding: 85px 78px 25px 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 100;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow: scroll;
}
body .gallery-overlay figure figcaption {
    background-color: transparent;
    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 {
    display: inline-flex;
    vertical-align: middle;
    max-width: 100%;
    max-height: calc(100% - 50px);
    box-sizing: border-box;
}
body .gallery-overlay .close-button {
    width: auto;
    height: fit-content;
    margin: 0;
    padding: 0 0 0 14px;
    border: unset;
    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-link-color);
    position: relative;
    top: 45px;
    right: 50px;
    z-index: 100000;
}
body .gallery-overlay .close-button:before {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    top: 4px;
    left: 0px;
    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%);
    transform: unset;
}
body .gallery-overlay .close-button i {
    display: none;
}
.image-container > .picrow > .photo-container > figure > a > img {
/* margin: 0!important; */
}
body .gallery-overlay > .photo-caption > .caption, body .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;
    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;
}


.tournament-filters {
    width: 100%;
    margin: 0 0 15px 0;
}
.tournament-filters label {
    display: block;
}
.tournament-filters ul {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 8px;
    row-gap: 8px;
}
.tournament-filters ul li {
    margin: 0;
    padding: 0;
}
.tournament-filters ul li:before {
    display: none;
}
.tournament-list {
    width: 100%;
}
.tournament-list h3, .tournament-list .h3-like {
    margin: 0;
}
.tournament-list .tournament-item {
    width: 100%;
    margin: 0 0 25px 0;
    padding: 25px;
    padding-left: 40px;
    background-color: var(--theme-secondary-color-4);
    opacity: 0;
    transform: translateY(-10px);
    position: absolute;
    pointer-events: none;
    transition: none;
}
.tournament-list .tournament-item:last-of-type {
    margin: 0;
}
.tournament-list .tournament-item:before {
    content: "";
    width: 15px;
    height: 100%;
    
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
.tournament-list .tournament-item.show-item {
    opacity: 1;
    transform: translateY(0);
    position: relative;
    pointer-events: all;
    transition: opacity .3s, transform .3s;
}
.tournament-list .tournament-list-item {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.tournament-list .tournament-list-item:before {
    top: calc(50% - 6px);
}
.tournament-list .tournament-list-item:after {
    content: "";
    width: calc(100% - 35px);
    height: 2px;
    background: linear-gradient(to right, var(--font-body-color) 50%, rgba(255, 255, 255, 0) 0%) repeat-x bottom;
    background-size: 8px 2px;
    opacity: 0.65;
    display: block;
    position: absolute;
    top: calc(50% - 1px);
    left: 35px;
    z-index: 1;
}
.tournament-list .tournament-list-item .item-date {
    max-width: calc(100% - 300px);
    padding-right: 10px;
    background-color: var(--body-bg-color, #FCFCFC);
    display: block;
    position: relative;
    z-index: 5;
}
.tournament-list .tournament-list-item .item-buttons {
    padding-left: 10px;
    background-color: var(--body-bg-color, #FCFCFC);
    display: block;
    position: relative;
    z-index: 5;
}
.tournament-info {
    width: 100%;
    margin: 32px 0; 
    padding: 40px 37px;
    background-color: var(--theme-secondary-color-4);
}
/* override base styles */
.tournament-info h2, .tournament-info .h2-like {
    margin: 0 0 24px 0;
}
.tournament-info .info-lists {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.tournament-info .info-lists ul {
    width: calc(50% - 21px);
    margin: 0;
    padding: 0;
}
.tournament-info .info-lists ul li {
    margin: 0;
    padding: 15px 0;
    border-bottom: 1px solid var(--theme-default-color);
}
.tournament-info .info-lists ul li:first-of-type {
    padding-top: 0;
}
/*.tournament-info .info-lists ul:last-of-type li:last-of-type {*/
/*    border: none;*/
/*}*/
.tournament-info .info-lists ul li:before {
    display: none;
}
.tournament-datapoint {
    display: inline-block;
}
.tournament-datapoint:after {
    content: ", ";
    margin-left: -3px;
    display: inline-block;
}
.tournament-datapoint:last-of-type:after {
    content: unset;
}


/*---------------------------------- 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: 915px;
    margin: 0 auto 125px auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
    
    --preload-cover-bg-color: var(--theme-primary-color-3);
    --font-body: var(--font-body-attribution);
}
.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 p {
    margin: 0;
}
.full-bucket-segment .bucket-content {
    width: 100%;
    max-width: 415px;
}
.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: 455px;
    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 .bucket-media {
    max-width: 50%;
    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;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    pointer-events: none;
    transition: opacity .25s;
    display: none;
}
.alert-block.active {
    pointer-events: all;
    opacity: 1;
    display: block;
}
.alert-block.hidden {
    display: none;
}
.alert-block .alert-block-bkgd {
    width: 100%;
    height: 100%;
    background-color: #000000; /* TODO: find a variable? */
    opacity: 0.75;
    display: block;
}
.alert-block .alert-block-content {
    max-width: 720px;
    min-width: 720px;
    padding: 37px 40px;
    background-color: var(--theme-secondary-color-4);
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1000;
    transform: translate(-50%, -50%);
}
.alert-block .alert-block-content p {
    margin-bottom: 10px;
    font: var(--font-body);
}
.alert-block .alert-block-content ol {
    margin-bottom: 10px;
    padding: 0 0 0 35px;
}
.alert-block .alert-block-content .close-icon {
    position: absolute;
    top: 25px;
    right: 25px;
    display: flex;
    align-items: baseline;
    gap: 3px;
}
.alert-block .alert-block-content .close-icon svg g {
    fill: var(--font-body-color);
}
.alert-block .alert-block-content .button-like {
    margin-top: 10px;
}

/* Alert Block styling for different screen sizes */
@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%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 23px 18px;
    
    --font-body: normal 400 16px/21px "Barlow", sans-serif;
}
/* override base styles */
.lineage-container h4, .lineage-container .h4-like {
    margin: 0;
}
.lineage-container p {
    margin: 5px 0 15px 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.lineage-container button.secondary, .lineage-container a.button-like.secondary {
    margin: 0;
}
.lineage-container .lineage-item {}
.lineage-container .lineage-item .item-media {
    width: 100%;
    aspect-ratio: 1.57/1;
    height: auto;
    margin: 0 0 15px 0;
    background-repeat: no-repeat;
    display: block;
    position: relative;
}

.lineage-container .lineage-item .item-media.element-initialized:after {
    opacity: 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 {
    --font-subheader: normal 400 12px/15px "Barlow", sans-serif;
    
    width: 100%;
    margin: 100px 0 0 0;
    padding: 30px;
    background-color: var(--theme-secondary-color-3);
    border-radius: 0 50px 0 0;
    display: flex;
    align-items: flex-start;
    gap: 35px;
    align-items: center;
}
.bucket .h2-like {
    margin: 0 0 8px 0;
    font-size: 24px;
    line-height: 26px;
}
.bucket .subheader {
    margin-bottom: 10px;
    padding: 0;
    font: var(--font-subheader);
    letter-spacing: .5px;
    text-transform: uppercase;
    display: block;
    position: relative;
}
.bucket > .subheader {
    display: none;
}
.bucket .h4-like {
    margin: 0 0 8px 0;
    font: var(--font-context-navigation-heading);
    font-weight: 400;
}
.bucket p {
    font: var(--font-body-attribution);
    margin: 0 0 17px 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}
.bucket p.detail {
    margin: 0;
    display: flex;
    column-gap: 10px;
    align-items: center;
}
.bucket p.detail .detail-icon {
    width: 15px;
    height: 15px;
    display: inline-block;
}
.bucket.has-image .bucket-content {
    width: auto;
    flex: 1;
}
.bucket .bucket-media {
    max-width: 50%;
    display: none;
}
.bucket.has-image .bucket-media {
    width: 227px;
    aspect-ratio: 1/1;
    display: block;
    background-size: cover;
    background-position: center;
}
/* edits action version for the standard bucket */
.bucket.action p {
    margin-top: 0;
}
/* edits home version for the standard bucket */
.main-content.home .bucket.action {
    position: relative;
    max-width: 1180px;
    width: 100%;
    margin: auto;
    padding: 0 25px;
    background-color: transparent;
    border: none;
    border-radius: initial;
    display: flex;
    align-items: center;
    justify-content: center;
}
.main-content.home .bucket.action .h2-like {
    margin: 0 0 12px 0;
    font-size: 30px;
    line-height: 32px;
    position: relative;
    z-index: 10;
}
.main-content.home .bucket.action p {
    /*max-height: 42px;*/
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    position: relative;
    z-index: 10;
    overflow: hidden;
}
.main-content.home .bucket.action .bucket-media {
    width: 100%;
    max-width: 700px;
    height: auto;
    margin: 0;
    border: 0.4px solid var(--brand-border-color);
    border-radius: 5px;
    display: block;
    position: relative;
    z-index: 5;
}
.main-content.home .bucket.action .bucket-media.default {
    min-height: 455px;
}
.main-content.home .bucket.action .bucket-content {
    width: 100%;
    max-width: 246px;
    margin: 0px 0 0 70px;
    position: relative;
    z-index: 1;
}

/*.main-content.home .bucket.event {*/
/*    width: calc(100% - 30px);*/
/*    max-width: 1100px;*/
/*    margin: 30px auto 0 auto;*/
/*}*/

/* ride-sidebar */
.right-sidebar .bucket {
    width: 100%;
    margin: 0 0 25px 0;
    padding: 33px 25px 30px 25px;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    border-radius: 50px 0 0 0;
}
.right-sidebar .bucket > .subheader {
    display: block;
    display: flex;
    gap: 7px;
    align-items: center;
}
.right-sidebar .bucket > .subheader svg {
    fill: var(--font-body-color);
}
.right-sidebar .bucket .bucket-content {
    width: 100%;
}
.right-sidebar .bucket .bucket-content .subheader {
    display: none;
}
.right-sidebar .bucket .bucket-content .bucket-heading {
margin: 15px 0 5px 0;
}
.right-sidebar .bucket .bucket-media {
    margin: 0 0 10px 0;
    max-width: 100%;
}
/* 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);
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;
}

.right-sidebar {
    width: 100%;
    max-width: 215px;
    margin-right: 45px;
}
.right-sidebar .placeholder-item {
width: 100%;
height: 250px;
display: block;
}
.sidebar-item {
width: 100%;
box-sizing: border-box;
border-top: 1px solid var(--secondary-item);
margin-bottom: 50px;
}
.sidebar-item .h3-like {
margin: 20px 0 0 0;
font: var(--secondary-header-font);
text-transform: var(--secondary-header-font-variant);
}
.sidebar-item:last-of-type {
    margin: 0;
}
.sidebar-item .post {
width: 100%;
margin: 25px 0;
}
.sidebar-item .post:last-of-type {
margin-bottom: 25px;
}
.sidebar-item .post:last-of-type {
border-bottom: none;
}
.sidebar-item .post .heading, .sidebar-item .heading {
font: var(--small-header-font);
margin: 5px 0 5px 0;
color: var(--power-color-3);
display: block;
}
.sidebar-item .post .date {
font: var(--small-header-font);
font-size: 14px;
margin: 0;
}
.upcoming-event-image {
    height: 120px;
    width: 100%;
    background-color: var(--power-color-1);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.upcoming-event-image.photo {
    background-color: var(--body-bg-color);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.sidebar-item .post p {
margin: 5px 0 8px 0;
font: var(--paragraph-font);
}
.my-events-bucket .my-events {
    padding-top: 15px;
}

/* the table element */
table {
    width: calc(100% + 45px);
    margin: 25px 0;
    /*padding-right: 45px;*/
    border: unset;
    border-spacing: unset;
    display: block;
    overflow: auto;
}
table caption {
    margin-bottom: 10px;
}
table thead {
    border: unset;
    /*display: flex;*/
}
table thead tr {
    /*display: flex;*/
}
table thead tr th {
    /*flex: 1;*/
    padding: 11px 20px 12px 20px;
    background-color: var(--theme-secondary-color-5);
    border: unset;
    border-top: .5px solid var(--primary-border-color);
    border-left: .5px solid var(--primary-border-color);
    font: var(--font-form-label);
    text-align: left;
}
table thead tr th:last-child {
    border-right: .5px solid var(--primary-border-color);
}
table tbody {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
}
table tr {
    width: 100%;
    /*display: flex;*/
}
table td {
    /*flex: 1;*/
    padding: 10px 20px;
    background-color: var(--select-bg-color);
    border: unset;
    border-top: .5px solid var(--secondary-border-color);
    border-left: .5px solid var(--secondary-border-color);
}
table tr:last-child td {
    border-bottom: .5px solid var(--secondary-border-color);
}
table tr td:last-child {
    border-right: .5px solid var(--secondary-border-color);
}

/* pathfinder embed page elements */
.full-segment.page-element {
    width: 100%;
}
.full-segment.page-element .segment-heading-row {
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}
.full-segment.page-element .segment-heading-row .button-like.primary {
    margin-top: 5px;
}
.full-segment.page-element .wedge {
    display: none;
}
.full-segment.page-element .segment-content-row {
    margin-top: 25px;
}
.full-segment.page-element .segment-content-row .events-list {
    justify-content: flex-start;
}
.full-segment.page-element .segment-content-row .events-list .event-item {}
.full-segment.page-element .segment-content-row .events-list .event-item .item-image {
    width: 100%;
    aspect-ratio: 1/1;
    height: auto;
    background-size: cover;
    background-position: center;
}
.full-segment.page-element .segment-content-row .events-list .event-item .item-content {
    width: 100%;
}
.full-segment.page-element .segment-content-row .events-list .event-item .item-content .h4-like {
    margin: 0 0 5px 0;
}
.full-segment.page-element .segment-content-row .events-list .event-item .item-content .short-description {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    opacity: .7;
}
.full-segment.page-element .segment-content-row .events-list .event-item .item-content .details {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 12px 0 0 0;
}
.full-segment.page-element .segment-content-row .events-list .event-item .item-content .options {
    margin: 20px 0 0 0;
}

/* 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);
    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;
    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 125px;
}
.booklists-embed .embed-top-panel {
    width: 100%;
    margin: 0 0 25px 0;
    padding: 17px 30px;
    background-color: var(--select-bg-color);
    border: .5px solid var(--primary-border-color);
}
.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(--font-body-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 {
    width: 100%;
    max-width: 300px;
}
.booklists-embed .book-list .book-list-books .book {
    height: 175px;
    width: calc((100% - 24px) / 3);
    flex-basis: initial;
    aspect-ratio: initial;
}

/* eresource embed page element */
.eresources-embed {
    width: 100%;
    margin: 50px 0;
    
    --font-body: normal 300 16px/23px "Barlow", sans-serif;
}
.eresources-embed .eresource-entities {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}
.eresources-embed .eresource-entities .eresource-item {
    padding: 30px;
    width: calc((100% - 60px) / 3);
    align-items: initial;
}
.eresources-embed .eresource-entities .eresource-item .item-media {
    aspect-ratio: 212/134;
    height: auto;
    background-size: calc(100% - 20px);
    background-repeat: no-repeat;
    background-position: center;
    background-color: #FFFFFF;
}
.eresources-embed .eresource-entities .eresource-item h4 {
    margin: 0 0 10px 0;
}
.eresources-embed .eresource-entities .eresource-item p {
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.eresources-embed .eresource-entities .eresource-item .item-content .eresource-buttons .button-like.secondary {
    margin-top: 15px;
}

/* 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);
    display: flex;
    column-gap: 5px;
    align-items: center;
}

/* pathfinder styles */
.source-container {
    width: 100%;
    margin: 50px 0 0 0;
    --source-skeleton-opacity: 1;
    --font-body: normal 300 16px/23px "Barlow", sans-serif;
}
.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(--theme-secondary-color-4);
    overflow: hidden;
}
.source-container .blog-source h4 {
    margin: 0 0 5px 0;
}
.source-container .blog-source p {
    opacity: .7;
    margin: 10px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.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: 30px;
}
.source-container .blog-source .item-content .date {
    margin: 0 0 8px 0;
    display: flex;
    column-gap: 5px;
    align-items: center;
    position: relative;
    font: var(--font-select);
}
.source-container .blog-source .item-content .date svg {
    fill: var(--font-body-color);
}
.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);
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;
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 */
.search-page-search .search-page-form .top-search {
    width: calc(100% - 200px);
    max-width: 354px;
    margin: 0;
    padding: 4px 5px;
    box-sizing: border-box;
    border: 1px solid #979797;
    /*border-radius: 4px;*/
    color: #00000070;
    font: var(--paragraph-font);
}
.search-page-search .search-page-form .search {
    border: none;
    margin: 0;
    padding: 5px 18px;
    box-sizing: border-box;
    /*border-radius: 20px;*/
    background-color: var(--power-color-1);
    color: var(--power-color-1-foreground);
    font: var(--small-header-font);
    font-weight: 400;
    text-decoration: none;
}
.search-page-search .search-page-form .search-results-count {
    font: var(--paragraph-font);
}


@media screen and (max-width: 39.9375em) {
    .alternating-image-plus-text-block {
        display: block;
    }
    .alternating-image-plus-text-block>img {
        width: 100%;
    }
    .alternating-image-plus-text-block>div {
        width: 100%;
        margin: 15px 0 0 0;
    }
}

/*======================================================================================================
    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/footer_logo.png);
}
footer {
    width: 100%;
    max-width: 1490px;
    margin: 0 auto;
    position: relative;
    z-index: 25;
    
    /* overwrite `base` variables */    
    --font-header-5: normal 500 18px/22px "Bricolage Grotesque", sans-serif;
    --font-body: normal 300 16px/20px "Barlow", sans-serif;
    --font-link-color: #EDC531;
    --wedge-height: .5px;
    --wedge-margin: 25px 0;
    --wedge-color: #000000;
}
footer:after {
    content: '';
    position: absolute;
    width: 168px;
    height: 168px;
    background-color: var(--theme-primary-color-1);
    border-radius: 100%;
    top: -148px;
    left: 267px;
}
/* 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 ul li:before {
    display: none;
}
footer .footer-wrapper {
    width: 100%;
    display: flex;
}
footer .footer-details {
    width: 100%;
    max-width: 330px;
    padding: 80px 55px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
footer .footer-details:after {
    content: '';
    position: absolute;
    width: 350px;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--theme-secondary-color-3);
    border-radius: 0 150px 0 0;
    z-index: -1;
}
footer .footer-details .address .h5-like {
    display: block;
    margin: 0 0 13px 0;
}
footer .footer-details .address {
    margin-bottom: 20px;
}
footer .footer-details .hours {
    margin-bottom: 33px;
}
footer .footer-details .site-logo {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 60px;
}
footer .footer-details .site-logo img {
    content: var(--footer-logo);
}
footer .footer-details .address p {
    opacity: 0.74;
}
footer .footer-details .address .direction-options {
    width: 100%;
    margin: 11px 0 0 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 18px;
    row-gap: 8px;
}
footer .footer-details .address .direction-options a {
    opacity: 0.85;
}
footer .footer-details .address .direction-options a:hover {
    opacity: 1;
}
/*footer .footer-details .hours {*/
/*    margin: 0 auto;*/
/*}*/
footer .footer-details .hours .hours-list {
    display: flex;
    flex-direction: column;
    row-gap: 5px;
    font: var(--font-body);
    margin: 0;
}
footer .footer-details .hours .hours-list dt {
    display: inline;
    font-weight: 400;
}
footer .footer-details .hours .hours-list dd {
    display: inline;
    margin-left: 0;
}
footer .footer-details .hours .hours-list .disclaimer {
    width: 100%;
    padding-left: calc(30px);
    opacity: 0.6;
}
footer .footer-details .social-list {
    margin: 0;
    display: flex;
    column-gap: 9px;
}
footer .footer-details .social-list li {
    text-align: center;
    display: flex;
}
footer .footer-details .social-list li a {}
footer .footer-details .social-list li a svg {
    fill: var(--font-body-color)
}
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: 20px;
    height: 20px;
}
footer .footer-sitemap {
    width: calc(100% - 330px);
    padding: 79px 45px 45px 87px;
    background-color: rgb(var(--theme-secondary-color-2));
    border-radius: 150px 0 0 0;
    
    /* overwrite `base` variables */    
    --font-body: normal 400 13px/16px "Barlow", sans-serif;
}
footer .footer-sitemap:after {
    content: '';
    position: absolute;
    width: calc(100% - 321px);
    height: 100%;
    bottom: 0;
    right: 0;
    border-radius: 146px 0 0 0;
    background-color: var(--body-bg-color);
    z-index: -1;
}
/* overwrite `base` styles */
footer .footer-sitemap h5, footer .footer-sitemap .h5-like {
    opacity: 1;
}
footer .footer-sitemap a {
    color: var(--font-body-color);
    text-decoration: none;
}
footer .footer-sitemap a:after {
    background-color: var(--font-body-color);
}
footer .footer-sitemap .wedge {
    /*opacity: .5;*/
}
footer .footer-sitemap nav {
    width: 100%;
}
footer .footer-sitemap nav ul.nav-list {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 35px 30px;
}
footer .footer-sitemap nav ul.nav-list li {}
footer .footer-sitemap nav ul.nav-list li a {
    opacity: 0.8;
}
footer .footer-sitemap nav ul.nav-list li a:hover {
    opacity: 1;
}
footer .footer-sitemap nav ul.nav-list li a .link-name {
    font: var(--font-materials-header);
}
footer .footer-sitemap nav ul.nav-list li a.button-like {
    opacity: 0.99;
    color: var(--font-secondary-button-color);
}
footer .footer-sitemap nav ul.nav-list li .link-text {
    opacity: 0.7;
    font: var(--font-link);
}
footer .footer-sitemap nav ul.nav-list li .list-dropdown {
    width: 100%;
    margin-top: 7px;
}
footer .footer-sitemap nav ul.nav-list li .list-dropdown ul {
    display: flex;
    flex-direction: column;
    row-gap: 5px;
    opacity: .8;
}
footer .footer-sitemap nav ul.nav-list li .list-dropdown ul li a {
    opacity: 0.7;
    font: var(--font-body);
}
footer .footer-sitemap nav ul.nav-list li .list-dropdown ul li a:hover {
    opacity: 1;
}
footer .footer-sitemap nav.footer-credits {
    margin-top: 35px;
    --font-link: normal 400 12px/14px "Barlow", sans-serif;
}
footer .footer-sitemap nav.footer-credits ul.nav-list {
    display: flex;
    justify-content: space-between;
}
footer .footer-sitemap nav.footer-credits ul.nav-list li {
    width: auto;
    max-width: none;
}
footer .footer-sitemap nav.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 nav.footer-credits ul.nav-list li a .link-name {
    font: var(--font-link);
}

/*======================================================================================================
    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) {}*/
@media only screen and (min-width: 1440px) {
    html {
        --body-barrens-border-opacity: .18;
    }
    body {
        background-color: var(--theme-secondary-color-5);
    }
    body:before {
        
    }
    header .header-wrapper {
        background-color: var(--body-bg-color);
    }
    footer {
        background-color: var(--body-bg-color);
    }
}

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

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

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1280px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1280px) {
    /*------------------ Global - styles | @1280 ------------------*/
    html {
        --site-logo-container-width: 215px;
        --site-logo-height: 86px;
    }
    /*------------------ Header - styles | @1280 ------------------*/
    
    .overflow-segment.banner {
        /* override base variables */
        --overflow-segment-media-max-width: calc(100% - 400px);
    }
} /* end 1280px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1240px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1240px) {
    html {
        --site-logo-container-width: 200px;
        --font-main-navigation: normal 400 14px/14px "Bricolage Grotesque", sans-serif;
    }
    header .site-logo {
        margin: auto 0 4px 0;
    }
    header .site-navigations {
        width: calc(100% - 230px);
    }
    
    /*======================================================================
        Accessibility - styles
    =======================================================================*/
    /*---------------------------------- Accessibility > Bigger Text ----------------------------------*/
    body.bigger-text {
        --font-main-navigation: normal 400 16px/16px "Bricolage Grotesque", sans-serif; /* +2 */
    }
} /* end 1240px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1190px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1190px) {
    html {
        --site-logo-container-width: 185px;
        --font-main-navigation: normal 400 13px/13px "Bricolage Grotesque", sans-serif;
    }
    header .utility-navigation {
        column-gap: unset;
        justify-content: space-between;
    }
    header .site-navigations {
        width: calc(100% - 215px);
    }
    
    /*======================================================================
        Accessibility - styles
    =======================================================================*/
    /*---------------------------------- Accessibility > Bigger Text ----------------------------------*/
    body.bigger-text {
        --font-main-navigation: normal 400 15px/15px "Bricolage Grotesque", sans-serif; /* +2 */
    }
} /* end 1190px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1140px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1140px) {
    /*------------------ Global - styles | @1140 ------------------*/
    html {
        /*--site-logo-container-width: 185px;*/
        
        --font-main-navigation: normal 400 12px/12px "Bricolage Grotesque", sans-serif;
        --font-utility-navigation-dropdown: normal 300 12px/15px "Barlow", sans-serif;
    }
    /*------------------ Header - styles | @1140 ------------------*/
    /*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, header .utility-navigation ul.nav-list {
        gap: 20px;
    }
    /*.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);
    }
    
    /*------------------ Embed elements - styles | @1140 ------------------*/
    .events-list .event-item {
        width: calc((100% - 30px) / 2);
    }
    .eresources-embed .eresource-entities .eresource-item {
        width: calc((100% - 30px) / 2);
    }
    
    /*======================================================================
        Accessibility - styles
    =======================================================================*/
    /*---------------------------------- Accessibility > Bigger Text ----------------------------------*/
    body.bigger-text {
        --font-main-navigation: normal 400 14px/14px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-utility-navigation-dropdown: normal 300 14px/17px "Barlow", sans-serif; /* +2 */
    }
} /* end 1140px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1080px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1080px) {
    html {
        --site-logo-container-width: 160px;
    }
    header .site-logo {
        margin: auto 0 5px 0;
    }
    header .site-navigations {
        width: calc(100% - 180px);
    }
    header .utility-navigation ul.panel-options, header .utility-navigation ul.nav-list {
        gap: 15px;
    }
} /* end 1080px */
    
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @1023px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 1023px) {
    /*------------------ Global - styles | @1023 ------------------*/
    html {
        --site-logo-height: 86px;
        --site-logo-container-width: 175px;
        --font-main-navigation: normal 400 15px/15px "Bricolage Grotesque", serif;
    }
    .desktop {
        display: none;
    }
    .tablet {
        display: block;
    }
    .default {
        background-size: 45px;
    }
    
    form {
        max-width: unset;
    }

    .wysiwygs-across.call-to-action h3 {}
    .wysiwygs-across.call-to-action .wysiwygs {
        padding: 30px 20px;
    }
    /*------------------ Header - styles | @1023 ------------------*/
    header {
        /*padding: 15px;*/
        background-color: var(--select-bg-color);
        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 15px;
    }
    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: 82px;*/
        align-items: center;
        flex-wrap: wrap;
        /*overflow-x: hidden;*/
        /*overflow-y: scroll;*/
    }
    
    header .header-panels .panel .hours-list {
        width: 100%;
    }
    header .header-panels .panel .closed-days-list {
        margin: 25px 0 0 0;
    }
    
    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(--select-bg-color);
        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 {
        margin: 0;
        padding: 15px 0;
        position: relative;
        z-index: 15;
    }
    header .site-logo img {
        width: auto;
    }
    header .site-navigations {
        width: 100%;
        height: calc(100vh - 77px);
        max-height: calc(100vh - 60px);
        padding: 15px;
        background-color: var(--theme-secondary-color-5);
        opacity: 0;
        align-items: flex-start;
        position: absolute;
        top: 100%;
        left: 0;
        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 .list-toggle {
        width: 25px;
        height: 23px;
        display: flex;
        align-items: center;
        justify-content: center;
        /*background-color: rgba(255,0,0,0.5);*/
    }
    header ul.nav-list li .list-dropdown ul li {
        opacity: 1;
        margin-bottom: 8px;
    }
    header ul.nav-list li .list-dropdown ul li:last-child {
        margin-bottom: 0;
    }
    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: 20px 15px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        order: 3;
    }
    header .utility-navigation ul.panel-options {
        column-gap: 15px;
    }
    header .utility-navigation ul.panel-options li {
        padding: 0;
    }
    header .utility-navigation ul.panel-options li:before {
        top: -43px;
    }
    header .utility-navigation ul.panel-options li.mobile-menu:before {
        display: none;
    }
    header #utility_navigation ul.panel-options {
        display: none;
    }
    header .utility-navigation ul.nav-list {
        width: 100%;
        padding: 0;
        flex-direction: column;
        column-gap: initial;
        gap: 10px;
    }
    header .utility-navigation ul.nav-list li {
        width: 100%;
        padding: 0;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    header .utility-navigation ul.nav-list li a {
        /*padding: 10px 15px;*/
    }
    header .utility-navigation ul.nav-list li.dropdown-included:after {
        display: none;
    }
    header .utility-navigation ul.nav-list li .list-toggle {
        padding: 0;
        display: flex;
    }
    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 {
        background-color: var(--select-bg-color);
        width: calc(100% - 30px);
        margin-top: 0;
        padding: 0;
        opacity: 0;
        border: none;
        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 {
        width: 100%;
        margin: 10px 0 0 0;
        padding: 15px;
        border-radius: 0 0 30px 0;
        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: 0;
        font: var(--font-utility-navigation-dropdown);
        font-weight: 400;
        color: var(--font-color-site-navigations);
    }
    header .utility-navigation ul.nav-social-list {
        margin: 20px 0 0 0;
    }
    header .utility-navigation a.button-like.prompt {
        margin: 23px 0 0 0;
    }
    /*--------- Header > Main Navigation - styles | @1023 ---------*/
    header .main-navigation {
        width: 100%;
        padding: 0;
        order: 2;
        right: auto;
    }
    header .main-navigation ul.nav-list {
        padding: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    header .main-navigation ul.nav-list li {
        width: 100%;
        padding: 0 15px;
        /*border-bottom: 0.4px var(--brand-border-color);*/
        flex-wrap: wrap;
        justify-content: space-between;
        position: relative;
        order: 1;
    }
    header .main-navigation ul.nav-list li.search-option {
        /*display: none;*/
        order: 0;
        width: 100%;
        padding: 0;
        margin-bottom: 10px;
    }
    header .main-navigation ul.nav-list li.search-option a {
        display: none;
    }
    header .main-navigation ul.nav-list li a {
        /*padding: 10px 15px;*/
    }
    header .main-navigation ul.nav-list li.active > a, header .main-navigation ul.nav-list li:hover > a {
        color: var(--font-color-site-navigations);
    }
    header .main-navigation ul.nav-list li .list-toggle, header .utility-navigation ul.nav-list li .list-toggle {
        padding: 0;
        display: flex;
        flex: 1;
        mask-image: url('data:image/svg+xml,<svg width="12px" height="6.8px" viewBox="0 0 12 6.8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon points="0 0.8 0.8 1.93267624e-13 6 5.2 11.2 1.54375818e-13 12 0.8 6 6.8"></polygon></svg>');
        mask-repeat: no-repeat;
        mask-position: 100%;
        background-color: var(--font-color-site-navigations);
    }
    header .main-navigation ul.nav-list > li:not(.search-option) > a {
        text-shadow: -1.5px 2px 0px var(--theme-secondary-color-5), 1.5px 2px 0 var(--theme-secondary-color-5), 0px 2px 0 var(--theme-secondary-color-5);
    }
    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 {
        margin-top: 0;
        padding: 10px;
        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 0 0 0;
        padding: 15px;
        opacity: 1;
        position: relative;
        top: auto;
        pointer-events: all;
        transform: initial;
        transition: margin .3s, opacity .3s;
        background-color: var(--select-bg-color);
        border-radius: 0 0 30px 0;
        width: 100%;
    }
    header ul.nav-list li .list-dropdown:before, header nav ul.nav-list .list-dropdown:after {
        content: unset;
    }
    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;
        margin-bottom: 8px;
    }
    header .main-navigation ul.nav-list li .list-dropdown ul li:last-child {
        margin-bottom: 0;
    }
    header .main-navigation ul.nav-list li .list-dropdown ul li a {
        font: var(--font-utility-navigation-dropdown);
        font-weight: 400;
        color: var(--font-color-site-navigations);
        padding: 0;
    }
    header nav ul.nav-list li .list-dropdown ul li a:hover {
        color: var(--font-color-site-navigations);
    }
    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 {
        opacity: 1;
        transform: translateY(0);
        transition: opacity .3s .4s, transform .3s .4s;
        display: none;
    }

    .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;
        
        padding: 0;
    }
    .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-input-container {
        
    }
    .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 {
        padding: 0;
    }
    .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 {
        pointer-events: all;
        height: 40px;
        background-color: rgba(255,255,255,.88);
        border: .5px solid var(--theme-primary-color-2);
        color: var(--theme-primary-color-2);
        padding: 10px 15px;
        width: calc(100% - 43.5px);
        font: var(--font-main-navigation-dropdown);
    }
    header.show-mobile-menu .top-search-input .onsite-search .onsite-search-input::placeholder {
        color: var(--theme-primary-color-2);
        opacity: .5;
    }
    header .main-navigation .top-search-input .onsite-search a.button-like {
        top: 0;
        right: 0;
        height: 40px;
        background-color: rgba(255,255,255,.88);
        border: .5px solid var(--theme-primary-color-2);
        border-left: unset;
        fill: var(--theme-primary-color-2);
        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 {
        display: none;
        padding: 10px 0 0 0;
    }
    header.show-mobile-menu .top-search-input.active .search-results {
        display: none;
    }
    
    header .utility-navigation.mobile-version {
        width: calc(100% - var(--site-logo-container-width));
        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, .main-content:not(.home):not(:has( .banner)) {
        padding-top: 120px;
        overflow-x: hidden;
    }
    .main-content.home {/* tomove: home.css */
        overflow: hidden;
    }
    body.alerts-showing .main-content, body.alerts-showing .main-content:not(.home):not(:has( .banner)) {
        padding-top: 185px;
    }
    .main-content .page-content {
        /*padding: 18px 0 0 0;*/
        flex-direction: column;
    }
    
    .page-body, .page-content:has( .right-sidebar) .page-body {
        width: calc(100% - 90px);
        max-width: unset;
    }
    .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;
    }
    
    /*------------------ Home - styles | @1023 ------------------*/
    .campaign .upcoming-events, .campaign .hours-quicklinks .hours {
        padding: 32px 30px;
    }
    .campaign .hours-quicklinks .quicklinks {
        padding: 30px;
    }
    .campaign .hours-quicklinks .quicklinks ul {
        margin-bottom: 20px;
    }
    .campaign .hours-quicklinks .quicklinks ul li a {
        padding-left: 28px;
    }
    .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: calc(100% - 30px);
        margin: 0 auto 125px;
        padding: 0;
    }
    .full-segment.green-variant .segment-heading-row {
        width: 250px;
    }
    .full-segment.green-variant .segment-content-row {
        max-width: calc(100% - 250px);
    }
    
    .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);
    }

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

    /* blog posts */
    .blog-posts .post {
        /*flex-direction: column;*/
        gap: initial;
    }
    .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.landing-page .post .post-content {
        /*max-width: 440px;*/
    }
    .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-post .left-sidebar {
        max-width: 360px;
        order: 0;
        margin: 10px 0 0 0;
        padding-left: 45px;
    }
    .blog-post .page-body {
        width: calc(100% - 90px);
        margin: 0 auto;
        order: 1;
    }
    .blog-post h1 {
        margin-top: 40px;
    }
    .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;
    }

    .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%;
    }
    /* 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;
    }
    .main-content.staff-member .left-sidebar {
        order: 0;
        margin: 10px 0 50px 0;
    }

    /* - 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%;
    }
    
    /* book lists page */
    .booklist-books .left-sidebar, .booklist-books .left-sidebar.no-offset {
        order: 0;
        margin: 10px 0 50px 0;
    }
    .booklist-books .left-sidebar .return-to-top-segment, .booklist-books .left-sidebar.no-offset .return-to-top-segment {
        display: none;
    }
    
    /*----------------- Embed elements - styles | @1023 -----------------*/
    .events-list .event-item {
        width: calc((100% - 90px) / 4);
    }
    .eresources-embed .eresource-entities .eresource-item {
        width: calc((100% - 60px) / 3);
    }
    
    
    /*----------------- Left Sidebar - styles | @1023 -----------------*/
    .left-sidebar, .left-sidebar.no-offset {
        margin-top: 75px;
        order: 1;
        padding-left: 45px;
    }
    .left-sidebar .context-navigation.clip-to-bottom {
        position: relative;
        bottom: unset;
    }
    
    /*----------------- Right Sidebar - styles | @1023 -----------------*/
    .right-sidebar {
        margin: 75px 45px 0 45px;
    }
    .right-sidebar .bucket {
        margin: 0;
    }

    /*----------------- Footer - styles | @1023 -----------------*/
    footer {}
    footer .footer-wrapper {}
    footer .footer-details {
        padding: 65px 50px 75px 30px;
    }
    footer .footer-details:after {
        border-radius: 0 125px 0 0;
    }
    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-sitemap {
        padding: 69px 30px 35px 77px;
        border-radius: 125px 0 0 0;
    }
    footer .footer-sitemap:after {
        border-radius: 119px 0 0 0;
    }
    footer .footer-nav ul.footer-right-side {
        margin: 0;
    }
    footer:after {
        width: 160px;
        height: 160px;
        top: -150px;
        left: 262px;
    }
    
    /*======================================================================
        Accessibility - styles
    =======================================================================*/
    /*---------------------------------- Accessibility > Bigger Text ----------------------------------*/
    body.bigger-text {
        --font-main-navigation: normal 400 17px/17px "Bricolage Grotesque", serif; /* +2 */
    }
} /* end 1023px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @950px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 950px) {
    .campaign {
        flex-wrap: wrap;
        row-gap: 25px;
    }
    .campaign .overflow-segment.carousel {
        width: 100%;
    }
    .campaign .upcoming-events, .campaign .hours-quicklinks {
        width: 50%;
    }
    .campaign .overflow-segment.carousel .content-board {
        border: .5px solid var(--primary-border-color);
    }
    
    .overflow-segment {
        /*flex-direction: column;*/
        /*align-items: center;*/
    }
    .overflow-segment .media-board {
        /*max-width: 640px;*/
    }
    .overflow-segment .content-board {
        /*width: 100%;*/
        /*max-width: 640px;*/
        /*padding: 27px 30px;*/
        /*padding-left: 45px;*/
    }
    .overflow-segment.element-initialized .content-board {
        transform: none;
    }
    /* @950 - carousel edits */
    .overflow-segment.carousel .swiper .swiper-wrapper .swiper-slide {
        flex-direction: column;
        align-items: center;
    }
    .overflow-segment.carousel .content-board .details {
        max-width: none;
    }
    
    .engagement-list {
        flex-wrap: wrap;
        row-gap: 30px;
    }
    .engagement-list .engagement-item {
        width: calc(50% - 15px);
    }
    
    .full-segment.green-variant {
        flex-wrap: wrap;
    }
    .full-segment.green-variant .segment-heading-row {
        width: 100%;
    }
    .full-segment.green-variant .segment-heading-row h2, .full-segment.green-variant .segment-heading-row p {
        max-width: 192px;
    }
    .full-segment.green-variant .segment-filter {
        width: unset;
        min-width: 200px;
        /*position: absolute;*/
        /*right: 35px;*/
        /*top: 50%;*/
        /*transform: translateY(-50%);*/
    }
    .full-segment.green-variant .segment-content-row {
        max-width: unset;
    }
    .full-segment.green-variant#for_you_segment .segment-content-row, .full-segment.green-variant#booklists_segment .segment-content-row {
        border-radius: 0;
    }
    
    /* @950 - main content edits */
    .main-content {
        padding: 120px 0 300px 0;
    }
    
    /* @950 - footer edits */
    footer .footer-wrapper {
        flex-direction: column;
    }
    footer .footer-details {
        position: relative;
        max-width: calc(100% - 90px);
        padding: 65px 50px 45px 50px;
    }
    footer .footer-details .site-logo {
        max-width: 200px;
    }
    footer .footer-details:after {
        width: 100%;
        border-radius: 0 100px 0 0;
    }
    footer .footer-sitemap {
        background-color: var(--theme-secondary-color-4);
        width: calc(100% - 90px);
        border-radius: 0;
        padding: 45px 50px 45px 50px;
    }
    footer .footer-sitemap:before {
        content: '';
        position: absolute;
        width: 90px;
        height: 100%;
        bottom: 0;
        right: 0;
        background-color: rgb(var(--theme-secondary-color-2));
        border-radius: 100px 0 0 0;
        border-top: 8px solid var(--body-bg-color);
        border-left: 8px solid var(--body-bg-color);
    }
    footer .footer-sitemap nav.footer-credits {
        margin-top: 50px;
    }
    footer .footer-sitemap:after {
        content: unset;
    }
    footer:after {
        width: 117px;
        height: 117px;
        top: -107px;
        left: unset;
        right: 36px;
    }
    
    /* @950 - staff edits */
    .staff-component .overflow-segment {
        /*flex-direction: column;*/
        /*align-items: flex-start;*/
        /*gap: 25px;*/
    }
    .staff-component .overflow-segment .media-board {
        width: 33%;
        aspect-ratio: 2/3;
        margin: unset;
    }
    .staff-component .overflow-segment .content-board {
        /*max-width: 450px;*/
    }
} /* end 950px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @750px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 750px) {
    /*------------------ Base - styles | @750 ------------------*/
    html {
        /*// header variables //*/
        --font-header-1: normal 500 26px/31px "Bricolage Grotesque", sans-serif;
        --font-header-2: normal 500 22px/27px "Bricolage Grotesque", sans-serif;
        --font-header-3: normal 500 18px/23px "Bricolage Grotesque", sans-serif;
        --font-header-4: normal 500 16px/21px "Bricolage Grotesque", sans-serif;
        --font-header-5: normal 500 16px/21px "Bricolage Grotesque", sans-serif;
        /*// header > assets variables //*/
        --font-panels-subheader: normal 500 14px/17px "Bricolage Grotesque", sans-serif;
        --font-panels-access-option: normal 400 14px/14px "Barlow", sans-serif;
        --font-main-navigation: normal 400 15px/15px "Bricolage Grotesque", sans-serif;
        --font-main-navigation-dropdown: normal 400 15px/18px "Bricolage Grotesque", sans-serif;
        --font-utility-navigation: normal normal 300 13px/16px "Barlow", sans-serif;
        --font-utility-navigation-dropdown: normal 300 13px/16px "Barlow", sans-serif;
        --font-top-search-input: normal 400 18px/21px "Bricolage Grotesque", sans-serif;
        --font-subheader: normal 300 14px/16px "Bricolage Grotesque", sans-serif;
        /*// font body variables //*/
        --font-body: normal 400 16px/23px "Barlow", sans-serif;
        --font-body-intro: normal 400 18px/22px "Barlow", sans-serif;
        --font-ordered-list-marker: normal 600 16px/23px "Barlow", sans-serif;
        --font-select: normal 400 14px/26px "Barlow", sans-serif;
        /*// button variables //*/
        --font-button: normal 400 14px/17px "Bricolage Grotesque", sans-serif;
        --font-prompt-button: normal 400 13px/16px "Bricolage Grotesque", sans-serif;
        /*// wedge variables //*/
        --wedge-margin: 0 0 30px 0;
        /*// overflow segment //*/
        /*// full segment //*/
        --font-full-segment-filter-item: normal 400 14px/17px "Bricolage Grotesque", sans-serif;
        --font-full-segment-author: normal 400 13px/15px "Bricolage Grotesque", sans-serif;
        --font-event-list-month: normal 400 14px/14px "Barlow", sans-serif;
        --font-event-list-day: normal 600 20px/25px "Bricolage Grotesque", sans-serif;
        --font-event-list-details: normal 400 16px/20px "Barlow", sans-serif;
        --font-materials-header: normal 500 14px/15px "Bricolage Grotesque", sans-serif;
        --font-materials-favorite: normal 400 10px/12px "Bricolage Grotesque", sans-serif;
        --font-staff-item-info: normal 300 14px/17px "Barlow", sans-serif;
        --font-book-item-author: normal 400 14px/18px "Barlow", sans-serif;
        --font-form-label: normal 500 16px/20px "Bricolage Grotesque", sans-serif;
        --font-acc-container: normal 500 16px/20px 'Bricolage Grotesque', sans-serif;
        --font-pullquote: normal 400 15px/22px 'Bricolage Grotesque';
        --font-pullquote-author: normal 400 16px/23px 'Barlow';
        /*// left sidebar variables //*/
        --font-return-to-link: normal 400 14px/17px "Bricolage Grotesque", sans-serif;
        --font-context-navigation-heading: normal 500 18px/22px "Bricolage Grotesque", sans-serif;
        --font-context-navigation-list-item: normal 400 14px/17px "Bricolage Grotesque", sans-serif;
    }
    
    .desktop, .tablet {
        display: none;
    }
    .mobile {
        display: block;
    }
    
    /* @750 - header edits */
    header .header-panels .panel .branch-hours {
        flex-direction: column;
        gap: 15px;
    }
    header .header-panels .panel .closed-days-list {
        margin: 15px 0 0 0;
    }
    header .header-panels .panel .branch-hours div {
        padding: 0 0 0 10px;
    }
    header .header-wrapper {
        padding: 0 15px;
    }
    header .header-panels .panel:has( .alert-messages) {
        padding: 20px 44px 15px 15px;
    }
    
    /* @750 - header image edits */
    .overflow-segment.banner .media-board {
        width: calc(100% - 30px);
        aspect-ratio: 2.5/1;
        height: auto;
    }
    
    .pullquote {
        padding: 65px 24px 30px 34px;
    }
    .pullquote:before {
        top: 30px;
        left: 34px;
    }
    
    /*------------------ Left sidebar - styles | @750 ------------------*/
    .left-sidebar {
        margin-top: 70px;
        padding-left: 20px;
        order: 1;
    }
    .left-sidebar .context-navigation {
        padding: 25px 30px 20px 20px;
    }
    .booklist-books .left-sidebar, .booklist-books .left-sidebar.no-offset {
        padding-left: 20px;
    }
    .return-to-top-segment, .return-to-top-segment.clip-to-bottom {
        /*position: relative;*/
        /*bottom: -80px;*/
        /*left: 0;*/
    }
    .return-to-top-segment a.button-like.return-to-top-button {
        opacity: 1;
        pointer-events: all;
    }
    
    /*------------------ Body - styles | @750 ------------------*/
    .page-body, .page-content:has( .right-sidebar) .page-body {
        margin: 0 auto;
        width: calc(100% - 40px);
    }
    .page-body .full-bucket-segment {
        /*width: calc(100% - 30px);*/
        width: 100%;
        margin: 75px auto 0;
    }
    .page-content {
        flex-direction: column;
        /*row-gap: 50px;*/
    }
    .body {
        width: 100%;
        order: 0;
    }
    
    .acc-container.tabs > *[role="tablist"] {
        overflow: auto;
    }
    
    /*------------------ Right sidebar - styles | @750 ------------------*/
    .right-sidebar {
        margin: 70px 20px 0 20px;
    }
    
    /* "banner" variant variables/styles - for `overflow segment` section */
    .overflow-segment.banner {
        /* override base variables */
        --font-header-1: normal 500 26px/31px "Bricolage Grotesque", sans-serif;
        margin-bottom: 25px;
    }
    
    .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;
    }
    
    .root-pillars-segment {}
    .root-pillars-segment .content-pillar {
        padding-top: 124px;
        flex-direction: column;
        row-gap: 45px;
    }
    .root-pillars-segment .content-pillar .pillar-item {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .root-pillars-segment .content-pillar .pillar-item:nth-of-type(2) {
        margin: 0;
    }
    .root-pillars-segment .content-pillar .pillar-item:nth-of-type(odd) {
        margin: 0;
    }
    .root-pillars-segment .content-pillar .pillar-item:nth-of-type(even) {
        margin: 0;
    }
    .root-pillars-segment .content-pillar .pillar-item:nth-of-type(even) .item-media {
        margin: 0;
    }
    .root-pillars-segment .content-pillar .pillar-item:nth-of-type(even) .item-details {
        margin: 0;
    }
    .root-pillars-segment .root-pillar:before {
        height: 100%;
    }
    .root-pillars-segment .root-pillar .pillar-marker {
        opacity: 0.5;
        position: initial;
    }
    .root-pillars-segment .root-pillar .pillar-checkpoint {
        display: none;
    }
    
    /* @750 - no-media edits */
    .root-pillars-segment .content-pillar .pillar-item.no-media:after {
        display: none;
    }
    
    .archives-component {
        flex-direction: column;
        
    }
    .archives-component .featured-archive {
        width: 100%;
        margin: 0 0 25px 0;
    }
    .archives-component .featured-archive .details {
        padding: 22px 28px;
    }
    .archives-component .archives-list {
        width: 100%;
    }
    .archives-component .archives-list .archives-item {
        margin: 0 0 25px 0;
    }
    .archives-component .archives-list .archives-item .item-details {
        padding: 22px 28px;
    }
    
    /* @750 - staff pages edits */
    .staff-segment .staff-items.split-alt {
        flex-direction: column;
        margin: 0 0 50px 0;
    }
    .staff-segment .staff-items.split-alt .staff-heading {
        width: 100%;
        padding: 30px 25px;
    }
    .staff-segment .staff-items.split-alt .staff-content {
        border-radius: 0;
        padding: 25px;
        border-top: unset;
    }
    .staff-segment .staff-items {
        margin: 75px 10px 50px 10px;
    }
    .staff-segment .staff-items .staff-content {
        gap: 20px 15px;
    }
    .staff-segment .staff-items .staff-content .item {
        width: calc((100% - 30px) / 3);
    }
    .staff-list {
        column-gap: initial;
        justify-content: space-between;
    }
    .staff-list .staff-item {
        width: calc(50% - 10px);
    }
    .main-content.staff-member .left-sidebar {
        padding-left: 15px;
    }
    .staff-component .overflow-segment {
        flex-direction: column;
        margin-bottom: 50px;
    }
    .staff-component .overflow-segment .media-board {
        width: 100%;
        aspect-ratio: 5/3;
        max-width: unset;
        background-position: top center;
    }
    .staff-component .overflow-segment .content-board {
        border-radius: 0;
        padding: 25px 20px;
    }
    .overflow-segment .content-board .details .bio-text {
        max-height: unset;
    }
    
    .events-list {
        /*flex-direction: column;*/
        gap: 15px;
    }
    .events-list li .details-media {
        aspect-ratio: 5/4;
    }
    .events-list li .details-content {
        padding: 15px;
    }
    /*------------------ Embed elements - styles | @750 ------------------*/
    .events-list .event-item {
        width: calc((100% - 15px) / 2);
    }
    .events-list.offset-list .event-item:first-of-type {
        margin-top: 0;
    }
    .eresources-embed .eresource-entities {
        gap: 15px;
    }
    .eresources-embed .eresource-entities .eresource-item {
        width: calc((100% - 15px) / 2);
    }

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

    .eresources-section .letters-list {
        gap: 15px;
        padding-right: 15px;
    }
    .eresources-section .letters-list li {
        width: calc((100% - 180px) / 13);
    }
    .eresources-section .eresource-overlay .container {
        max-height: calc(100% - 40px);
        width: calc(100% - 40px);
    }

    /* @750 - book lists edits */
    .featured-books > div {
        gap: 25px
    }
    .most-recent .book-list:nth-child(-n + 2) {
        width: calc((100% - 25px) / 2);
    }
    .most-recent .book-list:nth-child(n+3) {
        flex-basis: calc((100% - 50px) / 3);
    }
    .all-books .original-results {
        gap: 25px;
    }
    .all-books .original-results .book-list {
        flex-basis: calc((100% - 50px) / 3);
    }
    .books-list {
        gap: 15px;
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }

    .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);
    }

    body .gallery-overlay.open {
        display: block;
    }
    body .gallery-overlay-bg {
        height: calc(100vh - 150px);
    }
    body .gallery-overlay figure {
        position: absolute;
        width: calc(100% - 200px);
        height: calc(100% - 220px);
        /*margin: 0;*/
        /*width: calc(100vw - 100px);*/
        /*height: calc(100vh - 150px);*/
        /*background-color: var(--select-bg-color);*/
        /*display: flex;*/
        /*position: absolute;*/
        /*top: 50%;*/
        /*left: 50%;*/
        /*z-index: 100;*/
        /*transform: translate(-50%, -50%);*/
        /*padding: 50px;*/
    }
    body .gallery-overlay .close-button {
        position: absolute;
        top: 75px;
        right: 75px;
    }
    
    
    .img_right_25, .img_right_50, .img_right_native, .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 {
        display: inline-block;
    }

    .overflow-segment.banner .media-banner {
        height: 175px;
    }
    
    .discover-filters {
        margin: 25px 0;
    }
    /* @750 - book lists edits */
    .booklist-books .body {
        order: 2;
        width: 100%;
        margin-top: 25px;
    }
    .booklist .books-list .book {
        width: calc((100% - 75px) / 4);
    }
    .page-content .body:has( .discover-filters.expanded) {
        z-index: 20;
    }
    
    /* @750 - blog posts edits */
    .blog-posts.landing-page .discover-filters {
        margin-bottom: 25px;
    }
    .blog-posts .post {
        margin: 0 0 25px 0;
    }
    .blog-tag .body {
        width: 100%;
    }
    .blog-post .left-sidebar {
        padding-left: 20px;
    }
    .blog-post .page-body {
        width: calc(100% - 40px);
    }


    .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 -20px;
        padding: 0 20px;
        overflow-x: scroll;
    }

    .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 {
        gap: 15px;
    }
    .eresources-section .eresource-entities .eresource {
        width: calc((100% - 15px) / 2);
        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;
    }
    
    .tournament-list .tournament-list-item {
        margin: 0 0 15px 0;
        flex-wrap: wrap;
        row-gap: 8px;
    }
    .tournament-list .tournament-list-item:last-of-type {
        margin: 0;
    }
    .tournament-list .tournament-list-item:before {
        top: 6px;
    }
    .tournament-list .tournament-list-item:after {
        display: none;
    }
    .tournament-list .tournament-list-item .item-date {
        max-width: none;
        width: 100%;
        padding: 0;
    }
    .tournament-list .tournament-list-item .item-buttons {
        padding: 0;
    }
    
    .tournament-info {}
    .tournament-info .info-lists {
        flex-direction: column;
    }
    .tournament-info .info-lists ul {
        width: 100%;
    }
    .tournament-info .info-lists ul li:first-of-type {
        padding: 15px 0;
    }
    .tournament-info .info-lists ul:first-of-type li:first-of-type {
        padding: 15px 0;
    }

    .lineage-container {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }

    /* - individual staff - */
    .main-content.staff .page-content {
        padding-bottom: 200px;
    }
    .main-content.staff .staff-questions {
        margin-bottom: unset;
    }

    /* @750 - footer */
    footer {
        --wedge-margin: 15px 0;
    }
    footer .footer-details {
        padding: 50px 50px 30px 30px;
    }
    footer .footer-details .site-logo {
        max-width: 160px;
        margin-top: 25px;
    }
    footer .footer-sitemap {
        padding: 30px 30px 35px 30px;
    }
    footer .footer-sitemap nav ul.nav-list {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    footer .footer-sitemap nav ul.nav-list li .list-dropdown {
        display: none;
    }
    footer .footer-sitemap nav.footer-credits {
        margin-top: 15px;
    }
    
    /*======================================================================
        Accessibility - styles
    =======================================================================*/
    /*---------------------------------- Accessibility > Bigger Text ----------------------------------*/
    body.bigger-text {
        /*// header > assets variables //*/
        --font-panels-subheader: normal 500 16px/19px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-panels-access-option: normal 400 16px/16px "Barlow", sans-serif; /* +2 */
        --font-main-navigation: normal 400 17px/17px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-main-navigation-dropdown: normal 400 17px/20px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-utility-navigation: normal normal 300 15px/18px "Barlow", sans-serif; /* +2 */
        --font-utility-navigation-dropdown: normal 300 15px/18px "Barlow", sans-serif; /* +2 */
        --font-subheader: normal 300 16px/18px "Bricolage Grotesque", sans-serif; /* +2 */
        /*// font body variables //*/
        --font-select: normal 400 16px/28px "Barlow", sans-serif; /* +2 */
        /*// button variables //*/
        --font-button: normal 400 16px/19px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-prompt-button: normal 400 15px/18px "Bricolage Grotesque", sans-serif; /* +2 */
        /*// full segment //*/
        --font-full-segment-filter-item: normal 400 16px/19px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-full-segment-author: normal 400 15px/17px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-event-list-month: normal 400 16px/16px "Barlow", sans-serif; /* +2 */
        --font-materials-header: normal 500 16px/17px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-materials-favorite: normal 400 12px/14px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-staff-item-info: normal 300 16px/19px "Barlow", sans-serif; /* +2 */
        --font-book-item-author: normal 400 16px/20px "Barlow", sans-serif; /* +2 */
        --font-pullquote: normal 400 17px/24px 'Bricolage Grotesque'; /* +2 */
        /*// left sidebar variables //*/
        --font-return-to-link: normal 400 16px/19px "Bricolage Grotesque", sans-serif; /* +2 */
        --font-context-navigation-list-item: normal 400 16px/19px "Bricolage Grotesque", sans-serif; /* +2 */
    }
} /* end 750px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @600px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 600px) {
    /*------------------ Global - styles | @600 ------------------*/
    html {
        --site-logo-container-width: 215px;
        --site-logo-height: 50px;
    }
    /*------------------ Header - styles | @600 ------------------*/
    header .header-wrapper {
        max-height: 82px;
    }
    header .utility-navigation.mobile-version {
        width: calc(100% - 250px);
        padding-right: 8px;
    }
    header .utility-navigation ul.panel-options {
        column-gap: 12px;
    }
    header .utility-navigation ul.panel-options li:before {
        top: -33px;
    }
    
    /*------------------ base - styles | @600 ------------------*/
    /*.left-sidebar {*/
    /*    max-width: none;*/
    /*    width: calc(100% - 20px);*/
    /*}*/
    /*.left-sidebar .context-navigation {*/
    /*    max-width: none;*/
    /*}*/
    
    /*.right-sidebar {*/
    /*    max-width: unset;*/
    /*    width: calc(100% - 40px);*/
    /*}*/
    
    .main-content, .main-content, .main-content:not(.home):not(:has( .banner)) {
        padding: 100px 0 200px 0;
    }
    
    form {
        margin: 50px 0;
    }
    form .field-row {
        flex-direction: column;
    }
    
    .acc-container, .wysiwygs-across, .gallery-wrapper {
        margin: 50px 0;
    }
    
    .gallery-wrapper .gallery-grid {
        gap: 10px;
    }
    body .gallery-overlay {
        padding: 40px 20px;
    }
    body .gallery-overlay .gallery-overlay-bg {
        width: calc(100vw - 40px);
        height: calc(100vh - 80px);
    }
    body .gallery-overlay figure {
        width: calc(100% - 130px);
        height: calc(100% - 220px);
    }
    body .gallery-overlay .close-button {
        top: 56px;
        right: 38px;
    }
    
    /*------------------ home - styles | @600 ------------------*/
    .campaign {
        margin: 0 auto 50px auto;
    }
    .overflow-segment.carousel .content-board .details {
        padding: 20px 25px 50px 25px;
    }
    .full-segment {
        margin: 0 auto 50px auto;
    }
    .full-segment.green-variant#for_you_segment .segment-content-row .component-item {
        padding: 20px 25px;
    }
    
    /*------------------ eresources - styles | @600 ------------------*/
    .eresources-section .eresource-entities .eresource {
        width: 100%;
        max-width: 350px;
    }
    .eresources-section .eresource-overlay .container {
        padding: 25px;
    }
    .eresources-section .eresource-overlay .container .content .main {
        flex-direction: column;
    }
    .eresources-section .eresource-overlay .container .content .related-container .related-eresources-container {
        overflow: auto;
    }
    .eresources-section .eresource-overlay .container .content .related-container .related-eresources-container .related-eresources {
        /*width: 630px;*/
    }
    .eresources-section .eresource-overlay .container .content .related-eresources .related {
        min-width: 200px;
    }
    
    .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;
    }

    .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;
    }
        
    .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;
    }
    .most-recent .book-list:nth-child(-n + 2), .most-recent .book-list:nth-child(n+3) {
        width: 100%;
        max-width: 350px;
    }
    .book-lists.filtered {
        gap: 20px;
    }
    .all-books .original-results .book-list {
        flex-basis: 100%;
        max-width: 350px;
    }
    .book-list .book-list-books, .book-list .h4-like {
        margin: 0 0 10px 0;
    }
    .books-list {
        column-gap: 20px;
        row-gap: 20px;
    }
    .books-list .book-item {
        max-width: calc((100% - 20px) / 2);
    }
    
    .books-list {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .booklist-books .books-list .book-item {
        max-width: 100%;
    }
    
    .blog-posts .post, .blog-posts .post:nth-child(2n) {
        flex-direction: column;
        max-width: 340px;
    }
    .blog-posts .post .post-content {
        padding: 25px;
    }
    .blog-posts .post .post-title {
        margin: 0 0 10px 0;
    }
    .blog-posts .post .post-about {
        max-width: none;
        margin: 0 0 15px 0;
        float: none;
    }
    
    .staff-segment .staff-items.split-alt .staff-content {
        flex-direction: column;
    }
    .staff-segment .staff-items.split-alt .staff-content .item {
        width: 100%;
        max-width: 340px;
    }
    .staff-list .staff-item {
        width: 100%;
    }
    .staff-member .books-list .book-item {
        max-width: unset;
    }

    .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;
    }
} /* end 600px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @500px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 500px) {
    .alternating-image-plus-text-block>img {
        max-width: unset;
    }
    .wysiwygs-across .wysiwygs {
        flex-direction: column;
    }
    .wysiwygs-across .wysiwygs .wysiwyg {
        flex: unset !important;
    }
    .bucket {
        flex-direction: column;
        align-items: flex-start;
    }
    .gallery-wrapper .gallery-slider-container {
        aspect-ratio: 1/1;
        height: auto;
    }
    .gallery-wrapper .gallery-grid {
        grid-template-columns: 1fr 1fr;
    }
    .book-lists .featured-filter {
        gap: 15px;
    }
    .books-list {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
    .m-events:after {
        top: 35px;
    }
    
    .discover-filters .dates .after-before {
        flex-wrap: wrap;
        margin-top: 10px;
    }
    .discover-filters .dates .after-before label {
        width: calc(100% - 17px);
    }
    .discover-filters .dates .after-before label input {
        margin: 0;
    }
    
    footer .footer-details .site-logo {
        max-width: unset;
    }
    footer .footer-details .site-logo img {
        max-width: 160px;
    }
} /* end 500px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @450px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 450px) {
    .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%;
    }
} /* end 450px */

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ @350px \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media only screen and (max-width: 350px) {
    /*------------------ Global - styles | @350 ------------------*/
    html {
        --site-logo-container-width: 215px;
        --site-logo-height: 26px;
    }
    /*------------------ Header - styles | @350 ------------------*/
    header .header-wrapper {
        max-height: 55px;
    }
    header .utility-navigation.mobile-version {
        width: calc(100% - 221px);
    }
    header .utility-navigation ul.panel-options li:before {
        top: -18px;
    }
} /* end 350px */