/* Banner Styles */
        .banner {
            position: relative;
            background-image: url('https://periyarworld.org/assets/img/gallery/gallery-banner.jpg');  
            background-size: cover;
            background-position: center;
            height: 450px;  
        }
        .overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(20deg, rgba(0, 0, 0, 0.00) 29.09%, rgba(0, 0, 0, 0.71) 92.09%), linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0.16%, rgba(0, 0, 0, 0.72) 79.33%);
            /*display: flex;
            align-items: center;
            justify-content: center;*/
        }
        .overlay h1 {   
            position: absolute;
            top: 57%;transform: translateY(-50%);
            left: 95px; 
color: #FFF;
font-family: 'Poppins Medium';
font-size: 38px;
font-style: normal;
font-weight: normal;
line-height: 150%; 
text-transform: uppercase;
        }

main{background-color: #1E1E1E;position: relative;}
main::before{content: '';position: absolute;top: 1px;left: 0px;height: 1px;width: 100%;
background: linear-gradient(90deg, #FFBF35 0%, #B87226 100%);}
.bg-gray-add{background-color: #323232;border-radius: 5px 0px 0px 5px;}
.frst-sec{position: relative;top: -65px; }
.frst-sec h4{color: #fff;
    font-family: 'Poppins Medium';
    font-size: 24px;
    font-style: normal; 
    line-height: 130%; }
.frst-sec p{color: #eee;
    font-family: 'Sen Regular';
    font-size: 14px;
    font-style: normal; 
    line-height: 170%; }
.w-90{width: 95%;}
.bg-linear a{z-index: 1;position: relative;display: block; }
.bg-linear a img{border-radius: 1px;
border: 3px solid #442300;
background: linear-gradient(224deg, rgba(0, 0, 0, 0.00) 80.08%, rgba(0, 0, 0, 0.20) 86.1%);
box-shadow: 0px 6px 20px 0px rgba(0, 0, 0, 0.25);}
.bg-linear{border-radius: 7px;
background-image: url('https://periyarworld.org/assets/img/gallery/bg-img.jpg');  
            background-size: cover;
            background-position: top;}
.AB-h-line, .bg-linear{position: relative;}
.bg-linear::before{content: '';position: absolute;top: 0px;width: 4px;height: 100%;
background: linear-gradient(to left, #101010 0%, #3F3F3F 100%);    left: 50%;
    transform: translateX(-50%);}
.AB-h-line::after{content: '';position: absolute;top: 0px;width: 40px;height: 5px;left: 50%;transform: translateX(-50%);
 background: linear-gradient(to bottom, #101010 0%, #3F3F3F 100%);}
.AB-h-line::before{content: '';position: absolute;top: 0px;width: 4px;height: 200px;
background: linear-gradient(to left, #101010 0%, #3F3F3F 100%);    left: 50%;
    transform: translateX(-50%);}
.AB-v-line{position: relative;}
.AB-v-line::before{content: '';position: absolute;top: 0px;left: 0px;width:100%;height: 5px;
background: #694932; }

.fancybox-button--zoom, .fancybox-button--thumbs, .fancybox-button--play{display: none !important;}
.eye-icon{position: absolute;bottom: 12px;left: 15px; border:none !important;transition: all 0.5s ease;}
/*.bg-linear a:hover{position: relative;}*/
.bg-linear a:hover .eye-icon{position: absolute;bottom: 45%; left: 50%; transform: translate(-50%, -50%) scale(1.65); 
    border:none !important; }
.bg-linear a:hover::before{content: '';position: absolute;top: 0px;left: 0px;width: 100%;height: 100%;
background-color: rgb(30 30 30 / 55%);}
/*.eye-icon:hover{position: absolute;top: 50%;transform: translate(-50%);left: 50%; }*/
.pt-md-5.po-add{padding-top: 2.25rem !important;} 
.mbl-d-v{display: none;}


@media only screen and (max-width:767px){
    .pt-md-5.po-add{padding-top: 1.5rem !important;}
    .bg-linear a:hover .eye-icon{bottom: 40%; }
    .mbl-d-not-v{display: none;}
    .mbl-d-v{display: block;}
    .frst-sec {top: -30px;text-align: center;}

}

@media only screen and (max-width:600px){
.eye-icon { width: 14px;}

.banner { height: 350px;}
.frst-sec h4 { font-size: 18px;padding-bottom: 10px;}
.overlay h1 {font-size: 28px;
    left: 50%;
    transform: translateX(-50%) !important;
    width: 100%;
    text-align: center;
    top: 71%;}
.overlay { background: linear-gradient(20deg, rgba(0, 0, 0, 0.00) 9%, rgba(0, 0, 0, 0.71) 92.09%), linear-gradient(270deg, rgba(0, 0, 0, 0.00) 6%, rgba(0, 0, 0, 0.72) 79.33%);}
}

@media only screen and (min-width:1800px) {
    body{max-width: 100%;margin-left: auto;margin-right: auto;}
}

@media (min-width:1900px){
    .frst-sec h4 { 
    font-size: 28px;
    }
    .frst-sec p{
        font-size: 18px;
        line-height: 32px;
    }
    .video-box p { font-size: 17px;}
  
        .overlay h1 {
            font-size: 43px;
        }
     }


.image-section {
    position: relative;
    border: 3px solid #fff;
    background: #000;
    border-radius: 2.833px;
border: 0.5px solid #333;
box-shadow: 0px 5.665px 18.884px 0px rgba(0, 0, 0, 0.25);
overflow: hidden;
}
.video-overlay {
    z-index: 2;
}

.video-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    text-align: center;
}
.image-section::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    /* background: #00000085; */
    background: linear-gradient(246deg, rgba(0, 0, 0, 0.00) -7.88%, rgba(0, 0, 0, 0.74) 96.17%);
    top: 0px;
    left: 0px;
    z-index: 1;
}
.video-box p{
  color: #FFF;
font-size: 13px;
font-style: normal;
font-family: 'Poppins Regular';
line-height: 180%;  letter-spacing: 0.5px;
text-transform: uppercase;
}
.video-iconbox{
  width: 40px;
    height: 40px;
    border: 1px solid #fff;
    border-radius: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    background: #000;
    background: rgba(51, 51, 51, 1);
    color: #fff;
}
.video-iconbox i{
  margin-left: 2px;
  margin-top: 2px;
}
@media (max-width:1200px){
  .video-box p{
      font-size: 14px;
  }
  .w-90 {
    width: 100%;
  }
}