JSFiddle - React, Tailwind, and code Playground

by Zer00ne Null

HTML

<div class="Banner-Container">
    <div class="dock-Wrapper">
        <div class="dock-IMG1"></div>
        <div class="dock-IMG2"></div>
    </div>
</div>

CSS

body {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
}
.Banner-Container {
    width:100%;
    height:606px;
    background-image:url(images/mainBannerBG.jpg);
    background-color:black;
    z-index:-5;
    overflow:hidden;
    margin: auto 0;
    display: table;
}
.dock-Wrapper {
    height:auto;
    width:1917px;
    background:#777;
    bottom:0;
    overflow:hidden;
    position:relative;
    display: table-row;
}
.dock-IMG1 {
    width:957px;
    height:119px;
    background-image:url(images/dock.png);
    display:table-cell;
    background-color:blue;
}
.dock-IMG2 {
    width:957px;
    height:119px;
    background-image:url(images/dock.png);
    background-color:red;
    display:table-cell;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter:"FlipH";
}