@import url('https://fonts.googleapis.com/css2?family=Cedarville+Cursive&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');
.navbar{
    padding: 0px !important;
    box-shadow: 2px 2px 10px black;
    position: sticky;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 5;
}
.navbar-brand img{
    height: 65px;
}
#owl-carousel .owl-item img{
    /* height: 600px; */
}
#owl-carousel2 .owl-item img{
    height: auto;
}
.owl-dots{
    position: absolute;
    left: 50%;
    bottom: 0px;
    transform: translate(-50%, 0%);
}
.cursive{
    font-family: cursive;
    font-weight: 900;
}
.box_shadow{
    box-shadow: 2px 3px 5px;
}
.radius_20{
    border-radius: 20px;
}
.radius_60{
    border-radius: 60px;
}
.W_60{
  width: 60%;
}
.two_column{
  grid-template-columns: auto auto;
}
.text-nowrap{
  text-wrap: nowrap;
}
.border-bottom{
  width: fit-content;
  border-bottom: 5px solid #afa2a2 !important;
  padding-bottom: 10px;
  position: relative;
  z-index: 2;
  transition: all 0.5s;
  animation: animate_border_bottom;
  animation-fill-mode: backwards;
  animation-iteration-count: infinite;
  animation-direction: alternate-reverse;
  animation-duration: 1s;
}
@keyframes animate_border_bottom {
  0%{
    transform: translateX(0px);
  }
  100%{
    transform: translateX(145px);
  }
  
}
.thoda_hr{
  position: relative;
  width: 100%;
  width: 350px;
  top: -19px;
  height: 0px;
  border-top: 2px solid #bb5555;
}
.director_image_outer{
  width: 100%;
  overflow: hidden;    
  border: 20px solid #362d87;
  box-shadow: 6px 5px 2px #8f7b7b;
  border-top-color: #5447c3;
  border-bottom-color: #5447c3;
  
  border: 20px solid #d3d3d3;
  box-shadow: 6px 5px 2px #8f7b7b;
  border-top-color: #c3c2c2;
  border-bottom-color: #c3c2c2;
}
.pr-5{
  padding-right: 3rem !important;
}
.font_20 li{
  font-size: 20px;
}
h1,h3{
  color: #867c7c;
  font-family: "Poppins", sans-serif;
}



