Paste: Site

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
    <title>Title</title>
    <style type="text/css">
      body {
        margin: 0 auto;
        min-width: 952px;
        max-width: 1848px;
        }
      h1, h2, h3 {
        margin: 0 auto;
        padding: 0 4px;
        }
      h1 {
        float: left;
        }
      #search {
        float: left;
        margin: 8px 4px;
        }
      #searchInput {
        width: 100%;
        }
      h2 {
        clear: both;
        background-color: #f6f1ee;
        border-bottom: 1px solid #d2b9a6;
        }
      #content {
        margin: 0 auto;
        width: 80%;
        }
      #results {
        margin-top: 4px;
        width: 100%;
        border-collapse: collapse;
        }
      th.resultsCategory, th.resultsName, th.resultsSize, th.resultsUploadDate, th.resultsFlags, th.resultsSeeds, th.resultsPeers {
        padding: 0 2px;
        background-color: #d2b9a6;
        border: 2px solid #ffffff;
        overflow: hidden;
        text-overflow: ellipsis;
        }
      th.resultsCategory, td.resultsCategory {
        width: 9em;
        text-align: center;
        }
      th.resultsName, td.resultsName {
        max-width: 1px;
        }
      th.resultsSize, td.resultsSize {
        width: 5em;
        text-align: center;
        }
      th.resultsUploadDate, td.resultsUploadDate {
        width: 10em;
        text-align: center;
        }
      th.resultsFlags, td.resultsFlags {
        width: 5em;
        text-align: center;
        }
      th.resultsSeeds, td.resultsSeeds {
        width: 5em;
        text-align: center;
        }
      th.resultsPeers, td.resultsPeers {
        width: 5em;
        text-align: center;
        }
      tr.results {
        padding: 0 2px;
        background-color: #f6f1ee;
        border-left: 2px solid #ffffff;
        border-right: 2px solid #ffffff;
        }
      tr.results:hover {
        background: #fff;
        }
      td.resultsCategory, td.resultsName, td.resultsSize, td.resultsUploadDate, td.resultsSeeds, td.resultsPeers {
        padding: 0 2px;
        overflow: hidden;
        text-overflow: ellipsis;
        }
      #resultsNavigation {
        margin: 0;
        text-align: center;
        background-color: #f6f1ee;
        border: 2px solid #ffffff;
        }
      #footer {
        margin: 32px auto;
        text-align: center;
        }
      ul.footerNavigation {
        margin: 4px 0;
        padding: 0;
        list-style: none;
        }
      li.footerLeft, li.footerMiddle, li.footerRight {
        display: inline;
        margin: 0 -0.2em;
        padding: 0 8px;
        }
      li.footerLeft, li.footerMiddle {
        border-right: solid 1px #d2b9a6;
        }
      li.footerMiddle, li.footerRight {
        border-left: solid 1px #d2b9a6;
        }
    </style>
    <script type="text/javascript">
      function setAll(){
        s = document.forms.searchForm.elements;
        s.audio.checked=false;
        s.documents.checked=false;
        s.images.checked=false;
        s.software.checked=false;
        s.video.checked=false;
        s.nsfw.checked=false;
        }
      function rmAll(){
        s = document.forms.searchForm.elements;
        s.all.checked=false;
        }
    </script>
  </head>
  <body>
    <h1 style="font-size: 500%;">Heading</h1>
      <form id="searchForm" name="searchForm" action="/search/" method="post">
        <div id="search">
          <span id="navigation">foo bar baz</span><br />
          <input id="searchInput" name="search" type="text" value="Search..." onfocus="if( this.value == this.defaultValue ) this.value = '';" onblur="if( this.value == '' ){ this.value = this.defaultValue };" /><br />
          <button id="searchSubmit" type="submit">Search</button>
          <input class="searchOptions" name="all" type="checkbox" checked="checked" onclick="setAll();" />All
          <input class="searchOptions" name="audio" type="checkbox" onclick="rmAll();" />Audio
          <input class="searchOptions" name="documents" type="checkbox" onclick="rmAll();" />Documents
          <input class="searchOptions" name="images" type="checkbox" onclick="rmAll();" />Images
          <input class="searchOptions" name="software" type="checkbox" onclick="rmAll();" />Software
          <input class="searchOptions" name="video" type="checkbox" onclick="rmAll();" />Video
          <input class="searchOptions" name="nsfw" type="checkbox" onclick="rmAll();" />NSFW
        </div>
      </form>
    <h2>Subheading</h2>
    <div id="content">
      <table id="results">
        <tr class="results">
          <th class="resultsCategory">Category</th>
          <th class="resultsName">Name</th>
          <th class="resultsSize">Size</th>
          <th class="resultsUploadDate">Uploaded</th>
          <th class="resultsFlags">Flags</th>
          <th class="resultsSeeds">Seeds</th>
          <th class="resultsPeers">Peers</th>
        </tr>
        <tr class="results">
          <td class="resultsCategory">Documents</td>
          <td class="resultsName">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
          <td class="resultsSize">1000M</td>
          <td class="resultsUploadDate">2012-03-28</td>
          <td class="resultsFlags">A B C</td>
          <td class="resultsSeeds">2000</td>
          <td class="resultsPeers">750</td>
        </tr>
        <tr class="results">
          <td class="resultsCategory">Documents</td>
          <td class="resultsName">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
          <td class="resultsSize">1000M</td>
          <td class="resultsUploadDate">2012-03-28</td>
          <td class="resultsFlags">A B C</td>
          <td class="resultsSeeds">2000</td>
          <td class="resultsPeers">750</td>
        </tr>
      </table>
      <div id="resultsNavigation">1 2 3</div>
    </div>
    <div id="footer">
      <ul class="footerNavigation">
        <li class="footerLeft">Footer1</li>
        <li class="footerMiddle">Footer1</li>
        <li class="footerMiddle">Footer1</li>
        <li class="footerRight">Footer1</li>
      </ul>
      <ul class="footerNavigation">
        <li class="footerLeft">Footer1</li>
        <li class="footerMiddle">Footer2</li>
        <li class="footerMiddle">Footer2</li>
        <li class="footerMiddle">Footer2</li>
        <li class="footerRight">LongFooter</li>
      </ul>
      <ul class="footerNavigation">
        <li class="footerLeft">Footer3</li>
        <li class="footerMiddle">Footer3</li>
        <li class="footerRight">Footer3</li>
      </ul>
    </div>
  </body>
</html>