JSFiddle - React, Tailwind, and code Playground

HTML

<div id="test">test</div>

<div id="DIVguestBookingWarning">coucou</div>

CSS

div#DIVguestBookingWarning {
	opacity: 0;
	position: absolute;
	top: -19vw;
	left: 28vw;
	max-width: 40vw;
	border-radius: 1vw;
	padding: 1vw;
	background-color: rgba(0, 102, 102, 1);
	color: rgba(255, 255, 255, 1);
  transition: opacity 1s linear, top 0s linear 1s;
}

div#DIVguestBookingWarning.visible {
	opacity: 1;
	top: 19vw;
  transition: opacity 1s linear, top 0s linear 0s;
}

JavaScript

document.getElementById("test").addEventListener("click", function() {
	document.getElementById("DIVguestBookingWarning").classList.toggle("visible");
});