Delete styles.css

diff --git a/styles.css b/styles.css
deleted file mode 100644 (file)
index e2347fa..0000000
--- a/styles.css
+++ /dev/null
@@ -1,356 +0,0 @@
-*,\r
-before,\r
-after {\r
-  box-sizing: border-box;\r
-  margin: 0;\r
-  padding: 0;\r
-}\r
-html {\r
-  font-size: 62.5%;\r
-}\r
-body {\r
-  font-family: "Source Code Pro", monospace;\r
-  background-color: #141C25;\r
-}\r
-section {\r
-  margin-top: 10rem;\r
-  padding: 2rem;\r
-}\r
-section h2 {\r
-  font-family: "Chakra Petch", sans-serif;\r
-}\r
-\r
-/* Navigation Bar */\r
-header {\r
-  background-color: #2E4057;\r
-  height: 7.5rem;\r
-  padding: 0 0.4rem;\r
-  display: flex;\r
-  justify-content: space-between;\r
-  align-items: center;\r
-  border-bottom: 0.4rem solid #729B79;\r
-  position: fixed;\r
-  top: 1rem;\r
-  left: 50%;\r
-  width: 80vw;\r
-  transform: translateX(-50%);\r
-  border-radius: 0.8rem;\r
-  box-shadow: 0.8rem 0.8rem 0.2rem #000;\r
-}\r
-.logo {\r
-  font-size: 2rem;\r
-  color: #F4FFF8;\r
-  font-family: "Chakra Petch", sans-serif;\r
-  text-shadow: 0.2rem 0.2rem #4EA699;\r
-}\r
-#navbar ul {\r
-  display: flex;\r
-  flex-wrap: wrap;\r
-  gap: 0.2rem;\r
-}\r
-#navbar ul li {\r
-  list-style: none;\r
-}\r
-#navbar ul li a {\r
-  border: 0.2rem solid #F4FFF8;\r
-  border-radius: 0.6rem;\r
-  font-size: 1rem;\r
-  padding: 0.2rem;\r
-  text-decoration: none;\r
-  color: #F4FFF8;\r
-}\r
-#navbar ul li a:hover {\r
-  background-color: #F4FFF8;\r
-  color: #2E4057;\r
-}\r
-\r
-/* Heading */\r
-#heading {\r
-  height: 100vh;\r
-  width: 100%;\r
-  margin: auto;\r
-  text-align: center;\r
-  display: flex;\r
-  flex-direction: column;\r
-  align-items: center;\r
-  justify-content: center;\r
-}\r
-#heading h1 {\r
-  color: #4EA699;\r
-  font-size: 2rem;\r
-}\r
-#heading .subheading {\r
-  color: #F4FFF8;\r
-  font-size: 3.8rem;\r
-  font-family: "Chakra Petch", sans-serif;\r
-  animation: color-change-animation 4.5s ease-in-out infinite 0.5s;\r
-}\r
-#heading a {\r
-  color: #F4FFF8;\r
-  text-decoration: none;\r
-  margin-top: 1rem;\r
-  font-size: 1.6rem;\r
-}\r
-#heading a i {\r
-  margin-top: -0.4rem;\r
-  font-size: 1.6rem;\r
-}\r
-#heading a:hover, #heading a i:hover {\r
-  transform: scale(90%);\r
-  transition: 0.5s ease-in-out 0.2s;\r
-}\r
-\r
-/* About */\r
-#about {\r
-  background-color: #2E4057;\r
-  width: 80vw;\r
-  margin: auto;\r
-  border-radius: 0.6rem;\r
-  margin-bottom: 4rem;\r
-  box-shadow: 1rem 1rem 0.2rem #000;\r
-}\r
-#about h1, #about .subheading {\r
-  text-align: center;\r
-}\r
-#about h1 {\r
-  font-size: 3rem;\r
-  color: #F4FFF8;\r
-  padding-top: 1.4rem;\r
-}\r
-#about .subheading {\r
-  font-size: 1.8rem;\r
-  color: #4EA699;\r
-}\r
-#about .paragraph {\r
-  font-size: 1.6rem;\r
-  padding: 1.8rem;\r
-  color: #91A0A8;\r
-}\r
-\r
-/* Projects */\r
-#projects {\r
-  background-color: #2E4057;\r
-  width: 80vw;\r
-  margin: auto;\r
-  border-radius: 0.6rem;\r
-  padding-bottom: 1rem;\r
-  margin-bottom: 4rem;\r
-  box-shadow: 1rem 1rem 0.2rem #000;\r
-}\r
-#projects h2, #projects .subheading {\r
-  text-align: center;\r
-}\r
-#projects h2 {\r
-  font-size: 3rem;\r
-  color: #F4FFF8;\r
-  padding-top: 1.4rem;\r
-}\r
-#projects .subheading {\r
-  font-size: 1.8rem;\r
-  color: #4EA699;\r
-}\r
-#projects .paragraph {\r
-  font-size: 1.6rem;\r
-  padding: 1.8rem;\r
-  color: #91A0A8;\r
-}\r
-#projects .project-gallery {\r
-  border: 0.2rem solid #729B79;\r
-  border-radius: 0.6rem;\r
-  height: 20rem;\r
-  width: 90%;\r
-  margin: 1rem auto;\r
-  margin-bottom: 3rem;\r
-  box-shadow: 1rem 1rem 0.2rem #000;\r
-  background-color: #4EA69980;\r
-  padding: 1.4rem;\r
-  white-space: nowrap;\r
-  overflow: auto;\r
-  display: flex;\r
-  flex-direction: row;\r
-  gap: 1.4rem;\r
-}\r
-.project-tile img {\r
-  border-radius: 0.8rem;\r
-  box-shadow: 0.8rem 0.8rem 0.4rem black;\r
-  height: 90%;\r
-  object-fit: cover;\r
-}\r
-\r
-/* Contact */\r
-#contact {\r
-  background-color: #2E4057;\r
-  width: 80vw;\r
-  margin: auto;\r
-  border-radius: 0.6rem;\r
-  padding-bottom: 1rem;\r
-  box-shadow: 1rem 1rem 0.2rem #000;\r
-}\r
-#contact h2, #contact .subheading {\r
-  text-align: center;\r
-}\r
-#contact h2 {\r
-  font-size: 3rem;\r
-  color: #F4FFF8;\r
-  padding-top: 1.4rem;\r
-}\r
-#contact .subheading {\r
-  font-size: 1.8rem;\r
-  color: #4EA699;\r
-}\r
-.contact-options {\r
-  display: flex;\r
-  flex-direction: row;\r
-  justify-content: center;\r
-  align-items: center;\r
-  gap: 2rem;\r
-  height: 2rem;\r
-  padding: 3rem;\r
-  margin-top: 1.8rem;\r
-  margin-bottom: 1.8rem;\r
-}\r
-#contact a {\r
-  color: #729B79;\r
-  border: 0.2rem solid #729B79;\r
-  border-radius: 1rem;\r
-  padding: 1rem;\r
-  font-size: 2.8rem;\r
-  box-shadow: 0.6rem 0.6rem #000;\r
-  transition: 0.5s ease-in-out 0.2s;\r
-}\r
-#contact a:hover {\r
-  color: #F4FFF8;\r
-  border: 0.2rem solid #F4FFF8;\r
-  transform: scale(1.2);\r
-}\r
-\r
-/* Footer */\r
-footer {\r
-  background-color: #2E4057;\r
-  height: 10rem;\r
-  font-family: "Chakra Petch", sans-serif;\r
-  display: flex;\r
-  align-items: center;\r
-  justify-content: center;\r
-  font-size: 1.6rem;\r
-  margin-top: 8rem;\r
-}\r
-p.copyright {\r
-  color: #F4FFF8;\r
-}\r
-.copyright .logo {\r
-  font-size: 2.4rem;\r
-}\r
-\r
-/* Media Queries */\r
-@media (prefers-reduced-motion: no-preference) {\r
-  * {\r
-    scroll-behavior: smooth;\r
-  }\r
-}\r
-\r
-/* Different screen sizes responsiveness */\r
-@media only screen and (min-width: 600px) {\r
-  header {\r
-    padding: 0 2rem;\r
-  }\r
-  .logo {\r
-    font-size: 3.4rem;\r
-  }\r
-  #navbar ul {\r
-    gap: 1rem;\r
-  }\r
-  #navbar ul li a {\r
-    font-size: 1.8rem;\r
-  }\r
-  #heading h1 {\r
-    font-size: 3.4rem;\r
-  }\r
-  #heading .subheading {\r
-    font-size: 6rem;\r
-  }\r
-  #heading a {\r
-    font-size: 2rem;\r
-  }\r
-  #heading a .chevron-down {\r
-    margin-top: -0.8rem;\r
-    font-size: 2rem;\r
-  }\r
-  #about {\r
-    width: 70vw;\r
-    max-width: 100rem;\r
-  }\r
-  #about h1 {\r
-    font-size: 5rem;\r
-  }\r
-  #about .subheading {\r
-    font-size: 2.8rem;\r
-  }\r
-  #about .paragraph {\r
-    font-size: 2.4rem;\r
-    padding: 3rem;\r
-  }\r
-  #projects {\r
-    width: 80vw;\r
-    max-width: 120rem;\r
-  }\r
-  #projects h2 {\r
-    font-size: 5rem;\r
-  }\r
-  #projects .subheading {\r
-    font-size: 2.8rem;\r
-  }\r
-  #projects .paragraph {\r
-    font-size: 2.4rem;\r
-    padding: 3rem;\r
-  }\r
-  #projects .project-gallery {\r
-    height: 30rem;\r
-    gap: 2.4rem;\r
-  }\r
-  .project-tile img {\r
-    height: 95%;\r
-  }\r
-  #contact {\r
-    width: 70vw;\r
-    max-width: 100rem;\r
-  }\r
-  #contact h2 {\r
-    font-size: 5rem;\r
-  }\r
-  #contact .subheading {\r
-    font-size: 2.8rem;\r
-  }\r
-  .contact-options {\r
-    gap: 4rem;\r
-    height: 4rem;\r
-    padding: 4rem;\r
-  }\r
-  #contact a {\r
-    padding: 1.4rem;\r
-    font-size: 4rem;\r
-  }\r
-  footer {\r
-    height: 12rem;\r
-    font-size: 2rem;\r
-  }\r
-  .copyright .logo {\r
-    font-size: 2.8rem;\r
-  }\r
-}\r
-\r
-/* Animations */\r
-@keyframes color-change-animation {\r
-  25% {\r
-    color: #729B79;\r
-  }\r
-  50%{\r
-    color: #91A0A8;\r
-  }\r
-  75% {\r
-    color: #4EA699;\r
-  }\r
-  100% {\r
-    color: #F4FFF8;\r
-  }\r
-}\r