Imagem HTML com título

<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<style>


#box {
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:800px;
height:450px;
border:5px solid olive;
display: flex;
justify-content: center;
padding:3px;
}


.soft {
position:absolute;
font-size:80px;
font-family:arial black;
color:red;
cursor:pointer;
text-shadow:3px 3px 2px white;
}


</style>
</head>
<body>


<img id='image' style='width:100%;height:100%;' src='https://pix10.agoda.net/hotelImages/108419/-1/62ef31d50a32b1082fd81c42d3aa442f.jpg?s=1024x768' />


<script>


box=document.createElement('div');
document.body.appendChild(box);
soft=document.createElement('span');
soft.innerHTML="<span onclick='choose()'>RELAX</span>";
box.appendChild(image);
box.appendChild(soft);
box.id='box';
soft.className='soft';


function choose(){
x = prompt('View page source\nOptions\nA - Same window\nB - Different window');
if(x=='A'){window.open('https://pastebin.com/w3xP7VtJ','_self');}
if(x=='B'){window.open('https://pastebin.com/w3xP7VtJ','_blank');}
}


</script>
</body>
</html>