I'm trying to make a fake and funny buying website, where I'm selling the worse games ever, but, when the person clicks on the game it's supposed to open a tab with the game "description" but it doesn't opens, it flashes on the top of the screen and don't stay.

code:

```js
function OpenGame(jogo) {
 if (jogo == "Rambo"){
  document.getElementById("game-info").innerHTML = "<h1>RAMBO</h1>";
  document.getElementById("game-info").className += "info";
  document.getElementById("content").className += "info";
  document.getElementById("game-info").focus();
 }
}
```

```css
.prod {
 width: 80%;
 height: 80%;
 border: 2px solid black;
 transition: 0.5s ease;
 position: relative;
}
.prod:hover {
 box-shadow: 0px 0px 25px #696969;
 transition: 0.5s ease;
 filter: grayscale(1);
}
.img {
 position: absolute;
 width: 100%;
 height: 100%;
}
.tabelinha {
 width: 100%; 
 height: 100%;
}
td {
 width: 20%;
}
.trzinhu {
 height: 500px;
}
html {
 background-image: url("../BG/BG_Str.png");
}
.content {
 z-index: 100;
}
.content:info {
 z-index: -1;
 filter: blur(10px);
}
.game {
 position: absolute;
 width: 90%;
 height: 100%;
 z-index: -1;
 background-color: white;
 box-shadow: 0px 0px 25px #696969;
 transition: 0.5s ease;
 opacity: 0; 
}
.game:info {
 opacity: 1;
 z-index: 100;
}
```

```html
<script src="http://www.w3schools.com/lib/w3data.js"></script>
<html>
<head>
<meta charset="UTF-8">
<title> Compras ®</title>

<script src="Utils/w3data.js"></script>
<link rel="stylesheet" href="Styles/Menu.css" type="text/css">
<link rel="stylesheet" href="Styles/Compras.css" type="text/css">
<script src="Utils/CookieManager.js"></script>

</head>
<body>

<center><div class="game" id="game-info"></div></center>
<div class="content" id="content">

<div w3-include-html="Utils/Menu.html"></div>

<br>

<div class="carrinho">
<a class="carrinho_nome">Itens no carrinho: </a>
<a class="itens" id="itens">0</a>
</div>

<br><br>
<table class="tabelinha">
<tr class="trzinhu">
<td>
<div class="prod">
<a onclick="OpenGame('Rambo')" href=""><img class="img" src="Jogos/Rambo_The_Videogame.jpg"></a>
</div>
</td><td>
<div class="prod">
<a onclick="OpenGame('NMS')" href=""><img class="img" src="Jogos/No_Mans_Sky.jpg"></a>
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/Envolve.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/Bo_3.jpg">
</div>
</td></tr><tr class="trzinhu"><td>
<div class="prod">
<img class="img" src="Jogos/Nox.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/Cod_IW.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/BF_H.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/Cod_G.jpg">
</div>
</td></tr><tr class="trzinhu"><td>
<div class="prod">
<img class="img" src="Jogos/Just_Dance.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/cod_AW.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/The_Order.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/mine.jpg">
</div>
</td></tr><tr class="trzinhu"><td>
<div class="prod">
<img class="img" src="Jogos/Dia_Z.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/h1z1.jpg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/Farm.jpeg">
</div>
</td><td>
<div class="prod">
<img class="img" src="Jogos/ets2.jpeg">
</div>
</td></tr>
</table>
<script>
w3IncludeHTML();
</script>

</div>

</body>
</html>
```