@charset "UTF-8";
/* source-sans-3-300 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: normal;
font-weight: 300;
src: url("../fonts/source-sans-3-v19-latin-300.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-300italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: italic;
font-weight: 300;
src: url("../fonts/source-sans-3-v19-latin-300italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: normal;
font-weight: 400;
src: url("../fonts/source-sans-3-v19-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: italic;
font-weight: 400;
src: url("../fonts/source-sans-3-v19-latin-italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-500 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: normal;
font-weight: 500;
src: url("../fonts/source-sans-3-v19-latin-500.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-500italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: italic;
font-weight: 500;
src: url("../fonts/source-sans-3-v19-latin-500italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-600 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: normal;
font-weight: 600;
src: url("../fonts/source-sans-3-v19-latin-600.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-600italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: italic;
font-weight: 600;
src: url("../fonts/source-sans-3-v19-latin-600italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: normal;
font-weight: 700;
src: url("../fonts/source-sans-3-v19-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-700italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Source Sans 3";
font-style: italic;
font-weight: 700;
src: url("../fonts/source-sans-3-v19-latin-700italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-300 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: normal;
font-weight: 300;
src: url("../fonts/nunito-sans-v19-latin-300.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-300italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: italic;
font-weight: 300;
src: url("../fonts/nunito-sans-v19-latin-300italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: normal;
font-weight: 400;
src: url("../fonts/nunito-sans-v19-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: italic;
font-weight: 400;
src: url("../fonts/nunito-sans-v19-latin-italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-500 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: normal;
font-weight: 500;
src: url("../fonts/nunito-sans-v19-latin-500.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-500italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: italic;
font-weight: 500;
src: url("../fonts/nunito-sans-v19-latin-500italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-600 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: normal;
font-weight: 600;
src: url("../fonts/nunito-sans-v19-latin-600.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-600italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: italic;
font-weight: 600;
src: url("../fonts/nunito-sans-v19-latin-600italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: normal;
font-weight: 700;
src: url("../fonts/nunito-sans-v19-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-700italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: "Nunito Sans";
font-style: italic;
font-weight: 700;
src: url("../fonts/nunito-sans-v19-latin-700italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
header,
footer {
flex-grow: 0;
}
@media (min-width: 750px) {
footer {
margin-top: -1.875rem;
}
}
a {
text-decoration: underline;
font-weight: 400;
color: #0C434A;
}
a:hover {
color: #83A348;
} /* #357266 */
a:focus-visible {
outline: 2px solid #2A6E73;
outline-offset: 2px;
}
.text-sm {
margin-bottom: clamp(
0.25rem,
0.111rem + 0.444vw,
0.5rem
);
}
h2.title {
text-align: center;
margin-bottom: clamp(
0.625rem,
0.451rem + 0.556vw,
0.938rem
);
}
/* Subtext below an H2. Need to account for margin-bottom on H2.*/
.h2-subtext {
font-size: 1.75rem;
font-weight: 500; /* Slightly heavier than body, but not bold */
line-height: 1.5;
text-align: center;
font-style: italic;
margin-top: -20px;
padding-top: 0;
margin-bottom: clamp(
1.5rem,
1.222rem + 0.889vw,
2rem
) !important; /* Add the bottom margin usually applied to H2 */
}
p.title {
font-size: clamp(
2rem,
1.792rem + 0.667vw,
2.375rem
);
color: #83A348;
margin-bottom: 0px;
}
/* Lead paragraph - stands out slightly more than normal text */
.lead {
font-size: 1.75rem;
font-weight: 400; /* Slightly heavier than body, but not bold */
line-height: 1.5;
}
/* Note paragraph - slightly smaller, softer color */
.note {
font-size: 0.875rem;
color: rgba(0, 0, 0, 0.7); /* or your theme's muted gray */
font-style: italic;
line-height: 1.4;
}
blockquote {
font-size: clamp(
1.125rem,
0.847rem + 0.889vw,
1.625rem
);
line-height: 1.25;
font-weight: 600;
position: relative;
color: #FFFFFF;
font-style: italic;
text-align: center;
padding-left: clamp(
0.063rem,
-0.597rem + 2.111vw,
1.25rem
);
padding-right: clamp(
0.063rem,
-0.597rem + 2.111vw,
1.25rem
);
background-color: rgba(53, 114, 102, 0.5);
box-shadow: 0px 0px 15px 15px rgba(53, 114, 102, 0.5);
}
/* Base styling to match your other summaries */
summary {
list-style: none; /* remove default marker */
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px;
cursor: pointer;
font-weight: 600;
color: #0C434A;
position: relative;
}
/* add a chevron marker using an SVG background */
summary::before {
content: "";
display: inline-block;
width: 1.25em;
height: 1.25em;
background: no-repeat center/contain url('data:image/svg+xml;utf8,');
transition: transform 0.2s ease;
vertical-align: middle;
}
/* rotate when is open */
details[open] summary::before {
transform: rotate(180deg);
}
@media screen and (max-width: 600px) {
blockquote {
margin-left: 10px;
margin-right: 10px;
}
}
@media (max-width: 800px) {
figure {
margin-bottom: 1.313rem;
}
}
.prose {
/* This ensures that if an H3 follows a Paragraph, there is a larger gap
than if a Paragraph follows a Paragraph. */
/* Makes links within text blocks stand out beautifully */
}
.prose p + h3 {
margin-top: 2.313rem;
}
.prose a {
color: #83A348;
font-weight: 600;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 3px;
}
.prose a:hover {
color: #0C434A;
}
.btn-table {
padding: 8px 16px;
font-size: clamp(
0.938rem,
0.833rem + 0.333vw,
1.125rem
);
}
.btn-primary {
background-color: #126872; /* Initial solid color */
color: #F6F3EE;
}
.btn-primary:hover {
background-color: #83A348; /* Target solid color */
color: #F6F3EE;
}
.btn-moss {
background-color: #A0C16D;
color: #072F33;
}
.btn-moss:hover {
background-color: #83A348;
color: #072F33;
}
.btn-rose {
background-color: #885C67;
color: #FFFFFF;
}
.btn-rose:hover {
background-color: #431D35;
color: #FFFFFF;
}
.btn-sand {
background-color: #D5C4A1;
color: #0F5132;
}
.btn-sand:hover {
background-color: #C1AA92;
color: #0F5132;
}
.btn--ghost {
background: transparent;
color: #FFFFFF;
border-color: #FFFFFF;
border: 2px solid;
}
.btn--ghost.dark {
color: #0F5132;
border-color: #0F5132;
}
/* Fluid design for Floating images of 400px width inside of a paragraph.
Applied to the img element. min and max-width needed to keep image from scaling too much
on very large and small devices. Actual image height and width can be put on the ![]()
for screen readers without affecting the fluid layout. */
.float-right-400 {
float: none;
width: 25rem;
height: auto;
min-width: 12.5rem;
max-width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.563rem;
}
@media screen and (min-width: 800px) {
.float-right-400 {
float: right;
width: max(50px, 40%); /* Don't let it shrink too much */
height: auto;
min-width: 12.5rem;
max-width: 25rem;
margin-left: 1.875rem;
margin-right: 0.625rem;
margin-bottom: 1.563rem;
}
}
@media screen and (min-width: 1400px) {
p .float-right-400 {
max-width: 31.25rem;
}
}
.float-right-500 {
float: none;
width: 31.25rem;
height: auto;
min-width: 12.5rem;
max-width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.563rem;
}
@media screen and (min-width: 800px) {
.float-right-500 {
float: right;
width: max(50px, 40%); /* Don't let it shrink too much */
height: auto;
min-width: 12.5rem;
max-width: 31.25rem;
margin-left: 1.875rem;
margin-right: 0.625rem;
margin-bottom: 1.563rem;
}
}
.hidden {
display: none;
}
.visually-hidden {
position: absolute !important;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
width: 1px;
height: 1px;
word-wrap: normal;
}
.visually-hidden.focusable:active, .visually-hidden.focusable:focus {
position: static !important;
overflow: visible;
clip: auto;
width: auto;
height: auto;
}
.invisible {
visibility: hidden;
}
.img-round {
border-radius: 50%;
}
.img-opacity-50 {
opacity: 0.85;
}
@media screen and (min-width: 403px) {
.float-right-400 {
border-radius: 4px;
}
}
.cloth-background {
position: relative;
background-image: url("/sites/default/files/page_img/cloth-backgrnd-20op.webp ");
background-position: top center;
background-size: 100%;
background-repeat: repeat;
background-color: #F9F6EE;
}
/* --- Universal HHC Card --- */
.hhc-card {
display: grid;
grid-template-columns: minmax(300px, 600px) 1fr;
grid-template-areas: "media content";
gap: 3rem;
align-items: stretch; /* Ensures the "Perfect Rectangle" height */
margin-bottom: 2.313rem;
overflow: hidden;
}
/* Modifier: Image on the Right */
.hhc-card.--reverse {
grid-template-columns: 1fr minmax(300px, 600px);
grid-template-areas: "content media";
}
/* Modifier: Highlight (Teal/Plum) Backgrounds */
/* This fixes your dark-on-dark text in the price block */
.hhc-card.--highlight {
grid-template-columns: 1fr 2fr; /* 33% media, 66% content */
background: linear-gradient(180deg, #072F33 0%, #126872 100%);
border-radius: 0.75rem;
padding-left: 0rem;
padding-right: 1.5rem;
align-items: center; /* Better for short text blocks like price lists */
}
.hhc-card.--highlight .hhc-card__content h3,
.hhc-card.--highlight .hhc-card__content p,
.hhc-card.--highlight .hhc-card__content a,
.hhc-card.--highlight .white-font {
color: #FFFFFF !important;
}
.hhc-card.--highlight .hhc-card__media img {
width: auto;
height: auto;
max-width: 100%;
}
/* --- Sub-Components --- */
.hhc-card__media {
grid-area: media;
display: flex;
}
.hhc-card__media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover; /* Prevents distortion */
border-radius: 0.75rem;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}
.hhc-card__content {
grid-area: content;
display: flex;
flex-direction: column;
justify-content: center;
padding: 0.75rem 0;
}
.hhc-card__content h3 {
font-size: clamp(
2rem,
1.826rem + 0.556vw,
2.313rem
);
color: #0C434A;
margin-bottom: 1rem;
}
/* Modifier for Vertical Stacking (3-column layouts) */
.hhc-card.--vertical {
grid-template-columns: 1fr; /* Single column */
grid-template-areas: "media" "content";
gap: 1rem;
background: #FFFFFF; /* Or $paper */
border: 1px solid rgba(0, 0, 0, 0.05);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.hhc-card.--vertical .hhc-card__media img {
height: 250px; /* Fixed height for consistency in the grid */
border-radius: 0.75rem 0.75rem 0 0; /* Round only top corners */
}
.hhc-card.--vertical .hhc-card__content {
padding: 1.5rem;
text-align: left;
}
.hhc-card.--vertical .hhc-card__content h3 {
text-align: left;
}
/* Modifier: Plum/Dark Background (for your "What to Expect" section) */
.hhc-card.--plum {
background: linear-gradient(180deg, #431D35 0%, #571d49 100%);
}
.hhc-card.--plum .hhc-card__content h3,
.hhc-card.--plum .hhc-card__content p,
.hhc-card.--plum .hhc-card__content a {
color: #FFFFFF !important;
}
/* --- Mobile Stacking --- */
@media (max-width: 900px) {
.hhc-card, .hhc-card.--reverse, .hhc-card.--highlight {
grid-template-columns: 1fr;
grid-template-areas: "media" "content";
gap: 1.5rem;
padding-left: 0rem;
padding-right: 0rem;
}
.hhc-card__media img {
height: auto;
max-height: 400px;
}
.hhc-card__content {
text-align: left;
padding: 1rem;
}
}
.retreat-picker {
margin-bottom: 2.313rem;
}
.retreat-picker header {
text-align: center;
margin-bottom: 1.75rem;
}
.retreat-picker header h2 {
margin-bottom: 0.75rem;
}
.retreat-picker header p {
color: #475569;
max-width: 40rem;
margin-left: auto;
margin-right: auto;
}
.retreat-testimonial {
text-align: center;
margin-bottom: 2.313rem;
}
.retreat-testimonial cite {
display: block;
font-style: normal;
font-size: 0.875rem;
color: #F6F3EE;
margin-top: 0.75rem;
}
.retreat-picker__card {
display: flex;
flex-direction: column;
}
.retreat-picker__card.--featured {
background: rgba(12, 67, 74, 0.03);
border-top: 3px solid #D4AF37;
}
.retreat-picker__badge {
display: inline-block;
background: #D4AF37;
color: #FFFFFF;
font-size: 0.875rem;
font-weight: 600;
padding: 0.25rem 0.75rem;
border-radius: 0.25rem;
margin-bottom: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.retreat-picker__meta {
font-size: 1rem;
color: #475569;
margin-bottom: 0.75rem;
}
.retreat-picker__best-for {
font-style: italic;
color: #2A6E73;
margin-bottom: 0.75rem;
}
.retreat-picker__price {
font-size: 0.875rem;
color: #6b7280;
margin-top: 1.313rem;
margin-bottom: 0;
}
.retreat-link {
color: #2A6E73;
font-weight: 600;
text-decoration: none;
}
.retreat-link:hover {
color: #0C434A;
text-decoration: underline;
}
.retreat-trust-strip {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1.313rem;
margin-top: 2.313rem;
padding: 1.313rem;
background: rgba(12, 67, 74, 0.03);
border-radius: 0.75rem;
}
.retreat-trust-strip span {
font-size: 0.875rem;
color: #475569;
}
.retreat-trust-strip span:not(:last-child)::after {
content: "·";
margin-left: 1.313rem;
color: #6b7280;
}
@media (max-width: 800px) {
.retreat-picker header p {
padding-left: 0.75rem;
padding-right: 0.75rem;
}
.retreat-testimonial {
padding-left: 0.75rem;
padding-right: 0.75rem;
margin-bottom: 1.75rem;
}
.retreat-trust-strip {
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.retreat-trust-strip span::after {
display: none;
}
.retreat-picker__card {
margin-left: 0.5rem;
margin-right: 0.5rem;
}
}
/* Container that forces 3 columns horizontally */
.expectations-layout {
display: grid;
/* repeat(3, 1fr) forces 3 columns.
On screens smaller than 900px, it switches to 1 column. */
grid-template-columns: repeat(3, 1fr);
gap: 0.75rem;
max-width: 75rem;
margin: 2.313rem auto;
padding: 0 1rem;
}
/* The Vertical Card (Image on TOP, Text on BOTTOM) */
.expectation-card {
display: flex;
flex-direction: column; /* This stacks internal content, NOT the cards themselves */
background: linear-gradient(180deg, #431D35 0%, #571d49 100%);
border-radius: 0.75rem;
overflow: hidden;
height: 100%; /* Ensures all cards in the row have the same height */
}
.expectation-card__media img {
width: 100%;
height: 220px; /* Sets a uniform height for all 3 images */
object-fit: cover; /* Prevents squishing */
}
.expectation-card__content {
padding: 1.5rem;
display: flex;
flex-direction: column;
flex-grow: 1; /* Pushes the button to the bottom */
color: #FFFFFF !important;
}
.expectation-card__content h3 {
color: #FFFFFF !important;
text-align: center;
font-size: clamp(
1.313rem,
1.069rem + 0.778vw,
1.75rem
);
margin-bottom: 1rem;
}
.expectation-card__content p {
color: #FFFFFF;
}
.expectation-card__footer {
margin-top: auto; /* Aligns buttons in a perfect row at the bottom */
text-align: center;
padding-top: 1rem;
}
/* Add this to expectation-cards.scss */
.expectation-card.--teal {
background: linear-gradient(180deg, #072F33 0%, #126872 100%);
/* Ensure all text, lists, and headings are white */
}
.expectation-card.--teal .expectation-card__content h3, .expectation-card.--teal .expectation-card__content h4, .expectation-card.--teal .expectation-card__content p, .expectation-card.--teal .expectation-card__content strong, .expectation-card.--teal .expectation-card__content span, .expectation-card.--teal .expectation-card__content .list-arrow {
color: #FFFFFF !important;
}
/* List styling for the checkmarks/arrows */
.expectation-card__list {
margin: 1rem 0;
list-style: none;
padding: 0;
}
.expectation-card__list li {
color: #FFFFFF;
font-size: 0.875rem;
margin-bottom: 0.5rem;
line-height: 1.4;
font-weight: 600;
}
.expectation-card__list .list-arrow {
margin-right: 0.5rem;
color: #FFFFFF;
}
/* Responsive: Flip to vertical stack on tablets/phones */
@media (max-width: 900px) {
.expectations-layout {
grid-template-columns: 1fr;
}
}
.width-100-pct {
width: 100%;
margin-bottom: clamp(
2.313rem,
1.271rem + 3.333vw,
4.188rem
);
padding-top: clamp(
0.5rem,
0.222rem + 0.889vw,
1rem
);
padding-bottom: 0.5rem;
}
.background-pale-green {
background-color: rgba(87, 213, 87, 0.15);
}
.background-plum, .background-plum p, .background-plum ol li {
background-color: #431D35;
color: #fdfdfd;
}
.background-plum h2, .background-plum h3, .background-plum p h2, .background-plum p h3, .background-plum ol li h2, .background-plum ol li h3 {
color: #D4AF37;
}
.background-plum a, .background-plum p a, .background-plum ol li a {
color: #D4AF37;
text-decoration: underline;
}
.background-plum a:hover, .background-plum a:focus, .background-plum p a:hover, .background-plum p a:focus, .background-plum ol li a:hover, .background-plum ol li a:focus {
color: #FFFFFF;
}
.background-plum ul li {
color: #fdfdfd;
}
.background-plum a:not(.btn) {
color: #FFA68E;
}
.background-plum a:hover:not(.btn) {
color: #83A348;
}
.background-teal, .background-teal p {
background-color: #0C434A;
color: #FFFFFF;
}
.background-teal ol li {
color: #FFFFFF;
}
/* override inside intl-features */
.background-teal .intl-features p {
background-color: #FFFFFF;
color: #1F1F1F;
}
.background-teal .hhc-callout p {
background: inherit;
color: #FDFBFA;
}
.background-teal a:not(.btn) {
color: #FFA68E;
}
.background-teal a:hover:not(.btn) {
color: #885C67;
}
.background-plum h2, .background-plum h3,
.background-teal h2, .background-teal h3 {
color: #FFFFFF;
}
.background-teal .card h3 {
color: inherit; /* or whatever the default should be */
}
.background-plum.col-4 {
padding-top: 40px;
}
.background-tan {
background: #C1AA92;
padding-top: 2.313rem;
padding-bottom: 2rem;
}
.background-tan h2 {
color: #357266;
}
.hhc-article-wrap {
margin-bottom: clamp(
2.313rem,
1.271rem + 3.333vw,
4.188rem
);
width: 100%;
max-width: 78.125rem;
margin-left: auto;
margin-right: auto;
padding: 0 1rem;
}
.hhc-article-wrap::after {
content: "";
display: table;
clear: both;
}
.hhc-article-wrap__image {
display: block;
width: 100%;
height: auto;
border-radius: 0;
margin-bottom: 1.5rem;
}
@media (min-width: 800px) {
.hhc-article-wrap__image.float-right, .hhc-article-wrap__image.float-left {
border-radius: 0.75rem;
width: 40%;
max-width: 500px;
margin-bottom: 1rem;
}
.hhc-article-wrap__image.float-right {
float: right;
margin-left: clamp(
1.5rem,
0.944rem + 1.778vw,
2.5rem
);
}
.hhc-article-wrap__image.float-left {
float: left;
margin-right: clamp(
1.5rem,
0.944rem + 1.778vw,
2.5rem
);
}
}
.hhc-article-wrap header h2, .hhc-article-wrap header h3 {
margin-bottom: clamp(
1.5rem,
1.222rem + 0.889vw,
2rem
);
}
.hhc-article-wrap p {
margin-bottom: clamp(
1rem,
0.722rem + 0.889vw,
1.5rem
);
line-height: 1.6;
}
.hhc-article-wrap p:last-child {
margin-bottom: 0;
}
.four-column-block {
display: flex;
flex-direction: row;
gap: min(2em, 3vw);
justify-content: left;
}
.col-4 {
flex: 1; /* ensures equal width */
padding: 20 1.5rem;
text-align: center;
}
.four-column-block .col-4 {
display: flex;
flex-direction: column;
align-items: center; /* optional */
gap: 2rem; /* handles all vertical spacing */
}
@media only screen and (max-width: 800px) {
.four-column-block {
flex-direction: column;
}
.col-4 {
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.5rem;
}
}
.column-block {
display: flex;
flex-direction: row;
gap: min(2em, 3vw);
justify-content: left;
}
.col-item {
flex: 1; /* ensures equal width */
padding: 1.5rem;
text-align: center;
}
.col-item.contact-form {
padding: 0.25rem;
}
.col-item.left-align {
text-align: left;
}
.column-block .col-item {
display: flex;
flex-direction: column;
align-items: center; /* optional */
gap: 2rem; /* handles all vertical spacing */
}
@media only screen and (max-width: 800px) {
.column-block {
flex-direction: column;
}
.col-item {
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.5rem;
}
.col-item.contact-form {
width: 98%;
}
}
.cluster {
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: center;
}
.top-section > h2 {
font-size: clamp(28px, 4vw, 40px);
text-align: left;
}
.top-section {
display: grid;
gap: var(--space-20);
grid-template-columns: 1.1fr 0.9fr;
align-items: center;
}
.top-section .kpis {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 10px;
}
.kpi {
background: #f5f7f7;
border: 1px solid #e4eded;
border-radius: 12px;
padding: 10px 12px;
text-align: center;
}
.kpi .big {
display: block;
font-weight: 700;
font-size: 22px;
color: #0C434A;
}
.note {
font-size: 0.95rem;
color: #2e4a4e;
}
.facts {
margin-top: var(--space-28);
background: #f9fbfb;
border: 1px solid #e6efef;
border-radius: var(--radius);
padding: var(--space-20);
}
.facts ul {
display: grid;
gap: 8px;
margin-top: 8px;
}
.grid {
display: grid;
gap: var(--space-24);
}
.two {
grid-template-columns: 1fr 1fr;
}
.rp-card {
background: #fff;
border: 1px solid #e9eeee;
border-radius: var(--radius);
padding: var(--space-20);
}
.rp-card.alt {
background: #F4EEE9;
border-color: #efe7df;
}
.media-rp-card {
display: grid;
grid-template-columns: 520px 1fr;
gap: 20px;
align-items: center;
}
.media-rp-card .media {
border-radius: 12px;
overflow: hidden;
}
.checklist {
list-style: none;
padding-left: 0;
display: grid;
gap: 8px;
}
.checklist li {
padding-left: 26px;
position: relative;
}
.checklist li:before {
content: "✓";
position: absolute;
left: 0;
top: 0;
color: #2F6B44;
font-weight: 700;
}
.box {
background: #fff;
border: 1px solid #e9eeee;
border-radius: 12px;
padding: 16px;
}
.cmp-links {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.rp-faq details {
border: 1px solid #e9eeee;
border-radius: 12px;
padding: 12px 14px;
background: #fff;
}
.rp-faq details + details {
margin-top: 10px;
}
.rp-faq summary {
cursor: pointer;
font-weight: 600;
color: #0C434A;
display: inline-flex;
align-items: center;
gap: 8px;
}
.rp-faq summary::marker {
content: "";
}
.rp-faq summary .chev {
width: 18px;
height: 18px;
transition: transform 0.2s ease;
}
.rp-faq details[open] summary .chev {
transform: rotate(180deg);
}
.cta-band {
margin: var(--space-28) 0;
padding: 18px;
border-radius: 12px;
background: linear-gradient(90deg, #072F33, #126872);
color: #fff;
}
.cta-band .btn {
background: #FFA68E;
color: #072F33;
}
.asides {
display: grid;
gap: var(--space-24);
}
.aside {
display: grid;
gap: 10px;
}
.aside .caption {
font-size: 0.95rem;
color: #274a4e;
}
footer.small {
color: #5d6f72;
font-size: 0.9rem;
margin: 24px auto;
width: var(--w);
}
@media (max-width: 1100px) {
.top-section {
grid-template-columns: 1fr;
}
.media-rp-card {
grid-template-columns: 1fr;
}
}
@media (max-width: 720px) {
.top-section .kpis {
grid-template-columns: repeat(2, 1fr);
}
.two {
grid-template-columns: 1fr;
}
}
.container {
margin: 0 auto;
padding: 0 20px;
}
.band {
padding: 56px 0;
}
.small {
font-size: 0.95rem;
opacity: 0.9;
}
.cta-row {
display: flex;
gap: 2rem;
flex-wrap: wrap;
justify-content: center;
}
.jump {
display: flex;
flex-wrap: wrap;
gap: 10px 12px;
margin-bottom: 1.5rem;
}
.jump--balanced {
--min: 180px;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(var(--min), 1fr));
gap: 12px;
}
.jump--balanced .chip {
display: flex; /* so text centers nicely if your btn doesn't do this */
align-items: center;
justify-content: center;
text-align: center;
width: 100%; /* make each button stretch to the grid cell */
}
/* Section band (match your page) */
.band {
padding: 56px 0;
background: var(--white);
}
.note-rt {
background: linear-gradient(180deg, #F3EBDD, #FFF);
border-left: 4px solid var(--sand);
padding: 12px 14px;
border-radius: 12px;
color: #5b4a2f;
}
.icon {
width: 56px;
height: 56px;
border-radius: 14px;
display: grid;
place-items: center;
background: var(--clay);
color: #2b2b2b;
font-size: 48px;
line-height: 1;
border: 1px solid rgba(0, 0, 0, 0.06);
}
/* SAFETY BAND LAYOUT */
.safety-band .safety-inner {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap; /* stack on mobile */
gap: 1.5rem;
}
.safety-band .safety-text {
flex: 1 1 320px;
}
.safety-band .safety-image {
flex: 0 0 auto;
max-width: 150px; /* size control */
}
.safety-band .safety-image img {
display: block;
max-width: 100%;
height: auto;
}
/* Mobile: stack vertically and center image */
@media (max-width: 700px) {
.safety-band .safety-inner {
flex-direction: column;
text-align: center;
}
.safety-band .safety-image {
margin-top: 1rem;
}
}
.font-white {
color: #FFFFFF;
}
.soft-teal {
color: #357266;
}
.flex-justify {
display: flex;
flex-direction: row;
justify-content: space-around;
}
@media screen and (max-width: 800px) {
.flex-justify {
flex-direction: column;
align-items: center;
gap: 1rem;
}
}
.centered {
margin-left: auto;
margin-right: auto;
}
.left-align {
text-align: left;
}
.margin-top-zero {
margin-top: 0rem;
}
.margin-bottom-zero {
margin-bottom: 0rem;
}
.padding-bottom-zero {
padding-bottom: 0px;
}
/* accesability moves content offscreen to hide it, but still readable by screen readers*/
.a11y-hidden {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
clip: rect(0 0 0 0);
clip-path: inset(50%);
overflow: hidden;
white-space: nowrap;
}
.zpad-div-top {
padding-top: 0.313rem;
}
.zmargin-div-bottom {
margin-bottom: 0.625rem;
}
.pad-div-lr {
padding-left: clamp(
1rem,
0.444rem + 1.778vw,
2rem
);
padding-right: clamp(
1rem,
0.444rem + 1.778vw,
2rem
);
padding-top: 0.5rem;
padding-bottom: 0.5rem;
box-sizing: border-box;
}
/* Styles used for colored sections */
.full-width {
width: 100vw;
max-width: 1400px;
position: relative;
left: 50%;
right: 50%;
margin-top: 10px;
/* important for making full width. Divs in this container will need margins adjusted.*/
margin-left: -50vw;
margin-right: -50vw;
padding-top: 5px;
}
@media screen and (min-width: 1400px) {
.full-width {
width: 1400px;
left: -1.5%;
margin-left: auto;
margin-right: auto;
}
}
/* Used for images used as links within text of a paragraph*/
.img-link-in-text {
max-width: none;
display: inline;
border-radius: 0px;
display: inline;
margin-right: 15px;
}
.review-links {
text-align: center;
margin-top: 30px;
background: rgba(0, 255, 0, 0.08);
background-color: rgba(9, 221, 9, 0.12);
padding-top: 2px;
padding-bottom: 15px;
}
.review-links-text {
font-size: clamp(
1.188rem,
0.91rem + 0.889vw,
1.688rem
);
font-weight: 700;
color: #21752c;
}
ol {
list-style: decimal;
}
ol li {
margin-left: 2.5rem;
margin-right: clamp(
1rem,
0.444rem + 1.778vw,
2rem
);
margin-bottom: 0.938rem;
}
.star-ul {
list-style: none;
text-align: left;
padding-left: 0;
margin-left: 0;
}
.star-ul li {
margin-left: clamp(
1.563rem,
0.694rem + 2.778vw,
3.125rem
);
margin-bottom: 0.75rem;
}
.star-ul li::before {
content: "✧"; /* Elegant chevron */
color: #D4AF37; /* Example: earthy brown */
font-size: 0.9em;
font-weight: 700;
margin-right: 0.6em;
vertical-align: middle;
}
.background-teal .star-ul li {
color: #FFFFFF;
}
.star-ul.teal-marker li::before {
color: #357266;
}
.star-ul.caduceus li::before {
content: "☤"; /* caduceus */
font-size: 1.3em;
font-weight: 300;
}
.star-ul.bodhi li::before {
content: ""; /* Empty content */
display: inline-block; /* Required for sizing */
/* Sizing and Spacing */
width: 1em;
height: 1em;
margin-right: 0.6em;
vertical-align: middle; /* Aligns with text */
/* THE FIX: Use background-image instead of mask-image */
/* This uses the exact SVG path from your code (an oval shape) */
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23D4AF37' d='M17,8C8,10,5.9,16.17,3.82,21.34L5.71,22l1-2.3A4.49,4.49,0,0,0,8,20C19,20,22,3,22,3,21,5,14,5.25,9,6.25S2,11.5,2,13.5a6.22,6.22,0,0,0,1.75,4.24l-1.64,1.83L3.54,21A18.17,18.17,0,0,1,17,8Z'/%3E%3C/svg%3E");
/* Ensure the image fits and doesn't repeat */
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.star-ul.sproat li::before {
content: ""; /* Empty content */
display: inline-block; /* Required for sizing */
/* Sizing and Spacing */
width: 1.9em;
height: 1.9em;
margin-right: 0.6em;
vertical-align: middle; /* Aligns with text */
/* THE FIX: Use background-image instead of mask-image */
/* This uses the exact SVG path from your code (an oval shape) */
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23D4AF37' d='M17,8C8,10,5.9,16.17,3.82,21.34L5.71,22l1-2.3A4.49,4.49,0,0,0,8,20C19,20,22,3,22,3,21,5,14,5.25,9,6.25S2,11.5,2,13.5a6.22,6.22,0,0,0,1.75,4.24l-1.64,1.83L3.54,21A18.17,18.17,0,0,1,17,8Z'/%3E%3C/svg%3E");
/* Ensure the image fits and doesn't repeat */
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.star-ul.zenseed li::before {
content: ""; /* Empty content */
display: inline-block; /* Required for sizing */
/* Sizing and Spacing */
width: 1em;
height: 1em;
margin-right: 0.6em;
vertical-align: middle; /* Aligns with text */
/* THE FIX: Use background-image instead of mask-image */
/* This uses the exact SVG path from your code (an oval shape) */
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23D4AF37' d='M21,3C21,3,15,15,3,21C3,21,9,9,21,3Z'/%3E%3C/svg%3E");
/* Ensure the image fits and doesn't repeat */
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.star-ul.check li::before {
content: "✓"; /* checkmark */
}
.star-ul.long-text li {
margin-bottom: 1.875rem;
}
/*
.star-ul li::marker {
color: $color-ul-stars;
font-weight: 900;
font-size: 20px;
}
*/
@media screen and (min-width: 800px) {
.mobile-only {
display: none;
}
}
/* When a sidebar is present the layout-content div is assigned this id in page.html.twig*/
#main-sidebar {
display: flex;
min-height: 60vh;
gap: var(--gapBetween);
}
/* Main content div when we have a sidebar present
.two-thirds-width {
display: flex;
flex-direction: column;
flex-basis: 100%;
flex: 2;
}
*/
/* the aside element is always used for the right sidebar 1/3 width
aside {
display: flex;
flex-direction: column;
flex-basis: 100%;
flex: 1;
margin-top: to-rem(20px);
}
*/
.rt_button {
text-align: center;
}
.rt_title > a {
text-decoration: none;
}
@media (max-width: 500px) {
#main-sidebar {
display: block;
}
#main-sidebar > section {
width: auto;
}
#main-sidebar > aside {
width: auto;
}
}
/* Site Footer Styles */
.site-footer {
display: flex;
flex-wrap: wrap;
color: #FFFFFF;
background-color: #0C434A;
font-size: 1.125rem;
padding-bottom: 3.125rem;
}
.site-footer a {
font-weight: 400;
}
.centered-div {
display: grid;
/* flex-direction defaults to row */
justify-content: center;
align-items: center;
}
.social-div {
display: block;
margin-left: auto;
margin-right: auto;
padding-bottom: 0.313rem;
}
.social-icon {
display: inline;
margin-left: 0.625rem;
vertical-align: middle;
}
address {
text-align: center;
}
.footer-phone {
color: #FFFFFF;
font-size: 1.063rem;
font-style: italic;
}
.footer-phone:before {
content: url("/sites/default/files/phone-16-grey.png");
margin-right: 0.5em;
}
.footer-col5 {
flex: 0 0 100%;
padding-top: 10px;
padding-bottom: 10px;
}
/* adjust the paragraphs inside the footer columns */
.footer-col5 > p {
margin-top: 0px;
line-height: 2.8;
padding-left: 0.313rem;
text-align: center;
}
/* adjust the links inside the footer columns, the CONTACT US is below the address column inside a paragraph */
.footer-col5 > a {
display: block;
line-height: 2.8;
text-decoration: underline;
color: #FFFFFF;
padding-left: 0.25rem;
text-align: center;
}
.footer-col5 > p > a {
text-decoration: underline;
color: #FFFFFF;
}
/* styles for the image links to Johns Hopkins, Maps, etc.. */
.logolinks {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-top: 1.5rem;
}
@media screen and (min-width: 800px) {
.logolinks {
max-width: 75%;
margin-left: auto;
margin-right: auto;
}
}
.logolinks a {
flex: 0 0 20%;
width: 62px;
height: 60px;
opacity: 0.8;
}
a.logolinks:hover {
opacity: 1;
}
#HHCLogo-footer {
object-fit: none;
object-position: -403px 0px;
width: 230px;
height: 110px;
}
#footer-logo-JohnsHopkins {
object-fit: none;
object-position: 0 0;
width: 45px;
height: 60px;
}
#footer-logo-ICEERS {
object-fit: none;
object-position: -45px 0;
width: 60px;
height: 60px;
}
#footer-logo-Beckley {
object-fit: none;
object-position: -105px 0;
width: 60px;
height: 60px;
}
#footer-logo-MAPS {
object-fit: none;
object-position: -165px 0;
width: 60px;
height: 60px;
}
/* Adjust the width of the footer columns so we move from 1, to 2 to 5 as screen gets wider */
@media only screen and (min-width: 800px) {
.footer-col5 {
flex: 0 0 22%;
padding-left: 20px;
}
/*let the logo link images fill a full row on the bottom*/
.footer-fullrow {
flex: 0 0 100%;
}
}
/* End Site Footer Styles */
/****************************************
styles formatting a responsive 3 column layout
****************************************/
.flex-3col {
display: flex;
flex-wrap: wrap;
gap: var(--gapBetween);
justify-content: center;
}
.flex-3col section {
width: 31%;
padding-bottom: 1.5rem;
}
.flex-3col p {
padding-left: 1rem;
padding-right: 1rem;
margin-top: 1rem;
}
.list-padding {
padding-left: 0.9375rem;
padding-right: 0.9375rem;
margin-bottom: 1.5rem;
}
.flex-3col div.col {
width: 30%;
padding-top: 1rem;
padding-bottom: 0.75rem;
}
.flex-3col header {
grid-area: head;
color: #FFF;
}
.flex-3col .learnmore {
text-align: center;
padding-left: 0.75rem;
padding-right: 0.75rem;
}
.learnmore .a.button {
margin: 0 0;
}
.three-col-header, h3.three-col-header {
font-size: clamp(
1.375rem,
1.236rem + 0.444vw,
1.625rem
); /* 24px; */
text-align: center;
line-height: 1.2;
font-weight: 600;
color: #A0C16D;
margin-bottom: 0.75rem;
padding-top: 0.75rem;
font-family: "Merriweather, serif";
}
.list-arrow {
color: #A0C16D;
padding-right: 0.5rem;
}
h3.three-col-header {
margin-top: 0;
letter-spacing: normal;
}
@media screen and (max-width: 800px) {
.flex-3col {
display: block;
}
.flex-3col section {
width: auto;
margin-bottom: 3rem;
}
.flex-3col div.col {
width: auto;
margin-bottom: 3rem;
}
}
#block-responsibleceremonies section {
background-color: rgba(9, 221, 9, 0.05);
}
.staff-subheading {
color: #A0C16D;
text-align: center;
/* @include fluid-type(font-size, 700px, 1400px, 20rem, 28rem); */
font-size: clamp(
1.25rem,
0.972rem + 0.889vw,
1.75rem
);
font-weight: 600;
}
#block-retreattypes {
margin-top: 3.125rem;
}
.sidebar-heading-retreats {
background-color: red;
border-color: #21752c;
color: #FFFFFF;
font-size: 14px;
font-weight: 600;
padding: 0.625rem 1.25rem 0.438rem;
display: block;
text-decoration: none;
border-radius: 5px 5px 0 0;
text-transform: uppercase;
margin-left: auto;
margin-right: auto;
margin-bottom: 0.625rem;
}
/* Address on Contact page*/
.ci_address {
overflow-wrap: break-word;
padding: 0 0 0 0.625rem;
margin: 0 0 1.25rem 0;
position: relative;
}
.webform-confirmation__message {
font-size: 1.125rem;
font-weight: 600;
color: #357266;
}
.webform-confirmation__message p {
color: black;
font-size: 1.063rem;
font-weight: 400;
}
.terms_conditions_page ol li {
padding-bottom: 0.938rem;
}
.testimonial-name {
padding-left: 1.563rem;
margin-top: -0.625rem;
font-weight: 500;
font-style: italic;
}
#block-retreattypes-2 {
margin-top: 3.125rem;
padding-top: 1.25rem;
}
div.go1365079710 {
margin: 0 auto;
margin-top: 60px;
padding: 0 20px;
align-self: center;
max-width: 800px !important;
}
/**
* @file
* Visual styles for tabs.
*/
div.tabs {
margin: 1em 0;
}
ul.tabs {
margin: 0 0 0.5rem;
padding-top: 1.875rem;
padding-bottom: 1.875rem;
padding-left: 3.125rem;
list-style: none;
color: rgb(23, 175, 23);
}
.tabs > li {
display: inline-block;
margin-right: 0.3rem; /* LTR */
}
[dir=rtl] .tabs > li {
margin-right: 0;
margin-left: 0.3rem;
}
.tabs a {
display: block;
padding: 0.2rem;
text-decoration: none;
font-size: clamp(
1rem,
0.931rem + 0.222vw,
1.125rem
);
font-weight: 500;
}
.tabs a.is-active {
background-color: #eee;
}
.tabs a:focus,
.tabs a:hover {
background-color: #f5f5f5;
}
.references {
font-weight: 700;
font-size: clamp(
1.375rem,
1.028rem + 1.111vw,
2rem
);
}
.green-arrow {
color: #2F6B44;
}
a.external-link {
font-size: clamp(
1rem,
0.965rem + 0.111vw,
1.063rem
);
color: #0C434A;
}
a.external-link:hover {
color: #83A348;
}
a.external-link::afterz {
position: absolute;
content: "";
display: inline-block;
width: 1em;
height: 1em;
margin-left: 0.25em;
background-size: 100%;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12.2 12.2' width='14' height='14'%3E%3Cpath fill='%23249e34' d='M5.7 0v1.5h4L4.5 6.7l1 1.1 5.3-5.2v3.9h1.4V0z'/%3E%3Cpath fill='none' d='M3.4 6.7l3-2.9H1.5v7h7V5.9l-3 2.9z'/%3E%3Cpath fill='%23249e34' d='M8.5 5.9v4.9h-7v-7h4.9l1.5-1.6H0v10h10V4.4z'/%3E%3C/svg%3E");
transform: translateY(0.35em);
}
.review-quote {
font-size: clamp(
1.5rem,
1.361rem + 0.444vw,
1.75rem
);
font-family: Georgia, "Times New Roman", Times, serif;
color: #0C434A;
font-style: italic;
max-width: 1100px;
margin-left: auto;
margin-right: auto;
padding-left: 1.75rem;
padding-right: 1.75rem;
}
.callout {
font-size: clamp(
1.125rem,
1.056rem + 0.222vw,
1.25rem
);
font-family: Georgia, "Times New Roman", Times, serif;
color: #0C434A;
max-width: 1100px;
margin-left: auto;
margin-right: auto;
padding-left: 1.75rem;
padding-right: 1.75rem;
}
.toolbar,
.toolbar * {
font-size: 1rem !important; /* ~16px */
line-height: 1.25 !important; /* optional: tame overly tall lines */
}
/*# sourceMappingURL=style.css.map */