Код:

::-webkit-scrollbar{width:7px; height:7px;}
::-webkit-scrollbar-track{background: var(--background2);border: 1px solid var(--border1)}
::-webkit-scrollbar-thumb{background: var(--background2);border:3px solid var(--border1)}
* {
  scrollbar-width: thin;
  scrollbar-color: #050505 #c9c9c9;
}

body::-webkit-scrollbar{width:13px; height:7px;}
body::-webkit-scrollbar-track{background: var(--background2);border: 1px solid var(--border1)}
body::-webkit-scrollbar-thumb{background:var(--background2);border:6px solid var(--border1) }

/* ================== */

#head_wrap {
  display: flex;
}
.head_forumname {
  font-size: 72px;
  z-index: 0;
  font-family: var(--font6);
  text-transform: uppercase;
  font-weight: 600;
}


/* ================== */
/* Общие стили */

:root {
--accent: hsl(252 31% 42% / 1);
}

body {
--white: #fff;
--background: #e6e6e6;
--background1: #f0f0f0;
--background2: #050505;
--backhalf: rgb(38 38 38 / 20%);
--border1: #c9c9c9;
--text1: #262626;
--link1: #aaa;
--link2: #333;
--accent2: #5e5582;
--backhalf1: rgb(230 230 230 / 55%);
--font7: 'Rubik', sans-serif;
--font2: 'DespairDisplay-Bold', sans-serif;
--font3: 'PT mono', sans-serif;
--font4: 'IBM Plex Sans', sans-serif;
--font5: 'Source Code Pro', monospace;
--font6: 'TT Travels Next Trl', sans-serif;
--font1: 'Open Sans', sans-serif;
--background-image: url(https://forumstatic.ru/files/001b/fa/64/39992.jpg) fixed no-repeat top center;
--background-image1: url(https://forumstatic.ru/files/001b/e8/4a/69514.jpg);
}

body.light_mode {
--white: #fff;
--background: #d9d9d9;
--background1: #e3e3e3;
--background2: #050505;
--backhalf: rgb(38 38 38 / 20%);
--border1: #c9c9c9;
--text1: #262626;
--link1: #aaa;
--link2: #333;
--accent2: #5e5582;
--backhalf1: rgb(217 217 217 / 55%);
--font7: 'Rubik', sans-serif;
--font2: 'DespairDisplay-Bold', sans-serif;
--font3: 'PT mono', sans-serif;
--font4: 'IBM Plex Sans', sans-serif;
--font5: 'Source Code Pro', monospace;
--font6: 'TT Travels Next Trl', sans-serif;
--font1: 'Open Sans', sans-serif;
--background-image: url(https://forumstatic.ru/files/001b/fa/64/39992.jpg) fixed no-repeat top center;
--background-image1: url(https://forumstatic.ru/files/001b/e8/4a/69514.jpg);
}

html{background: var(--background2);}

body {
margin:0px;
padding:0px; 
font-size: 12px;
font-family: var(--font1);
color: var(--text1);
background: var(--background-image), var(--background2);
}

a:link, a:visited, a:active { text-decoration: none; color: var(--accent); transition: 0.2s;}
a:hover { color: var(--text1); text-decoration: none; }

h1, h2, h3 {word-spacing: 6px; font-weight:500;}

/* ================== */

/* Тело форума */ 
.punbb {
  max-width: 1100px;
  margin: 50px auto 200px;
  border-radius: 20px;
}

.punbb {
  position: relative;
  background: var(--background);
  padding: 20px;
  border: 1px solid var(--border1);
}

.topic a.sharelink {display: none;}


/* ================== */

/* Меню навигации */
#pun-navlinks, #pun-ulinks {text-align: center; transition: top .2s ease;}

/* исчезновение при прокрутке */
#pun-navlinks, #pun-ulinks { background: var(--background); transition: top .2s ease;}
/* #pun-navlinks.scrolling, #pun-ulinks.scrolling { top: -54px; background: var(--background);}*/

#pun-navlinks .container {
  text-transform: uppercase;
  font-weight: 600;
  font-size: 16px;
}

/* Юзер меню */
#pun-ulinks .container {
  margin: 0;
  font-weight: 400;
  font-size: 12px;
  text-transform: lowercase;
}

#pun-navlinks {
  position: sticky;
  top: -2px;
  padding: 10px 0 0;
  text-align: center;
  z-index: 9;
  margin: 0 -20px;
  border-top: 1px solid var(--border1);
  font-family: var(--font5);
}

#pun-ulinks {
  position: sticky;
  padding: 4px 0;
  top: 26px;
  text-align: center;
  z-index: 8;
  margin: 0px -20px;
  border-bottom: 1px solid var(--border1);
  font-family: var(--font5);
}

