Content Block Medium

Cross Link Here

Lorem ipsum dolor sit amet, consectetur adipisicing elit. In fuga reiciendis, aperiam praesentium ad delectus sunt! Eligendi iure molestias repellendus laborum, neque sapiente nulla ducimus nobis excepturi obcaecati adipisci voluptas.

Button Style Three

Cross Link Here

Lorem ipsum dolor sit amet, consectetur adipisicing elit. In fuga reiciendis, aperiam praesentium ad delectus sunt! Eligendi iure molestias repellendus laborum, neque sapiente nulla ducimus nobis excepturi obcaecati adipisci voluptas.

Button Style Three
i Content Block Medium

Cross Link Here

Lorem ipsum dolor sit amet, consectetur adipisicing elit. In fuga reiciendis, aperiam praesentium ad delectus sunt! Eligendi iure molestias repellendus laborum, neque sapiente nulla ducimus nobis excepturi obcaecati adipisci voluptas.

Button Style Three
i Content Block Medium

Markup

<div class="card card-medium">

	<div class="img-wrap" style="background-image:url('https://unsplash.it/676/350?image=860')">
		<img src="https://unsplash.it/676/350?image=860" alt="" class="visuallyhidden">
	</div>

	<div class="copy-wrap">
		<h2>Cross Link Here</h2>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. In fuga reiciendis, aperiam praesentium ad delectus sunt! Eligendi iure molestias repellendus laborum, neque sapiente nulla ducimus nobis excepturi obcaecati adipisci voluptas.</p>
		<a href="#" class="button-link button-link-default">Button Style Three</a>
	</div>

	<!-- Do not implement this link -->
	<a href="/inc/modules/?module=content-block-medium" class="module-link">
		<i class="icon info-icon">i</i>
		<span class="tool-tip">Content Block Medium</span>
	</a>
	<!-- Do not implement this link -->

</div>

It should not be used more than twice on a particular page and always above all support modules.

This module is based on a element called a "card". Modifier classes are applyed to the card element to apply certain styles. In this instance the "medium" class is used to adjust the heading (h2) size.