.iti-text {
  color: #006fb7;
  font-weight: bold;
  font-size: 20px;
  display: block;
  /* Forces 'ITI LIMITED' to be on its own line */
}

.gov-text {
  color: #006fb7;
  font-size: 16px;
  font-weight: bold;
  display: block;
  /* Forces 'ITI LIMITED' to be on its own line */
}

.header-container {
  display: flex;
  align-items: center;
}

.header-container > *:not(:last-child) {
  margin-right: 15px;
}

.header-container img {
  height: 65px;
  width: 65px;
}

#slider {
  margin-top: 0;
}

.pause-icon {
  background-color: #004085;
  /* Darker Blue */
  border: 2px solid #003d7a;
  /* Darker border color */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  color: #ffffff;
  /* White text for high contrast */
  font-size: 24px;
  border-radius: 4px;
  transition: all 0.3s ease;

}

.pause-icon:hover {
  background-color: #004080;
  /* Darker Blue on hover */
  border-color: #003d7a;
  /* Darker border */
  transform: scale(1.05);
}

.flash-news-container {
  display: flex;
  position: relative;
  width: 100%;
  /* background: #ffcc00; */
  padding: 10px;
  align-items: center;
}

.flash-news {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
}

.flash-news span {
  display: inline-block;
  animation: scrollText 15s linear infinite;
}

@keyframes scrollText {
  from {
    transform: translateX(100%);
  }

  to {
    transform: translateX(-100%);
  }
}

.flash-news-right {
  width: 250px;
  height: 50px;
  overflow: hidden;
  position: relative;
  font-weight: bold;
}

.flash-news-right div {
  position: absolute;
  width: 100%;
  animation: scrollVertical 15s linear infinite;
}

@keyframes scrollVertical {
  0% {
    transform: translateY(100%);
  }

  100% {
    transform: translateY(-100%);
  }
}

.carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
  pointer-events: none;
  position: relative;
  height: 100%;
  /* Ensures the image takes the full height of the container */

}



.footer-table {
  width: 100%;
  text-align: left;
}

.footer-table td {
  padding: 10px;
  vertical-align: top;
}

.govt-logos {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  background: #f8f9fa;
  padding: 15px;
  margin-top: 20px;
}

.govt-logos img {
  height: 40px;
  width: auto;
  max-width: 150px;
}

.nav-links a {
  text-decoration: none;

  margin-right: 15px;
}

.navbar {
  font-size: 0.9rem;
  font-weight: bold;
  white-space: normal;
  /* Allow wrapping  added on 09-02-2026 stqc purpose*/
  /*white-space: nowrap; this line deleted on 09-02-2026 because of stqc*/
}

.navbar-nav .nav-item {
  padding: 0 4px;
  /* Reduce horizontal padding */
}


/* Navbar background */
.navbar {
  background-color: #003366 !important;
}

.navbar-nav {
  flex-wrap: wrap;
}

.navbar-nav .nav-item {
  white-space: nowrap;
}

/* Menu text */
.navbar-nav .nav-link {
  color: #ffffff !important;
  font-weight: 500;
}

/* Hover */
.navbar-nav .nav-link:hover {
  color: #ffd700 !important;
}

/* Dark mode */
body.dark-mode .navbar {
  background: #000000 !important;
}

body.dark-mode .navbar-nav .nav-link {
  color: #ffff00 !important;
}

/* Dropdown Styling */
.dropdown-menu {
  background-color: #004080;
  border-radius: 5px;
}

.dropdown-item {
  color: white !important;
  font-size: 0.9rem;
  transition: 0.3s ease-in-out;
}

.dropdown-item:hover {
  background-color: white;
  color: black !important;
}


body.dark-mode {
  background-color: #121212;
  color: yellow !important;
}

body.dark-mode .bg-light {
  background-color: #333 !important;
}

body.dark-mode .bg-dark {
  background-color: #000 !important;
}

body.dark-mode .navbar-nav .nav-link,
body.dark-mode .navbar-nav .dropdown-item,
body.dark-mode .breadcrumb-item,
body.dark-mode .breadcrumb-item.active,
body.dark-mode .iti-text,
body.dark-mode .gov-text,
body.dark-mode p,
body.dark-mode h3,
body.dark-mode table,
body.dark-mode th,
body.dark-mode td,
body.dark-mode .nav-links a,
body.dark-mode .nav-links button,
body.dark-mode .nav-links input,
body.dark-mode .nav-links i,
body.dark-mode footer,
body.dark-mode footer .text-white,
body.dark-mode footer a,
body.dark-mode a,
body.dark-mode h5,
body.dark-mode h2,
body.dark-mode h4,
body.dark-mode h1,
body.dark-mode h6,
body.dark-mode span {
  color: yellow !important;
}

.dark-mode a:hover {
  color: #ffeb3b !important;
}

/* Dark Mode List Group (For Your List Items) */
body.dark-mode .list-group,
body.dark-mode .list-group-item {
  background-color: #222 !important;
  /* Dark background */
  color: yellow !important;
  /* Yellow text */
  border: 1px solid #444 !important;
  /* Subtle borders */
}

/* Highlighted Text in List */
body.dark-mode .list-group-item strong {
  color: #FFC107 !important;
  /* Gold/yellow color */
}

/* Hover Effect for List Items */
body.dark-mode .list-group-item:hover {
  background-color: #333 !important;
  /* Slightly lighter background */
  color: #FFD700 !important;
  /* Bright yellow */
}

body.dark-mode .table thead {
  background-color: #444;
}

body.dark-mode .table tbody tr {
  background-color: #222;
}

body.dark-mode footer a:hover {
  color: #ffcc00 !important;
  text-decoration: underline;
}

body.dark-mode .footer-table td {
  color: yellow !important;
}

body.dark-mode .nav-links input::placeholder {
  color: yellow !important;
}

body.dark-mode .nav-links button.btn-outline-secondary {
  border-color: yellow !important;
}

body.dark-mode .nav-links button.btn-outline-secondary:hover {
  background-color: yellow !important;
  color: black !important;
}

body.dark-mode .nav-links i.fas {
  color: yellow !important;
}

/* Dark Mode Dropdown */
body.dark-mode .dropdown-menu {
  background-color: #333 !important;
}

body.dark-mode .dropdown-item {
  color: yellow !important;
}

body.dark-mode .dropdown-item:hover {
  background-color: white !important;
  color: black !important;
}


/* Ensures the section takes full width */
#static-image {
  width: 100%;
  overflow: hidden;
  align-items: center;
  justify-content: center;
}

/* Ensures the image covers the entire section */
#static-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Makes sure the image scales properly */
}

.accordion-button {
  background-color: #f8f9fa;
  /* Light background */
  color: #333;
  /* Text color */
  font-size: 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
}

.accordion-button img {
  border-radius: 50%;
  border: 2px solid #ddd;
}

.accordion-button:hover {
  background-color: #e2e6ea;
}

.accordion-body {
  background-color: #fff;
  color: #333;
}

.accordion-body .d-flex {
  flex-wrap: wrap;
  /* Ensures content does not break on smaller screens */
}

