1 files changed, 83 insertions, 33 deletions

diff --git a/static/css/styles.css b/static/css/styles.css
index 87060bf..7c41a38 100644
--- a/static/css/styles.css
+++ b/static/css/styles.css
@@ -114,20 +114,20 @@ h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
 }
 
 h1, .h1 {
-  font-size: calc(1.375rem + 1.5vw);
+  font-size: 4rem;
 }
 @media (min-width: 1200px) {
   h1, .h1 {
-    font-size: 2.5rem;
+    font-size: 4rem;
   }
 }
 
 h2, .h2 {
-  font-size: calc(1.325rem + 0.9vw);
+  font-size: 3rem;
 }
 @media (min-width: 1200px) {
   h2, .h2 {
-    font-size: 2rem;
+    font-size: 3rem;
   }
 }
 
@@ -3035,13 +3035,13 @@ textarea.form-control-lg {
 
 .btn-primary {
   color: #fff;
-  background-color: #971b15;
-  border-color: #971b15;
+  background-color: #5ac3ab;
+  border-color: #5ac3ab;
 }
 .btn-primary:hover {
   color: #fff;
-  background-color: #5e110d;
-  border-color: #5e110d;
+  background-color: #408a78;
+  border-color: #5ac3ab;
 }
 .btn-check:focus + .btn-primary, .btn-primary:focus {
   color: #fff;
@@ -3064,14 +3064,14 @@ textarea.form-control-lg {
 }
 
 .btn-secondary {
-  color: #fff;
-  background-color: #7464a1;
-  border-color: #7464a1;
+  color: #000000;
+  background-color: rgba(245, 191, 65, 1);
+  border-color: rgba(245, 191, 65, 1);
 }
 .btn-secondary:hover {
   color: #fff;
-  background-color: #635589;
-  border-color: #5d5081;
+  background-color: rgb(170, 133, 46);
+  border-color: rgb(170, 133, 46);
 }
 .btn-check:focus + .btn-secondary, .btn-secondary:focus {
   color: #fff;
@@ -4595,7 +4595,7 @@ textarea.form-control-lg {
   color: #fff;
 }
 .navbar-dark .navbar-nav .nav-link {
-  color: rgba(255, 255, 255, 0.55);
+  color: rgba(255, 255, 255, 1);
 }
 .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
   color: rgba(255, 255, 255, 0.75);
@@ -11484,13 +11484,13 @@ html {
 }
 
 body {
-  letter-spacing: 0.0625em;
+  letter-spacing: 0.015em;
+  font-size: 18px;
 }
 
 #mainNav {
   min-height: 3.0rem;
   background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.3) 90%, rgba(0, 0, 0, 0) 100%);
-  padding-bottom: 2.5rem;
 }
 #mainNav .navbar-toggler {
   font-size: 80%;
@@ -11570,9 +11570,6 @@ body {
   box-shadow: 0 0.1875rem 0.1875rem 0 rgba(0, 0, 0, 0.1) !important;
   padding: 1.25rem 2rem;
   font-family: "Varela Round", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-  font-size: 80%;
-  text-transform: uppercase;
-  letter-spacing: 0.15rem;
   border: 0;
 }
 
@@ -11582,7 +11579,7 @@ body {
   height: auto;
   min-height: 35rem;
   padding: 15rem;
-  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.0) 0%, rgba(0, 0, 0, 0.3) 90%, #000 100%), url("/header2.webp");
+  background: url("/header.webp");
   background-position: center;
   background-repeat: no-repeat;
   background-attachment: scroll;
@@ -11591,7 +11588,7 @@ body {
 
 @media (min-width: 768px) {
   .masthead {
-    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.0) 0%, rgba(0, 0, 0, 0.3) 90%, #000 100%), url("/header.webp");
+    background: url("/header.webp");
     background-position: center;
     background-repeat: no-repeat;
     background-attachment: scroll;
@@ -11643,10 +11640,7 @@ body {
 .about-section {
   padding-top: 1rem;
   padding-bottom: 1rem;
-  background: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.9) 75%, rgba(0, 0, 0, 0.8) 100%);
-}
-.about-section p {
-  margin-bottom: 5rem;
+  background: linear-gradient(to bottom, rgba(135, 135, 135, 1) 0%, rgba(80, 80, 80, 1) 90%, rgba(0, 0, 0, 1) 100%);
 }
 
 .projects-section {
@@ -11696,6 +11690,7 @@ body {
 }
 
 .contact-section {
+  background-color: #5ac3ab;
   padding-top: 2rem;
 }
 .contact-section .card {
@@ -11713,9 +11708,7 @@ body {
   border-width: 0.25rem;
   width: 3rem;
 }
-.contact-section .social {
-  margin-top: 5rem;
-}
+
 .contact-section .social a {
   text-align: center;
   height: 3rem;
@@ -11734,6 +11727,7 @@ body {
 
 .footer {
   padding: 5rem 0;
+  background-color: rgba(245, 191, 65, 1);
 }
 
 /* graysx css */
@@ -11749,17 +11743,29 @@ body {
 
 .about-img {
   text-align: justify;
-  max-width: 100%;
+  border-radius: 2%;
+  max-width: 60%;
+}
+
+@media (max-width: 992px) {
+  .about-img {
+    max-width: 100%;
+  }
 }
 
 .column {
   display: table-cell;
+  table-layout: fixed;
 }
 
-.about-row {
-  display: table;
-  width: 100%; /*Optional*/
-  table-layout: fixed; /*Optional*/
+@media (min-width: 992px) {
+  .about-row {
+    display: table;
+    width: 100%; /*Optional*/
+    table-layout: fixed; /*Optional*/
+  }
+
+
 }
 
 .listen-section {
@@ -11800,3 +11806,47 @@ body {
     display: inline-block;
   }
 }
+
+@media (min-width: 992px) {
+  .about {
+    display: flex;
+  }
+
+  .about-right {
+    display: flex;
+    flex-direction: row-reverse;
+  }
+
+  .about-img {
+    height: 80%;
+    border-radius: 2%;
+  }
+}
+
+@font-face {
+  font-family: Chilanka;
+  src: url("/Chilanka-Regular.otf");
+}
+
+@font-face {
+  font-family: ShadowsIntoLight;
+  src: url("/ShadowsIntoLight.ttf");
+}
+
+.chilanka {
+  font-family: Chilanka;
+}
+
+.shadows-into-light {
+  font-family: ShadowsIntoLight;
+}
+
+.btn-primary-foot {
+  max-width: 200px;
+}
+
+@media (max-width: 576px) {
+  .overflow-x {
+    overflow-x: hidden !important;
+  }
+}