html {
  scroll-behavior: smooth;
}

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: Arial, Helvetica, sans-serif;
} 

.clear40 {
  clear: both;
  height: 40px;
}
.clear80 {
  clear: both;
  height: 80px;
}
h1 {
font-size:30px;
font-weight:600;
text-align:center;
margin:15px auto 5px auto;
color: #ff0000;
}
h2 {
font-size:20px;
font-weight:400;
text-align:center;
margin:5px auto 10px auto;
color: #0F21AB;
}
p {
  font-size: 18px;
  line-height: 30px;
  color: #333;
  margin-top: 5;
  margin-bottom: 1rem;
  font-family: Arial, Helvetica, sans-serif;
}
.p1 {
  font-size: 18px;
  line-height: 30px;
  color: #333;
  margin-top: 5;
  margin-bottom: 1rem;
  font-family: Arial, Helvetica, sans-serif;
}
.p2 {
  font-size: 20px;
  line-height: 40px;
  font-weight: 300;
  color: #333;
  margin-top: 10;
  font-family: Arial, Helvetica, sans-serif;
}
a { text-decoration: none; }

.img {
  width: 100%;
}
.img img {
  width: 100%;
  overflow: hidden;
}

.youtube {
  width: 100%;
  margin-top: 50px;
}
.youtube iframe {
  width: 100%;
  min-height: 500px;
}


#pagelayout {
  width: 100%;
  padding:4% 4%;
}
#pagelayout .pagelayout-in {
  width: 90%;
  margin: 0px auto;
 
}
#pagelayout .container {
  width: 90%;
  margin: 0px auto;
}

.bhaarata-tr04 {
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: 23% 23% 23% 23% ;
  gap: 2%; 
  margin: 0px 0px 20px 0px;
}

.ninadam {
  font-size: 20px;
  color: #0F21AB;
}

@media (min-width: 481px) and (max-width: 768px) {

  .bhaarata-tr04 {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 48% 48% ;
    gap: 2%;
}
}

/*Bharata Nav Start */
  #bhaarata-nav {
    width: 100%;
    color: #fff;
    padding: 0px;
    position: fixed;
    top: 0;
    border-top: solid 15px #FF5D31;
    z-index: 99;
  }
  
  #bhaarata-nav #logo {
    font-size:36px;
    margin-top: -20px;
    z-index: 99999;
    width: 236px;
    height: 100px;
  }
  #bhaarata-nav #logo img {
    font-size:36px;
    margin-top: -2px;
    z-index: 99999;
    width: 236px;
    height: 100px;
  }
  /*Bhaarata Nav END */

  
