diff --git a/templates/index.html b/templates/index.html
index 131188520..68de02165 100755
--- a/templates/index.html
+++ b/templates/index.html
@@ -426,18 +426,19 @@
               
               <!-- "CHEKING WETHER ITS IS THE CURRENT EMPLOYEES COMPANY OR ALL COMPANY, THEN ONLY SHOWS THE CHECK-IN, CHECK-OUT BUTTON" -->
                 {% if request.user|is_clocked_in  %}
-                <button class="oh-btn oh-btn--warning-outline mr-2" onmouseenter="$(this).find('span').show();$(this).find('.time-runner').hide();" onmouseleave="$(this).find('span').hide();$(this).find('.time-runner').show();" hx-get="{% url 'clock-out' %}"  hx-target='#attendance-activity-container' hx-swap='innerHTML'><ion-icon class="oh-navbar__clock-icon mr-2 text-warning" name="exit-outline"></ion-icon>
-                  <span class="hr-Check-In-out-text"  style="display: none;">{% trans "Check-Out" %}</span>                
+                <button class="oh-btn oh-btn--warning-outline mr-2" {% if enabled_timerunner %} onmouseenter="$(this).find('span').show();$(this).find('.time-runner').hide();" onmouseleave="$(this).find('span').hide();$(this).find('.time-runner').show();" {% endif %} hx-get="{% url 'clock-out' %}"  hx-target='#attendance-activity-container' hx-swap='innerHTML'><ion-icon class="oh-navbar__clock-icon mr-2 text-warning" name="exit-outline"></ion-icon>
+                  <span class="hr-Check-In-out-text" {% if enabled_timerunner %} style="display: none;" {% endif %}>{% trans "Check-Out" %}</span>                
                   <div class="time-runner"></div>                
                 </button>
                 <script>
                   run = 1
                   </script>
                 {% else %}
-                <button onmouseenter="$(this).find('span').show();$(this).find('.at-work-seconds').hide();" onmouseleave="$(this).find('span').hide();$(this).find('.at-work-seconds').show();" class="oh-btn oh-btn--success-outline mr-2" hx-get="{% url 'clock-in' %}"  hx-target='#attendance-activity-container' hx-swap='innerHTML'><ion-icon class="oh-navbar__clock-icon mr-2 text-success" name="enter-outline"></ion-icon>
-                  <span class="hr-Check-In-out-text" style="display: none;">{% trans "Check-In" %}</span>                
+                <button{% if enabled_timerunner %} onmouseenter="$(this).find('span').show();$(this).find('.at-work-seconds').hide();" onmouseleave="$(this).find('span').hide();$(this).find('.at-work-seconds').show();" {% endif %} class="oh-btn oh-btn--success-outline mr-2" hx-get="{% url 'clock-in' %}"  hx-target='#attendance-activity-container' hx-swap='innerHTML'><ion-icon class="oh-navbar__clock-icon mr-2 text-success" name="enter-outline"></ion-icon>
+                  <span class="hr-Check-In-out-text" {% if enabled_timerunner %} style="display: none;" {% endif %}>{% trans "Check-In" %}</span>                
                   <div class="at-work-seconds"></div>
                 </button>
+                {% if enabled_timerunner %}
                 <script>
                   $(document).ready(function () {
                     $('.at-work-seconds').html(secondsToDuration({{request.user.employee_get.get_forecasted_at_work.forecasted_at_work_seconds}}))
@@ -445,6 +446,7 @@
                   run = 0
                 </script>
                 {% endif %}
+                {% endif %}
               {% endif %}
             {% endif %}
             </div>
@@ -616,6 +618,7 @@
     }
     });
   </script>
+  {% if enabled_timerunner %}
   <script>
     // time-runner
     function secondsToDuration(seconds) {
@@ -640,6 +643,9 @@
         $("title").html("Horilla | "+secondsToDuration(at_work_seconds));
       }
     }, 1000);
+  </script>
+  {% endif %}
+  <script>
     setTimeout(()=>{$("[name='search']").focus()},100)
   </script>
 </body>