Animate spot logo

masks/project.html

@@ -7,7 +7,7 @@
 		<div id="settings-panel">
 			<div class="settings-header">
 					<div class="logo"><img src="images/logo_black.png" /></div>
-					<div id="last_update"><p><img src="images/spot-logo-only.svg" /><abbr></abbr></p></div>
+					<div id="last_update"><p><span><img src="images/spot-logo-only.svg" alt="" /></span><abbr></abbr></p></div>
 			</div>
 			<div class="settings-sections">
 				<div id="settings-sections-scrollbox">

style/_common.scss

@@ -41,6 +41,25 @@
 	-webkit-filter: drop-shadow(1px 0px 0px rgba(0, 0, 0, $opacity));
 }
 
+@keyframes spotlogo {
+    0% {
+        transform: scale(1);
+    }
+    1.25% {
+        transform: scale(1.2);
+    }
+    2.5% {
+        transform: scale(1);
+        transform:rotate(0deg);
+    }
+    5% {
+        transform:rotate(360deg);
+    }
+    100% {
+        transform:rotate(360deg);
+    }
+}
+
 /* Common objects */
 
 body, textarea, input, button {

style/_mask_project.scss

@@ -574,10 +574,13 @@ $legend-color: $post-color;
 						cursor: pointer;
 						transform: translateX(calc(-0.5 * (12px + 0.5em))); //icon width + margin right
 
+						span {
+							margin-right: 0.5em;
 							img {
 								width: 12px;
 								vertical-align: middle;
-							margin-right: 0.5em;
+								animation: spotlogo 20s infinite;
+							}
 						}
 
 						abbr {