
.ourstory-overlay{
    position: absolute;
top: 10%;
left: 20%;
z-index: 100 !important;
max-width: 600px;
background: white;
padding: 20px;
border-radius: 20px;
border: 1px solid #dbdbdb;
}




.luxury-section{
h4{
font-size:22px;	
} span {
font-family:maxima;
font-style: italic;
font-size:22px;

}	
} 
.luxury-section {
p{
font-size:16px;
}
}
.luxury-section .text-danger {
position: relative;
}
.ourstory-row{
position: relative;
}



.luxury-section img {
object-fit: cover;
height: 400px;
width: 100%;
transition: transform 0.3s ease-in-out;
}

.luxury-section img:hover {

}

.hover-container {
position: relative;
overflow: hidden;
}

.hover-container img {
transition: transform 0.5s ease;
}

.hover-container:hover img {
filter: blur(5px);
transform: scale(1.1);
}

.hover-text {
position: absolute;
bottom: -80%;
left: 10%;
width: 100%;
text-align: center;
color: #1A6B54;
background: #fff;
padding: 10px;
opacity: 0;
transition: all 0.5s ease;
z-index: 99;
}

.hover-container:hover .hover-text {
bottom: 0;
opacity: 1;
width: 80%;
border: 1px solid #d7d7d7;
border-radius: 30px 30px 0px 0px;
}
.hover-text:hover{
background: #DDDDD3;
color:white;
}
.hover-text:hover h4{
color:white;
}
.hover-text h4{
font-size:14px;
margin: 0px;
font-weight:800;
}

.why-us{
p{
font-size:12px;
}
h5{
font-size:12px;	
}
img{
width: 50px;
}
h4{
font-size:22px;	
} span {
font-family:maxima;
font-style: italic;
text-align:center;
font-size:22px;

}	
}

.custom-card {
transition: transform 0.3s ease, box-shadow 0.3s ease;
overflow: hidden;
background-color: #fff;
font-family:maxima;
}

.custom-card:hover {
transform: translateY(-10px) scale(1.05);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.custom-card-body {
padding: 20px;
text-align: center;
}

.custom-card-body img {
transition: transform 0.3s ease;
}

.custom-card:hover img {
animation: shake 0.5s ease-in-out; /* Shake animation triggered on hover */
}

@keyframes shake {
0% { transform: translate(0, 0); }
10%, 30%, 50%, 70%, 90% { transform: translate(-5px, 0); }
20%, 40%, 60%, 80% { transform: translate(5px, 0); }
100% { transform: translate(0, 0); }
}

.custom-card h5 {
font-size: 1.25rem;
margin-top: 15px;
transition: color 0.3s ease;
}

.custom-card:hover h5 {
}

.custom-card p {
color: #666;
font-size: 0.95rem;
margin-top: 10px;
}

.custom-card:hover p {
color: #333;
}



@media (max-width: 768px) {
.luxury-section img {
height: 300px;
}
}

@media (max-width: 576px) {
.luxury-section img {
height: 250px;
}
}