/* ================== */

/* Форумные таблицы */

/* ================== */

#pun-status .container {
  font-size: 10px;
}

#pun-index .category h2{
  display: grid;
  margin: 20px -20px;
  grid-template-columns: 1fr 0fr 2fr 0fr 4fr;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  text-align: center;
  color: var(--accent);
  font-weight: 600;
  font-family: var(--font6);
  align-items: center;
  padding: 0;
  filter: hue-rotate(270deg);
}

h2:before{
  content: "";
  height: 1px;
  background: var(--backhalf);
}

h2:after{
  content: "";
  height: 1px;
  background: var(--backhalf);
}

#pun-index .category h2 span{padding: 20px;}

#pun-stats h2{
  display: grid;
  margin: 20px -20px;
  grid-template-columns: 1fr 2fr 1fr;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  align-items: center;
  color: var(--backhalf);
  font-weight: 600;
  font-family: var(--font6);
  text-align: center;
  padding: 0;
}

/* Категории */

#pun-index tbody.hasicon tr {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

#pun-index .tcl h3 a {
  color: var(--text1);
  font-size: 20px;
  z-index: 1;
  text-transform: uppercase;
  position: relative;
  margin-bottom: 15px;
  font-family: var(--font6);
  font-weight: 700;
  letter-spacing: 0;
}


#pun-index .tcl h3 a:hover {
  color: var(--accent);
}


#pun-index .tc2, #pun-index .tc3, #pun-index .tcmod {
    display: none
}

#pun-index thead{
    display: none
}

#pun-index td.tcr {
  position: relative;
  text-align: left;
  font-size: 12px;
  font-weight: 400;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.punbb .user-avatar {
  float: left;
  position: relative;
  height: 56px !important;
  width: 56px !important;
  margin: 1px 9px 2px 0px;
}

#pun-index .user-avatar {
  height: 60px !important;
  vertical-align: middle;
  display: flex;
  justify-content: center;
  align-items: center;
}

.punbb .user-avatar .avatar-image {
  border-radius: 10px !important;
  height: 56px !important;
  width: 56px !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  float: left;
}

.UntdLastpost {
  display: flex;
  flex-direction: column;
}

#pun-viewforum .forum tr td.tcr span.byuser, #pun-searchtopics .forum tr td.tcr span.byuser {
    display: block;
}

#pun-index td.tcr span.lastpost {
  display: block;
  font-size: 12px;
  margin-top: 10px;
  font-weight: 400;
  letter-spacing: 0.5px;
}

#pun-index td.tcr a {
  text-transform: uppercase;
  font-size: 14px;
  color: var(--accent);
  font-weight: 600;
  font-family: var(--font5);
}

.Add {
  text-transform: lowercase;
} 

.Tems_And_messages {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 120px;
}

#pun-viewforum .user-avatar, #pun-searchtopics .user-avatar, #pun-messages .user-avatar {
  height: 40px !important;
  width: 40px !important;
}
#pun-viewforum .user-avatar .avatar-image, #pun-searchtopics .user-avatar .avatar-image, #pun-messages .user-avatar .avatar-image {
  height: 36px !important;
  width: 36px !important;
  filter: grayscale(1);
}

#pun-viewforum .forum tr td.tcr span.byuser, #pun-searchtopics .forum tr td.tcr span.byuser  {
display: block;
}
#pun .punbb .user-avatar .isonline {
  animation: none;
  -moz-animation: none;
  -webkit-animation: none;
}

.descrlinks {
  float: right;
  margin-top: 4px!important;
  width: 100%;
  text-align: right;
  border-top: 1px solid var(--border1);
}

