/* config */
:where(html) {
/* MISC */
--container: 1380px;
--container-small: 1164px;
--container-extra-small: 896px;
--transition: 0.35s;
/* COLORS */
--color-primary: #070D47;
--color-primary-light: #B4DAFF;
--color-primary-tint: #6590FF;
--color-secondary: #32CC89;
--color-secondary-dark: #26bd7c;
--color-grey: #8386A3;
--color-white: #FFFFFF;
--color-tint: #EDF6FF;
--color-red: #df3639;
--color-overlay: rgba(7, 13, 71, 0.9);
/* SPACINGS */
--spacing-xxs: 8px;
--spacing-xs: 12px;
--spacing-sm: 18px;
--spacing-md: 24px;
--spacing-lg: 32px;
--spacing-xl: 48px;
--spacing-xxl: 60px;
--spacing-xxxl: 80px;
/* RADIUS */
--border-radius: 12px;
--border-radius-sm: 6px;
/* FONT FAMILIES */
--font-primary: 'Figtree', sans-serif;
--font-secondary: 'Caveat', sans-serif;
/* FONT SIZES */
--font-size-0: 15px;
--font-size-1: 16px;
--font-size-2: 18px;
--font-size-3: 20px;
--font-size-4: 24px;
--font-size-5: 32px;
--font-size-6: 40px;
--font-size-7: 48px;
--font-size-8: 56px;
--font-size-9: 60px;
--base-font-size: var(--font-size-2);
/* FONT LINE-HEIGHTS */
--font-lineheight-0: 1;
--font-lineheight-1: 1.25;
--font-lineheight-2: 1.375;
--font-lineheight-3: 1.5;
--font-lineheight-4: 1.6;
--font-lineheight-5: 1.75;
--base-lineheight: var(--font-lineheight-4);
/* FONT WEIGHTS */
--font-weight-light: 300;
--font-weight-regular: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--font-weight-extra-bold: 900;
/* MISC */
--color-border: #B4DAFF;
--color-border-dark: #8ab3dc;
}
/* base */
*,
::after,
::before {
box-sizing: inherit;
color: inherit;
font-family: inherit;
font-size: inherit;
line-height: inherit;
text-decoration: inherit;
vertical-align: inherit;
}
* {
cursor: inherit;
margin: 0;
padding: 0;
}
/* smooth scroll styles */
html.lenis,
html.lenis body {
height: auto;
}
.lenis.lenis-smooth {
scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
overscroll-behavior: contain;
}
.lenis.lenis-stopped {
overflow: hidden;
}
.lenis.lenis-smooth iframe {
pointer-events: none;
}
/* scroll reveal animations */
html.sr .sr-hidden {
visibility: hidden;
}
html,
body {
scroll-behavior: smooth;
}
body {
font-family: 'Figtree', sans-serif;
font-family: var(--font-primary);
font-weight: 400;
font-weight: var(--font-weight-regular);
color: #070D47;
color: var(--color-primary);
font-size: 1.0625rem;
line-height: 1.5;
line-height: var(--font-lineheight-3);
box-sizing: border-box;
cursor: default;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@media (min-width: 640px) {
body {
font-size: 1.125rem;
font-size: var(--base-font-size);
line-height: 1.6;
line-height: var(--base-lineheight)
}
}
.wrapper {
display: flex;
flex-direction: column;
min-height: 100vh;
}
.container {
width: 100%;
max-width: 1380px;
max-width: var(--container);
margin: 0 auto;
padding-left: 18px;
padding-left: var(--spacing-sm);
padding-right: 18px;
padding-right: var(--spacing-sm);
}
.container--small {
max-width: 1164px;
max-width: var(--container-small);
}
.container--full {
max-width: 100%;
padding-right: 0;
padding-left: 0;
}
a {
color: inherit;
text-decoration: none;
transition: color 0.35s ease;
transition: color var(--transition) ease;
}
a:hover {
cursor: pointer;
}
p:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
ul, ol {
margin: 0;
padding: 0;
}
ul li, ol li {
margin: 0;
padding: 0;
list-style: none;
}
img {
display: block;
max-width: 100%;
height: auto;
}
h1, h2, h3, h4 {
line-height: 1.0;
font-weight: 700;
font-weight: var(--font-weight-bold);
}
h1 span, h2 span, h3 span, h4 span {
color: #32CC89;
color: var(--color-secondary);
}
hr {
display: block;
border: 0;
width: 100%;
height: 1px;
background-color: #B4DAFF;
background-color: var(--color-border);
}
hr:not(:last-child) {
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
/* Responsive embeds */
.embed-container {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
max-width: 100%;
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* screenreader */
.screenreader,
.screen-reader-text {
position: absolute;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
width: 1px;
height: 1px;
margin: -1px;
overflow: hidden;
white-space: nowrap;
}
/* wysiwyg styles (rich-text) */
.rich-text p:not(:last-child), .gfield_html_formatted p:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.rich-text h1, .gfield_html_formatted h1 {
font-size: 2.25rem;
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
.rich-text h2, .gfield_html_formatted h2 {
font-size: 1.875rem;
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.rich-text h2 + h3, .gfield_html_formatted h2 + h3 {
margin-top: 24px;
margin-top: var(--spacing-md);
}
.rich-text h3, .rich-text h4, .rich-text h5, .gfield_html_formatted h3, .gfield_html_formatted h4, .gfield_html_formatted h5 {
font-size: 1.5rem;
margin-bottom: 8px;
margin-bottom: var(--spacing-xxs);
}
.rich-text a:not(.button), .gfield_html_formatted a:not(.button) {
color: #070D47;
color: var(--color-primary);
text-decoration: underline;
}
.block--bg-dark .rich-text a:not(.button), .block--bg-dark .gfield_html_formatted a:not(.button) {
color: inherit;
}
.rich-text a:not(.button):hover, .gfield_html_formatted a:not(.button):hover {
color: #32CC89;
color: var(--color-secondary);
}
.rich-text .button:not(:last-child), .gfield_html_formatted .button:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.rich-text del, .rich-text strike, .gfield_html_formatted del, .gfield_html_formatted strike {
text-decoration: line-through;
}
.rich-text em, .gfield_html_formatted em {
font-style: italic;
}
.rich-text strong, .gfield_html_formatted strong {
font-weight: 700;
font-weight: var(--font-weight-bold);
}
.rich-text blockquote, .gfield_html_formatted blockquote {
color: #070D47;
color: var(--color-primary);
font-family: 'Georgia', 'Times New Roman', Times, serif;
font-size: 1.5rem;
font-style: italic;
line-height: 1.2;
padding: 0;
margin: 0;
}
.rich-text blockquote:not(:last-child), .gfield_html_formatted blockquote:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.rich-text ul, .rich-text ol, .gfield_html_formatted ul, .gfield_html_formatted ol {
margin-left: 18px;
margin-left: var(--spacing-sm);
padding-left: 24px;
padding-left: var(--spacing-md);
}
.rich-text ul:not(:last-child), .rich-text ol:not(:last-child), .gfield_html_formatted ul:not(:last-child), .gfield_html_formatted ol:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.rich-text ul li::marker, .rich-text ol li::marker, .gfield_html_formatted ul li::marker, .gfield_html_formatted ol li::marker {
color: #070D47;
color: var(--color-primary);
}
.rich-text ul ul, .rich-text ul ol, .rich-text ol ul, .rich-text ol ol, .gfield_html_formatted ul ul, .gfield_html_formatted ul ol, .gfield_html_formatted ol ul, .gfield_html_formatted ol ol {
margin-bottom: 0;
}
.rich-text ul li, .gfield_html_formatted ul li {
list-style: disc;
}
.rich-text ol li, .gfield_html_formatted ol li {
list-style: decimal;
}
.rich-text code, .gfield_html_formatted code {
font-family: Courier, monospace;
font-weight: 400;
font-weight: var(--font-weight-regular);
font-size: 0.9375rem;
line-height: 1.25;
line-height: var(--font-lineheight-1);
color: #8386A3;
color: var(--color-grey);
}
/* WordPress editor generated classes */
.rich-text .alignleft:not(:last-child), .rich-text .alignright:not(:last-child), .rich-text .aligncenter:not(:last-child), .gfield_html_formatted .alignleft:not(:last-child), .gfield_html_formatted .alignright:not(:last-child), .gfield_html_formatted .aligncenter:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
@media (min-width: 768px) {
.rich-text .alignleft, .gfield_html_formatted .alignleft {
margin-right: 24px;
margin-right: var(--spacing-md);
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
display: inline;
float: left
}
}
@media (min-width: 768px) {
.rich-text .alignright, .gfield_html_formatted .alignright {
margin-left: 24px;
margin-left: var(--spacing-md);
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
display: inline;
float: right
}
}
@media (min-width: 768px) {
.rich-text .aligncenter, .gfield_html_formatted .aligncenter {
margin-right: auto;
margin-left: auto;
display: block;
clear: both
}
}
.rich-text .wp-caption, .gfield_html_formatted .wp-caption {
max-width: 100%;
}
.rich-text .wp-caption:not(:last-child), .gfield_html_formatted .wp-caption:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.rich-text .wp-caption img, .gfield_html_formatted .wp-caption img {
border: 0 none;
padding: 0;
margin: 0;
display: block;
}
.rich-text .wp-caption p.wp-caption-text, .gfield_html_formatted .wp-caption p.wp-caption-text {
font-size: 0.8125rem;
margin: 0;
padding: 10px 0 0 0;
}
/* layout */
.toolbar {
font-size: 0.8125rem;
line-height: 1;
line-height: var(--font-lineheight-0);
background-color: white;
}
@media (min-width: 640px) {
.toolbar {
font-size: 0.9375rem;
font-size: var(--font-size-0)
}
}
.toolbar__container {
display: flex;
align-items: center;
justify-content: center;
height: 40px;
}
@media (min-width: 1024px) {
.toolbar__container {
justify-content: flex-start
}
}
.toolbar__rating {
display: flex;
align-items: center;
margin-left: -8px;
}
@media (min-width: 640px) {
.toolbar__rating {
margin-left: 0
}
}
.toolbar__rating:before {
content: "";
display: block;
width: 88px;
height: 16px;
background-image: url('/wp-content/themes/alarmed/dist/images/icon-stars.svg');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
margin-right: 8px;
}
.toolbar__score {
flex: 1;
}
.toolbar__score a {
text-decoration: underline;
}
.toolbar__score a:hover {
color: #32CC89;
color: var(--color-secondary);
}
.toolbar__menu {
display: none;
}
@media (min-width: 1024px) {
.toolbar__menu {
display: block;
margin-left: auto
}
}
.toolbar__menu ul {
display: flex;
}
.toolbar__menu ul li:not(:last-child) {
margin-right: 24px;
margin-right: var(--spacing-md);
}
.toolbar__menu ul li a {
color: #8386A3;
color: var(--color-grey);
transition: color 0.35s ease;
transition: color var(--transition) ease;
}
.toolbar__menu ul li a:hover {
color: #070D47;
color: var(--color-primary);
}
.header {
position: absolute;
top: 40px;
left: 0;
right: 0;
z-index: 100;
transition: background-color 0.35s;
transition: background-color var(--transition);
}
body.active-overlay .header,
body.fixed-header .header {
position: fixed;
}
@media (min-width: 1024px) {
body.admin-bar .header {
top: 72px
}
}
body.fixed-header .header {
top: 0;
background-color: rgba(7, 13, 71, 0.75);
}
.header__container {
display: flex;
align-items: center;
padding-top: 24px;
padding-top: var(--spacing-md);
padding-bottom: 24px;
padding-bottom: var(--spacing-md);
max-height: 100px;
transition: padding 0.35s;
transition: padding var(--transition);
}
body.fixed-header .header__container {
padding-top: 12px;
padding-top: var(--spacing-xs);
padding-bottom: 12px;
padding-bottom: var(--spacing-xs);
}
.header__logo {
max-width: 184px;
transition: max-width 0.35s;
transition: max-width var(--transition);
}
@media (min-width: 1024px) {
body.fixed-header .header__logo {
max-width: 164px;
}
}
@media (min-width: 1280px) {
.header__logo {
max-width: 224px
}
}
.header__logo a {
display: block;
}
.header__logo svg {
display: block;
width: 100%;
height: auto;
}
.header__menu {
display: none;
}
@media (min-width: 1024px) {
.header__menu {
display: block;
flex: 1
}
.header__menu ul {
display: flex;
align-items: center;
justify-content: center;
}
.header__menu ul li {
position: relative;
padding-top: 10px;
padding-bottom: 10px;
}
.header__menu ul li:not(:last-child) {
margin-right: 32px;
margin-right: var(--spacing-lg);
}
@media (min-width: 1280px) {
.header__menu ul li:not(:last-child) {
margin-right: 48px;
margin-right: var(--spacing-xl)
}
}
.header__menu ul li a {
display: block;
position: relative;
overflow: hidden;
color: white;
font-size: 1.125rem;
font-size: var(--font-size-2);
font-weight: 500;
font-weight: var(--font-weight-medium);
line-height: 1.5;
line-height: var(--font-lineheight-3);
}
@media (min-width: 1280px) {
.header__menu ul li a {
font-size: 1.25rem;
font-size: var(--font-size-3)
}
}
.header__menu ul li a::before {
content: '';
display: block;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background-color: #FFFFFF;
background-color: var(--color-white);
opacity: 0;
transform: translateX(-100%);
transition: all 0.35s ease;
transition: all var(--transition) ease;
}
.header__menu ul li a:hover::before {
opacity: 1;
transform: translateX(0);
}
.header__menu ul li.menu-item-has-children {
padding-right: 22px;
}
.header__menu ul li.menu-item-has-children:after {
content: "";
position: absolute;
top: calc(50% - 2px);
right: 0;
width: 14px;
height: 8px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDE0IDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNy43NjY4NiA3LjY4NTY3QzcuMzQzMzQgOC4xMDQ3NyA2LjY1NjY2IDguMTA0NzcgNi4yMzMxNCA3LjY4NTY3TDAuMzE3NjQ2IDEuODMyMDJDLTAuMTA1ODgxIDEuNDEyOTIgLTAuMTA1ODgxIDAuNzMzNDIyIDAuMzE3NjQ2IDAuMzE0MzIzQzAuNzQxMTczIC0wLjEwNDc3NiAxLjQyNzg0IC0wLjEwNDc3NiAxLjg1MTM3IDAuMzE0MzIzTDcgNS40MDkxNEwxMi4xNDg2IDAuMzE0MzI0QzEyLjU3MjIgLTAuMTA0Nzc1IDEzLjI1ODggLTAuMTA0Nzc1IDEzLjY4MjQgMC4zMTQzMjRDMTQuMTA1OSAwLjczMzQyNCAxNC4xMDU5IDEuNDEyOTIgMTMuNjgyNCAxLjgzMjAyTDcuNzY2ODYgNy42ODU2N1oiIGZpbGw9IiMzMkNDODkiLz4KPC9zdmc+Cg==");
background-size: cover;
}
.header__menu ul li.current-menu-item > a::before {
opacity: 1;
transform: translateX(0);
background-color: #32CC89;
background-color: var(--color-secondary);
}
.header__menu ul li ul {
display: block;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
background-color: #32CC89;
background-color: var(--color-secondary);
padding: 14px 18px;
border-radius: 6px;
border-radius: var(--border-radius-sm);
opacity: 0;
visibility: hidden;
transition: opacity 0.35s ease, visibility 0.35s ease;
transition: opacity var(--transition) ease, visibility var(--transition) ease;
}
.header__menu ul li ul:before {
content: "";
display: block;
position: absolute;
top: -6px;
left: 50%;
transform: translateX(-50%);
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #32CC89;
border-bottom: 6px solid var(--color-secondary);
}
.header__menu ul li ul li {
white-space: nowrap;
padding: 0;
}
.header__menu ul li ul li:not(:last-child) {
margin: 0;
margin-bottom: 2px;
}
.header__menu ul li ul li a {
display: block;
font-size: 1.125rem;
font-size: var(--font-size-2);
line-height: 1.375;
line-height: var(--font-lineheight-2);
font-weight: 600;
font-weight: var(--font-weight-semibold);
color: #070D47;
color: var(--color-primary);
}
.header__menu ul li ul li a::before {
display: none;
}
.header__menu ul li ul li a:hover {
text-decoration: underline;
}
.header__menu ul li:hover > ul {
opacity: 1;
visibility: visible;
}
}
.header__hamburger {
margin-left: auto;
}
@media (min-width: 1024px) {
.header__hamburger {
display: none
}
}
.header__actions {
display: none;
}
@media (min-width: 1024px) {
.header__actions {
margin-left: auto;
display: block
}
}
.header-spacing {
display: block;
width: 100%;
height: 100px;
background-color: #070D47;
background-color: var(--color-primary);
}
.header-spacing + .block--panorama {
margin-top: -100px;
}
.overlay {
position: fixed;
top: 40px;
left: 0;
right: 0;
bottom: 0;
z-index: 99;
background-color: #070D47;
background-color: var(--color-primary);
opacity: 0;
visibility: hidden;
transition: opacity 0.35s ease, visibility 0.35s ease;
transition: opacity var(--transition) ease, visibility var(--transition) ease;
}
body.active-overlay .overlay {
opacity: 1;
visibility: visible;
}
body.fixed-header .overlay {
top: 0;
}
@media (min-width: 1024px) {
.overlay {
display: none
}
}
.overlay__container {
display: flex;
flex-direction: column;
height: 100%;
padding: 120px 32px 32px 32px;
padding: 120px var(--spacing-lg) var(--spacing-lg) var(--spacing-lg);
}
.overlay__menu {
display: flex;
align-items: center;
flex: 1;
width: 100%;
}
.overlay__menu ul li:not(:last-child) {
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.overlay__menu ul li a {
color: white;
font-size: 1.75rem;
line-height: 1.375;
line-height: var(--font-lineheight-2);
font-weight: 600;
font-weight: var(--font-weight-semibold);
}
@media (min-width: 480px) {
.overlay__menu ul li a {
font-size: 2rem
}
}
.overlay__menu ul li ul {
margin-top: 8px;
margin-top: var(--spacing-xxs);
padding-left: 18px;
padding-left: var(--spacing-sm);
}
.overlay__menu ul li ul li:not(:last-child) {
margin-bottom: 4px;
}
.overlay__menu ul li ul li a {
color: #32CC89;
color: var(--color-secondary);
font-size: 1.375rem;
font-weight: 400;
font-weight: var(--font-weight-regular);
}
.overlay__toolbar {
display: flex;
align-items: center;
width: 100%;
flex: 1;
}
.overlay__toolbar ul li:not(:last-child) {
margin-bottom: 8px;
}
.overlay__toolbar ul li a {
color: rgba(255, 255, 255, 0.5);
}
.overlay__toolbar ul li a:hover {
color: #FFFFFF;
color: var(--color-white);
}
.block {
position: relative;
z-index: 1;
padding-top: 48px;
padding-bottom: 48px;
}
@media (min-width: 640px) {
.block {
padding-top: 80px;
padding-bottom: 80px
}
}
@media (min-width: 1024px) {
.block {
padding-top: 100px;
padding-bottom: 100px
}
}
.block__anchor {
display: block;
position: absolute;
top: -72px;
left: 0;
}
@media (min-width: 1280px) {
.block__anchor {
top: -100px
}
}
.block__header {
max-width: 896px;
max-width: var(--container-extra-small);
margin: 0 auto;
}
.block__header:not(:last-child) {
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
@media (min-width: 640px) {
.block__header:not(:last-child) {
margin-bottom: 48px;
margin-bottom: var(--spacing-xl)
}
}
.block__header--centered {
text-align: center;
}
.block__header--full {
max-width: 100%;
}
.block__title {
font-size: 2rem;
}
.block__title:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
@media (min-width: 480px) {
.block__title {
font-size: 2.25rem
}
}
@media (min-width: 640px) {
.block__title {
font-size: 3rem
}
}
.block__text strong {
color: #32CC89;
color: var(--color-secondary);
font-weight: 500;
font-weight: var(--font-weight-medium);
}
.block__action {
display: flex;
justify-content: center;
margin-top: 48px;
margin-top: var(--spacing-xl);
}
/* modifiers */
.block--overflow {
overflow-x: hidden;
}
.block--bg-white {
background-color: white;
}
.block--bg-tint {
background-color: #EDF6FF;
background-color: var(--color-tint);
}
.block--bg-dark {
color: #FFFFFF;
color: var(--color-white);
background-color: #070D47;
background-color: var(--color-primary);
}
.block--padding-no-top {
padding-top: 0 !important;
}
.block--padding-no-bottom {
padding-bottom: 0 !important;
}
.block--padding-remove {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.block--panorama + .block--intro {
padding-top: 0;
}
@media (min-width: 1024px) {
.block--panorama + .block--intro .intro {
margin-top: -15%
}
}
.post-tile {
max-width: 1164px;
max-width: var(--container-small);
margin: 0 auto;
}
.post-tile:not(:last-child) {
margin-bottom: 60px;
margin-bottom: var(--spacing-xxl);
}
@media (min-width: 768px) {
.post-tile__container {
display: flex;
align-items: center
}
}
.post-tile__image {
max-width: 546px;
overflow: hidden;
border-radius: 12px;
border-radius: var(--border-radius);
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
background-color: #070D47;
background-color: var(--color-primary);
}
@media (min-width: 768px) {
.post-tile__image {
margin-bottom: 0;
width: 48.92473118%; /* 546/1116px */
align-self: flex-start
}
}
.post-tile__image img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 4 / 3;
-o-object-fit: cover;
object-fit: cover;
transition: transform 0.35s, opacity 0.35s;
transition: transform var(--transition), opacity var(--transition);
}
.post-tile__image a {
display: block;
}
.post-tile__image a:hover img {
opacity: 0.75;
transform: scale(1.05);
}
@media (min-width: 768px) {
.post-tile__content {
flex: 1;
padding-left: 5%
}
}
.post-tile__title {
font-size: 1.5rem;
display: flex;
align-items: center;
}
@media (min-width: 640px) {
.post-tile__title {
font-size: 1.875rem
}
}
.post-tile__title:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.post-tile__excerpt {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.post-tile__date {
display: flex;
align-items: center;
font-size: 1.125rem;
line-height: 1.0;
color: #8386A3;
color: var(--color-grey);
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
.post-tile__date svg {
margin-top: -1px;
margin-right: 8px;
}
.article {
position: relative;
}
@media (min-width: 1024px) {
.article {
display: flex;
align-items: flex-start;
gap: 5%
}
}
.article__box {
background-color: #EDF6FF;
background-color: var(--color-tint);
border-radius: 12px;
border-radius: var(--border-radius);
overflow: hidden;
}
.article__box:not(:last-child) {
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
.article__sidebar {
max-width: 400px;
align-self: flex-start;
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
@media (min-width: 1024px) {
.article__sidebar {
position: sticky;
top: 124px;
width: 30%;
margin-bottom: 0
}
}
.article__content {
flex: 1;
}
.article__title {
font-size: 2rem;
line-height: 1.0;
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.article__meta {
padding: 24px;
padding: var(--spacing-md);
}
.article__date {
display: flex;
align-items: center;
font-size: 1.125rem;
line-height: 1.2;
color: #070D47;
color: var(--color-primary);
}
.article__date svg {
margin-top: -1px;
margin-right: 8px;
}
.footer {
margin-top: auto;
color: rgba(255, 255, 255, 0.75);
font-size: 1rem;
font-size: var(--font-size-1);
line-height: 1.5;
line-height: var(--font-lineheight-3);
background-color: #070D47;
background-color: var(--color-primary);
border-bottom: 10px solid #32CC89;
border-bottom: 10px solid var(--color-secondary);
}
.footer__container {
padding-top: 48px;
padding-top: var(--spacing-xl);
padding-bottom: 48px;
padding-bottom: var(--spacing-xl);
}
@media (min-width: 480px) {
.footer__container {
padding-top: 60px;
padding-top: var(--spacing-xxl);
padding-bottom: 60px;
padding-bottom: var(--spacing-xxl)
}
}
.footer__grid {
width: 100%;
display: flex;
flex-direction: column;
}
@media (min-width: 480px) {
.footer__grid {
flex-direction: row;
align-items: flex-start;
flex-wrap: wrap
}
}
.footer__column {
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
.footer__column--logo {
order: 4;
margin-top: 12px;
margin-top: var(--spacing-xs);
margin-bottom: 0;
}
@media (min-width: 480px) {
.footer__column--logo {
margin-top: 0;
order: initial;
width: 100%;
margin-bottom: 32px;
margin-bottom: var(--spacing-lg)
}
}
@media (min-width: 1024px) {
.footer__column--logo {
width: calc(100% / 4);
margin-bottom: 0
}
}
@media (min-width: 480px) {
.footer__column--menu {
width: 50%
}
}
@media (min-width: 640px) {
.footer__column--menu {
width: calc(100% / 3)
}
}
@media (min-width: 1024px) {
.footer__column--menu {
width: calc(100% / 4)
}
}
@media (min-width: 480px) {
.footer__column--contact {
margin-bottom: 0
}
}
@media (min-width: 640px) {
.footer__column--contact {
width: calc(100% / 3)
}
}
@media (min-width: 1024px) {
.footer__column--contact {
width: calc(100% / 4)
}
}
.footer__logo {
max-width: 184px;
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.footer__logo a {
display: block;
}
.footer__logo svg {
display: block;
width: 100%;
height: auto;
}
.footer__copyright:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.footer__title {
display: block;
font-size: 1.25rem;
font-size: var(--font-size-3);
font-weight: 700;
font-weight: var(--font-weight-bold);
color: #FFFFFF;
color: var(--color-white);
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.footer__title span {
color: #32CC89;
color: var(--color-secondary);
}
.footer__menu ul li:not(:last-child) {
margin-bottom: 2px;
}
.footer__menu ul li a {
display: inline-block;
position: relative;
overflow: hidden;
color: inherit;
transition: color 0.35s ease;
transition: color var(--transition) ease;
}
.footer__menu ul li a::before {
content: '';
display: block;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background-color: #FFFFFF;
background-color: var(--color-white);
opacity: 0;
transform: translateX(-100%);
transition: all 0.35s ease;
transition: all var(--transition) ease;
}
.footer__menu ul li a:hover {
color: #FFFFFF;
color: var(--color-white);
}
.footer__menu ul li a:hover::before {
opacity: 1;
transform: translateX(0);
}
.footer__address:not(:last-child) {
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.footer__text:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.footer__text p:not(:last-child) {
margin-bottom: 8px;
}
.footer__text a:hover {
color: #FFFFFF;
color: var(--color-white);
}
.footer__text small {
font-size: 0.875rem;
opacity: 0.5;
}
.footer__social:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
/* components */
button {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
border: 0;
font-family: inherit;
background: none;
cursor: pointer;
text-align: center;
}
.button, .frm_button_submit {
display: inline-block;
overflow: hidden;
position: relative;
color: #070D47;
color: var(--color-primary);
font-size: 1rem;
font-size: var(--font-size-1);
line-height: 1.0;
text-decoration: none;
text-align: center;
font-weight: 700;
font-weight: var(--font-weight-bold);
border-radius: 6px;
border-radius: var(--border-radius-sm);
padding: 14px 20px 14px 20px;
border: 2px solid transparent;
background-color: #32CC89;
background-color: var(--color-secondary);
transition: background-color .25s, transform .25s;
}
.button:hover,
.button:focus,
.frm_button_submit:hover,
.frm_button_submit:focus {
cursor: pointer;
text-decoration: none;
transform: scale(1.01);
background-color: #26bd7c;
background-color: var(--color-secondary-dark);
}
.button:focus,
.button:active,
.frm_button_submit:focus,
.frm_button_submit:active {
outline: none;
}
.button[disabled], .frm_button_submit[disabled] {
cursor: not-allowed;
}
/* modifiers */
.button--small, .frm_button_submit--small {
font-size: 0.9375rem;
font-size: var(--font-size-0);
padding: 12px 16px;
}
.button--outline, .frm_button_submit--outline {
color: #32CC89;
color: var(--color-secondary);
background-color: transparent;
border-color: #32CC89;
border-color: var(--color-secondary);
}
.button--outline:hover,
.button--outline:focus,
.frm_button_submit--outline:hover,
.frm_button_submit--outline:focus {
background-color: transparent;
}
.link {
display: inline-block;
overflow: hidden;
position: relative;
color: #32CC89;
color: var(--color-secondary);
line-height: 1.375;
line-height: var(--font-lineheight-2);
font-weight: 500;
font-weight: var(--font-weight-medium);
text-decoration: none;
padding-right: 17px;
transition: color 0.35s;
transition: color var(--transition);
}
.link-inner {
position: relative;
display: block;
padding-bottom: 2px;
}
.link-inner:before,
.link-inner:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 2px;
background-color: #32CC89;
background-color: var(--color-secondary);
}
.link-inner:before {
z-index: 2;
opacity: 0;
transform: translateX(-100%);
background-color: #070D47;
background-color: var(--color-primary);
transition: all 0.35s;
transition: all var(--transition);
}
.block--bg-dark .link-inner:before {
background-color: #6590FF;
background-color: var(--color-primary-tint);
}
.link-arrow {
position: absolute;
top: 6px;
right: -17px;
}
.link:hover {
color: #070D47;
color: var(--color-primary);
}
.block--bg-dark .link:hover {
color: #6590FF;
color: var(--color-primary-tint);
}
.link:hover .link-inner:before {
opacity: 1;
transform: translateX(0);
}
.hamburger {
display: block;
position: relative;
overflow: hidden;
width: 48px;
height: 48px;
border-radius: 50%;
border: 2px solid #FFFFFF;
border: 2px solid var(--color-white);
}
.hamburger span {
display: block;
position: absolute;
top: calc(50% - 1px);
left: 10px;
right: 10px;
height: 2px;
background-color: #FFFFFF;
background-color: var(--color-white);
}
.hamburger span:before,
.hamburger span:after {
content: "";
position: absolute;
display: block;
left: 0;
width: 100%;
height: 2px;
background-color: #FFFFFF;
background-color: var(--color-white);
}
.hamburger span:before {
top: -8px;
}
.hamburger span:after {
bottom: -8px;
}
.active-overlay .hamburger {
border-color: #32CC89;
border-color: var(--color-secondary);
}
.active-overlay .hamburger span {
background-color: transparent;
}
.active-overlay .hamburger span:before {
top: 0;
transform: rotate(45deg);
background-color: #32CC89;
background-color: var(--color-secondary);
}
.active-overlay .hamburger span:after {
bottom: 0;
transform: rotate(-45deg);
background-color: #32CC89;
background-color: var(--color-secondary);
}
input[type='text'], input[type='url'], input[type='email'], input[type='tel'], input[type='number'], input[type='password'], select, textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 100%;
max-width: 100%;
border: 1px solid #B4DAFF;
border: 1px solid var(--color-border);
border-radius: 6px;
border-radius: var(--border-radius-sm);
font-family: inherit;
font-weight: inherit;
font-size: 1rem;
line-height: 1.2;
height: 45px;
padding: 0 14px;
color: #070D47;
color: var(--color-primary);
font-weight: 400;
font-weight: var(--font-weight-regular);
background-color: white;
transition: border-color 0.35s;
transition: border-color var(--transition);
}
.gfield_error input[type='text'], .gfield_error input[type='url'], .gfield_error input[type='email'], .gfield_error input[type='tel'], .gfield_error input[type='number'], .gfield_error input[type='password'], .gfield_error select, .gfield_error textarea {
border-color: #df3639;
border-color: var(--color-red);
}
input[type='text']:focus, input[type='url']:focus, input[type='email']:focus, input[type='tel']:focus, input[type='number']:focus, input[type='password']:focus, select:focus, textarea:focus {
outline: none;
border-color: #8ab3dc;
border-color: var(--color-border-dark);
}
input[type='text'][disabled], input[type='url'][disabled], input[type='email'][disabled], input[type='tel'][disabled], input[type='number'][disabled], input[type='password'][disabled], select[disabled], textarea[disabled] {
background-color: #8386A3;
background-color: var(--color-grey);
cursor: not-allowed;
}
input[type='text']::-webkit-input-placeholder, input[type='url']::-webkit-input-placeholder, input[type='email']::-webkit-input-placeholder, input[type='tel']::-webkit-input-placeholder, input[type='number']::-webkit-input-placeholder, input[type='password']::-webkit-input-placeholder, select::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: #070D47;
color: var(--color-primary);
opacity: 0.5;
}
input[type='text']::-moz-placeholder, input[type='url']::-moz-placeholder, input[type='email']::-moz-placeholder, input[type='tel']::-moz-placeholder, input[type='number']::-moz-placeholder, input[type='password']::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder {
color: #070D47;
color: var(--color-primary);
opacity: 0.5;
}
input[type='text']:-ms-input-placeholder, input[type='url']:-ms-input-placeholder, input[type='email']:-ms-input-placeholder, input[type='tel']:-ms-input-placeholder, input[type='number']:-ms-input-placeholder, input[type='password']:-ms-input-placeholder, select:-ms-input-placeholder, textarea:-ms-input-placeholder {
color: #070D47;
color: var(--color-primary);
opacity: 0.5;
}
input[type='text']:-moz-placeholder, input[type='url']:-moz-placeholder, input[type='email']:-moz-placeholder, input[type='tel']:-moz-placeholder, input[type='number']:-moz-placeholder, input[type='password']:-moz-placeholder, select:-moz-placeholder, textarea:-moz-placeholder {
color: #070D47;
color: var(--color-primary);
opacity: 0.5;
}
textarea {
max-width: 100%;
width: 100%;
padding: 14px;
min-height: 120px;
}
input[type='number'] {
-moz-appearance: textfield;
}
/* Chrome, Safari, Edge, Opera */
input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
select {
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEyIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNi42NTczMSA2LjcyNDk3QzYuMjk0MjkgNy4wOTE2OCA1LjcwNTcxIDcuMDkxNjggNS4zNDI2OSA2LjcyNDk3TDAuMjcyMjY3IDEuNjAzMDFDLTAuMDkwNzU1OCAxLjIzNjMgLTAuMDkwNzU1OCAwLjY0MTc0NSAwLjI3MjI2NyAwLjI3NTAzNEMwLjYzNTI5IC0wLjA5MTY3OCAxLjIyMzg3IC0wLjA5MTY3NzkgMS41ODY4OSAwLjI3NTAzNEw2IDQuNzMyOTlMMTAuNDEzMSAwLjI3NTAzNUMxMC43NzYxIC0wLjA5MTY3NzEgMTEuMzY0NyAtMC4wOTE2NzcxIDExLjcyNzcgMC4yNzUwMzVDMTIuMDkwOCAwLjY0MTc0NiAxMi4wOTA4IDEuMjM2MyAxMS43Mjc3IDEuNjAzMDJMNi42NTczMSA2LjcyNDk3WiIgZmlsbD0iIzMyQ0M4OSIvPgo8L3N2Zz4K");
background-size: 12px 7px;
background-repeat: no-repeat;
background-position: calc(100% - 12px) 50%;
}
/* GravityForms styles */
.gform_wrapper {
font-size: 1rem;
font-size: var(--font-size-1);
line-height: 1.5;
}
.gform_wrapper .gform_validation_container{
display:none !important;
left: -9000px;
position: absolute !important
}
.gform_wrapper .gfield_visibility_hidden,
.gform_wrapper .screen-reader-text {
display: none;
}
.gform_wrapper .gfield_required {
display: inline-block;
margin-left: 2px;
}
.gform_wrapper .gf_placeholder {
color: #070D47;
color: var(--color-primary);
opacity: 0.5;
}
.gform_wrapper .gform_title {
font-size: 1.75rem;
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
@media (min-width: 640px) {
.gform_wrapper .gform_title {
font-size: 2rem;
font-size: var(--font-size-5)
}
}
.gform_wrapper .gform_description {
font-size: 1.0625rem;
}
.gform_wrapper .gform_description:not(:last-child) {
margin-bottom: 0;
}
.gform_wrapper .gform_fields {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.gform_wrapper .gform_required_legend {
display: none;
}
.gform_wrapper .gfield {
width: 100%;
border: 0;
margin: 0 0 20px 0;
padding: 0;
}
@media (min-width: 480px) {
.gform_wrapper .gfield.gfield--width-third {
width: calc(33.333% - 12px)
}
}
@media (min-width: 480px) {
.gform_wrapper .gfield.gfield--width-half {
width: calc(50% - 10px)
}
}
.gform_wrapper .gfield .gfield_label {
position: relative;
display: flex;
align-items: center;
line-height: 1.25;
font-weight: 500;
font-weight: var(--font-weight-medium);
margin-bottom: 8px;
}
.gform_wrapper .gfield.gfield_error .gfield_label {
color: #df3639;
color: var(--color-red);
}
.gform_wrapper .gfield .gfield_description {
display: none;
}
.gform_wrapper .gfield.hidden_label > label,
.gform_wrapper .gfield.hidden_label .gfield_label {
display: none;
}
.gform_wrapper .gfield.gfield_error .validation_message {
display: none;
}
.gform_wrapper .gfield .gfield_radio,
.gform_wrapper .gfield .gfield_checkbox {
display: flex;
flex-wrap: wrap;
}
.gform_wrapper .gfield .gchoice {
display: flex;
align-items: flex-start;
}
.gform_wrapper .gfield .gchoice:not(:last-child) {
margin-right: 18px;
margin-right: var(--spacing-sm);
}
.gform_wrapper .gfield .gchoice .gform-field-label {
display: inline-block;
position: relative;
padding-left: 28px;
}
.gform_wrapper .gfield .gchoice .gform-field-label:hover {
cursor: pointer;
}
.gform_wrapper .gfield .gchoice .gform-field-label:before {
content: "";
display: block;
position: absolute;
top: 2px;
left: 0;
width: 20px;
height: 20px;
border: 1px solid #B4DAFF;
border: 1px solid var(--color-border);
background-color: #FFFFFF;
background-color: var(--color-white);
border-radius: 50%;
}
.gfield_checkbox .gform_wrapper .gfield .gchoice .gform-field-label:before {
border-radius: 0;
}
.gform_wrapper .gfield .gchoice .gform-field-label:after {
content: "";
display: none;
position: absolute;
z-index: 2;
top: 8px;
left: 4px;
width: 12px;
height: 9px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzIzOCAwLjIzNTU0OEMxMi4wODIxIDAuNTU4NTMgMTIuMDkzMyAxLjA5MjY2IDExLjc0ODcgMS40Mjg1Nkw0LjI0ODc1IDguNzQxMDZDNC4wNzU1IDguOTA5OTkgMy44MzUxIDkuMDAzNzUgMy41ODUxNyA4Ljk5OTg4QzMuMzM1MjMgOC45OTYwMiAzLjA5ODI2IDguODk0ODggMi45MzEwNCA4LjcyMDY5TDAuMjMxMDQzIDUuOTA4MTlDLTAuMTAxNDcgNS41NjE4MiAtMC4wNzE1MTk1IDUuMDI4MzMgMC4yOTc5MzkgNC43MTY2QzAuNjY3Mzk4IDQuNDA0ODYgMS4yMzY0NiA0LjQzMjk0IDEuNTY4OTcgNC43NzkzMUwzLjYyMTc5IDYuOTE3NjdMMTAuNDUxMyAwLjI1ODk0QzEwLjc5NTggLTAuMDc2OTYwNyAxMS4zNjU1IC0wLjA4NzQzMzcgMTEuNzIzOCAwLjIzNTU0OFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=");
background-size: cover;
transform: scale(0.8);
}
.gform_wrapper .gfield .gchoice .gfield-choice-input {
display: none;
}
.gform_wrapper .gfield .gchoice .gfield-choice-input:checked ~ .gform-field-label:before {
border-color: #32CC89;
border-color: var(--color-secondary);
background-color: #32CC89;
background-color: var(--color-secondary);
}
.gform_wrapper .gfield .gchoice .gfield-choice-input:checked ~ .gform-field-label:after {
display: block;
}
.gform_wrapper .gfield .gfield_checkbox .gchoice .gform-field-label:before {
border-radius: 5px;
}
.gform_wrapper .gfield .gfield_checkbox .gchoice .gform-field-label:after {
content: "";
display: none;
position: absolute;
z-index: 2;
top: 8px;
left: 4px;
width: 12px;
height: 9px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzIzOCAwLjIzNTU0OEMxMi4wODIxIDAuNTU4NTMgMTIuMDkzMyAxLjA5MjY2IDExLjc0ODcgMS40Mjg1Nkw0LjI0ODc1IDguNzQxMDZDNC4wNzU1IDguOTA5OTkgMy44MzUxIDkuMDAzNzUgMy41ODUxNyA4Ljk5OTg4QzMuMzM1MjMgOC45OTYwMiAzLjA5ODI2IDguODk0ODggMi45MzEwNCA4LjcyMDY5TDAuMjMxMDQzIDUuOTA4MTlDLTAuMTAxNDcgNS41NjE4MiAtMC4wNzE1MTk1IDUuMDI4MzMgMC4yOTc5MzkgNC43MTY2QzAuNjY3Mzk4IDQuNDA0ODYgMS4yMzY0NiA0LjQzMjk0IDEuNTY4OTcgNC43NzkzMUwzLjYyMTc5IDYuOTE3NjdMMTAuNDUxMyAwLjI1ODk0QzEwLjc5NTggLTAuMDc2OTYwNyAxMS4zNjU1IC0wLjA4NzQzMzcgMTEuNzIzOCAwLjIzNTU0OFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=");
background-size: cover;
transform: scale(0.8);
}
/* timeslots */
.gform_wrapper .gfield.gfield--timeslots .gfield_radio {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 8px;
grid-gap: var(--spacing-xxs);
gap: 8px;
gap: var(--spacing-xxs);
}
@media (min-width: 480px) {
.gform_wrapper .gfield.gfield--timeslots .gfield_radio {
grid-template-columns: repeat(5, 1fr)
}
}
.gform_wrapper .gfield.gfield--timeslots .gchoice:not(:last-child) {
margin-right: 0;
}
.gform_wrapper .gfield.gfield--timeslots .gchoice .gform-field-label {
display: block;
padding: 8px;
width: 100%;
text-align: center;
font-size: 0.9375rem;
font-size: var(--font-size-0);
font-weight: 600;
font-weight: var(--font-weight-semibold);
background-color: rgba(180, 218, 255, 0.5);
border-radius: 6px;
border-radius: var(--border-radius-sm);
transition: color 0.35s, background-color 0.35s;
transition: color var(--transition), background-color var(--transition);
}
.gform_wrapper .gfield.gfield--timeslots .gchoice .gform-field-label:hover {
opacity: 1;
}
.gform_wrapper .gfield.gfield--timeslots .gchoice .gform-field-label:before,
.gform_wrapper .gfield.gfield--timeslots .gchoice .gform-field-label:after {
display: none !important;
}
.gform_wrapper .gfield.gfield--timeslots .gchoice .gfield-choice-input {
display: none;
}
.gform_wrapper .gfield.gfield--timeslots .gchoice .gfield-choice-input:checked ~ .gform-field-label {
color: #FFFFFF;
color: var(--color-white);
background-color: #070D47;
background-color: var(--color-primary);
}
.gform_wrapper .gform_button {
display: block;
width: 100%;
}
.gform_wrapper .gform_validation_errors {
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.gform_wrapper .gform_validation_errors:active,
.gform_wrapper .gform_validation_errors:focus {
outline: none;
}
.gform_wrapper .ginput_container_date {
position: relative;
}
.gform_wrapper .ginput_container_date .ui-datepicker-trigger {
position: absolute;
top: 14px;
right: 16px;
z-index: 2;
width: 16px;
height: 16px;
}
.gfield_tooltip_wrapper {
position: relative;
margin-left: 6px;
}
.gfield_tooltip {
position: absolute;
bottom: calc(100% + 10px);
left: 50%;
transform: translateX(-50%);
padding: 10px 12px;
padding: 10px var(--spacing-xs);
border-radius: 6px;
border-radius: var(--border-radius-sm);
font-size: 0.8125rem;
font-weight: 500;
font-weight: var(--font-weight-medium);
line-height: 1.25;
line-height: var(--font-lineheight-1);
background-color: #B4DAFF;
background-color: var(--color-primary-light);
color: #070D47;
color: var(--color-primary);
text-align: center;
z-index: 1000;
width: 224px;
display: none;
}
.gfield_tooltip:before {
content: "";
display: block;
position: absolute;
bottom: -8px;
left: 50%;
transform: translateX(-50%);
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #B4DAFF;
border-top: 8px solid var(--color-primary-light);
}
.gfield_tooltip_trigger {
display: flex;
align-items: center;
justify-content: center;
width: 18px;
height: 18px;
font-size: 0.75rem;
border-radius: 50%;
color: #070D47;
color: var(--color-primary);
font-weight: 700;
font-weight: var(--font-weight-bold);
background-color: #B4DAFF;
background-color: var(--color-primary-light);
}
.gfield_tooltip_trigger:hover {
cursor: help;
}
.gform_confirmation_message {
display: inline-block;
color: #32CC89;
color: var(--color-secondary);
background-color: #DFF2BF;
font-size: 0.875rem;
line-height: 1.25;
padding: 10px 14px;
border-radius: 8px;
}
.ui-datepicker {
background: #FFFFFF;
background: var(--color-white);
border-radius: 6px;
border-radius: var(--border-radius-sm);
box-shadow: 0 0 18px rgba(0, 0, 0, 0.15);
color: #070D47;
color: var(--color-primary);
font-size: 0.6875rem;
font-weight: 500;
font-weight: var(--font-weight-medium);
max-width: 400px;
width: auto;
z-index: 9999 !important;
}
.ui-datepicker table,
.ui-datepicker td,
.ui-datepicker th,
.ui-datepicker thead,
.ui-datepicker tr {
background: 0 0;
border: 0;
margin: 0
}
.ui-datepicker td,
.ui-datepicker th {
padding: 5px;
text-shadow: none;
text-transform: none;
}
.ui-datepicker .ui-datepicker-header {
border: 0;
display: flex;
flex-direction: row;
justify-content: center;
margin: 0;
padding: 10px;
position: relative;
width: 100%
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next,
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
align-items: center;
background: none;
border: 0;
color: #070D47;
color: var(--color-primary);
cursor: pointer;
display: flex;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
height: 15px;
justify-content: center;
line-height: 1;
position: absolute;
text-decoration: none;
top: 50%;
transform: translateY(-50%);
transition: color .3s ease-in-out, background-color .3s ease-in-out, border-color .3s ease-in-out;
width: 17px;
background-image: url('/wp-content/themes/alarmed/dist/images/icon-arrow-right.svg');
background-size: cover;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next .ui-icon,
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev .ui-icon {
display: none
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next::before,
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev::before {
border: 0;
height: auto;
position: static;
transform: none;
width: auto
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
left: 12px;
transform: translateY(-50%) rotate(180deg);
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next {
right: 12px;
}
.ui-datepicker .ui-datepicker-title {
flex: 1;
display: flex;
justify-content: center;
}
.ui-datepicker .ui-datepicker-title select {
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
background-image: url('/wp-content/themes/alarmed/dist/images/icon-chevron-down.svg');
background-position: calc(100% - 2px) 50%;
background-repeat: no-repeat;
background-size: 24px 24px;
background-color: transparent;
border: 1px solid #B4DAFF;
border: 1px solid var(--color-primary-light);
border-radius: 5px;
box-shadow: none;
color: #070D47;
color: var(--color-primary);
cursor: pointer;
display: inline-block;
font-size: .875rem;
font-weight: 400;
font-weight: var(--font-weight-regular);
height: auto;
min-height: 0;
padding: 6px 24px 6px 10px;
margin: 0 5px;
width: 110px;
}
.ui-datepicker .ui-datepicker-calendar {
table-layout: fixed;
width: 100%
}
.ui-datepicker .ui-datepicker-calendar a,
.ui-datepicker .ui-datepicker-calendar span {
font-weight: 500;
font-weight: var(--font-weight-medium);
}
.ui-datepicker .ui-datepicker-calendar th span {
align-items: center;
color: #070D47;
color: var(--color-primary);
display: flex;
font-size: .8125rem;
font-weight: 500;
font-weight: var(--font-weight-medium);
height: 40px;
justify-content: center;
width: 40px
}
.ui-datepicker .ui-datepicker-calendar td {
font-size: .8125rem;
height: 50px;
width: 50px
}
.ui-datepicker .ui-datepicker-calendar .ui-state-default {
align-items: center;
background-color: #EDF6FF;
background-color: var(--color-tint);
border-radius: 100%;
box-shadow: none;
color: #070D47;
color: var(--color-primary);
font-weight: 600;
font-weight: var(--font-weight-semibold);
display: flex;
height: 40px;
justify-content: center;
text-decoration: none;
transition: color .3s ease-in-out, background-color .3s ease-in-out, border-color .3s ease-in-out;
width: 40px
}
.ui-datepicker .ui-datepicker-calendar .ui-state-default:focus,
.ui-datepicker .ui-datepicker-calendar .ui-state-default:hover {
outline: 0
}
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-current-day .ui-state-default {
background: #070D47;
background: var(--color-primary);
border-color: #070D47;
border-color: var(--color-primary);
color: #FFFFFF;
color: var(--color-white);
}
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-current-day .ui-state-default:focus,
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-current-day .ui-state-default:hover {
border-color: #070D47;
border-color: var(--color-primary)
}
.ui-datepicker .ui-datepicker-calendar .ui-state-disabled {
background: 0 0
}
.ui-datepicker .ui-datepicker-calendar .ui-state-disabled .ui-state-default {
align-items: center;
background: #f2f3f5;
border-radius: 100%;
color: #686e77;
font-weight: 400;
font-weight: var(--font-weight-regular);
cursor: text;
display: flex;
height: 40px;
justify-content: center;
text-decoration: none;
width: 40px
}
@media ( max-width: 640px ) {
.ui-datepicker {
max-width: 320px;
}
.ui-datepicker .ui-datepicker-header {
margin-bottom: 10px;
}
.ui-datepicker td,
.ui-datepicker th {
padding: 3px;
}
.ui-datepicker .ui-datepicker-calendar th span {
height: 30px;
width: 30px;
}
.ui-datepicker .ui-datepicker-calendar td {
height: 30px;
width: 30px;
}
.ui-datepicker .ui-datepicker-calendar .ui-state-default {
height: 30px;
width: 30px;
}
.ui-datepicker .ui-datepicker-calendar .ui-state-disabled .ui-state-default {
height: 30px;
width: 30px;
}
}
.social-icons {
display: flex;
}
.social-icon {
color: #32CC89;
color: var(--color-secondary);
}
.social-icon:hover {
color: #FFFFFF;
color: var(--color-white);
}
.social-icon:not(:last-child) {
margin-right: 12px;
margin-right: var(--spacing-xs);
}
.swiper-button-prev, .swiper-button-next {
position: absolute;
top: calc(100% - 24px);
color: #8386A3;
color: var(--color-grey);
display: flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
transition: opacity 0.35s;
transition: opacity var(--transition);
}
@media (min-width: 1280px) {
.swiper-button-prev, .swiper-button-next {
top: 50%;
transform: translateY(-50%)
}
}
.swiper-button-prev svg, .swiper-button-next svg {
display: block;
max-width: 12px;
height: auto;
}
@media (min-width: 1280px) {
.swiper-button-prev svg, .swiper-button-next svg {
max-width: 14px
}
}
.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled {
opacity: 0.5;
}
.swiper-button-prev.swiper-button-lock, .swiper-button-next.swiper-button-lock {
display: none;
}
.swiper-button-prev {
left: 0;
}
.timeline .swiper-button-prev {
left: 18px;
}
@media (min-width: 1280px) {
.swiper-button-prev {
left: -60px !important
}
}
.swiper-button-next {
right: 0;
}
.timeline .swiper-button-next {
right: 18px;
}
@media (min-width: 1280px) {
.swiper-button-next {
right: -60px !important
}
}
.swiper-pagination-bullets {
display: flex;
align-items: center;
justify-content: center;
margin-top: 32px;
margin-top: var(--spacing-lg);
}
.swiper-pagination-bullets .swiper-pagination-bullet {
display: block;
width: 12px;
height: 12px;
border-radius: 50%;
background-color: transparent;
border: 1px solid #070D47;
border: 1px solid var(--color-primary);
margin: 0 2px;
opacity: 0.25;
transform: scale(0.75);
transform-origin: center;
transition: opacity 0.35s, transform 0.35s, background-color 0.35s;
transition: opacity var(--transition), transform var(--transition), background-color var(--transition);
}
.block--bg-dark .swiper-pagination-bullets .swiper-pagination-bullet {
border-color: #FFFFFF;
border-color: var(--color-white);
}
.swiper-pagination-bullets .swiper-pagination-bullet:hover {
cursor: pointer;
}
.swiper-pagination-bullets .swiper-pagination-bullet-active {
opacity: 0.5;
transform: scale(1);
background-color: #070D47;
background-color: var(--color-primary);
}
.block--bg-dark .swiper-pagination-bullets .swiper-pagination-bullet-active {
background-color: #FFFFFF;
background-color: var(--color-white);
}
.swiper-pagination-bullets.swiper-pagination-lock {
display: none;
}
.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1000;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
opacity: 0;
visibility: hidden;
transition: opacity .25s, visibility .25s;
}
.modal.is-active {
opacity: 1;
visibility: visible;
}
.modal__inner {
position: absolute;
z-index: 2;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: auto;
background-color: #EDF6FF;
background-color: var(--color-tint);
}
@media (min-width: 640px) {
.modal__inner {
top: 50%;
left: 50%;
right: auto;
bottom: auto;
transform: translate(-50%, -50%);
width: 100%;
max-height: 95vh;
max-width: 664px;
border-radius: 12px;
border-radius: var(--border-radius)
}
}
.modal__inner .gform_validation_errors {
display: none !important;
}
.modal__inner .gform_confirmation_message {
background-color: #FFFFFF;
background-color: var(--color-white);
}
.modal__inner .gfield-intro {
width: auto !important;
margin-top: -32px;
margin-left: -32px;
margin-right: -32px;
margin-bottom: 28px;
padding: 32px 32px 28px 32px;
background-color: #FFFFFF !important;
background-color: var(--color-white) !important;
}
.modal__inner .gform_body,
.modal__inner .gform_footer,
.modal__inner .gform_confirmation_message {
padding: 24px;
padding: var(--spacing-md);
}
@media (min-width: 640px) {
.modal__inner .gform_body,
.modal__inner .gform_footer,
.modal__inner .gform_confirmation_message {
padding: 32px;
padding: var(--spacing-lg)
}
}
.modal__inner .gform_body {
padding-bottom: 0;
}
.modal__inner .gform_footer {
padding-top: 0;
}
.modal__outro {
text-align: center;
font-size: 0.9375rem;
font-size: var(--font-size-0);
line-height: 1.375;
line-height: var(--font-lineheight-2);
padding: 20px;
padding-top: 0;
margin-top: -6px;
}
@media (min-width: 640px) {
.modal__outro {
margin-top: -12px
}
}
.modal__outro a {
font-weight: 500;
font-weight: var(--font-weight-medium);
}
.modal__backdrop {
position: fixed;
z-index: 1;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(7, 13, 71, 0.9);
}
.modal__usps {
background-color: #EDF6FF;
background-color: var(--color-tint);
padding: 18px 24px;
padding: var(--spacing-sm) var(--spacing-md);
border-top: 1px solid #B4DAFF;
border-top: 1px solid var(--color-border);
}
@media (min-width: 640px) {
.modal__usps {
display: flex
}
}
.modal__usp {
flex: 1;
display: flex;
align-items: center;
font-size: 0.9375rem;
font-size: var(--font-size-0);
font-weight: 600;
font-weight: var(--font-weight-semibold);
}
.modal__usp:not(:last-child) {
margin-bottom: 4px;
}
@media (min-width: 640px) {
.modal__usp:not(:last-child) {
margin-bottom: 0
}
}
@media (min-width: 640px) {
.modal__usp {
justify-content: center;
text-align: center
}
}
.modal__usp:before {
content: "";
display: block;
width: 18px;
height: 18px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOSAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuMjUgMEM3LjQ2OTk3IDAgNS43Mjk5MSAwLjUyNzg0MSA0LjI0OTg3IDEuNTE2NzdDMi43Njk4MyAyLjUwNTcxIDEuNjE2MjggMy45MTEzMSAwLjkzNTA4OCA1LjU1NTg1QzAuMjUzOSA3LjIwMDM4IDAuMDc1NjY5NiA5LjAwOTk4IDAuNDIyOTM2IDEwLjc1NThDMC43NzAyMDMgMTIuNTAxNiAxLjYyNzM3IDE0LjEwNTMgMi44ODYwNCAxNS4zNjRDNC4xNDQ3MSAxNi42MjI2IDUuNzQ4MzYgMTcuNDc5OCA3LjQ5NDE5IDE3LjgyNzFDOS4yNDAwMiAxOC4xNzQzIDExLjA0OTYgMTcuOTk2MSAxMi42OTQyIDE3LjMxNDlDMTQuMzM4NyAxNi42MzM3IDE1Ljc0NDMgMTUuNDgwMiAxNi43MzMyIDE0LjAwMDFDMTcuNzIyMiAxMi41MjAxIDE4LjI1IDEwLjc4IDE4LjI1IDlDMTguMjQ3NSA2LjYxMzgyIDE3LjI5ODUgNC4zMjYxIDE1LjYxMTIgMi42Mzg4MkMxMy45MjM5IDAuOTUxNTQgMTEuNjM2MiAwLjAwMjUxOTg0IDkuMjUgMFpNMTMuMjAxMyA3LjQxMjg4TDguMzU1MiAxMi4yNTlDOC4yOTA5IDEyLjMyMzQgOC4yMTQ1NCAxMi4zNzQ1IDguMTMwNSAxMi40MDkzQzguMDQ2NDUgMTIuNDQ0MSA3Ljk1NjM3IDEyLjQ2MjEgNy44NjUzOSAxMi40NjIxQzcuNzc0NDEgMTIuNDYyMSA3LjY4NDMyIDEyLjQ0NDEgNy42MDAyNyAxMi40MDkzQzcuNTE2MjMgMTIuMzc0NSA3LjQzOTg4IDEyLjMyMzQgNy4zNzU1OCAxMi4yNTlMNS4yOTg2NiAxMC4xODIxQzUuMTY4NzUgMTAuMDUyMiA1LjA5NTc3IDkuODc2MDIgNS4wOTU3NyA5LjY5MjMxQzUuMDk1NzcgOS41MDg1OSA1LjE2ODc1IDkuMzMyNCA1LjI5ODY2IDkuMjAyNUM1LjQyODU2IDkuMDcyNTkgNS42MDQ3NSA4Ljk5OTYxIDUuNzg4NDYgOC45OTk2MUM1Ljk3MjE4IDguOTk5NjEgNi4xNDgzNyA5LjA3MjU5IDYuMjc4MjcgOS4yMDI1TDcuODY1MzkgMTAuNzkwNUwxMi4yMjE3IDYuNDMzMjdDMTIuMjg2MSA2LjM2ODk1IDEyLjM2MjQgNi4zMTc5MiAxMi40NDY1IDYuMjgzMTFDMTIuNTMwNSA2LjI0ODMgMTIuNjIwNiA2LjIzMDM4IDEyLjcxMTUgNi4yMzAzOEMxMi44MDI1IDYuMjMwMzggMTIuODkyNiA2LjI0ODMgMTIuOTc2NiA2LjI4MzExQzEzLjA2MDcgNi4zMTc5MiAxMy4xMzcgNi4zNjg5NSAxMy4yMDEzIDYuNDMzMjdDMTMuMjY1NyA2LjQ5NzU5IDEzLjMxNjcgNi41NzM5NSAxMy4zNTE1IDYuNjU3OTlDMTMuMzg2MyA2Ljc0MjAzIDEzLjQwNDIgNi44MzIxMSAxMy40MDQyIDYuOTIzMDhDMTMuNDA0MiA3LjAxNDA0IDEzLjM4NjMgNy4xMDQxMiAxMy4zNTE1IDcuMTg4MTZDMTMuMzE2NyA3LjI3MjIgMTMuMjY1NyA3LjM0ODU2IDEzLjIwMTMgNy40MTI4OFoiIGZpbGw9IiMzMkNDODkiLz4KPC9zdmc+Cg==");
background-size: cover;
margin-right: 8px;
margin-right: var(--spacing-xxs);
}
.modal__close {
position: absolute;
top: 18px;
top: var(--spacing-sm);
right: 18px;
right: var(--spacing-sm);
width: 24px;
height: 24px;
}
.modal__close:hover {
opacity: 1;
}
.modal__close:before,
.modal__close:after {
content: "";
position: absolute;
top: 0;
left: 11px;
height: 25px;
width: 2px;
border-radius: 1px;
background-color: #070D47;
background-color: var(--color-primary);
transition: background-color 0.35s;
transition: background-color var(--transition);
}
.modal__close:before {
transform: rotate(45deg);
}
.modal__close:after {
transform: rotate(-45deg);
}
.modal__close:hover:before,
.modal__close:hover:after {
background-color: #32CC89;
background-color: var(--color-secondary);
}
/* blocks */
.panorama {
position: relative;
display: block;
width: 100%;
color: white;
background-color: #070D47;
background-color: var(--color-primary);
}
.panorama__image {
position: relative;
}
@media (min-width: 768px) {
.panorama__image {
position: absolute;
z-index: 1;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%
}
}
.panorama__image img {
display: block;
width: 100%;
aspect-ratio: 1 / 1;
-o-object-fit: cover;
object-fit: cover;
}
@media (min-width: 640px) {
.panorama__image img {
aspect-ratio: auto;
height: 100%
}
}
.panorama__container {
position: relative;
z-index: 4;
padding-top: 48px;
padding-top: var(--spacing-xl);
padding-bottom: 48px;
padding-bottom: var(--spacing-xl);
}
@media (min-width: 768px) {
.panorama__container {
display: flex;
flex-direction: column;
justify-content: center;
aspect-ratio: 9 / 6
}
}
.panorama__content {
position: relative;
margin-top: -35%;
}
@media (min-width: 768px) {
.panorama__content {
margin-top: 0
}
}
.panorama__title {
font-size: 2.8125rem;
line-height: 1.0;
font-weight: 900;
font-weight: var(--font-weight-extra-bold);
}
@media (min-width: 480px) {
.panorama__title {
font-size: 3.75rem
}
}
@media (min-width: 640px) {
.panorama__title {
font-size: 4.5rem;
max-width: 720px
}
}
.panorama__title:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
@media (min-width: 640px) {
.panorama__title:not(:last-child) {
margin-bottom: 32px;
margin-bottom: var(--spacing-lg)
}
}
.panorama__actions {
display: flex;
flex-direction: column;
}
@media (min-width: 640px) {
.panorama__actions {
flex-direction: row
}
}
.panorama__action:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
@media (min-width: 640px) {
.panorama__action:not(:last-child) {
margin-bottom: 0;
margin-right: 18px;
margin-right: var(--spacing-sm)
}
}
.panorama__ribbon {
position: absolute;
bottom: 110%;
right: 0;
width: 136px;
height: 136px;
display: flex;
align-items: center;
justify-content: center;
color: #070D47;
color: var(--color-primary);
font-size: 1.125rem;
line-height: 1.15;
background-color: #B4DAFF;
background-color: var(--color-primary-light);
box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.2);
border-radius: 50%;
transform: scale(0.8) rotate(12deg);
}
@media (min-width: 480px) {
.panorama__ribbon {
bottom: 0
}
}
@media (min-width: 640px) {
.panorama__ribbon {
transform: scale(1) rotate(12deg)
}
}
@media (min-width: 1024px) {
.panorama__ribbon {
transform: scale(1) rotate(12deg);
right: 18px;
right: var(--spacing-sm);
bottom: -18px
}
}
.panorama__ribbon span {
display: block;
text-align: center;
}
.panorama__ribbon strong {
font-size: 1.875rem;
font-weight: 900;
font-weight: var(--font-weight-extra-bold);
}
.panorama__shadow {
position: absolute;
z-index: 3;
left: 0;
right: 0;
width: 100%;
height: 50%;
}
.panorama__shadow--top {
top: 0;
background: linear-gradient(0deg, rgba(7,13,71,0) 0%, rgba(7,13,71,1) 100%);
}
.panorama__shadow--bottom {
bottom: 0;
background: linear-gradient(180deg, rgba(7,13,71,0) 0%, rgba(7,13,71,1) 100%);
}
.panorama__overlay {
position: absolute;
z-index: 2;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: #070D47;
background-color: var(--color-primary);
}
/* small */
@media (min-width: 640px) {
.panorama--small .panorama__container {
aspect-ratio: 4 / 2
}
}
@media (min-width: 640px) {
.panorama--small .panorama__content {
margin-top: 92px
}
}
.panorama--small .panorama__image img {
aspect-ratio: 4 / 3;
}
@media (min-width: 640px) {
.panorama--small .panorama__image img {
aspect-ratio: auto
}
}
.intro {
border-radius: 12px;
border-radius: var(--border-radius);
padding: 32px;
padding: var(--spacing-lg);
color: #070D47;
color: var(--color-primary);
background-color: #FFFFFF;
background-color: var(--color-white);
}
@media (min-width: 1024px) {
.intro {
padding: 48px;
padding: var(--spacing-xl)
}
}
@media (min-width: 1024px) {
.intro__container {
display: flex;
justify-content: space-between
}
}
.intro__main {
margin-bottom: 48px;
margin-bottom: var(--spacing-xl);
}
@media (min-width: 1024px) {
.intro__main {
margin-bottom: 0;
width: 48%
}
}
@media (min-width: 1024px) {
.intro__usps {
width: 48%
}
}
.intro__title {
font-size: 2.25rem;
}
@media (min-width: 640px) {
.intro__title {
font-size: 3rem
}
}
@media (min-width: 1280px) {
.intro__title {
font-size: 3.375rem
}
}
.intro__title:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.intro__text:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.intro__usp {
display: flex;
align-items: center;
}
.intro__usp:not(:last-child) {
padding-bottom: 24px;
padding-bottom: var(--spacing-md);
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
border-bottom: 1px solid #B4DAFF;
border-bottom: 1px solid var(--color-border);
}
.intro__usp-icon {
width: 64px;
height: 64px;
display: flex;
align-items: center;
justify-content: center;
color: #070D47;
color: var(--color-primary);
background-color: #B4DAFF;
background-color: var(--color-primary-light);
border-radius: 50%;
margin-right: 18px;
margin-right: var(--spacing-sm);
}
.intro__usp-icon img {
display: block;
max-width: 36px;
max-height: 36px;
}
.intro__usp-content {
flex: 1;
}
.intro__usp-title {
font-size: 1.25rem;
}
@media (min-width: 640px) {
.intro__usp-title {
font-size: 1.5rem
}
}
.intro__usp-title:not(:last-child) {
margin-bottom: 8px;
}
.intro__usp-text {
font-size: 0.9375rem;
font-size: var(--font-size-0);
line-height: 1.25;
line-height: var(--font-lineheight-1);
}
@media (min-width: 640px) {
.intro__usp-text {
font-size: 1rem;
font-size: var(--font-size-1)
}
}
.text-image__container {
position: relative;
}
@media (min-width: 640px) {
.text-image__container {
display: flex;
align-items: center
}
}
.text-image__image {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
@media (min-width: 640px) {
.text-image__image {
position: sticky;
top: calc(72px + 24px);
top: calc(72px + var(--spacing-md));
width: 50%;
align-self: flex-start;
margin-bottom: 0
}
.text-image--inverted .text-image__image {
order: 2;
}
}
.text-image__image img {
display: block;
width: 100%;
height: auto;
border-radius: 12px;
border-radius: var(--border-radius);
}
@media (min-width: 640px) {
.text-image__content {
width: 50%;
padding-left: 6%
}
.text-image--inverted .text-image__content {
order: 1;
padding-left: 0;
padding-right: 6%;
}
}
.text-image__text {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.text-image__label {
display: inline-block;
color: #32CC89;
color: var(--color-secondary);
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.text-image__title {
font-size: 2.25rem;
}
@media (min-width: 640px) {
.text-image__title {
font-size: 3rem
}
}
.text-image__title:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
@media (min-width: 1024px) {
.text-image__actions {
display: flex;
align-items: center
}
}
.text-image__action:not(:last-child) {
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
@media (min-width: 1024px) {
.text-image__action:not(:last-child) {
margin-bottom: 0;
margin-right: 18px;
margin-right: var(--spacing-sm)
}
}
.banners-slider {
overflow: visible !important;
}
.banners-slider .swiper-slide {
max-width: 286px;
}
@media (min-width: 640px) {
.banners-slider .swiper-slide {
max-width: 100%
}
}
.banner {
display: block;
position: relative;
color: #FFFFFF;
color: var(--color-white);
background-color: #070D47;
background-color: var(--color-primary);
border-radius: 12px;
border-radius: var(--border-radius);
overflow: hidden;
}
.banner__overlay {
position: absolute;
z-index: 2;
top: 0;
left: 0;
right: 0;
bottom: 0;
padding: 24px;
padding: var(--spacing-md);
display: flex;
align-items: flex-end;
background: linear-gradient(180deg, rgba(7,13,71,0) 0%, rgba(7,13,71,1) 100%); }
.banner__title {
flex: 1;
font-size: 1.5rem;
line-height: 1.1;
padding-right: 18px;
padding-right: var(--spacing-sm);
}
.banner__content {
display: flex;
align-items: center;
width: 100%;
}
.banner__arrow {
width: 40px;
height: 40px;
background-color: #32CC89;
background-color: var(--color-secondary);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
align-self: flex-end;
margin-left: auto;
}
@media (min-width: 640px) {
.banner__arrow {
width: 48px;
height: 48px
}
}
.banner__image {
opacity: 0.85;
transition: opacity 0.35s;
transition: opacity var(--transition);
}
.banner__image img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 1 / 1;
-o-object-fit: cover;
object-fit: cover;
transition: transform 0.35s;
transition: transform var(--transition);
}
@media (min-width: 640px) {
.banner__image img {
aspect-ratio: auto
}
}
.banner__link {
display: block;
}
.banner__link:hover .banner__image {
opacity: 1;
}
.banner__link:hover .banner__image img {
transform: scale(1.05);
}
.reviews {
position: relative;
}
.reviews-slider .swiper-slide {
display: flex;
height: auto;
}
.review {
width: 100%;
border-radius: 12px;
border-radius: var(--border-radius);
background-color: #FFFFFF;
background-color: var(--color-white);
min-height: 100%;
}
.block--bg-white .review {
background-color: #EDF6FF;
background-color: var(--color-tint);
}
.review__inner {
color: #070D47;
color: var(--color-primary);
padding: 24px;
padding: var(--spacing-md);
}
.review__link {
display: block;
color: inherit;
}
.review__header {
display: flex;
margin-bottom: 8px;
margin-bottom: var(--spacing-xxs);
}
.review__rating {
display: flex;
align-items: center;
padding-right: 18px;
padding-right: var(--spacing-sm);
font-size: 1rem;
font-size: var(--font-size-1);
line-height: 1;
line-height: var(--font-lineheight-0);
font-weight: 500;
font-weight: var(--font-weight-medium);
}
.review__stars {
display: block;
width: 98px;
height: 18px;
background-image: url('/wp-content/themes/alarmed/dist/images/icon-stars-tint.svg');
background-size: cover;
background-repeat: no-repeat;
background-position: left;
margin-right: 8px;
}
.review__stars-fill {
display: block;
width: 0%;
height: 100%;
background-image: url('/wp-content/themes/alarmed/dist/images/icon-stars.svg');
background-size: cover;
background-repeat: no-repeat;
background-position: left;
}
.review__platform {
margin-left: auto;
display: block;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.review__platform--google {
width: 24px;
height: 24px;
background-image: url('/wp-content/themes/alarmed/dist/images/icon-platform-google.svg');
}
.review__platform--trustpilot {
width: 28px;
height: 28px;
background-image: url('/wp-content/themes/alarmed/dist/images/icon-platform-trustpilot.svg');
}
.review__title {
display: block;
font-size: 1.25rem;
font-size: var(--font-size-3);
font-weight: 700;
font-weight: var(--font-weight-bold);
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.review__text {
font-size: 1.0625rem;
line-height: 1.5;
line-height: var(--font-lineheight-3);
}
@media (min-width: 768px) {
.featured__container {
display: flex;
align-items: center;
min-height: 620px
}
}
.featured__image {
position: relative;
}
@media (min-width: 768px) {
.featured__image {
width: 50%;
align-self: stretch
}
.featured--inverted .featured__image {
order: 2;
}
}
.featured__image img {
display: block;
position: relative;
z-index: 1;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.featured__image:before {
content: '';
display: block;
position: absolute;
z-index: 2;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(7,13,71,0) 0%, rgba(7,13,71,1) 100%);
}
@media (min-width: 768px) {
.featured__image:before {
width: 60%;
background: linear-gradient(90deg, rgba(7,13,71,0) 0%, rgba(7,13,71,1) 100%)
}
.featured--inverted .featured__image:before {
right: auto;
left: 0;
background: linear-gradient(-90deg, rgba(7,13,71,0) 0%, rgba(7,13,71,1) 100%);
}
}
.featured__content {
position: relative;
z-index: 2;
margin-top: -120px;
padding: 48px 32px;
padding: var(--spacing-xl) var(--spacing-lg);
}
@media (min-width: 768px) {
.featured__content {
margin-top: 0;
width: 50%;
padding: 5% 5% 5% 0
}
.featured--inverted .featured__content {
order: 1;
padding: 5% 0% 5% 5%;
}
}
@media (min-width: 768px) {
.featured__main {
max-width: 572px;
margin: 0 auto
}
}
.featured__text:not(:last-child) {
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
.featured__label {
display: inline-block;
color: #32CC89;
color: var(--color-secondary);
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.featured__title {
font-size: 2.25rem;
word-wrap: break-word;
}
@media (min-width: 480px) {
.featured__title {
word-wrap: normal
}
}
@media (min-width: 768px) {
.featured__title {
font-size: 3rem
}
}
.featured__title:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
@media (min-width: 768px) {
.faqs {
display: flex;
align-items: flex-start;
justify-content: space-between
}
}
.faqs__sidebar {
margin-bottom: 32px;
margin-bottom: var(--spacing-lg);
}
@media (min-width: 768px) {
.faqs__sidebar {
margin-bottom: 0;
width: 50%;
max-width: 400px;
margin-right: 32px;
margin-right: var(--spacing-lg)
}
}
@media (min-width: 768px) {
.faqs__main {
width: 50%
}
}
.faqs__title {
font-size: 2.25rem;
}
@media (min-width: 640px) {
.faqs__title {
font-size: 3rem
}
}
.faqs__title:not(:last-child) {
margin-bottom: 24px;
margin-bottom: var(--spacing-md);
}
.faqs__text:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.faq {
border-bottom: 1px solid #B4DAFF;
border-bottom: 1px solid var(--color-border);
}
.faq:first-child {
border-top: 1px solid #B4DAFF;
border-top: 1px solid var(--color-border);
}
.faq__toggle {
display: block;
width: 100%;
position: relative;
padding-top: 18px;
padding-top: var(--spacing-sm);
padding-right: 36px;
padding-bottom: 18px;
padding-bottom: var(--spacing-sm);
text-align: left;
line-height: 1.25;
line-height: var(--font-lineheight-1);
font-weight: 600;
font-weight: var(--font-weight-semibold);
}
.faq__toggle:after {
content: "";
display: block;
position: absolute;
top: calc(50% - 7px);
right: 12px;
right: var(--spacing-xs);
width: 8px;
height: 14px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDggMTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNy42ODU2OCA2LjIzMzE0QzguMTA0NzcgNi42NTY2NiA4LjEwNDc3IDcuMzQzMzQgNy42ODU2OCA3Ljc2Njg2TDEuODMyMDIgMTMuNjgyNEMxLjQxMjkyIDE0LjEwNTkgMC43MzM0MjMgMTQuMTA1OSAwLjMxNDMyNCAxMy42ODI0Qy0wLjEwNDc3NSAxMy4yNTg4IC0wLjEwNDc3NSAxMi41NzIyIDAuMzE0MzI0IDEyLjE0ODZMNS40MDkxNCA3TDAuMzE0MzI0IDEuODUxMzdDLTAuMTA0Nzc1IDEuNDI3ODQgLTAuMTA0Nzc1IDAuNzQxMTcxIDAuMzE0MzI0IDAuMzE3NjQ0QzAuNzMzNDI0IC0wLjEwNTg4MiAxLjQxMjkyIC0wLjEwNTg4MiAxLjgzMjAyIDAuMzE3NjQ1TDcuNjg1NjggNi4yMzMxNFoiIGZpbGw9IiMzMkNDODkiLz4KPC9zdmc+Cg==");
background-size: cover;
background-position: center;
transform: rotate(90deg);
}
.is-active .faq__toggle:after {
transform: rotate(-90deg);
}
.faq__pane {
display: none;
}
.is-active .faq__pane {
display: block;
}
.faq__text {
font-size: 1rem;
font-size: var(--font-size-1);
line-height: 1.5;
line-height: var(--font-lineheight-3);
padding-bottom: 24px;
padding-bottom: var(--spacing-md);
}
.quote {
text-align: center;
max-width: 896px;
max-width: var(--container-extra-small);
margin: 0 auto;
}
.quote__text {
font-size: 2.25rem;
font-weight: 700;
font-weight: var(--font-weight-bold);
line-height: 1.0;
}
.quote__text:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
@media (min-width: 640px) {
.quote__text {
font-size: 3rem
}
}
@media (min-width: 1024px) {
.quote__text {
font-size: 3.75rem
}
}
.quote__text--small {
font-size: 1.875rem;
}
@media (min-width: 640px) {
.quote__text--small {
font-size: 2.25rem
}
}
.quote__text--medium {
font-size: 2rem;
}
@media (min-width: 1024px) {
.quote__text--medium {
font-size: 3rem
}
}
.quote__subtitle {
color: #32CC89;
color: var(--color-secondary);
font-weight: 500;
font-weight: var(--font-weight-medium);
}
@media (min-width: 640px) {
.quote__subtitle {
font-size: 1.25rem;
font-size: var(--font-size-3)
}
}
.usps__container {
position: relative;
}
.usps__item {
width: 100%;
max-width: 100%;
}
@media (min-width: 480px) {
.usps__item {
max-width: calc(100% / 2)
}
}
@media (min-width: 768px) {
.usps__item {
max-width: calc(100% / 3)
}
}
@media (min-width: 1024px) {
.usps__item {
max-width: 25%
}
}
@media (min-width: 1280px) {
.usps__slider--count-5 .usps__item {
max-width: calc(100% / 5)
}
}
.usp {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
max-width: 100%;
padding-left: 12px;
padding-left: var(--spacing-xs);
padding-right: 12px;
padding-right: var(--spacing-xs);
}
.usp__content {
flex: 1;
}
.usp__icon {
width: 60px;
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.usp__icon svg {
display: block;
width: 100%;
height: auto;
}
.usp__title {
display: block;
font-size: 1.25rem;
font-size: var(--font-size-3);
font-weight: 700;
font-weight: var(--font-weight-bold);
line-height: 1.375;
line-height: var(--font-lineheight-2);
margin-bottom: 8px;
margin-bottom: var(--spacing-xxs);
}
.usp__text {
font-size: 0.9375rem;
font-size: var(--font-size-0);
line-height: 1.5;
line-height: var(--font-lineheight-3);
opacity: 0.75;
}
@media (min-width: 640px) {
.usp__text {
font-size: 1rem;
font-size: var(--font-size-1)
}
}
@media (min-width: 1024px) {
.usps__slider--count-5 .usp__text {
font-size: 0.9375rem;
font-size: var(--font-size-0);
}
}
.logos__slider {
margin-top: -24px;
margin-left: -18px;
margin-right: -18px;
}
@media (min-width: 1280px) {
.logos__slider {
margin-left: 0;
margin-right: 0
}
}
.logos__item {
display: flex;
height: auto !important;
}
.logo {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.logo__link {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.logo__image {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.logo__image img {
width: auto;
height: auto;
max-width: 75%;
max-height: 75%;
filter: grayscale(100%);
opacity: 0.75;
transition: opacity 0.3s ease-in-out, filter 0.3s ease-in-out;
}
.logo__image img:hover {
filter: grayscale(0%);
opacity: 1;
}
.timeline {
position: relative;
margin-top: 48px;
margin-top: var(--spacing-xl);
margin-left: -18px;
margin-right: -18px;
}
@media (min-width: 1024px) {
.timeline {
margin-left: 0;
margin-right: 0
}
}
.timeline:before {
content: "";
position: absolute;
z-index: 1;
top: 36px;
left: 0;
right: 0;
width: 100%;
height: 1px;
background-color: #B4DAFF;
background-color: var(--color-primary-light);
}
@media (min-width: 1024px) {
.timeline:before {
top: 46px
}
}
.timeline__item {
max-width: 100%;
}
@media (min-width: 480px) {
.timeline__item {
max-width: calc(100% / 2)
}
}
@media (min-width: 768px) {
.timeline__item {
max-width: calc(100% / 3)
}
}
@media (min-width: 1024px) {
.timeline__item {
max-width: calc(100% / 4)
}
}
@media (min-width: 1024px) {
.timeline__slider--count-3 .timeline__item {
max-width: calc(100% / 3)
}
}
@media (min-width: 1024px) {
.timeline__slider--count-4 .timeline__item {
max-width: calc(100% / 4)
}
}
.timeline__content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding-left: 24px;
padding-left: var(--spacing-md);
padding-right: 24px;
padding-right: var(--spacing-md);
max-width: 320px;
margin: 0 auto;
}
.timeline__icon {
display: flex;
align-items: center;
justify-content: center;
width: 72px;
height: 72px;
border-radius: 50%;
border: 1px solid #B4DAFF;
border: 1px solid var(--color-primary-light);
background-color: #FFFFFF;
background-color: var(--color-white);
margin: 0 auto;
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
@media (min-width: 1024px) {
.timeline__icon {
width: 90px;
height: 90px
}
}
.timeline__icon svg, .timeline__icon img {
display: block;
max-width: 36px;
height: auto;
}
@media (min-width: 1024px) {
.timeline__icon svg, .timeline__icon img {
max-width: 48px
}
}
.block--bg-dark .timeline__icon {
background-color: #070D47;
background-color: var(--color-primary);
}
.block--bg-tint .timeline__icon {
background-color: #EDF6FF;
background-color: var(--color-tint);
}
.timeline__title {
font-size: 1.25rem;
font-size: var(--font-size-3);
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.timeline__text {
font-size: 1rem;
font-size: var(--font-size-1);
line-height: 1.375;
line-height: var(--font-lineheight-2);
}
.packages {
position: relative;
margin-top: -14px;
}
.package {
color: #070D47;
color: var(--color-primary);
height: auto !important;
display: flex !important;
flex-direction: column;
}
.package__header {
position: relative;
margin-top: 14px;
}
.package__title {
font-size: 1.25rem;
font-size: var(--font-size-3);
padding: 18px;
padding: var(--spacing-sm);
border-radius: 12px 12px 0 0;
border-radius: var(--border-radius) var(--border-radius) 0 0;
background-color: #B4DAFF;
background-color: var(--color-primary-light);
}
.package__label {
position: absolute;
z-index: 2;
top: -14px;
right: 18px;
right: var(--spacing-sm);
display: block;
color: #070D47;
color: var(--color-primary);
font-size: 0.9375rem;
font-size: var(--font-size-0);
line-height: 1;
line-height: var(--font-lineheight-0);
font-weight: 600;
font-weight: var(--font-weight-semibold);
background-color: #32CC89;
background-color: var(--color-secondary);
padding: 6.5px 16px;
border-radius: 14px;
}
.package__content {
padding: 24px;
padding: var(--spacing-md);
background-color: white;
flex: 1;
}
.block--bg-white .package__content {
border-left: 1px solid #EDF6FF;
border-left: 1px solid var(--color-tint);
border-right: 1px solid #EDF6FF;
border-right: 1px solid var(--color-tint);
}
.package__excerpt {
font-size: 1.0625rem;
line-height: 1.5;
line-height: var(--font-lineheight-3);
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
.package__feature {
display: flex;
align-items: flex-start;
font-size: 1rem;
font-size: var(--font-size-1);
font-weight: 600;
font-weight: var(--font-weight-semibold);
line-height: 1.375;
line-height: var(--font-lineheight-2);
}
.package__feature:not(:last-child) {
margin-bottom: 12px;
margin-bottom: var(--spacing-xs);
}
.package__feature:before {
content: "";
display: block;
margin-top: -1px;
margin-right: 8px;
margin-right: var(--spacing-xxs);
width: 24px;
height: 24px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDIuMjVDMTAuMDcxNiAyLjI1IDguMTg2NTcgMi44MjE4MyA2LjU4MzE5IDMuODkzMTdDNC45Nzk4MiA0Ljk2NDUxIDMuNzMwMTMgNi40ODcyNiAyLjk5MjE4IDguMjY4ODRDMi4yNTQyMiAxMC4wNTA0IDIuMDYxMTQgMTIuMDEwOCAyLjQzNzM1IDEzLjkwMjFDMi44MTM1NSAxNS43OTM0IDMuNzQyMTUgMTcuNTMwNyA1LjEwNTcxIDE4Ljg5NDNDNi40NjkyOCAyMC4yNTc5IDguMjA2NTYgMjEuMTg2NSAxMC4wOTc5IDIxLjU2MjdDMTEuOTg5MiAyMS45Mzg5IDEzLjk0OTYgMjEuNzQ1OCAxNS43MzEyIDIxLjAwNzhDMTcuNTEyNyAyMC4yNjk5IDE5LjAzNTUgMTkuMDIwMiAyMC4xMDY4IDE3LjQxNjhDMjEuMTc4MiAxNS44MTM0IDIxLjc1IDEzLjkyODQgMjEuNzUgMTJDMjEuNzQ3MyA5LjQxNDk4IDIwLjcxOTIgNi45MzY2MSAxOC44OTEzIDUuMTA4NzJDMTcuMDYzNCAzLjI4MDg0IDE0LjU4NSAyLjI1MjczIDEyIDIuMjVaTTE2LjI4MDYgMTAuMjgwNkwxMS4wMzA2IDE1LjUzMDZDMTAuOTYxIDE1LjYwMDQgMTAuODc4MyAxNS42NTU3IDEwLjc4NzIgMTUuNjkzNEMxMC42OTYyIDE1LjczMTIgMTAuNTk4NiAxNS43NTA2IDEwLjUgMTUuNzUwNkMxMC40MDE0IDE1Ljc1MDYgMTAuMzAzOCAxNS43MzEyIDEwLjIxMjggMTUuNjkzNEMxMC4xMjE4IDE1LjY1NTcgMTAuMDM5IDE1LjYwMDQgOS45NjkzOCAxNS41MzA2TDcuNzE5MzggMTMuMjgwNkM3LjU3ODY1IDEzLjEzOTkgNy40OTk1OSAxMi45NDkgNy40OTk1OSAxMi43NUM3LjQ5OTU5IDEyLjU1MSA3LjU3ODY1IDEyLjM2MDEgNy43MTkzOCAxMi4yMTk0QzcuODYwMTEgMTIuMDc4NiA4LjA1MDk4IDExLjk5OTYgOC4yNSAxMS45OTk2QzguNDQ5MDMgMTEuOTk5NiA4LjYzOTkgMTIuMDc4NiA4Ljc4MDYzIDEyLjIxOTRMMTAuNSAxMy45Mzk3TDE1LjIxOTQgOS4yMTkzN0MxNS4yODkxIDkuMTQ5NjkgMTUuMzcxOCA5LjA5NDQyIDE1LjQ2MjggOS4wNTY3QzE1LjU1MzkgOS4wMTg5OSAxNS42NTE1IDguOTk5NTggMTUuNzUgOC45OTk1OEMxNS44NDg2IDguOTk5NTggMTUuOTQ2MSA5LjAxODk5IDE2LjAzNzIgOS4wNTY3QzE2LjEyODIgOS4wOTQ0MiAxNi4yMTA5IDkuMTQ5NjkgMTYuMjgwNiA5LjIxOTM3QzE2LjM1MDMgOS4yODkwNiAxNi40MDU2IDkuMzcxNzggMTYuNDQzMyA5LjQ2MjgzQzE2LjQ4MSA5LjU1Mzg3IDE2LjUwMDQgOS42NTE0NSAxNi41MDA0IDkuNzVDMTYuNTAwNCA5Ljg0ODU1IDE2LjQ4MSA5Ljk0NjEzIDE2LjQ0MzMgMTAuMDM3MkMxNi40MDU2IDEwLjEyODIgMTYuMzUwMyAxMC4yMTA5IDE2LjI4MDYgMTAuMjgwNloiIGZpbGw9IiMzMkNDODkiLz4KPC9zdmc+Cg==");
background-size: cover;
background-position: center;
}
.package__footer {
display: flex;
padding: 18px 24px;
padding: var(--spacing-sm) var(--spacing-md);
background-color: #EDF6FF;
background-color: var(--color-tint);
border-radius: 0 0 12px 12px;
border-radius: 0 0 var(--border-radius) var(--border-radius);
}
.block--bg-tint .package__footer {
border-top: 1px solid #B4DAFF;
border-top: 1px solid var(--color-border);
background-color: white;
}
.package__info {
width: 60%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.package__info strong {
font-size: 1.25rem;
font-size: var(--font-size-3);
}
.package__info small {
display: block;
font-size: 0.8125rem;
line-height: 1.25;
line-height: var(--font-lineheight-1);
}
.package__prices {
width: 40%;
display: flex;
flex-direction: column;
justify-content: space-between;
text-align: right;
}
.package__price {
color: #32CC89;
color: var(--color-secondary);
font-size: 1.875rem;
font-weight: 700;
font-weight: var(--font-weight-bold);
line-height: 1.375;
line-height: var(--font-lineheight-2);
}
.package__price sup {
font-size: 1.125rem;
vertical-align: super;
}
.package__price--onetime {
font-size: 0.9375rem;
font-size: var(--font-size-0);
font-weight: 500;
font-weight: var(--font-weight-medium);
}
.package--featured .package__title {
color: #FFFFFF;
color: var(--color-white);
background-color: #6590FF;
background-color: var(--color-primary-tint);
}
.contact-banner {
padding: 24px;
padding: var(--spacing-md);
background-color: #EDF6FF;
background-color: var(--color-tint);
border-radius: 12px;
border-radius: var(--border-radius);
margin-top: 60px;
}
@media (min-width: 640px) {
.contact-banner {
margin-top: 0;
padding: 32px;
padding: var(--spacing-lg)
}
}
@media (min-width: 640px) {
.contact-banner__container {
display: flex;
align-items: flex-start
}
}
@media (min-width: 1024px) {
.contact-banner__container {
align-items: center
}
}
.contact-banner__image {
display: block;
position: relative;
width: 180px;
margin-top: -60px;
}
@media (min-width: 640px) {
.contact-banner__image {
margin-top: 0;
width: 224px;
margin-right: 40px
}
}
@media (min-width: 1024px) {
.contact-banner__image {
width: 248px;
margin-top: -95px
}
}
.contact-banner__image img {
display: block;
width: 100%;
height: auto;
border-radius: 12px;
border-radius: var(--border-radius);
}
.contact-banner__content {
position: relative;
flex: 1;
padding-top: 24px;
padding-top: var(--spacing-md);
}
@media (min-width: 640px) {
.contact-banner__content {
/* padding-top: 0; */
padding-top: 64px
}
}
@media (min-width: 1024px) {
.contact-banner__content {
padding-top: 0
}
}
.contact-banner__name {
display: flex;
align-items: center;
position: absolute;
top: -48px;
left: 50%;
font-family: 'Caveat', sans-serif;
font-family: var(--font-secondary);
font-size: 1.375rem;
line-height: 1.125rem;
font-weight: 600;
width: 220px;
}
@media (min-width: 640px) {
.contact-banner__name {
width: auto;
white-space: nowrap;
font-size: 1.625rem;
line-height: 1.0;
top: 14px;
left: 85%
}
}
.contact-banner__name span {
display: block;
flex: 1;
}
.contact-banner__name svg {
display: block;
max-width: 48px;
height: auto;
margin-top: 5px;
margin-right: 6px;
transform: rotate(135deg) scaleY(-1);
}
@media (min-width: 640px) {
.contact-banner__name svg {
transform: none;
max-width: 68px
}
}
.contact-banner__title {
font-size: 1.75rem;
}
@media (min-width: 640px) {
.contact-banner__title {
font-size: 2rem
}
}
@media (min-width: 1024px) {
.contact-banner__title {
font-size: 2.25rem
}
}
.contact-banner__title:not(:last-child) {
margin-bottom: 18px;
}
.contact-banner__text {
line-height: 1.5;
line-height: var(--font-lineheight-3);
}
@media (min-width: 1024px) {
.contact-banner__text {
font-size: 1.1875rem
}
}
.contact-banner__text:not(:last-child) {
margin-bottom: 20px;
}
@media (min-width: 768px) {
.contact-banner__actions {
display: flex;
align-items: center
}
}
.contact-banner__action {
display: flex;
align-items: center;
}
.contact-banner__action:not(:last-child) {
margin-bottom: 18px;
margin-bottom: var(--spacing-sm);
}
@media (min-width: 768px) {
.contact-banner__action:not(:last-child) {
margin-bottom: 0;
margin-right: 24px;
margin-right: var(--spacing-md)
}
}
.contact-banner__phone {
display: flex;
align-items: center;
font-size: 1.0625rem;
}
.contact-banner__phone svg {
margin-right: 6px;
}
/* swiper */
/**
* Swiper 11.0.7
* Most modern mobile touch slider and framework with hardware accelerated transitions
* https://swiperjs.com
*
* Copyright 2014-2024 Vladimir Kharlampidi
*
* Released under the MIT License
*
* Released on: February 27, 2024
*/
:root {
--swiper-theme-color: #32CC89;
}
:host {
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
z-index: 1
}
.swiper {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1;
display: block
}
.swiper-vertical>.swiper-wrapper {
flex-direction: column
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: flex;
transition-property: transform;
transition-timing-function: ease;
transition-timing-function: initial;
transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
box-sizing: content-box
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
transform: translate3d(0px, 0, 0)
}
.swiper-horizontal {
touch-action: pan-y
}
.swiper-vertical {
touch-action: pan-x
}
.swiper-slide {
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
transition-property: transform;
display: block
}
.swiper-slide-invisible-blank {
visibility: hidden
}
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
height: auto
}
.swiper-autoheight .swiper-wrapper {
align-items: flex-start;
transition-property: transform, height
}
.swiper-backface-hidden .swiper-slide {
transform: translateZ(0);
backface-visibility: hidden
}
.swiper-3d.swiper-css-mode .swiper-wrapper {
perspective: 1200px
}
.swiper-3d .swiper-wrapper {
transform-style: preserve-3d
}
.swiper-3d {
perspective: 1200px
}
.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide {
transform-style: preserve-3d
}
.swiper-css-mode>.swiper-wrapper {
overflow: auto;
scrollbar-width: none;
-ms-overflow-style: none
}
.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar {
display: none
}
.swiper-css-mode>.swiper-wrapper>.swiper-slide {
scroll-snap-align: start start
}
.swiper-css-mode.swiper-horizontal>.swiper-wrapper {
scroll-snap-type: x mandatory
}
.swiper-css-mode.swiper-vertical>.swiper-wrapper {
scroll-snap-type: y mandatory
}
.swiper-css-mode.swiper-free-mode>.swiper-wrapper {
scroll-snap-type: none
}
.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide {
scroll-snap-align: none
}
.swiper-css-mode.swiper-centered>.swiper-wrapper::before {
content: '';
flex-shrink: 0;
order: 9999
}
.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide {
scroll-snap-align: center center;
scroll-snap-stop: always
}
.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child {
margin-inline-start: var(--swiper-centered-offset-before)
}
.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before {
height: 100%;
min-height: 1px;
width: var(--swiper-centered-offset-after)
}
.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child {
margin-block-start: var(--swiper-centered-offset-before)
}
.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before {
width: 100%;
min-width: 1px;
height: var(--swiper-centered-offset-after)
}
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10
}
.swiper-3d .swiper-slide-shadow {
background: rgba(0, 0, 0, .15)
}
.swiper-3d .swiper-slide-shadow-left {
background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-3d .swiper-slide-shadow-right {
background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-3d .swiper-slide-shadow-top {
background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-3d .swiper-slide-shadow-bottom {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
transform-origin: 50%;
box-sizing: border-box;
border: 4px solid #32CC89;
border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
border-radius: 50%;
border-top-color: transparent
}
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader {
animation: swiper-preloader-spin 1s infinite linear
}
.swiper-lazy-preloader-white {
--swiper-preloader-color: #fff
}
.swiper-lazy-preloader-black {
--swiper-preloader-color: #000
}
@keyframes swiper-preloader-spin {
0% {
transform: rotate(0deg)
}
100% {
transform: rotate(360deg)
}
}