src/app/components/faqs/faqs.styles.scss
@import '~@code.gov/code-gov-style/_sass/_variables';
/* overarching page styles */
.faq-general {
h3,
p, {
color: $color-gray-dark;
}
a {
color: $brand-teal-dark;
text-decoration: underline;
&:hover {
color: $brand-teal;
}
}
}
/* faq overview section of page */
.faq-overview {
h2 {
font-weight: 700;
text-align: center;
text-transform: uppercase;
}
padding: 0rem 3rem 3rem 3rem;
}
/* tools section of page */
.tools {
padding: 4rem 0 6rem;
margin: 0;
color: $color-gray-dark;
background-color: $color-gray-second-lightest;
text-align: center;
h2 {
margin-bottom: 2em;
}
a {
color: $color-gray-dark;
text-decoration: none;
padding: 3em 2em;
@media screen and (min-width: $medium-screen) {
padding: 0;
}
}
div {
padding: 0 2em;
font-size: 1.8rem;
}
i {
font-size: 5rem;
color: $color-gray-dark;
@media screen and (min-width: $medium-screen) {
font-size: 15rem;
}
}
span {
padding: 1.7rem 0 1rem;
font-size: 2.1rem;
font-weight: 700;
text-transform: uppercase;
}
.tools-flex {
display: flex;
flex-direction: column;
align-items: center;
}
}
//general content
.general-content {
h3 {
font-weight: 700;
}
padding: 3rem 3rem 3rem 3rem;
li {
color: $color-gray-dark;
}
}