.descrlinks a {
  padding: 3px 3px;
  margin-right: 4px;
  font: 700 8.5px var(--font1);
  text-transform: uppercase;
}

/* иконки */

.punbb td div.tclcon {
  padding: 15px 30px 15px 20px;
  line-height: 16px;
  text-align: justify;
}
 
.subforums {padding: 5px 0; text-transform: uppercase; font-weight: 600;}

#pun-main .category Div.icon {margin: 30px 0px 0 -25px; font: normal 14px var(--font2);}

Div.icon {margin: 16px 0px 0 -25px;}

.punbb table Div.icon {
  position: absolute;
  width: 37px;
  height: 10px;
  font: normal 14px var(--font2);
  text-transform: uppercase;
}
.punbb table Div.icon::before {
  content: "old";
  color: var(--text1);
}

TR.inew Div.icon::before {
  content: "new";
  color: var(--accent);
}

TR.isticky Div.icon::before {
  content: "!!!";
  color: var(--accent);
}

TR.iclosed Div.icon::before {
  content: "xxx";
  color: var(--text1);
}


/* Статистика */

#pun-stats .statscon .container {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  flex-wrap: wrap;
}

li#onlinelist {
  margin-top: 10px;
  float: left;
  line-height: 130%;
  width: 100%;
}

