Redesign

src/App/assets/scss/components/_general.scss

@@ -80,62 +80,87 @@ label {
   color: #B1B1B1;
 }
 
-.container-border {
-  border-top: 2px solid  gray;
-  padding-top: 20px;
-}
-
 .navbar {
   margin-bottom: 0;
   border-radius: 0;
-  background-color: #E5F6E3 !important;
+  background-color: #EAEEFF !important;
   border: 0;
-  border-bottom: 1px solid #F6F6F6;
-  padding: 30px 0;
+  padding: 10px 0;
+
+  .container {
+    max-width: 1192px;
+  }
+
+  .navbar-brand {
+    width: 25%;
+  }
 
   .button-border {
     border: 1px solid black;
     border-radius: 10px;
-    background-color: #fff;
     padding: 10px 25px;
   }
 
   .menu, .menu-items {
-    justify-content: flex-end;
+    width: 100%;
+    float: right;
+    display: flex;
 
     ul {
-      gap: 0;
-      align-items: end;
+      margin: auto;
+      float: right;
 
       li {
-        width: fit-content !important;
+        width: fit-content;
         float: right;
       }
     }
 
     .nav-item {
       line-height: 43px;
-      display: inline-block;
       text-align: right;
-      padding: 0 10px;
-      border-left: 1px solid black;
+      padding: 0 20px;
     }
 
     .nav-link {
-      color: black;
+      color: #282222;
       padding: 0;
     }
 
     a {
       display: flex;
-      font-size: 18px;
-      font-weight: 700;
+      font-size: 16px;
+      font-weight: 600;
       float: right;
     }
 
   }
 
+  .menu-right {
+    width: 25%;
+    padding-top: 15px;
+
+    @media (max-width: 991px) {
+      width: 100%;
+      margin-top: 10px;
+    }
+
+    ul {
+      display: flex;
+      float: right;
+      list-style-type: none;
+    }
+
+    a {
+      font-size: 16px;
+      font-weight: 600;
+      font-family: 'Raleway', sans-serif;
+    }
+  }
+
   @media (max-width: 991px) {
+    padding: 10px 0;
+
     .menu {
       display: none;
     }
@@ -199,47 +224,6 @@ label {
     }
   }
 
-  .app-footer {
-    padding: 60px;
-    background: #fff;
-
-    .title {
-      margin-bottom: 30px;
-    }
-
-    .container {
-      max-width: 1540px;
-      border-top: 2px solid gray!important;
-    }
-
-    p {
-      margin-bottom: 0;
-      font-size: 14px;
-    }
-
-    h2 {
-      font-weight: 700;
-      font-family: 'Space Grotesk', sans-serif;
-      font-size: 24px;
-    }
-
-    .margin-small {
-      margin-bottom: 10px;
-    }
-
-    .margin-large {
-      margin-bottom: 30px;
-    }
-
-    .enjoy {
-      margin-bottom: 5px;
-      font-size: 20px;
-      color: #3B3B3B;
-      font-family: 'Montserrat', sans-serif;
-      font-weight: 200;
-    }
-  }
-
   .alert {
     ul {
       display: block;
@@ -292,8 +276,8 @@ label {
     .navbar-brand {
       img {
         display: block;
-        width: 230px;
-        height: 40px;
+        width: 192px;
+        height: 30px;
       }
 
       .company {
@@ -304,6 +288,41 @@ label {
   }
 }
 
+.app-footer {
+  padding: 70px 0 50px;
+  background: #E8F0FF;
+
+  .title {
+    margin-bottom: 30px;
+  }
+
+  .container {
+    max-width: 1192px;
+  }
+
+  h2 {
+    font-weight: 700;
+    font-family: 'Space Grotesk', sans-serif;
+    font-size: 24px;
+  }
+
+  .margin-small {
+    margin-bottom: 5px;
+  }
+
+  .margin-large {
+    margin-bottom: 30px;
+  }
+
+  .enjoy {
+    margin-bottom: 5px;
+    font-size: 20px;
+    color: #3B3B3B;
+    font-family: 'Montserrat', sans-serif;
+    font-weight: 200;
+  }
+}
+
 .footer-item-support {
   padding-top:2px;
   a {
@@ -333,8 +352,11 @@ label {
   }
 }
 
-.footer-headline{
+.footer-text{
   margin-top: 20px;
+  display: flex;
+  justify-content: space-between;
+
   a {
     color: #4B67F9;
     text-decoration: none;
@@ -346,16 +368,28 @@ label {
   }
 }
 
-.dk_widget {
+.footer-item {
   font-family: Barlow, serif;
   padding: 20px 10px;
 }
 
 .footer-item-title {
-  font-weight: bold!important;
+  font-weight: 700;
   font-family: 'Barlow', sans-serif;
-  font-size: 18px;
   margin-bottom: 10px;
+  color: #2943CA;
+}
+
+.footer-copyright {
+  border-top: 1px solid #8E8E8E66;
+  background: #E8F0FF;
+  color: #A6A6A6;
+  font-family: 'Space Grotesk', sans-serif;
+  font-weight: 400;
+  font-size: 15px;
+  line-height: 22.5px;
+  padding: 30px 0;
+  justify-content: center;
 }
 
 @media (max-width: 991px) {