.pulsating-circle {
    left: 20%;
    top: 20%;
    transform: translateX(-20%) translateY(-20%);
    width: 20px;
    height: 20px;

    &:before {
        content: '';
        position: relative;
        display: block;
        width: 300%;
        height: 300%;
        box-sizing: border-box;
        margin-left: -100%;
        margin-top: -100%;
        border-radius: 45px;
        background-color: inherit;
        animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
    }
}

@keyframes pulse-ring {
    0% {
        transform: scale(.33);
    }

    80%,
    100% {
        opacity: 0;
    }
}