/*эксперимент*/
.usertable thead {
    display: none;
}
.usertable tbody {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.usertable tr {
  display: grid;
  padding: .5em;
  margin: .5em;
  border: 1px solid var(--border1);
  background: var(--background1);
  justify-items: left;
  border-radius: 10px;
  width: 220px;
}
.usertable .username {
  font-size: 14px;
  font-family: var(--font6);
  font-weight: 600;
}
.usertable .user_title {
  font-style: italic;
  text-transform: lowercase;
}
.usertable .relation:before {
  content: 'Отношение: ';
  font-weight: bold;
}
.usertable .num_posts:before {
  content: 'Постов: ';
  font-weight: bold;
}
.usertable .registered:before {
  content: 'Зарегистрирован(а): ';
  font-weight: bold;
}
.usertable .last_visit:before {
  content: 'Был(а): ';
  font-weight: bold;
}
/*эксперимент - конец*/


/* ================== */

/* Страница топика */

.post h3 {
  margin: 30px 0;
  letter-spacing: 1px;
  font-size: 12px;
  height: 5px;
  text-align: left;
  border-bottom: 1px solid var(--border1);
  padding: 2px 20px;
}

.punbb .post h3 a{
  background: var(--background);
  padding: 0 5px;
}

.punbb .post h3 em {
  background: var(--background);
  padding: 0 10px;}

.punbb .post h3 a:before {
  content: "[ ";
}

.punbb .post h3 a:after {
  content: " ]";
}

.punbb .post h3 a:hover {
  letter-spacing: 1.5px;
}

.punbb  .post h3 strong:before {
  content: "[#";
}

.punbb  .post h3 strong:after {
  content: "]";
}

.post .container {
  background: var(--background1);
  border: 1px solid var(--border1);
  border-radius: 20px 20px;
  box-sizing: border-box;
}

.post-box {
  font-size: 14px;
  padding: 20px;
  text-align: justify;
  word-wrap: break-word;
  hyphens: auto;
}

.post-box a {font-weight: 600;}


.post .post-author {
  padding: 20px 20px 20px 26px;
  background: var(--background);
  border: 1px solid var(--border1);
  border-left: none;
  border-radius: 0 40px 40px 0;
  margin-left: -20px;
}

div.post-rating p {background: var(--background1) !important;}

.post .post-author ul {
margin: 0;
padding: 0;
}

.pa-author {
  font-family: var(--font6);
  margin: 0 -20px 0 -27px;
  padding: 0 26px 10px;
  font-size: 16px;
  font-weight: 600;
  word-spacing: 6px;
  border-bottom: 1px solid var(--border1);
  filter: hue-rotate(90deg);
}

.pa-author a:hover {
  letter-spacing: 1px;
}
.pa-avatar item2 {margin-top: 20px;}
.pa-avatar img {
}

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

.pa-title {
  font-size: 10px;
  line-height: 12px;
  padding: 5px 26px 5px 26px;
  text-transform: lowercase;
  letter-spacing: .5px;
  margin: 0px 5px 10px -27px;
  border-bottom: 1px solid var(--border1);
  border-right: 1px solid var(--border1);
  background: var(--background1);
  border-radius: 0px 0px 30px 0px;
}

.pa-fld1 {
  text-align: justify;
  margin: 10px 0 0;
  line-height: 18px;
}

.pa-fld2 a {font-size: 0px;}

.pa-fld2 a:before {content: '\e7fd'; font-family: Material Icons Outlined; font-size: 16px; color: var(--border1);}

.pa-fld1 a{font-weight: 600;filter: hue-rotate(90deg);}
.pa-respect a{filter: hue-rotate(90deg);}

.pa-posts, .pa-respect {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  margin: 10px 10px 10px 0;
}

.post .post-author .pa-posts span, .post .post-author .pa-respect .fld-name, .post .post-author .pa-respect .fld-name a, .isguest .post-author .pa-respect .fld-name {font-size: 0; width: 16px; height: 16px;}
.post-author li.pa-posts span:before {
  font-family: Material Icons;
  content: "\e158";
  font-size: 12px;
}

.isguest .post-author li.pa-respect .fld-name:before, .post-author li.pa-respect .fld-name a:before {
  font-family: Material Icons;
  content: "\e87d";
  font-size: 12px;
}

.ank_name {
  font-family: var(--font5);
  font-weight: 700;
  display: block;
  text-align: left;
  line-height: 14px;
  padding: 5px 10px 5px 20px;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin: 0px 5px 0px -20px;
}
.ank_name a {font-weight: 800;}

.pa-respect a{filter: hue-rotate(90deg);}
.pa-online, .pa-posts, .pa-respect, .pa-last-visit {text-transform: lowercase}

.post-links ul {
  padding: 20px 10px;
  margin: 0px;
  text-align: right;
  text-transform: lowercase;
  border-top: 1px solid var(--border1);
}

/* ================== */

/* Контент поста */
.quote-box, .code-box {
  margin: 20px;
  padding: 16px;
  border: 1px solid var(--border1);
  background: var(--backhalf1);
  border-radius: 20px;
}
.quote-box cite {
  display: block;
  padding-bottom: 5px;
  font-size: 16px; 
  font-weight: 700;
  font-style: normal;
  margin-top: 6px;
  margin-bottom: 6px;
  letter-spacing: 0px; 
  line-height: 20px;
  text-align: left;
}

.punbb .post-content .blockcode, .punbb .post-content blockquote {
  width: 100%;
  overflow: hidden;
  padding-top: 5px;
  margin: 0;
}

.code-box strong.legend {
  display: block;
  padding-bottom: 5px;
  font-size: 16px; 
  font-weight: 700;
  font-style: normal;
  margin-top: 6px;
  margin-bottom: 6px;
  letter-spacing: 0px; 
  line-height: 20px;
  text-align: left;
}

.post-content .spoiler-box > div {
  display: block;
  font-size: 16px;
  font-weight: 700;
  font-style: normal;
  margin-top: 6px;
  margin-bottom: 6px;
  letter-spacing: 0px;
  line-height: 20px;
  text-align: left;
}

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

pre {
  font-family: monospace, monospace;
  font-size: 12px;
}


/* Профиль + ЛС */
div#profile.formal.messages-container .post .post-author {
  padding: 20px 20px 20px 26px;
  background: var(--background);
  border: 1px solid var(--border1);
  border-radius: 40px;
  margin-left: -20px;
}

div#profile.formal.messages-container .pa-title {
  margin: 0px 5px 10px -26px;
}

div#profile.formal.messages-container .pa-reg {
  display: none;
}
/* Профиль + ЛС - конец*/

/* Просмотр профиля */

#profile-left {
width: 25% !important;
background: var(--background1);
padding: 17px!important;
text-align: center;
border-radius: 2px 0 0 2px;
box-sizing: border-box;
}

#profile-left strong {
  font-weight: bold !important;
}