.logo-list {
  list-style-type: none;
  /* Remove default list markers (bullets) */
  padding-left: 0;
}

.accordion-body img {
  max-width: 150px;
  height: auto;
  border-radius: 10px;
}

/* Dark Mode Specific Element Styles */
body.dark-mode .backCorporate {
  color: yellow !important;
  /* Yellow text for the header */
}

/* Dark Mode Accordion Button */
body.dark-mode .accordion-button {
  color: yellow !important;
  /* Yellow text color for accordion button */
  background-color: #333 !important;
  /* Dark background for accordion button */
  border-color: #444 !important;
  /* Subtle border color */
}

/* Dark Mode Accordion Item Content */
body.dark-mode .accordion-body {
  color: yellow !important;
  /* Yellow text inside accordion */
  background-color: #222 !important;
  /* Dark background for accordion content */
}

/* Dark Mode Image Border */
body.dark-mode .img-fluid {
  border: 2px solid yellow !important;
  /* Optional: yellow border around images */
}


/* Dark Mode List Group */
body.dark-mode .list-group,
body.dark-mode .list-group-item {
  background-color: #222 !important;
  /* Dark background for list group */
  color: yellow !important;
  /* Yellow text for list group */
  border: 1px solid #444 !important;
  /* Subtle border */
}


@media (min-width: 992px) {
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-left: 0 !important;
    /* Override padding-left with your own value */
  }
}

ul {
  margin: 0px;
  padding: 0px;
}

.footer-section {
  background: #151414;
  position: relative;
}

.footer-cta {
  border-bottom: 1px solid #373636;
}

.single-cta i {
  color: #ff5e14;
  font-size: 30px;
  float: left;
  margin-top: 8px;
}

.cta-text {
  padding-left: 15px;
  display: inline-block;
}

.cta-text h2 {
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 2px;
}

.cta-text span {
  color: white;
  font-size: 15px;
}

.cta-text span a {
  color: orange;
  font-size: 15px;
}

.footer-content {
  position: relative;
  z-index: 2;
}

.footer-pattern img {
  position: absolute;
  top: 0;
  left: 0;
  height: 330px;
  background-size: cover;
  background-position: 100% 100%;
}

.footer-logo {
  margin-bottom: 30px;
}

.footer-logo img {
  max-width: 200px;
}

.footer-text p {
  margin-bottom: 14px;
  font-size: 14px;
  color: white;
  line-height: 28px;
}

.footer-social-icon span {
  color: #fff;
  display: block;
  font-size: 20px;
  font-weight: 700;
  font-family: 'Poppins', sans-serif;
  margin-bottom: 20px;
}

.footer-social-icon a {
  color: #fff;
  font-size: 16px;
  margin-right: 15px;
}

.footer-social-icon i {
  height: 40px;
  width: 40px;
  text-align: center;
  line-height: 38px;
  border-radius: 50%;
}

.facebook-bg {
  background: #3B5998;
}

.twitter-bg {
  background: #55ACEE;
}

.youtube-bg {
  background: #DD4B39;
}

.linkedin-bg {
  background: blue;
}

.instagram-bg {
  background: #ee2a7b;
}

/* Common styling for all social media icons */
.social-icon {
  border-radius: 50%;
  /* Makes the image circular */
  object-fit: cover;
  /* Ensures the image scales properly without distortion */
}

/* Specific styling for Twitter icon (optional border) */

.footer-widget-heading h2 {
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
  position: relative;
}

.accordion-button:focus {
  background-color: #003366;
  /* Dark Blue background for focus */
  color: #ffffff;
  /* White text color for contrast */
  outline: 3px solid #003366;
  /* Dark Blue focus outline */
  box-shadow: none;
  /* Remove any default shadow to avoid unnecessary overlap */
}

.accordion-button {
  background-color: lightcyan;
  color: black;
  outline: 1px solid #003366;
  /* Dark Blue focus outline */
  box-shadow: none;
  /* Remove any default shadow to avoid unnecessary overlap */
}

/* Optional: Change background color and outline on hover */
.accordion-button:hover {
  background-color: #00509E;
  /* Lighter Blue background for hover */
  color: #ffffff;
  /* Ensure text remains white for contrast */
}

/* Optional: Change background color and outline on active */
.accordion-button:active {
  background-color: #003366;
  /* Dark Blue background for active */
  color: #ffffff;
  /* White text color */
}

.footer-widget-heading h2::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 2px;
  width: 50px;
  background: #ff5e14;
}

.footer-widget ul li {
  float: left;
  width: 50%;
  margin-bottom: 12px;
}

.footer-widget ul li a:hover {
  color: #ff5e14;
}

.footer-widget ul li a {
  color: white;
  text-transform: capitalize;
}

.subscribe-form {
  position: relative;
  overflow: hidden;
}

.subscribe-form input {
  width: 100%;
  padding: 14px 28px;
  background: #2E2E2E;
  border: 1px solid #2E2E2E;
  color: #fff;
}

.subscribe-form button {
  position: absolute;
  right: 0;
  background: #ff5e14;
  padding: 13px 20px;
  border: 1px solid #ff5e14;
  top: 0;
}

.subscribe-form button i {
  color: #fff;
  font-size: 22px;
  transform: rotate(-6deg);
}

.copyright-area {
  background: #202020;
  padding: 20px 0;
}

.copyright-text p {
  margin: 0;
  font-size: 14px;
  color: white;
}

.footer-links {
  list-style-type: none;
  /* Remove default list bullets */
  padding: 0;
  margin: 0;
}

.footer-links li {
  display: inline;
  /* Keeps the list items inline */
  margin-right: 10px;
  /* Adds some spacing between the list items */
}

.footer-links a {
  text-decoration: none;
  color: #ff5e14;
  /* Set the color for the links */
}

.footer-links a:hover {
  text-decoration: underline;
  /* Adds an underline on hover */
}

.footer-menu li {
  display: inline-block;
  margin-left: 20px;
}

.footer-menu li:hover a {
  color: #ff5e14;
}

.footer-menu li a {
  font-size: 14px;
  color: #878787;
}

/* Ensure images in the carousel stretch to fill the screen width and height properly */
#slider .carousel-inner {
  position: relative;
  width: 100%;
}

.carousel-inner1 {
  overflow: visible;
}

#slider .carousel-item img {
  width: 100%;
  height: 100%;
  /* Ensures images fill the height of the carousel */
  object-fit: cover;
  /* Maintains aspect ratio and covers the area */
}

/* Adjust controls and button positioning for the carousel */
/* .carousel-control-prev, .carousel-control-next {
  z-index: 2;
} */

.carousel-control-prev,
.carousel-control-next {
  position: absolute;
  /* Position the controls relative to the carousel container */
  top: 50%;
  /* Center them vertically */
  transform: translateY(-50%);
  /* Ensure they're vertically centered */
  padding: 0;
  /* Remove any extra padding */
  font-size: 24px;
  /* Adjust size of the control buttons */
  border-radius: 50%;
  /* Rounded shape for the buttons */

  z-index: 2;
  /* Ensure the controls appear above the carousel images */
  width: 40px;
  /* Control button width */
  height: 40px;
  /* Control button height */
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #000000;
  /* Darker Blue for better contrast */
  background-color: #000000;
  /* Black for maximum contrast */
  color: #ffffff;
  /* White text */
  border: 2px solid transparent;
  /* Transparent border, unless focused */
  opacity: 1;
}

