site/pages/meet-our-team/team-slice/badger-profile/style.css
@value badgerWhite, badgerBlack, badgerRedOnWhite, daveGreen from "../../../../css/_colors.css";
.badgerProfile {
text-align: left;
position: relative;
display: block;
height: 100%;
}
.badgerImage {
width: 100%;
}
.badgerImage:hover {
box-shadow: 7px 7px badgerRedOnWhite;
}
.badgerWrapper {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.placeholder {
background-color: #efeff1;
height: 100%;
}
.skillsWrapper {
display: none;
position: absolute;
top: 0;
left: 0;
padding: 10px;
}
.skillsHeading {
composes: fontXS from '../../../../css/typography/_fonts.css';
composes: boldSansSerif from '../../../../css/typography/_fonts.css';
color: daveGreen;
}
.skills {
composes: fontM from '../../../../css/typography/_fonts.css';
composes: serif from '../../../../css/typography/_fonts.css';
color: badgerWhite;
}
.description {
padding-top: 10px;
color: badgerBlack;
position: relative;
z-index: 1;
}
.nameWrapper {
composes: fontS2 from '../../../../css/typography/_fonts.css';
composes: serif from '../../../../css/typography/_fonts.css';
margin-right: 35px;
}
.name {
position: relative;
display: inline;
}
.jobDescription {
composes: fontXS from '../../../../css/typography/_fonts.css';
composes: sansSerif from '../../../../css/typography/_fonts.css';
}
.arrow {
position: absolute;
}
.arrow svg {
height: 12px;
width: 12px;
margin-left: 10px;
}
.description:hover .name {
border-bottom: 2px solid badgerRedOnWhite;
}
.name i {
position: absolute;
}