.moon
{
    z-index: -1;
    background-color: #f7f7f7;
    height: 7rem;
    width: 7rem;
    border-radius: 50%;
    position: absolute;
    left: 20%; 
    right: 0; 
    top: 20%; 
    bottom: 0;
    border: 0.1rem solid rgba(0, 0, 0, 0.6);
}

.moon div
{
    position: absolute;
    content: "";
    border-radius: 50%;
}

.moon div:first-child
{
    opacity: 0.4;
    height: 2rem;
    width: 2rem;
    top: 3.75rem;
    left: 1.25rem;
    background-color: #c0c0c0;
                /* left top sharpnes radius */
    box-shadow: 2.4rem -2.1rem 0 0.7rem #c0c0c0,
        1rem -3.8rem 0 -0.6rem #c0c0c0,
        0rem -3.0rem 0 -0.4rem #c0c0c0,
        3rem 0rem 0 0rem #c0c0c0;
}

.moon div:last-child
{
    opacity: 0.4;
    height: 2rem;
    width: 2rem;
    top: 3.75rem;
    left: 1.25rem;
    box-shadow: 3rem -2.1rem 0 -0.2rem #c0c0c0,
        2.4rem -2.1rem 0 -0.4rem #c0c0c0;
}

.moon_glow 
{
    background: radial-gradient(circle, rgba(255, 255, 255, 1) 40% 40%, rgba(150, 250, 250, 1) 70%);
}
.star 
{
    z-index: -2;
    background-color: #ffae00;
    border-radius: 20rem;
    position: absolute;
    /* border: 1rem solid; */
    /* border-color: #222; */
    box-shadow: 0.5rem 0.5rem 3.5rem 0.8rem rgba(255,244,166,1);
}
.star1 
{
    background-color: #aaccff;
    box-shadow: 0.5rem 0.5rem 3.5rem 0.8rem rgb(210, 222, 255);
    height: 0.5rem;
    width: 0.5rem;
    left: 29%;
    top: 20%;
}
.star2 
{
    height: 0.4rem;
    width: 0.4rem;
    left: 49%;
    top: 10%;
}
.star3 
{
    background-color: #aaffc5;
    box-shadow: 0.5rem 0.5rem 3.5rem 0.8rem rgb(228, 255, 235);
    height: 0.6rem;
    width: 0.6rem;
    left: 80%;
    top: 50%;
}
.star4 
{
    background-color: #ffaada;
    box-shadow: 0.5rem 0.5rem 3.5rem 0.8rem rgb(255, 228, 246);
    height: 0.25rem;
    width: 0.25rem;
    left: 10%;
    top: 30%;
}
.star5 
{
    background-color: #ff6363;
    box-shadow: 0.5rem 0.5rem 3.5rem 0.8rem rgb(255, 211, 211);
    height: 0.5rem;
    width: 0.5rem;
    left: 30%;
    top: 80%;
}
.star6 
{
    height: 0.2rem;
    width: 0.2rem;
    left: 79%;
    top: 22%;
    box-shadow: 0.1rem 0.2rem 1.5rem 0.2rem rgba(255,244,166,1);
}
