Move deposit and linking to library css. Add less files

css/import.css

@@ -9,7 +9,6 @@
 @import "structure/breadcrumb.css";
 @import "structure/button.css";
 @import "structure/card.css";
-@import "structure/deposit.css";
 @import "structure/dropdown.css";
 @import "structure/height.css";
 @import "structure/icon.css";
@@ -30,5 +29,3 @@
 @import "structure/width.css";
 
 @import "openaire.css";
-
-@import "structure/linking.css";

css/structure/deposit.css

@@ -1,11 +0,0 @@
-.deposit {
-	/* Primary */
-	--button-primary-background: var(--primary-color);
-	--button-primary-background-image: linear-gradient(251deg, var(--primary-light-color) 0%, var(--primary-dark-color) 100%);
-	--button-primary-color: var(--light-color);
-	--button-primary-border-color: transparent;
-	--button-primary-background-hover: var(--secondary-color);
-	--button-primary-background-image-hover: none;
-	--button-primary-color-hover: var(--light-color);
-	--button-primary-border-color-hover: transparent;
-}

css/structure/linking.css

@@ -1,46 +0,0 @@
-:root {
-    --linking-basket-background: var(--primary-color);
-    --linking-next-step-disabled-background: var(--muted-color);
-    --linking-next-step-disabled-color: var(--disable-color);
-    --linking-next-step-active-background: var(--primary-color);
-    --linking-next-step-active-color: white;
-    --linking-result-button-selected-background: var(--secondary-color);
-    --linking-result-button-selected-color: white;
-    --linking-result-button-selected-border: var(--secondary-color);
-    --linking-result-button-enabled-background: white;
-    --linking-result-button-enabled-color: var(--primary-color);
-    --linking-result-button-enabled-border: var(--primary-color);
-}
-
-.linkingBasket{
-    background-color: var(--linking-basket-background) opacity 0.1;
-}
-
-.nextStep.active{
-    background-color: var(--linking-next-step-active-background);
-    color: var(--linking-next-step-active-color);
-    cursor: pointer;
-}
-
-.nextStep.disabled{
-    background-color: var(--linking-next-step-disabled-background);
-    color: var(--linking-next-step-disabled-color);
-}
-.community-card .uk-icon-button.selected, .claim-result-card .uk-icon-button.selected{
-    background-color: var(--linking-result-button-selected-background);
-    color: var(--linking-result-button-selected-color)  !important;
-    border-color: var(--linking-result-button-selected-border);
-    box-shadow: none;
-}
-
-.community-card .uk-icon-button.enabled, .claim-result-card .uk-icon-button.enabled{
-    background-color: var(--linking-result-button-enabled-background);
-    color: var(--linking-result-button-enabled-color) !important;
-    border:1px solid  var(--linking-result-button-enabled-border);
-    box-shadow: none;
-}
-
-.community-card .uk-icon-button{
-    width: 34px;
-    height: 34px;
-}

less/_import.less

@@ -0,0 +1,64 @@
+// Import UIKit core
+@import "~uikit/src/less/uikit";
+
+// Base
+@import "fonts";
+@import "color";
+@import "variables";
+@import "base";
+
+// Elements
+@import "link";
+@import "heading";
+@import "list";
+@import "icon";
+@import "form";
+@import "button";
+@import "progress";
+
+// Layout
+@import "section";
+@import "tile";
+@import "card";
+
+// Common
+@import "close";
+@import "totop";
+@import "alert";
+@import "label";
+@import "search";
+
+// JavaScript
+//@import "accordion";
+//@import "drop";
+@import "dropdown";
+@import "modal";
+//@import "sticky";
+//@import "offcanvas";
+//@import "switcher";
+//@import "leader";
+@import "notification";
+@import "tooltip";
+//@import "sortable";
+
+// Navs
+@import "nav";
+@import "navbar";
+@import "subnav";
+@import "breadcrumb";
+@import "pagination";
+@import "tab";
+@import "slidenav";
+@import "dotnav";
+
+// Utilities
+@import "width";
+@import "height";
+@import "text";
+@import "background";
+@import "utility";
+@import "margin";
+@import "inverse";
+
+// Extend
+@import "stepper";

less/alert.less

@@ -0,0 +1,42 @@
+@alert-background: @global-inverse-color;
+@alert-border: @global-emphasis-color;
+@alert-border-width: 1px;
+@alert-border-radius: @global-small-border-radius;
+@alert-close-top: @alert-padding + 2px;
+
+@alert-primary-background: @info-background-color;
+@alert-primary-color: @info-color;
+@alert-primary-border: @info-border-color;
+
+@alert-success-background: @success-background-color;
+@alert-success-color: @success-color;
+@alert-success-border: @success-border-color;
+
+@alert-warning-background: @warning-background-color;
+@alert-warning-color: @warning-color;
+@alert-warning-border: @warning-border-color;
+
+@alert-danger-background: @danger-background-color;
+@alert-danger-color: @danger-color;
+@alert-danger-border: @danger-border-color;
+
+.hook-alert() {
+  border-radius: @alert-border-radius;
+  border: @alert-border-width solid @alert-border;
+}
+
+.hook-alert-primary() {
+  border: @alert-border-width solid @alert-primary-border;
+}
+
+.hook-alert-success() {
+  border: @alert-border-width solid @alert-success-border;
+}
+
+.hook-alert-warning() {
+  border: @alert-border-width solid @alert-warning-border;
+}
+
+.hook-alert-danger() {
+  border: @alert-border-width solid @alert-danger-border;
+}

less/background.less

@@ -0,0 +1,9 @@
+/** Secondary */
+@background-secondary-background: @global-color;
+@background-color-opacity: @global-opacity;
+
+.hook-background-misc() {
+  .uk-background-primary-opacity {
+    background-color: fade(@background-primary-background, @background-color-opacity);
+  }
+}

less/base.less

@@ -0,0 +1,33 @@
+/** Strong */
+@base-strong-font-weight: 700;
+
+/** Mark */
+@base-mark-background: fade(@global-secondary-background, 50%);
+@base-mark-color: @global-color;
+
+/* Heading*/
+@base-heading-font-weight: 600;
+
+/** H1, H2, H3, H4, H5, H6 */
+@base-h1-font-size-m: 66px;
+@base-h1-font-size: 52px;
+@base-h1-line-height: 1.25;
+@base-h2-font-size-m: 52px;
+@base-h2-font-size: 41px;
+@base-h2-line-height: 1.25;
+@base-h3-font-size: 41px;
+@base-h3-line-height: 1.25;
+@base-h4-font-size: 32px;
+@base-h4-line-height: 1.25;
+@base-h5-font-size: 26px;
+@base-h5-line-height: 1.25;
+@base-h6-font-size: 20px;
+@base-h6-line-height: 1.34;
+
+/** Selection */
+@base-selection-background: @base-mark-background;
+@base-selection-color: @base-mark-color;
+
+/* Inverse */
+@inverse-base-link-color: @global-inverse-color;
+@inverse-base-link-hover-color: @global-inverse-color;

less/breadcrumb.less

@@ -0,0 +1,28 @@
+/** Item*/
+@breadcrumb-item-color: @global-meta-color;
+@breadcrumb-item-hover-color: @global-link-hover-color;
+@breadcrumb-item-hover-text-decoration: underline;
+@breadcrumb-item-active-color: @global-primary-background;
+
+/** Divider */
+@breadcrumb-divider: '\e5cc';
+@breadcrumb-divider-font-family: "Material Icons";
+@breadcrumb-divider-font-size: 20px;
+@breadcrumb-divider-margin-horizontal: 10px;
+
+.hook-breadcrumb-item() {
+  vertical-align: super;
+  line-height: @breadcrumb-divider-font-size;
+}
+
+.hook-breadcrumb-divider() {
+  font-family: @breadcrumb-divider-font-family;
+}
+
+/** Inverse */
+@inverse-breadcrumb-divider-color: @global-background;
+@inverse-breadcrumb-item-color: @global-background;
+@inverse-breadcrumb-item-hover-color: @global-background;
+@inverse-breadcrumb-item-active-color: @global-inverse-color;
+@inverse-breadcrumb-item-disabled-color: fade(@global-background, 0.5);
+

less/button.less

