From 9d5c2e29affa3b494cd505096160068db022d222 Mon Sep 17 00:00:00 2001
From: Maarten Billemont <lhunath@lyndir.com>
Date: Fri, 18 Jul 2014 10:05:07 -0400
Subject: [PATCH] Fix play icon on video button.

---
 Site/2013-05/css/main.css | 18 ++++++++++++++++++
 Site/2013-05/index.html   |  2 +-
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/Site/2013-05/css/main.css b/Site/2013-05/css/main.css
index 5b515da1..624f2177 100644
--- a/Site/2013-05/css/main.css
+++ b/Site/2013-05/css/main.css
@@ -137,6 +137,20 @@ h2.inline, h3.inline, h4.inline {
     margin-left: -2px;
     vertical-align: middle;
 }
+.middle.play::after {
+    content: "▶";
+    display: inline-block;
+    background: rgba(0, 0, 0, 0.7);
+    box-shadow: 0 0 1px white;
+    border-radius: 50%;
+    padding: 1ex;
+    font-size: 200%;
+    vertical-align: middle;
+    transition: box-shadow 0.3s;
+}
+.middle.play:hover::after {
+    box-shadow: 0 0 10px white;
+}
 
 .column {
     display: inline-block;
@@ -181,6 +195,9 @@ header .container {
     background: radial-gradient(70% 50% at 30% 50%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0.8) 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#44000000', endColorstr='#cc000000',GradientType=1 );
 }
+header a:link, header a:visited, header *[onclick] {
+    color: white;
+}
 header .background {
     position: absolute;
     width: 100%;
@@ -217,6 +234,7 @@ header .box .minimized,
 header .box .maximized {
     position: relative;
     vertical-align: middle;
+    font-size: 12pt;
 }
 header .box .minimized,
 header .box.active .maximized {
diff --git a/Site/2013-05/index.html b/Site/2013-05/index.html
index 43374a8a..0f696a46 100644
--- a/Site/2013-05/index.html
+++ b/Site/2013-05/index.html
@@ -65,7 +65,7 @@
                 <div class="box effect-8" onclick="$(this).toggleClass('active')">
                     <div class="minimized">
                         <img class="fit-height" src="http://i.vimeocdn.com/video/318668169_960.jpg" />
-                        <div class="middle">▷</div>
+                        <div class="middle play"></div>
                     </div>
                     <div class="maximized">
                         <iframe id="youtube" type="text/html" width="853" height="480" frameborder="0"