Magnificent Empire Османская империя, псевдоистория, антураж 1563 y.o. Упрощенный прием

тест лихой запад

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » тест лихой запад » Новый форум » Гостевая


Гостевая

Сообщений 1 страница 14 из 14

1

Полезная инфа (к примеру место действия и время в игре)

Код:
внешность на англ — [url=https://]ссылка на профиль[/url]

Правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания правила придержания

Список внех и срок придержания
внешность на англ — ссылка на профиль
внешность на англ — ссылка на профиль
внешность на англ — ссылка на профиль
внешность на англ — ссылка на профиль

0

2

для плашки с настройкой цвета и текста
Код:
<div style="background: rgb(154 162 153); box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23);  padding: 6px; margin-inline: -10px; border-radius: 10px; position: relative; z-index: 2; ">
<div style="color: #2c3532; font-size: 1.4rem; font-family: 'danceregular'; ">
Значимая инфа
</div>
<div style="color: #2c353278; font-size: 0.5rem; ">
поясняющий текст
</div>
</div>
Код:
<img src="http://forumstatic.ru/files/001b/a7/18/99353.png" title="название плашки">  
Код:
<lz_id><a href="ссылка на анкету">Гарри Потный</a></lz_id> короткий текст о персе

0

3

занятые внешности

текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

Мужские

Женские

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

имя внехи »

внести в список
Код:
[block=subject_info_element1]имя внехи »[/block] [block=subject_info_element2][url=https://disshi5.rusff.me/viewtopic.php?id=5#p10]имя перса[/url][/block]

Отредактировано piar (2024-02-04 21:50:08)

0

4

Добро пожаловать!

какая-то небольшая строка

https://forumupload.ru/uploads/001c/0a/f5/3/209384.gif

Придержаны за гостями

текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

имя внехи - до 01.03 »

имя внехи - бессрочно »

придержать
Код:
[block=subject_info_element1]имя внехи - до какого числа »[/block] [block=subject_info_element2][url=https://disshi5.rusff.me/viewtopic.php?id=5#p10]имя перса[/url][/block]

0

5

Тест

0

6

банковская система

текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

Копим

Тратим

Переводим

000 $ »

за красивые глаза

000 $ »

за красивые глаза

000 $ »

за красивые глаза

000 $ »

текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

000 $ »

за красивые глаза

000 $ »

за красивые глаза

000 $ »

текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

шаблон

0

7

Имя Перса

специализация

текст текст текст текст текст

поселение

текст текст текст текст текст

https://64.media.tumblr.com/b99a67f567199c8777472bc7993789a4/8e8708cf141a1d46-43/s250x400/895bf47543252d6829c747d05dcc2dec8772f477.pnj

навыки

текст текст текст текст текст

слабости и страхи

текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст
текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст
текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст

Отредактировано piar (2024-02-07 18:41:56)

0

8

 

 

 

  London
  London is the capital city of England.

  Paris
  Paris is the capital of France.

  Tokyo
  Tokyo is the capital of Japan.

Отредактировано piar (2024-02-14 18:22:28)

0

9

[html]
<div class="tabs">
  <div class="content">Содержимое 1</div>
  <div>Вкладка 1</div>
</div>
<div class="tabs">
  <div class="content">Содержимое 2</div>
  <div>Вкладка 2</div>
</div>
[/html]

0

10

[html]
<script type="text/javascript">
$(function() {
  var settings = { continuous : true, pageStyles: true, transitions : { content : '', buttons : '' } };
  var pages    = $("#slider #pages li").length;
  var currentPage;
  var reachedLastPage, reachedFirstPage;
 
  if (pages > 0)
  {
    // Generate navigation bullets
    for (var i = 0; i < pages; i++)
      $(".navigation").append('<li><a href="#"><span></span></a></li>');

    // Hide navigation arrows when there is a single page
    if (pages == 1)
    {
      $("#slider #prev").addClass("hidden");
      $("#slider #next").addClass("hidden");
    }

    //
    if(!settings.continuous)
      $("#slider #prev").addClass("hidden");
    // Set page style if needed
    if (settings.pageStyles)
      $("#slider").addClass("page1");

    // Select the first page and element in the navigation
    $("#slider #pages :first-child").addClass("selected");
    $("#slider .navigation :first-child a").addClass("selected");
  }

  // Navigation bullets
  $(".navigation a").click(function(e) {
    e.preventDefault();
    // Remove the selected class from the currently selected indicator
    $(this).parent().parent().find(".selected").removeClass("selected");
    // Make the clicked indicator the selected one
    $(this).addClass("selected");
   
    updateSlideshowForSelectedPage();
  });
 
  // Navigation arrows
  $("#next").click(function(e) {
    goToNext();
  });
 
  $("#prev").click(function(e) {
    goToPrev();
  });

  // Keyboard shortcuts
  $("body").keyup(function(e) {
    if (e.keyCode == 39) // Key right
      goToNext();
    else if (e.keyCode == 37) // Key left
      goToPrev();
  });

  function goToNext() {
    reachedLastPage = $(".navigation .selected").parent().index()+1 >= pages;

    if (reachedLastPage && settings.continuous)
    {
      $(".navigation .selected").removeClass("selected")
      $(".navigation :first-child a").addClass("selected");
    }
    else if (reachedLastPage && !settings.continuous)
      return;
    else
      $(".navigation .selected").removeClass("selected").parent().next().find("a").addClass("selected");
   
    updateSlideshowForSelectedPage();
  }
 
  function goToPrev() {
    reachedFirstPage = $(".navigation .selected").parent().index() <= 0;

    if (reachedFirstPage && settings.continuous)
    {
      $(".navigation .selected").removeClass("selected")
      $(".navigation :last-child a").addClass("selected");
    }
    else if (reachedFirstPage && !settings.continuous)
      return;
    else
      $(".navigation .selected").removeClass("selected").parent().prev().find("a").addClass("selected");

    updateSlideshowForSelectedPage();
  }
 
  function updateSlideshowForSelectedPage() {
    var index = $(".navigation .selected").parent().index(),
        classIndex = parseInt(index+1, 10),
        reachedLastPage = $(".navigation .selected").parent().index()+1 >= pages,
        reachedFirstPage = $(".navigation .selected").parent().index() <= 0;

    if (settings.pageStyles)
      $("#slider").attr("class", "page" + classIndex);

    if(!settings.continuous)
    {
      reachedLastPage ? $("#slider #next").addClass("hidden") : $("#slider #next").removeClass("hidden");
      reachedFirstPage ? $("#slider #prev").addClass("hidden") : $("#slider #prev").removeClass("hidden");
    }
   
    $("#pages .selected").removeClass("selected");
    $("#pages li:nth-child(" + classIndex + ")").addClass("selected");
  }
});

</script>
<div id="slider">
<ul class="navigation"> $(".navigation").append('<li><a href="#"><span></span></a></li>'); $(".navigation").append('<li><a href="#"><span></span></a></li>');</ul>
  <ul id="pages">   
    <li>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
  </li>
  <li>
    Proin sed ultricies arcu. Fusce elementum varius odio, in rhoncus risus elementum vel. Phasellus pellentesque, ligula ornare porttitor euismod, metus tellus facilisis lorem, non commodo erat neque non odio. Nam sed condimentum quam, vel rutrum dolor. Fusce sollicitudin posuere pulvinar. Fusce non nisi sit amet urna varius ultricies. Maecenas quis ante ut augue pretium iaculis at vulputate odio. Pellentesque ac magna vel est ornare suscipit. Aliquam congue pulvinar semper. Morbi blandit ipsum at nunc aliquam euismod. Integer vitae turpis magna. Ut aliquet scelerisque faucibus. Morbi non ante id neque pharetra ornare.
  </li>
  <li>
    Praesent interdum consectetur erat nec volutpat. Vivamus vitae mollis sem. Nam non ultricies ante. Curabitur vitae odio et nisi porta aliquet sit amet ut quam. Vestibulum dictum nunc vitae laoreet faucibus. Nulla a lorem eu mi pulvinar elementum eu et tortor. Nunc turpis odio, sodales in adipiscing sed, interdum vitae felis. Cras aliquam enim leo, eu consequat arcu luctus ullamcorper. Nam scelerisque at diam vel laoreet. Pellentesque bibendum mollis magna, ut tempor nunc aliquam non. Nullam tempus bibendum leo eget aliquet. Duis facilisis luctus neque, at ultricies massa consectetur in.
  </li>
    <li>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
  </li>
  <li>
    Proin sed ultricies arcu. Fusce elementum varius odio, in rhoncus risus elementum vel. Phasellus pellentesque, ligula ornare porttitor euismod, metus tellus facilisis lorem, non commodo erat neque non odio. Nam sed condimentum quam, vel rutrum dolor. Fusce sollicitudin posuere pulvinar. Fusce non nisi sit amet urna varius ultricies. Maecenas quis ante ut augue pretium iaculis at vulputate odio. Pellentesque ac magna vel est ornare suscipit. Aliquam congue pulvinar semper. Morbi blandit ipsum at nunc aliquam euismod. Integer vitae turpis magna. Ut aliquet scelerisque faucibus. Morbi non ante id neque pharetra ornare.
  </li>
  <li>
    Praesent interdum consectetur erat nec volutpat. Vivamus vitae mollis sem. Nam non ultricies ante. Curabitur vitae odio et nisi porta aliquet sit amet ut quam. Vestibulum dictum nunc vitae laoreet faucibus. Nulla a lorem eu mi pulvinar elementum eu et tortor. Nunc turpis odio, sodales in adipiscing sed, interdum vitae felis. Cras aliquam enim leo, eu consequat arcu luctus ullamcorper. Nam scelerisque at diam vel laoreet. Pellentesque bibendum mollis magna, ut tempor nunc aliquam non. Nullam tempus bibendum leo eget aliquet. Duis facilisis luctus neque, at ultricies massa consectetur in.
  </li>
</ul>
</div>
[/html]

Отредактировано piar (2024-02-14 20:45:27)

0

11

[html]
<script type="text/javascript">
$(function() {
  var settings = { continuous : true, pageStyles: true, transitions : { content : '', buttons : '' } };
  var pages    = $("#slider #pages li").length;
  var currentPage;
  var reachedLastPage, reachedFirstPage;

  if (pages > 0)
  {   

    // Hide navigation arrows when there is a single page
    if (pages == 1)
    {
      $("#slider #prev").addClass("hidden");
      $("#slider #next").addClass("hidden");
    }

    //
    if(!settings.continuous)
      $("#slider #prev").addClass("hidden");
    // Set page style if needed
    if (settings.pageStyles)
      $("#slider").addClass("page1");

    // Select the first page and element in the navigation
    $("#slider #pages :first-child").addClass("selected");
    $("#slider .navigation :first-child a").addClass("selected");
  }

  // Navigation bullets
  $(".navigation a").click(function(e) {
    e.preventDefault();
    // Remove the selected class from the currently selected indicator
    $(this).parent().parent().find(".selected").removeClass("selected");
    // Make the clicked indicator the selected one
    $(this).addClass("selected");
   
    updateSlideshowForSelectedPage();
  });
 
  // Navigation arrows
  $("#next").click(function(e) {
    goToNext();
  });
 
  $("#prev").click(function(e) {
    goToPrev();
  });

  // Keyboard shortcuts
  $("body").keyup(function(e) {
    if (e.keyCode == 39) // Key right
      goToNext();
    else if (e.keyCode == 37) // Key left
      goToPrev();
  });

  function goToNext() {
    reachedLastPage = $(".navigation .selected").parent().index()+1 >= pages;

    if (reachedLastPage && settings.continuous)
    {
      $(".navigation .selected").removeClass("selected")
      $(".navigation :first-child a").addClass("selected");
    }
    else if (reachedLastPage && !settings.continuous)
      return;
    else
      $(".navigation .selected").removeClass("selected").parent().next().find("a").addClass("selected");
   
    updateSlideshowForSelectedPage();
  }
 
  function goToPrev() {
    reachedFirstPage = $(".navigation .selected").parent().index() <= 0;

    if (reachedFirstPage && settings.continuous)
    {
      $(".navigation .selected").removeClass("selected")
      $(".navigation :last-child a").addClass("selected");
    }
    else if (reachedFirstPage && !settings.continuous)
      return;
    else
      $(".navigation .selected").removeClass("selected").parent().prev().find("a").addClass("selected");

    updateSlideshowForSelectedPage();
  }
 
  function updateSlideshowForSelectedPage() {
    var index = $(".navigation .selected").parent().index(),
        classIndex = parseInt(index+1, 10),
        reachedLastPage = $(".navigation .selected").parent().index()+1 >= pages,
        reachedFirstPage = $(".navigation .selected").parent().index() <= 0;

    if (settings.pageStyles)
      $("#slider").attr("class", "page" + classIndex);

    if(!settings.continuous)
    {
      reachedLastPage ? $("#slider #next").addClass("hidden") : $("#slider #next").removeClass("hidden");
      reachedFirstPage ? $("#slider #prev").addClass("hidden") : $("#slider #prev").removeClass("hidden");
    }
   
    $("#pages .selected").removeClass("selected");
    $("#pages li:nth-child(" + classIndex + ")").addClass("selected");
  }
});

</script>
<div id="slider">
<ul class="navigation">
<li><a href="#"><span>первая</span></a></li>
<li><a href="#"><span>вторая</span></a></li>
<li><a href="#"><span>третья</span></a></li>
<li><a href="#"><span>четвертая</span></a></li>
<li><a href="#"><span>пятая</span></a></li>
<li><a href="#"><span>шестая</span></a></li>
</ul>
  <ul id="pages">   
    <li>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
  </li>
  <li>
    Proin sed ultricies arcu. Fusce elementum varius odio, in rhoncus risus elementum vel. Phasellus pellentesque, ligula ornare porttitor euismod, metus tellus facilisis lorem, non commodo erat neque non odio. Nam sed condimentum quam, vel rutrum dolor. Fusce sollicitudin posuere pulvinar. Fusce non nisi sit amet urna varius ultricies. Maecenas quis ante ut augue pretium iaculis at vulputate odio. Pellentesque ac magna vel est ornare suscipit. Aliquam congue pulvinar semper. Morbi blandit ipsum at nunc aliquam euismod. Integer vitae turpis magna. Ut aliquet scelerisque faucibus. Morbi non ante id neque pharetra ornare.
  </li>
  <li>
    Praesent interdum consectetur erat nec volutpat. Vivamus vitae mollis sem. Nam non ultricies ante. Curabitur vitae odio et nisi porta aliquet sit amet ut quam. Vestibulum dictum nunc vitae laoreet faucibus. Nulla a lorem eu mi pulvinar elementum eu et tortor. Nunc turpis odio, sodales in adipiscing sed, interdum vitae felis. Cras aliquam enim leo, eu consequat arcu luctus ullamcorper. Nam scelerisque at diam vel laoreet. Pellentesque bibendum mollis magna, ut tempor nunc aliquam non. Nullam tempus bibendum leo eget aliquet. Duis facilisis luctus neque, at ultricies massa consectetur in.
  </li>
    <li>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
  </li>
  <li>
    Proin sed ultricies arcu. Fusce elementum varius odio, in rhoncus risus elementum vel. Phasellus pellentesque, ligula ornare porttitor euismod, metus tellus facilisis lorem, non commodo erat neque non odio. Nam sed condimentum quam, vel rutrum dolor. Fusce sollicitudin posuere pulvinar. Fusce non nisi sit amet urna varius ultricies. Maecenas quis ante ut augue pretium iaculis at vulputate odio. Pellentesque ac magna vel est ornare suscipit. Aliquam congue pulvinar semper. Morbi blandit ipsum at nunc aliquam euismod. Integer vitae turpis magna. Ut aliquet scelerisque faucibus. Morbi non ante id neque pharetra ornare.
  </li>
  <li>
    Praesent interdum consectetur erat nec volutpat. Vivamus vitae mollis sem. Nam non ultricies ante. Curabitur vitae odio et nisi porta aliquet sit amet ut quam. Vestibulum dictum nunc vitae laoreet faucibus. Nulla a lorem eu mi pulvinar elementum eu et tortor. Nunc turpis odio, sodales in adipiscing sed, interdum vitae felis. Cras aliquam enim leo, eu consequat arcu luctus ullamcorper. Nam scelerisque at diam vel laoreet. Pellentesque bibendum mollis magna, ut tempor nunc aliquam non. Nullam tempus bibendum leo eget aliquet. Duis facilisis luctus neque, at ultricies massa consectetur in.
  </li>
</ul>
</div>
[/html]

Отредактировано piar (2024-02-14 20:55:42)

+1

12

[html]
<script type="text/javascript" src="https://forumstatic.ru/files/001b/a7/18/19687.js"></script>
<div id="slider">
<ul class="navigation">
<li><a href="#"><span>первая</span></a></li>
<li><a href="#"><span>вторая</span></a></li>
<li><a href="#"><span>третья</span></a></li>
<li><a href="#"><span>четвертая</span></a></li>
<li><a href="#"><span>пятая</span></a></li>
<li><a href="#"><span>шестая</span></a></li>
</ul>
  <ul id="pages">   
    <li>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
  </li>
  <li>
    Proin sed ultricies arcu. Fusce elementum varius odio, in rhoncus risus elementum vel. Phasellus pellentesque, ligula ornare porttitor euismod, metus tellus facilisis lorem, non commodo erat neque non odio. Nam sed condimentum quam, vel rutrum dolor. Fusce sollicitudin posuere pulvinar. Fusce non nisi sit amet urna varius ultricies. Maecenas quis ante ut augue pretium iaculis at vulputate odio. Pellentesque ac magna vel est ornare suscipit. Aliquam congue pulvinar semper. Morbi blandit ipsum at nunc aliquam euismod. Integer vitae turpis magna. Ut aliquet scelerisque faucibus. Morbi non ante id neque pharetra ornare.
  </li>
  <li>
    Praesent interdum consectetur erat nec volutpat. Vivamus vitae mollis sem. Nam non ultricies ante. Curabitur vitae odio et nisi porta aliquet sit amet ut quam. Vestibulum dictum nunc vitae laoreet faucibus. Nulla a lorem eu mi pulvinar elementum eu et tortor. Nunc turpis odio, sodales in adipiscing sed, interdum vitae felis. Cras aliquam enim leo, eu consequat arcu luctus ullamcorper. Nam scelerisque at diam vel laoreet. Pellentesque bibendum mollis magna, ut tempor nunc aliquam non. Nullam tempus bibendum leo eget aliquet. Duis facilisis luctus neque, at ultricies massa consectetur in.
  </li>
    <li>
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet felis lobortis mi iaculis porttitor. Quisque euismod eros et scelerisque ultricies. Pellentesque vestibulum erat in ultricies accumsan. Integer blandit dapibus magna et pellentesque. Nam risus sem, interdum a congue a, adipiscing at nisi. Nulla facilisi. Fusce rhoncus porta est. Vivamus purus felis, tincidunt dictum nunc vel, dignissim ornare orci. Vivamus id rhoncus nisl, nec mollis urna. Cras nisi elit, commodo ornare varius in, ultricies vel lectus. Nulla a consectetur metus. Nam ut ipsum nec neque adipiscing facilisis.
  </li>
  <li>
    Proin sed ultricies arcu. Fusce elementum varius odio, in rhoncus risus elementum vel. Phasellus pellentesque, ligula ornare porttitor euismod, metus tellus facilisis lorem, non commodo erat neque non odio. Nam sed condimentum quam, vel rutrum dolor. Fusce sollicitudin posuere pulvinar. Fusce non nisi sit amet urna varius ultricies. Maecenas quis ante ut augue pretium iaculis at vulputate odio. Pellentesque ac magna vel est ornare suscipit. Aliquam congue pulvinar semper. Morbi blandit ipsum at nunc aliquam euismod. Integer vitae turpis magna. Ut aliquet scelerisque faucibus. Morbi non ante id neque pharetra ornare.
  </li>
  <li>
    Praesent interdum consectetur erat nec volutpat. Vivamus vitae mollis sem. Nam non ultricies ante. Curabitur vitae odio et nisi porta aliquet sit amet ut quam. Vestibulum dictum nunc vitae laoreet faucibus. Nulla a lorem eu mi pulvinar elementum eu et tortor. Nunc turpis odio, sodales in adipiscing sed, interdum vitae felis. Cras aliquam enim leo, eu consequat arcu luctus ullamcorper. Nam scelerisque at diam vel laoreet. Pellentesque bibendum mollis magna, ut tempor nunc aliquam non. Nullam tempus bibendum leo eget aliquet. Duis facilisis luctus neque, at ultricies massa consectetur in.
  </li>
</ul>
</div>
[/html]

для добавления ссылки на страницу вставляем

Код:
<li><a href="#"><span>меняем на название</span></a></li> 

для добавления страницы вставляем 

Код:
<li>  
текст на странице 
</li>

Важно! Название страниц по порядку, так же как и страницы
Если название вставляете первым, то и страница, которую хотите видеть при нажатии на заголовок должна идти первой (если заголовок третьим, то и страницу третьей )

0

13

настраиваемое лз с иконкой

Код:
<div style="display: grid; grid-template-columns: 4% 95%; align-items: center; background: rgb(154 162 153); box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23);  padding: 6px; margin-inline: -10px; border-radius: 10px; position: relative; z-index: 2; "> <div id="lz_img"><div style="border: 1px solid rgb(44 53 50 / 43%); background: rgba(210,212,214,1); border-radius: 100%; box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23); "><img src="http://forumstatic.ru/files/001b/a7/18/41474.png" title="название стикера"></div></div><div id="lz_text"> <div style="color: #2c3532; font-size: 1.4rem; font-family: 'danceregular'; "> Значимая инфа </div> <div style="color: #2c353278; font-size: 0.5rem; "> поясняющий текст </div></div> </div>

0

14

частично с импульса
цвета
Код:
:root {
  --color1: #b8bac3;
  --color2: #f4f3ef;
  --color3: #7783b0;
  --color4: #343b55;
  --color5: #282828;
  --color6: #cc9b8c;
  --color7: #f1cdc1;
  --color8: #412f3e;
  --color9: #776875;
  --color10: #795273;
  --color11: #4d5984;
  --body-color: rgba(157,146,136, 1); /*  */
  --border-color: rgba(44,53,50, 1); /* поменяла */
  --text-soft-color: rgba(134,139,128, 1); /* поменяла */
  --text-color: rgba(134,139,128, 1); /* поменяла */
  --texttwo-color: rgba(150,153,154, 1); /* поменяла */
  --mark-color: rgba(71,44,33, 1); /*  */
  --special-color: rgba(147,136,127, 1); /*  */
  --special-border-color: rgba(123,6,12, 1); /* поменяла */
  --special-bg-color: rgba(120,93,81, 0.8); /*  */
  --special-text-color: rgba(238,251,234, 1); /*  */
  --special-mark-color: rgba(118,46,33, 1); /* используется */
}

/* основное */
html {background-color: var(--color4); background-image: url(/files/001b/a7/18/21743.png); background-repeat: no-repeat; background-attachment: fixed; background-size: cover; min-height: 100%;}
html.punbb { background: none; border: none; box-shadow: none;  text-align: center;}
.punbb {background-color: var(--color1); border: 2px solid var(--color4); outline: 1px solid var(--color6); box-shadow: inset 0 0 40px 10px rgba(0, 0, 0, .23); }
#pun, #pun-index span.isonline, li.pa-online {}
#pun {background: rgb(40 40 40 / 26%); border: 2px solid var(--color8); box-shadow: inset 0 0 50px 14px rgba(0, 0, 0, .42); color: var(--color5);} 
.main {}
a {color: var(--color10);}
a:hover {color: var(--color9);}
noindex a, .postlink a, #pun-viewtopic .linksb .subscribelink a {color: var(--color7);}
#pun-navlinks a, #pun-about a {color: var(--color3);}
#pun-ulinks a {color: var(--color1); opacity: .58;}
#pun-about a {opacity: 0.4;}
#pun-about a:hover, #pun-ulinks a:hover {opacity: 1;}
#pun-navlinks a:hover {color: var(--color1);}
#pun-crumbs1, #pun-crumbs2 {color: var(--color11);}
.linkst, .linksb { background: var(--color4); color: var(--color7); border-bottom: 1px solid var(--color6); outline: 2px solid var(--color4); border-top: 1px solid var(--color6);}
#pun-status a:hover {color: var(--color2);}
input[type='radio']:checked {background-color: var(--color11);}
input[type='checkbox'], input[type='radio'] {background: var(--color1);}

/* на главной */
.category, .usertable .container {color: var(--color4);}
.category h2 span, #pun-announcement .html-box span a, #pun-stats h2 span {background: var(--color4); color: var(--color7); border-bottom: 1px solid var(--color6); outline: 2px solid var(--color4); border-top: 1px solid var(--color6);}
#pun-index .category tbody tr, .punbb .forum .hasicon tr, .usertable tr, #filetable tr, #messages .fs-box tr, #pun-statistic table td {border-bottom: 1px solid var(--color3);}
#pun-index .category tbody tr:last-child, .punbb .forum .hasicon tr:last-child, .usertable tr:last-child, #filetable tr:last-child, #messages .fs-box tr:last-child {border:none;}
#pun-index h2 {}
.tclcon h3, #pun-index .category .tcr, #pun-stats .item1, #pun-stats .item2, #pun-stats .item3, #pun-stats .item4 {}
.tclcon h3 a {color: var(--color10);}
.tclcon h3 a:hover {color: var(--color9);}
#pun-index .tc2, #pun-index .tc3 {color: var(--border-color);}
#transcriptforum {color: rgb(163 68 12 / 87%);}
#textforum {color: rgb(40,35,32, 0.8);}
#linksforum a {background: var(--special-border-color); color: rgb(238 251 234 / 40%); border: 1px solid var(--special-color);}
#linksforum a:hover {color: rgb(238 251 234 / 80%); border: 1px solid rgb(238 251 234 / 80%);}
#pun-index .category .tc2, #pun-index .category .tc3 {}
#pun-index .category .tc2:hover, #pun-index .category .tc3:hover {}
#pun-stats ul li:not(#onlinelist) span, #pun-stats ul li a {color: var(--color11);}
#pun-stats li#onlinelist.item5.onlinelist, #pun-stats li#onlinelist.item5.users_24h {color: var(--color4);}

/* на страницах профиля и смс */
#profile-right li {border-bottom: 1px solid var(--special-border-color);}
#viewprofile #profile-left, #tags .container {background: var(--color4); color: var(--color1); border-right: 1px solid var(--color6); outline: 2px solid var(--color4); border-left: 1px solid var(--color6);}
#viewprofile #profile-left li {}
#viewprofile #profile-left li a {color: var(--color3);}
#profile-name a, #profile-name {color: var(--color3);}
tr.group1.icon.inew, tr.altstyle.inew { background: var(--color11); color: var(--color7); border-bottom: 1px solid var(--color6)!important; outline: 2px solid var(--color11); border-top: 1px solid var(--color6); box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23); margin: 0 -10px; padding: 4px 10px;}
tr.group1.icon.inew a, tr.altstyle.inew a {color: rgb(238 251 234 / 40%);}
tr.group1.icon.inew a:hover, tr.altstyle.inew a:hover {color: rgb(238 251 234 / 80%);}
tr.altstyle.inew {color: var(--body-color);}

/* оформление страницы форума */
#pun-statistic h1 span {color: var(--color10);}
.inner.post_reputation {color: var(--border-color); background: rgb(154 162 153 / 80%); box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23); border-right: 1px solid rgb(123 6 12 / 49%); border-left: 1px solid rgb(44 53 50 / 49%); border-radius: 10px;}
#pun-viewtopic .multipage .inner.post_reputation h1 {font-size: 1rem; margin-top: -44px; position: absolute; border-start-start-radius: 8px; border-start-end-radius: 8px;}
.multipage h1 {}
.topic { border-bottom: 1px solid var(--color6); outline: 1px solid var(--color9); border-top: 1px solid var(--color6); box-shadow: inset 0 0 80px 4px rgb(65 47 62 / 34%);}
.post .container, #profile fieldset, #profile10 .adfs-box, #pun-statistic #pun-main.main .container { border-right: 1px solid var(--color10); border-left: 1px solid var(--color11); background: var(--color1); box-shadow: inset 0 0 40px 10px rgb(37 44 69 / 19%);}
.post-author ul:not(.wrapper) { background: var(--color4); color: var(--color1); border-bottom: 1px solid var(--color6); outline: 2px solid var(--color4); border-top: 1px solid var(--color6);}
.post-author:before { background: var(--color3); box-shadow: inset 0 0 11px 2px rgb(0 0 0 / 11%);}
.pa-author a, .pa-posts, .pa-fld5 {color: #f1cdc1c2;}
.pa-respect a {color: var(--color1);}
.post h3, .post h3 a {color: var(--color9);}
.pa-avatar.item2 img {border: 1px solid var(--outline-color);}
.post-links, #profile fieldset legend, input, select { background: var(--color11); color: var(--color7); border-bottom: 1px solid var(--color6); outline: 2px solid var(--color11); border-top: 1px solid var(--color6); }
.post-links a {color: rgb(238 251 234 / 40%);}
.post-links a:hover {color: rgb(238 251 234 / 80%);}
.forum .container, .usertable .container {color: var(--color4);}
.formal { border-bottom: 1px solid var(--color6); outline: 1px solid var(--color9); border-top: 1px solid var(--color6); box-shadow: inset 0 0 80px 4px rgb(65 47 62 / 34%); }
#volSlider, #fntSlider {border: 1px solid #79527375;}
#volSlider .before, #fntSlider .before {background: #79527375;}
#volSlider .thumb, #fntSlider .thumb {background: #795273bf;}

/* кнопки, поля ввода, прокрутка */
input, select {border-left: 0;  border-right: 0;}
textarea {background: rgb(154 162 153 / 10%); box-shadow: inset 0 0 21px 2px rgba(0, 0, 0, .13);}
input:hover, select:hover {box-shadow: inset 0 0 10px 2px #7783b08a;}
input:is(:focus, :focus-visible, :active), textarea:is(:focus, :focus-visible, :active), select:is(:focus, :focus-visible, :active) {}
#main-reply { border: 1px solid var(--color9); background: var(--color1); color: var(--color4);}
::-webkit-scrollbar-thumb {border-radius: 20px; background-color: var(--color3); box-shadow: inset 0 0 2px var(--color4);}
::-webkit-scrollbar-track {background-color: transparent;}

/*цитаты и выделить код, форма ответа*/
blockquote p {}
.quote-box cite, .quote-box cite a {border-radius: 10px; border-right: 1px solid rgb(123 6 12 / 49%); border-left: 1px solid rgb(44 53 50 / 49%); background: rgb(210 212 214 / 49%);}
.code-box, .quote-box {color: var(--color5); background: rgb(77 89 132 / 37%); box-shadow: inset 0 0 11px 2px rgb(0 0 0 / 14%);}
.post-content .spoiler-box > blockquote {}
.code-box .blockcode {}
.code-box strong.legend {}
.post-content .spoiler-box > blockquote.visible {}

/*иконки*/
div.inew {background: var(--border-color);}
div.iclosed {border-right: 1px solid rgb(44 53 50); background: var(--texttwo-color);}
div.isticky {background: var(--special-mark-color); border-right: 1px solid rgb(44 53 50);}

/* закладки / уведомления */
#MyBookmarks {height: 80%; border-end-end-radius: 10px;}
#pun #MyBookmarks span.scrl,#pun #MyBookmarks li span strong {color: #153131; text-shadow: 0 0 6px #153131;}
#pun #BookmCntToggle.default-style {border-left: solid 4px currentcolor; height: 30px; width: 22px; border-radius: 5px; color: var(--color3);}
#pun #MyBookmarks h2 {margin-top: -15px; left: 0; padding-block: 5px; letter-spacing: 2px; font-size: 20px; text-transform: uppercase; border-radius: 10px; background: var(--color4); color: var(--color3); box-shadow: -0.640625px 4px 5px rgb(0 0 0 / 62%);}
#pun #MyBookmarks, #pun .editBookmark { top: 70px; background-color: var(--color1); border: 1px solid var(--color4); box-shadow: inset 0 0 40px 10px rgba(0, 0, 0, .23);}
#pun .post .bookmark {color: var(--color10);}
#pun .editBookmark h1 {display: none!important;}
.punbb span.num_msg {position: relative; background: var(--color3); color: var(--color2); margin: 0; top: -4px; left: 12px; padding: 4px;}
.punbb span.num_msg:before {display: none;}
.punbb .bubble {background: var(--text-color); color: var(--special-text-color); }
.punbb .bubble:after {border-color: var(--text-color);}

/* админка */
.punbb-admin #pun-admain .ace-chrome .ace_gutter {background: rgb(129 112 101 / 50%);}
.punbb-admin #pun-admain .ace_hidpi .ace_content {background: rgb(129 112 101 / 20%);}
.punbb-admin #pun-admain fieldset p, .punbb-admin #pun-admain fieldset .handle, .punbb-admin #pun-admain .adcontainer th {border-color: rgb(70 38 7 / 25%); background-color: rgb(81 47 25 / 17%); border-radius: 18px; padding: 4px 10px!important;}
.punbb #pun-admain legend span {background: var(--special-border-color); color: var(--special-text-color);}
.punbb-admin .adminmain {border: 1px solid var(--special-border-color)!important; background: rgb(86 72 62 / 27%);}
.punbb-admin .adcontainer fieldset {border: 1px solid var(--special-border-color)!important;}
.punbb-admin .adformal h2, .punbb-admin #pun-adnav h2 {background: var(--special-border-color); color: var(--special-text-color);}
.punbb-admin,.punbb-admin #pun-admain .isactive a, .punbb-admin #pun-adnav .isactive ul.adsubnav a  {color: rgb(37 29 26 / 58%);}
.punbb-admin #pun-admain a, .punbb-admin #pun-admain li::marker, .punbb-admin #pun-adnav .isactive ul.adsubnav a:hover {color: rgb(44 26 18 / 76%);}
.punbb-admin #pun-admain a:hover {color: var(--special-mark-color);}

.go-up,.go-down { display:none; position:fixed; right: 15px; z-index:9999; cursor:pointer; opacity:.7; margin-bottom: 25px; width: 20px; height: 20px; border-radius: 18px; outline: 1px solid rgba(255,255,255,0.25);}
.go-up {bottom: 60%; background: var(--outline-color);}
.go-down {bottom: 50%; background: var(--special-border-color);}
.go-down:hover,.go-up:hover {opacity:1;}

/*шапка*/
#html-header { width: 1000px; margin: 10px auto 0 auto; border-radius: 30px; display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: 180px 25px 60px;}
name_forum {display: grid; grid-area: 1 / 1 / 3 / 6; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); }
name_forum name {grid-area: 1 / 1 / 2 / 4; font-family: 'Culture'; font-size: 6.1rem; background-clip: text!important; -webkit-background-clip: text!important; color: transparent; background: linear-gradient(to right, #cc9b8c, #f1cdc1); padding: 35px 0;}
name_forum info {grid-area: 2 / 2 / 3 / 3; color: var(--color1); font-size: 0.8rem; position: relative; top: -30px; letter-spacing: 1.2px;}
table_forum { display: grid; grid-area: 3 / 1 / 4 / 6; font-family: 'danceregular'; text-transform: lowercase; color: var(--color7); align-content: center; justify-content: space-evenly; align-items: center;}
table_forum pic { display: inline-block; height: 45px; background: var(--color4); border-radius: 50%; border: 1px solid var(--color6);}
table_forum pic:hover { background: var(--color8);}
table_forum img { mix-blend-mode: luminosity; filter: grayscale(100%) contrast(70%) brightness(70%);}
table_forum navigation {grid-area: 3 / 1 / 4 / 2;}
table_forum active_left {grid-area: 3 / 2 / 4 / 3;}
table_forum years {grid-area: 3 / 3 / 4 / 4; font-family: 'Culture'; font-size: 3.4rem; background-clip: text !important; -webkit-background-clip: text !important; color: transparent; background: linear-gradient(to right, #cc9b8c, #f1cdc1); padding: 20px 5px;}
table_forum active_right {grid-area: 3 / 4 / 4 / 5;}
table_forum links {grid-area: 3 / 5 / 4 / 6;}


/* Form Buttons and inner container */

#form-buttons tr {display: flex; justify-content: center; flex-wrap: wrap;}
#form-buttons td { position: relative; width: 29px; height: 29px; background-image: none !important; border-radius: 4px; margin: 0 2px 2px; transition: .3s all ease-in-out;}
#form-buttons td#button-mask { background-image: none !important;}
#form-buttons td img { opacity: 0;}
#form-buttons td::before {position: absolute; top: 50%; height: auto; font-size: 14px; font-weight: 900; font-family: 'Font Awesome 5 Free'; text-align: center; color: var(--color10); margin: 0 auto; -webkit-transition: all ease-out 0.3s; -moz-transition: all ease-out 0.3s; -ms-transition: all ease-out 0.3s; -o-transition: all ease-out 0.3s; transition: all ease-out 0.3s; pointer-events: none;}

#form-buttons td:hover::before,
#form-buttons #button-image:hover b p {color: var(--special-bg-color);}
#form-buttons #button-font::before { content: '\f031';}
#form-buttons #button-size::before { content: '\f034';}
#form-buttons #button-bold::before { content: '\f032';}
#form-buttons #button-italic::before { content: '\f033';}
#form-buttons #button-underline::before { content: '\f0cd';}
#form-buttons #button-strike::before { content: '\f0cc';}
#form-buttons #button-indent::before { content: '\f03c';}
#form-buttons #button-left::before { content: '\f036';}
#form-buttons #button-center::before {content: '\f037';}
#form-buttons #button-center + td::before {content: '\f039';}
#form-buttons #button-right::before {content: '\f038';}
#form-buttons #button-link::before {content: '\f0c1';}
#form-buttons #button-spoiler::before {content: '\f518';}
#form-buttons #button-image::before { content: '\f302';}
#form-buttons #button-image b p { top: 6px; right: 2px; color: rgba(45, 45, 45, 1); margin: 0 !important; -webkit-transition: all ease-out 0.3s; -moz-transition: all ease-out 0.3s; -ms-transition: all ease-out 0.3s; -o-transition: all ease-out 0.3s; transition: all ease-out 0.3s;}
#form-buttons #button-video::before {content: '\f144';}
#form-buttons #button-hide::before {content: '\f070';}
#form-buttons #button-quote::before {content: '\f27a';}
#form-buttons #button-code::before {content: '\f121';}
#form-buttons #button-color::before {content: '\f53f';}
#form-buttons #button-table::before { content: '\f84c';}
#form-buttons #button-smile::before { content: '\f118';}
#form-buttons #button-sticker::before { content: '\f4da';}
#form-buttons #button-keyboard::before { content: '\f11c';}
#form-buttons #button-addition::before { content: '\f150';}
#form-buttons #button-mask::before { content: '\f6fa';}
#button-files_rusff, #button-graffiti_rusff {display: none!important;}


/*темы*/
.subject {text-align: center; border-radius: 18px; padding: 2px 20px; color: var(--border-color); background: rgb(154 162 153 / 40%); box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23);}
.subject_name {font-size: 2rem; font-family: 'danceregular'; color: var(--border-color); border-bottom: 1px solid var(--border-color);}
.subject_info {color: #2c35327d;}
.subject_table {display: grid; grid-template-columns: repeat(2, 45%); justify-content: space-around; grid-template-rows: 50px auto;}
.subject_name1_table {grid-area: 1 / 1 / 2 / 2;}
.subject_name2_table {grid-area: 1 / 2 / 2 / 3;}
.subject_name1_table, .subject_name2_table, .subject_name1_table1, .subject_name2_table1, .subject_name3_table1 {z-index: 1; font-size: 1rem; font-family: 'danceregular'; color: var(--border-color); border-right: 1px solid rgb(123 6 12 / 49%); border-left: 1px solid rgb(44 53 50 / 49%); background: rgb(210 212 214); box-shadow: inset 0 0 40px 10px rgba(0, 0, 0, .23); border-radius: 16px;}
.subject_info1_table {grid-area: 2 / 1 / 3 / 2;}
.subject_info2_table {grid-area: 2 / 2 / 3 / 3;}
.subject_name1_table1 {grid-area: 1 / 1 / 2 / 2;}
.subject_name2_table1 {grid-area: 1 / 2 / 2 / 3;}
.subject_name3_table1 {grid-area: 1 / 3 / 2 / 4;}
.subject_info1_table1 {grid-area: 2 / 1 / 3 / 2;}
.subject_info2_table1 {grid-area: 2 / 2 / 3 / 3;}
.subject_info3_table1 {grid-area: 2 / 3 / 3 / 4;}
.subject_info1_table, .subject_info2_table, .subject_info1_table1, .subject_info2_table1, .subject_info3_table1 {max-height: 250px; overflow: auto; position: relative; top: -10px; z-index: 0; border-end-end-radius: 16px; border-end-start-radius: 16px; box-shadow: inset 0 0 20px 4px rgba(0, 0, 0, .13); background: rgb(238 251 234 / 18%);}
.post-content .subject_info1_table p:first-child, .post-content .subject_info2_table p:first-child, .post-content .subject_info1_table1 p:first-child, .post-content .subject_info2_table1 p:first-child, .post-content .subject_info3_table1 p:first-child {margin-top: 15px;}
.post-content .subject_info1_table p, .post-content .subject_info2_table p, .post-content .subject_info3_table p, .post-content .subject_info1_table1 .subject_info1_element2 p, .post-content .subject_info2_table1 .subject_info1_element2 p, .post-content .subject_info3_table1 .subject_info1_element2 p, .post-content .subject_info1_table1 p, .post-content .subject_info2_table1 p, .post-content .subject_info3_table1 p {margin: 0;}
.post-content .subject_info1_table .subject_info_element2 p, .post-content .subject_info2_table .subject_info_element2 p {margin: 0;}
.subject_info_element1 {font-family: 'bravo'; letter-spacing: 3px; text-transform: lowercase; font-size: 20px; padding-left: 10px; text-align: left; color: var(--mark-color); box-shadow: inset 0 0 20px 4px rgba(0, 0, 0, .13); background: rgb(238 251 234 / 18%);}
.subject_info_element2 {font-size: 14px; letter-spacing: 2px; border-bottom: 1px solid rgb(150 153 154 / 22%);}
.subject_info_element2 a, .subject_info1_element2 a, .subject_info1_element2 {color: var(--text-soft-color);}
.subject_img img {border-radius: 14px;}
.subject_info3_table {grid-area: 1 / 1 / 3 / 2; padding-bottom: 20px}
.subject_table1 {display: grid; grid-template-columns: repeat(3, 32%);
justify-content: space-around; grid-template-rows: 50px auto;}
.subject_table2 {display: grid; grid-template-columns: repeat(3, 32%);}
.subject_info1_table2 {grid-area: 1 / 1 / 2 / 2;}
.subject_info2_table2 {grid-area: 2 / 1 / 3 / 2;}
.subject_img_table2 {grid-area: 1 / 2 / 3 / 3;}
.subject_info3_table2 {grid-area: 1 / 3 / 2 / 4;}
.subject_info4_table2 {grid-area: 2 / 3 / 3 / 4;}
.punbb .post-content .subject_img_table2 img.postimg {text-align: center; max-width: 140px; border-radius: 10px; border: 1px solid var(--border-color);}
.subject_name1_table2 {font-size: 1rem; font-family: bravo; letter-spacing: 1px; border-bottom: 1px solid rgb(150 153 154 / 33%);}
.post-content .subject_info1_table2 p, .post-content .subject_info2_table2 p, .post-content .subject_info3_table2 p, .post-content .subject_info4_table2 p {margin: 0;}
.punbb .post-content .subject_name1_table2 p {margin-top: 15px;}






/*
 * This is a Work In Progress!
 * The code is a rough draft, I would suggest not using it until it's done
 */

#slider { text-align: center; overflow: hidden;  -webkit-transition: background-color 0.6s ease-in-out 0s; transition: background-color 0.6s ease-in-out 0s; box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23); border-radius: 10px; border-right: 1px solid rgb(123 6 12 / 49%); border-left: 1px solid rgb(44 53 50 / 49%);}

.page1 {}
.page2 {}
.page3 {}
.page4 {}
.page5 {}
.page6 {}
.page7 {}
.page8 {}


#pages { padding: 10px; height: 300px; overflow: auto;}
#pages li {visibility: hidden; position: relative; display: none;}
#pages .selected {opacity: 1; visibility: visible; display: initial;}



#prev {
  left: 10px;
  -webkit-transform: rotate(45deg) scale(0.8);
  transform: rotate(45deg) scale(0.8);
}

.hidden {
  opacity: 0;
  pointer-events: none;
}

#next {
  right: 10px;
  -webkit-transform: rotate(225deg) scale(0.8);
  transform: rotate(225deg) scale(0.8);
}

#next:hover {
  -webkit-transform: rotate(225deg) scale(1.0);
  transform: rotate(225deg) scale(1.0);
}

#prev:hover {
  -webkit-transform: rotate(45deg) scale(1.0);
  transform: rotate(45deg) scale(1.0);
}

  /* navigation */
.navigation {width: 100%; font-size: 0;    background: rgb(154 162 153); box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23);}
.navigation li { display: inline-block; margin: 0; padding: 0;}
.navigation li:hover {background: rgb(197 207 197); box-shadow: inset 0 0 8px 1px rgba(0, 0, 0, .23); border-left: 1px solid rgb(44 53 50 / 49%);}
.navigation a { display: block; padding: 10px 0px;}
.navigation li a.selected {background: rgb(255 254 254 / 49%); box-shadow: inset 0 0 8px 1px rgb(153 162 153); border-left: 1px solid rgb(123 6 12 / 49%);}
.navigation a { display: block; padding: 10px 0px;}
.navigation span { display: block; font-size: 1.4rem; padding: 2px 10px; opacity: 0.6; -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; -webkit-transform: scale(0.6); transform: scale(0.6);}
.navigation a:hover span { opacity: 1; -webkit-transform: scale(0.8); transform: scale(0.8);}
.navigation a.selected span {  opacity: 1; -webkit-transform: scale(1); transform: scale(1);}
структура
Код:
@import url(style_cs.css);

/* шрифты */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&family=Roboto:wght@100;300;400;500;700;900&display=swap');


@font-face {
    font-family: 'anticva';
    src: url('https://forumstatic.ru/files/001b/a7/18/48674.eot');
    src: url('https://forumstatic.ru/files/001b/a7/18/48674.eot?#iefix') format('embedded-opentype'),
         url('https://forumstatic.ru/files/001b/a7/18/53692.woff2') format('woff2'),
         url('https://forumstatic.ru/files/001b/a7/18/59371.woff') format('woff'),
         url('https://forumstatic.ru/files/001b/a7/18/42985.ttf') format('truetype'),
         url('https://forumstatic.ru/files/001b/a7/18/24644.svg?v=1#anticva') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Culture';
    src: url('https://forumstatic.ru/files/001b/a7/18/86382.eot');
    src: url('https://forumstatic.ru/files/001b/a7/18/86382.eot?#iefix') format('embedded-opentype'),
         url('https://forumstatic.ru/files/001b/a7/18/16023.woff2') format('woff2'),
         url('https://forumstatic.ru/files/001b/a7/18/77286.woff') format('woff'),
         url('https://forumstatic.ru/files/001b/a7/18/26064.ttf') format('truetype'),
         url('https://forumstatic.ru/files/001b/a7/18/25202.svg?v=1#Culture') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'danceregular';
    src: url('https://forumstatic.ru/files/001b/a7/18/57810.eot');
    src: url('https://forumstatic.ru/files/001b/a7/18/57810.eot?#iefix') format('embedded-opentype'),
         url('https://forumstatic.ru/files/001b/a7/18/72901.woff2') format('woff2'),
         url('https://forumstatic.ru/files/001b/a7/18/44867.woff') format('woff'),
         url('https://forumstatic.ru/files/001b/a7/18/47870.ttf') format('truetype'),
         url('https://forumstatic.ru/files/001b/a7/18/40756.svg?v=1#danceregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bravo';
    src: url('https://forumstatic.ru/files/001b/a7/18/38820.eot');
    src: url('https://forumstatic.ru/files/001b/a7/18/38820.eot?#iefix') format('embedded-opentype'),
         url('https://forumstatic.ru/files/001b/a7/18/69725.woff2') format('woff2'),
         url('https://forumstatic.ru/files/001b/a7/18/13578.woff') format('woff'),
         url('https://forumstatic.ru/files/001b/a7/18/95714.ttf') format('truetype'),
         url('https://forumstatic.ru/files/001b/a7/18/29723.svg?v=1#bravo') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bergamascoregular';
    src: url('/files/001b/a7/bb/73872.eot');
    src: url('/files/001b/a7/bb/73872.eot?#iefix') format('embedded-opentype'),
         url('/files/001b/a7/bb/98966.woff2') format('woff2'),
         url('/files/001b/a7/bb/51489.woff') format('woff'),
         url('/files/001b/a7/bb/87847.ttf') format('truetype'),
         url('/files/001b/a7/bb/73048.svg#bergamascoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Myriad Pro';
    src: url('/files/0015/e5/b7/68495.eot');
    src: url('/files/0015/e5/b7/68495.eot?#iefix') format('embedded-opentype'),
         url('/files/0015/e5/b7/90961.woff2') format('woff2'),
         url('/files/0015/e5/b7/24719.woff') format('woff'),
         url('/files/0015/e5/b7/92838.ttf') format('truetype'),
         url('/files/0015/e5/b7/59688.svg#Myriad Pro') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'attack_typeregular';
    src: url('/files/001b/a7/bb/56673.eot');
    src: url('/files/001b/a7/bb/56673.eot?#iefix') format('embedded-opentype'),
         url('/files/001b/a7/bb/40473.woff2') format('woff2'),
         url('/files/001b/a7/bb/36696.woff') format('woff'),
         url('/files/001b/a7/bb/90549.ttf') format('truetype'),
         url('/files/001b/a7/bb/69774.svg#attack_typeregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ralewayregular';
    src: url('/files/001b/a7/bb/64030.eot');
    src: url('/files/001b/a7/bb/64030.eot?#iefix') format('embedded-opentype'),
         url('/files/001b/a7/bb/15520.woff2') format('woff2'),
         url('/files/001b/a7/bb/79061.woff') format('woff'),
         url('/files/001b/a7/bb/79423.ttf') format('truetype'),
         url('/files/001b/a7/bb/50514.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face { font-family: 'ralewayextrabold';
    src: url('/files/001b/a7/bb/81640.eot');
    src: url('/files/001b/a7/bb/81640.eot?#iefix') format('embedded-opentype'),
         url('/files/001b/a7/bb/16972.woff2') format('woff2'),
         url('/files/001b/a7/bb/27892.woff') format('woff'),
         url('/files/001b/a7/bb/28074.ttf') format('truetype'),
         url('/files/001b/a7/bb/23513.svg#ralewayextrabold') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {font-family: 'FontAwesome';src: local("FontAwesome"), url('https://forumstatic.ru/files/001b/ae/02/82214.otf'); url('https://forumstatic.ru/files/001b/ae/02/10475.eot'), url('https://forumstatic.ru/files/001b/ae/02/33873.woff'), url(https://forumstatic.ru/files/001b/ae/02/11858.ttf');
}

/* Стандартные коды майбб, которые пригодятся */

.punbb ul, .punbb dl, .punbb li, .punbb dd, .punbb dt {padding: 0; list-style: none;}
.punbb img {border:none; vertical-align: middle;}
.punbb .main table {table-layout: fixed; width: 100%;}
.checkfield input[type="checkbox"], .radiofield input[type="radio"] {margin: 0 0.3em;}
p[class="checkfield"] *, div[class="checkfield"] *, fieldset[class="radiofield"] * { height: 1.8em; vertical-align: middle}
.punbb .post-content em {font-style: italic}
.punbb optgroup {font-weight: bold;}
.acchide,#pun-index #pun-main h1,#pun-pagelinks h2,#pun-status h2,#pun-ulinks h2,.punbb .forum h2,.punbb .multipage .topic h2,.punbb dl.post-sig dt span,.punbb p.crumbs strong,.punbb .divider hr,.punbb .required label em,.punbb .formsubmit label,.punbb .submitfield label,.punbb .modmenu label,#pun-userlist .main h2,#pun-title h1 {font-size: 0;height: 0;width: 0;line-height: 0.0; position:absolute; left: -9999px; overflow: hidden}
.punbb * {margin: 0;}
.punbb .hashelp {position: relative;}/* позиционирование выпадающего меню */
.post-content em.bbuline {font-style: normal; text-decoration: underline;}
.punbb .post-content .scrollbox {overflow-x: hidden; max-height: 40px; padding: 5px; }
::-webkit-scrollbar { width: 4px; height: 4px;}

/* основное */
body {margin: 0;}
html {line-height: 1.15; -webkit-text-size-adjust: 100%;}
html * {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; line-height: 1.25; text-rendering: optimizeLegibility;}
#pun-main {padding: 2px;}
a {transition: color 0.3s ease-in-out; text-decoration: none;}
#pun {width: 1000px; margin: 60px auto 0 auto; padding: 0 0 20px 0; border-radius: 30px; box-sizing: border-box;}
#pun-break1 {height: 10px;}
.punbb {border-radius: 30px; padding-inline: 20px; margin: 20px 10px 60px; font: normal 77.75% 'tahoma', sans-serif; letter-spacing: 0.1px; box-sizing: border-box;}
h1, h2, h3, #pun-index .tc2, #pun-index .tc3, #pun-navlinks {font-family:'Myriad Pro'; font-weight: normal;}
#pun-title {width: 100%;}
#pun-about { width: 100%; left: 0; text-align: center; padding-top: 6px;}
#pun-about { position: absolute;}
#pun-navlinks.section {width: 100%; position: relative; text-align: center; text-transform: lowercase; font-size: 1.4rem; font-family: 'danceregular'; top: -74px; font-weight: 700; height: 1px;}
#pun-ulinks.section {position: relative; width: 100%; top: -44px; text-transform: lowercase; text-align: center; height: 1px;}
#pun-ulinks li {padding-inline: 2px;}
#pun-ulinks li, #pun-navlinks li {display: inline;}
#pun-navlinks li {padding-right: 8px;}
#pun-status {text-transform: lowercase; font-size: 0.6rem; margin-top: -20px; opacity: 0.6;}
#pun-status span {margin-inline: 4px;}
#pun-status a {font-weight: 100;}
p.container.crumbs {z-index: 0; padding-inline: 10px; font-size: 10px; text-transform: lowercase;}
#pun-crumbs1, #pun-crumbs2 {position: relative; margin: 10px 0; padding-block: 5px; border-radius: 10px;}
.linkst, .linksb  {position: relative; margin: 10px 0; padding: 5px 18px; border-radius: 6px;}
.linksb {margin-bottom: 16px;}
noindex { position: relative; top: -16px; float: right;}
td.tcl {}
#pun-viewforum .intd, #pun-messages td.tcl .intd {display: flex;}
input[type='checkbox'], input[type='radio'] {width: 15px; height: 15px; cursor: pointer; appearance: none;}
input[type='checkbox']:checked {background-image: url(/files/001b/a7/bb/90984.png); background-repeat: no-repeat; background-position: center; background-size: cover; background-color: #fff;}

/* на главной странице */
#pun-index .category tr {display: table; padding: 10px 0 10px 14px; margin: 10px 0;}
#pun-category1 {margin-top: 40px;}
.category, .forum .container, .usertable .container {position: relative; border-radius: 18px; padding: 10px 0; margin-bottom: 35px;}
.category h2 {position: relative; top: -28.5px; margin-inline: -22px;}
#pun-stats h2 {position: relative; top: -28.5px; margin-inline: -35px;}
.category h2 span, #pun-stats h2 span {display: block; width: 100%; text-transform: uppercase; text-align: center; font-family: 'danceregular'; line-height: 2rem; padding-top: 4px;}
.category table {border-collapse: separate;}
#pun-index .category tr { position: relative; display: grid; grid-template-columns: 60% 20% 20%;}
.category tr:last-of-type {margin-bottom: 20px;}
#pun-index .category .tcl {grid-area: 1 / 1 / 3 / 2;}
#pun-index .tclcon {padding: 0 4px; display: grid; justify-content: center; text-transform: lowercase; grid-template-columns: 100%;}
span.modlist {text-align: center; display: none;}
.tclcon h3 {grid-area: 1 / 1 / 2 / 2; width: 58%;}
.tclcon h3 a {position: relative; z-index: 1; font-family: 'bravo'; font-size: 23px; text-transform: uppercase; letter-spacing: 2px;}
#transcriptforum {font-family: 'Myriad Pro'; font-size: 0.9rem; letter-spacing: 1px; margin: 0 0 4px;}
#textforum {font-size: 0.8rem; text-align: justify;}
#linksforum {display: flex; width: 100%; flex-wrap: wrap; justify-content: center; margin-top: 14px;}
#linksforum a:first-child {margin-left: 0;}
#linksforum a {display: block; font-size: 10px; text-transform: uppercase; font-family: 'Tahoma'; border-radius: 9.5px; padding: 5px 9px 4px; margin: 2px 3px;}
#pun-index .category .tcr {grid-area: 2 / 2 / 3 / 4;}
#pun-index .category .tcr a {font-size: 0.8rem; font-weight: bold; z-index: 1; position: relative;}
#pun-index .category .tcr {position: relative; align-items: center; padding-left: 20px;}
#pun-index em.user-avatar { margin-inline: 20px;}
#pun-index a.lastpost-link,#pun-index span.lastpost {}
#pun-index span.avatar-image, #pun-index span.isonline {z-index: 1; position: relative;}
.punbb em.user-avatar .avatar-image {border-radius: 10px; filter: grayscale(100%) contrast(90%) brightness(110%);}
#pun-stats {padding: 0 15px;}
#pun-index #pun-stats h2 {}
#pun-stats .statscon {}
#pun-stats ul {display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0;}
#pun-stats ul li:not(#onlinelist) span {text-transform: lowercase;}
ul.container {padding-left: 0;}
#pun-stats ul li:not(#onlinelist) {width: 50%;}
#pun-stats ul li:not(#onlinelist) strong {font-weight: 400;}
#pun-stats ul li.item1 {order: 1;}
#pun-stats ul li.item2 {order: 3;}
#pun-stats ul li.item3 {order: 2; text-align: right;}
#pun-stats ul li.item4 {order: 4; text-align: right;}
#pun-stats ul li.item5 {order: 5; text-align: justify; width: 100%;}
#pun-stats li#onlinelist.item5.onlinelist, #pun-stats li#onlinelist.item5.users_24h {margin-block: 20px;}
#pun-stats ul li.item5.statistics {text-align: center; margin-bottom: 10px;}

/* оформление навигационных страниц и страницы статистики */
#pun-statistic h1 span {font-family: 'danceregular'; line-height: 2rem;}
#pun-statistic #pun-main.main .container { position: relative; border-radius: 18px; padding: 10px 0; margin-bottom: 15px;}
#pun-statistic table td { text-transform: lowercase; padding-block: 10px;}
#pun-statistic table tr:last-child td {border: none;}
#pun-main.main.multipage.show_recent, #pun-main.main.multipage.show_replies, #pun-main.main.multipage.show_unanswered, #pun-userlist #pun-main.main.multipage, #pun-statistic #pun-main.main {position: relative; top: 10px;}
.formal {border-radius: 18px; padding: 10px; margin: 10px 0;}
h1 {text-align: center; font-size: 26px; text-transform: lowercase;}
.punbb .forum .hasicon tr, .usertable tr {display: flex; padding: 5px; margin: 10px 0; text-transform: lowercase; align-items: center;}
.usertable thead tr {border: 0px;}
.forum td.tcl {width: 40%;}
.forum td.tc2, .usertable td.tc2.user_title, .usertable td.tc3.registered ,.usertable td.tc3.last_visit {width: 20%; text-align: center;}
.forum td.tc3, .usertable td.tc3.relation, .usertable td.tc3.num_posts {width: 5%;}
.forum td.tcr {width: 34%; display: flex; flex-direction: row; justify-content: space-evenly; align-items: center;}
.usertable td.tcl.username {display: flex; width: 30%; align-items: center; text-transform: capitalize;}
.punbb .forum .user-avatar .avatar-image, .punbb .usertable .user-avatar .avatar-image {border-radius: 12px;}
.punbb .forum .user-avatar {float: right; padding-left: 10px;}
.linkst .postlink.long { width: 100%; text-align: end;}
.postlink.long .new-topic, .postlink.long span.new-poll {padding: 6px 18px; border-radius: 6px; margin-inline: 10px;}
#pun-main table {padding: 0 20px;}
.post-links a {margin-inline: 10px;}

/* оформление странице профиля и лс */
#profile-gifts {text-align: center;}
#viewprofile tr {display: flex; justify-content: space-between; align-items: flex-start;}
#viewprofile #profile-left {width: 222px; margin: -10px 0 30px -10px; z-index: 1; border-end-start-radius: 22px; border-end-end-radius: 22px;}
#viewprofile #profile-left li {text-align: center; padding: 2px;}
#viewprofile #profile-left li:first-child {border-start-end-radius: 18px; border-start-start-radius: 18px; padding-top: 6px;}
#viewprofile #profile-left li:last-child {border-end-end-radius: 18px; border-end-start-radius: 18px; padding-bottom: 6px; }
#profile-name {width: 100%; font-size: 1.4rem; font-family: 'danceregular';}
#profile-title {text-transform: lowercase; font-size: 0.6rem;}
#viewprofile #profile-right {width: calc(100% - 230px);}
#profile-right li {display: flex; margin: 3px 0;}
#profile-right span:not(.GamePst) {width: 22%; font-family: 'ralewayregular'; font-size: 0.8rem; line-height: 1; padding: 12px 10px 5px;}
#viewprofile #profile-right strong {width: 78%!important; padding: 10px; font-weight: 400;}
#profile #profilenav {float: left; width: auto;}
#profile #profilenav li {position: relative; top: 20px; font-family: 'ralewayregular'; font-size: 0.8rem; letter-spacing: 1px; margin-bottom: 6px;}
#profile fieldset, #profile .formsubmit, #profile10 .select-file, #profile10 .adfs-box, #messages .linksb {width: calc(100% - 202px); margin-left: auto;}
#profile fieldset, #profile .formsubmit, #profile10 .select-file { margin-top: 14px;}
#profile fieldset.radiofield {width: 100%;}
#pun-profile #profile.formal {background: transparent; border:none; min-height: 400px;}
fieldset, #profile10 .adfs-box { border-radius: 18px; padding: 10px; position: relative;}
#pun-profile fieldset legend, #pun-messages fieldset legend {width: 50%; text-align: center; padding: 4px; border-radius: 6px;}
fieldset .infofield, fieldset .datafield, fieldset #num-posts, fieldset #location, fieldset #birthday, fieldset .checkfield {width: 100%;}
fieldset .radiofield .radio {width: 100%; display: flex; align-items: center;}
fieldset .radiofield .radio:first-child {margin-top: 10px;}
#filetable tr { display: flex!important; justify-content: space-between; align-items: center; padding: 10px 0;}
#profile10 .tc3.checker {text-align: end;}
#profile10 .tc3 {text-align: center;}
#setmods dl {margin: 10px 0;}
#setmods dt {font-size: 1.6rem; font-family: 'danceregular';}
#setmods dd {text-transform: lowercase; padding: 0 10px; line-height: 24px;}
#messages .linksb { display: flex; justify-content: space-between; background: transparent; outline: none; border: none; color: var(--color10);}
#messages .fs-box tr {display: flex; align-items: center;}
#messages .pmtc22 {display: flex; align-items: center;}
#pun-messages td.tc2, #pun-messages td.tc3 {overflow: visible!important;}

/* оформление страницы форума */
.multipage h1, #pun-profile h1 {font-size: 0;}
.modmenu {text-align: center;}
.modmenu strong {margin-right: 20px;}
#pun-viewtopic .multipage {text-align: center;}
#pun-viewtopic .linkst, #topic-modmenu .container {display: flex; align-items: center; justify-content: space-between; z-index: 1; padding: 14px; }
#topic-modmenu, #topic-users-in {padding-top: 10px;}
#pun-viewtopic .linksb {display: flex; flex-wrap: wrap; justify-content: space-between;}
#pun-viewtopic .linksb .pagelink {order: 1; margin: 0;}
#pun-viewtopic .linksb .postlink {order: 2;}
#pun-viewtopic .linksb .subscribelink {order: 3;}
.topic {position: relative; text-align: left; padding: 10px 0 10px; z-index: 0; border-radius: 18px;}
.post {position: relative; padding: 10px 16px 22px; margin-top: 10px;}
.post h3 {margin: 10px 0 0;}
.post h3 span {display: flex; flex-wrap: wrap; align-items: center; width: calc(100% - 281px); font-size: 1rem; margin-left: auto; padding-right: 30px;}
.post h3 span .permalink {order: 1; flex-grow: 1;}
.post h3 span #fntSlider {order: 2; margin-right: 15px;}
.post h3 span strong {order: 3;}
.post h3 span strong:before {content: '№ '; font-size: 0.7rem;}
#volSlider, #fntSlider {display: inline-block; position: relative; width: 100px; height: 9px; border-radius: 5px;}
#volSlider .before, #fntSlider .before {height: 7px; border: none; border-radius: 5px 0 0 5px; margin-top: 0;}
#volSlider .thumb, #fntSlider .thumb {display: inline-block; position: absolute; top: 0; margin-top: -1px; width: 3px; height: 9px; cursor: pointer; transition: all ease-out 0.3s;}
.post .container {display: flex; flex-wrap: wrap; justify-content: space-between; border-radius: 18px; padding-inline: 20px;}
.post-author { width: 222px; margin: -30px 0 30px; z-index: 1;}
.post-author ul:not(.wrapper) {text-align: center; width: 220px; border-radius: 22px; padding-top: 5px; padding-bottom: 28px; margin-left: 1px;}
.post-author:before {content: ''; display: block; width: 222px; height: 50px; z-index: -1; border-radius: 68px;}
.post-author:before {top: 0px; position: absolute;}
.pa-author {width: 100%; font-size: 1.4rem; font-family: 'danceregular';}
.pa-title { text-transform: lowercase; letter-spacing: 1px; margin-bottom: 5px; font-size: 0.6rem;}
.pa-avatar {width: calc(100% - 20px); text-align: center; margin: 0 10px; padding-bottom: 10px;}
.pa-avatar img {display: block; max-width: 180px; height: auto; margin: 0 auto;}
.pa-posts, .pa-respect, .post-author .pa-fld3, .post-author .pa-fld4 { display: inline-block; position: relative; width: 45%; line-height: 20px; margin: 2px; text-transform: lowercase; box-shadow: inset 0 0 11px 2px rgba(0, 0, 0, .23); border-radius: 8px; color: var(--color1);}
span.fld-name {width: 100%; display: flex; justify-content: center;}
.post-author-Sp {text-align: center; margin-top: 8px;}
.post-author .pa-fld1 {padding-block: 4px;}
.post-author .pa-fld1 a {font-family: 'bravo'; font-size: 1.5rem; color: var(--color3);}
.post-author .pa-fld1 a:hover { color: var(--color11);}
li.pa-online {width: 12px; height: 12px; display: block; position: absolute; top: 18px; left: 234px; font-size: 0px; animation: blinkColor .9s linear infinite; -moz-animation: blinkColor .9s linear infinite; -webkit-animation: blinkColor .9s linear infinite; z-index: 100; background: var(--color3); border-radius: 15px;}
.post-body {width: calc(100% - 251px); text-align: justify; border: none; border-radius: 0; padding: 20px 0;}
.post-links { width: 100%; border-radius: 5px; padding: 4px 15px; position: relative; top: 12px;}
.post-links ul {display: inline-block; width: 100%; height: 100%; text-align: right; padding-left: 0; margin: 0;}
.post-links ul li.pl-email {float: left;}
.post-links ul li {display: inline; margin-right: 10px;}
.post-links ul li:last-child, .post-links ul li.pl-BBquote {margin-right: 0;}
.post-box p {position: relative; z-index: 2;}
.post-author ul .post-author-Sp {text-align: center;margin-top: 8px;}
.post-author ul .post-author-Sp .aw {transition: .3s all ease-in-out;}
.post-author ul .post-author-Sp .aw:hover {opacity: .7;}
.post-author ul .post-author-Sp .wrapper { padding-left: 0; padding-top: 25px; }
.post-author ul .post-author-Sp .wrapper .pa-awards span { color: var(--special-border-color);}


/* кнопки отправить посмотреть */
p.formsubmit {text-align: center; padding: 5px; margin: 5px;}
.formal input.button, #post fieldset .hashelp div input, .button, #pun-admain input, input#sub4 {padding: 5px 10px; cursor: pointer; transition: .8s all;}
.formal input.button:hover, #post fieldset .hashelp div input:hover, .button:hover {cursor: pointer;}
.punbb .formsubmit input, .punbb .formsubmit a, .punbb .formsubmit span {margin: 0 5px 0 0;} 
select, input, .punbb .formal textarea {border-radius: 5px; padding: 2px 5px; }

/*цитаты и выделить код, форма ответа*/
.punbb .formal fieldset {border: none;}
#post-form { text-transform: none; margin-top: 20px; padding: 10px; border-radius: 18px;}
.quote-box {display: grid; border-radius: 18px; padding: 10px; grid-template-columns: 20% 80%; margin: 20px 4px 14px; position: relative; z-index: 3; overflow: hidden;}
.quote-box.hide-box > blockquote {padding-bottom: 10px;}
blockquote {grid-area: 2 / 1 / 3 / 3; z-index: 3;}
.quote-box cite { grid-area: 1 / 1 / 2 / 3; z-index: 1; font-style: normal; font-size: 1rem; position: relative; top: 4px; font-family: 'danceregular';}
blockquote p, blockquote.visible .quote-box p {width: 84%; position: relative; left: 12%; padding: 3px 0px 0 20px; }
.quote-box cite:before {content: "-";}
.post .post-content .spoiler-box > blockquote.visible { border-radius: 20px; padding: 0; overflow-x: hidden;}
.quote-box.spoiler-box:before {display:none;}
blockquote.visible:before {display:none;}
blockquote.visible p {width: 94%; position: relative; left: 2%; padding: 3px 0px 0 20px; min-height: 40px;}
blockquote.visible p:last-child {margin-bottom: 10px;}
.code-box {display: grid;  grid-template-columns: 90% 10%; border-radius: 18px; padding: 10px; margin: 10px 4px 4px; height: 100px;}
.code-box .blockcode {grid-area: 2 / 1 / 3 / 2; border-radius: 20px; padding: 0 6px;}
.code-box strong.legend {grid-area: 1 / 1 / 2 / 2; text-align: center; font-size: 1.4rem; position: relative; font-family: 'ralewayregular';}
.punbb #tags .container {height: 220px; overflow: auto; padding: 5px 15px; top: auto; margin-top: 6px; border-end-start-radius: 22px; border-end-end-radius: 22px;}
.quote-box.spoiler-box p {margin: 0;}

/*иконки*/
#pun-index div.icon {position: absolute; left: -20px;}
#pun-searchtopics div.icon, #pun-messages div.icon, #pun-viewforum div.icon {display: none;}
div.icon {margin-top: 5px; height: 15px; width: 32px; border-start-end-radius: 8px; border-end-end-radius: 8px;}

/*реклама яндекс*/
#yandex_rtb_R-A-1623045-3 {box-sizing: border-box;}

/* сокрытие элементов */
th.tcl, th.tc2, th.tc3, th.tcr, #pun-live-rusff, ul li.pa-ua, .linksb .postlink.long, #pun-navlinks h2, #pun-ulinks h2, #pun-status h2, .pa-gifts, #pun-userlist thead, #pun-messages thead, #title-logo-tbody, li#navawards, #pun-index .category thead tr, #post-form h2, .topic a.sharelink, .topic li.pl-reports, form#post fieldset legend span, #viewprofile-next #profilenav, .formal h2, #profile small#plng, #pun-announcement h2, .fa-heart:before, #pun-index .category .tc2, #pun-index .category .tc3, #pun-main #s-block {display: none;}

/* разное */
fieldset legend {font-family: 'ralewayregular'; display: flex; width: 100%; justify-content: center;}
.punbb .inline .inputfield, .punbb .inline .selectfield, .punbb .inline .passfield {float: left; margin-right: 1em;}
.punbb .fs-box p, .punbb .fs-box fieldset {padding: 4px 14px 4px 0;}
.punbb .inline .infofield {clear: both;}
.post-box .post-content td {border: 0px!important; vertical-align: top;}
.main.multipage .post-box .post-content tr:hover {animation: none;}
li.pl-delete, li.pl-edit, li.pl-quote {float: right;}
.post-sig p {margin-top: 10px;}
#form-buttons table, .punbb .formal textarea {box-sizing: border-box;}

/* админка */
a#award-create {position: relative; z-index: 100;}
.punbb-admin .adformal {border-width: 0 0 0 0;}
.punbb-admin .admin-advert-block { width: 800px; height: auto; position: relative; top: -100px; left: 250px; text-align: center; display: flex; justify-content: space-evenly; flex-direction: column;}
.punbb-admin .adformal h2, .punbb-admin #pun-adnav h2 {padding: 10px; text-transform: lowercase; border: 0; text-align: center; font-size: 1.05rem!important; position: relative; top: -15px; text-transform: uppercase; font-family: 'attack_typeregular'; border-radius: 18px;}
.punbb-admin .adformal h2:after, .punbb-admin #pun-adnav h2:after { position: absolute; display: block; content: ""; height: 38px; margin-left: -4px; margin-top: -26px;}
.punbb-admin .adformal h2:after {width: 674px;}
.punbb-admin #pun-adnav h2:after {width: 172px;}
.punbb-admin .adcontainer {border:0; margin: 10px 0;}
.punbb-admin .adminmain, .punbb-admin .adcontainer fieldset {border-radius: 18px;}
.punbb #pun-admain legend span {width: 50%; text-align: center;  padding: 4px;    border-radius: 18px;}
.punbb-admin #pun-admain input {padding: 2px 10px;}


/* доработки */
.section.online-list tr {line-height: 30px;}
#pun-online .section.online-list td.tcl.username {}
#pun-online .section.online-list .tcl.action {text-align: center;}
#pun-online .section.online-list td.tc3 {text-align: end;}
.post-content p {margin: 15px 0; overflow-x: hidden;}
.post-links ul li.pl-share {float: left; display: none;}
dd {border-top: 1px solid var(--special-border-color);}
p.lastedit {display: none;}
.section.online-list {position: relative; border-radius: 18px; padding: 10px 0; margin-bottom: 35px; color: var(--special-border-color); background: var(--special-color); border: 1px solid var(--special-border-color);}
.online-list tr td {padding: 10px 5px;}
.online-list tr td {border-bottom: 1px solid var(--special-border-color);}
.online-list tr:last-child td {border:none;}
.post-content .spoiler-box {grid-template-columns: 100%;}
fieldset#post-preview {text-align: left; text-transform: math-auto;}
fieldset#post-preview p {margin: 15px 0;}
#main-reply {font-family: auto;}

/* баннеры */
#html-footer {position: relative;}
#banners { position: absolute; top: 29px; display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; height: 39px; padding-right: 5px; overflow: auto;}
#banners img { transition: .3s all ease-in-out; opacity: .3;}
#banners img:hover { opacity: 1;}




0


Вы здесь » тест лихой запад » Новый форум » Гостевая


Рейтинг форумов | Создать форум бесплатно