JSFiddle - React, Tailwind, and code Playground

HTML

<div id="cont">
 <div class="outer">
    <div class="inner"><img src="http://safeaccess2.org/patientfocusedcertification/wp-content/uploads/sites/2/2013/10/News-stock-photo.jpg"></div>
 </div>
</div>

CSS

#cont {
    height: 360px;
    margin: 50px auto 0;
    min-width: 1000px;
    overflow: hidden;
    position: absolute;
    width: 100%;
}
.inner img {
    display: block;
    min-width: 1000px;
    width: 100%;
}
.outer {
    bottom: 0;
    overflow: hidden;
    position: absolute;
    transform: rotateZ(15deg) scale(1.1);
    transform-origin: 100% 100% 0;
}
.inner {
    transform: rotateZ(-15deg) scale(1);
    transform-origin: 100% 100% 0;
}