website/game.css

44 lines
607 B
CSS

.games {
margin: 0 auto;
display: grid;
gap: 1rem;
grid-template-columns: repeat(1, 1fr);
}
@media (min-width: 600px) {
.games { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px) {
.games { grid-template-columns: repeat(3, 1fr); }
}
.game {
color: white;
position: relative;
}
.game p {
margin: 0;
}
.game img {
width: 100%;
height: 100%;
object-fit: contain;
}
.game-video{
opacity: 0;
transition: 0.5s ease;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.game:hover .game-video {
opacity: 1;
}