*{
  padding: 0;
  margin: 0;
 }
/* Global Colors */

  /* Global Colors */
  :root {
    /* Background Color - This color is applied to the background of the entire website as well as individual sections. */
    --background-color: #ffffff;
  
    /* Default Color - This is the default color used for the majority of the text content. */
    --default-color: #364d59;
  
    /* Heading Color - This color is used for titles, headings and secondary elements. */
    --heading-color: #52565e;
  
    /* Accent Color - This is the main accent color that represents your brand on the website. It's used for buttons, links, and other elements that need to stand out. */
    --accent-color: #2c4459;
  
    /* Contrast Color - This is a color used for text when the background color is one of the heading, accent, or default colors. Its purpose is to ensure proper contrast and readability when placed over these more dominant colors. */
    --contrast-color: #ffffff;
  }
  
  /* Smooth scroll */
  :root {
    scroll-behavior: smooth;
  }
  
  /*--------------------------------------------------------------
  # General
  --------------------------------------------------------------*/
  body {
   
    background-color: var(--background-color);
  }
  
  a {
    color: var(--default-color);
    text-decoration: none;
    transition: 0.3s;
  }
  
  a:hover {
   
    text-decoration: none;
  }
  
  /* h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: MyCustomFontsemi;
  } */
  
 
/*--------------------------------------------------------------
# Sections & Section Header
--------------------------------------------------------------*/
section {
  padding: 60px 0;
  overflow: hidden;
}

 
/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/*--------------------------------------------------------------
# About Section
--------------------------------------------------------------*/


.about .section-title h2{
  color: #2C4459;
  font-family: 'poppins', sans-serif;
  font-weight: 600;
  font-size: 32px;
}
.about .section-title p{
  color: #2C4459;
  font-family: 'poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
}
.about h3 {
  color: #2C4459;
  font-family: 'oswald', sans-serif;
  font-weight: 600;
  font-size: 32px;
  /* margin-bottom: 20px; */
}

@media (max-width: 768px) {
  .about h3 {
    font-size: 22px;
  }
}

.about .nav-pills {
  border-bottom: 1px solid rgba(var(--color-secondary-rgb), 0.2);
}

.about .nav-pills li+li {
  margin-left: 40px;
}

.about .nav-link {
  background: none;
  font-size: 18px;
  font-weight: 700;
  color: var(--color-secondary);
  padding: 12px 0;
  margin-bottom: -2px;
  border-radius: 0;
  font-family: var(--font-secondary);
}

.about .nav-link.active {
  color: #5a5a5a;
  background: none;
  border-bottom: 3px solid #2c4459;
}

@media (max-width: 575px) {
  .about .nav-link {
    font-size: 16px;
  }
  .about .nav-pills li+li {
    margin-left: 30px;
  }
  .about .nav-link {
    background: none;
    font-size: 18px;
    font-weight: 400;
    color: #fff;
    text-align: center;
    border-radius: 10px;
    padding: 8px 0;
    margin-bottom: -2px;
    border-radius: 10;
    font-family: var(--font-secondary);
    width: 100%;
    background-color: #2C4459;
    margin-bottom: 1rem;
  }
  .about .nav-link.active {
    color: #ffffff;
    background-color: #2c4459;
    border-bottom: 5px solid #2C4459;
  }
}

.about .tab-content h4 {
  font-size: 18px;
  margin: 0;
  font-weight: 700;
  color: var(--color-secondary);
}

.about .tab-content p {
  font-size: 18px;
  margin-right: 8px;
  color: #333333;
}
.about .tab-content i {
  font-size: 22px;
  line-height: 0;
  margin-right: 8px;
  color: #2c4459;
}
.about #leadership-team-content i {
  font-size: 22px;
  line-height: 0;
  margin-right: 8px;
  color: #2c4459;
}

.about #Best-Practice-content i {
  font-size: 22px;
  line-height: 0;
  margin-right: 8px;
  color: #2c4459;
}
.about #Best-Practice-content h4 {
  font-size: 18px;
  margin: 0;
  font-weight: 700;
  color: var(--color-secondary);
}
.about .abouttgl{
  display: flex;
  justify-content: center;

}
#about .nav-pills .nav-link{
  font-size: 1.2rem;
  margin-right: 2.5rem;
 }
 @media (max-width :450px) {
  #about .nav-pills .nav-link{
    font-size: .9rem;
    margin-right: .8rem;
   }
 }