.carousel-control-prev:focus,
.carousel-control-next:focus,
.pause-icon:focus {

  outline: 2px solid #ffcc00;
  /* Gold border for high contrast against dark buttons */
  outline-offset: 2px;
}

.carousel-control-prev:focus,
.carousel-control-next:focus,
.pause-icon:focus {
  color: #fff;
  /* Ensure text color remains white */
  color: #ffffff;
  /* White icon color */
  font-size: 24px;
}

/* Fix contrast for hidden text in carousel controls */
.carousel-control-prev .visually-hidden,
.carousel-control-next .visually-hidden {
  color: #ffffff !important;
}

/* Ensure button text and background have good contrast */
.carousel-control-prev,
.carousel-control-next,
.pause-icon {
  border: 2px solid transparent;
  /* Transparent border, unless focused */
}



/* #pauseButton {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2; 
  border: none;
  background: rgba(206, 204, 204, 0.5);
  padding: 10px;
  cursor: pointer;
} */

#pauseButton {
  position: absolute;
  /* Position the controls relative to the carousel container */
  top: 50%;
  /* Center them vertically */
  transform: translateY(-50%);
  /* Ensure they're vertically centered */
  padding: 0;
  /* Remove any extra padding */
  font-size: 24px;
  /* Adjust size of the control buttons */
  background-color: rgba(0, 0, 0, 0.5);
  /* Background color with some transparency */
  border-radius: 50%;
  /* Rounded shape for the buttons */
  color: #fff;
  /* Text color */
  z-index: 2;
  /* Ensure the controls appear above the carousel images */
  width: 40px;
  /* Control button width */
  height: 40px;
  /* Control button height */
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  /* Transparent border, unless focused */
}

/* #pauseButton:focus {
  outline: none;

  box-shadow: 0 0 5px 3px rgba(0, 0, 255, 0.6);

  background-color: rgba(0, 0, 0, 0.8);

  border-color: rgba(0, 0, 0, 0.8);

} */
#pause-btn:focus {
    background-color: #1372eb;
    border-color: #0b3d91; /* darker contrast */
    outline: none;
}

#pauseButton i {
  color: white;
  font-size: 24px;
}

/* General hover effect for images */
.hover-effect {
  position: relative;
  border: none;
  overflow: hidden;
  border-radius: 10px;
  /* Rounded corners */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background-color: white;
  /* White background for each image */
  width: 100%;
  /* Ensure the image fills the width of its container */
  height: 150px;
  /* Set a fixed height for all images */
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  /* Padding inside the white box */
}

/* Add a glowing background and zoom effect */
.hover-effect::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.7);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: -1;
  /* Place the glow behind the image */
}

/* Hover effect */
.hover-effect:hover {
  transform: scale(1.1);
  /* Zoom in slightly */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  /* Subtle shadow for the glow effect */
}

/* Glow effect on hover */
.hover-effect:hover::before {
  opacity: 1;
  /* Make the background glow appear */
}

/* Optional: Add hover text or animations */
.hover-effect img {
  transition: transform 0.3s ease;
}

.hover-effect:hover img {
  transform: scale(1.05);
  /* Slight zoom effect on the image */
}


.dark-mode .modal-content {
  background-color: #212529 !important;
  /* Dark Background */
  color: #ffc107 !important;
  /* Yellow Text */
  border: 1px solid #ffc107;
  /* Yellow Border */
}

.dark-mode .modal-header,
.dark-mode .modal-footer {
  background-color: #212529 !important;
  border-color: #ffc107 !important;
}

.dark-mode .modal-body {
  background-color: #212529 !important;
  color: #ffc107 !important;
}

/* Ensure close button is visible */
.dark-mode .btn-close {
  /* filter: invert(1); */ /* Removed for validator compatibility */
}

/* Adjust links */
.dark-mode a {
  color: #ffc107 !important;
}

.dark-mode a:hover {
  color: #ffeb3b !important;
}

/* Hide Google Translate UI Elements */
.goog-logo-link,
.goog-te-gadget,
.goog-te-banner-frame,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-te-menu-frame,
.goog-te-menu2,
.skiptranslate {
  display: none !important;
}

/* Hide Google Translate Bar */
body {
  top: 0px !important;
}

iframe.goog-te-banner-frame {
  display: none !important;
}

/* Button Style */
.translate-button {
  background-color: #007bff;
  color: white;
  padding: 10px 15px;
  border: none;
  cursor: pointer;
  font-size: 16px;
  margin: 10px;
  border-radius: 5px;
}

/* Card Layout */
.newcard-container {
  max-width: 100%;
  margin: 0 auto;
  padding: 20px;
}

/* Card Container with Flexbox */
.newcard-card-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px;
  margin-top: 50px;
}

/* Card Styles */
.newcard-card {
  flex: 1 1 calc(33.33% - 20px);
  /* Make each card take 1/3rd of the width minus gap */
  background: linear-gradient(45deg, #ff6f61, #d04e6d, #9c4f96);
  border-radius: 20px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  transition: all 0.5s ease;
  position: relative;
  text-align: center;
  padding: 20px;
  transform: translateY(0);
}

/* Hover Animation */
.newcard-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
}

/* Card Header with Flashy Text */
.newcard-card-header {
  background: rgba(0, 0, 0, 0.1);
  padding: 20px;
  border-radius: 15px;
  margin-bottom: 20px;
  transition: background 0.3s ease;
}

.newcard-card-header h3 {
  margin: 0;
  font-size: 1.8em;
  color: white;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

/* Image Styling */
/* Image Styling */
.newcard-card-image {
  width: 100%;
  /* Ensures the image takes up the full width of the card */
  height: 100%;
  /* Takes up the height of the container, without distortion */
  object-fit: cover;
  /* Keeps the image covering the area but without stretching */
  border-radius: 15px;
  margin-bottom: 20px;
  position: absolute;
  /* Position the image in the background of the card */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

/* Card Body */
/* Card Body */
.newcard-card-body {
  position: relative;
  z-index: 1;
  /* Ensures the text stays above the image */
  color: #fff;
  /* White text color for better contrast */
  font-size: 1.1em;
  margin-bottom: 20px;
  line-height: 1.5;
  opacity: 0.9;
  background-color: rgba(0, 0, 0, 0.7);
  /* Black background with slight transparency */
  padding: 15px;
  /* Adding padding for space inside the body */
  border-radius: 10px;
  /* Rounded corners for the body */
}

/* added for stqc purpose on 22-01-2026 */
.newcard-card-body1 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  z-index: 1;
  color: #fff;
  font-size: 1.1em;
  line-height: 1.5;
  opacity: 0.9;
  background-color: rgba(0, 0, 0, 0.7);
  padding: 15px;
  border-radius: 10px;
}

/* added for stqc purpose on 22-01-2026 */
.newcard-card-body2 {
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);

  z-index: 1;
  color: #fff;
  font-size: 1.1em;
  line-height: 1.5;
  opacity: 0.9;
  background-color: rgba(0, 0, 0, 0.7);
  padding: 15px;
  border-radius: 10px;
  width: calc(100% - 30px);
}

