/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 10 2026 | 14:02:57 */
/*
========= 1. VARIABLES           ==========
========= 2. TYPOGRAPHY          ==========
========= 3. COLOR UTILS         ==========
========= 4. RESPONSIVENESS      ==========
========= 5. ANIMATIONS          ==========
========= 6. DECORATIVE ELEMENTS ==========
*/


/* ============= 1. VARIABLES =============== */
@property --about-dot-ring-scale {
	syntax: '<number>';
	inherits: false;
	initial-value: 1;
}

@property --about-dot-ring-opacity {
	syntax: '<number>';
	inherits: false;
	initial-value: 1;
}

/* ============= 2. TYPOGRAPHY =============== */
html, * {
	font-family: 'Mulish', sans-serif, monospace;
}

::selection {
	background-color: var(--green-light-1);
	color: #fff;
}

ul {
	list-style: square;
	
	li {
		&::marker {
			color: var(--green-light-1);
		}
	}
}

h2 {
	font-size: 2rem;
	font-weight: 600;
	margin-bottom: 1rem;
	color: var(--gray-dark-2-dyn-1);
	transition: all 0.4s;
	
	@media screen and (min-width: 991px) {
		font-size: 2.5rem;
	}
}

h3 {
	font-size: 1.5rem;
	color: var(--gray-dark-2-dyn-1);
	transition: all 0.4s;
	
	@media screen and (min-width: 991px) {
		font-size: 2rem;
	}
}

h1, h2, h3 {
	margin-bottom: 1rem;
}

tbody {
	vertical-align: top;
}

p, li, a, td, th {
	color: var(--gray-dark-2-dyn-1);
	transition: all 0.4s;
}

.button {
	font-weight: 500;
	font-size: 1rem;
	text-transform: uppercase;
	padding: 10px 20px;
	transition: background-color 0.3s;
	border-radius: 0;
	text-decoration: none;
	display: inline-block;
	width: fit-content;
	text-align: center;
	margin-bottom: 0;
	
	a {
		text-decoration: none;
	}
	
	@media screen and (min-width: 768px) {
		padding: 20px 40px;
	}
}

.text-large {
	font-size: 1rem;
	line-height: 1.3;
	
	@media screen and (min-width: 576px) {
		font-size: 1.25rem;
	}
				
	@media screen and (min-width: 1200px) {
		font-size: 1.5rem;
	}
}

.button-white {
	border: 1px solid var(--gray-light-1-dyn-1);
	background-color: var(--white);
	color: var(--green-dark-1);
	
	a {
		color: var(--green-dark-1);
	}
	
	&:hover {
		background-color: var(--green-light-1);
		border-color: var(--green-light-1);
	}
}

.button-arrow {
	color: var(--green-light-1);
	padding: 0;
	display: flex;
	text-transform: unset;
	align-items: center;
	
	a {
		color: var(--green-light-1);
	}
	
	svg {
		transition: all 0.3s;
	}
	
	&:hover {
		svg {
			transform: translateX(5px);
		}
	}
}

.button-light {
	background-color: var(--green-light-1);
	color: var(--green-dark-1);
	border: none;
	
	a {
		color: var(--green-dark-1);
	}
	
	&:hover {
		background-color: #80b23e;
	}
}

.button-200 {
	width: 200px;
}

