* { margin: 0; padding: 0; box-sizing: border-box; outline-color: var(--ada-outline); } html, body { max-width: 100vw; } body { width: 100%; max-width: 100vw; min-height: 100vh; display: flex; flex-direction: column; } #MainContent { flex-grow: 1; } .skip-to-link { position: fixed; left: -150%; background: white; z-index: 100000000; transition: left .3s; } .skip-to-link:focus, .skip-to-link:focus-within, .skip-to-link:active { left: 0; } summary::marker { content: ''; display: none; } img { max-width: 100%; }blockquote.wp-block-quote { position: relative; margin-left: auto !important; margin-right: auto !important; border-left: 0; padding-top: 5rem; padding-right: 1rem; padding-left: 1rem; padding-bottom: 2rem; max-width: var(--blockquote-max-width); line-height: 1.4; background: var(--blockquote-background); } blockquote.wp-block-quote::before { content: '“'; position: absolute; display: block; top: 0; left: 1.5rem; text-align: center; font-size: var(--blockquote-quote-font-size); font-family: var(--blockquote-quote-font); } blockquote p + p { margin-top: 1.5rem; } blockquote p:last-of-type { color: var(--blockquote-name); }.breadcrumbs { padding: 1rem 0rem; background: var(--breadcrumbs); color: var(--breadcrumbs-text); } .breadcrumbs.breadcrumbs--hero { position: absolute; z-index: 1; left: 0; right: 0; background: var(--breadcrumbs-transparent); } .breadcrumbs a { color: inherit; } .breadcrumbs a:hover { color: var(--breadcrumbs-text-hover); } .breadcrumbs--hero-top { top: 0; } .breadcrumbs--hero-bottom { bottom: 0; } .breadcrumbs__list { display: flex; align-items: center; column-gap: 0.5rem; list-style-type: none; white-space: nowrap; overflow: auto; } .breadcrumbs__item { display: flex; } .breadcrumbs__item:not(:first-of-type)::before { content: '/'; margin-right: 0.5rem; }.button { cursor: pointer; } .button { display: inline-block; appearance: none; border: var(--button-border-width, 1px) solid var(--button-border); border-radius: 3px; padding: 0.5rem; background: var(--button-background); color: var(--button-text); text-decoration: none; transition: all 0.3s; } .button:focus, .button:focus-visible, .button:hover { border-color: var(--button-border-hover); background: var(--button-background-hover); color: var(--button-text-hover); } .button.button--icon { appearance: none; border: none; background-color: transparent; color: inherit; } .button--wide { width: 100%; }.event-archive { margin: 3rem 0; } .calendar { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; } .calendar__header { outline: var(--calendar-border-width) solid var(--calendar-header-background); padding: 0.5rem 0; text-align: center; background: var(--calendar-header-background); color: var(--calendar-header-text); } .calendar__day { outline: var(--calendar-border-width) solid var(--calendar-outline); padding: 0.5rem; height: 15vh; display: flex; flex-direction: column; background: var(--calendar-background-one); } .calendar__day:nth-child(2n + 1) { background: var(--calendar-background-two); } .calendar__date { margin-bottom: auto; } .calendar__event-link { margin-bottom: 0.5rem; } .calendar-nav { margin-bottom: 2rem; display: flex; justify-content: center; align-items: center; gap: 1rem; }.card { position: relative; display: flex; flex-direction: column; } .card__image-wrap { position: relative; padding-bottom: var(--card-image-aspect-ratio); overflow: hidden; } .card__image-wrap::after { content: ''; position: absolute; inset: 0; display: block; background: var(--card-overlay-background); opacity: var(--card-overlay-opacity); transition: opacity .2s; } .card__image { transform: scale(1); transition: transform .2s; } .card__content { position: relative; flex-grow: 1; padding: var(--card-contents-padding); display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--card-contents-spacing); text-align: var(--card-contents-alignment); background: var(--card-contents-background); color: var(--card-contents-text); z-index: 1; } .card__content--on-top { position: absolute; bottom: 0; left: 0; right: 0; } .card__content.card__content--patterned { display: block; } .card--search .card__content { grid-template-columns: 1fr; } .card__full-item, .card__title { grid-column: span 2; } .card__content a { color: var(--card-contents-links); transition: color .2s; } .card__content a:hover { color: var(--card-contents-links-hover); } .card:hover .card__image { transform: scale(1.03); } .card:hover .card__image-wrap::after { opacity: var(--card-overlay-opacity-hover); } .contact-form { margin: auto; display: grid; max-width: 40rem; row-gap: 2rem; } .input-wrap { position: relative; display: inline-block; } input:-webkit-autofill, input:-webkit-autofill:focus { transition: background-color 600000s 0s, color 600000s 0s; } .input-wrap label { position: absolute; top: 0; left: 0rem; transform: translateY(-110%); padding: 0; line-height: 1.5rem; font-size: 0.8125rem; background: transparent; cursor: pointer; transition: all 300ms; } .input-wrap input, .input-wrap textarea { width: 100%; } .input-wrap input:placeholder-shown + label, .input-wrap textarea:placeholder-shown + label { left: 1rem; top: 50%; transform: translateY(-50%); padding-left: 0; padding-right: 0; font-size: 1rem; background: transparent; } .input-wrap textarea:placeholder-shown + label { top: 0.5rem; transform: translateY(0%); } .input-wrap input:focus:placeholder-shown + label, .input-wrap input:active:placeholder-shown + label, .input-wrap textarea:focus:placeholder-shown + label, .input-wrap textarea:active:placeholder-shown + label { left: 1rem; padding-left: 0.5rem; }.full-width { margin-left: 0 !important; margin-right: 0 !important; width: 100%; } .ccontain { margin-left: auto; margin-right: auto; padding-left: 0.75rem; padding-right: 0.75rem; max-width: var(--ccontain); } .vcontain { padding-top: 4rem; padding-bottom: 4rem; } .bg-off-white { background: var(--off-white); } .hidden { display: none; } .gbc { margin-top: 3rem; margin-bottom: 3rem; } .gbc .has-text-color a { color: inherit; } .flexible-grid { display: grid; grid-template-columns: repeat(var(--number-columns-mobile), 1fr); column-gap: var(--sermon-archive-col-gap); row-gap: var(--sermon-archive-row-gap); } .flex-grid { display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; column-gap: var(--sermon-archive-col-gap); row-gap: var(--sermon-archive-row-gap); } .flex-grid > * { flex-basis: calc((100% - (var(--number-columns-mobile) - 1) * var(--sermon-archive-col-gap)) / var(--number-columns-mobile)); flex-shrink: 0; } .desktop-only-flex, .desktop-only { display: none; } .is-content-justification-center { justify-content: center; } .is-content-justification-right { justify-content: flex-end; } .is-content-justification-space-between { justify-content: space-between; }.wp-block-cover:has(a) img { transform: scale(1.0); transition: 0.3s; } .wp-block-cover:has(a:hover) img { transform: scale(1.05); } .wp-block-details summary { font-size: 1.4rem; font-weight: 600; } .wp-block-details:not(:last-of-type) { margin-bottom: 0; } .wp-block-details + .wp-block-details { border-top: 0; } .gbc ul { padding-left: 2.5rem; }.footer { padding-top: var(--footer-padding); padding-bottom: var(--footer-padding); background: var(--footer-background); color: var(--footer-text); } .footer a { color: inherit; } .footer a:hover { color: var(--footer-link-hover); } .footer ul { list-style: none; } .footer__menu-wrapper--with-pattern { display: grid; grid-template-columns: var(--footer-pattern-width) 1fr; column-gap: 2rem; } .footer-menu { width: 100%; display: flex; flex-direction: column; } .footer-menu--desktop { display: none; } .copyright { padding: 0.75rem 0; text-align: center; background: var(--copyright-background); color: var(--copyright-text); } .social-links:has(.social-link) { margin-bottom: var(--footer-padding); display: flex; justify-content: center; align-items: center; column-gap: 3rem; font-size: 0; } .social-link { display: inline-block; height: 2rem; width: auto; } .social-link svg { height: 100%; fill: currentColor; }.form { display: flex; flex-direction: column; row-gap: 1rem; align-items: center; } .input-wrapper { display: flex; flex-direction: column; row-gap: 0.5rem; width: 30rem; max-width: 100%; font-size: 0; } .input-wrapper.input-wrapper__horizontal { margin-bottom: 1rem; flex-direction: row; align-items: center; justify-content: space-between; column-gap: 0.75rem; } .input-wrapper input { width: 100%; } .input-wrapper textarea { max-width: 100%; height: 8rem; } .check-wrapper { display: flex; align-items: center; column-gap: 0.5rem; } textarea, input { border: 1px solid var(--input-border); border-radius: 3px; padding: 0.5rem; font-size: 1rem; background: var(--input-background); transition: all 0.3s; } textarea:hover, input:hover { background: var(--input-background-hover); } textarea:focus-within, textarea:focus-visible, textarea:active, input:focus-within, input:focus-visible, input:active { background: var(--input-background-active); } button, input, textarea { outline-offset: 0.25rem; outline-width: 2px; } label { font-size: 1rem; color: var(--label-color); cursor: pointer; } input[type="checkbox"] { appearance: none; border: 1px solid var(--button-border); width: 1.2rem; height: 1.2rem; transition: all 0.3s; } input[type="checkbox"]:checked { background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e"); border-color: var(--button-border-hover); background-color: var(--button-background-hover); color: var(--button-text-hover); } select { border: var(--button-border-width, 1px) solid var(--button-border); border-radius: 3px; padding: 0.1rem 0.75rem 0.1rem 0.2rem; font-size: 1rem; background: var(--button-background); color: var(--button-text); cursor: pointer; transition: all 0.3s; }.grid-section { padding-top: 3rem; padding-bottom: 3rem; display: grid; grid-column-gap: 3rem; grid-row-gap: 5rem; }.header { background-color: var(--header-background); color: var(--header-text); z-index: 100; transition: 0.3s background-color; } body:not(.body-scrolled, .search-open) .header--transparent { background: transparent; } .header--transparent:not(.header--is-fixed) { position: absolute; top: 0; right: 0; left: 0; } .header__watcher { background: var(--header-background); width: 100%; height: var(--logo-height); z-index: -1; } .header__watcher.header__watcher--transparent { position: absolute; background-color: transparent; } .header--is-fixed { position: fixed; top: 0; left: 0; right: 0; } .header a { color: var(--header-text); } .header a:hover { color: var(--header-text-hover); } .header svg { fill: currentColor; } .header__logo-link { display: block; font-size: 0; } .header__logo { padding: .5rem 0rem; max-height: var(--logo-height); height: var(--logo-height); transition: max-height .3s; } .body-scrolled .header__logo { max-height: var(--logo-height-scrolled); } .header__contents, .main-menu { display: flex; align-items: stretch; justify-content: space-between; } .header__contents { gap: 4rem; } .main-menu { gap: 2rem; height: 100%; list-style-type: none; } .main-menu a { font-family: var(--header-text-font-family); text-transform: var(--header-text-transform); letter-spacing: var(--header-text-letter-spacing); font-size: var(--header-text-font-size); font-weight: var(--header-text-font-weight); } .header__main-menu--right { margin-left: auto; } .header__main-menu--left { margin-right: auto; } .header__mobile-wrapper { position: fixed; top: 0; bottom: 0; right: -100%; width: 80vw; background: var(--submenu-background); color: black; z-index: 1000; transition: right .3s; } .header__mobile-wrapper.open { right: 0; } .header__mobile-wrapper a { color: var(--submenu-text-color); } .header__mobile-wrapper a:hover { color: var(--submenu-text-color-hover); } .header__close-menu { position: absolute; top: 0; bottom: 0; right: 100%; width: 150vw; background: var(--black); opacity: 0.75; display: none; } .header__search-trigger { border: none; display: none; align-items: center; appearance: none; background: transparent; cursor: pointer; } .header__search-trigger-icon { height: 1.5rem; color: var(--header-text); } .header__mobile-wrapper.open .header__close-menu { display: block; } .header__mobile-menu .main-menu { margin-top: 3rem; flex-direction: column; gap: 1rem; } .main-menu > .main-menu__item { position: relative; display: flex; align-items: center; white-space: nowrap; } .main-menu__item-label { width: 100%; display: inline-flex; align-items: center; column-gap: 0.25rem; } .main-menu__item-label a { width: 100%; } .main-menu__item .item-icon { transform: scaleY(1); transition: transform .2s 0.25s; } .main-menu__item:hover .item-icon { transform: scaleY(-1); } .main-menu__sub-menu { position: absolute; top: 100%; max-height: 0; overflow: hidden; background: var(--submenu-background); color: var(--submenu-text-color); list-style-type: none; box-shadow: 2px 1px 7px 1px rgba(0, 0, 0, 0.5); transition: max-height 0s, padding 0s, color 0.2s; transition-delay: 0.25s; } .main-menu__sub-menu.main-menu__sub-menu--middle { right: 50%; transform: translateX(50%); } .main-menu__sub-menu.main-menu__sub-menu--left { left: 0; } .main-menu__sub-menu.main-menu__sub-menu--right { right: 0; } .main-menu__sub-menu a:hover { color: var(--submenu-text-color-hover); } .main-menu__sub-menu a { display: inline-block; padding: 0.5rem 2rem; color: inherit; } .main-menu__item:active .main-menu__sub-menu, .main-menu__item:focus .main-menu__sub-menu, .main-menu__item:focus-within .main-menu__sub-menu, .main-menu__item:hover .main-menu__sub-menu { padding: 0.5rem 0; max-height: 100vh; } .accordion-menu__item .summary-select { border: 0; padding-left: 0; padding-right: 0; } .accordion-menu__item .summary-select svg { transition: transform 0.2s; } .accordion-menu__item .summary-select[open] svg { transform: scaleY(-1); } .accordion-menu__sub-menu { padding-left: 1rem; list-style-type: none; } .accordion-menu__sub-menu .accordion-menu__item { margin-top: 0.5rem; }.hero { position: relative; max-width: 100vw; overflow: hidden; } .hero, .hero__image { height: var(--hero-height); max-width: 100%; } .hero__image { display: block; width: 100%; object-fit: cover; } .hero.hero--text { height: var(--hero-text-only-height); } .hero--text, .hero__caption { display: flex; align-items: center; justify-content: center; } .hero__caption, .hero__caption-overlay { position: absolute; inset: 0; } .hero__content { position: relative; text-align: center; z-index: 1; color: var(--hero-text); } .hero__caption-overlay { background: var(--hero-background); opacity: var(--hero-opacity); }.icon { width: 2rem; color: inherit; fill: inherit; } .icon.icon--menu { color: var(--header-text); }.image-wrapper, .image { display: block; width: 100%; } .image-wrapper { position: relative; height: 0; overflow: hidden; } .image { position: absolute; top: 0; left: 0; height: 100%; object-fit: cover; transform: scale(1.0); transition: transform 0.2s; } .image-trigger:hover .image { transform: scale(1.05); } .parallax { position: relative; overflow: hidden; } .parallax img { display: block; object-fit: cover; } .parallax--banner img { width: 100% !important; } .parallax img { transform: scale(1.4); transform-origin: center var(--parallax-position); transition: all .1s; }.page-content__sidebar-list { display: none; } .page-content__sidebar-select { width: 100%; margin-top: -1rem; margin-bottom: 2rem; } .pagination { margin-bottom: 4rem; display: flex; align-items: center; justify-content: center; column-gap: 1rem; } .pagination a { color: var(--pagination-link); background: var(--pagination-link-background); transition: color .2s; } .pagination a:hover { color: var(--pagination-link-hover); } .page-numbers.current { background: var(--pagination-link-background); color: var(--pagination-link-active); } .page-numbers { padding: 0.5rem 0.75rem; }.search__wrapper { opacity: 0; transition: opacity 0.3s; } .search__wrapper.is-visible { opacity: 1; } .search__modal { position: fixed; inset: 0; padding: 3rem; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--white); } section.search-results { margin-top: 2rem; } .search-results__title { padding: 3rem 0rem 1rem; text-align: center; } .search-form { margin-bottom: 3rem; display: flex; align-items: center; justify-content: center; } .header .search__link { color: var(--link); } .header .search__link:hover { color: var(--link-hover); } .search-results__archive { margin-bottom: 3rem; } .search-bar__input-wrap { display: flex; justify-content: center; align-items: center; gap: 1rem; } .search-bar__overlay { position: fixed; inset: 0; top: var(--logo-height); border: 0; background: var(--black); opacity: 0.7; cursor: pointer; z-index: -1; transition: top .3s; } .body-scrolled .search-bar__overlay { position: fixed; inset: 0; top: var(--logo-height-scrolled); background: var(--black); opacity: 0.6; } .search-bar__results { margin-top: 2rem; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 1rem; row-gap: 2rem; list-style: none; } .search__link-item { padding: 0.25rem 0.5rem; width: 15rem; text-align: center; } .search__x-button { appearance: none; position: fixed; top: 2rem; left: 2rem; border: 1px solid var(--button-border); border-radius: 100%; padding: 0.25rem; display: flex; flex-direction: column; align-items: center; justify-content: center; background: transparent; color: var(--button-border); z-index: 1; cursor: pointer; transition: all 0.3s; } .search__x-button:focus, .search__x-button:hover { color: var(--button-border-hover); border-color: var(--button-border-hover); }.sermon-archive { margin-top: var(--sermon-archive-margin); margin-bottom: var(--sermon-archive-margin); display: grid; grid-row-gap: var(--sermon-archive-row-gap); grid-column-gap: var(--sermon-archive-col-gap); } .sermon { margin-top: 3rem; margin-bottom: 3rem; } .sermon__content { margin: 3rem auto; max-width: var(--sermon-content-width); } .sermon__content-cards { margin: 1rem auto; display: flex; justify-content: center; gap: 2rem; max-width: var(--sermon-content-width); } .sermon__audio-content audio { width: 100%; } .sermon__download-wrapper { grid-column: span var(--sermon-content-item-width); text-align: center; } .sermon__download { border-radius: 100%; height: 5.5rem; width: 5.5rem; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem; background: var(--sermon-download-background); color: var(--sermon-download-text); fill: var(--sermon-download-text); transition: all .2s; } .sermon__download:hover { background: var(--sermon-download-background-hover); color: var(--sermon-download-text-hover); fill: var(--sermon-download-text-hover); } .sermon__download-icon { width: 1.5rem; }.staff-member { display: grid; grid-row-gap: 1rem; grid-column-gap: 3rem; align-items: center; justify-content: center; } .staff-member.staff-member--horizontal { grid-template-columns: var(--staff-image-width) 1fr; } .staff-member.staff-member--vertical { align-items: flex-start; text-align: center; } .staff-member__image { display: block; margin: auto; width: var(--staff-image-width); height: var(--staff-image-width); object-fit: cover; } .staff-member__image.staff-member__image--small { margin: auto; height: var(--staff-image-width); } .staff-member__content { margin: auto; max-width: 90%; display: flex; flex-direction: column; row-gap: 0.5rem; }.wp-block-details.ccontain { max-width: calc(100% - 24px); } .wp-block-details, .summary-select { border: 1px solid black; padding: 0.5rem 0.75rem; } .summary-select a { display: inline-block; width: 100%; cursor: pointer; } .wp-block-details summary, .summary-select__summary { display: flex; align-items: center; justify-content: space-between; cursor: pointer; } .wp-block-details summary + *, .summary-select__contents { margin-top: 0.5rem; border-top: 1px solid var(--grey-one); padding-top: 0.5rem; list-style: none; } .wp-block-details summary::after { content: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M233.4%20406.6c12.5%2012.5%2032.8%2012.5%2045.3%200l192-192c12.5-12.5%2012.5-32.8%200-45.3s-32.8-12.5-45.3%200L256%20338.7%2086.6%20169.4c-12.5-12.5-32.8-12.5-45.3%200s-12.5%2032.8%200%2045.3l192%20192z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E'); display: inline-block; width: 1rem; transform: scaleY(1.0); transition: transform 0.2s; } .wp-block-details[open] summary::after { transform: scaleY(-1.0); } .summary-select__icon { max-width: 1rem; transform: scaleY(1.0); transition: transform 0.2s; } .summary-select[open] .summary-select__icon { transform: scaleY(-1.0); } .summary-select__item + .summary-select__item { margin-top: 0.25rem; }.tile .image-wrapper { padding-bottom: var(--card-image-aspect-ratio); }* { font-family: var(--font-family-general); letter-spacing: var(--font-general-letter-spacing); line-height: var(--font-general-line-height); } body { font-size: var(--font-size-general); } h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 { font-family: var(--font-family-headings); text-transform: var(--font-header-transform); letter-spacing: var(--font-header-letter-spacing); line-height: var(--font-header-line-height); } h1, .h1 { font-size: var(--header-one-mobile-size); } h2, .h2 { font-size: var(--header-two-mobile-size); } h3, .h3 { font-size: var(--header-three-mobile-size); } .to-load-in { opacity: 0; transform: translateY(30px); transition: all 0.7s; } .to-load-in.loaded { opacity: 1; transform: translateY(0); } .text-large { font-size: 1.4rem; font-weight: 500; } .text-small { font-size: 0.9rem; } .text-justify { text-align: justify; } a { color: var(--link); text-underline-offset: 2px; transition: all 0.2s; } a:hover, a:focus { color: var(--link-hover); text-underline-offset: 2px; }@media screen and (min-width: 750px) {blockquote.wp-block-quote { padding-top: 2rem; padding-left: 5rem; } blockquote.wp-block-quote::before { top: auto; left: 0.5rem; width: 4.5rem; }.flexible-grid { grid-template-columns: repeat(var(--number-columns-tablet), 1fr); } .flex-grid > * { flex-basis: calc((100% - (var(--number-columns-tablet) - 1) * var(--sermon-archive-col-gap)) / var(--number-columns-tablet)); flex-shrink: 0; }.footer-menu--mobile { display: none; } .footer-menu--desktop { display: block; } .footer-menu__list { display: flex; justify-content: center; column-gap: 4rem; } .footer-menu__item { display: flex; flex-direction: column; align-items: center; } .footer-menu svg { display: none; }.sermon-archive { grid-template-columns: repeat(var(--sermon-archive-grid-tablet-size), 1fr); }h1, .h1 { font-size: var(--header-one-desktop-size); } h2, .h2 { font-size: var(--header-two-desktop-size); } h3, .h3 { font-size: var(--header-three-desktop-size); }}@media screen and (min-width: 1150px) {.contact-form { grid-template-columns: repeat(2, 1fr); column-gap: 3rem; } .contact-form__item--big { grid-column: 1 / span 2; }.desktop-only { display: block; } .desktop-only-flex { display: flex; } .mobile-only { display: none; } .flexible-grid { grid-template-columns: repeat(var(--number-columns), 1fr); } .flex-grid > * { flex-basis: calc((100% - (var(--number-columns) - 1) * var(--sermon-archive-col-gap)) / var(--number-columns)); }.header__search-trigger { display: flex; }.page-content__have-children { display: grid; grid-template-columns: var(--page-content-columns); grid-column-gap: 3rem; } .page-content__sidebar { grid-column-start: var(--page-content-sidebar-position); } .page-content__sidebar, .page-content__contents { grid-row-start: 1; } .page-content__sidebar-list { display: flex; flex-direction: column; gap: 0.5rem; list-style: none; } .page-content__sidebar-select { display: none; }.sermon-archive { grid-template-columns: repeat(var(--sermon-archive-grid-size), 1fr); }}:root { --primary: #890024; --primary-hover: #A00005; --secondary: #2aaa00; --secondary-hover: #2d8200; --tertiary: #1815d3; --tertiary-hover: #0200a3; --white: #FFFFFF; --off-white: #EEEEEE; --grey-one: #D1D1D1; --grey-two: #AAAAAA; --grey-three: #7F7F7F; --grey-four: #494949; --black: #000000; --transparent: transparent; --link: #890024; --link-on: var(--grey-one); --link-hover: #a00005; --button-background: var(--black); --button-background-hover: var(--primary); --button-border: var(--black); --button-border-hover: var(--primary-hover); --button-text: var(--white); --button-text-hover: var(--white); --ada-outline: #87CEEB; --label-color: var(--black); --input-border: var(--black); --input-background: var(--transparent); --input-background-hover: var(--off-white); --input-background-active: var(--transparent); --font-family-general: "Open Sans", sans-serif; --font-family-headings: "Roboto", sans-serif; --font-size-general: 16px; --font-header-transform: none; --font-header-letter-spacing: 0px; --font-header-line-height: ; --font-general-letter-spacing: .2px; --font-general-line-height: 1.6; --header-one-mobile-size: 2.5rem; --header-one-desktop-size: 3.1rem; --header-two-mobile-size: 2.2rem; --header-two-desktop-size: 2.7rem; --header-three-mobile-size: 1.7rem; --header-three-desktop-size: 2.3rem; --ccontain: 1252px; --number-columns-mobile: 1; --number-columns-tablet: 2; --number-columns: 2; --header-background: var(--black); --header-text: var(--white); --header-text-hover: var(--off-white); --submenu-background: var(--off-white); --submenu-text-color: var(--link); --submenu-text-color-hover: var(--link-hover); --header-text-font-family: "Open Sans", sans-serif; --header-text-transform: ; --header-text-letter-spacing: 0px; --header-text-font-size: 16px; --header-text-font-weight: 400; --logo-height: 80px; --logo-height-scrolled: 60px; --hero-background: var(--black); --hero-opacity: 0.8; --hero-text: var(--off-white); --hero-height: 40vh; --hero-text-only-height: 30vh; --breadcrumbs: var(--secondary); --breadcrumbs-transparent: rgba(42,170,0,); --breadcrumbs-text: var(--white); --breadcrumbs-text-hover: var(--off-white); --blockquote-max-width: 800px; --blockquote-quote-font: "Open Sans", sans-serif; --blockquote-quote-font-size: 4rem; --blockquote-background: var(--off-white); --blockquote-name: var(--grey-four); --footer-padding: 48px; --footer-pattern-width: 25%; --footer-background: var(--black); --footer-text: var(--white); --footer-link-hover: var(--off-white); --copyright-background: var(--black); --copyright-text: var(--grey-two); --border-width-small: 0px; --border-width-small: 1px; --border-width-medium: 2px; --border-width-wide: 3px; --sermon-archive-grid-tablet-size: 2; --sermon-archive-grid-size: 2; --sermon-archive-margin: 3rem; --sermon-archive-row-gap: 3rem; --sermon-archive-col-gap: 2rem; --card-overlay-background: var(--black); --card-overlay-opacity: 0.5; --card-overlay-opacity-hover: 0.5; --card-image-aspect-ratio: 50%; --card-contents-padding: 10px 20px; --card-contents-alignment: left; --card-contents-spacing: 10px; --card-contents-background: rgba(255,255,255,0.5); --card-contents-text: var(--black); --card-contents-links: var(--link); --card-contents-links-hover: var(--link-hover); --sermon-content-item-width: 2; --sermon-content-width: 800px; --sermon-download-background: var(--grey-one); --sermon-download-background-hover: var(--grey-one); --sermon-download-text: var(--link); --sermon-download-text-hover: var(--link-hover); --calendar-header-background: var(--secondary); --calendar-header-text: var(--white); --calendar-outline: var(--black); --calendar-background-one: var(--white); --calendar-background-two: var(--off-white); --calendar-border-width: var(--border-width-small); --pagination-link: var(--primary); --pagination-link-hover: var(--primary-hover); --pagination-link-background: var(--white); --pagination-link-active: var(--black); --page-content-sidebar-position: 2; --page-content-columns: 1fr 20rem; }