/* sectors type Section--------------------------------*/

canvas {
  max-width: 400px;
  max-height: 400px;
}
#sectors{
   /* background: #fffaed; */
   background: #f3f9f1;
}
#sector2, #sector4, #sector6, #sector8, #sector10, #sector12, #sector14, #sector16, #sector16 {
  background-color: #fff;
  padding: 40px 0 80px 0;
}
#sector2 div, #sector4 div, #sector6 div, #sector8 div{
  box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
}
#sectors h6{
  text-decoration: underline;
  font-weight: bold;
}
#sectors h5{
  color:#074727;
  font-weight: bold;
}
#sector2, #sector4, #sector6, #sector8  .info {
  color: #333333;
  padding: 40px 0 80px 0;

}
#sector1 img, #sector3 img, #sector5 img, #sector7 img, #sector9 img, #sector11 img, #sector13 img, #sector15 img, #sector17 img{
  height: 500px; width:100%;
    }
    #sector2 img, #sector4 img, #sector6 img, #sector8 img, #sector10 img, #sector12 img, #sector14 img, #sector16 img, #sector16 img {
      height: 500px; width:100%;
  }
#sector1, #sector3, #sector5, #sector7, #sector9, #sector11, #sector13, #sector15, #sector17 {
  background: #f7f7f7;
  padding: 40px 0 80px 0;
}
#sectors .btn {
  background-color: rgb(57, 163, 89); 
  color: #000000;
  /* color: #fff; */
  border-radius: 20px;
margin-left: 40%;
  width: 20%;
  padding: 8px 20px; 
  font-size: 0.9rem;
  font-weight: bold;
  transition: background-color 0.3s ease;
}

#sectors .btn:hover {
  /* background-color: #f0860e; */
  background-color:#d7dfd9;
  /* background-color:  #0f1a77; */
}

@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@media (max-width: 500px) {
  #sector1 img, #sector3 img, #sector5 img, #sector7 img, #sector9 img, #sector11 img, #sector13 img, #sector15 img, #sector17 img{
height: 50px;
  width: 50%;

  }
  #sector2 img, #sector4 img, #sector6 img, #sector8 img, #sector10 img, #sector12 img, #sector14 img, #sector16 img, #sector16 img {
    width: 50%;
    height: 50px;
}
}
/*-------------------- sectors type Section end -----------------------*/

/*  image slideshow Section
--------------------------------*/
#slider-container {
  overflow: hidden;
  position: relative;
  margin: auto;
}

.slider {
  display: flex;
  /* height: 500px; */
  animation: slide 10s infinite;
}

.slide {
  width: 100%;
  flex-shrink: 0;
}

.slide img {
  width: 100%;
  height: auto;
}

@keyframes slide {
  0% { transform: translateX(0); }
  20% { transform: translateX(0); }
  25% { transform: translateX(-100%); }
  45% { transform: translateX(-100%); }
  50% { transform: translateX(-200%); }
  70% { transform: translateX(-200%); }
  75% { transform: translateX(-300%); }
  95% { transform: translateX(-300%); }
  100% { transform: translateX(0); }
}

/*-------------------- vision & mission -----------------------*/
#visionMission{
  background: linear-gradient(rgba(41, 35, 35, 0.6), rgba(20, 18, 18, 0.6)), url(../img/VissionMission/PageBack.avif) fixed center center;
    background-size: cover;
    padding-top: 10px;
    padding-right: 10px;
    color: rgb(238, 231, 231);
}
#visionMission p{
margin-top: 50px;
} 
#visionMission h2{
  color: #f8f4f1;
  margin-top: 50px;
  text-align: center;
  font-weight: bold;
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  /* text-decoration: underline  rgb(57, 163, 89); */
  text-underline-offset: 10px;
  } 
.visionMission h3{
  color: #000000;
  /* font-size: larger; */
  font-weight: bold;
  /* color: #008080; */
  text-decoration: underline  rgb(57, 163, 89);
  text-underline-offset: 5px;
}
.visionMission p{
  padding: 5px 2px 2px 2px;
font-style: italic;
}
.col-md-3 img{
  width: 20%;
  height: 20%;
}
#weHave{
  /* align-items: center; */
  text-align: center;
  align-items: center;
  justify-content: center;
}
#videoInd{
  text-align: center;
  align-items: center;
  justify-content: center;
}
#videoInd video::-internal-media-controls {
  display: none;
}
#videoInd video::-webkit-media-controls {
  display: none;
}
 
/*-------------------- gallery-====================================----------------------*/
#gallery{
  background: #fff;
  padding: 80px 0 60px 0;
}
#gallery .member {
  text-align: center;
  margin-bottom: 20px;
}
#gallery .member .pic {
  margin-bottom: 15px;
  overflow: hidden;
  /* height: 260px; */
}
#gallery .member .pic img {
  max-width: 100%;
}
#gallery .member h4 {
  font-weight: 700;
  margin-bottom: 2px;
}
#gallery .member span {
  font-style: italic;
  display: block;
  font-size: 13px;
}
#gallery .member .social {
  margin-top: 15px;
}
#gallery .member .social a {
  color: #b3b3b3;
}
#gallery .member .social a:hover {
  color: rgb(57, 163, 89);
}
#gallery .member .social i {
  font-size: 18px;
  margin: 0 2px;
}
/* ===============================detail.html========================= */
/* =======================Team Section=========================================================================--------*/
#team {
  /* background: #fff; */
  background: #f3f9f1;
  padding: 80px 0 60px 0;
}
#team .mem {
  text-align: center;
  margin-bottom: 20px;
}
#team .mem .pic {
  margin-bottom: 15px;
  overflow: hidden;
}
#team .mem .pic img {
  max-width: 100%;
}
#team .mem #icon {
  font-size: 500%; 
  color: rgb(145, 144, 144);
}

