<!-- Default -->
<h2 class="label">Full Width Image in Text</h2>
<div>
    <figure class="featured "><img src="../../images/landscape.jpg" />
        <figcaption>Lots of lightbulbs hanging down <cite><a href="https://unsplash.com/photos/1NTFSnV-KLs">https://unsplash.com/photos/1NTFSnV-KLs</a></cite></figcaption>
    </figure>
    <p>I cant pay you there are more projects lined up charge extra the next time, nor can you use a high definition screenshot. Can you make pink a little more pinkish we don't need a backup, it never goes down! make it original, or this was not according
        to brief I have an awesome idea for a startup, i need you to build it for me. Anyway, you are the designer, you know what to do this looks perfect. Just Photoshop out the dog, add a baby, and make the curtains blue is this the best we can do.
        That's great, but can you make it work for ie 2 please could you rotate the picture to show the other side of the room? nor this is just a 5 minutes job can you make it look like this clipart i found. Give us a complimentary logo along with the
        website I have printed it out, but the animated gif is not moving could you rotate the picture to show the other side of the room? is this the best we can do I need a website. How much will it cost I think we need to start from scratch.</p>
</div>

<!-- Left Float -->
<h2 class="label">Image in Text - Left + 30% Width</h2>
<div>
    <figure class="_30 float-left"><img src="../../images/landscape.jpg" />
        <figcaption>Lots of lightbulbs hanging down <cite><a href="https://unsplash.com/photos/1NTFSnV-KLs">https://unsplash.com/photos/1NTFSnV-KLs</a></cite></figcaption>
    </figure>
    <p>I cant pay you there are more projects lined up charge extra the next time, nor can you use a high definition screenshot. Can you make pink a little more pinkish we don't need a backup, it never goes down! make it original, or this was not according
        to brief I have an awesome idea for a startup, i need you to build it for me. Anyway, you are the designer, you know what to do this looks perfect. Just Photoshop out the dog, add a baby, and make the curtains blue is this the best we can do.
        That's great, but can you make it work for ie 2 please could you rotate the picture to show the other side of the room? nor this is just a 5 minutes job can you make it look like this clipart i found. Give us a complimentary logo along with the
        website I have printed it out, but the animated gif is not moving could you rotate the picture to show the other side of the room? is this the best we can do I need a website. How much will it cost I think we need to start from scratch.</p>
</div>

<!-- Right Float -->
<h2 class="label">Right + 30% Width</h2>
<div>
    <figure class="_30 float-right"><img src="../../images/landscape.jpg" />
        <figcaption>Lots of lightbulbs hanging down <cite><a href="https://unsplash.com/photos/1NTFSnV-KLs">https://unsplash.com/photos/1NTFSnV-KLs</a></cite></figcaption>
    </figure>
    <p>I cant pay you there are more projects lined up charge extra the next time, nor can you use a high definition screenshot. Can you make pink a little more pinkish we don't need a backup, it never goes down! make it original, or this was not according
        to brief I have an awesome idea for a startup, i need you to build it for me. Anyway, you are the designer, you know what to do this looks perfect. Just Photoshop out the dog, add a baby, and make the curtains blue is this the best we can do.
        That's great, but can you make it work for ie 2 please could you rotate the picture to show the other side of the room? nor this is just a 5 minutes job can you make it look like this clipart i found. Give us a complimentary logo along with the
        website I have printed it out, but the animated gif is not moving could you rotate the picture to show the other side of the room? is this the best we can do I need a website. How much will it cost I think we need to start from scratch.</p>
</div>

<!-- Right Float -->
<h2 class="label">Left + 50% Width</h2>
<div>
    <figure class="_50 float-left"><img src="../../images/landscape.jpg" />
        <figcaption>Lots of lightbulbs hanging down <cite><a href="https://unsplash.com/photos/1NTFSnV-KLs">https://unsplash.com/photos/1NTFSnV-KLs</a></cite></figcaption>
    </figure>
    <p>I cant pay you there are more projects lined up charge extra the next time, nor can you use a high definition screenshot. Can you make pink a little more pinkish we don't need a backup, it never goes down! make it original, or this was not according
        to brief I have an awesome idea for a startup, i need you to build it for me. Anyway, you are the designer, you know what to do this looks perfect. Just Photoshop out the dog, add a baby, and make the curtains blue is this the best we can do.
        That's great, but can you make it work for ie 2 please could you rotate the picture to show the other side of the room? nor this is just a 5 minutes job can you make it look like this clipart i found. Give us a complimentary logo along with the
        website I have printed it out, but the animated gif is not moving could you rotate the picture to show the other side of the room? is this the best we can do I need a website. How much will it cost I think we need to start from scratch.</p>
</div>

<!-- Right Float -->
<h2 class="label">Right + 60% Width</h2>
<div>
    <figure class="_60 float-right"><img src="../../images/landscape.jpg" />
        <figcaption>Lots of lightbulbs hanging down <cite><a href="https://unsplash.com/photos/1NTFSnV-KLs">https://unsplash.com/photos/1NTFSnV-KLs</a></cite></figcaption>
    </figure>
    <p>I cant pay you there are more projects lined up charge extra the next time, nor can you use a high definition screenshot. Can you make pink a little more pinkish we don't need a backup, it never goes down! make it original, or this was not according
        to brief I have an awesome idea for a startup, i need you to build it for me. Anyway, you are the designer, you know what to do this looks perfect. Just Photoshop out the dog, add a baby, and make the curtains blue is this the best we can do.
        That's great, but can you make it work for ie 2 please could you rotate the picture to show the other side of the room? nor this is just a 5 minutes job can you make it look like this clipart i found. Give us a complimentary logo along with the
        website I have printed it out, but the animated gif is not moving could you rotate the picture to show the other side of the room? is this the best we can do I need a website. How much will it cost I think we need to start from scratch.</p>
</div>

<h2 class="label">{{ modifier }}</h2>
<div>
  <figure class="{{ class }} {{ direction }}"><img src="{{ path image }}" />
    <figcaption>{{ caption }} <cite><a href="{{ link }}">{{ link }}</a></cite></figcaption>
  </figure>
  <p>I cant pay you there are more projects lined up charge extra the next time, nor can you use a high definition screenshot. Can you make pink a little more pinkish we don't need a backup, it never goes down! make it original, or this was not according
    to brief I have an awesome idea for a startup, i need you to build it for me. Anyway, you are the designer, you know what to do this looks perfect. Just Photoshop out the dog, add a baby, and make the curtains blue is this the best we can do.
    That's great, but can you make it work for ie 2 please could you rotate the picture to show the other side of the room? nor this is just a 5 minutes job can you make it look like this clipart i found. Give us a complimentary logo along with the
    website I have printed it out, but the animated gif is not moving could you rotate the picture to show the other side of the room? is this the best we can do I need a website. How much will it cost I think we need to start from scratch.</p>
</div>

The image modifiers set size - _30, _50 & _60 - and size/location - featured (for full width) or float-left or float-right