#profile-right li strong {
padding: 0em!important;
text-transform: lowercase;
}

#profile-right {
  display: grid;
  grid-template-columns: 1fr 1fr;
  justify-content: space-evenly;
  gap: 12px;
  font-size: 11px;
  width: auto !important;
  background: var(--background);
  padding: 20px!important;
  border-left: none!important;
  box-sizing: border-box;
}
#profile-right li {
width: auto;
display: flex;
flex: auto;
text-align: center;
padding: 11px!important;
background: var(--background);
border: 1px solid var(--border1) !important;
border-radius: 4px;
align-items: center;
flex-direction: column;
justify-content: center;
}
#pun #profile-right li span {
float: none;
margin: 0;
width: auto;
text-transform: lowercase;
font-weight: bold;
}

#profile-right li#pa-fld1 span {
display: block;
}

div#viewprofile li#pa-fld1 {
grid-column: 1/-1;
}

div#viewprofile li#pa-fld1 div.ank_name {
  margin: 10px -11px;
  width: auto;
  border-radius: 0;
  border-right: 0;
  text-align: center;
  font-weight: 900;
}

div#viewprofile table {
  background: var(--background);
  border: 1px solid var(--border1);
  border-radius: 20px;
  overflow: hidden;
}

div#viewprofile li#pa-invites {
display: none;
}

div#viewprofile li#pa-avatar img {
}

#profile-left strong {
font-weight: bold;
}
#profile-left li#profile-name {
text-transform: none;
font-size: 16px;
font-family: var(--font5);
}

#profile-signature ul {
border-style: solid !important;
border-width: 1px 0 0 0;
border-color: #d6d7d3;
margin: 0;
padding: 1em 1em 0 1em;
}


/* Формы */
#main-reply {
  width: 100%;
  background: var(--background1);
  padding: 10px;
  border-radius: 10px;
}

#viewprofile-next #pa-edit a, input[class="button"], input[class="button submit"], input[type="button"] {
  padding: 5px 12px;
  text-align: center;
  margin: 5px;
  color: var(--accent);
  font-weight: 700;
  min-width: 75px;
  display: inline-block;
  text-transform: uppercase;
  font-size: 13px;
  background: var(--background1);
  border: 1px solid var(--border1);
  transition: 0.4s;
  -webkit-transition: 0.4s;
  cursor: pointer;
  border-radius: 5px;
}


#viewprofile-next #pa-edit a:hover, input[class="button"]:hover, input[class="button submit"]:hover, input[type="button"]:hover {
  background: var(--background);
  border: 1px solid var(--accent);
}

.punbb select {
  background: var(--background);
  color: var(--text1);
  border: 1px solid var(--accent);
  padding: 1px 2px 2px 1px !important;
}

#pun-reputation .inner, #tags .container {
  background: var(--background);
  border: 1px solid var(--border1);
  border-radius: 10px;
  padding: 20px;
}

#font-area, #size-area {
  right: unset !important;
  max-height: 220px;
  overflow-y: auto;
}

/* Символы в посте */

#post legend span{display: none;}

#plng {
  padding: 0;
  margin: 0 20px 0 0;
  font-weight: 500 !important;
  text-transform: uppercase;
  font-size: 0.75em;
  letter-spacing: 0.6px;
  line-height: 1;
}

#plng b {
  font-weight: 500 !important;
}


.punbb select {
  background: var(--background);
  color: var(--text1);
  border: 1px solid var(--accent);
  padding: 1px 2px 2px 1px !important;
}

#pun-reputation .inner, #tags .container {
  background: var(--background);
  border: 1px solid var(--border1);
  border-radius: 10px;
  padding: 20px;
}

#font-area, #size-area {
  right: unset !important;
  max-height: 220px;
  overflow-y: auto;
}


/* Прочее */
.lastedit {display:none;}
:focus {outline: none;}
.pun-modal .modal-inner {background: var(--background);}
#pun-userlist .usertable .container .user-avatar{display: none;} /* не показывать аватары на странице пользователей*/

#pun-crumbs1 .container em, #pun-crumbs2 .container em {font-size: 0;}
#pun-crumbs1 .container strong+em, #pun-crumbs2 .container strong+em {display: none !important;}
#pun-crumbs1 .container em:before, #pun-crumbs2 .container em:before {content: "/ "; font-size: 12px;}

