/***************
    
    High Noon Main Styles
    2025 - Loop: Design for Social Good
    https://weareloop.com/
 
    This file contains the main styles for the High Noon theme.
    It includes global variables, typography, and other styles.
 
    @package High Noon Theme
    @version 1.0.0

***************/

/*********/
/* Fonts */
/*********/

/* Figtree */
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');

/* Cabinet Grotesk */
@font-face {
  font-family: 'CabinetGrotesk-Bold';
  src: url('../fonts/CabinetGrotesk-Bold.woff2') format('woff2'),
       url('../fonts/CabinetGrotesk-Bold.woff') format('woff'),
       url('../fonts/CabinetGrotesk-Bold.ttf') format('truetype');
       font-weight: 700;
       font-display: swap;
       font-style: normal;
}




/********************/
/* Global Variables */
/********************/
:root {
     /* SIZING UNITS */
     --Sizing-Units-L: 66px;
     --Sizing-Units-M: 44px;
     --Sizing-Units-S: 36px;
     --Sizing-Units-XS: 26px;
     --Sizing-Units-2XS: 16px;
     --Sizing-Units-3XS: 8px;
     --Number-Scale-Margins-Desktop: 72px;
     --Number-Scale-Margins-Small-Desktop: 60px;
     --Number-Scale-Margins-Tablet: 36px;
     --Number-Scale-Margins-Mobile: 18px;

     /* BORDER RADII */
    --border-radius-default: 16px;
    --border-radius-default-mobile : var(--border-radius-default);
    --border-radius-btn: 50px;
    --border-radius-btn-mobile: var(--border-radius-btn);
    --border-radius-img: 16px;
    --border-radius-img-mobile: 12px;

    /* CONTENT PADDING */
    --content-padding: 72px;
    --content-margin-top: 26px;
    --content-padding-top: 150px;
    --content-padding-bottom: 50px;
    
    /* COLORS */
    --black: #0F121A;
    --white: #ffff;
    --warm-white: #F7F5F0;
    --sky-blue: #C6E0F4;
    --blue: #1977BA;
    --orange: #F5A666;

    --color1: var(--black);
    --color2: var(--sky-blue);
    

    /* FONTS */
    --font-headline: 'CabinetGrotesk-Bold',sans-serif;
    --font-content: 'Figtree',sans-serif;

    /* ICONS */
    --arrow-white: url(/wp-content/uploads/button-doublearrow-white.svg);
    --arrow-blue:  url(/wp-content/uploads/button-doublearrow-blue.svg);
    --arrow-black:  url(/wp-content/uploads/button-doublearrow-black.svg);

    --heart: url(/wp-content/uploads/button-heart.svg);

    --viewportWidth: calc(100vw - var(--scrollbarWidth));
}
/************************************/
/*  START :: BB Editor & Assistant  */
/************************************/

/* hide Assistant Pro plugin floating pencil icon  */
.fl-asst-plugin {
    /* display: none; */
}
/* add space so first row can be edited, controls aren't hidden behind nav */
.fl-builder-edit .fl-builder-content {
    padding-top: 145px;
}
/* remove strange 4px inset of editor overlay */
.fl-builder-edit .fl-inline-editor {
    bottom: -4px;
    left: -4px;
    right: -4px;
}
/* reset BB edit overlay so actions panels are at correct position */
.fl-builder-edit .fl-drop-target,
.fl-builder-edit .fl-block-overlay,
.fl-builder-edit .fl-inline-editor {
    background-color: transparent !important;
    margin-top: 0;
    padding-top: 0;
}
/* prevent BB from changing color of action icons in BB overlay when colors of parent columns are set */
.fl-builder-edit .fl-block-overlay-actions svg path,
.fl-builder-edit .fl-block-overlay-actions i {
    color: #fff !important;
}
/* adds missing eye icon for bb visibility functionality */
.fa-eye:before {
    content: url(/wp-content/uploads/fa-eye.svg);
}
/************************************/
/*  END   :: BB Editor & Assistant  */
/************************************/

/**********************/
/* Framework Settings */
/**********************/
html, body { 
    color: var(--black);
    font-family: var(--font-content);
    font-size: inherit; /* to reset to browser default of 16px for accessibility */
    overflow-x: clip; /* instead of hidden, which glitches out position: sticky elements */
}

.fl-page-content {
    padding-top:0;
    padding-bottom:0;
}