/* button start  */
.button_ {
    --black-700: hsla(0 0% 12% / 1);
    --border_radius: 9999px;
    --transtion: 0.3s ease-in-out;
    --offset: 2px;
  
    cursor: pointer;
    position: relative;
  
    display: flex;
    align-items: center;
    gap: 0.5rem;
  
    transform-origin: center;
  
    padding: 9px 13px;
    background-color: transparent;
  
    border: none;
    border-radius: var(--border_radius);
    transform: scale(calc(1 + (var(--active, 0) * 0.1)));
  
    transition: transform var(--transtion);
  }
  
  .button_::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  
    width: 100%;
    height: 100%;
    background-color: var(--black-700);
    background: linear-gradient(45deg, black, #ff0000);
  
    border-radius: var(--border_radius);
    box-shadow: inset 0 0.5px hsl(0, 0%, 100%), inset 0 -1px 2px 0 hsl(0, 0%, 0%),
      0px 4px 10px -4px hsla(0 0% 0% / calc(1 - var(--active, 0))),
      0 0 0 calc(var(--active, 0) * 0.375rem) hsl(260 97% 50% / 0.75);
  
    transition: all var(--transtion);
    z-index: 0;
  }
  
  .button_::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  
    width: 100%;
    height: 100%;
    background-color: hsla(260 97% 61% / 0.75);
    background-image: radial-gradient(
        at 51% 89%,
        hsla(266, 45%, 74%, 1) 0px,
        transparent 50%
      ),
      radial-gradient(at 100% 100%, hsla(266, 36%, 60%, 1) 0px, transparent 50%),
      radial-gradient(at 22% 91%, hsla(266, 36%, 60%, 1) 0px, transparent 50%);
    background-position: top;
  
    opacity: var(--active, 0);
    border-radius: var(--border_radius);
    transition: opacity var(--transtion);
    z-index: 2;
  }
  
  .button_:is(:hover, :focus-visible) {
    --active: 1;
  }
  .button_:active {
    transform: scale(1);
  }
  
  .button_ .dots_border {
    --size_border: calc(100% + 2px);
  
    overflow: hidden;
  
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  
    width: var(--size_border);
    height: var(--size_border);
    background-color: transparent;
  
    border-radius: var(--border_radius);
    z-index: -10;
  }
  
  .button_.motion_{
    --active: 1;
    transform: scale(1);
    animation: path 1.5s linear 0.5s infinite;
  }
  .button_.motion_ .sparkle .path{
      animation: path 0.4s linear 0.1s infinite;
  }
  
  .button_ .dots_border::before {
    content: "";
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    transform-origin: left;
    transform: rotate(0deg);
  
    width: 100%;
    height: 2rem;
    background-color: white;
  
    mask: linear-gradient(transparent 0%, white 120%);
    animation: rotate 2s linear infinite;
  }
  .nav-link{
    transition: all 0.3s;
    margin: 0px 5px;
    color: #4e4e4e;
    font-weight: bold;
    font-family: math;
    font-size: 18px;
  }
  .nav-link.active{
    border-radius: 8px;
    color: white !important;
    padding: 5px 10px;
    background-color: var(--black-700);
    background: linear-gradient(45deg, #362d87, #e3181d);
  }
  .nav-link:hover{
    border-radius: 8px;
    color: white;
    padding: 5px 20px !important;
    background-color: var(--black-700);
    background: linear-gradient(45deg, #362d87, #e3181d);
  }
  .navbar-nav{
    display: flex;
    align-items: center;
  }

  
  @keyframes rotate {
    to {
      transform: rotate(360deg);
    }
  }
  
  .button_ .sparkle {
    position: relative;
    z-index: 10;
  
    width: 1.75rem;
  }
  
  .button_ .sparkle .path {
    fill: currentColor;
    stroke: currentColor;
    transform-origin: center;
    color: hsl(0, 0%, 100%);
  }
  
  .button_:is(:hover, :focus) .sparkle .path {
    animation: path 1.5s linear 0.5s infinite;
  }
  .button_ .sparkle .path:nth-child(1) {
    --scale_path_1: 1.2;
  }
  .button_ .sparkle .path:nth-child(2) {
    --scale_path_2: 1.2;
  }
  .button_ .sparkle .path:nth-child(3) {
    --scale_path_3: 1.2;
  }
  @keyframes path {
    0%,
    34%,
    71%,
    100% {
      transform: scale(1);
    }
    17% {
      transform: scale(var(--scale_path_1, 1));
    }
    49% {
      transform: scale(var(--scale_path_2, 1));
    }
    83% {
      transform: scale(var(--scale_path_3, 1));
    }
  }
  .button_ .text_button {
    position: relative;
    z-index: 10;
    background-image: linear-gradient(
      90deg,
      hsla(0 0% 100% / 1) 0%,
      hsla(0 0% 100% / var(--active, 0)) 120%
    );
    background-clip: text;
    font-size: 1rem;
    color: white;
    font-weight:bold;
  }

  /* button end  */
  a{
    text-decoration: none !important;
  }
  .justify{
    text-align: justify;
  }
.box_{    
    box-shadow: 2px 2px 8px black;
    border-radius: 20px;
    padding: 10px;
    background: white;
}
.row{
    --bs-gutter-x: 0rem !important;
}
.sans_serif{
    font-family: sans-serif;
}
.section{
    background: linear-gradient(180deg, #9898fd, #9898fd17);
}
.bold{
    font-weight: 900;
}
.back_image_box{
    border-radius: 20px !important;
    height: 200px;
}
.stream_box{
  width: 360px;
}
.relative{
    position: relative;
}
.front_image{    
    background: white;
    margin: 0px 19px;
    position: absolute;
    top: 100px;
    padding: 30px 10px;
    border-radius: 20px;
    transition: 0.5s all;
    width: 94%;
    transform: scale(1);
}
.front_image{    
  background: white;
  margin: 0px 19px;
  position: relative;
  top: -98px;
  padding: 30px 10px;
  border-radius: 20px;
  transition: 0.5s all;
  width: 87%;
  transform: scale(1);
}
.front_image:hover{
    transform: scale(1.2);
}
.box_new{
    background: #1b6666 !important;
}
.text-logo-secondary{
    color: #af1919 !important;
}
.text-logo-primary{
    color: #362d87 !important;
}
.text-shadow-white{
    text-shadow: 2px 2px 4px white !important;
}
.text-sky{
    color: #30b8ef !important;
}
.line_height{
    line-height: 1.6;
    color: rgb(86 86 86);
    font-family: math;;
}
.light_blue{
  background: lightblue;
    border-radius: 13px;
    box-shadow: 4px 4px 4px;
}
.pl-5{
  padding-left: 60px !important;
}
.gif_ticki{
  width: 35px;
}
.owl-prev,.owl-next{
  display: block;
  height: 40px;
  width: 40px !important;
  /* width: fit-content; */
  display: flex !important;
  justify-content: center;
  align-items: center;
  position: relative;
  top: -9px;
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{
  font-size: 59px !important;
  display: flex !important;
  justify-content: center;
  align-items: center;
}
.owl-carousel .owl-nav button.owl-next span, .owl-carousel .owl-nav button.owl-prev span{
  font-size: 59px !important;
  display: flex !important;
  justify-content: center;
  align-items: center;
  position: relative;
  top: -9px;
  width: 47px;
  height: 36px;
}
.owl-theme .owl-nav{
  display: flex;
  justify-content: end;
}
.owl-nav .owl-prev,.owl-nav .owl-next{
  background: #362d87 !important;
  color: white !important;
}
.owl-nav .owl-prev:hover,.owl-nav .owl-next:hover{
  background: #a7fc08 !important;
  color: rgb(3, 3, 3) !important;
}
.new_x_color{
  color: #FE9347;
}
.text-brown{
  color: #8b8b8b;
}
.accordion-item{
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px !important;
}
.accordion-button{
  color: #c70c94 !important;
  font-weight: bold;
}
footer  *,footer  div * {
  color: white !important;
}
.contact_us_footer img{
  height: 20px;
}
.w_40{
  width: 20px !important;
  height: 20px !important;
}
.border_right{
  border-right: 1px solid white;
}
.border_left{
  border-left: 1px solid white;
}
.pl_25{
  padding-left: 20px;
}
.demo_top_page{
  height: 400px;
}
@media only screen and (max-width:1300px){
    .row{
        /* flex-wrap: nowrap !important; */
    }
}

/* form start  */
.form {
  display: flex;
  flex-direction: column;
  align-self: center;
  font-family: inherit;
  gap: 10px;
  padding-inline: 2em;
  padding-bottom: 0.4em;
  background-color: #171717;
  border-radius: 20px;
}

.form-heading {
  text-align: center;
  margin: 2em;
  color: #64ffda;
  font-size: 1.2em;
  background-color: transparent;
  align-self: center;
}

.form-field {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  border-radius: 10px;
  padding: 0.6em;
  border: none;
  outline: none;
  color: white;
  background-color: #171717;
  box-shadow: inset 2px 5px 10px rgb(5, 5, 5);
}

.input-field {
  background: none;
  border: none;
  outline: none;
  width: 100%;
  color: #ccd6f6;
  padding-inline: 1em;
}

.sendMessage-btn {
  cursor: pointer;
  margin-bottom: 3em;
  padding: 1em;
  border-radius: 10px;
  border: none;
  outline: none;
  background-color: transparent;
  color: #64ffda;
  font-weight: bold;
  outline: 1px solid #64ffda;
  transition: all ease-in-out 0.3s;
}

.sendMessage-btn:hover {
  transition: all ease-in-out 0.3s;
  background-color: #64ffda;
  color: #000;
  cursor: pointer;
  box-shadow: inset 2px 5px 10px rgb(5, 5, 5);
}

.form-card1 {
  background-image: linear-gradient(163deg, #64ffda 0%, #64ffda 100%);
  border-radius: 22px;
  transition: all 0.3s;
}

.form-card1:hover {
  box-shadow: 0px 0px 30px 1px rgba(100, 255, 218, 0.3);
}

.form-card2 {
  border-radius: 0;
  transition: all 0.2s;
}

.form-card2:hover {
  transform: scale(0.98);
  border-radius: 20px;
}
/* form end  */

/* font start  */
.cedarville-cursive-regular {
  font-family: "Cedarville Cursive", cursive;
  font-weight: 400;
  font-style: normal;
}

.pt-serif-regular {
  font-family: "PT Serif", serif;
  font-weight: 400;
  font-style: normal;
}

.pt-serif-bold {
  font-family: "PT Serif", serif;
  font-weight: 700;
  font-style: normal;
}

.pt-serif-regular-italic {
  font-family: "PT Serif", serif;
  font-weight: 400;
  font-style: italic;
}

.pt-serif-bold-italic {
  font-family: "PT Serif", serif;
  font-weight: 700;
  font-style: italic;
}
/* font end  */
.letter-spacing-2{
  letter-spacing: 12px;
}
.below_cursive{
  border-width: 5px;
  border-color: blue;
  opacity: 1;
}
.presenting{
  width: fit-content;
  padding: 3px 29px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: white;
}

/* faculty start  */

.card_box {
  /* width: 280px; */
  height: auto;
  border-radius: 20px;
  background: linear-gradient(170deg, rgba(58, 56, 56, 0.623) 0%, rgb(31, 31, 31) 100%);
  position: relative;
  box-shadow: 0 25px 50px rgba(0,0,0,0.55);
  cursor: pointer;
  transition: all .3s;
  /* height: 100%; */
  /* max-height: 450px; */
}

.card_box:hover {
  transform: scale(1.1);
}

.card_box span {
  position: absolute;
  overflow: hidden;
  width: 150px;
  height: 150px;
  top: -10px;
  left: -10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#span1::before {
  content: 'Exp : 23 years';
}
.span::before {
  content: 'Exp : 23 years';
  position: absolute;
  width: 158%;
  font-size: 18px;
  height: 39px;
  background-image: linear-gradient(45deg, #ff6547 0%, #ffb144 51%, #ff7053 100%);
  transform: rotate(-45deg) translateY(-20px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.23);
}
#span2::before {
  content: 'Exp : 19 years';
}
#span3::before {
  content: 'Exp : 18 years';
}
#span4::before {
  content: 'Exp : 4 years';
}
#span5::before {
  content: 'Exp : 20 years';
}
#span6::before {
  content: 'Exp : 15 years';
}
#span7::before {
  content: 'Exp : 11 years';
}
#span8::before {
  content: 'Exp : 13 years';
}

