
.jwplayer.jw-skin-jw-showcase {

    &.jw-state-idle,
    &.jw-state-paused {

        .jw-display-icon-container {
            display: table;

            border: 4px solid $white;
            border-radius: 50%;
            background: transparent;
            font-size: 1.2em;
        }

        .jw-display-icon-container > .jw-icon {
            padding-left: 4px;

            color: $primary-color;
            font-size: 1.7em;
        }
    }

    .jw-progress {
        background-color: $primary-color;
    }

    .jw-button-color {
        color: $white;

        &:hover {
            color: $primary-color;
        }
    }
}

//
// mediaQueries
// --------------------------------

@include mobile-only () {

    .jwplayer.jw-skin-jw-showcase {
        .jw-display-icon-container > .jw-icon {
            font-size: 1.3em;
        }
    }
}


.jwplayer.jw-skin-jw-showcase {

    &.jw-state-idle,
    &.jw-state-paused {

        .jw-display-icon-container {
            display: table;

            border: 4px solid $white;
            border-radius: 50%;
            background: transparent;
            font-size: 1.2em;
        }

        .jw-display-icon-container > .jw-icon {
            padding-left: 4px;

            color: $primary-color;
            font-size: 1.7em;
        }
    }

    &.jw-state-buffering .jw-display-icon-container {
        background: none;

        .jw-button-color:hover {
            color: $white;
        }
    }

    .jw-progress {
        background-color: $primary-color;
    }

    .jw-button-color {
        color: $white;

        &:hover {
            color: $primary-color;
        }
    }
}

//
// mediaQueries
// --------------------------------

@include mobile-only () {

    .jwplayer.jw-skin-jw-showcase {
        .jw-display-icon-container > .jw-icon {
            font-size: 1.3em;
        }
    }
}

Remove buffer background and hover color
Remove buffer background and hover color