div#pun-admin_categories { min-width: 900px;}

/* убрать кнопки цвет и смайлы */
td#button-smile, td#button-color {display: none;}

/*не показывать модераторов*/
.punbb td .modlist {display: none;}

/***   чтобы сделать красивым выделение текста   ***/
::selection {background: var(--backhalf); opacity: 0.3; color: #262626;}

#mask_dialog .inner, .hvStickerPackModalContainer .hvStickerPackModal {
  border: solid 1px var(--border1);
  border-radius: 4px;
  background: var(--background);
}


.FNTslider {
  position: relative;
  z-index: 1000;
  background: var(--background);
  width: 110px;
  height: 7px;
  margin: 3px 5px;
  border: solid 1px var(--border1);
  float: right;
  margin-right: 7%;
}
.FNTslider .before {
  height: 7px;
  border: solid 1px transparent;
  border-right: none 0;
  position: absolute;
  background: var(--backhalf);
  margin-top: -1px;
}
.FNTslider .thumb {
  width: 8px;
  height: 9px;
  position: relative;
  top: -1px;
  background: var(--accent);
  cursor: pointer;
}

/* шаблон анкеты */
.anketbox {
  padding: 20px 25px;
  color: #201e19;
  margin-bottom: 10px !important;
  background: var(--background);
  border: 1px solid var(--border1);
  border-radius: 40px;
}

.ank_title {
  padding-bottom: 5px;
  border-bottom: 1px solid var(--border1);
  font: bold 14px var(--font3);
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  align-items: end;
  padding-top: 22px;
  margin-bottom: 20px;
  word-spacing: 6px;
}

.anket_pic {
  margin-top: 25px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.anket_fc {
  margin-top: 5px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.anket_topinfo {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.anket_topinfo_left {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.anket_topinfo_right {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.anket_text {
  text-align: justify;
  line-height: 18px;
  max-height: 380px;
  overflow-y: auto;
  padding-right: 10px;
}

.lists-title {
  display: block;
  font-size: 20px;
  font-weight: 700;
  font-style: normal;
  margin-bottom: 6px;
  margin-top: 6px;
  padding: 2px 0 6px 0;
  letter-spacing: 0px;
  line-height: 20px;
  text-align: center;
  text-transform: uppercase;
  font-family: var(--font3);
  word-spacing: 6px;
  background: var(--background);
  border-radius: 4px;
  border: 1px solid var(--border1);
}

/* способности */

.spos_title {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 10px;
  border-bottom: 1px solid var(--border1);
  align-items: center;
  padding: 10px 0;
}

.spos_title:last-child {
  border-bottom: 0px solid var(--border1);

}

.spos_user {
  background: var(--background1);
  padding: 10px;
  border-radius: 10px;
}

/* хронология */

.chrono {
  display: grid;
  grid-template-columns: 1fr 3fr;
  grid-column-gap: 20px;
  grid-row-gap: 10px;
  border-bottom: 1px solid var(--border1);
  align-items: center;
  padding: 10px 0;
}

.chrono:last-child {
  border-bottom: 0px solid var(--border1);

}

.chrono_date {
  background: var(--background1);
  padding: 10px;
  border-radius: 10px;
  text-align: center;
  max-width: 200px;
  min-width: 150px;
  font-family: var(--font3);
}


/* @hagalnaud 13.03.2023 color accent
goat.rusff.me */

/* позиционирование */
.slider-container {
width: 160px;
  text-align: center;
  margin: 0 auto;
  position: absolute;
  margin-left: 39%!important;
  bottom: -9px;
}

/* внешний вид */
.slider {
  -webkit-appearance: none;
  width: 150px;
  height: 8px;
  border: 1px solid var(--text1);
  background: linear-gradient(to right, rgb(171 95 95), rgb(171 134 95), rgb(171 168 95), rgb(137 171 95), rgb(95 171 139), rgb(95 143 171), rgb(133 95 171), rgb(171 95 95));
  outline: none;
  opacity: 1;
}


.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 10px;
  height: 10px;
  border-radius: 0;
  background-color: var(--accent);
  cursor: pointer;
  border: 1px solid var(--text1);
}

@media screen and (max-width: 740px) {
 
html {
  background-color: var(--background2);
}

body {background: var(--background2);}

#pun {
    width: 100%;
    border-radius: 20px 20px 20px 20px;
    margin: 80px auto;
    position: relative;
    text-align: justify;
}

.punbb, #html-header, #pun-index .main .tcl {
    width: 100%;
    box-sizing: border-box;
}

#pun-navlinks .container {
    width: 100%;
    margin: 0 auto;
    padding: 4px 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

#pun-navlinks a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    font-size: 0;
    width: 30px;
    height: 30px;
    border-bottom: none !important;
    padding: 0;
}

#pun-navlinks a:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    left: 0;
    top: 0;
    pointer-events: none;
    font-family: "Material Icons";
    font-size: 24px;
    font-weight: 100;
    -webkit-transition: all 0.3s linear 0s;
    transition: all 0.3s linear 0s;
}

#pun-navlinks a:hover:before {
    outline: none;
    -webkit-transition: all 0.3s linear 0s;
    transition: all 0.3s linear 0s;
}

