Add files via upload

GhaidaAL36 · Sep 6, 2024 · d9a1530 · d9a1530
1 parent 1c57c33
commit d9a1530
Show file tree

Hide file tree

Showing 2 changed files with 60 additions and 24 deletions.
diff --git a/css/content.css b/css/content.css
@@ -1,7 +1,8 @@
 .page-container{
   display: flex;
   justify-content: center;
-  margin-top: 90px;
+  margin-top: 100px;
+  padding: 0 10px;
 }
 
 .title-box{
@@ -12,6 +13,9 @@
   padding: 10px 15px;
   cursor: pointer;
   transition: 0.3s ease;
+  text-align: center;
+  width: 100%;
+  max-width: 300px;
 }
 
 .title-box:hover{
@@ -96,17 +100,60 @@
 }
 
 @media (max-width: 768px) {
+  .page-container {
+    margin-top: 180px;
+    padding: 0 20px;
+  }
+
   .content-container {
     flex-direction: column;
     align-items: center;
+    gap: 40px;
   }
 
   .content-container img {
-    width: 100%; 
+    width: 100%;
     height: auto;
   }
 
   .content-box {
     max-width: 100%;
   }
+
+  .content-box .title {
+    font-size: 20px;
+  }
+
+  .content-box .content {
+    font-size: 14px;
+  }
+
+  .content-btn, .services-btn {
+    width: 100%;
+    font-size: 18px;
+  }
+}
+
+@media (max-width: 480px) {
+  .page-container {
+    margin-top: 80px;
+  }
+
+  .title-box {
+    font-size: 20px;
+    padding: 8px 10px;
+  }
+
+  .content-box .title {
+    font-size: 18px;
+  }
+
+  .content-box .content {
+    font-size: 12px;
+  }
+
+  .content-btn, .services-btn {
+    padding: 8px 16px;
+    font-size: 16px;
+  }
 }
diff --git a/css/header.css b/css/header.css
@@ -8,7 +8,7 @@ header{
   justify-content: space-between;
   box-shadow: 0 1px 6px rgb(32 33 36 / 10%);
   transition: all .50s ease;
-  padding: 20px 5%;
+  padding: 20px 14%;
   width: 100%;
   background-color: #edede9;
   font-size: 18px;
@@ -31,7 +31,7 @@ header{
 .menu a{
   font-size: 15px;
   font-weight: 500;
-  margin: 10px 15px;
+  margin: 10px 22px;
   transition: all .50s ease;
   color: #d06b7d;
   font-size: 18px;
@@ -42,7 +42,7 @@ header{
 }
 
 section{
-  padding: 60px 5% 70px;
+  padding: 60px 15% 70px;
 }
 
 .head-text{
@@ -89,20 +89,18 @@ section{
   justify-content: space-between;
   box-shadow: 0 1px 6px rgb(32 33 36 / 10%);
   transition: all .50s ease;
-  padding: 20px 5%;
+  padding: 20px 14%;
   width: 100%;
   background-color: #edede9;
   font-size: 18px;}
 
 .head-menu {
-  display: flex;
-  flex-wrap: wrap; 
-  justify-content: center;
+
 }
 
 .head-menu li {
   display: inline-block;
-  margin: 5px 10px;
+  margin: 5px 15px;
 }
 
 .head-menu a {
@@ -112,7 +110,7 @@ section{
   transition: all .50s ease;
   border-radius: 8px;
   border: 1px solid #eaeae9;
-  padding: 10px 15px;
+  padding: 10px 20px;
   display: block;
 }
 
@@ -122,6 +120,7 @@ section{
   border-color: #ebb9c2;
 }
 
+
 @media (max-width: 768px) {
   .menu {
     display: block;
@@ -149,25 +148,15 @@ section{
   }
 
   .head-menu {
-    flex-direction: column; /* Stack menu items vertically */
-  }
-
-  .head-menu li {
-    margin: 10px 0;
   }
 }
 
 @media (max-width: 480px) {
-  .head-text h1 {
-    font-size: 30px;
-  }
-
-  .head-text p {
-    font-size: 14px;
+  .head-menu {
   }
 
   .head-menu a {
-    font-size: 16px;
-    padding: 8px 12px;
+    font-size: 16px; 
+    padding: 8px 12px; 
   }
 }