/*SIDE NAV START */
.sidenav-wrapper{
    height: 100%;
    width: 350px;
    position: relative;
    z-index: 99;
  }
  .sidenav-wrapper .search-part {
      width: 100%;
      margin-bottom: 15px;
  }
  .sidenav-wrapper .search-part input, select, button {
      width: 94%;
      margin: 2px 3% 2px 3%;
      padding: 8px 5px;
  }
  .sidenav-wrapper .search-part input {
    width: 94%;
    margin: 2px 3% 2px 3%;
    padding: 8px 5px;
    border-radius: 0px;
  }
  .sidenav-wrapper .search-part select {
    width: 93.6%;
    margin: 2px 3% 2px 3%;
    padding: 8px 5px;
    border-radius: 0px;
  }
  .sidenav-wrapper .search-part button {
    width: 94%;
    margin: 2px 3% 2px 3%;
    padding: 8px 5px;
    border-radius: 0px;
  }
  .sidenav-wrapper .menu-btn {
    position: fixed;
    right: 26px;
    top: 20px;
    background-color: #FF5D31;
    color: #303030;
    height: 50px;
    width: 60px;
    z-index: 999;
    border: 2px solid #fff;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
  }
  #btn:checked ~ .menu-btn{
    right: 300px;
  }
  .sidenav-wrapper .menu-btn i{
    position: absolute;
    font-size: 23px;
    transition: all 0.3s ease;
  }
  .sidenav-wrapper .menu-btn i.fa-times{
    opacity: 0;
  }
  #btn:checked ~ .menu-btn i.fa-times{
    opacity: 1;
    transform: rotate(-180deg);
  }
  #btn:checked ~ .menu-btn i.fa-bars{
    opacity: 0;
    transform: rotate(180deg);
  }
  
  #sidebar{
    position: fixed;
    background: #FF5D31;
    top: 0;
    height: 100%;
    width: 320px;
    overflow: hidden;
    right: -350px;
    transition: all 0.3s ease;
    z-index: 99;
  }
  
  #btn:checked ~ #sidebar{
    right: 0;
  }
  
  #sidebar .title{
    line-height: 75px;
    text-align: center;
    vertical-align: middle;
    background: #FF5D31;
    font-size: 25px;
    font-weight: 600;
    color: #FFFF00;
    border-bottom: 1px solid #ff0000;
  }
  #sidebar .title a {
    color: #FFFF00;
    text-decoration: none;
  }
  
  #sidebar .list-items{
    position: relative;
    background: #FF7A31;
    width: 100%;
    height: 100%;
    list-style: none;
    left:0;

  }
  
  #sidebar .list-items li{
      line-height: 50px;
    border-top: 1px solid rgba(255,255,255,0.1);
    border-bottom: 1px solid #ff0000;
    transition: all 0.3s ease;
    padding: 0px 10px;
  }
  
  #sidebar .list-items li:hover{
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    box-shadow: 0 0px 10px 3px #ff0000;
  }
  
  #sidebar .list-items li:first-child{
    border-top: none;
  }
  
  #sidebar .list-items li a{
    color: #f2f2f2;
    text-decoration: none;
    font-size: 18px;
    font-weight: 500;
    width: 100%;
    display: block;
  }
  #sidebar .list-items li a i{
    margin-right: 20px;
  }
  #sidebar .list-items li ul {
      width: 100%;
      display:flex;
      border-top: solid 1px #fff;
  }
  #sidebar .list-items li ul li {
      display: block;
      width: 30px; 
      height: 30px;
      margin: 10px;
  }
  #sidebar .list-items li ul li a {
      color: fff;
  }
  #sidebar .list-items .icons{
    width: 100%;
    height: 40px;
    text-align: center;
    position: absolute;
    top: 300px;
    line-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
   
  
  }
  #sidebar .list-items .icons a{
    height: 100%;
    width: 40px;
    display: block;
    margin: 0 5px;
    font-size: 18px;
    color: #f2f2f2;
    background: #4a4a4a;
    border-radius: 5px;
    border: 1px solid #383838;
    transition: all 0.3s ease;
  }
  #sidebar .list-items .icons a:hover{
    background: #404040;
  }
  .list-items .icons a:first-child{
    margin-left: 0px;
  } 
  /*Side Nav End*/
  

/*PURE CSS SLIDE 002 START */





/*CARD STYLE START */


.card03 {
  position: relative;
  display: block;
  margin-bottom: 30px;
}

.card03-img {
  position: relative;
  display: block;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  overflow: hidden;
  z-index: 1;
}

.card03-img:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  content: "";
  background-color: rgba(var(--insur-black-rgb), .30);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  transition: all 500ms ease;
  transform: translate3d(0px, -100%, 0px);
  z-index: 1;
}

.card03:hover .card03-img:before {
  transform: translate3d(0px, 0, 0px);
}

.card03-img img {
  width: 100%;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}

.card03:hover .card03-img img {
  transform: scale(1.05);
}

.card03-content {
  position: relative;
  display: block;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.07);
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding:15px 10px 10px 10px;
}

.card03-icon {
  position: absolute;
  top: -40px;
  right: 20px;
  height: 60px;
  width: 60px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.05);
  border-radius: var(--insur-bdr-radius);
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
  z-index: 3;
}

.card03:hover .card03-icon {
  background-color: var(--insur-base);
}

.card03-icon span {
  position: relative;
  display: inline-block;
  font-size: 36px;
  color: var(--insur-base);
  transition: all 500ms linear;
  transition-delay: 0.1s;
  transform: scale(1);
}

