/* Set overall body style for background and text color */
        body {
            background-color: lightblue;
            color: lightcoral; /* Closest web-safe color to light red */
            font-family: sans-serif; /* A default font */
        }

        h1 {
            color: indianred; /* Slightly darker red for the heading */
        }

        #map {
            height: 500px;
            width: 100%;
            /* background-color: #eee;   No needed as the background takes over entire screen */
            border: 2px solid darkcyan;  /* optional, but looks nice */
        }

        .leaflet-popup-content {
            color: darkred; /* Adjust popup text color */
        }

        .custom-marker-icon {
            background-color: red; /* Or any color you want */
            width: 20px;
            height: 20px;
            display: block;
            left: -10px;
            top: -10px;
            position: relative;
            border-radius: 20px; /* Make it a circle */
            border: 1px solid #fff;
        }