+"SURVIVOR" demo

demo/index.css

@@ -2713,16 +2713,20 @@ div.icons ul li.package {
 .bonus-demos li {
  float: left;
  display: inline;
- width: 48%;
- margin-right: 2%;
+ width: 32%;
+ margin-right: 1%;
  text-align: center;
 }
 
 .bonus-demo a,
 .bonus-demos li a {
  opacity: 0.85;
- -moz-transition: 0.2s opacity ease-in-out;
- -webkit-transition: 0.2s opacity ease-in-out;
+ -moz-transition: 0.1s opacity ease-in-out;
+ -webkit-transition: 0.1s opacity ease-in-out;
+}
+
+.bonus-demos li img {
+ border-radius: 4px;
 }
 
 .bonus-demo a:hover,

index.html

@@ -430,20 +430,24 @@ <h4>Advanced <b>prototypes</b></h4>
 							<h3>Bonus</h3>
 							<h4>Additional <b>demos</b></h4>
 
-							<h4>MPC (sampler/drum machine) + Smashable Christmas Lights</h4>
+							<h4>Arcade game remake / drum machine / smashable christmas lights</h4>
 
 							<p>
-								Examples showing multi-track playback, progress and combining sound with animation:
+								Examples showing multi-track playback, progress and combinations of sound and animation:
 							</p>
 
 							<ul class="bonus-demos">
 
 								<li>
-									<a href="demo/mpc/" style="display:inline-block" title="MPC (sampler/drum machine) demo"><img src="demo/_image/mpc-screenshot.png" alt="MPC (drum machine) demo screenshot" style="display:block;width:100%;max-width:300px" /></a>
+									<a href="http://www.schillmania.com/survivor/" style="display:inline-block" title="SURVIVOR (1982 Commodore 64 game remake)"><img src="demo/_image/survivor-screenshot.png" alt="SURVIVOR (C64 game remake) demo screenshot" style="display:block;width:100%;max-width:200px" /></a>
 								</li>
 
 								<li>
-									<a href="demo/christmas-lights/" style="display:inline-block" title="Smashable Christmas Lights demo"><img src="demo/_image/christmas-lights.jpg" alt="Smash Christmas Lights demo" style="display:block;width:100%;max-width:260px;border-radius:7px" /></a>
+									<a href="demo/mpc/" style="display:inline-block" title="MPC (sampler/drum machine) demo"><img src="demo/_image/mpc-screenshot.png" alt="MPC (drum machine) demo screenshot" style="display:block;width:100%;max-width:200px" /></a>
+								</li>
+
+								<li>
+									<a href="demo/christmas-lights/" style="display:inline-block" title="Smashable Christmas Lights demo"><img src="demo/_image/christmas-lights.jpg" alt="Smash Christmas Lights demo" style="display:block;width:100%;max-width:200px;border-radius:7px" /></a>
 								</li>
 
 							</ul>
@@ -651,7 +655,7 @@ <h4>Basic SoundManager 2 set-up</h4>
 <pre class="block"><code>&lt;script src="soundmanager2.js"&gt;&lt;/script&gt;
 &lt;script&gt;
 soundManager.setup({
-  <span><span>// where to find flash SWFs, if needed...</span></span>
+  <span><span>// where to find flash SWFs, as needed</span></span>
   url: '<span>/path/to/swf-files/</span>',
   onready: function() {
     <span><span>// SM2 is ready to play audio!</span></span>