/* added for stqc purpose on 22-01-2026 */
.newcard-card-body1 p {
  font-size: 1em;
}

.newcard-card-body p {
  font-size: 1em;
}

/* Fancy Card Footer */
.newcard-card-footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.2);
  padding: 10px;
  text-align: center;
  border-radius: 15px;
}

.newcard-card-footer a {
  text-decoration: none;
  color: yellow;
  font-weight: bold;
  font-size: 1.1em;
  transition: color 0.3s ease;
}

.newcard-card-footer a:hover {
  color: #ecf0f1;
}

/* Ensure cards are responsive on smaller screens */
@media (max-width: 768px) {
  .newcard-card {
    flex: 1 1 calc(50% - 20px);
    /* 2 cards per row */
  }
}

@media (max-width: 480px) {
  .newcard-card {
    flex: 1 1 100%;
    margin: 10px 0; /* Adjusted margin for single column */
  }
}

/* Container for the entire list */

.servnewone {

  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  /* Allow images to wrap if the screen size is smaller */

  margin: 0;
  padding: 20px 0;
  list-style-type: none;
  /* Remove default list bullets */

  /* Create a transparent background with a slight color */
  /* background-color: rgb(235, 238, 241); Semi-transparent blue */

  /* Apply a frosted glass effect using backdrop-filter */
  /* backdrop-filter: blur(12px); */ /* Removed for validator compatibility */
  /* Apply blur behind the element for the glass effect */

  /* Add a slight border and a shadow for the glass effect */
  border-radius: 15px;
  /* Rounded corners */
  box-shadow: 0 4px 15px rgba(236, 3, 3, 0.87);
  /* Subtle shadow for depth */

  /* Optionally add some padding around the container */
  padding: 20px;

  /* Set a fixed position or relative positioning to ensure the backdrop-filter works */
  position: relative;


}

@keyframes moveRightToLeft {
  0% {
    transform: translateX(100%);
    /* Start from the right */
  }

  100% {
    transform: translateX(-100%);
    /* End at the left */
  }
}


/* Base styling for each list item */
.servnew {

  position: relative;
  padding: 0;
  width: 200px;
  height: 212px;
  max-width: 30%;
  margin: 10px;
  background-color: #fff;
  /* Default background color */
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.5s ease;
  display: flex;
  justify-content: center;
  /* Horizontally center the span */
  align-items: center;
  /* Vertically center the span */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* Add slight shadow */
  /* animation: moveRightToLeft 10s linear infinite; */
}


/* Image styling */
.servnew img {

  display: block;
  width: 100%;
  height: auto;
  border-radius: 3px;
  transition: transform 0.5s ease, opacity 0.5s ease;
  object-fit: cover;
  /* Ensure the images cover the entire space */
}

/* Hover effects for the list items */
.servnew:hover {
  transform: scale(1.05);
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
}

/* Hover effects for the images inside each list item */
.servnew:hover img {
  transform: scale(1.1);
  opacity: 0.9;
}

/* Unique background for each item */
.servnew.serv1 {
  background-color: white;
  /* White background for ISO 9001 */
}

.servnew.serv2 {
  background-color: white;
  /* White background for ITI Service */
}

.servnew.serv3 {
  background-color: white;
  /* White background for ISO 14001 */
}

/* Center the span inside each list item */
.servnew span {
  position: absolute;
  /* Absolute positioning */
  color: #222;
  font-weight: bold;
  font-size: 16px;
  background-color: rgba(255, 255, 255, 0.6);
  /* Slight transparent background */
  padding: 5px;
  border-radius: 5px;
  text-align: center;
  /* Center the text within the span */
  bottom: 10px;
  /* Position the text at the bottom */
  left: 50%;
  transform: translateX(-50%);
  /* Center the text horizontally */
}

/* Add a unique word to each service item */
.servnew.serv1 span::before {
  /* content: "ISO Certification"; Unique word for ISO 9001 */
  font-size: 18px;
  font-weight: bold;
  color: #0056b3;
  /* Unique color - Darkened for contrast */
}

.servnew.serv2 span::before {
  /* content: "Telecommunication Service"; Unique word for ITI */
  font-size: 18px;
  font-weight: bold;
  color: #c53030;
  /* Unique color - Darkened for contrast */
}

.servnew.serv3 span::before {
  /* content: "Environmental Management"; Unique word for ISO 14001 */
  font-size: 18px;
  font-weight: bold;
  color: #198754;
  /* Unique color - Darkened for contrast */
}



.VIpgJd-ZVi9od-aZ2wEe-wOHMyf {
  display: none;
}

.sitemap-menu {
  list-style: none;
  padding: 0;
}

.sitemap-menu li {
  margin: 8px 0;
}

.sitemap-menu a {
  text-decoration: none;
  color: #0056b3;
}

.sitemap-menu a:hover {
  text-decoration: underline;
}

.sitemap-submenu {
  margin-left: 20px;
  list-style-type: circle;
}

.display_none {
  display: none;
}

/* Search form inside navbar */
.search-form {
  max-width: 220px;
  /* prevent navbar overflow */
  width: 100%;
}

/* Search container */
.search-container {
  position: relative;
  width: 100%;
}

/* Search input */
.search-box {
  width: 100%;
  padding-right: 40px;
  /* space for button */
  border: 2px solid #444;
  background: #fff;
  color: #333;
}

/* Placeholder contrast */
.search-box::placeholder {
  color: #777;
}

/* Search button */
.search-button {
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  color: #198754;
  padding: 5px 8px;
}

#playPauseBtn {
  background-color: white;
  /* White background */
  /* color: #333; Dark text for contrast */
  /* border: 2px solid #333; Dark border to make the button stand out */
  padding: 10px 20px;
  /* Some padding for the button */
  font-size: 16px;
  /* Font size */
  /* scursor: pointer; Pointer cursor on hover */
  border-radius: 5px;
  /* transition: background-color 0.3s ease, color 0.3s ease; Smooth transition */
}

/* Hover effect for the Play/Pause button */
#playPauseBtn:hover {
  background-color: #ccc;
  /* Gray background on hover */
  color: white;
  /* White text when hovered */
}

.serc button:hover {
  background-color: #e2e2e2;
}


.searching .search-container {
  position: relative;
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
}

.searching input[type="text"] {
  width: 100%;
  padding: 8px 12px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

.searching button {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  padding: 8px 12px;
  background-color: transparent;
  color: #198754;
  border: none;
  cursor: pointer;
  font-size: 20px;
}

.searching button:hover {
  background-color: #e2e2e2;
}

.searching table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
}

.searching th,
.searching td {
  padding: 10px;
  text-align: left;
  border: 1px solid #ddd;
}

.searching th {
  background-color: #f2f2f2;
}

.searching a {
  color: #0056b3;
  text-decoration: none;
}

.searching a:hover {
  text-decoration: underline;
}





