/* 2024_Preference_Center-theme.css */

/* Custom Font (Google): Inter */ 
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

/* conditional class for form display (or not ) */
.hide, form.mktoForm.hide {display: none !important;}

html {
	font-size: 14px;
}
body {
	line-height: 1.55;
	font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  color: #313535;
}
/* shrink page containers */
.container {
    width: 880px !important;
    max-width: 100% !important;
}

#HEAD {
	border-bottom: 1px solid #E6EFF0;
}
#MAIN {
	background: #f4f5f8;
}
#MAIN .filter > .container {
    background-color: #FFF;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.15);
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 0px 40px;
}
#MAIN .filter {
    padding: 0 15px;
}

#FOOT {

}

/* :::::::::::::::::::::::::: */
/* ::::::: TYPOGRAPHY ::::::: */
/* :::::::::::::::::::::::::: */
.font-inter {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
}

.text-small {
	font-size: 0.66rem;
	line-height: 1.66rem;
}

/* headlines */
h1 {

}
h2 {
		font-size: 2.22rem;
		line-height: 1.4;
		font-weight: 500;
	}
h3 {

}

/* text links */
a:not(.btn) {color: #669EA0; text-decoration: underline;}

/* footer links */
#FOOT a:not(.btn) {color: #FFFFFF; text-decoration: none;}
.footer-link-list .list-inline-item:not(:last-child) {
	margin-right: 1.77rem;
}
/* buttons */
.btn {
    border-radius: 56px; 
    border-width: 2px;
    padding: 8px 22px;
    font-size: 14px;
    line-height: 22px;
    font-weight: 600;
}
/* primary outline button */
.btn-outline-primary { color: #005E60; border-color: #005E60;}
.btn-outline-primary:hover { color: #fff; background-color: #005E60; border-color: #005E60;}
.btn-outline-primary.focus, .btn-outline-primary:focus { box-shadow: none; color:#fff; background-color: #005E60; border-color: #005E60;}
.btn-outline-primary.disabled, .btn-outline-primary:disabled { color: #005E60; background-color: transparent;}
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle { color: #fff; background-color: #005E60; border-color: #005E60;}
.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-primary.dropdown-toggle:focus { box-shadow: none;}

/* spacers */
.spacer-1 {padding-top: 1.66rem;}
.spacer-2 {padding-top: 2.66rem;}
.spacer-3 {padding-top: 3.11rem;}

@media screen and (min-width:768px) {
html {
	font-size: 14px;
}
}

/* ::::::::::::::::::::: */
/* ::::::: COLOR ::::::: */
/* ::::::::::::::::::::: */
.text-primary {
	color: #005E60 !important; /* green */
}
.text-secondary {
	color: #C8FF08 !important; /* lime */
}


/* ::::::::::::::::::::::::::: */
/* ::::::: FORM STYLES ::::::: */
/* ::::::::::::::::::::::::::: */

/* GLOBAL - Form Presets: Form element & children */
form.mktoForm, form.mktoForm * {
font-size: 0.88rem !important;
line-height: 1.5;
font-family: inherit !important;
color: inherit !important;
}

/* TRANSITIONS: ease color changes (optional) */
form.mktoForm * {
transition: ease color .3s !important;
transition: ease background-color .3s !important;
}
/* :::::::::::::::::::::::::::::::::: */
/* :::::[ Architectural Styles ]::::: */
/* :::::::::::::::::::::::::::::::::: */
form.mktoForm {
flex-direction: column; /* 'flex-direction: row;' for horizontal display */
width: 100% !important; /* override fixed width on mktoForm */
box-sizing: border-box;
display: block !important;
}
form.mktoForm * {
float: none !important; /* remove float on mktoForm elements */
width: auto !important; /* remove fixed width on mktoForm elements */
}
form.mktoForm .mktoFormRow, form.mktoForm .mktoFieldWrap, form.mktoForm .mktoButtonRow {
display:flex !important; /* flex these elements */
}
form.mktoForm .mktoOffset, form.mktoForm .mktoGutter, form.mktoForm fieldset legend {
display:none !important; /* hide these elements */
}
form.mktoForm .mktoFormCol, form.mktoForm .mktoHtmlText {
-ms-flex-positive: 1;
flex-grow: 1; /* make these elements flex to full-width (100%) */
}
/* maintain font-size, line-height and input height for mobile */
form.mktoForm .mktoField {
line-height: 1.5 !important; /*mktoOverride*/
font-size: 0.88rem !important; /*mktoOverride*/
height: initial !important; /*mktoOverride*/
}
/* :::::::::::::::::::::::::::::::: */
/* :::::[ Form Layout Styles ]::::: */
/* :::::::::::::::::::::::::::::::: */
/* Form Layout > Settings: LABELS-ABOVE ---------------- */
form.mktoForm.mktoLayoutAbove .mktoFieldWrap {
flex-direction: column !important;
align-items: flex-start !important;
}
form.mktoForm.mktoLayoutAbove label.mktoLabel {
text-align: left !important;
padding: 0 !important;
width: 100% !important;
}
/* Form Layout > Settings: LABELS-LEFT ------------------ */
form.mktoForm.mktoLayoutLeft fieldset .mktoFieldWrap {
display: flex !important;
flex-direction: row !important;
}
form.mktoForm.mktoLayoutLeft fieldset label.mktoLabel {
display: block !important;
text-align: right !important;
padding: 0 !important;
max-width: 120px; /* set width for labels left */
width: 120px !important; /* set width for labels left */
margin: auto 15px auto 0;
}
/* ::::::::::::::::::::::::::: */
/* :::::[ Form Elements ]::::: */
/* ::::::::::::::::::::::::::: */
/* ROWS ___________________ */
form.mktoForm .mktoFormRow,
form.mktoForm .mktoButtonRow {
flex-wrap: wrap;
flex-direction:row;
min-width:unset;
}
form.mktoForm .mktoFormRow {
margin: 0 -24px; /* offset .mktoFieldWrap padding (10px) */
}
/* COLUMNS ______________ */
form.mktoForm .mktoFormCol {
flex-basis: 0; /* make columns in a row equal widths */
min-height: 0px !important; /*mktoOverride*/
margin-bottom:0px !important; /*mktoOverride*/
}
/* FIELDSET _________ */
form.mktoForm fieldset {
padding: 0px 24px !important; /*mktoOverride*/
margin: 0px !important; /*mktoOverride*/
border: 0px !important; /*mktoOverride*/
}

/* FIELDWRAP ______________ */
form.mktoForm .mktoFieldWrap {
padding: 0px 24px !important;
}
/* LABELS __________________ */
form.mktoForm label.mktoLabel {
padding:.5rem !important;
font-size:0.88rem !important;
line-height: 1.33rem;
font-weight: bold !important;
display: flex;
}
/* |>> Labels-Above ........................ */
form.mktoForm.mktoLayoutAbove label.mktoLabel {
text-align: left !important;
}
/* |>> Labels-Left ........................ */
form.mktoForm.mktoLayoutLeft label.mktoLabel {
text-align: right !important;
min-width:120px;
}
/* section labels */
form.mktoForm .section-label {
    font-weight:  bold;
    color: #337E80 !important;
   	display: inline-flex;
  	align-items: center;
}
form.mktoForm .section-label i {
   font-size: 1.5em !important;
    margin-right: 8px;
}
/* INPUTS (ALL) ______________ */
/* excludes radio & checkboxes */
form.mktoForm input[type=url],
form.mktoForm input[type=text],
form.mktoForm input[type=date],
form.mktoForm input[type=tel],
form.mktoForm input[type=email],
form.mktoForm input[type=number],
form.mktoForm textarea.mktoField,
form.mktoForm select.mktoField  {
color: #313535 !important;
padding: 0.88rem 1.22rem !important;
-ms-flex-positive: 1;
flex-grow:1;
width:100% !important;
min-height: 44px !important; /*mktoOverride*/
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color:#fff !important;
border-width: 1px;
border-style: solid;
border-color: #313535 !important;
border-radius:4px;
-webkit-border-radius: 4px;
}
/* disabled fields */
form.mktoForm .mktoField[disabled="disabled"] {
    background: #F7F7F7 !important;
    color: #313535 !important;
}
/* required fields */
form.mktoForm .mktoRequiredField .mktoAsterix {
    order: 2; /* move asterix to right of label text */
    margin-left: 4px;
    color: #D11313 !important;
}

/* SELECT ___________________ */
form.mktoForm select.mktoField {
background-image: url(https://mktosbx.digitalpi.com/rs/980-YPY-938/images/chevron_down.png);
background-position: calc(100% - 20px) 1.5em;
background-size: 8.6px 5.74px;
background-repeat: no-repeat !important;
outline: 0 !important;
}
/* |>> Select not-valid states ............. */
form.mktoForm select.mktoField:not(.mktoValid),
form.mktoForm select.mktoField.mktoInvalid {
color: #313535 !important;
}
/* |>> Select invalid states .................. */
form.mktoForm select.mktoField.mktoInvalid:active,
form.mktoForm select.mktoField.mktoInvalid:focus {
color: initial !important;
}
/* |>> Select active states ........ */
form.mktoForm select.mktoField:focus,
form.mktoForm select.mktoField:active {
background-image: url(https://mktosbx.digitalpi.com/rs/980-YPY-938/images/chevron_down.png);
}
/* LOGICAL FIELDS (parent) ___ */
form.mktoForm .mktoRadioList,
form.mktoForm .mktoCheckboxList {
-ms-flex-positive: 1;
flex-grow: 1;
margin-bottom: 0.9em;
padding:0px;
}
/* LOGICAL FIELDS (child) ______ */
form.mktoForm .mktoRadioList *,
form.mktoForm .mktoCheckboxList * {
text-align: left !important;
}
/* |>> Checkbox & Radio Labels .... */
form.mktoForm .mktoCheckboxList label,
form.mktoForm .mktoRadioList label {
margin: 0px 34px !important;
margin-bottom: 0px;
line-height: 23px !important;
color: #337E80 !important;
}
/* |>> Checkbox & Radio Inputs ....... */
form.mktoForm .mktoRadioList > input,
form.mktoForm .mktoCheckboxList > input {
float: left !important;
width: 23px !important;
height: 23px !important;
border-width: 3px;
border-style: solid;
border-color: #669EA0 !important;
background-color: #fff;
}
/* CHECKBOX _____________________ */
form.mktoForm input[type=checkbox] {
-webkit-appearance: none !important;
box-sizing: border-box !important;
border-radius:4px;
-webkit-border-radius: 4px;
}
/* |>> Checkbox :focus state .......... */
form.mktoForm input[type=checkbox]:focus {
outline:0px !important;
}
form.mktoForm input[type=checkbox]:focus + label,
form.mktoForm input[type=checkbox]:hover + label,
form.mktoForm input[type=checkbox]:active + label{
    color: #005E60 !important;
}
form.mktoForm .mktoCheckboxList:hover input[type=checkbox] {
    border-color: #005E60 !important;
}
/* |>> Checkbox :checked state .................. */
form.mktoForm input[type=checkbox]:checked::before {
	color: #C8FF08 !important;
	content: '\2713';
	font-weight: bold !important;
	width: 23px !important;
	height: 23px !important;
	text-align: center !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	margin-top: -3px;
	margin-left: -3px;
	background-color: #005E60;
	border-radius: 4px;
}
/* RADIO _______________________________ */
form.mktoForm .mktoRadioList label {
	margin-bottom: 0.5em !important;
}
form.mktoForm input.mktoField[type=radio] {
-webkit-appearance:none !important;
border-radius: 50%;
height:23px !important;
width: 23px !important;
display: flex;
align-items: center;
justify-content: center;
}
/* |>> Radio :focus state .................... */
form.mktoForm input.mktoField[type=radio]:focus:checked,
form.mktoForm input.mktoField[type=radio]:focus {
border-color: #7e9abf !important;
outline: none !important;
border-width: 3px;
border-style: solid;
}
/* |>> Radio :checked state ......................... */
form.mktoForm input.mktoField[type=radio]:checked::before {
		content: '';
    background-color: #005E60 !important;
    height: 23px;
    width: 23px;
    position: absolute;
    border-radius: 50%;
    box-sizing: border-box;
}
form.mktoForm input.mktoField[type=radio]:checked::after {
    content: '';
    background-color: #C8FF08 !important;
    height: 9px;
    width: 9px;
    position: absolute;
    border-radius: 50%;
    box-sizing: border-box;
}
/* TEXTAREA ___________________ */
form.mktoForm textarea.mktoField {
height: auto !important; /* override input fixed height */
}

/* INPUTS (ALL) :focus state ________ */
form.mktoForm input.mktoField:focus,
form.mktoForm select.mktoField:focus,
form.mktoForm textarea.mktoField:focus {
outline: 0px !important;
border-width: 3px;
border-style: solid;
border-color: #005E60 !important;
}
/* FORM BUTTON _____________ */
/* |>> Button wrapper ...... */
form.mktoForm .mktoButtonWrap {
margin:20px 0 20px auto !important; /* right-align button */
}
/* |>> Button style .......... */
form.mktoForm button.mktoButton {
color: #005E60 !important;
background: #C8FF08 !important;
border: 1px solid #C8FF08 !important;
padding: 15px 32px !important;
font-size: 16px !important;
line-height: 24px !important;
font-weight: 600 !important;
border-radius: 30px !important;
min-width: 0px;
box-shadow:none !important; /*mktoOverride*/
text-shadow:none !important; /*mktoOverride*/
}
/* |>> Button :active states .. */
form.mktoForm .mktoButton:hover,
form.mktoForm .mktoButton:focus,
form.mktoForm .mktoButton:active {
	color: #005E60 !important;
	background: #C8FF08 !important;
	border-color: #C8FF08 !important;
	outline: none;
}
form.mktoForm .mktoButton:focus {
box-shadow: none !important;
}
/* hover/slide button background feature */
form.mktoForm button.mktoButton {
    position: relative;
    z-index: 1;
    border: none !important;
    background: #C8FF08 !important;
    transition: color .5s ease,background .5s ease,border-color .5s ease !important;
}
form.mktoForm button.mktoButton:hover,
form.mktoForm button.mktoButton:focus,
form.mktoForm button.mktoButton:active {
    background: #005e60!important;
    color: #fff !important;
}

form.mktoForm button.mktoButton::before {
    border-radius: 1.875rem !important;
    bottom: 0;
    content: "" !important;
    display: flex !important;
    height: 100% !important;
    left: 0;
    position: absolute !important;
    top: 0 !important;
    transition: all .3s;
    width: 0 !important;
    z-index: -1;
}
form.mktoForm button.mktoButton:hover::before {
    background: #005e60;
    width: 100% !important;
    
}
/* RICH TEXT _____________ */
form.mktoForm .mktoHtmlText {
padding: 0px !important;
width: 100% !important;
}
/* links */
form.mktoForm a {
    color: #005E60 !important;
    font-weight: 600;
}
form.mktoForm .mktoHtmlText p {
    margin-bottom: 1rem;
}

/* PLACEHOLDERS ________________________ */
::-moz-placeholder{color: #313535 !important;}
::-webkit-input-placeholder{color: #313535 !important;}
:-ms-input-placeholder{color: #313535 !important;}
::placeholder{color: #313535 !important;}
/* ERROR MESSAGE _________________________ */
form.mktoForm input.mktoField.mktoInvalid,
form.mktoForm select.mktoField.mktoInvalid,
form.mktoForm textarea.mktoField.mktoInvalid,
.mktoLogicalField.mktoInvalid input {
border-color: #dd0000 !important;
}
form.mktoForm select.mktoField.mktoInvalid {
background-image: url(https://mktosbx.digitalpi.com/rs/980-YPY-938/images/chevron_down.png);
}
form.mktoForm .mktoError {
position: relative;
width: 100% !important;
left:0;
bottom:0px !important;
display:flex;
max-width:100% !important;
}
form.mktoForm .mktoErrorMsg {
max-width:100% !important;
-ms-flex-positive: 1;
flex-grow: 1 !important;
margin:0px auto !important;
width: 100% !important;
font-size: .8em !important;
background-image:none !important;
box-shadow: none !important;
text-shadow:none !important;
background: transparent !important;
color: #dd0000 !important;
border: none !important;
outline: none !important;
}
form.mktoForm .mktoErrorDetail {
font-size: inherit !important;
display: inline-block !important;
}

/* tooltips */
/* font-awesome icons */
i[class*="fa-"] {font-family: "Font Awesome 5 Free" !important;}


.editable-tooltip {display: none;}
.tooltip {opacity: 1 !important; margin-left: -24px;}
.tooltip-inner {
    background-color: #005E60;
     max-width: 250px !important;
    padding: 16px 24px;
    text-align: left;
    font-size: 14px;
    line-height: 20px;
    font-family: 'Inter', sans-serif;
    font-weight: 300;
    border-radius: 8px;
}
.tooltip.bs-tooltip-right .arrow:before {
    border-right-color: #005E60 !important;
}
.tooltip.bs-tooltip-left .arrow:before {
    border-left-color: #005E60 !important;
}
.tooltip.bs-tooltip-bottom .arrow:before {
    border-bottom-color: #005E60 !important;
}
.tooltip.bs-tooltip-top .arrow:before {
    border-top-color: #005E60 !important;
}
/* hide tooltips on mobile */
@media screen and (max-width: 991px) {
	/* hide tooltips */
	.tooltip {display: none !important}
	/* hide info circles */
	form.mktoForm label i.fas.fa-info-circle {display:  none;}
}

/*/ ======== RESPONSIVE STYLES ========= /*/
@media only screen and (max-width: 480px) {
    div.mktoForm, div.mktoForm *, form.mktoForm, form.mktoForm * {
    	padding: 0px; /* marketo override */
    }
  }

/* twin styles: upto 576px, 768-991px || 1-column responsive */
@media screen and (max-width:576px) {
form.mktoForm,
form.mktoForm .mktoFormRow,
form.mktoForm .mktoFieldWrap {
display:block !important;
text-align: left !important;
}
form.mktoForm, form.mktoForm * {
padding:0px;
}
form.mktoForm label.mktoLabel, form.mktoForm .mktoHtmlText {
padding-left:0px !important;
padding-right: 0px !important;
}
} /* end responsive 0-576px */
@media screen and (min-width:768px) and (max-width:991px) {
form.mktoForm,
form.mktoForm .mktoFormRow,
form.mktoForm .mktoFieldWrap {
display:block !important;
text-align: left !important;
}
form.mktoForm, form.mktoForm * {
padding:0px;
}
form.mktoForm label.mktoLabel, form.mktoForm .mktoHtmlText {
padding-left:0px !important;
padding-right: 0px !important;
}
} /* end responsive 768-991px */

/* begin desktop styles (only) */
@media screen and (min-width:991px){
		form.mktoForm .mktoFormRow.fieldset-row fieldset {
        padding: 0px 24px !important;
    }
    /* display checkbox rows as columns inside fieldsets */
    .mktoFormRow.fieldset-row .mktoFormRow:not(:nth-of-type(1)) {
    	width: 50% !important;
    	max-width: 50%;
    	float: left !important;
    	clear: none !important;
    	margin: 0px -24px;
    }
}


/* :::::::::::::::::::::::::::::: */
/* ::::::: RESPONSIVE CSS ::::::: */
/* :::::::::::::::::::::::::::::: */
/* Mobile-first... */

/* Tablet and greater... */
@media screen and (min-width: 768px) {
	html {
		font-size: 17px;
		line-height: 1.55;
	}
}

/* Desktop and greater... */
@media screen and (min-width: 991px) {
	html {
		font-size: 18px;
		line-height: 1.55;
	}
	
}

