Код:

НЕ ЗАБУДЬТЕ УБРАТЬ ЗВЕЗДОЧКИ ИЗ КОДА
[**hideprofile][**html]
<style>
@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,300..800;1,300..800&display=swap');
@font-face { font-family: "fine"; src: url("https://forumstatic.ru/files/001b/73/d1/67460.otf"); }

html, body {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

#ab {
  --card: #ececea;
  --ink: #3a3a3a;
  --acc: #75424a;
  --line: rgba(58,58,58,.28);
  --acc-line: rgba(117,66,74,.45);
  --serif: "fine", "Playfair Display", serif;
  --sans: "Mulish", "Manrope", Arial, sans-serif;
}

#ab[data-theme="dark"] {
  --card: #cfcfcc;
  --ink: #333d33;
  --acc: #415549;
  --line: rgba(51,61,51,.32);
  --acc-line: rgba(65,85,73,.5);
}

#ab, #ab * { box-sizing: border-box; }

#ab {
  width: 860px;               /* ширина всей формы */
  max-width: 100%;
  margin: 0 auto;
  padding: 6px 0;
  font-family: var(--sans);
  color: var(--ink);
}

/* КАРТИНКА */
#ab .ab-img { position: relative; z-index: 1; text-align: center; line-height: 0; }
#ab .ab-img img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  border: 1px solid var(--acc-line);
}

/* ОСНОВНОЙ БЛОК */
#ab .ab-block {
  position: relative;
  z-index: 2;
  margin: -20px 28px 18px;
  padding: 22px 32px 26px;
  background: var(--card);
  border: 1px solid var(--acc-line);
  border-radius: 10px;
  box-shadow: 0 8px 22px rgba(0,0,0,.18);
}

/* НАЗВАНИЕ */
#ab .ab-title {
  margin: 0 0 10px !important;
  padding: 0 !important;
  text-align: center;
  font-family: var(--serif);
  font-style: normal;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: .5px;
  line-height: 1.3;
  text-transform: lowercase;
  color: var(--acc);
}

/* ДАТА */
#ab .ab-date { margin: 0 0 6px; text-align: center; font-size: 11px; line-height: 1.5; letter-spacing: 1px; color: var(--ink); }

/* УЧАСТНИКИ */
#ab .ab-people { margin: 0 0 14px; text-align: center; font-size: 12px; line-height: 1.5; color: var(--acc); }

/* РАЗДЕЛИТЕЛЬ */
#ab .ab-hr { border: 0; border-top: 1px solid var(--line); margin: 0 0 14px; }

/* ОПИСАНИЕ */
#ab .ab-text { width: 100%; font-size: 12px; line-height: 1.65; text-align: left; color: var(--ink); }

@media (max-width: 560px) { #ab .ab-block { margin-left: 12px; margin-right: 12px; padding: 18px 16px 20px; } }
</style>
<script>
try { document.documentElement.style.colorScheme = window.parent.document.documentElement.getAttribute("data-forum-theme") === "dark" ? "dark" : "light"; } catch (e) {}
</script>

<div id="ab" data-theme="light">

  <div class="ab-img">
    <img src="ССЫЛКА НА КАРТИНКУ" alt="картинка">
  </div>

  <div class="ab-block">

    <h3 class="ab-title">НАЗВАНИЕ ЭПИЗОДА</h3>

    <div class="ab-date">ДАТА</div>

    <div class="ab-people">УЧАСТНИК &bull; УЧАСТНИК</div>

    <hr class="ab-hr">

    <div class="ab-text">
ОПИСАНИЕ ЭПИЗОДА. для редактуры используйте html-коды, для переноса на новую строчку - <br>
    </div>

  </div>

<script>
(function () {
  var box = document.getElementById("ab");
  if (!box) return;
  function set(t) {
    var th = t === "dark" ? "dark" : "light";
    box.setAttribute("data-theme", th);
    document.documentElement.style.colorScheme = th;
  }
  try {
    var root = window.parent.document.documentElement;
    set(root.getAttribute("data-forum-theme") || "light");
    new MutationObserver(function () { set(root.getAttribute("data-forum-theme") || "light"); })
      .observe(root, { attributes: true, attributeFilter: ["data-forum-theme"] });
  } catch (e) {}
  window.addEventListener("message", function (e) {
    if (e.data && e.data.forumTheme) set(e.data.forumTheme);
  });
  try { window.parent.postMessage({ lstReady: 1 }, "*"); } catch (e) {}
})();
</script>

</div>
[/html]

Код:

[align=center][img]ССЫЛКА НА КАРТИНКУ[/img][/align]

[table width=600]
[tr][td width=15%][/td]
[td width=70%]
[align=center]
[size=18][color=#75424a][b]название эпизода[/b][/color][/size]
[i][/i]
[size=11]дата эпизода[/size]
[i][/i]
[size=12][color=#75424a]участник • участник[/color][/size]
[/align]

[hr]

описание эпизода, обстоятельства встречи и всё, что необходимо знать перед началом игры.
[/td][td width=15%][/td]
[/tr][/table]


[hideprofile]