Search Field for RDC

by ritcheyer

HTML

<div id="SearchViewCopy">

<!-- Navigation for Search View-->
<nav class="nav-wrap group">
    <ul id="navTabULCollection" class="nav nav-search group">

        <li class="active">
            <a href="#" value="1" tabtxt="FOR SALE">FOR SALE
                <span class="icon ir icon-nav-nubby">╘</span>
            </a>
        </li>
        <li>
            <a href="#" value="5" tabtxt="FOR RENT">FOR RENT
                <span class="icon ir icon-nav-nubby">╘</span>
            </a>
        </li>
        <li>
            <a href="#" value="3" tabtxt="RECENTLY SOLD">RECENTLY SOLD
                <span class="icon ir icon-nav-nubby">╘</span>
            </a>
        </li>
        <li>
            <a href="#" value="4" tabtxt="NOT FOR SALE">NOT FOR SALE
                <span class="icon ir icon-nav-nubby">╘</span>
            </a>
        </li>
        
    </ul>
    <a class="nav-link" id="advSearch" data-controls-modal="advanced-search" data-backdrop="static" data-keyboard="true" title="Advanced Search">Advanced Search</a>
</nav>
  
<div class="bg-supporting rounded">
<!-- DIV having the Search Box and additional search options-->
    <div class="search search-standalone group">
<form action="/Public/FindAHome/Search" class="form form-alt-style" id="swForm" method="post">            <div class="row form-row form-inline">
                    <input autocomplete="off" class="predict custom-search" id="Location" name="Location" placeholder="Address, City, Zip, or Neighborhood" type="text" value="">
                    <a href="#" class="btn btn-primary evtSearch"><i class="icon40-magnifier-extra-large">Search</i></a>
                    
                    <span class="field-validation-valid" data-valmsg-for="Location" data-valmsg-replace="true"></span>
                    <input id="MLSListingID" name="MLSListingID" type="hidden" value="">
                    <input data-val="true" data-val-number="The field PropertyStatus must be a number." data-val-required="The...

CSS

/* 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 { font-weight: normal; }
h4 { font-size: 120%; }
fieldset { border: 0; }
em, i { font-style: normal; }
ul { list-style: none; }
/* Set nav to have higher z-index then most popvers and other elemetns */

/*-------------------------------------------------------
    REALTOR.COM
     - Author:       Jason Burachenski <[email protected]>
     - Contributors: Nick Cairns       <[email protected]>
                     Eric Ritchey      <[email protected]>
                     Kirsten Burns     <[email protected]>
    
    Please consult with the Front-End Team before making any changes here.
    Front-end team consists of:

    Eric Ritchey:      [email protected]      | Sr. UX Developer | Campbell
    Jason Burachenski: [email protected] | Sr. UX Developer | Vancouver
    Kirsten Burns:     [email protected]     | UX Developer     | Campbell
    
    If you are *not* able to consult with us before making changes, there
   ...