diff --git a/templates/bgp_peer_graph.html b/templates/bgp_peer_graph.html
index 521c72b..108db03 100644
--- a/templates/bgp_peer_graph.html
+++ b/templates/bgp_peer_graph.html
@@ -9,18 +9,18 @@
     <h2>BGP Peer History for {{ neighbor_ip }}</h2>
     <h5 class="text-muted">{{ ip_version }} Neighbor</h5>
 
-    <div class="d-flex justify-content-end align-items-center mb-3 flex-wrap">
+    <div class="d-flex justify-content-center justify-content-lg-end align-items-center mb-3 flex-wrap">
         <div class="btn-group me-2" role="group" aria-label="Time range">
             <button type="button" class="btn btn-outline-primary active" data-range="24h">24H</button>
             <button type="button" class="btn btn-outline-primary" data-range="7d">7D</button>
             <button type="button" class="btn btn-outline-primary" data-range="30d">30D</button>
             <button type="button" class="btn btn-outline-primary" data-range="90d">90D</button>
         </div>
-        <div class="d-flex align-items-center">
-            <input type="datetime-local" id="startDate" class="form-control me-1" style="width: auto;">
-            <span class="me-1">to</span>
-            <input type="datetime-local" id="endDate" class="form-control me-1" style="width: auto;">
-            <button type="button" id="customRangeBtn" class="btn btn-primary">Go</button>
+        <div class="d-flex flex-column flex-md-row align-items-stretch align-items-md-center">
+            <input type="datetime-local" id="startDate" class="form-control me-md-1 mb-1 mb-md-0">
+            <span class="mx-md-1 my-1 my-md-0 text-center">to</span>
+            <input type="datetime-local" id="endDate" class="form-control me-md-1 mb-1 mb-md-0">
+            <button type="button" id="customRangeBtn" class="btn btn-primary mt-1 mt-md-0">Go</button>
         </div>
     </div>