header{
    position:absolute;
    top:0;
    left:0;
    right:0;
}
.banner-sec{
    background:url("../image/aboutbanner.png");
    background-position: center;
    background-size:cover;
    background-repeat:no-repeat;
    display:flex;
    align-items:center;
}
.lifestyle-heading{
    margin: 0 auto;
}
.lifestyle-heading > .title2{
    text-align:center;
}
.lifestyle-heading > .desc{
    text-align:center;
    color:#FFFFFF;
    margin-bottom:60px;
}
.banner-content{
    position:relative;
    z-index:2;
    /*padding: 120px 0;*/
    text-align:center;
}
.banner-content > .title1{
    font-size:84px;
    font-weight:bold;
    font-family:var(--rajdhani-txt);
    color:var(--white-txt);
    margin-bottom:30px;
}
.banner-content > .sub-txt{
    font-size:30px;
    font-weight:500;
}
.contineous-slider{
    padding-bottom:60px;
}
.yoga-box{
    overflow: hidden;
    border-radius: 20px;
    border:1px solid #ABC800;
}
.yoga-image{
    
    position:relative;
    overflow:hidden;
}
.yoga-image> img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.yoga-content{
    position:absolute;
   bottom:0;
   left:0;
   width:100%;
   padding:20px;
    
    border-radius:20px;
    border:1px solid #D7FB00;
    background:transparent;
    transform:translateY(54%);
    transition: transform 0.4s ease-in-out;
}
.yoga-box:hover .yoga-content{
    transform:translateY(0);
}
.yoga-content > .yoga-heading{
    text-align:center;
    font-size:22px;
}
.yoga-content > .sub-txt{
    text-align: center;
    font-size:14px;
}
@media screen and (max-width:1200px){
    
}
@media screen and (max-width:992px){
    .yoga-content {
    position: absolute;
    top: 117px;
    left:0;
    }
}
@media screen and (max-width:768px){
    
    
    .yoga-content {
        padding: 15px;
        transform: translateY(60%);
    }
    .banner-content > .title1 {
    font-size: 55px;
    }
}

@media screen and (max-width: 576px) {
    
        .banner-content > .title1 {
        font-size: 45px;
    }
    
    .yoga-content {
        
        transform: translateY(79%);
    }
}

@media screen and (max-width: 475px) {
    .yoga-content {
        
        transform: translateY(73%);
    
    }
}
@media screen and (max-width: 425px) {
    
}
@media screen and (max-width: 325px) {
    .yoga-content {
        
        transform: translateY(55%);
    }
    }