To achieve this, simply include additional div elements and adjust some CSS properties.
Take a look at my implementation in this codepen: http://codepen.io/anon/pen/RPWybE
Here is the HTML structure:
<div class="section group">
<div class="subgroup1">
<div class="col span_1_of_3">
<a href="http://me14ch.leedsnewmedia.net/slate/shop.html" class="button"> Donate <p> Furniture and Electricals </p> </a>
</div>
<div class="col span_1_of_3">
<a href="http://me14ch.leedsnewmedia.net/slate/shop.html" class="button"> Find <p> your nearest store </p> </a>
</div>
<p>
Slate was created to operate eco-friendly projects for the community's benefit and provide job opportunities for individuals with learning challenges. Our organization consists of two primary divisions: the Feel Good Furniture Shops and the Feel Good Cafe. Explore our site to learn more about us, donate furniture, or check out our inventory catalog to enhance your living space!
</p>
</div>
<div class="subgroup2">
<div class="col span_1_of_3">
<form action="" method="post" class="subscribe-form">
<h4> Subscribe to our blog! </h4>
<label>
<span> Name </span>
<input id="name" type="text" name="name" placeholder="full" <="" label="">
<label>
<span> Email </span>
<input id="email" type="email" name="email" placeholder="<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ceabb6afa3bea2ab8eabb6afa3bea2abe0ada1e0bba5">[email protected]</a>" <="" label="">
<span> </span>
<input type="button" class="button4" value="Send">
</label>
</label>
</form>
</div>
</div>
The associated CSS styles are:
/* CUSTOM CSS */
.group{width:100%;}
.subgroup1{
height:200px;
width: 64.54%;
float:left;
}
.subgroup1 .col{width:48%;}
.subgroup2{
float:left;
width:25%;
}
.subgroup2 .col{width:100%;}