diff --git a/src/Pages/DistributedUptime/Details/Components/DeviceTicker/index.jsx b/src/Pages/DistributedUptime/Details/Components/DeviceTicker/index.jsx
index e68d01104..c540d8045 100644
--- a/src/Pages/DistributedUptime/Details/Components/DeviceTicker/index.jsx
+++ b/src/Pages/DistributedUptime/Details/Components/DeviceTicker/index.jsx
@@ -18,7 +18,7 @@ const DeviceTicker = ({ data, width = "100%", connectionStatus }) => {
 	};
 
 	return (
-		<ColContainer>
+		<ColContainer sx={{ height: "100%" }}>
 			<Stack
 				direction="row"
 				gap={theme.spacing(4)}
@@ -33,55 +33,62 @@ const DeviceTicker = ({ data, width = "100%", connectionStatus }) => {
 					{connectionStatus === "up" ? "Connected" : "No connection"}
 				</Typography>
 			</Stack>
-			<table>
-				<thead>
-					<tr>
-						<th style={{ textAlign: "left" }}>
-							<Typography>COUNTRY</Typography>
-						</th>
-						<th style={{ textAlign: "left" }}>
-							<Typography>CITY</Typography>
-						</th>
-						<th style={{ textAlign: "right" }}>
-							<Typography>RESPONSE</Typography>
-						</th>
-						<th style={{ textAlign: "right" }}>
-							<Typography>{isSmallScreen ? "UPT" : "UPT BURNED"}</Typography>
-						</th>
-					</tr>
-				</thead>
-				<tbody>
-					{data.map((dataPoint) => {
-						const countryCode = dataPoint?.countryCode?.toLowerCase() ?? null;
-						const flag = countryCode ? `fi fi-${countryCode}` : null;
-						const city = dataPoint?.city !== "" ? dataPoint?.city : "Unknown";
-						return (
-							<tr key={Math.random()}>
-								<td style={{ padding: theme.spacing(4) }}>
-									<Typography>
-										{flag ? <span className={flag} /> : null}{" "}
-										{countryCode?.toUpperCase() ?? "N/A"}
-									</Typography>
-								</td>
-								<td>
-									<Typography>{city}</Typography>
-								</td>
-								<td style={{ textAlign: "right" }}>
-									<Typography>{Math.floor(dataPoint.responseTime)} ms</Typography>
-								</td>
-								<td style={{ textAlign: "right" }}>
-									<Typography color={theme.palette.warning.main}>
-										+
-										{isSmallScreen
-											? safelyParseFloat(dataPoint.uptBurnt).toFixed(4)
-											: dataPoint.uptBurnt}
-									</Typography>
-								</td>
-							</tr>
-						);
-					})}
-				</tbody>
-			</table>
+			<div
+				style={{
+					overflowX: "auto",
+					maxWidth: "100%",
+					// Optional: add a max height if you want vertical scrolling too
+					// maxHeight: '400px',
+					// overflowY: 'auto'
+				}}
+			>
+				<table style={{ width: "100%" }}>
+					<thead>
+						<tr>
+							<th style={{ textAlign: "left", paddingLeft: theme.spacing(4) }}>
+								<Typography>COUNTRY</Typography>
+							</th>
+							<th style={{ textAlign: "left", paddingLeft: theme.spacing(4) }}>
+								<Typography>CITY</Typography>
+							</th>
+							<th style={{ textAlign: "right", paddingLeft: theme.spacing(4) }}>
+								<Typography>RESPONSE</Typography>
+							</th>
+							<th style={{ textAlign: "right", paddingLeft: theme.spacing(4) }}>
+								<Typography sx={{ whiteSpace: "nowrap" }}>{"UPT BURNED"}</Typography>
+							</th>
+						</tr>
+					</thead>
+					<tbody>
+						{data.map((dataPoint) => {
+							const countryCode = dataPoint?.countryCode?.toLowerCase() ?? null;
+							const flag = countryCode ? `fi fi-${countryCode}` : null;
+							const city = dataPoint?.city !== "" ? dataPoint?.city : "Unknown";
+							return (
+								<tr key={Math.random()}>
+									<td style={{ paddingLeft: theme.spacing(4) }}>
+										<Typography>
+											{flag ? <span className={flag} /> : null}{" "}
+											{countryCode?.toUpperCase() ?? "N/A"}
+										</Typography>
+									</td>
+									<td style={{ paddingLeft: theme.spacing(4) }}>
+										<Typography>{city}</Typography>
+									</td>
+									<td style={{ textAlign: "right", paddingLeft: theme.spacing(4) }}>
+										<Typography>{Math.floor(dataPoint.responseTime)} ms</Typography>
+									</td>
+									<td style={{ textAlign: "right", paddingLeft: theme.spacing(4) }}>
+										<Typography color={theme.palette.warning.main}>
+											+{dataPoint.uptBurnt}
+										</Typography>
+									</td>
+								</tr>
+							);
+						})}
+					</tbody>
+				</table>
+			</div>
 		</ColContainer>
 	);
 };
diff --git a/src/Pages/StatusPage/Status/Components/ControlsHeader/index.jsx b/src/Pages/StatusPage/Status/Components/ControlsHeader/index.jsx
index 86bb078a9..9eacf9b36 100644
--- a/src/Pages/StatusPage/Status/Components/ControlsHeader/index.jsx
+++ b/src/Pages/StatusPage/Status/Components/ControlsHeader/index.jsx
@@ -94,9 +94,9 @@ const ControlsHeader = ({
 			alignItems="flex-end"
 		>
 			<Stack
-				direction={{ s: "column", md: "row" }}
+				direction="row"
 				gap={theme.spacing(8)}
-				alignItems={{ s: "flex-start", md: "flex-end" }}
+				alignItems="flex-end"
 			>
 				<Image
 					shouldRender={statusPage?.logo?.data ? true : false}
@@ -105,7 +105,7 @@ const ControlsHeader = ({
 					maxHeight={"50px"}
 					base64={statusPage?.logo?.data}
 				/>
-				<Typography variant="h2">{statusPage?.companyName}</Typography>
+				<Typography variant="h1">{statusPage?.companyName}</Typography>
 			</Stack>
 			<Controls
 				isDeleting={isDeleting}