/*--------------------------------------------------------------
Variables
--------------------------------------------------------------*/
:root {
--header-height: 100px;
--admin-bar-height: 32px;
--announcement-bar-height: 0px;
/* Colors */
--white: #FFF;
--white-rgb: 255, 255, 255;
--black: #000;
--black-rgb: 0, 0, 0;
--grey: #EEE;
--grey-rgb: 238, 238, 238;
--red: #FF1414;
--red-rgb: 255, 20, 20;
--onyx: #201B1C;
--onyx-rgb: 32, 27, 28;
--sage: #80A7A1;
--sage-rgb: 128, 167, 161;
--off-white: #FDF8F6;
--off-white-rgb: 253, 248, 246;
--clay: #FFE8CE;
--clay-rgb: 255, 232, 206;
--light-clay: #FFF1E2;
--light-clay-rgb: 255, 241, 226;
--blush: #E0A48B;
--blush-rgb: 224, 164, 139;
--terracotta: #DE7141;
--terracotta-rgb: 222, 113, 65;
--honeycomb: #D28618;
--honeycomb-rgb: 210, 134, 24;
--walnut: #7D4832;
--walnut-rgb: 125, 72, 50;
/* Typography */
--font-primary: 'Poppins', sans-serif;
--font-secondary: 'the-seasons', 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;
--35px: 2.1875rem;
--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;
--85px: 5.3125rem;
--90px: 5.625rem;
--100px: 6.25rem;
}
@media (max-width: 992px) {
:root {
--header-height: 70px;
}
}
@media (max-width: 782px) {
:root {
--admin-bar-height: 46px;
}
}
/*--------------------------------------------------------------
Base
--------------------------------------------------------------*/
* {
scrollbar-width: thin;
scrollbar-color: var(--onyx) transparent;
}
body.block-theme * {
cursor: none !important;
}
.block-theme *,
.block-theme *:before,
.block-theme *:after {
box-sizing: border-box;
}
.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');
}
.block-theme hr {
background-color: var(--grey);
border: 0;
height: 1px;
margin: 40px 0;
}
/*--------------------------------------------------------------
Cursor
--------------------------------------------------------------*/
.cursor,
.cursor span {
width: 10px;
height: 10px;
border-radius: 100%;
background-color: var(--honeycomb);
position: fixed;
pointer-events: none;
z-index: 9999;
transform: translate(-50%, -50%);
transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease;
}
.cursor {
top: 0;
left: 0;
backdrop-filter: blur(2px);
}
.cursor span {
top: 50%;
left: 50%;
}
.cursor.cursor-hover {
width: 48px;
height: 48px;
background-color: rgba(var(--honeycomb-rgb), 0.2);
}
.cursor.cursor-large {
width: 100px;
height: 100px;
}
.cursor.cursor-large span {
display: none;
}
.cursor-label {
position: fixed;
top: 0;
left: 0;
pointer-events: none;
z-index: 10000;
opacity: 0;
font-size: var(--15px);
color: var(--white);
text-transform: uppercase;
text-align: center;
transition: opacity 0.3s ease;
will-change: transform;
line-height: 1.2;
max-width: 100px;
}
.cursor.cursor-slider {
width: 48px;
height: 48px;
background-color: rgba(var(--honeycomb-rgb), 0.2);
}
.cursor span:before,
.cursor span:after {
content: '';
position: absolute;
top: 50%;
left: 0;
right: 0;
transform: translateY(-50%);
transition: left 0.3s ease, right 0.3s ease;
}
.cursor.cursor-slider span:before {
left: -36px;
right: auto;
border-style: solid;
border-width: 5px 10px 5px 0;
border-color: transparent var(--honeycomb) transparent transparent;
}
.cursor.cursor-slider span:after {
right: -36px;
left: auto;
border-style: solid;
border-width: 5px 0 5px 10px;
border-color: transparent transparent transparent var(--honeycomb);
}
.cursor-disable,
.cursor-disable * {
cursor: auto !important;
}
/*--------------------------------------------------------------
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-family: var(--font-secondary);
font-weight: 700;
text-transform: uppercase;
color: var(--onyx);
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(--50px);
}
.block-theme h3,
.block-theme .h3 {
font-size: var(--35px);
}
.block-theme h4,
.block-theme .h4 {
font-size: var(--25px);
}
.block-theme h5,
.block-theme .h5 {
font-size: var(--20px);
}
.block-theme h6,
.block-theme .h6 {
font-size: var(--18px);
}
@media (max-width: 768px) {
.block-theme h1,
.block-theme .h1 {
font-size: var(--40px);
}
.block-theme h2,
.block-theme .h2 {
font-size: var(--35px);
}
.block-theme h3,
.block-theme .h3 {
font-size: var(--30px);
}
.block-theme h4,
.block-theme .h4 {
font-size: var(--20px);
}
.block-theme h5,
.block-theme .h5 {
font-size: var(--18px);
}
.block-theme h6,
.block-theme .h6 {
font-size: var(--17px);
}
}
/* Styled */
.block-theme .typo-copy-small,
.block-theme .typo-copy-small p {
font-size: var(--15px);
line-height: 1.5;
}
.block-theme .typo-copy-large,
.block-theme .typo-copy-large p {
font-size: var(--25px);
line-height: 1.5;
}
.block-theme .typo-copy-intro,
.block-theme .typo-copy-intro p {
font-size: var(--20px);
line-height: 1.5;
text-transform: uppercase;
}
@media (max-width: 768px) {
.block-theme .typo-copy-large,
.block-theme .typo-copy-large p {
font-size: var(--20px);
}
.block-theme .typo-copy-intro,
.block-theme .typo-copy-intro p {
font-size: var(--18px);
}
}
/* Other */
.block-theme ul,
.block-theme ol,
.block-theme li {
list-style: none;
margin: 0;
padding: 0;
}
.block-theme p {
font-size: var(--18px);
font-weight: 400;
color: var(--onyx);
line-height: 1.5;
margin: 0 0 16px;
}
@media (max-width: 768px) {
.block-theme p {
font-size: var(--16px);
}
}
/* Blockquote */
.block-theme blockquote {
margin: 32px 0;
padding: 0 0 0 24px;
border-left: 2px solid var(--onyx);
}
.block-theme blockquote p {
font-size: var(--24px);
font-weight: 500;
margin: 0;
line-height: 1.3 !important;
color: var(--onyx);
}
.block-theme blockquote cite {
font-size: var(--18px);
font-weight: 500;
font-style: normal;
margin: 16px 0 0;
display: block;
}
@media (max-width: 768px) {
.block-theme blockquote p {
font-size: var(--20px);
}
.block-theme blockquote cite {
font-size: var(--16px);
}
}
/*--------------------------------------------------------------
Links/Buttons
--------------------------------------------------------------*/
/* Links */
.block-theme a {
color: var(--onyx);
text-decoration: none;
cursor: pointer;
}
.block-theme a:hover {
color: var(--sage);
}
.block-theme p a,
.block-theme li a {
text-decoration: underline;
}
.block-theme p a:hover,
.block-theme li a:hover {
color: var(--sage);
}
.block-theme .block-setting-theme-dark p a:hover,
.block-theme .block-setting-theme-dark li a:hover {
color: var(--white) !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(--sage);
}
.block-theme .arrow-link {
display: inline-flex;
align-items: center;
justify-content: center;
white-space: nowrap;
gap: 6px;
color: var(--onyx);
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"] {
outline: none;
display: inline-block;
position: relative;
padding: 10px 30px;
font-size: var(--15px);
font-weight: 400;
background-color: transparent;
border: 1px solid var(--sage);
border-radius: 100px !important;
color: var(--onyx);
text-transform: uppercase;
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(--sage);
border-color: var(--sage);
color: var(--white);
}
.block-theme .btn-loader {
display: none;
position: absolute;
left: calc(50% - 7.5px);
top: calc(50% - 7.5px);
}
.block-theme .button.disabled,
.block-theme button.disabled {
opacity: 0.5;
pointer-events: none;
}
/* Coloured Buttons */
.block-theme .button.sage,
.block-theme button.sage {
background-color: var(--sage);
border-color: var(--sage);
color: var(--white);
}
.block-theme .button.sage:hover,
.block-theme button.sage:hover {
background-color: var(--onyx);
border-color: var(--onyx);
color: var(--white);
}
.block-theme .button.white,
.block-theme button.white {
background-color: var(--white);
border-color: var(--white);
color: var(--onyx);
}
.block-theme .button.white:hover,
.block-theme button.white:hover {
background-color: var(--clay);
border-color: var(--clay);
color: var(--onyx);
}
.block-theme .button.clay,
.block-theme button.clay {
background-color: var(--clay);
border-color: var(--clay);
color: var(--onyx);
}
.block-theme .button.clay:hover,
.block-theme button.clay:hover {
background-color: var(--off-white);
border-color: var(--off-white);
color: var(--onyx);
}
.block-theme .button.onyx,
.block-theme button.onyx {
background-color: var(--onyx);
border-color: var(--onyx);
color: var(--white);
}
.block-theme .button.onyx:hover,
.block-theme button.onyx:hover {
background-color: var(--sage);
border-color: var(--sage);
color: var(--white);
}
/* Ghost Buttons */
.block-theme .button.ghost,
.block-theme button.ghost {
background-color: transparent;
border: 1px solid var(--sage);
color: var(--onyx);
}
.block-theme .button.ghost:hover,
.block-theme button.ghost:hover {
background-color: var(--sage);
border-color: var(--sage);
color: var(--white);
}
.block-theme .button.ghost.sage,
.block-theme button.ghost.sage {
border-color: var(--sage);
color: var(--onyx);
}
.block-theme .button.ghost.sage:hover,
.block-theme button.ghost.sage:hover {
background-color: var(--sage);
border-color: var(--sage);
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(--onyx);
}
.block-theme .button.ghost.clay,
.block-theme button.ghost.clay {
border-color: var(--clay);
color: var(--white);
}
.block-theme .button.ghost.clay:hover,
.block-theme button.ghost.clay:hover {
background-color: var(--clay);
border-color: var(--clay);
color: var(--onyx);
}
.block-theme .button.ghost.onyx,
.block-theme button.ghost.onyx {
border-color: var(--onyx);
color: var(--onyx);
}
.block-theme .button.ghost.onyx:hover,
.block-theme button.ghost.onyx:hover {
background-color: var(--onyx);
border-color: var(--onyx);
color: var(--white);
}
/* Link Buttons */
.block-theme .button.link,
.block-theme button.link {
background-color: transparent;
border: 0;
padding: 0;
border-radius: 0 !important;
font-size: var(--16px);
font-weight: 500;
color: var(--onyx);
}
.block-theme .button.link:hover,
.block-theme button.link:hover {
color: var(--sage);
}
.block-theme .button.link.sage,
.block-theme button.link.sage {
background-color: transparent;
color: var(--sage);
}
.block-theme .button.link.sage:hover,
.block-theme button.link.sage:hover {
color: var(--onyx);
}
.block-theme .button.link.white,
.block-theme button.link.white {
background-color: transparent;
color: var(--white);
}
.block-theme .button.link.white:hover,
.block-theme button.link.white:hover {
color: var(--clay);
}
.block-theme .button.link.clay,
.block-theme button.link.clay {
background-color: transparent;
color: var(--clay);
}
.block-theme .button.link.clay:hover,
.block-theme button.link.clay:hover {
color: var(--white);
}
.block-theme .button.link.onyx,
.block-theme button.link.onyx {
background-color: transparent;
color: var(--onyx);
}
.block-theme .button.link.onyx:hover,
.block-theme button.link.onyx:hover {
color: var(--sage);
}
@media (max-width: 460px) {
.block-theme .button.link,
.block-theme button.link {
flex: none;
}
}
/* 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: 10px;
}
.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;
padding: 0 0 0 12px;
font-size: var(--15px);
font-weight: 400;
text-transform: uppercase;
color: var(--onyx);
}
.block-theme label a,
.block-theme legend a {
text-decoration: underline;
}
.block-theme label a:hover,
.block-theme legend a:hover {
color: var(--sage);
}
.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: 12px;
background-color: transparent;
border: 0;
border-bottom: 1px solid var(--terracotta);
color: var(--onyx);
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(--sage);
}
::placeholder { color: rgba(var(--onyx-rgb), 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: 12px;
background-color: var(--white);
border: 1px solid var(--onyx);
border-radius: 0;
color: var(--onyx);
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(--onyx);
}
.block-theme .select2-selection__rendered,
.block-theme .select2-selection__placeholder {
color: var(--onyx);
}
.block-theme .select2-dropdown {
border-color: var(--onyx);
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(--onyx);
}
.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(--onyx);
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;
padding: 0;
}
.block-theme input[type='checkbox']:checked {
border-color: var(--onyx);
background: var(--onyx) 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(--onyx);
}
.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: 16px;
font-weight: 600;
line-height: 20px;
color: var(--white);
text-align: center;
text-decoration: none;
background-color: var(--onyx);
border: 1px solid var(--onyx);
border-radius: 2px;
cursor: pointer;
}
/*--------------------------------------------------------------
Gravity Forms
--------------------------------------------------------------*/
/* General */
.gform_wrapper {
--gform-theme-form-row-gap: 16px !important;
--gform-theme-form-col-gap: 16px !important;
}
.gform-theme {
--gf-form-gap-x: 16px !important;
--gf-form-gap-y: 16px !important;
--gf-label-req-gap: 2px !important;
--gf-color-primary: var(--sage) !important;
--gf-color-primary-darker: var(--sage) !important;
}
.gform_wrapper .gform_heading,
.gform_wrapper .gform_title,
.gform_wrapper .gform_required_legend {
display: none;
}
.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-theme .gfield_list_group_item:before,
.gform-theme .gform-field-label {
font-size: var(--15px) !important;
font-weight: 400 !important;
padding: 0 0 0 12px !important;
}
.gform-theme .gform-field-label.gfield_consent_label {
font-size: var(--13px) !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: transparent !important;
border: 0 !important;
border-bottom: 1px solid var(--terracotta) !important;
border-radius: 0 !important;
line-height: 20px !important;
padding: 12px !important;
height: auto !important;
box-shadow: none !important;
width: 100%;
outline: none !important;
}
.gform_wrapper .gform_body .gform_fields .gfield select {
padding: 12px 40px 12px 12px !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(--sage) !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: #c02b0a !important;
}
.gform_wrapper .gform_body .gform_fields .gfield input::placeholder,
.gform_wrapper .gform_body .gform_fields .gfield textarea::placeholder {
color: rgba(var(--onyx-rgb), 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: 20px !important;
min-width: 20px !important;
max-width: 20px !important;
max-height: 20px !important;
border: 1px solid var(--grey) !important;
background: var(--grey) !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(--onyx) !important;
background: var(--onyx) 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 input[type="checkbox"] + label,
.gform_wrapper .gform_body .gform_fields .gfield input[type="radio"] + label {
padding: 0 !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(--onyx) !important;
font-size: var(--13px) !important;
font-weight: 400 !important;
}
.gform_wrapper .gform_fileupload_multifile {
border: 0 !important;
border-radius: 0 !important;
padding: 0 !important;
background-color: transparent !important;
}
.gform_wrapper .gform_fileupload_multifile:focus-within {
border-color: transparent !important;
}
.gform_wrapper .gform_drop_area {
border: 1px solid var(--terracotta) !important;
border-radius: 0 !important;
background-color: transparent !important;
padding: 32px 24px !important;
text-align: center !important;
transition: border 0.3s ease !important;
}
.gform_wrapper .gform_drop_area:hover,
.gform_wrapper .gform_drop_area.gform_drag_over {
border: 1px dashed var(--terracotta) !important;
}
.gform_wrapper .gform_drop_area:before {
display: none !important;
}
.gform_wrapper .gform_drop_area .gform_drop_instructions {
font-weight: 400 !important;
color: var(--onyx) !important;
margin: 0 0 16px !important;
}
.gform_wrapper .gform_drop_area .gform_button_select_files {
outline: none !important;
display: inline-block !important;
padding: 6px 20px !important;
font-size: var(--14px) !important;
font-weight: 400 !important;
background-color: transparent !important;
border: 1px solid var(--onyx) !important;
box-shadow: none !important;
border-radius: 100px !important;
color: var(--onyx) !important;
text-transform: uppercase !important;
line-height: 20px !important;
transition: all 0.3s ease !important;
}
.gform_wrapper .gform_drop_area .gform_button_select_files:hover {
background-color: var(--onyx) !important;
border-color: var(--onyx) !important;
color: var(--white) !important;
}
.gform_wrapper .gform_fileupload_multifile .gform_delete {
color: var(--red) !important;
font-size: var(--13px) !important;
text-decoration: underline !important;
cursor: pointer !important;
transition: opacity 0.3s ease !important;
}
.gform_wrapper .gform_fileupload_multifile .gform_delete:hover {
opacity: 0.7 !important;
}
.gform_wrapper .gform_fileupload_multifile .gfile_list {
margin: 12px 0 0 !important;
padding: 0 !important;
list-style: none !important;
}
.gform_wrapper .gform_fileupload_multifile .gfile_list li {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
padding: 8px 0 !important;
border-bottom: 1px solid var(--grey) !important;
font-size: var(--14px) !important;
}
.gform_wrapper .gform_fileupload_multifile .gfile_list li:last-child {
border-bottom: none !important;
}
.block-setting-theme-dark .gform_wrapper .gform_drop_area {
border-color: rgba(var(--white-rgb), 0.3) !important;
}
.block-setting-theme-dark .gform_wrapper .gform_drop_area:hover,
.block-setting-theme-dark .gform_wrapper .gform_drop_area.gform_drag_over {
border-color: var(--white) !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;
order: -1;
}
.gform_wrapper .gform-page-footer .gform-loader {
order: -1;
}
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_footer button[type="submit"] {
outline: none !important;
display: inline-block !important;
position: relative !important;
padding: 10px 30px !important;
font-size: var(--15px) !important;
font-weight: 400 !important;
background-color: transparent !important;
border: 1px solid var(--sage) !important;
box-shadow: none !important;
border-radius: 100px !important;
color: var(--onyx) !important;
text-transform: uppercase !important;
height: auto !important;
line-height: 20px !important;
text-align: center !important;
cursor: pointer;
}
.gform_wrapper .gform_footer input[type="submit"]:hover,
.gform_wrapper .gform_footer button[type="submit"]:hover {
background-color: var(--sage) !important;
border-color: var(--sage) !important;
color: var(--white) !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(--onyx) !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(--clay) !important;
border-color: var(--clay) !important;
color: var(--onyx) !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_footer input[type="submit"].icon-only-button,
.gform_wrapper .gform_footer button[type="submit"].icon-only-button {
padding: 10px !important;
}
.gform_wrapper .gform_footer button[type="submit"].icon-only-button svg * {
all: revert-layer;
}
.gform_wrapper .gform-page-footer .button.gform-theme-button--secondary {
background-color: transparent !important;
border-color: var(--onyx) !important;
color: var(--onyx) !important;
}
.gform_wrapper .gform-page-footer .button.gform-theme-button--secondary:hover {
background-color: var(--onyx) !important;
border-color: var(--onyx) !important;
color: var(--white) !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(--onyx) !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 .desktop-only {
display: block;
}
.block-theme .mobile-only {
display: none;
}
.block-theme .hidden {
display: none !important;
}
@media (max-width: 768px) {
.block-theme .desktop-only {
display: none;
}
.block-theme .mobile-only {
display: block;
}
}
/* 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: 1360px;
}
.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.w1500 { max-width: 1560px; }
.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(calc(100% - 0px), 1360px)) / 2);
padding: 0 0 0 30px;
}
.parallax-container {
overflow: hidden;
}
.responsive-video {
position: relative;
overflow: hidden;
padding-bottom: 56.25%;
}
.responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media(max-width: 600px) {
.container-oneside {
margin-left: calc((100% - min(calc(100% - 0px), 1360px)) / 2);
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(--onyx);
}
.block-theme table th,
.block-theme table td {
padding: 10px;
text-align: left;
border: 1px solid var(--onyx);
color: var(--onyx);
}
.block-theme table th {
background-color: #F2F3F4;
}
.block-theme table th,
.block-theme table th * {
font-weight: 600;
}
/*-----------------------------------------------------------------------
Block Settings
-----------------------------------------------------------------------*/
/* Padding */
.block-section .block-setting-padding {
padding-top: var(--block-padding-top);
padding-bottom: var(--block-padding-bottom);
}
body.site-setting-header-overlap .page-default .block-section:first-child .block-setting-padding {
padding-top: calc(var(--header-height) + var(--announcement-bar-height) + var(--block-padding-top));
}
body.admin-bar.site-setting-header-overlap .page-default .block-section:first-child .block-setting-padding {
padding-top: calc(var(--header-height) + var(--announcement-bar-height) + var(--admin-bar-height) + var(--block-padding-top));
}
@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)));
}
body.site-setting-header-overlap .page-default .block-section:first-child .block-setting-padding {
padding-top: calc(var(--header-height) + var(--announcement-bar-height) + calc(var(--block-padding-top) / 1.25));
}
body.admin-bar.site-setting-header-overlap .page-default .block-section:first-child .block-setting-padding {
padding-top: calc(var(--header-height) + var(--announcement-bar-height) + var(--admin-bar-height) + calc(var(--block-padding-top) / 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)));
}
body.site-setting-header-overlap .page-default .block-section:first-child .block-setting-padding {
padding-top: calc(var(--header-height) + var(--announcement-bar-height) + calc(var(--block-padding-top) / 2));
}
body.admin-bar.site-setting-header-overlap .page-default .block-section:first-child .block-setting-padding {
padding-top: calc(var(--header-height) + var(--announcement-bar-height) + var(--admin-bar-height) + calc(var(--block-padding-top) / 2));
}
}
/* Backgrounds */
.block-section .block-setting-background {
background-color: var(--block-background-color, transparent);
}
/* Colours */
.block-section .block-setting-theme-dark *:not(.button):not(svg):not(path):not(span[style*="color"]):not(.ignore-text-white):not(.ignore-text-white *) {
color: var(--white) !important;
}
/*--------------------------------------------------------------
General
--------------------------------------------------------------*/
/* Empty Block */
.block-empty {
padding: 40px 0;
text-align: center;
}
.block-empty p {
margin: 0 20px;
}
/* Accordion */
.block-theme .block-accordion-row {
display: flex;
flex-direction: column;
align-items: flex-start;
flex-wrap: wrap;
gap: 0 64px;
}
.block-theme .accordion-section {
border: none;
width: 100%;
}
.block-theme .block-accordion-row.split-accordion {
flex-direction: row;
}
.block-theme .block-accordion-row.split-accordion .accordion-section {
flex: 0 0 calc(50% - 32px);
}
.block-theme .accordion-section .accordion-item {
border-bottom: 1px solid var(--terracotta);
}
.block-theme .block-setting-theme-dark .accordion-section .accordion-item {
border-color: var(--clay);
}
.block-theme .accordion-section .accordion-item .accordion-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
cursor: pointer;
padding: 24px 0;
line-height: 1.2;
margin: 0;
font-size: var(--20px);
text-transform: uppercase;
color: var(--onyx);
}
.block-theme .accordion-section .accordion-item .accordion-header .accordion-header-title {
margin: 0;
}
.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 span {
display: flex;
align-items: center;
justify-content: center;
height: 24px;
width: 24px;
}
.block-theme .accordion-section .accordion-item .accordion-header .accordion-toggle span:before,
.block-theme .accordion-section .accordion-item .accordion-header .accordion-toggle span:after {
content: '';
position: absolute;
height: 1px;
width: 24px;
background-color: var(--terracotta);
transition: all 0.3s ease;
}
.block-theme .block-setting-theme-dark .accordion-section .accordion-item .accordion-header .accordion-toggle span:before,
.block-theme .block-setting-theme-dark .accordion-section .accordion-item .accordion-header .accordion-toggle span:after {
background-color: var(--clay);
}
.block-theme .accordion-section .accordion-item .accordion-header .accordion-toggle span:after {
transform: rotate(90deg);
}
.block-theme .accordion-section .accordion-item.active .accordion-header .accordion-toggle span:after {
transform: rotate(0deg);
}
.block-theme .accordion-section .accordion-item .accordion-content {
display: none;
padding: 8px 48px 32px 0;
}
@media (max-width: 768px) {
.block-theme .block-accordion-row.split-accordion {
flex-direction: column;
}
.block-theme .accordion-section .accordion-item .accordion-header {
font-size: var(--18px);
padding: 20px 0;
}
.block-theme .accordion-section .accordion-item .accordion-content {
padding: 4px 32px 24px 0;
}
}
/* Clipboard Copy */
.block-theme .clipboard-copy {
position: relative;
cursor: pointer;
}
.block-theme .clipboard-copy .tooltip {
visibility: hidden;
width: auto;
white-space: nowrap;
background-color: var(--onyx);
color: var(--white);
text-align: center;
text-transform: none;
border-radius: 4px;
padding: 3px 10px;
position: absolute;
top: 0;
left: 50%;
font-size: var(--12px);
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(--onyx) transparent transparent transparent;
}
.block-theme .clipboard-copy:hover .tooltip {
visibility: visible;
opacity: 1;
}
/* Vertical Rule */
.block-theme .vertical-rule {
position: absolute;
top: 0;
left: 0;
width: 1px;
height: 100%;
transform: translateX(-50%);
background-color: var(--terracotta);
}
.block-setting-theme-dark .block-theme .vertical-rule {
background-color: var(--clay);
}
/* Swiper */
.block-theme .swiper-button-prev,
.block-theme .swiper-button-next {
width: auto;
height: auto;
}
.block-theme .swiper-button-prev {
left: -16px;
transform: translate(-100%, -50%);
margin: 0;
}
.block-theme .swiper-button-next {
right: -16px;
transform: translate(100%, -50%);
margin: 0;
}
.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 {
height: 24px;
width: auto;
color: var(--onyx);
transition: all 0.3s ease;
}
.block-theme .block-setting-theme-dark .swiper-button-prev svg,
.block-theme .block-setting-theme-dark .swiper-button-next svg {
color: var(--white);
}
.block-theme .swiper-button-prev:hover svg,
.block-theme .swiper-button-next:hover svg {
color: var(--sage);
}
.block-theme .block-setting-theme-dark .swiper-button-prev:hover svg,
.block-theme .block-setting-theme-dark .swiper-button-next:hover svg {
color: var(--clay);
}
.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(--onyx);
}
.block-theme .swiper-pagination {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
bottom: 24px !important;
}
.block-theme .swiper-pagination .swiper-pagination-bullet {
opacity: 1;
background-color: var(--grey);
width: 12px;
height: 12px;
transition: all 0.3s ease;
margin: 0 !important;
}
.block-theme .swiper-pagination .swiper-pagination-bullet-active {
background-color: var(--onyx);
width: 32px;
border-radius: 12px;
}
@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 {
left: -4px;
}
.block-theme .swiper-button-next {
right: -4px;
}
.block-theme .swiper-button-prev svg,
.block-theme .swiper-button-next svg {
height: 20px;
}
}
/*-----------------------------------------------------------------------
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 20px;
}
.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: 8px;
left: 0px;
width: 4px;
height: 4px;
border-radius: 100%;
background-color: var(--clay);
border: 2px solid var(--blush);
box-sizing: content-box;
}
.block-setting-theme-dark .wysiwyg-content ul li:before {
background-color: var(--white);
border-color: var(--clay);
}
.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;
}
/* Media */
.wysiwyg-content .responsive-video {
margin: 32px 0;
}
/*-----------------------------------------------------------------------
Block: Separator
-----------------------------------------------------------------------*/
.block-separator .block-separator-hr {
display: block;
width: 100%;
height: 1px;
background-color: var(--terracotta);
}
.block-separator .block-separator-hr.terracotta { background-color: var(--terracotta); }
.block-separator .block-separator-hr.onyx { background-color: var(--onyx); }
.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 80px;
position: relative;
}
.block-dual-column .vertical-rule {
left: 50%;
}
.block-dual-column .block-dual-column-content {
flex: 0 0 calc(50% - 40px);
}
.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% - 40px);
max-width: calc(50% - 40px);
min-height: 480px;
position: relative;
}
.block-dual-column .block-dual-column-media.auto-height {
min-height: auto;
}
.block-dual-column .block-dual-column-gallery {
height: 100%;
}
.block-dual-column div.block-dual-column-image {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
}
.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 .vertical-rule {
display: none;
}
.block-dual-column .block-dual-column-content {
flex: 100%;
order: 2;
}
.block-dual-column .block-dual-column-media {
max-width: 100%;
flex: 100%;
min-height: auto;
order: 1;
}
.block-dual-column div.block-dual-column-image {
padding-top: 60%;
}
.block-dual-column .block-dual-column-video {
padding-top: 60%;
}
}
@media (max-width: 600px) {
.block-dual-column div.block-dual-column-image {
padding-top: 75%;
}
.block-dual-column .block-dual-column-video {
padding-top: 75%;
}
}
/*-----------------------------------------------------------------------
Block: Intro
-----------------------------------------------------------------------*/
.block-intro {
position: relative;
overflow: hidden;
}
.block-intro .block-intro-mark.watermark {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 0;
pointer-events: none;
}
.block-intro .block-intro-mark.watermark svg {
color: rgba(var(--walnut-rgb), 0.04);
width: 380px;
}
.block-intro .block-intro-mark.top {
margin: 0 0 32px;
}
.block-intro .block-intro-mark.top svg {
color: var(--blush);
width: 70px;
margin: 0 auto;
}
@media (max-width: 768px) {
.block-intro .block-intro-mark.watermark svg {
width: 280px;
}
.block-intro .block-intro-mark.top {
margin: 0 0 24px;
}
.block-intro .block-intro-mark.top svg {
width: 60px;
}
}
/*-----------------------------------------------------------------------
Block: Split Content
-----------------------------------------------------------------------*/
.block-split-content {
contain: paint;
}
.block-split-content .block-split-content-row {
display: flex;
gap: 32px 80px;
min-height: 620px;
position: relative;
}
.block-split-content .vertical-rule {
left: 50%;
}
.block-split-content .block-split-content-left {
flex: 0 0 calc(50% - 40px);
align-self: flex-start;
position: sticky;
top: calc(var(--header-height) + var(--announcement-bar-height) + 32px);
}
body.admin-bar .block-split-content .block-split-content-left {
top: calc(var(--header-height) + var(--announcement-bar-height) + var(--admin-bar-height) + 32px);
}
.block-split-content .block-split-content-right {
flex: 0 0 calc(50% - 40px);
align-self: flex-end;
}
.block-split-content .block-split-content-right-icon {
margin: 0 0 24px;
}
.block-split-content .block-split-content-right-icon svg {
height: 64px;
width: auto;
color: var(--blush);
}
@media (max-width: 768px) {
.block-split-content .block-split-content-row {
flex-wrap: wrap;
min-height: auto;
}
.block-split-content .vertical-rule {
display: none;
}
.block-split-content .block-split-content-left {
flex: 100%;
position: static;
top: auto;
}
.block-split-content .block-split-content-right {
flex: 100%;
padding: 0;
}
}
/*-----------------------------------------------------------------------
Block: Split Heading
-----------------------------------------------------------------------*/
.block-split-heading .block-split-heading-row {
display: flex;
justify-content: space-between;
align-items: flex-end;
gap: 24px 32px;
}
.block-split-heading .block-split-heading-left {
flex: 1;
max-width: 700px;
}
.block-split-heading .block-split-heading-right .button-group {
margin: 0;
}
@media (max-width: 768px) {
.block-split-heading .block-split-heading-row {
flex-wrap: wrap;
}
.block-split-heading .block-split-heading-left {
flex: 100%;
}
.block-split-heading .block-split-heading-right {
flex: 100%;
}
}
/*-----------------------------------------------------------------------
Block: Split Accordion
-----------------------------------------------------------------------*/
.block-split-accordion .block-split-accordion-row {
display: flex;
gap: 32px 80px;
}
.block-split-accordion .block-split-accordion-content {
flex: 0 0 calc(50% - 40px);
align-self: center;
}
.block-split-accordion .block-split-accordion-row.left .block-split-accordion-content {
order: 2;
}
.block-split-accordion .block-split-accordion-row.right .block-split-accordion-content {
order: 1;
}
.block-split-accordion .block-split-accordion-media {
flex: 0 0 calc(50% - 40px);
}
.block-split-accordion .block-split-accordion-row.left .block-split-accordion-media {
order: 1;
}
.block-split-accordion .block-split-accordion-row.right .block-split-accordion-media {
order: 2;
}
.block-split-accordion .block-split-accordion-media img {
aspect-ratio: 4 / 3;
object-fit: cover;
}
@media (max-width: 992px) {
.block-split-accordion .block-split-accordion-row {
flex-wrap: wrap;
}
.block-split-accordion .block-split-accordion-content {
flex: 100%;
order: 2;
}
.block-split-accordion .block-split-accordion-media {
flex: 100%;
order: 1;
}
.block-split-accordion .block-split-accordion-media img {
aspect-ratio: 16 / 9;
}
}
/*-----------------------------------------------------------------------
Block: Icon Columns
-----------------------------------------------------------------------*/
.block-icon-columns .block-icon-columns-row {
display: flex;
flex-wrap: wrap;
gap: 50px 0;
}
.block-icon-columns .block-icon-columns-item {
flex: 0 0 calc(25% - calc(0px * 3 / 4));
padding: 20px 60px;
position: relative;
}
.block-icon-columns .block-icon-columns-item .vertical-rule {
right: 0;
left: auto;
}
.block-icon-columns .block-icon-columns-item:last-of-type .vertical-rule {
display: none;
}
.block-icon-columns .block-icon-columns-item-icon {
margin: 0 0 16px;
}
.block-icon-columns .block-icon-columns-item-icon img,
.block-icon-columns .block-icon-columns-item-icon svg {
max-width: 30px;
height: 30px;
object-fit: contain;
pointer-events: none;
}
@media (max-width: 992px) {
.block-icon-columns .block-icon-columns-item {
flex: 0 0 calc(50% - calc(0px * 1 / 2));
}
.block-icon-columns .block-icon-columns-item:nth-of-type(2n) .vertical-rule {
display: none;
}
}
@media (max-width: 600px) {
.block-icon-columns .block-icon-columns-row {
gap: 40px;
}
.block-icon-columns .block-icon-columns-item {
flex: 100%;
padding: 16px 0 16px 24px;
}
.block-icon-columns .block-icon-columns-item .vertical-rule {
left: 0;
right: 0;
}
.block-icon-columns .block-icon-columns-item:nth-of-type(2n) .vertical-rule {
display: block;
}
}
/*-----------------------------------------------------------------------
Block: Steps
-----------------------------------------------------------------------*/
.block-steps .block-steps-row {
display: flex;
gap: 32px 80px;
position: relative;
}
.block-steps .vertical-rule {
left: 50%;
transform: translateX(-50%);
}
.block-steps .block-steps-left {
flex: 0 0 calc(50% - 40px);
align-self: flex-start;
position: sticky;
top: calc(var(--header-height) + var(--announcement-bar-height) + 32px);
}
body.admin-bar .block-steps .block-steps-left {
top: calc(var(--header-height) + var(--announcement-bar-height) + var(--admin-bar-height) + 32px);
}
.block-steps .block-steps-right {
flex: 0 0 calc(50% - 40px);
padding: 600px 0 0;
}
.block-steps .block-steps-item {
margin: 0 0 80px;
}
.block-steps .block-steps-item:last-of-type {
margin: 0;
}
@media (max-width: 768px) {
.block-steps .block-steps-row {
flex-wrap: wrap;
}
.block-steps .vertical-rule {
display: none;
}
.block-steps .block-steps-left {
flex: 100%;
position: static;
top: auto;
}
.block-steps .block-steps-right {
flex: 100%;
padding: 0;
}
.block-steps .block-steps-item {
margin: 0 0 40px;
}
}
/*-----------------------------------------------------------------------
Block: Quick Links
-----------------------------------------------------------------------*/
.block-quick-links .block-quick-links-row {
display: flex;
flex-wrap: wrap;
gap: 32px 80px;
}
.block-quick-links .block-quick-links-item {
flex: 0 0 calc(50% - calc(80px * 1 / 2));
margin: 0;
display: flex;
flex-direction: column;
border-bottom: 1px solid var(--terracotta);
}
.block-quick-links .block-setting-theme-dark .block-quick-links-item {
border-color: var(--clay);
}
.block-quick-links .block-quick-links-item a {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
padding: 0 0 20px;
height: 100%;
color: var(--onyx);
}
.block-quick-links .block-quick-links-item a span {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: 32px;
height: 32px;
background-color: transparent;
border-radius: 100%;
transition: all 0.3s ease;
}
.block-quick-links .block-quick-links-item a:hover span {
background-color: var(--clay);
}
.block-quick-links .block-quick-links-item a span svg {
width: 12px;
color: var(--onyx);
}
@media (max-width: 768px) {
.block-quick-links .block-quick-links-item {
flex: 100%;
}
}
/*-----------------------------------------------------------------------
Block: Logo Slider
-----------------------------------------------------------------------*/
.block-logo-slider .block-logo-slider-row {
display: flex;
align-items: center;
}
.block-logo-slider .block-logo-slider-content {
flex: 0 0 200px;
}
.block-logo-slider .block-logo-slider-swiper .swiper-wrapper {
align-items: center;
}
.block-logo-slider .block-logo-slider-swiper .swiper-slide {
width: auto;
margin: 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: 992px) {
.block-logo-slider .container-oneside {
margin: 0 auto;
padding: 0 30px;
}
.block-logo-slider .block-logo-slider-row {
flex-wrap: wrap;
gap: 40px;
}
.block-logo-slider .block-logo-slider-content {
flex: 100%;
text-align: center;
}
.block-logo-slider .block-logo-slider-swiper .swiper-slide {
margin: 0 30px;
}
}
@media (max-width: 600px) {
.block-logo-slider .container-oneside {
padding: 0 20px;
}
.block-logo-slider .block-logo-slider-swiper .swiper-slide {
margin: 0 20px;
}
.block-logo-slider .block-logo-slider-swiper .swiper-slide img {
max-height: 60px;
max-width: 120px;
}
}
/*-----------------------------------------------------------------------
Block: Gallery Slider
-----------------------------------------------------------------------*/
.block-gallery-slider .block-gallery-slider-swiper .swiper-slide {
height: 500px;
width: auto;
margin: 0 16px;
}
.block-gallery-slider .block-gallery-slider-swiper .swiper-slide img {
height: 500px;
width: auto;
}
@media (max-width: 768px) {
.block-gallery-slider .block-gallery-slider-swiper .swiper-slide {
height: 400px;
}
.block-gallery-slider .block-gallery-slider-swiper .swiper-slide img {
height: 400px;
}
}
/*--------------------------------------------------------------
Block: Gallery Feature
--------------------------------------------------------------*/
.block-gallery-feature .pinned-feature-mark {
position: sticky;
top: 35vh;
pointer-events: none;
margin: 0 0 60px;
}
.block-gallery-feature .pinned-feature-mark svg {
color: var(--walnut);
width: 100px;
margin: 0 auto;
}
.block-gallery-feature .block-gallery-feature-wall {
display: flex;
flex-wrap: wrap;
gap: 100px;
position: relative;
}
.block-gallery-feature .block-gallery-feature-item {
flex: 0 0 calc(50% - 50px);
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+1) {
margin: 0 0 20%;
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+2) {
padding: 0 10%;
align-self: flex-end;
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+3) {
padding: 0 10% 0 0;
margin: 20% 0 0;
align-self: flex-end;
}
@media (max-width: 992px) {
.block-gallery-feature .block-gallery-feature-wall {
gap: 60px;
}
.block-gallery-feature .block-gallery-feature-item {
flex: 0 0 calc(50% - 30px);
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+1) {
margin: 0 0 10%;
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+2) {
padding: 0 5%;
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+3) {
padding: 0 5% 0 0;
margin: 10% 0 0;
}
}
@media (max-width: 768px) {
.block-gallery-feature .pinned-feature-mark {
margin: 0 0 40px;
}
.block-gallery-feature .pinned-feature-mark svg {
width: 80px;
}
.block-gallery-feature .block-gallery-feature-wall {
gap: 40px;
}
.block-gallery-feature .block-gallery-feature-item {
flex: 0 0 calc(50% - 20px);
}
}
@media (max-width: 460px) {
.block-gallery-feature .pinned-feature-mark {
display: none;
}
.block-gallery-feature .block-gallery-feature-wall {
gap: 32px;
}
.block-gallery-feature .block-gallery-feature-item {
flex: 100%;
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+1) {
margin: 0;
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+2) {
padding: 0;
}
.block-gallery-feature .block-gallery-feature-item:nth-child(4n+3) {
padding: 0;
margin: 0;
}
}
/*-----------------------------------------------------------------------
Block: Post Header
-----------------------------------------------------------------------*/
.block-post-header .block-post-header-row {
display: flex;
align-items: center;
gap: 40px 100px;
}
.block-post-header .block-post-header-image {
flex: 0 0 420px;
}
.block-post-header .block-post-header-image img {
aspect-ratio: 4 / 3;
object-fit: cover;
}
.block-post-header .block-post-header-main {
flex: 1;
}
.block-post-header .block-post-header-categories {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px;
margin: 0 0 12px;
}
.block-post-header .block-post-header-categories span {
background-color: var(--white);
font-size: var(--14px);
font-weight: 600;
text-transform: uppercase;
line-height: 20px;
padding: 3px 8px;
}
.block-post-header .block-post-header-main > h1 {
margin: 0;
}
.block-post-header .block-post-header-meta {
margin: 40px 0 0;
display: flex;
align-items: center;
gap: 24px;
font-size: var(--14px);
font-weight: 600;
text-transform: uppercase;
}
.block-post-header .block-post-header-meta .block-post-header-author {
display: flex;
align-items: center;
gap: 6px;
}
.block-post-header .block-post-header-meta .block-post-header-author svg {
width: 12px;
}
.block-post-header .block-post-header-meta time {
display: flex;
align-items: center;
gap: 6px;
}
.block-post-header .block-post-header-meta time svg {
width: 12px;
}
.block-post-header .block-post-header-excerpt {
margin: 24px 0 0;
}
.block-post-header .block-post-header-excerpt p {
font-weight: 500;
}
.block-post-header .block-post-header-shares {
margin: 24px 0 0;
display: flex;
align-items: center;
gap: 12px;
}
.block-post-header .block-post-header-shares > p {
font-size: var(--15px);
font-weight: 400;
text-transform: uppercase;
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: 26px;
height: 26px;
background-color: var(--onyx);
color: var(--white);
border-radius: 100%;
transition: all 0.3s ease;
font-size: var(--13px);
}
.block-post-header .block-post-header-shares .clipboard-copy {
transition: all 0.3s ease;
}
.block-post-header .block-post-header-shares a:hover,
.block-post-header .block-post-header-shares .clipboard-copy:hover {
background-color: var(--sage);
}
@media (max-width: 1280px) {
.block-post-header .block-post-header-row {
gap: 40px 80px;
}
}
@media (max-width: 992px) {
.block-post-header .block-post-header-row {
flex-wrap: wrap;
}
.block-post-header .block-post-header-image {
flex: 100%;
max-width: 400px;
}
.block-post-header .block-post-header-main {
flex: 100%;
}
}
@media (max-width: 768px) {
.block-post-header .block-post-header-meta {
margin: 32px 0 0;
}
}
/*-----------------------------------------------------------------------
Block: Project Intro
-----------------------------------------------------------------------*/
.block-project-intro .block-project-intro-row {
display: flex;
gap: 32px 180px;
}
.block-project-intro .block-project-intro-content {
flex: 0 0 calc(50% - 150px);
}
.block-project-intro .block-project-intro-details {
flex: 0 0 calc(50% - 30px);
}
.block-project-intro .block-project-intro-details-item {
border-bottom: 1px solid var(--terracotta);
padding: 12px;
display: flex;
align-items: center;
gap: 30px;
}
.block-project-intro .block-project-intro-details-item:last-of-type {
border-bottom: none;
}
.block-project-intro .block-project-intro-details-item-label {
font-size: var(--15px);
text-transform: uppercase;
color: var(--terracotta);
min-width: 140px;
}
.block-project-intro .block-project-intro-details-item-content {
text-transform: uppercase;
}
.block-project-intro .block-project-intro-details-item.share .block-project-intro-details-item-content {
display: flex;
align-items: center;
gap: 16px;
font-size: var(--18px);
}
@media (max-width: 992px) {
.block-project-intro .block-project-intro-row {
flex-wrap: wrap;
}
.block-project-intro .block-project-intro-content {
flex: 100%;
}
.block-project-intro .block-project-intro-details {
flex: 100%;
}
}
@media (max-width: 460px) {
.block-project-intro .block-project-intro-details-item-label {
min-width: 80px;
}
}
/*-----------------------------------------------------------------------
Block: Hero Banner
-----------------------------------------------------------------------*/
.block-hero-banner {
position: relative;
overflow: hidden;
z-index: 1;
}
.block-hero-banner .block-hero-banner-overlay {
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.5) 80%), linear-gradient(0deg, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.60) 100%);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-hero-banner .block-hero-banner-wrap {
overflow: hidden;
height: 700px;
}
.block-hero-banner .block-hero-banner-wrap.large {
height: 1000px;
}
.block-hero-banner .block-hero-banner-image {
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-hero-banner .block-hero-banner-video {
position: relative;
height: 100%;
overflow: hidden;
}
.block-hero-banner .block-hero-banner-video video {
object-fit: cover;
background-image: url('../images/video-loader-black.gif');
background-repeat: no-repeat;
background-size: 60px;
background-position: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-hero-banner .block-hero-banner-content {
position: absolute;
bottom: 60px;
left: 0;
width: 100%;
}
.block-hero-banner .block-hero-banner-content .wysiwyg-content {
max-width: 620px;
}
.block-hero-banner .block-hero-banner-content .wysiwyg-content h1 {
text-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}
@media (max-width: 992px) {
.block-hero-banner .block-hero-banner-wrap {
height: 600px;
}
.block-hero-banner .block-hero-banner-wrap.large {
height: 800px;
}
}
@media (max-width: 768px) {
.block-hero-banner .block-hero-banner-wrap {
height: 500px;
}
.block-hero-banner .block-hero-banner-wrap.large {
height: 700px;
}
.block-hero-banner .block-hero-banner-content {
bottom: 40px;
}
}
/*-----------------------------------------------------------------------
Block: Media Banner
-----------------------------------------------------------------------*/
.block-media-banner {
position: relative;
overflow: hidden;
z-index: 1;
}
.block-media-banner .block-media-banner-overlay {
background: linear-gradient(90deg,rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0.75) 100%);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-media-banner .block-media-banner-wrap {
aspect-ratio: 21 / 9;
}
.block-media-banner .block-media-banner-image {
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-media-banner .block-media-banner-video {
position: relative;
height: 100%;
overflow: hidden;
}
.block-media-banner .block-media-banner-video video {
object-fit: cover;
background-image: url('../images/video-loader-black.gif');
background-repeat: no-repeat;
background-size: 60px;
background-position: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-media-banner .block-media-banner-content {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.block-media-banner .block-media-banner-content .container {
height: 100%;
}
.block-media-banner .block-media-banner-content-row {
display: flex;
justify-content: space-between;
gap: 40px 80px;
height: 100%;
}
.block-media-banner .block-media-banner-content-left {
max-width: 340px;
align-self: center;
}
.block-media-banner .block-media-banner-content-left h2 {
line-height: 1.35;
}
.block-media-banner .block-media-banner-content-right {
max-width: 450px;
align-self: flex-end;
padding: 0 0 60px;
}
.block-media-banner .block-media-banner-content .wysiwyg-content *:not(.button-group):not(.button):not(button) {
text-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}
@media (max-width: 992px) {
.block-media-banner .block-media-banner-wrap {
aspect-ratio: 16 / 9;
}
}
@media (max-width: 768px) {
.block-media-banner .block-media-banner-wrap.has-content {
position: absolute;
width: 100%;
height: 100%;
}
.block-media-banner .block-media-banner-content {
position: relative;
height: auto;
padding: 40px 0;
z-index: 9;
}
.block-media-banner .block-media-banner-content-row {
gap: 32px;
flex-wrap: wrap;
align-items: flex-end;
}
.block-media-banner .block-media-banner-content-left {
flex: 100%;
align-self: auto;
max-width: none;
}
.block-media-banner .block-media-banner-content-right {
flex: 100%;
align-self: auto;
max-width: none;
padding: 0;
}
}
@media (max-width: 460px) {
.block-media-banner .block-media-banner-wrap {
aspect-ratio: 4 / 3;
}
}
/*-----------------------------------------------------------------------
Block: CTA Banner
-----------------------------------------------------------------------*/
.block-cta-banner .block-cta-banner-row {
display: flex;
justify-content: space-between;
gap: 32px 80px;
height: 100%;
}
.block-cta-banner .block-cta-banner-left {
max-width: 540px;
align-self: center;
}
.block-cta-banner .block-cta-banner-left > svg {
height: 64px;
width: auto;
margin: 0 0 16px;
color: var(--blush);
}
.block-cta-banner .block-cta-banner-right {
max-width: 440px;
align-self: flex-end;
}
@media (max-width: 768px) {
.block-cta-banner .block-cta-banner-row {
flex-wrap: wrap;
}
.block-cta-banner .block-cta-banner-left,
.block-cta-banner .block-cta-banner-right {
flex: 100%;
max-width: 100%;
}
}
/*-----------------------------------------------------------------------
Block: Testimonial Feed
-----------------------------------------------------------------------*/
.block-testimonial-feed .block-testimonial-feed-entry {
text-align: center;
}
.block-testimonial-feed .block-testimonial-feed-entry-header {
margin: 0 0 24px;
}
.block-testimonial-feed .block-testimonial-feed-entry-stars {
color: var(--walnut);
font-size: var(--20px);
}
.block-testimonial-feed .block-testimonial-feed-entry-footer {
margin: 40px 0 0;
}
.block-testimonial-feed .block-testimonial-feed-entry-type {
margin: 0 0 6px;
}
.block-testimonial-feed .block-testimonial-feed-entry-type img {
width: auto;
height: 30px;
margin: 0 auto;
}
/*--------------------------------------------------------------
Block: Project Loop
--------------------------------------------------------------*/
.block-project-loop .block-project-loop-header {
margin: 0 0 60px;
}
.block-project-loop .block-project-loop-filter {
display: flex;
align-content: center;
flex-wrap: wrap;
gap: 8px 30px;
}
.block-project-loop .block-project-loop-filter a {
font-size: var(--15px);
text-transform: uppercase;
position: relative;
}
.block-project-loop .block-project-loop-filter a:after {
content: '';
position: absolute;
top: 50%;
right: -17px;
transform: translateY(-50%);
width: 4px;
height: 4px;
background-color: var(--onyx);
border-radius: 100%;
}
.block-project-loop .block-project-loop-filter a:last-of-type:after {
display: none;
}
.block-project-loop .block-project-loop-filter a.active {
font-weight: 600;
}
@media (max-width: 768px) {
.block-project-loop .block-project-loop-header {
margin: 0 0 40px;
}
}
/*--------------------------------------------------------------
Block: Project Feature
--------------------------------------------------------------*/
.block-project-feature .pinned-feature-mark {
position: sticky;
top: 35vh;
pointer-events: none;
margin: 0 0 60px;
}
.block-project-feature .pinned-feature-mark svg {
color: var(--walnut);
width: 100px;
margin: 0 auto;
}
.block-project-feature .block-project-feature-wall {
display: flex;
align-items: flex-end;
flex-wrap: wrap;
gap: 120px 60px;
}
.block-project-feature .block-project-feature-entry {
flex: 0 0 calc(50% - 30px);
}
.block-project-feature .block-project-feature-entry:nth-child(4n+2) {
padding-left: 20%;
}
.block-project-feature .block-project-feature-entry:nth-child(4n+3) {
padding-right: 20%;
}
.block-project-feature .block-project-feature-entry-perma {
position: relative;
display: block;
overflow: hidden;
}
.block-project-feature .block-project-feature-entry-image {
width: 100%;
height: 100%;
aspect-ratio: 1 / 1;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
.block-project-feature .block-project-feature-entry-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
padding: 40px;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
opacity: 0;
transition: opacity 0.6s ease;
}
.block-project-feature .block-project-feature-entry-perma:hover .block-project-feature-entry-overlay {
opacity: 1;
}
.block-project-feature .block-project-feature-entry-overlay h2 {
font-size: clamp(var(--25px), 3vw, var(--40px));
color: var(--white);
opacity: 0;
transform: translateY(32px);
transition: all 0.3s ease;
}
.block-project-feature .block-project-feature-entry-perma:hover .block-project-feature-entry-overlay h2 {
opacity: 1;
transform: translateY(0);
}
@media (max-width: 992px) {
.block-project-feature .block-project-feature-wall {
gap: 60px;
}
.block-project-feature .block-project-feature-entry:nth-child(4n+2) {
padding-left: 10%;
}
.block-project-feature .block-project-feature-entry:nth-child(4n+3) {
padding-right: 10%;
}
}
@media (max-width: 768px) {
.block-project-feature .pinned-feature-mark {
margin: 0 0 40px;
}
.block-project-feature .pinned-feature-mark svg {
width: 80px;
}
.block-project-feature .block-project-feature-wall {
gap: 40px;
}
}
@media (max-width: 600px) {
.block-project-feature .pinned-feature-mark {
display: none;
}
.block-project-feature .block-project-feature-wall {
gap: 32px;
}
.block-project-feature .block-project-feature-entry {
flex: 100%;
}
.block-project-feature .block-project-feature-entry:nth-child(4n+2) {
padding: 0;
}
.block-project-feature .block-project-feature-entry:nth-child(4n+3) {
padding: 0;
}
}
/*--------------------------------------------------------------
Project - Entry
--------------------------------------------------------------*/
.project-entry-row {
display: flex;
flex-wrap: wrap;
gap: 50px 40px;
}
.project-entry {
flex: 0 0 calc(33.33333% - calc(40px * 2 / 3));
}
.project-entry .project-entry-image {
position: relative;
margin: 0 0 16px;
overflow: hidden;
}
.project-entry .project-entry-image-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
opacity: 0;
transition: opacity 0.3s ease;
z-index: 1;
}
.project-entry .project-entry-perma:hover .project-entry-image-overlay {
opacity: 1;
}
.project-entry .project-entry-image img {
aspect-ratio: 4 / 5.25;
object-fit: cover;
transition: transform 0.3s ease;
}
.project-entry .project-entry-perma:hover .project-entry-image img {
transform: scale(1.05);
}
.project-entry .h3 {
margin: 0;
}
.project-entry .project-entry-categories {
font-size: var(--15px);
text-transform: uppercase;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 4px 20px;
margin: 12px 0 0;
}
.project-entry .project-entry-categories span {
color: var(--onyx);
position: relative;
}
.project-entry .project-entry-categories span:after {
content: '';
position: absolute;
top: 50%;
right: -12px;
transform: translateY(-50%);
width: 4px;
height: 4px;
background-color: var(--onyx);
border-radius: 100%;
}
.project-entry .project-entry-categories span:last-of-type:after {
display: none;
}
@media (max-width: 992px) {
.project-entry {
flex: 0 0 calc(50% - calc(40px * 1 / 2));
}
}
@media (max-width: 600px) {
.project-entry {
flex: 100%;
}
}
/*--------------------------------------------------------------
Post - Archive
--------------------------------------------------------------*/
/* Main */
.post-archive {
padding: 120px 0;
}
.post-archive .post-archive-header {
text-align: center;
margin: 0 0 80px;
}
/* Filter */
.post-archive-filter {
display: flex;
justify-content: center;
align-content: center;
flex-wrap: wrap;
gap: 12px;
margin: 40px 0;
}
.post-archive-filter a {
background-color: transparent;
border: 1px solid var(--sage);
color: var(--onyx);
padding: 10px 30px;
font-size: var(--15px);
font-weight: 400;
text-transform: uppercase;
line-height: 20px;
border-radius: 20px;
min-width: 70px;
display: flex;
align-items: center;
justify-content: center;
}
.post-archive-filter a:hover {
color: var(--sage);
}
.post-archive-filter a.active {
background-color: var(--sage);
color: var(--white);
}
.post-archive-filter a.active:hover {
color: var(--white);
}
/* Pagination */
.post-archive-pagination {
display: flex;
justify-content: center;
margin: 40px 0 0;
}
.post-archive-pagination .post-archive-pagination-inner {
background-color: var(--off-white);
border-radius: 100px;
display: flex;
justify-content: center;
align-items: center;
gap: 12px;
padding: 16px 24px;
}
.post-archive-pagination .post-archive-pagination-inner > span,
.post-archive-pagination .post-archive-pagination-inner a {
text-decoration: none;
color: var(--onyx);
line-height: 1;
font-size: var(--20px);
font-weight: 500;
}
.post-archive-pagination .post-archive-pagination-inner a:hover {
color: var(--sage);
}
.post-archive-pagination .post-archive-pagination-inner .nav-prev {
padding: 0 32px 0 0;
}
.post-archive-pagination .post-archive-pagination-inner .nav-next {
padding: 0 0 0 32px;
}
.post-archive-pagination .post-archive-pagination-inner span.nav-prev,
.post-archive-pagination .post-archive-pagination-inner span.nav-next {
color: rgba(var(--onyx-rgb), 0.5);
}
.post-archive-pagination .post-archive-pagination-inner .current {
text-decoration: underline;
}
.post-archive-pagination .post-archive-pagination-inner .dots {
font-size: var(--18px);
font-weight: 400;
}
@media (max-width: 460px) {
.post-archive-pagination .post-archive-pagination-inner {
padding: 12px 16px;
gap: 8px;
}
.post-archive-pagination .post-archive-pagination-inner > span,
.post-archive-pagination .post-archive-pagination-inner a {
font-size: var(--18px);
}
.post-archive-pagination .post-archive-pagination-inner .nav-prev {
padding: 0 16px 0 0;
font-size: var(--16px);
}
.post-archive-pagination .post-archive-pagination-inner .nav-next {
padding: 0 0 0 16px;
font-size: var(--16px);
}
.post-archive-pagination .post-archive-pagination-inner .dots {
font-size: var(--16px);
}
}
/*--------------------------------------------------------------
Post - Entry
--------------------------------------------------------------*/
.post-entry-row {
display: flex;
flex-wrap: wrap;
gap: 32px;
}
.post-entry {
flex: 0 0 calc(33.33333% - calc(32px * 2 / 3));
}
.post-entry .post-entry-image {
margin: 0 0 20px;
}
.post-entry .post-entry-image img {
aspect-ratio: 16 / 9;
object-fit: cover;
}
.post-entry .post-entry-excerpt p:last-of-type {
margin: 0;
}
@media (max-width: 992px) {
.post-entry {
flex: 0 0 calc(50% - calc(32px * 1 / 2));
}
}
@media (max-width: 600px) {
.post-entry {
flex: 100%;
}
}
/*--------------------------------------------------------------
Post - Single
--------------------------------------------------------------*/
/* Navigation */
.post-single .post-single-nav {
padding: 0 0 80px;
}
.post-single .post-single-nav .post-navigation {
border-top: 1px solid var(--onyx);
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(--onyx);
}
.post-single .post-single-nav a:hover {
color: var(--sage);
}
@media (max-width: 768px) {
.post-single .post-single-nav {
padding: 0 0 60px;
}
}
/*--------------------------------------------------------------
Post - Search
--------------------------------------------------------------*/
/* Archive */
.search-archive {
padding: 120px 0;
}
.search-archive .search-archive-header {
text-align: center;
margin: 0 0 60px;
}
.search-archive .search-archive-header h1 {
margin: 0;
}
@media (max-width: 992px) {
.search-archive {
padding: 80px 0;
}
.search-archive .search-archive-header {
margin: 0 0 50px;
}
}
@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);
margin: 0 0 16px;
text-align: center;
transition: all 0.3s ease;
}
.search-entry:hover {
background-color: var(--off-white);
}
.search-entry a {
display: block;
padding: 24px 32px;
}
.search-entry p {
transition: all 0.3s ease;
}
.search-entry:hover p {
color: var(--terracotta);
}
.search-entry h3 {
margin: 0;
transition: all 0.3s ease;
}
.search-entry:hover h3 {
color: var(--terracotta);
}
/* Search */
.no-results .search-form {
position: relative;
}
.no-results .search-form input[type="text"] {
border-color: var(--onyx);
padding: 24px 168px 24px 24px;
}
.no-results .search-form input[type="text"]:focus {
border-color: var(--terracotta);
}
.no-results .search-form button[type="submit"] {
position: absolute;
right: 14px;
bottom: 10px;
}
@media (max-width: 460px) {
.no-results .search-form input[type="text"] {
padding: 14px 24px;
}
.no-results .search-form button[type="submit"] {
position: static;
margin: 8px 0 0;
width: 100%;
}
}
/*-----------------------------------------------------------------------
Admin - Block Editor
-----------------------------------------------------------------------*/
.edit-post-visual-editor__post-title-wrapper {
background-color: var(--white);
color: var(--onyx);
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(--16px) !important;
color: var(--onyx);
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;
}
.hide-block--active {
opacity: 0.35;
}
.components-popover.block-editor-block-popover {
z-index: 20000000001 !important;
}
.acf-block-body .acf-block-fields {
z-index: 99999999 !important;
}
.editor-styles-wrapper p {
line-height: 1.5 !important;
}
.components-panel__header {
height: 48px;
}
/*-----------------------------------------------------------------------
Admin: Resizable Sideabr
-----------------------------------------------------------------------*/
/* .block-editor .editor-sidebar .acf-block-panel {
display: none !important;
} */
.interface-interface-skeleton__sidebar .interface-complementary-area,
.interface-interface-skeleton__sidebar .interface-complementary-area__fill {
width: 100% !important;
}
.edit-post-layout:not(.is-sidebar-opened) .interface-interface-skeleton__sidebar,
.edit-site-layout:not(.is-sidebar-opened) .interface-interface-skeleton__sidebar {
display: none !important;
}
.interface-interface-skeleton__sidebar.ui-resizable-resizing {
position: relative !important;
}
.interface-interface-skeleton__sidebar {
position: relative !important;
display: block !important;
z-index: 100000 !important;
left: auto !important;
right: 0 !important;
}
.ui-resizable-handle.ui-resizable-w {
background-color: #f5f5f5 !important;
width: 12px !important;
left: 0 !important;
top: 0 !important;
bottom: 0 !important;
transition: background-color 0.3s ease;
cursor: ew-resize !important;
z-index: 100001 !important;
position: absolute !important;
}
.ui-resizable-resizing .ui-resizable-handle.ui-resizable-w {
background-color: #e0e0e0 !important;
}
.interface-navigable-region.interface-interface-skeleton__sidebar {
padding-left: 12px !important;
}
.ui-resize-indicator {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 2px;
height: 24px;
background-color: #1e1e1e;
border-radius: 2px;
}
.edit-post-fullscreen-mode-close-site-icon__image {
padding: 10px;
}