/*--------------------------------------------------------------
# services
--------------------------------------------------------------*/
#services2{
  height: auto;
  margin: 1rem 6%;
}
#services2 .nav-link {
  color: #fff;
  background-color: #2c4459;
  margin-bottom: 10px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  padding: 20px 20px;
}
#services2 .nav-link:hover {
    color:#ffffff;
}
#services2 .nav-link.active {
background-color: #5a5a5a;
color: rgb(255, 255, 255); /* Change text color to red */
}
@media (max-width : 450px) {
  #services2 .nav-link {
    color: #fff;
    background-color: #001f3f;
    margin-bottom: 10px;
    border-radius: 15px;
    padding: 15px 20px;
    border-bottom: 5px solid #2C4459;
    justify-content: center;
  }
  #services2 .nav-link:hover {
      color:#2c4459;
      font-weight: 600;
      transition: all 0.5s;
  }
  #services2 .nav-link.active {
  background-color: #2c4459;
  color: rgb(255, 255, 255); /* Change text color to red */
  }
}
.nav-link .icon {
  margin-right: 10px;
}
.nav-link .icon img{
  width: 2rem;
}
.nav-link .icon3 img{
  width: 1.3rem;
  margin-right: 10px;
}
.content {
  display: none;
}
.content.active {
  display: block;
}
.service-heading {
  font-weight: bold;
  font-size: 1.2em;
  margin-top: 20px;
}
.service-list {
  list-style-type: none;
  padding: 0;
}
.service-list li {
  margin-bottom: 5px;
}
.service-list li::before {
  content: '» ';
  color: #77AAFF;
  font-weight: bold;
}
#services2 .abouttgl{
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
  
}
#services2 .abouttgl a{
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
  color: #77AAFF;
}
 
/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer {
  color: var(--color-white);
  font-size: 14px;
}

.footer .footer-content {
  background: var(--color-secondary);
  padding: 60px 0 30px 0;
}

.footer .footer-content .footer-info {
  margin-bottom: 30px;
}

.footer .footer-content .footer-info h3 {
  font-size: 28px;
  margin: 0 0 20px 0;
  padding: 2px 0 2px 0;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
}

.footer .footer-content .footer-info h3 span {
  color: var(--color-primary);
}

.footer .footer-content .footer-info p {
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 0;
  font-family: var(--font-primary);
  color: var(--color-white);
}

.footer .footer-content h4 {
  font-size: 16px;
  font-weight: 600;
  color: var(--color-white);
  position: relative;
  padding-bottom: 12px;
  margin-bottom: 15px;
}

.footer .footer-content h4::after {
  content: "";
  position: absolute;
  display: block;
  width: 20px;
  height: 2px;
  background: var(--color-primary);
  bottom: 0;
  left: 0;
}

.footer .footer-content .footer-links {
  margin-bottom: 30px;
}

.footer .footer-content .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer .footer-content .footer-links ul i {
  padding-right: 2px;
  color: var(--color-white);
  font-size: 12px;
  line-height: 1;
}

.footer .footer-content .footer-links ul li {
  padding: 10px 0;
  display: flex;
  align-items: center;
}

.footer .footer-content .footer-links ul li:first-child {
  padding-top: 0;
}

.footer .footer-content .footer-links ul a {
  color: rgba(var(--color-white-rgb), 0.7);
  transition: 0.3s;
  display: inline-block;
  line-height: 1;
}

.footer .footer-content .footer-links ul a:hover {
  color: var(--color-white);
}

.footer .footer-content .footer-newsletter form {
  margin-top: 30px;
  background: var(--color-white);
  padding: 6px 10px;
  position: relative;
  border-radius: 4px;
}

.footer .footer-content .footer-newsletter form input[type=email] {
  border: 0;
  padding: 4px;
  width: calc(100% - 110px);
}

