/* ==========================================================================
   Video Button shortcode start styles
   ========================================================================== */
.qodef-video-button {

    .qodef-video-button-play {
        width: 85px;
        height: 85px;
        display: block;
        line-height: 85px;
        font-size: 30px;
        margin: 0 auto;
        font-family: 'FontAwesome', serif;
        @include qodefTransition(transform 0.25s cubic-bezier(0.41, -0.1, 0.54, 1.74));

        .qodef-video-button-wrapper {
            width: 100%;
            height: 100%;
            display: block;
            position: relative;
            color: #fff;
            background-color: rgba(0,0,0,0.85);
            @include qodefBorderRadius(50%);

            span {
                position: absolute;
                top: 50%;
                left: 55%;
                @include qodefTransform(translate(-50%, -50%));
            }
        }
    }

    .qodef-video-button-title{
        margin-top: 20px;
    }

    &.light {
        .qodef-video-button-play {
            .qodef-video-button-wrapper {
                color: #fff;
                background-color: rgba(253,240,38, 0.85);
            }
        }
        .qodef-video-button-title{
            color: #fff;
        }
    }

    &:hover {
        .qodef-video-button-play {
            @include qodefTransform(scale(1.08,1.08));
        }
    }
}
/* ==========================================================================
   Video Button shortcode end styles
   ========================================================================== */