/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

h1, h2, h3, h4, h5, h6, p {margin: 0; line-height: inherit}

main :is(h1, h2, h3, h4, h5, h6, p, ul, ol, blockquote, pre, table, a):has(+ :is(h2, h3, h4, h5, h6, p, ul, ol, blockquote, pre, table, a, .group)) {
	margin-block: 0 1.5rem;
}

main :is(p, ul, ol, blockquote, pre, table, a):has(+ :is(h1, h2, h3, h4, h5, h6)) {
	margin-block: 0 3.5rem;
}

ul {
	list-style-type: circle;
}

.icon-box-text {
	align-content: center;
}

.alt-font {
	line-height: 1;
}

.social-button, .social-icons .button.icon:hover, .social-icons .button.icon:not(.is-outline) {
	background-color: inherit !important;
}

#header {
	
	.nav-left.header-nav {justify-content: end;}
	.nav-right.header-nav {justify-content: start;}
	
}

.back-to-top {
	color: #fff !important;
	mix-blend-mode: difference;
}

.gform_required_legend {
	display: none;
}

.clip {
	overflow: clip;
}

.linky {
	
	.col-inner {
		position: relative;
		isolation: isolate;
	}
	
	.box, .box-image {
		position: static;
	}
	
	a::before {
		content: '';
		position: absolute;
		inset: 0;
		z-index: 1;
	}
	
}

section:has(:is(.escape, .watermark)) {
	overflow: clip;
}

.col.bleed {
	position: relative;
	isolation: isolate;
	
	&::before {
		content: '';
		position: absolute;
		inset: 0 0 0 0;
		background: var(--fs-color-secondary);
	}
	
	&.pri::before {background: var(--fs-color-primary)}
	&.sec::before {background: var(--fs-color-secondary)}
	&.suc::before {background: var(--fs-color-success)}
	&.alr::before {background: var(--fs-color-alert)}
	
	&.end::before {
		inset: 0 auto 0 0;
		width: 100vw;
	}
	
	&.start::before {
		inset: 0 0 0 auto;
		width: 100vw;
	}
	
}




.col:has(> .col-inner > .escape) {
	margin-bottom: -30px;
	padding-inline: 0px;
}

.col-inner:has(> .escape) {
	position: relative;
	overflow-y: clip;
	height: 100%;
	min-height: 300px;
	
	.escape {
		position: absolute;
		inset: 0;
		align-content: center;
		width: max(50vw, 100%)  !important;
		height: 100%;
		
		&.start {
			inset: 0 0 auto auto;
			
			.img-inner {
				scale: 1.1;
				transform-origin: 100% 0%;
			}
			
		}
		
		&.end {
			inset: 0 auto auto 0;
			
			.img-inner {
				scale: 1.1;
				transform-origin: 0% 0%;
			}
			
		}
		
		& * {height: 100%;}
		
		img {
			object-fit: cover;
			object-position: top center;
		}
		
	}
	
}

section:has(.watermark) {
	isolation: isolate;
	
	.col-inner {
		isolation: isolate;
	}
	
	.wm-logo {
		position: absolute;
		inset: 0 0 0 auto;
		width: min(500px ,75%);
		z-index: -1;
		opacity: 0.1;
		align-content: center;
		
		svg {fill: #fff;}
		&.pri svg {fill: var(--fs-color-primary);}
		&.sec svg {fill: var(--fs-color-secondary);}
		&.suc svg {fill: var(--fs-color-success);}
		&.alr svg {fill: var(--fs-color-alert);}
		
	}
	
	.wm-flower {
		position: absolute;
		inset: 30px 0 30px auto;
		width: min(500px ,75%);
		translate: 50% 0%;
		opacity: 0.1;
		z-index: -1;
		align-content: center;
		
		&.stroke svg {stroke: #fff; !important}
		&.pri svg {fill: var(--fs-color-primary); stroke: var(--fs-color-primary);}
		&.sec svg {fill: var(--fs-color-secondary); stroke: var(--fs-color-secondary);}
		&.suc svg {fill: var(--fs-color-success); stroke: var(--fs-color-success);}
		&.alr svg {fill: var(--fs-color-alert); stroke: var(--fs-color-alert);}
		
	}
	
	.wm-leaf {
		position: absolute;
		inset: 30px auto 30px 0;
		width: min(500px ,75%);
		translate: -50% 0%;
		opacity: 0.2;
		z-index: -1;
		align-content: center;
		
		&.stroke svg {stroke: #fff; !important}
		&.pri svg {fill: var(--fs-color-primary); stroke: var(--fs-color-primary);}
		&.sec svg {fill: var(--fs-color-secondary); stroke: var(--fs-color-secondary);}
		&.suc svg {fill: var(--fs-color-success); stroke: var(--fs-color-success);}
		&.alr svg {fill: var(--fs-color-alert); stroke: var(--fs-color-alert);}
		
	}
	
}

.social-icons  {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	gap: 1rem;
	
	.text-left & {justify-content: start;}
	.text-right & {justify-content: end;}
	.text-center & {justify-content: center;}
	
	& > a:not(.plain) {
		color: var(--fs-color-secondary) !important;
		border-style: dashed solid solid solid !important;
		margin: 0 !important;
		
		.dark & {
			color: #fff !important;
		}
		
	}
	
}

.invert img {
	filter: brightness(0%) invert(1);
}
.contain {
	
	img {
		object-fit: contain;
	}
	
	svg {
		width: 100%;
		aspect-ratio: 1 / 1;
	}
	
	&.wide {
		
		svg {
			aspect-ratio: 16 / 9;
		}
		
	}
	
}


.gform-theme--framework, .gform-theme {
	--gf-color-primary: var(--fs-color-primary) !important;
	--gf-form-gap-y: 30px !important;
	
	.alr & {
		--gf-color-primary: var(--fs-color-alert) !important;
	}
	
	.gfield_label {
	  color: var(--gf-color-primary) !important;
	}
	
	.gfield_description {
	  color: var(--gf-color-primary) !important;
	}
	
	:is(input, textarea)::placeholder, option.gf_placeholder {
	  opacity: 0.5 !important;
	}
	
	.gform_button {
	  background: var(--gf-color-primary) !important;
	  color: #fff !important;
	  border: none;
	  padding: 10px 20px;
	}
	
}
.inspacer .person-title {
    display: inline-block;
    margin-bottom: 26.5px; /* tweak until it lines up perfectly */
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}