.card_box span::after {    
  content: '';
  position: absolute;
  width: 10px;
  bottom: 1px;
  left: 0;
  height: 10px;
  z-index: -1;
  box-shadow: 139px -139px #cc3f47;
  background-image: linear-gradient(45deg, #FF512F 0%, #F09819 51%, #FF512F 100%);
}
/* faculty end  */

.container__.row .col-md-6 .m-3.row,.outer_card_box{
  border: 4px solid #ff0000;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  padding-top: 60px;
  padding-bottom: 20px;
}
.subject_heading{
    top: 0%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: fit-content;
    text-wrap: nowrap;
    background: #ffffff;
    padding: 5px 20px;
    color: black !important;
}
.absolute{
  position: absolute;
}
.relative{
  position: relative;
}
.logo_primary{
  color: #362d87 !important;
}





/* gallery start  */

.container.gallery-container {
  background-color: #fff;
  color: #35373a;
  min-height: 100vh;
  padding: 30px 50px;
}

.gallery-container h1 {
  text-align: center;
  margin-top: 50px;
  /* font-family: 'Droid Sans', sans-serif; */
  font-weight: bold;
}

.gallery-container p.page-description {
  text-align: center;
  margin: 25px auto;
  font-size: 18px;
  color: #999;
}

.tz-gallery {
  padding: 40px;
}

/* Override bootstrap column paddings */
.tz-gallery .row > div {
  padding: 2px;
  position: relative;
}

.tz-gallery .lightbox img {
  width: 100%;
  border-radius: 0;
  position: relative;
}

.tz-gallery .lightbox:before {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -13px;
  margin-left: -13px;
  opacity: 0;
  color: #fff;
  font-size: 26px;
  /* font-family: 'Glyphicons Halflings'; */
  content: '\1F50D';
  pointer-events: none;
  z-index: 9000;
  transition: 0.4s;
}


.tz-gallery .lightbox:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: rgb(0 0 0 / 70%);
  content: '';
  transition: 0.4s;
  border-radius: 15px !important;
}