.card03:hover .card03-icon span {
  color: var(--insur-white);
  transform: scale(0.9);
}

.card03-title {
  position: relative;
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: var(--insur-letter-spacing);
  margin-bottom: 5px;
  color:#ff0000;
}

.card03-title:before {
  position: absolute;
  content: "";
  left: 0;
  top: -10px;
  height: 4px;
  width: 40px;
  background-image: -moz-linear-gradient(0deg, rgb(255, 0, 0) 0%, rgb(255, 2255, 0) 100%);
  background-image: -webkit-linear-gradient(0deg, rgb(255, 0, 0) 0%, rgb(255, 2255, 0) 100%);
  background-image: -ms-linear-gradient(0deg, rgb(255, 0, 0) 0%, rgb(255, 2255, 0) 100%);
}

.card03-title a {
  color: var(--insur-black);
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}

.card03:hover .card03-title a {
  color: var(--insur-base);
}

.card03-text {
  font-size: 14px;
  letter-spacing: var(--insur-letter-spacing);
  line-height: 24px;
}




/*CARD STYLE END */
 

/*POPUP CODE START */

.popupmodal01-wrapper {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  visibility: hidden;
  opacity: 0;
  transition: opacity .2s ease-in-out, visibility 0s .2s;
  z-index: 9999;
}

.popupmodal01-container {
  position: relative;
  margin: 1px 1px 1px 1%;
  color: #303030;
  background: #fff;
  border-radius: 4px;
  text-align: left;
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 90vh;
  width: 98%;
  box-sizing: border-box;
  transform: translateY(30%);
  transition: all .28s ease-in-out .15s;
  z-index: 999;
}
.popupmodal01-container p {
    line-height:30px;
    margin-bottom: 20px;
}
.popupmodal01-container h5 {
    font-size: 20px;
    margin-bottom: 20px;
    text-align: center;
}
.popupmodal01-container p br {
    margin-bottom:10px;
}

 
.popupmodal01-btn {
  display: inline-block;
  color: #2879FF;
  transition: all .2s ease-in-out;
  padding: 10px;
}

.popupmodal01-btn { 
  cursor: pointer;
  user-select: none;
}

 
.popupmodal01-btn-close {
  text-align: center;
  cursor: pointer;
  user-select: none;
}


.popupmodal01-btn-close {
  position: absolute;
  top: 2%;
  right: 2%;
  color: #fff;
  font-size: 50px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 8%;
  transition: background-color .2s ease-in-out;
  background-color: #FF1800;
  z-index: 9999;
 


}

.popupmodal01-btn-close:hover {
  background-color: #FFAAA1;
}

.popupmodal01-btn:hover,
.popupmodal01-btn:active,
.popupmodal01-btn:focus {
  color: #0055E2;
}

.popupmodal01-btn:active:hover,
.popupmodal01-btn:active:focus {
  color: #000;
}

.popupmodal01-container::-webkit-scrollbar-track  {
  border-radius: 10px;
}

.popupmodal01-container::-webkit-scrollbar {
  width: 8px;
  border-radius: 10px;
  background-color: hsla(0, 0%, 100%, .1);
}

.popupmodal01-container::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: hsla(0, 0%, 100%, .5);
}
@media only screen and (min-width: 768x) {
  .popupmodal01-container {
    width: 98%;
    margin: 1%;
    
  }
}
/*
@media only screen and (min-width: 576px) {
  .popupmodal01-container {
    width: 90%;
    float: left;


  }
}
*/
.popupmodal01-wrapper button,
.popupmodal01-wrapper input {
  font-family: inherit;
}

.email-field input {
  display: block;
  width: 100%;
  outline: none;
}

form > div {
  position: relative;
  margin: 30px 0 15px;
  display: flex;
}

.overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #0B0633;
  cursor: pointer;
  opacity: .9;
}

.switcher {
  display: none;
}

.switcher:checked+.popupmodal01-wrapper {
  transition: visibility 0s, opacity .2s ease-in-out;
  visibility: visible;
  opacity: 1;
}

.switcher:checked+.popupmodal01-wrapper .popupmodal01-container {
  transform: translateY(0);
  opacity: 1;
}

