/*
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.   ***************/
@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Charm:wght@400;700&display=swap');
:root{
	--primary-color: #353A10;
	--secondary-color:  #D08F53;
	--third-color: #D08F53;
	--font-title:  "Charm", cursive;
	--font-body: "Be Vietnam Pro", sans-serif;
}
h1, h2, h3, h4, h5, h6{
	font-family: var(--font-title);
}
body{
	font-family: var(--font-body);
}
*{
	box-sizing: border-box;
}
img{
	max-width: 100%;
}	
.col-inner:last-child{
	padding-bottom: 0;
}
a{
	transition: all .25s ease;
}
p:last-child{
	margin-bottom: 0;
}
header#header {
	box-shadow: 0px 4px 0px 0px #C6C6C6;
}
.header-main .nav > li > a{
	font-weight: 600;
}
.ss-pd{
	padding-top: 60px !important;
	padding-bottom: 30px !important;
}
.ss-footer{
	border-top: 1px solid var(--primary-color);
	.ux-logo-link{
		padding: 0 !important;
		margin-bottom: 15px;
	}
}
.ss-banner{
	.overlay{
		background-blend-mode: overlay;
		background: #D08F5380;
		background: linear-gradient(90deg, #EEE5DA 23.02%, rgba(238, 229, 218, 0) 85.27%);
	}
}
.ss-text-banner{
	h1{
		font-size: 100px;
		color: #864727;
		line-height: 1.2;
	}
	.column-graphic:after{
		content: '';
		position: absolute;
		left: 50%;
		bottom: 0;
		width: 530px;
		height: 210px;
		background-color: transparent;
		border: 3px solid #91908E;
		border-radius: 20px;
		transform: translate(-50%, 20%);
		z-index: -1;
	}
	.column-graphic:before{
		content: '';
		position: absolute;
		left: 0%;
		bottom: -15%;
		width: 360px;
		height: 90px;
		background-color: transparent;
		border: 3px solid #91908E;
		border-radius: 20px;
		transform: translate(-10%, 21%);
		z-index: -1;
	}
}
.ss-univerver{
	h2{
		font-size: 100px;
		line-height: 1.2;
		margin-bottom: 30px;
	}
	.banner{
		border-top-left-radius: 500px;
		border-top-right-radius: 500px;
		overflow: hidden;
		.overlay{
			background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #7B886F 100%);
		}
	}
	h3{
		margin-bottom: 0;
		font-family: var(--font-body);
		font-size: 22px;
		margin-top: 15px;
		font-style: italic;
	}
	img{
		object-fit: contain;
	}
}
.ss-tail{
	overflow: hidden;
	.banner{
		border-bottom-left-radius: 500px;
		border-bottom-right-radius: 500px;
		overflow: hidden;
	}
	.banner-2{
		border-bottom-left-radius: 0%;
		border-bottom-right-radius: 0%;
		border-top-left-radius: 500px;
		border-top-right-radius: 500px;
		overflow: hidden;
		width: 70%;
		margin-left: 0;
	}
	.image-box-1 {
		z-index: -1;
		margin-top: -60%;
		.box-text {
			text-shadow: unset !important;
			margin-bottom: 70px;
			width: 80% !important;
			left: 50%;
			transform: translateX(-50%);
			h3{
				font-size: 40px;
				margin-bottom: 15px;
			}
		}
	}
	.image-box-2 {
		z-index: -1;
		margin-top: -40%;
		.box-text {
			text-shadow: unset !important;
			margin-bottom: 70px;
			width: 60% !important;
			left: 50%;
			transform: translateX(-50%);
			h3{
				font-size: 40px;
				margin-bottom: 15px;
			}
		}
	}
	.button{
		margin-bottom: 0;
		font-weight: 400;
		font-size: 24px;
		padding: 3px 100px 3px 50px;
		border-top-right-radius: 50px;
		border-bottom-right-radius: 50px;
		position: relative;
	}
	.button:after{
		content: '';
		position: absolute;
		top: 50%;
		right: 35px;
		transform: translate(0%, -50%);
		width: 40px;
		height: 40px;
		background-image: url(/wp-content/uploads/2026/01/aicons_1-arrow.png);
		background-size: contain;
		background-position: center;
		background-repeat: no-repeat;
	}
}
.icon-box-img img, .icon-box-img svg {
	padding-top: 0;
}
.ss-craft{
	.html{
		background-color: var(--primary-color);
		padding: 30px;
		padding-right: 60px;
		align-items: center;
		border-bottom-right-radius: 500px;
		border-top-right-radius: 500px;
		z-index: 1;
		position: relative;
		h2{
			font-size: 40px;
		}
		p:last-child{
			margin-bottom: 0;
		}
	}
}
.flickity-slider>.row:not(.is-selected) {
	opacity: 1;
}
.ss-gallery{
	.banner{
		border-radius: 500px;
		overflow: hidden;
	}
	.image-break{
		margin-top: 50px;
		position: relative;
		img{
			display: block;
			margin: auto;
			position: relative;
			padding: 15px;
			background-color: #EEE5DA;
		}
	}
	.image-break:after{
		content: '';
		position: absolute;
		width: 100%;
		top: 42%;
		transform: translateY(-50%);
		height: 1px;
		background-color: #737373;
		z-index: -1;
	}
}
.ss-workshop{
	align-items: flex-start;
	.section-bg-overlay{
		background-color: transparent !important;
		background: linear-gradient(180deg, rgba(238, 229, 218, 0) 59.14%, #EEE5DA 100%);
	}
	.textbox{
		background-color: var(--primary-color);
		width: 100%;
		padding: 50px;
		border-bottom-right-radius: 500px;
		border-bottom-left-radius: 500px;
		h2{
			font-size: 40px;
			margin-bottom: 15px;
		}
	}
	.section-content{
		position: unset !important;
	}
	.readmore{
		img{
			position: absolute;
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
			animation: readmore 3s ease infinite;
			transition: all .3s ease;
		}
		img:hover{
			filter: brightness(0) saturate(100%) invert(62%) sepia(33%) saturate(642%) hue-rotate(347deg) brightness(91%) contrast(95%);
		}
	}
}
@keyframes readmore{
	0%{
		transform: translate(-50%, 10px);
	}
	50%{
		transform: translate(-50%, -10px);
	}
	100%{
		transform: translate(-50%, 10px);
	}
}









@media(max-width: 998px){

}
@media(max-width: 580px){
	.ss-pd{
		padding-top: 30px !important;
		padding-bottom: 0px !important;
	}
}