implemented pdf viewer functionality.

src/main.css

@@ -211,7 +211,6 @@ h4 {
 }
 
 #skill-cards {
-  border: 1px solid white;
   width: 100%;
 }
 
@@ -228,7 +227,7 @@ h4 {
   background-color: #ebd2ff;
   border-radius: 20px;
   min-width: 20vw;
-  max-width: 40vw;
+  max-width: 50vw;
   margin: 1vw;
 }
 
@@ -236,7 +235,7 @@ h4 {
   display: grid;
   grid-template-columns: 20% 60%;
   grid-template-rows: 100%;
-  column-gap: 20%;
+  column-gap: 10%;
   align-items: center;
   justify-content: center;
   text-align: center;
@@ -246,6 +245,10 @@ h4 {
   background-color: #4a245e;
   border-radius: 18px 18px 0 0;
 }
+.skill-card-header h3 {
+  font-size: clamp(1.3rem, 2vw, 3rem);
+  text-align: right;
+}
 
 .skill-symbol {
   font-variation-settings:
@@ -311,6 +314,7 @@ h4 {
   flex-direction: row;
   align-items: center;
   justify-content: center;
+  margin-left: 1vw;
 }
 
 .project-card img {
@@ -447,12 +451,31 @@ h4 {
   justify-content: center;
 }
 
+#resume-section {
+  margin: 2vw;
+}
+
 /**PDF Viewer**/
 .pdf-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
+  max-width: 100%;
+  height: 70vh;
+}
+
+.pdf-button {
+  background-color: #ebd2ff;
+  color: #4a245e;
+  outline: none;
+  border: none;
+  padding: 1vw;
+  margin: 1vw;
+}
+
+.pdf-button span {
+  color: #4a245e;
 }
 
 /**Animations**/
@@ -614,21 +637,16 @@ h4 {
     margin-left: 5vw;
   }
 
-  .pdf-viewer {
-    max-width: 100%;
-    margin-right: 0;
-  }
-
-  .pdf-page {
-    width: 100%;
-  }
-
   #card-grid {
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
   }
+
+  .button {
+    border-radius: 10px;
+  }
 }
 
 @media (max-width: 485px) {