@media only screen and (min-width: 320px) {
  .popupmodal01-wrapper .popupmodal01-container {
    padding: 10px;
  }
}

@media only screen and (min-width: 576px) {
  .popupmodal01-wrapper .popupmodal01-container {
    padding: 10px;
  }
}

@media only screen and (max-width: 576px) {
  .popupmodal01-wrapper .popupmodal01-container {
    max-width: 100vw;
  }
}

/*POPUP CODE END*/ 
  

.center {
    text-align: center;
}

.subtitle-01 {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 22px;
    margin: 40px 0 10px 20px;
    display: inline-block;
    position: relative;
   
    color: #E81300;
  }
  
  .subtitle-01:before {
    content: "";
    width: 25px;
    position: absolute;
    background: #E81300;
    height: 3px;
    left: -35px;
    top: 50%;
    transform: translateY(-50%);
  }
  
  .subtitle-01:before {
    content: "";
    width: 25px;
    position: absolute;
    background: #E81300;
    height: 3px;
    left: -35px;
    top: 50%;
    transform: translateY(-50%);
  }

  

.songs-list {
    width: 100%;
}
.songs-list li {
  margin: 0px 0px 0px 20px;
    list-style: decimal;
    line-height: 50px;
    border-bottom: solid 1px #e7e7e7;
    
}



/*quotation start*/
.quotation {
    width: 100%;
    padding: 2% 4%;
    background-color: #f2f2f2;
    border-bottom: solid 2px #e7e7e7;
    }
     
    /*quotation end*/

    
/*quotation start*/
.quotation-home {
  width: 100%;
  padding: 2% 4%;
  background-color: #f2f2f2;
  border-bottom: solid 2px #e7e7e7;
  border-top: solid 2px #e7e7e7;
  }
  .quotation-home h1 {
    font-size: 26px;
    line-height: 40px;
    font-weight: 500;
  }
   
  /*quotation end*/

  

    

.bhagavadgita-questions-list {
  width: 100%;
}

.bhagavadgita-questions-list li {
  list-style:decimal; 
  display:inline-block;
  margin: 10px 5px 10px 5px;
  line-height: 20px;
  width: 100%;
}
.bhagavadgita-questions-list li p {
  width: 100%;
  margin: 5px 0px 5px 0px;
}
.bhagavadgita-questions-list li .question {
  width: 100%;
  color: #ff1b00;
}
.bhagavadgita-questions-list li .answer {
  width: 100%;
  color: #0B0633;
}


.bhagavadgita-parayanam {
  width: 94%;
  padding: 3%;
}
.bhagavadgita-parayanam .chapter-title {
  font-size: 20px;
  font-weight: 800;
  margin: 40px 0px;
 
}
.bhagavadgita-parayanam .uvacha  {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
}

.bhagavadgita-parayanam .sloka1 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 30px;
  line-height: 36px;
}

.bhagavadgita-parayanam ul  {
  margin: 0px;
 }
.bhagavadgita-parayanam ul li {
 list-style: decimal;
}

/* footer code start */