@@ -0,0 +1,387 @@
+@button-font-size: @global-small-font-size;
+@button-small-font-size: @global-small-font-size - 1px;
+@button-large-font-size: @global-font-size;
+@button-line-height: @global-control-small-height;
+@button-large-line-height: @global-control-small-height;
+@button-font-weight: 700;
+@button-border-width: @global-border-width;
+@button-text-transform: uppercase;
+@button-border-radius: 500px;
+
+/* Default */
+@button-default-background: @global-background;
+@button-default-color: @global-color;
+@button-default-box-shadow: @global-medium-box-shadow;
+@button-default-border: transparent;
+@button-default-hover-background: @global-background;
+@button-default-hover-color: @global-secondary-background;
+@button-default-hover-box-shadow: @global-small-box-shadow;
+@button-default-hover-border: transparent;
+@button-default-active-background: @global-background;
+@button-default-active-color: @global-secondary-background;
+@button-default-active-box-shadow: @global-small-box-shadow;
+@button-default-active-border: transparent;
+
+/* Primary */
+@button-primary-background: @global-primary-background;
+@button-primary-background-gradient: @global-primary-gradient;
+@button-primary-color: @global-inverse-color;
+@button-primary-box-shadow: @global-medium-box-shadow;
+@button-primary-border: transparent;
+@button-primary-hover-background: @global-secondary-background;
+@button-primary-hover-background-gradient: none;
+@button-primary-hover-color: @global-inverse-color;
+@button-primary-hover-box-shadow: @global-small-box-shadow;
+@button-primary-hover-border: transparent;
+@button-primary-active-background: @global-secondary-background;
+@button-primary-active-background-gradient: none;
+@button-primary-active-color: @global-inverse-color;
+@button-primary-active-box-shadow: @global-small-box-shadow;
+@button-primary-active-border: transparent;
+
+/* Secondary */
+@button-secondary-background: @global-background;
+@button-secondary-background-gradient: none;
+@button-secondary-color: @global-primary-background;
+@button-secondary-box-shadow: @global-medium-box-shadow;
+@button-secondary-border: @global-primary-background;
+@button-secondary-hover-background: @global-primary-background;
+@button-secondary-hover-background-gradient: @global-primary-gradient;
+@button-secondary-hover-color: @global-inverse-color;
+@button-secondary-hover-box-shadow: @global-small-box-shadow;
+@button-secondary-hover-border: transparent;
+@button-secondary-active-background: @global-primary-background;
+@button-secondary-active-background-gradient: @global-primary-gradient;
+@button-secondary-active-color: @global-inverse-color;
+@button-secondary-active-box-shadow: @global-small-box-shadow;
+@button-secondary-active-border: transparent;
+
+/* Danger */
+@button-danger-background: @global-danger-background;
+@button-danger-background-gradient: none;
+@button-danger-color: @global-inverse-color;
+@button-danger-box-shadow: @global-medium-box-shadow;
+@button-danger-border: @global-danger-background;
+@button-danger-hover-background: @global-background;
+@button-danger-hover-background-gradient: none;
+@button-danger-hover-color: @global-danger-background;
+@button-danger-hover-box-shadow: @global-small-box-shadow;
+@button-danger-hover-border: @global-danger-background;
+@button-danger-active-background: @global-background;
+@button-danger-active-background-gradient: none;
+@button-danger-active-color: @global-danger-background;
+@button-danger-active-box-shadow: @global-small-box-shadow;
+@button-danger-active-border: @global-danger-background;
+
+/* Text */
+@button-text-color: @global-primary-background;
+@button-text-hover-color: @button-text-color;
+
+/* Link */
+@button-link-color: @global-primary-background;
+@button-link-hover-color: @global-secondary-background;
+
+/* Disabled */
+@button-disabled-box-shadow: none;
+@button-disabled-border: @global-border;
+
+.hook-button() {
+  font-weight: @button-font-weight;
+  text-transform: @button-text-transform;
+  border-radius: @button-border-radius;
+}
+
+/* Default */
+.hook-button-default() {
+  box-shadow: @button-default-box-shadow;
+  border: @button-border-width solid @button-default-border;
+  background-origin: border-box;
+}
+
+.hook-button-default-hover() {
+  box-shadow: @button-default-hover-box-shadow;
+  border: @button-border-width solid @button-default-hover-border;
+}
+
+.hook-button-default-active() {
+  box-shadow: @button-default-active-box-shadow;
+  border: @button-border-width solid @button-default-active-border;
+}
+
+/* Primary */
+.hook-button-primary() {
+  box-shadow: @button-primary-box-shadow;
+  border: @button-border-width solid @button-primary-border;
+  background-image: @button-primary-background-gradient;
+  background-origin: border-box;
+}
+
+.hook-button-primary-hover() {
+  box-shadow: @button-primary-hover-box-shadow;
+  border: @button-border-width solid @button-primary-hover-border;
+  background-image: @button-primary-hover-background-gradient;
+}
+
+.hook-button-primary-active() {
+  box-shadow: @button-primary-active-box-shadow;
+  border: @button-border-width solid @button-primary-active-border;
+  background-image: @button-primary-active-background-gradient;
+}
+
+/* Secondary */
+.hook-button-secondary() {
+  box-shadow: @button-secondary-box-shadow;
+  border: @button-border-width solid @button-secondary-border;
+  background-image: @button-secondary-background-gradient;
+  background-origin: border-box;
+}
+
+.hook-button-secondary-hover() {
+  box-shadow: @button-secondary-hover-box-shadow;
+  border: @button-border-width solid @button-secondary-hover-border;
+  background-image: @button-secondary-hover-background-gradient;
+}
+
+.hook-button-secondary-active() {
+  box-shadow: @button-secondary-active-box-shadow;
+  border: @button-border-width solid @button-secondary-active-border;
+  background-image: @button-secondary-active-background-gradient;
+}
+
+/* Danger */
+.hook-button-danger() {
+  box-shadow: @button-danger-box-shadow;
+  border: @button-border-width solid @button-danger-border;
+  background-image: @button-danger-background-gradient;
+  background-origin: border-box;
+}
+
+.hook-button-danger-hover() {
+  box-shadow: @button-danger-hover-box-shadow;
+  border: @button-border-width solid @button-danger-hover-border;
+  background-image: @button-danger-hover-background-gradient;
+}
+
+.hook-button-danger-active() {
+  box-shadow: @button-danger-active-box-shadow;
+  border: @button-border-width solid @button-danger-active-border;
+  background-image: @button-danger-active-background-gradient;
+}
+
+
+/* Text */
+.hook-button-text() {
+  padding: 0 30px 0 0;
+  border-radius: 0;
+  position: relative;
+
+  &::before {
+    content: '\f1df';
+    font-family: "Material Icons Round";
+    font-size: 20px;
+    position: absolute;
+    top: 0;
+    right: 0;
+    transition: right linear 0.2s;
+  }
+
+  &:hover::before {
+    right: -5px;
+  }
+}
+
+/* Link */
+.hook-button-link() {
+  border-radius: 0;
+}
+
+/* Disable */
+.hook-button-disabled() {
+  box-shadow: @button-disabled-box-shadow;
+  border: @button-border-width solid @button-disabled-border;
+  background-image: none;
+}
+
+/* Inverse */
+
+/* Default */
+@inverse-button-default-background: @global-background;
+@inverse-button-default-color: @global-color;
+@inverse-button-default-box-shadow: @inverse-global-medium-box-shadow;
+@inverse-button-default-border: transparent;
+@inverse-button-default-hover-background: @global-background;
+@inverse-button-default-hover-color: @global-secondary-background;
+@inverse-button-default-hover-box-shadow: @inverse-global-small-box-shadow;
+@inverse-button-default-hover-border: transparent;
+@inverse-button-default-active-background: @global-background;
+@inverse-button-default-active-color: @global-secondary-background;
+@inverse-button-default-active-box-shadow: @inverse-global-small-box-shadow;
+@inverse-button-default-active-border: transparent;
+
+/* Primary */
+@inverse-button-primary-background: @global-primary-background;
+@inverse-button-primary-background-gradient: @global-primary-gradient;
+@inverse-button-primary-color: @global-inverse-color;
+@inverse-button-primary-box-shadow: @inverse-global-medium-box-shadow;
+@inverse-button-primary-border: transparent;
+@inverse-button-primary-hover-background: @global-secondary-background;
+@inverse-button-primary-hover-background-gradient: none;
+@inverse-button-primary-hover-color: @global-inverse-color;
+@inverse-button-primary-hover-box-shadow: @inverse-global-small-box-shadow;
+@inverse-button-primary-hover-border: transparent;
+@inverse-button-primary-active-background: @global-secondary-background;
+@inverse-button-primary-active-background-gradient: none;
+@inverse-button-primary-active-color: @global-inverse-color;
+@inverse-button-primary-active-box-shadow: @inverse-global-small-box-shadow;
+@inverse-button-primary-active-border: transparent;
+
+/* Secondary */
+@inverse-button-secondary-background: @global-background;
+@inverse-button-secondary-background-gradient: none;
+@inverse-button-secondary-color: @global-primary-background;
+@inverse-button-secondary-box-shadow: @inverse-global-medium-box-shadow;
+@inverse-button-secondary-border: @global-primary-background;
+@inverse-button-secondary-hover-background: @global-primary-background;
+@inverse-button-secondary-hover-background-gradient: @global-primary-gradient;
+@inverse-button-secondary-hover-color: @global-inverse-color;
+@inverse-button-secondary-hover-box-shadow: @inverse-global-small-box-shadow;
+@inverse-button-secondary-hover-border: transparent;
+@inverse-button-secondary-active-background: @global-primary-background;
+@inverse-button-secondary-active-background-gradient: @global-primary-gradient;
+@inverse-button-secondary-active-color: @global-inverse-color;
+@inverse-button-secondary-active-box-shadow: @inverse-global-small-box-shadow;
+@inverse-button-secondary-active-border: transparent;
+
+/* Danger */
+@inverse-button-danger-box-shadow: @inverse-global-medium-box-shadow;
+@inverse-button-danger-hover-box-shadow: @inverse-global-small-box-shadow;
+@inverse-button-danger-active-box-shadow: @inverse-global-small-box-shadow;
+
+/* Text */
+@inverse-button-text-color: @global-inverse-color;
+@inverse-button-text-hover-color: @inverse-button-text-color;
+
+/* Link */
+@inverse-button-link-color: @global-inverse-color;
+@inverse-button-link-hover-color: @global-inverse-color;
+@inverse-button-link-hover-text-transform: underline;
+
+/* Disabled */
+@inverse-button-disabled-background: @global-inverse-color;
+@inverse-button-disabled-box-shadow: none;
+@inverse-button-disabled-border: @global-inverse-color;
+@inverse-button-disabled-color: @global-muted-color;
+
+
+/* Default */
+.hook-inverse-button-default() {
+  border-color: @inverse-button-default-border;
+  background-origin: border-box;
+}
+
+.hook-inverse-button-default-hover() {
+  border-color: @inverse-button-default-hover-border;
+}
+
+.hook-inverse-button-default-active() {
+  box-shadow: @inverse-button-default-active-box-shadow;
+  border-color: @inverse-button-default-active-border;
+}
+
+/* Primary */
+.hook-inverse-button-primary() {
+  border-color: @inverse-button-primary-border;
+  background-image: @inverse-button-primary-background-gradient;
+  background-origin: border-box;
+}
+
+.hook-inverse-button-primary-hover() {
+  border-color: @inverse-button-primary-hover-border;
+  background-image: @inverse-button-primary-hover-background-gradient;
+}
+
+.hook-inverse-button-primary-active() {
+  border-color: @inverse-button-primary-active-border;
+  background-image: @inverse-button-primary-active-background-gradient;
+}
+
+/* Secondary */
+.hook-inverse-button-secondary() {
+  border-color: @inverse-button-secondary-border;
+  background-image: @inverse-button-secondary-background-gradient;
+  background-origin: border-box;
+}
+
+.hook-inverse-button-secondary-hover() {
+  border-color: @inverse-button-secondary-hover-border;
+  background-image: @inverse-button-secondary-hover-background-gradient;
+}
+
+.hook-inverse-button-secondary-active() {
+  border-color: @inverse-button-secondary-active-border;
+  background-image: @inverse-button-secondary-active-background-gradient;
+}
+
+.hook-inverse-misc() {
+  
+  /* Default */
+  .uk-button-default {
+    box-shadow: @inverse-button-default-box-shadow;
+    
+    &:hover {
+      box-shadow: @inverse-button-default-hover-box-shadow;
+    }
+    
+    &:active {
+      box-shadow: @inverse-button-default-active-box-shadow;
+    }
+  }
+
+  /* Primary */
+  .uk-button-primary {
+    box-shadow: @inverse-button-primary-box-shadow;
+
+    &:hover {
+      box-shadow: @inverse-button-primary-hover-box-shadow;
+    }
+
+    &:active {
+      box-shadow: @inverse-button-primary-active-box-shadow;
+    }
+  }
+
+  /* Secondary */
+  .uk-button-secondary {
+    box-shadow: @inverse-button-secondary-box-shadow;
+
+    &:hover {
+      box-shadow: @inverse-button-secondary-hover-box-shadow;
+    }
+
+    &:active {
+      box-shadow: @inverse-button-secondary-active-box-shadow;
+    }
+  }
+
+  /* Danger */
+  .uk-button-danger {
+    box-shadow: @inverse-button-danger-box-shadow;
+
+    &:hover {
+      box-shadow: @inverse-button-danger-hover-box-shadow;
+    }
+
+    &:active {
+      box-shadow: @inverse-button-danger-active-box-shadow;
+    }
+  }
+
+  /* Disable */
+  .uk-button:disabled {
+    border-color: @inverse-button-disabled-border;
+    background-image: none;
+    background-color: @inverse-button-disabled-background;
+    color: @inverse-button-disabled-color;
+    box-shadow: @inverse-button-disabled-box-shadow;
+  }
+}

