Image cropping not working with perch_content_custom

I'm using perch_content_custom to output content from 'special offers'. My code looks like this:

perch_content_custom('main content', array(
    'page'=>'/special-offers/offer/*',
    'template'=>'special_offers_listing.html',

));

The content is outputting onto the page fine but the cropping that is being applied isn't being carried through. I can see in the admin its showing the cropping has worked and in the resources folder it has created the cropped image. On the page using perch_content_custom it is just outputting the full size orignal image.

 <article class="special-offer">
    <div class="special-offer-media">
        <img src="<perch:content id="thumbnail_image"/>" alt="<perch:content type="text" id="alt" />">
    </div>
</article>

And my template that is cropping the image

<img src="<perch:content type="image" id="thumbnail_image" label="Image" width="640" height="480" crop="true" bucket="offers" suppress="true"/>" alt="<perch:content type="text" id="alt" label="Special Offer Image Description" required="true" help="e.g. Free race day" />">

I've also tried adding height, width and crop to the template I'm outputting but it doesn't make any difference.

Am I missing something or are things handled differently for custom content?