update timetable button

private/scss/modules/plugins/_form.scss

@@ -153,6 +153,28 @@
   min-width: em(200px);
 }
 
+.button--icon {
+  transform: none;
+  transition: transform 0.4s $easeOutQuart;
+  .button__icon {
+    display: inline-block;
+    vertical-align: top;
+    position: relative;
+    transform: none !important;
+    width: auto;
+    padding-left: em(15px);
+  }
+  .button__text {
+    vertical-align: top;
+    transform: none !important;
+    padding-left: 0;
+    min-width: auto;
+  }
+  &:hover {
+    transform: scale(1.05);
+  }
+}
+
 .form__field {
   width: 100%;
   display: block;

private/scss/modules/plugins/_timetable.scss

@@ -14,11 +14,11 @@ $timetable_count: 15;
 .timetable__button {
   opacity: 0;
   position: fixed;
-  top: 103px;
+  bottom: 150px;
   left: 50%;
   transform: translateX(-50%);
   z-index: 1000;
-  transition: opacity 0.5s $easeOutQuad;
+  transition: opacity 0.5s $easeOutQuad, transform 0.5s $easeOutQuad;
   #timetable[data-active="0"] & {
     opacity: 1;
   }
@@ -30,6 +30,15 @@ $timetable_count: 15;
     height: 20px;
     margin-left: -20px;
   }
+  &.reveal {
+    transform: translateX(-50%) scale(1.2);
+  }
+  @media screen and (max-width: $huge_breakpoint) {
+    bottom: 130px;
+  }
+  @media screen and (max-width: $large_breakpoint) {
+    bottom: 120px;
+  }
 }
 
 .timetable__clock__frame {