Issue 545 - Implement overflow for list of supporters

body.htm

 <meta property="title"><attr name="content">Acceptable Ads Manifesto</attr></meta>
 <meta name="description"><attr name="content">Help us make the Internet a better place by joining our Acceptable Ads Manifesto: a compromise that gets all parties out of the vicious cycle of blinking, bad online advertising.</attr></meta>
 <meta property="og:title"><attr name="content">Acceptable Ads Manifesto</attr></meta>
 <meta name="og:description"><attr name="content">Help us make the Internet a better place by joining our Acceptable Ads Manifesto: a compromise that gets all parties out of the vicious cycle of blinking, bad online advertising.</attr></meta>
 
 <style type="text/css">
 .viewcontent *[hidden],
 .viewcontent header,
 .viewcontent footer
 {
   display: inherit;
 }
 </style>
 
 <span id="share-text-title" hidden="true">Can ads be ... better? Sign our Manifesto to make it happen!</span>
 <span id="share-text-description" hidden="true">Help us make the Internet a better place by joining our Acceptable Ads Manifesto : a compromise that gets all parties out of the vicious cycle of blinking, bad online advertising.</span>
 
 <noscript>
   <style type="text/css">
   *[hidden]
   {
     display: inherit;
   }
+  
+  #supporters-overflow .supporter
+  {
+    display: inline !important;
+  }
   </style>
 </noscript>
 
 <div class="section">
   <header class="wrapper">
     <h1>
       <strong>Acceptable</strong> <span>Ads</span>
       <img src="/images/manifesto/acceptable-ads.png?a=show" alt="Acceptable Ads logo"/>
       <div>Manifesto</div>
     </h1>
@@ skipping 44 matching lines @@
       <a id="join-org" class="supporter" href="mailto:acceptableads@adblockplus.org" target="_blank">
         <button>
           <img src="/images/manifesto/icon-plus.png?a=show" alt="Join as organization"/>
         </button>
         <div>
           <strong>Join</strong> as organization
         </div>
       </a>
     </div>
     
+    <div id="supporters-overflow" class="collapsed">
+      <a id="supporters-overflow-more" href="#">show all</a>
+      <a id="supporters-overflow-less" href="#">hide all</a>
+      <div class="sprite"></div>
+      <div>
+        <a class="supporter" href="http://auxgaming.org/" target="_blank">Auxilium Gaming Community</a>
+        <a class="supporter" href="http://bhstudios.org/" target="_blank">Blue Husky Studios</a>
+        <a class="supporter" href="http://www.dataroads.org/" target="_blank">Data Roads Foundation</a>
+        <a class="supporter" href="http://unwatch.me/" target="_blank">Unwatch.Me</a>
+      </div>
+    </div>
+    
     <span class="emphasized">
       want to make the Internet a better place for everyone – by getting rid of obnoxious ads.
     </span>
     <p>
       Of course, we understand that advertising is the economic engine that drives the Internet and gives us free websites and great content. But as click-through rates continue to decline, many online advertisements have regrettably become obnoxious and obtrusive and annoying in a desperate effort to be heard. In turn, hundreds of millions of consumers have responded by installing adblockers, which further depresses click-through rates. The vicious cycle worsens.
     </p>
     <p>
       We want to reverse the cycle. We don't hate advertising per se, but nobody wants obtrusive blinking ads and content-obscuring rollovers running amok on their computers and mobile phones. So we have a good compromise; we call it <span class="emphasized">"Acceptable Ads."</span>
     </p>
     <h2>This is our manifesto:</h2>
@@ skipping 198 matching lines @@
       </li>
       <li>
         <a href="mailto:info@adblockplus.org">Contact us</a>
       </li>
       <li>
         <a href="https://adblockplus.org/blog/" target="_blank">Keep up with the latest</a>
       </li>
     </ul>
   </div>
 </footer>