Update style.css

style.css

@@ -10,7 +10,6 @@ body {
  background-size: cover;
  color: #fff;
  text-align: center;
- overflow: hidden; /* Prevent scrolling due to fog */
 }
 
 /* Header Style */
@@ -22,7 +21,7 @@ header {
 h1 {
  color: #d1a300; 
  font-size: 4rem;
- font-family: 'Creepster', cursive; 
+ font-family: 'Creepster', cursive; /* Keep the spooky font for the main title */
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5); 
  animation: flicker 1s infinite alternate;
  margin-bottom: 10px;
@@ -50,8 +49,8 @@ main {
 h2 {
  color: #f8e71c; 
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); 
- font-size: 2.5rem; 
- font-family: 'Creepster', cursive; /
+ font-size: 2.5rem; /* Increased font size */
+ font-family: 'Creepster', cursive; /* Keep spooky font for headings */
  margin-bottom: 20px;
 }
 
@@ -60,7 +59,7 @@ button {
  padding: 15px 30px;
  background-color: #333;
  color: #fff;
- font-family: 'Arial', sans-serif; 
+ font-family: 'Arial', sans-serif; /* Use readable font for buttons */
  font-size: 1.2rem;
  border: none;
  border-radius: 5px;
@@ -80,10 +79,10 @@ button:hover {
  max-width: 700px;
  margin: 20px auto;
  padding: 20px;
- background-color: rgba(0, 0, 0, 0.7); /
+ background-color: rgba(0, 0, 0, 0.7); /* Added semi-transparent background */
  color: #fff;
  border: 2px solid #fff;
- border-radius: 20px; 
+ border-radius: 20px; /* More rounded corners */
  box-shadow: 0 0 15px #fff;
  text-align: left;
  font-size: 1.2rem;
@@ -100,19 +99,6 @@ button:hover {
  margin-bottom: 10px;
 }
 
-/* Fog Effect */
-.fog {
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background: url('https://static.vecteezy.com/system/resources/thumbnails/020/918/090/small/fog-motion-blured-isolated-3d-render-png.png') repeat; /* fog */
- opacity: 0.5; 
- pointer-events: none; 
- z-index: 5;
-}
-
 /* Footer */
 footer {
  padding: 20px;
@@ -169,7 +155,7 @@ footer {
  left: 0;
  width: 100%;
  height: 100%;
- background-color: rgba(0, 0, 0, 0.9); 
+ background-color: rgba(0, 0, 0, 0.9); /* Dark overlay */
  display: flex;
  flex-direction: column;
  align-items: center;
@@ -181,12 +167,13 @@ footer {
  text-align: center;
 }
 
-/* Countdown */
+/* Countdown Timer */
 #countdown {
  font-size: 2.5rem;
  margin-top: 20px;
 }
 
+/* Adjustments for Readability */
 ol, ul {
  padding-left: 20px;
 }
@@ -203,16 +190,3 @@ a {
 a:hover {
  text-decoration: underline;
 }
-
-/* Custom Cursor */
-body {
- cursor: url('https://i.pinimg.com/736x/f4/4c/55/f44c55ed86add5661b57625de1389ef8.jpg'), auto; /* custom cursor */
-}
-
-/* Parallax Effect */
-.parallax {
- position: relative;
- overflow: hidden;
- height: 100vh; 
- background-attachment: fixed;
-}