@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@100..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
/*========== ROOT & GENERAL STYLE ===================*/
  :root {
    --color-first: #1d1d1d;
    --color-second: #3600ff;
    --color-third:#65d9ff; 
    --color-content:#1d1d1d;
    --bg-light-1: #f6f6f6;
    --bg-1: #f4f9f5;
    --font-family-heading:"Raleway", sans-serif;
    --font-family-content:"Heebo", sans-serif;
  }
  *,::after,::before {  box-sizing: border-box;}
  * {
    margin: 0;
    padding: 0;
    font-family: var(--font-family-content);
     font-weight: 400; 
    font-style: normal;
    font-size: 16px; 
    letter-spacing: 0.01em;
    line-height: 1.5;
    color: var(--color-content);
    text-transform: none;
  }
  a,a:hover,a:focus,a:focus-visible {text-decoration: none; outline: none;cursor: pointer;}
  html {scroll-behavior: smooth;font-family: sans-serif;}
  ul li {  list-style: none;}
  ul.list li {  list-style: disc;  color: var(--color-content);}
  .color-first {  color: var(--color-first) !important;}
  .color-second {  color: var(--color-second) !important;}
  .color-third {  color: var(--color-third) !important;}
  .color-content {  color: var(--color-content) !important;}
  .bg-color-first { background-color: var(--color-first); }
  .bg-color-second { background-color: var(--color-second); }
  .bg-color-third {  background-color: var(--color-third); }
  .bg-color-bg-light-1 { background-color: var(--bg-light-1); }
  .bg-color-bg-1 { background-color: var(--bg-1); }
  .gradient-bg, .button.btn-gradient-bg{
    background-color: var(--color-second);
    background: -moz-linear-gradient(135deg,var(--color-second) 0%,var(--color-third) 100%);
    background: -webkit-linear-gradient(135deg,var(--color-second) 0%,var(--color-third) 100%);
    background: linear-gradient(135deg,var(--color-second) 0%,var(--color-third) 100%);
  }
  .button.btn-gradient-bg:hover{
    background: -moz-linear-gradient(30deg,var(--color-second) 20%,var(--color-third) 80%);
    background: -webkit-linear-gradient(30deg,var(--color-second) 20%,var(--color-third) 80%);
    background: linear-gradient(30deg,var(--color-second) 20%,var(--color-third) 80%);
  }
  .wrapper{margin-top: 76px}
/*========== BUTTON STYLE ===========================*/
  .button,input[type="submit"].button,.btn-outline-first {
    padding: 0.7rem 2rem;
    color:#fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0;
    border-radius: 9999px;
    border: none;
    flex-shrink: 0;
    text-transform: capitalize;
    pointer-events: auto;
    cursor: pointer;
    transition: all 0.7s;
  }
  .btn-first {  background-color: var(--color-first);}
  .btn-second {  background-color: var(--color-second);}
  .btn-third {  background-color: var(--color-third);}
  .btn-outline-first { color: var(--color-first);}
  .btn-outline-first:hover{background: var(--bg-light-1);}
  button.button:focus,button.btn:focus,input.form-control:focus,select.form-select:focus,textarea:focus {
    outline: 0 !important;
    box-shadow: none !important;
    border-color: #c2c8ce !important;
  }
.no-bg-btn {
  padding: 0;
  margin: 0;
  border: none !important;
  background-color: transparent;
  outline: none !important;
  box-shadow: none !important;
}
/*========== HEADING STYLE ==========================*/
.mainHeading {
  font-size:2.6rem;
  font-weight:700;
  line-height:1.2;
  color:var(--color-content);
  font-family: var(--font-family-heading);
  text-transform: capitalize;
}
.subHeading {
  font-size: 1.6rem;
  color: var(--color-content);
  font-family: var(--font-family-content);
  font-weight: 600;
}
.thirdHeading {
  font-size: 1.1rem;
  color: var(--color-content);
  font-family: var(--font-family-content);
  font-weight: 500;
}
.webContent p,.webContent p span,.webContent ul li {
  font-weight: 400;
  color: var(--color-content);
  font-size: 1rem;
  line-height: 1.6;
  font-family: var(--font-family-content);
}
/*========== INPUT FIELD STYLE ======================*/
  input.form-control,select.form-select {height: 40px;border-radius: 5px;font-size: 0.85rem}
  textarea.form-control {  resize: none;  border-radius: 0;}
  .form-check-input {  width: 1.5em;  height: 1.5em;}
  .form-check-input:checked {  background-color: var(--color-first);  border-color: var(--color-first);}
  label strong {  font-size: 1rem;  font-weight: 500;}
  .form-check-input:focus {  box-shadow: none}
  .h-40 {  height: 40px}
  .form-switch .form-check-input:checked {  background-repeat: no-repeat;}
  .form-switch .form-check-input {  width: 3em;}
  .loginSection .form-check {  padding-left: 2.5rem}
  .form-check-input.is-valid~.form-check-label,.was-validated .form-check-input:valid~.form-check-label {
    color: var(--color-first);
  }
  .form-check-input.is-valid:checked,.was-validated .form-check-input:valid:checked {
    background-color: var(--color-first);
  }