.class_font_size_captcha {
  font-size: 1.73em !important;
}

/* #generated-captcha 
{
text-decoration: line-through;
font-weight: bold;
text-align: center;
font-size: 20px;
background-color: #ede7f6;
border-radius: 6px;
border: none;
padding: 6px;
outline: none;
color: #1d1d1d;
width:120px;
} */

.blink-button {
  display: inline-block;
  text-align: center;
  font-size: 16px;
  padding: 12px 24px;
  color: #FFFFFF;
  /* White text */
  background-image: linear-gradient(45deg, #007A5E, #008C55);
  /* Adjusted Darker Green Gradient */
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 0 10px rgba(0, 140, 85, 0.7);
  /* Updated shadow with adjusted color */
  transition: all 0.3s ease-in-out;
  animation: glowing 1.5s infinite alternate;
}

.blink-button:hover {
  box-shadow: 0 0 20px rgba(0, 140, 85, 1);
  /* Updated hover shadow */
  transform: scale(1.05);
}

@keyframes glowing {
  0% {
    box-shadow: 0 0 5px rgba(0, 140, 85, 0.5);
  }

  100% {
    box-shadow: 0 0 20px rgba(0, 140, 85, 1);
  }
}


.error {
  color: red;
  font-size: 0.875rem;
  margin-top: 5px;
}

a {
  color: #0056b3;
  /* Higher contrast blue */
}

.bg-light {
  background-color: #e0e0e0;
  /* Darker gray */
}

span,
footer,
header {
  color: #333;
  /* Darker text for better readability */
}

.btn-outline-secondary {
  color: #0056b3;
  /* Darker blue */
  border-color: #0056b3;
  /* Ensure border is visible */
}

.btn-outline-secondary:hover {
  background-color: #0056b3;
  color: #fff;
  /* White text for high contrast */
}

.footer-section {
  background-color: #222;
  /* Dark background */
  color: #fff;
  /* Light text for contrast */
}


/* Ensure buttons & links have enough touch area */
.touch-target {
  display: inline-block;
  padding: 12px 16px;
  /* Increases clickable area */
  font-size: 16px;
  /* Improves readability */
  border-radius: 5px;
  /* Optional: improves aesthetics */
}

/* Add spacing between touch targets */
.touch-target+.touch-target {
  margin-top: 8px;
  /* Adds spacing between buttons */
}

#external-link-one {
  text-decoration: none;
}

#external-link-two {
  text-decoration: none;
}


.external-link-two {
  width: 40px;
}

#external-link-three {
  text-decoration: none;
}

#external-link-four {
  text-decoration: none;
}

#external-link-five {
  text-decoration: none;
}

/* Improve button size and spacing */
.btn {
  padding: 12px 20px;
  /* Increase padding for better touchability */
  font-size: 16px;
}

/* Improve Contact Box */
.contact-box {
  border: 1px solid #bde3fb;
  padding: 15px;
  border-radius: 8px;
  margin-top: 10px;
  /* Adds spacing */
}

/* Increase touch target size for phone and email */
.contact-box a {
  font-size: 16px;
  /* Larger text */
  padding: 8px 0;
  /* More spacing */
}


.centering {
  text-align: center;
}

.example-imagen {
  width: 300px;
  height: 250px;
}


.example-imagenn {
  width: 200px;
  height: 150px;
}


.example-imagennn {
  width: 200px;
  height: 150px;
}


.example-imagek {
  width: 200px;

}

.example-imageu {
  width: 400px;

}


.example-imageuk {
  width: 300px;
  height: 200px;

}

.img_size {
  width: 250px;
}

.logo-img {
  width: 115px;
  /* Adjust as needed */
  height: auto;
  max-width: 100%;
  transition: transform 0.2s ease-in-out;
}

.logo-img:hover {
  transform: scale(1.1);
  /* Slight zoom effect on hover */
}

/* Button Styling */
#translate-btn {
  background-color: #0056b3;
  color: white;
  border: none;
  padding: 8px 15px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 5px;
}

#translate-btn:hover {
  background-color: #0056b3;
}

/* Hide Google Translate UI */
.goog-te-banner-frame,
.goog-te-gadget-simple {
  display: none !important;
}


@media print {

  /* Ensure body takes full width */
  body {
    width: 100%;
  }

  /* Ensure the navbar is always visible */
  .navbar,
  .menu-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    /* Prevents items from disappearing */
    justify-content: center !important;
    align-items: center !important;
    background: #fff !important;
    color: #000 !important;
    padding: 10px;
    border-bottom: 1px solid #000;
    width: 100%;
  }

  /* Ensure nav items appear properly */
  .navbar-nav {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    /* Ensures all items stay visible */
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
  }

  /* Hide submenus (dropdowns) */
  .navbar-nav .dropdown-menu {
    display: none !important;
    /* Hide dropdowns in print */
  }

  /* Ensure nav links appear inline */
  .navbar-nav .nav-item {
    display: inline-block !important;
    margin: 5px 10px;
    /* Add spacing for better visibility */
  }

  /* Ensure nav links print properly */
  .navbar-nav .nav-link {
    color: #000 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    white-space: normal;
    /* word-break: break-word; */
    overflow-wrap: break-word;

    line-height: 1.4;
  }

  /* Force navbar items to stay visible even if they overflow */
  .navbar-collapse {
    display: block !important;
    width: 100% !important;
    overflow: visible !important;
  }

  /* Hide unnecessary elements */
  .sidebar,
  .ads,
  .no-print,
  .footer,
  .btn {
    display: none !important;
  }
}

.controlsing {
  margin-top: 10px;
  text-align: center;
}

/* Highlighted Heading (Left Bottom) */
.carousel-highlight {
  position: absolute;
  bottom: 15%;
  /* Adjusted to be separate from content */
  left: 0%;
  /* Align left */
  background-color: rgba(192, 192, 192, 0.67);
  color: #003366;
  font-size: 16px;
  padding: 10px 15px;
  border-radius: 5px;
  font-weight: bold;
  text-shadow:
    1px 1px 4px #FFF,
    0px 0px 4px #FFF,
    1px 1px 4px #FFF,
    0px 0px 4px #FFF;

  border: 1px solid #ccc;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

/* added for stqc purpose on 22-01-2026 */
.carousel-highlight1 {
  position: absolute;
  top: 15px;
  /* distance from top */
  right: 15px;
  /* distance from right */
  left: auto;
  /* remove left positioning */
  bottom: auto;
  /* remove bottom positioning */

  background-color: rgba(192, 192, 192, 0.67);
  color: #003366;
  font-size: 16px;
  padding: 10px 15px;
  border-radius: 5px;
  font-weight: bold;
  text-shadow:
    1px 1px 4px #FFF,
    0px 0px 4px #FFF,
    1px 1px 4px #FFF,
    0px 0px 4px #FFF;
  border: 1px solid #ccc;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  z-index: 10;
}


/* Footer text at bottom */
.carousel-footer {
  position: absolute;
  bottom: 0%;
  /* Separate from the highlighted heading */
  left: 0%;
  width: 100%;
  background: rgba(255, 255, 255, 0.85);
  padding: 0px;
  border-radius: 8px;
  color: #333;
  font-size: 1rem;
  font-weight: 500;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
}

/* Read More Button */
.read-more {
  display: inline-block;
  margin-top: 5px;
  padding: 6px 12px;
  background: #004085;
  color: #FFD700 !important;
  /* Gold - High contrast on dark backgrounds */
  font-weight: bold;
  text-decoration: none;
  border-radius: 3px;
  font-weight: bold;
}

.read-more:hover {
  background: #0056b3;
  text-decoration: none;
}

/* Responsive Design */
@media (max-width: 768px) {
  .carousel-highlight {
    font-size: 1rem;
    padding: 8px;
  }

  .carousel-footer {
    width: 95%;
    font-size: 0.9rem;
    padding: 10px;
  }
}


/* Ensure text contrast meets WCAG 2.1 (4.5:1) */
body {
  color: #333;
  /* Darker gray */
  background-color: #fff;
  /* White */
}

/* High-contrast headings */
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000;
  /* Black */
}

