
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
 a {
      text-decoration: none;
 	color: #F6BE00;
    }

#special-page 
img {
  width: 150%;
}
        body {
            font-family: Calibri, Calibri;
            text-align: center;
            display: flex;
		font-size: 18px;
	text-decoration: bold;
            flex-direction: column;
            min-height: 100vh; /* Makes sure the page takes full height */
        }

        /* Navigation Bar */
        nav {
            background-color: #AD151A;
            padding: 10px 0;
        }

        nav ul {
            list-style: none;
            text-align: center;
            padding: 0;
        }

        nav ul li {
            display: inline;
            margin: 0 15px;
        }

        nav ul li a {
            color: #F6BE00;
            text-decoration: bold;
            font-size: 18px;
            padding: 10px 15px;
        }

        nav ul li a:hover {
            background-color: #6E0D10;
            border-radius: 5px;
        }

        /* Title & Subtitle */
        .title-container {
            margin: 50px 0;
            color: #F6BE00;
        }

        .title-container h1 {
            font-size: 72px;
            font-weight: 900; /* 72Black */
            margin-bottom: 10px;
        }

        .title-container h2 {
            font-size: 72px;
            font-weight: 300; /* 72Light */
        }

        /* Main Content Text*/
        .container {
            flex: 1; /* Pushes the footer down */
            width: 35%;
            margin: 20px auto;
            text-align: justify;
	color: #F6BE00;
	font-size: 18px;
	font-weight: 300;
	}

        /* Footer */
        footer {
            background-color: #AD151A;
            color: white;
            text-align: center;
            padding: 10px;
            width: 100%;
	

        }

	/* Main content image*/
	.center-image {
    	display: block;
  	  margin: -20px auto 20px auto; 
  	  max-width: 50%; /* Ensures image is responsive */
   	 height: float;
	}

	.title-container h1 {
   	 font-size: 72px;
  	  font-weight: 900; /* 72Black */
   	 color: #F6BE00;
   	 margin-bottom: 10px;
	}

	.title-container h3 {
   	 font-size: 24px;
   	 font-weight: 300; /* 72Light */
   	 color: #F6BE00;
	}

/*Hover box*/
.hover-box {
        position: relative;
        display: inline-block;
        cursor: pointer;
    }

    .hover-text {
        display: none;
        position: absolute;
        background-color: #f9f9f9;
        color: #333;
        border: 1px solid #ccc;
        padding: 10px;
       width: 300px;
        white-space: justify; pre-wrap;
        top: 25px;
        left: 0;
        z-index: 10;
    }

    .hover-box:hover .hover-text {
        display: block;
    }

 /* Scale up to 75% width on smaller screens */
@media (max-width: 768px) {
    .container {
        width: 75%;
    }
}