/*--------------------------------------------------------------
modern-normalize v3.0.1
--------------------------------------------------------------*/
*,::after,::before{box-sizing:border-box}html{font-family:system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji';line-height:1.15;-webkit-text-size-adjust:100%;tab-size:4}body{margin:0}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-color:currentcolor}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}
/*--------------------------------------------------------------
Variables
--------------------------------------------------------------*/
:root {
--header-height: 112px;
--admin-bar-height: 32px;
--announcement-bar-height: 0px;
/* Typography */
--font-primary: soleil, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
--font-secondary: futura-pt, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
--8px: 0.5rem;
--9px: 0.5625rem;
--10px: 0.625rem;
--11px: 0.6875rem;
--12px: 0.75rem;
--13px: 0.8125rem;
--14px: 0.875rem;
--15px: 0.9375rem;
--16px: 1rem;
--17px: 1.0625rem;
--18px: 1.125rem;
--20px: 1.25rem;
--22px: 1.375rem;
--24px: 1.5rem;
--25px: 1.5625rem;
--26px: 1.625rem;
--28px: 1.75rem;
--30px: 1.875rem;
--32px: 2rem;
--34px: 2.125rem;
--36px: 2.25rem;
--38px: 2.375rem;
--40px: 2.5rem;
--42px: 2.625rem;
--44px: 2.75rem;
--45px: 2.8125rem;
--46px: 2.875rem;
--48px: 3rem;
--50px: 3.125rem;
--54px: 3.375rem;
--55px: 3.4375rem;
--60px: 3.75rem;
--64px: 4rem;
--70px: 4.375rem;
--75px: 4.6875rem;
--84px: 5.25rem;
--85px: 5.3125rem;
--90px: 5.625rem;
--100px: 6.25rem;
--170px: 10.625rem;
--228px: 14.25rem;
}
@media (max-width: 992px) {
:root {
--header-height: 72px;
}
}
@media (max-width: 782px) {
:root {
--admin-bar-height: 46px;
}
}
/*--------------------------------------------------------------
Base
--------------------------------------------------------------*/
html {
margin: 0 !important;
overscroll-behavior: none;
}
@media (max-width: 992px) {
html {
overscroll-behavior: auto;
}
}
body {
background-color: var(--white);
color: var(--black);
font-family: var(--font-primary);
font-size: var(--18px);
line-height: 1.5;
}
::selection {
background-color: var(--green);
color: var(--white);
}
hr {
background-color: var(--grey);
border: 0;
height: 1px;
margin: 40px 0;
}
dt {
font-weight: bold;
}
dd {
margin: 0 24px 32px;
}
table {
margin: 0 0 32px;
width: 100%;
}
p {
margin: 0 0 16px;
}
pre {
background-color: var(--grey);
color: var(--black);
font-size: var(--14px);
line-height: 1.5;
margin-bottom: 32px;
max-width: 100%;
overflow: auto;
padding: 24px;
}
code,
kbd {
background-color: var(--grey);
font-size: var(--14px);
padding: 2px 6px;
}
pre code {
padding: 0;
}
fieldset {
padding: 0;
border: none;
margin: 0 0 24px;
width: 100%;
}
figure {
margin: 0 0 24px;
}
.transition {
transition: all 0.3s ease;
}
a, input, button, textarea {
transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
transition-delay: 0s !important;
scroll-behavior: auto !important;
}
}
* {
scrollbar-width: thin;
scrollbar-color: var(--black) transparent;
}
.block-theme img,
.block-theme svg,
.block-theme video {
display: block;
width: 100%;
height: auto;
}
.block-video video {
background-image: url('../images/video-loader-black.gif');
background-repeat: no-repeat;
background-size: 60px;
background-position: center;
}
.block-video .block-setting-theme-dark video {
background-image: url('../images/video-loader-white.gif');
}
/*--------------------------------------------------------------
Typography/Content
--------------------------------------------------------------*/
/* Default */
.block-theme h1,
.block-theme .h1,
.block-theme h2,
.block-theme .h2,
.block-theme h3,
.block-theme .h3,
.block-theme h4,
.block-theme .h4,
.block-theme h5,
.block-theme .h5,
.block-theme h6,
.block-theme .h6 {
font-weight: 700;
color: var(--green);
line-height: 1.1;
margin: 0 0 16px;
}
.block-theme h1,
.block-theme .h1 {
font-size: var(--50px);
}
.block-theme h2,
.block-theme .h2 {
font-size: var(--38px);
}
.block-theme h3,
.block-theme .h3 {
font-family: var(--font-secondary);
font-weight: 500;
font-size: var(--28px);
line-height: 1.2;
color: var(--green-dark);
}
.block-theme h4,
.block-theme .h4 {
font-family: var(--font-secondary);
font-size: var(--20px);
line-height: 1.4;
color: var(--black);
}
.block-theme h5,
.block-theme .h5 {
font-size: var(--18px);
line-height: 1.3;
color: var(--black);
}
.block-theme h6,
.block-theme .h6 {
font-size: var(--16px);
color: var(--black);
}
@media (max-width: 768px) {
.block-theme h1,
.block-theme .h1 {
font-size: var(--36px);
}
.block-theme h2,
.block-theme .h2 {
font-size: var(--28px);
}
.block-theme h3,
.block-theme .h3 {
font-size: var(--24px);
}
.block-theme h4,
.block-theme .h4 {
font-size: var(--20px);
}
}
.block-theme p {
font-weight: 400;
color: var(--black);
line-height: 1.5;
margin: 0 0 16px;
}
/* Long words wrap instead of overflowing */
.block-theme h1,
.block-theme h2,
.block-theme h3,
.block-theme h4,
.block-theme h5,
.block-theme h6,
.block-theme p,
.block-theme li {
overflow-wrap: break-word;
}
/* Styled */
.block-theme .typo-copy-large,
.block-theme .typo-copy-large p {
font-size: var(--20px);
line-height: 1.5;
}
@media (max-width: 768px) {
.block-theme .typo-copy-large,
.block-theme .typo-copy-large p {
font-size: var(--18px);
}
}
.block-theme .typo-tagline {
display: block;
font-family: var(--font-secondary);
font-size: var(--16px);
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
line-height: 1.2;
color: var(--green);
margin: 0 0 16px;
}
.block-theme .typo-highlight {
display: inline;
background-color: var(--green);
color: var(--white) !important;
padding: 2px 10px 6px;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
line-height: 1.5;
}
/* List */
.block-theme ul,
.block-theme ol,
.block-theme li {
list-style: none;
margin: 0;
padding: 0;
}
/* Blockquote */
.block-theme blockquote {
margin: 40px 0;
padding: 0;
border: none;
}
.block-theme blockquote:before {
content: '\201C';
display: block;
font-size: var(--100px);
font-weight: 700;
line-height: 0.6;
color: var(--green-dark);
margin: 0 0 24px;
}
.block-theme blockquote p {
font-size: var(--18px);
font-weight: 300;
margin: 0;
line-height: 1.5 !important;
color: var(--black);
}
.block-theme blockquote cite {
font-size: var(--16px);
font-weight: 700;
font-style: normal;
color: var(--green-dark);
margin: 24px 0 0;
display: block;
}
@media (max-width: 768px) {
.block-theme blockquote {
margin: 32px 0;
}
.block-theme blockquote:before {
font-size: var(--70px);
}
}
/*--------------------------------------------------------------
Links/Buttons
--------------------------------------------------------------*/
/* Links */
.block-theme a {
color: var(--black);
text-decoration: none;
cursor: pointer;
}
.block-theme a:hover {
color: var(--green-light);
}
.block-theme p a,
.block-theme li a {
font-weight: 700;
text-decoration: underline;
text-decoration-thickness: 2px;
text-underline-offset: 4px;
transition: color 0.3s ease, text-decoration-color 0.3s ease;
}
.block-theme .block-setting-theme-dark p a,
.block-theme .block-setting-theme-dark li a {
text-decoration-color: var(--green-light);
}
.block-theme p a:hover,
.block-theme li a:hover {
color: var(--green-light);
}
.block-theme .block-setting-theme-dark p a:hover,
.block-theme .block-setting-theme-dark li a:hover {
color: var(--green-light) !important;
}
.block-theme .block-setting-theme-dark .ignore-text-white p a:hover,
.block-theme .block-setting-theme-dark .ignore-text-white li a:hover {
color: var(--green-light) !important;
}
.block-theme .arrow-link {
display: inline-flex;
align-items: center;
justify-content: center;
white-space: nowrap;
gap: 6px;
color: var(--black);
font-size: var(--14px);
font-weight: 600;
text-transform: uppercase;
}
.block-theme .arrow-link svg {
width: 10px;
height: auto;
flex-shrink: 0;
transition: transform 0.3s ease;
}
.block-theme .arrow-link:hover svg {
transform: translateX(-3px);
}
/* Buttons */
.block-theme .button-group {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 12px;
margin-top: 32px;
}
.block-buttons .button-group {
margin: 0;
}
.block-theme .button-group.button-group-align-start { justify-content: flex-start; }
.block-theme .button-group.button-group-align-center { justify-content: center; }
.block-theme .button-group.button-group-align-end { justify-content: flex-end; }
@media (max-width: 460px) {
.block-theme .button-group {
gap: 8px;
}
.block-theme .button-group .button,
.block-theme .button-group button {
flex: 100%;
}
}
.block-theme .button,
.block-theme button,
.block-theme input[type="button"],
.block-theme input[type="reset"],
.block-theme input[type="submit"] {
display: inline-block;
position: relative;
padding: 18px 20px;
min-width: 136px;
font-family: var(--font-primary);
font-size: var(--14px);
font-weight: 400;
background-color: var(--green);
border: 2px solid var(--green);
border-radius: 0px !important;
color: var(--white);
text-transform: none;
text-decoration: none;
height: auto;
line-height: 20px;
text-align: center;
cursor: pointer;
}
.block-theme .button:hover,
.block-theme button:hover,
.block-theme input[type="button"]:hover,
.block-theme input[type="reset"]:hover,
.block-theme input[type="submit"]:hover {
background-color: var(--green-light);
border-color: var(--green-light);
color: var(--green);
}
.block-theme .button:focus-visible,
.block-theme button:focus-visible,
.block-theme input[type="button"]:focus-visible,
.block-theme input[type="reset"]:focus-visible,
.block-theme input[type="submit"]:focus-visible {
outline: 2px solid var(--green-light);
outline-offset: 3px;
}
.block-theme .btn-loader {
display: none;
position: absolute;
left: calc(50% - 8px);
top: calc(50% - 8px);
}
.block-theme .button.disabled,
.block-theme button.disabled {
opacity: 0.5;
pointer-events: none;
}
/* Coloured Buttons */
.block-theme .button.green,
.block-theme button.green {
background-color: var(--green);
border-color: var(--green);
color: var(--white);
}
.block-theme .button.green:hover,
.block-theme button.green:hover {
background-color: var(--green-light);
border-color: var(--green-light);
color: var(--green);
}
.block-theme .button.white,
.block-theme button.white {
background-color: var(--white);
border-color: var(--white);
color: var(--green);
}
.block-theme .button.white:hover,
.block-theme button.white:hover {
background-color: var(--green-light);
border-color: var(--green-light);
color: var(--green);
}
/* Ghost Buttons */
.block-theme .button.ghost,
.block-theme button.ghost {
background-color: transparent;
border: 2px solid var(--green-light);
color: var(--green-dark);
}
.block-theme .button.ghost:hover,
.block-theme button.ghost:hover {
background-color: var(--green-light);
border-color: var(--green-light);
color: var(--green);
}
.block-theme .block-setting-theme-dark .button.ghost:not(.white),
.block-theme .block-setting-theme-dark button.ghost:not(.white) {
border-color: var(--white);
color: var(--white);
}
.block-theme .block-setting-theme-dark .button.ghost:not(.white):hover,
.block-theme .block-setting-theme-dark button.ghost:not(.white):hover {
background-color: var(--white);
border-color: var(--white);
color: var(--green);
}
.block-theme .button.ghost.green,
.block-theme button.ghost.green {
border-color: var(--green);
color: var(--green);
}
.block-theme .button.ghost.green:hover,
.block-theme button.ghost.green:hover {
background-color: var(--green);
border-color: var(--green);
color: var(--white);
}
.block-theme .button.ghost.white,
.block-theme button.ghost.white {
border-color: var(--white);
color: var(--white);
}
.block-theme .button.ghost.white:hover,
.block-theme button.ghost.white:hover {
background-color: var(--white);
border-color: var(--white);
color: var(--green);
}
/* Sized Buttons */
.block-theme .button.small,
.block-theme button.small {
padding: 10px 24px;
}
/* Arrow Buttons */
.block-theme .button.arrow-button,
.block-theme button.arrow-button {
display: inline-flex;
align-items: center;
justify-content: center;
white-space: nowrap;
gap: 6px;
}
.block-theme .button.arrow-button svg,
.block-theme button.arrow-button svg {
width: 12px;
height: auto;
flex-shrink: 0;
transition: transform 0.3s ease;
}
.block-theme .button.arrow-button:hover svg,
.block-theme button.arrow-button:hover svg {
transform: translateX(-3px);
}
@media (max-width: 460px) {
.block-theme .button.arrow-button,
.block-theme button.arrow-button {
white-space: normal;
}
}
/* Icon Buttons */
.block-theme .button.icon-button,
.block-theme button.icon-button {
display: inline-flex;
align-items: center;
justify-content: center;
white-space: nowrap;
gap: 6px;
}
.block-theme .button.icon-button svg,
.block-theme button.icon-button svg {
line-height: 0;
max-height: 14px;
max-width: 14px;
width: 100%;
flex-shrink: 0;
transition: transform 0.3s ease;
}
.block-theme .button.icon-button:hover svg,
.block-theme button.icon-button:focus svg {
transform: translateX(-3px);
}
.block-theme .button.icon-only-button,
.block-theme button.icon-only-button {
padding: 14px;
}
.block-theme .button.icon-only-button svg,
.block-theme button.icon-only-button svg {
max-height: 14px;
max-width: 14px;
width: 100%;
}
@media (max-width: 460px) {
.block-theme .button.icon-button,
.block-theme button.icon-button {
white-space: normal;
}
.block-theme .button.icon-only-button,
.block-theme button.icon-only-button {
flex: none;
}
}
/*--------------------------------------------------------------
Forms/Inputs
--------------------------------------------------------------*/
.block-theme form *[disabled] {
opacity: 0.5;
pointer-events: none;
}
/* Labels */
.block-theme label,
.block-theme legend {
display: block;
margin: 0 0 4px;
font-size: var(--14px);
font-weight: 500;
color: var(--black);
}
.block-theme label a,
.block-theme legend a {
text-decoration: underline;
}
.block-theme label a:hover,
.block-theme legend a:hover {
color: var(--green-light);
}
.block-theme label .required {
color: var(--red);
margin-left: 2px;
font-weight: 600;
}
/* Basic Fields */
.block-theme input:not([type='button'], [type='submit']),
.block-theme select,
.block-theme textarea {
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
outline: none;
display: inline-block;
width: 100%;
padding: 14px 16px;
background-color: var(--white);
border: 1px solid rgb(from var(--black) r g b / 0.2);
color: var(--black);
border-radius: 0;
line-height: 20px;
}
.block-theme textarea {
height: 120px;
resize: vertical;
}
.block-theme input:not([type='button'], [type='submit']):focus,
.block-theme select:focus,
.block-theme textarea:focus {
border-color: var(--green);
}
::placeholder {
color: var(--black);
opacity: 0.6;
}
/* Select */
.block-theme select {
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
background-position: right 16px center;
background-size: auto 8px;
background-color: var(--white);
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
padding: 14px 40px 14px 16px;
cursor: pointer;
}
.block-theme .select2,
.block-theme .select2 * {
margin: 0;
padding: 0;
}
.block-theme .select2-container .select2-selection {
height: auto;
display: block;
width: 100%;
margin: 0;
border: 0;
padding: 14px 20px;
background-color: var(--white);
border: 1px solid var(--black);
border-radius: 0;
color: var(--black);
line-height: 20px;
text-align: left;
text-decoration: none;
cursor: pointer;
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
background-position: right 16px center;
background-size: auto 8px;
}
.block-theme .select2-container .select2-selection,
.block-theme .select2-container .select2-selection * {
line-height: 20px;
}
.block-theme .select2-container.select2-container--open .select2-selection {
border-color: var(--black);
}
.block-theme .select2-selection__rendered,
.block-theme .select2-selection__placeholder {
color: var(--black);
}
.block-theme .select2-dropdown {
border-color: var(--black);
background-color: transparent;
padding-top: 30px;
top: -30px;
border-radius: 0;
}
.block-theme .select2-dropdown .select2-search,
.block-theme .select2-dropdown .select2-results__option {
padding: 5px;
}
.block-theme .select2-dropdown .select2-results,
.block-theme .select2-dropdown .select2-search {
background-color: var(--white);
}
.block-theme .select2-container .select2-selection .select2-selection__rendered {
line-height: 20px;
padding: 0;
}
.block-theme .select2-dropdown .select2-results__option.select2-results__option--highlighted {
background-color: var(--black);
}
.block-theme .select2-container .select2-selection__arrow {
display: none;
}
/* Checkbox & Radio */
.block-theme input[type='checkbox'],
.block-theme input[type='radio'] {
min-height: 20px;
min-width: 20px;
max-width: 20px;
max-height: 20px;
background-color: var(--white);
border: 1px solid var(--black);
padding: 0;
box-shadow: none;
margin: 0 8px 0 0;
position: relative;
display: inline-block;
cursor: pointer;
transition: none;
}
.block-theme input[type='radio'] {
border-radius: 100%;
}
.block-theme input[type='checkbox'] + label,
.block-theme input[type='radio'] + label {
margin: 0;
}
.block-theme input[type='checkbox']:checked {
border-color: var(--green);
background: var(--green) url(../images/icon-check-white.svg) 50% no-repeat;
background-size: 14px;
}
.block-theme .block-setting-theme-dark input[type='checkbox']:checked {
border-color: var(--white);
}
.block-theme input[type='radio']:checked {
border: 4px solid var(--green);
}
.block-theme input[type='radio']:before,
.block-theme input[type='checkbox']:before {
display: none;
}
/* File Upload */
.block-theme input[type='file']::file-selector-button {
border: 0;
width: auto;
padding: 10px 15px;
margin-right: 10px;
font-size: var(--16px);
font-weight: 600;
line-height: 20px;
color: var(--white);
text-align: center;
text-decoration: none;
background-color: var(--black);
border: 1px solid var(--black);
border-radius: 0;
cursor: pointer;
}
/*--------------------------------------------------------------
Gravity Forms
--------------------------------------------------------------*/
/* General */
.gform_wrapper {
--gform-theme-form-row-gap: 24px !important;
--gform-theme-form-col-gap: 24px !important;
}
.gform-theme {
--gf-form-gap-x: 24px !important;
--gf-form-gap-y: 24px !important;
--gf-label-req-gap: 4px !important;
--gf-color-primary: var(--green) !important;
--gf-color-primary-darker: var(--green-dark) !important;
}
.gform_wrapper .gform_heading,
.gform_wrapper .gform_title,
.gform_wrapper .gform_required_legend {
display: none;
}
/* Akismet honeypot */
.akismet-fields-container {
display: none !important;
}
.gform_wrapper .validation_message {
display: none !important;
}
.block-setting-theme-dark .gform-theme .gform_validation_errors {
background-color: rgba(var(--gf-color-danger-rgb), 0.3);
border-color: var(--gf-form-validation-border-color-focus);
}
.block-setting-theme-dark .gform-theme .gform_validation_errors .gform-icon {
border-color: var(--gf-form-validation-border-color-focus);
}
.gform_confirmation_wrapper .gform_confirmation_message {
font-size: var(--20px);
}
.gform-theme .gform_validation_errors .gform_submission_error {
margin: 0;
text-transform: none;
}
.gform_wrapper .gfield_list_group_item:before,
.gform_wrapper .gform-field-label {
font-size: var(--16px) !important;
font-weight: 500 !important;
}
.gform_wrapper .gform-field-label.gfield_consent_label {
font-size: var(--13px) !important;
}
/* Required mark, sub-labels, descriptions and counters sit quietly under the label */
.gform_wrapper .gfield_required {
color: var(--green-dark) !important;
font-size: var(--16px) !important;
font-style: normal !important;
font-weight: 500 !important;
padding: 0 !important;
margin-left: 4px !important;
}
.gform_wrapper .gform-field-label--type-sub {
font-size: var(--14px) !important;
font-weight: 400 !important;
color: rgb(from var(--black) r g b / 0.6) !important;
margin: 0 0 6px !important;
}
.gform_wrapper .gfield_label_before_complex {
margin-bottom: 8px !important;
}
.gform_wrapper .gfield_description {
font-size: var(--16px) !important;
line-height: 1.5 !important;
color: rgb(from var(--black) r g b / 0.7) !important;
padding: 0 !important;
margin: 8px 0 0 !important;
}
.gform_wrapper .field_description_above .gfield_description {
margin: 0 0 12px !important;
}
.gform_wrapper .ginput_counter,
.gform_wrapper .charleft {
font-size: var(--14px) !important;
color: rgb(from var(--black) r g b / 0.6) !important;
padding: 0 !important;
margin: 6px 0 0 !important;
}
.gform_wrapper .gform_body .gform_fields .gfield input[type="text"],
.gform_wrapper .gform_body .gform_fields .gfield input[type="email"],
.gform_wrapper .gform_body .gform_fields .gfield input[type="url"],
.gform_wrapper .gform_body .gform_fields .gfield input[type="password"],
.gform_wrapper .gform_body .gform_fields .gfield input[type="number"],
.gform_wrapper .gform_body .gform_fields .gfield input[type="tel"],
.gform_wrapper .gform_body .gform_fields .gfield input[type="search"],
.gform_wrapper .gform_body .gform_fields .gfield textarea,
.gform_wrapper .gform_body .gform_fields .gfield select {
background-color: var(--white) !important;
border: 1px solid rgb(from var(--black) r g b / 0.12) !important;
border-radius: 0 !important;
color: var(--black) !important;
font-size: var(--16px) !important;
line-height: 24px !important;
padding: 14px 20px !important;
transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
height: auto !important;
box-shadow: none !important;
width: 100%;
}
.gform_wrapper .gform_body .gform_fields .gfield select {
padding: 14px 40px 14px 20px !important;
}
.gform_wrapper .gform_body .gform_fields .gfield textarea.small {
height: 100px !important;
min-block-size: 100px;
}
.gform_wrapper .gform_body .gform_fields .gfield textarea.medium {
height: 140px !important;
min-block-size: 140px;
}
.gform_wrapper .gform_body .gform_fields .gfield textarea.large {
height: 200px !important;
min-block-size: 200px;
}
.gform_wrapper .gform_body .gform_fields .gfield input:focus,
.gform_wrapper .gform_body .gform_fields .gfield textarea:focus,
.gform_wrapper .gform_body .gform_fields .gfield select:focus {
border-color: var(--green) !important;
box-shadow: 0 0 0 3px rgb(from var(--green-light) r g b / 0.4) !important;
outline: none !important;
}
.gform_wrapper .gform_body .gform_fields .gfield.gfield_error input,
.gform_wrapper .gform_body .gform_fields .gfield.gfield_error textarea,
.gform_wrapper .gform_body .gform_fields .gfield.gfield_error select {
border-color: var(--red) !important;
}
.gform_wrapper .gform_body .gform_fields .gfield input::placeholder,
.gform_wrapper .gform_body .gform_fields .gfield textarea::placeholder {
color: rgb(from var(--black) r g b / 0.6) !important;
font-size: inherit !important;
opacity: 1 !important;
}
.gform_wrapper .gform_body .gform_fields .gfield select.is-placeholder {
color: rgb(from var(--black) r g b / 0.6) !important;
}
.gform_wrapper .gform_body .gform_fields .gfield input[type="checkbox"],
.gform_wrapper .gform_body .gform_fields .gfield input[type="radio"] {
min-height: 22px !important;
min-width: 22px !important;
max-width: 22px !important;
max-height: 22px !important;
border: 1px solid var(--black) !important;
background: var(--white) !important;
box-shadow: none !important;
border-radius: 0 !important;
transition: none !important;
}
.gform_wrapper .gform_body .gform_fields .gfield input[type="checkbox"]:checked,
.gform_wrapper .gform_body .gform_fields .gfield input[type="radio"]:checked {
border-color: var(--green) !important;
background: var(--green) url(../images/icon-check-white.svg) 50% no-repeat !important;
background-size: 14px !important;
}
.block-setting-theme-dark .gform_wrapper .gform_body .gform_fields .gfield input[type="checkbox"]:checked,
.block-setting-theme-dark .gform_wrapper .gform_body .gform_fields .gfield input[type="radio"]:checked {
border-color: var(--white) !important;
}
.gform_wrapper .gform_body .gform_fields .gfield.choice-horizontal .gfield_radio {
flex-direction: row;
gap: 24px;
}
.gform_wrapper .gform_body .gform_fields .gfield--type-choice .gchoice {
gap: 8px;
}
.gform_wrapper .gform_body .gform_fields .gfield .ginput_container_consent {
gap: 8px;
align-items: center;
}
.gform-theme .gfield_password_strength {
/* display: none; */
color: var(--black) !important;
font-size: var(--13px) !important;
font-weight: 400 !important;
}
.gform-theme .gform_footer {
/* justify-content: flex-end; */
}
.gform-theme .gform-page-footer {
justify-content: flex-end;
}
.gform-theme .gform-loader {
flex-shrink: 0;
}
.gform_wrapper .gform-page-footer .gform-loader {
order: -1;
}
/* AJAX spinner beside the submit button */
.gform_wrapper .gform_footer button[type="submit"] .gform-loader {
inset: 0 auto 0 100%;
margin: auto 0 auto 16px;
font-size: 2.5px;
border-color: var(--grey) var(--grey) var(--black) var(--black);
}
.block-setting-theme-dark .gform_wrapper .gform_footer button[type="submit"] .gform-loader {
border-color: rgb(from var(--white) r g b / 0.3) rgb(from var(--white) r g b / 0.3) var(--white) var(--white);
}
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_footer button[type="submit"] {
display: inline-block !important;
position: relative !important;
padding: 18px 20px !important;
min-width: 136px;
font-family: var(--font-primary) !important;
font-size: var(--14px) !important;
font-weight: 400 !important;
background-color: var(--green) !important;
border: 2px solid var(--green) !important;
box-shadow: none !important;
border-radius: 0px !important;
color: var(--white) !important;
text-transform: none !important;
height: auto !important;
line-height: 20px !important;
text-align: center !important;
cursor: pointer !important;
transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
}
.gform_wrapper .gform_footer input[type="submit"]:hover,
.gform_wrapper .gform_footer button[type="submit"]:hover {
background-color: var(--green-light) !important;
border-color: var(--green-light) !important;
color: var(--green) !important;
}
.gform_wrapper .gform_footer input[type="submit"]:focus-visible,
.gform_wrapper .gform_footer button[type="submit"]:focus-visible {
outline: 2px solid var(--green-light) !important;
outline-offset: 3px !important;
}
.block-setting-theme-dark .gform_wrapper .gform_footer input[type="submit"],
.block-setting-theme-dark .gform_wrapper .gform_footer button[type="submit"] {
background-color: var(--white) !important;
border-color: var(--white) !important;
color: var(--green) !important;
}
.block-setting-theme-dark .gform_wrapper .gform_footer input[type="submit"]:hover,
.block-setting-theme-dark .gform_wrapper .gform_footer button[type="submit"]:hover {
background-color: var(--green-light) !important;
border-color: var(--green-light) !important;
color: var(--green) !important;
}
.gform_wrapper .gform_footer input[type="submit"].arrow-button,
.gform_wrapper .gform_footer button[type="submit"].arrow-button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
white-space: nowrap !important;
gap: 6px !important;
}
.gform_wrapper .gform_footer button[type="submit"].arrow-button svg * {
all: revert-layer;
}
.gform_wrapper .gform-page-footer .button.gform-theme-button--secondary {
background-color: transparent !important;
border-color: var(--green-light) !important;
color: var(--green-dark) !important;
}
.gform_wrapper .gform-page-footer .button.gform-theme-button--secondary:hover {
background-color: var(--green-light) !important;
border-color: var(--green-light) !important;
color: var(--green) !important;
}
.block-setting-theme-dark .gform_wrapper .gform-page-footer .button.gform-theme-button--secondary {
border-color: var(--white) !important;
color: var(--white) !important;
}
.block-setting-theme-dark .gform_wrapper .gform-page-footer .button.gform-theme-button--secondary:hover {
background-color: var(--white) !important;
border-color: var(--white) !important;
color: var(--black) !important;
}
@media (max-width: 460px) {
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_footer button[type="submit"] {
width: 100% !important
}
}
/*--------------------------------------------------------------
Helpers
--------------------------------------------------------------*/
/* Visibility */
.block-theme .hidden {
display: none !important;
}
@media (max-width: 768px) {
.block-theme .desktop-only {
display: none !important;
}
}
@media (min-width: 769px) {
.block-theme .mobile-only {
display: none !important;
}
}
.screen-reader-text {
border: 0;
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
word-wrap: normal !important;
}
/* Positioning */
.block-theme .pos-relative {
position: relative;
}
/* Images */
.block-theme img.aligncenter {
margin-left: auto;
margin-right: auto;
float: none;
}
.block-theme img.alignleft {
float: left;
}
.block-theme img.alignright {
float: right;
}
.block-theme img.size-full {
width: 100%;
}
/* Clearfix */
.block-theme .clearfix:after {
content: '';
display: table;
clear: both;
}
/*--------------------------------------------------------------
Containers/Layout
--------------------------------------------------------------*/
/* Main */
.container {
width: 100%;
padding: 0 30px;
margin: 0 auto;
max-width: 1460px;
}
.container.w500 { max-width: 540px; }
.container.w600 { max-width: 660px; }
.container.w700 { max-width: 760px; }
.container.w800 { max-width: 860px; }
.container.w900 { max-width: 960px; }
.container.w1000 { max-width: 1060px; }
.container.w1100 { max-width: 1160px; }
.container.w1200 { max-width: 1260px; }
.container.w1300 { max-width: 1360px; }
.container.w1400 { max-width: 1460px; }
.container.w1600 { max-width: 1660px; }
.container.wmax {
max-width: 1920px;
padding: 0;
}
.container.none {
max-width: none;
padding: 0;
}
@media(max-width: 600px) {
.container {
padding: 0 20px;
}
}
/* Special */
.container-oneside {
margin-left: calc((100% - min(100%, 1260px)) / 2);
padding: 0 0 0 30px;
}
.parallax-container {
overflow: hidden;
}
.responsive-video {
position: relative;
overflow: hidden;
padding-bottom: 56.25%;
}
.responsive-video iframe,
.responsive-video img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.responsive-video img {
object-fit: cover;
}
.responsive-video svg {
position: absolute;
top: 50%;
left: 50%;
width: 48px;
height: 48px;
transform: translate(-50%, -50%);
color: var(--white);
}
@media(max-width: 600px) {
.container-oneside {
padding: 0 0 0 20px;
}
}
/* Grid System */
.block-theme .grid-system-1,
.block-theme .grid-system-2,
.block-theme .grid-system-3,
.block-theme .grid-system-4,
.block-theme .grid-system-5,
.block-theme .grid-system-6 {
display: grid;
gap: 24px;
}
.block-theme .grid-system-1,
.block-theme .grid-system-2 {
gap: 40px;
}
.block-theme .grid-system-2 {
grid-template-columns: repeat(2, 1fr);
}
.block-theme .grid-system-3 {
grid-template-columns: repeat(3, 1fr);
gap: 40px;
}
.block-theme .grid-system-4 {
grid-template-columns: repeat(4, 1fr);
}
.block-theme .grid-system-5 {
grid-template-columns: repeat(5, 1fr);
}
.block-theme .grid-system-6 {
grid-template-columns: repeat(6, 1fr);
}
@media(max-width: 1200px) {
.block-theme .grid-system-5 {
grid-template-columns: repeat(3, 1fr);
}
.block-theme .grid-system-6 {
grid-template-columns: repeat(4, 1fr);
}
}
@media(max-width: 992px) {
.block-theme .grid-system-1,
.block-theme .grid-system-2,
.block-theme .grid-system-3 {
gap: 30px;
}
.block-theme .grid-system-3 {
grid-template-columns: repeat(2, 1fr);
}
.block-theme .grid-system-4,
.block-theme .grid-system-5,
.block-theme .grid-system-6 {
grid-template-columns: repeat(3, 1fr);
}
}
@media(max-width: 768px) {
.block-theme .grid-system-2 {
grid-template-columns: repeat(1, 1fr);
}
.block-theme .grid-system-4,
.block-theme .grid-system-5 {
grid-template-columns: repeat(2, 1fr);
}
}
@media(max-width: 500px) {
.block-theme .grid-system-3,
.block-theme .grid-system-4 {
grid-template-columns: repeat(1, 1fr);
}
.block-theme .grid-system-6 {
grid-template-columns: repeat(2, 1fr);
}
}
/* Tables */
.block-theme table {
border-collapse: collapse;
width: 100%;
}
.block-theme table,
.block-theme table tr,
.block-theme table th,
.block-theme table td {
border-color: var(--black);
}
.block-theme table th,
.block-theme table td {
padding: 10px;
text-align: left;
border: 1px solid var(--black);
color: var(--black);
}
.block-theme table th {
background-color: var(--grey);
}
.block-theme table th,
.block-theme table th * {
font-weight: 600;
}
/*--------------------------------------------------------------
Site: Header
--------------------------------------------------------------*/
.site-header {
background-color: var(--green);
display: flex;
justify-content: space-between;
align-items: center;
gap: 0 24px;
position: sticky;
top: var(--announcement-bar-height);
left: 0;
width: 100%;
height: var(--header-height);
z-index: 100;
padding: 0 30px;
transition: background-color 0.3s ease;
}
body.admin-bar .site-header {
top: calc(var(--announcement-bar-height) + var(--admin-bar-height));
}
/* Transparent over a leading banner until the page scrolls or a menu opens */
body.header-transparent .site-header {
background-color: transparent;
}
body.header-transparent.fixed-header .site-header,
body.header-transparent.menu-active .site-header,
body.header-transparent .site-header:has(.menu > li.menu-item-has-children:hover),
body.header-transparent .site-header:has(.menu > li.menu-item-has-children:focus-within) {
background-color: var(--green);
}
body.header-transparent .site-main {
margin-top: calc(-1 * var(--header-height));
}
@media (max-width: 600px) {
.site-header {
padding: 0 20px;
}
}
/* Skip Link */
.block-theme a.skip-link {
position: absolute;
top: -100px;
left: 16px;
z-index: 1000;
padding: 12px 20px;
background-color: var(--green);
color: var(--white);
font-size: var(--14px);
text-decoration: none;
}
.block-theme.admin-bar a.skip-link:focus {
top: calc(var(--admin-bar-height) + 16px);
}
.block-theme a.skip-link:focus {
top: 16px;
outline: 2px solid var(--white);
outline-offset: -5px;
}
.block-theme a.skip-link:hover {
color: var(--white);
}
.site-main:focus {
outline: none;
}
/* Logo */
.site-header .site-header-logo {
display: flex;
align-items: center;
justify-content: center;
padding: 0;
}
.site-header .site-header-logo a {
display: block;
color: var(--white);
line-height: 0;
}
.site-header .site-header-logo a:hover {
color: var(--white);
}
.site-header .site-header-logo svg {
height: 64px;
width: auto;
transition: height 0.3s ease;
}
body.fixed-header .site-header .site-header-logo svg {
height: 52px;
}
@media (max-width: 992px) {
.site-header .site-header-logo {
padding: 0;
}
.site-header .site-header-logo svg,
body.fixed-header .site-header .site-header-logo svg {
height: 44px;
}
}
/* Actions */
.site-header .site-header-actions {
display: flex;
align-items: center;
gap: 24px;
}
@media (max-width: 992px) {
.site-header .site-header-actions .button {
display: none;
}
}
/* Admin Bar */
#wpadminbar {
position: sticky;
top: 0;
}
/* Announcement Bar */
body.site-announcement-active {
--announcement-bar-height: 40px;
}
.site-announcement {
position: sticky;
top: 0;
left: 0;
width: 100%;
z-index: 100;
background-color: var(--green-dark);
color: var(--white);
height: 40px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
body.admin-bar .site-announcement {
top: var(--admin-bar-height);
}
.site-announcement .site-announcement-content {
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
scrollbar-width: none;
}
.site-announcement .site-announcement-content::-webkit-scrollbar {
display: none;
}
.site-announcement .site-announcement-content p,
.site-announcement .site-announcement-content a {
font-size: var(--14px);
color: var(--white);
margin: 0;
}
@media (max-width: 992px) {
.site-announcement .site-announcement-content p,
.site-announcement .site-announcement-content a {
font-size: var(--12px);
}
}
/*--------------------------------------------------------------
Site: Navigation
--------------------------------------------------------------*/
/* Menu (split either side of the logo) */
.site-navigation {
flex: 1;
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
align-self: stretch;
max-width: 1400px;
margin: 0 auto;
}
.site-navigation .menu {
list-style: none;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: stretch;
align-self: stretch;
gap: 0 128px;
}
.site-navigation .menu-left { grid-column: 1; }
.site-navigation .site-header-logo { grid-column: 2; }
.site-navigation .menu-right { grid-column: 3; }
.site-navigation .menu > li {
position: static;
display: flex;
align-items: center;
gap: 8px;
}
.site-navigation .menu li a {
display: flex;
align-items: center;
text-align: center;
gap: 4px;
padding: 12px 0;
text-decoration: none;
line-height: 20px;
font-family: var(--font-secondary);
font-size: var(--16px);
font-weight: 600;
letter-spacing: 1px;
text-transform: uppercase;
color: var(--white);
white-space: nowrap;
}
.site-navigation .menu li a:hover,
.site-navigation .menu li.current-menu-item > a,
.site-navigation .menu li.current-menu-ancestor > a {
color: var(--green-light);
}
.site-navigation .menu li > .sub-menu-toggle {
display: flex;
align-items: center;
justify-content: center;
min-width: 32px;
min-height: 32px;
padding: 0;
margin: 0 -10px;
background: none;
border: none;
line-height: 0;
color: var(--green-light);
cursor: pointer;
}
.site-navigation .menu li > .sub-menu-toggle:hover {
background: none;
color: var(--green-light);
}
.site-navigation .menu li > .sub-menu-toggle svg {
width: 12px;
transition: color 0.3s ease, transform 0.3s ease;
}
.site-navigation .menu li:hover > .sub-menu-toggle svg,
.site-navigation .menu li:focus-within > .sub-menu-toggle svg,
.site-navigation .menu li.active > .sub-menu-toggle svg {
transform: rotate(45deg);
}
/* Mega menu: full-width panel under the header */
.site-navigation .menu .sub-menu-wrap {
position: absolute;
top: 100%;
left: 0;
width: 100%;
z-index: 900;
padding: 0;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 0.3s ease, visibility 0s 0.3s;
}
.site-navigation .menu li:hover > .sub-menu-wrap,
.site-navigation .menu li:focus-within > .sub-menu-wrap,
.site-navigation .menu li.active > .sub-menu-wrap {
opacity: 1;
visibility: visible;
pointer-events: all;
transition: opacity 0.3s ease, visibility 0s;
}
.site-navigation .sub-menu {
--mega-menu-gutter: max(30px, calc((100% - 1200px) / 2));
position: relative;
background-color: var(--green);
display: block;
padding: 56px var(--mega-menu-gutter) 72px;
border-top: 1px solid rgb(from var(--white) r g b / 0.12);
box-shadow: 0 24px 40px rgba(0, 0, 0, 0.15);
}
.site-navigation .sub-menu li {
position: static;
display: block;
width: 50%;
margin: 0;
border: none;
}
.site-navigation .sub-menu li a {
display: inline-block;
white-space: normal;
text-align: left;
padding: 8px 0 4px;
font-family: var(--font-primary);
font-size: var(--32px);
font-weight: 700;
letter-spacing: 0;
text-transform: none;
line-height: 1.3;
color: var(--white);
border-bottom: 4px solid transparent;
transition: border-color 0.3s ease;
}
.site-navigation .sub-menu li a:hover,
.site-navigation .sub-menu li:hover > a,
.site-navigation .sub-menu li.current-menu-item > a {
color: var(--white);
border-bottom-color: var(--green-light);
}
.site-navigation .sub-menu .menu-item-description {
display: none;
position: absolute;
top: 64px;
left: calc(50% + 30px);
right: var(--mega-menu-gutter);
max-width: 520px;
color: var(--white);
font-size: var(--18px);
font-weight: 400;
line-height: 1.6;
}
.site-navigation .sub-menu li:hover > .menu-item-description,
.site-navigation .sub-menu li:focus-within > .menu-item-description {
display: block;
}
/* Third level is not part of the design: flatten it into the panel */
.site-navigation .sub-menu .sub-menu-toggle {
display: none;
}
.site-navigation .sub-menu .sub-menu-wrap {
position: static;
opacity: 1;
visibility: visible;
pointer-events: all;
padding: 0 0 0 24px;
}
.site-navigation .sub-menu .sub-menu {
padding: 0;
background: none;
box-shadow: none;
}
.site-navigation .sub-menu .sub-menu li {
width: 100%;
}
.site-navigation .sub-menu .sub-menu li a {
font-size: var(--20px);
font-weight: 400;
border-bottom-width: 2px;
}
@media (max-width: 1200px) {
.site-navigation .menu {
gap: 0 48px;
}
.site-navigation .sub-menu li a {
font-size: var(--30px);
}
}
@media (max-width: 992px) {
.site-navigation {
display: flex;
justify-content: flex-start;
}
.site-navigation .menu {
display: none;
}
}
/* Responsive Tray Toggle */
.site-header .responsive-tray-toggle {
display: none;
position: relative;
margin: 0 -8px 0 0;
padding: 0;
min-width: 0;
width: 44px;
height: 44px;
background: none;
border: none;
cursor: pointer;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.site-header .responsive-tray-toggle:hover {
background: none;
}
.site-header .responsive-tray-toggle:focus-visible {
outline: 2px solid var(--white);
outline-offset: 6px;
}
.responsive-tray-toggle span,
.responsive-tray-toggle span:before,
.responsive-tray-toggle span:after {
position: absolute;
left: 8px;
width: 28px;
height: 3px;
border-radius: 3px;
background-color: var(--white);
transition: background-color 0s 0.2s;
}
.responsive-tray-toggle span {
top: 20px;
}
.responsive-tray-toggle span:before,
.responsive-tray-toggle span:after {
left: 0;
}
.responsive-tray-toggle span:before,
.responsive-tray-toggle span:after {
content: '';
transition-duration: 0.2s, 0.2s;
transition-delay: 0.2s, 0s;
}
.responsive-tray-toggle span:before {
top: -8px;
transition-property: top, transform;
}
.responsive-tray-toggle span:after {
bottom: -8px;
transition-property: bottom, transform;
}
body.menu-active .responsive-tray-toggle span {
background-color: transparent;
}
body.menu-active .responsive-tray-toggle span:before {
top: 0;
transform: rotate(45deg);
transition-delay: 0s, 0.2s;
}
body.menu-active .responsive-tray-toggle span:after {
bottom: 0;
transform: rotate(-45deg);
transition-delay: 0s, 0.2s;
}
@media (max-width: 992px) {
.site-header .responsive-tray-toggle {
display: block;
}
}
/*--------------------------------------------------------------
Site: Responsive Tray
--------------------------------------------------------------*/
.site-responsive-tray {
display: none;
}
@media (max-width: 992px) {
/* Main */
body.menu-active .site-main {
transform: translateX(-100%);
}
.site-responsive-tray {
display: flex;
flex-direction: column;
justify-content: space-between;
position: fixed;
top: calc(var(--header-height) + var(--announcement-bar-height));
bottom: 0;
right: 0;
width: 100%;
background-color: var(--green);
z-index: 0;
overflow-y: auto;
opacity: 0;
visibility: hidden;
transition: transform ease 0.3s, opacity ease 0.3s, visibility 0s 0.3s;
pointer-events: none;
}
body.menu-active .site-responsive-tray {
opacity: 1;
visibility: visible;
transition: transform ease 0.3s, opacity ease 0.3s, visibility 0s;
pointer-events: all;
}
body.admin-bar .site-responsive-tray {
top: calc(var(--header-height) + var(--announcement-bar-height) + var(--admin-bar-height));
}
/* Menu */
.site-responsive-tray .menu {
list-style: none;
margin: 0;
padding: 24px 30px 40px;
}
.site-responsive-tray .menu li {
display: block;
width: 100%;
}
.site-responsive-tray .menu > li {
border-bottom: 1px solid rgb(from var(--white) r g b / 0.2);
margin: 0;
}
.site-responsive-tray .menu li a {
display: block;
padding: 16px 0;
color: var(--white);
font-family: var(--font-secondary);
font-size: var(--24px);
font-weight: 600;
line-height: 1.3;
text-decoration: none;
}
.site-responsive-tray .menu li a:hover,
.site-responsive-tray .menu li.current-menu-item > a,
.site-responsive-tray .menu li.current-menu-ancestor > a {
color: var(--green-light);
}
.site-responsive-tray .menu li.menu-item-has-children {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.site-responsive-tray .menu li.menu-item-has-children > a {
flex: 1 1 0;
width: auto;
min-width: 0;
}
.site-responsive-tray .menu li.menu-item-has-children > .sub-menu-toggle {
display: flex;
align-items: center;
align-self: stretch;
padding: 0 0 0 30px;
margin: 0;
min-width: 0;
background: none;
border: none;
line-height: 0;
color: var(--green-light);
cursor: pointer;
}
.site-responsive-tray .menu li.menu-item-has-children > .sub-menu-toggle:hover {
background: none;
color: var(--white);
}
.site-responsive-tray .menu li.menu-item-has-children > .sub-menu-toggle svg {
width: 18px;
transition: transform 0.3s ease;
}
.site-responsive-tray .menu li.menu-item-has-children.active > .sub-menu-toggle svg {
transform: rotate(45deg);
}
.site-responsive-tray .menu li.menu-item-has-children > .sub-menu-wrap {
flex: 0 0 100%;
}
/* Sub Menu */
.site-responsive-tray .sub-menu-wrap {
display: grid;
grid-template-rows: 0fr;
visibility: hidden;
transition: grid-template-rows 0.3s ease, visibility 0s 0.3s;
}
.site-responsive-tray .menu li.menu-item-has-children.active > .sub-menu-wrap {
grid-template-rows: 1fr;
visibility: visible;
transition: grid-template-rows 0.3s ease, visibility 0s;
}
.site-responsive-tray .sub-menu {
overflow: hidden;
padding: 0 0 0 20px;
transition: padding 0.3s ease;
}
.site-responsive-tray .menu li.menu-item-has-children.active > .sub-menu-wrap > .sub-menu {
padding: 0 0 16px 20px;
}
.site-responsive-tray .menu li.menu-item-has-children .sub-menu li a {
padding: 8px 0;
justify-content: flex-start;
line-height: 1.3;
font-family: var(--font-primary);
font-size: var(--18px);
font-weight: 400;
letter-spacing: 0.5px;
}
.site-responsive-tray .menu-item-description {
display: none;
}
/* Actions */
.site-responsive-tray .responsive-tray-actions {
padding: 20px 30px 80px 30px;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 24px 12px;
}
.site-responsive-tray .responsive-tray-actions .button {
width: 100%;
}
}
@media (max-width: 600px) {
.site-responsive-tray .menu {
padding: 24px 20px 40px;
}
.site-responsive-tray .responsive-tray-actions {
padding: 20px 20px 80px 20px;
}
}
/*--------------------------------------------------------------
Site: Main
--------------------------------------------------------------*/
/* Main */
.site-main {
background-color: var(--white);
position: relative;
z-index: 1;
transition: transform 0.3s ease;
}
/* 404 Not Found */
.page-error404 .error404-main {
padding: 100px 0;
text-align: center;
}
@media (max-width: 768px) {
.page-error404 .error404-main {
padding: 60px 0;
}
}
/*--------------------------------------------------------------
Site: Footer
--------------------------------------------------------------*/
/* Main */
.site-footer {
background-color: var(--green-dark);
color: var(--white);
}
.site-footer .site-footer-main {
position: relative;
overflow: hidden;
padding: 72px 0 0;
}
.site-footer .site-footer-main .container {
position: relative;
z-index: 1;
}
.site-footer .site-footer-row {
display: grid;
grid-template-columns: 1.5fr 1fr 1fr 1fr;
gap: 40px;
}
.site-footer .site-footer-logo a {
display: inline-block;
color: var(--white);
line-height: 0;
}
.site-footer .site-footer-logo a:hover {
color: var(--white);
}
.site-footer .site-footer-logo svg {
width: 280px;
max-width: 100%;
height: auto;
}
.site-footer .site-footer-col h3 {
font-family: var(--font-secondary);
font-size: var(--16px);
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
line-height: 1.2;
color: var(--green-light);
margin: 0 0 20px;
}
.site-footer .site-footer-col h3 a {
color: var(--green-light);
}
.site-footer .site-footer-col h3 a:hover {
color: var(--white);
}
.site-footer .site-footer-col ul {
list-style: none;
margin: 0;
padding: 0;
}
.site-footer .site-footer-col li {
margin: 0 0 6px;
}
.site-footer .site-footer-col li a {
color: var(--white);
font-size: var(--18px);
line-height: 1.5;
text-decoration: none;
}
.site-footer .site-footer-col li a:hover {
color: var(--green-light);
}
@media (max-width: 992px) {
.site-footer .site-footer-row {
grid-template-columns: 1fr 1fr;
}
.site-footer .site-footer-logo {
grid-column: 1 / -1;
}
}
@media (max-width: 460px) {
.site-footer .site-footer-row {
grid-template-columns: 1fr;
text-align: center;
}
.site-footer .site-footer-socials {
justify-content: center;
}
}
/* Socials */
.site-footer .site-footer-socials {
display: flex;
align-items: center;
gap: 10px;
margin: 24px 0 0;
}
.site-footer .site-footer-socials a {
display: flex;
justify-content: center;
align-items: center;
width: 32px;
height: 32px;
background-color: var(--green-light);
color: var(--green-dark);
border-radius: 100%;
transition: background-color 0.3s ease, color 0.3s ease;
}
.site-footer .site-footer-socials a svg {
width: 14px;
height: 14px;
}
.site-footer .site-footer-socials a:hover {
background-color: var(--white);
color: var(--green-dark);
}
/* Acknowledgement */
.site-footer .site-footer-acknowledgement {
text-align: center;
padding: 80px 0 72px;
}
.site-footer .site-footer-acknowledgement p {
color: var(--white);
font-size: var(--16px);
margin: 0 0 8px;
}
.site-footer .site-footer-acknowledgement p:last-child {
margin: 0;
}
.site-footer .site-footer-main .container:not(:has(.site-footer-acknowledgement)) {
padding-bottom: 72px;
}
/* Shape */
.site-footer .site-footer-shape {
position: absolute;
left: 0;
bottom: 0;
width: 400px;
height: 256px;
color: rgb(from var(--white) r g b / 0.08);
pointer-events: none;
}
.site-footer .site-footer-shape svg {
display: block;
width: 100%;
height: 100%;
}
@media (max-width: 768px) {
.site-footer .site-footer-main {
padding: 48px 0 0;
}
.site-footer .site-footer-acknowledgement {
padding: 48px 0;
}
.site-footer .site-footer-shape {
width: 240px;
height: 154px;
}
}
/* Bottom */
.site-footer .site-footer-bottom {
position: relative;
z-index: 1;
background-color: rgb(from var(--green-light) r g b / 0.32);
color: var(--white);
font-size: var(--14px);
}
.site-footer .site-footer-bottom-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px 24px;
flex-wrap: wrap;
padding: 12px 0;
}
.site-footer .site-footer-bottom .site-footer-copyright {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px 20px;
}
.site-footer .site-footer-bottom a {
color: var(--white);
text-decoration: none;
}
.site-footer .site-footer-bottom .site-footer-credits a {
text-decoration: underline;
}
.site-footer .site-footer-bottom a:hover {
color: var(--green-dark);
}
@media (max-width: 768px) {
.site-footer .site-footer-bottom-row {
justify-content: center;
text-align: center;
}
.site-footer .site-footer-bottom .site-footer-copyright {
justify-content: center;
flex: 100%;
}
}
/*-----------------------------------------------------------------------
Block Settings
-----------------------------------------------------------------------*/
/* Padding */
.block-section .block-setting-padding {
padding-top: var(--block-padding-top);
padding-bottom: var(--block-padding-bottom);
}
@media (max-width: 992px) {
.block-section .block-setting-padding {
padding-top: clamp(0px, var(--block-padding-top), max(20px, calc(var(--block-padding-top) / 1.25)));
padding-bottom: clamp(0px, var(--block-padding-bottom), max(20px, calc(var(--block-padding-bottom) / 1.25)));
}
}
@media (max-width: 768px) {
.block-section .block-setting-padding {
padding-top: clamp(0px, var(--block-padding-top), max(20px, calc(var(--block-padding-top) / 2)));
padding-bottom: clamp(0px, var(--block-padding-bottom), max(20px, calc(var(--block-padding-bottom) / 2)));
}
}
/* Backgrounds */
.block-section .block-setting-background {
background-color: var(--block-background-color, transparent);
box-shadow: 0 1px 0 var(--block-background-color, transparent);
}
/* Colours */
.block-section .block-setting-theme-dark *:not(.button):not(svg):not(svg *):not(input):not(select):not(textarea):not(span[style*="color"]):not(.ignore-text-white):not(.ignore-text-white *):not(p a:hover):not(li a:hover) {
color: var(--white) !important;
}
/* Decorations (angular shapes from the brand) */
.block-section .block-setting-decoration {
position: relative;
overflow: hidden;
}
.block-section .block-setting-decoration > * {
position: relative;
z-index: 1;
}
.block-section .block-setting-decoration:before {
content: '';
position: absolute;
z-index: 0;
pointer-events: none;
}
.block-section .block-setting-decoration-corner-blue:before,
.block-section .block-setting-decoration-corner-white:before {
left: 0;
bottom: 0;
width: 400px;
height: 256px;
-webkit-mask: url(../images/shape-corner.svg) no-repeat left bottom / 100% 100%;
mask: url(../images/shape-corner.svg) no-repeat left bottom / 100% 100%;
}
.block-section .block-setting-decoration-triangle-blue:before,
.block-section .block-setting-decoration-triangle-white:before {
right: 0;
top: 0;
width: 434px;
height: 434px;
-webkit-mask: url(../images/shape-triangle.svg) no-repeat right top / 100% 100%;
mask: url(../images/shape-triangle.svg) no-repeat right top / 100% 100%;
}
/* Arrow: the tall brand arrow at the foot of a block, rising into the block above it */
.block-section .block-setting-decoration-arrow-blue {
overflow: visible;
clip-path: inset(-1000px 0 0 0);
}
.block-section .block-setting-decoration-arrow-blue:before {
left: 0;
bottom: -108px;
width: 540px;
height: 940px;
-webkit-mask: url(../images/shape-arrow.svg) no-repeat left bottom / 100% 100%;
mask: url(../images/shape-arrow.svg) no-repeat left bottom / 100% 100%;
}
.block-section .block-setting-decoration-corner-blue:before,
.block-section .block-setting-decoration-triangle-blue:before,
.block-section .block-setting-decoration-arrow-blue:before {
background-color: rgb(from var(--blue) r g b / 0.5);
}
.block-section .block-setting-decoration-corner-white:before,
.block-section .block-setting-decoration-triangle-white:before {
background-color: rgb(from var(--white) r g b / 0.2);
}
@media (max-width: 768px) {
.block-section .block-setting-decoration-corner-blue:before,
.block-section .block-setting-decoration-corner-white:before {
width: 240px;
height: 154px;
}
.block-section .block-setting-decoration-triangle-blue:before,
.block-section .block-setting-decoration-triangle-white:before {
width: 240px;
height: 240px;
}
.block-section .block-setting-decoration-arrow-blue:before {
bottom: -64px;
width: 324px;
height: 564px;
}
}
/*--------------------------------------------------------------
General
--------------------------------------------------------------*/
/* Empty Block */
.block-empty {
padding: 40px 0;
text-align: center;
}
.block-empty p {
margin: 0 20px;
}
/* Accordion */
.block-theme .accordion-section {
border: none;
}
.block-theme .accordion-section .accordion-item {
border-bottom: 1px solid rgb(from var(--green-light) r g b / 0.5);
}
.block-theme .block-setting-theme-dark .accordion-section .accordion-item {
border-color: var(--white);
}
.block-theme .accordion-section .accordion-item:last-of-type {
border: none;
}
.block-theme .accordion-section .accordion-item .accordion-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
width: 100%;
cursor: pointer;
padding: 24px 0;
margin: 0;
min-width: 0;
background: none;
border: none;
font: inherit;
font-weight: 600;
font-size: var(--26px);
line-height: 1.4;
text-align: left;
text-transform: none;
color: var(--green);
}
.block-theme .accordion-section .accordion-item .accordion-header:hover {
background: none;
color: var(--green-dark);
}
.block-theme .accordion-section .accordion-item .accordion-header:focus-visible {
outline: 2px solid currentColor;
outline-offset: -2px;
}
.block-theme .accordion-section .accordion-item .accordion-header .accordion-toggle {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.block-theme .accordion-section .accordion-item .accordion-header .accordion-toggle svg {
height: 20px;
width: 20px;
color: var(--green-light);
transition: transform 0.3s ease;
}
.block-theme .accordion-section .accordion-item.active .accordion-header .accordion-toggle svg {
transform: rotate(45deg);
}
.block-theme .accordion-section .accordion-item .accordion-content {
display: grid;
grid-template-rows: 0fr;
visibility: hidden;
transition: grid-template-rows 0.3s ease, visibility 0s 0.3s;
}
.block-theme .accordion-section .accordion-item.active .accordion-content {
grid-template-rows: 1fr;
visibility: visible;
transition: grid-template-rows 0.3s ease, visibility 0s;
}
.block-theme .accordion-section .accordion-item .accordion-content > .wysiwyg-content {
overflow: hidden;
padding: 0 48px 0 0;
transition: padding 0.3s ease;
}
.block-theme .accordion-section .accordion-item.active .accordion-content > .wysiwyg-content {
padding: 8px 48px 32px 0;
}
/* Panel layout: white panel with content and buttons above the items */
.block-theme .accordion-section.accordion-layout-panel {
background-color: var(--cream);
padding: 48px 48px 40px 40px;
}
.block-theme .accordion-section.accordion-layout-panel.accordion-panel-white {
background-color: var(--white);
}
.block-theme .accordion-panel-header {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 24px 40px;
margin: 0 0 40px;
}
.block-theme .accordion-panel-header .accordion-panel-content {
flex: 0 1 600px;
}
.block-theme .accordion-panel-header .button-group {
margin: 0;
flex: none;
}
@media (max-width: 768px) {
.block-theme .accordion-section .accordion-item .accordion-header {
padding: 16px 0;
font-size: var(--20px);
}
.block-theme .accordion-section.accordion-layout-panel {
padding: 24px;
}
.block-theme .accordion-panel-header {
flex-direction: column;
align-items: flex-start;
margin: 0 0 24px;
}
.block-theme .accordion-panel-header .accordion-panel-content {
flex: none;
width: 100%;
}
.block-theme .accordion-section .accordion-item .accordion-content > .wysiwyg-content {
padding: 0 32px 0 0;
}
.block-theme .accordion-section .accordion-item.active .accordion-content > .wysiwyg-content {
padding: 4px 32px 24px 0;
}
}
/* Clipboard Copy */
.block-theme .clipboard-copy {
position: relative;
padding: 0;
background: none;
border: none;
font: inherit;
cursor: pointer;
}
.block-theme .clipboard-copy:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.block-theme .clipboard-copy .tooltip {
visibility: hidden;
width: auto;
white-space: nowrap;
background-color: var(--black);
color: var(--white);
text-align: center;
border-radius: 4px;
padding: 3px 10px;
position: absolute;
top: 0;
left: 50%;
font-size: var(--13px);
line-height: 1.5;
transform: translate(-50%, -140%);
opacity: 0;
transition: opacity 0.3s ease;
}
.block-theme .clipboard-copy .tooltip:after {
content: '';
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: var(--black) transparent transparent transparent;
}
.block-theme .clipboard-copy:hover .tooltip {
visibility: visible;
opacity: 1;
}
/* Swiper */
.block-theme .swiper-button-prev,
.block-theme .swiper-button-next {
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
min-width: 0;
padding: 0;
margin: 0;
background: none;
border: 2px solid var(--green-light);
border-radius: 100% !important;
color: var(--green-light);
transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease, opacity 0.3s ease;
}
.block-theme .swiper-button-prev {
left: -16px;
transform: translate(-100%, -50%);
}
.block-theme .swiper-button-next {
right: -16px;
transform: translate(100%, -50%);
}
.block-theme .swiper-button-prev:after,
.block-theme .swiper-button-next:after {
display: none;
}
.block-theme .swiper-button-prev svg,
.block-theme .swiper-button-next svg {
width: 20px;
height: 20px;
color: inherit;
transition: color 0.3s ease;
}
.block-theme .swiper-button-prev svg {
transform: rotate(180deg);
}
.block-theme .swiper-button-prev:hover,
.block-theme .swiper-button-next:hover {
background-color: var(--green-light);
border-color: var(--green-light);
color: var(--green);
}
.block-theme .swiper-button-prev.swiper-button-disabled,
.block-theme .swiper-button-next.swiper-button-disabled {
opacity: 0.35;
pointer-events: none;
}
/* Arrows go when every slide already fits */
.block-theme .swiper-button-prev.swiper-button-lock,
.block-theme .swiper-button-next.swiper-button-lock {
display: none;
}
.block-theme .swiper-pagination-progressbar.swiper-pagination-horizontal {
background-color: var(--grey);
height: 4px;
position: static;
}
.block-theme .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
background-color: var(--green);
}
.block-theme .swiper-pagination {
display: flex;
align-items: center;
justify-content: center;
gap: 0;
bottom: 18px !important;
}
.block-theme .swiper-pagination .swiper-pagination-bullet {
position: relative;
opacity: 1;
background: none;
border-radius: 0;
width: 20px;
height: 20px;
margin: 0 !important;
}
.block-theme .swiper-pagination .swiper-pagination-bullet:before {
content: '';
position: absolute;
top: 6px;
right: 6px;
bottom: 6px;
left: 6px;
background-color: rgb(from var(--green-light) r g b / 0.4);
border-radius: 12px;
transition: background-color 0.3s ease;
}
.block-theme .swiper-pagination .swiper-pagination-bullet-active:before {
background-color: var(--green-light);
}
.block-theme .block-setting-theme-dark .swiper-pagination .swiper-pagination-bullet:before {
background-color: var(--white);
opacity: 0.4;
}
.block-theme .block-setting-theme-dark .swiper-pagination .swiper-pagination-bullet-active:before {
opacity: 1;
}
@media (max-width: 1500px) {
.block-theme .swiper-button-prev {
left: -10px;
}
.block-theme .swiper-button-next {
right: -10px;
}
}
@media (max-width: 600px) {
.block-theme .swiper-button-prev,
.block-theme .swiper-button-next {
width: 40px;
height: 40px;
}
.block-theme .swiper-button-prev {
left: -4px;
}
.block-theme .swiper-button-next {
right: -4px;
}
.block-theme .swiper-button-prev svg,
.block-theme .swiper-button-next svg {
width: 16px;
height: 16px;
}
}
/*-----------------------------------------------------------------------
WYSIWYG Content
-----------------------------------------------------------------------*/
.wysiwyg-content h1:last-child,
.wysiwyg-content h2:last-child,
.wysiwyg-content h3:last-child,
.wysiwyg-content h4:last-child,
.wysiwyg-content h5:last-child,
.wysiwyg-content h6:last-child,
.wysiwyg-content p:last-child,
.wysiwyg-content ul:last-child,
.wysiwyg-content img:last-child,
.wysiwyg-content table:last-child,
.wysiwyg-content code:last-child {
margin: 0;
}
.wysiwyg-content blockquote:last-child,
.wysiwyg-content .responsive-video:last-child {
margin: 32px 0 0;
}
@media (max-width: 768px) {
.wysiwyg-content blockquote:last-child,
.wysiwyg-content .responsive-video:last-child {
margin: 24px 0 0;
}
}
/* Lists */
.wysiwyg-content ul,
.wysiwyg-content ol {
list-style: none;
margin: 0 0 24px;
padding: 0;
}
.wysiwyg-content ul li,
.wysiwyg-content ol li {
position: relative;
margin: 0 0 4px;
padding: 0 0 0 24px;
}
.wysiwyg-content ul li:last-of-type,
.wysiwyg-content ol li:last-of-type {
margin: 0;
}
.wysiwyg-content ul > li:before {
content: '';
display: block;
position: absolute;
top: 10px;
left: 2px;
width: 8px;
height: 8px;
transform: rotate(45deg);
background-color: var(--green-light);
}
.block-setting-theme-dark .wysiwyg-content ul li:before {
background-color: var(--white);
}
.wysiwyg-content ol {
counter-reset: item;
list-style-position: outside;
}
.wysiwyg-content ol > li:before {
content: counter(item) '. ';
counter-increment: item;
display: block;
position: absolute;
top: 0;
left: 0;
}
.wysiwyg-content ul.list-style-check li {
padding-left: 30px;
margin: 0 0 8px;
}
.wysiwyg-content ul.list-style-check > li:before {
content: '';
display: block;
position: absolute;
top: 0;
left: 2px;
width: 16px;
height: 16px;
background: url(../images/icon-check.svg) 50% no-repeat;
background-size: contain;
}
/* Box */
.wysiwyg-content .typo-box {
background-color: var(--cream);
padding: 40px;
margin: 40px 0;
}
.wysiwyg-content .typo-box > :last-child {
margin-bottom: 0;
}
.block-setting-theme-dark .wysiwyg-content .typo-box {
background-color: rgb(from var(--white) r g b / 0.1);
}
@media (max-width: 768px) {
.wysiwyg-content .typo-box {
padding: 24px;
margin: 32px 0;
}
}
/* Media */
.wysiwyg-content img {
width: auto;
max-width: 100%;
height: auto;
}
.wysiwyg-content img.size-full,
.wysiwyg-content img.size-large {
width: 100%;
margin: 40px 0;
}
.wysiwyg-content img.size-full:first-child,
.wysiwyg-content img.size-large:first-child {
margin-top: 0;
}
.wysiwyg-content .responsive-video {
margin: 32px 0;
}
/*-----------------------------------------------------------------------
Block: Separator
-----------------------------------------------------------------------*/
.block-separator .block-separator-hr {
display: block;
width: 100%;
height: 1px;
background-color: var(--black);
}
.block-separator .block-separator-hr.black { background-color: var(--black); }
.block-separator .block-separator-hr.white { background-color: var(--white); }
.block-editor .block-separator .block-setting-padding {
padding-top: max(var(--block-padding-top), 5px);
padding-bottom: max(var(--block-padding-bottom), 5px);
}
/*-----------------------------------------------------------------------
Block: Multicolumn
-----------------------------------------------------------------------*/
.block-multicolumn .block-multicolumn-row {
display: flex;
flex-wrap: wrap;
gap: 60px
}
.block-multicolumn .block-setting-multicolumn-start .block-multicolumn-row { align-items: flex-start; }
.block-multicolumn .block-setting-multicolumn-center .block-multicolumn-row { align-items: center; }
.block-multicolumn .block-setting-multicolumn-end .block-multicolumn-row { align-items: flex-end; }
.block-multicolumn .block-setting-multicolumn-2 .block-multicolumn-row { gap: 60px; }
.block-multicolumn .block-setting-multicolumn-2 .block-multicolumn-col {
flex: 0 0 calc(50% - 30px);
}
.block-multicolumn .block-setting-multicolumn-3 .block-multicolumn-row { gap: 60px; }
.block-multicolumn .block-setting-multicolumn-3 .block-multicolumn-col {
flex: 0 0 calc(33.33333% - 40px);
}
.block-multicolumn .block-setting-multicolumn-4 .block-multicolumn-row { gap: 40px; }
.block-multicolumn .block-setting-multicolumn-4 .block-multicolumn-col {
flex: 0 0 calc(25% - 30px);
}
@media (max-width: 768px) {
.block-multicolumn .block-setting-multicolumn-2 .block-multicolumn-row { gap: 30px; }
.block-multicolumn .block-setting-multicolumn-2 .block-multicolumn-col {
flex: 100%;
}
.block-multicolumn .block-setting-multicolumn-3 .block-multicolumn-row { gap: 30px; }
.block-multicolumn .block-setting-multicolumn-3 .block-multicolumn-col {
flex: 100%;
}
.block-multicolumn .block-setting-multicolumn-4 .block-multicolumn-row { gap: 30px; }
.block-multicolumn .block-setting-multicolumn-4 .block-multicolumn-col {
flex: 100%;
}
}
/*-----------------------------------------------------------------------
Block: Dual Column
-----------------------------------------------------------------------*/
.block-dual-column .block-dual-column-row {
display: flex;
gap: 32px 100px;
}
.block-dual-column .block-dual-column-content {
flex: 0 0 calc(50% - 50px);
}
.block-dual-column .block-setting-dual-column-start .block-dual-column-content { align-content: flex-start; }
.block-dual-column .block-setting-dual-column-center .block-dual-column-content { align-content: center; }
.block-dual-column .block-setting-dual-column-end .block-dual-column-content { align-content: flex-end; }
.block-dual-column .block-dual-column-media {
flex: 0 0 calc(50% - 50px);
max-width: calc(50% - 50px);
min-height: 600px;
position: relative;
}
/* Ratio */
.block-dual-column .block-dual-column-ratio-1-2 > :first-child,
.block-dual-column .block-dual-column-ratio-2-1 > :last-child {
flex: 0 0 calc(33.33333% - 50px);
max-width: calc(33.33333% - 50px);
}
.block-dual-column .block-dual-column-ratio-1-2 > :last-child,
.block-dual-column .block-dual-column-ratio-2-1 > :first-child {
flex: 0 0 calc(66.66666% - 50px);
max-width: calc(66.66666% - 50px);
}
.block-dual-column .block-dual-column-media.auto-height {
min-height: auto;
}
.block-dual-column .block-dual-column-gallery {
height: 100%;
}
.block-dual-column img.block-dual-column-image-cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.block-dual-column .block-dual-column-video {
position: relative;
height: 100%;
overflow: hidden;
}
.block-dual-column .block-dual-column-video video {
object-fit: cover;
background-image: url('../images/video-loader-black.gif');
background-repeat: no-repeat;
background-size: 40px;
background-position: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-dual-column .block-setting-theme-dark .block-dual-column-video video {
background-image: url('../images/video-loader-white.gif');
}
@media (max-width: 992px) {
.block-dual-column .block-dual-column-row {
flex-wrap: wrap;
}
.block-dual-column .block-dual-column-content,
.block-dual-column .block-dual-column-row > .block-dual-column-content {
flex: 100%;
max-width: 100%;
order: 2;
}
.block-dual-column .block-dual-column-media,
.block-dual-column .block-dual-column-row > .block-dual-column-media {
max-width: 100%;
flex: 100%;
min-height: auto;
order: 1;
}
.block-dual-column img.block-dual-column-image-cover {
position: static;
height: auto;
aspect-ratio: 5 / 3;
}
.block-dual-column .block-dual-column-video {
padding-top: 60%;
}
}
@media (max-width: 600px) {
.block-dual-column img.block-dual-column-image-cover {
aspect-ratio: 4 / 3;
}
.block-dual-column .block-dual-column-video {
padding-top: 75%;
}
}
/*-----------------------------------------------------------------------
Block: Logo Slider
-----------------------------------------------------------------------*/
.block-logo-slider .block-logo-slider-swiper .swiper-wrapper {
align-items: center;
}
.block-logo-slider .block-logo-slider-swiper .swiper-slide {
width: 240px;
padding: 0 40px;
}
.block-logo-slider .block-logo-slider-swiper .swiper-slide img {
width: 100%;
max-height: 80px;
max-width: 160px;
object-fit: contain;
margin: 0 auto;
}
@media (max-width: 768px) {
.block-logo-slider .block-logo-slider-swiper .swiper-slide {
width: 160px;
padding: 0 20px;
}
.block-logo-slider .block-logo-slider-swiper .swiper-slide img {
max-height: 60px;
max-width: 120px;
}
}
/*-----------------------------------------------------------------------
Block: Post Header
-----------------------------------------------------------------------*/
.block-post-header .block-setting-padding {
position: relative;
display: flex;
align-items: center;
min-height: 640px;
overflow: hidden;
}
.block-post-header .block-post-header-media {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-post-header .block-post-header-media img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.block-post-header .block-post-header-media:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--black);
opacity: 0.4;
}
.block-post-header .block-setting-padding > .container {
position: relative;
z-index: 1;
width: 100%;
}
.block-post-header .block-post-header-main {
max-width: 800px;
margin: 0 auto;
text-align: center;
}
.block-post-header .block-post-header-main .post-categories {
justify-content: center;
margin: 0 0 20px;
}
.block-post-header .block-post-header-main h1 {
margin: 0;
}
/* Bar */
.block-post-header .block-post-header-bar {
padding: 32px 0 0;
}
.block-post-header .block-post-header-bar-row {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 12px 32px;
}
.block-post-header .block-post-header-meta {
display: flex;
align-items: center;
gap: 12px;
font-family: var(--font-secondary);
font-weight: 600;
font-size: var(--12px);
letter-spacing: 1.6px;
text-transform: uppercase;
color: var(--green);
}
.block-post-header .block-post-header-meta time {
padding: 0 12px 0 0;
border-right: 1px solid var(--green-light);
}
.block-post-header .block-post-header-shares {
display: flex;
align-items: center;
gap: 12px;
}
.block-post-header .block-post-header-shares > p {
font-family: var(--font-secondary);
font-weight: 600;
font-size: var(--12px);
letter-spacing: 1.6px;
text-transform: uppercase;
color: var(--green-light);
margin: 0;
}
.block-post-header .block-post-header-shares-wrap {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 6px;
}
.block-post-header .block-post-header-shares a,
.block-post-header .block-post-header-shares .clipboard-copy {
display: flex;
justify-content: center;
align-items: center;
width: 32px;
height: 32px;
min-width: 0;
background-color: var(--green-light);
color: var(--white);
border-radius: 100% !important;
transition: background-color 0.3s ease;
}
.block-post-header .block-post-header-shares a svg,
.block-post-header .block-post-header-shares .clipboard-copy svg {
width: 13px;
height: 13px;
}
.block-post-header .block-post-header-shares a:hover,
.block-post-header .block-post-header-shares .clipboard-copy:hover {
background-color: var(--green-dark);
color: var(--white);
}
@media (max-width: 992px) {
.block-post-header .block-setting-padding {
min-height: 480px;
}
}
@media (max-width: 600px) {
.block-post-header .block-setting-padding {
min-height: 360px;
}
.block-post-header .block-post-header-bar {
padding: 24px 0 0;
}
}
/*-----------------------------------------------------------------------
Block: Banner
-----------------------------------------------------------------------*/
.block-banner .block-setting-padding {
position: relative;
display: flex;
align-items: center;
overflow: hidden;
}
.block-banner .block-banner-height-small {
min-height: 560px;
}
.block-banner .block-banner-height-medium {
min-height: 640px;
}
.block-banner .block-banner-height-large {
min-height: 880px;
}
.block-banner .block-banner-height-full {
min-height: 100vh;
}
.block-banner .block-banner-media {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-banner .block-banner-media.parallax {
top: -20%;
height: 140%;
}
.block-banner .block-banner-media img,
.block-banner .block-banner-media video {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.block-banner .block-banner-media:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--black);
opacity: var(--block-banner-overlay, 0.4);
}
.block-banner .container {
position: relative;
z-index: 1;
width: 100%;
}
.block-banner .block-banner-content {
max-width: 768px;
}
/* Hero-height banners carry the display heading */
.block-banner .block-banner-height-large .block-banner-content h1,
.block-banner .block-banner-height-full .block-banner-content h1 {
font-size: var(--84px);
font-weight: 600;
line-height: 1.05;
margin-bottom: 48px;
}
.block-banner .block-banner-content .typo-copy-large {
line-height: 1.8;
}
/* Highlighted lines sit as bars: headings stack 8px apart, paragraph lines step in under the heading */
.block-banner .block-banner-content .typo-highlight {
display: inline-block;
vertical-align: top;
margin: 0 0 8px;
}
.block-banner .block-banner-content :is(h1, h2, h3, h4) .typo-highlight {
line-height: 1.25;
}
.block-banner .block-banner-content :is(h1, h2, h3, h4):has(> .typo-highlight) {
margin: 0;
}
.block-banner .block-banner-content p .typo-highlight {
font-size: var(--28px);
line-height: 1.4;
margin-bottom: 16px;
}
.block-banner .block-banner-align-left .block-banner-content p .typo-highlight {
margin-left: 120px;
}
@media (max-width: 1600px) {
.block-banner .block-banner-content p .typo-highlight {
font-size: var(--24px);
}
}
@media (max-width: 1200px) {
.block-banner .block-banner-height-large {
min-height: 700px;
}
.block-banner .block-banner-height-large .block-banner-content h1,
.block-banner .block-banner-height-full .block-banner-content h1 {
font-size: var(--60px);
margin-bottom: 32px;
}
.block-banner .block-banner-content p .typo-highlight {
font-size: var(--20px);
}
.block-banner .block-banner-align-left .block-banner-content p .typo-highlight {
margin-left: 0;
}
}
@media (max-width: 992px) {
.block-banner .block-banner-height-small {
min-height: 400px;
}
.block-banner .block-banner-height-medium {
min-height: 480px;
}
.block-banner .block-banner-height-large {
min-height: 500px;
}
}
@media (max-width: 768px) {
.block-banner .block-banner-height-large .block-banner-content h1,
.block-banner .block-banner-height-full .block-banner-content h1 {
font-size: var(--44px);
}
.block-banner .block-banner-content p .typo-highlight {
font-size: var(--18px);
margin-bottom: 8px;
}
}
@media (max-width: 460px) {
.block-banner .block-banner-height-large .block-banner-content h1,
.block-banner .block-banner-height-full .block-banner-content h1 {
font-size: var(--36px);
}
}
@media (max-width: 600px) {
.block-banner .block-banner-height-small,
.block-banner .block-banner-height-medium {
min-height: 320px;
}
.block-banner .block-banner-height-large {
min-height: 400px;
}
.block-banner .block-banner-height-full {
min-height: 480px;
}
}
.block-banner .block-banner-content > :last-child {
margin-bottom: 0;
}
.block-banner .block-banner-align-center .block-banner-content {
margin: 0 auto;
text-align: center;
}
/*-----------------------------------------------------------------------
Block: Testimonials
-----------------------------------------------------------------------*/
.block-testimonials .block-testimonials-row {
display: flex;
align-items: flex-start;
gap: 40px 120px;
}
.block-testimonials .block-testimonials-intro {
flex: 0 0 calc(25% - 60px);
}
.block-testimonials .block-testimonials-main {
flex: 1;
min-width: 0;
}
.block-testimonials .block-testimonials-swiper {
overflow: hidden;
}
.block-testimonials .testimonial {
margin: 0;
text-align: left;
}
.block-testimonials .block-testimonials-on-cream .testimonial {
padding: 40px;
background-color: var(--white);
}
.block-testimonials .block-testimonials-stacked .testimonial {
text-align: center;
}
.block-testimonials .testimonial blockquote {
max-width: 640px;
margin: 0 0 24px;
padding: 0;
border: none;
font-style: normal;
}
.block-testimonials .testimonial blockquote:before {
font-size: var(--170px);
line-height: 0.4;
margin: 16px 0 24px;
}
.block-testimonials .block-testimonials-stacked .testimonial blockquote {
margin: 0 auto 24px;
}
.block-testimonials .testimonial blockquote p {
font-size: var(--18px);
font-weight: 300;
line-height: 1.5;
margin: 0;
}
.block-testimonials .testimonial figcaption {
display: flex;
align-items: center;
gap: 12px;
}
.block-testimonials .block-testimonials-stacked .testimonial figcaption {
justify-content: center;
}
.block-testimonials .testimonial figcaption img {
width: 56px;
height: 56px;
border-radius: 100%;
object-fit: cover;
}
.block-testimonials .testimonial figcaption strong {
display: block;
font-size: var(--16px);
color: var(--green-dark);
}
.block-testimonials .testimonial figcaption span {
display: block;
font-size: var(--14px);
}
.block-testimonials .swiper-pagination {
position: static;
justify-content: flex-start;
margin: 24px 0 0 -6px;
}
.block-testimonials .block-testimonials-stacked .swiper-pagination {
justify-content: center;
margin: 32px 0 0;
}
@media (max-width: 1200px) {
.block-testimonials .block-testimonials-row {
gap: 40px 60px;
}
.block-testimonials .block-testimonials-intro {
flex: 0 0 calc(33.33333% - 30px);
}
}
@media (max-width: 768px) {
.block-testimonials .block-testimonials-on-cream .testimonial {
padding: 24px;
}
}
@media (max-width: 992px) {
.block-testimonials .block-testimonials-row {
flex-wrap: wrap;
}
.block-testimonials .block-testimonials-intro,
.block-testimonials .block-testimonials-main {
flex: 100%;
}
}
/*-----------------------------------------------------------------------
Block: Cards
-----------------------------------------------------------------------*/
.block-cards .block-cards-row {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
}
.block-cards .block-cards-columns-2 {
grid-template-columns: repeat(2, 1fr);
}
.block-cards .block-cards-columns-4 {
grid-template-columns: repeat(4, 1fr);
}
.block-cards .block-cards-item {
display: flex;
flex-direction: column;
gap: 16px;
padding: 32px;
border: 1px solid var(--grey);
}
.block-cards .block-cards-icon {
width: 56px;
height: 56px;
}
.block-cards .block-cards-on-cream .block-cards-item {
background-color: var(--white);
border-color: var(--white);
}
.block-cards .block-cards-style-plain .block-cards-item {
border: none;
padding: 0;
background: none;
}
.block-cards .block-cards-on-cream .block-cards-style-plain .block-cards-item {
padding: 32px;
background-color: var(--white);
}
.block-cards .block-cards-style-plain .block-cards-icon {
width: 64px;
height: 64px;
}
.block-cards .block-cards-style-plain {
gap: 48px 80px;
}
.block-cards .block-cards-icon img {
width: 100%;
height: 100%;
object-fit: contain;
}
.block-cards .block-setting-theme-dark .block-cards-item {
background-color: rgb(from var(--white) r g b / 0.08);
border-color: rgb(from var(--white) r g b / 0.2);
}
.block-cards .block-setting-theme-dark .block-cards-icon img {
filter: invert(1);
}
.block-cards .block-cards-content {
flex: 1;
}
.block-cards .block-cards-content > :last-child {
margin-bottom: 0;
}
.block-cards .block-cards-link {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 0 2px;
font-weight: 700;
font-size: var(--14px);
text-decoration: none;
color: var(--green);
border-bottom: 4px solid var(--green);
}
.block-cards .block-cards-link:hover {
color: var(--green-light);
border-color: var(--green-light);
}
.block-cards .block-cards-link svg {
width: 12px;
transition: transform 0.3s ease;
}
.block-cards .block-cards-link:hover svg {
transform: translateX(3px);
}
@media (max-width: 992px) {
.block-cards .block-cards-columns-3,
.block-cards .block-cards-columns-4 {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 600px) {
.block-cards .block-cards-row {
grid-template-columns: 1fr;
gap: 20px;
}
.block-cards .block-cards-item {
padding: 24px;
}
.block-cards .block-cards-style-plain {
gap: 32px;
}
}
/*-----------------------------------------------------------------------
Block: Call to Action
-----------------------------------------------------------------------*/
.block-cta .block-cta-row {
display: flex;
flex-direction: column;
align-items: center;
gap: 32px;
text-align: center;
}
.block-cta .block-cta-content {
max-width: 800px;
}
.block-cta .block-cta-content > :last-child {
margin-bottom: 0;
}
.block-cta .block-cta-split {
flex-direction: row;
justify-content: space-between;
gap: 40px;
text-align: left;
}
.block-cta .block-cta-split .block-cta-content {
flex: 1;
}
.block-cta .block-cta-actions {
flex: none;
}
@media (max-width: 992px) {
.block-cta .block-cta-split {
flex-direction: column;
align-items: flex-start;
}
}
/*-----------------------------------------------------------------------
Block: Post Feed
-----------------------------------------------------------------------*/
/* Slider */
.block-post-feed .block-post-feed-swiper {
--post-slide-width: min(920px, calc(100vw - 240px));
position: relative;
overflow: hidden;
padding: 0;
}
.block-post-feed .post-slide {
width: var(--post-slide-width);
margin-top: 100px;
transition: margin-top 0.6s ease;
}
.block-post-feed .post-slide.swiper-slide-active {
margin-top: 0;
}
.block-post-feed .post-slide-perma {
display: block;
position: relative;
color: var(--green);
}
.block-post-feed .post-slide-image {
aspect-ratio: 1000 / 430;
overflow: hidden;
background-color: var(--green-dark);
}
.block-post-feed .post-slide-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.block-post-feed .post-slide-perma:hover .post-slide-image img {
transform: scale(1.04);
}
.block-post-feed .post-slide-panel {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 280px;
padding: 20px 32px 24px;
background-color: var(--post-slide-color, var(--cream));
color: var(--green);
display: flex;
flex-direction: column;
align-items: flex-start;
overflow: hidden;
}
.block-post-feed .post-slide.is-dark .post-slide-panel {
color: var(--white);
}
.block-post-feed .post-slide-panel .post-category {
background-color: rgb(from var(--black) r g b / 0.08);
color: inherit;
}
.block-post-feed .post-slide-panel h3 {
position: relative;
z-index: 1;
font-family: var(--font-primary);
font-weight: 600;
font-size: var(--26px);
line-height: 1.4;
color: inherit;
margin: 72px 0 24px;
}
.block-post-feed .post-slide-more {
position: relative;
z-index: 1;
margin-top: auto;
padding: 8px 0 2px;
font-weight: 700;
font-size: var(--14px);
line-height: 1.4;
color: inherit;
border-bottom: 4px solid currentColor;
transition: color 0.3s ease;
}
.block-post-feed .post-slide-shape {
position: absolute;
right: 0;
bottom: -8px;
width: 240px;
height: 141px;
color: rgb(from var(--black) r g b / 0.07);
pointer-events: none;
}
.block-post-feed .post-slide-shape svg {
display: block;
width: 100%;
height: 100%;
}
.block-post-feed .block-post-feed-swiper .swiper-button-prev,
.block-post-feed .block-post-feed-swiper .swiper-button-next {
position: absolute;
top: calc(50% - 50px);
margin: 0;
z-index: 2;
}
.block-post-feed .block-post-feed-swiper .swiper-button-prev {
left: calc(50% - var(--post-slide-width) / 2 - 76px);
right: auto;
transform: translate(-50%, -50%);
}
.block-post-feed .block-post-feed-swiper .swiper-button-next {
right: calc(50% - var(--post-slide-width) / 2 - 76px);
left: auto;
transform: translate(50%, -50%);
}
.block-post-feed-slider .swiper-pagination {
position: static;
margin: 32px 0 0;
}
@media (max-width: 1200px) {
.block-post-feed .block-post-feed-swiper {
--post-slide-width: calc(100vw - 160px);
}
.block-post-feed .post-slide {
margin-top: 0;
}
.block-post-feed .block-post-feed-swiper .swiper-button-prev,
.block-post-feed .block-post-feed-swiper .swiper-button-next {
top: 50%;
}
.block-post-feed .block-post-feed-swiper .swiper-button-prev {
left: 16px;
transform: translate(0, -50%);
}
.block-post-feed .block-post-feed-swiper .swiper-button-next {
right: 16px;
transform: translate(0, -50%);
}
}
@media (max-width: 768px) {
.block-post-feed .block-post-feed-swiper {
--post-slide-width: calc(100vw - 80px);
}
.block-post-feed .post-slide-image {
aspect-ratio: 4 / 3;
}
.block-post-feed .post-slide-panel {
position: static;
width: 100%;
padding: 24px 24px 28px;
}
.block-post-feed .post-slide-panel h3 {
margin: 16px 0 24px;
font-size: var(--22px);
}
.block-post-feed .post-slide-shape {
width: 160px;
height: 94px;
}
.block-post-feed .block-post-feed-swiper .swiper-button-prev,
.block-post-feed .block-post-feed-swiper .swiper-button-next {
top: calc(var(--post-slide-width) * 0.375);
}
.block-post-feed .block-post-feed-swiper .swiper-button-prev {
left: 8px;
right: auto;
}
.block-post-feed .block-post-feed-swiper .swiper-button-next {
right: 8px;
left: auto;
}
}
/*-----------------------------------------------------------------------
Block: Service Feed
-----------------------------------------------------------------------*/
.block-service-feed .block-service-feed-row {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 60px 64px;
}
.block-service-feed .block-service-feed-item {
position: relative;
overflow: hidden;
aspect-ratio: 564 / 388;
background-color: var(--grey);
}
.block-service-feed .block-service-feed-item:nth-child(4n+3),
.block-service-feed .block-service-feed-item:nth-child(4n+4) {
left: 120px;
}
.block-service-feed .block-service-feed-media {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-service-feed .block-service-feed-media img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
/* The whole tile links to the service; the title link stays the one in the tab order */
.block-service-feed .block-service-feed-cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
.block-service-feed .block-service-feed-item:hover .block-service-feed-media img {
transform: scale(1.05);
}
.block-service-feed .block-service-feed-item:hover .block-service-feed-info h3 a,
.block-service-feed .block-service-feed-item:hover .block-service-feed-toggle {
color: var(--green-dark);
}
.block-service-feed .block-service-feed-media svg {
position: absolute;
top: 0;
left: 0;
width: auto;
height: 100%;
aspect-ratio: 406 / 388;
color: var(--block-service-feed-color, var(--green-light));
}
.block-service-feed .block-service-feed-info {
position: absolute;
left: 0;
bottom: 0;
z-index: 1;
width: 60%;
padding: 0 32px 32px;
}
.block-service-feed .block-service-feed-info h3 {
font-family: var(--font-primary);
font-weight: 600;
font-size: var(--26px);
line-height: 1.35;
color: var(--green);
max-width: 252px;
margin: 0 0 56px;
overflow-wrap: normal;
}
.block-service-feed .block-service-feed-info h3 a {
color: var(--green);
}
.block-service-feed .block-service-feed-info h3 a:hover {
color: var(--green-dark);
}
.block-service-feed .block-service-feed-toggle {
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
min-width: 0;
padding: 0;
background: none;
border: none;
color: var(--green);
transition: transform 0.3s ease, color 0.3s ease;
}
.block-service-feed .block-service-feed-toggle svg {
width: 28px;
height: 28px;
}
.block-service-feed .block-service-feed-toggle:hover {
background: none;
}
.block-service-feed .block-service-feed-toggle:focus-visible {
outline: 2px solid var(--green);
outline-offset: 4px;
}
/* Overlay */
.block-service-feed .block-service-feed-overlay {
position: absolute;
left: 0;
right: 0;
bottom: 0;
z-index: 2;
height: 0;
overflow: hidden;
background-color: var(--green);
transition: height 0.5s ease;
}
.block-service-feed .block-service-feed-item.active .block-service-feed-overlay {
height: 100%;
}
.block-service-feed .block-service-feed-overlay-inner {
display: flex;
align-items: center;
gap: 24px 40px;
height: 100%;
padding: 32px 32px 80px;
}
.block-service-feed .block-service-feed-overlay h3 {
flex: 0 0 40%;
font-family: var(--font-primary);
font-weight: 600;
font-size: var(--26px);
line-height: 1.35;
color: var(--green-light);
margin: 0;
}
.block-service-feed .block-service-feed-summary {
flex: 1;
}
.block-service-feed .block-service-feed-summary p {
color: var(--white);
font-weight: 300;
font-size: var(--16px);
margin: 0 0 20px;
}
.block-service-feed .block-service-feed-link {
display: inline-block;
padding: 8px 0 2px;
color: var(--white);
font-weight: 700;
font-size: var(--14px);
line-height: 1.4;
border-bottom: 4px solid var(--white);
transition: color 0.3s ease, border-color 0.3s ease;
}
.block-service-feed .block-service-feed-link:hover {
color: var(--green-light);
border-color: var(--green-light);
}
.block-service-feed .block-service-feed-close {
position: absolute;
left: 32px;
bottom: 24px;
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
min-width: 0;
padding: 0;
background: none;
border: none;
color: var(--green-light);
}
.block-service-feed .block-service-feed-close svg {
width: 24px;
height: 24px;
}
.block-service-feed .block-service-feed-close:hover {
background: none;
color: var(--white);
}
.block-service-feed .block-service-feed-close:focus-visible {
outline: 2px solid var(--white);
outline-offset: 4px;
}
@media (max-width: 1600px) {
.block-service-feed .block-service-feed-item:nth-child(4n+3),
.block-service-feed .block-service-feed-item:nth-child(4n+4) {
left: 0;
}
}
@media (max-width: 1200px) {
.block-service-feed .block-service-feed-row {
gap: 40px;
}
.block-service-feed .block-service-feed-info {
width: 70%;
padding: 0 24px 24px;
}
.block-service-feed .block-service-feed-info h3 {
font-size: var(--22px);
margin: 0 0 32px;
}
}
@media (max-width: 768px) {
.block-service-feed .block-service-feed-info h3 {
font-size: var(--20px);
}
}
@media (max-width: 600px) {
.block-service-feed .block-service-feed-row {
grid-template-columns: minmax(0, 1fr);
gap: 24px;
}
.block-service-feed .block-service-feed-item {
aspect-ratio: 4 / 3;
}
.block-service-feed .block-service-feed-info {
padding: 0 24px 20px;
width: 70%;
}
.block-service-feed .block-service-feed-info h3 {
font-size: var(--22px);
margin: 0 0 16px;
}
.block-service-feed .block-service-feed-overlay-inner {
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 12px;
padding: 24px 24px 64px;
}
.block-service-feed .block-service-feed-overlay h3 {
flex: none;
font-size: var(--22px);
}
.block-service-feed .block-service-feed-summary p {
font-size: var(--15px);
margin: 0 0 12px;
}
.block-service-feed .block-service-feed-close {
left: 24px;
bottom: 20px;
}
}
/*-----------------------------------------------------------------------
Block: Team
-----------------------------------------------------------------------*/
.block-team .block-team-row {
display: flex;
align-items: flex-start;
gap: 40px 80px;
}
.block-team .block-team-intro {
flex: 0 0 calc(33.33333% - 40px);
}
.block-team .block-team-list {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 32px;
}
.block-team .block-team-card {
display: flex;
}
.block-team .block-team-photo {
position: relative;
flex: 0 0 40%;
min-height: 250px;
background-color: var(--grey);
}
.block-team .block-team-photo img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.block-team .block-team-info {
flex: 1;
background-color: var(--cream);
padding: 48px 32px 32px 44px;
}
.block-team .block-team-info h3 {
color: var(--green-dark);
margin: 0 0 4px;
}
.block-team .block-team-role {
font-family: var(--font-secondary);
font-weight: 500;
font-size: var(--16px);
color: var(--green-dark);
margin: 0 0 20px;
}
.block-team .block-team-toggle {
min-width: 0;
padding: 8px 0 2px;
background: none;
border: none;
border-bottom: 4px solid var(--green-dark);
border-radius: 0;
font-weight: 700;
font-size: var(--14px);
line-height: 1.4;
color: var(--green-dark);
}
.block-team .block-team-toggle:hover {
background: none;
color: var(--green-light);
border-color: var(--green-light);
}
.block-team .block-team-toggle:focus-visible {
outline: 2px solid var(--green-dark);
outline-offset: 4px;
}
/* Bio */
.block-team .block-team-bio {
display: grid;
grid-template-rows: 0fr;
visibility: hidden;
transition: grid-template-rows 0.3s ease, visibility 0s 0.3s;
}
.block-team .block-team-member.active .block-team-bio {
grid-template-rows: 1fr;
visibility: visible;
transition: grid-template-rows 0.3s ease, visibility 0s;
}
.block-team .block-team-bio-inner {
position: relative;
overflow: hidden;
background-color: var(--white);
}
.block-team .block-team-bio-inner > .wysiwyg-content {
padding: 40px 72px 32px 40px;
}
.block-team .block-team-bio-inner > .wysiwyg-content:last-child {
padding-bottom: 40px;
}
.block-team .block-team-socials {
display: flex;
gap: 8px;
padding: 0 40px 40px;
}
.block-team .block-team-socials a {
display: flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
border-radius: 100%;
background-color: var(--green-light);
color: var(--white);
}
.block-team .block-team-socials a svg {
width: 12px;
height: 12px;
}
.block-team .block-team-socials a:hover {
background-color: var(--green);
color: var(--white);
}
.block-team .block-team-close {
position: absolute;
top: 24px;
right: 24px;
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
min-width: 0;
padding: 0;
background: none;
border: none;
color: var(--green-dark);
}
.block-team .block-team-close svg {
width: 20px;
height: 20px;
}
.block-team .block-team-close:hover {
background: none;
color: var(--green-light);
}
@media (max-width: 992px) {
.block-team .block-team-row {
flex-wrap: wrap;
}
.block-team .block-team-intro,
.block-team .block-team-list {
flex: 100%;
}
}
@media (max-width: 600px) {
.block-team .block-team-card {
flex-direction: column;
}
.block-team .block-team-photo {
flex: none;
}
.block-team .block-team-photo img {
aspect-ratio: 4 / 3;
min-height: 0;
}
.block-team .block-team-info {
padding: 24px;
}
.block-team .block-team-bio-inner > .wysiwyg-content {
padding: 24px 56px 24px 24px;
}
.block-team .block-team-socials {
padding: 0 24px 24px;
}
.block-team .block-team-close {
top: 16px;
right: 16px;
}
}
/*-----------------------------------------------------------------------
Block: Numbered Cards
-----------------------------------------------------------------------*/
.block-numbered-cards .block-numbered-cards-swiper {
overflow: hidden;
}
.block-numbered-cards .swiper-slide {
height: auto;
}
.block-numbered-cards .block-numbered-cards-item {
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: flex-end;
height: 100%;
min-height: 368px;
padding: 32px;
background-color: var(--block-numbered-cards-color, var(--green-light));
}
.block-numbered-cards .block-numbered-cards-number {
position: absolute;
top: -36px;
left: -8px;
font-family: var(--font-secondary);
font-weight: 500;
font-size: var(--228px);
line-height: 1;
color: var(--green-dark);
opacity: 0.1;
pointer-events: none;
}
.block-numbered-cards .block-numbered-cards-item h3 {
position: relative;
font-family: var(--font-secondary);
font-weight: 500;
font-size: var(--28px);
line-height: 1.25;
color: var(--green-dark);
margin: auto 0;
padding: 0 0 48px;
}
.block-numbered-cards .block-numbered-cards-item .button {
position: relative;
align-self: flex-start;
}
.block-numbered-cards .block-numbered-cards-nav {
display: flex;
gap: 16px;
margin: 48px 0 0;
}
.block-numbered-cards .block-numbered-cards-nav:has(.swiper-button-lock) {
display: none;
}
.block-numbered-cards .block-numbered-cards-nav .swiper-button-prev,
.block-numbered-cards .block-numbered-cards-nav .swiper-button-next {
position: static;
transform: none;
}
@media (max-width: 992px) {
.block-numbered-cards .block-numbered-cards-item {
min-height: 320px;
padding: 24px;
}
.block-numbered-cards .block-numbered-cards-item h3 {
font-size: var(--24px);
padding: 0 0 32px;
}
.block-numbered-cards .block-numbered-cards-nav {
margin: 32px 0 0;
}
}
/*-----------------------------------------------------------------------
Block: Events
-----------------------------------------------------------------------*/
.block-events .block-events-row {
display: flex;
align-items: flex-start;
gap: 40px 80px;
}
.block-events .block-events-intro {
flex: 0 0 calc(33.33333% - 40px);
}
.block-events .block-events-list {
flex: 1;
min-width: 0;
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 24px;
}
.block-events .block-events-title {
display: block;
font-weight: 700;
font-size: var(--30px);
line-height: 1.3;
color: var(--green);
margin: 0 0 4px;
}
.block-events .block-events-item a {
color: var(--black);
text-decoration: underline;
}
.block-events .block-events-item a:hover {
color: var(--green);
}
@media (max-width: 992px) {
.block-events .block-events-row {
flex-wrap: wrap;
}
.block-events .block-events-intro,
.block-events .block-events-list {
flex: 100%;
}
.block-events .block-events-title {
font-size: var(--24px);
}
}
/*-----------------------------------------------------------------------
Block: Gravity Forms
-----------------------------------------------------------------------*/
.block-form-embed-details .block-form-embed-row {
display: flex;
align-items: flex-start;
gap: 40px 80px;
}
.block-form-embed-details .block-form-embed-main {
flex: 1;
min-width: 0;
}
.block-form-embed-details .block-form-embed-aside {
flex: 0 0 360px;
background-color: var(--white);
padding: 40px 24px;
}
.block-form-embed-details .block-form-embed-aside h3 {
color: var(--green-dark);
margin: 0 0 20px;
}
.block-form-embed-details .block-form-embed-aside h3 + .block-form-embed-details,
.block-form-embed-details .block-form-embed-aside .block-form-embed-details + h3 {
margin-top: 32px;
}
.block-form-embed-details .block-form-embed-aside ul.block-form-embed-details {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 20px;
}
.block-form-embed-details .block-form-embed-aside ul.block-form-embed-details li {
display: flex;
align-items: center;
gap: 12px;
font-size: var(--16px);
line-height: 1.5;
color: var(--black);
min-width: 0;
overflow-wrap: anywhere;
}
.block-form-embed-details .block-form-embed-aside ul.block-form-embed-details li svg {
flex-shrink: 0;
width: 36px;
height: 36px;
padding: 8px;
border-radius: 100%;
background-color: rgb(from var(--green-light) r g b / 0.55);
color: var(--green);
}
.block-form-embed-details .block-form-embed-aside ul.block-form-embed-details li a {
color: var(--black);
text-decoration: underline;
}
.block-form-embed-details .block-form-embed-aside ul.block-form-embed-details li a:hover {
color: var(--green);
}
.block-form-embed-details .block-form-embed-map {
margin: 24px 0 0;
}
.block-form-embed-details .block-form-embed-map iframe {
display: block;
width: 100%;
height: 240px;
border: 0;
}
@media (max-width: 992px) {
.block-form-embed-details .block-form-embed-row {
flex-wrap: wrap;
}
.block-form-embed-details .block-form-embed-main,
.block-form-embed-details .block-form-embed-aside {
flex: 100%;
}
}
/*-----------------------------------------------------------------------
Block: Container Queries
-----------------------------------------------------------------------*/
/* Grids stack earlier inside a narrow container setting (w800, w1000) */
.block-cards .container,
.block-multicolumn .container,
.block-post-feed .container {
container-type: inline-size;
}
@media (min-width: 993px) {
@container (max-width: 1000px) {
.block-cards .block-cards-row.block-cards-columns-3,
.block-cards .block-cards-row.block-cards-columns-4 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.block-post-feed .post-entry-row .post-entry {
flex: 0 0 calc(50% - 24px);
}
}
}
@media (min-width: 769px) {
@container (max-width: 1000px) {
.block-multicolumn .block-setting-multicolumn-3 .block-multicolumn-col {
flex: 0 0 calc(50% - 30px);
}
.block-multicolumn .block-setting-multicolumn-4 .block-multicolumn-col {
flex: 0 0 calc(50% - 20px);
}
}
}
@container (max-width: 560px) {
.block-cards .block-cards-row {
grid-template-columns: minmax(0, 1fr);
}
.block-multicolumn .block-multicolumn-row .block-multicolumn-col {
flex: 100%;
}
.block-post-feed .post-entry-row .post-entry {
flex: 100%;
}
}
/*--------------------------------------------------------------
Post: Archive
--------------------------------------------------------------*/
/* Main */
.post-archive .post-archive-main {
padding: 80px 0 100px;
}
/* Filter */
.post-archive-filter {
display: flex;
justify-content: center;
align-content: center;
flex-wrap: wrap;
gap: 20px 30px;
margin: 0 0 72px;
}
.post-archive-filter a {
display: flex;
align-items: center;
justify-content: center;
min-width: 164px;
padding: 10px 24px;
background-color: transparent;
border: 2px solid var(--post-category-color, var(--green-light));
border-radius: 24px;
color: var(--green);
font-family: var(--font-secondary);
font-weight: 600;
font-size: var(--12px);
letter-spacing: 1.6px;
text-transform: uppercase;
line-height: 22px;
text-align: center;
}
.post-archive-filter a:hover,
.post-archive-filter a.active {
background-color: var(--black);
border-color: var(--black);
color: var(--white);
}
/* Pagination */
.post-archive-pagination {
display: flex;
justify-content: center;
margin: 60px 0 0;
}
.post-archive-pagination .post-archive-pagination-inner {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.post-archive-pagination .post-archive-pagination-inner > span,
.post-archive-pagination .post-archive-pagination-inner a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 40px;
min-height: 40px;
padding: 0 12px;
border-radius: 20px;
background-color: var(--green-dark);
color: var(--white);
text-decoration: none;
font-family: var(--font-secondary);
font-weight: 500;
font-size: var(--16px);
line-height: 1;
}
.post-archive-pagination .post-archive-pagination-inner a:hover,
.post-archive-pagination .post-archive-pagination-inner .current {
background-color: var(--green-light);
color: var(--green);
}
.post-archive-pagination .post-archive-pagination-inner .nav-prev,
.post-archive-pagination .post-archive-pagination-inner .nav-next {
padding: 0 20px;
}
.post-archive-pagination .post-archive-pagination-inner span.nav-prev,
.post-archive-pagination .post-archive-pagination-inner span.nav-next {
opacity: 0.5;
}
.post-archive-pagination .post-archive-pagination-inner .dots {
background: none;
color: var(--green-dark);
min-width: 0;
padding: 0;
}
@media (max-width: 768px) {
.post-archive .post-archive-main {
padding: 60px 0 80px;
}
.post-archive-filter {
gap: 12px;
margin: 0 0 48px;
}
.post-archive-filter a {
min-width: 0;
padding: 8px 20px;
}
}
/* Category chips */
.post-categories {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.post-category {
display: inline-block;
padding: 4px 16px;
border-radius: 16px;
background-color: var(--post-category-color, var(--cream));
color: var(--green);
font-family: var(--font-secondary);
font-weight: 600;
font-size: var(--12px);
letter-spacing: 1.6px;
text-transform: uppercase;
line-height: 22px;
}
.post-category.is-dark {
color: var(--white);
}
/*--------------------------------------------------------------
Post: Entry
--------------------------------------------------------------*/
.post-entry-row {
display: flex;
flex-wrap: wrap;
gap: 50px 48px;
}
.post-entry {
display: flex;
flex: 0 0 calc(33.33333% - 32px);
}
.post-entry .post-entry-perma {
display: flex;
flex-direction: column;
width: 100%;
color: var(--green);
}
.post-entry .post-entry-image {
aspect-ratio: 400 / 280;
overflow: hidden;
background-color: var(--green-dark);
}
.post-entry .post-entry-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.post-entry .post-entry-perma:hover .post-entry-image img {
transform: scale(1.04);
}
.post-entry .post-entry-body {
flex: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
padding: 24px 32px 28px;
background-color: var(--cream);
}
.block-post-feed-cards-white .post-entry .post-entry-body {
background-color: var(--white);
}
.post-entry .post-entry-body h3 {
color: var(--green);
margin: 0;
}
.post-entry .post-entry-more {
margin-top: auto;
padding: 8px 0 2px;
font-weight: 700;
font-size: var(--14px);
line-height: 1.4;
color: var(--green);
border-bottom: 4px solid var(--green);
transition: color 0.3s ease, border-color 0.3s ease;
}
.post-entry .post-entry-perma:hover .post-entry-more {
color: var(--green-light);
border-color: var(--green-light);
}
@media (max-width: 992px) {
.post-entry-row {
gap: 32px;
}
.post-entry {
flex: 0 0 calc(50% - 16px);
}
}
@media (max-width: 600px) {
.post-entry {
flex: 100%;
}
.post-entry .post-entry-body {
padding: 20px 24px 24px;
}
}
/*--------------------------------------------------------------
Post: Single
--------------------------------------------------------------*/
/* Navigation */
.post-single .post-single-nav {
padding: 0 0 80px;
}
.post-single .post-single-nav .post-navigation {
border-top: 1px solid var(--black);
padding: 30px 0 0;
}
.post-single .post-single-nav .nav-links {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 16px;
}
.post-single .post-single-nav .nav-previous {
margin: 0 auto 0 0;
}
.post-single .post-single-nav .nav-next {
margin: 0 0 0 auto;
}
.post-single .post-single-nav a {
display: inline-block;
line-height: 20px;
text-transform: uppercase;
color: var(--black);
}
.post-single .post-single-nav a:hover {
color: var(--green-light);
}
@media (max-width: 768px) {
.post-single .post-single-nav {
padding: 0 0 60px;
}
}
/*--------------------------------------------------------------
Post: Search
--------------------------------------------------------------*/
/* Archive */
.search-archive {
padding: 100px 0;
}
.search-archive .search-archive-header {
text-align: center;
margin: 0 0 60px;
}
.search-archive .search-archive-header h1 {
margin: 0;
}
@media (max-width: 768px) {
.search-archive {
padding: 60px 0;
}
.search-archive .search-archive-header {
margin: 0 0 40px;
}
}
/* Entry */
.search-entry {
display: block;
background-color: var(--white);
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.12);
border-radius: 6px;
margin: 0 0 12px;
text-align: center;
transition: background-color 0.3s ease;
}
.search-entry:hover {
background-color: var(--black);
}
.search-entry a {
display: block;
padding: 24px 32px;
}
.search-entry .h4 {
transition: color 0.3s ease;
}
.search-entry:hover .h4 {
color: var(--white);
}
.search-entry h3 {
margin: 0;
transition: color 0.3s ease;
}
.search-entry:hover h3 {
color: var(--white);
}
/* Search */
.no-results .search-form {
position: relative;
}
.no-results .search-form input[type="search"] {
border-color: var(--black);
padding: 24px 168px 24px 24px;
}
.no-results .search-form input[type="search"]:focus {
border-color: var(--green-light);
}
.no-results .search-form button[type="submit"] {
position: absolute;
right: 14px;
bottom: 10px;
}
@media (max-width: 460px) {
.no-results .search-form input[type="search"] {
padding: 14px 24px;
}
.no-results .search-form button[type="submit"] {
position: static;
margin: 8px 0 0;
width: 100%;
}
}
/*-----------------------------------------------------------------------
Editor Canvas
-----------------------------------------------------------------------*/
.edit-post-visual-editor__post-title-wrapper {
background-color: var(--white);
color: var(--black);
margin: 0 !important;
padding: 0 !important;
}
.edit-post-visual-editor__post-title-wrapper h1.wp-block-post-title {
font-size: var(--24px);
line-height: 28px;
background-color: var(--white);
padding: 10px 30px !important;
max-width: 100% !important;
width: 100% !important;
border-bottom: 1px solid #e0e0e0 !important;
margin: 0 !important;
}
.editor-styles-wrapper {
font-optical-sizing: auto;
-webkit-text-size-adjust: none;
-webkit-font-smoothing: antialiased;
font-family: var(--font-primary) !important;
font-size: var(--18px) !important;
color: var(--black);
line-height: 1.5;
font-weight: 400;
margin: 0 !important;
padding: 0 !important;
}
.wp-block-post-content {
background-color: var(--white);
}
.wp-block-post-content > div {
margin: 0 auto;
max-width: calc(100% - 60px);
width: calc(100% - 60px);
}
.wp-block-post-content.is-tablet-preview > div,
.wp-block-post-content.is-mobile-preview > div {
max-width: 100%;
width: 100%;
}
.wp-block-post-content .wp-block {
max-width: 100%;
width: 100%;
margin: 0;
}
.acf-block-body .acf-block-fields {
z-index: 99999999 !important;
}
.wp-block .acf-input select {
max-width: 100%;
}
.editor-styles-wrapper .swiper .swiper-wrapper {
pointer-events: none;
}
.hide-block--active {
opacity: 0.35;
}