JSFiddle - React, Tailwind, and code Playground

HTML

<style>


#slider { width:100%; overflow:hidden; height:372px; background-image:url(http://www.deadmau5.com/wp-content/themes/deadmau5/images/slider-bg.png); margin-bottom:25px; }
#slider-container { height:352px; width:950px; margin:auto; padding-top:10px; position:relative; }
#slider-inner { width:10000px; height:352px; position:absolute; top:10px; left:-970px; }
.slide { width:938px; height:340px; border:6px solid #000; float:left; margin-right:20px; position:relative; }

#slider-arrow-left { display:block; width:115px; height:124px; background-image:url(http://www.deadmau5.com/wp-content/themes/deadmau5/images/large-arrow-left.png); position:absolute; left:-53px; top:120px; z-index:999; } #slider-arrow-left:hover { background-position:0 -124px; }
#slider-arrow-right { display:block; width:115px; height:124px; background-image:url(http://www.deadmau5.com/wp-content/themes/deadmau5/images/large-arrow-right.png); position:absolute; right:-53px; top:120px; z-index:999; } #slider-arrow-right:hover { background-position:0 -124px; }
#slider-fade-left { display:block; height:372px; width:300px; background-image:url(http://www.deadmau5.com/wp-content/themes/deadmau5/images/slider-fade-left.png); position:absolute; left:-320px; top:0px; z-index:2; }
#slider-fade-left:hover { opacity:0.92; }
#slider-fade-right { display:block; height:372px; width:300px; background-image:url(http://www.deadmau5.com/wp-content/themes/deadmau5/images/slider-fade-right.png); position:absolute; right:-320px; top:0px; z-index:2; }
#slider-fade-right:hover { opacity:0.92; }
#slider-black-left { height:372px; width:1000px; position:absolute; top:0px; left:-1300px; background-color:#0c100f; }
#slider-black-right { height:372px; width:1000px; position:absolute; top:0px; right:-1300px; background-color:#0c100f; }


</style>                           
                                    
            <div id="slider">
                <div id="slider-container">
                    <div...