JSFiddle - React, Tailwind, and code Playground
by joshmoto
HTML
<div class="slidewrap slick-slide slick-current slick-active" data-slick-index="1" aria-hidden="false" tabindex="0" style="width: 486px; position: relative; left: -486px; top: 0px; z-index: 999; opacity: 1;">
<div class="slide">
<div class="leftcol">
<div style="width: 640px;" class="wp-video"><span class="mejs-offscreen">Video Player</span>
<div id="mep_1" class="mejs-container wp-video-shortcode mejs-video" tabindex="0" role="application" aria-label="Video Player" style="width: 615.297px; height: 346.105px; min-width: 169px;">
<div class="mejs-inner">
<div class="mejs-mediaelement">
<mediaelementwrapper id="video-220-2"><video class="wp-video-shortcode" id="video-220-2_html5" width="640" height="360" poster="https://cro.matmartin.co.uk/wp-content/uploads/2020/02/ChloeRosser_Breath2.png" preload="metadata" src="https://cro.matmartin.co.uk/wp-content/uploads/2020/02/Breath-2.mp4?_=2" style="width: 615.297px; height: 346.105px;">
<source type="video/mp4" src="https://cro.matmartin.co.uk/wp-content/uploads/2020/02/Breath-2.mp4?_=2"><a href="https://cro.matmartin.co.uk/wp-content/uploads/2020/02/Breath-2.mp4" tabindex="0">https://cro.matmartin.co.uk/wp-content/uploads/2020/02/Breath-2.mp4</a></video></mediaelementwrapper>
</div>
<div class="mejs-layers">
<div class="mejs-poster mejs-layer" style="background-image: url("https://cro.matmartin.co.uk/wp-content/uploads/2020/02/ChloeRosser_Breath2.png"); width: 100%; height: 100%; display: none;"><img class="mejs-poster-img" width="0" height="0" src="https://cro.matmartin.co.uk/wp-content/uploads/2020/02/ChloeRosser_Breath2.png"></div>
<div class="mejs-overlay mejs-layer" style="width: 100%; height: 100%; display: none;">
<div class="mejs-overlay-loading"><span class="mejs-overlay-loading-bg-img"></span></div>
</div>
<div class="mejs-overlay...