CSS changes (#7)

* First CSS Update

Added some changes to the background, header and such. NOT COMPLETE YET

* Update styles.css

* New logo

* Delete Color.png

* New Lofo

* Delete fetchcord.png

Replaced by new logo

* Add files via upload

* Update styles.css

* Update styles.css

* some font definition changes

* mostly font and color changes

* Delete fetchcord.png

* Add files via upload

* Delete fetchcord.png

* Add files via upload

* Changed shadow style and removed outlines

* Delete fetchcord.png

* Add files via upload

* Update styles.css

* Update styles.css

* Update index.html

* Update index.html

* Update styles.css

* Update styles.css

* Update index.html

* Update index.html

* made gallery adaptive

* Delete favicon.ico

* Add files via upload

* Update LICENSE.md

* Update styles.css

* Update styles.css

* Update about.html

* Update about.html

* Update styles.css

* changed header to match with css

* removed text centering

* Update styles.css

* Update credits.html

* Update credits.html

* Update discord.html

* Update styles.css

* Update styles.css

* removed the em parts

* Update credits.html

* Update about.html

* Update discord.html

* Update index.html

* Update index.html

* Update index.html

* added vertical lines

* Update index.html

* Update styles.css

* Update index.html

* Update styles.css

* Update styles.css

* Update styles.css

* Update index.html

* Update styles.css

* Update discord.html

* Update styles.css

* Update about.html

* Update credits.html

* Update discord.html

* Update styles.css

* Update linux.html

* Update styles.css

* Update linux.html

* Update credits.html

* Update macos.html

* Update macos.html

* Update windows.html

* Delete discord.png

* Delete linux.png

* Delete macos.png

* Delete windows.png

* Delete about.png

* Update styles.css

* Update styles.css

* scrolling navbar

* logo resize

* Update styles.css

* Update styles.css

* dropdown fixed

* Update styles.css

* Update styles.css

* Update README.md

* Update README.md

Co-authored-by: too-many-errors <[email protected]>

Author: Solinus839

styles.css

@@ -34,7 +34,7 @@ p {
   font-family: 'Roboto';
   font-weight: 400;
   font-style: normal;
-  font-size: 20px;
+  font-size: 18px;
   color:#ACB0B9;
   text-shadow: 0px -2px 0px rgba(0, 0, 0, 0.25);
 }
@@ -51,23 +51,25 @@ body{
   animation: fade-and-come-down 1.25s forwards;
 }
 
+
+
 .header {
   background-size: cover;
   background-repeat: no-repeat;
   background-origin: border-box;
-  display: grid;
-  grid-template-columns: 150px auto;
+  display: flex;
+  flex-wrap: nowrap;
   column-gap: 30px;
   place-items: center;
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
   overflow: hidden;
-  padding-top: 20px;
-  padding-bottom: 20px;
+  padding: 20px;
   background: linear-gradient(180deg, #3B158C 0%, #5C3DE3 100%);
-  filter: drop-shadow(6px 6px 6px rgba(0, 0, 0, 0.25));
+  filter: drop-shadow(0px 6px 0px rgba(0, 0, 0, 0.25));
   text-shadow: 0px -4px 0px rgba(0, 0, 0, 0.25);
   justify-content: center;
+  align-items: center;
 }
 
 
@@ -76,10 +78,33 @@ body{
 }
 
 .headertxt {
-  text-align:
-  left;
-  float:
-  right;
+  text-align:left;
+  float:right;
+}
+
+@media only screen and (max-width: 800px) {
+  body{
+    padding-left:35px;
+    padding-right:35px;
+  }
+  .logo {
+      transform-origin: left;
+      transform: scale(.7);
+      width:110px
+  }
+  .header {
+      grid-template-columns: auto auto;
+  }
+}
+
+@media only screen and (max-width: 600px) {
+  .logo {
+    display: none;
+  }
+  
+  .header {
+    grid-template-columns: auto;
+  }
 }
 
 .header--home {
@@ -102,9 +127,10 @@ body{
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
     display: flex;
-    flex-wrap: nowrap;
+    /* flex-wrap: nowrap; */
     justify-content: space-between;
     align-items: center;
+    overflow-x: scroll;
   }
 
   .navbar a {
@@ -137,7 +163,6 @@ body{
 
   .dropdown {
     float: right;
-    overflow: hidden;
     font-family: 'Roboto Mono';
   }
 
@@ -151,6 +176,7 @@ body{
     background-color: inherit;
     font-family: inherit;
     margin: 0;
+    white-space: nowrap;
   }
 
   .navbar a:hover, .dropdown:hover .dropbtn {
@@ -170,6 +196,13 @@ body{
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
   }
+
+@media only screen and (max-width: 768px) {
+  .dropdown-content {
+    margin-left: 0;
+    right: 75px;
+  }
+}
 
   .dropdown-content a {
     float: none;
@@ -324,6 +357,12 @@ body{
   }
 }
 
+@media only screen and (max-width: 500px) {
+  .gallery {
+        grid-template-columns: auto;
+  }
+}
+
 .galleryitem {
   float: left;
   height: 95%;