*,
*::before,
*::after{ box-sizing:border-box; margin: 0px; padding: 0px; }

h3, h4, h5, h6 {
  font-size: 100%;
  font: inherit;  
}
h1, h2, h3, h4, h5, h6 { /** else, when it wraps it will be too close **/
  line-height:normal !important;  
}
.feature-title { font-size: 1.2em; font-weight:bold; }

body { background:#fff; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:16px; }
body.overflow-hide { overflow:hidden; position:relative; }
input[type=text], input[type=password], select, textarea {
    font-family: Verdana, Arial, Helvetica, sans-serif;
}
img { /*max-width:100%;*/ }
a { color:#000; }
a:visited { color:#000; }

hr {
	height: 1px;
	border-top-width: 1px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #ccc;
	border-right-color: transparent !important;
	border-bottom-color: transparent !important;
	border-left-color: transparent !important;
}

/** lazy load iframe (lazy load attr doesn't seem to work and chrome won't load hidden iframe)**/
iframe { aspect-ratio: 16 / 9; width:100%; /*display:none;*/ }
body.loaded iframe { /*display:block;*/ }
iframe.lazy.loaded { aspect-ratio: 16 / 9; width:100%; }

.hidden { display:none !important; }

.flexbox { 
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-ms-flex-align: center; -webkit-align-items: center; -webkit-box-align: center; align-items: center; 
}
.flextop, .flex-top {
	-ms-flex-align: flex-start; -webkit-align-items: flex-start; -webkit-box-align: flex-start; align-items: flex-start; 
}
.flexbox.flex-justify { margin-webkit-justify-content: space-between; justify-content:space-between; }
.flexbox.flex-end { margin-webkit-justify-content: flex-end; justify-content:flex-end;  }
.flexbox.flex-start { margin-webkit-justify-content: flex-start; justify-content:flex-start; }
.flexbox.flex-wrap { -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.flexbox.flex-center { margin-webkit-justify-content: center; justify-content:center; }
.flexbox.width-min-content { width: min-content; }
.flexbox.flex-stretch { align-items: stretch !important; }
.flexbox.flex-column {  flex-direction: column; align-items: flex-start;  }
.flexbox.cgap { column-gap: 10px !important; }
.flexbox.cgap5 { column-gap: 5px !important; }
.flexbox.cgap15 { column-gap: 15px !important; }
.flexbox.cgap50 { column-gap: 50px !important; }
.flexbox.cgap100 { column-gap: 100px !important; }
.flexbox.cgap150 { column-gap: 150px !important; }
.flexbox.rgap { row-gap: 10px !important; }
.flexbox.rgap20 { row-gap: 20px !important; }

.margin-center { margin-left:auto; margin-right:auto; }
.margin-bottom-10 { margin-bottom: 10px !important; }
.margin-bottom-20 { margin-bottom: 20px !important; }
.margin-bottom-30 { margin-bottom: 30px !important; }
.margin-bottom-40 { margin-bottom: 40px !important; }
.margin-bottom-50 { margin-bottom: 50px !important; }
.margin-bottom-60 { margin-bottom: 60px !important; }
.margin-bottom-70 { margin-bottom: 70px !important; }
.margin-top-20 { margin-top: 20px !important; }
.margin-top-30 { margin-top: 30px !important; }
.margin-top-40 { margin-top: 40px !important; }

.font-up1 { font-size:1.1rem; }

.text-center { text-align: center; }

.max-width-100 { max-width:100%; }

/** reset default button styling **/
button { 
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}

/** forms **/
/*
::placeholder { color: #333; }
::-ms-input-placeholder { color: #333; }
*/

.field-text,
.field-select,
.field-textarea
{
	-moz-appearance: none; 
  -webkit-appearance: none;
  appearance: none;
	border-radius: 5px;
	padding: 12px;
	font-size: 19px;
	background-color: #fff;
    border: 1px solid #ccc; 
    color: #666;
	width: 500px;
	outline: 0;
	line-height: 1.5;
}
.field-text:focus,
.field-select:focus,
.field-textarea:focus
{
    background-color: #FFFFFF;
}
.field-select {
	width: 500px;
	font-size: 19px;
	color: #333;
	line-height: 1.5;
	border-radius: 5px;
	background-color: #fff;
	border: 1px solid #ccc;  
	color: #666;
	margin-bottom: 0;
	padding: 12px;
	outline: 0;
	transition: all .2s ease-in-out;
	background: #fff url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 99% 50%;
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none;
}

/** date field **/
input[type="date"] {
  -moz-appearance: none; 
  -webkit-appearance: none;
  appearance: none;
	/*
  background-color: transparent;
  border-radius: 0;
  border: 1px solid #ccc;

  padding: 10px 12px;
  font-size: 16px; /* critical for iOS */
  */
}

/** hide arrows in input[type=number] spin box **/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number] {
  -moz-appearance: textfield;
}

.fieldset { position:relative; margin: 0 0 20px; }
.fieldset h3 { font-size: 1.2em; font-weight:bold; margin: 0 0 7px; }
.fieldset .label { font-weight:bold; }
/** 
highlight fields in required fieldset 
for phone fields do not highlight country code select 
for contact method fields, do not hightlight inputs or selects in nested fieldsets
**/
.fieldset.validate-error:not(.contact-method) input, 
.fieldset.validate-error:not(.contact-method):not(.phone) select, 
.fieldset.validate-error textarea 
{
	border:1px solid red !important;
}
.fieldset.required.validate-error .error-highlight, .fieldset.required.validate-error .error-highlight a { color: red !important; }
.fieldset-error { color: red; font-style:italic; font-size:.9em; }
.fieldset.formbuilder.radio.site-line-height, .fieldset.formbuilder.checkbox.site-line-height { /** form radio button & checkboxes **/
	line-height: 200%;
}
/*
.fieldset.required.validate-error { color: red !important; }
.fieldset.required.validate-error a { color: red !important; }
*/
/*
.fieldset.required.validate-error:after{
	content: 'This field is required.';
	display:block;
	color:red;
	font-size: .9em;
	margin-top:3px;
}
*/

/** buttons **/
.field-submit, .buttonize:not(table) { /** text editor buttons are now table because of emails, and this will overwrite the bg color assigned in the editor **/
	display:inline-block;
	background-color: #9ecb18;
	border: 1px solid #9ecb18;
	min-width: 150px;
	/*max-width: 150px;*/
	text-align: center;
	color: #000;
	border-radius: 3px;
	cursor: pointer;
	font-size: 14px;
	font-weight: normal;
	padding: 10px 15px;
	text-transform: uppercase;
	text-decoration: none;
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none;
 }
 a.buttonize, a.buttonize:visited, a.buttonize:hover, a.buttonize:visited:hover { color: #000; }
 .buttonize a, .buttonize a:visited, .buttonize a:hover, .buttonize a:visited:hover { color:#000; text-decoration:none; }
 .field-submit:disabled, .buttonize:disabled {
  background: #f2f2f2;
  border:1px solid #ccc;
  cursor:default;
}

/** google autocomplete **/
.google-autocomplete-container { position:relative; }
.google-autocomplete-container > ul {
  position: absolute;
  max-height: 226px;
  overflow-y: scroll;
  box-sizing: border-box;
  left: 0;
  right: 0;
  margin: 0.5rem 0 0 0;
  padding: 0;
  z-index: 1;
  list-style: none;
  border-radius: 0.6rem;
  background-color: #fff;
  border: 1px solid rgba(33, 33, 33, 0.07);
  box-shadow: 0 3px 6px rgba(149, 157, 165, 0.15);
  outline: none;
  transition: opacity 0.15s ease-in-out;
  -moz-transition: opacity 0.15s ease-in-out;
  -webkit-transition: opacity 0.15s ease-in-out;
}
.google-autocomplete-container > ul > li {
  margin: 0.3rem;
  padding: 0.3rem 0.5rem;
  text-align: left;
  font-size: .8rem;
  color: #212121;
  border-radius: 0.35rem;
  background-color: rgba(255, 255, 255, 1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all 0.2s ease;
}



/** captcha **/
.captcha { margin:0 0 10px; border-radius:5px; background:#f2f2f2; border:1px solid #ccc; padding:10px; width:300px; }
.captcha p { font-size:12px; }
.captcha input { 
	width:100px !important; margin-left:10px; box-sizing: border-box;
	padding: 8px;
	border: 1px solid #ccc;
	color: #666 !important;
	border-radius: 5px;
	background: #fff !important;
	font-size: 16px;
 }
.captcha img { border:0px !important; }

/** mobile **/
@media (max-width: 900px) {

	.device-mobile-hide { display:none; }
	

}

/** desktop & tablet **/
@media (min-width: 901px) {

	.device-desktop-hide { display:none; }

}



/*!
 * Float Labels
 *
 * @version: 3.3.0
 * @author: Paul Ryley (http://geminilabs.io)
 * @url: https://geminilabs.github.io/float-labels.js
 * @license: MIT
 */
.fl-form .fl-wrap {
	/*max-width:500px;*/
    position: relative;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.fl-form input.fl-input,.fl-form select.fl-select,.fl-form textarea.fl-textarea {
	width: 500px; max-width:100%;
    line-height: 1.5;
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #ccc;
    color: #666;
    margin-bottom: 0;
	padding:23px;
    outline: 0;
    transition: all .2s ease-in-out;	
	font-size: 19px;
}

.fl-form textarea.fl-textarea { height:150px; }

/*
.fl-form input.fl-input:-moz-placeholder,
.fl-form input.fl-input::-moz-placeholder,
.fl-form select.fl-select:-moz-placeholder,
.fl-form select.fl-select::-moz-placeholder,
.fl-form textarea.fl-textarea:-moz-placeholder,
.fl-form textarea.fl-textarea::-moz-placeholder,
input[type=password]:-moz-placeholder,
input[type=password]::-moz-placeholder,
.fl-form input.fl-input:-ms-input-placeholder,
.fl-form select.fl-select:-ms-input-placeholder,
.fl-form textarea.fl-textarea:-ms-input-placeholder,
input[type=password]:-ms-input-placeholder,
.fl-form input.fl-input::-webkit-input-placeholder,
.fl-form select.fl-select::-webkit-input-placeholder,
.fl-form textarea.fl-textarea::-webkit-input-placeholder,
input[type=password]::-webkit-input-placeholder
{
    color: #333
}
*/

.fl-form select.fl-select {
    position: relative;
    color: #333;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none
}

.fl-form .fl-is-active input.fl-input,.fl-form .fl-is-active select.fl-select,.fl-form .fl-is-active textarea.fl-textarea {
/*
    color: #444;
    background-color: #fff;
    border-color: #dfdfdf
	*/
}

.fl-form .fl-has-focus input.fl-input,.fl-form .fl-has-focus select.fl-select,.fl-form .fl-has-focus textarea.fl-textarea {
/*
    background-color: #fff;
    border-color: #1976d2
	*/
}

.fl-form label.fl-label {
    opacity: 0;
    visibility: hidden;
    display: block;
    position: absolute;
    top: -12px;
    left: 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    color: #666;
    border-radius-top-left: 3px;
    transition: all .2s ease-in-out;
    z-index: 1
}

.fl-form .fl-is-active label.fl-label {
    opacity: 1;
    visibility: visible
}

.fl-form .fl-has-focus label.fl-label {
    color: #1976d2
}

.fl-form .fl-is-required:before {
/*
    opacity: 1;
    content: "*";
    display: block;
    position: absolute;
    top: 1px;
    right: 15px;
    font-size: 16px;
    line-height: 1.75;
    color: #d32f2f;
    transition: all .2s ease-in-out;
    padding: 6px 0 0;
    z-index: 1
	*/
}

.fl-form .fl-is-required.fl-is-active:before {
    opacity: 0
}

.fl-form.fl-style-1 input.fl-input,.fl-form.fl-style-1 select.fl-select,.fl-form.fl-style-1 textarea.fl-textarea {
    padding: 6px 12px
}

.fl-form.fl-style-1 select.fl-select {
    height: 38px
}

.fl-form.fl-style-1 .fl-is-active input.fl-input,.fl-form.fl-style-1 .fl-is-active select.fl-select,.fl-form.fl-style-1 .fl-is-active textarea.fl-textarea {
    padding: 6px 12px
}

.fl-form.fl-style-1 label.fl-label {
    top: 1px;
    left: 10px;
    background-color: transparent;
    padding: 12px 3px
}

.fl-form.fl-style-1 label.fl-label:before {
    content: "";
    display: block;
    position: absolute;
    top: 19px;
    left: 0;
    right: 0;
    height: 1px;
    background-color: #fff;
    z-index: -1
}

.fl-form.fl-style-1 .fl-is-active label.fl-label {
    top: -9px;
    padding: 3px
}

.fl-form.fl-style-1 .fl-is-active label.fl-label:before {
    top: 9px
}

.fl-form.fl-style-2 input.fl-input,.fl-form.fl-style-2 select.fl-select,.fl-form.fl-style-2 textarea.fl-textarea {
    padding: 12px
}

.fl-form.fl-style-2 select.fl-select {
   /* height: 50px*/
}

.fl-form.fl-style-2 .fl-is-active input.fl-input,.fl-form.fl-style-2 .fl-is-active select.fl-select,.fl-form.fl-style-2 .fl-is-active textarea.fl-textarea {
    padding: 18px 12px 6px
}

.fl-form.fl-style-2 label.fl-label {
    top: 1px;
    left: 10px;
    padding: 6px 3px 3px
}

.fl-form.fl-style-2 .fl-is-required:before {
    padding-top: 12px
}

.fl-form .fl-wrap-select:after {
    content: "";
    position: absolute;
    display: block;
    top: 1px;
    right: 6px;
    height: calc(100% - 2px);
    width: 12px;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 16'><path fill='#bbb' d='M 4 0 L 0 6.5 L 8 6.5 L 4 0 z M 0 9.5 L 4 16 L 4 16 L 8 9.5 z'/></svg>") no-repeat;
    background-position: 100% 50%;
    background-size: 7px 14px;
    z-index: 2
}


@media (max-width: 900px) {

	.fl-form input.fl-input,.fl-form select.fl-select,.fl-form textarea.fl-textarea, .field-select {
		width: 100%;
	}

}

/*
https://tarekraafat.github.io/autoComplete.js/#/
*/

.autoComplete_wrapper {
  display: inline-block;
  position: relative;
}

/*.autoComplete_wrapper > input {*/
input.autocomplete { /** to prevent shifting after wrapper is added in js **/
  height: 3rem;
  width: 430px;
  margin: 0;
  padding: 0 2rem 0 3.2rem;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 1rem;
  text-overflow: ellipsis;
  /*color: rgba(255, 122, 122, 0.3);*/
  color: #666;
  outline: none;
  border-radius: 10rem;
  /*border: 0.05rem solid rgba(255, 122, 122, 0.5);*/
  border: 0.05rem solid #ccc;
  background-image: url(/assets/js/autocomplete/css/images/search.svg);
  background-size: 1.4rem;
  background-position: left 1.05rem top 0.8rem;
  background-repeat: no-repeat;
  background-origin: border-box;
  background-color: #fff;
  /*
  transition: all 0.4s ease;
  -webkit-transition: all -webkit-transform 0.4s ease;
  */
}

.autoComplete_wrapper > input::placeholder {
 /* color: rgba(255, 122, 122, 0.5);*/
 color: #999;
}

.autoComplete_wrapper > input:hover::placeholder {
  /*color: rgba(255, 122, 122, 0.6);*/
}

.autoComplete_wrapper > input:focus::placeholder {
  padding: 0.1rem 0.6rem;
  font-size: 0.95rem;
  color: #dedede;
  /*color: rgba(255, 122, 122, 0.4);*/
}

.autoComplete_wrapper > input:focus::selection {
  /*background-color: rgba(255, 122, 122, 0.15);*/
}

.autoComplete_wrapper > input::selection {
  /*background-color: rgba(255, 122, 122, 0.15);*/
}

.autoComplete_wrapper > input:hover {
  /*color: rgba(255, 122, 122, 0.8);*/
}

.autoComplete_wrapper > input:focus {
  /*color: rgba(255, 122, 122, 1);*/
  /*border: 0.06rem solid rgba(255, 122, 122, 0.8);*/
}

.autoComplete_wrapper > ul {
  position: absolute;
  max-height: 226px;
  overflow-y: scroll;
  box-sizing: border-box;
  left: 0;
  right: 0;
  margin: 0.5rem 0 0 0;
  padding: 0;
  z-index: 1;
  list-style: none;
  border-radius: 0.6rem;
  background-color: #fff;
  border: 1px solid rgba(33, 33, 33, 0.07);
  box-shadow: 0 3px 6px rgba(149, 157, 165, 0.15);
  outline: none;
  transition: opacity 0.15s ease-in-out;
  -moz-transition: opacity 0.15s ease-in-out;
  -webkit-transition: opacity 0.15s ease-in-out;
}

.autoComplete_wrapper > ul[hidden],
.autoComplete_wrapper > ul:empty {
  display: block;
  opacity: 0;
  transform: scale(0);
}

.autoComplete_wrapper > ul > li {
  margin: 0.3rem;
  padding: 0.3rem 0.5rem;
  text-align: left;
  font-size: 1rem;
  color: #212121;
  border-radius: 0.35rem;
  background-color: rgba(255, 255, 255, 1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all 0.2s ease;
}

.autoComplete_wrapper > ul > li mark {
  background-color: transparent;
  color: rgba(255, 122, 122, 1);
  font-weight: bold;
}

.autoComplete_wrapper > ul > li:hover {
  cursor: pointer;
  background-color: rgba(230, 240, 255, 0.5);
}

.autoComplete_wrapper > ul > li[aria-selected="true"] {
  background-color: rgba(255, 122, 122, 0.15);
}

@media only screen and (max-width: 600px) {
  .autoComplete_wrapper > input {
    width: 18rem;
  }
}


/** zoom **/
/* overlay magnify icon */
.zoom-wrapper {
  position: relative;
  display: inline-block;
  cursor: zoom-in;
}

.zoom-icon {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: rgba(0,0,0,0.6);
  color: #fff;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  pointer-events: auto;
}

/* fullscreen modal */
.zoom-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.9);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.zoom-toolbar {
  position: absolute;
  top: 15px;
  right: 15px;
  display: flex;
  gap: 10px;
}

.zoom-toolbar button {
  background: rgba(255,255,255,0.15);
  border: 0;
  color: #fff;
  padding: 8px 12px;
  font-size: 18px;
  cursor: pointer;
  border-radius: 6px;
}

.zoom-stage {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.zoom-stage img {
  max-width: none;
  max-height: none;
  cursor: grab;
  user-select: none;
  transform-origin: center center;
}

