лотерея

[html]

.lottery-event {
background: url(https://forumstatic.ru/files/001c/9d/fb/55370.png) no-repeat center / cover, rgb(var(--block-bg-main));
width: 100%;
height: 692px;
display: flex;
flex-direction: column;
gap: 23px;
box-sizing: border-box;
}

.lottery-event * {
box-sizing: border-box;
}

.lottery-event::before {
content: '';
width: 142px;
height: 80px;
position: absolute;
top: 0px;
left: 50%;
z-index: 5;
transform: translatex(-50%);
background: url(https://forumstatic.ru/files/001c/9d/fb/30909.png);
}

.lottery-header {
width: 100%;
height: auto;
background-color: rgb(var(--block-bg-main));
border-radius: 10px;
border: var(--border-thin);
position: relative;
padding: 31px 20px;
color: rgb(var(--text-color));
display: block;
}
.lottery-header > div > span:first-of-type {
text-transform: lowercase;
text-align: center;
display: block;
color: rgba(150, 62, 53, 1);
box-shadow: none !important;
font: var(--fw600) 15px var(--font-cat-title);
padding: 1px 0px 5px !important;
transition: color var(--anim-hover) !important;
}

.lottery-header > div {
background-color: rgb(var(--block-bg-inner));
font-size: 10px;
color: rgb(var(--text-color));
position: relative;
border-radius: 10px;
border: var(--border-thin);
padding: 10px 18px 10px 20px;
}

.lottery-header .lottery-cont {
margin-top: 22px;
padding: 25px 18px 10px 20px;
}

.lottery-cont::before {
content: attr(data-title);
width: fit-content;
top: -14px;
left: 50%;
translate: -50%;
background-color: rgb(var(--block-bg-main));
color: rgba(150, 62, 53, 1);
position: absolute;
font-family: Moisette;
font-weight: 700;
font-size: 11px;
border-radius: 87px;
border: var(--border-thin);
padding: 7px 16px 4px;
z-index: 4;
}

.lottery-cont > div {
display: flex;
flex-wrap: wrap;
gap: 22px 12px;
height: 357px;
overflow: auto;
justify-content: flex-start;
padding-right: 3px;
}

.lottery-cont .pump {
width: 98px;
height: 98px;
background-color: rgb(var(--block-bg-inner));
color: rgb(var(--text-color));
position: relative;
border-radius: 10px;
border: var(--border-thin);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.lottery-cont .ticket_1 {
background-image: url(https://forumstatic.ru/files/001c/9d/fb/13286.png);
background-position: center;
background-repeat: no-repeat;
}

.lottery-cont .ticket_0 {
background-image: url(https://forumstatic.ru/files/001c/9d/fb/19641.png);
background-position: 13px -5px;
background-repeat: no-repeat;
}

.lottery-cont .pump span {
position: absolute;
bottom: 6px
}

</style>

<div class='lottery-header'>
<div>
<span> рождественская лотерея </span>
<div>
пока у нас активно идёт борьба за то, какая же партия победит в зимнем постовом референдуме, мы предлагаем вам получить награды за ваши посты; условия абсолютно просты: вы пишите пост → приносите нам ссылку на него → выбираете номер лота → получаете награду (будьте осторожны: в ячейке может оказаться суперприз)<br><br>
сюжетные квесты, личные эпизоды, альтернатива — вы можете приносить пост из любой категории и открывать заветную подарочную коробку.
каждую неделю лотерея будет обновляться и продлиться с 24.12.2025 по 14.01.2025 включительно. успейте открыть свои подарочки.

</div></div>

<div class='lottery-cont' data-title='лоты'><div>

<div class='pump ticket_1'>
<span> 1 </span>
</div>