intrinsic ratio test

dabblet.css

/* intrinsic ratio test */

/* reset */
*{box-sizing:border-box;padding:0;margin:0;}

/* clearfix */
.cf:before,.cf:after,
.grid-wrap:before,.grid-wrap:after,
.grid:before,.grid:after,
.media:before,.media:after{content="";display:table;}
.cf:after,
.grid-wrap:after,
.grid:after,
.media:after{clear:both;}
.cf,
.grid-wrap,
.grid,
.media{*zoom:1;}

/* vertical rhythm */
ul,ol,dl,menu,
blockquote,p,address,figure,
pre,
table,fieldset,
hr,
address{margin-bottom:26px;}

/* global */
html{overflow-y:auto;}
body{font:13px/26px sans-serif;color:#666;}
img{max-width:100%;height:auto;}

/* headings */
h1,h2,h3,h4,h5,h6,
.heading{font-family:"Proxima Nova",AvenirNext-Regular,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size-adjust:0.488;color:#333;}
h1,.alpha,
h2,.beta{font-weight:200;}
h1,.alpha{font-size:28px;}
h2,.beta{font-size:24px;}
h3,.gamma{font-weight:300;font-size:18px;}
h4,.delta{font-weight:400;font-size:16px;}
h5,.epsilon,
h6,.zeta{font-size:13px;text-transform:uppercase;}
h5,.epsilon{font-weight:500;}
h6,.zeta{font-weight:bold;color:#666;}

/* the grid */
.grid-wrap{max-width:75.692em;*width:984px;position:relative;margin:0 auto 0.846em auto;}
.grid-wrap .grid-wrap{max-width:none;min-width:0;width:auto;margin:0 -12px 11px -12px;}
.grid{display:block;float:left;padding:0 12px;}
.grid-wrap > .grid{width:100%;}

/* nav object */
.nav{list-style:none;margin:0;}
.nav > li,
.nav > li > a{display:inline-block;*display:block;zoom:1;}

/* media object */
.media{display:block;}
.complementary{float:left;margin-right:12px}
.complementary_reverse{float:right;margin-left:12px;}
img.complementary,
.complementary img{display:block;}
.media,
.body{overflow:hidden;}
.body > :last-child{margin-bottom:0;}

/* intrinsic ratio */
.img_container{height:0;padding-bottom:65.909%;position:relative;}
.img_container .img{position:absolute;top:0;left:0;width:100%;height:100%;}

/* breadcrumbs object */
.breadcrumbs > li + li:before{content:"› ";}
.breadcrumbs-path > li + li:before{content:"/ ";}
.breadcrumb > li + li[data-breadcrumb]:before{content:attr(data-breadcrumb)" ";}
.breadcrumb_root{font-weight:bold;}

/* island object */
.landmark{padding:24px;}
.island{padding:12px;}
.islet{padding:6px;}

/* notice theme */
.notice{/**/margin:1%;/**/background-color:#fdfdfd;border:2px solid #ddd;border-radius:4px;}
.notice_error{color:;background-color:;border-color:;}
.notice_success{color:;background-color:;border-color:;}
.notice_caution{color:;background-color:;border-color:;}

/* sold car image theme */
.notice-sold_img{width:25%;}

/* breadcrumbs bar theme */
.breadcrumb-wrapper{background-color:#ddd;border-top:1px solid #dedede;}
.breadcrumb-wrapper > .row,
.breadcrumbs_page{margin-bottom:0;}
.breadcrumb-wrapper > .row{padding:8px 0;}
.breadcrumbs_page{margin-right:48px;}
.breadcrumbs_page a{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.breadcrumbs_page a{max-width:80px;font-weight:bold;padding:0 8px;}
.breadcrumbs_page a:hover{max-width:100%;}
.breadcrumbs_page .last a{max-width:none;}
.breadcrumbs_page .home-link{width:20px;background:url(http://st.listers.co.uk/img/icons/breadcrumb-home.png) no-repeat center center;}
.breadcrumbs_page .home-link span,
.top-of-page{display:block;text-indent:100%;}

/* top of page link theme */
.top-of-page{width:3.077em;height:26px;float:right;background-image:url(http://st.listers.co.uk/img/ui/top-of-page-arrow.png);background-repeat:no-repeat;background-position:center center;}

dabblet.html

<div class="grid-wrap">
    <div class="grid">
        <div class="island notice media">
            <div class="complementary notice-sold_img">
    	        <div class="img_container">
    	            <div class="ie-fix">
        	    	<img src="http://listers.co.uk/img/v/used/main/111504/sold.jpg" class="img">
    	            </div>
    	        </div>
            </div>
            <div class="body">
                <h1 class="heading">We’re sorry, this Volkswagen Touareg has been sold.</h1>
                <p>This Volkswagen Touareg Diesel 3.0 V6 TDI Altitude 5dr Auto was sold on October 19, 2012. Similar vehicles (if available) are shown below.</p>
            </div>
         </div>
     </div>
</div>

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}