*{ padding: 0; margin: 0; box-sizing: border-box; }
body { font-family: 'Poppins', sans-serif; font-size: 16px; color: #000; line-height: 1.6; background-color: #fff; }
img { display: block; max-width: 100%; height: auto; }
a { outline: none; text-decoration: none; color: #000; text-decoration: none; transition: all 0.3s ease-in-out; }
a:hover { color: #ee0c3d; }
ul,ol { padding: 0; margin: 0; list-style: none; }
h1, h2, h3, h4, h5, h6 { font-weight: 700; line-height: 1.7; font-family: 'Poppins', sans-serif; font-size: 28px;}
h2 {padding-bottom: 15px;}
::placeholder {color: #fff; opacity: 1;  }    
::-ms-input-placeholder { color: #fff; }

img{width: 100%;}
p{font-family: 'Poppins', sans-serif; line-height: 28px;}

.wrapper { width: 100%; position: relative; overflow: hidden; }
.TopHead{width: 100%; display: flex; justify-content: space-between;position: absolute;  top: 0; z-index: 10; padding: 20px 4% 20px; background-color: rgba(255, 255, 255, 0.6); align-items: center;}
.TopHead .watchLive{display: none;}
.backtojagran{font-size: 14px; position: relative;}
.backtojagran::before { width: 0;  height: 0; border-top: 8px solid transparent;  border-right: 10px solid red;  border-bottom: 8px solid transparent;  content: ''; position: absolute; left: -15px; top: 2px;}
.headRight{font-size: 14px; position: relative;}
.headRight ul{display: flex; align-items: center;}
.headRight li a{padding: 5px 15px; display: block; font-size: 15px; font-weight: 600; line-height: 22px;}
.headRight li:first-child a{padding-left: 0;}
.headRight li a.watch{display: block;}
.headRight li.watch a{border: 1px solid #333; border-radius: 20px; color: #ee0c3d; display: inline;}
.mainConatainer{width: 100%;}

.containerCenter {padding-right: calc((100% - 1190px) / 2); padding-left: calc((100% - 1190px) / 2);}
.heroSection { width: 100%;  position: relative; overflow: hidden; min-height: 710px; position: relative;}
.heroSection.containerCenter {padding-right: calc((100% - 1060px) / 2); padding-left: calc((100% - 1060px) / 2);}
.heroSection .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.heroSection .bg:before { position: absolute; left: 0; bottom: 0; display: block; content: ''; width: 100%; height: 68px; background: url(../images/hero-bg-strip.png) center top no-repeat; background-size: 100%; z-index: 3;}
.heroSection .bg img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.heroInner{position: absolute; z-index: 2; width: 100%; bottom: 42px;}
.heroInner .content{display: flex; justify-content: space-between; }
.pyImage{ display: flex; justify-content: flex-end; flex-wrap: wrap; padding-top: 50px; margin-bottom: -9px;}
.pyImage span{width: auto; padding-right: 0px;}
.pyImage p{font-size: 18px; font-weight: 500; padding-top: 20px;font-family:'Poppins', sans-serif;}
.pyImage p span{width: 100%; display: block;}
.pyImage span img{text-align: right; width: 90%;}
.pyImage.yogi img{position: relative; left: 20px;}
.pyImage.modi img{position: relative; right: -25px;}
.kumbhlogo{position: absolute; top: 10%; left: 35%; z-index: 2; overflow: hidden; perspective: 1000px;}
.webview { display: none;}

.kumbhlogo img {display: block; width: 80%;  transform-origin: left; animation: wave 5s infinite;}
.mahakumbhContainer, .shortVideo{width: 100%; display: flex; justify-content: space-between; align-items: center; padding-top: 20px; padding-bottom: 20px;}
.mkLeft, .mkRight{width: 50%;}
.mkLeft{padding-left: 10%;}
.mkLeft img{max-width: 460px; width: 100%;}
.mkRight h1 {line-height: 1.7; margin-bottom: 10px;}
.mkRight h1 span{color: #df3f1d; display: block;}

.VideoController{display: none; }
.VideoPlayer{width: 100%; background: #ca2d33 url(../images/video_bg.png) no-repeat 0 215px; position: relative; min-height: 400px;display: flex; justify-content: center; flex-wrap: wrap; margin-top: 45px; padding-bottom: 50px;}
.VideoPlayer::before{position: absolute; top: 0; left: 0; content: ''; width: 100%; height: 200px; background-color: #fff;}
.video{max-width: 900px; width: 100%; min-height: 425px; border: 10px solid #fff; position: relative;}
.video-cont {position: relative; padding-bottom: 56.25%; height: 0; clear: both;}
.video-cont iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}
.video a {position: relative;}
.video a::before{position: absolute; top: 45%; left: 45%; width: 85px; height: 85px; background: url(../images/paleyer_btn.png) no-repeat 0 0; content: ''; background-size: 85px 85px;}
.video img{height: 100%;}
.videoText{display: none; max-width: 1075px; width: 100%; text-align: center; color: #fff; padding: 20px 0 30px;}
.videoText h2{margin-bottom: 15px;}
.shortVideo{flex-wrap: wrap;}
.shortVideo ul{overflow: hidden;   /*height: 530px;*/ align-items: flex-start;  display: flex; gap: 15px; justify-content: space-between;}
.shortVideo li{border-radius: 30px; overflow: hidden; height: 530px;}
.shortVideo li a{color: #fff;}
.shortVideo li:nth-child(even){margin-top: 30px;}
.shortVideo li a p { color: #fff; white-space: pre-wrap;  line-height: 1.6;font-size: .85rem;}
.shortVideo .figure{ position: relative; overflow: hidden;}
.shortCapblock {position: absolute; padding: 40px 20px 20px;  bottom: 0; box-sizing: border-box; left: 0;  width: 100%;  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .7) 50%, #000); overflow: hidden;}
.MainHd {padding-bottom: 5px; clear: both; margin-bottom: 15px; display: flex; justify-content: space-between; margin-top: 10px; width: 100%; align-items: center;}
.MainHd h2{padding-bottom: 0;}
.khabrein{background: #e9f7ff; position: relative;}
.containerCenter.khabrein{padding-right: calc((100% - 1190px) / 2); padding-left: calc((100% - 1190px) / 2);padding-bottom: 155px; position: relative;}
.containerCenter.khabrein .MainHd{position: relative; z-index: 2; padding: 165px 0 20px;}
.containerCenter.khabrein::before, .containerCenter.khabrein::after{content: ''; background: url(../images/blue_top_strip.jpg) no-repeat 0 0; width: 100%; height: 137px; position: absolute; top: 0; left: 0;}
.containerCenter.khabrein::after{background: url(../images/blue_bot_strip.jpg) no-repeat 0 0; bottom: -18px; top: inherit;}
/* .containerCenter.khabrein .swiper .swiper-wrapper{display: flex; gap: 20px;}  */
.containerCenter.khabrein .swiper .swiper-slide{background: #fff; }


.slideImg{width: 100%; display: block;}
.slideTxt{margin: 30px 30px 65px; height: 78px; overflow: hidden;} 

.containerCenter.khabrein .swiper-button-next1, .containerCenter.khabrein .swiper-rtl .swiper-button-prev1, .containerCenter.khabrein .swiper-button-next1.swiper-button-disabled, .containerCenter.khabrein .swiper-button-prev1.swiper-button-disabled,  .containerCenter.khabrein .swiper-button-prev1,  .containerCenter.khabrein .swiper-rtl .swiper-button-next1{background: #ca2d33;    border-radius: 50%; height: 30px; width: 30px; color: #fff; left:2%; }
.containerCenter.khabrein .swiper-button-next1{left: inherit; right: 2%;}
.containerCenter.khabrein .swiper-button-next1:after, .containerCenter.khabrein .swiper-button-prev1:after{font-size: 10px;}


.videoSlderContainer{width: 100%; margin: 60px 0 34px 0px; display: flex; justify-content: space-between; position: relative; clear: both;}
.videoLeft{width: 24%; padding-right: 1%;}
.videoLeft p span{display: block; padding-top: 10px;}
.videoLeft p span a{color: #ee0c3d; font-weight: 600; font-size: 18px;}
.videoSlider{width: 75%;}
.swiper.videoSwiper{padding-bottom: 34px;}
.swiper.videoSwiper .swiper-pagination-bullet-active{background: #333;}
.vdslideIn{width: 100%;box-shadow: 4px 3px 22px -6px rgb(0 0 0 / 13%);}
.vdimg span{position: absolute; bottom: -17px; height: 47px; width: 47px; left: 41%;}
.vdslideIn a{display: flex; width: 100%; flex-wrap: wrap; position: relative;}
.vdimg{width: 100%; position: relative;}
.vidTxt{padding: 0px 10px 0px; margin: 20px 0px 60px; font-size: 16px;  line-height: 1.6; height: 78px; overflow: hidden;}




.videoSlderContainer .swiper-slide{background: #fff; padding: 10px;}
.videoSlderContainer .swiper-button-next, .videoSlderContainer .swiper-rtl .swiper-button-prev, .videoSlderContainer .swiper-button-next.swiper-button-disabled, .videoSlderContainer .swiper-button-prev.swiper-button-disabled,  .videoSlderContainer .swiper-button-prev,  .videoSlderContainer .swiper-rtl .swiper-button-next{background: #000;    border-radius: 50%; height: 30px; width: 30px; color: #fff;position: absolute; left: 0px; top: inherit; bottom: 60px;}
.videoSlderContainer .swiper-button-next, .videoSlderContainer .swiper-button-next.swiper-button-disabled{left: 50px;}
.videoSlderContainer .swiper-button-next:after, .videoSlderContainer .swiper-button-prev:after{font-size: 10px;}





.photoSlderContainer{ width: 100%; margin: 60px 0 60px 0px; display: flex; justify-content: space-between; position: relative;}
.photoSlderContainer::after{ background: url(../images/big-photo-1a.jpg); content: ""; position: absolute;     right: 0px;
    top: -36px;
    width: 40%;
    height: 123%;}
.photoSlderContainer::before{width: 60%; background: #ee0c3d; content: ''; position: absolute; left: 0; top: 0; height: 100%;}
.photoLeft{width: 35%; position: relative; margin-right: 15px; padding: 40px 160px 100px 50px; color: #fff;   background: #ee0c3d;}

/* .photoRight img{opacity: .5;} */
.photoLeft p span{display: block; padding-top: 10px;}
.photoLeft p span a{color: #ffd800; font-weight: 600; font-size: 18px;}
.photoSlider{width: 80%; position: absolute; top: 6%; left: 25%; border: 20px solid #fff; height: 280px; overflow: hidden; background: #fff; z-index: 2;}
.photoslideIn{width: 100%;box-shadow: 4px 3px 22px -6px rgb(0 0 0  / 13%);}
.photoslideIn a{display: flex; width: 100%; flex-wrap: wrap; gap: 15px; position: relative;}
.photoslideIn a span{position: absolute; top: 50%; left: 37%; height: 67px; width: 67px;}
.photoimg{width: 100%;}
.photoimg img{height: 280px; object-fit: cover;}


.photoSlderContainer .swiper .swiper-wrapper{display: flex; gap: 0px;} 
.photoSlderContainer .swiper .swiper-slide{background: #fff; width: 100%; padding: 0px;}
.photoSlderContainer .swiper-button-next, .photoSlderContainer .swiper-rtl .swiper-button-prev, .photoSlderContainer .swiper-button-next.swiper-button-disabled, .photoSlderContainer .swiper-button-prev.swiper-button-disabled,  .photoSlderContainer .swiper-button-prev,  .photoSlderContainer .swiper-rtl .swiper-button-next{background: #ee0c3d;    border-radius: 50%; height: 30px; width: 30px; color: #fff;position: absolute; left: 53px; bottom: 0; top: 78%; border: 2px solid #fff;}
.photoSlderContainer .swiper-button-next, .photoSlderContainer .swiper-button-next.swiper-button-disabled{left: 93px;}

.photoSlderContainer .swiper-button-next:after, .photoSlderContainer .swiper-button-prev:after{font-size: 10px;}
.mob{display: none;}
.web{display: block;}

.footer{display: flex; width: 100%; justify-content: center; background: #fff;}
.footer img{max-width:1000px; width: 100%;}

.footerSection {
    padding-top: 50px;
    padding-bottom: 50px;
    position: relative;
    width: 100%;
    background-color: #000;
}
.footerSection h2 {
    margin-bottom: 15px;
    font-size: 20px;
    text-align: center;
    color: #fff;
}
.footerSection .social {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
}
.footerSection .social li a {
    width: 35px;
    display: block;
    background-image: none;
    transition: all 0.3s ease-in-out;
}
.footerSection .copyright {
    font-size: 10px;
    color: #fff;
    width: 100%;
    text-align: center;
}

.footerSection .back {
    padding: 0 20px;
    position: absolute;
    right: 20px;
    bottom: 20px;
    color: #fff;
    display: flex;
    gap: 5px;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    background-image: none;
    min-height: 42px;
    border-radius: 10px;
    background-color: #da2c21;
}
.footerSection .back:hover {
    color: #fff;
    background-color: #6d6d6d;
}
.footerSection .back:after {
    content: '';
    width: 0;
    height: 0;
    border-width: 6px 0 6px 6px;
    border-color: transparent transparent transparent #FFFFFF;
    border-style: solid;
}

.red {
    background-color: #da251d;
    top: 4px;
    font-size: 9px;
    left: -10px;
    position: relative;
    height: 4px;
    width: 4px;
    margin-left: 10px;
}
.red:before {
    position: absolute;
    content: "";
    height: 3px;
    width: 3px;
    background-color: transparent;
    border-radius: 50%;
    box-shadow: 0px 0px 0 3px #da251d;
    left: 0%;
    top: 0%;
    transform: translate(-50%, -50%);
    animation: active 2s infinite linear;
}
@-webkit-keyframes active{0%{-webkit-transform: translate(-50%, -50%) scale(.1); opacity:1;} 70%{-webkit-transform: translate(-50%, -50%) scale(1.5); opacity:0;}  100%{opacity:0;}}
@keyframes active{ 0%{transform:translate(-50%, -50%) scale(.1); opacity:1;} 70%{transform:translate(-50%, -50%) scale(2.5);  opacity:0;}  100%{opacity:0;} }

@media screen and (max-width: 767px) {
    .webview { display: block;}
    .mobileview { display: none;}
    .slideTxt{ height: 117px; margin: 30px 0px 45px; }
    .mkRight h1 span { display: inline;}
    h1,h2{font-size: 24px;}
    .videoLeft p span a{font-size: 16px;}
    .imgAbhiTop, .imgAbhibot{width: 190px;}
    .containerCenter .block{padding: 0 30px 30px;}
    .pyImage{padding-top: 0%; width: 100%;}
    .pyImage img{height: 90px; width: 100%;}
    .pyImage span{padding-right: 15px; width: 100%; padding-top: 100px; display: flex; justify-content: center;}
    .pyImage span img{max-width: 250px; width: 100%; height: auto;}
    .heroSection { min-height: 580px; }
    .heroSection .bg:before  {  height: 70px; background-size: cover;}
    .kumbhlogo {   left: 0;  width: 94%;    top: unset;    bottom: 215px;   display: flex;  justify-content: center;}
    .kumbhlogo img{max-width: 195px; width: 90%;}
    .mahakumbhContainer{flex-wrap: wrap; justify-content: center;}
    .mkLeft, .mkRight{width:100%;  padding: 0 10%; text-align: center;}
    .mkRight h1{line-height: 1.6;}
    .mkLeft{margin-bottom: 30px; display: flex; justify-content:center;}
    .mkLeft img{width: 240px;}
    .shortVideo ul{ flex-wrap: nowrap; gap: 15px; white-space: nowrap; overflow-x: auto; overflow-y: hidden;  height: auto;    padding: 0 15px;  width: 100%; box-sizing: border-box; }
    .shortVideo li{flex: 0 0 305px}
    .MainHd {padding: 0 15px;}

    .video{min-height: unset; margin: 0 20px;}
    .VideoPlayer::before {  height: 130px; }
    .video a::before{ width: 60px; height: 60px; background-size: 60px 60px; top: 43%; left: 45%;}
    .videoText{padding: 20px 10px 55px;}
    .videoText h2{font-size: 24px;         margin-bottom: 0;}
    .VideoPlayer{min-height: unset;}

    .containerCenter.khabrein .swiper .swiper-slide{width: inherit !important;}
    .containerCenter.khabrein::before, .containerCenter.khabrein::after{background-size: 100%;}
    .containerCenter.khabrein{padding-bottom: 75px; padding-left: 20px; padding-right: 20px;}
    .containerCenter.khabrein::after{bottom: -137px;}
    .containerCenter.khabrein .MainHd{padding-top: 105px; padding-bottom: 0px;}
    .containerCenter.khabrein .swiper-button-next1{ left: inherit; right: 10px; }
    .containerCenter.khabrein .swiper-button-prev1{ left: 10px; right: inherit; }
    .videoSlderContainer{flex-wrap: wrap; padding-left: 15px; padding-right: 15px;}
    .videoLeft{width: 100%; margin-bottom: 20px;}
    .videoSlider{width: 100%;}
    .videoSlderContainer .swiper-button-next, .videoSlderContainer .swiper-rtl .swiper-button-prev, .videoSlderContainer .swiper-button-next.swiper-button-disabled, .videoSlderContainer .swiper-button-prev.swiper-button-disabled, .videoSlderContainer .swiper-button-prev, .videoSlderContainer .swiper-rtl .swiper-button-next{ left: 10px; top: 70%;  right: inherit;}
    .videoSlderContainer .swiper-rtl .swiper-button-next,.videoSlderContainer  .swiper-button-next{ left: inherit; top: 70%;  right: 10px;}
   
    .videoSlderContainer .swiper-rtl .swiper-button-prev,  .videoSlderContainer .swiper-button-prev.swiper-button-disabled, .videoSlderContainer .swiper-button-prev{right: 78px;} 
    
    
    .photoSlderContainer{flex-wrap: wrap; padding: 0px; margin-bottom: 50px;}
    .photoLeft{width: 100%;}
    .photoLeft h2{padding-bottom: 0px;}
    .photoSlider{width: 100%; top: 48%; position: relative; z-index: 2;}
    .photoSlderContainer .swiper-button-next, .photoSlderContainer .swiper-rtl .swiper-button-prev, .photoSlderContainer .swiper-button-next.swiper-button-disabled, .photoSlderContainer .swiper-button-prev.swiper-button-disabled, .photoSlderContainer .swiper-button-prev, .photoSlderContainer .swiper-rtl .swiper-button-next{left: inherit; top: 55%;  right: 10px;}
    .photoSlderContainer .swiper-rtl .swiper-button-prev,  .photoSlderContainer .swiper-button-prev.swiper-button-disabled, .photoSlderContainer .swiper-button-prev{left: 11px;} 
    .photoLeft::before, .photoLeft::after{height: 0;}
    .photoLeft p{padding: 0;}
    .photoLeft{padding: 50px 30px 80px; margin-right: 0;}
    .photoSlider{top: inherit; margin-top: -30px; left: 50%; margin-left: -150px; height: auto; border: 10px solid #fff;} 
    .mob{display: block;}
    .web{display: none;}

    .containerCenter.khabrein .swiper-button-next1, .containerCenter.khabrein .swiper-rtl .swiper-button-prev1, .containerCenter.khabrein .swiper-button-next1.swiper-button-disabled, .containerCenter.khabrein .swiper-button-prev1.swiper-button-disabled, .containerCenter.khabrein .swiper-button-prev1, .containerCenter.khabrein .swiper-rtl .swiper-button-next1{top: 56%;}

    .videoSlderContainer .swiper-button-next1, .videoSlderContainer .swiper-button-prev1{ height: 35px; width: 35px; display: none;}

    .containerCenter.khabrein .swiper-button-next1, .containerCenter.khabrein .swiper-button-prev1{ height: 35px; width: 35px;}

    .videoSlderContainer .swiper-button-next:after, .videoSlderContainer .swiper-button-prev:after, .containerCenter.khabrein .swiper-button-next:after, .containerCenter.khabrein .swiper-button-prev:after {font-size: 16px;}

    .videoSlderContainer .swiper .swiper-slide{padding: 8px;}
    .vidTxt {padding: 30px; font-size: 18px; height: 88px;}
    .slideTxt {padding: 30px 30px 45px;}
    .slideTxt a{font-size: 15px; line-height: 1.9;}
    .containerCenter {
        padding-left: 20px;
        padding-right: 20px;
    }
    .footerSection{text-align: center;}
    .footerSection .back {
        margin: 15px auto 0 auto;
        position: relative;
        right: unset;
        bottom: unset;
        display: inline-flex;
    }
    .TopHead{flex-wrap: wrap; padding-bottom: 0;}
    .TopHead .watchLive{display: block; border-radius: 20px; color: #ee0c3d;}
    .TopHead .watchLive a{border: 1px solid #333; border-radius: 20px; color: #ee0c3d; padding: 5px 15px; font-weight: 600; font-size: 16px;}
    .headRight{width: 100%;}
    .headRight ul{overflow-x: auto; overflow-y: hidden; white-space: nowrap;}
    .headRight li a{padding: 30px 10px 22px;}
    .headRight li.watch a{padding-left: 0;}
    .headRight li a{font-size: 16px;}
    .headRight li.watch{display: none;}
    .photoSlderContainer::before{display: none;}
    .photoSlderContainer::after{ top: 250px; width: 100%;   height: 100%; right: inherit;}
    .pyImage.yogi img{left: 0;}
    }
@media screen and (max-width: 520px) {
   
    .photoSlider{max-width: 300px;}   
    .photoSlderContainer{padding-bottom: 185px;}  
   
}

@media screen and (max-width: 367px) {  
     
    .video{ margin: 0 20px;}
    .VideoPlayer::before {  height: 100px; }
    .video a::before{ width: 50px; height: 50px; background-size: 50px 50px; top: 41%; left: 41%;}
    
    .vdslideIn a span{top: 38%;}
    .photoSlderContainer{padding-bottom: 310px;}
    .photoSlderContainer .swiper-button-next, .photoSlderContainer .swiper-rtl .swiper-button-prev, .photoSlderContainer .swiper-button-next.swiper-button-disabled, .photoSlderContainer .swiper-button-prev.swiper-button-disabled, .photoSlderContainer .swiper-button-prev, .photoSlderContainer .swiper-rtl .swiper-button-next{top: 48%;}
    .photoSlider{margin-top: -54px;}
    
}