/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  h1{font-size: 25px;}
  .title h3{font-size: 20px;}
  .title h4{font-size: 18px;}
  h3{font-size: 20px;}
  .double-title h3, .double-title h4{font-size: 16px;}
  .title .icon{width: 40px; height: 45px; margin-right: 5px;}
  .title .icon-2{width: 50px; height: 50px;}

  .topspace{margin-top: 10px;}

  .mr-shlok blockquote{font-size: 12px; font-weight: 700; line-height: 20px; padding: 10px;}
  .mr-shlok .start{height: 100px; width: auto;}
  .mr-shlok .end{height: 100px; width:auto; }
  .en-shlok img{width: 95%;}
  .en-shlok blockquote{font-size: 12px; line-height: 20px; padding: 10px;}
  .en-shlok .start{width: 15px; height: 15px;}
  .en-shlok .end{width: 15px; height: 15px;}

  .loading{left: 0; right: 0; }
  .side-space{padding: 0px 8px;}
  .news-side-space{padding: 0px 8px;}
  .coverpg{left: 0; right: 0;}
  .newspg{left: 0; right: 0;}

  .text-box{padding: 10px;}
  .text-box-padding{ max-height: 350px;}

  .tl .col-7{display: none;}
  .tl .col-5{flex: 100%; max-width: 100%; padding: 5px;}
  .tl .box{ padding: 20px 10px; min-height: 450px; }
  .tl .box .logo{width: 75%}
  .sl .btn img{width: 18px;}
  .sl .btn{ padding: 5px; font-size: 14px; }

  header{ padding-top: 5%; margin-bottom: 15px; }
  .title{position: relative;}
  .logo{ float: right; width: 50%; text-align: center;}

  .navigation button, .navigation1 button{font-size: 10px; width: max-content; padding: 5px 4px;}
  .navigation1 button img, .navigation button img{width: 18px;} 
  .navigation button:nth-child(1), .navigation button:nth-child(2){margin-right: 3px;}

  #timeline .row{margin-right: -5px; margin-left: -5px;}
  #timeline .col-4{max-width: 50%; flex: 50%; padding: 5px; margin: 0px;}
  #timeline .box{height: 120px;padding: 5px 5px; width: 100%;}
  #timeline .box img{height: 40px; width: 40px;}
  #timeline .box img{margin-bottom: 10px;}
  #timeline .box h4 {font-size: 11px;margin-bottom: 5px;}
  #timeline .box h3 {font-size: 12px;}

  .tweedeck{width: 100%; margin-top: -10px;}
  .ak{width: 100%; margin-top: -50px;}

  .protagonist-shlok{top: 15%;}
  .protagonist-shlok .profile img{width: 120px; height: 120px; margin-top: 0px; border:2px solid #8a7a5d;}
  .protagonist-shlok .col-8{padding: 0px 5px;}
  .protagonist-shlok .col-8, .protagonist-shlok .col-4, .animation-profile .col-6{max-width: 100%; flex: 100%;}
  .mr-shlok img:nth-child(2){width: 90%; margin-top: -20px !important;}
  .row{margin-right: 0px;margin-left: 0px;}
  .animation-profile{display: block; text-align: center;}
  .animation-profile .profile{text-align: center;}
  .animation-profile .profile img{width: 200px; height: 200px; text-align: center;}
  .animation-profile .info{margin-top: 20px;padding-left: 10px;}
  .animation-profile .icon{width: 40px; height: 50px; margin-bottom: 0px;}
  .animation-profile h2{font-size: 23px; margin-bottom: 0px;}

  .being .col-4{max-width: 50%; flex: 50%; padding: 0px 6px;}
  .being .box{padding: 10px; margin-bottom: 10px;}
  .being .box h4{font-size: 12px;}

  .being-table .box{height: 110px;}

  .being-shlok{margin-top: 0px;}
  .being-shlok .icons{width: 80px;}
  .being-basket .col-4{max-width: 50%; flex: 50%; padding: 10px 6px;}
  .being-basket .box{height: 150px; padding: 10px 5px; margin-bottom: 0px;}
  .being-basket .box h4{font-size: 16px;}
  .being-basket .icons{width: 65px; margin-top: 0px;}

  .supersix-parameter li {font-size: 15px;}
  .supersix-parameter li:first-child { font-size: 18px; }
  .wrap-2, .wrap{width: 100%;}
  .being-essence .col-8,.being-essence .col-4{flex: 100%; max-width: 100%;}

  .being-super-six .box{height: 100px;}
  .super-six-tweets .tweelink{overflow-wrap: break-word;}
  .super-six-tweets .col-4, .super-six-tweets .col-8{flex: 100%; max-width: 100%; margin-top: 15px; text-align: center;}
  .super-six-tweets .text-box{overflow-y: scroll;}
  .super-six-tweets h4{font-size: 18px;}
  .super-six-tweets h5{font-size: 15px;}

  .row.basketstats .stat_cols {width: 50%; margin-bottom: 15px;}
  .mobiletab{display: none;}

  .postscript .col-4{flex: 100%; max-width: 100%;}
  .postscript .box{padding: 10px 8px; margin-top: 20px;}
  .postscript ul{padding-left: 20px;}

  .navigation{left: 8px; right: 8px; bottom: 0%;}
  section{left: 8px; right: 8px; top: 23%;}
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .mr-shlok blockquote{font-size: 17px; font-weight: 700; line-height: 30px; padding: 10px;}
  .mr-shlok .start{height: 150px; width: auto;}
  .mr-shlok .end{height: 150px; width:auto; }
  .en-shlok img{width: 50%;}
  .en-shlok blockquote{font-size: 17px; line-height: 30px; padding: 10px;}
  .en-shlok .start{width: 15px; height: 15px;}
  .en-shlok .end{width: 15px; height: 15px;}

  .loading{left: 0; right: 0; }
  .side-space{padding: 0px 15px;}
  .news-side-space{padding: 0px 15px;}
  .coverpg{left: 0; right: 0;}
  .newspg{left: 0; right: 0;}

  .tl .box{ padding: 20px 5px; min-height: 450px; }
  .tl .box .logo{width: 75%; float: none;}
  .sl .btn img{width: 18px;}
  .sl .btn{ padding: 3px; font-size: 16px; }

  header{ padding-top: 5%; margin-bottom: 15px; }
  .logo{ float: right; width: 280px; }

  .text-box-padding{ max-height: 400px; }

  .navigation button, .navigation1 button{font-size: 14px;}
  .navigation1 button img, .navigation button img{width: 18px;} 

  #timeline .box{height: 230px;padding: 20px 5px;}
  #timeline .box img{height: 50px; width: 50px;}
  #timeline .box h4 {font-size: 18px;margin-bottom: 5px;}
  #timeline .box h3 {font-size: 20px;}

  .tweedeck{width: 100%; margin-top: -100px;}
  .ak{width: 100%; margin-top: -50px;}

  .protagonist-shlok .profile img{width: 300px; height: 300px;}
  .animation-profile .profile img{width: 300px; height: 300px;}
  .animation-profile .info{margin-top: 100px;padding-left: 10px;}

  .being .box{padding: 15px; margin-bottom: 15px;}
  .being .box h4{font-size: 18px;}

  .being-table .box{height: 150px;}

  .being-basket .box{height: 250px;}
  .being-basket .box h4{font-size: 16px;}

  .supersix-parameter li {font-size: 15px;}
  .supersix-parameter li:first-child { font-size: 18px; }

  .being-super-six .box{height: 200px;}
  
  .super-six-tweets .tweelink{overflow-wrap: break-word;}
  
  .row.basketstats .stat_cols {width: 24.28%;margin-bottom: 20px;}

  .navigation{left: 15px; right: 15px; bottom: 10%;}
  section{left: 15px; right: 15px; top: 25%;}
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .mr-shlok blockquote{font-size: 25px; font-weight: 700; line-height: 50px; padding: 10px;}
  .mr-shlok .start{height: 220px; width: auto;}
  .mr-shlok .end{height: 220px; width:auto; }
  .en-shlok img{width: 50%;}
  .en-shlok blockquote{font-size: 20px; line-height: 30px; padding: 10px;}
  .en-shlok .start{width: 20px; height: 20px;}
  .en-shlok .end{width: 20px; height: 20px;}

  .loading{left: 0; right: 0; }
  .side-space{padding: 0px 15px;}
  .news-side-space{padding: 0px 15px;}
  .coverpg{left: 0; right: 0;}
  .newspg{left: 0; right: 0;}

  .text-box-padding{ max-height: 400px; }

  .tl .box{ padding: 15px; min-height: 500px; }
  .tl .box .logo{width: 100%;}
  .sl .btn img{width: 25px;margin-right: 10px;}
  .sl .btn{ padding: 8px; font-size: 18px; }

  header{ padding-top: 5%; margin-bottom: 15px; }
  .logo{ float: right; width: 350px; }

  .navigation button{font-size: 20px;}
  .navigation1 button img, .navigation button img{width: 25px;} 

  #timeline .box{height: 220px;padding: 20px 5px;}
  #timeline .box img{height: 80px; width: 80px;}
  #timeline .box h4 {font-size: 21px;margin-bottom: 5px;}
  #timeline .box h3 {font-size: 24px;}

  .tweedeck{width: 100%; margin-top: -100px;}
  .ak{width: 100%; margin-top: -50px;}

  .protagonist-shlok .profile img{width: 300px; height: 300px;}
  .animation-profile .profile img{width: 400px; height: 400px;}
  .animation-profile .info{margin-top: 150px;padding-left: 10px;}

  .being .box{padding: 40px 20px;margin-bottom: 15px;}
  .being .box h4{font-size: 23px;}

  .being-table .box{height: 200px;}

  .being-basket .box{height: 250px;}
  .being-basket .box h4{font-size: 20px;}

  .supersix-parameter li {font-size: 18px;}
  .supersix-parameter li:first-child { font-size: 25px; }

  .being-super-six .box{height: 200px;}

  .row.basketstats .stat_cols {width: 14.28%;}
  .mobiletab{display: none;}

  .navigation{left: 15px; right: 15px; bottom: 25%;}
  section{left: 15px; right: 15px; top: 25%; bottom: 0;}
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .mr-shlok blockquote{font-size: 25px; font-weight: 700; line-height: 50px; padding: 10px;}
  .en-shlok img{width: 50%;}

  .animation-div-tweedeck{position: absolute;left: 8%;right: 8%;margin: auto;height: 500px;}

  .being3 .mr-shlok .start{height: 220px; margin-top: 80px;}
  .being3 .mr-shlok .end{height: 220px; margin-top: 80px;}

  .being6 .mr-shlok .start{height: 220px; margin-top: 100px;}
  .being6 .mr-shlok .end{height: 220px; margin-top: 100px;}

  .being1 .mr-shlok .start{height: 220px; margin-top: 80px;}
  .being1 .mr-shlok .end{height: 220px; margin-top: 80px;}

  .being2 .mr-shlok .start{height: 240px; margin-top: 60px;}
  .being2 .mr-shlok .end{height: 240px; margin-top: 60px;}

  .being5 .mr-shlok .start{height: 220px; margin-top: 80px;}
  .being5 .mr-shlok .end{height: 220px; margin-top: 80px;}

  .being4 .mr-shlok .start{height: 230px; margin-top: 40px;}
  .being4 .mr-shlok .end{height: 230px; margin-top: 40px;}

  .mr-shlok .start{height: 220px; width: auto;}
  .mr-shlok .end{height: 220px; width:auto; }
  .en-shlok blockquote{font-size: 20px; line-height: 30px; padding: 10px;}
  .en-shlok .start{width: 20px; height: 20px;}
  .en-shlok .end{width: 20px; height: 20px;}

  .loading{left: 6%; right: 6%; }
  .side-space { margin: 0px 6%; padding: 0px 8%; }
  .news-side-space { margin: 0px 6%; padding: 0px 2% 0px 5%; }
  .coverpg{left: 6%; right: 6%;}
  .newspg{left: 6%; right: 6%;}

  .text-box-padding{ max-height: 380px; }

  .tl .box{ padding: 30px 30px; min-height: 550px; }
  .tl .box .logo{width: 100%;}
  .sl .btn img{ width: 25px;margin-right: 10px;}
  .sl .btn{ padding: 8px; font-size: 18px; }

  header{ padding-top: 3%; margin-bottom: 0px;  }
  .logo{ float: right; width: 300px; }

  .navigation button, .navigation1 button{font-size: 15px;}
  .navigation1 button img, .navigation button img{width: 25px;} 

  #timeline .box{height: 180px;padding: 20px 5px;}
  #timeline .box img{height: 60px; width: 60px;}
  #timeline .box h4 {font-size: 19px;margin-bottom: 5px;}
  #timeline .box h3 {font-size: 20px;}

  .tweedeck{width: 100%; margin-top: -100px;}
  .ak{width: 100%; margin-top: -80px;}

  .protagonist-shlok .profile img{width: 300px; height: 300px;}
  .animation-profile .profile img{width: 400px; height: 400px;}
  .animation-profile .info{margin-top: 150px;padding-left: 50px;}

  .being .box{padding: 40px 20px;margin-bottom: 15px;}
  .being .box h4{font-size: 23px;}

  .being-table .box{height: 180px;}

  .being-basket .box{height: 250px;}
  .being-shlok .icons{width: 100px;}
  .being-basket .box h4{font-size: 23px;}

  .supersix-parameter li {font-size: 18px;}
  .supersix-parameter li:first-child { font-size: 25px; }

  .being-super-six .box{height: 180px;}

  .row.basketstats .stat_cols {width: 14.28%;}
  .mobiletab{display: none;}

  .being-sub-baskets .being-basket{top: 42%;}
  .navigation{left: 9%; right: 9%; bottom: 0;}
  section{left: 9%; right: 9%; top: 25%; bottom: 0;}
  .super-six-tweets .text-box{padding: 0px 15px;}
  .super-six-tweets .text-box img{ width: 90% !important;}
  .super-six-tweets p{margin-bottom: 0px;}
  .row.basketstats .stat_cols .stat_box h3{font-size: 13px;}
}


