/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 16 2024 | 00:21:19 */
.main-slider {
	width: 100%;
	height: 520px; 
	background-color: white;
	position: relative;
	display: block;
}
	.main-slider .slide-container {
		width: 100%;
		height: 100%;
		position: relative;
	}
		.main-slider .slide-container .slide {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			opacity: 0;
			display: flex;
			pointer-events: none;
			transition-property: pointer-events, opacity;
			transition-duration: 0s, 1s;
			transition-delay: 0s, 0s;
		}
			.main-slider .slide-container .slide.active {
				opacity: 1;
				pointer-events: unset;
				transition-property: pointer-events, opacity;
				transition-duration: 0s, 1s;
				transition-delay: 0s, 0s;
			}
				.main-slider .slide-container .slide.active .content-container .title { 
					transition-property: margin-bottom, opacity;
					margin-bottom: 0px;
					opacity: 1;
					transition-duration: 0.4s, 0.4s; 
					transition-delay: 0.5s, 0.5s;
				}
				.main-slider .slide-container .slide.active .content-container .description { 
					transition-property: opacity;
					opacity: 1;
					transition-duration: 0.4s, 0.4s; 
					transition-delay: 0.5s, 0.5s;
				}
				.main-slider .slide-container .slide.active .content-container .italic-text { 
					transition-property: opacity;
					opacity: 1;
					transition-duration: 0.4s, 0.4s; 
					transition-delay: 0.5s, 0.5s;
				}
				.main-slider .slide-container .slide.active .content-container .button {
					transition-property: opacity;
					opacity: 1;
					transition-duration: 0.5s, 0.5s; 
					transition-delay: 0.5s, 0.5s;
				}
			.main-slider .slide-container .slide img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
			.main-slider .slide-container .slide .content-container {
				position: absolute;
				display: flex;
				flex-direction: column;
				width: 50%;
				height: 100%;
				text-align: center; 
				align-items: center;
				justify-content: center;
				top: 0;
			}
				.main-slider .slide-container .slide .content-container.left {
					left: 0;
				}
				.main-slider .slide-container .slide .content-container.right {
					right: 0;
				}
				.main-slider .slide-container .slide .content-container.align-left {
					align-items: baseline;
					text-align: left;
				}
				.main-slider .slide-container .slide .content-container.align-right {
					align-items: flex-end;
					text-align: right;
				}
				.main-slider .slide-container .slide .content-container .title {
					font-size: 80px; 
					line-height: 1.1;
					text-shadow: 2px 2px black;
					font-family: "Galada";
					color: rgb(255, 187, 0);
					letter-spacing: 4px;
					margin-bottom: -80px; 
					opacity: 0;
				}
				.main-slider .slide-container .slide .content-container .title.non-italic {
					font-family: "Fredoka";
					letter-spacing: normal; 
					font-weight: 600;
					font-size: 60px;
				}
				.main-slider .slide-container .slide .content-container .description {
					font-family: "Fredoka";
					color: rgb(0, 106, 32);
					font-size: 40px;
					font-weight: 600;
					opacity: 0;
				}
				.main-slider .slide-container .slide .content-container .italic-text {
					font-family: "Galada";
					transform: matrix(1, 0, 0, 1, 0, 0);
					transform-origin: 214.5px 18px;
					color: rgb(0, 106, 32);
					font-size: 40px;
					font-weight: 400;
					line-height: 1.1;
					margin-top: 15px;
					opacity: 0;
				}
				.main-slider .slide-container .slide .content-container .button {
					display: flex;
					justify-content: center;
					align-items: center;
					margin-top: 40px;
					width: 200px; 
					height: 60px; 
					background-color: rgb(0, 106, 32);
					text-transform: uppercase;
					font-weight: 800;
					font-size: 20px;
					letter-spacing: 2px;
					transition: 0.4s;
					opacity: 0;
				}
					.main-slider .slide-container .slide .content-container .button:hover {
						background-color: rgb(255, 187, 0);
						transition: 0.4s;
					}
	.main-slider .nav-arrow {
		cursor: pointer;
		position: absolute; 
		top: 50%;
		margin-top: -25px; 
		width: 40px; 
		height: 40px;
		background-color: #006a20;
		display: flex; 
		justify-content: center; 
		align-items: center;
	}	
		.main-slider .nav-arrow:hover {
			background-color: black;
		}
		.main-slider .nav-arrow.left {
			left: 20px;
		}
		.main-slider .nav-arrow.right {
			right: 20px;
		}
		.main-slider .nav-arrow img {
			width: 15px; 
			height: 15px;
		}

	.main-slider .dots-navigation {
		position: absolute;
		width: 100%; 
		height: 12px; 
		bottom: 20px; 
		display: flex;
		justify-content: center;
		align-items: center;
	}
		.main-slider .dots-navigation .dot {
			cursor: pointer;
			background-color: rgba(0, 106, 32, 0.33);
			border-radius: 100%;
			margin-left: 12px; 
			margin-right: 12px;
			height: 12px; 
			width: 12px;
			transition: 0.3s;
		}
			.main-slider .dots-navigation .dot.active {
				background-color: rgb(0, 106, 32);
				width: 14px; 
				height: 14px;
				transition: 0.3s;
			}

@media screen and (max-width: 1024px) { 
	.main-slider .slide-container .slide .content-container .title { 
		font-size: 60px;
	}
	.main-slider .slide-container .slide .content-container .title.non-italic { 
		font-size: 40px;
	}
	.main-slider .slide-container .slide .content-container .description { 
		font-size: 30px;
	}
	.main-slider .slide-container .slide .content-container .italic-text { 
		font-size: 30px;
	}
}

@media screen and (max-width: 820px) { 
	.main-slider .slide-container .slide .content-container { 
		width: 60%;
	}
	.main-slider .slide-container .slide .content-container .title { 
		font-size: 40px;
		rgb(0, 0, 0) 1px 1px 0px
	}
	.main-slider .slide-container .slide .content-container .title.non-italic { 
		font-size: 30px;
	}
	.main-slider .slide-container .slide .content-container .description { 
		font-size: 25px;
	}
	.main-slider .slide-container .slide .content-container .italic-text { 
		font-size: 25px;
	}
	.main-slider .slide-container .slide .content-container .button {
		font-size: 15px;
		height: 40px; 
		width: 150px;
	}
}

@media screen and (max-width: 480px) { 
	.main-slider .slide-container .slide .content-container { 
		width: 75%;
	}
}