@charset "UTF-8";
 .team {
margin-bottom: 20px;
}
.team .box {
margin-right: 10px;
margin-top: 10px;
}
.team .image {
padding-bottom: 100%;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.team .image .image-overlay {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
opacity: 0;
transition: 0.3s ease;
}
.team .image:hover {
cursor: pointer;
}
.team .image:hover .image-overlay {
opacity: 1;
}
.team .image-container {
margin: 0 1rem;
overflow: hidden;
transform: rotate(45deg);
}
.team .image-container .image {
transform: rotate(-45deg) scale(1.5);
}
.team .info {
margin-top: 2rem;
text-align: center;
}
.team .info .name p {
color: #630c54;
margin-bottom: 0;
}
@media (max-width: 768px) {
.team .image-container {
transform: none;
}
.team .image-container .image {
transform: none;
}
}
.team a {
display: inline-block;
transition: color 0.2s ease;
font-weight: bolder;
position: relative;
color: #1E0213;
cursor: pointer;
}
.team a::after, .team a::before {
content: "";
position: absolute;
top: 100%;
width: 0;
right: 0;
height: 3px;
}
.team a::before {
transition: width 0.4s cubic-bezier(0.51, 0.18, 0, 0.88) 0.1s;
background: #630c54;
}
.team a::after {
transition: width 0.2s cubic-bezier(0.29, 0.18, 0.26, 0.83);
background: #1E0213;
}
.team a:hover, .team a:focus, .team a:visited, .team a:active {
text-decoration: none;
color: #1E0213;
}
.team a:hover::after, .team a:hover::before, .team a:focus::after, .team a:focus::before, .team a:visited::after, .team a:visited::before, .team a:active::after, .team a:active::before {
width: 100%;
left: 0;
}
.team-modal a {
display: inline-block;
transition: color 0.2s ease;
font-weight: bolder;
position: relative;
color: #1E0213;
cursor: pointer;
}
.team-modal a::after, .team-modal a::before {
content: "";
position: absolute;
top: 100%;
width: 0;
right: 0;
height: 3px;
}
.team-modal a::before {
transition: width 0.4s cubic-bezier(0.51, 0.18, 0, 0.88) 0.1s;
background: #630c54;
}
.team-modal a::after {
transition: width 0.2s cubic-bezier(0.29, 0.18, 0.26, 0.83);
background: #1E0213;
}
.team-modal a:hover, .team-modal a:focus, .team-modal a:visited, .team-modal a:active {
text-decoration: none;
color: #1E0213;
}
.team-modal a:hover::after, .team-modal a:hover::before, .team-modal a:focus::after, .team-modal a:focus::before, .team-modal a:visited::after, .team-modal a:visited::before, .team-modal a:active::after, .team-modal a:active::before {
width: 100%;
left: 0;
} .team {
justify-content: space-evenly;
}
@media (min-width: 768px) {
.team {
margin-top: 50px;
}
}