.sr-text {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ============= 3. COLOR UTILS ============== */
.bg-white-dyn-1 {
	background-color: var(--white-dyn-1);
	transition: all 0.4s;
}
.bg-white-dyn-2 {
	background-color: var(--white-dyn-2);
	transition: all 0.4s;
}

.bg-teal {
	background-color: var(--teal);
}

.bg-teal-light {
	background-color: var(--teal-light);
}

.bg-teal-dark {
	background-color: var(--teal-dark);
}

.bg-green-dark-2 {
	background-color: var(--green-dark-2);
}

.bg-gray-light-3 {
	background-color: var(--gray-light-3);
}
.bg-gray-light-3-dyn-1 {
	background-color: var(--gray-light-3-dyn-1);
	transition: all 0.4s;
}
.bg-gray-light-3-dyn-2 {
	background-color: var(--gray-light-3-dyn-2);
	transition: all 0.4s;
}
.bg-gray-light-3-dyn-3 {
	background-color: var(--gray-light-3-dyn-3);
	transition: all 0.4s;
}

.text-gray-dark-1 {
	color: var(--gray-dark-1);
}
.text-gray-dark-1-dyn-1 {
	color: var(--gray-dark-1-dyn-1);
	transition: all 0.4s;
}
.text-gray-dark-2, .text-gray-dark-2 p {
	color: var(--gray-dark-2);
}

.text-green-dark-1-dyn-1 {
	*, a {
		color: var(--green-dark-1-dyn-1);
		transition: all 0.4s;
	}
}

.image-border {
	border: 1px solid var(--gray-light-1);
	padding: 0.5rem;
	display: flex;
	align-items: center;
}

.border-top-gray-light-1-dyn-1 {
	border-top: 1px solid var(--gray-light-1-dyn-1);
}

/* ============= 4. RESPONSIVENESS =========== */
.aligncenter {
	text-align: center;
}

.wp-block-video {
	display: flex;
	justify-content: center;
	margin-bottom: 2rem;
	
	video {
		max-width: 750px;
	}
}

.full-img {
	width: 100%;
	height: 100%;
	margin: 0;
	
	img {
		width: 100%;
		height: 100%;
		max-height: 350px;
		object-fit: cover;
	}
}

.stack-on-lg {
	flex-direction: column !important;
	
	&.flex-column-reverse {
		flex-direction: column-reverse !important;
	}

	@media screen and (min-width: 991px) {
		flex-direction: row !important;
		
		&.flex-column-reverse {
			flex-direction: row !important;
		}
	}
}

.stack-on-xl {
	flex-direction: column !important;
	
	&.flex-column-reverse {
		flex-direction: column-reverse !important;
	}

	@media screen and (min-width: 1200px) {
		flex-direction: row !important;
		
		&.flex-column-reverse {
			flex-direction: row !important;
		}
	}
}

.padding-header {
	padding-top: var(--header-height) !important;
}

.custom-container {
	max-width: 2000px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.adjustive-padding {
	padding: 0 10px;
	
	@media screen and (min-width: 400px) {
		padding: 0 20px;
	}
	
	@media screen and (min-width: 576px) {
		padding: 0 30px;
	}
	
	@media screen and (min-width: 991px) {
		padding: 0 50px;
	}
	
	@media screen and (min-width: 1200px) {
		padding: 0 100px;
	}
}

.pt-7 {
	padding-top: 90px !important;
}
.pb-7 {
	padding-bottom: 90px !important;
}
.py-7 {
	padding-top: 90px !important;
	padding-bottom: 90px !important;
}

.mt-4-5 {
	margin-top: 2rem !important;
}
.mb-4-5 {
	margin-bottom: 2rem !important;
}
.my-4-5 {
	margin-top: 2rem !important;
	margin-bottom: 2rem !important;
}

.big-video video {
	max-width: unset !important;
}

/* ============= 5. ANIMATIONS =========== */
.icon-animated {
	transition: transform 0.3s;
	
	&:hover {
		transform: translatey(-5px);
	}
}

.arrow-animated {
	text-decoration: none;
	
	p {
		margin: 0;
		line-height: 1;
		color: var(--green-light-1);
		font-weight: 600;
	}
	
	svg {
		transition: transform 0.3s;
	}
	
	&:hover {
		svg {
			transform: translateX(5px);
		}
	}
}

@keyframes about-dot-border-pulse {
	0% {
		--about-dot-ring-scale: 1;
		--about-dot-ring-opacity: 1;
	}

	50% {
		--about-dot-ring-scale: 0.72;
		--about-dot-ring-opacity: 0.65;
	}

	100% {
		--about-dot-ring-scale: 1;
		--about-dot-ring-opacity: 1;
	}
}

@keyframes vertical-gallery-marquee-y {
	from {
		transform: translateY(0);
	}
	
	to {
		transform: translateY(-50%);
	}
}

@keyframes vertical-gallery-marquee-x {
	from {
		transform: translateX(0);
	}
	
	to {
		transform: translateX(-50%);
	}
}

/* ============= 6. DECORATIVE ELEMENTS =========== */
.dark-overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -1;
	background-color: #0003;
}