.bhaarata-footer {
  clear:both;
  width:100%;
  height: fit-content;
  background:#ff0000;
  color:#fff;

}
.bhaarata-footer .bhaarata-footer-in {
  width:100%;
  padding:2% 8%;
}
.bhaarata-footer .bhaarata-footer-in  .footer-tr02 { 
  clear: both; 
  width: 100%;  
  margin: 5px auto;   
  display: grid; 
  grid-template-rows: auto; 
  grid-template-columns: 48% 48%; gap: 2%;    }
  .bhaarata-footer .bhaarata-footer-in  .footer-tr02 .footer-left { width: 100%;    padding: 1%; }
  .bhaarata-footer .bhaarata-footer-in  .footer-tr02 .footer-right { width: 100%;    padding: 1%; }
  .bhaarata-footer .bhaarata-footer-in  .footer-tr02 .footer-right .footerright-tr02 {
display: grid; 
grid-template-rows: auto; 
grid-template-columns: 48% 48%; gap: 2%;
}
.bhaarata-footer .bhaarata-footer-in  ul {
  margin:0px;
  padding:0px
}
.bhaarata-footer .bhaarata-footer-in  ul li {
  list-style:none;
  line-height:30px;
}
.bhaarata-footer .bhaarata-footer-in  ul li a {
  text-decoration:none;
  color:#fff;
  font-size:16px;
  font-weight: 300;
}
.bhaarata-footer .bhaarata-footer-in  .socialmedia-links {
width: 100%;
}
.bhaarata-footer .bhaarata-footer-in  .socialmedia-links li {
list-style: none;
display: inline;
margin: 4px 6px;
}
.bhaarata-footer .bhaarata-footer-in  .socialmedia-links li img {
width: 50px;
height: 50px;
}
.bhaarata-footer .bhaarata-footer-in  h4 {
  line-height:40px;
  font-size:20px;
  font-weight:500;
  color: #ffff00;
}
.bhaarata-footer .bhaarata-footer-in  p {
font-size: 16px;
font-weight: 300;
line-height: 26px;
}
.bhaarata-footer-copyrights {
  clear: both;
  padding: 20px auto;
  text-align: center;
  background: #E81300;
  color:#FFB6B0;
  font-size: 12px;
  line-height: 40px;
}



/*footer code end */





/* ////////////////////////////////////// HOME PAGE START */
/*Only CSS Slide Start */
#css-slide {
  overflow: hidden;
  position:relative;
  width: 100%;
  overflow: hidden;
  margin: 0px;
  /*
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  */
}

@media (max-width: 480px) {
  .youtube iframe {
    width: 100%;
    min-height: 280px;
  }

  
  #bhaarata-nav #logo {
    margin-top: -16px;
    width:141px;
    height: 60px;
    margin-left: 4px;
  }
  #bhaarata-nav #logo img {
    width:141px;
    height: 60px;
  }
  #bhaarata-nav #logo img .img {
    width:141px;
    height: 60px;
  }

  #css-slide {
    margin-top: 40px;
   }
}
#css-slide figure{
  width: 400%;
  position: relative;
  margin: 0;
  animation: purecss-slider-02 20s linear infinite;
  overflow: hidden;
}
.bhaarata-footer .bhaarata-footer-in  .socialmedia-links li img {
  width: 40px;
  height: 40px;
  }
/* 20s ->100%
4s ->20%
1s ->5% */
@keyframes purecss-slider-02 {
  0%{
      left: 0;
  }
  20%{
      left: 0;
  }
  25%{
      left: -100%;
  }
  45%{
      left: -100%;
  }
  50%{
      left: -200%;
  }
  70%{
      left: -200%;
  }
  75%{
      left: -300%;
  }
  95%{
      left: -300%;
  }
  100%{
      left: 0;
  }
}
/* width 100% */
#css-slide figure img{
  width: 25%;
  float: left;
}

/*Only CSS Slide End */





/* ////////////////////////////////////// HOME PAGE END  */






@media (max-width: 480px) {

  .bhaarata-footer .bhaarata-footer-in .footer-tr02 {
    clear: both;
    width: 100%;
    margin: 5px auto;
    display: grid;
    grid-template-rows: auto;
    grid-template-columns:100%;
    gap: 0%;
}
  
  .mobile-clear50 {
    clear: both; height: 50px;
  }
  .bhaarata-tr04 {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 100% ;
    gap: 0%;
}
  #css-slide {
    margin-top: 40px;
   }

     
/*quotation start*/
.quotation-home {
padding: 1% 2%;
}
  .quotation-home h1 {
    font-size: 20px;
    }
    .quotation-home h2 {
      font-size: 18px;
      }

   .quotation {
    padding-top: 50px;
  }

   .quotation h1 {
    font-size: 20px;
    }

    
   .quotation h2 {
    font-size: 18px;
    }

    .sidenav-wrapper .menu-btn { 
      right: 18px;
      top: 16px;
       height: 45px;
      width: 55px;
       border: 2px solid #fff;
      border-radius: 4px;
      
  }

  .youtube iframe {
    width: 100%;
    min-height: 320px;
  }
}



/*CONTACT PAGE */