.fl-row:not(.nopadding) >.fl-row-content-wrap >.fl-row-content {
    padding-left: var(--content-padding);
    padding-right: var(--content-padding);
}
/* sets padding default for all rows, can be overridden individually in BB */
.fl-row > div {
    padding-top: var(--Sizing-Units-L);
    padding-bottom: var(--Sizing-Units-L);
}
/* sets margin default for all rich text, can be overridden individually in BB */
.fl-module-rich-text > div, /* old bb markup */
.fl-module-rich-text:not(:has( > div))/* new bb markup */,
.fl-builder-edit .fl-module-rich-text:not(:has( > div:not(.fl-module-overlay)))/* prevents buggy margin jump when in editor */ {
    margin-top: var(--Sizing-Units-XS);
}
/* sets margin default for all buttons, can be overridden individually in BB */
.fl-module-button > div, /* old bb markup */
.fl-module-button:not(:has( > div)), /* new bb markup */
.fl-builder-edit .fl-module-button:not(:has( > div:not(.fl-module-overlay))), /* old bb markup :: prevents buggy margin jump when in editor */
.fl-builder-edit .fl-module-button:has( > div.fl-inline-editor), /* new bb markup ::prevents buggy margin jump when in editor */
.fl-module-button-group:not(.anchorlinks) > div{
    margin-top: var(--Sizing-Units-S);
}
/* sets padding default for all buttons in button groups, can be overridden individually in BB */
.fl-module-button-group .fl-button-group-buttons > div {
    padding-top: var(--Sizing-Units-S); /* "Button Spacing" in BB button groups uses padding instead of margin */
}
/* resets padding default for first button in button groups */
.fl-module-button-group .fl-button-group-buttons > div:first-of-type {
    padding-top: 0; /* "Button Spacing" in BB button groups uses padding instead of margin */
}
/* resets margin default for all button groups, since padding is handled by each button in group */
div:first-of-type.fl-module-button-group > div {
    margin-top: 0;
}

/* Focus state */
body:not(.fl-builder-edit) :focus {
    outline-width: 2px;
    outline-style: auto;
    outline-offset: 5px;
    outline-color: var(--color1);
    border-radius: 0;
}

body:not(.fl-builder-edit) .hidefocus:focus {
    box-shadow: none !important;
    outline: none !important;
}

button[aria-label="Assistant"] {display:none !important;}

/* Tablet */
@media only screen and (max-width: 992px) {
    .fl-row > div {
        padding-top: var(--Sizing-Units-M);
        padding-bottom: var(--Sizing-Units-M);
    }
}
/* Mobile */
@media only screen and (max-width: 768px) {
    .fl-row > div {
        padding-top: var(--Sizing-Units-S);
        padding-bottom: var(--Sizing-Units-S);
    }
    /* sets margin default for all rich text, can be overridden individually in BB */
    .fl-module-rich-text > div, /* old bb markup */
    .fl-module-rich-text:not(:has( > div))/* new bb markup */,
    .fl-builder-edit .fl-module-rich-text:not(:has( > div:not(.fl-module-overlay)))/* prevents buggy margin jump when in editor */ {
        margin-top: var(--Sizing-Units-2XS);
    }
    /* sets margin default for all buttons, can be overridden individually in BB */
    .fl-module-button > div, /* old bb markup */
    .fl-module-button:not(:has( > div)), /* new bb markup */
    .fl-builder-edit .fl-module-button:not(:has( > div:not(.fl-module-overlay))), /* old bb markup :: prevents buggy margin jump when in editor */
    .fl-builder-edit .fl-module-button:has( > div.fl-inline-editor), /* new bb markup ::prevents buggy margin jump when in editor */
    .fl-module-button-group:not(.anchorlinks) > div{
        margin-top: var(--Sizing-Units-XS);
    }
}
/**************/
/* Typography */
/**************/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    color: var(--purple);   
    margin-top: 0px;
    margin-bottom: 0px;
}

h1, .h1, .h1 p, .h1 .fl-heading {
    font-family: var(--font-headline);
    font-size: 70px;
    font-size: 4.38rem;
    font-style: normal;
    font-weight: 700;
    line-height: 76px; 
    line-height: 4.75rem; 
}

h2, .h2, .h2 p, .h2 .fl-heading {
    font-family: var(--font-headline);
    font-size: 52px;
    font-size: 3.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 62px;
    line-height: 3.88rem;
}

h3, .h3, .h3 p, .h3 .fl-heading {
    font-family: var(--font-content);
   font-size: 36px;
   font-size: 2.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 46px;
    line-height: 2.88rem;
}

h4, .h4, .h4 p, .h4 .fl-heading {
    font-family: var(--font-content);
    font-size: 28px;
    font-size: 1.75rem;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
    line-height: 2.25rem;
}

p, .p, ul, ol {
    font-family: var(--font-content);
    color: var(--black); 
    font-size: 18px;
    font-size: 1.13rem;
    font-style: normal;
    font-weight: 400;
    line-height: 33px;
    line-height: 2.06rem;
    margin: 0;
    text-wrap: pretty;
}

