.logo {
    justify-content: center;
    border-radius: 50%;
    box-shadow: 28px 28px 56px #bcbcbc;
}

.compass {
    width: 145px;
    height: 145px;
    background-image: url(../images/compass.png);
    background-size: 100%;
    display: flex;
    justify-content: center;
}

.pointer {
    width: 145px;
    height: 145px;
    background-image: url(../images/pointer.png);
    background-size: 100%;
    transform: rotate(0deg);
    animation: rotate 10s ease-in-out infinite alternate;
    position: absolute;
}

@keyframes rotate {
    to {
        transform: rotate(180deg);
    }
}

.canvas {
    width: 145px;
    height: 145px;
    background-image: url(../images/person.png);
    background-size: 100%;
    z-index: 1000;
}