html, body {
            height: 100%;
            font-family: 'Roboto', sans-serif; /* Use Roboto font */
            margin: 0;
            display: flex;
            background-color: black; /* Set background to black */
            color: yellow; /* Set text color to yellow */
        }

        .sidebar {
            width: 200px;
            background-color: #333; /* Darker background for the sidebar */
            padding: 20px;
            box-shadow: 2px 0 5px rgba(0, 0, 0, 0.5);
            height: 100%;
        }

            .sidebar h2,
            .sidebar h3 {
                margin-top: 0;
            }

            .sidebar ul {
                list-style-type: none;
                padding: 0;
            }

                .sidebar ul li {
                    margin: 10px 0;
                }

        a {
            text-decoration: none; /* Remove underline */
            color: #F0F000; /* Link color */
        }

            a:hover {
                text-decoration: underline; /* Underline on hover */
                color: #FFFF00;
            }

        .sidebar ul li a:hover {
            text-decoration: underline; /* Underline on hover */
        }

        .content {
            padding: 20px;
            flex-grow: 1;
            max-width: 90%;
            margin: 0 auto;
        }