@mixin video-button {
    title-color: var(color-black);

    display: inline-flex;
    align-items: center;

    a {
        display: flex;
        align-items: center;
        justify-content: center;

        width: px2rem(q(64));
        height: px2rem(q(64));
        margin-right: px2rem(q(16));
        padding-left: 0.2em;

        color: var(title-color);
        font-size: px2rem(q(24));
        line-height: 1;

        border-radius: 50%;
        background-color: transparent;
        box-shadow: inset 0 0 0 q(1) var(title-color);

        &:hover {
            color: var(color-white);
            background-color: var(accent-1);
            box-shadow: inset 0 0 0 q(1) var(accent-1);
        }
    }

    &__title {
        text-transform: uppercase;
        color: var(title-color);
        font-size: px2rem(q(14));
        font-weight: 700;
    }
}