[html]

<div class="lsmain">
<!------------------------------------------------------------ ИМЯ ФАМИЛИЯ ПО-РУССКИ ---------------------------------------------->
<div class="lsname">САМАНТА ВАШИНГТОН</div>

<!------------------------------------------------------------ ФАКУЛЬТЕТ (КУРС/ГОД ВЫПУСКА) И РОД ЗАНЯТИЙ (ЧЛЕНСТВО ГДЕ-ЛИБО) ---------------------------------------------->
<div class="lsdescript">птица-гром (6) — член группы поддержки, член сестринства «грейлокские сирены»</div>

<!------------------------------------------------------------ ССЫЛКА НА ИЗОБРАЖЕНИЕ ВНЕШКИ ---------------------------------------------->
<div class="lsphoto"><img src="https://upforme.ru/uploads/001b/fb/44/2/485657.gif"></div>

<!------------------------------------------------------------ БЕЙДЖИ / ЗВАНИЯ ---------------------------------------------->
<div class="lsbadge"><img src="https://forumstatic.ru/files/001b/fb/44/39306.png" title="born in the usa">
<img src="https://forumstatic.ru/files/001b/f4/7c/86634.png" title="ilvermorny gang">

</div>

<div class="tab">
  <input checked id="tab-btn-1" name="tab-btn" type="radio" value="">
  <label for="tab-btn-1">КУПОНЫ</label>
  <input id="tab-btn-2" name="tab-btn" type="radio" value="">
  <label for="tab-btn-2">ПЛАШКИ</label>
  <input id="tab-btn-3" name="tab-btn" type="radio" value="">
  <label for="tab-btn-3">ИКОНКИ</label>
  <input id="tab-btn-4" name="tab-btn" type="radio" value="">
  <label for="tab-btn-4">ФОНЫ</label>

<!------------------------------ ЗДЕСЬ КУПОНЫ / !!! К НЕАКТИВНЫМ КУПОНАМ ВНУТРЬ КОГДА ПОСЛЕ ССЫЛКИ ВСТАВИТЬ style="filter: grayscale(1)" ------------------->
<div class="tab-content" id="content-1">

<!-------- ИММУНИТЕТ ОТ УДАЛЕНИЯ -------------------->
<img src="https://upforme.ru/uploads/001b/fb/44/2/319833.png" style="filter: grayscale(1)">

<!-------- УДВОЕНИЕ -------------------->
<img src="https://upforme.ru/uploads/001b/fb/44/2/446017.png" style="filter: grayscale(1)">

<!-------- ТВИНК -------------------->
<img src="https://upforme.ru/uploads/001b/fb/44/2/952902.png" style="filter: grayscale(1)">

<!-------- НАБОР ГРАФИКИ -------------------->
<img src="https://upforme.ru/uploads/001b/fb/44/2/748568.png" style="filter: grayscale(1)">

<!-------- НАБОР В ПРОФИЛЬ -------------------->
<img src="https://upforme.ru/uploads/001b/fb/44/2/335418.png" style="filter: grayscale(1)">

<!-------- НАБОР В ПРОФИЛЬ НА ЗАКАЗ -------------------->
<img src="https://upforme.ru/uploads/001b/fb/44/2/620079.png" style="filter: grayscale(1)">

</div>

<!------------------------------------------------------------ ЗДЕСЬ ПЛАШКИ ---------------------------------------------->
<div class="tab-content" id="content-2">
<img src="https://forumstatic.ru/files/001b/fb/44/81342.png"> <!--- БАЗОВАЯ ПЛАШКА --->

  </div>

<!------------------------------------------------------------ ЗДЕСЬ ИКОНКИ ---------------------------------------------->
  <div class="tab-content" id="content-3">
    <img src="..."> <!--- БАЗОВАЯ ИКОНКА --->
  </div>

<!------------------------------------------------------------ ЗДЕСЬ ФОНЫ ---------------------------------------------->
  <div class="tab-content" id="content-4">
    <img src="https://forumstatic.ru/files/001b/fb/44/34714.png"> <!--- БАЗОВЫЙ ФОН --->
  </div>
</div>

</div>

<style>

/* НАСТРОЙКИ ВКЛАДОК ЧЕРЕЗ ИНПУТЫ */
.tab {
width: 600px;
height: 160px;
position: relative;
top: 180px;
}

.tab>input[type="radio"] {display: none;}

/* отобразить контент, связанный с выбранной радиокнопкой (input type="radio") */
  #tab-btn-1:checked~#content-1,
  #tab-btn-2:checked~#content-2,
  #tab-btn-3:checked~#content-3,
  #tab-btn-4:checked~#content-4 {display: block; height: 160px; padding: 0 40px 0 40px; overflow-y: auto;}

  #tab-btn-1:checked~#content-1 img,
  #tab-btn-2:checked~#content-2 img,
  #tab-btn-3:checked~#content-3 img,
  #tab-btn-4:checked~#content-4 img {display: inline-flex; flex-wrap: wrap; padding: 5px;}

.tab>label {
width: 100px;
height: 20px;
border-radius: 10px;
margin-right: 8px;
display: inline-flex;
vertical-align: middle;
user-select: none;
background-color: #868370;
padding: 2px 8px;
font-size: 14px;
line-height: 1.5;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
cursor: pointer;
position: relative;
top: -5px;
left: 45px;
color: #DADAD3;
text-align: center;
align-items: center;
justify-content: center;
align-content: center;
flex-wrap: wrap;
}

.tab>label:not(:first-of-type) {border-left: none;}

.tab>input[type="radio"]:checked+label {
background-color: #5b5940;
}

.tab>label img {margin-top: 8px;}

/* скрываем все .tab-content */
.tab-content {display: none;}

.lsmain {width: 600px; margin: 0 auto; background: url("https://forumstatic.ru/files/001b/fb/44/86126.png") no-repeat top center; height: 415px; position: relative}
.lsname {position: absolute; font-family: Acworth; font-size: 32px; top: 60px; left: 90px; padding: 0 20px 0 0; text-transform: uppercase; color: #48462D;}
.lsdescript {position: absolute; font-family: Bartina; font-size: 14px; top: 100px; left: 30px; padding: 0 20px 0 0; text-transform: uppercase; color: #48462D;}
.lsphoto {position: absolute; left: 30px; top: 40px;}
.lsphoto img {object-fit: cover; width: 50px; height: 50px; border-radius: 10px;}
.lsbadge {position: absolute; top: 130px; left: 30px; display: flex; width: 540px; flex-wrap: wrap;}
.lsbadge img {padding-right: 5px; object-fit: cover; width: 20px; height: 20px;}

</style>

[/html]