/*
Title: Custom Styles for Symbolic International School
Author: Raviraj Chougale
Web: https://ravirajchougale.com
*/
@import url("https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap");

.bg-gradient-light-primary {
  background: #ffefef; /* fallback for old browsers */
  background: -webkit-linear-gradient(
    to right,
    #ffffff,
    #ffefef
  ); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(
    to right,
    #ffffff,
    #ffefef
  ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.navbar-brand-logo {
  height: 96px;
  width: 96px;
  object-fit: contain;
  transition: all 0.25s ease-in-out;
}

.navbar-scrolled .navbar-brand-logo {
  height: 64px;
  width: 64px;
  transition: all 0.25s ease-in-out;
}

.navbar-scrolled .navbar-nav .nav-item.active .nav-link,
.navbar-scrolled .navbar-nav .show > .nav-link {
  color: rgba(255, 255, 255, 0.95) !important;
}

.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .nav-link.active {
  color: #f30000;
}

.navbar-dark .navbar-nav .show > .nav-link,
.navbar-dark .navbar-nav .nav-link.active {
  color: #f30000;
}

.navbar:not(.navbar-light) .navbar-nav .nav-item .nav-link {
  font-weight: 600 !important;
  color: #fff !important;
}

.navbar .navbar-nav .nav-item .nav-link.active {
  font-weight: 900 !important;
}

@media only screen and (max-width: 768px) {
  .navbar-toggler {
    background-color: var(--bs-primary);
    width: 50px;
    height: 50px;
    border-radius: 25px;
  }
  .navbar-toggler-icon {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAABmJLR0QA/wD/AP+gvaeTAAABGklEQVR4nO3aMUoDQRiG4W8UCyF4EbEOaOG5PIGN3kUvIKm8gOA5ggoWEsYmlewGFHd3kn2ednbhh59hmjcBAAAAAAA4bGXXYa31PMltkuskZ6NMdLjekqyS3JRSXvs+6l1IrfUiyXOSxf/PNmsfSS5LKS9dh0c7fryPZQxhkeSu77DzhtRaj5N8JjkZaKi5+0pyWkrZ/DzYdUOYQOdCtptbjTzLnDx13Y7Eoz6F9yRXv37Utz8skzwmWQ8z26yskzwkWfYtAwAAAAAAAAAA/kb9Ph71e6PU741RvzdI/b4v1O/TUL83RP3eCPU7AAAAAAAAAAADUb+PR/3eKPV7Y9TvDVK/7wv1+zTU7w1RvzdC/Q4AAAAAAJDkG/iDaUNvfvWoAAAAAElFTkSuQmCC") !important;
    background-repeat: no-repeat;
    background-position: center;
  }
}

@media only screen and (min-width: 992px) {
  .navbar-expand-lg .navbar-nav .nav-link {
    display: inline-block;
    position: relative;
    padding: 0.3rem 1rem !important;
  }

  .navbar .navbar-text {
    font-family: "Roboto Slab";
  }

  .navbar:not(.navbar-light) .navbar-text {
    color: var(--bs-light);
  }

  .nav-item
    .nav-link:is(.icon-link):not(.active):not(.dropdown-toggle):not(
      #phone-link
    ):hover {
    transform: scale(1.5);
    transition: transform 0.25s ease-in-out;
  }

  .nav-item
    .nav-link:is(.icon-link):not(.active):not(.dropdown-toggle):not(
      #phone-link
    ) {
    transform: scale(1);
    transition: transform 0.35s ease-in-out;
  }

  .nav-link::before {
    content: "";
    opacity: 0;
    position: absolute;
    border-radius: 2px;
    height: 50%;
    width: 100%;
    top: 50%;
    left: 0;
    background-color: #f30000;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: -1;
  }

  .navbar:is(.navbar-light)
    .navbar-nav
    .nav-item:hover
    .nav-link:not(.active):not(.icon-link):not(.dropdown-toggle) {
    color: #fff !important;
  }

  .nav-item:hover
    .nav-link:not(.active):not(.icon-link):not(.dropdown-toggle)::before {
    height: 100%;
    opacity: 1;
  }

  .nav-item:hover
    .nav-link:not(.active):not(.icon-link):not(.dropdown-toggle)::before {
    height: 100%;
    opacity: 1;
    color: #fff;
  }
}

/*------------------
WhatsApp Chat Button
------------------*/
.btn-whatsapp {
  border: none;
  outline: none;
  position: fixed;
  width: 70px;
  height: 70px;
  bottom: 40px;
  right: 40px;
  background-color: transparent;
  text-align: center;
}