<!--HTML-->

<div class="htmldemo"> 

<center><div class="sacth">

<div class="sacttitle">коллекционеры на месте?</div>

<div class="saccita">я в вас верю!</div> <br>

<div style="width: 480px; text-align: justify; font: 11px arial; text-transform: none; line-height: 11px; overflow: auto;">
<p>Я не удержался и решил сделать в параллель с летним паком карточек ещё и праздничный. Собрать его на мой вкус не очень сложно, в конце концов и времени совсем чуть. Собственно собирать будем прямо в этой теме, как вы поняли все пункты связаны с праздничным разделом. Если будут вопросы - смело пишите!
</p>
</div>
</div>

<!--HTML-->
<style type="text/css">
/* Блок с карточками */
.SteamCards {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 32px;
}

/* Контейнер карточки */
.card3d {
  transform: scale(1);
  perspective: 500px;
}

/* Контейнер карточки при наведении */
.card3d:hover {
  z-index: 10;
  transform: scale(1.2);
}

/* Картинки карточек */
.card3d img {
    width: 100px;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0 0 0 / .12);
}

/* Картинки карточек при наведении */
.card3d:hover img {
    box-shadow: 0 16px 32px rgba(0 0 0 / .38);
}

/* Плавность анимации */
.card3d,
.card3d img {
  transition: all 250ms ease-out;
}
</style>

<!-- 3D-эффект для карточек © Nelson Rodrigues -->
<script type="text/javascript" src="https://forumstatic.ru/files/001b/e1/18/78510.js"></script>