.moon {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.moon .phases {
    /*width: 100%;*/
    display: flex;
    align-items: center;
}
.moon .phase {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: min(8vh, 8vw);
    padding: 5px;
}
.moon .phase img {
    filter: url(#filter-color-light);
}
.moon .sortable-active {
    background-color: var(--color-accent-1);
    border-radius: 50%;
}