separator.less

// <p>Before</p>
// <p class="separator">
//     Or
// </p>
// <p>Before</p>

.separator {
    text-align: center;
    position: relative;

    &:before, &:after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        height: 1px;
        background: black;
    }

    @distance-from-center: 30px;

    &:before {
        right: 50%;
        margin-right: @distance-from-center;
    }

    &:after {
        left: 50%;
        margin-left: @distance-from-center;
    }
}