/* Improve contrast for buttons */
.btn-primary {
  background-color: #0056b3;
  /* Darker blue */
  color: #ffffff;
  /* White */
}

/* High-contrast links */
a {
  color: #004080;
  /* Dark blue */
  text-decoration: underline;
}

/* a:hover, a:focus { */
/* color: #00264d;  Even darker blue */
/* } */

/* Improve contrast for footer text */
footer {
  background-color: #222;
  /* Darker background */
  color: #ddd;
  /* Lighter text */
}

/* Improve contrast for carousel captions */
.carousel-caption {
  background: rgba(255, 255, 255, 0.9);
  /* More opaque */
  color: #111;
  /* Darker text */
}

/* Ensure form placeholders are readable */
input::placeholder {
  color: #555;
  /* Darker placeholder text */
}

.text-primary {
  color: #0056b3 !important;
  /* Darker blue for better contrast */
}

.sitemap-menu a {
  color: #212529 !important;
  /* Darker text color */
}

.btn-primary {
  background-color: #004085;
  /* Darker blue for better contrast */
  color: #FFFFFF;
  /* Ensures white text on dark background */
  border: 1px solid #002752;
  /* Slightly darker border */
  padding: 10px 20px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 5px;
}

.btn:focus {
  outline: 2px solid #0066cc;
  /* Blue focus outline */
  outline-offset: 4px;
  /* Space between the outline and element */
}

.verify-btn {
  background-color: #004085;
  /* Darker blue for better contrast */
  color: #FFFFFF;
  /* Ensures white text on dark background */
  border: 1px solid #002752;
  /* Slightly darker border */
  padding: 10px 20px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 5px;
}

.verify-btn:hover {
  background-color: #002752;
  /* Darker shade on hover */
}

.tabs {
  display: flex;
  /* gap: 8px; */ /* Removed for validator compatibility */
}

button[role="tab"] {
  padding: 10px;
  margin-right: 8px; /* Fallback for gap */
  border: none;
  background: lightgray;
  cursor: pointer;
}

button[role="tab"][aria-selected="true"] {
  background: darkgray;
}

[role="tabpanel"] {
  padding: 10px;
  border: 1px solid #ccc;
  margin-top: 5px;
}

.footer-links {
  list-style: none;
  padding: 0;
  display: flex;
  gap: 10px;
  /* Space between items */
  justify-content: center;
  /* Center-align if needed */
  text-decoration: underline;
  text-decoration-color: #ff5e14;
}

.footer-links li {
  display: inline;
}

.footer-links li:not(:last-child)::after {
  content: "|";
  margin-left: 10px;
  color: #666;
  /* Adjust color if needed */
}

/* Highlight when focused */
#main-content:focus {
  outline: 3px solid #007bff;
  /* Blue outline for visibility */
}

.text-justify {
  text-align: justify;
}

/* Ensure a minimum touch target size */
.sub-menu li a {
  display: block;
  /* Ensures the whole area is clickable */
  padding: 12px 16px;
  /* Increase padding for better touch accessibility */
  font-size: 16px;
  /* Make text more readable */
  text-decoration: none;
  border-radius: 5px;
  /* Optional: Improve tap experience */
}

/* Improve spacing between items */
.sub-menu li {
  margin-bottom: 5px;
  /* Add spacing between links */
}

/* Optional: Highlight on hover for better feedback */
.sub-menu li a:hover {
  background-color: #0056b3;
  color: white;
}

.captcha-container {
  display: flex;
  align-items: center;
  justify-content: start;
  max-width: 300px;
  /* Adjust as needed */
}

.icon-box {
  width: 60px;
  /* Adjust width */
  text-align: center;
}

.icon-box a {
  font-size: 20px;
  /* Adjust icon size */
}

/* Ensure the Close button has sufficient contrast for the focus state */
.btn-close:focus {
  outline: 2px solid #0056b3 !important;
  /* A color with good contrast */
  outline-offset: 2px !important;
  /* Adds space between the button and the outline */
  box-shadow: 0 0 0 0.25rem rgba(0, 86, 179, 0.25) !important;
  /* Adds a subtle focus shadow */
}

/* Optional: Adjust the background of the button on focus for better visibility */
.btn-close:focus {
  /* background-color: transparent !important;
  /* Keeps the original look */
  /* border-color: transparent !important;  */
  /* Keeps the original border color */
    background-color: #1372eb;
    border: 1px solid #0b3d91; /* darker border */
}

/* If you want to ensure the text is also visible on focus, consider changing the icon color */
.btn-close:focus svg {
  fill: #ffffff !important;
  /* Ensures the 'X' remains visible */
}

.tabs ul {
  list-style: none;
  /* Remove default list styling */
  padding: 0;
  margin: 0;
  display: flex;
  /* Make list items align in a row */
  gap: 10px;
  /* Add spacing between buttons */
}

.tabs li {
  display: inline-block;
  /* Ensures list items stay in a row */
}

.tabs button {
  padding: 10px 15px;
  border: 1px solid #ccc;
  background-color: #f9f9f9;
  cursor: pointer;
  transition: background 0.3s ease;
}

/* .tabs button[aria-selected="true"] {
  background-color: #0056b3;
  color: white;
  border-color: #0056b3;
} */
.tabs button[aria-selected="true"] {
  background-color: #0056b3;
  color: #fff;
  border: 1px solid #003f80; /* darker shade */
}
.tabs button:hover {
  background-color: #ddd;
}

/* Improve focus visibility for accessibility */
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link:focus-visible,
.navbar-toggler:focus {
  outline: 2px solid #FFD700;
  /* Gold outline for high contrast */
  outline-offset: 2px;
  background-color: rgba(255, 255, 255, 0.2);
  /* Slight highlight */
}

/* Improve dropdown focus styles */
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:focus-visible {
  background-color: #0056b3 !important;
  /* Darker blue background */
  color: #ffffff !important;
  /* White text */
  outline: 2px solid #FFD700;
  /* High contrast outline */
  outline-offset: 2px;
}