/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1400px) {
    
    .newsbganim p{font-size: 17px;}
  .mr-shlok blockquote{font-size: 25px; font-weight: 700; line-height: 50px; padding: 10px;}
  .en-shlok img{width: 50%;}

  .animation-div-tweedeck{position: absolute;left: 8%;right: 8%;margin: auto;height: 500px;}

  .being3 .mr-shlok .start{height: 220px; margin-top: 80px;}
  .being3 .mr-shlok .end{height: 220px; margin-top: 80px;}

  .being6 .mr-shlok .start{height: 220px; margin-top: 100px;}
  .being6 .mr-shlok .end{height: 220px; margin-top: 100px;}

  .being1 .mr-shlok .start{height: 220px; margin-top: 80px;}
  .being1 .mr-shlok .end{height: 220px; margin-top: 80px;}

  .being2 .mr-shlok .start{height: 240px; margin-top: 60px;}
  .being2 .mr-shlok .end{height: 240px; margin-top: 60px;}

  .being5 .mr-shlok .start{height: 220px; margin-top: 80px;}
  .being5 .mr-shlok .end{height: 220px; margin-top: 80px;}

  .being4 .mr-shlok .start{height: 220px; margin-top: 40px;}
  .being4 .mr-shlok .end{height: 220px; margin-top: 40px;}

  .mr-shlok .start{height: 220px; width: auto;}
  .mr-shlok .end{height: 220px; width:auto; }
  .en-shlok blockquote{font-size: 20px; line-height: 30px; padding: 10px;}
  .en-shlok .start{width: 20px; height: 20px;}
  .en-shlok .end{width: 20px; height: 20px;}

  .loading{left: 6%; right: 6%; }
  .side-space { margin: 0px 6%; padding: 0px 8%; }
  .news-side-space { margin: 0px 6%; padding: 0px 2% 0px 5%; }
  .coverpg{left: 6%; right: 6%;}
  .newspg{left: 6%; right: 6%;}

  .text-box-padding{ max-height: 400px; }

  .tl .box{ padding: 30px 30px; min-height: 550px; }
  .tl .box .logo{width: 100%;}
  .sl .btn img{ width: 25px;margin-right: 10px;}
  .sl .btn{ padding: 8px; font-size: 18px; }

  header{ padding-top: 5%; margin-bottom: 0px;  }
  .logo{ float: right; width: 350px; }

  .navigation button, .navigation1 button{font-size: 20px;}
  .navigation1 button img, .navigation button img{width: 25px;} 

  #timeline .box{height: 200px;padding: 20px 5px;}
  #timeline .box img{height: 80px; width: 80px;}
  #timeline .box h4 {font-size: 21px;margin-bottom: 5px;}
  #timeline .box h3 {font-size: 24px;}

  .tweedeck{width: 100%; margin-top: -100px;}
  .ak{width: 100%; margin-top: -80px;}

  .protagonist-shlok .profile img{width: 350px; height: 350px;}
  .animation-profile .profile img{width: 400px; height: 400px;}
  .animation-profile .info{margin-top: 150px;padding-left: 50px;}

  .being .box{padding: 40px 20px;margin-bottom: 15px;}
  .being .box h4{font-size: 23px;}

  .being-table .box{height: 200px;}

  .being-basket .box{height: 250px;}
  .being-basket .box h4{font-size: 23px;}

  .supersix-parameter li {font-size: 18px;}
  .supersix-parameter li:first-child { font-size: 25px; }

  .being-super-six .box{height: 200px;}

  .row.basketstats .stat_cols {width: 14.28%;}
  .mobiletab{display: none;}

  .being-sub-baskets .being-basket{top: 42%;}
  .navigation{left: 9%; right: 9%; bottom: 0;}
  section{left: 9%; right: 9%; top: 27%; bottom: 0;}

  .super-six-tweets .text-box{padding: 0px 20px;}
  .super-six-tweets .text-box img{
    width: 90%;
  }
  .row.basketstats .stat_cols .stat_box h3{font-size: 15px}
}



/* Extra large devices (large laptops and desktops, 1200px and up) */