#team .mem h5{
  /* font-weight: 700; */
  color: #1d1d1d;
  font-weight: bold;
}
#team .mem span {
  font-style: italic;
  display: block;
  color: #000000bd;
  font-size: 15px;
}
#team .mem .social {
  margin-top: 15px;
}
#team .mem .social a {
  color: #2e2e2e;
}
#team .mem .social a:hover {
  color: rgb(57, 163, 89);
}
#team .mem .social i {
  font-size: 18px;
  margin: 0 2px;
}
/* =======================Team Section===========================================================================================--------*/

/* =======================values Section========--------*/
#values{
  /* background: #f7f7f7; */
  background: #f3f9f1;
  padding: 80px 0 60px 0;
}
.valueBox{
  background-color: #fff;
}
#values img{
  max-width: 100%;
}
#values .col-md-3{
display: block;
align-items: center;
justify-content: center;
padding: 30px;
text-align: center;
box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
box-sizing: border-box;
}

#values span{
  text-align: center;
  padding: 10px;
  font-weight: bold;
}
#values p{
  text-align: center;
  /* text-justify: initial; */
}
/* =======================values Section========--------*/

/* event.html page */
/* ==============================================Event Start ====================================================> */

.main-content h2 {
  margin-top: 10px;
  margin-bottom: 20px;
  color: #000;
  text-align: center;
  font-family:Arial, Helvetica, sans-serif;
  font-size: 35px;
  text-decoration: underline solid rgb(57, 163, 89); /* Add underline using border */
  
}
.events-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
}

.event-card {
  /* border: 1px solid #ddd; */
  /* border-radius: 8px; */
  overflow: hidden;
  background-color: #fff;
}

.event-card img {
  width: 80%;
  height: 65%;
  margin-left: 90px;
  margin-right: 30px;
  /* object-fit: cover; */
}

.event-info {
  padding: 0px;
  /* align-items: center; */
  text-align: center;
}
.event-info p{
 font-weight: bold;
}

.event-category {
  margin-top: 20px;
  margin-left: 60px;
  font-size: 0.9em;
  color: #030000;
}

@media (max-width: 900px) {
  .events-grid {
      grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
  }

  .event-card .images-container {
      flex-direction: column; /* Stack images vertically */
      align-items: center;
  }

  .event-card img {
      width: 90%; /* Reduce image width for better spacing on small screens */
      margin-left: 0;
      margin-right: 0;
  }

  .event-category {
      margin-left: 20px;
  }
}

/* ===============================================Event End =================================> */

/* ===================================== OUR CLIENT ========================================= --> */
#client {
  background: #fff;
  padding: 80px 0 60px 0;
}

.carousel-item {
  display: none;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.carousel-item.active {
  display: flex;
}

.carousel-item .row {
  margin-bottom: 15px;
}

.carousel-item img {
  width: 120px;
  height: auto;
  margin: 15px;
}

.carousel-indicators [data-bs-target] {
  background-color: #00a651;
  /* Green indicator dots */
}

.carousel-indicators .active {
  background-color: #007b31;
  /* Dark green active dot */
}

/* Add spacing for buttons */
.carousel-control-prev,
.carousel-control-next {
  width: 5%;
  /* Adjust button width */
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  background-color: #00a651;
  border-radius: 50%;
  padding: 10px;
}

.carousel-control-prev,
.carousel-control-next {
  margin-top: 30px;
  /* Create space above the buttons */
}
@media (max-width: 500px) {
  .carousel-item img {
    width: 100%;
   
  }
}

 /* <!-- =====================================  END OUR CLIENT ========================================= --> */

  /* <!-- =====================================  COMPANTY========================================= --> */

 .aboutCompany{ 
  background-image: linear-gradient(rgba(14, 14, 19, 0.808), rgba(48, 51, 58, 0.6)), url('../img/bg/BS5.webp');
  /* background-image: linear-gradient(rgba(14, 14, 19, 0.808), rgba(48, 51, 58, 0.6)), url('../img/bg/BS4.jpg'); */
  /* background-image: linear-gradient(rgba(14, 14, 19, 0.808), rgba(48, 51, 58, 0.6)), url('../img/Career/b1.webp'); */
  /* background-color: #d19e9e; */
  background-size: cover;
  background-position: center;
  height: 80vh; /* Half of the page height */
  display: flex;
  justify-content: center; /* Center elements horizontally */
  align-items: center; /* Center elements vertically */
  padding-right: 30px;
  position: relative;
  overflow: hidden; /* Ensure content doesn't overflow */
}
.aboutCompany p{
  text-align: justify;
}
#aboutDtl p,h1,h3{
  color: #ffffff;
}
