body
{
	background-image:url('img/background.png');
	background-size:100%;
	background-repeat:no-repeat;
	background-color:#1d5273;
	font-family: 'Open Sans', sans-serif;
}

a
{
	color:white;
	text-decoration:none;
}

a:hover
{
	color: #ccc;
}

a:visited 
{
	color: white;
}

div.logoDiv
{
	width:100%;
}

div.welcome
{
	color:white;
	text-align:center;
	font-size:1.25rem;
	width:45%;
	display:block;
	margin:auto;
}



div.gamegrid
{
	color:white;
	text-align:center;

	width:45%;
	display:block;
	margin:auto;
}

.grid 
{
	color:white;
	font-size:1.25rem;
	width:65%;
	display: grid;
	margin:auto;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}

.game-card {
	background-color: rgba(0, 0, 0, 0.5);
	padding: 10px;
	border-radius: 8px;
	text-align: center;
}

.game-card img {
  width: 100%;
  height: auto;
  border-radius: 6px;
}

.game-card h3 
{
  font-size: 1.5rem;
  margin: 10px 0 5px;
}

div.footer
{
	display:block;
	margin:auto;
	text-align:center;
	color:white;
	
	margin-top:1.5rem;
}

@media (max-width: 900px) {
  .grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 500px) {
  .grid {
    grid-template-columns: 1fr;
  }
}