*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --primary-color: #172e55;
  --secondary-color: #f7cc1e;
  --bg-color: #efefef;
  --color-text-main: #1a1556;
  --color-text-sec: gray;
  --box-shadow: 0 5px 15px rgb(150 132 254 / 15%);
  /* --box-shadow-float: 0px 17px 10px -10px rgb(0 0 0 / 40%); */
  --box-shadow-float: 0 10px 20px 0 rgb(153 153 153 / 25%);
  --box-shadow-float-top: rgb(44, 62, 80) 0px -15px 15px -15px;
}

html {
  font-size: 9px;
}

body {
  font-size: 1.6rem !important;
  font-family: "Montserrat", sans-serif;
  position: relative;
  background: var(--bg-color);
  overflow-x: hidden;
  width: 100vw;
}

.hidden {
  display: none !important;
}

input {
  outline: none;
}

.btn {
  outline: none;
  box-shadow: none;
  border: none;
}
.btn:hover,
.btn:focus,
.btn:active {
  outline: none;
  box-shadow: none;
  border: none;
}
.btn:active {
  transform: scale(0.8);
}

p.icon-text {
  display: flex;
  gap: 0.5rem;
}
p.icon-text span {
  flex: 1;
  width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  color: inherit;
  text-decoration: none;
}

ul {
  padding: 0;
  margin: 0;
}

.datepicker-container {
  z-index: 10000 !important;
}

select {
  appearance: none !important;
  cursor: pointer;
}

.odometer {
    font-size: 2.5rem;
}

/*------------------------------Scroller------------------------------*/

/* width */
        
        ::-webkit-scrollbar {
          width: 12px;
        }
        
        /* Track */
        
        ::-webkit-scrollbar-track {
          background: #ffc000;
        }
        
        /* Handle */
        
        ::-webkit-scrollbar-thumb {
            background: rgb(23 46 85);
            border-radius: 2rem;
            min-height: 70px;
        }
        
        /* Handle on hover */
        
        ::-webkit-scrollbar-thumb:hover {
           background: rgb(23 46 85);
        }

/*------------------------------Swal------------------------------*/

.swal2-popup {
  padding-bottom: 0 !important;
  max-width: 80% !important;
  box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px,
    rgba(9, 30, 66, 0.08) 0px 0px 0px 1px !important;
}

.swal2-icon {
  margin: 1.5em auto 0em !important;
}

.swal2-title {
  margin: 0 !important;
  margin-bottom: 0.5em !important;
  font-size: 1.4rem !important;
}

.swal2-html-container {
  margin: 0 !important;
  margin-bottom: 0.5em !important;
  font-size: 1.6rem !important;
}

.swal2-actions {
  margin: 0 !important;
  margin-bottom: 0.5em !important;
  width: 100% !important;
}

.swal2-styled.swal2-confirm {
  background-color: var(--primary-color) !important;
}

.swal2-styled.swal2-cancel {
  background-color: var(--bs-danger) !important;
}

.swal2-styled.swal2-confirm:focus,
.swal2-styled.swal2-cancel:focus {
  box-shadow: none !important;
}

/*------------------------------Topbar------------------------------*/

.topbar-section {
  background: var(--secondary-color);
  padding: 1rem 0;
  border-radius: 0 0 5rem 5rem;
}

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.topbar__left,
.topbar__right {
  display: flex;
  gap: 2rem;
  font-weight: 700;
}

.topbar__left a {
  position: relative;
}

.topbar__left a:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  right: -1.5rem;
  width: 3px;
  border-right: 4px double var(--primary-color);
}

/*------------------------------Header------------------------------*/

.header-section {
  --header-height: 15rem;
  background: var(--bg-color);
  height: var(--header-height);
  padding: 1rem 0;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header__left {
  /*display: flex;*/
  /*gap: 2rem;*/
  flex: 1;
}

.header__logo {
  width: auto;
  height: calc(var(--header-height) - 2rem);
}

.header__logo img {
  width: 100%;
  height: 100%;
}

.header__logo-det {
    display: block;
  width: auto;
  height: calc(var(--header-height) - 2rem);
}

.header__logo-det img {
  /*width: 100%;*/
  height: 100%;
}

.hamburger {
  display: none;
  width: 4rem;
  display: none;
  /*position: absolute;*/
  right: 0;
  cursor: pointer;
}

.hamburger div {
  width: 100%;
  height: 2px;
  margin-bottom: 4px;
  border-radius: 2rem;
  background: var(--primary-color);
  transition: all 0.3s;
}

.hamburger.open .div1 {
  transform: rotate(38deg);
}

.hamburger.open .div3 {
  transform: rotate(-38deg);
}

.hamburger.open .div2 {
  display: none;
}

body > .enquiry-btn {
  position: fixed;
  bottom: 3rem;
  right: 3rem;
  z-index: 2;
}

/*------------------------------Loader------------------------------*/

.loader {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 99999999999;
}

.loader::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  background: #fff;
  opacity: 0.5;
}