less/card.less

@@ -0,0 +1,100 @@
+@card-border-radius: @global-border-radius;
+
+@card-default-background: @global-background;
+@card-default-box-shadow: @global-large-box-shadow;
+@card-default-hover-background: @card-default-background;
+@card-default-hover-box-shadow: @global-medium-box-shadow;
+@card-default-header-border-width: @global-border-width;
+@card-default-header-border: @global-border;
+@card-default-footer-border-width: @global-border-width;
+@card-default-footer-border: @global-border;
+
+@card-primary-background: @global-primary-background;
+@card-primary-background-gradient: @global-primary-gradient;
+@card-primary-box-shadow: @global-large-box-shadow;
+@card-primary-hover-background: @card-primary-background;
+@card-primary-hover-box-shadow: @global-medium-box-shadow;
+@card-primary-hover-background-gradient: @global-primary-gradient;
+
+@card-secondary-background: @global-muted-background;
+@card-secondary-box-shadow: @global-large-box-shadow;
+@card-secondary-color: @global-color;
+@card-secondary-color-mode: dark;
+@card-secondary-hover-background: @card-secondary-background;
+@card-secondary-hover-box-shadow: @global-medium-box-shadow;
+
+.hook-card() {
+  transition: .1s ease-in-out;
+  transition-property: color,background-color,background-size,border-color,box-shadow,transform,top;
+  border-radius: @card-border-radius;
+}
+
+.hook-card-header() {
+  border-radius: @card-border-radius @card-border-radius 0 0;
+}
+
+.hook-card-footer() {
+  border-radius: 0 0 @card-border-radius @card-border-radius;
+}
+
+.hook-card-default() {
+  box-shadow: @card-default-box-shadow;
+}
+
+.hook-card-default-hover() {
+  box-shadow: @card-default-hover-box-shadow;
+}
+
+.hook-card-default-header() {
+  border-bottom: @card-default-header-border-width solid @card-default-header-border;
+}
+
+.hook-card-default-footer() {
+  border-top: @card-default-footer-border-width solid @card-default-footer-border;
+}
+
+.hook-card-primary() {
+  box-shadow: @card-primary-box-shadow;
+  background-image: @card-primary-background-gradient;
+}
+
+.hook-card-primary-hover() {
+  box-shadow: @card-primary-hover-box-shadow;
+}
+
+.hook-card-secondary() {
+  box-shadow: @card-secondary-box-shadow;
+}
+
+.hook-card-secondary-hover() {
+  box-shadow: @card-secondary-hover-box-shadow;
+}
+
+@inverse-card-box-shadow: @inverse-global-large-box-shadow;
+@inverse-card-hover-box-shadow: @inverse-global-medium-box-shadow;
+
+.hook-inverse-misc() {
+  .uk-card-default {
+    box-shadow: @inverse-card-box-shadow;
+
+    &.uk-card-hover:hover {
+      box-shadow: @inverse-card-hover-box-shadow;
+    }
+  }
+
+  .uk-card-primary {
+    box-shadow: @inverse-card-box-shadow;
+
+    &.uk-card-hover:hover {
+      box-shadow: @inverse-card-hover-box-shadow;
+    }
+  }
+
+  .uk-card-secondary {
+    box-shadow: @inverse-card-box-shadow;
+
+    &.uk-card-hover:hover {
+      box-shadow: @inverse-card-hover-box-shadow;
+    }
+  }
+}

less/close.less

@@ -0,0 +1,2 @@
+@close-color: @global-meta-color;
+@close-hover-color: @global-link-hover-color;

less/color.less

@@ -0,0 +1,48 @@
+  @primary-color: #211F7E;
+  @primary-light-color: #4687E6;
+  @primary-dark-color: #1F2379;
+  @secondary-color: #3086ED;
+
+  @dark-color: #000000;
+  @grey-color: #2C2C2C;
+  @placeholder-color: #8E8E8E;
+  @disable-color: #B3B3B3;
+  @muted-color: #EAEAEA;
+  @light-grey-color: #6E6E6E;
+  @light-color: #FFFFFF;
+  @table-color: #F5F5F5;
+  @default-color: #F9F9F9;
+  @light-blue: #F4F8F9;
+  @info-color: #095ABA;
+  @info-border-color: #2680EB;
+  @info-background-color: #F8FFFF;
+  @warning-color: #BD640D;
+  @warning-border-color: #E68619;
+  @warning-background-color: #FFFAF3;
+  @success-color: #107154;
+  @success-border-color: #2D9D78;
+  @success-background-color: #FCFFF5;
+  @danger-color: #BB121A;
+  @danger-border-color: #E34850;
+  @danger-background-color: #FFF6F6;
+
+  /* Explore */
+  @explore-color: #E96439;
+  @explore-light-color: #FF7A4E;
+  @explore-dark-color: #E96439;
+  /* Provide */
+  @provide-color: #37C7E9;
+  /* Monitor */
+  @monitor-color: #56A601;
+  @monitor-light-color: #8BCC00;
+  @monitor-dark-color: #228001;
+  /* Connect */
+  @connect-color: #EBB13E;
+  @connect-light-color: #FECA1D;
+  @connect-dark-color: #FE9F1D;
+  /* Graph */
+  @graph-color: #FA193E;
+  /* ORCID */
+  @orcid-color: #A6CE39;
+  /* Argos */
+  @argos-color: #17BEBB;

less/dotnav.less

@@ -0,0 +1,13 @@
+@dotnav-margin-horizontal: 20px;
+@dotnav-item-width: 16px;
+@dotnav-item-background: fade(@global-primary-background, 50%);
+@dotnav-item-hover-background: @global-primary-background;
+@dotnav-item-onclick-background: @global-primary-background;
+@dotnav-item-active-background: @global-primary-background;
+@dotnav-item-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.15), 1px 1px 1px #fff;
+
+.hook-dotnav-item() {
+  transition: .2s ease-in-out;
+  transition-property: color,background-color,border-color,box-shadow;
+  box-shadow: @dotnav-item-box-shadow;
+}

less/dropdown.less

@@ -0,0 +1,51 @@
+@dropdown-min-width: 260px;
+@dropdown-padding: 5px 0;
+@dropdown-background: @global-background;
+@dropdown-border-width: @global-border-width;
+@dropdown-border: @global-border;
+@dropdown-border-radius: @global-border-radius;
+@dropdown-box-shadow: @global-default-shadow;
+
+@dropdown-nav-font-size: @global-small-font-size;
+@dropdown-nav-font-weight: 400;
+
+@dropdown-nav-item-padding-horizontal: 30px;
+@dropdown-nav-item-padding-vertical: 5px;
+@dropdown-nav-item-active-font-weight: 600;
+
+@dropdown-nav-item-color: @global-color;
+@dropdown-nav-item-hover-color: @global-color;
+@dropdown-nav-item-hover-background: @light-blue;
+
+@dropdown-nav-divider-margin: 5px;
+
+.hook-dropdown() {
+  box-shadow: @dropdown-box-shadow;
+  border: @dropdown-border-width solid @dropdown-border;
+  border-radius: @dropdown-border-radius;
+}
+
+.hook-dropdown-nav() {
+  font-size: @dropdown-nav-font-size;
+  font-weight: @dropdown-nav-font-weight;
+}
+
+.hook-dropdown-nav-item() {
+  &:extend(.uk-text-truncate);
+  display: inherit !important;
+  padding: @dropdown-nav-item-padding-vertical @dropdown-nav-item-padding-horizontal !important;
+}
+
+.hook-dropdown-nav-item-hover() {
+  background-color: @dropdown-nav-item-hover-background;
+}
+
+.hook-dropdown-nav-divider() {
+  margin: @dropdown-nav-divider-margin 0;
+}
+
+.hook-dropdown-misc() {
+  .uk-dropdown-nav > li.uk-active > a {
+    font-weight: @dropdown-nav-item-active-font-weight;
+  }
+}

less/fonts.less

