.bloc-service span {
color: #5F5F5F;
font-family: Roboto, Arial, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: normal;
border-radius: 110px;
background: rgba(255, 255, 255, 0.05);
padding: 16px;
margin: 16px 10px;
display: inline-block;
}
.references .bloc-service {
margin-top: 100px;
}
.reference-galerie {
column-count: 2;
--webkit-column-count: 2;
--moz-column-count: 2;
gap: 1rem;
padding: 0;
margin-top: 90px;
}
.reference-bloc:first-child {
margin-top: 0;
}
.reference-bloc {
height: auto;
width: 100%;
border-radius: 5px;
overflow: hidden;
position: relative;
}
.reference-bloc + .reference-bloc {
margin-top: 1rem;
}
.reference-liste {
margin-bottom: 140px;
}
#refer-1 {
margin-top: -50px;
}
.reference-title {
position: absolute;
bottom: 0;
padding: 60px 100px 20px 40px;
background: linear-gradient(180deg, rgba(20, 20, 20, 0) 0%, rgba(20, 20, 20, 0.54) 52%, rgba(20, 20, 20, 0.9) 100%);
justify-content: space-between;
gap: 50px;
align-items: center;
}
.reference-title h2 {
font-family: Roboto, Arial, sans-serif;
font-size: 32px;
font-weight: 700;
text-align: left;
color: #FFFFFF;
}
.reference-arrow {
width: 25px;
height: 4px;
background-color: #ffffff;
border-radius: 2px;
position: absolute;
right: 40px;
}
.reference-arrow:after {
content: url(//donnees-trajets.fr/app/uploads/2024/07/arrow.png);
position: absolute;
right: -2px;
top: -13px;
}
.reference-bloc .link_refer picture img {
transition: transform 0.3s ease-out;
}
.reference-bloc .link_refer:hover picture img {
transform: scale(1.15);
}
.reference-title .reference-arrow {
display: inline-block;
transition: width 0.3s ease-out;
}
.reference-bloc .link_refer:hover .reference-arrow {
width: 35px;
}
.reference-bloc .link_refer {
border-radius: 8px;
overflow: hidden;
}