.loader img {
  position: absolute;
  left: 50%;
  top: 50%;
  max-width: 15rem;
  max-height: 15rem;
  transform: translate(-50%, -50%);
  z-index: 1;
}

/*------------------------------Modal------------------------------*/

.modal-dialog {
  height: 100%;
  border-radius: 2rem;
  overflow: hidden;
  border: none;
  max-width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.modal-content {
  border-radius: 2rem;
  border: none;
  -webkit-animation: flipInX 1s ease;
  max-width: 568px;
  margin: auto;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px,
    rgba(0, 0, 0, 0.22) 0px 10px 10px;
}

.modal-header {
  padding: 1.5rem 2rem;
  background: var(--bs-gray-400);
  border-top: 5px solid var(--secondary-color);
  border-bottom: 0;
  border-radius: 2rem 2rem 0 0;
}

.modal-title {
  font-size: 2rem;
  color: var(--primary-color);
  font-weight: 700;
}

.modal-footer {
  padding: 1rem 2rem;
}

.modal-body {
  padding: 1rem;
}

.modal .btn[data-bs-dismiss] {
  background: var(--bs-danger) !important;
  box-shadow: var(--box-shadow-float) !important;
}

.modal .btn[data-bs-dismiss]:hover,
.modal .btn[data-bs-dismiss]:active,
.modal .btn[data-bs-dismiss]:focus {
  background: var(--bs-danger) !important;
}

@media (max-width: 768px) {
  .modal-content {
    max-width: 90%;
  }
}

/*------------------------------Navbar------------------------------*/

.navbar-section {
  background: var(--primary-color);
  color: white;
  padding: 1rem 0;
  white-space: nowrap;
  z-index: 999;
  position: relative;
  box-shadow: var(--box-shadow-float);
  transition: all 0.5s ease;
}

.nav-menu {
  list-style: none;
  display: flex;
  width: fit-content;
  margin: auto;
  gap: 3rem;
  position: relative;
  align-items: center;
}

.nav-menu__item,
.nav-submenu__item {
  cursor: pointer;
}

.nav-menu__item a,
.nav-submenu__item a {
  width: 100%;
  display: block;
}

.nav-submenu {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: calc(100% + 1rem);
  background: var(--secondary-color);
  color: var(--primary-color);
  list-style: none;
  padding: 2rem 1.5rem;
  border-radius: 0 2rem 0 2rem;
  font-weight: 700;
  gap: 1rem;
  overflow: hidden;
  transition: all 0.5s ease;
  opacity: 0;
  visibility: hidden;
  z-index: -1;
  box-shadow: var(--box-shadow-float);
}

.nav-menu__item:hover .nav-submenu,
.nav-menu__item .nav-submenu:hover {
  opacity: 1;
  z-index: 1;
  visibility: visible;
}

/*------------------------------Hero------------------------------*/

.hero-section {
  box-shadow: var(--box-shadow-float-top);
}

.hero-img {
  width: 100%;
  height: 100%;
  position: relative;
}

.hero-img img {
  width: 100%;
  height: 100%;
}

.hero-img__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0.2;
}

.hero-img__text {
  position: absolute;
  top: 0rem;
  right: 2rem;
  color: rgb(67, 167, 255);
  font-weight: 700;
  font-size: 4vw;
  text-shadow: 5px 5px 3px var(--secondary-color);
  text-align: end;
}

.hero-swiper {
  width: 100%;
}

.hero-section .swiper-button-next,
.hero-section .swiper-button-prev {
  background: var(--secondary-color);
  color: var(--primary-color);
  border-radius: 50%;
  height: 5rem;
  width: 5rem;
  box-shadow: var(--box-shadow-float);
  border: 2px solid white;
  opacity: 0.8;
}

.hero-section .swiper-button-next:after,
.hero-section .swiper-button-prev:after {
  font-size: 2.5rem;
  font-weight: 700;
}

/*------------------------------Frame------------------------------*/

/* Frame */

.frame {
  position: absolute;
  background: var(--secondary-color);
}
.frame--vertical {
  height: 15rem;
  width: 2rem;
}
.frame--horizontal {
  width: 15rem;
  height: 2rem;
}
.frame--top-left {
  top: 0;
  left: 0;
}
.frame--top-right {
  top: 0;
  right: 0;
}
.frame--bottom-left {
  bottom: 0;
  left: 0;
}
.frame--bottom-right {
  bottom: 0;
  right: 0;
}

/* Frame Before */

.frame::before {
  content: "";
  position: absolute;
  background: var(--primary-color);
  z-index: 1;
}
.frame--horizontal::before {
  width: 100%;
  height: 2px;
}
.frame--vertical::before {
  height: 100%;
  width: 2px;
}
.frame--top-left::before {
  top: 0.5rem;
  left: 0.5rem;
}
.frame--top-right::before {
  top: 0.5rem;
  right: 0.5rem;
}
.frame--bottom-left::before {
  bottom: 0.5rem;
  left: 0.5rem;
}
.frame--bottom-right::before {
  bottom: 0.5rem;
  right: 0.5rem;
}

