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

@@ -1,19 +1,19 @@
 /* Animations */
 
-@-webkit-keyframes fadeIn { 
-  from { opacity: 0.3; } 
+@-webkit-keyframes fadeIn {
+  from { opacity: 0.3; }
 }
-@-moz-keyframes fadeIn { 
-  from { opacity: 0.3; } 
+@-moz-keyframes fadeIn {
+  from { opacity: 0.3; }
 }
-@-ms-keyframes fadeIn { 
-  from { opacity: 0.3; } 
+@-ms-keyframes fadeIn {
+  from { opacity: 0.3; }
 }
-@-o-keyframes fadeIn { 
-  from { opacity: 0.3; } 
+@-o-keyframes fadeIn {
+  from { opacity: 0.3; }
 }
-@keyframes fadeIn { 
-  from { opacity: 0.3; } 
+@keyframes fadeIn {
+  from { opacity: 0.3; }
 }
 
 @mixin animate($anim) {
@@ -25,7 +25,7 @@
 }
 
 .flicker {
-    @include animate(fadeIn 0.5s infinite alternate); 
+    @include animate(fadeIn 0.5s infinite alternate);
 }
 
 @mixin rounded($radius) {
@@ -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 {
@@ -79,4 +98,4 @@ input, textarea, button {
 			color: green;
 		}
 	}
-}
+}

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
 
-						img {
-							width: 12px;
-							vertical-align: middle;
+						span {
 							margin-right: 0.5em;
+							img {
+								width: 12px;
+								vertical-align: middle;
+								animation: spotlogo 20s infinite;
+							}
 						}
 
 						abbr {