#pun-navlinks li {
    display: inline-block;
    margin: 0 4px;
    padding-top: 0px;
    position: relative;
}

#pun-navlinks li#navindex a:before {
    content: "\e58c";
  }
  #pun-navlinks li#navuserlist a:before {
    content: "\f233";
  }
  #pun-navlinks li#navsearch a:before {
    content: "\e8b6";
  }
  #pun-navlinks li#navprofile a:before {
    content: "\e853";
  }
  #pun-navlinks li#navpm a:before {
    content: "\e158";
  }
  #pun-navlinks li#navadmin a:before {
    content: "\e8b8";
  }
  #pun-navlinks li#navlogout a:before {
    content: "\e5cd";
  }
  #pun-navlinks li#navregister a:before {
    content: "\e7fe";
  }
  #pun-navlinks li#navlogin a:before {
    content: "\e5ca";
  }
  #pun-navlinks li#navpr_1 a:before {
    content: "\e7f4";
  }
  #pun-navlinks li#navpr_2 a:before {
    content: "\e666";
  }

#pun-main h1 span{
    font-size: 12px;
    text-transform: lowercase;
}

#pun-stats h2, #pun-main h2 {
  border-radius: 20px;
}

#pun-stats h2 span, #pun-main h2 span {
    padding: 5px;
    margin: 0 20px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.05em;
}


#pun-index tbody.hasicon tr {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

#pun-index thead, #pun-viewforum thead, #pun-online thead, #pun-searchtopics thead, #pun-respect thead {
    display: none;
}

#pun-userlist thead th.tc3.relation, #pun-userlist thead th.tc3.registered {
    display: none;
}

#pun-index .main .tc2, #pun-index .main .tc3, #pun-index .main .tcmod {
    display: none;
}

#pun-viewforum .main .tc2, #pun-viewforum .main .tc3, #pun-viewforum .main .tcmod, #pun-searchtopics .main .tc2, #pun-searchtopics .main .tc3, #pun-searchtopics .main .tcmod {display: none;}

#pun-index .main .tcr {
    width: 100%;
    box-sizing: border-box;
    text-align: left;
}

.Add {
  display: none;
}

#pun-index .intd {
    position: relative;
}

#pun-index div.icon {
    position: absolute;
    top: 0;
    left: 0;
 }

.punbb .post .post-author {
  float: none;
  width: 100%;
  margin: 0;
  padding: 0;
  border-radius: 20px;
  border-top: none;
  text-align: center;
  border-left: 1px solid var(--border1);
  text-align: center;
  margin-left: -1px;
 }

.punbb .post-body {
    margin: 0;
}

#pun .post .post-content td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
}

.post h3 {
  font-size: 10px;
  height: 4px;
}

.punbb .post h3 span {
margin-left: 2em;
margin-right: 2em;
}

.post-box {font-size: 16px;}

.punbb #form-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.punbb #form-buttons tr{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
   padding: 5px;
  width: 100%;
  box-sizing: border-box;
  gap: 10px 20px;
}

