video::-internal-media-controls-download-button {
    display: none;
}

video::-webkit-media-controls-enclosure {
    overflow: hidden;
}

video::-webkit-media-controls-panel {
    width: calc(100% + 30px);
}

.media-device-frame {
    position: relative;
    padding-bottom: 70%;
    height: 0;
}

.media-device-frame .frame-content {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.media-device-tv-wrapper {
    max-width: 60%;
    margin: auto;
}

.media-device-ipad-wrapper {
    max-width: 482px;
    margin: auto 0 20px;
}

.media-device-iphone-wrapper {
    max-width: 463px;
    margin: auto 0 20px;
}

.media-device-mac-wrapper {
    max-width: 480px;
    margin: auto 0 20px;
}

.media-device-tv {
    background: url('../img/flat-tv-frame.png') center/contain no-repeat;
    padding: 1% 1.4% 14.2% 1.3%;
}

.media-device-ipad {
    background: url('../img/ipad-frame-co.png') center/contain no-repeat;
    padding: 6.6% 16.2% 13% 16.4%;
}

.media-device-iphone {
    background: url('../img/mobile-frame-twitter.png') center/contain no-repeat;
    padding: 14.7% 15.4% 15.3% 14.5%;
}

.media-device-mac {
    background: url('../img/mac-frame.png') center/contain no-repeat;
    padding: 9.2% 16.2% 18.3% 16.1%;
}

#vid_ring,
#vid_arrow {
    transition: all .5s ease-in-out;
}

.widget-video-btn:hover #vid_ring {
    transform: rotate(180deg);
    fill: #c10068;
}

.widget-video-btn:hover #vid_arrow {
    fill: #c10068;
}

.widget-video-btn img {
    filter: grayscale(0%);
    transition: all .5s ease-in-out;
}

.widget-video-btn:hover img {
    filter: grayscale(100%);
}