* {
             margin: 0;
             padding: 0;
             box-sizing: border-box;
             font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
         }
         
         body {
             display: flex;
             flex-direction: column;
             min-height: 100%;
             background-color: #f5f5f5;
         }
         /* Header Styles */
         
         header {
             background-color: #9c2424;
             color: white;
             padding: 1rem 2rem;
             display: flex;
             justify-content: space-between;
             align-items: center;
             box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
         }
         
         .logo {
             height: 50px;
             /* Adjust as needed */
             width: auto;
             /* Maintains aspect ratio */
         }
         /* Desktop Navigation */
         
         .desktop-nav {
             display: flex;
         }
         
         .nav-item {
             position: relative;
             margin-left: 1.5rem;
         }
         
         .nav-item>a {
             color: white;
             text-decoration: none;
             padding: 0.5rem 1rem;
             display: block;
             transition: background-color 0.3s;
             border-radius: 4px;
         }
         
         .nav-item>a:hover {
             background-color: rgba(255, 255, 255, 0.1);
         }
         
         .dropdown {
             position: absolute;
             top: 100%;
             left: 0;
             background-color: white;
             min-width: 200px;
             box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
             border-radius: 4px;
             opacity: 0;
             visibility: hidden;
             transform: translateY(-10px);
             transition: all 0.3s ease;
             z-index: 100;
         }
         
         .nav-item:hover .dropdown {
             opacity: 1;
             visibility: visible;
             transform: translateY(0);
         }
         
         .dropdown a {
             color: #1b1b1b;
             /* 333 */
             text-decoration: none;
             padding: 0.8rem 1rem;
             display: block;
             border-bottom: 1px solid #eee;
             transition: background-color 0.2s;
         }
         
         .dropdown a:hover {
             background-color: #f9f9f9;
         }
         
         .dropdown a:last-child {
             border-bottom: none;
         }
         /* Hamburger Menu */
         
         .hamburger {
             display: none;
             flex-direction: column;
             cursor: pointer;
         }
         
         .hamburger span {
             height: 3px;
             width: 25px;
             background-color: white;
             margin: 3px 0;
             transition: 0.3s;
         }
         /* Mobile Navigation */
         
         .mobile-nav {
             position: fixed;
             top: 0;
             right: -100%;
             width: 80%;
             max-width: 300px;
             height: 100vh;
             background-color: #2c3e50;
             padding: 2rem;
             transition: right 0.3s ease;
             z-index: 1000;
             overflow-y: auto;
         }
         
         .mobile-nav.active {
             right: 0;
         }
         
         .mobile-nav .close-btn {
             position: absolute;
             top: 1rem;
             right: 1rem;
             font-size: 1.5rem;
             color: white;
             background: none;
             border: none;
             cursor: pointer;
         }
         
         .mobile-nav-item {
             margin-bottom: 1rem;
         }
         
         .mobile-nav-item>a {
             color: white;
             text-decoration: none;
             font-size: 1.2rem;
             display: block;
             padding: 0.5rem 0;
             border-bottom: 1px solid rgba(255, 255, 255, 0.1);
         }
         
         .mobile-dropdown {
             max-height: 0;
             overflow: hidden;
             transition: max-height 0.3s ease;
         }
         
         .mobile-dropdown.active {
             max-height: 500px;
         }
         
         .mobile-dropdown a {
             color: #ddd;
             text-decoration: none;
             display: block;
             padding: 0.5rem 1rem;
             border-bottom: 1px solid rgba(255, 255, 255, 0.05);
         }
         
         .mobile-dropdown-toggle {
             background: none;
             border: none;
             color: white;
             font-size: 1.2rem;
             cursor: pointer;
             padding: 0.5rem 0;
             width: 100%;
             text-align: left;
             display: flex;
             justify-content: space-between;
             align-items: center;
         }
         
         .mobile-dropdown-toggle::after {
             content: '+';
             font-size: 1.5rem;
             transition: transform 0.3s;
         }
         
         .mobile-dropdown-toggle.active::after {
             transform: rotate(45deg);
         }
         /* Content Section */
         
         .content {
             flex: 1;
             padding: 1rem;
             max-width: 1200px;
             margin: 0 auto;
             width: 100%;
         }
         
         .content h1 {
             color: #2c3e50;
             margin-bottom: 1rem;
             font-size: 2.5rem;
             text-align: center;
         }
         
         .content p {
             line-height: 1.6;
             margin-bottom: .5 rem;
             color: #000;
         }
         
         .responsive-img {
             display: block;
             margin: 0 auto;
             max-width: 50%;
             max-height: 50%;
             /* Fixed height */
             object-fit: cover;
             /* Prevents image distortion */
             /* width: 100%;*/
         }
         
         .cards {
             display: grid;
             grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
             gap: 1.5rem;
             margin-top: .5rem;
         }
         
         .card {
             background-color: rgb(250, 215, 134);
             border-radius: 8px;
             padding: 1rem;
             box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
             transition: transform 0.3s;
         }
         
         .card:hover {
             transform: translateY(-5px);
         }
         
         .card h3 {
             color: #2c3e50;
             margin-bottom: 1rem;
         }
         /* Footer */
         
         footer {
             background-color: #9c2424;
             color: white;
             text-align: center;
             padding: 1.2 rem;
             margin-top: auto;
         }
         /* Overlay for mobile menu */
         
         .overlay {
             position: fixed;
             top: 0;
             left: 0;
             width: 100%;
             height: 100%;
             background-color: rgba(0, 0, 0, 0.5);
             z-index: 999;
             opacity: 0;
             visibility: hidden;
             transition: all 0.3s;
         }
         
         .overlay.active {
             opacity: 1;
             visibility: visible;
         }
         /* Media Queries */
         
         @media (max-width: 900px) {
             .desktop-nav {
                 display: none;
             }
             .hamburger {
                 display: flex;
             }
             .content h1 {
                 font-size: 2rem;
             }
         }
         
         @media (max-width: 600px) {
             header {
                 padding: 1rem;
             }
             .content {
                 padding: 1rem;
             }
             .cards {
                 grid-template-columns: 1fr;
             }
         }