.footer .footer-content .footer-newsletter form input[type=email]:focus-visible {
  outline: none;
}

.footer .footer-content .footer-newsletter form input[type=submit] {
  position: absolute;
  top: 0;
  right: -2px;
  bottom: 0;
  border: 0;
  background: none;
  font-size: 16px;
  padding: 0 20px;
  background: var(--color-primary);
  color: var(--color-white);
  transition: 0.3s;
  border-radius: 0 4px 4px 0;
}

.footer .footer-content .footer-newsletter form input[type=submit]:hover {
  background: rgba(var(--color-primary-rgb), 0.85);
}

.footer .footer-legal {
  padding: 30px 0;
  background: var(--color-secondary-dark);
}

.footer .footer-legal .credits {
  padding-top: 4px;
  font-size: 13px;
  color: var(--color-white);
}

.footer .footer-legal .credits a {
  color: var(--color-primary-light);
}

.footer .footer-legal .social-links a {
  font-size: 18px;
  display: inline-block;
  background: rgba(var(--color-white-rgb), 0.1);
  color: var(--color-white);
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 4px;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

.footer .footer-legal .social-links a:hover {
  background: var(--color-primary);
  text-decoration: none;
}


/*--------------------------------------------------------------
# Frequently Asked Questioins
--------------------------------------------------------------*/
.faq {
  padding: 60px 0;
}

.faq .faq-list {
  padding: 0;
  list-style: none;
}


.faq .faq-list li {
  border-bottom: 1px solid #d9f1f2;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.faq .faq-list .question {
  display: block;
  position: relative;
  font-family: #3fbbc0;
  font-size: 18px;
  line-height: 24px;
  font-weight: 400;
  padding-left: 25px;
  cursor: pointer;
  color: #ffffff;
  transition: 0.3s;
  background-color: #001f3fd0;
  border-radius: 1rem;
}

/* .faq .faq-list i {
  font-size: 16px;
  position: absolute;
  left: 0;
  top: -2px;
} */

.faq .faq-list p {
  margin-bottom: 0;
  padding: 10px 0 0 25px;
}

.faq .faq-list .icon-show {
  display: none;
}

.faq .faq-list .collapsed {
  color: rgb(255, 255, 255);
  background-color: #001f3f;
  border-radius: 1rem;
}

.faq .faq-list .collapsed:hover {
  color: #77AAFF;
}

.faq .faq-list .collapsed .icon-show {
  display: inline-block;
  transition: 0.6s;
}

.faq .faq-list .collapsed .icon-close {
  display: none;
  transition: 0.6s;
}
 

/*--------------------------------------------------------------
# Pricing Section
--------------------------------------------------------------*/
.gallery {
  margin-top: 40px;
}

.gallery .gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}

.gallery .gallery-item img {
  transition: 0.3s;
}

.gallery .gallery-links {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: all ease-in-out 0.3s;
  background: rgba(0, 0, 0, 0.6);
  z-index: 3;
}

.gallery .gallery-links .preview-link,
.gallery .gallery-links .details-link {
  font-size: 20px;
  color: rgba(255, 255, 255, 0.5);
  transition: 0.3s;
  line-height: 1.2;
  margin: 30px 8px 0 8px;
}

.gallery .gallery-links .preview-link:hover,
.gallery .gallery-links .details-link:hover {
  color: #fff;
}

.gallery .gallery-links .details-link {
  font-size: 30px;
  line-height: 0;
}

.gallery .gallery-item:hover .gallery-links {
  opacity: 1;
}

.gallery .gallery-item:hover .preview-link,
.gallery .gallery-item:hover .details-link {
  margin-top: 0;
}

.gallery .gallery-item:hover img {
  transform: scale(1.1);
}

.glightbox-clean .gslide-description {
  background: #222425;
}

.glightbox-clean .gslide-title {
  color: rgba(255, 255, 255, 0.8);
  margin: 0;
}
/* Style the close button */
.lightbox-close {
  position: fixed;
  top: 10px;
  right: 20px;
  background: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  padding: 10px;
  cursor: pointer;
  font-size: 18px;
  z-index: 1000;
}