Add Microsoft logo

trueskawka · trueskawka · commit 3c9a6338ee6b · 2018-06-29T14:32:18.000-07:00
diff --git a/README.md b/README.md
@@ -21,4 +21,5 @@ Experiments in drawing and animating with pure CSS.
 17. [Ubuntu logo](/ubuntu) - [CodePen](https://codepen.io/trueskawka/pen/mLKaLw)
 18. [Adobe logo](/adobe) - [CodePen](https://codepen.io/trueskawka/pen/mLKQXy)
 19. [Twilio logo](/twilio) - [CodePen](https://codepen.io/trueskawka/pen/pVKQWr)
-20. [YouTube logo](/youtube) - [CodePen](https://codepen.io/trueskawka/pen/ZoRVyw)
+20. [YouTube logo](/youtube) - [CodePen](https://codepen.io/trueskawka/pen/ZoRVyw)
+21. [Microsoft logo](/microsoft) - [CodePen](https://codepen.io/trueskawka/pen/mLKQPZ)
diff --git a/microsoft/microsoft.css b/microsoft/microsoft.css
@@ -0,0 +1,29 @@
+body {
+  background-color: white;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.container {
+  position: relative;
+  height: 400px;
+}
+
+.microsoft {
+  /* colors */
+  /* blue #00a1f1 */
+  /* green #7cbb00 */
+  /* yellow #ffbb00 */
+  /* red #f65314 */
+  height: 200px;
+  width: 200px;
+
+  background: #f65314;
+  
+  box-shadow:
+    210px 0 0 0 #7cbb00,
+    0px 210px 0 0 #00a1f1,
+    210px 210px 0 0 #ffbb00;
+}
diff --git a/microsoft/microsoft.html b/microsoft/microsoft.html
@@ -0,0 +1,10 @@
+<html>
+  <head>
+    <link rel="stylesheet" href="microsoft.css">
+  </head>
+  <body>
+    <div class="container">
+      <div class="microsoft"></div>
+    </div>
+  </body>
+</html>