/* Frame After */

.frame::after {
  content: "";
  position: absolute;
  background: var(--primary-color);
  z-index: 1;
}
.frame--horizontal::after {
  width: calc(100% + 2rem);
  height: 2px;
}
.frame--vertical::after {
  height: calc(100% + 2rem);
  width: 2px;
}
.frame--top-left::after {
  top: 1rem;
  left: 1rem;
}
.frame--top-right::after {
  top: 1rem;
  right: 1rem;
}
.frame--bottom-left::after {
  bottom: 1rem;
  left: 1rem;
}
.frame--bottom-right::after {
  bottom: 1rem;
  right: 1rem;
}

/*------------------------------Testimonial------------------------------*/

.testimonial-section .quote-img {
  position: absolute;
  top: -3rem;
  left: 2rem;
  z-index: 2;
  transform: scale(0.7);
}

.testimonial {
  text-align: center;
  background: rgba(43, 57, 102, 0.4);
  padding: 4rem 2rem;
}

.testimonial__text {
  color: white;
}

.testimonial__name {
  background: var(--secondary-color);
  color: var(--primary-color);
  display: inline-block;
  font-weight: 700;
  text-transform: uppercase;
  padding: 0.8rem 2rem;
  border-radius: 0.5rem;
  font-size: 1.6rem;
  margin-top: 2rem;
}

.testimonial__des {
  color: white;
  display: block;
  text-transform: uppercase;
  font-size: 1.4rem;
  margin-top: 2rem;
}

.testimonial-section .swiper-pagination {
  position: relative;
}
.testimonial-section .swiper-pagination-bullet {
  width: 6rem;
  height: 6rem;
  opacity: 0.3;
  margin: 0 1rem !important;
  padding: 0.5rem;
  background: transparent;
}
.testimonial-section .swiper-pagination-bullet-active {
  opacity: 1;
  border-top: 3px dotted var(--secondary-color);
  scale: 1.2;
}

/*------------------------------Placements------------------------------*/

.placement-swiper .swiper-slide {
  width: auto;
}

.placement-section {
  background: var(--bs-gray-200);
  padding: 2rem;
  border-radius: 1rem;
  box-shadow: var(--box-shadow-float);
  border: 4px double black;
}

.placement {
  width: 30rem;
  height: auto;
  display: inline-block;
}

.placement img {
  width: 100%;
  height: 100%;
}

/*------------------------------WCU Img------------------------------*/

.wcu-img {
  margin: auto;
  width: 70%;
  text-align: center;
  position: relative;
  padding: 1rem;
}

.wcu-img img {
  width: 100%;
  height: auto;
  border-radius: 0 2rem 0 2rem;
  box-shadow: var(--box-shadow-float);
}

/*------------------------------News------------------------------*/

.news-section marquee {
  background: white;
  padding: 2rem;
  border-radius: 2rem;
  box-shadow: var(--box-shadow-float);
  border-top: 5px solid var(--secondary-color);
  height: 40rem;
}

.news-list li {
  color: black;
  display: flex;
  gap: 1rem;
  align-items: baseline;
  position: relative;
  padding-bottom: 2.5rem;
  margin: 1rem 0;
  border-bottom: 1px dashed var(--primary-color);
  font-size: 1.4rem;
  font-weight: 700;
}

.news-list li > i {
  color: var(--primary-color);
  font-weight: 700;
}

.news-list li span {
  position: absolute;
  bottom: 1rem;
  right: 0;
  font-style: italic;
  font-size: 1.2rem;
  color: gray;
}

.news-list li span i {
  margin-right: 0.5rem;
}

.news-title {
  font-size: 1.5rem !important;
  padding: 1rem 2rem !important;
  position: relative;
}

.news-title-thread {
  height: 5rem;
  width: 0.5rem;
  border-radius: 2rem 2rem 0 0;
  display: block;
  margin: auto;
  background: var(--secondary-color);
  margin-bottom: -10px;
}

.wcu-list li {
  padding-bottom: 0rem;
}

.apply-btn {
  position: absolute;
  left: 2.5rem;
  bottom: 1rem;
  height: 2.5rem;
}

/*------------------------------Marquee------------------------------*/

.marquee-container {
  height: 30px;
  overflow: hidden;
  line-height: 30px;
  position: relative;
}
.marquee-container .marquee {
  top: 0;
  left: 100%;
  width: 100%;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  animation: marquee 30s linear infinite;
  display: flex;
  justify-content: space-around;
}
.marquee-container .marquee2 {
  animation-delay: 15s;
}
.marquee-container b {
  padding-left: 10px;
}

@keyframes marquee {
  0% {
    left: 100%;
  }
  100% {
    left: -100%;
  }
}

/*------------------------------Affiliation------------------------------*/