/*========== TEXT LIMIT STYLE =======================*/
  .text-limit-1,.text-limit-2,.text-limit-3,.text-limit-4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }
  .text-limit-1 {  -webkit-line-clamp: 1;white-space: nowrap;}
  .text-limit-2 {  -webkit-line-clamp: 2;}
  .text-limit-3 {  -webkit-line-clamp: 3;}
  .text-limit-4 {  -webkit-line-clamp: 4;}
/*========== OWL CAROUSEL ===========================*/
.owl-theme .owl-nav {
  width: 100%;
  display: flex !important;
  justify-content: space-between;
  margin-top: 0 !important;
  z-index: -2;
}
.owl-carousel .owl-nav button:focus {outline: 0 !important;border: 0 !important;}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
  position: absolute;
  top: 45%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 25px;
  color: var(--color-first) !important;
  padding: 0 !important;
  width: 50px;
  height: 50px;
  border-radius: 50px;
  background: #ffffff !important;
  box-shadow: 0 0 10px rgba(0,0,0,.2);
  z-index: 9;
}
.owl-carousel .owl-nav button.owl-next{right: 10px}
.owl-carousel .owl-nav button span {opacity: 0; width: 0; height: 0;}
.imgs-carousel .owl-item .item,
.events-carousel .owl-item .item {
  transform: translate3d(0, 0, 0);
  transform: scale(1);
  transition: all .25s ease-in-out;
  margin: 50px 0; /* OVERWRITE PLUGIN MARGIN */
}
.imgs-carousel .owl-item .item img {
  -webkit-transform: scale(0.95);
  -ms-transform: scale(0.95);
  transform: scale(0.95);
  transition: all .25s ease-in-out;
  cursor: pointer;
}
.imgs-carousel .owl-item .item img:hover {
  -webkit-transform: scale(0.96);
  -ms-transform: scale(0.96);
  transform: scale(0.96);
}
.imgs-carousel .owl-item.center .item img {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
.imgs-carousel .owl-item.center .item img:hover {
  -webkit-transform: scale(1.22);
  -ms-transform: scale(1.22);
  transform: scale(1.22);
}
.imgs-carousel img {height:360px;border-radius: 20px;object-fit: cover;}
/*========== HEADER STYLE ===========================*/
  .logo{ width: 200px;}
  header .logo{ filter: invert(100%);}
  ul.nav.header-nav li a{color: #fff; font-size: 0.9rem;font-weight: 500;}
  ul.nav.header-nav li a:hover{color: var(--color-third);}
  ul.nav.header-nav li:nth-last-child(2) a{border:none;}
  .menubar i{font-size: 1.4rem}
/*========== FOOTER STYLE ===========================*/
  .iti {width: 100%}
  .iti__search-input-wrapper{height: 40px;}
  .iti__search-input,.iti__search-input:focus{border: 0;outline: 0;box-shadow: 0;}
  .form-control.is-invalid, .was-validated .form-control:invalid,
  .form-control.is-valid, .was-validated .form-control:valid{background-image: none}
  .social-links img{width: 30px;object-fit: scale-down;}
/*========== RESPONSIVE STYLE =======================*/
@media only screen and (max-width: 992px)  {
  ul.nav.header-nav li a{color: var(--color-first);}
  .wrapper{margin-top: 67px}
}

.calendar-link-options a{color: var(--color-first);margin: 0px 10px;}
.calendar-link-options a:hover, .calendar-link-options a:focus{text-decoration: underline;}
.calendar-link-options {display: none;}
/*========== HOME PAGE STYLE =======================*/
/*banner section*/
.banner-section .banner-img {
  width: 100%;
  height: 350px;
  object-fit: cover;
  object-position: center;
}
.banner-info {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.35);
  z-index: 1;
}
/*banner section end*/

/*logo section*/
.logo-section img {object-fit: contain;object-position: center;height: 80px;}
.logo-row .col {width: 11%;flex: none;}
/*logo section end*/

/*about section*/
.about-img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
}
/*about section end*/

