<div class="news-item">
<img src="/images/news_item.png" alt="Go Campaign" />
<h3>Holding Onto You</h3>
<p>I'm taking over my body. Back in control, no more shotty. I bet a lot of me was lost. T's uncrossed and I's undotted. I fought it a lot and it seems a lot. Like flesh is all I got. Not any more, flesh out the door?</p>
<p class="cta">
<a href="#" class="button grey-light" role="button">Learn More</a>
</p>
</div><!-- end news-item -->
<div class="news-item">
{% block cms_override %}
<img src="{{ image_src }}" alt="{{ image_alt }}" />
{% endblock cms_override %}
<h3>{{ headline|raw }}</h3>
<p>{{ content }}</p>
<p class="cta">
{% block cms_override_buttons %}
{% include "@buttons--a-tag" with {
url: url,
text: button_text,
color: 'grey-light'
} %}
{% endblock cms_override_buttons %}
</p>
</div><!-- end news-item -->
{
"image_src": "/images/news_item.png",
"image_alt": "Go Campaign",
"headline": "Holding Onto You",
"content": "I'm taking over my body. Back in control, no more shotty. I bet a lot of me was lost. T's uncrossed and I's undotted. I fought it a lot and it seems a lot. Like flesh is all I got. Not any more, flesh out the door?",
"url": "#",
"button_text": "Learn More"
}
.news-item {
display: flex;
flex-direction: column;
max-width: inherit;
img {
width: 100%;
margin: 0 0 $space-double 0;
}
h3 {
font-size: 1rem;
font-weight: bold;
}
a {
font-weight: bold;
color: $grey_darkest;
&.button {
font-weight: normal;
width: 95%;
}
}
p {
&.cta {
text-align: center;
margin: 0;
}
}
@media only screen and (min-width: $break-desktop) {
max-width: 50%;
}
&-image {
position: relative;
overflow: hidden;
margin: 0 0 $space 0;
}
}
No notes defined.