diff --git a/css/structure/offcanvas.css b/css/structure/offcanvas.css
index ea1132a..a906db1 100644
--- a/css/structure/offcanvas.css
+++ b/css/structure/offcanvas.css
@@ -4,7 +4,7 @@
   --offcanvas-button-shadow: var(--shadow-medium);
 }
 
-.offcanvas-switcher {
+.uk-offcanvas-switcher {
   top: 320px !important;
   position: fixed;
   width: 60px;
@@ -20,7 +20,7 @@
   clip-path: inset(-30px 0px -30px -30px);
 }
 
-.offcanvas-switcher .offcanvas-count {
+.uk-offcanvas-switcher .uk-offcanvas-count {
   position: absolute;
   top: 0;
   left: 0;
@@ -37,16 +37,11 @@
 }
 
 
-.offcanvas .uk-offcanvas-bar {
+.uk-offcanvas .uk-offcanvas-bar {
   background-color: var(--offcanvas-background-color);
   box-shadow: var(--offcanvas-shadow);
-  border-radius: 4px 0px 0px 4px;
+  border-radius: 4px 0 0 4px;
   padding: 0;
   width: 550px;
   max-width: 100vw;
 }
-
-
-.offcanvas .uk-offcanvas-flip .uk-offcanvas-bar {
-  right: -550px;
-}
diff --git a/less/_import-variables.less b/less/_import-variables.less
new file mode 100644
index 0000000..1d63eaf
--- /dev/null
+++ b/less/_import-variables.less
@@ -0,0 +1,2 @@
+@import "~uikit/src/less/components/variables";
+@import "~src/assets/openaire-theme/less/variables";
diff --git a/less/_import.less b/less/_import.less
index 9f39d34..b5356ff 100644
--- a/less/_import.less
+++ b/less/_import.less
@@ -3,7 +3,6 @@
 
 // Base
 @import "fonts";
-@import "color";
 @import "variables";
 @import "base";
 
@@ -30,16 +29,14 @@
 
 // JavaScript
 //@import "accordion";
-//@import "drop";
 @import "dropdown";
 @import "modal";
-//@import "sticky";
-//@import "offcanvas";
+@import "offcanvas";
 //@import "switcher";
 //@import "leader";
 @import "notification";
 @import "tooltip";
-//@import "sortable";
+@import "sortable";
 
 // Navs
 @import "nav";
diff --git a/less/button.less b/less/button.less
index 1823b75..115ce75 100644
--- a/less/button.less
+++ b/less/button.less
@@ -1,8 +1,6 @@
 @button-font-size: @global-small-font-size;
-@button-small-font-size: @global-small-font-size - 1px;
+@button-small-font-size: @global-small-font-size - 2px;
 @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;
diff --git a/less/dropdown.less b/less/dropdown.less
index d6dee51..3f73a71 100644
--- a/less/dropdown.less
+++ b/less/dropdown.less
@@ -1,4 +1,4 @@
-@dropdown-min-width: 260px;
+@dropdown-min-width: 200px;
 @dropdown-padding: 5px 0;
 @dropdown-background: @global-background;
 @dropdown-border-width: @global-border-width;
diff --git a/less/form.less b/less/form.less
index 288b4d0..2c4359a 100644
--- a/less/form.less
+++ b/less/form.less
@@ -39,6 +39,18 @@
 }
 
 .hook-form-misc() {
+  input[type="checkbox"] {
+    &:extend(.uk-checkbox);
+    &:focus:extend(.uk-checkbox:focus) {}
+    &:checked:extend(.uk-checkbox:checked) {}
+  }
+
+  input[type="radio"] {
+    &:extend(.uk-radio);
+    &:focus:extend(.uk-radio:focus) {}
+    &:checked:extend(.uk-radio:checked) {}
+  }
+
   [style*="visibility: hidden"] .input-wrapper {
     opacity: 0;
   }
diff --git a/less/offcanvas.less b/less/offcanvas.less
index e69de29..08d79da 100644
--- a/less/offcanvas.less
+++ b/less/offcanvas.less
@@ -0,0 +1,81 @@
+@offcanvas-switcher-border-radius: @global-border-radius;
+@offcanvas-switcher-box-shadow: @global-medium-box-shadow;
+@offcanvas-switcher-size: @global-control-large-height;
+@offcanvas-switcher-top: 320px;
+@offcanvas-switcher-padding: 4px;
+@offcanvas-switcher-z-index: @global-z-index - 20;
+@offcanvar-switcher-background: @global-background;
+
+@offcanvas-count-size: 20px;
+@offcanvas-count-font-size: @global-small-font-size - 2px;
+@offcanvas-count-padding: 1px;
+@offcanvas-count-border-radius: 500px;
+@offcanvas-count-background: @global-secondary-background;
+@offcanvas-count-color: @global-inverse-color;
+
+@offcanvas-bar-width: 100vw;
+@offcanvas-bar-padding-vertical: @global-medium-gutter;
+@offcanvas-bar-padding-horizontal: @global-medium-gutter;
+@offcanvas-bar-width-m: 550px;
+@offcanvas-bar-border-radius: @global-small-border-radius;
+@offcanvas-bar-background: @global-background;
+@offcanvas-bar-box-shadow: @global-large-box-shadow;
+@offcanvas-bar-color-mode: dark;
+
+@offcanvas-close-position: 30px;
+
+@offcanvas-overlay-background: fade(@global-color, 50%);
+
+.hook-offcanvas-misc() {
+
+  .uk-offcanvas-flip .uk-offcanvas {
+    right: 0 !important;
+    left: auto !important;
+  }
+
+  .uk-offcanvas-flip .uk-offcanvas-bar {
+    left: auto !important;
+    right: -@offcanvas-bar-width !important;
+  }
+
+  .uk-offcanvas-flip .uk-open > .uk-offcanvas-bar {
+    left: auto !important;
+    right: 0 !important;
+  }
+
+  .uk-offcanvas-flip .uk-offcanvas-bar-animation {
+    transition-property: right !important;
+  }
+
+  .uk-offcanvas-switcher {
+    top: @offcanvas-switcher-top;
+    position: fixed;
+    width: @offcanvas-switcher-size;
+    height: @offcanvas-switcher-size;
+    cursor: pointer;
+    padding: @offcanvas-switcher-padding;
+    box-sizing: border-box;
+    right: 0;
+    z-index: @offcanvas-switcher-z-index;
+    background: @offcanvar-switcher-background;
+    border-radius: @offcanvas-switcher-border-radius 0 0 @offcanvas-switcher-border-radius;
+    box-shadow: @offcanvas-switcher-box-shadow;
+    clip-path: inset(-30px 0px -30px -30px);
+
+    & .uk-offcanvas-count {
+      position: absolute;
+      top: 0;
+      left: 0;
+      font-size: @offcanvas-count-font-size;
+      line-height: @offcanvas-count-size;
+      -webkit-transform: translate(-50%, -50%);
+      transform: translate(-50%, -50%);
+      height: @offcanvas-count-size;
+      width: @offcanvas-count-size;
+      border-radius: @offcanvas-count-border-radius;
+      padding: @offcanvas-count-padding;
+      background-color: @offcanvas-count-background;
+      color: @offcanvas-count-color;
+    }
+  }
+}
diff --git a/less/sortable.less b/less/sortable.less
index e69de29..691df28 100644
--- a/less/sortable.less
+++ b/less/sortable.less
@@ -0,0 +1,5 @@
+.hook-sortable() {
+  & > * {
+    cursor: move;
+  }
+}
diff --git a/less/tab.less b/less/tab.less
index 1766fbb..7b8dfec 100644
--- a/less/tab.less
+++ b/less/tab.less
@@ -15,16 +15,19 @@
 @tab-item-active-color: @global-primary-background;
 
 .hook-tab() {
-  border-bottom: @tab-border-width solid @tab-border;
+  position: relative;
+
+  &::before {
+    content: "";
+    position: absolute;
+    bottom: 0;
+    left: 20px;
+    right: 0;
+    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;
-  }
-}
diff --git a/less/variables.less b/less/variables.less
index 87ff959..6a4bcfb 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -1,3 +1,5 @@
+@import "color";
+
 /** Typography */
 @global-font-family: Aileron;
 @global-font-size: 16px;
@@ -46,9 +48,9 @@
 @global-xsmall-margin: 5px;
 
 /* Controls */
-@global-control-small-height: 40px;
-@global-control-height: 48px;
-@global-control-large-height: 56px;
+@global-control-small-height: 30px;
+@global-control-height: 40px;
+@global-control-large-height: 50px;
 
 /* Breakpoints */
 @breakpoint-small: 481px;