diff --git a/images/8.jpg b/images/8.jpg
deleted file mode 100644
index 524eb0f..0000000
Binary files a/images/8.jpg and /dev/null differ
diff --git a/images/background.png b/images/background.png
new file mode 100644
index 0000000..91f3d2f
Binary files /dev/null and b/images/background.png differ
diff --git a/index.css b/index.css
index c38e3bb..91901b0 100644
--- a/index.css
+++ b/index.css
@@ -1,175 +1,201 @@
html {
- scroll-behavior: smooth;
- }
-
- ::-webkit-scrollbar {
- width: 10px;
- }
-
+ scroll-behavior: smooth;
+}
- ::-webkit-scrollbar-track {
- background: #3d3d3d;
- }
-
- ::-webkit-scrollbar-thumb {
- background: #707070;
- }
-
- body {
- margin: 0px;
- font-family: "Fira Sans", sans-serif;
- }
-
- .main {
- position: relative;
- align-items: center;
- display: flex;
- flex-direction: column;
- justify-content: center;
- text-align: center;
- display: flex;
- flex-direction: column;
- background-image: url(images/8.jpg);
- background-repeat: no-repeat;
- background-position: center;
- background-size: cover;
- min-height: 100vh;
- min-width: 100%;
- top: 0;
- left: 0;
- }
-
- .main h1 {
- color: black;
- }
-
- .main h3 {
- color: #100f0f;
- }
-
- .main button {
- text-decoration: none;
- transition: 0.5s 5ms;
- font-family: sans-serif;
- font-size: 15px;
- width: 20vh;
- min-height: 7vh;
- height: 9vh;
- background-color: #35353f69;
- color: #ffffff;
- border: none;
- text-decoration: none;
- border: 1px black solid;
- border-radius: 20px;
- }
-
- .main button:hover {
- background-color: #35353f;
- }
-
- .main img {
- width: 10vh;
- }
-
- .next__slide {
- padding: 20px;
- text-align: center;
- color: white;
- background-color: #121212;
- min-height: 60vh;
- }
-
- .reasons {
- flex-wrap: wrap;
- gap: 20px;
- display: flex;
- justify-content: space-between;
- justify-content: center;
- text-align: center;
- background-color: #121212;
- color: white;
- }
-
- .reason {
- text-decoration: none;
- text-align: center;
- width: 250px;
- height: 270px;
- border: 2px solid;
- border-color: #22ff88;
- background-color: #38384f;
- border-radius: 10px;
- padding: 20px;
- transition-duration: 0.5s;
- font-size: 16px;
- }
-
- .reason:hover {
- border-color: #ff95d6;
- color: #ff95d6;
- font-size: 17.6px;
- height: 280px;
- width: 270px;
- margin-left: 0px;
- margin-right: 0px;
- margin-bottom: 10px;
- }
-
- .navbar {
- backdrop-filter: blur(5px);
- z-index: 1;
- overflow: hidden;
- background-color: #00000080;
- position: fixed;
- top: 0;
- width: 100%;
- }
-
- .navbar a {
- transition: 1s 5ms;
- float: left;
- display: block;
- color: #f2f2f2;
- text-align: center;
- padding: 20px;
- text-decoration: none;
- }
-
- .navbar img {
- padding: 10px;
- float: left;
- width: 5vh;
-
- }
-
- .navbar a:hover {
- background: #ffffff90;
- color: black;
- }
-
- .about {
- background-color: #121212;
- color: #ffffff;
- padding: 1px;
- text-align: center;
+::-webkit-scrollbar {
+ width: 10px;
+}
+
+::-webkit-scrollbar-track {
+ background: #3d3d3d;
+}
+
+::-webkit-scrollbar-thumb {
+ background: #717171;
+}
+
+body {
+ margin: 0px;
+ font-family: "Fira Sans", sans-serif;
+}
+
+.main {
+ position: relative;
+ align-items: center;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ text-align: center;
+ display: flex;
+ flex-direction: column;
+ background-image: url(images/background.png);
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: cover;
+ min-height: 100vh;
+ min-width: 100%;
+ top: 0;
+ left: 0;
+}
+
+.main h1 {
+ color: rgb(224, 224, 224);
+}
+
+.main h3 {
+ color: #a4a4a4;
+}
+
+.main button {
+ background-image: linear-gradient(
+ 92.88deg,
+ #455eb5 9.16%,
+ #5643cc 43.89%,
+ #673fd7 64.72%
+ );
+ border-radius: 12px;
+ margin: 5px;
+ border-style: none;
+ box-sizing: border-box;
+ color: #ffffff;
+ cursor: pointer;
+ flex-shrink: 0;
+ font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont,
+ "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
+ sans-serif;
+ font-size: 16px;
+ font-weight: 500;
+ height: 4rem;
+ padding: 0 1.6rem;
+ text-align: center;
+ text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
+ transition: all 1s;
+ user-select: none;
+ -webkit-user-select: none;
+ touch-action: manipulation;
+ width: 50%;
+ min-height: 7vh;
+ height: 9vh;
+ text-decoration: none;
+}
+
+.main button:hover {
+ box-shadow: rgba(80, 63, 205, 0.5) 0 1px 30px;
+ transition-duration: 0.5s;
+}
+
+@media (min-width: 768px) {
+ .button-36 {
+ padding: 0 2.6rem;
}
-
+}
+
+
+.main button:hover {
+ background-color: #35353f;
+}
+
+.main img {
+ width: 10vh;
+}
+
+.next__slide {
+ padding: 20px;
+ text-align: center;
+ color: white;
+ background-color: #121212;
+ min-height: 60vh;
+}
+
+.reasons {
+ flex-wrap: wrap;
+ gap: 20px;
+ display: flex;
+ justify-content: space-between;
+ justify-content: center;
+ text-align: center;
+ background-color: #121212;
+ color: white;
+}
+
+.reason {
+ text-decoration: none;
+ text-align: center;
+ width: 250px;
+ height: 270px;
+ border: 2px solid;
+ border-color: #22ff88;
+ background-color: #38384f;
+ border-radius: 10px;
+ padding: 20px;
+ transition-duration: 0.5s;
+ font-size: 16px;
+}
+
+.reason:hover {
+ border-color: #ff95d6;
+ color: #ff95d6;
+ font-size: 17.6px;
+ height: 280px;
+ width: 270px;
+ margin-left: 0px;
+ margin-right: 0px;
+ margin-bottom: 10px;
+}
+
+.navbar {
+ backdrop-filter: blur(5px);
+ z-index: 1;
+ overflow: hidden;
+ background-color: #00000080;
+ position: fixed;
+ top: 0;
+ width: 100%;
+}
+
+.navbar a {
+ transition: 1s 5ms;
+ float: left;
+ display: block;
+ color: #f2f2f2;
+ text-align: center;
+ padding: 20px;
+ text-decoration: none;
+}
+
+.navbar img {
+ padding: 10px;
+ float: left;
+ width: 40px;
+}
+
+.navbar a:hover {
+ background: #ffffff90;
+ color: black;
+}
+
+.about {
+ background-color: #121212;
+ color: #ffffff;
+ padding: 1px;
+ text-align: center;
+}
+
+.about p {
+ color: #9f9f9f;
+ margin-left: 20vh;
+ margin-right: 20vh;
+}
+
+@media (max-width: 1000px) {
.about p {
color: #9f9f9f;
- margin-left: 20vh;
- margin-right: 20vh;
- }
-
- @media (max-width: 1000px) {
- .about p {
- color: #9f9f9f;
- margin-left: 5vh;
- margin-right: 5vh;
- }
+ margin-left: 5vh;
+ margin-right: 5vh;
}
-
- .warning {
- color: #ffffff;
- padding-top: 30px;
- }
-
\ No newline at end of file
+}
+
+.warning {
+ color: #ffffff;
+ padding-top: 30px;
+}
diff --git a/index.html b/index.html
index 151e6eb..884273e 100644
--- a/index.html
+++ b/index.html
@@ -24,7 +24,8 @@
Axolotl Client
A Free & Open-source Minecraft Client
-
+