/* Style for the game list container */

/* Style for each game item */
.game-item {
    position: relative;
}

/* Style for the game name */
/* Hover effect for game name */
.game-item:hover .game-name {
    opacity: 1;
}

/* Style for the game list container */
.game-list {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
}

.game-list .game-item {
    box-shadow:
        rgba(255, 255, 255, 0.07) 0px 1px 2px,
        rgba(255, 255, 255, 0.07) 0px 2px 4px,
        rgba(255, 255, 255, 0.07) 0px 4px 8px,
        rgba(255, 255, 255, 0.07) 0px 8px 16px,
        rgba(255, 255, 255, 0.07) 0px 16px 32px,
        rgba(255, 255, 255, 0.07) 0px 32px 64px;
    border-radius: 20px;
    overflow: hidden;
    width: 150px;
    height: 150px;
}

.game-item img {
    transition: transform 0.3s ease-in-out;
}

.game-item:hover img {
    transform: scale(1.1);
}
.game-item:hover .game-name {
    bottom: 0;
    transform: translateY(0);
}

/* Style for each game item */
.game-item {
    position: relative;
}
.game-item a {
    border-radius: 20px;
    display: block;
    overflow: hidden;
    text-decoration: none;
}
.game-item a:hover,
.game-item a:focus,
.game-item a:focus-visible {
    text-decoration: none !important;
    outline: none !important;
}
/* Style for the game name */
.game-name {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    /*background-color: rgba(0, 0, 0, 0.7);*/
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 40%, rgba(0, 0, 0, 0) 100%);
    color: #fff;
    font-weight: 500;
    padding: 20px 3px;
    text-align: center;
    transition: bottom 0.8s ease;
}
.game_iframe iframe{
    min-height: 600px;
}
.gamelist {
    text-align: center;
    padding: 10px 5px;
    font-size: 18px;
    background-color: #0000ff;
}
.more_gamelist {
    text-align: center;
    padding: 10px 5px;   
}
.gamelist a {
    color: #fff !important;
    border: 2px solid #fff;
    border-radius: 25px;
    padding: 10px 16px;
    font-size: 21px;
    font-weight: 500;
    display: inline-block;
    cursor: pointer;
}
.gamelist a:hover {
    text-decoration: none !important;
    background-color: #000;
}
/* Hover effect for game name */

.get_all_games {
    padding: 30px 10px 10px 10px;
}
.all-games-button {
    background-color: #007bff;
    color: #fff;
    padding: 16px 56px;
    border: none;
    border-radius: 28px;
    font-size: 20px;
    font-weight: 500;
    cursor: pointer;
    display: block;
    z-index: 9;
}

.ast-container a.all-games-button {
    color: #fff;
    width: max-content;
    margin: auto;
}
.ast-container a.all-games-button:hover {
    text-decoration: none;
}
.all-games-button.glowing_btn {
    -webkit-animation: glowing 1500ms infinite;
    -moz-animation: glowing 1500ms infinite;
    -o-animation: glowing 1500ms infinite;
    animation: glowing 1500ms infinite;
}

@media only screen and (max-width: 767px) {
    .game-list {
        gap: 14px;
    }
    .game-list .game-item {
        width: 100px;
        height: 122px;
        box-shadow: unset;
        padding-bottom: 20px;
        position: relative;
    }
    .game-item a {
        border-radius: 0;
    }

    span.game-name {
        position: relative;
        background: #aeff00;
        font-size: 12px;
        color: #fff;
        line-height: 26px;
        height: 26px;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-top: -10px;
        border-radius: 0 0 14px 14px;
        padding: 0 3px;
        background-color: #7c5bff;
    }
    .game_iframe iframe{
        min-height: 400px;
    }
}
@media only screen and (max-width: 379px) {
}