.affiliation-swiper {
  padding-bottom: 2rem;
}

.affiliation-swiper .swiper-slide {
  width: auto;
}

.affiliation {
  width: 15rem;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: var(--box-shadow-float);
  border: 1px dashed var(--primary-color);
  display: inline-block;
}

.affiliation img {
  width: 100%;
}

/*------------------------------Footer------------------------------*/

footer {
  background: var(--primary-color);
  color: white;
}

.footer-heading {
  font-weight: 700;
  text-transform: uppercase;
  color: var(--secondary-color);
  font-size: 1.4rem;
}

.footer-heading ~ hr {
  width: 50%;
}

.footer-list {
  list-style: none;
}

.footer-list .icon-text {
  align-items: baseline;
}

.footer-list li {
  padding: 0.5rem 0;
}

.footer-list li a {
  transition: all 0.3s ease;
}

.footer-list li a:hover {
  color: var(--secondary-color);
  padding-left: 2rem;
}

.footer-logo {
  width: 10rem;
  height: 10rem;
  margin-bottom: 1rem;
}

.footer-logo img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid var(--secondary-color);
  box-shadow: var(--box-shadow-float);
}

/*------------------------------Breadcrumb------------------------------*/

.breadcrumb {
  background-size: cover;
  background-image: url(../img/bc.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
}
.breadcrumb__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0.7;
}
.breadcrumb-content {
  position: relative;
  padding: 3rem 0;
  padding-left: 2rem;
}
.breadcrumb__icon {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: auto;
  opacity: 0.5 !important;
}
.breadcrumb__title {
  font-size: 2.5rem;
  color: #fff;
  text-shadow: 2px 3px 2px rgb(0, 115, 255);
  font-weight: 700;
  text-transform: uppercase;
  margin: 0;
  position: relative;
  z-index: 1;
}
.breadcrumb__title i {
  font-size: 2rem;
}
.breadcrumb__link {
  position: relative;
  z-index: 1;
  color: white;
  display: flex;
  gap: 1rem;
  margin-top: 1rem;
}
.breadcrumb__link__item {
  font-size: 2rem;
  position: relative;
}
.breadcrumb__link__item:not(:last-child)::after {
  font-family: "Font Awesome 6 Free";
  content: "\f101";
  position: absolute;
  bottom: 0;
  right: -3rem;
  font-weight: 700;
  font-size: 2.2rem;
}
.breadcrumb__link__item:not(:first-child) {
  margin-left: 3rem;
}
.breadcrumb__link > i {
  font-size: 2.5rem;
  color: rgb(255, 255, 255);
}

/*------------------------------Card 1------------------------------*/

