JSFiddle - React, Tailwind, and code Playground

HTML

<div align="center">
	<?if($IMG_URL1$)?>
		<div id="boxR">
			<div id="click">
			</div>
			<a href="$IMG_URL1$" target="_blank"><img border="0" width="98%" src="http://www.mountain.ru/userdownload/news/PAN2numb1200.jpg" /></a> 
		</div>
	<?else?>
		<!--<div id="boxR1">К сожалению решения нет, но вы можете предложить своё за бонусы от сайта.</div>-->
	<?endif?> 

</div>

CSS

#resh {
 width: 150px;
 height: 15px; 
 margin-left: 5px;
 padding: 5px;
 text-align: center;
 background-color:rgb(236,201,43);
 border-top-left-radius: 4px;
 border-top-right-radius: 4px;
}

#boxR {
 text-align: center; 
 border: 4px outset;
 border-color: #ecc92b;
 box-shadow:
 1px 0px rgb(220,195,35), 1px 1px rgb(192,167,7),
 2px 1px rgb(219,194,34), 2px 2px rgb(191,166,6),
 3px 2px rgb(218,193,33), 3px 3px rgb(190,165,5),
 4px 3px rgb(217,192,32), 4px 4px rgb(189,164,4),
 5px 4px rgb(216,191,31), 5px 5px rgb(188,163,3),
 6px 5px rgb(215,190,30), 6px 6px rgb(187,162,2),
 7px 6px rgb(214,189,29), 7px 7px rgb(186,161,1),
 8px 7px rgb(213,188,28), 8px 8px rgb(185,160,0);
 border-top-left-radius: 4px;
 border-top-right-radius: 4px;
 border-bottom-right-radius: 4px;
 border-bottom-left-radius: 4px;
 overflow:hidden;
 position: relative;
}

#click {
	opacity:0.2;
	filter:alpha(opacity=50);
	opacity:0.5;
	background-color: #000;
	max-width: 100%;
	max-height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 10;
    background: gold;
}