/* Improve focus visibility for dropdown links */
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:focus-visible {
  background-color: #004085 !important;
  /* Dark blue background */
  color: #ffffff !important;
  /* White text */
  outline: 2px solid #FFD700 !important;
  /* Gold outline for high contrast */
  outline-offset: 2px;
}

/* Ensure hover state doesn't interfere with focus */
.dropdown-menu .dropdown-item:hover {
  background-color: #0056b3 !important;
  /* Slightly lighter blue */
  color: #ffffff !important;
}

.container.d-flex {
  flex-wrap: wrap;
}

@media (max-width: 400px) {
  .header-container {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .nav-links {
    flex-direction: column;
    gap: 8px;
  }

  .search-container {
    flex-direction: column;
    width: 100%;
  }

  .search-box {
    width: 100%;
    margin-bottom: 5px;
  }
}

.search-box {
  min-width: 100%;
  max-width: 100%;
}

.search-button {
  flex-shrink: 0;
}

.highlight-new {
  background-color: #e8f5e9;
  color: #155724;
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: bold;
  display: inline-block;
  font-size: 0.85rem;
}

.overlay-text {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 48%;
  background: rgba(255, 255, 255, 0.97);
  padding: 40px 30px;
  box-sizing: border-box;
  color: #000;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 2;
  overflow: hidden;
  /* Prevent text from overflowing */
}

.overlay-text h2 {
  font-size: 2.2rem;
  color: #0056b3;
  margin-bottom: 20px;
  text-align: center;
  line-height: 1.2;
}

.overlay-text h2 span:first-child {
  display: block;
  font-size: 2.2rem;
  color: #333;
  letter-spacing: 1px;
}

.overlay-text h2 span:last-child {
  display: block;
  font-size: 3.5rem;
  color: #0056b3;
  letter-spacing: 2px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}


.overlay-text .row>div {
  padding: 0 10px;
}

.overlay-text ul {
  padding-left: 20px;
  margin-bottom: 20px;
}

.overlay-text ul li {
  margin-bottom: 8px;
  font-size: 15px;
}

.contact {
  font-size: 13px;
  line-height: 1.5;
  border: 1px solid #007bff;
  padding: 10px;
  border-radius: 5px;
  background: #fff;
}

@media (max-width: 768px) {


  .overlay-text {
    position: static;
    width: 100%;
    background: #fff;
    padding: 20px;
    max-width: none;
    /* Remove max-width for mobile */
  }

  .overlay-text h2 {
    font-size: 2.2rem;
  }

  .overlay-text h2 span:first-child {
    font-size: 2.5rem;
  }

  .overlay-text h2 span:last-child {
    font-size: 2.8rem;
  }
}

@media (min-width: 768px) and (max-width: 1200px) {
  .overlay-text {
    width: 60%;
  }
}

@media (max-width: 480px) {
  .overlay-text {
    width: 100%;
    padding: 15px;
  }

  .overlay-text h2 {
    font-size: 1.8rem;
  }

  .overlay-text h2 span:first-child {
    font-size: 2rem;
  }

  .overlay-text h2 span:last-child {
    font-size: 2.3rem;
  }
}


.specs-contact-section {
  padding: 2rem;
  border-radius: 12px;
  margin-top: -1rem;
}

.spec-list {
  list-style-type: none;
  padding-left: 0;
  margin-bottom: 1rem;
}

.spec-list li {
  padding: 0.4rem 0;
  font-size: 1rem;
  font-weight: 500;
  color: #0b3e72;
  position: relative;
}

.spec-list li::before {
  content: "✔";
  color: #0056b3;
  margin-right: 0.6rem;
  font-weight: bold;
}


.carousel-footer {
  position: relative;
  /* or remove position if not needed */
  margin-top: 1rem;
  padding-top: 1rem;
  background-color: transparent;
}

.carousel-item {
  overflow-y: auto;
  max-height: 100vh;
  /* Or custom height */
}

/*added STQC purpose*/
.carousel-item1 {
  height: auto !important;
  min-height: 100%;
}

.carousel-footer-full {
  width: 100%;
  background-color: #f8f9fa;
  padding: 1rem 2rem;
  font-size: 1rem;
  border-top: 1px solid #dee2e6;
}

.carousel-footer-full a {
  /* color: #0d6efd; */
  color: #0056b3;
  text-decoration: underline;
}

.spec-list {
  list-style-type: disc;
  padding-left: 1.5rem;
  font-size: 0.95rem;
}

/* Contact Details Box */
.contact-details {
  padding: 1.5rem;
  border-radius: 10px;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #003b5c;
  margin-top: 1.5rem;
}

/* Section Heading (H2) */
.slider_heading {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 1rem;
  color: #004e89;
  border-bottom: 2px solid #007bff;
  padding-bottom: 0.4rem;
  display: inline-block;
}

.blue_grad1 {
  background-image: linear-gradient(to bottom right,
      #e6f3fd 0%,
      /* Top-left - white */
      #ffffff 30%,
      /* Middle-left - white */
      #cce7f9 70%,
      /* Middle-right - light blue */
      #e6f3fd 100%
      /* Bottom-right - lighter blue */
    );
}

.blue_grad {

  background: url('../../sliders/slider_background_img.png') no-repeat center center;
  background-size: cover;

}

.dark-mode .specs-contact-section {
  background-color: #1e1e2f;
  color: #e0e0e0;
}

.dark-mode .spec-list li {
  color: #a0c4ff;
}

.dark-mode .spec-list li::before {
  color: #58a6ff;
}

.dark-mode .carousel-footer {
  background-color: #2c2c3a;
}

.dark-mode .carousel-footer-full {
  background-color: #1f1f2d;
  color: #ccc;
  border-top: 1px solid #444;
}

.dark-mode .carousel-footer-full a {
  color: #4aa8ff;
}

.dark-mode .contact-details {
  background-color: #2a2a3a;
  color: #d0d0e0;
}

.dark-mode .slider_heading {
  color: #66b2ff !important;
  border-bottom: 2px solid #4aa8ff !important;
}

/* Additional Dark Mode Contrast Fixes */
body.dark-mode #search-box,
body.dark-mode .serc input[type="text"] {
  background-color: #333 !important;
  color: yellow !important;
  border-color: #555 !important;
}

body.dark-mode .serc button {
  color: yellow !important;
}

body.dark-mode .servnew {
  background-color: #222 !important;
  border: 1px solid #444;
}

body.dark-mode .servnew span {
  background-color: rgba(0, 0, 0, 0.8) !important;
  color: yellow !important;
}

body.dark-mode .hover-effect {
  background-color: #222 !important;
}

body.dark-mode .contact {
  background-color: #222 !important;
  border-color: yellow !important;
  color: yellow !important;
}

body.dark-mode .carousel-highlight,
body.dark-mode .carousel-highlight1,
body.dark-mode .carousel-caption {
  background-color: rgba(0, 0, 0, 0.85) !important;
  color: yellow !important;
  border-color: yellow !important;
  text-shadow: none !important;
}

body.dark-mode .highlight-new {
  background-color: #333 !important;
  color: yellow !important;
  border: 1px solid #555;
}

body.dark-mode .tabs button {
  background-color: #333 !important;
  border-color: #555 !important;
  color: yellow !important;
}

body.dark-mode .tabs button[aria-selected="true"] {
  background-color: #0056b3 !important;
  color: white !important;
}

body.dark-mode .footer-menu li a,
body.dark-mode .cta-text span a {
  color: yellow !important;
}

.footer-links a {
  color: #fff;
  text-decoration: none;
}

.footer-links a:hover {
  text-decoration: underline;
}

/*New*/
.useful-links-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 60px;
}

