JSFiddle - React, Tailwind, and code Playground

HTML

<img src="http://192.154.143.220/~capeannapparel/images/Foregroundv2.png" class="ri" />

CSS

html {
    height: 100%;
}

body
{
font-family: sans-serif;
font-size: 100%;
color: #ddd;
background-color: #333;
background-image:url('http://192.154.143.220/~capeannapparel/images/Background.jpg');
background-repeat:no-repeat;
background-position:center; 
background-size: cover;
max-width:100%;
max-height:100%;
width:auto; 
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://192.154.143.220/~capeannapparel/images/Background.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://192.154.143.220/~capeannapparel/images/Background.jpg', sizingMethod='scale')";
}



a { color: #fff; }

img.ri
{
	position: absolute;
	max-width: 100%;
	top: 0%;
	left: 0%;

}

img.ri:empty
{
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

@media screen and (orientation: portrait) {
  img.ri {
      max-width: 100%;
  }
}

@media screen and (orientation: landscape) {
  img.ri {
      max-height: 100%;
  }
}