.g-30 {
--bs-gutter-y: 30px;
--bs-gutter-x: 30px;
}
.team-group:not(:last-child) {
margin-bottom: 40px;
}
.team-title {
color: #1a1a1a;
font-size: 18px;
line-height: 24px;
font-weight: 600;
margin-bottom: 20px;
text-transform:capitalize;
}
.team-card {
background-color: #ffffff;
padding: 20px;
border-radius: 10px;
border: 1px solid #e0e0e0;
position: relative;
z-index: 1;
height: 100%;
transition: all 0.3s ease;
}
.team-card .card-wavy {
position: absolute;
left: 0;
bottom: 0;
z-index: -1;
}
.team-card .team-img {
margin-bottom: 20px;
}
.team-card .team-img img {
width: 100%;
border-radius: 10px;
border: 1px solid #e0e0e0;
object-fit: cover;
object-position: top;
aspect-ratio: 1 / 1;
transition: all 0.3s ease;
}
.team-card .team-content h5 {
color: #1a1a1a;
font-size: 18px;
line-height: 24px;
font-weight: 600;
margin-bottom: 5px;
text-transform:capitalize;
transition: all 0.3s ease;
}
.team-card .team-content p {
color: #6c6c6c;
font-size: 14px;
line-height: 20px;
font-weight: 400;
margin: 0;
text-transform:capitalize;
transition: all 0.3s ease;
}
.team-card:hover {
background-color: #0094d1;
border-color: #0094d1;
}
.team-card:hover .team-img img {
border-color: transparent;
}
.team-card:hover .team-content h5,
.team-card:hover .team-content p {
color: #ffffff;
}
@media only screen and (max-width: 1366px) {
.g-30 {
--bs-gutter-y: 24px;
--bs-gutter-x: 24px;
}
}
@media only screen and (max-width: 767px) {
.g-30 {
--bs-gutter-y: 20px;
--bs-gutter-x: 20px;
}
.team-card {
padding: 16px;
}
.team-card .team-img {
margin-bottom: 16px;
}
.team-card .team-content h5 {
font-size: 16px;
line-height: 22px;
margin-bottom: 4px;
}
}
@media only screen and (max-width: 576px) {
.team-section.py-70 {
padding: 50px 12px !important;
}
}