wf4/components/Services/Services.css
2024-05-21 13:54:10 +02:00

76 lines
1.7 KiB
CSS

.Services {
background-image: radial-gradient(circle at 100vw 100vh, rgba(255,145,0,0.2) 0%, rgba(0,0,0,0) 63%, rgba(0,0,0,0) 100%);
background-color: var(--color-orange-black);
background-repeat: no-repeat;
.service-list {
display: flex;
flex-wrap: wrap;
align-items: stretch;
& article {
flex-grow: 1;
flex-shrink: 0;
flex-basis: clamp(400px, calc(33% - 3rem), 500px);
position: relative;
& .chip {
position: absolute;
right: -1rem;
top: calc(-1rem - 3px);
}
& header {
display: flex;
}
& ul {
list-style: none;
gap: 1rem;
& li {
display: flex;
align-items: center;
gap: 1rem;
}
}
& .extra {
margin-top: auto;
}
}
}
.network-list {
display: flex;
& article {
width: clamp(400px, calc(33% - 3rem), 500px);
align-items: center;
gap: 1rem;
& img {
border: 4px solid var(--color-orange);
border-radius: 50%;
width: 150px;
}
& main {
margin-top: -1rem;
}
& span {
font-family: 'Roboto Condensed', sans-serif;
font-weight: bold;
&:not(:last-child):after {
content: " | "
}
}
& p {
text-align: center;
}
}
}
}