.intro {
background: #f9f9f9;
padding: 8rem 0;
}
.intro__title,
.services__title {
font-size: 4rem;
margin-bottom: 20px;
color: var(--color-heading);
font-weight: normal;
}
.intro__text,
.intro__text strong,
.services__text,
li {
font-size: 2rem;
margin-bottom: 10px;
color: #444;
}
ul {
margin-left: 6rem;
margin-bottom: 4rem;
}
li {
margin-bottom: 0;
} .services {}
.services__item {
display: flex;
align-items: center;
flex-wrap: wrap;
margin: 0 auto;
}
.services__item--reverse {
flex-direction: row-reverse;
}
.services__image {
flex: 1 1 50%;
}
.services__image img {
width: 100%;
height: 600px;
max-height: 600px;
object-fit: cover;
display: block;
} .services__content {
flex: 1 1 50%;
padding: 0 4rem; }
.services__content {
padding-right: calc((100vw - var(--container-width)) / 2);
margin-bottom: 15px;
}
.services__item--reverse .services__content {
padding-left: calc((100vw - var(--container-width)) / 2);
padding-right: 0;
margin-bottom: 15px;
}
.services__text {
margin-bottom: 4rem;
}
section#quote {
background: var(--color-primary-hover);
padding: 8rem 0;
}
p.quote {
font-size: 2.4rem;
text-align: center;
max-width: 70%;
margin: auto;
font-weight: 600;
}
span.author {
font-size: 2rem;
text-align: center;
display: flex;
justify-content: center;
margin-top: 3rem;
} @media (max-width: 768px) {
.services__item,
.services__item--reverse {
flex-direction: column;
}
.services__image,
.services__content {
flex: 1 1 100%;
}
.services__content {
max-width: 90vw;
margin: auto;
padding: 4rem 0;
}
}