This will reverse the displayed order of the system so that it runs in the
opposite order to our source, effectively flipping the system over.
*/
.o-flex {
display: flex;
}
.o-flex-inline {
display: inline-flex;
}
.o-flex,
.o-flex-inline {
flex-wrap: wrap;
/* 1. Provide all values to avoid IE10 bug with shorthand flex */
}
/* Gutters */
.o-flex.-gutters, .o-flex-inline.-gutters {
margin-left: calc(var(--layout-gap) * -1);
margin-bottom: calc(var(--layout-gap) * -1);
}
/* Direction change */
.o-flex.-reverse, .o-flex-inline.-reverse {
flex-direction: row-reverse;
}
.o-flex.-column, .o-flex-inline.-column {
flex-direction: column;
}
.o-flex.-column-reverse, .o-flex-inline.-column-reverse {
flex-direction: column-reverse;
}
/* Horizontal aligment modifiers */
.o-flex.-justify-center, .o-flex-inline.-justify-center {
justify-content: center;
}
.o-flex.-justify-between, .o-flex-inline.-justify-between {
justify-content: space-between;
}
.o-flex.-justify-end, .o-flex-inline.-justify-end {
justify-content: flex-end;
}
.o-flex.-align-start, .o-flex-inline.-align-start {
align-items: flex-start;
}
.o-flex.-align-center, .o-flex-inline.-align-center {
align-items: center;
}
.o-flex.-align-end, .o-flex-inline.-align-end {
align-items: flex-end;
}
/* Also default property */
.o-flex.-stretch, .o-flex-inline.-stretch {
align-items: stretch;
}
/* Use `0%` to avoid bug in IE10/11 with unitless flex basis */
.o-flex.-fill > *, .o-flex-inline.-fill > * {
flex: 1 1 0%; /* 1 */
}
/* Fit cells to their content */
.o-flex.-fit > *, .o-flex-inline.-fit > * {
flex-basis: auto;
}
/* All cells match height of tallest cell in a row */
.o-flex.-equal-height > *, .o-flex-inline.-equal-height > * {
display: flex;
}
/* Gutters */
.o-flex.-gutters > *, .o-flex-inline.-gutters > * {
padding-left: var(--layout-gap);
padding-bottom: var(--layout-gap);
}
.o-flex_item {
flex-basis: 100%;
}
/* Horizontal Alignment */
.o-flex_item.-justify-center {
justify-content: center;
}
.o-flex_item.-justify-between {
justify-content: space-between;
}
.o-flex_item.-justify-end {
justify-content: flex-end;
}
/* Vertical Alignment */
.o-flex_item.-align-start {
align-items: flex-start;
}
.o-flex_item.-align-center {
align-items: center;
}
.o-flex_item.-align-end {
align-items: flex-end;
}
/* ========================================================================== */
/* Objects / Column */
/* ========================================================================== */
/**
* Usage:
*
* ```html
*
* ```
*/
@media (min-width: 800px) {
.o-column.-col-2 {
-moz-column-count: 2;
column-count: 2;
}
.o-column.-rule {
-moz-column-rule: 1px solid var(--black);
column-rule: 1px solid var(--black);
}
.o-column.-gutters {
-moz-column-gap: var(--layout-column-width);
column-gap: var(--layout-column-width);
}
.o-column.-gutters > * {
margin-bottom: calc(var(--layout-gutter) * 2);
}
.o-column > * {
-moz-column-break-inside: avoid;
break-inside: avoid;
page-break-inside: avoid;
}
}
/* ========================================================================== */
/* Objects / Stack */
/* ========================================================================== */
.o-stack {
display: grid;
grid-template-areas: "stack";
}
.o-stack > * {
grid-area: stack;
}
/* ========================================================================== */
/* Objects / Grid Helper */
/* ========================================================================== */
.o-gridHelper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
pointer-events: none;
z-index: 10000;
}
.o-gridHelper_inner {
display: flex;
-moz-column-gap: var(--layout-gap);
column-gap: var(--layout-gap);
margin: 0 var(--layout-margin);
height: 100%;
}
.o-gridHelper_inner div {
position: relative;
flex: 1;
height: 100%;
background: rgba(255, 0, 0, .05);
}
/* @import "objects/_table"; */
/* Vendors */
/* ========================================================================== */
/* @use "vendors/vendors";
// @import "~line-awesome/dist/line-awesome/scss/line-awesome"; */
/* Plugins */
/* ========================================================================== */
/* Contact Form 7 */
/* ========================================================================== */
/* Plugins / Contact Form 7 / Styles */
/* ========================================================================== */
/* Input */
.wpcf7 .wpcf7-form-control {
margin-top: functions.rem-unit(5px);
}
/* checkbox */
.wpcf7 .wpcf7-acceptance .wpcf7-list-item {
margin-left: 0;
}
.wpcf7 .wpcf7-acceptance input[type=checkbox] {
position: absolute;
margin: 0;
}
.wpcf7 .wpcf7-acceptance .wpcf7-list-item-label {
display: block;
margin-left: 2rem;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
/* Button */
.wpcf7 {
margin-top: var(--step-3);
}
.wpcf7 .wpcf7-spinner {
/* @include mixins.u-accessibly-hidden */
}
.wpcf7 .c-button {
padding: 0;
/* input[type=submit] {
&:focus-visible {
outline: dashed 2px var(--black);
outline-offset: 1px;
}
} */
}
.wpcf7 .c-button_wrap {
margin-top: var(--step-1);
}
.wpcf7 .c-button_label {
margin: 0;
min-height: 3.5rem;
}
/* Error */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: red;
}
/* Components */
/* ========================================================================== */
/* ========================================================================== */
/* Components / Headings */
/* ========================================================================== */
.c-heading.-h1 {
font-size: var(--step-5);
}
.c-heading.-h2 {
font-size: var(--step-4);
}
.c-heading.-h3 {
font-size: var(--step-3);
}
.c-heading.-h4 {
font-size: var(--step-2);
}
.c-heading.-lead {
font-size: var(--step-1);
}
.c-heading.-eyebrow {
display: inline-flex;
margin-block-end: var(--step-3);
font-family: var(--font-family-bold);
font-weight: 600;
line-height: 1;
text-transform: uppercase;
}
.c-heading.-rustic {
color: var(--rustic-red);
}
.c-heading.-red {
color: var(--cornell-red);
}
@media (max-width: 799px) {
.c-heading span {
text-decoration-thickness: calc(var(--step-0) / 8) !important;
text-underline-offset: calc(var(--step-0) / 6);
}
}
@media (min-width: 800px) {
.c-heading span {
text-decoration-thickness: calc(var(--step-0) / 4) !important;
text-underline-offset: calc(var(--step-0) / 3);
}
}
/* ========================================================================== */
/* Components / Logo */
/* ========================================================================== */
.c-logo {
display: inline-flex;
width: var(--logo);
height: var(--logo);
transition: all var(--speed) var(--easing);
}
@media (max-width: 799px) {
.c-logo {
--logo: clamp(3.125rem, 1.4391rem + 9.6339vw, 6.25rem)
}
}
@media (min-width: 800px) {
.c-logo {
--logo: clamp(7.1875rem, 5.997rem + 2.381vw, 13.4375rem)
}
}
html.has-scrolled .c-logo.-header {
width: calc(var(--logo) / 2);
height: calc(var(--logo) / 2);
}
/* ========================================================================== */
/* Components / Breadcrumbs */
/* ========================================================================== */
.c-breadcrumbs {
/* Default styles */
position: relative;
border-bottom: solid 1px var(--grey);
padding: 0 var(--step-0);
/* Layout styles */
}
.c-breadcrumbs:has(.c-breadcrumbs_dropdown[open]) .c-breadcrumbs_list {
overflow-x: clip;
}
.c-breadcrumbs_list {
white-space: nowrap;
overflow-x: auto;
}
.c-breadcrumbs_list, .c-breadcrumbs_item {
display: flex;
align-items: center;
}
.c-breadcrumbs_item {
flex-shrink: 0;
}
.c-breadcrumbs_item span {
color: #999;
}
.c-breadcrumbs_item span[aria-current] {
color: var(--black);
}
.c-breadcrumbs_item a {
color: #999;
}
.c-breadcrumbs_link {
padding: var(--step-0) 0;
transition:
color var(--speed) var(--easing)
;
}
@media (hover: hover) {
.c-breadcrumbs_link:hover {
color: red;
}
}
.c-breadcrumbs_slash {
margin: 0 1ch;
color: #999;
}
.c-breadcrumbs_dropdown-summary, .c-breadcrumbs_dropdown-link {
transition:
color var(--speed) var(--easing)
;
}
@media (hover: hover) {
.c-breadcrumbs_dropdown-summary:hover, .c-breadcrumbs_dropdown-link:hover {
color: red;
}
}
.c-breadcrumbs_dropdown-summary {
list-style: none;
display: inline-flex;
align-items: center;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
cursor: pointer;
padding: var(--step-0) 0;
}
.c-breadcrumbs_dropdown-link {
padding: calc(var(--step-0) / 2) 0;
}
.c-breadcrumbs_dropdown-icon {
margin-inline-start: 0.25rem;
fill: #999;
}
.c-breadcrumbs_dropdown ul {
position: absolute;
top: 100%;
left: 0;
margin-block-start: calc(var(--step-0) / 3);
border-radius: calc(var(--step-0) / 3);
border: 1px solid var(--grey);
padding: 0 calc(var(--step-0) / 1.5);
background: var(--white);
box-shadow: 0 6px 20px rgba(0,0,0,.08);
list-style: none;
z-index: 10;
white-space: nowrap;
display: none; /* Hide by default */
}
.c-breadcrumbs_dropdown ul a {
color: var(--black);
}
.c-breadcrumbs_dropdown[open] ul {
display: block;
}
.c-breadcrumbs_dropdown[open] ul > * + * {
border-top: solid 1px var(--grey);
}
@media (max-width: 799px) {
.c-breadcrumbs::before {
content: '';
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background-image: linear-gradient(to right, rgba(250,245,245, 0) 85%, rgba(250,245,245, 0.85));
z-index: 2;
pointer-events: none;
}
.c-breadcrumbs .c-breadcrumbs_dropdown ul {
width: 100%;
}
}
@media (min-width: 800px) {
.c-breadcrumbs .c-breadcrumbs_dropdown {
position: relative;
display: inline-block;
}
.c-breadcrumbs .c-breadcrumbs_dropdown ul {
left: 0;
}
}
/* ========================================================================== */
/* Components / Form */
/* ========================================================================== */
.select2 .selection .select2-selection--single {
all: unset;
display: revert;
}
.select2 .selection .select2-selection--single .select2-selection__rendered {
padding: calc(var(--step-0) / 2) calc(var(--step-0) / 1);
background-color: var(--white);
border: 2px solid var(--black);
}
.select2 .selection .select2-selection--single .select2-selection__arrow {
width: var(--step-2);
height: 100%;
}
.select2 .selection .select2-selection--single .select2-selection__arrow b {
border-width: 5px 4px 0 4px;
border-color: var(--black) transparent transparent transparent;
}
/* fieldset */
/* fieldset {
margin-block-end: 2rem;
padding: var(--step-0) var(--step-1) var(--step-1);
border: solid 2px var(--black);
} */
/* legend */
/* legend {
margin-block-end: calc(var(--step-0) / 2);
padding: 0 var(--step-0);
font-size: var(--step-2);
font-family: var(--font-family-heading);
color: var(--black);
} */
/* Label */
.label:not(th.label):not(th label):not(.-no-margin):not(input[type="radio"] + label):not(input[type="checkbox"] + label), label:not(th.label):not(th label):not(.-no-margin):not(input[type="radio"] + label):not(input[type="checkbox"] + label) {
margin-block-start: var(--step-0);
}
.label:not(th.label), label:not(th.label) {
display: block;
margin-block-end: calc(var(--step-0) / 2);
font-weight: 700;
line-height: var(--step-2);
}
/* Input */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
input[list],
select,
textarea,
.StripeElement {
padding: calc(var(--step-0) / 2) calc(var(--step-0) / 1);
border: 2px solid var(--black);
background-color: var(--white);
}
@media(hover: hover) {
input[type="text"]:hover, input[type="email"]:hover, input[type="url"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="number"]:hover, input[type="tel"]:hover, input[type="date"]:hover, input[type="month"]:hover, input[type="week"]:hover, input[type="time"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="color"]:hover, input[list]:hover, select:hover, textarea:hover, .StripeElement:hover {
border-color: var(--black);
}
}
input[type="text"]:focus-visible, input[type="email"]:focus-visible, input[type="url"]:focus-visible, input[type="password"]:focus-visible, input[type="search"]:focus-visible, input[type="number"]:focus-visible, input[type="tel"]:focus-visible, input[type="date"]:focus-visible, input[type="month"]:focus-visible, input[type="week"]:focus-visible, input[type="time"]:focus-visible, input[type="datetime"]:focus-visible, input[type="datetime-local"]:focus-visible, input[type="color"]:focus-visible, input[list]:focus-visible, select:focus-visible, textarea:focus-visible, .StripeElement:focus-visible {
border-color: var(--black);
outline: dashed 2px var(--orange-dark);
outline-offset: 2px;
}
input[type="text"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="url"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="search"]::-moz-placeholder, input[type="number"]::-moz-placeholder, input[type="tel"]::-moz-placeholder, input[type="date"]::-moz-placeholder, input[type="month"]::-moz-placeholder, input[type="week"]::-moz-placeholder, input[type="time"]::-moz-placeholder, input[type="datetime"]::-moz-placeholder, input[type="datetime-local"]::-moz-placeholder, input[type="color"]::-moz-placeholder, input[list]::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder, .StripeElement::-moz-placeholder {
color: var(--black) !important;
}
input[type="text"]::placeholder, input[type="email"]::placeholder, input[type="url"]::placeholder, input[type="password"]::placeholder, input[type="search"]::placeholder, input[type="number"]::placeholder, input[type="tel"]::placeholder, input[type="date"]::placeholder, input[type="month"]::placeholder, input[type="week"]::placeholder, input[type="time"]::placeholder, input[type="datetime"]::placeholder, input[type="datetime-local"]::placeholder, input[type="color"]::placeholder, input[list]::placeholder, select::placeholder, textarea::placeholder, .StripeElement::placeholder {
color: var(--black) !important;
}
select[multiple="multiple"] {
height: auto;
}
/* Number */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
opacity: 1;
}
/* Range */
input[type=range] {
position: relative;
border: none;
border-radius: calc(var(--step-0) / 2.5);
padding: 0;
height: calc(var(--step-0) / 2);
background: var(--grey);
isolation: isolate;
}
input[type=range]::before {
content: '';
position: absolute;
top: 0;
left: 0;
border-radius: var(--step-0);
width: calc(100% * var(--progress));
height: 100%;
background-color: var(--black);
z-index: 0;
}
input[type=range]::-webkit-slider-thumb {
position: relative;
border-radius: 50%;
width: var(--step-1);
height: var(--step-1);
background: var(--black);
-webkit-appearance: none;
appearance: none;
cursor: pointer;
z-index: 2;
}
input[type=range]::-moz-range-thumb {
position: relative;
border-radius: 50%;
width: var(--step-1);
height: var(--step-1);
background: var(--black);
cursor: pointer;
z-index: 2;
}
/* Contact form 7 */
/* input[type="checkbox"]:checked {
appearance: revert !important;
filter: invert(1) brightness(2);
accent-color: var(--black);
outline: solid 2px var(--white);
outline-offset: -2px;
} */
/* Checkbox and radio buttons */
label:has(input[type="checkbox"]),
label:has(input[type="radio"]) {
display: grid !important;
grid-template-columns: var(--step-2) auto;
gap: calc(var(--step-0) / 2);
}
input[type="checkbox"],
input[type="radio"] {
border: 1px solid var(--black);
width: var(--step-2);
height: var(--step-2);
background-color: var(--white);
display: grid;
place-content: center;
}
input[type="checkbox"]::before,
input[type="radio"]::before {
content: "";
width: var(--step-1);
height: var(--step-1);
background-color: transparent;
background-position: center;
background-repeat: no-repeat;
opacity: 0;
transition:
opacity var(--speed) var(--easing)
;
}
input[type="radio"],
input[type="radio"]::before {
border-radius: 50%;
}
input[type="checkbox"]::before {
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2210.5%22%20viewBox%3D%220%200%2013%2010.5%22%20enable-background%3D%22new%200%200%2013%2010.5%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M4.8%205.8L2.4%203.3%200%205.7l4.8%204.8L13%202.4c0%200-2.4-2.4-2.4-2.4L4.8%205.8z%22%2F%3E%3C%2Fsvg%3E");
background-size: calc(var(--step-1) / 1.25);
}
input[type="radio"]::before {
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20enable-background%3D%22new%200%200%2013%2013%22%20xml%3Aspace%3D%22preserve%22%3E%3Ccircle%20fill%3D%22%23000000%22%20cx%3D%226.5%22%20cy%3D%226.5%22%20r%3D%226.5%22%2F%3E%3C%2Fsvg%3E");
background-size: calc(var(--step-1) / 2);
}
input[type="checkbox"]:checked::before,
input[type="radio"]:checked::before {
opacity: 1;
}
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
outline: max(2px, 0.15em) dashed var(--black);
outline-offset: max(2px, 0.15em);
}
input[type="checkbox"]:disabled {
color: var(--grey);
cursor: not-allowed;
}
/* Select and Datalist */
select,
input[list] {
position: relative;
padding-right: 2rem;
line-height: calc(var(--step-0) / 0.65);
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2211.3%22%20viewBox%3D%220%200%2013%2011.3%22%20enable-background%3D%22new%200%200%2013%2011.3%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23424242%22%20points%3D%226.5%2011.3%203.3%205.6%200%200%206.5%200%2013%200%209.8%205.6%20%22%2F%3E%3C%2Fsvg%3E");
background-position: right var(--step-0) center;
background-size: 0.5rem;
background-repeat: no-repeat;
cursor: pointer;
}
/* Textarea */
textarea {
min-height: 200px;
}
/* Buttons */
button[type="reset"],
button[type="button"]:not(.show-password-input),
button[type="submit"]:not(.t-searchForm_button),
input[type="reset"],
input[type="button"] {
position: relative;
display: inline-flex;
justify-content: center;
align-items: center;
border-style: solid;
border-width: 2px;
width: auto;
padding: calc(var(--step-0) / 1.5) var(--step-1);
font-weight: 700;
text-align: center;
transition:
color var(--speed) var(--easing),
background-color var(--speed) var(--easing)
;
cursor: pointer;
min-width: 200px;
}
button[type="submit"],
input[type="submit"] {
border-color: var(--black);
color: var(--white);
background-color: var(--black);
}
@media (hover: hover) {
button[type="submit"]:hover, input[type="submit"]:hover {
background-color: var(--black);
}
}
button[type="reset"],
input[type="reset"] {
border-color: var(--black);
color: var(--black);
background-color: var(--white);
}
@media (hover: hover) {
button[type="reset"]:hover, input[type="reset"]:hover {
color: var(--white);
background-color: var(--black);
}
}
button[type="button"]:not(.show-password-input),
input[type="button"] {
border-color: var(--grey);
color: var(--black);
background-color: var(--white);
}
@media (hover: hover) {
button[type="button"]:not(.show-password-input):hover, input[type="button"]:hover {
color: var(--white);
background-color: var(--grey)
}
}
/* ========================================================================== */
/* Components / Buttons */
/* ========================================================================== */
.c-button {
align-items: center;
justify-content: space-between;
position: relative;
border-radius: var(--step-3);
font-family: var(--font-family-bold);
font-size: calc(var(--step-0) * 0.85);
font-weight: 600;
line-height: 1;
text-transform: uppercase;
overflow: clip;
}
.c-button::before,
.c-button::after {
content: "";
position: absolute;
inset: 0;
}
.c-button::after {
transform: scaleY(0);
transform-origin: top;
transition:
transform var(--speed) var(--easing)
;
will-change: transform;
z-index: 0;
}
/* Button Main */
/* ========================================================================== */
.c-button_text {
position: relative;
flex-grow: 1;
line-height: 150%;
z-index: 10;
}
.c-button_visible,
.c-button_hidden {
display: flex;
justify-content: space-between;
align-items: center;
gap: var(--step-0);
padding: var(--step-0) calc(var(--step-0) * 1.5);
}
.c-button_visible {
transform: scaleY(1);
transform-origin: bottom;
transition:
transform var(--speed) var(--easing),
opacity var(--speed) var(--easing)
;
will-change: transform;
}
.c-button_hidden {
position: absolute;
inset: 0;
transform: scaleY(0);
transform-origin: top;
opacity: 0;
transition:
transform var(--speed) var(--easing),
opacity .4s var(--easing)
;
will-change: transform;
}
.c-button_hidden .c-button_icon {
transform: translate(-50%,50%);
will-change: transform;
}
.c-button_icon {
position: relative;
z-index: 10;
transition:
transform var(--speed) var(--easing)
;
}
/* Button Colours */
/* ========================================================================== */
.c-button.-yellow-full {
border: solid 2px var(--bee-yellow);
color: var(--rustic-red);
}
.c-button.-yellow-full .c-button_icon {
fill: var(--rustic-red);
}
.c-button.-yellow-full::before {
background-color: var(--bee-yellow);
}
.c-button.-yellow-full::after {
background-color: var(--bee-yellow-light);
}
.c-button.-rustic-full {
border: solid 2px var(--rustic-red);
color: var(--white);
}
.c-button.-rustic-full .c-button_icon {
fill: var(--white);
}
.c-button.-rustic-full::before {
background-color: var(--rustic-red);
}
.c-button.-rustic-full::after {
background-color: var(--rustic-red-dark);
}
.c-button.-red-full {
border: solid 2px var(--cornell-red);
color: var(--white);
}
.c-button.-red-full .c-button_icon {
fill: var(--white);
}
.c-button.-red-full::before {
background-color: var(--cornell-red);
}
.c-button.-red-full::after {
background-color: var(--cornell-red-dark);
}
.c-button.-blue-full {
border: solid 2px var(--flat-blue);
color: var(--white);
}
.c-button.-blue-full .c-button_icon {
fill: var(--white);
}
.c-button.-blue-full::before {
background-color: var(--flat-blue);
}
.c-button.-blue-full::after {
background-color: var(--flat-blue-dark);
}
/* Button Hover */
/* ========================================================================== */
@media (max-width: 799px) {
.c-button:not(.-width-auto) {
min-width: 230px
}
}
@media (min-width: 800px) and (max-width: 1599px) {
.c-button:not(.-width-auto) {
min-width: 200px
}
}
@media (min-width: 1600px) {
.c-button:not(.-width-auto) {
min-width: 250px
}
}
/* Button Hover */
/* ========================================================================== */
@media (hover: hover) {
.c-button:hover .c-button_visible {
transform: scaleY(0);
transform-origin: top;
opacity: 0;
}
.c-button:hover .c-button_visible .c-button_icon {
transform: translate(50%,-50%);
}
.c-button:hover .c-button_hidden {
transform: scaleY(1);
transform-origin: bottom;
opacity: 1;
}
.c-button:hover .c-button_hidden .c-button_icon {
transform: translate(0);
}
.c-button:hover::after {
transform: scaleY(1);
transform-origin: bottom;
}
}
/* ========================================================================== */
/* Components / Link */
/* ========================================================================== */
.c-link {
position: relative;
display: inline-flex;
font-weight: 700;
color: var(--white);
background-image: linear-gradient(white, white);
background-position: 0% 100%;
background-repeat: no-repeat;
background-size: 100% 2px;
transition:
background-size var(--speed) var(--easing),
color var(--speed) var(--easing) 0.1s
;
}
@media (hover: hover) {
.c-link:hover {
background-size: 0% 2px;
}
}
.c-link:focus-visible {
outline-offset: 2px;
outline: dashed 2px var(--black);
background-size: 0% 1px;
}
/* ========================================================================== */
/* Components / Card */
/* ========================================================================== */
/* Used so that the title can be the main link (better for SEO) */
/* When using keyboard it highlights the 'fake' button instead of the title */
.c-card {
position: relative;
}
.c-card_title:focus-within ~ .c-card_button {
outline-offset: 2px;
outline: dashed 2px black;
opacity: 1;
}
.c-card_link {
display: inline-block;
outline: none;
z-index: 10;
}
.c-card_link:focus-visible {
outline: none;
}
.c-card_link:hover, .c-card_link:focus {
color: inherit;
}
/* ========================================================================== */
/* Components / Pagination */
/* ========================================================================== */
.c-pagination {
/* Default styles */
border-top: solid 1px black;
padding-top: var(--layout-gap);
/* Layout styles */
}
.c-pagination_list {
display: flex;
flex-wrap: wrap;
gap: 5px;
}
.c-pagination_item {
/* &:not(.-prev):not(.-next):not(.-dots) {
margin: 0 0.5rem;
} */
}
.c-pagination_item:not(.is-active):not(.is-disabled):not(.-dots) .c-pagination_link {
border: solid 1px black;
background-color: white;
transition:
color var(--speed) var(--easing),
background-color var(--speed) var(--easing)
;
}
@media (hover: hover) {
.c-pagination_item:not(.is-active):not(.is-disabled):not(.-dots) .c-pagination_link:hover {
color: white;
background-color: black;
}
}
.c-pagination_item.-prev {
margin-right: auto;
}
.c-pagination_item.-next {
margin-left: auto;
}
.c-pagination_item.is-active .c-pagination_link {
border: solid 1px black;
color: white;
background-color: black;
}
.c-pagination_item.is-disabled .c-pagination_link {
border: solid 1px var(--grey);
background-color: var(--grey);
cursor: not-allowed;
}
.c-pagination_item.is-disabled .c-pagination_icon {
fill: white;
}
.c-pagination_link, .c-pagination_ellipses {
display: flex;
justify-content: center;
align-items: center;
width: var(--step-4);
height: var(--step-4);
font-family: var(--font-family-heading);
font-size: var(--step-1);
}
.c-pagination_ellipses {
color: black;
}
.c-pagination_label {
position: absolute;
overflow: hidden;
clip: rect(0 0 0 0);
margin: 0;
padding: 0;
width: 1px;
height: 1px;
border: 0;
}
.c-pagination_icon {
width: var(--step-0);
height: var(--step-0);
}
@media (max-width: 599px) {
.c-pagination_item:not(.-prev):not(.-next) {
position: absolute;
overflow: hidden;
clip: rect(0 0 0 0);
margin: 0;
padding: 0;
width: 1px;
height: 1px;
border: 0;
}
}
/* Utilities */
/* ========================================================================== */
/* ========================================================================== */
/* Utilities / Animations */
/* ========================================================================== */
.u-anim.-fadein {
opacity: 0;
transition:
opacity 1s var(--easing) 0.1s;
will-change: opacity;
}
.u-anim.-fadeup {
transform: translate3d(0, 10%, 0);
opacity: 0;
transition:
transform 1s var(--easing),
opacity 1s var(--easing)
;
will-change: transform, opacity;
}
.is-ready .u-anim.-fadein.is-inview {
opacity: 1;
}
.is-ready .u-anim.-fadeup.is-inview {
opacity: 1;
transform: none;
}
/* ========================================================================== */
/* Utilities / Ratio */
/* ========================================================================== */
/*
Generate a series of ratio classes to be used like so:
@example
*/
.u-1\:1::before {
padding-bottom: 100%;
}
.u-2\:1::before {
padding-bottom: 50%;
}
.u-3\:1::before {
padding-bottom: 33.3333%;
}
.u-2\:3::before {
padding-bottom: 150%;
}
.u-4\:3::before {
padding-bottom: 75%;
}
.u-3\:4::before {
padding-bottom: 133.3333%;
}
.u-3\:2::before {
padding-bottom: 66.6667%;
}
.u-16\:9::before {
padding-bottom: 56.25%;
}
/* ========================================================================== */
/* Utilities / Table */
/* ========================================================================== */
table {
border-radius: calc(var(--step-0) / 3);
}
table:not(.variations) thead, table:not(.variations) tbody {
border-top: 1px solid var(--grey);
border-bottom: 1px solid var(--grey);
}
table:not(.variations) thead > * + *, table:not(.variations) tbody > * + * {
border-top: 1px solid var(--grey);
}
table:not(.variations) tfoot {
border-bottom: 1px solid var(--grey);
}
table:not(.variations) td {
padding: var(--step-0);
}
table:not(.variations) th {
padding: var(--step-0);
color: var(--white);
}
table:not(.variations) th:not(.woocommerce-orders-table__cell) {
background-color: var(--black);
}
table:not(.variations) tr:nth-child(odd) {
background-color: var(--white);
}
table:not(.variations) tr:nth-child(even) {
background-color: var(--grey);
}
/* @import "utilities/_grid-column"; */
/* ========================================================================== */
/* Utilities / Helpers */
/* ========================================================================== */
/* Layout */
.u-oh {
overflow: hidden;
}
.u-flow > * + * {
margin-top: var(--step-1);
}
.u-text-center {
text-align: center;
}
/* Images */
/* .u-img-half {
margin: 0 1.5rem 1.5rem 0;
width: 100%;
height: auto;
}
.u-img-right {
margin: 0 0 1.5rem 1.5rem;
width: 100%;
height: auto;
}
.u-img-full {
width: 100%;
height: auto;
}
@media screen and (--from-small) {
.u-img-half {
width: 40%;
}
}
@media screen and (--from-medium) {
.u-img-half {
margin: 0 0.5rem;
width: calc(50% - 1rem);
}
} */
/* Video */
.u-video iframe {
width: 100%;
height: auto;
aspect-ratio: 16/9;
-o-object-fit: cover;
object-fit: cover;
}
/* Decorative */
.u-pre {
white-space: pre;
}
/* Visibility / Display */
.u-sr-only {
position: absolute;
overflow: hidden;
clip: rect(0 0 0 0);
margin: 0;
padding: 0;
width: 1px;
height: 1px;
border: 0;
}
/* ========================================================================== */
/* Utilities / Wysiwyg */
/* ========================================================================== */
.u-wysiwyg {
/* Blockquote */
}
.u-wysiwyg h1, .u-wysiwyg h2, .u-wysiwyg h3, .u-wysiwyg h4 {
margin-block-end: 1.5rem;
}
.u-wysiwyg h1:first-child, .u-wysiwyg h2:first-child, .u-wysiwyg h3:first-child, .u-wysiwyg h4:first-child {
margin-top: 0;
}
.u-wysiwyg h1, .u-wysiwyg h2, .u-wysiwyg h3 {
max-width: 35ch;
}
.u-wysiwyg h1 {
margin-top: calc(var(--step-5) / 2);
font-size: var(--step-4);
}
.u-wysiwyg h2 {
margin-top: calc(var(--step-4) / 2);
font-size: var(--step-3);
}
.u-wysiwyg h3 {
margin-top: calc(var(--step-3) / 2);
font-size: var(--step-2);
}
.u-wysiwyg h4 {
margin-top: calc(var(--step-2) / 2);
font-size: var(--step-1);
}
.u-wysiwyg .o-lead, .u-wysiwyg blockquote p {
max-width: 60ch;
}
.u-wysiwyg > *:not(h1):not(h2):not(h3):not(h4):not(.o-lead):not(blockquote) {
max-width: 70ch;
}
.u-wysiwyg > *:not(h1):not(h2):not(h3):not(h4):not(:last-child) {
margin-bottom: 1.5rem;
}
.u-wysiwyg > *:not(h1):not(h2):not(h3):not(h4):not(blockquote):not(:first-child) {
margin-top: 1.5rem;
}
.u-wysiwyg a:not(.c-button) {
position: relative;
font-family: var(--font-family-bold);
font-weight: 600;
color: var(--cornell-red);
background-image: linear-gradient(var(--cornell-red), var(--cornell-red));
background-position: 0% 100%;
background-repeat: no-repeat;
background-size: 100% 2px;
transition:
background-size var(--speed) var(--easing),
color var(--speed) var(--easing) 0.1s
;
}
@media (hover: hover) {
.u-wysiwyg a:not(.c-button):hover {
background-size: 0% 2px;
}
}
.u-wysiwyg a:not(.c-button):focus-visible {
outline-offset: 2px;
outline: dashed 2px black;
background-size: 0% 1px;
}
.u-wysiwyg ul, .u-wysiwyg ol {
padding-left: var(--step-1);
}
.u-wysiwyg ol {
list-style-type: decimal;
}
.u-wysiwyg img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.u-wysiwyg img.alignleft, .u-wysiwyg img.alignright, .u-wysiwyg img.aligncenter {
width: auto;
max-width: 100%;
}
.u-wysiwyg img.aligncenter {
display: block;
margin-inline-start: auto;
margin-inline-end: auto;
}
.u-wysiwyg blockquote {
--blockquote-size: var(--step-6);
position: relative;
margin-top: var(--step-4);
}
.u-wysiwyg blockquote::before {
content: '';
position: absolute;
top: calc(var(--blockquote-size) / -1.75);
display: inline-block;
width: var(--blockquote-size);
height: var(--blockquote-size);
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m8.1 16.7c.5-.2 1.1-.3 1.6-.3 2.9 0 4.9 2.2 4.9 4.5s-1.6 5-5 5-5.5-2.4-5.5-6.4c0-5.8 4.3-10.2 9.2-13.5l1.4 2.2c-3.6 2.6-6.1 5.3-6.6 8.5zm13.3 0c.6-.2 1.1-.3 1.7-.3 2.7 0 4.8 2.2 4.8 4.5s-1.6 5-5.1 5-5.5-2.4-5.5-6.4c0-5.8 4.3-10.2 9.3-13.5l1.4 2.2c-3.7 2.6-6.2 5.3-6.6 8.5z' fill='%23a62424'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.u-wysiwyg blockquote p:not(cite) {
display: inline-block;
margin-bottom: var(--step-0);
font-size: var(--step-2);
font-family: var(--font-family-heading);
line-height: 1.35;
}
.u-wysiwyg blockquote p:first-of-type {
text-indent: calc(var(--blockquote-size) * 1.15);
}
.u-wysiwyg blockquote .u-cite, .u-wysiwyg blockquote cite {
display: block;
font-family: var(--line-height);
font-size: var(--step-0);
color: var(--cornell-red);
}
.u-wysiwyg blockquote .u-cite::before, .u-wysiwyg blockquote cite::before {
content: "";
display: inline-block;
margin-inline-end: calc(var(--step-0) / 4);
height: 2px;
width: var(--step-0);
background-color: var(--cornell-red);
vertical-align: middle;
}
.is-single-post .u-wysiwyg > *:not(h1):not(h2):not(h3):not(h4) {
max-width: 77ch;
}
.is-simple .u-wysiwyg > *:not(h1):not(h2):not(h3):not(h4):not(.o-lead) {
max-width: 80ch;
}
/* ========================================================================== */
/* Utilities / Print Mode */
/* ========================================================================== */
@media print {
*,
*:before,
*:after,
*:first-letter,
*:first-line {
background: transparent !important;
box-shadow: none !important;
color: #000000 !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/* Don't show links that are fragment identifiers, or use the `javascript:` */
/* pseudo protocol. */
a[href^="#"]:after,
a[href^="javascript:"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999999;
page-break-inside: avoid;
}
/* Printing Tables: http://css-discuss.incutio.com/wiki/Printing_Tables */
thead {
display: table-header-group;
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}
/* Template Parts */
/* ========================================================================== */
/* Header */
/* ========================================================================== */
/* Template Parts / Header / Header */
/* ========================================================================== */
.t-header {
/* Default styles */
--header-gap: calc(var(--step-0) / 2);
position: fixed;
top: 0;
left: 0;
padding: var(--step-0) 0;
width: 100%;
z-index: 900;
/* Layout styles */
}
.t-header_inner {
/* position: relative;
&::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--white);
backdrop-filter: blur(5px);
opacity: 0;
transition: opacity .5s cubic-bezier(.77,0,.18,1);
z-index: -1;
} */
}
.t-header_main {
display: flex;
justify-content: space-between;
align-items: center;
}
.t-header_col.-nav {
gap: var(--header-gap);
}
.t-header_buttons {
gap: var(--header-gap);
}
@media (max-width: 799px) {
.t-header_buttons {
display: none;
}
}
@media (max-width: 999px) {
.t-header_col.-logo {
position: relative;
margin-inline-end: auto;
z-index: 22;
}
.t-header_buttons {
position: relative;
z-index: 22;
}
}
@media (min-width: 1000px) {
.t-header_col.-nav {
flex: 1;
}
}
/* Specific styles */
/* body:not(.is-home.has-media) {
.t-header {
background-color: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(100px);
}
} */
/* Animations */
.has-scrolled .t-header_inner:before {
opacity: 1;
}
.has-scrolled[data-direction="1"] .t-header {
transition:
transform var(--speed) var(--easing)
;
transform: translate3d(0, -100%, 0);
}
.has-scrolled[data-direction="-1"] .t-header {
transition:
transform var(--speed) var(--easing)
;
transform: translate3d(0, 0, 0);
}
/* Menu */
/* ========================================================================== */
/* Template Parts / Menu / Main */
/* ========================================================================== */
.c-menu-main {
display: flex;
align-items: center;
justify-content: center;
}
.c-menu-main::before {
display: none;
}
.c-menu-main_nav {
width: 100%;
}
.c-menu-main_item {
position: relative;
display: flex;
flex-wrap: wrap;
list-style: none;
}
.c-menu-main_link {
display: flex;
flex-wrap: wrap;
align-items: center;
line-height: normal;
}
.c-menu-main_link-label, .c-menu-main_dropdown-label {
/* height: var(--step-1); */
font-family: var(--font-family-bold);
font-weight: 600;
line-height: 150%;
text-transform: uppercase;
transition:
color var(--speed) var(--easing)
;
}
.c-menu-main_desc {
margin-block-start: calc(var(--step-0) / 2);
width: 100%;
font-size: var(--step-0);
line-height: calc(var(--step-0) * 1.55);
}
@media (max-width: 799px) {
.c-menu-main_buttons {
margin-block-start: var(--step-0);
gap: var(--step-0);
}
.c-menu-main_button {
flex: 1;
}
}
@media (min-width: 800px) {
.c-menu-main_buttons {
display: none;
}
}
@media (max-width: 999px) {
.c-menu-main::before {
/* used in JS to detect menu style */
content: "mobile";
}
.c-menu-main_inner {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
visibility: hidden;
pointer-events: none;
}
.c-menu-main_inner::before, .c-menu-main_inner::after {
content: '';
position: absolute;
z-index: -35;
}
.c-menu-main_inner::before {
top: 0;
left: 0;
width: 100%;
height: calc(var(--vh, 1vh) * 100);
background-color: var(--rustic-red-light);
opacity: 0;
transition:
opacity var(--speed) var(--easing)
;
}
.c-menu-main_inner::after {
left: 8px;
top: 8px;
border-radius: 10px;
width: calc(100% - 16px);
height: calc((var(--vh, 1vh) * 100) - 16px);
clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
opacity: 0;
transform: translateY(1em);
transition:
opacity var(--speed) var(--easing),
clip-path var(--speed) var(--easing),
transform var(--speed) var(--easing)
;
}
.c-menu-main_nav {
position: absolute;
top: 0;
left: 0;
height: calc(var(--vh, 1vh) * 100);
min-height: 100vh;
padding-block-start: calc(var(--header-height) + var(--step-0));
padding-block-end: 120px;
padding-inline-start: var(--layout-margin);
padding-inline-end: var(--layout-margin);
clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
transform: translateY(var(--step-6));
transition:
visibility var(--speed) var(--easing),
clip-path var(--speed) var(--easing),
transform var(--speed) var(--easing)
;
pointer-events: none;
visibility: hidden;
z-index: 20;
}
.c-menu-main_list {
display: flex;
flex-direction: column;
gap: var(--step-0);
}
.c-menu-main_item.is-label .c-menu-main_heading {
color: var(--white);
background-color: var(--black);
}
.c-menu-main_item.is-top .c-menu-main_link, .c-menu-main_item.is-parent .c-menu-main_link {
justify-content: space-between;
}
.c-menu-main_item.is-top > .c-menu-main_link[aria-current=page] .c-menu-main_link-label, .c-menu-main_item.is-parent > .c-menu-main_link[aria-current=page] .c-menu-main_link-label {
color: var(--conrnell-red);
}
.c-menu-main_link, .c-menu-main_dropdown, .c-menu-main_heading {
border-radius: calc(var(--step-0) * 2);
border: solid 2px var(--rustic-red);
padding: var(--step-0) calc(var(--step-0) * 1.5);
width: 100%;
font-size: calc(var(--step-0) * 0.85);
color: var(--white);
background-color: var(--rustic-red);
}
.c-menu-main_dropdown {
display: flex;
justify-content: space-between;
align-items: center;
}
.c-menu-main_dropdown[aria-expanded=true] {
border-color: var(--rustic-red-dark);
background-color: var(--rustic-red-dark);
}
.c-menu-main_dropdown[aria-expanded=true] + .c-menu-main_list.-level-1 {
display: flex;
}
.c-menu-main_dropdown[aria-expanded=true] .c-menu-main_dropdown-icon {
transform: scale3d(1, -1, 1);
}
.c-menu-main_dropdown + .c-menu-main_list.-level-1 {
display: none;
width: 100%;
padding-block-start: var(--step-0);
padding-inline-start: calc(var(--step-0) * 1.5);
}
.c-menu-main_dropdown-icon {
width: var(--step-1);
height: var(--step-1);
transition:
transform var(--speed) var(--easing)
;
}
}
@media (min-width: 1000px) {
.c-menu-main::before {
/* used in JS to detect menu style */
content: "desktop";
}
.c-menu-main_nav {
border-radius: var(--step-3);
border: solid 2px var(--rustic-red-dark);
padding: 0 calc(var(--step-0) * 1.5);
background-color: var(--rustic-red-dark);
}
.c-menu-main_list.-level-0 {
display: flex;
justify-content: center;
align-items: center;
}
.c-menu-main_list.-level-0 > * + * {
/* space between li elements */
margin-inline-start: var(--step-0);
}
.c-menu-main_list.-buttons {
display: none;
}
@media (hover: hover) {
.c-menu-main_item:hover .c-menu-main_list.-level-1 {
visibility: visible;
opacity: 1;
transition:
visibility 0.2s 0s,
opacity 0.2s 0s
;
}
}
.c-menu-main_item.is-label {
font-weight: 600;
}
.c-menu-main_item.is-label:not(:first-of-type) {
margin-block-start: var(--step-0);
}
.c-menu-main_item.is-label > .c-menu-main_heading {
display: flex;
margin-block-end: calc(
var(--step-0) / 2
);
border-bottom: solid 1px var(--rustic-red);
padding: calc(var(--step-0) / 2);
}
.c-menu-main_item.is-top > .c-menu-main_link, .c-menu-main_item.is-top > .c-menu-main_dropdown {
padding: var(--step-0) 0;
font-size: calc(var(--step-0) * 0.85);
color: var(--white);
}
.c-menu-main_item.is-top > .c-menu-main_link:focus-visible, .c-menu-main_item.is-top > .c-menu-main_dropdown:focus-visible {
outline: none;
}
.c-menu-main_item.is-top > .c-menu-main_link:focus-visible .c-menu-main_link-label,
.c-menu-main_item.is-top > .c-menu-main_link:focus-visible .c-menu-main_dropdown-label,
.c-menu-main_item.is-top > .c-menu-main_dropdown:focus-visible .c-menu-main_link-label,
.c-menu-main_item.is-top > .c-menu-main_dropdown:focus-visible .c-menu-main_dropdown-label {
outline: dashed 2px var(--white);
outline-offset: 4px;
}
@media (hover: hover) {
.c-menu-main_item.is-top > .c-menu-main_link:hover .c-menu-main_link-label,
.c-menu-main_item.is-top > .c-menu-main_link:hover .c-menu-main_dropdown-label,
.c-menu-main_item.is-top > .c-menu-main_dropdown:hover .c-menu-main_link-label,
.c-menu-main_item.is-top > .c-menu-main_dropdown:hover .c-menu-main_dropdown-label {
color: var(--bee-yellow);
}
}
.c-menu-main_item.is-parent {
display: block;
}
.c-menu-main_item.is-parent > .c-menu-main_link {
padding: calc(var(--step-0) / 2);
}
.c-menu-main_item.is-parent > .c-menu-main_link .c-menu-main_link-label,
.c-menu-main_item.is-parent > .c-menu-main_link .c-menu-main_dropdown-label {
/* color: var(--white); */
}
@media (hover: hover) {
.c-menu-main_item.is-parent > .c-menu-main_link:hover .c-menu-main_link-label {
color: var(--cornell-red);
}
}
.c-menu-main_item.is-top > .c-menu-main_link[aria-current=page] .c-menu-main_link-label, .c-menu-main_item.is-parent > .c-menu-main_link[aria-current=page] .c-menu-main_link-label {
color: var(--cornell-red);
}
.c-menu-main_dropdown {
align-items: center;
justify-content: center;
}
.c-menu-main_dropdown > * + * {
margin-inline-start: calc(var(--step-0) / 3);
}
.c-menu-main_dropdown + .c-menu-main_list.-level-1 {
/* reset style */
display: block;
padding: var(--step-0);
}
.c-menu-main_dropdown[aria-expanded=true] + .c-menu-main_list.-level-1 {
visibility: visible;
opacity: 1;
transition:
visibility 0.2s 0s,
opacity 0.2s 0s
;
}
.c-menu-main_dropdown-icon {
width: var(--step-0);
height: var(--step-0);
}
.c-menu-main_list.-level-1 {
position: absolute;
top: calc(100% + 2px);
left: calc(var(--step-0) * -1.5);
border-top: solid 1px var(--black);
border-bottom-left-radius: var(--step-2);
border-bottom-right-radius: var(--step-2);
background-color: var(--white);
box-shadow: 0px 5px 15px -5px rgba(0,0,0,0.1);
z-index: 5;
/* hide */
visibility: hidden;
opacity: 0;
transition:
visibility 0.2s 0.2s,
opacity 0.2s 0s
;
}
}
/* Specific styles */
@media (min-width: 1000px) {
.logged-in .c-menu-main_list.-level-1 {
width: 325px;
}
}
@media (min-width: 1000px) {
body:not(.logged-in) .c-menu-main_list.-level-1 {
width: 325px;
}
}
/* Animation styles */
.has-nav-open .c-menu-main_inner {
visibility: visible;
}
.has-nav-open .c-menu-main_inner:before {
opacity: 1;
}
.has-nav-open .c-menu-main_inner:after {
opacity: 1;
}
.has-nav-open .c-menu-main_nav {
overflow: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
visibility: visible;
pointer-events: auto;
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
transform: translateY(0);
}
/* body {
&.is-home.has-media,
&.is-default:has(.c-hero.-black) {
@media (--from-medium) {
.c-menu-main {
&_icon {
fill: var(--white);
}
&_item {
&.is-top {
> .c-menu-main {
&_link, &_dropdown {
color: var(--white);
}
}
}
}
}
}
}
} */
/* html {
&.has-scrolled {
@media (--from-medium) {
.c-menu-main {
&_icon {
fill: var(--black) !important;
transition:
fill var(--speed) var(--easing)
;
}
&_item {
&.is-top {
> .c-menu-main {
&_link, &_dropdown {
color: var(--black) !important;
}
}
}
}
}
}
}
} */
/* ========================================================================== */
/* Template Parts / Menu / Toggle */
/* ========================================================================== */
@media (max-width: 999px) {
.c-menu-toggle {
line-height: 150%;
z-index: 22
}
}
@media (min-width: 1000px) {
.c-menu-toggle {
display: none
}
}
/* Animation styles */
html.has-nav-open .c-menu-toggle_icon.-open {
display: none;
}
html:not(.has-nav-open) .c-menu-toggle_icon.-close {
display: none;
}
/* @import "../../template-parts/menu/_menu-simple"; */
/* Components */
/* ========================================================================== */
/* Template Parts / Components / Component Hero */
/* ========================================================================== */
.c-hero {
/* Default styles */
/* Images */
/* Layout styles */
}
.c-hero_inner {
align-items: end;
}
.c-hero_header {
padding-left: var(--layout-margin);
padding-right: var(--layout-margin);
}
.c-hero_eyebrow {
padding: calc(var(--step-0) * 0.75) var(--step-0);
border-radius: var(--step-3);
font-size: calc(var(--step-0) * 0.85);
color: var(--white);
background-color: var(--rustic-red-dark);
}
.c-hero_title span {
display: block;
max-width: 25ch;
}
.c-hero_text {
margin-block-start: var(--step-2);
padding-inline-start: 5px;
}
.c-hero_buttons {
margin-block-start: var(--step-3);
gap: var(--layout-gap);
}
.c-hero_slideshow {
position: relative;
width: 100%;
height: 100%;
}
.c-hero_slideshow-item {
position: absolute;
top: 0;
width: 100%;
height: 100%;
opacity: 0;
transition:
opacity 1.5s var(--easing)
;
}
.c-hero_slideshow-item.is-active {
opacity: 1;
}
.c-hero_media, .c-hero_figure {
width: 100%;
height: 100%;
}
.c-hero_media {
background-color: var(--black);
}
.c-hero_img, .c-hero_video {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
}
@media (max-width: 799px) {
.c-hero_figure {
--parallax: 7%;
}
}
@media (min-width: 800px) {
.c-hero {
/* &_button {
min-width:
calc(
(var(--layout-column-width) * 2) +
var(--layout-gap)
)
;
} */
}
}
body.is-home .c-hero:not(.has-media), body.is-default .c-hero:not(.has-media) {
padding-block-end: var(--spacing-y-lg);
}
body:not(.is-home.has-media) .c-hero, body.is-default .c-hero {
padding-block-start: var(--header-height);
/* Layout styles */
}
body:not(.is-home.has-media) .c-hero_header-inner, body.is-default .c-hero_header-inner {
padding-block-start: calc(var(--spacing-y-lg) * 1);
padding-block-end: var(--step-0);
}
body:not(.is-home.has-media) .c-hero_title, body.is-default .c-hero_title {
width: 100%;
}
@media(max-width: 799px) {
body:not(.is-home.has-media) .c-hero_header-inner, body.is-default .c-hero_header-inner {
padding-block-end: var(--spacing-y-lg);
padding-inline-start: calc(var(--layout-gap) / 2);
padding-inline-end: calc(var(--layout-gap) / 2);
text-align: center;
}
body:not(.is-home.has-media) .c-hero_buttons, body.is-default .c-hero_buttons {
width: 100%;
justify-content: center;
}
}
@media(min-width: 800px) {
body:not(.is-home.has-media) .c-hero_header-inner, body.is-default .c-hero_header-inner {
padding-block-end: var(--step-0);
padding-inline-start: calc(var(--layout-gap) / 2);
}
body:not(.is-home.has-media) .c-hero_text, body:not(.is-home.has-media) .c-hero_buttons, body.is-default .c-hero_text, body.is-default .c-hero_buttons {
width: 50%;
}
body:not(.is-home.has-media) .c-hero_text, body.is-default .c-hero_text {
/* order: 2; */
}
body:not(.is-home.has-media) .c-hero_buttons, body.is-default .c-hero_buttons {
/* order: 0; */
padding-inline-end: var(--step-0);
justify-content: flex-end;
align-items: flex-end;
}
}
body.is-home.has-media .c-hero {
/* CMS Layout styles */
}
body.is-home.has-media .c-hero_header {
z-index: 2;
}
body.is-home.has-media .c-hero_img, body.is-home.has-media .c-hero_video {
opacity: 0.56;
}
body.is-home.has-media .c-hero:not(.c-button_text) {
color: var(--white);
}
body.is-home.has-media .c-hero.-center .c-hero_inner {
display: grid;
grid-template-areas: "stack";
}
body.is-home.has-media .c-hero.-center .c-hero_inner > * {
grid-area: stack;
}
body.is-home.has-media .c-hero.-center .c-hero_header {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
body.is-home.has-media .c-hero.-center .c-hero_header-inner {
padding-block-start: var(--spacing-y);
padding-block-end: var(--spacing-y);
flex-direction: column;
text-align: center;
}
body.is-home.has-media .c-hero.-center .c-hero_header-inner > * {
margin-inline-start: auto;
margin-inline-end: auto;
}
body.is-home.has-media .c-hero.-center .c-hero_text {
order: 4;
margin-block-start: auto;
font-family: var(--font-family-bold);
font-weight: 600;
max-width: 50ch;
}
@media (max-width: 799px) {
body.is-home.has-media .c-hero.-center .c-hero_header {
margin-block-start: var(--header-height);
margin-block-end: var(--spacing-y-lg);
}
body.is-home.has-media .c-hero.-center .c-hero_header-inner {
padding-inline-start: calc(var(--layout-gap) / 2);
padding-inline-end: calc(var(--layout-gap) / 2);
padding-block-start: calc(var(--spacing-y-lg) * 2);
padding-block-end: var(--spacing-y-lg);
}
}
@media (min-width: 800px) {
body.is-home.has-media .c-hero.-center .c-hero_header {
height: calc(100% - (var(--header-height)));
}
body.is-home.has-media .c-hero.-center .c-hero_media {
height: 100vh;
}
}
@media (max-width: 799px) and (orientation: landscape) {
body.is-home.has-media .c-hero.has-media .c-hero_media {
min-height: 100vw;
}
}
@media (max-width: 799px) and (orientation: portrait) {
body.is-home.has-media .c-hero.has-media .c-hero_media {
min-height: calc(100vh - var(--header-height));
}
}
@media (min-width: 800px) {
body.is-home.has-media .c-hero_figure {
--parallax: 10%;
transform: translateY(clamp(calc(-1 * var(--parallax)), calc(-1 * var(--parallax) + (var(--progress) - 0) / (1 - 0) * (var(--parallax) - calc(-1 * var(--parallax)))), var(--parallax)));
}
}
.is-default .c-hero {
/* Default styles */
padding-block-start: var(--header-height);
/* CCMS styles */
}
.is-default .c-hero_title span {
max-width: 20ch;
}
.is-default .c-hero_media {
/* --media-clip: calc((1 - var(--progress)) * 50%);
clip-path: inset(var(--media-clip) round 0); */
/* position: relative;
&::before {
content: '';
position: absolute;
top: var(--spacing-y-lg);
left: 0;
border-top: solid 1px var(--grey);
width: 100%;
height: calc(100% - (var(--spacing-y-lg) * 2) + 1px);
pointer-events: none;
z-index: 9999;
} */
}
.is-default .c-hero.-rustic {
color: var(--bee-yellow);
}
.is-default .c-hero.-center .c-hero_eyebrow {
margin-inline-start: auto;
margin-inline-end: auto;
}
.is-default .c-hero.-center .c-hero_title, .is-default .c-hero.-center .c-hero_text {
text-align: center;
}
.is-default .c-hero.-center .c-hero_title span {
margin: 0 auto;
}
.is-default .c-hero.-center .c-hero_text, .is-default .c-hero.-center .c-hero_buttons, .is-default .c-hero.-center .c-hero_portrait {
width: 100%;
}
.is-default .c-hero.-center .c-hero_text > * {
margin-inline-start: auto;
margin-inline-end: auto;
}
.is-default .c-hero.-center .c-hero_buttons {
justify-content: center;
}
.is-default .c-hero.-center .c-hero_portrait {
margin-block-start: var(--step-4);
margin-block-end: calc(
var(--spacing-y-lg) * -1.5
);
z-index: 2;
}
.is-default .c-hero.-center .c-hero_portrait-figure {
width: calc(
(var(--layout-column-width) * 2) +
var(--layout-gap)
);
}
@media (max-width: 799px) {
.is-default .c-hero_media {
aspect-ratio: 1/1;
}
}
@media (min-width: 800px) {
.is-default .c-hero_media {
max-height: 95vh;
aspect-ratio: 4/3;
}
.is-default .c-hero_figure {
--parallax: 10%;
transform: translateY(clamp(calc(-1 * var(--parallax)), calc(-1 * var(--parallax) + (var(--progress) - 0) / (1 - 0) * (var(--parallax) - calc(-1 * var(--parallax)))), var(--parallax)));
}
}
/* ========================================================================== */
/* Template Parts / Components / Component Social */
/* ========================================================================== */
.c-social {
/* Default styles */
/* Specific styles */
/* Layout styles */
}
.c-social_item {
position: relative;
z-index: 1;
}
.c-social_link {
position: relative;
border-radius: 50%;
border-width: 1px;
border-style: solid;
width: calc(var(--step-0) * 3.75);
height: calc(var(--step-0) * 3.75);
isolation: isolate;
transition:
background-color var(--speed) var(--easing)
;
}
.c-social_link::before, .c-social_link::after {
content: "";
position: absolute;
inset: 0;
border-radius: 100%;
transition:
transform var(--speed) var(--power2-out)
;
}
.c-social_link::before {
transform: scale(1);
z-index: 2;
}
.c-social_link::after {
transform: scale(0);
z-index: 4;
}
@media (hover: hover) {
.c-social_link:hover::before {
transform: scale(0.85);
}
.c-social_link:hover::after {
transform: scale(1);
}
.c-social_link:hover .c-social_link-icon {
fill: var(--white);
}
}
.c-social_icon {
z-index: 6;
}
.c-social.-footer .c-social_link {
border-color: var(--bee-yellow);
background-color: transparent;
}
.c-social.-footer .c-social_link::before {
background: transparent;
}
.c-social.-footer .c-social_link::after {
background: var(--bee-yellow);
}
@media (hover: hover) {
.c-social.-footer .c-social_link:hover .c-social_icon {
fill: var(--rustic-red);
}
}
.c-social.-footer .c-social_icon {
fill: var(--white);
transition:
fill var(--speed) var(--easing)
;
}
@media (max-width: 799px) {
.c-social {
gap: var(--layout-gap);
justify-content: center
}
.c-social.-footer {
margin-block-start: var(--spacing-y);
}
}
@media (min-width: 800px) {
.c-social {
gap: calc(var(--layout-gap) / 2.5)
}
}
/* @import "../../template-parts/components/_component-affiliates"; */
/* @import "../../template-parts/components/_component-share"; */
/* Blocks */
/* ========================================================================== */
/* Template Parts / Blocks / Block Intro (ACF) */
/* ========================================================================== */
/* Default styles for blocks intros with dynamic content */
.b-contact,
.b-content,
.b-grid,
.b-list,
.b-stickyFeature {
/* Layout */
/* Layout */
}
.b-contact_header, .b-content_header, .b-grid_header, .b-list_header, .b-stickyFeature_header {
position: relative;
z-index: 2;
}
.b-contact_title, .b-content_title, .b-grid_title, .b-list_title, .b-stickyFeature_title {
max-width: 23ch;
}
.b-contact.-center .b-contact_headings, .b-content.-center .b-content_headings, .b-grid.-center .b-grid_headings, .b-list.-center .b-list_headings, .b-stickyFeature.-center .b-stickyFeature_headings {
text-align: center;
}
.b-contact.-center .b-contact_title, .b-contact.-center .b-contact_buttons, .b-content.-center .b-content_title, .b-content.-center .b-content_buttons, .b-grid.-center .b-grid_title, .b-grid.-center .b-grid_buttons, .b-list.-center .b-list_title, .b-list.-center .b-list_buttons, .b-stickyFeature.-center .b-stickyFeature_title, .b-stickyFeature.-center .b-stickyFeature_buttons {
margin-inline-start: auto;
margin-inline-end: auto;
}
.b-contact.-center .b-contact_text, .b-content.-center .b-content_text, .b-grid.-center .b-grid_text, .b-list.-center .b-list_text, .b-stickyFeature.-center .b-stickyFeature_text {
width: 100%;
}
.b-contact.-center .b-contact_text > *, .b-content.-center .b-content_text > *, .b-grid.-center .b-grid_text > *, .b-list.-center .b-list_text > *, .b-stickyFeature.-center .b-stickyFeature_text > * {
margin-inline-start: auto;
margin-inline-end: auto;
}
@media (max-width: 799px) {
.b-contact.-right .b-contact_headings, .b-contact.-right .b-contact_text, .b-contact.-right .b-contact_buttons, .b-contact.-left .b-contact_headings, .b-contact.-left .b-contact_text, .b-contact.-left .b-contact_buttons, .b-contact.-center .b-contact_headings, .b-contact.-center .b-contact_text, .b-contact.-center .b-contact_buttons, .b-content.-right .b-content_headings, .b-content.-right .b-content_text, .b-content.-right .b-content_buttons, .b-content.-left .b-content_headings, .b-content.-left .b-content_text, .b-content.-left .b-content_buttons, .b-content.-center .b-content_headings, .b-content.-center .b-content_text, .b-content.-center .b-content_buttons, .b-grid.-right .b-grid_headings, .b-grid.-right .b-grid_text, .b-grid.-right .b-grid_buttons, .b-grid.-left .b-grid_headings, .b-grid.-left .b-grid_text, .b-grid.-left .b-grid_buttons, .b-grid.-center .b-grid_headings, .b-grid.-center .b-grid_text, .b-grid.-center .b-grid_buttons, .b-list.-right .b-list_headings, .b-list.-right .b-list_text, .b-list.-right .b-list_buttons, .b-list.-left .b-list_headings, .b-list.-left .b-list_text, .b-list.-left .b-list_buttons, .b-list.-center .b-list_headings, .b-list.-center .b-list_text, .b-list.-center .b-list_buttons, .b-stickyFeature.-right .b-stickyFeature_headings, .b-stickyFeature.-right .b-stickyFeature_text, .b-stickyFeature.-right .b-stickyFeature_buttons, .b-stickyFeature.-left .b-stickyFeature_headings, .b-stickyFeature.-left .b-stickyFeature_text, .b-stickyFeature.-left .b-stickyFeature_buttons, .b-stickyFeature.-center .b-stickyFeature_headings, .b-stickyFeature.-center .b-stickyFeature_text, .b-stickyFeature.-center .b-stickyFeature_buttons {
grid-column: 1 / -1;
}
.b-contact.-right .b-contact_text, .b-contact.-left .b-contact_text, .b-contact.-center .b-contact_text, .b-content.-right .b-content_text, .b-content.-left .b-content_text, .b-content.-center .b-content_text, .b-grid.-right .b-grid_text, .b-grid.-left .b-grid_text, .b-grid.-center .b-grid_text, .b-list.-right .b-list_text, .b-list.-left .b-list_text, .b-list.-center .b-list_text, .b-stickyFeature.-right .b-stickyFeature_text, .b-stickyFeature.-left .b-stickyFeature_text, .b-stickyFeature.-center .b-stickyFeature_text {
margin-block-start: var(--step-2);
}
}
@media (min-width: 800px) {
.b-contact.-left .b-contact_headings, .b-content.-left .b-content_headings, .b-grid.-left .b-grid_headings, .b-list.-left .b-list_headings, .b-stickyFeature.-left .b-stickyFeature_headings {
grid-column: 1 / span 6;
}
.b-contact.-left .b-contact_text, .b-contact.-left .b-contact_buttons, .b-content.-left .b-content_text, .b-content.-left .b-content_buttons, .b-grid.-left .b-grid_text, .b-grid.-left .b-grid_buttons, .b-list.-left .b-list_text, .b-list.-left .b-list_buttons, .b-stickyFeature.-left .b-stickyFeature_text, .b-stickyFeature.-left .b-stickyFeature_buttons {
grid-column: 7 / span 6;
}
.b-contact.-right .b-contact_headings, .b-content.-right .b-content_headings, .b-grid.-right .b-grid_headings, .b-list.-right .b-list_headings, .b-stickyFeature.-right .b-stickyFeature_headings {
grid-column: 7 / span 6;
}
.b-contact.-right .b-contact_text, .b-contact.-right .b-contact_buttons, .b-content.-right .b-content_text, .b-content.-right .b-content_buttons, .b-grid.-right .b-grid_text, .b-grid.-right .b-grid_buttons, .b-list.-right .b-list_text, .b-list.-right .b-list_buttons, .b-stickyFeature.-right .b-stickyFeature_text, .b-stickyFeature.-right .b-stickyFeature_buttons {
grid-column: 1 / span 6;
}
.b-contact.-right .b-contact_text, .b-content.-right .b-content_text, .b-grid.-right .b-grid_text, .b-list.-right .b-list_text, .b-stickyFeature.-right .b-stickyFeature_text {
grid-row: 1;
}
.b-contact.-right .b-contact_buttons, .b-content.-right .b-content_buttons, .b-grid.-right .b-grid_buttons, .b-list.-right .b-list_buttons, .b-stickyFeature.-right .b-stickyFeature_buttons {
grid-row: 2;
}
.b-contact.-center .b-contact_headings, .b-contact.-center .b-contact_text, .b-contact.-center .b-contact_buttons, .b-content.-center .b-content_headings, .b-content.-center .b-content_text, .b-content.-center .b-content_buttons, .b-grid.-center .b-grid_headings, .b-grid.-center .b-grid_text, .b-grid.-center .b-grid_buttons, .b-list.-center .b-list_headings, .b-list.-center .b-list_text, .b-list.-center .b-list_buttons, .b-stickyFeature.-center .b-stickyFeature_headings, .b-stickyFeature.-center .b-stickyFeature_text, .b-stickyFeature.-center .b-stickyFeature_buttons {
grid-column: 1 / -1;
}
.b-contact.-center .b-contact_text, .b-content.-center .b-content_text, .b-grid.-center .b-grid_text, .b-list.-center .b-list_text, .b-stickyFeature.-center .b-stickyFeature_text {
margin-block-start: var(--step-2);
}
}
/* ========================================================================== */
/* Template Parts / Blocks / Block Content (ACF) */
/* ========================================================================== */
.b-content {
/* See block-intro.css */
/* Default styles */
}
.b-content_buttons {
margin-block-start: var(--step-3);
}
@media (min-width: 800px) {
.b-content.-left .b-content_header, .b-content.-right .b-content_header {
padding-block-end: var(--step-5);
}
.b-content.-center .b-content {
/* &_header {
padding-block-start: var(--spacing-y);
padding-block-end: var(--spacing-y);
} */
}
}
/* @import "../../template-parts/blocks/_block-sticky"; */
/* ========================================================================== */
/* Template Parts / Blocks / Block Grid (ACF) */
/* ========================================================================== */
.b-grid {
/* Default styles */
position: relative;
z-index: 4;
/* Specific styles */
/* Intro */
/* Layout styles */
}
.b-grid_buttons {
margin-block-start: var(--step-2);
}
.b-grid_button {
z-index: 2;
}
.b-grid_list {
position: relative;
z-index: 2;
}
.b-grid:has(.b-grid_list) .b-grid_header {
margin-block-end: var(--layout-gap);
}
.b-grid.-center .b-grid_header {
text-align: center;
}
.b-grid.-center .b-grid_title, .b-grid.-center .b-grid_text {
margin-inline-start: auto;
margin-inline-end: auto;
}
.b-grid.-center .b-grid_text {
max-width: 70ch;
}
.b-grid.-center .b-grid_buttons {
justify-content: center;
}
@media (max-width: 799px) {
.b-grid_text, .b-grid_buttons {
flex-basis: 100%;
}
.b-grid_buttons {
margin-block-start: var(--step-2);
}
.b-grid_list {
margin-block-start: var(--spacing-y);
}
.b-grid_list .b-grid_item {
transition-delay: mod(var(--delay) * 0.1s, 2 * 0.1s);
}
.b-grid_list > * + * {
margin-block-start: calc(var(--spacing-y) - var(--layout-gap));
}
.b-grid_item {
grid-column: 1 / -1;
}
}
@media (min-width: 800px) {
.b-grid:has(.b-grid_inner)_list {
margin-block-start: var(--layout-gap);
}
}
@media (min-width: 800px) and (max-width: 1199px) {
.b-grid_list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.b-grid_list .b-grid_item {
transition-delay: mod(var(--delay) * 0.1s, 2 * 0.1s);
}
.b-grid_item:nth-child(2n+2) {
/* margin-block-start: var(--spacing-y); */
}
}
@media (min-width: 1200px) {
.b-grid_list {
grid-template-columns: repeat(var(--grid-column), minmax(0, 1fr));
align-items: start;
}
.b-grid_list .b-grid_item {
transition-delay: mod(var(--delay) * 0.1s, var(--grid-column) * 0.1s);
}
.b-grid_item:nth-child(3n+2) {
margin-block-start: var(--spacing-y);
}
}
/* ========================================================================== */
/* Template Parts / Blocks / Block Image Banner (ACF) */
/* ========================================================================== */
.b-imageBanner {
/* Default styles */
position: relative;
background-color: var(--black);
/* CMS styles */
/* Layout */
}
.b-imageBanner_header {
padding: var(--spacing-y-lg) 0;
z-index: 2;
}
.b-imageBanner_title {
max-width: 25ch;
}
.b-imageBanner_content {
width: 100%;
}
.b-imageBanner_buttons {
margin-block-start: var(--step-3);
}
.b-imageBanner_figure {
position: relative;
height: 100%;
}
.b-imageBanner_img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: 50% 50%;
object-position: 50% 50%;
}
.b-imageBanner_slideshow {
position: relative;
width: 100%;
height: 100%;
}
.b-imageBanner_slideshow-item {
position: absolute;
top: 0;
width: 100%;
height: 100%;
opacity: 0;
transition:
opacity 1.5s var(--easing)
;
}
.b-imageBanner_slideshow-item.is-active {
opacity: 1;
}
.b-imageBanner.-left .b-imageBanner_text, .b-imageBanner.-left .b-imageBanner_buttons, .b-imageBanner.-center .b-imageBanner_text, .b-imageBanner.-center .b-imageBanner_buttons, .b-imageBanner.-right .b-imageBanner_text, .b-imageBanner.-right .b-imageBanner_buttons {
flex-basis: 100%;
}
.b-imageBanner.-left .b-imageBanner_header-inner, .b-imageBanner.-right .b-imageBanner_header-inner, .b-imageBanner.-unique .b-imageBanner_header-inner {
align-items: flex-start;
}
.b-imageBanner.-left .b-imageBanner_text > *, .b-imageBanner.-right .b-imageBanner_text > *, .b-imageBanner.-unique .b-imageBanner_text > * {
max-width: 60ch;
}
.b-imageBanner.-left .b-imageBanner_buttons, .b-imageBanner.-right .b-imageBanner_buttons {
flex-direction: column;
align-items: flex-start;
}
.b-imageBanner.-center .b-imageBanner_header-inner, .b-imageBanner.-center .b-imageBanner_text {
text-align: center;
}
.b-imageBanner.-center .b-imageBanner_header-inner > *, .b-imageBanner.-center .b-imageBanner_text > * {
margin-inline-start: auto;
margin-inline-end: auto;
}
.b-imageBanner.-center .b-imageBanner_header-inner {
justify-content: center;
}
.b-imageBanner.-center .b-imageBanner_eyebrow {
border-top-left-radius: calc(var(--step-0) * 2);
border-bottom-left-radius: calc(var(--step-0) * 2);
}
.b-imageBanner.-center .b-imageBanner_text ul {
list-style: none;
}
.b-imageBanner.-center .b-imageBanner_text > * {
max-width: 70ch;
}
.b-imageBanner.-center .b-imageBanner_buttons {
justify-content: center;
}
.b-imageBanner.-unique .b-imageBanner_content {
margin-block-start: auto;
}
.b-imageBanner.-unique .b-imageBanner_text {
font-size: var(--step-1);
line-height: calc(var(--step-1) * 1.55);
}
.b-imageBanner.-unique .b-imageBanner_buttons {
display: flex;
justify-content: flex-end;
align-items: flex-end;
flex-direction: column;
}
.b-imageBanner.has-media .b-imageBanner_text.u-wysiwyg > p a, .b-imageBanner.-black .b-imageBanner_text.u-wysiwyg > p a {
color: var(--white);
background-image: linear-gradient(var(--white), var(--white));
}
.b-imageBanner.has-media .b-imageBanner_title, .b-imageBanner.has-media .b-imageBanner_text {
color: var(--white);
}
.b-imageBanner.has-media .b-imageBanner_media {
background-color: var(--black);
}
.has-content .b-imageBanner_eyebrow {
display: inline-block;
border-top-right-radius: calc(var(--step-0) * 2);
border-bottom-right-radius: calc(var(--step-0) * 2);
padding:
calc(var(--step-0) / 3)
var(--step-0)
calc(var(--step-0) / 3)
calc(var(--step-0) / 1.5)
;
background-color: var(--black);
}
@media (max-width: 799px) {
.b-imageBanner_header-inner {
padding: calc(var(--layout-gap) / 2);
}
.b-imageBanner_text {
margin-top: var(--step-2);
}
.b-imageBanner_figure {
--parallax: 10%;
opacity: 0.4;
}
}
@media (min-width: 800px) {
.b-imageBanner {
/* CMS styles§ */
}
.b-imageBanner_header-inner {
/* min-height: calc(
90vh - (var(--spacing-y-lg) * 2)
); */
}
.b-imageBanner_title {
margin-block-end: var(--step-2);
}
.b-imageBanner_figure {
--parallax: 20%;
}
.has-content .b-imageBanner_media {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.has-content .b-imageBanner_figure {
opacity: calc(var(--progress) * 1.15);
}
.b-imageBanner:not(.has-content) .b-imageBanner {
/* &_media {
height: 85vh;
} */
}
.b-imageBanner.-unique .b-imageBanner_header-inner {
padding: calc(var(--layout-gap) / 2);
}
.b-imageBanner.-unique .b-imageBanner_content {
margin-block-start: calc(
var(--spacing-y) * 3
);
}
.b-imageBanner.-unique .b-imageBanner_buttons {
max-width: 50%;
}
.b-imageBanner.-left .b-imageBanner_header-inner {
padding: calc(var(--layout-gap) / 2);
}
.b-imageBanner.-right .b-imageBanner_header-inner {
margin-inline-start: auto;
padding: calc(var(--layout-gap) / 2) 0;
width: 50%;
}
}
/* ========================================================================== */
/* Template Parts / Blocks / Block Slideshow (ACF) */
/* ========================================================================== */
[role="tooltip"] {
visibility: hidden;
position: absolute;
top: 2rem;
left: 2rem;
background: black;
color: var(--white);
padding: 0.5rem;
border-radius: 0.25rem;
/* Give some time before hiding so mouse can exit the input
and enter the tooltip */
transition: visibility 0.5s;
}
[aria-describedby]:hover,
[aria-describedby]:focus {
position: relative;
}
[aria-describedby]:hover + [role="tooltip"],
[aria-describedby]:focus + [role="tooltip"],
[role="tooltip"]:hover,
[role="tooltip"]:focus {
visibility: visible;
}
.b-slideshow {
/* Default styles */
/* Button */
/* Slideshow / Images */
/* CMS styles */
/* Layout */
}
.b-slideshow_inner {
position: relative;
z-index: 2;
}
.b-slideshow_main {
position: relative;
}
.b-slideshow_content {
display: flex;
flex-direction: column;
}
.b-slideshow_title {
margin-inline-start: auto;
margin-inline-end: auto;
max-width: 21ch;
}
.b-slideshow_text {
margin-block-start: var(--step-2);
margin-block-end: var(--step-3);
}
.b-slideshow_text > * {
margin-inline-start: auto;
margin-inline-end: auto;
}
.b-slideshow_buttons {
margin-block-end: var(--step-3);
}
.b-slideshow_media-list {
height: 100%;
overflow: clip;
border-radius: var(--step-1);
}
.b-slideshow_media-figure {
height: 100%;
}
.b-slideshow_media-buttons {
position: absolute;
right: var(--layout-gap);
top: var(--layout-gap);
display: flex;
gap: calc(var(--layout-gap) / 2);
z-index: 4;
}
.b-slideshow_media-button {
position: relative;
display: grid;
place-items: center;
border-radius: 50%;
isolation: isolate;
z-index: 2;
}
.b-slideshow_media-button::before, .b-slideshow_media-button::after {
content: "";
position: absolute;
inset: 0;
border-radius: 100%;
border: solid 2px var(--barley-white-dark);
transition:
transform var(--speed) var(--power2-out)
;
}
.b-slideshow_media-button::before {
transform: scale(1);
background: var(--barley-white);
z-index: 2;
}
.b-slideshow_media-button::after {
transform: scale(0);
background: var(--barley-white-dark);
z-index: 4;
}
.b-slideshow_media-button-icon {
fill: var(--rustic-red);
z-index: 6;
}
@media (hover: hover) {
.b-slideshow_media-button:hover::before {
transform: scale(0.85);
}
.b-slideshow_media-button:hover::after {
transform: scale(1);
}
}
.b-slideshow_media-item {
width: 100%;
height: 100%;
opacity: 0;
transform: scale(1.05);
transition:
opacity var(--speed) var(--easing),
transform 1s var(--easing)
;
}
.b-slideshow_media-item.is-active {
opacity: 1;
transform: scale(1);
}
.b-slideshow_thumbnails {
margin-block-start: auto;
gap: calc(var(--layout-gap) / 2);
}
.b-slideshow_thumbnails-item {
border-width: 2px;
border-style: solid;
border-color: transparent;
border-radius: 50%;
flex-basis: var(--step-5);
transition:
border-color var(--speed) var(--easing),
opacity var(--speed) var(--easing),
filter var(--speed) var(--easing)
;
}
.b-slideshow_thumbnails-item:not(.is-active) {
filter: grayscale(0.75);
}
.b-slideshow_thumbnails-item.is-active {
border-color: var(--bee-yellow);
}
.b-slideshow_thumbnails-figure {
width: 100%;
height: 100%;
}
.b-slideshow_thumbnails-img {
padding: calc(var(--step-0) / 2.5);
border-radius: 50%;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.b-slideshow.-black .b-slideshow_thumbnails-item.is-active {
border-color: var(--white);
}
@media (max-width: 799px) {
.b-slideshow {
/* Redo layout */
}
.b-slideshow_main > * {
flex-basis: 100%;
}
.b-slideshow_media-figure::before {
padding-bottom: 75%;
}
.b-slideshow_media-button {
width: calc(var(--step-0) * 3.25);
height: calc(var(--step-0) * 3.25);
}
.b-slideshow_media {
order: 0;
}
.b-slideshow_content {
order: 2;
padding: var(--step-0) 0;
}
.b-slideshow_thumbnails {
flex-wrap: nowrap;
overflow-x: auto;
overflow-y: hidden;
height: auto;
order: 0;
margin-block-end: var(--step-0);
padding-block: var(--step-0);
}
.b-slideshow_thumbnails-item {
flex: 0 0 auto;
width: clamp(3.5rem, 20%, 5rem);
}
.b-slideshow_header, .b-slideshow_text {
padding: 0 calc(var(--layout-gap) / 2);
}
.b-slideshow_header, .b-slideshow_text, .b-slideshow_buttons {
order: 2;
}
}
@media (min-width: 800px) {
.b-slideshow {
/* CMS Styles */
}
.b-slideshow_main > * {
flex-basis: 50%;
}
.b-slideshow_media-button {
width: calc(var(--step-0) * 3.75);
height: calc(var(--step-0) * 3.75);
}
.b-slideshow_content {
padding: var(--step-0);
}
.b-slideshow_buttons {
margin-inline-start: auto;
margin-inline-end: auto;
max-width: 800px;
gap: calc(var(--layout-gap) / 2);
justify-content: center;
/* > * {
flex-basis: 47%;
min-width: 450px;
} */
}
.b-slideshow_thumbnails {
justify-content: center;
}
.b-slideshow.-right .b-slideshow_content {
order: 2;
}
}
@media (min-width: 800px) and (max-width: 999px) {
.b-slideshow_media-figure::before {
padding-bottom: 133.3333%;
}
}
@media (min-width: 1000px) {
.b-slideshow_media-figure::before {
padding-bottom: 100%;
}
}
/* ========================================================================== */
/* Template Parts / Blocks / Block Stack (ACF) */
/* ========================================================================== */
.b-stack {
/* Default styles */
/* Image */
/* Button */
/* CMS styles */
/* Layout styles */
}
.b-stack_content {
display: flex;
flex-direction: column;
}
.b-stack_header {
margin-block-end: auto;
}
.b-stack_title {
max-width: 20ch;
}
.b-stack_text {
margin-block-start: var(--step-2);
}
.b-stack_figure {
border-radius: var(--step-1);
max-height: 90vh;
}
.b-stack_buttons {
margin-block-start: var(--step-2);
}
.b-stack.-left .b-stack_buttons, .b-stack.-right .b-stack_buttons {
align-items: flex-start;
}
.b-stack.-left-center .b-stack_content, .b-stack.-right-center .b-stack_content {
text-align: center;
}
.b-stack.-left-center .b-stack_title, .b-stack.-right-center .b-stack_title {
margin-inline-start: auto;
margin-inline-end: auto;
}
.b-stack.-left-center .b-stack_text > *, .b-stack.-right-center .b-stack_text > * {
margin-inline-start: auto;
margin-inline-end: auto;
}
.b-stack.-left-center .b-stack_text ul, .b-stack.-right-center .b-stack_text ul {
list-style-position: inside;
}
.b-stack.-left-center .b-stack_buttons, .b-stack.-right-center .b-stack_buttons {
align-items: center;
}
@media (max-width: 799px) {
.b-stack_content, .b-stack_media {
flex-basis: 100%;
}
.b-stack_media {
order: 0;
margin-block-end: var(--step-3);
}
.b-stack_figure::before {
padding-bottom: 75%;
}
.b-stack_content {
order: 2;
padding-block-end: calc(var(--layout-gap) / 2);
}
}
@media (min-width: 800px) {
.b-stack {
/* CMS Styles */
}
.b-stack_content, .b-stack_media {
flex-basis: 50%;
}
.b-stack_content {
padding-block-start: var(--step-0);
padding-block-end: var(--step-0);
}
.b-stack_figure {
position: sticky;
top: 5vh;
}
.b-stack.-left .b-stack_content {
padding-inline-end: var(--step-2);
}
.b-stack.-left-center .b-stack_content {
padding-inline-start: var(--step-2);
padding-inline-end: var(--step-2);
}
.b-stack.-right .b-stack_content, .b-stack.-right-center .b-stack_content {
order: 2;
padding-inline-start: var(--layout-gap);
}
.b-stack.-right .b-stack_media, .b-stack.-right-center .b-stack_media {
order: 0;
}
.b-stack.-right .b-stack_media::before, .b-stack.-right-center .b-stack_media::before {
left: 0;
}
}
@media (min-width: 800px) and (max-width: 999px) {
.b-stack_figure::before {
padding-bottom: 133.3333%;
}
}
@media (min-width: 1000px) {
.b-stack.-left .b-stack_content > *, .b-stack.-right .b-stack_content > * {
margin-inline-start: calc(
var(--layout-column-width) - (var(--layout-gap) / 2)
);
}
.b-stack_figure::before {
padding-bottom: 100%;
}
}
/* ========================================================================== */
/* Template Parts / Blocks / Block Sticky Feature (ACF) */
/* ========================================================================== */
.b-stickyFeature {
/* --panel-margin: calc(var(--spacing-y-lg) * 1.5); */
--panel-margin: var(--layout-gap);
/* Default styles */
/* CMS styles */
/* Layout styles */
}
.b-stickyFeature_inner {
position: relative;
}
.b-stickyFeature_header {
margin-block-end: var(--spacing-y);
}
.b-stickyFeature_canvas {
position: sticky;
top: 5vh;
width: 100%;
overflow: hidden;
}
.b-stickyFeature_image, .b-stickyFeature_figure {
width: 100%;
height: 100%;
}
.b-stickyFeature_figure {
border-radius: var(--step-1);
max-height: 90vh;
}
.b-stickyFeature_panel {
position: relative;
/* &-number {
margin-block-end: var(--step-3);
font-family: var(--font-family-heading);
font-size: var(--step-2);
line-height: 0.8;
color: var(--snow);
} */
}
.b-stickyFeature_panel-title {
margin-block-end: var(--step-2);
max-width: 25ch;
}
.b-stickyFeature_panel-buttons {
margin-block-start: var(--step-3);
}
@media (max-width: 799px) {
.b-stickyFeature_scroller, .b-stickyFeature_canvas {
display: none;
visibility: hidden;
}
.b-stickyFeature_header {
justify-items: center;
}
.b-stickyFeature_content {
grid-row: 1;
grid-column: 1 / -1;
}
.b-stickyFeature_panel-header {
padding-block-start: var(--spacing-y);
padding-inline-start: var(--layout-margin);
padding-inline-end: var(--layout-margin);
}
.b-stickyFeature_panel:not(:last-child) .b-stickyFeature_panel-header {
padding-block-end: var(--spacing-y);
}
}
@media (min-width: 800px) {
.b-stickyFeature {
/* &_timeline {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: calc(100% - var(--last-panel-height));
pointer-events: none;
overflow: hidden;
&::before, &::after {
content: '';
position: absolute;
top: 0;
left: calc((50% + (var(--layout-gap) / 2)) - 1px);
width: 2px;
z-index: 4;
}
&::before {
height: 100%;
}
&::after {
height: calc(100% * var(--timeline-progress));
}
} */
/* CMS styles */
}
.b-stickyFeature_content,
.b-stickyFeature_canvas {
flex-basis: 50%;
}
.b-stickyFeature_image {
opacity: 0;
transition:
opacity var(--speed) var(--easing)
;
}
.b-stickyFeature_image.is-before {
opacity: 1;
transition:
opacity var(--speed) var(--easing)
;
}
.b-stickyFeature_image.is-active {
opacity: 1;
}
.b-stickyFeature_panel {
margin-inline-start: var(--layout-gap);
border-radius: var(--step-1);
padding: calc(
var(--layout-column-width) - (var(--layout-gap) / 2)
);
border-style: solid;
border-width: 2px;
/* &::before {
content: '';
position: absolute;
top: calc((var(--step-3) / 12) * -1);
left: calc(((var(--step-3) / 2) + (var(--layout-gap) / 2)) * -1);
border-radius: 50%;
width: var(--step-3);
height: var(--step-3);
transform: scale(0);
transition:
transform var(--speed) var(--easing),
background-color var(--speed) var(--easing)
;
z-index: 6;
} */
}
.b-stickyFeature_panel:first-child {
border-color: var(--rustic-red-dark);
color: var(--barley-white);
background-color: var(--rustic-red);
}
.b-stickyFeature_panel:not(:first-child) {
border-color: var(--barley-white-dark);
background-color: var(--barley-white);
}
.b-stickyFeature_panel:not(:last-child) {
margin-block-end: var(--panel-margin);
}
.b-stickyFeature_panel-header {
/* aspect-ratio: 1/1; */
}
.b-stickyFeature_panel-image {
display: none;
visibility: hidden;
}
.b-stickyFeature_panel.is-inview::before {
transform: none;
}
.b-stickyFeature.-white .b-stickyFeature_timeline::before, .b-stickyFeature.-none .b-stickyFeature_timeline::before {
background-color: var(--bee-yellow-light);
}
.b-stickyFeature.-white .b-stickyFeature_timeline::after, .b-stickyFeature.-none .b-stickyFeature_timeline::after {
background-color: var(--cornell-red);
}
.b-stickyFeature.-white .b-stickyFeature_panel::before, .b-stickyFeature.-none .b-stickyFeature_panel::before {
background-color: var(--bee-yellow-light);
}
.b-stickyFeature.-white .b-stickyFeature_panel.is-active::before, .b-stickyFeature.-white .b-stickyFeature_panel.is-before::before, .b-stickyFeature.-none .b-stickyFeature_panel.is-active::before, .b-stickyFeature.-none .b-stickyFeature_panel.is-before::before {
background-color: var(--cornell-red);
}
}
@media (min-width: 800px) and (max-width: 999px) {
.b-stickyFeature_figure::before {
padding-bottom: 133.3333%;
}
}
@media (min-width: 1000px) {
.b-stickyFeature {
/* &_content {
> * {
margin-inline-start: var(--layout-column-width);
}
} */
}
.b-stickyFeature_figure::before {
padding-bottom: 75%;
}
}
/* @import "../../template-parts/blocks/_block-testimonial"; */
/* ========================================================================== */
/* Views / Content / Blocks / Block Accordion (ACF) */
/* ========================================================================== */
summary::marker { display: none; }
summary::-webkit-details-marker { display: none; }
.c-accordion_item {
height: var(--details-collapsed);
transition:
height var(--speed) var(--easing)
;
}
.c-accordion_item-summary {
display: flex;
align-items: center;
outline: none;
margin-block-end: 0;
padding: var(--accordion-spacing) 0;
width: 100%;
cursor: pointer;
}
.c-accordion_item-toggle {
margin-inline-start: var(--layout-gap);
}
.c-accordion_item-icon {
transform-origin: center center;
transition:
transform var(--speed) var(--easing)
;
}
.c-accordion_item-icon.is-open {
display: none;
}
.c-accordion_item-icon.-is-closed {
display: block;
}
.c-accordion_item-main {
padding-block-start: var(--step-1);
}
.c-accordion_item[open] {
height: var(--details-expanded);
}
.c-accordion_item[open] .c-accordion_item {
height: var(--details-expanded);
}
.c-accordion_item[open] .c-accordion_item-icon.is-open {
display: block;
}
.c-accordion_item[open] .c-accordion_item-icon.is-closed {
display: none;
}
.b-accordion {
--accordion-spacing: var(--step-2);
/* Default styles */
/* reset z-index */
isolation: isolate;
/* Content */
/* Items */
/* CMS styles */
/* Layout styles */
}
.b-accordion_inner {
position: relative;
z-index: 2;
}
.b-accordion_header-inner {
padding-block-start: calc(var(--layout-gap) / 2);
padding-inline-start: calc(var(--layout-gap) / 2);
padding-inline-end: calc(var(--layout-gap) / 2);
}
.b-accordion_text {
margin-block-start: var(--step-2);
}
.b-accordion_buttons {
margin-block-start: var(--step-3);
}
.b-accordion_list > * + * {
border-top: solid 1px var(--grey);
}
.b-accordion_item {
padding:
0
var(--step-0)
;
/* &-number {
flex-shrink: 0;
align-self: flex-start;
margin-inline-end: 1ch;
font-size: var(--step-0);
} */
}
.b-accordion_item-summary {
display: flex;
align-items: center;
outline: none;
margin-block-end: 0;
padding:
var(--accordion-spacing)
0
;
width: 100%;
cursor: pointer;
}
@media (hover: hover) {
.b-accordion_item-summary:focus-visible .b-accordion_item-toggle {
outline: dashed 2px var(--swf-green);
outline-offset: 2px;
}
}
.b-accordion_item-label {
margin-inline-end: var(--accordion-spacing);
text-align: left;
font-family: var(--font-family-heading);
}
.b-accordion_item-toggle {
position: relative;
flex-shrink: 0;
margin-inline-start: auto;
border-radius: 50%;
border: solid 1px var(--grey);
/* background-color: var(--swf-green); */
transition:
background-color var(--speed) var(--easing)
;
isolation: isolate;
}
.b-accordion_item-toggle::before {
content: "";
position: absolute;
inset: 0;
border-radius: 100%;
transform: scale(0);
background: var(--swf-green);
transition:
transform var(--speed) var(--power2-out)
;
z-index: 2;
}
.b-accordion_item-icon {
z-index: 2;
}
.b-accordion_item-content {
padding-block-end: calc(var(--accordion-spacing) * 1.5);
}
.b-accordion_item-content > * {
max-width: 80ch;
}
.b-accordion_item[open] .b-accordion_item-toggle::before {
transform: scale(1);
}
.b-accordion_item[open] .b-accordion_item-icon {
fill: var(--white);
}
.b-accordion.-black .b-accordion_item-icon {
fill: var(--black);
}
@media (max-width: 799px) {
.b-accordion_header, .b-accordion_list {
grid-column: 1 / -1;
}
.b-accordion_header {
margin-block-end: var(--spacing-y-lg);
}
.b-accordion_item-summary {
font-size: var(--step-1);
}
.b-accordion_item-toggle {
width: calc(var(--step-0) * 2.75);
height: calc(var(--step-0) * 2.75);
}
}
@media (min-width: 800px) {
.b-accordion_header {
grid-column: 1 / span 6;
border-right: solid 1px var(--grey);
padding-inline-end: calc(var(--layout-gap) * 2);
transition:
transform var(--speed) var(--easing)
;
}
.b-accordion_header-inner {
position: sticky;
top: calc(var(--header-height) + var(--step-2));
}
.b-accordion_list {
grid-column: 7 / span 6;
}
.b-accordion_item-summary {
font-size: var(--step-1);
}
.b-accordion_item-toggle {
width: calc(var(--step-0) * 3.75);
height: calc(var(--step-0) * 3.75);
}
}
/* @import "../../template-parts/blocks/_block-callout"; */
/* Card */
/* ========================================================================== */
/* Template Parts / Card / Card default */
/* ========================================================================== */
/* .b-grid_links {
flex: 2;
} */
.t-card-default {
/* Default styles */
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
/* CMS styles */
/* Specific styles */
/* Layout styles */
}
.t-card-default_media {
width: 100%;
}
.t-card-default_main, .t-card-default_buttons {
text-align: center;
}
.t-card-default_main {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
margin-block-start: calc(var(--spacing-y-lg) * -1);
border-radius: var(--step-1);
z-index: 2;
}
.t-card-default_title {
max-width: 16ch;
}
.t-card-default_links {
width: 100%;
}
.t-card-default_text {
margin-block-start: var(--step-2);
}
.t-card-default_text > * {
margin-inline-start: auto;
margin-inline-end: auto;
}
.t-card-default_button {
margin-block-start: var(--step-2);
}
.t-card-default_main.-none, .t-card-default_main.-white {
border: solid 2px var(--barley-white-dark);
background-color: var(--barley-white);
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.t-card-default_main.-rustic {
border: solid 2px var(--rustic-red-dark);
background-color: var(--rustic-red-light);
box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 24px;
}
.t-card-default_media {
border-radius: var(--step-1);
}
.t-card-default_media.-landscape .t-card-default_figure::before {
padding-bottom: 75%;
}
.t-card-default_media.-portrait .t-card-default_figure::before {
padding-bottom: 133.3333%;
}
.t-card-default_media.-square .t-card-default_figure::before {
padding-bottom: 100%;
}
@media (max-width: 799px) {
.t-card-default_main {
padding: var(--step-2) 0 var(--step-3);
}
.t-card-default_text {
padding-inline-start: calc(var(--layout-gap) / 2);
padding-inline-end: calc(var(--layout-gap) / 2);
}
}
@media (min-width: 800px) {
.t-card-default_main {
padding: var(--step-3) var(--step-2) var(--step-2);
width: calc(
100% - (var(--step-1) * 2)
);
}
.t-card-default.-col-1 .t-card-default_button, .t-card-default.-col-2 .t-card-default_button, .t-card-default.-col-3 .t-card-default_button {
min-width:
calc(
(var(--layout-column-width) * 2) +
(var(--layout-gap) * 1)
)
;
}
}
/* Blog */
/* @import "../../template-parts/blog/_blog-category";
@import "../../template-parts/blog/_blog-excerpt";
@import "../../template-parts/blog/_blog-show";
@import_ "../../template-parts/blog/_blog-navigation"; */
/* Content */
/* ========================================================================== */
/* Template Parts / Content / Simple */
/* ========================================================================== */
.t-content-simple {
/* Default styles */
padding-block-start: var(--header-height);
background-color: var(--rustic-red);
}
.t-content-simple_header {
color: var(--bee-yellow);
}
.t-content-simple_title {
text-align: center;
}
.t-content-simple_main {
background-color: var(--barley-white);
}
.t-content-simple_main-inner {
margin: 0 auto;
max-width: 75ch;
}
/* @import "../../template-parts/content/_content-contact"; */
/* @import "../../template-parts/content/_content-success"; */
/* @import "../../template-parts/content/_content-error"; */
/* @import "../../template-parts/content/_content-none"; */
/* @import "../../template-parts/content/_content-search"; */
/* Footer */
/* ========================================================================== */
/* Template Parts / Footer / Footer */
/* ========================================================================== */
.t-footer {
position: relative;
width: 100%;
padding-block-start: var(--spacing-y-lg);
padding-block-end: var(--step-2);
color: var(--white);
background: var(--rustic-red);
background: linear-gradient(0deg,rgba(61, 5, 0, 1) 0%, rgba(77, 7, 0, 1) 100%);
z-index: 200;
/* Layout styles */
}
.t-footer_middle {
margin-block-start: var(--spacing-y);
}
.t-footer_middle .t-footer_title {
grid-column: 1 / -1;
}
.t-footer_title {
margin-block-end: var(--step-2);
color: var(--bee-yellow);
}
.t-footer_sub {
margin-block-end:
calc(
var(--step-0) / 2
)
;
}
.t-footer_contact > * + * {
margin-block-start: var(--step-1);
}
.t-footer_copy {
max-width: 65ch;
}
.t-footer_wfuk {
display: inline-block;
width: 100%;
max-width: calc(
var(--step-0) * 7
);
opacity: 0.75;
}
@media (max-width: 799px) {
.t-footer_top .t-footer_inner > * + * {
margin-block-start: var(--spacing-y);
}
.t-footer_bottom .t-footer_inner > * + * {
margin-block-start: var(--step-1);
}
.t-footer_bottom .t-footer_col {
text-align: center;
}
.t-footer_bottom {
margin-block-start: var(--spacing-y);
}
}
@media (min-width: 800px) {
.t-footer_middle {
margin-inline-start:
calc(
(var(--layout-column-width) + var(--layout-gap)) * 3
)
;
}
.t-footer_bottom .t-footer_col.-first {
grid-column: span 2;
padding-inline-end: var(--step-1);
}
.t-footer_bottom .t-footer_col.-end {
display: flex;
justify-content: flex-end;
align-items: flex-end;
}
.t-footer_bottom {
margin-block-start:
calc(
var(--spacing-y) * 2
)
;
}
}
/*=====================================
Comment Template CSS
========================================*/
/* // .comment-list > li {
// margin-bottom: 45px;
// }
// .comment-list .comment-body {
// padding: 30px;
// background-color: #f6f6f6;
// }
// .comment-list .comment-meta {
// display: flex;
// justify-content: space-between;
// align-items: center;
// }
// .comment-list .comment-meta img {
// border-radius: 50%;
// margin-right: 15px;
// width: 45px;
// height: 45px;
// }
// .comment-list .comment-meta .fn a {
// letter-spacing: 0.5px
// }
// .comment-list .comment-meta .says,
// .comment-list .edit-link {
// @include u-accessibly-hidden;
// }
// .comment-list .comment-content,
// .comment-list .reply {
// margin-top: 15px;
// margin-left: calc(45px + 15px);
// }
// .comment-list .comment-content {
// max-width: 70ch;
// }
// .comment-list .comment-content > * + * {
// margin-top: 1.5rem;
// }
// .comment-list .children {
// margin-left: 30px;
// }
// .comment-list .children > * {
// margin-top: 15px;
// } */