@@ -0,0 +1,56 @@
+/* Aileron */
+
+@font-face {  font-family: "aileron";  font-style: italic;  font-weight: 100;   src: url("../media/fonts/aileron/aileron-thinitalic.eot");  src: url("../media/fonts/aileron/aileron-thinitalic.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-thinitalic.woff2") format('woff2'), url("../media/fonts/aileron/aileron-thinitalic.woff") format('woff'), url("../media/fonts/aileron/aileron-thinitalic.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: normal;  font-weight: 100;   src: url("../media/fonts/aileron/aileron-thin.eot");  src: url("../media/fonts/aileron/aileron-thin.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-thin.woff2") format('woff2'), url("../media/fonts/aileron/aileron-thin.woff") format('woff'), url("../media/fonts/aileron/aileron-thin.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: italic;  font-weight: 300;   src: url("../media/fonts/aileron/aileron-lightitalic.eot");  src: url("../media/fonts/aileron/aileron-lightitalic.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-lightitalic.woff2") format('woff2'), url("../media/fonts/aileron/aileron-lightitalic.woff") format('woff'), url("../media/fonts/aileron/aileron-lightitalic.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: normal;  font-weight: 300;   src: url("../media/fonts/aileron/aileron-light.eot");  src: url("../media/fonts/aileron/aileron-light.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-light.woff2") format('woff2'), url("../media/fonts/aileron/aileron-light.woff") format('woff'), url("../media/fonts/aileron/aileron-light.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: italic;  font-weight: 400;   src: url("../media/fonts/aileron/aileron-italic.eot");  src: url("../media/fonts/aileron/aileron-italic.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-italic.woff2") format('woff2'), url("../media/fonts/aileron/aileron-italic.woff") format('woff'), url("../media/fonts/aileron/aileron-italic.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: normal;  font-weight: 400;   src: url("../media/fonts/aileron/aileron-regular.eot");  src: url("../media/fonts/aileron/aileron-regular.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-regular.woff2") format('woff2'), url("../media/fonts/aileron/aileron-regular.woff") format('woff'), url("../media/fonts/aileron/aileron-regular.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: italic;  font-weight: 600;   src: url("../media/fonts/aileron/aileron-semibolditalic.eot");  src: url("../media/fonts/aileron/aileron-semibolditalic.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-semibolditalic.woff2") format('woff2'), url("../media/fonts/aileron/aileron-semibolditalic.woff") format('woff'), url("../media/fonts/aileron/aileron-semibolditalic.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: normal;  font-weight: 600;   src: url("../media/fonts/aileron/aileron-semibold.eot");  src: url("../media/fonts/aileron/aileron-semibold.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-semibold.woff2") format('woff2'), url("../media/fonts/aileron/aileron-semibold.woff") format('woff'), url("../media/fonts/aileron/aileron-semibold.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: italic;  font-weight: 700;   src: url("../media/fonts/aileron/aileron-bolditalic.eot");  src: url("../media/fonts/aileron/aileron-bolditalic.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-bolditalic.woff2") format('woff2'), url("../media/fonts/aileron/aileron-bolditalic.woff") format('woff'), url("../media/fonts/aileron/aileron-bolditalic.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: normal;  font-weight: 700;   src: url("../media/fonts/aileron/aileron-bold.eot");  src: url("../media/fonts/aileron/aileron-bold.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-bold.woff2") format('woff2'), url("../media/fonts/aileron/aileron-bold.woff") format('woff'), url("../media/fonts/aileron/aileron-bold.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: italic;  font-weight: 900;   src: url("../media/fonts/aileron/aileron-blackitalic.eot");  src: url("../media/fonts/aileron/aileron-blackitalic.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-blackitalic.woff2") format('woff2'), url("../media/fonts/aileron/aileron-blackitalic.woff") format('woff'), url("../media/fonts/aileron/aileron-blackitalic.ttf") format('truetype');  }
+@font-face {  font-family: "aileron";  font-style: normal;  font-weight: 900;   src: url("../media/fonts/aileron/aileron-black.eot");  src: url("../media/fonts/aileron/aileron-black.eot?#iefix") format('embedded-opentype'), url("../media/fonts/aileron/aileron-black.woff2") format('woff2'), url("../media/fonts/aileron/aileron-black.woff") format('woff'), url("../media/fonts/aileron/aileron-black.ttf") format('truetype');  }
+
+/* Material Icons */
+
+@font-face {  font-family: 'Material Icons';  font-style: normal;  font-weight: 400;
+  src: url("../media/fonts/material-icons/MaterialIcons-Regular.eot");
+  src: local('Material Icons'), local('MaterialIcons-Regular'),
+  url("../media/fonts/material-icons/MaterialIcons-Regular.woff2") format('woff2'),
+  url("../media/fonts/material-icons/MaterialIcons-Regular.woff") format('woff'),
+  url("../media/fonts/material-icons/MaterialIcons-Regular.ttf") format('truetype');
+}
+
+@font-face {  font-family: 'Material Icons Outlined';  font-style: normal;  font-weight: 400;
+  src: url("../media/fonts/material-icons/MaterialIconsOutlined-Regular.eot");
+  src: local('Material Icons Outlined'), local('MaterialIconsOutlined-Regular'),
+  url("../media/fonts/material-icons/MaterialIconsOutlined-Regular.woff2") format('woff2'),
+  url("../media/fonts/material-icons/MaterialIconsOutlined-Regular.woff") format('woff'),
+  url("../media/fonts/material-icons/MaterialIconsOutlined-Regular.ttf") format('truetype');
+}
+
+@font-face {  font-family: 'Material Icons Round';  font-style: normal;  font-weight: 400;
+  src: url("../media/fonts/material-icons/MaterialIconsRound-Regular.eot");
+  src: local('Material Icons'), local('MaterialIconsRound-Regular'),
+  url("../media/fonts/material-icons/MaterialIconsRound-Regular.woff2") format('woff2'),
+  url("../media/fonts/material-icons/MaterialIconsRound-Regular.woff") format('woff'),
+  url("../media/fonts/material-icons/MaterialIconsRound-Regular.ttf") format('truetype');
+}
+
+@font-face {  font-family: 'Material Icons Sharp';  font-style: normal;  font-weight: 400;
+  src: url("../media/fonts/material-icons/MaterialIconsSharp-Regular.eot");
+  src: local('Material Icons Sharp'), local('MaterialIconsSharp-Regular'),
+  url("../media/fonts/material-icons/MaterialIconsSharp-Regular.woff2") format('woff2'),
+  url("../media/fonts/material-icons/MaterialIconsSharp-Regular.woff") format('woff'),
+  url("../media/fonts/material-icons/MaterialIconsSharp-Regular.ttf") format('truetype');
+}
+
+@font-face {  font-family: 'Material Icons Two Tone';  font-style: normal;  font-weight: 400;
+  src: url("../media/fonts/material-icons/MaterialIconsTwoTone-Regular.eot");
+  src: local('Material Icons Two Tone'), local('MaterialIconsTwoTone-Regular'),
+  url("../media/fonts/material-icons/MaterialIconsTwoTone-Regular.woff2") format('woff2'),
+  url("../media/fonts/material-icons/MaterialIconsTwoTone-Regular.woff") format('woff'),
+  url("../media/fonts/material-icons/MaterialIconsTwoTone-Regular.ttf") format('truetype');
+}

less/form.less

@@ -0,0 +1,53 @@
+@form-padding-horizontal: 25px;
+@form-radio-margin-top: -2px;
+@form-background: @global-inverse-color;
+@form-placeholder-color: @global-meta-color;
+@form-border-radius: @global-border-radius;
+@form-box-shadow: @global-inset-shadow;
+
+/** Radio - Checkbox*/
+@form-radio-background: @global-inverse-color;
+@form-radio-focus-background: @global-inverse-color;
+@form-radio-checked-background: @global-secondary-background;
+@form-radio-checked-focus-background: @global-secondary-background;
+@form-radio-border: @global-border;
+@form-radio-border-width: @global-border-width;
+@form-radio-border-radius: @global-small-border-radius;
+
+.hook-form() {
+  transition: .2s ease-in-out;
+  transition-property: color, background-color, border-color, box-shadow;
+  box-shadow: @form-box-shadow;
+  border-radius: @form-border-radius;
+}
+
+.hook-form-radio() {
+  border-radius: @form-radio-border-radius;
+  border: @form-radio-border-width solid @form-radio-border;
+}
+
+.hook-form-radio-checked() {
+  background-size: contain;
+}
+
+.hook-form-misc() {
+  button, input[type="button"], input[type="checkbox"],
+  input[type="radio"], input[type="reset"], input[type="submit"],
+  label, select {
+    cursor: pointer;
+  }
+}
+
+.hook-form-misc() {
+  [style*="visibility: hidden"] .input-wrapper {
+    opacity: 0;
+  }
+
+  @import (multiple) 'input';
+}
+
+/** Inverse */
+.hook-inverse-misc() {
+  @import (multiple) 'input';
+  @input-mode: @inverse-global-color-mode;
+}

less/heading.less

@@ -0,0 +1,42 @@
+@heading-font-weight: 700;
+@heading-line-height: 1.25;
+
+@heading-small-font-size-l: 74px;
+@heading-small-font-weight: @heading-font-weight;
+@heading-small-line-height: @heading-line-height;
+
+@heading-medium-font-size-l: 83px;
+@heading-medium-font-weight: @heading-font-weight;
+@heading-medium-line-height: @heading-line-height;
+
+@heading-large-font-size-l: 94px;
+@heading-large-font-weight: @heading-font-weight;
+@heading-large-line-height: @heading-line-height;
+
+@heading-xlarge-font-size-l: 119px;
+@heading-xlarge-font-weight: @heading-font-weight;
+@heading-xlarge-line-height: @heading-line-height;
+
+@heading-2xlarge-font-size-l: 133px;
+@heading-2xlarge-font-weight: @heading-font-weight;
+@heading-2xlarge-line-height: @heading-line-height;
+
+.hook-heading-small() {
+  font-weight: @heading-small-font-weight;
+}
+
+.hook-heading-medium() {
+  font-weight: @heading-medium-font-weight;
+}
+
+.hook-heading-large() {
+  font-weight: @heading-large-font-weight;
+}
+
+.hook-heading-xlarge() {
+  font-weight: @heading-xlarge-font-weight;
+}
+
+.hook-heading-2xlarge() {
+  font-weight: @heading-2xlarge-font-weight;
+}

less/height.less

@@ -0,0 +1,14 @@
+@height-xsmall-height: 80px;
+@height-small-height: 160px;
+@height-medium-height: 320px;
+@height-large-height: 480px;
+
+.hook-height-misc() {
+  .uk-height-xsmall {
+    height: @height-xsmall-height;
+  }
+
+  .uk-height-max-xsmall {
+    max-height: @height-xsmall-height;
+  }
+}

less/icon.less

@@ -0,0 +1,110 @@
+@icon-button-size: 48px;
+@icon-bg-size: @icon-button-size;
+@icon-bg-size-medium: @icon-button-size*1.5;
+@icon-bg-size-large: @icon-button-size*2;
+
+@icon-button-background: @button-default-background;
+@icon-button-color: @button-default-color;
+@icon-button-hover-background: @button-default-hover-background;
+@icon-button-hover-color: @button-default-hover-color;
+@icon-button-active-background: @button-default-active-background;
+@icon-button-active-color: @button-default-active-color;
+
+@icon-box-shadow: @global-medium-box-shadow;
+@icon-hover-box-shadow: @global-small-box-shadow;
+
+@icon-type: {
+  outlined: Outlined;
+  round: Round;
+  sharp: Sharp;
+  two-tone: Two Tone;
+}
+
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: @icon-image-size;
+  line-height: 1;
+  letter-spacing: normal;
+  text-transform: none;
+  display: inline-block;
+  white-space: nowrap;
+  word-wrap: normal;
+  direction: ltr;
+  background: inherit;
+  /* Support for all WebKit browsers. */
+  -webkit-font-smoothing: antialiased;
+  /* Support for Safari and Chrome. */
+  text-rendering: optimizeLegibility;
+  /* Support for Firefox. */
+  -moz-osx-font-smoothing: grayscale;
+  /* Support for IE. */
+  font-feature-settings: 'liga';
+
+
+  each(@icon-type, {
+    &.@{key} {
+      font-family: 'Material Icons @{value}';
+    }
+  });
+}
+
+.hook-icon-button() {
+  border: none;
+  box-shadow: @icon-box-shadow;
+
+  &:disabled {
+    box-shadow: none;
+    background-image: none;
+    background-color: @global-muted-background;
+    color: @global-muted-color;
+  }
+}
+
+.hook-icon-button-hover() {
+  box-shadow: @icon-hover-box-shadow;
+}
+
+.hook-icon-misc() {
+  /* Default circle element for SVGs */
+  .uk-icon-bg-shadow {
+    border-radius: 100px;
+    width: @icon-button-size;
+    height: @icon-button-size;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-shadow: @icon-box-shadow;
+  }
+
+  .uk-icon-bg-shadow-medium {
+    width: @icon-bg-size-medium;
+    height: @icon-bg-size-medium;
+  }
+
+  .uk-icon-bg-shadow-large {
+    width: @icon-bg-size-large;
+    height: @icon-bg-size-large;
+  }
+  /**/
+}
+
+/** Inverse */
+@inverse-icon-box-shadow: @inverse-global-medium-box-shadow;
+@inverse-icon-hover-box-shadow: @inverse-global-small-box-shadow;
+
+.hook-inverse-misc() {
+
+  .uk-icon-bg-shadow {
+    box-shadow: @inverse-icon-box-shadow;
+  }
+
+  .uk-icon-button {
+    box-shadow: @inverse-icon-box-shadow;
+
+    &:hover {
+      box-shadow: @inverse-icon-hover-box-shadow;
+    }
+  }
+}

less/input.less

@@ -0,0 +1,274 @@
+@input-mode: dark;
+
+.input-wrapper {
+  /* Basic Information */
+  --input-placeholder-color: @global-meta-color;
+  --input-placeholder-weight: 400;
+  --input-hint-color: @global-meta-color;
+  --input-color: @global-color;
+  --input-border-radius: @global-border-radius;
+  /* Size modifiers */
+  --input-padding-vertical: 12px;
+  --input-padding-horizontal: 25px;
+  --input-font-size: @global-font-size;
+  /* Styling */
+  --input-background: transparent;
+  --input-shadow: none;
+  --input-border: transparent;
+  --input-border-width: @global-border-width;
+  --input-border-bottom: var(--input-border);
+  /* Hover Styling */
+  --input-background-hover: var(--input-background);
+  --input-shadow-hover: var(--input-shadow);
+  --input-border-hover: var(--input-border);
+  --input-border-bottom-hover: var(--input-border-bottom);
+  /* Focus Styling */
+  --input-background-focus: var(--input-background);
+  --input-shadow-focus: var(--input-shadow);
+  --input-border-focus: var(--input-border);
+  --input-border-bottom-focus: var(--input-border-bottom);
+  /* Disabled */
+  --input-color-disabled: @global-muted-color;
+  /* Danger */
+  --input-danger-color: @global-danger-background;
+}
+
+/** Input Wrapper */
+[style*="visibility: hidden"] .input-wrapper {
+  opacity: 0;
+}
+
+.input-wrapper {
+  border: var(--input-border-width) solid var(--input-border);
+  border-bottom: var(--input-border-width) solid var(--input-border-bottom);
+  border-radius: var(--input-border-radius);
+
+  & > .input-box {
+    box-shadow: var(--input-shadow);
+    background: var(--input-background);
+    border-radius: var(--input-border-radius);
+    position: relative;
+    padding: calc(var(--input-padding-vertical) + 23px) 0 var(--input-padding-vertical) var(--input-padding-horizontal);
+    cursor: text;
+    color: var(--input-color);
+
+    &.static {
+      padding-top: var(--input-padding-vertical);
+    }
+
+    &.select {
+      cursor: pointer;
+    }
+
+    & > .placeholder {
+      position: absolute;
+      left: 0;
+      top: 0;
+      bottom: 0;
+      right: 0;
+      overflow: hidden;
+      pointer-events: none;
+      color: var(--input-placeholder-color);
+      font-weight: var(--input-placeholder-weight);
+
+      & > label {
+        position: absolute;
+        font-size: var(--input-font-size);
+        line-height: @global-line-height;
+        top: calc(var(--input-padding-vertical) + @global-line-height);
+        left: var(--input-padding-horizontal);
+        transform: translateY(-50%);
+        transition: all 0.5s ease 0s;
+      }
+    }
+
+    & .input {
+      outline: 0 none !important;
+      box-shadow: none !important;
+      border-radius: 0;
+      border: 0 none;
+      padding: 0 var(--input-padding-horizontal) 0 0;
+      font-size: var(--input-font-size);
+      font-family: inherit;
+      background: transparent !important;
+      color: inherit;
+      width: 100%;
+      min-height: @global-line-height;
+      line-height: @global-line-height;
+      resize: none;
+      cursor: inherit;
+
+      &textarea {
+        margin-top: 5px;
+      }
+
+      &::placeholder, &.placeholder {
+        color: var(--input-placeholder-color);
+        opacity: 1;
+      }
+
+      &:disabled {
+        background: transparent;
+        color: var(--input-color-disabled);
+      }
+    }
+
+    & .uk-grid .input {
+      min-height: 27px;
+    }
+
+    & .icon {
+      transition: all 0.3s linear 0s;
+      transform: var(--input-arrow-transform);
+      margin-right: var(--input-padding-horizontal);
+    }
+
+    & > .tools {
+      padding-right: var(--input-padding-horizontal);
+    }
+
+    & .chip {
+      max-width: calc(100% - var(--input-padding-horizontal));
+    }
+
+    & .more {
+      color: var(--input-hint-color);
+      font-size: var(--input-font-size);
+    }
+
+    & .uk-grid .input,
+    & .uk-grid-margin .input,
+    & .uk-grid .more,
+    &:not(.static) .chip,
+    & .uk-grid-margin.chip {
+      margin-top: 10px;
+    }
+  }
+
+  &:hover {
+    border: var(--input-border-width) solid var(--input-border-hover);
+    border-bottom: var(--input-border-width) solid var(--input-border-bottom-hover);
+
+    & > .input-box {
+      box-shadow: var(--input-shadow-hover);
+      background: var(--input-background-hover);
+    }
+  }
+
+  &.focused {
+    border: var(--input-border-width) solid var(--input-border-focus);
+    border-bottom: var(--input-border-width) solid var(--input-border-bottom-focus);
+
+    & > .input-box {
+      box-shadow: var(--input-shadow-focus);
+      background: var(--input-background-focus);
+    }
+  }
+
+  &.disabled {
+    & > .input-box {
+      cursor: not-allowed !important;
+      user-select: none;
+    }
+
+    & > .input-box {
+      & .input::placeholder, & .placeholder {
+        color: var(--input-color-disabled);
+      }
+    }
+  }
+
+  &.danger {
+    border: var(--input-border-width) solid var(--input-danger-color);
+    & > .input-box {
+      & .input::placeholder, & .placeholder {
+        color: var(--input-danger-color);
+      }
+
+      & .icon {
+        color: var(--input-danger-color);
+      }
+    }
+  }
+
+  &.hint {
+    & > .input-box {
+      & .input::placeholder {
+        color: var(--input-hint-color);
+      }
+    }
+  }
+
+  &.active > .input-box > .placeholder > label,
+  &.focused > .input-box > .placeholder > label,
+  &.hint > .input-box > .placeholder > label {
+    top: calc(var(--input-padding-vertical) + 13px);
+    font-size: 12px;
+    line-height: 18px;
+  }
+
+  & .uk-dropdown.options {
+    max-height: 216px; /* 34px each line height, 5+5 margin top+bottom, 1+1 border top+bottom */
+    overflow: auto;
+  }
+
+  &:not(.focused) > .input-box .input.search {
+    opacity: 0;
+  }
+
+  /* Modifiers */
+  &.inner {
+    --input-shadow: @global-inset-shadow;
+    --input-background: @global-inverse-color;
+  }
+
+  &.flat {
+    --input-background: @global-inverse-color;
+    --input-border: @global-muted-background;
+  }
+
+  &.border-bottom {
+    --input-border-radius: 0;
+    --input-border-bottom: @global-muted-background;
+    --input-padding-horizontal: 0;
+    --input-padding-vertical: 5px;
+    --input-border-bottom-focus: @global-color;
+    --input-font-size: 14px;
+  }
+
+  &.search {
+    --input-font-size: 14px;
+    --input-padding-horizontal: 30px;
+    --input-padding-vertical: 20px;
+  }
+
+  &.advanced-search {
+    --input-placeholder-weight: 700;
+    --input-placeholder-color: @global-color;
+    --input-border-radius: 54px;
+    --input-padding-horizontal: 30px;
+    --input-padding-vertical: 10px;
+    --input-font-size: 14px;
+    --input-background-hover: @global-muted-background;
+    --input-shadow-hover: if(@input-mode = dark, @global-medium-box-shadow, @inverse-global-medium-box-shadow);
+    --input-background-focus: @global-background;
+    --input-shadow-focus: if(@input-mode = dark, @global-medium-box-shadow, @inverse-global-medium-box-shadow);
+  }
+
+  &.x-small {
+    --input-padding-horizontal: 15px;
+    --input-padding-vertical: 5px;
+    --input-font-size: 14px;
+  }
+
+  &.small {
+    --input-padding-horizontal: 20px;
+    --input-padding-vertical: 10px;
+    --input-font-size: 14px;
+  }
+
+  &.small-vertical {
+    --input-padding-vertical: 10px;
+  }
+}
+

less/inverse.less

@@ -0,0 +1,12 @@
+/* Dark Background: Use hook-inverse-misc in order to add styles
+in a dark background and use uk-light in a child */
+
+.dark {
+  .hook-inverse-misc();
+}
+
+.hook-inverse() {
+  .hook-inverse-misc();
+}
+
+.hook-inverse-misc() {};

less/label.less

@@ -0,0 +1,74 @@
+@label-background: transparent;
+@label-border: @global-border;
+@label-border-width: @global-border-width;
+@label-border-radius: 500px;
+@label-color: @global-color;
+@label-font-size: @global-small-font-size - 2px;
+@label-font-weight: 400;
+@label-line-height: 15px;
+@label-padding-horizontal: 20px;
+@label-padding-vertical: 10px;
+@label-small-padding-horizontal: 10px;
+@label-small-padding-vertical: 5px;
+@label-text-transform: uppercase;
+
+/* Success */
+@label-success-background: transparent;
+@label-success-border: @success-border-color;
+@label-success-color: @success-color;
+
+/* Warning */
+@label-warning-background: transparent;
+@label-warning-border: @warning-border-color;
+@label-warning-color: @warning-color;
+
+/** Danger*/
+@label-danger-background: transparent;
+@label-danger-border: @danger-border-color;
+@label-danger-color: @danger-color;
+
+/** Primary */
+@label-primary-background: transparent;
+@label-primary-border: @global-primary-background;
+@label-primary-color: @global-primary-background;
+
+/** Secondary */
+@label-secondary-background: transparent;
+@label-secondary-border: @global-secondary-background;
+@label-secondary-color: @global-secondary-background;
+
+.hook-label() {
+  border: @label-border-width solid @label-border;
+  border-radius: @label-border-radius;
+  text-transform: @label-text-transform;
+
+  &.uk-label-small {
+    padding: @label-small-padding-vertical @label-small-padding-horizontal;
+  }
+}
+
+.hook-label-success {
+  border-color: @label-success-border;
+}
+
+.hook-label-warning() {
+  border-color: @label-warning-border;
+}
+
+.hook-label-danger() {
+  border-color: @label-danger-border;
+}
+
+.hook-label-misc() {
+  .uk-label-primary {
+    background-color: @label-primary-background;
+    color: @label-primary-color;
+    border-color: @label-primary-border;
+  }
+
+  .uk-label-secondary {
+    background-color: @label-secondary-background;
+    color: @label-secondary-color;
+    border-color: @label-secondary-border;
+  }
+}

less/link.less

@@ -0,0 +1,13 @@
+/** Muted link*/
+@link-muted-hover-color: @global-link-hover-color;
+
+/** Text Link */
+@link-text-hover-color: @global-link-hover-color;
+
+/** Heading Link */
+@link-heading-hover-color: @global-link-hover-color;
+@link-heading-hover-text-decoration: underline;
+
+.hook-link-heading() {
+  color: @global-primary-background;
+}

less/list.less

@@ -0,0 +1,39 @@
+@list-xlarge-margin-top: @global-medium-margin;
+@list-xlarge-divider-margin-top: @global-medium-margin;
+@list-xlarge-striped-padding-vertical: @global-medium-margin;
+@list-xlarge-striped-padding-horizontal: @global-margin;
+@list-padding-left: 25px;
+@list-marker-height: @global-line-height;
+
+.hook-list-misc() {
+  .uk-list-bullet > * {
+    padding-left: @list-padding-left*2;
+    position: relative;
+  }
+
+  .uk-list-bullet > ::before {
+    background: none;
+    content: '\ef4a';
+    font-family: "Material Icons";
+    position: absolute;
+    left: 0;
+    text-align: left;
+  }
+
+
+  .uk-list-xlarge > :nth-child(n+2),
+  .uk-list-xlarge > * > ul { margin-top: @list-xlarge-margin-top; }
+
+  .uk-list-xlarge.uk-list-divider > :nth-child(n+2) {
+    margin-top: @list-xlarge-divider-margin-top;
+    padding-top: @list-xlarge-divider-margin-top;
+  }
+
+  .uk-list-large.uk-list-striped > * {
+    padding: @list-xlarge-striped-padding-vertical @list-xlarge-striped-padding-horizontal;
+  }
+
+  .uk-list-large.uk-list-striped > :nth-child(n+2) {
+    margin-top: 0;
+  }
+}

less/margin.less

@@ -0,0 +1,9 @@
+@margin-xsmall-margin: @global-xsmall-margin;
+
+.uk-margin-xsmall { margin-bottom: @margin-xsmall-margin; }
+* + .uk-margin-xsmall { margin-top: @margin-xsmall-margin !important; }
+
+.uk-margin-xsmall-top { margin-top: @margin-xsmall-margin !important; }
+.uk-margin-xsmall-bottom { margin-bottom: @margin-xsmall-margin !important; }
+.uk-margin-xsmall-left { margin-left: @margin-xsmall-margin !important; }
+.uk-margin-xsmall-right { margin-right: @margin-xsmall-margin !important; }

less/modal.less

@@ -0,0 +1,53 @@
+@modal-dialog-border-radius: @global-border-radius;
+
+@modal-body-padding-horizontal: @global-medium-gutter;
+@modal-body-padding-vertical: @global-medium-gutter;
+
+@modal-header-padding-horizontal: @global-medium-gutter;
+@modal-header-padding-vertical: @global-gutter;
+@modal-header-background: @global-background;
+@modal-header-border-width: @global-border-width;
+@modal-header-border: @global-border;
+
+@modal-footer-padding-horizontal: @global-medium-gutter;
+@modal-footer-padding-vertical: @global-medium-gutter;
+@modal-footer-background: @global-background;
+@modal-footer-border-width: @global-border-width;
+@modal-footer-border: @global-border;
+
+@modal-close-position: @global-medium-gutter;
+
+.hook-modal-dialog() {
+  border-radius: @modal-dialog-border-radius;
+}
+
+.hook-modal-header() {
+  border-bottom: @modal-header-border-width solid @modal-header-border;
+  border-radius: @modal-dialog-border-radius @modal-dialog-border-radius 0 0;
+}
+
+.hook-modal-footer() {
+  border-top: @modal-footer-border-width solid @modal-footer-border;
+  border-radius: 0 0 @modal-dialog-border-radius @modal-dialog-border-radius;
+}
+
+.hook-modal-misc() {
+  .uk-modal {
+
+    .uk-button {
+      box-shadow: none !important;
+    }
+
+    .uk-button-default {
+      border-color: @button-default-color;
+
+      &:hover {
+        border-color: @button-default-hover-color;
+      }
+
+      &:active {
+        border-color: @button-default-active-color;
+      }
+    }
+  }
+}

less/nav.less

@@ -0,0 +1,8 @@
+@nav-parent-icon-width: @global-line-height;
+@nav-default-item-color: @global-meta-color;
+@nav-default-item-hover-color: @global-link-hover-color;
+@nav-default-item-active-font-weight: 600;
+
+.hook-nav-default-item-active() {
+  font-weight: @nav-default-item-active-font-weight;
+}

less/navbar.less

@@ -0,0 +1,108 @@
+@navbar-background: @global-inverse-color;
+@navbar-background-image: none;
+@navbar-box-shadow: @global-default-shadow;
+
+@navbar-nav-item-font-size: @global-small-font-size;
+@navbar-nav-item-font-weight: 600;
+@navbar-nav-item-height: 65px;
+@navbar-nav-item-color: @global-color;
+@navbar-nav-item-hover-color: @global-secondary-background;
+@navbar-nav-item-hover-text-decoration: none;
+@navbar-nav-item-active-color: @global-primary-background;
+@navbar-nav-item-active-text-decoration: none;
+@navbar-nav-item-onclick-color: @navbar-nav-item-active-color;
+@navbar-nav-item-onclick-text-decoration: @navbar-nav-item-active-text-decoration;
+
+@navbar-item-color: @navbar-nav-item-color;
+
+@navbar-toggle-color: @navbar-nav-item-color;
+@navbar-toggle-hover-color: @global-link-hover-color;
+
+@navbar-dropdown-width: 260px;
+@navbar-dropdown-margin: 5px;
+@navbar-dropdown-padding: 0;
+@navbar-dropdown-background: @global-inverse-color;
+@navbar-dropdown-border: @global-border;
+@navbar-dropdown-border-width: @global-border-width;
+@navbar-dropdown-border-radius: @global-border-radius;
+@navbar-dropdown-box-shadow: @global-default-shadow;
+
+@navbar-dropdown-nav-margin-vertical: 5px;
+@navbar-dropdown-nav-margin-horizontal: 0;
+@navbar-dropdown-nav-font-size: @global-small-font-size;
+@navbar-dropdown-nav-font-weight: 400;
+
+@navbar-dropdown-nav-item-color: @global-color;
+@navbar-dropdown-nav-item-padding-horizontal: 30px;
+@navbar-dropdown-nav-item-padding-vertical: 5px;
+@navbar-dropdown-nav-item-hover-background: @light-blue;
+@navbar-dropdown-nav-item-hover-color: @global-color;
+@navbar-dropdown-nav-item-active-background: @light-blue;
+@navbar-dropdown-nav-item-active-font-weight: 600;
+@navbar-dropdown-nav-item-active-color: @global-color;
+
+@navbar-dropdown-nav-header-color: @global-emphasis-color;
+
+@navbar-dropdown-nav-sublist-item-color: @global-meta-color;
+@navbar-dropdown-nav-sublist-item-hover-color: @global-link-hover-color;
+@navbar-dropdown-nav-sublist-item-active-color: @global-link-hover-color;
+
+/* Navbar */
+
+.hook-navbar-container() {
+  background-image: @navbar-background-image;
+  background-size: cover;
+  box-shadow: @navbar-box-shadow;
+
+  & .uk-logo {
+    & > img {
+      height: @navbar-nav-item-height - 20px;
+    }
+  }
+}
+
+
+/* Navbar items */
+.hook-navbar-nav-item() {
+  font-weight: @navbar-nav-item-font-weight;
+}
+
+.hook-navbar-nav-item-hover() {
+  text-decoration: @navbar-nav-item-hover-text-decoration;
+}
+
+.hook-navbar-nav-item-onclick() {
+  text-decoration: @navbar-nav-item-onclick-text-decoration;
+}
+
+.hook-navbar-nav-item-active() {
+  text-decoration: @navbar-nav-item-active-text-decoration;
+}
+
+
+/* Navbar dropdown */
+.hook-navbar-dropdown() {
+  box-shadow: @navbar-dropdown-box-shadow;
+  border: @navbar-dropdown-border-width solid @navbar-dropdown-border;
+  border-radius: @navbar-dropdown-border-radius;
+}
+
+.hook-navbar-dropdown-nav() {
+  font-size: @navbar-dropdown-nav-font-size;
+  font-weight: @navbar-dropdown-nav-font-weight;
+  margin: @navbar-dropdown-nav-margin-vertical @navbar-dropdown-nav-margin-horizontal;
+}
+
+.hook-navbar-dropdown-nav-item() {
+  padding: @navbar-dropdown-nav-item-padding-vertical @navbar-dropdown-nav-item-padding-horizontal;
+}
+
+.hook-navbar-dropdown-nav-item-hover() {
+  background-color: @navbar-dropdown-nav-item-hover-background;
+}
+
+.hook-navbar-dropdown-nav-item-active() {
+  background-color: @navbar-dropdown-nav-item-active-background;
+  font-weight: @navbar-dropdown-nav-item-active-font-weight;
+}
+

less/notification.less

@@ -0,0 +1,52 @@
+@notification-message-font-size: @global-font-size;
+@notification-message-line-height: @global-line-height;
+@notification-message-border-width: @global-border-width;
+@notification-message-border-radius: @global-border-radius;
+@notification-message-box-shadow: @global-default-shadow;
+
+@notification-message-background: @global-background;
+@notification-message-color: @global-color;
+@notification-message-border: @global-border;
+
+/* Primary */
+@notification-message-primary-color: @info-color;
+@notification-message-primary-background: @info-background-color;
+@notification-message-primary-border: @info-border-color;
+
+/* Success */
+@notification-message-success-background: @success-background-color;
+@notification-message-success-border: @success-border-color;
+
+/* Warning */
+@notification-message-warning-background: @warning-background-color;
+@notification-message-warning-border: @warning-border-color;
+
+/* Danger */
+@notification-message-danger-background: @danger-background-color;
+@notification-message-danger-border: @danger-border-color;
+
+.hook-notification-message() {
+  border: @notification-message-border-width solid @notification-message-border;
+  border-radius: @notification-message-border-radius;
+  box-shadow: @notification-message-box-shadow;
+}
+
+.hook-notification-message-primary() {
+  background: @notification-message-primary-background;
+  border-color: @notification-message-primary-border;
+}
+
+.hook-notification-message-success() {
+  background: @notification-message-success-background;
+  border-color: @notification-message-success-border;
+}
+
+.hook-notification-message-warning() {
+  background: @notification-message-warning-background;
+  border-color: @notification-message-warning-border;
+}
+
+.hook-notification-message-danger() {
+  background: @notification-message-danger-background;
+  border-color: @notification-message-danger-border;
+}

less/pagination.less

@@ -0,0 +1,39 @@
+@pagination-margin-horizontal: 15px;
+@pagination-item-border-radius: 326px;
+@pagination-item-color: @global-color;
+@pagination-item-font-size: @global-small-font-size;
+@pagination-item-line-height: 25px;
+@pagination-item-min-width: 35px;
+@pagination-item-next-previous-color: @global-primary-background;
+@pagination-item-padding-horizontal: 5px;
+@pagination-item-padding-vertical: 5px;
+
+/** Hover */
+@pagination-item-hover-color: @global-primary-background;
+
+/** Active */
+@pagination-item-active-background: @global-primary-background;
+@pagination-item-active-color: @global-inverse-color;
+
+.hook-pagination-item() {
+  min-width: @pagination-item-min-width;
+  line-height: @pagination-item-line-height;
+  box-sizing: border-box;
+  text-align: center;
+  transition: .1s ease-in-out;
+  transition-property: color,background-color,border-color,box-shadow;
+  background-color: transparent;
+  font-size: @pagination-item-font-size;
+  border-radius: @pagination-item-border-radius;
+}
+
+.hook-pagination-item-active() {
+  background-color: @pagination-item-active-background;
+}
+
+.hook-pagination-misc() {
+
+  .uk-pagination-next, .uk-pagination-previous {
+    color: @pagination-item-next-previous-color;
+  }
+}

less/progress.less

@@ -0,0 +1,15 @@
+@progress-height: 16px;
+@progress-background: transparent;
+@progress-border-radius: 500px;
+@progress-box-shadow: @global-inset-shadow;
+@progress-bar-background: @global-secondary-background;
+
+
+.hook-progress() {
+  border-radius: @progress-border-radius;
+  box-shadow: @progress-box-shadow;
+}
+
+.hook-progress-bar() {
+  border-radius: @progress-border-radius;
+}

less/search.less

@@ -0,0 +1,83 @@
+.hook-search-misc() {
+  .search-input {
+    --search-input-shadow: none;
+    --search-input-background: none;
+    --search-input-border-width: 0;
+    --search-input-border: transparent;
+    --search-input-border-radius: 500px;
+    --search-input-icon-color: @global-secondary-background;
+    --search-input-icon-color-collapsed: @global-color;
+    --search-input-icon-color-disabled: @global-muted-color;
+    --search-input-divider: @global-border-width solid @global-border;
+    --search-input-icon-padding: 20px;
+    border-radius: var(--search-input-border-radius);
+    border: var(--search-input-border-width) solid var(--search-input-border);
+    box-shadow: var(--search-input-shadow);
+    background: var(--search-input-background);
+    width: 100%;
+    transition: width 0.5s ease-out;
+
+    &.collapsed {
+      width: calc(2 * var(--search-input-icon-padding) + 26px);
+
+      & .search-icon {
+        color: var(--search-input-icon-color-collapsed);
+      }
+    }
+
+    & .inputs {
+      & > :not(:last-child) {
+        position: relative;
+
+        &::after {
+          content: '';
+          position: absolute;
+          right: 0;
+          top: 15px;
+          bottom: 15px;
+          width: 0;
+          border-left: var(--search-input-divider);
+        }
+      }
+    }
+
+    & .search-icon {
+      padding: var(--search-input-icon-padding);
+      color: var(--search-input-icon-color);
+      cursor: pointer;
+      user-select: none;
+
+      &.disabled {
+        color: var(--search-input-icon-color-disabled);
+        cursor: default;
+        pointer-events: none;
+      }
+    }
+
+    /* Modifiers */
+
+    &.inner {
+      --search-input-background: @global-inverse-color;
+      --search-input-shadow: @global-inset-shadow;
+    }
+
+    &.flat {
+      --search-input-background: @global-inverse-color;
+      --search-input-border-width: @global-border-width;
+      --search-input-border: @global-border;
+    }
+
+    &.outer {
+      --search-input-background: @global-background;
+      --search-input-shadow: @global-medium-box-shadow;
+    }
+  }
+}
+
+.hook-inverse-misc() {
+  .search-input {
+    &.outer {
+      --search-input-shadow: @inverse-global-medium-box-shadow;
+    }
+  }
+}

less/section.less

@@ -0,0 +1,5 @@
+/** Primary */
+@section-primary-background: @global-primary-gradient;
+
+/** Secondary*/
+@section-secondary-background: @global-color;

less/slidenav.less

@@ -0,0 +1,3 @@
+@slidenav-color: @global-color;
+@slidenav-hover-color: @global-secondary-background;
+@slidenav-active-color: @global-secondary-background;

less/stepper.less

@@ -0,0 +1,142 @@
+@stepper-line-size: 16px;
+@stepper-line-box-shadow: @global-inset-shadow;
+@stepper-line-border-radius: @global-border-radius;
+
+@stepper-default-text-color: @global-primary-background;
+@stepper-default-button-background: @global-inverse-color;
+@stepper-default-button-color: @global-primary-background;
+
+@stepper-default-button-hover-background: @global-primary-background;
+@stepper-default-button-hover-color: @global-inverse-color;
+
+@stepper-active-text-color: @global-secondary-background;
+@stepper-active-button-background: @global-secondary-background;
+@stepper-active-button-color: @global-inverse-color;
+
+@stepper-done-text-color: @global-primary-background;
+@stepper-done-button-background: @global-primary-background;
+@stepper-done-button-color: @global-inverse-color;
+
+@stepper-disabled-button-background: @global-muted-background;
+@stepper-disabled-button-color: @global-muted-color;
+
+.stepper {
+  & .stepper-line-container{
+    position: absolute; bottom: -4px; left: -90px; right: 0; width: 200px;
+  }
+
+  & .stepper-line {
+    margin: 0 -@stepper-line-size;
+    min-width: 2*@stepper-line-size;
+    height: @stepper-line-size;
+    box-shadow: @stepper-line-box-shadow;
+    border-radius: @stepper-line-border-radius;
+    width: 100%;
+
+    &.active {
+      background-color: @stepper-active-button-background;
+    }
+
+    &.done {
+      background-color: @stepper-done-button-background;
+    }
+
+    &.disabled {
+      background-color: @stepper-disabled-button-background;
+    }
+  }
+
+  & .stepper-text {
+    &.default {
+      color: @stepper-default-text-color;
+    }
+
+    &.active {
+      color: @stepper-active-text-color;
+    }
+
+    &.done {
+      color: @stepper-done-text-color;
+    }
+  }
+
+  & button {
+    &.default {
+      background-color: @stepper-default-button-background;
+      color: @stepper-default-button-color;
+
+      &:hover {
+        background-color: @stepper-default-button-hover-background;
+        color: @stepper-default-button-hover-color;
+      }
+    }
+
+    &.active {
+      background-color: @stepper-active-button-background;
+      color: @stepper-active-button-color;
+    }
+
+    &.done {
+      background-color: @stepper-done-button-background;
+      color: @stepper-done-button-color;
+    }
+
+    &.disabled {
+      background-color: @stepper-disabled-button-background;
+      color: @stepper-disabled-button-color;
+    }
+  }
+}
+
+.stepper button.active{
+  background-color:var(--step-active-background);
+  color:var(--step-active-color);
+}
+.stepper button.disabled {
+  background-color: var(--step-disabled-background);
+  color: var(--step-disabled-text);
+}
+.stepper .stepper-text.active{
+  color:var(--step-active-text);
+}
+.stepper button.done{
+  background-color:var(--step-done-background);
+  color:var(--step-done-color);
+}
+.stepper .stepper-text.done{
+  color:var(--step-done-text);
+}
+.stepper button.default{
+  background-color:var(--step-default-background);
+  color:var(--step-default-color);
+}
+.stepper button.default:hover{
+  background-color:var(--step-default-background-hover);
+  color:var(--step-default-color-hover);
+}
+.stepper .stepper-text.default{
+  color:var(--step-default-text);
+}
+.stepper .stepper-line {
+  box-shadow: inset -3px -3px 6px rgba(255, 255, 255, 0.9), inset 3px 3px 6px rgba(0, 0, 0, 0.1);
+  border-radius: 6px;
+  opacity: 1;
+  width: 100%;
+}
+.stepper .stepper-line  {
+  box-shadow:inset -3px -3px 6px rgba(255, 255, 255, 0.9), inset 3px 3px 6px rgba(0, 0, 0, 0.1);
+}
+.stepper .stepper-line.active, .stepper .stepper-line.done  {
+  background-color: var(--step-done-background);
+}
+/*.stepper .stepper-line.default {*/
+/*  background-color: var(--step-default-background);*/
+/*}*/
+.stepper .stepper-line.disabled {
+  background-color: var(--muted-color);
+
+}
+.stepper .stepper-line-container{
+  position: absolute; bottom: -4px; left: -90px; right: 0; width: 200px;
+}
+

less/subnav.less

@@ -0,0 +1,106 @@
+@subnav-item-font-size: @global-small-font-size;
+@subnav-item-line-height: 17px;
+@subnav-item-font-weight: 400;
+
+/* Pills */
+@subnav-pill-item-padding-vertical: 10px;
+@subnav-pill-item-padding-horizontal: 20px;
+@subnav-pill-item-border-radius: 60px;
+@subnav-pill-item-background: transparent;
+@subnav-pill-item-color: @global-primary-background;
+@subnav-pill-item-border: @global-muted-background;
+@subnav-pill-item-border-width: @global-border-width;
+@subnav-pill-item-hover-background: transparent;
+@subnav-pill-item-hover-color: @primary-light-color;
+@subnav-pill-item-hover-border: @primary-light-color;
+@subnav-pill-item-active-background: @global-primary-background;
+@subnav-pill-item-active-background-gradient: @global-primary-gradient;
+@subnav-pill-item-active-border: transparent;
+@subnav-pill-item-active-color: @global-inverse-color;
+
+/* Pills aly*/
+@subnav-pill-alt-padding: 4px;
+@subnav-pill-alt-border-radius: 60px;
+@subnav-pill-alt-background: @global-inverse-color;
+@subnav-pill-alt-box-shadow: @global-large-box-shadow;
+@subnav-pill-alt-item-padding-vertical: 10px;
+@subnav-pill-alt-item-padding-horizontal: 20px;
+@subnav-pill-alt-item-color: @global-meta-color;
+@subnav-pill-alt-item-hover-color: @global-secondary-background;
+@subnav-pill-alt-item-active-background: none;
+@subnav-pill-alt-item-active-background-gradient: @global-primary-gradient;
+@subnav-pill-alt-item-active-color: @global-inverse-color;
+
+
+.hook-subnav-item() {
+  font-size: @subnav-item-font-size;
+  font-weight: @subnav-item-font-weight;
+  line-height: @subnav-item-line-height;
+}
+
+.hook-subnav-pill-item() {
+  border: @subnav-pill-item-border-width solid @subnav-pill-item-border;
+  border-radius: @subnav-pill-item-border-radius;
+  background-origin: border-box;
+}
+
+.hook-subnav-pill-item-hover() {
+  border-color: @subnav-pill-item-hover-border;
+}
+
+.hook-subnav-pill-item-active() {
+  border-color: @subnav-pill-item-active-border;
+  background-image: @subnav-pill-item-active-background-gradient;
+}
+
+.hook-subnav-misc() {
+  .uk-subnav.uk-subnav-pill-alt {
+    background: @subnav-pill-alt-background;
+    border-radius: @subnav-pill-alt-border-radius;
+    box-shadow: @subnav-pill-alt-box-shadow;
+    padding: @subnav-pill-alt-padding;
+
+    & > :first-child {
+      padding-left: 0;
+    }
+
+    & > * > :first-child {
+      padding: @subnav-pill-alt-item-padding-vertical @subnav-pill-alt-item-padding-horizontal;
+      color: @subnav-pill-alt-item-color;
+      border-radius: @subnav-pill-alt-border-radius;
+    }
+
+    & > :hover > a {
+      color: @subnav-pill-alt-item-hover-color;
+      position: relative;
+
+      &:before {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background-color: @subnav-pill-alt-item-active-background;
+        background-image: @subnav-pill-alt-item-active-background-gradient;
+        opacity: 0.1;
+        border-radius: inherit;
+      }
+    }
+
+    & > .uk-active > a {
+      background-color: @subnav-pill-alt-item-active-background;
+      color: @subnav-pill-alt-item-active-color;
+      background-image: @subnav-pill-alt-item-active-background-gradient;
+    }
+  }
+}
+
+/* Inverse */
+@inverse-subnav-pill-alt-box-shadow: @inverse-global-large-box-shadow;
+
+.hook-inverse-misc() {
+  .uk-subnav.uk-subnav-pill-alt {
+    box-shadow: @inverse-subnav-pill-alt-box-shadow;
+  }
+}

less/tab.less

@@ -0,0 +1,30 @@
+@tab-border-width: @global-border-width;
+@tab-border: @global-border;
+@tab-box-shadow: none;
+@tab-item-color: @global-meta-color;
+@tab-item-border-width: @global-border-width + 2;
+@tab-item-font-weight: 400;
+@tab-item-padding-horizontal: 10px;
+@tab-item-padding-vertical: 10px;
+
+/** Hover */
+@tab-item-hover-color: @global-secondary-background;
+
+/** Active */
+@tab-item-active-border: @global-secondary-background;
+@tab-item-active-color: @global-primary-background;
+
+.hook-tab() {
+  border-bottom: @tab-border-width solid @tab-border;
+}
+
+.hook-tab-item-active() {
+  border-bottom: @tab-item-border-width solid @tab-item-active-border;
+  font-weight: 600;
+}
+
+.hook-tab-misc() {
+  .uk-tab > *:first-child {
+    padding-left: 0;
+  }
+}

less/text.less

@@ -0,0 +1,15 @@
+/* Meta */
+@text-meta-font-size: inherit;
+@text-meta-line-height: inherit;
+@text-meta-color: @global-meta-color;
+
+/* Background */
+@text-background-gradient: @global-primary-gradient;
+@text-background-color: @global-primary-background;
+
+.hook-text-background() {
+  background-image: @text-background-gradient;
+}
+
+
+

less/tile.less

@@ -0,0 +1 @@
+@tile-default-background: @global-inverse-color;

less/tooltip.less

@@ -0,0 +1,13 @@
+@tooltip-background: @global-background;
+@tooltip-border-radius: @global-small-border-radius;
+@tooltip-color: @global-color;
+@tooltip-padding-horizontal: 20px;
+@tooltip-padding-vertical: 5px;
+@tooltip-border-width: @global-border-width;
+@tooltip-border: @global-border;
+@tooltip-shadow: @global-default-shadow;
+
+.hook-tooltip() {
+  border: @tooltip-border-width solid @tooltip-border;
+  box-shadow: @tooltip-shadow;
+}

less/totop.less

@@ -0,0 +1,45 @@
+@totop-padding: 16px;
+@totop-border-radius: 500px;
+
+@totop-color: @global-emphasis-color;
+@totop-box-shadow: @global-large-box-shadow;
+
+/* Hover */
+@totop-hover-color: @global-primary-background;
+@totop-hover-box-shadow: @global-medium-box-shadow;
+
+/** Active */
+@totop-active-color: @global-primary-background;
+@totop-active-box-shadow: @global-small-box-shadow;
+
+.hook-totop() {
+  box-shadow: @totop-box-shadow;
+  border-radius: @totop-border-radius;
+}
+
+.hook-totop-hover() {
+  box-shadow: @totop-hover-box-shadow;
+}
+
+.hook-totop-active() {
+  box-shadow: @totop-active-box-shadow;
+}
+
+/** Inverse */
+@inverse-totop-box-shadow: @inverse-global-large-box-shadow;
+@inverse-totop-hover-box-shadow: @inverse-global-medium-box-shadow;
+@inverse-totop-active-box-shadow: @inverse-global-small-box-shadow;
+
+.hook-inverse-misc() {
+  .uk-totop {
+    box-shadow: @inverse-totop-box-shadow;
+  }
+
+  .uk-totop:hover {
+    box-shadow: @inverse-totop-hover-box-shadow;
+  }
+
+  .uk-totop:active {
+    box-shadow: @inverse-totop-active-box-shadow;
+  }
+}

less/utility.less

@@ -0,0 +1,28 @@
+@dropcap-font-size: @global-line-height * 3;
+@border-rounded-border-radius: @global-border-radius;
+
+/* Box-shadow */
+.uk-box-shadow-default {
+  box-shadow: @global-default-shadow;
+}
+
+.uk-box-shadow-inner {
+  box-shadow: @global-inset-shadow;
+}
+
+.uk-box-no-shadow {
+  box-shadow: none;
+}
+
+/* Inverse */
+.hook-inverse-misc() {
+  .uk-box-shadow-small { box-shadow: @inverse-global-small-box-shadow; }
+  .uk-box-shadow-medium { box-shadow: @inverse-global-medium-box-shadow; }
+  .uk-box-shadow-large { box-shadow: @inverse-global-large-box-shadow; }
+  .uk-box-shadow-xlarge { box-shadow: @inverse-global-xlarge-box-shadow; }
+
+  .uk-box-shadow-hover-small:hover { box-shadow: @inverse-global-small-box-shadow; }
+  .uk-box-shadow-hover-medium:hover { box-shadow: @inverse-global-medium-box-shadow; }
+  .uk-box-shadow-hover-large:hover { box-shadow: @inverse-global-large-box-shadow; }
+  .uk-box-shadow-hover-xlarge:hover { box-shadow: @inverse-global-xlarge-box-shadow; }
+}

less/variables.less

@@ -0,0 +1,63 @@
+/** Typography */
+@global-font-family: Aileron;
+@global-font-size: 16px;
+@global-line-height: 24px;
+@global-xsmall-font-size: 12px;
+@global-small-font-size: 14px;
+@global-medium-font-size: 20px;
+@global-large-font-size: 20px;
+@global-xlarge-font-size: 34px;
+
+/** Colors */
+@global-color: @grey-color;
+@global-emphasis-color: @dark-color;
+@global-inverse-color: @light-color;
+@global-link-color: @info-color;
+@global-muted-color: @disable-color;
+@global-meta-color: @placeholder-color;
+@global-link-hover-color: @secondary-color;
+
+/** Backgrounds */
+@global-background: @default-color;
+@global-danger-background: @danger-color;
+@global-muted-background: @muted-color;
+@global-primary-background: @primary-color;
+@global-secondary-background: @secondary-color;
+@global-success-background: @success-color;
+@global-warning-background: @warning-color;
+@global-primary-gradient: linear-gradient(51deg, @primary-light-color 0%, @primary-dark-color 100%);
+@global-opacity: 30%;
+
+/** Borders */
+@global-border: @muted-color;
+@global-border-radius: 6px;
+@global-small-border-radius: 4px;
+
+/* Shadows*/
+@global-default-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.1);
+@global-inset-shadow: inset -3px -3px 6px rgba(255, 255, 255, 0.9), inset 3px 3px 6px rgba(0, 0, 0, 0.1);
+@global-small-box-shadow: -2px -2px 5px rgba(255, 255, 255, 0.6), 2px 2px 4px rgba(0, 0, 0, 0.07);
+@global-medium-box-shadow: -5px -5px 15px rgba(255, 255, 255, 0.6), 5px 5px 15px rgba(0, 0, 0, 0.07);
+@global-large-box-shadow: -15px -15px 20px rgba(255, 255, 255, 0.6), 15px 15px 20px rgba(0, 0, 0, 0.07);
+@global-xlarge-box-shadow: -20px -20px 25px rgba(255, 255, 255, 0.6), 20px 20px 25px rgba(0, 0, 0, 0.07);
+
+/* Spacings */
+@global-small-gutter: 20px;
+@global-xsmall-margin: 5px;
+
+/* Controls */
+@global-control-small-height: 40px;
+@global-control-height: 48px;
+@global-control-large-height: 56px;
+
+/* Breakpoints */
+@breakpoint-small: 481px;
+@breakpoint-medium: 769px;
+@breakpoint-large: 1025px;
+@breakpoint-xlarge: 1201px;
+
+/* Inverse */
+@inverse-global-small-box-shadow: -2px -2px 5px rgba(255, 255, 255, 0.05), 2px 2px 4px rgba(0, 0, 0, 0.3);
+@inverse-global-medium-box-shadow: -5px -5px 15px rgba(255, 255, 255, 0.05), 5px 5px 15px rgba(0, 0, 0, 0.3);
+@inverse-global-large-box-shadow: -15px -15px 20px rgba(255, 255, 255, 0.05), 15px 15px 20px rgba(0, 0, 0, 0.3);
+@inverse-global-xlarge-box-shadow: -20px -20px 25px rgba(255, 255, 255, 0.05), 20px 20px 25px rgba(0, 0, 0, 0.3);

less/width.less

@@ -0,0 +1,31 @@
+@width-xsmall-width: 100px;
+
+.hook-width-misc() {
+  .uk-width-xsmall {
+    width: @width-xsmall-width;
+  }
+
+  @media (min-width: @breakpoint-small) {
+    .uk-width-xsmall\@s {
+      width: @width-xsmall-width;
+    }
+  }
+
+  @media (min-width: @breakpoint-medium) {
+    .uk-width-xsmall\@m {
+      width: @width-xsmall-width;
+    }
+  }
+
+  @media (min-width: @breakpoint-large) {
+    .uk-width-xsmall\@l {
+      width: @width-xsmall-width;
+    }
+  }
+
+  @media (min-width: @breakpoint-xlarge) {
+    .uk-width-xsmall\@xl {
+      width: @width-xsmall-width;
+    }
+  }
+}