/* A Community News story's page: the styles Webflow kept in that page's own
   stylesheet (chilliwackconnect.webflow.68e5e9887e23cdcf1f4d73db.*.opt.css),
   so they aren't in site.css. The hero's pattern is left out: the site's
   living background shows through instead. */
.padding-section-t48-b150 { padding-top: var(--_responsive-variables---spacing--48); padding-bottom: var(--_responsive-variables---spacing--150); }
.heading-64 { font-size: var(--_responsive-variables---heading--h-64); letter-spacing: -0.02em; font-weight: 600; line-height: 1.2; }
.text-size-12-2 { letter-spacing: -0.02em; font-size: 0.75em; }
.text-size-12-2.text-weight-500 { color: rgb(13, 13, 18); letter-spacing: -0.02em; }
.text-size-12-2.text-weight-500.text-color-grey-500 { color: rgb(102, 109, 128); }
.business-hero-tag { border: 1px solid rgb(223, 225, 231); border-radius: 1em; padding: 0.25em 0.5em; }
.business-hero-tag.is-white { background-color: rgb(255, 255, 255); }

.blog-post-header3_content { gap: 4em; grid-template-rows: auto; grid-template-columns: 0.75fr 0.75fr; grid-auto-columns: 1fr; align-items: stretch; display: grid; }
.blog-post-header3_title-wrapper { flex-flow: column; justify-content: flex-start; align-items: flex-start; display: flex; }
.blog-post-header3_content-top { flex-direction: column; flex: 1 1 0%; justify-content: space-between; align-items: flex-start; }
.blog-post-header3_author-wrapper { align-items: center; }
.blog-post-header3_image-wrapper { border-radius: 24px; width: 100%; margin-left: auto; margin-right: auto; overflow: hidden; }
.blog-post-header3_image { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; height: 100%; }

.blog-content-component { gap: 6em; align-items: flex-start; display: flex; }
.blog-sticky-component { background-color: var(--swatch--yellow); text-align: left; border-radius: 1.5em; flex-flow: column; justify-content: flex-start; align-items: flex-start; width: 52em; padding: 2em; display: flex; position: sticky; top: 6em; }
.cta-img-wrapper { z-index: 0; filter: contrast(0%) brightness(200%); position: absolute; inset: 0%; }
.relative-button { z-index: 2; position: relative; }
.relative-button.is-flex-horizontal { gap: 0.5em; justify-content: flex-start; align-items: center; display: flex; }

.news-rich-text { max-width: 46.875em; margin-bottom: 100px; }
.news-rich-text h3 { font-size: var(--_responsive-variables---heading--h-32); margin-top: 1em; margin-bottom: 0.5em; }
.news-rich-text p { font-size: var(--_responsive-variables---paragraph--text-18); }
.news-rich-text blockquote { border-left: 0.31em solid rgba(250, 219, 73, 0.25); margin-top: 0px; margin-left: auto; margin-right: auto; padding: 1em 1.25em; }
.news-rich-text h4 { margin-top: 0.5em; margin-bottom: 0.5em; }
.news-rich-text li { font-size: var(--_responsive-variables---paragraph--text-18); margin-bottom: 0.5em; }
.news-rich-text a { cursor: pointer; text-decoration: underline; transition: color 0.5s; }
.news-rich-text a:hover { color: var(--swatch--yellow); }
.news-rich-text figure img { border-radius: 1em; }

.more-news-heading { justify-content: space-between; align-items: center; display: flex; }
.blog_list-wrapper { margin-top: 3em; }

.news-back-link { color: rgb(102, 109, 128); font-size: 0.875em; font-weight: 500; text-decoration: none; }
.news-back-link:hover { color: rgb(13, 13, 18); }

@media screen and (max-width: 991px) {
  .blog-post-header3_content { row-gap: 4rem; grid-template-columns: 1fr; grid-auto-flow: row; min-height: auto; }
  .blog-content-component { gap: 2em; }
  .news-rich-text { flex: 0 1 auto; width: 100%; }
  .blog-sticky-component { flex: 0 0 auto; width: 30%; padding: 1.25em; }
  .cta-img-wrapper { opacity: 0.3; }
}
@media screen and (max-width: 767px) {
  .heading-64 { line-height: 1.16667em; }
  .blog-post-header3_content { row-gap: 3rem; }
  .blog-content-component { flex-flow: column; }
  .blog-sticky-component { text-align: center; order: 9999; width: auto; position: static; }
}
@media screen and (max-width: 479px) {
  .blog-post-header3_content { grid-template-columns: 1fr; }
  .news-rich-text h3 { font-size: 1.5rem; }
  .news-rich-text h4 { font-size: 1.4rem; }
  .news-rich-text h5 { margin-top: 0.5rem; margin-bottom: 0.5rem; font-size: 1.25rem; }
  .blog-sticky-component { order: 9999; padding: 2em; }
  .relative-button.is-flex-horizontal { flex-flow: column; }
  .more-news-heading { gap: 1em; flex-flow: column; justify-content: space-between; align-items: flex-start; }
}