Add loader

public/styles/index.scss

@@ -51,6 +51,7 @@
 @import './objects/main.scss';
 
 @import './objects/_app.scss';
+@import './objects/_loader.scss';
 @import './objects/_navbar.scss';
 @import './objects/_video.scss';
 

public/styles/objects/_loader.scss

@@ -0,0 +1,32 @@
+/*
+ *  Loader
+ *    Styles for the animated loader.
+ *
+ *  Dependencies:
+ *    styles/tools/_transform.scss
+ *
+ *  Version:
+ *    1.0.0 - 2018/05/08
+ */
+.o-loader {
+  display: block;
+  width: 32px;
+  height: 32px;
+
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  @include t-translate(-50%, -50%);
+
+  &__image {
+    animation-name: k-loader;
+    animation-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
+    animation-iteration-count: infinite;
+    animation-duration: 1s;
+    width: 100%;
+    height: 100%;
+    > * {
+      stroke: $s-color--loader;
+    }
+  }
+}

public/styles/settings/colors.scss

@@ -30,3 +30,6 @@ $s-color--navbar__text: white;
 $s-color--navbar__text-hover: #CCC;
 $s-color--navbar__bar-hover: $s-color--pastel-blue;
 $s-color--navbar__bar-active: $s-color--pastel-green;
+
+//loader
+$s-color--loader: #CCC;