p + p, p + ul, p + ol,
p + blockquote, blockquote + p,
ul + p, ul + ul, ul + ol,
ol + p, ol + ul, ol + ol { 
    margin-top: var(--content-margin-top);
}

.large, p.large, p .large, .large p,
.large ol, ol.large, .large ul, ul.large {
    font-family: var(--font-content);
    font-size: 20px;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 35px;
    line-height: 2.19rem;
}

.small, p.small, p .small, .small p,
.small ol, ol.small, .small ul, ul.small {
    font-family: var(--font-content);
    font-size: 16px;
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    line-height: 1.63rem;
}

.ex-small, p.ex-small, p .ex-small, .ex-small p,
.ex-small ol, ol.ex-small, .ex-small ul, ul.ex-small {
    font-family: var(--font-content);
    font-size: 14px;
    font-size: 0.88rem;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    line-height: 1.25rem;
}

blockquote p {
    font-family: var(--font-content);
    font-size: 24px;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: 36px; 
    line-height: 2.25rem; 
}

blockquote {
    padding: 0;
    margin: 0;
    border: 0;
}

p a:not(.underline_anim), 
ol a:not(.underline_anim), 
ul a:not(.underline_anim) {
    color: currentColor;
    position: relative;
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 100% 1px;
    transition: background-size 250ms ease-in-out;
    display:inline;
    font-weight:700;
}

p a:not(.underline_anim):hover, 
ol a:not(.underline_anim):hover, 
ul a:not(.underline_anim):hover {
    color: currentColor;
    text-decoration: none;
    animation: 0.25s underline;
}

ul, ol {
    padding-inline-start: 21px;
}

/* .fl-rich-text a, */
a.underline_anim,
span.underline_anim,
.fl-module-button.underline_anim  a.fl-button, 
.fl-module-button-group.underline_anim a.fl-button {
    background-image: linear-gradient(currentColor, currentColor);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 100% 1px;
    display:inline;
    /* transition: background-size 250ms ease-in-out; */
    text-decoration: none;
}

p a:not(.underline_anim):hover,
a.underline_anim:hover,
span.underline_anim:hover,
.fl-module-button.underline_anim a.fl-button:hover, 
.fl-module-button-group.underline_anim a.fl-button:hover {
    animation: 0.25s underline;
}




@keyframes underline {
    from {background-size: 0% 1px;}
    to {background-size: 100% 1px;}
}



/* Number Stat */
.number_stat .fl-number-string {
    font-family: var(--font-headline);
    font-size: 70px;
    font-size: 4.38rem;
    font-style: normal;
    font-weight: 700;
    line-height: 76px;
    line-height: 4.75rem;
}




/******************************/
/*  START :: Buttons & Links  */
/******************************/

:root {
    /* --btn-icon-gap: var(--Sizing-Units-2XS); */
    --btn-icon-gap: 12px;
    --btn-icon-gap-hover: 23px;
}

/* resets bb-theme skin */
a.fl-button *, a.fl-button:visited * {
    color: inherit;
}

/* default styles for all buttons */
.fl-builder-content .fl-module-button a.fl-button,
.fl-builder-content .fl-module-button-group a.fl-button,
div.wpforms-container-full button.wpforms-submit,
.button-branded {
    font-family:var(--font-content);
    font-size: 19px;
    font-size: 1.19rem;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    line-height: 1.625rem;
}

/* separates styles for buttons with backgrounds */
.fl-module-button:not(.buttonlink) a.fl-button,
.button-branded a.fl-button,
div.wpforms-container-full .wpforms-form button.wpforms-submit,
a.button-branded { 
    /* background: none; */
    padding: 20px 40px;
    border-radius: var(--border-radius-btn);
    transition: all .25s ease;
}

/* sets up buttons with icons */
a.fl-button span {
     /* inherit color from a.fl-button */
    color: inherit;
    align-items: center;
    display: inline-flex;
    gap: var(--btn-icon-gap);
}

.cta_button a.fl-button {
    font-family: var(--font-content);
    font-size: 19px;
    font-size: 1.19rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding:20px 40px;
    border-radius: var(--border-radius-btn);
    border:transparent;
    transition:all .15s ease;
}

.cta_button a.fl-button:after {
    font-family: 'Font Awesome 5 Pro';
    content:"\f178";
    font-weight: 500;
    padding-left: 10px;
    position: relative;
    top: 1px;
    transition:all .25s ease;
    display:inline-block;
}

a.uabb-creative-button {transition: all .25s ease;}

