<article class="c-deliverable-card c-deliverable-card--collapse js-deliverable-card ">
<div class="c-deliverable-card__container">
<div class="c-deliverable-card__content">
<header class="c-deliverable-card__header">
<h3 class="c-deliverable-card__title">This is the event title</h3>
</header>
<div class="c-deliverable-card__exerpt">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam.
</div>
<button class="c-link c-deliverable-card__trigger is-hidden">
<span class="c-link__text-active is-hidden">read less</span>
<span class="c-link__text">read more</span>
</button>
</div>
<div class="c-deliverable-card__action">
<button class="c-button c-button--outlined c-deliverable-card__action-item ">
<div class="c-icon c-button__icon c-button__icon--before">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path class="st0" d="M12,0.2C5.5,0.2,0.2,5.5,0.2,12S5.5,23.8,12,23.8S23.9,18.5,23.9,12S18.6,0.2,12,0.2z M17.5,17.3c-0.1,0.2-0.4,0.4-0.7,0.4c-0.1,0-0.3,0-0.4-0.1c-4.7-2.8-10.2-1.2-10.2-1.2c-0.4,0.1-0.8-0.1-1-0.5s0.1-0.8,0.5-1c0.3-0.1,6.2-1.8,11.5,1.3C17.6,16.4,17.7,16.9,17.5,17.3z M18.9,14c-0.2,0.3-0.5,0.5-0.8,0.5c-0.2,0-0.3,0-0.5-0.1c-5.9-3.4-11.8-1.4-11.8-1.4c-0.5,0.2-1-0.1-1.2-0.6c-0.2-0.5,0.1-1,0.6-1.2c0.3-0.1,6.8-2.2,13.3,1.5C19,13,19.2,13.5,18.9,14zM19.6,10.8c-0.2,0-0.4,0-0.5-0.1C12.3,7.1,5.4,9.3,5.3,9.3C4.7,9.5,4.1,9.1,3.9,8.5C3.7,7.9,4,7.3,4.6,7.1C4.9,7,12.5,4.7,20.1,8.7c0.6,0.3,0.8,1,0.5,1.5C20.4,10.6,20,10.8,19.6,10.8z" />
</svg>
</div>
<span class="c-button__text">Listen on spotify</span>
</button>
</div>
</div>
</article>