.flex-col {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.grid {
    display: grid;
}

.grid--3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid--2 {
    grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 768px) {
  .grid--3, .grid--2 {
    grid-template-columns: repeat(1, 1fr);
  }
}

.gap-2 {
    gap: 2rem !important;
}

.card-1 {
  position: relative;
  background: #fff;
  box-shadow: 0px 14px 80px rgb(34 35 58 / 20%);
  padding: 2rem;
  border-radius: 3rem;
  transition: all 0.3s;
  display: flex;
  align-items: center;
  gap: 5rem;
  width: calc(100% - 10rem);
  margin-left: auto;
}
.card-1--reverse {
  flex-direction: row-reverse;
  justify-content: space-between;
  margin-left: inherit;
  padding: 3rem;
  gap: 15rem;
}
.card-1__img {
  width: 20rem;
  flex-shrink: 0;
  height: 20rem;
  background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
  box-shadow: 4px 13px 30px 1px rgb(252 56 56 / 20%);
  border-radius: 2rem;
  position: relative;
  margin-left: -13rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.card-1--reverse .card-1__img {
  margin-right: -11rem;
}
.card-1__img:after {
  content: "";
  position: absolute;
  top: -1rem;
  left: -1rem;
  width: calc(100% + 2rem);
  height: calc(100% + 2rem);
  background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
  box-shadow: 4px 13px 30px 1px rgb(252 56 56 / 20%);
  border-radius: 20px;
  opacity: 0.2;
}
.card-1__img img {
  width: 70%;
  height: 70%;
  object-fit: cover;
  display: block;
  border-radius: 2rem;
  transition: all 0.3s;
  z-index: 1;
}
.card-1__content {
  display: flex;
  gap: 1rem;
  flex-direction: column;
}
.card-1__title {
  font-size: 2.8rem;
  font-weight: 700;
  color: var(--primary-color);
  font-family: "Montserrat", sans-serif;
  text-transform: capitalize;
}
.card-1__title-sec {
  font-size: 1.6rem;
  font-weight: 600;
  color: #6351ce;
}
.card-1__title-sec p {
  margin-bottom: 0;
}
.card-1__text {
  color: #4e4a67;
  line-height: 1.5em;
}
.card-1__text p {
  margin-bottom: 1rem;
}
.card-1__text p:last-child {
  margin-bottom: 0;
}
.card-1__btn {
  display: inline-flex;
  background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
  padding: 1.5rem 3.5rem;
  border-radius: 5rem;
  color: #fff;
  box-shadow: 0px 14px 80px rgba(252, 56, 56, 0.4);
  text-decoration: none;
  font-weight: 500;
  justify-content: center;
  text-align: center;
  letter-spacing: 1px;
}

  .card-1--vertical {
    flex-direction: column;
    width: 100%;
    margin-top: 10rem;
    gap: 3rem;
  }
  .card-1--vertical .card-1__img {
    margin-left: 0;
    margin-top: -10rem;
  }

@media (max-width: 768px) {
  .card-1 {
    flex-direction: column;
    width: 100%;
    margin-top: 10rem;
    gap: 3rem;
  }
  .card-1--reverse {
    flex-direction: column;
    width: 100%;
    gap: 3rem;
  }
  .card-1__img {
    margin-left: 0;
    margin-top: -10rem;
  }
  .card-1--reverse .card-1__img {
    margin-right: 0;
    margin-top: -10rem;
  }
  .card-1__title {
    text-align: center;
  }
}

.course-section .card-1__title {
  font-size: 2.5rem;
  font-family: "Montserrat", sans-serif;
}

/*------------------------------Card 2------------------------------*/

.card-2 {
  position: relative;
  background: #fff;
  box-shadow: 0px 14px 80px rgb(34 35 58 / 20%);
  padding: 3rem;
  border-radius: 1rem;
  transition: all 0.3s;
  width: 100%;
}
.card-2__img {
  width: 30rem;
  flex-shrink: 0;
  border-radius: 2rem;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  margin-right: 2rem;
}
.card-2--reverse .card-2__img {
  float: right;
  margin-left: 2rem;
  margin-right: 0;
}
.card-2__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 2rem;
  transition: all 0.3s;
  z-index: 1;
}
.card-2__title {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--primary-color);
  margin-bottom: 1rem;
  text-align: right;
}
.card-2--reverse .card-2__title {
  text-align: left;
}
.card-2__title-sec {
  font-size: 2rem;
  font-weight: 600;
  color: gray;
  margin-bottom: 1rem;
  text-align: right;
}
.card-2--reverse .card-2__title-sec {
  text-align: left;
}
.card-2__sec-title p {
  margin-bottom: 0;
}
.card-2__text {
  color: #4e4a67;
  margin-bottom: 3rem;
  line-height: 1.5em;
  text-align: right;
}
.card-2--reverse .card-2__text {
  text-align: left;
}
.card-2__text p {
  margin-bottom: 2rem;
}
.card-2__btn {
  margin-left: auto;
}
.card-2--reverse .card-2__btn {
  margin-left: 0;
}
@media (max-width: 768px) {
  .card-2__img,
  .card-2--reverse .card-2__img {
    display: block;
    width: 100%;
    margin-left: 0;
    float: none;
    margin-bottom: 2rem;
  }
}

/*------------------------------Card 3------------------------------*/

.card-3 {
  position: relative;
  background: #fff;
  box-shadow: 0px 14px 80px rgb(34 35 58 / 20%);
  padding: 2rem;
  border-radius: 2rem;
  transition: all 0.3s;
  display: flex;
  /* align-items: center; */
  gap: 5rem;
  width: 100%;
  overflow: hidden;
  /* height: 100%; */
}
.card-3::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 1rem;
  border-radius: 3rem;
  background: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
}
.card-3__img {
  flex-shrink: 0;
  width: 10rem;
  height: 10rem;
  box-shadow: 4px 13px 30px 1px rgb(252 56 56 / 20%);
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
}
.card-3__img img {
  width: 70%;
  height: 70%;
  object-fit: cover;
  display: block;
  transition: all 0.3s;
  z-index: 1;
}
.card-3__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.card-3__title {
  font-size: 3rem;
  font-weight: 700;
  color: var(--primary-color);
  /*font-family: "Style Script";*/
  text-transform: capitalize;
}
.card-3__title-sec {
  font-size: 1.6rem;
  font-weight: 600;
  color: #6351ce;
}
.card-3__title-sec p {
  margin-bottom: 0;
}
.card-3__text {
  color: #4e4a67;
  line-height: 1.5em;
}
.card-3__text p {
  margin-bottom: 2rem;
}
.card-3__btn {
  display: inline-flex;
  width: fit-content;
  background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
  padding: 1.2rem 2rem;
  border-radius: 5rem;
  color: #fff;
  box-shadow: 0px 14px 80px rgb(252 56 56 / 40%);
  text-decoration: none;
  font-weight: 700;
  justify-content: center;
  text-align: center;
  letter-spacing: 1px;
  align-items: center;
  gap: 1rem;
  font-size: 1.2rem;
}

/*------------------------------BaguetteBox------------------------------*/

