@import url("https://use.typekit.net/ylj6ndk.css");
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

/* font-family: urbana, sans-serif; */
/* font-family: inter-variable, sans-serif; */

h1{
    font-family: var(--type-font-family-heading, Urbana);
    font-size: var(--fontsize-heading-h1, 60px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--line-height-heading-h1, 72px); /* 120% */
    margin-block-start: 0;
    margin-block-end: 0;
  }

  h2{
    font-family: var(--type-font-family-heading, Urbana);
    font-size: var(--fontsize-heading-h2, 48px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--line-height-heading-h2, 56px); /* 116.667% */
    margin-block-start: 0;
    margin-block-end: 0;
  }

  h3{
    font-family: var(--type-font-family-heading, Urbana);
    font-size: var(--fontsize-heading-h3, 40px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--line-height-heading-h3, 48px); /* 120% */
    margin-block-start: 0;
    margin-block-end: 0;
  }

  h4{
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h4, 32px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h4, 40px); /* 125% */
    margin-block-start: 0;
    margin-block-end: 0;
    }

  h5{
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h5, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h5, 28px); /* 116.667% */
    margin-block-start: 0;
    margin-block-end: 0;
  }

  h6{
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h6, 20px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h6, 24px); /* 120% */
    margin-block-start: 0;
    margin-block-end: 0;
  }

  p{
    margin-block-start: 0;
    margin-block-end: 0;
  }

  /* Base Placeholder Templates */

  .placeholder-secondary{
    border: var(--border-width-sm, 1px) solid var(--border-primary, #DADADB);
    background: var(--surface-tertiary, #E4EED9);
  }

  /* Text Block - Site specific styling */

  .paragraph--type--text-block h3{
    color: var(--text-headings-secondary, #334857);
  }

  .paragraph--type--text-block h5{
    color: var(--text-sub-headings-2, #768575);
  }

  .paragraph--type--text-block p{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-lg, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-lg, 32px); /* 160% */
  }

  .text-block-divider-ctn{
    display:flex;
    justify-content: center;
    align-items: center;
    gap:16px;
    padding-top:16px;
  }

  .text-block-divider-ctn svg{
    width: 56px;
    height: 56px;
  }

  .text-block-divider-ctn .text-block-divider-line{
    height:1px;
    flex:1;
    background-color: var(--border-primary, #DADADB);
  }

  /* Button - Site specific styling */

  .button-basic{
    font-family: var(--type-font-family-body, Inter);
  }

  .button-primary{
    background: var(--surface-action1, #99C3E1);
    color: var(--text-on-action, #303031);
  }

  .button-primary:hover{
    background: var(--surface-action1-hover, #80B4D9);
  }

  .button-secondary{
    background: var(--surface-action2, #EFF2F4);
    color: var(--text-action2, #627B95);
  }

  .button-secondary:hover{
    background: var(--surface-action2-hover, #E0E5EA);
    color: var(--text-action2-hover, #4E6277);
  }

  .button-transparent{
    color: var(--text-action1, #303031);
  }

  .button-transparent:hover{
    background: var(--surface-action2-hover, #E0E5EA);
    color: var(--text-action1-hover, #181818);
  }

  .button-transparent span{
    color: var(--icon-action1, #627B95);
  }

  .button-transparent:hover span{
    color: var(--icon-action1-hover, #4E6277);
  }

  .button-outline{
    border: var(--border-width-sm, 1px) solid var(--border-action1, #80B4D9);
    color: var(--text-action1, #303031);
  }

  .button-outline span{
    color:var(--icon-action1, #627B95);
  }

  .button-outline:hover{
    border: var(--border-width-sm, 1px) solid var(--border-action1-hover, #99C3E1);
    background: var(--surface-action2-hover, #E0E5EA);
    color: var(--text-action1-hover, #181818);
  }

  .button-outline:hover span{
    color: var(--icon-action1-hover, #4E6277);
  }

  .button-outline_inverse{
    border: var(--border-width-sm, 1px) solid var(--border-action-inverse, #F2F2F3);
    color: var(--text-inverse, #FAFAFA);
  }

  .button-outline_inverse:hover{
    color: var(--text-action1-hover, #181818);
    border: var(--border-width-sm, 1px) solid var(--border-action-inverse-hover, #FAFAFA);
    background: var(--surface-action2-hover, #E0E5EA);
  }

  .button-outline_inverse span{
    color:var(--icon-inverse, #FAFAFA);
  }

  .button-outline_inverse:hover span{
    color: var(--icon-action1-hover, #4E6277);
  }

  .button-inverse{
    color: var(--text-action1, #303031);
    background: var(--surface-action-inverse, #F2F2F3);
  }

  .button-inverse:hover{
    background: var(--surface-action-inverse-hover, #FAFAFA);
    color: var(--text-action1-hover, #181818);
  }

  .button-inverse:focus{
    color: var(--text-action1, #303031);
    outline: var(--border-width-md, 2px) solid var(--border-focus-inverse, #FFF);
  }

  .button-inverse span{
    color: var(--icon-action1, #627B95);
  }

  .button-inverse:hover span{
    color: var(--icon-action1-hover, #4E6277);
  }


  .button-primary:focus,.button-secondary:focus,.button-transparent:focus,.button-outline:focus,.button-outline_inverse:focus{
    outline: var(--border-width-md, 2px) solid var(--border-focus, #4D6C82);
  }

  /* Accordion Module - Site specific styling */

  .accordion-module h3{
    color: var(--text-headings-secondary, #334857);
  }

  .accordion-module p{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-lg, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-lg, 32px); /* 160% */
  }

  .accordion-item{
    border: var(--border-width-sm, 1px) solid var(--border-action2, #A1B0BF);
    background: var(--quaternary-300, #F8FBF6);
  }

  .accordion-item span.accordion-item-title {
    color: var(--text-action2, #627B95);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h6, 20px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h6, 24px); /* 120% */
  }

  .accordion-item span.accordion-item-title:hover {
    color: var(--text-action2, #627B95);
  }

  .accordion-item.expanded span.accordion-item-title {
    border-bottom: 1px solid #C0CAD5;
  }

  .accordion-item span.accordion-item-title {
    background-image: url("/themes/custom/roost/components/accordion-section/images/speculator/expand.svg");
  }

  .accordion-item span.accordion-item-title:hover {
    background-image: url("/themes/custom/roost/components/accordion-section/images/speculator/expandhover.svg");
  }

  .accordion-item.expanded span.accordion-item-title {
    background-image: url("/themes/custom/roost/components/accordion-section/images/speculator/collapse.svg");
  }

  .accordion-item.expanded span.accordion-item-title:hover {
    background-image: url("/themes/custom/roost/components/accordion-section/images/speculator/collapsehover.svg");
  }

  /* Link Image Module - Site specific styling */
  .overlay-text p {
    padding-left:24px;
    padding-right:24px;
    color: var(--text-on-image, #FAFAFA);
    text-align: center;
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h4, 32px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h4, 40px); /* 125% */
  }

  .overlay-text {
    background-color: rgba(0, 0, 0, 0.2);
  }

  .overlay-text:hover {
    border-radius: var(--border-radius-lg, 8px);
    background-color:  rgba(153, 195, 225, 0.80) ;
  }


  @media only screen and (max-width: 1000px) {
    .overlay-text p{
      font-size: 28px;
      line-height: 32px;
    }
  }

  @media only screen and (max-width: 743px) {
    .overlay-text {
      font-size: 28px;
    }
    .overlay-text p{
      font-size: 24px;
      line-height: 28px;
    }
  }

  /* Featured Link Image Module - Site specific styling */
  .featured-overlay-text p {
    color: var(--text-headings-secondary, #334857);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h5, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h5, 28px); /* 116.667% */
    background: var(--White-75, rgba(255, 255, 255, 0.75));
  }

  .featured-overlay-text svg g path{
    fill: #627B95 !important;
}

.featured-overlay-text svg {
    right: 28px;
    bottom: 9px;
    position: absolute;
}

  @media only screen and (max-width: 743px) {
    .featured-overlay-text {
      font-size: 28px;
    }
    .featured-overlay-text p{
      font-size: 20px;
      line-height: 24px;
    }
  }

   /* Profile Module - Site specific styling */
   .profile-name{
    color: var(--text-sub-headings, #4D6C82);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h5, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h5, 28px); /* 116.667% */
  }

  .profile-title{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  #block-speculator-views-block-profile-module-block-1 h2{
    color: var(--text-headings-primary, #303031);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h4, 32px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h4, 40px); /* 125% */
  }

  .profile-email,
  .profile-phone{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }
  .profile-email a{
    color: var(--text-body-primary, #616161);
  }

  .profile-body p{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-sm, 12px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-sm, 20px); /* 166.667% */
  }

  @media (max-width: 1000px) {
    #block-speculator-views-block-profile-module-block-1 h2{
      font-size:28px;
    }
  }

  @media (max-width: 743px) {
    .profile-name{
      font-size: 20px;
    }
    #block-speculator-views-block-profile-module-block-1 h2{
      font-size:24px;
    }
  }

   /* Resource Cards Module - Site specific styling */
    .resource-card-item{
        background: var(--surface-tertiary, #E4EED9)!important;
    }

   .resource-body{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
    background: var(--surface-tertiary, #E4EED9)!important;
  }

  .resource-card-module h4{
    color: var(--text-headings-secondary, #334857);
  }

  .resource-overlay-text .resource-title {
    color: var(--text-headings-secondary, #334857);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h5, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h5, 28px); /* 116.667% */
  }

  .resource-title svg g path{
    fill:#627B95!important;
  }

  .resource-overlay-text svg:hover{
    background: var(--surface-action2-hover, #E0E5EA);
  }

  @media only screen and (max-width: 1000px) {
    .resource-card-module h4{
      font-size: 28px;
    }
  }

  @media only screen and (max-width: 743px) {
    .resource-card-module h4{
      font-size: 24px;
      line-height: 24px;
    }
    .resource-overlay-text .resource-title{
      font-size: 20px;
      line-height: 20px;
    }
    .resource-overlay-text {
      font-size: 28px;
    }

    .resource-overlay-text p{
      font-size: 20px;
      line-height: 24px;
    }
  }

  /* Form Module - Site specific styling */

  .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name{
    bottom: 332.5px;
    position: absolute;
    right:24px;
  }

  .webform-submission-contact-form h2{
    color: var(--text-headings-primary, #303031);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h4, 32px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h4, 40px)!important;
  }

  .webform-submission-contact-form p{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-sm, 12px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-sm, 20px); /* 166.667% */
  }

  .js-form-item label{
    color: var(--text-headings-secondary, #334857);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .js-form-item label.option{
    color: var(--text-headings-secondary, #334857);
  }

  #edit-actions-submit.webform-button--submit.button.button--primary.js-form-submit.form-submit,
  #edit-actions-submit--2.webform-button--submit.button.button--primary.js-form-submit.form-submit,
  #edit-actions-submit--3.webform-button--submit.button.button--primary.js-form-submit.form-submit,
  #edit-actions-submit--4.webform-button--submit.button.button--primary.js-form-submit.form-submit{
    background: var(--surface-action1, #99C3E1);
    color: var(--text-on-action, #303031);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--line-height-body-md, 24px); /* 150% */
    border: 1px solid #99C3E1;
    background-image: url("/sites/speculatorchamber.com/themes/custom/speculator/i/arrow_right_alt.svg"); /* NEED TO ADD FOR ETOWN */
  }

  #edit-actions-submit.webform-button--submit.button.button--primary.js-form-submit.form-submit:hover,
  #edit-actions-submit--2.webform-button--submit.button.button--primary.js-form-submit.form-submit:hover,
  #edit-actions-submit--3.webform-button--submit.button.button--primary.js-form-submit.form-submit:hover,
  #edit-actions-submit--4.webform-button--submit.button.button--primary.js-form-submit.form-submit:hover{
    background: var(--surface-action1-hover, #80B4D9);
    background-image: url("/sites/speculatorchamber.com/themes/custom/speculator/i/arrow_right_alt.svg"); /* NEED TO ADD FOR ETOWN */
  }

  #edit-actions-submit.webform-button--submit.button.button--primary.js-form-submit.form-submit:focus,
  #edit-actions-submit--2.webform-button--submit.button.button--primary.js-form-submit.form-submit:focus,
  #edit-actions-submit--3.webform-button--submit.button.button--primary.js-form-submit.form-submit:focus,
  #edit-actions-submit--4.webform-button--submit.button.button--primary.js-form-submit.form-submit:focus{
    outline: var(--border-width-md, 2px) solid var(--border-focus, #4D6C82);
    background-image: url("/sites/speculatorchamber.com/themes/custom/speculator/i/arrow_right_alt.svg"); /* NEED TO ADD FOR ETOWN */
  }

  input::placeholder{
    color: var(--text-disabled, #A9A9AA);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .js-form-type-textfield input,
  .js-form-type-email input,
  .js-form-type-tel input{
    color: var(--text-disabled, #A9A9AA);
    font-family: var(--type-font-family-body, "Work Sans");
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  input#edit-name.form-text:focus-visible,
  input#edit-your-name.form-text:focus-visible,
  input#edit-email.form-email:focus-visible,
  input#edit-phone-number.form-tel:focus-visible{
    outline: 2px solid var(--text-headings-secondary, #334857)!important;
  }

  input.form-text:focus-visible,
  input.form-text:focus-visible,
  input.form-email:focus-visible,
  input.form-tel:focus-visible{
    outline: 2px solid var(--text-headings-secondary, #334857)!important;
  }

  form.webform-submission-form .js-form-type-checkbox input[type="checkbox"].form-checkbox:checked {
    accent-color: #5B97EF;
    --bs-form-switch-bg: url("/sites/speculatorchamber.com/themes/custom/speculator/i/check.svg")!important; /* NEED TO ADD FOR ETOWN */
  }

  /* Region Call Out - Site specific styling */

    .callout-card{
        z-index: 1;
    }

    #seasonal {
    min-height: 644px;
    position: relative;
    }

    .callout-scrim{
        min-height: 644px;
    }

  .callout-wrapper {
    justify-content: center;
    align-items: center;
    }

  .callout-logo svg{
    padding:32px;
    max-width: 681px;
    width:max-content;
  }

  .callout-bg-logo{
    height: fit-content;
    position: absolute;
    right: 24px;
    bottom:-5px;
  }

  .callout-bg-logo svg{
    width:481px;
    height:627px;
  }

  .callout-title{
    color: var(--text-inverse, #F2F2F3);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h4, 32px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h4, 40px); /* 125% */
  }

  .callout-body {
    color: var(--text-inverse, #F2F2F3);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-lg, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-lg, 32px); /* 160% */
  }

  .callout-body span,
  .callout-body p{
    color:#F2F2F3!important;
  }

  .callout-btn{
    color: #FAFAFA;
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .callout-btn a{
    background: #D45034;
    color: #FAFAFA!important;
  }

  .callout-btn a:hover{
    background: #d75d42;
  }

  .callout-btn a:active{
    background: #d75d42;
  }

  .autumn { background-image: url("/sites/speculatorchamber.com/themes/custom/speculator/i/callout-background-fall.jpg"); }
  .winter { background-image: url("/sites/speculatorchamber.com/themes/custom/speculator/i/callout-background-winter.jpg"); }
  .spring { background-image: url("/sites/speculatorchamber.com/themes/custom/speculator/i/callout-background-spring.jpg"); }
  .summer { background-image: url("/sites/speculatorchamber.com/themes/custom/speculator/i/callout-background-summer.jpg"); }

  @media only screen and (max-width: 1440px) {
    .callout-logo svg{
      padding:32px;
      max-width:436px;
    }

    .callout-bg-logo svg{
        width: 360.75px;
        height: 546px;
      }

  }

  @media only screen and (max-width: 1000px) {
    .callout-logo svg{
      padding:32px;
      max-width:632px;
      width:100%;
    }
  }

  @media only screen and (max-width: 744px) {

    .callout-bg-logo svg{
        width: 259px;
        height: 392px;
    }
    .callout-logo svg{
      padding:0px!important;
      height: 150px;
    }
  }

  @media only screen and (max-width: 375px) {
    .callout-wrapper{
        gap: 32px;
    }
    .callout-log{
        margin:auto;
    }

    .callout-logo svg{
      padding:32px;
      max-width:279px;
    }

    .callout-bg-logo{
        bottom:91px;
    }

    .callout-bg-logo svg{
        width: 130.544px;
        height: 197.581px;
    }
  }

  /* Story/Newsletter Listings Module - Site specific styling */
  .story-listings .story-listing-wrapper .story-listing-tag{
    background: var(--surface-primary, #F2F2F3);
    color: var(--text-body-primary, #616161);
    text-align: center;
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-sm, 12px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-sm, 20px); /* 166.667% */
  }

  .story-listings h4{
    color: var(--text-headings-primary, #303031);
  }

  .story-listings .story-listing-wrapper .views-row a h5{
    color: var(--text-headings-secondary, #334857);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h5, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h5, 28px); /* 116.667% */
  }

  .story-listings h6{
    color: var(--text-headings-secondary, #334857);
    margin-top:8px;
  }

  .story-listings .story-listing-wrapper .views-row p{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .story-listing-auth-date{
    color: var(--text-headings-secondary, #334857);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .bef-toggle--deselect-all{
    border: var(--border-width-sm, 1px) solid var(--border-action2, #A1B0BF);
    background: var(--surface-action2, #EFF2F4);
    color: var(--text-body-primary, #616161);
    text-align: center;
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
    text-decoration:none;
  }

  .story-listings .bef-checkboxes .js-form-item label.option,.story-listings .bef-toggle--select-all{
    border: var(--border-width-sm, 1px) solid var(--border-action2, #A1B0BF);
    color: var(--text-body-primary, #616161);
    text-align: center;
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .story-listings .bef-checkboxes .js-form-item label.option:hover,.story-listings .bef-toggle--select-all:hover{
    border: var(--border-width-sm, 1px) solid var(--border-action1-hover, #99C3E1);
    background: var(--surface-action2-hover, #E0E5EA);
  }

  .story-listings .bef-checkboxes input[type="checkbox"]:checked + label.option{
    border: var(--border-width-sm, 1px) solid var(--border-action2, #A1B0BF);
    background: var(--surface-action2, #EFF2F4);
  }

  .story-listings .bef-checkboxes input[type="checkbox"]:checked +label.option:after,.bef-toggle--deselect-all::after{
    content: url("/sites/speculatorchamber.com/themes/custom/speculator/i/close_small.svg");
    margin-bottom: -8px;
    margin-left: -4px;
  }

  .story-listing-link-ctn svg g path{
    fill:#627B95;
  }

  .story-listing-link-ctn svg{
    border-radius: var(--border-radius-lg, 8px);
    transition: all 0.3s ease-in-out;
  }

  .story-listing-link-ctn svg:hover{
    background: var(--surface-action2-hover, #E0E5EA);
  }

  /* Share Now Popup - Site specific styling */

  #share-now-ctn {
    background: rgba(153, 195, 225, .90);
  }

  a.shareemail, .sharecopy #copy {
    font-family: var(--type-font-family-sub-heading, "Work Sans");
  }

  /* Event Node - Site specific styling */

  .events-header{
    color: var(--text-inverse, #FAFAFA);
  }

  .events-header-overlay {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  }

  .events-header-content{
  color: var(--text-inverse, #F2F2F3);
  }

  .next-event-date{
    background: var(--surface-highlight, #93BC68);
  }

  .next-event-date h5{
    color: var(--text-headings-secondary, #334857);
  }

  /* Listing Node - Site specific styling */

  .listing-all {
    color: var(--text-action1, #303031);
    text-align: center;
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
    gap:12px;
    padding:4px;
  }

  .listing-all svg path{
    fill: var(--icon-action1, #627B95);
  }

  .listing-all:hover {
    color: var(--text-action1-hover, #181818);
    border-radius: var(--border-radius-md, 4px);
    background: var(--surface-action2-hover, #E0E5EA);
  }

  .listing-all:hover svg path{
    fill: var(--icon-action1-hover, #4E6277);
  }

  .listing-all:focus{
   color: var(--text-action1, #303031);
   background: transparent;
   outline:var(--border-width-md, 2px) solid var(--border-focus, #4D6C82);
  }

  .listing-all:focus svg path{
    fill: var(--icon-action1, #627B95);
  }

  summary::after {
    content: url("/themes/custom/roost/components/accordion-section/images/speculator/expand.svg");
  }

  summary:hover::after {
    content: url("/themes/custom/roost/components/accordion-section/images/speculator/expandhover.svg");
  }

  details[open] > summary::after {
    content: url("/themes/custom/roost/components/accordion-section/images/speculator/collapse.svg");
  }

  details[open] > summary:hover::after {
    content: url("/themes/custom/roost/components/accordion-section/images/speculator/collapsehover.svg");
  }

  .listing-left h1, .listing-left h2, .listing-left h3,.listing-left h4,.listing-left h5,.listing-left h6{
    color: var(--text-headings-secondary, #334857);
  }

  .listing-right h3{
    color: var(--text-headings-secondary, #334857);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h4, 32px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h4, 40px); /* 125% */
  }

  .listing-left p,.listing-left a,.listing-left li{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-lg, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-lg, 32px); /* 160% */
  }

  .listing-right p{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .listing-info .remote-file-path-item{
    overflow: hidden;
    color: var(--text-body-secondary, #181818);
    text-overflow: ellipsis;
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
    word-wrap: break-word;
    word-break:break-all;
  }

  .share-ctn a{
    background: var(--surface-action1, #99C3E1);
    color: var(--text-on-action, #303031);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .share-ctn a:hover{
    background: var(--surface-action1-hover, #80B4D9);
  }


  .listings-share-ctn .material-symbols-outlined{
    color:#303031;
  }

  .listings-share-ctn a{
    overflow: hidden;
    color: var(--text-on-action, #303031);
    text-align: center;
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .listings-share-ctn a:hover{
    color: var(--text-on-action, #303031);
  }

  .listing-title{
    color: var(--text-action2, #627B95);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h6, 18px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h6, 24px); /* 133.333% */
  }

  .listing-info, .listing-items{
    background: var(--surface-primary, #F2F2F3);
  }

  .listing-media-btns{
    background: var(--surface-primary, #F2F2F3);
  }

  .listing-info .listing-time{
    color: var(--text-body-secondary, #181818);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .show-more-dates{
    color: var(--text-action1, #303031);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
   }

  .listing-items  .listing-address a, .listing-items  .listing-phone a, .listing-items  .listing-email a, .listing-items{
    color: var(--text-body-secondary, #181818);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .listing-third-party svg path{
    fill: var(--text-action2, #627B95);
  }

  .listing-third-party:hover svg path{
    fill:var(--text-action2-hover, #4E6277);
  }

  .address-name{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-sm, 12px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-sm, 20px); /* 166.667% */
  }

  .listing-info span, .listing-items span, .listing-phone span, .listing-tag-filter span{
    line-height: var(--line-height-body-md, 24px); /* 150% */
    color:var(--icon-action1, #627B95);
  }

  .listing-media-btns a svg g path{
    fill:#627B95;
  }

  .listing-media-btns a svg path{
    fill:#627B95;
    transition:.25s;
  }

  .listing-media-btns a:hover svg path{
    fill:#546a81;
   }

  /* Story Node - Site specific styling */

  .story-top{
    background: var(--surface-tertiary, #E4EED9);
  }

  .story-title{
    color: var(--text-headings-secondary, #334857);
    font-family: var(--type-font-family-heading, Urbana);
    font-size: var(--fontsize-heading-h2, 48px);
    font-style: normal;
    font-weight: 600;
    line-height: var(--line-height-heading-h2, 56px); /* 116.667% */
  }

  .story-tag a{
    color: var(--text-body-primary, #616161)!important;
  }

  .story-publish{
    color: var(--text-sub-headings, #4D6C82);
    font-family: var(--type-font-family-sub-heading, Inter);
    font-size: var(--fontsize-heading-h5, 24px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h5, 28px); /* 116.667% */
  }

  .story-summary{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
  }

  .story-body p{
    color: var(--text-body-primary, #616161);
    font-family: var(--type-font-family-body, Inter);
    font-size: var(--fontsize-body-lg, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-lg, 32px); /* 160% */
  }

  .story-page h3,
  .story-page h2,
  .story-page h1{
    color: var(--text-headings-secondary, #334857);
  }

  @media only screen and (max-width: 1000px) {
    .story-title{
      font-size: 40px;
    }
    .story-page h3{
      font-size: 32px;
    }
  }

  @media only screen and (max-width: 743px) {
    .story-title {
      font-size: 28px;
    }
    .story-publish{
      font-size: 20px;
    }
    .story-page h3 {
      font-size: 24px;
      line-height: 28px;
    }
  }

  /* Alert - Site specific styling */
  #block-popup{
    background: var(--surface-primary, #F2F2F3)!important;
  }


.alert-title {
  color: var(--text-action1, #303031)!important;
  font-family: var(--type-font-family-body, Inter)!important;
  font-size: var(--fontsize-body-md, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--line-height-body-md, 24px); /* 150% */
}

.alert-body p{
  color: var(--text-body-primary, #616161)!important;
  font-family: var(--type-font-family-body, Inter)!important;
  font-size: var(--fontsize-body-sm, 12px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--line-height-body-sm, 20px); /* 166.667% */
}
.alert-img svg path {
  fill: var(--icon-action1, #627B95)!important;
}
.alert-btn a{
color: var(--text-action1, #303031)!important;
text-align: center;
font-size: var(--fontsize-body-md, 16px);
font-style: normal;
font-weight: 400;
line-height: var(--line-height-body-md, 24px); /* 150% */
border-radius: 4px;
}
.alert-btn a:hover{
  background:#E0E5EA!important;
  color:#181818!important;
}

.alert-btn a:hover svg path{
  fill:#4E6277;
}

.alert-btn a:focus{
  outline: var(--border-width-md, 2px) solid var(--border-focus, #4D6C82);
}