60 lines
902 B
SCSS
60 lines
902 B
SCSS
.iconListBlock {
|
|
margin: 5rem auto;
|
|
max-width: 68rem;
|
|
}
|
|
|
|
.iconList {
|
|
list-style: none;
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
column-gap: var(--spacing-gap-column);
|
|
row-gap: var(--spacing-gap-row);
|
|
}
|
|
|
|
.iconListItem {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 1.6rem;
|
|
|
|
&:nth-of-type(3n+1) {
|
|
.icon {
|
|
background: var(--color-goldenBeige);
|
|
}
|
|
}
|
|
|
|
&:nth-of-type(3n+2) {
|
|
.icon {
|
|
background: var(--color-neufPink);
|
|
}
|
|
}
|
|
|
|
&:nth-of-type(3n+3) {
|
|
.icon {
|
|
background: var(--color-goldenOrange);
|
|
}
|
|
}
|
|
}
|
|
|
|
.text {
|
|
margin-bottom: 1rem;
|
|
|
|
h2 {
|
|
font-size: var(--font-size-lead);
|
|
margin: .5rem 0;
|
|
}
|
|
}
|
|
|
|
.icon {
|
|
flex: none;
|
|
width: 3.4rem;
|
|
height: 3.4rem;
|
|
background: var(--color-goldenBeige);
|
|
border-radius: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
img {
|
|
width: 100%;
|
|
}
|
|
} |