/* sets hover state for most buttons */
.cta_button a.fl-button:hover,
.cta_button a.fl-button:focus,
.fl-module-button:not(.buttonlink) a.fl-button:hover,
.fl-module-button:not(.buttonlink) a.fl-button:focus,
/* div.wpforms-container-full button.wpforms-submit:hover, */
a.button-branded:hover,
a.button-branded:focus {
    /* transform: scale(1.05); */
    transform: scale3d(1.15, 1.15, 1.15); /* testing performance of scale on hover */
}

/* sets default transition for most buttons */
.fl-module-button a.fl-button::after,
.fl-module-button a.fl-button,
.fl-module-button a.fl-button span,
div.wpforms-container-full button.wpforms-submit {
    transition: all .25s ease;
}

/* removes arrow icon */
.cta_button.noarrow a.fl-button:after {
    display:none;
}

/* disabled – the combo of scale + icon padding on hover disrupts the layout flow of sibling containers */
/* .cta_button a.fl-button:hover:after,
.cta_button a.fl-button:focus:after {
    padding-left: var(--btn-icon-gap-hover);
} */

/* default styles for inline links */
p a:not(.buttonlink), 
ol a:not(.buttonlink), 
ul a:not(.buttonlink) {
    color: currentColor;
    position: relative;
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 100% 1px;
    transition: background-size 250ms ease-in-out;
    display:inline;
    font-weight: 700;
}

p a:not(.buttonlink):hover, 
ol a:not(.buttonlink):hover, 
ul a:not(.buttonlink):hover {
    color: currentColor;
    text-decoration: none;
    animation: 0.3s underline ease-in;
}

@keyframes underline {
    from {background-size: 0% 1px;}
    to {background-size: 100% 1px;}
}

/* buttons w icons */

a.buttonlink {
    font-size: 18px;
    font-size: 1.13rem;
    line-height: 28px;
    line-height: 1.75rem;
    font-weight: 700;
}

.fl-builder-content .buttonlink a.fl-button,
.fl-builder-content a.buttonlink {
    align-items: center;
    background-color: inherit;
    border: none;
    border-radius: 0;
    display: inline-flex;
    /* gap: 12px; */
    padding: 0;
    padding-bottom: 0px; /* extra spacing between text and underline */
    padding-right: var(--btn-icon-gap-hover); /* apply padding as far as the arrow goes, to avoid glitchiness on hover */
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: calc(100% - var(--btn-icon-gap)) 1px; /* minus 12px for the icon's rest state */
    transition: background-size 250ms ease-in-out;
    display:inline;
    font-weight:700;
}

.fl-builder-content .buttonlink a.fl-button span {
    display: inline;
}

.buttonlink .fl-button-wrap,
.arrowlink .fl-button-wrap {
    line-height: 0; /* removes odd extra gap below a */
}

.fl-builder-content .buttonlink a.fl-button:hover,
.fl-builder-content a.buttonlink:hover {
    text-decoration: none;
    background-size: 100% 1px; /* full 100% for the icon's active state */
}

a.buttonlink:not(.noarrow)::after,
.buttonlink:not(.noarrow) a.fl-button span::after {
    /* sets the gap between the text and icon*/
    transform: translateX(var(--btn-icon-gap));
}

a.buttonlink:not(.noarrow):hover::after,
.buttonlink:not(.noarrow) a.fl-button:hover span::after {
    /* sets the gap between the text and icon on hover */
    transform: translateX(var(--btn-icon-gap-hover));
}

.arrow_right a.fl-button span::after{   
    content:"";
    background-size:contain;
    background-repeat:no-repeat;
    height: 17px; /* px won't scale, but rem is glitchy when button is scaled on hover */
    /* height: 0.79rem; */
    position: relative;
    /* top: 5px;
    top: 0.31rem; */
    transition: all .25s ease-in-out;
    width: 17px;
    /* width: 1rem; */
    display: inline-flex;
    /* transform: translateX(12px); */

    /* version using mask below */
    /* background-color: currentColor;
    -webkit-mask: var(--arrow) no-repeat 0% 0%;
    mask: var(--arrow) no-repeat 0% 0%;
    -webkit-mask-size: contain;
    mask-size: contain; */
}
.arrow_right.buttonlink a.fl-button span::after{
    top: 2px;
}

.arrow_right.arrow_heart a.fl-button span::after{
    background-image: var(--heart);
    height: 15px; 
    width: 15px;
}
.arrow_right.arrow_heart a.fl-button:hover span::after{
    animation: 1s heart forwards;
}
@keyframes heart {
    0%{transform: scale(1);}
    12.5%{transform: scale(1.2);}
    25%{transform: scale(1);}
    37.5%{transform: scale(0.8);}
    50%{transform: scale(1);}
    62.5%{transform: scale(1.2);}
    75%{transform: scale(1);}
    87.5%{transform: scale(0.8);}
    100%{transform: scale(1);}
}

