.our-team-page {
  padding: 3rem 0;
}
.cs-team-wrapper .cs-members-container .cs-member-item {
  position: relative;
  max-width: 405px;
  height: 410px;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  margin: 0 auto;
}
.cs-team-wrapper .cs-members-container .cs-member-item .cs-member-img {
  position: relative;
  -webkit-clip-path: polygon(
    10% 0%,
    100% 0,
    100% 10%,
    100% 90%,
    90% 100%,
    0 100%,
    0% 90%,
    0% 10%
  );
  filter: grayscale(100%);
  transition: filter 0.3s ease-in-out;

   box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  clip-path: polygon(
    10% 0%,
    100% 0,
    100% 10%,
    100% 90%,
    90% 100%,
    0 100%,
    0% 90%,
    0% 10%
  );
  margin: 0;
  padding: 0;
  overflow: hidden;
  transition: transform 0.4s ease;
}

.cs-team-wrapper .cs-members-container .cs-member-item .cs-member-img:hover {
  filter: grayscale(0%);
}




.cs-team-wrapper .cs-members-container .cs-member-item .cs-member-img img {
  width: 100%;
  height: 100%;
  transition: transform 0.4s ease;
}
.cs-team-wrapper .cs-members-container .cs-member-item .cs-member-img::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #1288c317;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  opacity: 0;
  transition: opacity 0.5s ease;
  -webkit-clip-path: polygon(
    10% 0%,
    100% 0,
    100% 10%,
    100% 90%,
    90% 100%,
    0 100%,
    0% 90%,
    0% 10%
  );
  clip-path: polygon(
    10% 0%,
    100% 0,
    100% 10%,
    100% 90%,
    90% 100%,
    0 100%,
    0% 90%,
    0% 10%
  );
}
.cs-team-wrapper .cs-members-container .cs-member-item .cs-member-item-content {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 10;
  width: 300px;
  height: 80px;
  background: #fff;
  -webkit-clip-path: polygon(
    100% 0,
    100% 50%,
    100% 100%,
    0 100%,
    11% 50%,
    0% 0%
  );
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  clip-path: polygon(100% 0, 100% 50%, 100% 100%, 0 100%, 11% 50%, 0% 0%);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-member-item-content
  .cs-member-info {
  margin-left: 50px;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-member-item-content
  .cs-member-info
  .cs-member-designation
  p {
  margin: 0px;
  font-size: 12px;
}
.cs-team-wrapper .cs-members-container .cs-member-item .cs-member-connect {
  transition: all 0.4s ease;
}

.cs-team-wrapper
  .cs-members-container
  .cs-member-item:hover
  .cs-member-img
  img {
  transform: scale(1.1) translateX(10px);
}

.cs-team-wrapper
  .cs-members-container
  .cs-member-item:hover
  .cs-social-contact {
  max-height: 220px;
  opacity: 1;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item:hover
  .cs-member-connect {
  transform: rotate(-90deg);
  margin-right: 10px;
  transition: all 0.4s ease;
}
.cs-team-wrapper .cs-members-container .cs-member-item .cs-social-contact {
  position: absolute;
  right: 0;
  bottom: 80px;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.5s ease-in-out, opacity 0.3s ease-in-out;
}
.cs-team-wrapper .cs-members-container .cs-member-item .cs-social-contact ul {
  display: flex;
  flex-direction: column;
  margin: 0;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-social-contact
  ul
  li {
  display: inline-block;
  margin-bottom: 1px;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-social-contact
  ul
  li
  a {
  padding: 15px 15px 8px 15px;
  background: #176b96;
  display: inline-block;
  width: 100%;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-social-contact
  ul
  li
  a
  i {
  color: #fff;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-social-contact
  ul
  li:hover
  a {
  background: #fff;
}
.cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-social-contact
  ul
  li:hover
  a
  i {
  color: #0a0a0a;
}
.cs-team-wrapper .container-fluid {
  max-width: 1720px;
  padding: 0px 10px;
  margin: auto;
}
.cs-team-wrapper .container-fluid .row {
  margin: auto;
}
.cs-team-wrapper.cs-team-transparent
  .cs-members-container
  .cs-member-item
  .cs-member-img {
  -webkit-clip-path: inherit;
  clip-path: inherit;
}
.cs-team-wrapper.cs-team-transparent
  .cs-members-container
  .cs-member-item::after {
  -webkit-clip-path: inherit;
  clip-path: inherit;
}
.cs-team-wrapper.cs-team-transparent
  .cs-members-container
  .cs-member-item:hover
  .cs-member-img {
  -webkit-clip-path: inherit;
  clip-path: inherit;
}
.cs-team-wrapper.cs-team-transparent
  .cs-members-container
  .cs-member-item:hover
  .cs-member-img::after {
  -webkit-clip-path: inherit;
  clip-path: inherit;
}
.cs-team-wrapper.cs-team-transparent
  .cs-members-container
  .cs-member-item
  .cs-member-item-content {
  background: rgba(255, 255, 255, 0.5);
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
}
.cs-team-wrapper.cs-team-transparent
  .cs-members-container
  .cs-member-item
  .cs-member-item-content
  .cs-member-connect {
  margin-right: 15px;
}
.cs-team-wrapper.cs-cargo-team .home1-team-slider {
  overflow: hidden;
}
.cs-team-wrapper.cs-cargo-team .home1-team-slider .swiper-slide {
  width: 320px !important;
  margin-right: 13px !important;
}

.cs-team-wrapper.cs-team-transparent.cs-cargo-team
  .cs-members-container
  .cs-member-item
  .cs-member-item-content {
  width: 250px;
}

@media screen and (max-width: 991px) {
  .cs-team-wrapper .container-fluid {
    width: 100%;
    margin: auto;
  }
}
.cs-raw-in-col8 > *:nth-child(-n + 4) {
  padding-bottom: 45px;
}

.cs-raw-in-col8 > *:nth-last-child(-n-4) {
  padding-bottom: 0;
}

@media screen and (max-width: 1199px) {
  .cs-raw-in-col8 > *:nth-child(-n + 6) {
    padding-bottom: 45px;
  }
  .cs-raw-in-col8 > *:nth-last-child(-n-2) {
    padding-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .cs-raw-in-col8 > *:nth-child(-n + 7) {
    padding-bottom: 45px;
  }
  .cs-raw-in-col8 > *:nth-last-child(-n-1) {
    padding-bottom: 0;
  }
}

.cs-member-item {
  position: relative;
  overflow: hidden;
}

.see-more-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #176B96;
  color: white;
  padding: 8px 16px;
  border: none;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  opacity: 0;
  visibility: hidden;
}



/* Show button only on hover for larger screens */
@media (min-width: 768px) {
  .cs-member-item:hover .see-more-btn {
    opacity: 1;
    visibility: visible;
  }
}

/* Always visible on small devices */
@media (max-width: 767px) {
  .see-more-btn {
    opacity: 1;
    visibility: visible;
    top: 90.5% !important;
    width: 201px;
    left: 11%;
    height: 80px;
    font-size: 12px;

  }


  .cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-social-contact  {
    max-height: 220px !important;
    opacity: 1;
  }

  .cs-team-wrapper
  .cs-members-container
  .cs-member-item
  .cs-member-connect {
  transform: rotate(-90deg);
  margin-right: 10px;
  transition: all 0.4s ease;
}
}

.see-more-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  color: #fff !important;
  width: 100%;
 
  height: 100%;
  border-radius: 5px;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.see-more-btn:hover::before {
  opacity: 1;
 
}