JSFiddle - React, Tailwind, and code Playground

HTML

<div class="slideshow-style-ctnr">
    <div class="slideshow-nav">
        <div class="slide-right">&rarr;</div>
        <div class="slide-left">&larr;</div>
    </div>
    <!-- end slideshow-nav -->
    <div class="slideshow-img-ctnr">
        <img src="images/stock/fd-3" alt="">
    </div>
    <!-- end slideshow-img-ctnr -->
    <div class="slideshow-img-ctnr">
        <img src="images/stock/fd-3" alt="">
    </div>
    <!-- end slideshow-img-ctnr -->
    <div class="slideshow-img-ctnr">
        <img src="images/stock/fd-3" alt="">
    </div>
    <!-- end slideshow-img-ctnr -->
    <div class="slideshow-img-ctnr">
        <img src="images/stock/fd-3" alt="">
    </div>
    <!-- end slideshow-img-ctnr -->
    <div class="slideshow-img-ctnr">
        <img src="images/stock/fd-3" alt="">
    </div>
    <!-- end slideshow-img-ctnr -->
    <div class="slideshow-img-ctnr">
        <img src="images/stock/fd-3" alt="">
    </div>
    <!-- end slideshow-img-ctnr -->
</div>

CSS

.slideshow-img-ctnr {
    backround-color: red;
    width: 100px;
    height: 100px;
    border: 1px solid orange;
}
.slideshow-img-ctnr:first-of-type {
    border: 1px solid blue;
}