.arrow_right.arrow_black a.fl-button span::after{
    background-image: var(--arrow-black);
}

.arrow_right.arrow_blue  a.fl-button span::after{
    background-image: var(--arrow-blue);
}

.arrow_right.arrow_white  a.fl-button span::after{
    background-image: var(--arrow-white);
}

a.buttonlink.arrow_left::before,
.buttonlink.arrow_left a.fl-button span::before {
    /* float: left; */
    margin-right: var(--btn-icon-gap);
    /* margin-right: 0.75rem; */
    transform: scalex(-1);
}

a.buttonlink.arrow_right::after,
button.buttonlink.arrow_right::after{
    float: right;
    /* margin-left: var(--btn-icon-gap);
    margin-left: .75rem; */
}

/************/
/* Wp Forms */
/************/
.arrowdown{
    position: absolute;
    width: 185px;
    height: 370px;
    top: 0;
    left: calc(50% - 683px + 72px);
    background-size: contain !important;
}
.signup-form-col{
    width:calc(100% - 256px);
    margin-left: 256px;
}
html div.wpforms-container-full:not(:empty){
   margin: 0 auto; 
}
.sigup-form div.wpforms-container-full form.wpforms-form{
    display: flex;
}
.sigup-form div.wpforms-container-full form.wpforms-form{
    display: flex;
    gap: 16px;
    align-items: flex-end;
}
.sigup-form .wpforms-field{
    padding: 0!important;
    flex-basis: calc(50% - 8px);
    flex-grow: 1;
    flex-shrink: 0;
}
.contact-form .wpforms-field{
    padding: 0;
}
.contact-form div.wpforms-container-full .wpforms-field-label{
    font-family: var(--font-content);
    font-size: 18px;
    font-size: 1.13rem;
    font-weight: 600;
    line-height: 29px;
    line-height: 1.81rem;
    color:var(--black);
    margin-bottom: 8px;
}
.sigup-form div.wpforms-container-full .wpforms-field-label{
    font-family: var(--font-content);
    font-size: 17px;
    font-size: 1.06rem;
    font-weight: 700;
    line-height: 20px;
    line-height: 1.25rem;
    color:var(--white);
    margin-bottom: 16px;
}
.wpforms-required-label{
    display: none!important;
}
.contact-form div.wpforms-container-full input[type=text], 
.contact-form div.wpforms-container-full select,
.contact-form div.wpforms-container-full input[type=email], 
.contact-form div.wpforms-container-full input[type=tel], 
.contact-form div.wpforms-container-full select, 
.contact-form .wp-core-ui div.wpforms-container-full input, 
.contact-form .wp-core-ui div.wpforms-container-full select{
    height: 65px;
}
.sigup-form div.wpforms-container-full input, 
.sigup-form div.wpforms-container-full select, 
.sigup-form .wp-core-ui div.wpforms-container-full input, 
.sigup-form .wp-core-ui div.wpforms-container-full select{
    height: 56px;
}
.contact-form div.wpforms-container-full textarea,
.contact-form div.wpforms-container-full input[type=text],
.contact-form div.wpforms-container-full input[type=tel],
.contact-form div.wpforms-container-full select,
.contact-form div.wpforms-container-full input[type=email]{
    border-radius:  8px;
    border: 1px solid var(--blue)!important;
    padding: 16px;
    color:var(--black);
    font-family: var(--font-content);
    font-size: 18px;
    font-size: 1.13rem;
    font-style: normal;
    font-weight: 400;
    line-height: 33px;
    line-height: 2.06rem;
}
.contact-form div.wpforms-container-full textarea::placeholder,
.contact-form div.wpforms-container-full input[type=tel]::placeholder,
.contact-form div.wpforms-container-full input[type=text]::placeholder,
.contact-form div.wpforms-container-full select,
.contact-form div.wpforms-container-full input[type=email]::placeholder{
    color:var(--black);
    font-family: var(--font-content);
    font-size: 18px;
    font-size: 1.13rem;
    font-style: normal;
    font-weight: 400;
    line-height: 33px;
    line-height: 2.06rem;
    opacity: 1;
    padding:0;
    padding-left: 5px;
    border-left: 1px solid #ddd;
}
.contact-form div.wpforms-container-full .wpforms-field-sublabel{
    color:var(--black);
    font-family: var(--font-content);
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 18px;
    line-height: 1.13rem;
}

.sigup-form div.wpforms-container-full input[type=text],
.sigup-form div.wpforms-container-full input[type=email]{
    border-radius:  8px;
    border: none!important;
    padding: 16px;
}
html div.wpforms-container-full .wpforms-field.wpforms-field-checkbox ul{
    gap: 8px;
}