.tz-gallery .lightbox:hover:after,
.tz-gallery .lightbox:hover:before {
  opacity: 1;
}

.baguetteBox-button {
  background-color: transparent !important;
}
#inside_gallery{
  height: 580px;
  overflow-y: auto;
}

@media(max-width: 768px) {
  body {
      padding: 0;
  }
  .font_19_small{
    font-size: 19px !important;
  }
}
/* gallery end  */
.navbar{
  margin-bottom: 0px !important;
}
.navbar-brand {
  float: inherit !important;
  height: auto !important;
  padding: 0px !important;
  font-size: inherit !important;
  line-height: inherit !important;
}
.lightbox img{
  height: 100%;
  border-radius: 15px !important;
}
.tz-gallery .lightbox img{
  /* height: 100%; */
  border-radius: 15px !important;
}
.successful_student_img{
  width: 38%;
}
.successful_student_img img{
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
      margin-left: 0px !important;
  }
}
@media only screen and (min-width: 768px) {
  .navbar-collapse.collapse#navbarScroll {
      /* display: flex !important; */
      height: auto !important;
      padding-bottom: 0;
      overflow: visible !important;
  }
}
@media (min-width: 768px) {
  .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {
      margin-right: 0;
      margin-left: 0;
  }
}
@media only screen and (max-width:768px){
  iframe{
    margin-top: 20px;
  }
  .explore_streams{
    gap: 85px;
  }
  .back_image_box{
    height: 150px;
  }
  /* .front_image {
    top: 46px;
    padding: 8px 10px;
  } */
  /* .section2 {
    padding-bottom: 60px !important;
  } */
  .W_60 {
    width: 99%;
  }.pl-5 {
    padding-left: 17px !important;
  }
  .form-card1.m-5.mt-0{
    margin-left: 0px !important;
    margin-right: 0px !important;
    margin-top: 20px !important;
    margin-bottom: 0px !important;
  }
  .col-md-12{
    overflow: hidden;
  }
  ul.font_20{
    list-style-position: inside;
  }
  .navbar-brand img {
    height: 41px;
  }
  .navbar-toggler{
    padding: 3px 5px !important;
  }
  .top_header h5{
    font-size: 9px;
  }
  .director_image_outer{
    margin-bottom: 20px;
  }
}
@media only screen and (min-width:768px) and (max-width:1500px){
  .W_60{
    width: 98%;
  }
}

