Updated overall styles

_includes/nav.html

@@ -25,7 +25,7 @@
   <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end nav-menu">
     {% for item in site.data.nav %}
     <a href="{{ site.baseurl }}{{ item.link }}"
-      class="ieee-nav-item mdc-button {% if page.url == item.url %}mdc-button--outlined{% endif %}">
+      class="ieee-nav-item mdc-button {% if page.url == item.url %}mdc-button--raised{% endif %}">
       <span class="mdc-button__label">{{ item.name }}</span>
     </a>
     {% endfor %}

_sass/home.scss

@@ -1,3 +1,19 @@
+.container {
+  width: 100%;
+
+  @media screen and (min-width: $break-tablet) {
+    width: 90%;
+  }
+}
+
+.mdc-typography--headline1 {
+  font-size: 5.4rem !important;
+
+  @media screen and (min-width: $break-tablet) {
+    font-size: 8rem !important;
+  }
+}
+
 .home-section {
   overflow: hidden;
 }
@@ -105,6 +121,7 @@
   color: white;
   top: -1.2rem;
   font-size: 6rem;
+  text-shadow: 2px 2px #00000044;
   @media screen and (min-width: $break-desktop) {
     top: -0.7rem;
     font-size: 8rem;
@@ -125,6 +142,10 @@
 
 .latest-des p {
   color: #ffffff88;
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-line-clamp: 5;
+  -webkit-box-orient: vertical;
 }
 
 /* Gallery */
@@ -227,6 +248,7 @@
 #home_section_four{
   padding-top: 8rem;
   padding-bottom: 8rem;
+  width: 90%;
   background-color: #ffffff;
   position: relative;
   overflow: hidden;

_sass/nav.scss

@@ -1,9 +1,16 @@
 /* Nav */
 .mdc-top-app-bar {
-  background-color: #fffffff0;
+  background-color: #ffffffaa;
+  -webkit-backdrop-filter: saturate(180%) blur(20px);
+  backdrop-filter: saturate(180%) blur(20px);
+  border-bottom: 0.8px solid #cccccc;
   color: #000;
 }
 
+.mdc-button--raised {
+  box-shadow: none !important;
+}
+
 .ieee-logo {
   height: 42px;
   margin-left: 24px;

index.html

@@ -44,7 +44,7 @@ <h1 class="mdc-typography--headline1 font-mon gallery-head">
   <div class="row">
     <div class="gallery -square -portrait">
       {% for item in site.gallery %}
-      <a href="https://blog.tumblr.com/image/0000000000" target="_blank" class="photo"
+      <a target="_blank" class="photo"
         style="background-image:url(assets/images/gallery/{{item.image}})"></a>
       {% endfor %}
     </div>