@import "../animations.css";

.titlepfp:hover {
    animation-name: ScalyAnim;
    animation-duration: 1s;
    animation-timing-function: ease-out;
}

.games {
    display: flex;
    flex-wrap: warp;
    gap: 1%;
}

.game {
    display: flex;
    flex-wrap: wrap;
    flex: 1 1;
    justify-content:start;

    padding: 5px;
    padding-bottom: 15px;
    gap: 1%;

    border: 2px solid #ccc;
    border-color: lightcoral;
}

.game_item {
    padding-left: 10px;
    padding-right: 10px;
    align-items: center;
    width: 30%;

    background-color: lightyellow;

    text-align: center;
    justify-content: center;
    
    border: 1px solid #ccc;
    border-width: 0.01vw; 
    border-color: darkslateblue;
}

.game_item > a > img {
    border-width: 6px;
    border: 2px solid black;
}

.game_item:hover {
    transform: scale(1.1, 1.1);
    border: 1px dashed black;
}