html div.wpforms-container-full .wpforms-form input[type=checkbox],
html div.wpforms-container-full .wpforms-form input[type=radio] {
    position: absolute;
    cursor: pointer;
    height: 0;
    width: 0;
    border: 0px;
}
html div.wpforms-container-full input[type=checkbox]:before{
    display: none!important;
}
html div.wpforms-container-full input[type=radio]:before{
    border:none!important;
}
html div.wpforms-container-full .wpforms-form input[type=checkbox]::after,
html div.wpforms-container-full .wpforms-form input[type=radio]::after {
    position: absolute;
    content: "";
    top: 0px;
    left: -1px;
    height: 25px;
    width: 25px;
    background-color: var(--white);
    border: 1px solid var(--blue);
    transform: none!important;
}

html div.wpforms-container-full .wpforms-form input[type=checkbox]::after {
    border-radius: 6px;
}
html div.wpforms-container-full .wpforms-form input[type=radio]::after {
    border-radius: 100px;
}

html div.wpforms-container-full .wpforms-form input[type=checkbox]:checked::after {
    background-color: var(--blue);
    content: url(/wp-content/uploads/checkmark.svg);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
}
html div.wpforms-container-full .wpforms-form input[type=radio]:checked::before {
    position: absolute;
    content: "";
    top: 7px;
    left: 5.5px;
    height: 13px;
    width: 13px;
    background-color: var(--blue);
    border-radius: 100px;
    z-index: 1;
}
html div.wpforms-container-full .wpforms-field.wpforms-field-checkbox ul li input+label,
html div.wpforms-container-full .wpforms-field.wpforms-field-radio ul li input+label {
    font-family: var(--font-content);
    font-weight: 400;
    font-size: 18px;
    font-size: 1.13rem;
    line-height: 33px;
    line-height: 2.06rem;
    color: var(--black);
    padding-inline-start: 44px;
    display: inline-block;
}

.sigup-form .wpforms-field-container{
    display: flex;
    gap: 16px;
    flex-grow: 1;
    flex-shrink: 1;
}
.contact-form .wpforms-field-container{
    display: flex;
    gap: 26px;
    flex-direction: column;
}
.contact-form div.wpforms-container-full button[type=submit]{
    margin-top:26px
}
html div.wpforms-container-full button[type=submit]{
    height: auto;
    font-size: 19px;
    font-size: 1.19rem;
    font-style: normal;
    font-weight: 700;
    line-height: 23px;
    line-height: 1.44rem;
    font-family: var(--font-content);
    background-color: var(--orange)!important;
    background-image: none!important;
    color:var(--black)!important;
    padding: 16px 30px;
    display: flex;
    gap: 12px;
    align-items: center;
}
html div.wpforms-container-full button[type=submit]:after{
    content: '';
    width: 17px;
    height: 17px;
    background-image: url(/wp-content/uploads/button-doublearrow-black.svg);
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    position: static!important;
    border: none!important;
}
html div.wpforms-container-full .wpforms-form em.wpforms-error{
    color:var(--white);
}
html div.wpforms-container-full .wpforms-form em.wpforms-error:before{
    background-color: var(--white);
}
.sigup-form div.wpforms-container-full button[type=submit]{
    width:100%;
    justify-content: center;
    transition: all 0.2s ease;
}
div.wpforms-container-full button[type=submit]:hover{
    transform: scale(1.05);
}
.sigup-form div.wpforms-container-full .wpforms-form .wpforms-submit-container{
    margin-top:0;
    flex-shrink: 0;
}
.wpforms-submit-spinner{
    display: none!important;
}
.contact-form div.wpforms-container-full .wpforms-confirmation-container-full, 
.contact-form div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message){
    background: transparent;
    border: none;
    box-sizing: border-box;
    color: var(--black);
    padding: 0;
}
.sigup-form div.wpforms-container-full .wpforms-confirmation-container-full, 
.sigup-form div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message){
    background: transparent;
    border: none;
    box-sizing: border-box;
    color: var(--white);
    padding: 0;
}
.contact-form div.wpforms-container-full .wpforms-confirmation-container-full p, 
.contact-form div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) p{
    color:var(--black);
    font-family: var(--font-content);
    font-size: 18px;
    font-size: 1.13rem;
    font-style: normal;
    font-weight: 400;
    line-height: 33px;
    line-height: 2.06rem;
}
.sigup-form div.wpforms-container-full .wpforms-confirmation-container-full p, 
.sigup-form div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) p{
    color:var(--white);
    font-family: var(--font-content);
    font-size: 18px;
    font-size: 1.13rem;
    font-style: normal;
    font-weight: 400;
    line-height: 33px;
    line-height: 2.06rem;
}
html div.wpforms-container div.wpforms-uploader{
    border: 1px solid var(--blue)!important;
    border-radius: 8px!important;
}
/****************/
/* Storytelling */
/****************/

