#home {
    background-color: #000; /* Dark background for night sky */
    position: relative;
    height: 100vh; /* Full viewport height */
    overflow: hidden;
}

.star {
    background-color: #fff;
    border-radius: 50%;
    opacity: 0.1; /* Vary this for different stars */
    position: absolute;
    /* Randomly position stars using JavaScript */
}

.planet {
    border-radius: 50%;
    position: absolute;
    opacity: 0.6;
    /* Additional styling for each planet */
}

/* Example for Mercury */
.Mercury {
    width: 1px;
    height: 1px;
    background-color: #1a1a1a;
    /* Position along the arch */
    left: 10%;
    top: 40%;
    transform: translate(-50%, -50%);
}

.Venus {
    width: 3px;
    height: 3px;
    background-color: #e6e6e6;
    /* Position along the arch */
    left: 17%;
    top: 35%;
    transform: translate(-50%, -50%);
}

.Mars {
    width: 2px;
    height: 2px;
    background-color: #993d00;
    /* Position along the arch */
    left: 24%;
    top: 30%;
    transform: translate(-50%, -50%);
}

.Jupiter {
    width: 8px;
    height: 8px;
    background-color: #db2520;
    /* Position along the arch */
    left: 45%;
    top: 24%;
    transform: translate(-50%, -50%);
}

.Saturn {
    width: 6px;
    height: 6px;
    background-color: #ff7a18;
    /* Position along the arch */
    left: 55%;
    top: 20%;
    transform: translate(-50%, -50%);
}

.Uranus {
    width: 6px;
    height: 6px;
    background-color: #1c2851;
    /* Position along the arch */
    left: 65%;
    top: 16%;
    transform: translate(-50%, -50%);
}

.Neptune {
    width: 6px;
    height: 6px;
    background-color: #49636b;
    /* Position along the arch */
    left: 75%;
    top: 11%;
    transform: translate(-50%, -50%);
}

/* Twinkling effect */

@keyframes flickering {
    0% { opacity: 0.10; }
    10% { opacity: 0.25; }
    20% { opacity: 0.35; }
    40% { opacity: 0.45; }
    50% { opacity: 0.55; }
    60% { opacity: 0.45; }
    80% { opacity: 0.35; }
    90% { opacity: 0.25; }
    100% { opacity: 0.15; }
}
.star {
    position: absolute;
    border-radius: 50%;
    background: white;
    /* Rest of your star styling */
    animation: flickering 3s infinite;
    box-shadow: 0 0 14px 1px white; /* Drop shadow effect */
}

