Merge SLEGPI repo into this stand alone one !

Website Source Code/css/display-lux.css

@@ -0,0 +1,25 @@
+/* Main styles */
+@import url(https://fonts.googleapis.com/css?family=Open+Sans:800);
+
+.text {
+  fill: none;
+  stroke-width: 2;
+  stroke-linejoin: round;
+  stroke-dasharray: 70 330;
+  stroke-dashoffset: 0;
+}
+
+/* Other styles */
+html, body {
+  height: 80%;
+}
+
+body {
+  background: #ece5df;
+  background-size: .2em 100%;
+  font: 6em Open Sans, Impact;
+  text-transform: uppercase;
+  margin: 0;
+  text-align: center;
+  vertical-align: middle;
+}

Website Source Code/css/style.css

@@ -0,0 +1,82 @@
+html {
+  background: #ECE5DF;
+  text-align: center;
+  padding-top: 36px;
+}
+
+body {
+  display: inline-block;
+}
+
+.radial-timer {
+  overflow: hidden;
+  height: 144px;
+  width: 144px;
+  position: relative;
+}
+.radial-timer .radial-timer-half {
+  height: 144px;
+  width: 72px;
+  border-radius: 72px 0 0 72px;
+  background: red;
+  position: absolute;
+}
+.radial-timer .radial-timer-half:nth-of-type(2) {
+  z-index: 99999999;
+  -webkit-transform-origin: center right;
+  -webkit-transform: rotate(180deg);
+}
+.radial-timer .radial-timer-half:before {
+  content: "";
+  position: absolute;
+  top: 9px;
+  left: 9px;
+  height: 126px;
+  width: 63px;
+  border-radius: 67.5px 0 0 67.5px;
+  background: #ECE5DF;
+}
+.radial-timer .radial-timer-half:after {
+  content: "";
+  position: absolute;
+  background: #ECE5DF;
+  height: 288px;
+  width: 216px;
+  left: -144px;
+  top: -72px;
+  -webkit-transform-origin: center right;
+}
+.radial-timer.s-animate {
+  -webkit-transform-origin: center right;
+}
+.radial-timer.s-animate .radial-timer-half:nth-of-type(1):after {
+  -webkit-animation: rotateLeftMask 3s infinite linear;
+}
+.radial-timer.s-animate .radial-timer-half:nth-of-type(2):after {
+  -webkit-animation: rotateRightMask 3s infinite linear;
+}
+
+@-webkit-keyframes rotateLeftMask {
+  0% {
+    -webkit-transform: rotate(0deg);
+  }
+  50% {
+    -webkit-transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(180deg);
+  }
+}
+@-webkit-keyframes rotateRightMask {
+  0% {
+    -webkit-transform: rotate(0deg);
+  }
+  50% {
+    -webkit-transform: rotate(180deg);
+    visibility: hidden;
+  }
+  100% {
+    -webkit-transform: rotate(180deg);
+    visibility: hidden;
+  }
+}