JSFiddle - React, Tailwind, and code Playground

HTML

<body>
       <figure class="main-image">
					<a href="img/cannabislegalmap.png">
						<img src="img/cannabislegalmap.png" width=" 100%" alt="Image of a map of states were recreational cannabis is legal">
					</a>
					<figcaption class="caption-clr">States were recreational cannabis use is legal.</figcaption>
			    </figure>
</body>

CSS

.caption-clr{
  background-color: rgba(0,0,0,.1);
}

body {
  background-color: lightgreen;
}