HabitTracker/static/main.css

.animated_background {
    background: linear-gradient(229deg, #4bb1c1, #8525d7, #d76d25);
    background-size: 600% 600%;

    -webkit-animation: AnimationName 24s ease infinite;
    -moz-animation: AnimationName 24s ease infinite;
    animation: AnimationName 24s ease infinite;
}

@-webkit-keyframes AnimationName {
    0%{background-position:0 50%}
    50%{background-position:100% 50%}
    100%{background-position:0 50%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0 50%}
    50%{background-position:100% 50%}
    100%{background-position:0 50%}
}
@keyframes AnimationName {
    0%{background-position:0 50%}
    50%{background-position:100% 50%}
    100%{background-position:0 50%}
}
.day {
    width: calc(100% / 7);
    height: 20px;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

.heatmap {
    display: flex;
    flex-wrap: wrap;
}