.pa-fld2, .pa-title, .pa-ip {display: none;}

.punbb .post .post-author ul {
    -webkit-column-gap: 10px;
    -moz-column-gap: 10px;
    column-gap: 10px;
    width: 100%;
    margin: 0 auto;
    padding: 0;
    display: grid;
    grid-template: 0fr 0fr/1fr 3fr 1fr;
    justify-items: center;
}

.pa-author {
  grid-area: 1/2;
  padding: 15px 0!important;
  display: flex;
  justify-content: center;
  border: none;
}
.pa-avatar {
  display: flex;
  order: 2;
  width: 40px;
  height: 40px;
  padding: 10px 0 0 5px!important
 }

.pa-avatar img {
  width: 40px;
  height: 40px;
  border: none!important;
  border-radius: 10px;
}

.pa-fld1 {
  grid-area: 2/-3;
}

 .pa-fld1 .info {
display: none;
}

.pa-posts {
  display: flex;
  justify-content: center;
  align-items: center;
  order: 4;
  grid-area: 2/1;
  margin: 0;
  padding: 15px 0!important;
  width: 100%!important;
}
.pa-respect {
  display: flex;
  justify-content: center;
  align-items: center;
  order: 5;
  grid-area: 2/3;
  margin: 0;
  padding: 15px 0!important;
  width: 100%!important;
}
.post-author .pa-online, li.pa-last-visit {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 6;
    width: 100%;
    border-radius: 0 0 20px 20px;
    grid-column: -4/4;
}

div#profilenav {
    float: none !important;
    margin-left: 0;
    display: block;
    width: auto;
    padding-top: 1.1em;
    text-align: center;
}
div#profilenav h2 {
  border-bottom: none;
}
div#profile .container {
    padding-left: 0em;
}
div#profilenav li {
  display: inline-block;
  margin: auto 0.2em 0.5em auto;
  padding: 0.4em 0.7em;
  border: 1px solid #262626;
  font-weight: 700;
  text-transform: lowercase;
}
div#profilenav li:hover, div#profilenav li:focus, div#pun-main li.isactive {
  background: #d3d3d3;
}

#profile-left {
   width: 100% !important;
    display: block;
    border-radius: 20px 20px 0 0;
    text-align: center;
}

#profile-right {
  text-align: center;
  border-radius: 0 0 20px 20px;
}
#profile-right li {
  padding: 0 !important;
  width: 100% !important;
  border-bottom: 1px solid var(--body);
}
#profile-right li:last-child {
  display: inline-block !important;
  padding: 0 !important;
  width: 100% !important;
  border-bottom: none;
}
#viewprofile li span {
    float: none !important;
    display: inline-block;
    font-weight: 700;
    padding: 10px 10px 5px;
    margin: 0 0 10px;
}
#viewprofile li strong, #viewprofile li div, #setmods dd {
    display: block;
    padding: 0.5em !important;
    font-weight: normal;
}
div#viewprofile li#pa-invites {
    display: none;
}
.pa-posts .fld-name, .pa-respect .fld-name {
    font-size: 0;
    display: block;
}

.pa-posts .fld-name:before {content: "\e0be"; font-family: "Material Icons"; font-size: 24px; font-weight: 100;}

.punbb .longinput input {
    width: 64%;
    margin: 0;
}

.post-content iframe[allowfullscreen] {
    width: 320px !important;
    height: 180px !important;
}


div#profile.formal.messages-container .post .post-author {
  background: var(--background);
  border: 1px solid var(--border1);
  border-top: none;
  border-radius: 20px;
  margin-left: -1px;
  padding: 0;
}
#pun-messages .user-avatar {display: none}
div#profile.formal.messages-container .pa-posts {display: none}
.post-links, .post-links ul {margin: 0!important;}
/* хронология */
.chrono { display: flex; flex-direction: column;}
.chrono_date {width: 100%;}

/* способности */
.spos_title { display: flex; flex-direction: column;}
.spos_user {width: 100%;}


.FNTslider, .pa-replies {display: none;}
}

@media screen and (max-width: 450px) {
.FNTslider {display: none;}
}