.storytelling-top-row .fl-col-content{
    display: flex;
    gap: 66px;
    flex-direction: row;
}
.storytelling-top-row .storytelling-left-col{
    flex-basis: 345px;
    flex-shrink: 0;
    flex-grow: 0;
}
.storytelling-bottom-row .fl-col-content{
    flex-direction: row;
    gap: 20px;
    align-items: stretch;
}
.storytelling-bottom-row .storytelling-left-col{
    overflow: hidden;
    flex-basis: 396px;
    flex-shrink: 0;
    flex-grow: 0;
}
.storytelling-bottom-row .storytelling-right-col{
    min-height: 675px;
    background-size: cover;
}
.storytelling-bottom-row .storytelling-title{
    position: relative;
}
.storytelling-bottom-row .storytelling-title h3{
    
}
/**ig**/
body:not(.fl-builder-edit) .eapps-instagram-feed-posts-item-image-wrapper{
    padding-top: 150%;
}
body:not(.fl-builder-edit) .eapps-instagram-feed-posts-grid-load-more-container.eapps-instagram-feed-posts-grid-load-more-enabled{
    display: none;
}
body:not(.fl-builder-edit) #eapps-instagram-feed-1 > a{
    display: none!important;
}
.eapps-instagram-feed-posts-grid .eapps-instagram-feed-posts-item{
    border-radius: 16px;
    overflow: hidden;
    background-color: transparent!important;
}
.eapps-instagram-feed-posts-view{
    gap:16px;
}
.eapps-instagram-feed-posts-grid .eapps-instagram-feed-posts-item{
    width:100%!important;
    flex:1!important;
}
.search-title-result { text-transform:initial }

.grecaptcha-badge{
	display: none!important;
}

/**************/
/**************/
/* Responsive */
/**************/
/**************/


/* Desktop */
@media screen and (max-width: 1366px) {

    
    /***********************************************/
    /*  Full Width Breakout honoring wrapper-left  */
    /***********************************************/
    /* .fullwidth.marginleft  > div, .fullwidth .marginleft  { padding-left:  calc( (var(--viewportWidth) - (1366px - (var(--content-padding) * 2))) / 2);} */
    /* .fullwidth.marginright > div, .fullwidth .marginright { padding-right: calc( (var(--viewportWidth) - (1366px - (var(--content-padding) * 2))) / 2);} */

    :root {

        --content-padding: 60px;
    }


    /***********************************************/
    /*  Full Width Breakout honoring wrapper-left  */
    /***********************************************/
    .fullwidth.marginleft >  div, .fullwidth .marginleft  { padding-left:  var(--content-padding);}
    .fullwidth.marginright > div, .fullwidth .marginright { padding-right: var(--content-padding);} 


    /* Number Stat */
    .number_stat .fl-number-string {
        font-size: 60px;
        font-size: 3.75rem;
        line-height: 70px;
        line-height: 4.38rem;
    }
    /************/
    /* Wp Forms */
    /************/
    .arrowdown{
        position: absolute;
        top: 66px;
        left: 60px;
    }
    
    /****************/
    /* Storytelling */
    /****************/

    .storytelling-bottom-row .storytelling-left-col{
        flex-basis: 352px;
    }
}

  
/* Tablet */
@media only screen and (max-width: 992px) {

    :root {

        --content-padding: 36px;
    }


    /**************/
    /* TYPOGRAPHY */
    /**************/

    h1, .h1, .h1 p, .h1 .fl-heading {
        font-size: 60px;
        font-size: 3.75rem;
        line-height: 66px;
        line-height: 4.13rem;
    }

    h2, .h2, .h2 p, .h2 .fl-heading {
        font-size: 46px;
        font-size: 2.88rem;
        line-height: 55px;
        line-height: 3.44rem;
    }

    h3, .h3, .h3 p, .h3 .fl-heading {
        font-size: 33px;
        font-size: 2.06rem;
        line-height: 42px;
        line-height: 2.63rem;
    }

    h4, .h4, .h4 p, .h4 .fl-heading {
        font-size: 27px;
        font-size: 1.69rem;
        line-height: 34px;
        line-height: 2.13rem;
    }

    h5, .h5, .h5 p, .h5 .fl-heading {
        font-size: 21px;
        font-size: 1.31rem;
        line-height: 33px;
        line-height: 2.06rem;
    }

    p, .p, ul, ol {
        line-height: 30px;
        line-height: 1.88rem;
    }

    .large, p.large, p .large, .large p,
    .large ol, ol.large, .large ul, ul.large {
        font-size: 20px;
        font-size: 1.25rem;
        line-height: 35px;
        line-height: 2.19rem;
    }

    .small, p.small, p .small, .small p,
    .small ol, ol.small, .small ul, ul.small {
        font-size: 16px;
        font-size: 1rem;
        line-height: 26px;
        line-height: 1.63rem;
    }

    blockquote p {
        font-size: 22px;
        font-size: 1.38rem;
        line-height: 34px;
        line-height: 2.13rem;
    }

    /************/
    /* Wp Forms */
    /************/
    .arrowdown{
        position: absolute;
        top: 44px;
        left: 36px;
        width: 130px;
        height: 261px;
    }

    .sigup-form div.wpforms-container-full form.wpforms-form{
        align-items: stretch;
        flex-direction: column;
    }

    /****************/
    /* Storytelling */
    /****************/
    .storytelling-bottom-row .fl-col-content{
        flex-direction: column;
    }
    .storytelling-bottom-row .storytelling-left-col{
        flex-basis: auto;
    }
    .storytelling-bottom-row .storytelling-right-col{
        min-height: 482px;
    }

}


