.teamLeftStaffBox {
  width:calc(100% - 30px);
  margin-bottom:15px;
  height:130px;
  border-radius:20px;
  border:2px solid transparent;
  background:var(--white);
  display:flex;
  cursor:pointer
}
.teamLeftStaffBoxRed {
  border-color:#ff5942;
  color:#ff5942
}
.teamLeftStaffBoxRed:hover {
  background:#ff5942;
  color:var(--white)
}
.teamLeftStaffBoxGreen {
  border-color:#00d264;
  color:#00d264
}
.teamLeftStaffBoxGreen:hover {
  background:#00d264;
  color:var(--white)
}
.teamLeftStaffBoxOrange {
  border-color:#ffa334;
  color:#ffa334
}
.teamLeftStaffBoxOrange:hover {
  background:#ffa334;
  color:var(--white)
}
.teamLeftStaffBoxBlue {
  border-color:#6d95f3;
  color:#6d95f3
}
.teamLeftStaffBoxBlue:hover {
  background:#6d95f3;
  color:var(--white)
}
.teamLeftStaffBoxLeft {
  width:38%;
  display:flex;
  align-items:center;
  justify-content:center
}
.teamLeftStaffBoxIcon {
  height:42px;
  width:42px;
  image-rendering:pixelated;
  scale:2
}
.teamLeftStaffBoxManageIcon {
  background:url(../../assets/img/team/icon_gestion.png) no-repeat
}
.teamLeftStaffBoxSecurityIcon {
  background:url(../../assets/img/team/icon_security.png) no-repeat
}
.teamLeftStaffBoxEventIcon {
  background:url(../../assets/img/team/icon_event.png) no-repeat
}
.teamLeftStaffBoxEventIcon {
  background:url(../../assets/img/team/icon_event.png) no-repeat
}
.teamLeftStaffBoxDevIcon {
  background:url(../../assets/img/team/icon_dev.png) no-repeat
}
.teamLeftStaffBoxText {
  font-size:24px
}
.teamLeftStaffBoxRight {
  width:50%;
  display:flex;
  align-items:center
}
.teamRightCategory {
  display:flex;
  flex-direction:column;
  gap:6px
}
.teamRightTitleBox {
  width:100%;
  height:35px
}
.teamRightTitle {
  font-size:28px
}
.teamRightMembersContainer {
  width:100%;
  display:flex;
  flex-wrap:wrap;
  gap:10px
}
.teamRightMembersBox {
  position:relative;
  width:calc(25% - 8px);
  float:left;
  margin-bottom:2px;
  cursor:pointer
}
.teamRightMembersBox:hover>.teamRightMembersBoxFonction {
  display:block
}
.teamRightMembersBoxFonction {
  z-index:999;
  background-color:var(--white-light);
  padding:5px;
  position:absolute;
  bottom:60px;
  border-radius:8px;
  box-shadow:0 5px 20px 0 rgba(0,0,0,.25);
  display:none
  
}
.teamRightMembersBoxFonction::before {
  position:absolute;
  content:" ";
  border-right:10px solid transparent;
  border-top:10px solid var(--white-light);
  border-left:10px solid transparent;
  bottom:-10px;
  left:50%;
  transform:translateX(-50%);
  color:#000
}
.teamRightMembersBubble {
  height:80px;
  display:flex;
  flex-direction:column
}
.teamRightMembersBubble:hover {
  opacity:.7
}
.teamRightMembersBubbleHeight {
  display:flex;
  align-items:center;
  justify-content:flex-end
}
.teamRightMembersBubbleDown {
  height:50px;
  display:flex;
  align-items:flex-end
}
.teamRightAvatarImage {
  position:absolute;
  margin-top:-12px;
  width:55px;
  height:80px;
  overflow:hidden
}
.teamRightBubbleOnline {
  height:16px;
  width:16px;
  background:#00db4c;
  border-radius:50%;
  margin-right:6px
}
.teamRightBubbleOffline {
  height:16px;
  width:16px;
  background:#ff5942;
  border-radius:50%;
  margin-right:6px
}
.teamRightRank {
  min-width:50px;
  color:var(--white-forced);
  font-size:14px;
  padding:2px 8px;
  border-radius:5px;
  display:flex;
  align-items:center;
  justify-content:center
}
.teamRightMembersRounder {
  height:42px;
  width:100%;
  background:var(--white);
  border:2px solid var(--grey-contour);
  border-radius:14px;
  display:flex;
  align-items:center
}
.teamRightMembersPseudo {
  font-size:22px;
  margin-left:60px;
  color:var(--black)
}
.teamRightMembersBadge {
  height:42px;
  width:42px;
  margin-left:auto;
  margin-right:3px
}
@media(max-width:500px) {
  .mobile .teamLeftStaffBox {
    display:none
  }
}
@media(max-width:895px) {
  .teamRightMembersBox {
    width:100%!important
  }
}
@media(min-width:895px) and (max-width:1025px) {
  .teamRightMembersBox {
    width:calc(50% - 5px)!important
  }
}
@media(min-width:1025px) and (max-width:1255px) {
  .teamRightMembersBox {
    width:calc(33% - 5px)!important
  }
}
