Units

HTML

<div style="width: 320px;">
    <div class="unit unit-ad">
        <div class="unit-body">
            <img src="http://placehold.it/300x250/49b1eb/ffffff&amp;text=Display+Media">
        </div>
    </div>

<div class="unit unit-fcma">

                    <div class="unit-header">
                        <h3 class="unit-title">What can I afford in San Francisco?</h3>
                        <span class="unit-caption">
                            <a href="#" title="Change Your Location">Change Location</a>
                        </span>
                    </div>
                    <div class="unit-body">
                        <form class="form">
                            <div class="form-row">
                                <select size="1">
                                    <option value="option1">Bacon ipsum dolor</option>
                                    <option value="option2">sit amet pancetta</option>
                                    <option value="option2">ut mollit ham et</option>
                                    <option value="option2">Pork loin laboris</option>
                                </select>
                            </div>
                            <div class="form-row group">
                                <input type="submit" value="Get Your Report" class="btn btn-secondary">
                            </div>
                            
                        </form>
                    </div>
                </div>

    
 <div class="unit unit-search-assist">
                    <div class="unit-header">
                        <h3 class="unit-title icon icon-before icon-magnifier-small">Search Assist</h3>
                        <span class="unit-subcaption">by REALTOR.com®</span>
                    </div>
                    <div class="unit-body">
                        <p><strong>Get</strong> <em>new listings</em> <span>when they hit the market.</span></p>
                        <a...

CSS

/* ----------------------------------------------------------

    Title: foundation.css
    
    Description: Within this file, you will find our site(s)-
    wide reset, typography, base widget styling, 
    
    Versions:
     - 0.1 - 2011-03-08 - Initial Creation and Development
     - 0.2 - 2012-02-07 - Adding box-sizing per Paul Irish
    

    
---------------------------------------------------------- */



/* 1. Reset ------------- */

/* apply a natural box layout model to all elements: http://paulirish.com/2012/box-sizing-border-box-ftw/ */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    box-sizing:         border-box;
}

/* http://maxvoltar.com/archive/-webkit-font-smoothing */
html { -webkit-font-smoothing: antialiased;}

body, div, 
h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, pre, code,
form, fieldset, legend, input, button, textarea, blockquote,
table, thead, tfoot, tbody, th, td, caption { margin: 0; padding: 0; }
article, aside, footer, header, hgroup, nav, section {display: block;}

body {
    font: normal 62.5%/1.5 Helvetica, Arial, sans-serif;
    color: #444;
}

iframe  { background-color: transparent; border: 0; }
p       { margin: 0 0 10px 0; font-size: 120%; }
a       { color: #0369b2; cursor: pointer; text-decoration: none; }
a:hover { text-decoration: underline; }

/* Default Styling for Typographical Goodness */
h1,h2,h3,h4,h5,h6 { margin: 0; } /* explicitly need to setup margin with classes */
h1,h2 { font-weight: normal;}
h4 { font-size: 120%;}
fieldset { border: 0; }
em,i { font-style: normal; }

input[type="text"], select, textarea {
    border: 1px solid #000;
    padding: 2px;
    width: 150px;
    -webkit-box-sizing: content-box;
    -moz-box-sizing:    content-box;
    -ms-box-sizing:     content-box;
    box-sizing:         content-box;

}
ul { list-style: none; }
/* Ads */
.ADLB { text-align: center; }
.ADLB,
.ADLB2,
.ADVBan { margin: 10px 0; }


/*...