_sass/pages/_index.scss
body {
background-color: lighten($color-gray-light, 28);
-webkit-font-smoothing: antialias;
}
a {
&:focus {
box-shadow: none;
outline: 0;
}
}
ul {
display: block;
li {
&::before {
content: "";
}
}
}
.usa-grid {
padding: 0 1rem;
@include media($medium-screen) {
padding: 0 3rem;
}
}
.usa-hero{
background-color: $color-primary-darkest;
min-height:650px;
position: relative;
text-align:center;
h1,
h2,
h3,
h4,
h5,
h6 {
color: $color-white;
}
h1{
font-family: $font-sans;
font-size: 4.5rem;
margin:0;
padding-top:3em;
}
h5 {
font-family: $font-sans;
font-size: 2.4rem;
margin-bottom: 10px;
margin-top: 0;
}
.usa-button {
padding: 0.75em 1.1em;
}
.usa-hero-overlay{
background-color: rgba(0,0,0,0.5);
}
@include media($small-screen){
h1{
font-size:5.5rem;
}
}
}
.usa-content{
margin-bottom:0px;
h1{
margin-top:0px;
}
#overview, #solution, #studies, #faq, #team, #blog{
padding-top:75px;
padding-bottom:75px;
}
#overview, #faq{
background-color:$color-primary;
}
#studies, #blog{
background-color:$color-primary-darkest
}
#overview{
padding-top:75px;
padding-bottom:75px;
text-align:center;
h1{
color:$color-white;
}
p{
color:$color-white;
}
}
#solution{
h1, h3{
color:$color-base;
}
h2, h4{
color:$color-primary-darkest;
margin-top:0px;
}
h1{
margin-bottom:0px;
}
h3{
margin-top:0px;
}
#solution-title{
text-align:center;
padding-bottom:50px;
}
#solution-row{
padding-bottom:30px;
}
}
#studies{
h3, p{
color:$color-white;
}
}
#faq{
h1{
color:$color-white;
text-align:center;
}
}
#team{
h1{
text-align:center;
color:$color-base;
}
ul {
li {
&::before{
content:"•";
}
}
}
}
#blog{
text-align:center;
h2, h3{
color:$color-white;
}
h2{
margin-top:25px;
}
h3{
margin-top:0px;
margin-bottom:25px;
}
}
}