diff --git a/app/app.scss b/app/app.scss
index 885ddbb7..ae66c777 100644
--- a/app/app.scss
+++ b/app/app.scss
@@ -37,7 +37,7 @@ Page {
   @extend .tb;
   @extend .tw;
   font-size: 25;
-  padding: 16;
+  padding: 16 16 24;
 }
 .Light {
   color: $gray9;
@@ -156,6 +156,7 @@ TextField.combField,
 #searchBar {
   border-color: transparent;
 }
+
 // -----------------------------
 // Elements
 TextField,
@@ -181,28 +182,15 @@ TextView {
   width: 100%;
 }
 progress {
-  margin: 16;
+  color: $orange;
+  width: 100%;
+  height: 2;
   background-color: $gray5;
 }
 Switch {
   background-color: $orange;
   off-background-color: $gray5;
 }
-// -----------------------------
-// Side Drawer
-.segment {
-  border-radius: 12;
-  margin: 0 4 0 0;
-  padding: 0 12;
-  .value {
-    padding-left: 8;
-    vertical-alignment: center;
-  }
-  &.select {
-    color: $orange;
-    @extend .hl;
-  }
-}
 button {
   background-color: transparent;
   z-index: 0;
@@ -214,14 +202,13 @@ button {
     @extend .fade;
   }
   &.ico {
-    padding: 0;
-    margin: 0;
     width: 48;
     height: 48;
+    padding: 0;
+    margin: 0;
   }
   &.text {
     @extend .tb;
-    horizontal-alignment: left;
     color: $orange;
   }
   &.big {
@@ -235,12 +222,6 @@ button {
   &.min {
     width: 40;
     height: 40;
-  }
-  &.x {
-    width: 32;
-    height: 32;
-    min-width: 0;
-    margin: 0 0 0 4;
     vertical-alignment: center;
   }
   &.rate {
@@ -249,8 +230,31 @@ button {
     height: 32;
   }
 }
+ActivityIndicator {
+  width: 24;
+  height: 24;
+  margin: 12;
+  color: $orange;
+}
+
 // -----------------------------
-// HOME
+// Home
+.segment {
+  border-radius: 12;
+  margin: 0 4 0 0;
+  padding: 0 12;
+  .value {
+    padding: 0 0 0 8;
+    vertical-alignment: center;
+    &.rtl {
+      padding: 0 8 0 0;
+    }
+  }
+  &.select {
+    color: $orange;
+    @extend .hl;
+  }
+}
 .emptyState {
   padding: 16 16 8;
   label {
@@ -261,13 +265,18 @@ button {
     font-size: 17;
   }
 }
+
 // -----------------------------
-// Recipe Items
+// Recipe Item
 .recipeItem {
   padding: 8 16;
   .recipeInfo {
     vertical-alignment: center;
     padding: 0 0 4 8;
+    &.rtl {
+      transform: none;
+      padding: 0 8 4 0;
+    }
   }
   .title {
     padding: 0 0 4;
@@ -275,6 +284,9 @@ button {
   .attr {
     font-size: 10;
     padding: 0 6 1 2;
+    &.rtl {
+      padding: 0 2 1 6;
+    }
   }
 }
 .simple .recipeInfo {
@@ -283,7 +295,6 @@ button {
 .minimal .title {
   padding: 0;
 }
-
 .grid {
   padding: 8;
   .recipeInfo {
@@ -311,39 +322,34 @@ button {
 .imgHolder {
   border-radius: 12;
 }
-// -----------------------------
-// COOKING TIMER
 
-.singleTimer {
-  padding: 8 16;
+// -----------------------------
+// CookingTimer
+.timer {
+  padding: 8 16 0;
   .info {
-    margin: 8;
-  }
-  .recipeTitle {
-    horizontal-alignment: left;
-    // font-size: 12;
+    margin: 8 8 8 16;
+    &.r {
+      margin: 8 16 8 8;
+    }
   }
   progress {
-    color: $orange;
-    width: 100%;
-    height: 4;
     margin: 8 0 0;
   }
 }
+
 // -----------------------------
-// SETTINGS
+// Settings
 .group-info {
   padding: 16 16 16 72;
   line-height: 4;
 }
-.options-list {
+.options {
   .option {
     vertical-align: center;
-    padding: 14 8;
-    margin: 0 16;
+    padding: 14 12;
     .ico {
-      padding: 0;
-      margin: 0 24 0 16;
+      margin: 0 24 0 12;
     }
     .info,
     .sub {
@@ -359,7 +365,7 @@ button {
 }
 
 // -----------------------------
-// ABOUT
+// About
 .app-info {
   .icon {
     horizontal-alignment: center;
@@ -372,8 +378,9 @@ button {
     line-height: 4;
   }
 }
+
 // -----------------------------
-// VIEW RECIPE
+// ViewRecipe
 .photo {
   border-radius: 12;
   margin: 24 16 0 0;
@@ -396,15 +403,12 @@ button {
     @extend .tw;
   }
 }
-.clickable {
-  color: $orange;
-}
 .ingredient {
   padding: 0 16;
   .value {
     @extend .tw;
     vertical-align: center;
-    padding: 14 0 14 16;
+    padding: 14 16;
     line-height: 4;
   }
 }
@@ -416,13 +420,12 @@ button {
   }
   .value {
     @extend .tw;
-    padding: 14 0 14 16;
+    padding: 14 16;
     line-height: 4;
   }
 }
 .done {
   opacity: 0.5;
-  // @extend .fade;
   .value {
     text-decoration: line-through;
   }
@@ -443,8 +446,9 @@ button {
   font-size: 12;
   line-height: 4;
 }
+
 // -----------------------------
-// APPBAR
+// AppBar
 .appbar {
   z-index: 4;
   min-height: 56;
@@ -461,13 +465,16 @@ button {
     padding: 14 16;
   }
   .fab {
-    margin-left: 4;
+    margin-left: 8;
+  }
+  &.home {
+    margin: 8 8 0;
   }
 }
 .toolbar {
   z-index: 4;
   padding: 4;
-  margin-bottom: 0;
+  margin: 0 0 52;
   horizontal-alignment: left;
   .tool {
     padding: 0 12;
@@ -475,19 +482,20 @@ button {
       vertical-alignment: center;
     }
     .ico {
-      padding-right: 8;
+      padding: 0 8 0 0;
+      &.rtl {
+        padding: 0 0 0 8;
+      }
     }
   }
 }
 .fab {
-  width: 48;
-  height: 48;
-  margin: 0 4 0 0;
   border-radius: 12;
   background: $orange;
 }
+
 // -----------------------------
-// EDIT RECIPE
+// EditRecipe
 .sectionTitle {
   @extend .tb;
   @extend .tw;
@@ -504,8 +512,9 @@ button {
   font-size: 17;
   color: $orange;
 }
+
 // -----------------------------
-// MEAL PLANNER
+// MealPlanner
 .calendar {
   padding: 0 8;
   .navBtn {
@@ -541,13 +550,13 @@ button {
   }
   .recipeTitle {
     @extend .tw;
-    text-align: left;
     padding: 16 8;
     line-height: 4;
   }
 }
+
 // -----------------------------
-// DIALOGS
+// Dialogs
 .modal {
   max-width: 320;
   width: 100%;
@@ -567,13 +576,12 @@ button {
     padding: 0 16 8;
   }
   ListPicker {
-    width: 25%;
-    height: 128;
+    width: 30%;
+    height: 144;
     margin: 16 0;
   }
   .listItem {
     @extend .tw;
-    width: 100%;
     letter-spacing: 0;
     text-transform: none;
     line-height: 4;
@@ -607,32 +615,9 @@ button {
   padding: 16;
   line-height: 4;
 }
-// -----------------------------
-ActivityIndicator {
-  width: 24;
-  height: 24;
-  margin: 12;
-  color: $orange;
-}
+
 // -----------------------------
 // Transitions
-.blink {
-  animation-name: blink;
-  animation-duration: 1s;
-  animation-iteration-count: infinite;
-  animation-timing-function: ease;
-}
-@keyframes blink {
-  0% {
-    opacity: 0;
-  }
-  50% {
-    opacity: 1;
-  }
-  100% {
-    opacity: 0;
-  }
-}
 .hl {
   animation-name: hl;
   animation-duration: 0.2s;
@@ -661,3 +646,18 @@ ActivityIndicator {
     opacity: 0.5;
   }
 }
+
+// -----------------------------
+// Helpers
+.rtl {
+  transform: scaleX(-1);
+}
+.clickable {
+  color: $orange;
+}
+.hal {
+  horizontal-alignment: left;
+  &.r {
+    horizontal-alignment: right;
+  }
+}