Design: focus blocks

<div class='focus-block'>
<h5></h5>

</div>

<div class='focus-block vivid-360'>
<h5>Add some colours</h5>
Add classes next to the "focus-block" class to make things more colorful.
The "vivid-" classes give bright colors.
Here we have added the "vivid-360" class to get a bright red.
See below for a list of "vivid-" classes.
</div>

<div class='focus-block size-6'>
<h5>Sizes matter</h5>
Control the size with the "size-" classes.
Here, we have added the "size-6" class to get a bigger box.
Try from size-1 to size-12. See below for more samples.
</div>

<div class='center'>
   <div class='focus-block size-2'>
   <h5>Center everything</h5>
   Encompass everything inside a <div> with the "center" class to have the boxes centered in the middle.
   </div>
</div>