.footer-links-list {
  list-style: disc;
  padding-left: 18px;
  margin: 0;
}

.footer-links-list li {
  display: list-item;
  /* IMPORTANT */
  margin-bottom: 8px;
  white-space: normal;
  /* prevents inline wrapping */
}

.footer-links-list a {
  color: #fff;
  text-decoration: none;
}

.footer-links-list a:hover {
  text-decoration: underline;
}

/* ===============================
   FOOTER CLEAN-UP (OVERRIDES)
   =============================== */

/* Disable legacy float-based footer layout */
.footer-widget ul li {
  float: none !important;
  width: auto !important;
}

/* Use grid ONLY for useful links */
.useful-links-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 40px;
}

/* Clean list appearance */
.useful-links-grid ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.useful-links-grid li {
  margin-bottom: 8px;
  position: relative;
  padding-left: 14px;
}

/* Subtle arrow instead of bullet */
.useful-links-grid li::before {
  content: "\27A4";
  position: absolute;
  left: 0;
  color: #ff5e14;
}

/* Footer text consistency */
.footer-section {
  background-color: #151414;
  color: #dcdcdc;
}

.footer-widget h2 {
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 14px;
}

.footer-widget p {
  font-size: 13px;
  color: #cfcfcf;
}

/* Links calm down */
.footer-section a {
  color: #ffffff;
  text-decoration: none;
}

.footer-section a:hover {
  color: #ff5e14;
  text-decoration: underline;
}

/* Nudge Call Us slightly toward center */
.footer-cta .col-xl-4:nth-child(2) {
  padding-left: 25px;
}

/* Shift Useful Links slightly right */
.footer-content .col-xl-5 {
  padding-left: 30px;
}

/* Shift CIN / Visitors slightly right */
.footer-content .col-xl-4 {
  padding-left: 35px;
}

/* ===============================
   FORCE USEFUL LINKS INTO 2 COLUMNS
  
   =============================== */

.footer-widget ul {
  column-count: 2;
  column-gap: 50px;
}

/* Ensure list items behave correctly in columns */
.footer-widget ul li {
  float: none !important;
  width: auto !important;
  break-inside: avoid;
  margin-bottom: 6px;
}

/* Keep bullets aligned properly */
.footer-widget ul {
  padding-left: 18px;
}

/* ---- Footer visual polish (optional) ---- */

/* Slightly reduce visual density of Useful Links */
.footer-widget ul li {
  margin-bottom: 6px;
  font-size: 13.5px;
}

/* Soften right column */
.footer-widget h2 {
  font-size: 16px;
}

.footer-widget p {
  font-size: 13px;
  color: #d0d0d0;
}

/* Give Follow Us icons a bit more breathing space */
.footer-social-icon {
  margin-top: 10px;
}

.footer-social-icon a {
  margin-right: 12px;
}

/* Ensure all text-based icons (FontAwesome) inherit the yellow color */
body.dark-mode i,
body.dark-mode .fas,
body.dark-mode .fab {
  color: #FFCC00 !important;
}

/* Fix for form inputs and search boxes which often stay white */
body.dark-mode input[type="text"],
body.dark-mode .search-container input {
  background-color: #1e1e1e !important;
  color: #FFCC00 !important;
  border: 1px solid #FFCC00 !important;
}

/* Fix for Button Contrast (Buttons often keep their blue background) */
body.dark-mode .btn-primary,
body.dark-mode .verify-btn,
body.dark-mode .read-more {
  background-color: #FFCC00 !important;
  color: #000000 !important;
  /* Black text on yellow button */
  border: none !important;
}

/* Fix for Table Headers */
body.dark-mode th {
  background-color: #333333 !important;
  color: #FFCC00 !important;
  border: 1px solid #444 !important;
}


/* Fix for the News Ticker / Flash News */
body.dark-mode .news-ticker-area,
body.dark-mode .ticker-wrapper,
body.dark-mode .ticker-title {
  background-color: #FFCC00 !important;
  /* Gold background for the container */
  color: #000000 !important;
  /* Black text for maximum contrast (21:1) */
  border: 1px solid #FFCC00 !important;
}

/* Ensure the links inside the ticker are also high contrast */
body.dark-mode .ticker-content a,
body.dark-mode #js-news i,
body.dark-mode .ticker-content span {
  color: #000000 !important;
  /* Black text on gold background */
  font-weight: bold !important;
}

/* Pause/Play Button Visibility */
body.dark-mode #playPauseBtn {
  background-color: #000000 !important;
  color: #FFCC00 !important;
  border: 2px solid #FFCC00 !important;
}

/* Optimized Dark Mode for WCAG Compliance */
body.dark-mode {
  background-color: #121212 !important;
  color: #FFCC00 !important;
  /* Gold provides better contrast than pure yellow */
}

/* Target every text element that WAVE might flag */
body.dark-mode p,
body.dark-mode div,
body.dark-mode span,
body.dark-mode a,
body.dark-mode li,
body.dark-mode label,
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode .nav-link,
body.dark-mode .dropdown-item {
  color: #FFCC00 !important;
}

/* Fix Form Inputs (Prevent black text on black background) */
body.dark-mode input[type="text"],
body.dark-mode input[type="search"],
body.dark-mode textarea {
  background-color: #222 !important;
  color: #FFCC00 !important;
  border: 1px solid #FFCC00 !important;
}

/* Fix Placeholders */
body.dark-mode input::placeholder {
  color: #FFCC00 !important;
  opacity: 0.7;
}

/* High-Contrast Interactive States */
body.dark-mode a:hover,
body.dark-mode .dropdown-item:hover {
  background-color: #FFCC00 !important;
  color: #000000 !important;
}

/* Focus Indicator for Accessibility */
body.dark-mode *:focus {
  outline: 3px solid #FFCC00 !important;
  outline-offset: 2px;
}

/* Fix for the News Ticker / Flash News */
body.dark-mode .news-ticker-area,
body.dark-mode .ticker-wrapper,
body.dark-mode .ticker-title {
  background-color: #FFCC00 !important;
  /* Gold background for the container */
  color: #000000 !important;
  /* Black text for maximum contrast (21:1) */
  border: 1px solid #FFCC00 !important;
}

/* Ensure the links inside the ticker are also high contrast */
body.dark-mode .ticker-content a,
body.dark-mode #js-news i,
body.dark-mode .ticker-content span {
  color: #000000 !important;
  /* Black text on gold background */
  font-weight: bold !important;
}

/* Pause/Play Button Visibility */
body.dark-mode #playPauseBtn {
  background-color: #000000 !important;
  color: #FFCC00 !important;
  border: 2px solid #FFCC00 !important;
}