/* Mobile */
@media only screen and (max-width: 768px) {

    :root {

        --content-padding: 18px;
        --content-padding-top: 16px;
        --content-padding-bottom: 16px;
        --btn-icon-gap: 8px;
        --btn-icon-gap-hover: 16px;

    }


    /**************/
    /* TYPOGRAPHY */
    /**************/

    h1, .h1, .h1 p, .h1 .fl-heading {
        font-size: 45px;
        font-size: 2.81rem;
        line-height: 52px;
        line-height: 3.25rem;
    }

    h2, .h2, .h2 p, .h2 .fl-heading {
        font-size: 38px;
        font-size: 2.38rem;
        line-height: 46px;
        line-height: 2.88rem;
    }

    h3, .h3, .h3 p, .h3 .fl-heading {
        font-size: 30px;
        font-size: 1.88rem;
        line-height: 38px;
        line-height: 2.38rem;
    }

    h5, .h5, .h5 p, .h5 .fl-heading {
        font-size: 20px;
        font-size: 1.25rem;
        line-height: 31px;
        line-height: 1.94rem;
    }

    p, .p, ul, ol {
        line-height: 29px;
        line-height: 1.81rem;
    }

    .large, p.large, p .large, .large p,
    .large ol, ol.large, .large ul, ul.large {
        font-size: 19px;
        font-size: 1.19rem;
        line-height: 30px;
        line-height: 1.88rem;
    }

    blockquote p {
        font-size: 19px;
        font-size: 1.19rem;
        line-height: 30px;
        line-height: 1.88rem;
    }

    /* Number Stat */
    .number_stat .fl-number-string {
        font-size: 50px;
        font-size: 3.13rem;
        line-height: 50px;
        line-height: 3.13rem;
    }

    /* Button */
    .fl-module-button:not(.buttonlink) a.fl-button, 
    .button-branded a.fl-button, 
    html div.wpforms-container-full .wpforms-form button.wpforms-submit, 
    a.button-branded{
        padding: 14px 26px;
    }

    .fl-builder-content .fl-module-button a.fl-button,
    .fl-builder-content .fl-module-button-group a.fl-button,
    html div.wpforms-container-full button.wpforms-submit,
    .button-branded {
        font-size: 18px;
        font-size: 1.13rem;
        line-height: 26px;
        line-height: 1.625rem;
    }
    /************/
    /* Wp Forms */
    /************/
    .arrowdown{
        position: absolute;
        top: 0px;
        left: unset;
        right: 18px;
        width: 86px;
        height: 64px;
    }
    .sigup-form div.wpforms-container-full form.wpforms-form{
        gap: 20px;
    }
    .sigup-form .wpforms-field-container{
        align-items: stretch;
        flex-direction: column;
        gap: 20px;
    }
    .signup-form-col{
        width: 100%;
        float: unset;
        margin-left: 0;
    }
    .sigup-form div.wpforms-container-full .wpforms-field-label{
        margin-bottom: 8px;
    }
    /****************/
    /* Storytelling */
    /****************/
    .storytelling-top-row .fl-col-content{
        flex-direction: column;
        gap: 16px;
    }
    .storytelling-top-row .storytelling-left-col{
        flex-basis: auto;
    }
    .storytelling-top-row .storytelling-right-col{
        gap: 26px;
    }
    .storytelling-bottom-row .storytelling-right-col {
        min-height: 560px;
    }
}