06.12. Вы представлете: мы уже ШЕСТЬ ЛЕТ лижем кувалду на морозе! С Днём Рождения, Ван!

    06.11. 71й месяц игры (и когда мы уже начнем считать в годах?) несет нам: новый дизайн (~ehehe), новые цитаты, новые сюжеты и новый день рождения форума! 🎉

    03.10. Октябрь у нас будет не только предвестником Хэллоуина, но и семидесятым месяцем игры 🎃

    03.10. ...спешим спросить у Сыча всё то, что заставит его пожалеть о том, что он с нами! 😜 + голосуем за того, кого допросим следующим!

    25.09. ...не забываем кошмарить Коула каверзными (ну или какими получится) вопросами! 😊 + голосуем за следующего на допрос!

    06.09. Интересной дате — интересные 69 месяцев игры 😏

    06.08. а 68 месяцев игры не хотите?

    06.07. 67-ой месяц за плечами, а впереди - Создатель знает сколько!

    06.06. 66-ой месяц застал нас в начале лета, уставшими, но живыми. Заряжаемся солнечным теплом и набираемся сил <3

    12.05. Переход форума в камерный режим

    06.05. А мы уже 65 месяцев шатаем Тедас!

    календарь
    зима 1. Зимоход — Верименсис
    2. Страж — Плуитанис весна 3. Драконис — Нубулис
    4. Облачник — Элувиеста
    5. Волноцвет — Молиорис лето 6. Джустиниан — Фервентис
    7. Утешник — Солис
    8. Август — Матриналис осень 9. Царепуть — Парвулис
    10. Жнивень — Фрументум
    11. Первопад — Умбралисс зима 12. Харинг — Кассус

    At Origin

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

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


    Вы здесь » At Origin » Новый форум » css


    css

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

    1

    [code]@import url(style_cs.css);

    @import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/v4-font-face.min.css');
    @import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/fontawesome.min.css');

    /* используются в дизайне */
    @import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700|Open+Sans:400,400i,600,600i,700,700i,800,800i|Roboto:100,300,400,700,900');
    @import url('https://fonts.googleapis.com/css2?family=Alice&family=Philosopher:ital,wght@0,400;0,700;1,400;1,700&display=swap');

    :root {
      --base-bg: #15140F;
      --sideleft: url(https://forumstatic.ru/files/001b/6b/7e/76768.jpg);
      --sideright: url(https://forumstatic.ru/files/001b/6b/7e/99067.jpg);

      --rshadow: -20px 0px 25px rgba(0, 0, 0, 0.51);
      --lshadow: 20px 0px 25px rgba(0, 0, 0, 0.51);

      --stroke: #332117;
      --pun1: url(https://forumstatic.ru/files/001b/6b/7e/71590.png);
      --pun2: url(https://forumstatic.ru/files/001b/6b/7e/57879.jpg);
      --pun3: url(https://forumstatic.ru/files/001b/6b/7e/97022.png);
      --decright: url(https://forumstatic.ru/files/001b/6b/7e/82484.png);
      --decleft: url(https://forumstatic.ru/files/001b/6b/7e/35374.png);
      --blood: url(https://forumstatic.ru/files/001b/6b/7e/14012.svg);
      --drop: url(https://forumstatic.ru/files/001b/6b/7e/13728.svg);
      --pun: #BAB6A0;

      --head-s1: #1C120D;
      --head-s2: #162A2F;
      --head: url(https://forumstatic.ru/files/001b/6b/7e/50414.png);
      --news-bg: rgba(62, 90, 97, 0.1);
      --news-b: #162A2F;

      --text1: #2D221F;
      --links: #335267;
      --text2: #CDC7B0;
      --links2: #0790B5;

      --borders: #9F957C;

      --cover1: #B2AE98;
      --cover2: rgba(169, 160, 139, 0.1);
      --cover3: #B0A996;

      --icon: url(https://forumstatic.ru/files/001b/6b/7e/58281.svg);

      --old: url(https://forumstatic.ru/files/001b/6b/7e/54061.png);
      --new: url(https://forumstatic.ru/files/001b/6b/7e/73827.png);
      --imp: url(https://forumstatic.ru/files/001b/6b/7e/26844.png);
      --close: url(https://forumstatic.ru/files/001b/6b/7e/69355.png);

      --on: url(https://forumstatic.ru/files/001b/6b/7e/36861.png);
      --off: url(https://forumstatic.ru/files/001b/6b/7e/61953.png);

      --btns: #446378;

      --td-bg-head: #335267;
      --td-bg-cover: #B2AC95;
      --td-episode-bg: #B0A78E;
    }

    @font-face {
      font-family: 'Accia';
      font-style: normal;
      font-weight: 300;
      src: url(https://forumstatic.ru/files/001b/6b/7e/31938.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: italic;
      font-weight: 300;
      src: url(https://forumstatic.ru/files/001b/6b/7e/43354.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: normal;
      font-weight: 400;
      src: url(https://forumstatic.ru/files/001b/6b/7e/36694.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: italic;
      font-weight: 400;
      src: url(https://forumstatic.ru/files/001b/6b/7e/58812.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: normal;
      font-weight: 500;
      src: url(https://forumstatic.ru/files/001b/6b/7e/37760.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: italic;
      font-weight: 500;
      src: url(https://forumstatic.ru/files/001b/6b/7e/16041.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: normal;
      font-weight: 600;
      src: url(https://forumstatic.ru/files/001b/6b/7e/86302.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: italic;
      font-weight: 600;
      src: url(https://forumstatic.ru/files/001b/6b/7e/16041.ttf?v=1);
    }

    @font-face {
      font-family: 'Accia';
      font-style: normal;
      font-weight: 700;
      src: url(https://forumstatic.ru/files/001b/6b/7e/15910.ttf);
    }

    @font-face {
      font-family: 'Accia';
      font-style: italic;
      font-weight: 700;
      src: url(https://forumstatic.ru/files/001b/6b/7e/60781.ttf);
    }

    /* A2 Deal with browser defaults and wonkiness
    -------------------------------------------------------------*/

    /* A2.1 */
    html, body {margin: 0; padding: 0}

    /* A2.2 */
    .punbb * {
      margin: 0px
      }

    /* A2.3 */
    .punbb ul, .punbb dl, .punbb li, .punbb dd, .punbb dt {
      padding: 0;
      list-style: none;
      }

    /* A2.4 */
    .punbb img {
      border:none
      }

    /* A2.5 */
    .punbb .main table {
      table-layout: fixed;
      width: 100%;
      }

    /* A2.6 */
    .checkfield input[type="checkbox"], .radiofield input[type="radio"] {margin: 0 0.3em;}

    /* A2.7 */
    p[class="checkfield"] *,
    div[class="checkfield"] *,
    fieldset[class="radiofield"] * {
      height: auto;
      vertical-align: middle
      }

    /* A3 Text setup
    -------------------------------------------------------------*/

    /* A3.1 */
    body {
      font-size: 100.01%;
      }

    /* A3.2 */
    .punbb {
      font: normal 70%  verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
      }

    /* 3.3 */
    .punbb textarea, .punbb input, .punbb select, .punbb optgroup {
      font: 1em  verdana, arial, helvetica, sans-serif
      }

    /* A3.4 */
    .punbb h1, .punbb h2, .punbb h3 {
      font-size: 1em;
      font-weight: bold;
      }

    .punbb th   {
      font-size: 0.9em;
      font-weight: bold;
      }
    .punbb h4, .punbb table {
      font-size: 1em;
      font-weight: normal;
      }

    /* A3.5 */
    .punbb h1 span, .punbb h2 span, .punbb legend span {
      font-size: 1.1em;
      }

    /* A3.6 */
    .punbb pre {
      font: 1.1em/140% verdana, arial, monaco, "bitstream vera sans mono", "courier new", courier, monospace
      }

    /* A3.7 */
    .punbb address, .punbb em {
      font-style: normal
      }

    /* A3.8 */
    .punbb .post-content em {
      font-style: italic
      }

    /* A3.9 */
    .punbb .post-content em.bbuline {
      font-style: normal;
      text-decoration: underline;
      }

    /* A3.10 */
    .punbb a {
      text-decoration: underline
      }

    /* A3.11 */
    .punbb optgroup {
      font-weight: bold;
      }

    /* A4 Float clearing and hidden items
    -------------------------------------------------------------*/

    /* A4.1 */
    #pun:after,
    .punbb .container:after,
    .punbb .post-links ul:after,
    .punbb .main div.inline:after,
    .punbb dl.post-sig dt span,
    .punbb .post-box:after,
    .punbb .linksb:after {
      clear: both;
      content: ".";
      display: block;
      height: 0;
      visibility: hidden;
      overflow:hidden;
      line-height: 0.0;
      font-size: 0;
      }

    /* A4.2 */
    .acchide,
    #pun-ulinks h2,
    #pun-index #pun-main h1,
    #pun-navlinks h2,
    #pun-pagelinks h2,
    #pun-status 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 {
      font-size: 0;
      height: 0;
      width: 0;
      line-height: 0.0;
      position:absolute;
      left: -9999px;
      overflow: hidden
      }

    /* A5 Basic page layout and borders
    -------------------------------------------------------------*/
    /* A5.1 */
    #pun {
        background:
          var(--blood) no-repeat bottom left,
          var(--drop) no-repeat right 69px,
          var(--decleft) no-repeat top left,
          var(--decright) no-repeat bottom right,
          var(--pun1) no-repeat left 69px,
          var(--pun3) no-repeat bottom,
          var(--pun) var(--pun2);
      background-blend-mode: multiply, overlay, soft-light, soft-light, normal, normal, normal, normal;
        margin: auto;
        width: 1098px;
      box-sizing: border-box;
        margin-top: 296px !important;
      margin-bottom: 70px;
      position: relative;
      box-shadow: 0 0 0 1px var(--stroke) inset;
    }

    .punbb {
      padding: 30px 60px;
    }

    /* лишнее */
    h1.title-logo, #pun-navlinks h2, #pun-ulinks h2, #pun-status h2, #pun-crumbs1 strong, #pun-crumbs2 strong, thead, th, #pun-crumbs1 .container strong+em,
    #pun-crumbs2 .container strong+em, #pun-index #pun-main h1, .stickytext, .closedatafield, #pun-live-rusff, .pl-reports, td .modlist, li#navawards, .pa-gifts,
    .acchide, .forum h2, .usertable h2, .topic h2, a.sharelink, #pun .pa-ua, .pa-author img, .lastedit,
    fieldset legend, #pun .pl-reports, #pun .mini_gifts, #pun-userlist .main h2, #pun-search .main h1,
    #profilenav h2, #profile-gifts, #messages li.pl-email, #pun .email, .catleft, .catright, #pun .pl-share,
    p.inputfield label em, p.selectfield label em, p.passfield label em, #pun-announcement h2 {
      display: none
    }

    .punbb {
      height: auto;
    }

    #pun { 
      color: var(--text1);
    }

    #pun a {
      color: var(--links)
    }

    #pun a:hover {
      color: var(--text1)
    }

    /* A5.3 */
    #pun-redirect, #pun-maint {
      margin: 50px 20% 12px 20%;
      width: auto;
      float: none;
    min-height: 100px;
      }

    #pun-redirect{
          border:0 none!important;
          margin:0;
          padding:0;
          left:0;right:0;
          top:0;bottom:0;
          position:fixed;
          width:100%;
          height:100%;
          text-align:center;
        background: var(--base-bg) !important;
        }
    #pun-redirect #pun-main {
      background: transparent;
    }
        #pun-redirect *{
          border:0 none;
        }
        #pun-redirect .main-title {
          display:none;
        }
        #pun-redirect.punbb .info .container{
          text-align:center;
          font:400 13px philosopher;
          display:inline-block;
          margin: 0 auto;
          width:auto;
          padding:120px 0px;
          height:auto;
              background:
          var(--blood) no-repeat bottom left,
          var(--drop) no-repeat right top,
          var(--decleft) no-repeat top left,
          var(--decright) no-repeat bottom right,
          var(--pun1) no-repeat left top,
          var(--pun3) no-repeat bottom,
          var(--pun) var(--pun2);
      background-blend-mode: multiply, overlay, soft-light, soft-light, normal, normal, normal, normal;
          width: 1098px;
          margin-top: 50px
        }

    /* A5.4 */
    .punbb .section, .punbb .main {
      margin-bottom: 1em;
      }

    /* A5.5 */
    .punbb .category, .punbb .post {
      margin-top: 0.4em;
    position: relative
      }

    /* A5.6 */
    .punbb #pun-category1, .punbb .toppost, .punbb .topicpost {
      margin-top: 0;
      }

    /* 5.7 */
    #pun-post .topic {
      margin-top: 1em;
      }

    /* A5.8 */
    .punbb .section, .punbb .forum, .punbb .formal, .punbb .modmenu, .punbb .info,
    .punbb .category, .punbb .post {
      border-style: none none solid none;
      border-width: 0px 0px 2px 0px;
      }

    /* A5.9 */
    .punbb .container {
      border-style: solid;
      border-width: 1px;
      }

    /***************************************************/*************************************************************
    B - MAIN CONTENT - GENERAL
    **************************************************************/

    /* B1 Parsed Content, Signatures and Scroll Boxes
    -------------------------------------------------------------*/

    /* B1.1 */
    .punbb .post-content {
      padding: 0;
      margin: 0;
      width: 100%;
      overflow: hidden;
      }

    /* B1.2 */
    .punbb .post-sig dt {
        border: none;
        background: var(--borders);
      height: 1px;
        display: block;
        margin: 5px auto 15px;
        width: 80%;
    }

    /* B1.3 */
    .punbb .post-content p {
      margin: 0;
      padding: 0 0 1em 0;
      line-height: 150%;
    font-family: 'Verdana', sans-serif; 
    font-size: 1em
    }

    /* B1.4 */
    .punbb .post-content img {
      vertical-align: text-top
      }

    /* B1.5 */
    .punbb .post-content img.postimg {
      vertical-align: middle;
      }

    /* B1.6 */
    .punbb .post-content .blockcode, .punbb .post-content blockquote {
      width: 100%;
      overflow: visible;
      }

    /* B1.7 */
    .punbb .post-content .scrollbox {
      width: 100%;
      overflow: auto;
      height: auto !important;
      max-height: 200px
      }

    /* B1.8 */
    .punbb .post-content .quote-box, .punbb .post-content .code-box {
        border: medium none;
        margin: 0.4em 0em 0.8em;
        padding: 0em;
    }

    /* B1.9 */
    .punbb .quote-box cite, .punbb .code-box strong.legend {
        display: block;
        font-size: 1.1em;
        font-style: normal;
        font-weight: bold;
        margin: 0;
        padding-bottom: 0.0em;
    }

    /* B2 Information boxes
    -------------------------------------------------------------*/

    /* B2.1 */
    .punbb .info-box {
      padding: 1.1em 1.7em 1em 1.7em;
      border-style: solid;
      border-width: 1px;
      margin: 0 0 1.1em 0;
      }

    /* B2.2 */
    .punbb .info-box * {
      padding: 0 0 0.7em 0;
      }

    /* B2.3 */
    .punbb #pun-main .info-box .legend {
      font-size: 1.1em;
      font-weight: bold;
      }

    /* B3 Pagination and posting links
    -------------------------------------------------------------*/

    /* B3.1 */
    .punbb .linkst {
      width: auto;
      height: auto;
      font: 400 11px Accia;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 8px 60px 8px;
      margin: 10px -60px 0 !important;
      position: relative;
      z-index: 9;
      background: rgba(104, 76, 52, 0.1);
      border-width: 1px 0px;
      border-style: solid;
      border-color: rgba(104, 76, 52, 0.15);
      }

    /* B3.4 */
    .linkst .postlink, .linksb .postlink {
      text-align: right;
      font-weight: 700;
      }

    /* B3.5 */
    .punbb .linksb {
      width: auto;
      height: auto;
      font: 400 11px Accia;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 8px 60px 8px;
      margin: 10px -60px 0 !important;
      position: relative;
      z-index: 9;
      background: rgba(104, 76, 52, 0.1);
      border-width: 1px 0px;
      border-style: solid;
      border-color: rgba(104, 76, 52, 0.15);
      }

    .linksb {
      height: auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: auto;
    }

    #profile .button {
      margin-top: 0 !important;
    }

    #profile .clearer {
      display: none
    }

    #profile .linksb:after, .linksb:after {
      display: none !important;
    }

    .postlink span + span {
      margin-left: 10px
    }

    /* B3.6 */
    .linksb .pagelink {
      float: left;
      width: auto;
      text-align: left;
      order: 1
      }

    /* B3.7 */
    .linksb .postlink,.linksb noindex {
      width: auto;
      order: 3;
      position: relative
      }

    .subscribelink {
      position: relative;
      order: 2;
      text-align: center;
      }

    /*************************************************************
    C - MAIN CONTENT - SPECIFIC
    **************************************************************/

    /* C1 Form layout
    -------------------------------------------------------------*/

    /* C1.1 */
    .punbb .formal .container {
      padding: 1.7em 2.3em 1.1em 2.3em;
      }

    #post.container {
      padding: 1em 0 !important;
    }

    /* C1.2 */
    .punbb .formsubmit {
      padding: 0 0 0 0em;
      margin: 1em 0 0 0;
      }

    /* C1.3 */
    .punbb .formsubmit input, .punbb .formsubmit a, .punbb .formsubmit span {
      margin: 0 0.6em 0 0
      }

    /* C1.4 */
    .punbb fieldset {
      border-style: solid;
      border-width: 1px;
      padding: 0 0px 0 0px;
      margin: 0 0 1em 0
      }

    /* C1.5 */
    .punbb fieldset legend {
      padding: 0;
      margin: 0 0 0 11px;
      font-size: 1.1em
      }

    /* C1.6 */
    .punbb fieldset legend span {
      padding: 0 5px;
      margin: 0 0 0 -15px;
      }

    /* C1.7 */
    .punbb fieldset fieldset {
      border-style: none;
      margin: 0;
      padding: 0 0 8px 0
      }

    /* C1.8 */
    .punbb .fs-box {
      padding: 1em 0 0.8em 0;
      }

    /* C1.9 */
    .punbb .fs-box p, .punbb .fs-box fieldset {
      padding: 0 0 1.5em 0
      }

    /* C1.10 */
    .punbb .inline .inputfield, .punbb .inline .selectfield, .punbb .inline .passfield {
      float: left;
      margin-right: 1em;
      }

    /* C1.11 */
    .punbb .inline .infofield {
      clear:both
      }

    /* C1.12 */
    .punbb .datafield br {
      display: none
      }

    /* C1.13 */
    .punbb .required label, .punbb .datafield span.input {
      font-weight: bold
      }

    /* C1.14 */
    .punbb .datafield span.input a {
      font-weight: normal;
      }

    /* C1.15 */
    .punbb .areafield span.input, .punbb p.longinput span.input {
      display: block;
      padding: 0 4em 0 0;
      height: 100%; /* For IE */
      }

    /* C1.16 */
    .punbb textarea, .punbb .longinput input {
      width: 64%;
      margin: 0;
      }

    /* C1.17 */
    .punbb .hashelp {
      position: relative;
      }

    /* C1.18 */
    .punbb .helplinks {
      display: block;
      position: absolute;
      top: 1em;
      right: 0;
      font-weight: normal;
      width: 36%;
      }

    /* c1.19 */
    .punbb #profile .helplinks {
      top: 1.5em;
      }

    /* C1.20 */
    .punbb .helplinks span {
      display: block;
      padding-bottom: 0.2em;
      }

    .punbb .helplinks span INPUT {
      margin: 0px 2px 2px 0px;
    }

    /* C1.21 */
    #pun-post .formal .info-box li {
      padding-left: 4px;
      list-style-type: square;
      list-style-position: inside;
      line-height: 1.5;
      margin: 0;
      }

    /* C2 Table layout
    -------------------------------------------------------------*/

    /* C2.1 */
    .punbb .main .tcl {
    /*  overflow: hidden;*/
      text-align: left;
      width: 35%;
      }

    /* C2.2 */
    .punbb .main .tc2, .punbb .main .tc3, .punbb .main .tcmod {
        text-align: center;
        width: 6%;
    }

    /* C2.3 */
    .punbb .main .tcr {
        overflow: hidden;
        text-align: left;
        width: 27%;
    }

    /* C2.4 */
    #pun-userlist .main .tcl,
    #pun-searchtopics .main .tcl,
    #pun-modviewforum .main .tcl {
      width: 40%
      }

    /* C2.5 */
    #pun-userlist .main .tc2,
    #pun-searchtopics .main .tc2 {
      text-align: left;
      width: 20%;
      }

    /* C2.6 */
    #pun-debug table .tcl {
      width: 15%;
      white-space:normal;
      }

    /* C2.7 */
    #pun-debug .tcr {
      width: 90%;
      white-space: normal;
      }

    /* C2.8 */
    #pun-index .tcl h3 {
      font-size: 1.2em;
      font-weight: bold;
      }

    /* C2.9 */
    .punbb td span.youposted {
      font-weight: bold;
      margin-left: -1em;
      position: absolute;
      }

    /* C2.10 */
    .punbb td .modlist {
      display: none;
      padding-top: 0.3em
      }

    /* C2.11 */
    .punbb .main td {
      border-style: solid none none solid;
      border-width: 1px 0 0 1px;
      padding: 0.9em 0em;
      }

    /* C2.12 */
    .punbb .main th {
      border-style: none none none solid;
      border-width: 0 0 0 1px;
      padding: 0.4em 1em 0.4em 1em;
      }

    /* C2.13 */
    .punbb .main .tcl {
      border-left-style: none;
      border-left-width: 0;
      }

    * html .tclcon {height: 1px}

    /* C2.14 */
    .punbb td div.tclcon {
        font-size: 11px;
        line-height: 150%;
        margin-left: 0;
        text-align: left;
    }

    /* C3 Topics
    -------------------------------------------------------------*/

    /* C3.1 */
    .punbb .post .container {
      border-style: none solid solid solid;
      border-width: 0px;
      margin-top: 0px;
      padding-bottom: 1px;
      }

    /* C3.2 */
    .punbb .post .container {
      border-style: none solid solid solid;
      border-width: 0px;
      margin-top: 0px;
      padding-bottom: 1px;
      }

    /* C3.2 */
    .punbb .post h3 {
      border-width: 0px;
    -webkit-text-size-adjust: 100%;
      width: auto;
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font: 600 italic 12px Accia;
      top: 15px;
      z-index: 1
      }

    .post h3 span {
      display: inline-flex !important;
      justify-content: flex-start;
      align-items: center;
      gap: 0;
       margin-left: 220px;
      flex-wrap: wrap;
      background: linear-gradient(90deg, rgba(104, 76, 52, 0.15) 26.04%, rgba(104, 76, 52, 0) 100%);
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-image: linear-gradient(to right, rgba(104, 76, 52, .25) 0%, rgba(104, 76, 52, 0) 100%) 1 round;
      border-top-width: 1px;
      border-top-style: solid;
      height: 25px;
      padding: 0px 100px 0px 40px
    }

    .post h3 span a, .post h3 strong {
      font-weight: 500;
      line-height: 26px;
      box-sizing: border-box;
    }

    .post h3 strong {
      order: 2
    }

    .post.topicpost {
      margin-top: -50px !important;
    }

    .post.endpost {
      margin-bottom: 10px
    }
    .post h3 span strong:before {
      content: ", #"
    }

    .post {
      padding-top: 70px !important;
      margin-top: -45px !important;
    }

    /* C3.5 */
    .punbb .post .post-author {
      float: left;
      }

    /* C3.6 */
    .punbb .post .post-author ul, .punbb .post .post-author p {
      line-height: 140%;
      }

    /* C3.7 */
    .pa-author {
      font-size: 1.1em;
      font-weight: bold;
      }

    /* C3.8 */
    .pa-author a {
      text-decoration: none
      }

    /* C3.9 */
    li.pa-title {
      padding-bottom: 0.4em;
      font-weight: bold;
      }

    li.pa-online {
      line-height: 0.8em;
      border-left-style: solid;
      border-left-width: 0.7em;
      padding-left: 0.4em;
      margin-top: 0.7em;
      }

    /* C3.11 */
    .punbb .post-body {
      margin-left: 260px;
      border-left-style: solid;
      border-left-width: 1px;
      padding: 0 0 1px 0;
      }

    /* C3.12 */
    .punbb .post-box {
      padding: 40px 0 1em;
      }

    /*C3.13 */
    .punbb fieldset .post-box {
      margin-bottom: 0.8em;
      }

    /* C3.14 */
    .punbb .post-links {
      margin-left: 0em;
      border-left-style: solid;
      border-left-width: 1px;
      position: relative;
      z-index: 9
      }

    /* C3.15 */
    .post-links {
      margin-top: 10px;
    }

    .post-links ul {
    text-align: right;
    }

    .post-links li {
      display: inline;
    }

    .profile, .pm, .email {
      float: left
    }

    .post-links li + li {
      margin-left: 10px
    }

    .punbb .post-links ul li:first-child {
      margin-left: 0
    }

    .endpost .post-links ul {
      border: 0 !important;
    }

    #pun .post-links ul a {
      background: rgba(104, 76, 52, 0.1);
      border: 1px solid rgba(104, 76, 52, 0.15);
      border-radius: 3px;
      font: 600 11px Accia;
      padding: 3px 15px
    }

    #pun .post-links ul a {
      color: var(--text1)
    }

    #pun .post-links ul a:hover {
      color: var(--links)
    }

    /* C3.17 */
    .pl-email, .pl-website {
      float: left;
      }

    /* C3.18 */
    .punbb .clearer {
      clear: both;
      height: 0;
      font-size: 0;
      }

    /* C4 Moderator menu
    -------------------------------------------------------------*/

    /* C4.1 */
    .punbb .modmenu .container {
      padding: 0px 0px 0;
      text-align: right;
      margin-top: 4px;
      font: 600 11px Accia !important;
      }

    .forum {
      padding: 10px 0
    }

    #topic-modmenu {
      padding-bottom: 5px
    }

    /* C4.2 */
    .punbb .modmenu strong, .punbb .modmenu a {
      height: 1.8em;
      line-height: 1.8em;
      }

    /* C4.3 */
    .punbb .modmenu .container strong {
      float: left;
      }

    /* C4.4 */
    .punbb .modmenu input {
      margin-left: 1em;
      }

    /* C5 Message boxes
    -------------------------------------------------------------*/

    /* C5.1 */
    .punbb .info .container {
      padding: 0.8em 1em
      }

    /* C5.2 */
    .punbb .info .container .backlink {
      padding-top: 0.8em;
      }

    /* C6 Profile
    -------------------------------------------------------------*/

    /* C6.1 */
    #profile .container {
      padding-left: 18.6em;
      }

    /* C6.2 */
    #profilenav {
      float: left;
      width: 14em;
      margin-left: -18.7em;
      display: inline;
      }

    /* C6.3 */
    #profilenav li {
      padding-bottom: 0.8em;
      font-weight: normal;
      }

    /* C6.4 */
    #viewprofile ul, #profilenav ul {
      border-style: solid;
      border-width: 1px;
      padding: 1.5em 18px 0.8em 18px;
      margin: 0 0 1em 0;
      }

    /* C6.5 */
    #viewprofile h2, #profilenav h2 {
      padding: 3px 0 0 10px;
      margin: 0 14px -0.6em 14px;
      text-align: center !important;
      }

    /* C6.6 */
    #viewprofile h2 span, #profilenav h2 span {
      padding: 0 5px;
      position: relative;
      }

    /* C6.7 */
    #viewprofile li, #setmods dl {
      padding: 0 0 0 16em;
      margin-bottom: 0.2em;
      }

    /* C6.8 */
    #viewprofile li span {
      float: left;
      width: 14em;
      margin-left: -16em;
      padding: 0.5em 1em;
      font-weight: normal;
      }

    /*C6.9 */
    #setmods dt {
      float: left;
      width: 14em;
      margin-left: -16em;
      padding: 0.8em 1em;
      font-weight: bold;
      display: inline;
      }

    /* C6.10 */
    #viewprofile li strong, #viewprofile li div, #setmods dd {
      display: block;
      padding: 0.5em 1em;
      font-weight: normal;
      }

    /* C6.11 */
    .punbb img.avatardemo {
      float: right;
      margin: 0 0 0.8em 1.8em
      }

    /* C7 User list
    -------------------------------------------------------------*/

    /* C7.1 */
    #pun-userlist .formal, #pun-userlist .formal .container {
      border-bottom: none;
      margin-bottom: 0;
      }

    /* C7.2 */
    #pun-userlist .usertable .container {
      padding: 0 2.3em 2.3em 2.3em;
      border-top: none;
      }

    /* C7.3 */
    #pun-userlist .usertable table {
      border-style: solid;
      border-width: 1px;
      }

    /***************************************************/*************************************************************
    D - PUNBB SECTIONS OTHER THAN MAIN CONTENT
    **************************************************************/

    /* D1 Logo and description
    -------------------------------------------------------------*/

    /* D1.1 */
    #pun-title {
      margin: 0;
      border: none;
      margin-bottom: -35px;
    }

    /* D1.2 */
    #pun-title h1 {
      display : block;
      height: 10px;
      margin: -1px 0px 0px -30px;
    }

    /* D1.3 */
    #pun-title .container {
      border: none ;
      padding: 0.2em 1em 0.8em 1em;
      }

    /* D1.4 */
    #pun-title h1 span {
      display: none;
    }

    #pun-title TD.title-logo-tdl {
      border: none;
      width: 100%;
    }

    #pun-title TD.title-logo-tdr {
    border: none;
    width: 420px;
    }

    /* D2 Page navigation
    -------------------------------------------------------------*/

    /* D2.1 */
    #pun-pagelinks {
      position: absolute;
      top: -15px;
      left: 0;
      margin: 0;
      border: none;
      padding-left: -20px;
      width: 100%;
      }

    /* D2.2 */
    #pun-pagelinks .container {
      background: transparent;
      border: none;
      padding: 0}

    /* D2.3 */
    #pun-pagelinks .container li {
      display: inline
      }

    /* D2.4 */
    #pun-pagelinks li a, #pun-pagelinks a:link, #pun-pagelinks a:hover {
      height: 2em;
      line-height: 2em;
      padding: 0;
      font-size: 1.2em;
      margin-left: -9999px;
      display: block;
      float:left;
      width: 100%;
      }

    /* D2.5 */
    #pun-pagelinks a:active, #pun-pagelinks a:focus {
      position:relative;
      margin: 0;
      }

    #pun-pagelinks li a span {
      display:block;
      margin: 0 1em
      }

    /* D3 Forum navigation
    -------------------------------------------------------------*/

    /* D3.1 */
    #pun-navlinks {
      border: none;
      margin: 0;
    }

    #pun-navlinks .container {
      border: none;
      margin: 0;
      }

    /* D3.2 */
    #pun-navlinks .container {
      font-weight: normal;
    }

    /* D.3 */
    #pun-navlinks li {
      display: inline;
      margin: 0;
    }

    /* D3.4 */
    #pun-navlinks li a {
        font-family: tahoma;
        font-size: 0.8em;
        padding: 10px 5px 10px 7px;
    }

    /* D4 User links
    -------------------------------------------------------------*/

    /* D4.1 */
    #pun-ulinks {
        border: none;
    }
    #pun-ulinks .container {
    }
    #pun-ulinks li, #pun-ulinks li a {
        display: inline;
        white-space: nowrap;
    }
    #pun-ulinks li a {
        font-size: 0.8em;
        padding: 0 0 0 5px;
    }

    /* D5 Welcome box and Top Breadcrumbs
    -------------------------------------------------------------*/

    /* D5.1 */
    #pun-status, #pun-status .container {
      border-bottom: none;
      margin-bottom: 0;
      }

    #pun-status {
      background:
        url(https://forumstatic.ru/files/001b/6b/7e/26421.png) no-repeat top,
        url(https://forumstatic.ru/files/001b/6b/7e/45695.png) no-repeat center 5px;
      position: fixed;
      top: 0;
      width: 1098px;
      margin-left: -60px !important;
      color: var(--text2);
      height: 46px;
      box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.44);
      display: flex;
      align-items: center;
      z-index: 0
    }

    #pun-status:after {
      content: "";
      background: url(https://forumstatic.ru/files/001b/6b/7e/36674.png);
      width: 13px;
      height: 32px;
      position: absolute;
      left: 0;
      top: 27px;
    }

    #pun-status:before {
      content: "";
      background: url(https://forumstatic.ru/files/001b/6b/7e/24603.png);
      width: 13px;
      height: 32px;
      position: absolute;
      right: 0;
      top: 27px;
    }

    #pun-status a {
      color: var(--links2)
    }

    #pun-status a:hover {
      color: var(--text2)
    }

    /* D5.2 */
    #pun-status .container {
    text-align: left;
      font: 300 12px Accia;
      padding: 0 20px
    }

    #pun-status .container strong {
      font-weight: 300 !important;
    }

    #pun-status .status-right {
      float: none !important;
    }

    #pun-status .item3 {
      margin-left: 10px !important;
    }

    /* D5.3 */
    #pun-status span {
      white-space: pre-line;
      margin-right: 0.5em;
      }

    /* D5.4 */
    #pun-crumbs1 {
      font-weight: bold;
      overflow: hidden;
      margin-top: 15px;
    position: relative
      }

    /* D5.5 */
    #pun-crumbs1 p.container {
      border-top: none;
      }

    /* D5.6 */
    #pun-break1 {
      margin: 0 1em;
      border-style: solid none;
      border-width: 1px 0;
      height: 0;
      margin: -2px 1em;
      position: relative;
      z-index: 1;
      }

    /* D6 Announcement
    -------------------------------------------------------------*/

    /* D6.1 */
    #pun-announcement h2 {
      padding: 0;
      margin: 0 1em -3.5em 1em;
      border-style: none none solid none;
      border-width: 0 0 1px 0;
      position: relative;
      font-weight: bold;
    display: none
      }

    /* D6.2 */
    #pun-announcement h2 span {
      display: block;
      padding: 1em 0 0.8em 0;
      border-bottom-style: solid;
      border-bottom-width: 1px;
      }

    /* D6.3 */
    #pun-announcement .container {
      padding: 0;
      margin-bottom: 10px;
    text-align: center;
      }

    /* D7 Statistics
    -------------------------------------------------------------*/
    /* D7.1 */
    #pun-stats {
      padding: 0px 60px 0;
      margin: 60px -60px 30px !important;
      height: auto;
      position: relative;
      text-align: left;
      gap: 15px;
      color: #614937;
    }

    #pun-stats h2 {
      margin: 0px -60px 30px !important;
      height: auto;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      position: relative;
      text-align: center;
      gap: 0;
      color: #614937;
      height: auto;
    }

    #pun-stats h2:before, #pun-stats h2:after {
      content: "";
      width: 8px;
      height: 17px;
      display: block;
      position: absolute;
      top: 0;
      z-index: 90
    }

    #pun-stats h2:before {
      background: url(https://forumstatic.ru/files/001b/6b/7e/20595.svg);
      left: 0;
      top: -7px
    }

    #pun-stats h2:after {
      background: url(https://forumstatic.ru/files/001b/6b/7e/26367.svg);
      right: 0;
      top: -7px
    }

    #pun-stats h2 span {
      height:0px;
      font-size: 0;
      position: relative;
      align-self: stretch
    }

    #pun-stats h2 span:before {
      content: "";
      background: #17100F;
      height: 1px;
      width: 100%;
      position: absolute;
      top: 0px;
      left: 0;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-image: linear-gradient(270deg, #503F36 0%, #A7906F 25%, #A7906F 75%, #503F36 100%) 1 round;
      border-top-width: 1px;
      border-top-style: solid;
      box-shadow: 0px 0px 10px rgba(28, 19, 13, 0.42);
    }

    #pun-stats h2 em {
      letter-spacing: .03em;
      background: linear-gradient(270deg, rgba(39, 25, 19, 0) 0%, rgba(39, 25, 19, 0.07) 50%, rgba(39, 25, 19, 0) 100%);
      height:35px;
      margin-top: 0px !important;
      padding: 0px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-transform: none;
      font: 300 italic 11px Accia;
      letter-spacing: .03em;
      position: relative;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-image: linear-gradient(270deg, rgba(196, 191, 171, 0) 0%, rgba(196, 191, 171, 1) 50%, rgba(196, 191, 171, 0) 100%) 1 round;
      align-self: stretch;
      position: relative
    }

    #pun-stats .container {
      display: grid;
      grid-template-columns: 220px auto;
      grid-template-rows: auto auto auto auto;
      gap: 20px 30px;
      grid-template-areas:
        "stats online1"
        "stats online2"
        "stats online3"
        "stats online4";
      font: 400 11px/150% Accia
    }

    .ststitems {
      display: flex;
      flex-direction: column;
      font: 300 9px Accia;
      border-right: 1px solid var(--borders);
      margin: 0px 0px 0px;
      padding: 0px 20px 30px 0px;
      align-items: flex-start;
      text-align: left;
      grid-area: stats;
      align-self: start;
      gap: 10px
    }

    .ststitems li {
      flex: auto;
      padding: 0 !important;
      opacity: .8
    }

    .onlinelist {
      grid-area: online1;
      align-self: start;
    }

    .users_24h {
      grid-area: online2;
      align-self: start;
    }

    .statistics {
      grid-area: online3;
      align-self: start;
    }

    /* D8 Quick Jump - About - Bottom Breadcrumbs
    -------------------------------------------------------------*/

    /* D8.1 */
    #pun-qjump {
      margin: 0;
      border: none;
      width: 50%;
      position: relative;
      float: left;
      }

    /* D8.2 */
    #pun-qjump .container {
      border: none;
      background: transparent;
      padding: 0.8em 1em;
      }

    /* D8.3 */
    #pun-about {
      margin-top: 0;
      }

    /* D8.4 */
    #pun-about .container {
      border-top-style: none;
      text-align: right;
      line-height: 150%;
      padding: 0.8em 1em;
      }

    /* D8.5 */
    #pun-about p span {
      display:block;
      padding-left: 50%;
      text-align: center;
      }

    /* D8.6 */
    #pun-crumbs2 {
      font-weight: bold;
      overflow: hidden;
      margin-bottom: 0;
      text-shadow: 0px 0px 7px #D2CFBD
      }

    /* D8.7 */
    #pun-crumbs2 .container {
      font-size: 1.1em;
      }

    /* D8.8 */
    #pun-break4 {
      margin: -2px 1em;
      border-style: solid none;
      border-width: 1px 0;
      position: relative;
      height: 0;
      z-index: 1;
      }

    /* D8.9 */
    div.punbb-admin #pun-about .container {
      border-top-style: solid;
      border-top-width: 1px;
      }

    /* D9 Help file
    -------------------------------------------------------------*/

    /* D9.1 */
    #pun-help .formal .info-box h3.legend {
      border-bottom-style: solid;
      border-bottom-width: 1px;
      padding-bottom: 0;
      margin-bottom: 0.8em;
      }

    /* D9.2 */
    #pun-help .formal .info-box h3.legend span {
      padding-bottom: 0.6em;
      display: block;
      border-bottom-style: solid;
      border-bottom-width: 1px;
      font-size: 1.1em;
      }

    /* D9.3 */
    #pun-help .formal p, #pun-help .formal dd {
      margin-bottom: 1em
      }

    /* D9.4 */
    #pun-help .formal ul, #pun-help .formal dl {
      padding: 0 0 0 1em
      }

    /* D9.5 */
    #pun-help .formal li {
      padding: 0;
      line-height: 130%
      }

    /* D9.6 */
    #pun-help .formal li * {
      vertical-align: text-top
      }

    /* D9.7 */
    #pun-help .formal dt span {
      font: 1.4em/120% monaco, "bitstream vera sans" }

    ::-webkit-scrollbar {
    width: 6px;
    height:6px;
    background-color: rgba(20, 18, 15,0.1);
    border-radius: 10px !important;}
    ::-webkit-scrollbar-thumb {
      background-color:var(--links);
      width:6px !important;
      box-shadow: 0 0 0 1px rgba(20, 18, 15,0.1) inset;
    border-radius: 1px !important;
    }

    .stickytext, .closedatafield, #pun-live-rusff, .pl-reports  {display: none}

    input, textarea {
        outline: none;

    input:active, textarea:active {
        outline: none;
    }
    :focus {
        outline: none;
    }

    #pun-messages .post h3 {
      width: auto;
      margin: 0 !important;
      padding: 5px 35px !important;
    }
    #pun-messages .post h3 span {
      width: auto !important;
      margin: 0 !important;
    }
    #pun #pun-messages .post-author {
      position: relative;
      margin-top: 0px !important;
    }
    #pun-messages .pa-posts {display: none}
    #pun-messages .pa-online {clear: both}
    #pun-messages .post-content {
      margin-top: 10px !important;
      margin-left: 0px !important;
    }

    #main-reply {height: 200px;
    }

    #mask_dialog .inner, .modal-inner.section, #pun-report .inner, #pun-reputation .inner, #pun-admin-award-form .inner, .editBookmark  {                   
      background: var(--cover1);
      border: 1px solid var(--borders) !important;
        border-radius: 5px;
        padding: 15px !important
    }

    #pun #pun-viewtopic .fnt_wrap {display: block}
    .fnt_wrap {
      order: 3;
      display: none;
      height: 25px;
      padding: 0 0px 0 20px;
    box-sizing: border-box;
    }
        .FNTslider {
        border-radius: 5px;
        width: 110px;
        height: 5px;
        background: var(--pun);
        border: 1px solid var(--borders);
        margin-top: 9px
    }
    #pun .FNTslider .before {
        height: 5px;
        background: var(--btns);
        border: 1px solid var(--links);
        border-right: none 0;
      border-radius: 6px 0 0 6px;
        position: absolute;
        margin-top: -1px;
        margin-left: -1px;
    }
    #pun .FNTslider .thumb {
        width: 16px;
        height: 5px;
        position: relative;
        top: -1px;
        background: var(--text1);
        cursor: pointer;
      border: 1px solid var(--text1);
      border-radius: 6px;
      margin-left: -2px
    }

    #post legend span {display: none}

    #font-area, #size-area, #color-area, #table-area, #smilies-area, #image-area, #imageup-area, #imageattach-area, #keyboard-area, #video-area, #addition-area {top: 55px !important;}

    .pl-reports {display: none !important;}

    .pa-avatar img {max-width: 180px}

    .post-content td { border:none transparent !important;}

    ::selection {    background: var(--links);
        color: #fefefe;
    }

    body * {scrollbar-width: thin;
    scrollbar-color: var(--links) rgba(20, 18, 15,0.01);}

    html {
    scrollbar-width: thin;
    scrollbar-color: var(--links) rgba(0, 0, 0,0.01);
    }

    #html-header {
    color: var(--text2);
    text-shadow: 1px 1px 0px #071218;
    }

    #html-header a {
    color: var(--links2)
    }

    #html-header a:hover{
    color: var(--text2)
    }

    .post-content abbr {text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-color: #555}

    #pun #pun-ulinks #Rz {
      display: none !important;
    }

    .punbb-admin textarea {
      width: 97% !important;
    }

    input[type="checkbox"] {
        appearance: none;
        padding: 5px !important;
        cursor: pointer;
        transition: all .4s ease-in-out 0s;
      border-radius: 100%
    }

    input[type="radio"] {
      border-radius: 100%;
        appearance: none;
        padding: 5px !important;
        cursor: pointer;
        transition: all .2s ease-in-out 0s
    }

    input[type="checkbox"]:checked, input[type="radio"]:checked {
        background: var(--btns);
        border: 1px solid var(--links) !important;
    }

    span.checkfield, p.checkfield {
        display: flex;
      margin-top: 10px !important;
      align-items: center
    }

    .pl-share {display: none !important}

    .pl-email.email {
        display: none !important;
    }

    body.post-content {
      width: 100%;
    }

    .bottombanners {
      background:
        url(https://forumstatic.ru/files/001b/6b/7e/17073.png) no-repeat top left,
        url(https://forumstatic.ru/files/001b/6b/7e/59656.png);
      height: 75px;
      margin: 20px 0 -5px -61px;
      position: fixed;
      padding: 21px 25px;
      box-sizing: border-box;
      bottom: 0;
      width: 1098px;
      z-index: -1
    }

    .bottombanners div {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      gap: 5px;
      overflow-y: auto;
      padding-right: 5px;
      height: 100%
    }

    .bottombanners img {
      transition: all .6s ease-in-out 0s;
      mix-blend-mode: luminosity;
      opacity: .35
    }

    .bottombanners img:hover {
      mix-blend-mode: normal;
      opacity: 1
    }

    #viewprofile-next, #profile .container, .post {
      color: var(--text1);
      border-bottom: 1px solid rgba(104, 76, 52, 0.15) !important;
      padding: 30px 60px;
      margin: 0 -60px;
    }

    .post {
      position: relative;
      border-bottom: 2px solid rgba(23, 16, 15, 1) !important;
      padding: 40px 60px;
    }

    .post:before, .post:after {
      content: "";
      width: 8px;
      height: 17px;
      display: block;
      position: absolute;
      top: 36px;
      z-index: 90
    }

    .post:before {
      background: url(https://forumstatic.ru/files/001b/6b/7e/20595.svg);
      left: 0;
    }

    .post:after {
      background: url(https://forumstatic.ru/files/001b/6b/7e/26367.svg);
      right: 0;
    }

    #viewprofile-next, #profile .container  {
      border-top: 1px solid rgba(104, 76, 52, 0.15); !important;
    }

    #post-form {
      padding: 0px 0px !important;
    }

    #profile.formal .container {
      padding-left: 250px
    }

    #post-form {
      padding: 20px
    }

    #pun-announcement .header_wrap {
      background: var(--pun);
      border-radius: 6px;
      border: 1px solid var(--out-border);
      height: 200px;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      position: relative;
    }

    .intd {
      display: flex;
      align-items: center
    }

    #post-form h2 {
      display: none
    }

    #charcounter {
      font: 400 12px Accia;
      background: var(--cover1);
      border: 1px solid var(--borders);
      border-radius: 3px;
      text-align: center;
      padding: 4px 25px;
      display: inline-block;
    }

    .charcount {
      font-weight: 500
    }

    #profile fieldset #charcounter {
      display: none
    }

    .post-rating {
      border-top: 1px solid var(--borders);
      margin-bottom: 20px;
      margin-top: 15px !important;
      padding-top: 5px;
      position: relative;
      float: right;
      z-index: 9
    }

    #pun .post-rating a {
      font-size: 14px !important;
    }

    .post-rating p {
      font: 600 italic 14px Accia;
      display: flex;
      align-items: center
    }

    .post-rating p.container:before {
        content: "Approval ";
        opacity: .4;
      margin-right: 5px
    }

    .post-vote p.container {
      margin-top: 20px !important;
    }

    #viewprofile-next {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 10px;
    }

    #viewprofile-next #profilenav {
      display: none
    }

    #viewprofile-next tr {
      vertical-align: top
    }

    #profile-left li + li {
      margin-top: 5px;
    }

    #profile-right {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: flex-start;
      gap: 10px;
      width: auto !important;
      background: var(--cover2);
      border: 1px solid var(--borders) !important;
      border-radius: 6px;
      padding: 20px !important;
      box-sizing: border-box
    }

    #profile-right li {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      flex: auto;
      text-align: center;
      padding: 10px 10px !important;
      font-size: 11px;
      background: var(--cover1);
      border: 1px solid var(--borders);
      border-radius: 6px;
    }

    #profile-right li strong {
      flex: auto;
      font-weight: normal;
      padding: 0 !important;
      margin: 0 !important;
    }

    #pun #profile-right li span {
      float: none;
      margin: 0;
      width: auto;
      font-weight: 600;
      padding-top: 0;
      font-size: 10px;
    }

    #pa-invites, #pa-fld2 {
      display: none !important;
    }

    #profile {
      display: flex;
    }

    #profile form.container {
      width: 100%;
      padding-left: 18.6em
    }

    #profilenav {
      background: var(--cover2);
      border: 1px solid var(--borders);
      display: flex;
      border-radius: 6px;
      margin-left: -17em
    }

    #pun-messages #profile > .container {
      display: flex;
      flex-direction: column;
      width: auto !important;;
      padding-left: 0;
      padding: 30px 60px;
      box-sizing: border-box;
    }

    #pun-messages #profile > .container {
      display: flex;
      flex-direction: column;
      width: auto !important;;
      padding-left: 0;
      padding: 20px 35px;
      box-sizing: border-box;
    }

    #pun-messages #profilenav {
      float: none;
      width: 100%;
      margin: 0;
      display: flex;
      flex-direction: column;
      padding: 15px;
      gap: 15px;
      box-sizing: border-box;
    }

    #pun-messages #profilenav ul, #pun-messages #profilenav li {
      padding: 0;
    }

    #pun-messages #profilenav ul {
      display: flex;
      gap: 10px;
      margin: 0
    }

    #pun-messages #profilenav li {
      background: var(--cover);
      border-radius: 6px;
      border: 1px solid var(--borders);
      padding: 5px 25px;;
    }

    #pun-messages #profilenav .isactive {
      font-weight: 700;
      filter: brightness(.9);
      background: var(--cover3)
    }

    #pun-messages #profilenav h2 {
      display: block;
      text-align: left !important;
      padding-left: 0;
      margin-left: 0;
    }

    #pun-messages .fs-box .container {
      padding: 20px 60px !important;
    }

    #pun-messages .fs-box .container tr + tr {
      margin-top: 5px;
    }

    #pun-messages .fs-box .container tr {
      display: flex;
      align-items: center;
      background: var(--cover2);
      padding: 0 10px;
      border: 1px solid var(--borders);
      border-radius: 6px;
    }

    #pun-messages .fs-box .post > .container {
      display: block !important;
    }

    #pun #pun-messages .post {
      background: transparent;
      border: none !important;
      padding: 0 !important;
      margin-top: 0 !important;
    }

    #form-buttons table {
      width: 100% !important;
    }

    #pun #keyboard-span input {
      font-family: Arial, Helvetica, sans-serif !important;;
      font-weight: 300;
      font-size: 13px;
      color: #666;
      background-color: var(--cover3);
      margin: 1px 1px 0 0;
        margin-top: 1px;
      border: 1px solid var(--borders) !important;
      cursor: pointer;
      padding: 0 10px !important;;
      height: 25px;
      min-width: 30px;
    }

    #pun #keyboard-span input + input {
      margin: 3px
    }

    #pun-index .lastpost {
      font-size: 0
    }

    #pun-index .datetime, #pun-index .byuser {
      font-size: 11px;
    }

    #pun-index .datetime:after {
      content: ", "
    }

    #BookmCntToggle {margin-top: 1px !important; z-index: 9999;}
    #MyBookmarks {  background: var(--pun);
      text-shadow: none;
      color: var(--links);
      padding: 20px 20px 10px 20px;
      box-sizing: border-box;
      width: 280px !important;
      border-radius: 0 6px 6px 0;
    }
    #MyBookmarks inner {
      padding-top: 40px !important;
    }

    #BookmCntToggle.default-style {background: var(--pun) !important;
    border-radius:2px;
    box-shadow: 2px 2px 1px #000;
    opacity: .95;
    }
    #MyBookmarks h2 {
      margin: 0 !important;
      padding: 10px 20px !important;
      background: var(--cover2);
      border-radius: 6px;
      border: 1px solid var(--borders) !important;
      box-sizing: border-box;
      margin-bottom: 20px !important;
    }
    .post .bookmark {color: var(--links) !important;}
    #BookmCntToggle.default-style {color: var(--links) !important; z-index: 9999}

    #BookmCntToggle {
    top: 10px;
    left: 60px !important;
    }

    #MyBookmarks {
      z-index: 99999 !important;
    }

    #bm2 {
      right: 20px !important;
    }

    #pun .scrl.t, #pun .scrl.b {
      box-shadow: none !important;
      background: var(--cover3);
      border: 1px solid var(--borders);
      border-radius: 6px;
      width: 110px;
    }

    .scrl.t + .scrl.b {
      margin-left: 10px !important;
    }

    #imageupload-left input[type=button] {width:auto !important}

    img#img-left {
      width: 240px;
      height: 100%;
      border-radius:6px;
      padding: 25px;
    }

    #left-panel {
          top:0px;
          padding:0;
          margin-left:-253px;
          position:fixed;z-index:99999;
          left: 0px;
      overflow: hidden;
      height: 488px !important;
      border-radius: 3px;
      background:
        url(https://forumstatic.ru/files/001b/6b/7e/48563.png) no-repeat top left,
        url(https://forumstatic.ru/files/001b/6b/7e/71008.png) no-repeat top right,
        url(https://forumstatic.ru/files/001b/6b/7e/42308.png) no-repeat bottom left,
        url(https://forumstatic.ru/files/001b/6b/7e/44242.png) no-repeat bottom right,
        linear-gradient(180deg, #27201E 7.2%, #27201E 100%);
      border: 1px solid #705D4C;
      box-shadow: 0px 0px 15px rgba(40, 24, 17, 0.44), 0 0 0 2px #14100E inset;
      border-radius: 5px;
      box-sizing: border-box;
      text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.61);
        }
        #content-L {
          padding:20px;
          width:237px;
          height:auto;
          margin-left:15px;
          margin-top:15px;
          position:absolute;
          text-shadow: none;
          color: var(--text1);
          font: normal 12px/15px Accia;
          border-radius: 6px;
          box-sizing: border-box;
          background: var(--pun);
        }
    .panel-h {
      background: var(--cover1);
      border: 1px solid var(--borders);
      border-radius: 3px;
      padding: 4px;
      font-family: Accia;
      text-transform: uppercase;
      display: block;
      text-align: center;
      letter-spacing: 1px;
      margin: 15px 0 12px 0;
      font-size: 13px;
      font-weight: 600;
    }

    .panel-h:first-child {
      margin-top: -10px
    }

    .content-header {
      position: absolute;
      writing-mode: tb-rl;
      transform: rotate(180deg);
      height: 500px;
      background: linear-gradient(to top, rgba(20, 16, 14, 0) 0%,  rgba(20, 16, 14, 0.9) 50%, rgba(20, 16, 14, 0) 100%);
      color: var(--links2);
      font: 400 24px Accia;
      padding: 0 4px;
      right: 0px;
      top: 0px;
      text-align: center;
      text-transform: uppercase;
      cursor: pointer;
    }

    #pun .post-content #anketa_title {
      background: #4F3E2E;
      border-radius: 3px;
      border: 1px solid #322421;
      margin: 5px 0;
      padding: 8px 0;
      text-shadow: none
    }

    #pun .post-content #anketa_title span {
      font: 700 14px Accia !important;
      text-transform: uppercase;
      color: var(--text2)
    }

    #pun .post-content #anketa_head {
      background: var(--btns);
      border-radius: 3px;
      border: 1px solid var(--links);
      color: var(--text2);
      padding: 13px 0;
      text-shadow: none
    }

    #pun .post-content #anketa_head span {
      font: 600 16px Accia !important;
      text-transform: uppercase;
      letter-spacing: .1em;
      padding: 0 !important;
      margin: 0 !important;
    }

    #anketa_head + p {
      display: none
    }

    *[data-forum-id="9"] .quote-box tr:nth-child(2) #anketa_title, *[data-forum-id="6"] .quote-box tr:nth-child(2) #anketa_title {
      margin-top: 0px !important;
    }

    *[data-forum-id="9"] .topicpost .quote-box  tr:nth-child(2) p:first-child, *[data-forum-id="6"] .topicpost .quote-box  tr:nth-child(2) p:first-child {
      display: none;
    }

    #pun .red_header p {
      padding: 0;
      margin: 0;
      font: normal 14px/150% philosopher;
      text-align: center;
    }

    .red_header {
      background: var(--icons);
      padding: 5px 10px;
      color: var(--text2);
      position: relative;
      box-sizing: border-box;
      border: 1px solid var(--links);
      border-radius: 3px;
    }

    .red_header + div, .red_header + p {
      margin-top: 15px !important;
    }

    div + .red_header, p + .red_header {
      margin-bottom: 15px !important;
    }

    .lore_bg {
      background: var(--cover2);
        border: 1px solid var(--borders) !important;
      padding: 10px 15px;
      margin-bottom: 20px;
      border-radius: 6px !important;
    }

    .lore_bg2 {
      background: var(--cover2);
        border: 1px solid var(--borders) !important;
      padding: 10px 20px;
      margin-bottom: 10px;
      border-radius: 6px;
    }

    .areafield.required > .input > span[style~="position:absolute;right:10px;top:10px;z-index:200;cursor:pointer"] {
      top: -25px !important;
    }

    /* заголовки td в лоре */
    #pun td[style~="background-color:#575d39"],
    #pun td[style~="background-color:#390707"] {
      background: var(--td-bg-head) !important;
      padding: 1em !important;
      color: var(--text2);
      text-shadow: none
      }

    #pun td[style~="background-color:#575d39"] .quote-box,
    #pun td[style~="background-color:#390707"] .quote-box {
      color: var(--text1)
    }

    /* подложки td в лоре */
    /* подложки td в лоре */
    #pun td[style~="background-color:#bebb98"],
    #pun td[style~="background-color:#d8c9be"],
    #pun td[style~="background-color:#d7bba7"],
    #pun td[style~="background-color:#cdb8b8"],
    #pun td[style~="background-color:#cfb6b6"] {
      background: var(--td-bg-cover) !important;
      padding: 1em 1.5em !important;
      }

    /* цитаты td в лоре */
    #pun td[style~="background-color:#bebb98"] > .quote-box,
    #pun td[style~="background-color:#d8c9be"] > .quote-box {
      box-shadow: 5px 10px 10px 0 rgba(0,0,0,.05)
      } 

    /* подложка td в эпизодах */
    #pun td[style~="background-color:#ede2e2"] {
      background: var(--td-bg-cover) !important;
      padding: 1em 1.5em !important;
      }

    /* подложка td под картинку в эпизодах  */
    #pun-viewtopic[data-forum-id="12"] td[style~="background-color:#575d39"],
    #pun-viewtopic[data-forum-id="13"] td[style~="background-color:#575d39"],
    #pun-viewtopic[data-forum-id="10"] td[style~="background-color:#575d39"],
    #pun-viewtopic[data-forum-id="11"] td[style~="background-color:#575d39"],
    #pun-viewtopic[data-forum-id="16"] td[style~="background-color:#575d39"],
    #pun-viewtopic[data-forum-id="20"] td[style~="background-color:#575d39"],
    #pun td[style~="background-color:#475d39"] {
      background: var(--td-episode-bg) !important;
      padding: 1em 1.5em !important;
      }

    /* заголовок td в эпизодах первого дизайна и последующих  */
    #pun td[style~="background-color:#72520b"] {
      background: var(--td-bg-head) !important;
      padding: 1em 1.5em !important;
      text-shadow: none
      }

    #pun td span[style="color: #cd9e6d"],
    #pun td span[style="color: #ffffff"] {
      color: var(--text2) !important;
    }

    #pun-respect td {
      padding: .8em !important;;
      overflow-wrap: normal
    }

    #pun hr {
        opacity: 1;
      filter: none;
    background: var(--borders);
      border: none;
      height: 1px;
      margin: .8em auto;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    #pun hr:after {
      content: "";
      display: block;
      background: var(--cover);
      border: 1px solid var(--borders);
      height: 7px;
      width: 7px;
      position: absolute;
      transform: rotate(45deg)
    }

    #topic-feed {
      display: none
    }

    #navpm {
        position: relative
    }

    #pun .num_msg {
      position: absolute;
      margin-top: 0;
      margin-left: 0;
    top: 8px;
    right: -15px;
    font-size: 10px;
    font-weight: 700;
    background: red;
    padding: 1px 4px;
    border-radius: 100px;
    height: 14px;
    color: #fff;
    cursor: pointer;
    }

    #pun .num_msg:before {
      display: none
    }

    #pun-messages #togglePreview {
      top: -15px
    }

    .post-content table {
      border-radius: 5px;
      overflow: hidden
    }

    img[alt~="hide-autor2"] {
        opacity: 0;
      display: none
      }

    #stylelist {
        margin: 0;
        padding: 0;
        list-style-type: none;
      display: flex;
      gap: 15px;
      align-items: center;
      height: 47px;
      position: fixed;
      top: 0;
      width: 45px;
      justify-content: center;
      z-index: 1;
      margin-left: 973px;
    }

    #stylelist li[data="blue"] a, #stylelist li[data="green"] a{
      height: 15px;
      width: 15px;
      border-radius: 5px;
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 0;
      border-radius: 100%;
    }

    #stylelist li[data="blue"] a {
      background: #016E8B;
      border: 1px solid #0790B5;
      box-sizing: border-box;
      transition: all .5s linear 0s !important;
    }

    #stylelist li[data="green"] a {
      background: #396D3B;
      border: 1px solid #549157;
      box-sizing: border-box;
      transition: all .5s linear 0s !important;
    }

    #stylelist a:hover {
      opacity: .5
    }

    #stylelist li:nth-child(3), #stylelist li:nth-child(4) {
      display: none
    }

    #stylelist li.active a:before {
      content: "\f00c";
      font-size: 10px;
      font-family: FontAwesome;
      position: absolute;
      color: var(--text2)
    }

    .header_wrap {
      box-sizing: border-box;
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: absolute;
      width: 1098px;
      height: 250px;
      top:-250px;
      margin-left: -60px !important;
      background: var(--head);
      box-shadow: 0 0 0 1px var(--head-s1) inset, 0 0 0 2px var(--head-s2) inset;
      z-index: 0;
      font: 400 11px/150% accia;
    }

    .header_item.left {
      width: 255px;
      display: flex;
      flex-direction: column;
      gap: 30px;
      align-items: center;
      text-align: center;
      margin-left: 50px
    }

    #pun .game_navigate a {
      transition: all .5s linear 0s !important;
      font: 300 14px/150% Accia;
      display: inline-block;
      margin: 2.5px
    }

    #pun .game_navigate a:hover {
      color: var(--text2)
    }

    .header_item.left rait {
      font-weight: 300;
      letter-spacing: 0.01em
    }

    .news_wrap {
      background: var(--news-bg);
      width: 300px;
      padding: 20px 30px;
      font: 300 11px/150% Accia;
      height: 246px;
      box-sizing: border-box;
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-left: 1px solid var(--news-b);
    }

    .news_wrap span {
      text-transform: uppercase;
      opacity: .65;
      text-align: center;
      display: block;
      margin-bottom: 20px;
      font-size: 10px;
      letter-spacing: 0.1em;
      font-weight: 300
    }

    .news_wrap div {
      height: calc(100% - 40px);
      overflow-y: auto;
      padding-right: 10px;
    }

    .news_wrap a {
      font-weight: 500
    }

    .news_wrap p + p {
      margin-top: 15px
    }

    .green {
      --text1: #2D221F;
      --links: #3C5F0F;
      --text2: #CDC7B0;
      --links2: #748845;

      --old: url(https://forumstatic.ru/files/001b/6b/7e/74074.png);
      --new: url(https://forumstatic.ru/files/001b/6b/7e/85828.png);

      --on: url(https://forumstatic.ru/files/001b/6b/7e/69015.png);

      --btns: #4A6D1D;

      --td-bg-head: #4A623C;
      --td-bg-cover: #B2AC95;
      --td-episode-bg: #B0A78E;
    }

    @media screen and (max-width: 540px) { 
     
      #left-panel, .game_navigate, .news_wrap {
        display: none
      }
     
      body {
        background-size: cover !important;
      }
     
      #pun {
        border-radius: 0 !important;
            background:
          var(--blood) no-repeat bottom left,
          var(--drop) no-repeat right top,
          var(--pun1) no-repeat left top,
          var(--pun3) no-repeat top,
          var(--pun) var(--pun2);
      background-blend-mode: multiply, overlay, soft-light, soft-light, normal, normal, normal, normal;
      }
     
      .punbb {
        padding: 0px !important;
      }
     
      #html-header {
      color: var(--text2);
      width: auto;
      height: 200px;
      margin: 0px 0px 0 !important;
      }
     
      .sides-wrap {
        display: none
      }
     
      #pun .header_wrap {
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      height: 200px;
      width: auto;
      position: relative;
        z-index: 0;
        top: 0;
        margin: 0 !important;
        background: var(--head) no-repeat top center / cover;
    }
     
      .header_item.right {
        display: none
      }

    #pun .header_item.left {
      width: auto !important;
      display: flex;
      flex-direction: column;
      gap: 0;
      margin: 0 !important;
      padding: 10px;
      margin-top: 145px !important;
      text-align: left !important;
    }

    #pun .header_item.left img {
      width: auto !important;
    }

      #BookmCntToggle {
        top: 20px !important;
        left: 20px !important;
      }
     
      #pun-ulinks:before, #pun-ulinks:after {
        display: none
      }

      #pun #pun-ulinks .container {
        box-shadow: none !important;
          background:
        url(https://forumstatic.ru/files/001b/6b/7e/48563.png) no-repeat top left,
        url(https://forumstatic.ru/files/001b/6b/7e/71008.png) no-repeat top right,
        url(https://forumstatic.ru/files/001b/6b/7e/42308.png) no-repeat bottom left,
        url(https://forumstatic.ru/files/001b/6b/7e/44242.png) no-repeat bottom right,
        linear-gradient(180deg, #27201E 7.2%, #27201E 100%) !important;
      border: 1px solid #705D4C !important;
      box-shadow: 0px 0px 15px rgba(40, 24, 17, 0.44), 0 0 0 2px #14100E inset !important;
      border-radius: 5px;
        padding: 10px !important;
      }
     
      #pun-navlinks.section {
        width: auto !important;
      }

      #pun-navlinks {
        border-bottom: 1px solid var(--borders)
      }
     
      #pun-navlinks ul {
        justify-content: center;
        gap: 0px
      }
     
    #pun #pun-navlinks .container li a{
        background: transparent !important;
       box-shadow: none !important;
       display: flex !important;
       justify-content: center;
       align-items: center;
        background-clip: padding-box !important;
        -webkit-background-clip: padding-box !important;
        -moz-background-clip: padding-box !important;
        -o-background-clip: padding-box !important;
      }
     
      #pun-navlinks a {
        color: var(--text2) !important;
        background-clip: padding-box !important;
        -webkit-background-clip: padding-box !important;
        -moz-background-clip: padding-box !important;
        -o-background-clip: padding-box !important;
      }
     
    #pun-navlinks li a span {font-size:0;
    display: none} #navpr_1 li span {font-size:0; display: none} #navpr_2 li span {font-size:0; display: none}

    #navindex a:before {content:"\f015";     font-family: FontAwesome; font-size: 17px}
    #navuserlist a:before {content:"\f0c0";     font-family: FontAwesome;}
    #navsearch a:before {content:"\f002";     font-family: FontAwesome;}
    #navpm a:before {content:"\f0e0";     font-family: FontAwesome;}
    #navprofile a:before {content:"\f2bb";     font-family: FontAwesome;}
    #navadmin a:before {content:"\f085";     font-family: FontAwesome;}
    #navlogin a:before {content:"\f090";     font-family: FontAwesome;}
    #navlogout a:before {content:"\f08b";     font-family: FontAwesome;}
    #navregister a:before {content:"\f067";     font-family: FontAwesome;}
    #navpr_2 a:before {content:"\f0f3";     font-family: FontAwesome;}
    #navpr_1 a:before {content:"\f21b";     font-family: FontAwesome;}

    #navindex a span {display:block;}
    #navuserlist a span {display:block;}
    #navawards a span {display:block;}
    #navsearch a span {display:block;}
    #navpm a span {display:block;}
    #navprofile a span {display:block;}
    #navadmin a span {display:block;}
    #navlogin a span {display:block;}
    #navlogout a span {display:block;}
    #navregister a span {display:block;}
    #navpr_1 a span {display:block;}
    #navpr_2 a span {display:block;}

      #pun #pun-ulinks {
       background: transparent !important;
       box-shadow: none !important;
       right: 10px !important;
       top: 10px !important;
      }
     
      #pun #pun-ulinks:before {
        content: "\f0c9";
        font-family: FontAwesome;
        font-size: 30px;
        color: var(--links2);
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: no-repeat;
        text-align: center;
        line-height: 45px
      }
     
    #pun .category h2, #pun-stats h2 {
      margin: 0 0px 20px !important;
      height: auto;
      display: flex !important;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      position: relative;
      text-align: center;
      gap: 15px;
      color: #614937;
      overflow: visible !important;
      white-space: normal;
    }

    #pun .category h2:before, #pun .category h2:after, #pun-stats h2:before, #pun-stats h2:after {
      content: "";
      width: 8px;
      height: 17px;
      display: block;
      position: absolute;
      top: -7px;
      z-index: 90
    }

    #pun .category h2:before {
      background: url(https://forumstatic.ru/files/001b/6b/7e/20595.svg);
      left: 0;
    }

    #pun .category h2:after {
      background: url(https://forumstatic.ru/files/001b/6b/7e/26367.svg);
      right: 0;
    }
     
      #pun .category h2 span, #pun-stats h2 span {
      background: linear-gradient(270deg, rgba(39, 25, 19, 0) 0%, rgba(39, 25, 19, 0.07) 50%, rgba(39, 25, 19, 0) 100%);
      height:35px;
      margin-top: 0px !important;
      padding: 0px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-transform: uppercase;
      font: 600 15px Accia !important;
      position: relative;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-image: linear-gradient(270deg, rgba(196, 191, 171, 0) 0%, rgba(196, 191, 171, 1) 50%, rgba(196, 191, 171, 0) 100%) 1 round;
      align-self: stretch;
      position: relative
    }
     
      #pun-stats h2 span {
        font-size: 0 !important;
        height: 3px;
      }

    #pun .category h2 span:before, #pun-stats h2 span:before {
      content: "";
      background: #17100F;
      height: 1px;
      width: 100%;
      position: absolute;
      top: 0px;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-image: linear-gradient(270deg, #503F36 0%, #A7906F 25%, #A7906F 75%, #503F36 100%) 1 round;
      border-top-width: 1px;
      border-top-style: solid;
      box-shadow: 0px 0px 10px rgba(28, 19, 13, 0.42);
    }

    #pun-index .category h2 em {
      font: 300 italic 11px Accia;
      letter-spacing: .03em;
      align-self: center;
      flex: 1;
      width: 100% !important;
      text-transform: none
    }
     
      #pun-stats h2 em {
        margin-top: -16px !important;
        padding: 10px 10px !important;
        width: calc(100% - 20px) !important;
      }
     
      .category + .category {
        margin-top: 0px !important;
      }

      #pun #pun-category1 h2 {
        margin-top: -12px !important;
      }
     
      .category .container {
        margin: 0;
        padding: 0 20px
      }
     
      .category tr {
        display: flex;
        flex-direction: column;
        padding: 0 !important;
        gap: 10px;
        align-items: stretch
      }
     
      #pun .category .tcl {
        border: none !important;
        padding-bottom: 10px !important;
      }
     
      #pun .category .tcr {
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
      }
     
      .category .Add {
        display: none
      }
     
    #pun #pun-stats {
        margin: 20px 0px 0 !important;
       padding: 0 0px !important;
      }
     
    #pun #pun-stats .container {
        display: flex;
        flex-direction: column;
        padding: 1em 20px !important;
      }
     
      .ststitems {
        display: none
      }
     
    #pun #html-footer {
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
      }
     
      .bottombanners {
        width: 100%;
        border-radius: 0;
        margin: auto;
        position: relative;
        z-index: 1;
      }

      .multipage {
        margin-top: 20px !important;
        padding: 0 15px
      }
     
      #pun #pun-crumbs1 {
        margin-bottom: 30px !important;
      }
     
      .linkst .pagelink {
        margin: 0 !important;
      }
     
      #pun .punbb tbody.hasicon td.tcl {
        padding-left:  0 !important;
      }
     
      #pun .post-author {
          background:
        url(https://forumstatic.ru/files/001b/6b/7e/48563.png) no-repeat top left,
        url(https://forumstatic.ru/files/001b/6b/7e/71008.png) no-repeat top right,
        url(https://forumstatic.ru/files/001b/6b/7e/42308.png) no-repeat bottom left,
        url(https://forumstatic.ru/files/001b/6b/7e/44242.png) no-repeat bottom right,
        linear-gradient(180deg, #27201E 7.2%, #27201E 100%) !important;
      }
        .post-author ul {
      display: grid;
      grid-template-columns: 1fr 120px;
      grid-template-rows: auto;
      gap: 0px 5px;
      grid-template-areas:
        "name personal_wrap"
        "status personal_wrap"
        "messages personal_wrap"
        "respect personal_wrap"
        "character personal_wrap";
    }
    #pun .post-author .pa-author {
      grid-area: name;
      margin-top: 0px !important;
      padding: 0px 0px !important;
      margin: 0 !important;
      border-radius: 6px;
      text-align: left
      }
      #pun .post-author .pa-author a {
        padding: 0 !important;
        border: none !important;
      }
    #pun .post-author .pa-title {
      grid-area: status;
      margin: 0 !important;
      border: none !important;
      background: transparent !important;
      }
    #pun .post-author ul .field_wrap {
      grid-area: messages;
      width: auto;
      margin: 10px 0px -0px !important;
      background: 0;
      padding: 10px 0px !important;
      }
    #pun .post-author .pa-respect {
      display: block !important;
      }
    #pun .post-author .personal_wrap {
      grid-area: personal_wrap;
      float: none;
      margin: 0;
      display: flex;
      align-items: flex-start;
      justify-content: center;
      border: none;
      margin: 0 !important;
      border: none !important;
      }
      #pun .post-author .pa-avatar {
        float: none !important;
        border: none;
        margin: 0 !important;
      }
      #pun .post-author .pa-avatar  img {
        max-width: 100px !important;
        max-height: 100px !important;
        box-sizing: border-box
      }
        #pun .pa-avatar img.indOnline, #pun .pa-avatar img.indOffline {
        display: none
      }
      #pun .post-links ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 5px;
      }
      #pun .post-links li {
        flex: 1;
        display: block;
      }
      .post-links li + li {
        margin: 0 !important;
        padding: 0 !important;
      }
      #pun .post-links ul a {
        display: block;
        text-align: center;
      }
      .punbb .post-links ul::after {
        display: none
      }
      .go-down, .go-up {
        margin-left: 0 !important;
        right: 10px;
        bottom: 5px;
      }
      .go-up {
        bottom: 50px
      }
      .indOnline, .indOffline, .post-img-Sp, .post-ul-Sp {
        display: none !important;
      }
     
      #togglePreview {
        float: none !important;
      }
      #pun .post h3 span {
        width: 100%;
        background: var(--cover2) !important;
        border: 0 !important;
        height: auto;
        font-size: 15px;
        padding: 10px 0 !important;
      }
     
      #pun .post h3 {
        margin-bottom: 0px !important;
        margin-top: -25px;
        top: 0;
      }
     
      #post-form {
        padding: 20px 0px !important;
      }

      #pun .punbb textarea {
        width: 100% !important;
        max-width: 100% !important;
      }

      .linksb, .linkst {
        gap: 10px !important;
        align-items: flex-start;
      }
      .subscribelink {
        text-align: left
      }
      .pagelink {
        flex: 1
      }
      #viewprofile-next, #profile .container {
        margin: 0px 0 !important;
        padding: 10px 0 !important;
      }
      #profilenav {
        width: auto;
        margin: 10px !important;
      }
      #profilenav ul {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
      }
      #profilenav li {
        background: var(--cover4);
        border-radius: 3px;
        border: 1px solid var(--borders);
        padding: 5px 10px;
        flex: auto;
        text-align: center;
      }
      #pun-messages #profilenav {
        width: auto;
      }
      #pun-messages .fs-box .container {
        padding: 10px 0 !important;
      }
      #pun-messages .post {
        margin: 0
      }
        #pun-messages form#messages tr {
        display: table;
      }
      #pun-messages form#messages tr td {
        text-align: left;
        padding: 10px;
        white-space: normal !important;
      }
      .tc2.pmtc24 {
       padding-left: 10px !important;
      }
      #pun div.icon {
        display: block !important;
      }
      #pun-index .category .tcl {
      overflow: visible
    }
      #pun-index tr.inew .tclcon:after {
        left: calc(10

    0

    2

    Код:
    body {
        background:
           var(--base-bg);
    }
    
    .sides-wrap {
      position: fixed;
      width: 100%;
      height: 100%;
      pointer-events: none;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      overflow: hidden;
      z-index: 999;
      display: flex;
      justify-content: center;
    }
    
    .sides {
      min-width: 2000px;
      margin: auto;
      width: 100%;
      height: 100%;
      pointer-events: none;
      display: flex;
      gap: 1098px;
      justify-content: center
    }
    
    .side-left {
      background: var(--sideleft);
      width: 451px;
      height: 100%;
      box-shadow: var(--lshadow);
      pointer-events: none
    }
    
    .side-right {
      background: var(--sideright);
      width: 451px;
      height: 100%;
      box-shadow: var(--rshadow);
      pointer-events: none
    }
    
    #pun-title {
        display: none
    }
    
    #pun-navlinks a {
          color: var(--links2) !important;
    transition: all .3s cubic-bezier(.64,.51,.55,1.16) 0s !important;
        font: 400 14px Accia !important;
        letter-spacing: .1em;
        text-transform: uppercase;
        position: relative;
        display: flex;
        align-items: center;
        padding: 0 !important;
        height: 40px;
        text-align: center;
    }
    
    #pun-navlinks a:hover {
        color: var(--text2) !important;
    }
    
    #pun-navlinks ul {
        display: flex;
        gap:25px;
        width: 100%;
        justify-content: center;
        align-items: center;
        height: 40px;
        padding: 0 !important;
        text-align: center;
    }
    
    #pun-navlinks {
        display: block;
        font-size:0px !important;
        font-style: normal;
        font-weight: lighter !important;
        width: auto;
        margin: -30px -60px 0 !important;
        height: 40px;
        padding: 0px 25px;
        text-align: center;
        box-sizing: border-box;
        background: 
          url(https://forumstatic.ru/files/001b/6b/7e/50347.png) no-repeat left 1px,
          url(https://forumstatic.ru/files/001b/6b/7e/24994.png) no-repeat right 1px,
          url(https://forumstatic.ru/files/001b/6b/7e/54440.png);
        border-bottom: 1px solid #27221F !important;
        display: flex;
        justify-content: center;
        align-items: center;
        position: sticky;
        top: 0px;
      z-index: 99
    }
    
    #pun-ulinks .item5 {
        display: none;
    }
    
    #pun-ulinks {
        box-sizing: border-box;
        background: 
          url(https://forumstatic.ru/files/001b/6b/7e/81055.png) no-repeat bottom,
          url(https://forumstatic.ru/files/001b/6b/7e/38203.png) no-repeat left -3px,
          url(https://forumstatic.ru/files/001b/6b/7e/47830.png) no-repeat right -3px,
          url(https://forumstatic.ru/files/001b/6b/7e/59810.png);
        margin: 0px -60px 0 !important;
        height: 29px;
        display: flex;
        align-items: center;
        justify-content: center;
      position: sticky;
      top: 40px;
      z-index: 99
    }
    
    
    #pun-ulinks .container {
      padding: 0px !important;
      text-align: center;
      margin-top: -4px;
    }
    
    #pun-ulinks a {
      font: 300 11px/120% Accia !important;
      text-transform: lowercase;
      letter-spacing: .012em;
        color: var(--text2) !important;
      margin: 0 5px
    }
    
    #pun-ulinks.section {
        margin-bottom: 20px !important;
    }
    
    #pun-ulinks a:hover {
        color: var(--links2) !important;
    }
    
    .offctgr {display:block!important;
    visibility:visible!important;
    }
    
    .pa-respect img {width: 10px}
    
    
    #profilenav h2 {
        text-align: left !important;
    }
    
    .post-author {
      width: 220px;
      font: 400 11px/150% Accia;
      margin-bottom: 10px;
      background: 
        url(https://forumstatic.ru/files/001b/6b/7e/48563.png) no-repeat top left,
        url(https://forumstatic.ru/files/001b/6b/7e/71008.png) no-repeat top right,
        url(https://forumstatic.ru/files/001b/6b/7e/42308.png) no-repeat bottom left,
        url(https://forumstatic.ru/files/001b/6b/7e/44242.png) no-repeat bottom right,
        url(https://forumstatic.ru/files/001b/6b/7e/59808.svg) no-repeat,
        linear-gradient(180deg, #27201E 7.2%, #27201E 100%);
      border: 1px solid #705D4C;
      box-shadow: 0px 0px 15px rgba(40, 24, 17, 0.44), 0 0 0 2px #14100E inset;
      border-radius: 5px;
      box-sizing: border-box;
      margin-top: -25px !important;
      position: relative;
      text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.61);
    }
    
    .post-author ul {
      margin: 2px;
      box-sizing: border-box;
      text-align: center;
      border: 1px solid #4E3D39;
      border-radius: 3px;
      box-sizing: border-box;
      padding: 18px !important;
      color: var(--text2)
    }
    
    #pun .post-author ul a {
      color: var(--links2)
    }
    
    #pun .post-author ul a:hover {
      color: var(--text2)
    }
    
    .indOnline, .indOffline {
      display: block !important;
      height: 25px;
      width: 73px;
        z-index: 9;
        cursor: pointer;
        position: absolute;
       top: -2px;
        right: 6px;
      border: none !important;
      box-sizing: border-box;
      image-rendering: pixelated;
    }
    .indOnline {
      background: var(--on) no-repeat center;
    }
    .indOffline {
      background: var(--off) no-repeat center;
    }
    
    .post[data-group-id="3"] .pa-avatar .indOffline {
      display: none;
    }
    
    .pa-author {
        font: 600 16px Accia !important;
      text-align: left;
      margin-top: -5px !important;
    }
    
    i#tuser, .flag-i {
      display: none !important;
    }
    
    .pa-title {
      font-size: 10px;
      font-style: italic;
      text-align: left;
      margin: 0px 0 5px !important;
        font-weight: 300 !important;
      margin-bottom: 10px !important;
    }
    
    .pa-avatar img {max-width: 180px;}
    
    #pun .pa-avatar img {
      border: 1px solid #332825 !important;
      box-shadow: 0px 0px 15px rgba(7, 5, 4, 0.7);
      border-radius: 4px;
    }
    .pa-fld1 br {
      display: none
    }
    
    .pa-fld1 div br {
      display: block
    }
    
    .pa-fld1 .fld-name, .pa-fld2 .fld-name {
      display: none
    }
    
    .pa-fld1 {
      text-align: left;
    }
    
    .pa-fld1, .pa-fld2 {
      padding: 12px 0 10px !important;
    }
    
    .pa-fld1 font {
      font: 600 italic 13px Accia !important;
    }
    
    .pa-fld1 b {
      font-style: italic;
    }
    
    .pa-fld1 a b {
      color: var(--links2) !important;
    }
    
    .pa-fld1 div {
      line-height: 150%
    }
    
    .personal_wrap {
      margin: 0 -18px !important;
      position: relative;
    }
    
    .pa-fld3 {
      background: url(https://forumstatic.ru/files/001b/6b/7e/90222.png);
      position: absolute;
      padding: 0px !important;
      margin-left: -22px !important;
      top: 20px;
      width: 38px;
      height: 30px;
    }
    
     #pa-fld3 strong {
      background: url(https://forumstatic.ru/files/001b/6b/7e/90222.png);
      width: 38px;
      height: 30px;
    }
    
    .personal_page-logo {
      background: url(https://forumstatic.ru/files/001b/6b/7e/25680.svg);
      width: 15px;
      height: 15px;
      margin-top: 4px !important;
      margin-left: 2px !important;
    }
    
    .field_wrap {
      background: radial-gradient(50% 100% at 50% 0%, rgba(20, 16, 14, 0.5) 0%, rgba(20, 16, 14, 0) 100%);
      border-top-width: 1px;
      border-top-style: solid;
      border-image: linear-gradient(270deg, rgba(82, 67, 51, 0) 0%, rgba(82, 67, 51, .5) 50%, rgba(82, 67, 51, 0) 100%) 1 round;
      width: 220px;
      margin: 5px -18px 0px !important;
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      flex-direction: column;
      gap: 0px;
      padding: 15px 0 0 !important;
    }
    
    .pa-posts, .pa-respect {
      font-size: 11px;
      font-style: italic
    }
    
    .pa-online, .pa-reg, .pa-last-visit {
      display: none;
    }
    
    
    .punbb th {
        font-size: 0 !important;
    }
    li#navawards, .lastedit {
        display: none !important;
    }
    .pa-gifts, .pa-ua {
        display: none !important;
    }
    
    .punbb .section .container, .punbb .post-body, .punbb .post-links, .punbb td.tc2, .punbb td.tc3, .punbb .formal fieldset .post-box, #viewprofile li strong, #viewprofile li div, #setmods dd, .punbb .info-box, .punbb #pun-main .info-box .legend, .punbb .main .container, .punbb .post .container, .punbb .post h3, .punbb-admin #pun-admain .adcontainer, #pun-title, #pun-title .container, .punbb .modmenu .container, .punbb legend span, #viewprofile h2 span, #profilenav h2 span, .punbb-admin #pun-admain legend span, .punbb .post h3 span, .punbb th, #viewprofile li, #setmods dl {
        border-color: transparent;
    }
    .punbb .post-box {
        text-align: left
    }
    #pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 {
        border-color: transparent;
        font-style: normal;
        font-weight: normal;
    }
    
    #pun #post-form {
      position: relative;
        margin-top: 0px
    }
    
    .punbb textarea {
        box-sizing: border-box;
      background: var(--cover1);
      border: 1px solid var(--borders) !important;
        border-radius: 5px;
        padding: 10px !important;
    border: none;
      width: 100% !important;
      color: var(--text1)
    }
    
    .punbb #pun-main .quote-box, .punbb #pun-main .code-box {
      background: var(--cover3);
      border: 1px solid var(--borders) !important;
      border-radius: 5px;
      box-shadow: 0 0 10px 0 rgba(0,0,0,.12);
      overflow: hidden;
        padding: 15px !important;
        position: relative;
        overflow: hidden;
      text-align: justify;
    }    
    
    #pun .quote-box.spoiler-box {
        padding: 0px !important;
        background: var(--cover3)
    }
    
    .quote-box.spoiler-box > div {
      margin: 10px !important;
    }
    
    .quote-box.spoiler-box > blockquote {
      padding: 18px !important;
      box-sizing: border-box;
      border-top: 1px solid var(--borders);
      margin: 18px 0px -10px !important;
      width: auto;
      background: var(--cover1);
    }
    
    
    #pun .quote-box cite, #pun .code-box strong.legend {
        display: block;
        font-size: 12px;
      font-style: italic;
        font-family: Accia;
      margin: -15px;
      padding: 8px 20px;
        margin-bottom: 10px;
        text-align: left;
        font-weight: 700;
        border-bottom: 1px solid var(--borders);
      background: var(--cover1)
    }
    
    #pun-main .code-box .scrollbox pre {
    font-size: 11px;
    font-family: Courier New
    }
    
    .punbb select, input {
    border: 0;
    padding: 2px 3px 2px 3px !important;
        color: var(--text1);
      background: var(--cover1);
      border: 1px solid var(--borders) !important;
        border-radius: 5px;
        font: 400 12px Accia !important;
    }
    
    #pun-navlinks .container {
        border-color: transparent;
        color: #152115;
    }
    .offline li.pa-online strong {
        font-weight: normal;
    }
    
    .punbb .container, .punbb .post-body, .post h3, #pun-title, .punbb .section, .punbb .forum, .punbb .formal, .punbb .modmenu, .punbb .info, .punbb .category, .punbb .post, #pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2, .punbb td, .punbb fieldset, #viewprofile ul, #profilenav ul, .punbb .post .post-body, .punbb .post h3 span, .post-links ul, .post-links, .usertable table, #pun-ulinks li, #pun-announcement h2 span, li#onlinelist, #pun-help .formal .info-box h3.legend span, #pun-ulinks li a, #pun-announcement h2, li#onlinelist div, #pun-help .formal .info-box h3.legend, .punbb .divider, .punbb .quote-box, .punbb .code-box, .punbb th, .punbb .formal fieldset .post-box, .punbb .info-box, li.pa-online, .punbb .post-sig dt {
        border-color: transparent;
    }
    .punbb a, .punbb a:link, .punbb a:visited, .punbb-admin #pun-admain a, .punbb-admin #pun-admain a:link, .punbb-admin #punbb-admain a:visited, .punbb li.isactive a, .punbb li.isactive a:link, .punbb li.isactive a:visited {
        border-bottom: 0 none #000;
        color: var(--links);
        text-decoration: none;
        transition: color 0.3s ease-in-out;
    }
    
    
    .punbb a:hover, .punbb a:focus, .punbb a:active, .punbb-admin #pun-admain .nodefault, .punbb-admin #punbb-admain a:hover, .punbb-admin #punbb-admain a:focus, .punbb-admin #punbb-admain a:active {  border-bottom: 0 none #000;
        color: var(--hover-link);
        text-decoration: none;
    }
    #pun-pagelinks a:active, #pun-pagelinks a:focus {
        background-color: #211a13;
        color: #fff;
    }
    
    h1 {
      display: none
    }
    
    h2 {
      font: 700 10px Accia !important;
      text-transform: uppercase;
    }
    
    
    #MyBookmarks h2 {
      display: block
    }
    
    #pun-index h2 {box-shadow: none;
    border: 0 !important}
    
    #pun-main div.catleft, #pun-main div.catright {
        display: none;
    }
    #pun-index table Div.icon {
        border-style: none;
        background: transparent;
        height: 22px;
        width: auto;
        position: absolute;
        top: 0px;
        z-index: 99;
        right: 0px;
    }
    
    div.icon {
      width: 15px;
      height: 15px;
      margin-right: 10px;
        box-sizing: border-box;
    }
    
    div.icon {
      background: var(--old);
    }
    
    .inew div.icon {
      background: var(--new);
    }
    
    .isticky div.icon {
      background: var(--imp);
    }
    
    .iclosed div.icon {
      background: var(--close);
    }
    
    #pun-about p.container  {
        height: auto;
        margin-top: 10px !important;
        width: auto;
        padding: 0 0 0px !important;
        border: 0 !important;
        font-size: 10px
    }
    
    #pun-about {
        border: 0 !important;
        padding: 0 !important;
    }
    
    div#pun-about {
        margin-top: 0px;
    }
    div#html-footer {
        margin: 0px 0 0;
    }
    
    #pun-announcement.section h2 span {
        display: none;
    }
    
    .punbb input {
        border: medium none;
    }
    
    .button, #pa-edit strong a, input[type="button"] {
    background: var(--btns);
      border: 1px solid var(--links) !important;
        color: var(--text2);
        font-family: Accia !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        margin-top: 0px !important;
        padding: 4px 25px 4px 25px !important;
        text-decoration: none;
        transition: all 0.3s ease-in-out 0s;
        border-radius: 3px;
       text-shadow: 0px 0px 2px #24333C;
    }
    
    .button:hover, #pa-edit strong a:hover, input[type="button"]:hover, input.active[type="button"] {
        cursor: pointer;
        background: var(--cover1);
        border: 1px solid var(--borders) !important;
      color: var(--links);
      text-shadow: none
    }
    
    input[type="button"] {
        margin-bottom: 5px
    }
    
    
    .button:active {
        border-top-color: #2c5f75;
    }
    
    #pun-crumbs1 p.container, #pun-crumbs2 p.container {
      font: 400 12px Accia;
    }
    
    #pun-crumbs1 a, #pun-crumbs2 a {
      font-weight: 600
    }
    
    #pun-crumbs1 p {
      margin-bottom: 0px
    }
    
    #pun-crumbs1, #pun-crumbs2 {
      margin: 20px 0 !important;
    }
    
    #pun-crumbs1 .container strong+em,
    #pun-crumbs2 .container strong+em {
    	display: none !important;
    }
    
    .post_reputation {
      background: var(--cover1);
      border: 1px solid var(--borders) !important;
        border-radius: 5px;
    }
    
    
    #font-area, .popup_graffiti, #size-area, #image-area, #color-area, #addition-area, #video-area, .inner .popup_graffiti, #table-area, #keyboard-area, #smilies-area, #spoiler-area {
        color: var(--text1);
      background: var(--cover1);
      border: 1px solid var(--borders) !important;
        border-radius: 5px;
        padding: 15px !important;
    }
    
    
    #keyboard-area input {box-shadow: none;
    color: #312c12!important;}
    
    #font-area {height: 300px;
    overflow-y: auto;
    padding: 5px;
    text-align: left;
    width: 150px}
    
    
    #pun-index .tcmod {
        display: none
    }
    
    #pun-index .category + .category {
      margin-top: 60px
    }
    
    #pun-stats {
      margin-top: 25px
    }
    
    #pun .category h2 {
      margin: 0 -60px 20px !important;
      height: auto;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      position: relative;
      text-align: center;
      gap: 15px;
      color: #614937
    }
    
    #pun .category h2:before, #pun .category h2:after {
      content: "";
      width: 8px;
      height: 17px;
      display: block;
      position: absolute;
      top: -10px;
      z-index: 90
    }
    
    #pun .category h2:before {
      background: url(https://forumstatic.ru/files/001b/6b/7e/20595.svg);
      left: 0;
    }
    
    #pun .category h2:after {
      background: url(https://forumstatic.ru/files/001b/6b/7e/26367.svg);
      right: 0;
    }
    
    #pun .category h2 span {
      background: linear-gradient(270deg, rgba(39, 25, 19, 0) 0%, rgba(39, 25, 19, 0.07) 50%, rgba(39, 25, 19, 0) 100%);
      height:35px;
      margin-top: 0px !important;
      padding: 0px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-transform: uppercase;
      font: 600 15px Accia;
      position: relative;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-image: linear-gradient(270deg, rgba(196, 191, 171, 0) 0%, rgba(196, 191, 171, 1) 50%, rgba(196, 191, 171, 0) 100%) 1 round;
      align-self: stretch;
      position: relative
    }
    
    #pun .category h2 span:before {
      content: "";
      background: #17100F;
      height: 1px;
      width: 100%;
      position: absolute;
      top: -3px;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-image: linear-gradient(270deg, #503F36 0%, #A7906F 25%, #A7906F 75%, #503F36 100%) 1 round;
      border-top-width: 1px;
      border-top-style: solid;
      box-shadow: 0px 0px 10px rgba(28, 19, 13, 0.42);
    }
    
    .category h2 em {
      font: 300 italic 11px Accia;
      letter-spacing: .03em;
      align-self: center;
      flex: auto;
      max-width: 600px;
      text-transform: none
    }
    
    .category .container {
      padding: 0 0px;
        position: relative;
    }
    
    .category tr {
      margin: 0 0px;
      padding: 15px 20px 20px !important;
      font: 400 11px Accia;
      display: flex;
        align-items: center;
        justify-content: space-between;
      background: var(--cover2)
    }
    
    .category tr + tr {
      margin-top: 20px
    }
    
    #pun-index #pun-category1 h2 {
        margin-top: 35px !important;
    }
    
    #pun-index .category table {
        border: 0 !important;
    }
    
     #pun-index .category td {
        border: 0 !important;
    }
    
    #pun-index thead {display: none}
    
    #pun-index .category .tcl {
        padding: 0 !important;
        width: 480px;
      box-sizing: border-box
    }
    
    #pun-index .tclcon h3 a {
      font: 700 italic 15px Accia;
      height: auto;
      padding: 0 0px;
      color: var(--text1);
      position: relative;
      display: inline-block;
    }
    
    #pun-index .tclcon h3 a:hover {
      color: var(--links)
    }
    
    #pun-index .tclcon br {
      display: none
    }
    
    #pun-index .tclcon {
      position: relative;
      font-size: 11px;
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 10px
    }
    
    #pun-index tr.inew .tclcon:after {
      content: "";
      background: var(--icon);
      width: 49px;
      height: 79px;
      display: block;
      position: absolute;
      left: -80px;
      top: 50%;
      transform: translateY(-50%);
      mix-blend-mode: multiply;
      filter: drop-shadow(0px 0px 10px #938C68);
    }
    
    #pun-index tr.inew {
      background: rgba(154, 145, 126, 0.1);
    }
    
    #pun-index .tc2, #pun-index .tc3, #pun-index .tcmod {
        display: none
    }
    
    .tcr {
      line-height: 130%;
      padding-left: 0 !important;
      flex: 1;
      margin: 0 30px !important;
    }
    
    #pun-index .tcr a {
      font-weight: 600;
      font-size: 12.5px;
      display: inline-block;
        overflow: hidden;
        text-overflow: ellipsis;
        height: auto;
        width: 100%;
        white-space: nowrap;
    }
    
    .category td + td {
      padding: 0 0px;
    }
    
    .forumlinks {
        font: 600 9px Accia !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 0 -1px !important;
        gap: 5px;
    }
    
    .forumlinks a {
        text-transform: lowercase;
        display: inline-block;
        background: var(--cover1);
        padding: 3px 5px;
        flex: auto;
        text-align: center;
        transition: all .6s ease-in-out 0s !important;
        border: 1px solid var(--borders) !important;
      text-transform: uppercase;
      border-radius: 4px;
    }
    
    .forumlinks a:hover {
        background: var(--pun)
    }
    
    .forumlinks + br {
      display: none
    }
    
    .Add {
      font: 300 italic 10px Accia;
      opacity: .75;
      text-align: right
    }
    
    .Tems_And_messages {
      display: flex;
      width: 150px;
      justify-content: flex-end
    }
    
    #pun {
        background-position: center top;
        background-repeat: repeat-y;
    }
    
    #pun-main .post-author ul {
        text-align: center;
    }
    
    .punbb .post {
        border-color: transparent;
    }
    
    .topic a.sharelink {
        display: none;
    }
    
    textarea#main-reply:focus {
    outline:1px solid rgba(0,0,0,0)!important;
    }
    
    .go-up, .go-down {
        cursor: pointer;
        display: flex;
      justify-content: center;
      align-items: center;
        margin-bottom: 160px;
        opacity: 1;
        position: fixed;
        z-index: 99999;
        width: 24px;
        height: 24px;
      transition: filter .5s ease-in-out 0s !important;
      border-radius: 100%;
      box-sizing: border-box;
      mix-blend-mode: overlay
    }
    
    .go-up {
        bottom:230px;
        margin-left: 997px !important;
        background: rgba(73, 60, 47, 0.25);
      border: 1px solid rgba(86, 73, 60, 0.55) !important;
    }
    
    .go-down {
        bottom: 190px;
        margin-left: 997px !important;
        background: rgba(73, 60, 47, 0.25);
      border: 1px solid rgba(86, 73, 60, 0.55) !important;
    }
    
    .go-up:hover, .go-down:hover {
      filter: brightness(.3)
    }
    
    /* кнопки в форме ответа, с предыдущего дизайна взяты*/
    
    #form-buttons {
      width: 100%;
    }
    
    #form-buttons table, .punbb .formal textarea {
        box-sizing: border-box;
        margin: 0 auto;
    }
    
    #form-buttons table, #form-buttons tbody, #form-buttons tr {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -ms-flex-line-pack: center;
      align-content: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
    }
    
    #form-buttons table {
           text-align: center;
        margin: 0 auto 1em;
    }
    
    #form-buttons td {
         position: relative;
      background-image: none !important;
      display: block;
      min-height: 1.5em;
      min-width: auto;
      margin: 0.5em 8px;
      text-align: center;
      overflow: visible
    }
    
    #form-buttons td img {
         position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 10;
      width: 100%;
      height: 100%;
    }
    
    td#button-files_rusff, td#button-graffiti_rusff { display: none!important; }
    
    #form-buttons td:before {
       position: relative;
      top: .6em;
      font-family: FontAwesome;
      font-size: 1.2rem;
      z-index: 1;
      color: var(--text1);
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      transition: all 0.3s ease;
    }
    
    #button-font:before { content: '\f031'; }
    #button-size:before { content: '\f034'; }
    #button-bold:before { content: '\f032'; }
    #button-italic:before { content: '\f033'; }
    #button-underline:before { content: '\f0cd'; }
    #button-strike:before { content: '\f0cc'; }
    #button-left:before { content: '\f036'; }
    #button-center:before { content: '\f037'; }
    #button-right:before { content: '\f038'; }
    #floatbut:before { content: '\f03c'; }
    #button-link:before { content: '\f0c1'; }
    #button-spoiler:before { content: '\f0fe'; }
    #button-image:before { content: '\f1c5'; }
    #button-image2:before { content: '\f1c5';}
    #button-video:before { content: '\f008'; }
    #button-hide:before { content: '\f023'; margin-left: 0.4em !important; }
    #button-quote:before { content: '\f10e'; }
    #button-code:before { content: '\f121'; }
    #button-audio:before { content: '\f001'; }
    #button-color:before { content: '\f040'; }
    #button-table:before { content: '\f0ce'; }
    #button-shablon:before { content: '\f15c'; }
    #button-smile:before { content: '\f118'; }
    #button-keyboard:before { content: '\f11c'; margin-left: 0 !important; }
    #button-addition:before { content: '\f085'; }
    #button-files_rusff:before { content: '\f0ed'; }
    #button-mask:before { content: '\f113'; }
    #button-indent:before { content: '\f03c'}
    
    #wrapper{left:0px;top:-5px;position:relative;width:100%;z-index:10000!important;}
    
    .tabs{height:22px;line-height:21px;margin:0 0 13px !important;list-style:none;display: flex;
    justify-content: space-between}
    
    .tabs li{cursor:pointer; flex: 1;}
    .tabs li + li {margin-left: 5px}
    .tabs li a{        font: 500 11px Philosopher;
      text-transform: uppercase;
      padding: 7px 15px !important;
      width: auto;
      display: inline-block;
      letter-spacing: .06em;
      background: var(--icons);
      border: 1px solid var(--links) !important;
      border-radius: 3px;
      color: var(--text2) !important;
      transition: all .5s ease-in-out 0s;
      display:block;margin-bottom:-1px;padding:0 5px 1px;position:relative;text-align:center;text-decoration:none;}
    .tabs li a:hover{color:var(--links2) !important;}
    .tabs li.active a{filter: brightness(.7);color:var(--links2) !important;}
    #smilies-area div[class^="t-"]:not(.t-0){display:none;width:auto;padding:5px;text-align: center;
     overflow-y: auto; max-height: 200px}

    0


    Вы здесь » At Origin » Новый форум » css


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