#baguetteBox-overlay .full-image img {
  max-width: 90%;
  max-height: 90%;
  border: 6px double var(--secondary-color);
  border-radius: 1rem;
  box-shadow: var(--box-shadow-float);
}
.baguetteBox-button#close-button {
  background: rgb(212, 0, 0);
  border-radius: 50%;
  padding: 20px;
  border: 1px dashed white;
  box-shadow: var(--box-shadow-float);
}
.baguetteBox-button svg {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.baguetteBox-button svg g {
  stroke: white !important;
  stroke-width: 3 !important;
}
.baguetteBox-button#next-button,
.baguetteBox-button#previous-button {
  display: block !important;
  opacity: 0.8;
}
.baguetteBox-button#next-button polyline,
.baguetteBox-button#previous-button polyline {
  stroke: var(--secondary-color) !important;
}

/*------------------------------Gallery 1------------------------------*/

.gallery-1 {
  /* columns: 3 auto;
  column-gap: 2rem;
  margin-bottom: 2rem; */
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  align-items: center;
  justify-content: center;
  margin-bottom: 2rem;
}

.gallery-1__item {
  display: block;
  width: 100%;
  border: 5px double var(--primary-color);
  padding: 5px;
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
  border-radius: 5px;
  transition: all 0.25s ease-in-out;
  margin: auto;
}

.gallery-1__item__img {
  width: 100%;
  border-radius: 5px;
  transition: all 0.25s ease-in-out;
}

@media (max-width: 768px) {
  .gallery-1 {
    /*columns: 2 auto;*/
    grid-template-columns: repeat(2, 1fr);
  }
  .affiliation-section .gallery-1 {
    columns: 1 auto;
  }
}

.affiliation-section .gallery-1 {
    grid-template-columns: 33%;
}
.placement-partners-section .gallery-1 {
    grid-template-columns: repeat(6, 1fr);
}
@media (max-width: 768px) {
  .affiliation-section .gallery-1 {
    grid-template-columns: 50%;
  }
  .placement-partners-section .gallery-1 {
    grid-template-columns: repeat(2, 1fr);
  }
}


/*------------------------------Tab Section------------------------------*/

#tab-section {
  background: var(--bs-gray-400);
  padding: 1rem;
  border-radius: 2rem;
  transition: all 0.3s ease;
  height: 50rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#tab-items {
  display: flex;
  gap: 1rem;
}
#tab-items input {
  position: absolute;
  visibility: hidden;
  z-index: -1;
}
#tab-items label {
  background: var(--primary-color);
  color: white;
  opacity: 0.5;
  padding: 1rem;
  border-radius: 5px;
  position: relative;
  cursor: pointer;
  font-weight: 700;
  transition: all 0.3s ease;
  font-family: "Fredoka", serif;
  letter-spacing: 1px;
  font-size: 1.8rem;
}
#tab-items label i {
  margin-right: 1rem;
}
#tab-items label::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 0;
  bottom: -3rem;
  background: white;
  transition: all 0.3s ease;
}
#tab-items input:checked + label {
  background: white;
  color: var(--primary-color);
  opacity: 1;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
#tab-items input:checked + label::after {
  height: 3rem;
}

#tab-contents {
  list-style: none;
  flex: 1;
  background: rgb(255, 255, 255);
  padding: 4rem 3rem;
  box-shadow: var(--box-shadow-float);
  border-radius: 2rem;
  overflow-y: scroll;
  overflow-x: hidden;
  position: relative;
}
#tab-contents .tab-content {
  transition: all 0.5s ease;
  scale: 0;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 6rem);
}
#tab-contents .tab-content h1 {
  color: #6351ce;
  text-shadow: 1px 1px 1px var(--secondary-color);
  font-weight: 700;
  font-family: "Gabriela", serif;
  letter-spacing: 1px;
  margin-bottom: 2rem;
  font-size: 2.5rem;
}
#tab-contents .tab-content p {
  color: black;
  margin-bottom: 1rem;
}
#tab-contents .tab-content ul {
  color: black;
  list-style: decimal;
  padding-left: 2rem;
  margin-bottom: 1rem;
}

#tab-section:has(#tab-item-1:checked) #tab-content-1 {
  scale: 1;
}

#tab-section:has(#tab-item-2:checked) #tab-content-2 {
  scale: 1;
}

/*------------------------------Form------------------------------*/

.form-card {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  width: 100%;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 10px 20px 0 rgba(153, 153, 153, 0.25);
  padding: 0.75rem;
}

.form-card__heading {
  position: relative;
  z-index: 1;
  padding: 2rem;
  border-radius: 1rem;
  overflow: hidden;
}
.form-card__heading__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
.form-card__heading__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background: black;
  opacity: 0.2;
}
.form-card__heading__title {
  font-size: 2.5rem;
  font-weight: 700;
}
.form-card__heading__text {
  font-size: 1.8rem;
  color: white;
}

.form-card__body {
  padding: 2rem 1rem;
}

.form-card__action-btn {
  margin-left: auto;
  margin-top: 2rem;
}

