@media (max-width: 768px) {
    .team .ss {
        text-align: left !important;
    }
    
}

.team .ss {
    text-align: right;
}

.col-md-12.team-description {
    padding-top: 20px;
    margin-top: 20px;
}


@media (min-width: 850px) {
.team-description p {
    width: 50%;
}
}

@media (max-width: 850px) {
    .team-item h5{
        margin-top: 20px;
    }

.team-item img {
    width: 100%;
    max-width: 100% !important;
    height: auto;
  }
  .team-img {
    width: 100% !important;
    max-width: 100% !important;

  }

}
.team-row.align-items-center {
    display: flex;
    align-items: center; /* Vertically centers the content */
  }
  
  .management-master {
    text-align: left;
  }
  
  .team-item {
    text-align: left;
    margin-bottom: 30px; /* Gap between the items */
    cursor: pointer;
  }
  
  .team-item img {
    width: 100%;
    max-width: 327px;
    height: auto;
  }
  
  .team-item h5 {
    font-size: 18px;
    font-weight: bold;
  }
  
  .team-item .designation, .team-item .sub-designation {
    font-size: 14px;
    color: #777;
    margin-bottom: 0px;
    
  }

  .team-item {
    margin-bottom: 20px;;
  }
  
  .view-info {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 39, 95, 0.5);  /* Blue background with opacity */
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 18px;
    font-weight: bold;
    opacity: 0; /* Hidden by default */
    pointer-events: none; /* Prevent it from blocking interactions when invisible */
    transition: opacity 0.3s ease, background 0.3s ease;
  }
  
  .team-img {
    overflow: hidden;
    position: relative;
    width: 100%;
    max-width: 327px;;
    /* height: 100%; */
}
  
  .team-img:hover .view-info {
    opacity: 1;  /* Make the view-info visible when hovered */
    background: rgba(0, 39, 95, 0.8);  /* Blue tint background on hover */
    pointer-events: all; /* Enable interactions */
  }