diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 15906e2..c4bb32a 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -24,9 +24,21 @@ app-header {
 
 .content {
   width: calc(100% - 128px);
-  min-width: calc(100vw - 232px - 128px);
+  min-width: calc(100vw - 232px - 64px);
   height: 100vh;
-  padding: 64px;
+  padding: 64px 0 0 64px;
   background-color: var(--bgContent);
   overflow-y: auto;
 }
+
+@media screen and (max-width: 910px) {
+  .content {
+    display: flex;
+    justify-content: center;
+    min-width: calc(100vw);
+    padding: 32px 0 0 0;
+  }
+  app-sidebar {
+    display: none;
+  }
+}
diff --git a/src/app/components/summary/summary.component.scss b/src/app/components/summary/summary.component.scss
index e1c184e..887b405 100644
--- a/src/app/components/summary/summary.component.scss
+++ b/src/app/components/summary/summary.component.scss
@@ -61,7 +61,6 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 18px;
   width: 264px;
   height: 168px;
   border-radius: 30px;
@@ -90,14 +89,18 @@
 .urgent {
   width: 560px;
   .right {
-    width: 40%;
+    width: 58%;
   }
   .left {
     display: flex;
     align-items: center;
     justify-content: center;
-    gap: 18px;
-    width: 40%;
+    width: 52%;
+  }
+  .line {
+    height: 100px;
+    width: 2px;
+    background-color: var(--gray);
   }
   img {
     height: 69px;
@@ -152,8 +155,19 @@
   }
 }
 
-.line {
-  height: 100px;
-  width: 2px;
-  background-color: var(--gray);
+@media screen and (max-width: 1250px) {
+  .right-container {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 1020px) {
+  .header {
+    .title {
+      font-size: 50px;
+    }
+    .metrics-txt {
+      font-size: 24px;
+    }
+  }
 }