.form-card__footer {
  padding: 1rem 1rem;
  text-align: center;
  font-size: 1.2rem;
  color: #8597a3;
}
.form-card__footer a {
  display: block;
  color: #6658d3;
  text-decoration: none;
}

/*------------------------------Profile------------------------------*/

.profile-section {
  background: white;
  margin: auto;
}

.profile-section__logo {
  width: 100%;
  height: auto;
  display: block;
  margin: 1rem auto;
  text-align: center;
}

.profile-section__logo img {
  width: 100%;
  height: auto;
}

.profile-header {
  padding: 0 2rem;
  display: flex;
  gap: 2rem;
  position: relative;
  z-index: 1;
  align-items: center;
  margin: 1rem 0;
}

.profile-header__img {
  width: 12rem;
  height: 14rem;
  border: 3px double black;
  box-shadow: var(--box-shadow-float);
  position: relative;
}

.profile-header__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.profile-header__text {
  flex: 1;
}

.profile-header__text-main {
  font-size: 2rem;
  font-weight: 700;
  margin: 0;
  color: #000;
}

.profile-header__text-sec {
  font-size: 1.8rem;
  margin: 0;
  color: #000;
}

.profile-body {
  padding: 2rem;
}

.profile-body__heading {
  color: #e11c26;
  font-size: 2rem;
  font-weight: 700;
}

table, td, th {
    border-color: gray !important;
}

td, th {
    padding: .8rem 1rem !important;
}

@media (max-width: 768px) {
  
}

@media print {
  body {
    background: none;
  }
  .profile-section {
      max-width: 100%;
  }
}

/*------------------------------Error------------------------------*/

.error-card {
  padding: 2rem 0;
  background: #fff;
  font-family: "Arvo", serif;
  width: 100%;
  max-width: 50rem;
  margin: auto;
  border-radius: 2rem;
  box-shadow: var(--box-shadow-float);
}

.error-card__top {
  position: relative;
}

.error-card__bg {
  width: 100%;
  height: auto;
}

.error-card__top h1 {
  font-size: 8rem;
  font-family: "Style Script", serif;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.error-card__content {
  text-align: center;
}

.error-card__content h1 {
  color: var(--primary-color);
}
.error-card__content p {
  color: var(--bs-gray-600);
}

.error-card__link {
  color: #fff !important;
  padding: 1rem 2rem !important;
  background: #39ac31 !important;
  margin: 2rem auto;
  display: inline-block;
}

.error-card__link:hover {
  color: #fff !important;
  background: #39ac31 !important;
}

/*------------------------------Heading 1------------------------------*/

.heading-1 {
  text-decoration: none !important;
  text-align: center;
  position: relative;
  width: max-content;
  margin: auto;
  margin-bottom: 5rem;
}

.heading-1__text {
  font-size: 2.5rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 0;
}

.heading-1__underline {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}

.heading-1__underline i {
  font-size: 2rem;
}

.heading-1__underline::before,
.heading-1__underline::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: calc(50% - 4rem);
  height: 0.5rem;
}

.heading-1__underline::before {
  left: 2rem;
}

.heading-1__underline::after {
  right: 2rem;
}

.heading-1--light .heading-1__text {
  color: white !important;
  text-shadow: 1px 1px 1px var(--bs-danger);
}

.heading-1--light .heading-1__underline {
  color: white !important;
}

.heading-1--light .heading-1__underline::before,
.heading-1--light .heading-1__underline::after {
  background: var(--secondary-color);
}

.heading-1--dark .heading-1__text {
  color: var(--primary-color) !important;
  text-shadow: 1px 1px 1px var(--bs-danger);
}

.heading-1--dark .heading-1__underline {
  color: var(--primary-color) !important;
}

.heading-1--dark .heading-1__underline::before,
.heading-1--dark .heading-1__underline::after {
  background: var(--secondary-color);
}

@media (max-width: 768px) {
  .heading-1__text {
    font-size: 2rem;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 700;
  }
}

/*------------------------------Heading 2------------------------------*/

.heading-2 {
  text-decoration: none !important;
  text-align: center;
  position: relative;
  width: max-content;
  margin-bottom: 5rem;
}

.heading-2__text {
  font-size: 3.5rem;
  letter-spacing: 1px;
  font-weight: 700;
  margin-bottom: 0;
  font-family: "Gabriela", serif;
}

.heading-2__text-sec {
  text-align: left;
  font-weight: 700;
}

.heading-2__text-sec i {
  margin-right: 1rem;
}

.heading-2__underline {
  height: 1rem;
  border-radius: 2rem;
  position: relative;
}

.heading-2__underline::before,
.heading-2__underline::after {
  content: "";
  position: absolute;
  height: 1.5px;
  left: 0.5rem;
}

.heading-2__underline::before {
  top: 3px;
  width: calc(100% + 2rem);
}

.heading-2__underline::after {
  top: 6px;
  width: calc(100% + 4rem);
}

