b8e71e6fd3
* updating the landing page with jtbd * changed the buttons to pink * updating CSS based on John's help * updating a use case * updating the language and rearranging the guides * adding icons * fixed image width * fixing buttons and updating traffic splitting language.
67 lines
969 B
SCSS
67 lines
969 B
SCSS
.g-use-cases {
|
|
margin: 48px 0 8px;
|
|
|
|
@media (min-width: 768px) {
|
|
display: flex;
|
|
justify-content: center;
|
|
margin: 0 (-$site-gutter-padding);
|
|
}
|
|
|
|
img {
|
|
width: 51%;
|
|
|
|
@media (min-width: 768px) {
|
|
width: 80%;
|
|
}
|
|
}
|
|
|
|
h3 {
|
|
font-weight: 600;
|
|
margin: 40px 0 0;
|
|
|
|
span {
|
|
display: block;
|
|
font-weight: 300;
|
|
}
|
|
}
|
|
|
|
p {
|
|
margin-top: 0.5em;
|
|
|
|
@media (min-width: 768px) {
|
|
margin-top: 1em;
|
|
}
|
|
}
|
|
|
|
& > div {
|
|
padding: 0 16px;
|
|
position: relative;
|
|
text-align: center;
|
|
|
|
@media (min-width: 768px) {
|
|
padding: 0 $site-gutter-padding;
|
|
width: 33.33333%;
|
|
}
|
|
|
|
@media (min-width: 992px) {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
& + div {
|
|
margin-top: 56px;
|
|
|
|
@media (min-width: 768px) {
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.button {
|
|
@media (min-width: 768px) {
|
|
margin-top: 22px;
|
|
}
|
|
}
|
|
}
|