/*events section*/
.h-fit-content {min-height: fit-content;}
.w-fit-content {width: fit-content;}
.fg-1 {flex-grow: 1;}
.events-section .events-card {position: relative;width: 100%;overflow: hidden;border-radius: 12px;overflow: hidden;transition: all 0.5s;}
.events-section .events-card .events-img {
  width: 100%;
  object-fit: cover;
  object-position: left;
  height: 300px;
  border-radius: 12px;
}
.events-card-info {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: -2;
  transition: all 0.5s;
}
.events-date {
  width: fit-content;
  padding: 20px 40px;
  border-radius: 0 0 100px 100px;
}
.events-section .events-carousel .owl-item.center .item {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
.events-section .events-carousel .owl-item.center .events-card:hover img {-webkit-filter: blur(4px);filter: blur(4px);}
.events-section .events-carousel .owl-item.center .events-card:hover .events-card-info {opacity: 1;z-index: 1;}
.events-section .events-card .events-card-info .subHeading {font-size: 1.4rem;}
.cut-btn {
  position: absolute;
  top: 12px;
  left: auto;
  right: 12px;
  font-size: 26px;
  color: var(--color-content);
  z-index: 2;
}
.past-events-text {overflow-y: auto;max-height: 70%;}
.past-events-card .events-card-info.active {opacity: 1;z-index: 1;}
/*events section end*/
/*========== HOME PAGE STYLE end =======================*/



/*========== @media screen =================================*/
@media screen and (max-width: 1024px) {
  .mainHeading {font-size: 2.4rem;}
  /*HOME PAGE STYLE*/
  .banner-section .banner-img {height: 300px;}
  .about-img {height: 100%;}
  .imgs-carousel img {height: 300px;}
  .events-section .events-card .events-img {height: 280px;}
  .events-card-info .events-date {padding: 12px 24px;}
  .events-card-info .subHeading {font-size: 1.2rem;}
  .events-card-info .p, .events-card-info .button {font-size: 14px;}
  .events-card-info svg {width: 18px;height: 18px;}

  /*HOME PAGE STYLE end*/

}
@media screen and (max-width: 991px) {
  .mainHeading{font-size:2.2rem;}
  .subHeading {font-size: 1.2rem;}
  .thirdHeading {font-size: 1rem;}
  p {font-size: 15px;}
  /*HOME PAGE STYLE*/
  .banner-section .banner-img {height: 260px;}
  .logo-section img {height: 60px;}
  .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
    font-size: 20px;
    width: 40px;
    height: 40px;
  }
  .imgs-carousel img{height:280px;}
  .events-section .events-card .events-img {height: 230px;}
  .events-card-info .events-date {padding: 10px 20px;}
  .events-card-info .subHeading {font-size: 1rem;}
  .events-card-info .p, .events-card-info .button {font-size: 12.5px;}
  .events-card-info svg {width: 16px;height: 16px;}

  /*HOME PAGE STYLE end*/

}
@media screen and (max-width: 767px) {
  .mainHeading{font-size: 1.6rem;}
  .subHeading {font-size: 1.1rem;}
  .thirdHeading {font-size: 0.9rem;}
  p {font-size: 14px;}
  /*HOME PAGE STYLE*/
  .banner-section .banner-img {height: 220px;}
  .logo-section img {height: 50px;}
  .logo-row .col {width: 33%;}
  .about-img {height: auto;}
  .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
    font-size: 16px;
    width: 32px;
    height: 32px;
  }
  .imgs-carousel img {height:240px}
  .events-section .events-card .events-img {height: 240px;object-position: right;}
  .events-card-info .events-date {padding: 8px 16px;}
  .events-card-info .subHeading {font-size: 14px;}
  .events-card-info .thirdHeading {font-size: 12.5px;}
  .events-card-info .p, .events-card-info .button {font-size: 11.5px;}
  .events-card-info svg {width: 14px;height: 14px;}
  /*HOME PAGE STYLE end*/


}
/*========== @media screen END =================================*/