/* .heading-2--light .heading-2__text {
  color: white !important;
  text-shadow: 2px 2px 2px var(--bs-danger);
}

.heading-2--light .heading-2__underline {
  color: white !important;
}

.heading-2--light .heading-2__underline::before,
.heading-2--light .heading-2__underline::after {
  background: var(--secondary-color);
} */

.heading-2--dark .heading-2__text {
  color: var(--primary-color) !important;
}

.heading-2--dark .heading-2__underline {
  background: var(--secondary-color) !important;
}

.heading-2--dark .heading-2__underline::before,
.heading-2--dark .heading-2__underline::after {
  background: var(--primary-color) !important;
}

/*------------------------------Miscellaneous------------------------------*/

/* BG */

.yellow-bg {
  background: url(../img/yellow-bg.png);
  background-size: cover;
  background-repeat: no-repeat
}


/* Img */

.img {
  position: relative;
  width: 100%;
  height: auto;
  padding: 2rem;
}

.img img {
  width: 100%;
  height: 100%;
  box-shadow: var(--box-shadow-float);
}

/* Icon Text */

.icon-text {
  display: flex;
  align-items: baseline;
  gap: 1.5rem;
}

.icon-text i {
  width: 2rem;
  text-align: center;
  position: relative;
  top: 2px;
}

/* Custom Btn */

/*.btn-custom {
  background-color: #3dd1e7;
  border: 0 solid #e5e7eb;
  box-sizing: border-box;
  color: #000000;
  display: flex;
  font-size: 1.4rem;
  font-weight: 700;
  justify-content: center;
  line-height: 1.75rem;
  padding: .95rem 1.65rem;
  position: relative;
  text-align: center;
  text-decoration: none #000000 solid;
  text-decoration-thickness: auto;
  width: 100%;
  max-width: 460px;
  position: relative;
  cursor: pointer;
  transform: rotate(-2deg);
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  width: fit-content;
  
  background: rgb(239,29,38);
  background: linear-gradient(128deg, rgba(239,29,38,1) 0%, rgba(15,2,3,1) 100%);
  color: white;
}

.btn-custom:disabled {
  background: rgb(239,29,38);
  background: linear-gradient(128deg, rgba(239,29,38,1) 0%, rgba(15,2,3,1) 100%);
  color: white;
  opacity: 1;
}

.btn-custom i {
  margin-right: 1rem;
}

.btn-custom:focus {
  outline: 0;
}

.btn-custom:after {
  content: "";
  position: absolute;
  border: 1px solid #000000;
  bottom: 4px;
  left: 4px;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
}

.btn-custom:hover:after {
  bottom: 2px;
  left: 2px;
}

.btn-custom:hover {
  background: rgb(239,29,38);
  background: linear-gradient(128deg, rgba(239,29,38,1) 0%, rgba(15,2,3,1) 100%);
  color: white;
}*/


/* Custom Btn */

.btn-custom {
  background-color: var(--primary-color);
  border: 1px solid var(--secondary-color);
  width: fit-content;
  color: white;
  border-radius: 5px;
  display: block;
  padding: 1rem 2rem;
  font-size: 1.2rem;
}

.btn-custom:disabled {
  background-color: var(--primary-color);
  border: 1px solid var(--secondary-color);
  width: fit-content;
  color: white;
  border-radius: 5px;
}

.btn-custom i {
  margin-right: 1rem;
}

.btn-custom:hover {
  background-color: var(--primary-color);
  border: 1px solid var(--secondary-color);
  width: fit-content;
  color: white;
  border-radius: 5px;
}


/* Fixed Btn */

.fixed-btn {
  width: 6.5rem;
  height: 6.5rem;
  padding: 0;
  position: fixed;
  border-radius: 1rem;
  border: none;
  z-index: 99;
  border-radius: 50%;
}

.fixed-btn:before {
  content: "";
  position: absolute;
  width: 110%;
  height: 110%;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  z-index: -1;
  transform: translate(-50%,-50%);
  background: red;
  opacity: 0.2;
}

.fixed-btn img {
  width: 100%;
  height: 100%;
  border: none;
}

.fixed-btn--bl {
  bottom: 1.5rem;
  left: 1.5rem;
}

.fixed-btn.whatsapp {
  bottom: 9rem;
}

.fixed-btn.fb {
  bottom: 16.5rem;
}

@media (max-width: 768px) {
    .fixed-btn {
      width: 5.5rem;
      height: 5.5rem;
    }
    .fixed-btn--bl {
      bottom: 1.5rem;
    }
    .fixed-btn.whatsapp {
      bottom: 8rem;
    }
    .fixed-btn.fb {
      bottom: 14.5rem;
    }
}


/* Round Btn */

.btn--round {
  border-radius: 50%;
  box-shadow: var(--box-shadow-float);
  height: 3rem;
  width: 3rem;
}


/*----------------------------Animations---------------------------------*/

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
  }
}