-- Car Offers page --

dabblet.css

/* -- Car Offers page -- */

/* basic housekeeping */
*{padding:0;margin:0;}
html,body{min-height:100%;}
body{font:normal 13px/1.38461538 'Helvetica Neue',Helvetica,Arial,sans-serif;color:#333;}
a{color:#353978;}

abbr[title]{cursor:help;border-bottom:1px dotted;}

/* clearfix */
.LeasingOffer:after,.LeasingOffer:before{content:"";display:table;}
.LeasingOffer:after{clear:both;}
.LeasingOffer{zoom:1;}
/* list items */
.LeasingOffer{width:746px;overflow:hidden;color:#353978;background-color:#e5e5e5;border-radius:4px;margin:10px 0 0 10px;}
.LeasingOffer .Button{float:right;}
/* vehicle title */
.VehicleTitle{width:726px;overflow:hidden;padding:0 10px;}
span.Model{display:block;font-weight:400;font-size:18px;line-height:36px;float:left;}
span.PricePerMonth{display:block;font-weight:bold;font-size:16px;line-height:36px;float:right;}
/* vehicle image */
.VehicleImage{display:block;width:242px;overflow:hidden;float:left;margin:23px 2px 0 2px;}
/* vehicle quotes table*/
.QuotesListTable{width:498px;min-height:160px;float:left;overflow:hidden;background-color:#fff;border-collapse:collapse;border-spacing:0;border:0;}
.QuotesListTable th,.QuotesListTable td{padding:3px 6px;}
.QuotesListTable th{font-weight:400;text-align:left;color:#353978;background-color:#e5e5e5;}
.QuotesListTable tr:first-child{border-top:0;}
.QuotesListTable tr:hover{color:#fff;background-color:#353978;}
.muted{display:inline;color:#bbb;float:right;}
.Button{font-weight:bold;font-size:12bpx;color:#fff;text-transform:uppercase;text-shadow:0 1px 1px rgba(0,0,0,.5);text-decoration:none;background-color:#353978;background-image:url(http://st.listers.co.uk/img/site/bg-shiny.png);background-position:center center;background-repeat:repeat-x;border:1px solid #1b1d3c;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,0.25),inset 0 1px 1px rgba(255,255,255,0.5);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;padding:3px 4px;}
span.Disclaimer{display:block;width:100%;overflow:hidden;float:none;text-align:center;margin:10px 0;}

dabblet.html

<div class="LeasingOffer">
    	<div class="VehicleTitle">
        	<span class="Model">Honda Accord Diesel Tourer</span>
        	<span class="PricePerMonth">from &pound;199.99 per month</span>
    	</div>
    	<div class="VehicleImage">
        	<img src="http://placehold.it/242x160" alt="Indicative image of a new %query%."width="242" height="160">
    	</div>
	<table class="QuotesListTable" border="0">
		<thead>
			<tr>
				<th>Derivative</th>
				<th>Deposit</th>
				<th>Term</th>
				<th>Price</th>
				<th></th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td rowspan="2">2.2 i-DTEC Type-S 5dr</td>
				<td>&pound;1,199.94</td>
				<td>36</td>
				<td>&pound;199.99</td>
				<td rowspan="2"><a class="Button" href="#">Quote</a></td>
			</tr>
			<tr>
            			<td colspan="3"><span class="muted">quote based on 10,000 miles p/a</span></td>
			</tr>
			<tr>			
				<td rowspan="2">2.2 i-DTEC Type-S 5dr</td>
				<td>&pound;1,199.94</td>
				<td>36</td>
				<td>&pound;199.99</td>
				<td rowspan="2"><a class="Button" href="#">Quote</a></td>
			</tr>
			<tr>
            			<td colspan="3"><span class="muted">quote based on 10,000 miles p/a</span></td>
			</tr>
			<tr>		
				<td rowspan="2">2.2 i-DTEC Type-S 5dr</td>
				<td>&pound;1,199.94</td>
				<td>36</td>
				<td>&pound;199.99</td>
				<td rowspan="2"><a class="Button" href="#">Quote</a></td>
			</tr>
			<tr>
            			<td colspan="3"><span class="muted">quote based on 10,000 miles p/a</span></td>
			</tr>
			<tr>			
				<td rowspan="2">2.2 i-DTEC Type-S 5dr</td>
				<td>&pound;1,199.94</td>
				<td>36</td>
				<td>&pound;199.99</td>
				<td rowspan="2"><a class="Button" href="#">Quote</a></td>
			</tr>
			<tr>
            			<td colspan="3"><span class="muted">quote based on 10,000 miles p/a</span></td>
			</tr>
			<tr>			
				<td rowspan="2">2.2 i-DTEC Type-S 5dr</td>
				<td>&pound;1,199.94</td>
				<td>36</td>
				<td>&pound;199.99</td>
				<td rowspan="2"><a class="Button" href="#">Quote</a></td>
			</tr>
			<tr>
            			<td colspan="3"><span class="muted">quote based on 10,000 miles p/a</span></td>
			</tr>
		</tbody>
	</table>
	<br style="clear:both">
	<span class="disclaimer"><strong>Business users only.</strong> Prices exclude VAT.</span>
</div>

settings.json

{"view":"split","prefixfree":"1","page":"css"}