@media only screen and (max-width:992px){
  .top_header + .navbar .container-fluid #navbarScroll ul li{
    width: 100%;
    background: #e3e2ec;
    color: white;
    padding: 3px 20px;
    border-bottom: 2px solid white;
  }
  .line_height{
    font-size: 16px;
  }
}
@media only screen and (max-width:1200px){
  .flex_opposite{
    flex-direction: column-reverse !important;
  }
  .flex_opposite > div{
    width: 100% !important;
  }
  .column_box_row{
    flex-direction: column;
  }
  .column_box_row > div{
    width: 100% !important;
  }
}
@media only screen and (min-width:768px) and (max-width:1200px){
  .faq_section div{
    width: 100% !important;
  }
  .form-card1.m-5.mt-0{
    margin-left: 0px !important;
    margin-right: 0px !important;
    margin-top: 20px !important;
    margin-bottom: 0px !important;
  }
  .flex_opposite > div{
    width: 80% !important;
    margin: auto;
  }

}
.card_box.card_box2{
  width: 250px !important;
}
.outer_card_box{
  padding: 20px;
  margin: 20px;
  padding-top: 66px;
  gap: 27px;
  padding-bottom: 30px;
}
@media only screen and (min-width:1143px) and (max-width:1520px){
  .stream_box{
    margin: 0px 64px;
  }

}
.successful_student_img h6{
  margin-bottom: 0px !important;
}
@media only screen and (max-width:992px){
  .navbar-nav .nav-link.active, .navbar-nav .nav-link.show{
    color: white !important;
  }
}