Test

Объявление

vesper orson kade max vielleicht чокопай дежавю обнимаю себя за плечи и наблюдаю, как саманта кидает в сумочку разбросанные по комнате мелочи. минуту назад мы искали наушники/нашлись под кроватью и вечное "мама это ты их туда спрятала"; позже тянули колготки из заваленного барахлом шкафа/я обещала все выкинуть если сэм не наведет порядок; халперт грех real-life; usa: p+s

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

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


Вы здесь » Test » Гостевая книга » Хуехуехехе


Хуехуехехе

Сообщений 21 страница 28 из 28

21

dsasdasd edfrsdfsdfsdfddsfsdfsdf

rewwrfsdfsdf d sfsdfsd dfsdf dsdfsdf sd f


dfsdfsdfsdfsdfsdfsdfdsf

  • dsfdsfsd dsfsdf sd

  • d fsdf

  • s fdsfs

0

22

структура ч1
Код:
@import url(style_cs.css);

@import url('https://fonts.googleapis.com/css2?family=Alumni+Sans:ital,wght@0,100..900;1,100..900&family=Amatic+SC:wght@400;700&family=Caveat:wght@400..700&family=Comforter+Brush&family=Dela+Gothic+One&family=Great+Vibes&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Serif+Display:ital,wght@0,100..900;1,100..900&family=Oswald:wght@200..700&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Poiret+One&family=Ponomar&family=Raleway:ital,wght@0,100..900;1,100..900&family=Russo+One&family=Unbounded:wght@200..900&family=Viaoda+Libre&family=Yeseva+One&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Anton+SC&family=Antonio:wght@100..700&family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..900;1,6..96,400..900&family=Boldonse&family=League+Gothic&family=Oleo+Script:wght@400;700&family=Readex+Pro:wght@160..700&family=Satisfy&family=Staatliches&family=Zeyada&display=swap');

/* Font Awesome */
@import url('https://kit-pro.fontawesome.com/releases/v6.5.2/css/pro.min.css');

/* Enforia */
@import url('https://forumstatic.ru/files/001b/60/55/18659.css');


/* доп шрифты */
@import url(https://forumstatic.ru/files/001c/39/a8/62559.css);

@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');


@font-face {
  font-family: 'PPNeueMachina';
  src: local("PP Neue Machina"), url(https://forumstatic.ru/files/001c/74/d2/72986.otf);
}


:root {
  --bg-header: url(https://forumstatic.ru/files/001c/74/d2/31039.svg);
  --bg-footer: url(https://forumstatic.ru/files/001c/74/d2/87541.svg);
  --bg-main: url(https://forumstatic.ru/files/001c/74/d2/60147.jpg);
  --bg-header-events: url(https://forumstatic.ru/files/001c/69/a5/74370.svg);
  --bg-guestroom: url(https://forumstatic.ru/files/001c/74/d2/23046.svg) top center no-repeat;
  --canvas-primary: 229, 229, 229;
  --canvas-tertiary: 35, 37, 40;
  --canvas-secondary: 223, 223, 223;
  --canvas-secondary-rgb: 242, 242, 242;
  --canvas-quarternary: 255, 255, 255;
  --text-primary: 35, 37, 40;
  --text-secondary: 23, 23, 23;
  --canvas-post-body: 223, 223, 223;
  --accent:208, 126, 131;
  --accent-secondary: 220, 157, 164;
  --light-accent: 213, 215, 214;
  --gray-main: 255, 255, 255;
  --gray-second: 238, 238, 238;
  --gray-text: 115, 115, 115;
  --text-dark-accent: 44, 57, 78;
  --white: 255, 255, 255;
  --text-color-secondary: 34, 42, 53;
  --bg-navlinks: #897E7940;
  --bg-profile: 246, 246, 246;
  --quote-code: 229, 229, 229;
  --menu: 218, 223, 229;
  --text-socnet: 66, 64, 63;
  --box-shadow-news: 2px 6px 10px 0px rgb(200 214 210), 0px 0px 8px 0px rgb(194 206 200) inset, 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  --post-body-color: rgba(255, 255, 255, 0.3);

  --border-bg-gray: #4D4D4D;
  --border-2px: 2px solid var(--border-bg-gray);
  --border-1px: 1px solid #9D9C9B;
  --border-accent: 1px solid rgb(var(--accent));
  --border-gray: 1px solid #8F9289;
  --bradius: 5px;
  --black: #000000;
  --anim-hover: ease-in-out .4s;

  /* Шрифты */
  --font-main: 'Rubik', sans-serif;
  --font-second-sa: 'Rubik', sans-serif;
  --font-cat-title: 'Rubik';
  --font-third: 'Rubik', sans-serif;
  --font-cat: 400 16px var(--font-main);
  --font-second: 400 10px var(--font-second-sa);
  --font-reserve: 'Rubik', sans-serif;
  --font-onemore: 'Rubik', sans-serif;
  --font-nano: 'Rubik', sans-serif;

  --fw100: 100;
  --fw400: 400;
  --fw500: 500;
  --fw600: 600;
  --fw700: 700;
  --fw800: 800;
  --fw900: 900;

  --fs8: 8px;
  --fs9: 9px;
  --fs10: 10px;
  --fs11: 11px;
  --fs12: 12px;
  --fs13: 13px;
  --fs14: 14px;
  --fs16: 16px;
  --fs18: 18px;
  --fs20: 20px;
  --fs22: 22px;

  --bradius-minor: 4px;
  --bradius-medium: 10px;
  --bradius-major: 100px;
  --bradius-top: 10px 10px 0 0;
  --bradius-bottom: 0 0 10px 10px;


  --border-profile-color: #B1A7A1;
  --plaque-gradient: radial-gradient(98.64% 362.92% at 56% -21%, #D4623E 0%, #FFF0EB 80%);
  --box-shadow-header: 0px 12px 15px 0px #4E3825A6;
  --box-shadow-inew: 2px 4px 6px 0px rgba(194, 204, 212, 1), -3px -4px 5px 0px rgba(255, 255, 255, 0.47);
  --gradient-marmalade: 0px 4px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
  --inew-icon: url(https://forumstatic.ru/files/001c/74/d2/65097.png) no-repeat center; 
  --star-h2: url(https://forumstatic.ru/files/001c/74/d2/71318.svg);

  --avatar-newbie: url(https://forumstatic.ru/files/001c/74/d2/65737.svg);
}

.light {
  --bg-main: url(https://forumstatic.ru/files/001c/74/d2/60147.jpg);
  --bg-header-events: url(https://forumstatic.ru/files/001c/69/a5/74370.svg);
  --canvas-primary: 229, 229, 229;
  --canvas-tertiary: 35, 37, 40;
  --canvas-secondary: 223, 223, 223;
  --canvas-quarternary: 255, 255, 255;
  --text-primary: 35, 37, 40;
  --text-secondary: 23, 23, 23;
  --canvas-post-body: 223, 223, 223;
  --accent:208, 126, 131;
  --accent-secondary: 220, 157, 164;
  --light-accent: 213, 215, 214;
  --gray-main: 255, 255, 255;
  --gray-second: 238, 238, 238;
  --gray-text: 115, 115, 115;
  --text-dark-accent: 44, 57, 78;
  --white: 255, 255, 255;
  --text-color-secondary: 34, 42, 53;
  --bg-navlinks: #897E7940;
  --bg-profile: 246, 246, 246;
  --box-shadow-inew: 2px 4px 6px 0px rgba(194, 204, 212, 1), -3px -4px 5px 0px rgba(255, 255, 255, 0.47);
  --box-shadow-news: 2px 6px 10px 0px rgb(200 214 210), 0px 0px 8px 0px rgb(194 206 200) inset, 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  --inew-icon: url(https://forumstatic.ru/files/001c/74/d2/65097.png) no-repeat center; 
  --star-h2: url(https://forumstatic.ru/files/001c/74/d2/71318.svg);
  --quote-code: 229, 229, 229;
 --menu: 213, 215, 214;
 --post-body-color: rgba(255, 255, 255, 0.3);

}

.dark {
  --bg-main: url(https://forumstatic.ru/files/001c/74/d2/60147.jpg);
  --bg-header-events: url(https://forumstatic.ru/files/001c/69/a5/74370.svg);
  --canvas-primary: 39, 39, 39;
  --canvas-tertiary: 35, 37, 40;
  --canvas-secondary: 68, 68, 68;
  --canvas-quarternary: 68, 68, 68;
  --text-primary: 209, 214, 221; 
  --text-secondary: 23, 23, 23;
  --canvas-post-body: 223, 223, 223;
  --accent:208, 126, 131;
  --accent-secondary: 220, 157, 164;
  --light-accent: 61, 69, 68;
  --gray-main: 55, 55, 55;
  --gray-second: 238, 238, 238;
  --gray-text: 115, 115, 115;
  --text-dark-accent: 189, 197, 211;
  --white: 255, 255, 255;
  --text-color-secondary: 209, 214, 221;
  --bg-navlinks: #897E7940;
  --bg-profile: 51, 51, 51;
  --text-socnet: 213, 200, 194;
  --box-shadow-inew: 2px 4px 6px 0px rgba(67, 79, 100, 1), -3px -4px 5px 0px rgba(14, 14, 14, 0.3);
  --box-shadow-news: 2px 6px 10px 0px rgb(70 77 75), 0px 0px 8px 0px rgb(109 116 113) inset, 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  --inew-icon: url(https://forumstatic.ru/files/001c/74/d2/65097.png) no-repeat center; 
  --star-h2: url(https://forumstatic.ru/files/001c/74/d2/71318.svg);
  --quote-code: 68, 68, 68;
 --menu: 51, 51, 51;
 --post-body-color: rgba(68, 68, 68, 0.3);

}

.gray {
  --bg-main: url(https://forumstatic.ru/files/001c/74/d2/60147.jpg);
  --bg-header-events: url(https://forumstatic.ru/files/001c/69/a5/74370.svg);
  --canvas-primary: 229, 229, 229;
  --canvas-tertiary: 35, 37, 40;
  --canvas-secondary: 223, 223, 223;
  --canvas-secondary-rgb: 185, 176, 170;
  --canvas-quarternary: 255, 255, 255;
  --text-primary: 35, 37, 40;
  --text-secondary: 23, 23, 23;
  --canvas-post-body: 223, 223, 223;
  --accent:208, 126, 131;
  --accent-secondary: 220, 157, 164;
  --light-accent: 213, 215, 214;
  --gray-main: 255, 255, 255;
  --gray-second: 238, 238, 238;
  --gray-text: 115, 115, 115;
  --text-dark-accent: 44, 57, 78;
  --white: 255, 255, 255;
  --text-color-secondary: 34, 42, 53;
  --bg-navlinks: #897E7940;
  --bg-profile: 246, 246, 246;
  --box-shadow-inew: 2px 4px 6px 0px rgba(194, 204, 212, 1), -3px -4px 5px 0px rgba(255, 255, 255, 0.47);
  --box-shadow-news: 2px 6px 10px 0px rgb(200 214 210), 0px 0px 8px 0px rgb(194 206 200) inset, 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  --inew-icon: url(https://forumstatic.ru/files/001c/74/d2/65097.png) no-repeat center; 
  --star-h2: url(https://forumstatic.ru/files/001c/74/d2/71318.svg);
  --quote-code: 229, 229, 229;
 --menu: 213, 215, 214;
 --post-body-color: rgba(255, 255, 255, 1);

}


@media not all and (-webkit-min-device-pixel-ratio: 0),
not all and (-o-min-device-pixel-ratio: 0/1),
not all and (min-resolution: .001dpcm) {
  @supports (-webkit-appearance: none) {
    .cult-links a::after {
      content: "\271A";
      position: absolute;
      margin: 2px 6px;
      color: rgb(var(--gray-text));
      font-size: 1.3em;
    }
  }
}

@-moz-document url-prefix() {
  * {
    scrollbar-width: thin;
    scrollbar-color: rgb(var(--accent)) rgb(var(--canvas-secondary));
  }
}

@supports (-webkit-touch-callout: none) {
  html {
    -webkit-text-size-adjust: 100%;
  }
}


/*************************************************************
A - SETUP
**************************************************************/

/* A1 Import the colour scheme
-------------------------------------------------------------*/




/* A1.1 */
@import url(style_cs.css);

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


a.group1,
a.group4,
a.group,
a.group5,
a.group6 {
  text-transform: lowercase;
  font-family: "Rubik", sans-serif;
  font-weight: 500;
  -webkit-transition: ease-in-out .4s;
  -o-transition: ease-in-out .4s;
  transition: ease-in-out .4s;
}


.ank-header {
  width: 600px;
  margin: 0 auto !important;
  border: 1px solid #ddd;
}

.ank-imgs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 10px;
  padding-block: 4px;
}

.ank-name {
  text-align: center;
  display: block;
  font-size: 20px;
  background-color: #fff;
  border-bottom: 1px solid #ddd;
}

.ank-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 10px;
  padding-block: 8px;
}

.ank-info li {
  text-align: center;
  width: 160px;
}

.ank-info li span {
  font-weight: 700;
  color: #A2BC8A;
}

.ank-desc {
  width: 560px;
  margin: 0 auto !important;
  white-space: pre-wrap;
}

.abilities {
  width: 560px;
  margin: 0 auto !important;
  background-color: #fff;
  padding-inline: 20px;
  padding-bottom: 20px;
  border: 1px solid #ddd;
  white-space: pre-wrap;
  margin-top: 20px !important;
}

.abilities span {
  display: block;
  background-color: #eee;
  border: 1px solid #ddd;
  margin-top: 12px;
  padding-block: 4px;
  padding-left: 12px;
}

.post-links a {
    text-transform: lowercase;
    font-family: 'Rubik', sans-serif;
    font-weight: 400;
 transition: color var(--anim-hover);
    color: rgb(var(--text-primary));
}

.post-links a:hover {
    color: rgb(var(--accent)) !important;
}


/* A2.1 */
html,
body {
  margin: 0;
  padding: 0;
  color: rgb(var(--text-primary));
}



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

/* 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%;
  margin: auto;
}

/* 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: 1.8em;
  vertical-align: middle
}


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

/* A3.1 */
body {
    font-size: 100.01%;
    background: var(--bg-main) fixed repeat, #3e4245;
    background-position: center;
    background-size: inherit;
     width: 1100px;
    margin: auto;
}

/* A3.2 */
.punbb {
  font: normal 68.75% rubik;
}

/* 3.3 */
.punbb textarea,
.punbb input,
.punbb select,
.punbb optgroup {
  font: var(--font-second);
  outline: none;
  background: rgb(var(--canvas-secondary));
  border: 0px solid var(--border-profile-color);
  border-radius: var(--bradius-medium);
  color: rgb(var(--text-primary));
  font-size: 12px;
}

.punbb input {
  /* border: 1px solid var(--border-profile-color); */
  padding: 2px 12px;
}

/* A3.4 */
.punbb h1,
.punbb h2,
.punbb h3,
.punbb table,
.punbb h4,
.punbb th {
  font-weight: normal;

}



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

/* A3.6 */
.punbb pre {
  font: var(--fw400) var(--fs12) var(--font-second-sa);
}

/* 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;
}


.punbb a {
color:inherit;
text-decoration: none;
}




/* CS3.1 .punbb a,*/
/* #pun-respect a,
#pun-messages a,
#profile-right a,
.punbb a:link,
.punbb a:visited,
.punbb-admin #pun-admain a,
.punbb-admin #pun-admain a:link,
.punbb-admin #punbb-admain a:visited,
div.roles-wrapper>div>div>a {
  -webkit-box-shadow: inset 0 0 0 0 rgb(var(--accent));
  box-shadow: inset 0 0 0 0 rgb(var(--accent));
  color: rgb(var(--text-primary));
  padding: 0 .25rem;
  margin: 0 -.25rem;
  -webkit-transition: color .3s ease-in-out, -webkit-box-shadow .3s ease-in-out;
  transition: color .3s ease-in-out, -webkit-box-shadow .3s ease-in-out;
  -o-transition: color .3s ease-in-out, box-shadow .3s ease-in-out;
  transition: color .3s ease-in-out, box-shadow .3s ease-in-out;
  transition: color .3s ease-in-out, box-shadow .3s ease-in-out, -webkit-box-shadow .3s ease-in-out;
  text-transform: lowercase;
  text-decoration: none; */
}

/* ссылки hover кастом
.post-links a:hover,
.subscribelink a:hover,
.postlink a:hover,
.post h3 a:hover,
#pun-userlist a:hover,
#pun-respect a:hover,
#pun-messages a:hover,
#profile-right a:hover,
div.roles-wrapper>div>div>a:hover,
li.pl-email.profile a:hover,
li.pl-email.pm a:hover,
li.pl-email.email a:hover,
li.pl-delete a:hover,
li.pl-edit.edit a:hover,
li.pl-quote a:hover,
p.container.crumbs a:hover,
p.container a:hover,
#pun-viewforum .forum a:hover,
#pun-messages a .forum a:hover,
#pun-searchtopics .forum a:hover,
.subforums a:hover,
.pls-postwriters a:hover,
.pls-activepersons a:hover,
.pls-duo a:hover,
.pls-episode a:hover,
.post-author a:hover,
.post-box a:hover {
  color: rgb(var(--text-primary));
  -webkit-box-shadow: inset 1000px 0 0 0 rgb(var(--accent));
  box-shadow: inset 1000px 0 0 0 rgb(var(--accent));
}  */


/* CS3.2  .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,
td.tcl>div>div.tclcon>h3>a:hover,
#pun-ulinks .container a:hover,
.namelinks a:hover,
.activename a:hover,
td.tcr>a:hover,
#pun-stats>div>ul>li.item4>strong>a:hover {
  color: rgb(var(--text-primary));
  -webkit-box-shadow: inset 1000px 0 0 0 rgb(var(--accent));
  box-shadow: inset 1000px 0 0 0 rgb(var(--accent)); */
}

/*CS3.4*/
#pun-navlinks a:hover,
#pun-navlinks a:focus,
#pun-navlinks a:active {
  color: rgb(var(--text-primary));
  -webkit-box-shadow: inset 1000px 0 0 0 rgb(var(--accent));
  box-shadow: inset 1000px 0 0 0 rgb(var(--accent));
}

#pun-pagelinks a:active,
#pun-pagelinks a:focus {
  color: rgb(var(--text-primary));
  -webkit-box-shadow: inset 1000px 0 0 0 rgb(var(--accent));
  box-shadow: inset 1000px 0 0 0 rgb(var(--accent));
}




li.pl-edit {
 transition: color var(--anim-hover);
}

li.pl-edit a:hover {
    color: rgb(var(--accent)) !important;
}




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




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

/* A4.1 */
.punbb .container:after,
.punbb .post-links ul:after,
.punbb .main div.inline:after,
.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-index #pun-main h1,
#pun-navlinks h2,
#pun-pagelinks h2,
#pun-status h2,
#pun-ulinks h2,
.punbb .forum h2,
.punbb .multipage .topic h2,
.punbb dl.post-sig dt span,
.punbb p.crumbs strong,
.punbb .divider hr,
.punbb .required label em,
.punbb .formsubmit label,
.punbb .submitfield label,
.punbb .modmenu label,
#pun-userlist .main h2 {
  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 {
  margin: 0 auto 18px auto;
  padding: 0 10px 10px 10px;
  border-style: none;
  border-width: 0;
  width: 1100px;
  border-radius: 5px;
}

/* A5.2 */
.punbb {
  float: left;
  width: 100%;
  top: 60px;
  margin-bottom: 150px;
  position: relative;
  height: auto;
  padding: 0px;
  background-color: rgb(var(--canvas-primary));
  border-radius: 10px;
}

.dark div.punbb {
  background-color: rgb(var(--canvas-primary));
}

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

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

/* A5.5 */
.punbb .category,
.punbb .post {
  margin-top: 20px;
}


.punbb .category {
  width: 940px;
  margin: 0 auto;
}

.punbb .category h2 {
  margin-top: 12px;
  padding: 0px !important;
}

/* 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 0px 0px
}

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

/* A5.10 */
.punbb .section h2,
#pun-main h1,
#pun-main h2,
#pun-stats h2,
#pun-debug h2 {
  padding: 0.5em 1em;
  border-style: none solid solid none;
  border-width: 0 0px 0px 0;
}

#pun-index .category h2 {
    width: 1100px;
    position: relative;
    left: -80px;
    /* box-shadow: inset 0 -1px 0px rgba(129, 144, 139, 0.6); */
    height: 33px;
    overflow: hidden;
    border-bottom: 1px solid rgba(129, 144, 139, 0.6);
}

#pun-index .category h2::before {
    content: '';
    position: absolute;
    width: 111px;
    height: 66px;
    top: 5px;
    left: 40px;
    background: var(--star-h2);
}

#pun-index .category h2 span {
    font: var(--fw800) 42px var(--font-cat-title);
    color: rgba(var(--light-accent), .9);
    position: relative;
    top: 10px;
}


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

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

/* B1.1 */
.punbb .post-content {
    padding: 20px 10px;
    margin: 0 0px 0 9px;
    box-sizing: border-box;
    width: 99.2%;
    border-radius: var(--bradius-medium);
    text-align: justify;
    color: rgb(var(--text-primary));
}

/* B1.2 */
.punbb .post-sig dt {
  display: block;
  border-top: 1px dashed rgb(var(--canvas-tertiary));
  width: 100%;
  margin: 10px 0;
  opacity: .2;
}

/* B1.3 */
.punbb .post-content p {
  margin-bottom: .6em;
  /* padding: 0 0 1em 0; */
  line-height: 150%;
  overflow-wrap: anywhere;
}

.post-content td {
  border-color: transparent;
}

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

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

/* B1.6 */
.punbb .post-content .blockcode,
.punbb .post-content blockquote {
    width: 100%;
    overflow: hidden;
    background: rgb(var(--quote-code), .4);
    border-radius: 4px;
}

.punbb .post-content .blockcode {
padding: 1em;
box-sizing: border-box;
}

/* B1.7 */
.punbb .post-content .scrollbox {
  width: 100%;
  overflow: auto;
}

/* B1.8 */
.punbb .post-content .quote-box:not(.hide-box):not(.spoiler-box) {
  margin: 35px 0 10px;
  padding: 1em;
  border-radius: 10px;
  background: rgb(var(--quote-code), .4);
}
.punbb .post-content .spoiler-box {
  /* margin: 10px 0 10px; */
  padding: 1em;
  background: rgb(var(--quote-code), .4);
  border-radius: 10px;
}

.punbb .post-content .code-box {
  margin: 10px 0 10px;
  padding: 1em;
  border-radius: 10px;
}


.punbb .post-content .code-box {
  padding: 0em;
}

.punbb .post-content .answer-box::before,
.punbb .post-content .quote-main::before {
    content: '';
    background: url(https://forumstatic.ru/files/001c/74/d2/76511.svg);
    width: 16px;
    height: 16px;
    position: absolute;
    margin: -35px 0 0px -12px;
    z-index: 5;
}

.dark .punbb .post-content .answer-box::before,
.dark .punbb .post-content .quote-main::before {
    filter: contrast(0.5) brightness(2.5);
}

.hide-box {
padding: 0px!important;
}

.hide-box blockquote {
padding: 1em;
    box-sizing: border-box;

}

.hide-box cite {
    background: rgb(var(--light-accent), .2);
    font: var(--fw400) var(--fs12) var(--font-third);
    color: rgb(var(--text-primary));
    height: 30px;
    width: 100%;
    padding: 8px 20px;
    border-radius: 4px;
    margin: 0px 0px 5px 0px;
    box-sizing: border-box;
}

/* B1.9 */
.punbb .quote-box cite,
.punbb .code-box strong.legend {
  display: block;
  padding-bottom: 0.7em;
  font-style: normal;
  /* margin: 0; */
  font-family: var(--font-second);
  text-transform: lowercase;
}

.code-box strong.legend {
    background: rgb(var(--light-accent), .2);
    font: var(--fw400) var(--fs12) var(--font-third);
    height: 23px;
    width: 100%;
    padding: 3px 20px;
    border-radius: 4px;
    margin: 0px 0px 2px 0px;
    box-sizing: border-box;
}



.punbb .answer-box cite {
    background: rgb(var(--light-accent), .2);
    text-transform: lowercase;
    position: absolute;
    font: var(--fw400) var(--fs13) var(--font-third);
    color: rgb(var(--text-primary));
    height: 17px;
    padding: 2px 13px 3px;
    border-radius: 4px;
    margin: -37px 6px;
    z-index: 0;
}

/* 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 {
  float: left;
  position: relative;
  width: 98.5%;
  font-size: 1em;
  height: 0;
}

/* B3.2 */
.multipage {
  margin-top: 3em;
}

/* B3.3 */
.linkst .pagelink {
    position: absolute;
    margin-top: -34px;
    left: 44px;
    color: rgb(var(--text-primary));
    font-size: 0px;
    background: rgb(var(--text-primary), .05);
}

/* B3.4 */
.linkst .postlink {
    position: absolute;
    top: -4em;
    right: 28px;
    width: 16em;
    text-align: right;
    z-index: 18;
    text-transform: lowercase;
}

/* B3.5 */
.punbb .linksb {
  text-align: right;
  padding: 0.4em 1em 0.5em 1em;
  font-size: 1em;
}

/* B3.6 */
.linksb .pagelink {
    float: left;
    position: relative;
    top: 3px;
    left: 32px;
    right: 14px;
    text-align: left;
    font-size: 0;
    background: rgb(var(--text-primary), .05);
}

/* B3.7 */
.linksb .postlink {
  float: right;
  width: 16em;
  right: 14px;
  position: relative;
}

/* B3.8 */
.subscribelink {
    clear: both;
    padding-top: 0.3em;
    width: 1044px;
    text-transform: lowercase;
}



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

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

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

/* C1.2 */
.punbb .formsubmit {
    padding: 0 0 0 .7em;
    margin: 0em 0 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: flex-start;
}

/* C1.3 */
.punbb .formsubmit input,
.punbb .formsubmit a,
.punbb .formsubmit span {
    background: rgb(var(--canvas-secondary));
    color: rgb(var(--text-primary));
    border: none;
    border-radius: 26px;
    padding: 2px 15px 3px 15px;
    cursor: pointer;
    font: var(--fw400) var(--fs12) var(--font-second-sa);
    overflow: hidden;
    text-transform: lowercase;
    margin: 0 5px;
    outline: none;
    -webkit-transition: background var(--anim-hover);
    -o-transition: background var(--anim-hover);
    transition: background var(--anim-hover);
    overflow: hidden;
    height: 32px;
}

.punbb .formsubmit input:hover,
.punbb .formsubmit a:hover,
.punbb .formsubmit span:hover {
  background: rgba(var(--accent), 0.2);
}


.punbb .formsubmit a,
.punbb .formsubmit span,
input[type="submit"],
input[type="button"] {
  background: rgb(var(--canvas-secondary));
  border: 0px solid;
  padding: 1px 20px 2px;
  cursor: pointer;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  color: rgb(var(--text-primary));
  text-transform: lowercase;
  margin: 0 2px;
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
  border-radius: 50px;
}

input[type="submit"]:hover,
input[type="button"]:hover {
  background: rgba(var(--accent), 0.2);
}

/* C1.4 */
.punbb fieldset {
  border-style: solid;
  border-width: 0px;
  padding: 0 18px 0 18px;
  margin: 0 0 1em 0;
  color: rgb(var(--text-primary));
}

/* C1.5 */
.punbb fieldset legend {
    padding: 2px 5px 4px;
    margin: 23px 0 0 -5px;
    border-radius: var(--bradius-minor);
    font-size: 1.1em;
    text-transform: lowercase;
    z-index: 5;
}

#pun-viewtopic fieldset legend {
  position: absolute;
}

/* C1.6 */
.punbb fieldset legend span {
  font: 700 1em var(--font-second-sa);
  padding: 1px 10px 2px;
  border-radius: 10px;
  text-transform: lowercase;
}

/* 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 0.8em 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 12em 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;
}

/* 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: 50%;
}



/* C2.2 */
.punbb .main .tc2,
.punbb .main .tc3,
.punbb .main .tcmod {
  text-align: left;
  /*   width: 10%; */
  word-break: break-word;
}

#pun-viewforum .main .tc3,
#pun-viewforum .main .tc2 {
  width: 10%;
}

#pun-viewforum .main td.tcr {
  width: 40%;
}

#pun-viewforum .main .tcl {
  width: 65%;
}

#pun-searchtopics .tcr .user-avatar {
  display: none
}

#forum>td.tc2,
#post>fieldset:nth-child(n)>legend>span,
#pun-index td.tc2,
#pun-index td.tc3,
#pun-navlinks #navawards,
#sparkle1,
#sparkle2,
#sparkle3,
#sparkle4,
#sparkle5,
.lastedit,
.punbb .datafield br,
.punbb thead,
.topic a.sharelink,
div#pun-live-rusff,
td.tc2.pmtc22>em {
  display: none;
}

#pun-main>div.usertable>div>table>thead,
.forum div table thead {
  display: contents;
}

#pun-main h1 {
  display: none
}

/* C2.3 */
.hasicon>tr>td.tcr {
    overflow: hidden;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    /* width: 30%; */
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 60px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    border-left: 1px solid #81888b47;
}

.hasicon {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

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

#pun-modviewforum .main .tcl {
  width: 85%;
}

#pun-searchtopics .main .tcl {
  width: 90%
}

#pun-searchtopics table>thead>tr {
  /* display: grid; */
  -ms-grid-columns: 5fr 3fr 2fr 2fr;
  grid-template-columns: 5fr 3fr 2fr 2fr;
  display: none;
}

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


#pun-searchtopics div.icon {
  display: none
}

#pun-searchposts .post h3 {
  font: var(--font-second);
}

#pun-searchposts li.pa-replies {
  background: rgb(var(--canvas-secondary));
  text-align: center;
  font: var(--font-second);
  margin: 10px;
  border-radius: 10px;
  padding: 3px 0 4px;
  text-transform: lowercase;
  color: rgb(var(--text-primary));
}

#pun-searchposts .post h3 span {
  height: 20px;
  padding: 2px 15px 3px;
}

#pun-multimove .post-author::before,
#pun-multidelete .post-author::before,
#pun-searchposts .post-author::before {
  content: none !important;
}

#pun-searchposts .post .post-author {
  height: 80px;
  border-radius: var(--bradius-medium);
  overflow: hidden;
}

/* 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 {
  text-transform: lowercase;
    margin-bottom: 5px;
    padding: 0px 0 5px 0;
    line-height: 7px !important;
    width: fit-content;
  -webkit-transition: ease-in-out .4s;
  -o-transition: ease-in-out .4s;
  transition: ease-in-out .4s;
  font: var(--fw800) var(--fs20) var(--font-cat-title);
  color: rgb(var(--accent));
  border-bottom: 1px solid transparent;
}

#pun-index .tcl h3:hover {
  color: rgb(var(--text-primary));
  border-bottom: 1px solid rgb(var(--accent));
}


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

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

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

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

/* C2.13 */
.punbb .main .tcl {
  border: 0;
}

/* C2.14 */
.punbb tbody.hasicon td.tcl {
  padding-left: 1.2em
}

/* C2.15 */
.punbb div.icon {
  border-style: solid;
  border-width: 0.6em 0.6em 0.6em 0.6em;
  height: 0;
  line-height: 0.0;
  margin-top: 0.1em;
  width: 0;
}

/* C2.16 */
.punbb table div.icon {
  font-size: 1.05em;
  position: absolute;
  margin-left: -2.2em;
}

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

/* C3.1 */
.punbb .post .container {
  margin-top: 10px;
  margin-bottom: 5px;
}

/* C3.2 */
.punbb .post h3 {
  border-width: 0px;
z-index: 9!important;
}

/* C3.3 */
.punbb .post h3 span {
    padding: 1px 20px 3px;
    margin: 0px 40px 0 40px;
    display: block;
    background: rgb(var(--canvas-quarternary), .3);
    border-radius: var(--bradius-medium);
    max-width: calc(100% - 30px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
position: relative;
}

.punbb .post h3 span::before, .punbb .post h3 span::after {
    content: '';
    position: absolute;
    width: 18px;
    top: 3px;
    height: 18px;
    background: url(https://forumstatic.ru/files/001c/74/d2/10171.png);
    background-size: contain;
    opacity: .5;
}

.punbb .post h3 span::before {left: -24px}
.punbb .post h3 span::after {right:-24px}


div.pagelink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font: var(--fw400) var(--fs11) var(--font-second-sa);
    text-transform: lowercase;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2px 2px 2px 2px;
    border-radius: var(--bradius-minor);
    background: var(--bg-dark-rgba);
    width: auto !important;
    color: rgb(var(--text-primary));
    gap: 1px;
}

div.pagelink>a {
    padding: 3px 8px 4px 8px !important;
    background: rgb(var(--text-primary), .05);
    margin: 0 !important;
    overflow: hidden;
    border-radius: 2px;
    font-size: var(--fs12);
    -webkit-transition: background var(--anim-hover);
    -o-transition: background var(--anim-hover);
    width: 5px;
    display: flex;
    justify-content: center;
}


div.pagelink>a:hover {
    background: rgba(var(--accent), 0.2);
}

div.pagelink>strong {
    padding: 3px 8px 4px 8px;
    border-radius: 1px;
    background: rgba(var(--light-accent), .7);
    font-size: var(--fs12);
}

div.pagelink>*:first-child {
  margin-left: 0px;
}

/* ПРОФИЛЬ */
.punbb .post .post-author {
  float: left;
  width: 218px;
  position: relative;
  display: block;
  height: auto;
  margin: 25px 0px 70px 12px;
  /* overflow: hidden; */
  border-radius: 10px;
  z-index: 0;
}




.pa-posts a:hover {
  box-shadow: none !important;
}


/* C3.6 */
.punbb .post .post-author p {
  padding: 0 1em 1em 1em;
  line-height: 140%;
}

/* C3.7 */
.pa-author {
    width: 218px;
    box-sizing: border-box;
    height: auto;
    margin: 8px auto 8px;
    position: relative;
    text-align: center;
    padding: 4px !important;
    border-radius: 10px 10px 0 0;
    text-transform: lowercase;
}

/* C3.8 */
.pa-author a {
    color: rgb(var(--text-primary));
    border-radius: var(--bradius-major);
    font: var(--fw700) var(--fs12) var(--font-third);
    padding: 1px 6px 2px 6px !important;
    box-sizing: border-box;
    box-shadow: none !important;
    transition: color var(--anim-hover) !important;

}

.pa-author strong {
  color: rgb(var(--canvas-tertiary));
  background: rgba(var(--canvas-secondary), 1);
  border-radius: var(--bradius-major);
  font: var(--fw700) var(--fs10) var(--font-second-sa);
  padding: 1px 4px 2px 4px !important;
  box-sizing: border-box;
  margin-right: 10px !important;
  box-shadow: none !important;
  transition: color var(--anim-hover) !important;

}

.pa-author a:hover {
  color: rgb(var(--accent));
  box-shadow: none !important;

}



/* ПРОФИЛЬ */


li.pa-title {
  padding: 7px 5px;
  font: var(--fw400) var(--fs9) var(--font-nano);
  color: rgb(var(--gray-text));
  background: rgb(var(--canvas-primary));
  text-transform: lowercase;
  text-align: center;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 229px;
  position: relative;
  z-index: 1;
}

li.pa-avatar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 218px;
    margin: 0 auto;
    padding: 0px 0px 5px;
    border-radius: var(--bradius-top);
    z-index: 1;
    position: relative;
}

li.pa-avatar img {
  border-radius: 5px;
  max-height: 180px;
  max-width: 180px;
}

li.pa-fld5 {
    position: absolute;
    width: 22px;
    height: 22px;
    left: -43px;
    top: 12px;
}

li.pa-fld5 div {
border-radius: 7px;
width: 22px;
height: 22px;
}


li.pa-fld5 div.ls_star {
    background: url(https://forumstatic.ru/files/001c/74/d2/94076.png) no-repeat center, rgba(96, 103, 110, 0.1);
    background-size: 13px;
    filter: brightness(1.2);
}


#pa-fld5 div.ls_star {
    background: url(https://forumstatic.ru/files/001c/74/d2/94076.png) no-repeat center, rgba(96, 103, 110, 0.1);
    background-size: 13px;
    filter: brightness(1.2);
    width: 0px;
    height: 12px;
    border-radius: 5px;
}

/* li.pa-fld3 {
  text-transform: lowercase;
  position: relative;
  color: rgb(var(--text-dark-accent));
  width: 229px;
  padding: 10px 30px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  z-index: 17;
  background: rgb(var(--canvas-post-body));
  font: var(--fw400) var(--fs10) var(--font-second-sa);
  border-bottom: 1px dashed rgb(var(--canvas-secondary-rgb));
} */



li.pa-last-visit {
  display: none;
}

li.pa-online {
  font-size: 0px;
    top: -31px;
    left: 121px;
    position: absolute;
    width: auto;
}

li.pa-online::before {
  content: '';
  width: 8px;
  height: 8px;
  background: rgba(var(--text-dark-accent), 0.4);
  position: absolute;
  border-radius: 50%;
  right: 6px;
  margin: 27px 0;
  animation: blinkColor .9s linear infinite;
  z-index: 10;
} 

/* .status-container {
  width: 22px;
  height: 22px;
  z-index: 10;
  margin: 10px 0px 0 112px;
  position: absolute;
  border-radius: 50%;
}

.status-online {
  background: url(https://forumstatic.ru/files/001c/17/73/33728.svg);
}

.status-offline {
  background: url(https://forumstatic.ru/files/001c/17/73/47869.svg);
} */


/* C3.11 */
.punbb .post-body {
  margin-left: 21.5em;
  padding: 0 0 1px 0;
  position: relative;
}

/* C3.12 */
.punbb .post-box {
  padding: 0px 1em 0 0;
  margin: 0 12px 0px 12px;
  position: relative;
  display: block;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  background: var(--post-body-color);
  border-radius: var(--bradius-medium);
}

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

.post-box a {
    transition: color var(--anim-hover);
    color: rgb(var(--accent));
}

.post-box a:hover {
    color: rgb(var(--text-primary)) !important;
}

/* C3.14 */
.punbb .post-links {
  margin-left: 214px;
  margin-right: 4px;
  border-left-style: solid;
  border-left-width: 0px;
}

/* C3.15 */
.punbb .post-links ul {
    padding: 0 0em 0px 0em;
    height: 2em;
    line-height: 2em;
    margin-left: -18em;
    margin-top: 5px;
    margin-bottom: 5px;
    background: transparent;
    width: 122%;
    max-width: 990px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: right;
}

/* C3.16 */
.punbb .post-links li {
  display: inline;
  padding-left: 1em;
}

.punbb .post-links li:first-child {
  padding-left: 0em;
}

.punbb .post-links li:last-child {
  margin-right: -10px;
}




/* 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 {
    width: 1050px;
    /* width: 35em; */
    padding: 0.5em 2.8em;
    text-align: right;
    text-transform: lowercase;
    left: 15px;
    position: relative;
    font: var(--font-second);
    color: rgb(var(--text-primary));
}

.punbb .modmenu .container a { 
 transition: color var(--anim-hover);
}
.punbb .modmenu .container a:hover {
    color: rgb(var(--accent)) !important;
}

div.modmenu>p>span {
  display: none
}

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



/* C4.3 */
.punbb .modmenu .container strong {
  float: left;
    color: rgb(var(--text-primary));
}

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


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

/* C5.1 */
.punbb .info .container {
  padding: 0.8em 4em;
  color: rgb(var(--text-primary));
}

/* C5.2 */
.punbb .info .container .backlink {
  padding-top: 0.8em;
  color: rgb(var(--text-primary));
}


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

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

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

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

/* C6.4 */
#viewprofile ul,
#profilenav ul {
  background: rgb(var(--canvas-secondary));
  padding: 1.5em 18px 0.8em 18px;
  width: 157px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 14px 0 15px 0px;
  border-radius: 10px;
}

/* C6.5 */
#viewprofile h2,
#profilenav h2 {
  background: transparent;
  border: none;
  padding: 0 0 0 0;
  margin: 0 14px -0.6em 14px;
}

/* 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: bold;
}

/*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;
  border-color: rgb(var(--canvas-secondary));
  border-radius: 10px;
  color: rgb(var(--text-primary));
}

#pun-userlist .isonline {
  right: 12px;
}


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

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

/* D1.1 */
#pun-title {
    /* margin-left: -1px; */
    position: absolute;
    width: 1100px;
    top: 0px;
    height: 395px;
    background: var(--bg-header);
    background-size: 100%;
}

/* D1.2 */
#pun-title h1 {
  display: block;
  height: 40px;
  padding: 2em 1em 0 1em;
}

/* D1.3 */
#pun-title .container {
  border-style: none solid none solid;
}

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

#pun-title table {
  border: none;
  height: 40px;
  width: 100%;
}

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

#pun-title td.title-logo-tdr {
  border: none;
  width: 468px;
}

::-moz-selection {
  color: var(--black);
  background: rgb(var(--accent))
}

::selection {
  color: var(--black);
  background: rgb(var(--accent))
}



::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background: rgb(var(--canvas-secondary)) !important;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: rgb(var(--accent)) !important;
  border-radius: 10px;
}



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

/* D2.1 */
#pun-pagelinks {
  position: absolute;
  top: -15px;
  left: 0;
  margin: 0;
  border: none;
  padding: 0;
  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 .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 1100px;
    position: absolute;
    margin: -425px auto 0;
    height: 20px;
    padding: 5px 0 5px 0 !important;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}


#pun-navlinks .container a {
    color: #bcbcbc;
}

/* D3.2 */
#pun-navlinks .container {
  padding: 0.7em 1em;
}

.container>li {
  color: rgb(var(--link));
}

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

/* D3.4 */
#pun-navlinks li a {
    color: rgba(var(--text-color-secondary), 0.7);
    font: var(--fw700) var(--fs14) var(--font-cat-title);
    text-transform: lowercase;
    text-decoration: none;
    margin: 3px 6px;
    transition: var(--anim-hover);
    box-shadow: none;
    display: block;
    position: relative;
}

#pun-navlinks li a::before {
content:'';
width:100%;
height: 1px;
top: 9px;
position: absolute;
background:  rgb(var(--accent));
opacity: 0;
    transition: var(--anim-hover);
}

#pun-navlinks li:hover a::before {
opacity: 1;
}

#pun-navlinks li a:hover {
    color: rgb(var(--accent));
  box-shadow: none;

}

#pun-navlinks li a span {
display: block;
transition: transform .4s ease-in-out;
}

#pun-navlinks li a:hover span {
  transform: translatey(-7px);
}

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


/* D4.2 */

#pun-ulinks {
    margin: 50px 46px 5px;
    display: flex;
    justify-content: center;
}

#pun-ulinks .container {
  border: none;
  text-align: left;
  text-transform: lowercase;
  font: var(--fw400) var(--fs10) var(--font-third);
}

/* D4.3 */
#pun-ulinks li,
#pun-ulinks li a {
  display: inline;
  border-left-style: solid;
  border-left-width: 0px;
  white-space: nowrap;
  color: rgb(var(--text-color-secondary));
  text-decoration: none;
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
}

#pun-ulinks li,
#pun-ulinks li a:hover {
  color: rgb(var(--accent));
}


/* D4.4 */
#pun-ulinks li a {
  padding: 0 0.3em 0 0.6em;
  margin: 0 0px;
}

/* D4.5 */
#pun-ulinks li.item1,
#pun-ulinks li.item1 a {
  border-left-style: none;
  border-left-width: 0;
  padding-left: 0
}

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

/* D5.1 */
#pun-status,
#pun-status .container {
  border-bottom: none;
  margin-bottom: 0;
  color: rgb(var(--text-primary));
  font: var(--fw400) var(--fs10) var(--font-second-sa);
  text-transform: lowercase;
  margin-left: 18px;
}

/* D5.2 */
#pun-status .container {
    padding: 0.8em 38px 1em 1em;
}

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

/* D5.4 */
#pun-crumbs1 {
  font-weight: bold;
  overflow: hidden;
  margin-top: 0;
  z-index: 10;
  position: relative;
  font-weight: 700;
  font-family: var(--font-cat-title);
}

/* D5.5 */
#pun-crumbs1 p.container {
    border-top: none;
    color: rgb(var(--text-primary));
    padding: 0em 1em 1.8em 4.6em;
    font: var(--fw400) var(--fs10) var(--font-onemore);
    text-transform: lowercase;
}

#pun-crumbs1 p.container a, #pun-crumbs2 p.container a {
    transition: color var(--anim-hover);
}

#pun-crumbs1 p.container a:hover, #pun-crumbs2 p.container a:hover {
    color: rgb(var(--accent)) !important;
}

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

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

#pun-announcement {
    width: 1100px;
    height: 407px;
    position: absolute;
    top: 0px;
    z-index: 5;
}

/* D6.1 */
#pun-announcement h2 {
  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: 1em 0em 1em 0em;
    position: absolute;
    box-sizing: border-box;
    top: 0px;
    width: 1100px;
    height: 407px;
}

#pun-announcement>div>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 914px;
    overflow: auto;
}



#pun-announcement .html-box>a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  color: var(--black);
  text-decoration: none;
  padding: 10px 7px;
  border: solid var(--border);
  border-width: 0 1px;
  margin: 0 3px;
  -webkit-transition: ease-in-out .4s;
  -o-transition: ease-in-out .4s;
  transition: ease-in-out .4s;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;

}

#pun-announcement .html-box>a>p {
  letter-spacing: .5px;
  font-family: var(--font-second-sa);
  text-transform: lowercase;
  opacity: .7;
}

#pun-announcement .html-box>a:hover {
  background: var(--black);
  color: rgb(var(--white));
}

#pun-announcement>div>div>a>span {
  font-weight: 900;
  font-size: 1.2em;
  font-family: var(--font-second);
  padding-right: 5px;
  opacity: 1;
}

#html-header {
  height: 385px;
    position: relative;
    z-index: 10;
pointer-events: none;
}

#html-footer {
    background-size: 100% !important;
    background: var(--bg-footer) no-repeat bottom;
    margin: 0;
    height: 108px;
}

/* D7 Statistics
-------------------------------------------------------------*/

/* D7.1 */
#pun-stats .container {
    padding: 1.2em 0em;
    position: relative;
    margin: 10px 42px;
    width: 1016px;
    box-sizing: border-box;
}

/* D7.2 */
#pun-stats li.item1,
#pun-stats li.item2 {
  clear: both;
  line-height: 150%;
}

/* D7.3 */
#pun-stats li.item3,
#pun-stats li.item4 {
  text-align: right;
  line-height: 150%;
  transition: color var(--anim-hover);
}

#pun-stats li.item4:hover {
    color: rgb(var(--accent)) !important;
}


/* D7.4 */
li#onlinelist {
  margin: 5px auto;
  width: 100%;
  color: rgb(var(--text-secondary));
  font: var(--fw400) var(--fs12) var(--font-third);
}

/* D7.5 */
li#onlinelist div {
  border-top-style: solid;
  border-top-width: 0px;
  padding: 0.7em 0 0 0;
  font-family: var(--font-second);
  text-transform: lowercase;
  color: rgb(var(--text-primary));
  text-align: justify;
}

#onlinelist>div>a,
#onlinelist>div>span>a {
  text-transform: lowercase;
}

#onlinelist a {
  box-shadow: inset 0 0 0 0 rgb(var(--accent));
  color: rgb(var(--text-primary));
  padding: 0 .25rem;
  margin: 0 -.25rem;
  transition: color var(--anim-hover);
}

#onlinelist a:hover {
    color: rgb(var(--accent)) !important;
}



/* 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: -33px;
  width: 300px;
  float: right;
  text-align: end;
  z-index: 20;
  position: relative;
  font: var(--font-second);
  text-transform: lowercase;
}

/* 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%;
    margin-right: 3.4em !important;
}


/* D5.4 */
#pun-crumbs2 {
  font-weight: bold;
  overflow: hidden;
  margin-top: 0;
  z-index: 10;
  position: relative;
  font-weight: 700;
  font-family: var(--font-cat-title);
}

/* D5.5 */
#pun-crumbs2 p.container {
    border-top: none;
    color: rgb(var(--text-primary));
    padding: 1em 2em 0.8em 4.1em;
    font: var(--fw400) var(--fs10) var(--font-onemore);
    text-transform: lowercase;
}

/* D8.8 */
#pun-break4 {
  border-width: 0px;
}

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

.punbb-admin #pun-title {
  position: relative;
}


/* 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 mono", "courier new", courier, monospace
}

/* D9.8 */
#pun-help .formal .parsedmsg,
#pun-help .formal .parsedmsg .incode {
  padding-bottom: 0;
}

/* главная */
.punbb h2 span {
    font-size: 0em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    height: 31px;
    width: 96.7%;
    margin-left: 0px;
    background-position: top;
    background-repeat: no-repeat;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: var(--fs8);
    border-radius: var(--bradius-minor);
    text-transform: lowercase;
}


#pun-viewtopic h2 span {
  height: 0px;
}
/* 
#pun-category1 h2 span {
  background-image: url(https://forumstatic.ru/files/001c/69/a5/36607.png);
}

#pun-category2 h2 span {
  background-image: url(https://forumstatic.ru/files/001c/69/a5/88534.png);
}

#pun-category3 h2 span {
  background-image: url(https://forumstatic.ru/files/001c/69/a5/31096.png);
}

#pun-category4 h2 span {
  background-image: url(https://forumstatic.ru/files/001c/69/a5/70635.png);
}

#pun-category5 h2 span {
  background-image: url(https://forumstatic.ru/files/001c/69/a5/14280.png);
}

#pun-category6 h2 span {
  background-image: url(https://forumstatic.ru/files/001c/69/a5/63905.png);
}

#pun-category7 h2 span {
  background-image: url(https://forumstatic.ru/files/001c/69/a5/56010.png);
} */

.category>div>table>thead>tr {
  display: none;
}

.category tr {
    margin: 10px -26px 0px;
  width: 1000px;
  padding: 10px;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2fr 1fr;
  grid-template-columns: 2fr 1fr;
  position: relative;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
    border-bottom: 1px solid rgb(var(--light-accent));
}

/* .category tr:last-child {
  border-bottom: 0px;
} */

#pun-index .tcl {
  width: 80%;
}

.isub {
  display: -ms-grid;
  display: grid;
  background: rgb(var(--white));
}

.isub>td.tcr>em {
  position: absolute;
}

.isub>td>div>div>h3>a {
  font-size: 1.34em;
  font-weight: bold;
  text-transform: uppercase;
  font-family: var(--font-cat-title);
  padding: 4px 0 5px 0;
  -webkit-transition: ease-in-out .4s;
  -o-transition: ease-in-out .4s;
  transition: ease-in-out .4s;
}

.category>.container>table>tbody>tr.tcr {
  width: 100%;
}

td.tcl>div>div.tclcon>p {
  text-align: justify;
  color: rgb(var(--text-primary));
  text-transform: lowercase;
  font: var(--fw500) var(--fs10) var(--font-main);
}

.cult-links {
  margin-top: 10px;
}

.cult-links a {
  padding-right: 20px;
  text-transform: lowercase;
  font-family: "Commissioner", sans-serif;
}

.cult-links a::after {
  content: "\271A";
  position: absolute;
  margin: -3px 6px;
  color: rgb(var(--gray-text));
  font-size: 1.3em;
}

.cult-links a:last-child::after {
  content: "";
}

.lastpost-link {
  text-transform: lowercase;
  font: var(--fw500) var(--fs12) var(--font-second-sa);
  margin-top: -9px !important;
  padding: 0px 0px 0px 0px !important;
  margin-bottom: 7px !important;
  margin-left: 0px !important;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  max-width: 215px;
    color: rgb(var(--text-primary)) !important;
  white-space: nowrap;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  transition: color var(--anim-hover);
}
.lastpost-link:hover {
    color: rgb(var(--accent)) !important;
}

.lastpost {
    color: rgb(var(--text-color-secondary), .7);
    text-transform: lowercase;
    font: var(--fw400) var(--fs10) var(--font-second-sa);
    margin-top: -3px;
    opacity: .7;
    letter-spacing: .1px;
}

.punbb table div.icon {
    font-size: 0em;
    width: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 70px;
    position: absolute;
    top: 5px;
    left: 550px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-size: contain;
}

/* #pun-index table tr.inew {
  background: rgba(var(--text-primary), 0.03);
  border-radius: var(--bradius-medium);
} */


.punbb table div.inew {
    font-size: 0em;
    background: var(--inew-icon);
    width: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: 5px;
    left: 550px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 5;
    background-size: contain;
    padding-right: 6px;
}

.punbb table div.inew::before {
    content: '';
    position: absolute;
    width: 53px;
    height: 48px;
    left: 0px;
    top: 50%;
    background: transparent;
    transform: translateY(-50%);
    border-radius: 10px;
    /* box-shadow: var(--box-shadow-inew); */
    z-index: 0;
}


#pun-index .user-avatar {
  position: absolute;
}

.punbb .user-avatar {
  float: left;
  position: relative;
  margin: 6px 9px 2px -40px !important;
}

.punbb .user-avatar .avatar-image {
  height: 26px !important;
  width: 26px !important;
  border: var(--border-2px);
  -webkit-filter: grayscale(100%) brightness(155%) saturate(80%) contrast(130%) invert(20%);
  filter: grayscale(100%) brightness(155%) saturate(80%) contrast(130%) invert(20%);
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
}

.punbb .user-avatar .avatar-image:hover {
  -webkit-filter: grayscale(0%) brightness(100%) saturate(110%) contrast(120%) invert(20%);
  filter: grayscale(0%) brightness(100%) saturate(110%) contrast(120%) invert(20%);
  opacity: 1;
}

.hasicon>tr>td.tcr>br {
  display: none;
}

.isub {
  -ms-grid-columns: 50% 10% 10% 25% !important;
  grid-template-columns: 50% 10% 10% 25% !important;
}

.subforums {
  font: var(--fw400) var(--fs10) var(--font-second-sa);
  padding: 3px 0 7px;
  color: rgb(var(--gray-text));
  text-transform: lowercase;
}



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

#pun-stats>h2::before {
    content: "статистика";
    font: var(--fw800) 26px var(--font-cat-title);
    color: rgb(var(--light-accent));
    left: 41px;
    position: relative;
    top: 0px;
}

li.stats-crumbs {
    display: flex;
    gap: 10px;
    width: 1018px;
    FONT-VARIANT: JIS90;
    position: relative;
    justify-content: flex-end;
    top: -3px;
}

#pun-stats li.item1,
#pun-stats li.item2,
#pun-stats li.item3,
#pun-stats li.item4 {
    display: inline-flex;
   /* min-width: 20%; */
    text-align: center;
    color: rgb(var(--text-primary));
    margin-top: 0px;
    gap: 5px;
    height: 20px;
    padding: 3px 8px;
    box-sizing: border-box;
    text-transform: lowercase;
    font: 400 var(--fs12) var(--font-second-sa);
    z-index: 3;
    position: relative;
    background: rgb(var(--light-accent), .4);
    border-radius: var(--bradius-major);
    justify-content: center;
    flex-direction: row;
    flex-wrap: nowrap;
}


#pun-stats li.item1>span,
#pun-stats li.item2>span,
#pun-stats li.item3>span,
#pun-stats li.item4>span {
  font: 400 var(--fs11) var(--font-second-sa);
  color: rgb(var(--text-primary));
}

#pun-stats>h2 {
    position: absolute;
    display: block;
    width: 1100px;
    margin: auto;
    font-size: 0px;
}

.statscon {
  position: relative;
  width: 1100px;
}

#pun-viewtopic #pun-main>h1 {
  display: none;
  width: 800px;
  margin: 0 auto 7px;
  text-align: center;
  background: rgb(var(--canvas-secondary));
  border-radius: 50px;
  padding: 1px 10px 2px;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
}

#pun-viewtopic #pun-main>h1>span {
  display: none;
}


/* просмотр тем в форуме */

#pun-searchtopics .user-avatar {
  margin-top: -24px !important;
}

.multipage>div>div>table:not(.table_GamePosts)>tbody>tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 970px;
  margin: 5px 15px;
  padding: 2px 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  color: rgb(var(--text-primary));
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
  justify-content: center;
  border: solid rgba(var(--text-primary), 0.1);
  border-width: 0px 0 1px 0;
}

.multipage>div>div>table:not(.table_GamePosts)>tbody>tr a { 
 transition: color var(--anim-hover);
}
.multipage>div>div>table:not(.table_GamePosts)>tbody>tr a:hover {
    color: rgb(var(--accent)) !important;
}

#pun-userlist table>tbody>tr {
  margin: 5px 8px;
  display: grid;
  -ms-grid-columns: 2fr 2fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 2fr 2fr 1fr 1fr 1fr 1fr;
  width: 1030px;
}

.multipage>div>div>table>tbody>tr>td.tcr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: row;
  gap: 15px;
  padding-left: 5px;
  align-items: center;
  justify-content: flex-start;
}

#pun-searchtopics table>tbody>tr {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 8fr 2fr 1fr 4fr;
  grid-template-columns: 8fr 2fr 1fr 4fr;
  width: 1038px;
  margin: 5px 31px;

}

.forum>div>table>tbody>tr>td.tcr>em>a>span.avatar-image {
  height: 36px !important;
  width: 36px !important;
  position: absolute;
}

.forum>div>table>thead>tr {
  text-transform: lowercase;
  font: var(--font-second);
  color: rgb(var(--canvas-tertiary));
}

.forum>div>table>tbody>tr>td.tcr>em {
  position: absolute;
  margin: 4px 9px 2px -45px !important;
}



0

23

структура ч2
Код:
div.section.online-list>div>table>tbody>tr {
  display: block;
  /* display: grid; */
  /* grid-template-columns: 50% 21% 29%; */
}

#pun-online .tcl.action {
  width: 100% !important;
}

#pun-online tbody tr {
  display: grid;
  grid-template-columns: 2fr 2fr 1fr;
  gap: 10px;
  width: 1000px;
  margin: 5px 50px;
}

#pun-online tbody tr .username,
#pun-online tbody tr .action,
#pun-online tbody tr .tc3 {
  width: 100%;
}

.tr-divider {
  background: transparent !important;
  margin-top: 20px !important;
  margin-bottom: 15px !important;
  border-top: 1px solid rgba(var(--text-primary), 0.1) !important;
}

.td-divider {
  width: 1050px;
  border-radius: var(--bradius-minor);
  text-align: center;
  height: 14px;
  margin: 3px;
  color: rgb(var(--text-primary));
  background: var(--bg-dark-rgba);
  padding: 1px 0 3px 0 !important;
  font: var(--fw700) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
  border-top: 1px solid rgba(var(--text-primary), 0.1);
}

.forum>div>table>tbody>tr>td.tcl>div>div.icon {
  font-size: 0em;
  margin: 4px 0 0 -20px;
  border-radius: 50%;
}

.forum>div>table>tbody>tr>td.tcl>div>div.icon-new {
  color: rgb(var(--link));
}

.stickytext {
  display: none;
}

/* список участников */

div.usertable>div>table>tbody>tr {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2fr 2fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 2fr 2fr 1fr 1fr 1fr 1fr;
  width: 1030px;
  height: 40px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  color: rgb(var(--text-primary));
  text-transform: lowercase;
}

.registered {
  width: 100% !important;
}

div.usertable>div>table>thead>tr {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2fr 2fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 2fr 2fr 1fr 1fr 1fr 1fr;
  background: rgb(var(--canvas-secondary));
  font: var(--font-second);
  text-transform: lowercase;
  border-radius: 10px 10px 0 0;
}

div.usertable>div>table>tbody>tr>td.tcl.username {
  padding-left: 60px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 75% !important;
}

div.usertable>div>table>tbody>tr>td.tcl.username>em {
  margin: 3px 8px 2px -46px !important;
  padding-right: 11px;
  height: 36px !important;
  width: 36px !important;
}

div.usertable>div>table>tbody>tr>td.tcl.username>em>a>span.avatar-image {
  height: 30px !important;
  width: 30px !important;
}

/* Личные сообщения */

#profilenav>h2>span {
  color: rgb(var(--text-primary));
  text-align: center;
  z-index: 10;
  background: rgb(var(--canvas-secondary));
  position: relative;
  display: block;
  width: 157px;
  height: 17px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-left: -14px;
  border-radius: 30px;
  font: var(--fw700) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
  padding: 0 11px 2px;
}

#profilenav>ul>li>a {
  color: rgb(var(--text-primary));
  text-transform: lowercase;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
}



#messages>fieldset>div>div>table>tbody>tr>td>div>div.icon {
  color: rgb(var(--canvas-primary));
  width: 6px;
  height: 6px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
    overflow: hidden;
  left: 7px;
  top: 7px;
  border-radius: 50%;
}

#messages>fieldset>div>div>table>tbody>tr>td>div>div.icon.inew {
  color: rgb(var(--canvas-tertiary));
  width: 6px;
  height: 6px;
    overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  left: 7px;
  top: 7px;
  border-radius: 50%;
}

#messages>fieldset>div>div>table>tbody>tr {
  position: relative;
  background: rgb(var(--canvas-secondary));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 790px;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
  height: 25px;
  margin: 0 0 5px 40px;
  border-radius: 10px;
}

#pun-messages #profile fieldset legend {
  display: flex;
  justify-content: space-between;
  width: 774px;
  align-items: center;
  padding: 5px 5px;
  margin: 5px 23px;
}

#messages fieldset legend {
  left: 100px;
  position: relative;
  left: 18px;
  position: relative;
  width: 777px !important;
}

#messages>fieldset {
  border-width: 0px;
  padding: 0 !important;
}

#messages>fieldset>legend>span {
  font: 700 1em var(--font-second-sa);
  background: rgb(var(--canvas-secondary));
  padding: 0px 7px;
  text-transform: lowercase;
  border-radius: 30px;
  height: 17px;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}



#messages>div>div.pagelink>strong {
  background: var(--border);
  padding: 2px 6px;
  margin-right: 2px;
  color: rgb(var(--text-primary));
}

#messages tbody.hasicon td.tcl {
  padding: 2px 20px;
  width: 430px !important;
  white-space: nowrap;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  position: relative;
  display: block;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

#pun-messages .some-stuff,
#pun-messages .pa-posts {
  display: none;
}

#pun-messages .pa-avatar {
  padding-bottom: 20px;
  margin-bottom: 10px;
  border-radius: 10px;
}

#pun-messages .post .post-author {
  margin: 0px 0px 70px 25px !important;
}

#pun-messages .post-author ul {
  border-radius: 0 0 10px 10px;
}

#pun-messages ul li.pa-online::before {
  content: '';
  width: 8px;
  height: 8px;
  background: rgba(var(--text-dark-accent), 0.4);
  position: absolute;
  border-radius: 50%;
  right: 6px;
  top: 23px;
  animation: blinkColor .9s linear infinite;
  z-index: 10;
}

li.pa-time-visit,
li.pa-reg,
#pun-messages ul>li.pa-reg {
  display: none
}

#pun-messages .post h3 span {
  padding: 1px 20px;
  margin: 0 12px 5px 23px;
  display: block;
  background: rgb(var(--canvas-secondary));
  border-radius: 10px;
  width: 786px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font: var(--font-second);
  text-transform: lowercase;
}

#pun-messages .post-content {
  padding: 5px 0;
  margin: 15px;
  width: 512px;
  overflow: hidden;
  text-align: justify;
}

#pun-messages li.pa-title {
  display: none;
}

#pun-messages .post-links ul {
  padding: 0 1em 0 0;
  height: 2em;
  line-height: 2em;
  margin-left: 5.4em;
  background: transparent;
  width: 540px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: right;
}

#profile-left #pa-edit>strong>a, 
#pun-main>div.linkst>noindex>div>span>a, 
#pun-main>div.linksb>noindex>div>span>a, 
#profile>div>fieldset>legend>strong {
    font: var(--fs12) var(--font-second-sa);
    border-radius: var(--fs20);
    padding: 5px 15px 6px;
    text-transform: lowercase;
    color: rgb(var(--text-primary));
    overflow: hidden;
    transition: background var(--anim-hover) !important;
    box-shadow: none !important;
    background: rgb(var(--canvas-secondary));
}

#profile-left #pa-edit>strong>a:hover,
#pun-main>div.linkst>noindex>div>span>a:hover,
#pun-main>div.linksb>noindex>div>span>a:hover,
#profile>div>fieldset>legend>strong:hover {
  background: rgba(var(--accent), 0.2);
  box-shadow: none !important;

}





#punbbsearch {
  text-transform: lowercase;
}

/* просмотр тем в форуме */

#pun-viewforum tbody>tr>td.tcl>div>div.icon {
  background: rgba(var(--text-primary), 0.4);
  position: absolute;
  top: 8px;
  left: 32px;
  width: 6px;
  height: 6px;
  border: none;
  border-radius: 50%;
}

#pun-viewforum tbody>tr>td.tcl>div>div.icon-new {
  background: rgb(var(--canvas-tertiary));
}

#pun-viewforum tbody>tr>td.tcl>div>div.icon::after {
  content: none;
}

#pun-viewforum table>tbody>tr {
  width: 1040px;
  margin: 2px auto;
}

#pun-viewforum table>tbody>tr:not(.tr-divider):not(#title-logo-tr) {
  height: 42px;
}

#pun-viewforum h1 span {
  display: none
}


#pun-viewforum table>tbody>tr>td.tcr>em {
  position: absolute;
  margin: -24px 9px 2px -45px !important;
  display: none;
}

#pun-viewforum table>tbody>tr>td.tcr>span {
  margin: 0px 0px 0px -3px !important;
}


#pun-viewforum table>tbody>tr>td.tcl>div>div.tclcon {
  margin-left: -10px;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
}

#pun-viewforum table>tbody>tr>td.tcl>div>div.tclcon>.byuser,
#pun-viewforum table>tbody>tr>td.tcl>div>div.tclcon>strong>.byuser {
  color: rgba(var(--gray-text));
}

#pun-viewforum tbody>tr>td.tcl>div>div.tclcon>a,
#pun-viewforum tbody>tr>td.tcl>div>div.tclcon>strong>a {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0px 0 3px 0px;
  padding: 0 3px !important;
}



#pun-viewforum table>thead>tr {
  width: 1000px;
  /* display: grid; */
  -ms-grid-columns: 6fr 2fr 2fr 3fr;
  grid-template-columns: 6fr 2fr 2fr 3fr;
  margin: 5px 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
  display: none;
}

#pun-viewforum div.category {
  width: 1000px;
}

#pun-viewforum div.category tbody tr {
  height: auto !important;
}

#pun-viewforum tbody.hasicon td.tcl {
  padding-left: 3.2em;
}

#pun-viewforum div.category tbody tr>td.tcl>div>div.icon {
  top: 8px;
  left: 12px;
}


/* сообщения темы и профиль */

.permalink {
  color: rgba(var(--text-primary), 0.6) !important;
  font: var(--font-second);
  text-transform: lowercase;
  margin-left: -14px !important;
  margin-bottom: 2px !important;
}


.permalink:hover {
  color: var(--black) !important;
}

.punbb .post h3 strong {
  float: right;
  text-align: right;
  position: relative;
  font: var(--font-second);
  padding: 3px 2px;
  right: -9px;
  color: rgba(var(--text-primary), 0.6);
}




li.pa-posts,
li.pa-respect,
li.pa-fld3 {
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: lowercase;
    font: var(--fw400) var(--fs9) var(--font-second-sa);
    color: rgb(var(--text-primary));
    padding: 8px 10px;
    z-index: 16;
    gap: 2px;
    flex-direction: column;
}

/* li.pa-posts:before {
  content: '';
  width: 229px;
  height: 45px;
  position: absolute;
  left: 0px;
  margin-top: 11px;
  border-radius: var(--bradius-bottom);
  background: rgb(var(--canvas-secondary));
  border-top: 1px dashed rgb(var(--canvas-secondary-rgb));
  z-index: -1;
} */


li.pa-fld1>br {
  display: none;
}

li.pa-fld1 {
position: absolute;
top: 0px;
    width: 218px;
z-index: -1;
}

li.pa-fld1 img {
    position: absolute;
    width: 208px;
    height: 57px;
    object-fit: cover;
    left: 5px;
    top: -25px;
    border-radius: 10px;

}


li.pa-respect>a {
  position: absolute;
  width: 15px;
  height: 10px;
  margin: 0px 0 0 17px;
}

li.pa-respect>span>a::after {
  content: '';
  width: 16px;
  height: 16px;
  position: absolute;
  margin-top: -15px;
  z-index: 5;
  display: block;
}

li.pa-respect>a>img {
  display: none
}

del {
  -webkit-filter: blur(3px);
  filter: blur(3px);
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
  text-decoration: none;
}

del:hover {
  -webkit-filter: blur(0px);
  filter: blur(0px);
}

.spoiler-box {
  padding: 0px !important;
}

.post-content .spoiler-box>div {
    background: rgb(var(--light-accent), .2) !important;
    position: relative;
    padding: 6px 8px 7px 34px !important;
    border-radius: 5px;
    min-height: 15px;
}

.post-content .spoiler-box > div::before,
.post-content .spoiler-box > div::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 6px;
  width: 16px;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  transition: opacity 0.5s ease-in-out, transform 0.7s ease-in-out;
  transform-origin: center;
  opacity: 1; 
}

.dark .post-content .spoiler-box > div::before,
.dark .post-content .spoiler-box > div::after {
filter: contrast(0.5) brightness(2.5);
}


.post-content .spoiler-box > div::before {
  background-image: url(https://forumstatic.ru/files/001c/74/d2/77019.svg);
  transform: rotate(0deg);
  opacity: 1;
}

.post-content .spoiler-box > div::after {
  background-image: url(https://forumstatic.ru/files/001c/74/d2/98287.svg);
  transform: rotate(-450deg);
  opacity: 0;
  transition: opacity 0.5s ease-in-out, transform 0.7s ease-in-out;
}

.post-content .spoiler-box > div.visible::before {
  opacity: 0;
  transform: rotate(450deg); 
}

.post-content .spoiler-box > div.visible::after {
  opacity: 1;
  transform: rotate(0deg); 
}


.punbb textarea:focus,
.punbb .longinput input:focus {
  outline: none;
}

#tags .container {
  position: absolute;
  right: 6px;
  top: 47px !important;
  background: rgb(var(--canvas-primary));
  border: 1px solid rgb(var(--canvas-tertiary));
  border-radius: 5px;
  z-index: 30 !important;
  text-transform: lowercase;
}

#pun-edit #tags .container {
  top: 70px !important;
}

#pun-report .inner,
#pun-reputation .inner,
#pun-admin-award-form .inner {
  background: rgb(var(--canvas-primary));
  border-radius: 10px;
  text-transform: lowercase;
  font: var(--font-second);
}


/* Form Buttons
----------------------------------------------------------------------- */

#pun #form-buttons table,
#pun #form-buttons tbody {
  width: 100.4%;
}

#pun #form-buttons td img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#pun #form-buttons td {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  background: none;
}

/* профиль просмотр */

#pun-profile #form-buttons td {
  width: 2rem;
  height: 2rem;
}

#pun-profile #viewprofile ul,
#pun-profile #profilenav ul {
  background: rgb(var(--canvas-secondary));
  padding: 1.5em 18px 0.8em 18px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 14px 0 15px 0px;
  width: 100%;
  border-radius: 10px;
}

#pun-profile #profile-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 0 !important;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}





#profile-left,
#profile-right {
  text-transform: lowercase;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  color: rgb(var(--text-primary));
}

#profile-right li span {
  background: rgb(var(--canvas-primary));
  border-radius: var(--bradius);
  height: 25px;
  width: 200px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: right;
  padding: 4px;
}

#pun-profile #profile-signature ul {
  border-radius: 0px;
  border-top: 1px dashed rgb(var(--canvas-tertiary));
}

#pun #form-buttons td:hover {
  cursor: pointer;
}

#form-buttons>table>tbody>tr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: flex-end;
    position: relative;
    gap: 12px;
    /* background: rgb(var(--gray-second)); */
    margin: 10px 0px 0px;
    height: 26px;
    padding: 0 5px;
    box-sizing: border-box;
    width: 99.6%;
    border-radius: 10px 10px 0 0;
    align-items: center;
}

#form-buttons td::before {
  font: var(--fa-font-solid);
  font-size: 12px;
  top: 0;
  left: 0;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 45%;
  position: relative;
  color: rgb(var(--gray-text));
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  pointer-events: none;
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
  z-index: 1;
  width: 23px;
  height: 20px;
  border-radius: var(--bradius-minor);
  background: transparent;
}

#pun-profile #form-buttons td::before {
  font-size: 15px;

}

#form-buttons td:hover::before {
  font-size: 12px;
  color: rgb(var(--accent));
  background: var(--bg-accent-rgba);
}

#button-font::before {
  content: '\f031';
}

#button-transL::before {
  content: '\f891';
}

#button-ChangeСase::before {
  content: '\f788';
}

#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-indent::before {
  content: '\f1dd';
}

#button-left::before {
  content: '\f036';
}

#button-right::before {
  content: '\f038';
}

#button-center::before {
  content: '\f037';
}

#button-justify:before {
  content: '\f039';
}

#button-link::before {
  content: '\f0c1';
}

#button-spoiler::before {
  content: '\f518';
}

#button-image::before {
  content: '\f302';
}

td#button-image:first-child {
  display: none
}

#button-video::before {
  content: '\f144';
}

#button-hide::before {
  content: '\f023';
}

#button-quote::before {
  content: '\f27a';
}

#button-code::before {
  content: '\f121';
}

#button-color::before {
  content: '\f53f';
}

#button-table::before {
  content: '\f009';
}

#button-smile::before {
  content: '\f118';
}

#button-sticker::before {
  content: '\f6be';
}

#button-keyboard::before {
  content: '\f11c';
}

#button-addition::before {
  content: '\f063';
}

#button-mask::before {
  content: '\f630';
}

#button-mask {
  background: transparent !important;
}

#button-files_rusff,
#button-graffiti_rusff {
  display: none !important
}

#add_float {
  margin: 12px;
}

/* #font-area {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 15px 1fr 15px 1fr 15px 1fr;
  grid-template-columns: repeat(4, 1fr);
  max-width: 550px;
  gap: 15px;
  max-height: 200px;
  overflow: auto;
} */

#main-reply {
  width: 100%;
  background: rgb(var(--canvas-secondary));
  border-radius: 5px;
  font: var(--fw400) var(--fs12) var(--font-second-sa);
  color: rgb(var(--text-primary));
  padding: 10px;
  border: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}


/* реакции */



.reactions-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 18px;
  gap: 4px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

body div.post-rating,
body div.post-vote {
  float: right;
  position: relative;
  line-height: initial;
  /* margin: 0px -5px 0 -7px; */
}

.reaction-counters-container {
  -webkit-box-orient: horizontal !important;
  -webkit-box-direction: reverse !important;
  -ms-flex-direction: row-reverse !important;
  flex-direction: row-reverse !important;
}


.reaction-picker-panel {
  margin-left: -240px;
}

.reactions-root {
  display: none;
}

.reaction-picker-button {
  border-radius: 0% !important;
  background: url(https://forumstatic.ru/files/001c/17/c9/57110.png);
  background-size: 100%;
}

.reaction-chip {
  border: 0px solid #d0d7de !important;
  background-color: transparent !important;
}

.reaction-counters-container>div>button {
  border: 1px solid #b6e3ff;
  background-color: #ddf4ff;
}

.reaction-chip.reaction-chip--clicked {
  background-color: rgb(var(--white)) !important;
  border: 1px solid var(--border) !important;
}

.reaction-counters-container>div>button {
  background-color: #ffffff73 !important;
  border: 1px solid var(--border) !important;
}



div.post-vote p {
  float: right !important;
  border: 0 !important;
  padding: 3px 5px !important;
  margin-right: -8px !important;
  margin-top: 18px !important;
}

#pun-respect table>tbody>tr {
  display: grid;
  grid-template-columns: .7fr .1fr 1fr 2fr 1fr;
  width: 1000px;
  margin: 0 50px;

}

#pun-respect table>tbody>tr>td.tcl,
#pun-respect table>tbody>tr>td.tcl,
#pun-respect table>tbody>tr>td.tc3,
#pun-respect table>tbody>tr>td.tcr {
  width: 85% !important;
  text-align: center;
}



/* верхнее меню */

#header-top {
  background: rgb(var(--white));
  position: absolute;
  top: 40px;
  border: 1px solid var(--black);
  width: 999px;
  margin-left: -1px;
  height: 28px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

#header-top p {
  padding: 0 15px;
  font: 600 1.1em var(--font-cat-title);
}

.bubble {
  z-index: 10;
}

.online-and-status {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  margin-top: 4px;
  gap: 3px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 210px;
}

/* БыстроПлюсы для Топика */
.noNull:before {
  content: "+";
  font-size: 9px;
  display: inline-block;
  margin-left: -6px;
  margin-top: 0px;
  position: absolute;
}

div .post-rating p>a {
  outline: 1px solid transparent;
  font-weight: 700;
  background: rgb(var(--text-color-secondary), .05);
  border-radius: 4px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 100;
  font: var(--fw400) var(--fs12) var(--font-reserve);
  padding: 0px 6px 0 2px;
  text-align: center;
  font-size: 12px !important;
  line-height: 10px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: rgb(var(--accent)) !important;
  transition: var(--anim-hover) !important;
  box-shadow: none !important;
}

div .post-rating p>a:hover {
  box-shadow: none !important;
  background: rgba(var(--accent), 0.2);
}

.user-voted{
  background: rgba(220, 157, 164, .4) !important;
}

div .post-rating p>a::before {
  content: '';
  background: url(https://forumstatic.ru/files/001c/74/d2/16164.svg) center no-repeat;
  position: relative;
  height: 18px;
  width: 16px;
  margin: 0px;
  padding: 2px 9px 2px 0px;
  filter: grayscale(1);
}

.dark div .post-rating p>a::before {
  background: url(https://forumstatic.ru/files/001c/74/d2/25912.svg) center no-repeat;

}

div.post-vote p>a {
    font-size: 0 !important;
    position: relative;
    cursor: pointer;
    z-index: 10;
    margin-top: -8px !important;
    width: 14px;
    height: 18px;
    background: url(https://forumstatic.ru/files/001c/74/d2/90664.svg) center no-repeat, rgb(var(--text-color-secondary), .05);
    padding: 2px 6px !important;
    background-size: 14px;
    border-radius: 4px;
    display: block;
    transition: background var(--anim-hover) !important;
    box-shadow: none !important;
}

.dark div.post-vote p>a {
    background: url(https://forumstatic.ru/files/001c/74/d2/87047.svg) center no-repeat, rgb(var(--text-color-secondary), .05);
}

div.post-vote p>a:hover {
  box-shadow: none !important;
  background: url(https://forumstatic.ru/files/001c/74/d2/90664.svg) center no-repeat, rgba(var(--accent), 0.2);
}

.dark div.post-vote p>a:hover {
  background: url(https://forumstatic.ru/files/001c/74/d2/87047.svg) center no-repeat, rgba(var(--accent), 0.2);
}

/* слайдер размера шрифта */

.FNTslider {
  border-radius: 0px;
  position: relative;
  z-index: 12;
  background: var(--bg-accent-rgba);
  width: 200px;
  height: 1px;
  margin: 7px 0px;
  border: solid 0px;
  float: right;
  margin-top: 8px;
  margin-right: 2%;
}

.FNTslider .before {
  height: 3px;
  border: solid 0px transparent;
  border-right: none 0;
  border-radius: 4px 0 0 4px;
  position: absolute;
  background: rgb(var(--canvas-tertiary));
  margin-top: -1px;
  -webkit-box-shadow: 0px 0px 2px 0px rgb(203, 176, 120) inset;
  box-shadow: 0px 0px 2px 0px rgb(203, 176, 120) inset;
}

.FNTslider .thumb {
  width: 10px;
  height: 3px;
  border-radius: 0px;
  position: relative;
  top: -1px;
  background: rgb(var(--accent));
  cursor: pointer;
}

/* дайсы */

#button-dice {
  background-image: url(https://i.imgur.com/RgacgB3.png);
  background-size: 20px;
  -webkit-filter: grayscale(1) contrast(2.5);
  filter: grayscale(1) contrast(2.5);
  opacity: .8;
}

#dice-menu {
  background: rgb(var(--white));
  border: 1px solid var(--border);
  padding: 5px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  z-index: calc(infinity* 1);
}

#dice-menu button {
  display: inline-block;
  padding: 5px 10px 3px;
  background-color: var(--border);
  color: #1c1c1c;
  border: none;
  font: 500 1em var(--font-second-sa);
  position: relative;
  cursor: pointer;
  height: 25px;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: bold;
  -webkit-transition: ease-in-out .4s;
  -o-transition: ease-in-out .4s;
  transition: ease-in-out .4s;
}

#dice-menu button:hover {
  background-color: rgb(var(--link));
}

.punbb .post.new-ajax>* {
  border-width: 0px !important;
}

.some-stuff {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: space-evenly;
  -ms-flex-pack: space-evenly;
  justify-content: space-evenly;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 229px;
  height: 45px;
  margin: auto;
  position: relative;
  z-index: 5;
  background: rgb(var(--canvas-post-body));
  border-radius: var(--bradius-bottom);
}

.post-author li.pa-posts span:first-child,
.post-author li.pa-respect span:first-child,
.post-author li.pa-fld3 span:first-child {
  font-size: 0px;
}

.some-stuff li span:first-child {
  font-size: 0px;
}

li.pa-posts span:first-child::before,
li.pa-respect span:first-child::before,
li.pa-fld3 span:first-child::before {
  content: '';
  width: 16px;
  height: 14px;
  position: relative;
  display: block;
  filter: grayscale(1);
}

.dark li.pa-posts span:first-child::before,
.dark li.pa-respect span:first-child::before,
.dark li.pa-fld3 span:first-child::before,
.dark li.pa-respect>span>a::after {
filter: brightness(10) !important;
}

li.pa-posts span::before {
  background: url(https://forumstatic.ru/files/001c/74/d2/39724.svg) no-repeat center;
}


li.pa-respect span:not(:has(a))::before,
li.pa-respect>span>a::after {
  background: url(https://forumstatic.ru/files/001c/74/d2/63262.svg) no-repeat center;
}

li.pa-fld3 span::before {
  background: url(https://forumstatic.ru/files/001c/74/d2/59375.svg) no-repeat center;
}

/* li.pa-fld1 span::before {
  background: url(https://forumstatic.ru/files/001c/6b/c3/84156.svg) no-repeat center;
} */

li.pa-fld2 {
    position: absolute;
    left: -6px;
    width: 218px;
    height: 54px;
    bottom: -50px;
}

li.pa-fld2 img {
    width: 18px;
    height: 18px;
    padding: 3px;
    overflow: visible;
    border-radius: 50%;
    background: rgb(var(--canvas-primary), .9);
    left: 50%;
    position: absolute;
    top: -3px;
    z-index: 4;
}

#pa-fld2 {
position: relative;
}

#pa-fld2 plaque {
    left: 35%;
}

li.pa-ip {
    width: 229px;
    margin: auto;
    text-align: center;
    font: var(--fw400) var(--fs8) var(--font-second-sa);
    z-index: 2;
    position: absolute;
    transform: rotate(-90deg);
    left: -121px;
    opacity: 0;
    bottom: 33px;
}

li.pa-ip span,
li.pa-ip a {
  -webkit-filter: blur(4px);
  filter: blur(4px);
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
}

li.pa-ip:hover span,
li.pa-ip:hover a {
  -webkit-filter: blur(0px);
  filter: blur(0px);
    opacity: 1;
}

.post-author ul li:last-child {
  border-radius: 0 0 10px 10px;
}

.post-author ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding: 0;
    list-style: none;
    border-radius: 10px;
    background: rgb(var(--bg-profile));
    box-shadow: 0px -8px 8px 0px rgba(0, 0, 0, 0.1);
    padding-bottom: 4px;
}

.post-author ul:not(:has(.pa-fld1))::before {
    content: '';
    position: absolute;
    width: 208px;
    height: 57px;
    object-fit: cover;
    z-index: -1;
    left: 5px;
    top: -25px;
    border-radius: 10px;
    background: url(https://forumstatic.ru/files/001c/74/d2/26428.svg);
    background-size:100%;
}

li.pa-fld4 {
  width: 218px;
  height: auto;
  margin: 0px auto;
  position: relative;
  z-index: 3;
  padding: 0;

}

li.pa-fld4 lz {
    width: 174px;
    margin: 10px auto;
    display: block;
    font-size: var(--fs9);
    color: rgb(var(--text-dark-accent), .7);
    text-align: justify;
}

#pa-fld4 lz {
    width: 100%;
    position: relative;
    display: block;
}

#pa-fld4 lz a:first-of-type {
display: block;
}

li.pa-fld4 lz > a:first-of-type {
    margin: 5px 0 !important;
    padding: 0 !important;
    display: block;
    text-align: center;
    color: rgb(var(--text-primary));
    font-size: var(--fs10);
    font-weight: var(--fw700);
    font-family: var(--font-main);
    text-transform: lowercase;
}

li.pa-fld4 lz a:not(:first-of-type) {
    margin: 5px 0 !important;
    padding: 0 !important;
    text-align: center;
    color: inherit;
    font-family: var(--font-main);
    text-decoration: underline;
}


plaque {
width: 218px;
    height: 39px;
    border-radius: 10px;
    display: flex !important;
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: var(--black);
    background: var(--plaque-gradient);
    bottom: 1px;
    left: 6px;
}

plaque p:first-of-type {
padding: 0px!important;
font: var(--fw700) var(--fs10) var(--font-main);
color: rgb(var(--white), .9);
}

plaque p:last-of-type {
padding: 0px!important;
font: var(--fw400) var(--fs10) var(--font-main);
color: rgb(var(--white), .9);
}





.accept-wrap {
  background-image: url(https://upforme.ru/uploads/001c/49/47/4/604016.jpg);
  width: 520px;
  height: 200px;
  margin: 0 auto;
  border: 1px solid #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.accept {
  background-color: #fff;
  display: block;
  width: 400px;
  border: 1px solid #ddd;
  padding: 20px;
}

h.accept-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 800;
}

h2.accept-header {
  text-align: center;
  margin-bottom: 8px;
  font-style: italic;
}



.modal-link {
  text-decoration: none !important;
}


/* баннеры */

banners {
    width: 925px;
    height: 50px;
    bottom: -85px;
    left: 85px;
    position: absolute;
}

banners div {
    width: 925px;
  height: 34px;
  display: flex;
  gap: 5px;
  position: absolute;
  margin: 22px 25px 30px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scroll-behavior: smooth;
  padding-bottom: 6px;
}

banners div::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}

banners div a img {
  border-radius: 3px;
  opacity: .6;
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
}

banners div a img:hover {
  opacity: 1;
}


.reveal-modal-bg {
  position: fixed;
  height: 100%;
  width: 100%;
  background: #000;
  background: rgba(0, 0, 0, .8);
  z-index: 1000;
  display: none;
  top: 0;
  left: 0;
}


.reveal-modal {
  position: fixed !important;
  top: -100vh !important;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition: top 0.4s ease-out, opacity 0.4s ease-out;
}

.reveal-modal.open {
    top: 15vh !important;
    z-index: 1001;
  opacity: 1;
}

.reveal-modal.small {
  width: 200px;
}

.reveal-modal.medium {
  width: 400px;
}

.reveal-modal.large {
  width: 600px;
}

.reveal-modal.xlarge {
  width: 800px;
  margin-left: -30px;
}

.reveal-modal .close-reveal-modal {
  font-size: 22px;
  position: absolute;
  top: 8px;
  right: 11px;
  color: #aaa;
  font-weight: bold;
  cursor: pointer;
  display: none
}



/* Theme switcher © max, the murderer! */

#theme_switcher {
position: absolute;
    top: 380px;
    margin-left: 75px;
    z-index: 25;
}

#theme_switcher li {
  display: inline-block;
}

#theme_switcher li label {
  display: none;
}

#theme_switcher li input {
  -webkit-appearance: none;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
}


#theme_switcher li input::before {
  content: '';
  margin-right: 12px;
  width: 24px;
  height: 24px;
  position: relative;
  display: block;
  cursor: pointer;
  border-radius: 50%;
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
}

#theme_switcher li input#light::before {
  content: '';
  background-image: url(https://forumstatic.ru/files/001c/17/73/40548.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 15px;
  background-color: transparent;
  opacity: .6;
}

#theme_switcher li input#dark::before {
  content: '';
  background-image: url(https://forumstatic.ru/files/001c/17/73/34834.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px;
  background-color: transparent;
  opacity: .6;
}

#theme_switcher li input:hover::before,
#theme_switcher li input[type="radio"]:checked::before {
  background-color: #7D6F69 !important;
  opacity: 1 !important;
}

/* стрелки */

.go-down, .go-up {
    height: 30px;
    margin-left: 1107px;
    opacity: .7;
    cursor: pointer;
    position: fixed;
    width: 30px;
    transition: transform 1s cubic-bezier(0.72, -0.01, 0, 1) 0s;
    /* border-radius: 100px; */
}

.go-down:hover,
.go-up:hover {
  opacity: 1;
  transform: rotate(180deg);
}

.go-up {
    background: url(https://forumstatic.ru/files/001c/74/d2/24911.svg);
    top: 385px;
    background-size: contain;
}

.go-down {
    background: url(https://forumstatic.ru/files/001c/74/d2/98040.svg) no-repeat;
    top: 434px;
    background-size: cover;
}

.go-down:hover:after,
.go-up:hover:after {
  height: 35px;
  width: 35px;
  margin-left: -5px;
}




.reveal-modal {
  visibility: hidden;
  top: 100px;
  left: 50%;
  margin-left: -300px;
  width: 520px;
  position: absolute;
  z-index: 101;
  padding: 30px 40px 34px;
  border-radius: 5px;
}



.reveal-modal .close-reveal-modal {
  font-size: 22px;
  line-height: .5;
  position: absolute;
  top: 8px;
  right: 11px;
  color: #aaa;
  text-shadow: 0 -1px 1px rbga(0, 0, 0, .6);
  font-weight: bold;
  cursor: pointer;
  text-decoration: none;
}

#tooltip {

  position: absolute;
  text-transform: lowercase;
  z-index: 9999;
  max-width: 260px;
  border-radius: 10px;
  display: none;
  color: rgb(var(--canvas-primary));
  background: rgb(var(--accent));
  font: var(--fw700) var(--fs10) var(--font-second-sa);
  text-align: center;
  padding: 3px 10px 4px;

}



#MyBookmarks {
  background: rgb(var(--canvas-primary));
  color: rgb(var(--text-primary));
}

.pun-modal .modal-inner {
  background: rgb(var(--canvas-primary));
  color: rgb(var(--text-primary));
}


/* Extra additions
-------------------------------------------------------------*/

#poll-special table.poll1 {
  width: auto
}

#poll-special td {
  border: 0
}

.punbb .post-content img.postimg {
  max-width: 100%;
  margin: 0.4em 0
}

#poll-special td {
  text-align: left !important;
  cursor: default !important
}

#poll-special td.tac {
  text-align: center !important
}

#poll-special td.tar {
  text-align: right !important
}

div.pa-respect span {
  font-size: 0.9em;
  vertical-align: top
}

div.post-rating p {
  float: right !important;
  border: 0 !important;
  padding: 3px !important
}

div.post-vote p {
  float: right !important;
  border: 0 !important;
  padding: 3px 0px !important;
  margin-right: 5px !important;
    right: -15px;
    position: relative;
}

div.post-vote p .negative {
  margin-left: 13px;
}

div.post-rating a {
  cursor: pointer !important
}

div.post-rating a,
div.post-vote a {
  font-size: 130% !important;
  text-decoration: none !important
}

#pun-status .status-right {
  float: right;
}

.post-content table {
  border-collapse: collapse;
  margin: 0 0 0.8em
}

.post-content td {
  border-width: 0px !important;
  border-style: solid !important;
  padding: 0.4em 0.5em !important;
  overflow: hidden
}

.post-content td p:last-child {
  padding-bottom: 0
}

.post-content .highlight-text {
  background-color: #ff0;
  color: #000
}

.post-content .spoiler-box>div {
  background: url('/img/plus.png') no-repeat left center;
  cursor: pointer;
  padding-left: 18px
}

.post-content .spoiler-box>div.visible {
  background-image: url('/img/minus.png')
}

.post-content .spoiler-box>blockquote {
  padding-top: 1.4em;
  display: none
}

.post-content .spoiler-box>blockquote.visible {
  display: block;
  overflow: auto
}

.post-content hr {
  opacity: 0.5;
  filter: alpha(opacity=50);
  margin-bottom: 0.8em
}

.post-content abbr {
  cursor: help
}

.post-content ul {
  padding: 0 0 1em 2.3em
}

.post-content ul li {
  list-style: inherit;
  margin-bottom: 0.3em
}

.post-content ul li ul {
  padding-bottom: 0
}

.post-content ul li>p {
  padding-bottom: 0.3em
}

.post-content ul li>p:last-of-type {
  padding-bottom: 0
}

#form-buttons table,
.punbb .formal textarea {
  width: 99%
}

#form-buttons td {
  padding: 0 !important;
  line-height: 0;
  background-position: center;
  background-repeat: no-repeat;
  border: 0;
  cursor: pointer;
}

#form-buttons td img {
  height: 26px;
  width: 100%
}

#form-buttons tr {
  text-align: center;
}

td#button-font {
  background: url('/i/form_buttons.3.png') no-repeat 50% 5px
}

td#button-size {
  background: url('/i/form_buttons.3.png') no-repeat 50% -21px
}

td#button-bold {
  background: url('/i/form_buttons.3.png') no-repeat 50% -47px
}

td#button-italic {
  background: url('/i/form_buttons.3.png') no-repeat 50% -73px
}

td#button-underline {
  background: url('/i/form_buttons.3.png') no-repeat 50% -99px
}

td#button-strike {
  background: url('/i/form_buttons.3.png') no-repeat 50% -125px
}

td#button-left {
  background: url('/i/form_buttons.3.png') no-repeat 50% -151px
}

td#button-center {
  background: url('/i/form_buttons.3.png') no-repeat 50% -177px
}

td#button-right {
  background: url('/i/form_buttons.3.png') no-repeat 50% -203px
}

td#button-link {
  background: url('/i/form_buttons.3.png') no-repeat 50% -229px
}

td#button-spoiler {
  background: url('/i/form_buttons.3.png') no-repeat 50% -255px
}

td#button-image {
  background: url('/i/form_buttons.3.png') no-repeat 50% -281px
}

td#button-video {
  background: url('/i/form_buttons.3.png') no-repeat 50% -307px
}

td#button-hide {
  background: url('/i/form_buttons.3.png') no-repeat 50% -333px
}

td#button-quote {
  background: url('/i/form_buttons.3.png') no-repeat 50% -359px
}

td#button-code {
  background: url('/i/form_buttons.3.png') no-repeat 50% -385px
}

td#button-color {
  background: url('/i/form_buttons.3.png') no-repeat 50% -411px
}

td#button-smile {
  background: url('/i/form_buttons.3.png') no-repeat 50% -437px
}

td#button-keyboard {
  background: url('/i/form_buttons.3.png') no-repeat 50% -463px
}

td#button-table {
  background: url('/i/form_buttons.3.png') no-repeat 50% -489px
}

td#button-addition {
  background: url('/i/form_buttons.3.png') no-repeat 50% -515px
}

.punbb .formal fieldset {
  min-width: 0;
}

.punbb .formal span.input {
  padding-right: 0 !important
}

#formkey,
#formetc {
  display: none
}

#color-area,
#table-area,
#keyboard-area {
  width: auto
}

#keyboard-area {
  text-align: center;
  padding-bottom: 4px
}

#imageup-area {
  width: 170px
}

#imageattach-area {
  width: 770px;
  height: 200px;
  padding: 0px !important
}

#smilies-area,
#video-area,
#spoiler-area {
  width: 450px
}

#image-area {
  width: 550px
}

#color-area * {
  border: 0
}

#color-area table {
  width: 320px;
  height: 20px;
  padding: 0;
  margin: 0
}

#table-area table {
  width: auto !important;
  padding: 0;
  margin: 0;
  border-collapse: collapse
}

#table-area div {
  margin-top: 1em;
  text-align: center
}

#table-layout {
  margin-right: 0.5em
}

#table-area td {
  background-color: #fff;
  width: 20px;
  height: 20px;
  border-width: 1px !important;
  border-style: solid !important;
  border-color: #dadada !important
}

#table-area td.selected {
  background-color: #c8c8ff
}

#color-area td,
#table-area td {
  margin: 0;
  padding: 0;
  line-height: 0
}

#color-area td img,
#table-area td img {
  width: 20px;
  height: 20px;
  cursor: pointer !important
}

#tags .container {
  position: absolute;
  padding-top: 15px;
  right: 6px;
  top: 43px;
  z-index: 2;
}



#font-area,
#size-area {
  right: unset !important;
}

#font-area div,
#size-area div,
#color-area div,
#table-area div,
#addition-area div,
#smilies-area div a,
#smilies-area img {
  cursor: pointer !important
}

#font-area span,
#font-area img,
#size-area span,
#size-area img {
  display: block;
  position: relative;
  top: 0;
  left: 0
}

#font-area span,
#font-area img {
  height: 15px
}

#size-area span,
#size-area img {
  height: 24px
}

#font-area span,
#size-area span {
  padding: 1px 0
}

#addition-area div {
  height: 24px;
  vertical-align: middle
}

#addition-area {
  max-height: 200px;
  overflow: auto;
}

#font-area img {
  width: 100%;
  margin-top: -15px
}

#size-area img {
  width: 100%;
  margin-top: -24px
}

#keyboard-span {
  text-align: center;
  padding-bottom: 10px;
  width: auto
}

#keyboard-span input {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 300;
  font-size: 13px;
  color: #666;
  background-color: #fff;
  margin: 1px 1px 0 0;
  border: 1px solid #ddd;
  cursor: pointer;
  height: 25px;
  min-width: 30px
}

#imageup-area input {
  font-size: 0.8em
}

#imageup-area p {
  padding: 0;
  margin: 0
}

#imageup-title {
  margin-bottom: 10px !important
}

#imageup-submit {
  margin-top: 10px !important
}

#main-reply {
  width: 100%
}

#pun-messages #post-form div.container {
  padding-left: 2.3em
}

#similar-topics {
  margin-top: 1em
}

#similar-topics div.container {
  padding-top: 1.1em
}

#similar-topics td {
  border: 0;
  padding: 0
}

#similar-topics td.st-tcl {
  width: 60%
}

#similar-topics td.st-tc2 {
  width: 25%;
  padding-right: 1em;
  text-align: right
}

#similar-topics td.st-tcr {
  width: 15%;
  padding-right: 1em;
  text-align: right
}

.postlink.long {
  width: 30em
}

.postlink.long .new-topic {
  padding-right: 12px
}

li.pa-ua {
  margin-top: 0.7em;
  display: flex;
  justify-content: center;
}

#pun-online .tcl.action {
  width: 25%
}

.punbb .post.new-ajax>* {
  border-width: 3px;
}

.punbb .post.new-ajax {
  display: none;
}

#pun-index .isub .tcl {
  padding-left: 3em !important;
}

#pun-main #subforums {
  padding: 1em 0 1em 1em;
  margin-bottom: 5px;
}

.notify-parent {
  position: relative;
}

.notify-bubble {
  background: lightblue;
  border-radius: 3px;
  color: black;
  font: bolder 12px/1.2 Tahoma;
  margin: 0;
  min-width: 14px;
  padding: 0 1px;
  position: absolute;
  text-align: center;
}

.notify-bubble:after {
  border-color: lightblue transparent;
  border-style: solid;
  border-width: 3px 3px 0;
  content: "";
  display: block;
  left: 5px;
  position: absolute;
  width: 0;
}

/* Statistic */
#pun-statistic .tc3 {
  width: 15%;
}

#pun-statistic .tc-username {
  width: unset;
  text-align: left;
}

#pun-statistic .tc-title {
  width: 25%;
  text-align: left;
}

#pun-statistic .tc-registered {
  width: 20%;
}

#pun-statistic .tc-topic {
  width: 50%;
}


/* New profile style
-------------------------------------------------------------*/
#viewprofile td {
  border: 0;
  padding: 0;
  overflow: hidden
}

#profile-name strong {
  font-size: 1.2em
}

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

#profile-left {
  width: 30%;
  padding-top: 0 !important
}



0

24

структура ч3
Код:
#profile-left li,
#profile-left li * {
  padding-left: 0;
  margin-left: 0
}

#profile-right {
  width: 70%
}

#profile-right li strong {
  padding-left: 2em
}

#profile-signature {
  padding: 1.5em 1.5em 1em 1.5em
}

#profile-signature ul {
  border-style: dashed;
  border-width: 1px 0 0 0;
  margin: 0;
  padding: 1em 1em 0 1em
}

/** Video-Button
---------------------------------------------------------------*/
#video-host-list {
  margin-top: .3em;
  line-height: 1.8em
}

#video-area-tinp,
#image-area-tinp {
  margin: .5em 0;
  padding: .3em;
  border: #66a solid 1px;
  height: 70px
}

#video-area-msg,
#image-source-list,
#image-area-actions,
#spoiler-sels {
  line-height: 2em
}

p[class="checkfield"] img,
div[class="checkfield"] img,
fieldset[class="radiofield"] img {
  height: auto;
  max-height: 50px
}

.pa-fld1 img,
.pa-fld2 img,
.pa-fld3 img,
.pa-fld4 img,
.pa-fld5 img,
.pa-fld6 img,
.pa-fld7 img,
.pa-fld8 img,
.pa-fld9 img,
.pa-fld10 img,
.pa-fld11 img,
.pa-fld12 img,
.pa-fld13 img,
.pa-fld14 img,
.pa-fld15 img,
.pa-fld16 img,
.pa-fld17 img,
.pa-fld18 img,
.pa-fld19 img,
.pa-fld20 img {
  vertical-align: text-top
}

/** Image-Button
---------------------------------------------------------------*/
#image-area-tcon-computer {
  margin: 0 0 1em
}

#image-area-tcon-computer td {
  border: none !important;
  padding: 0
}

#imageupload-left {
  width: 140px
}

#imageupload-right {
  padding-left: 9px !important;
  background: transparent !important;
  max-width: 380px
}

#image-area-actions {
  text-align: right
}

* html #imageQueue {
  height: expression(this.scrollHeight > 65 ? "66px" :"auto")
}

/* sets max-height for IE */
* html #uploaded-images {
  height: expression(this.scrollHeight > 143 ? "144px" :"auto")
}

#imageQueue {
  max-height: 72px;
  overflow-y: auto;
  margin-bottom: 10px
}

#uploaded-images {
  max-height: 144px;
  overflow-y: auto
}

#uploaded-images img {
  width: 88px;
  height: 66px;
  border: 1px solid;
  margin-right: 4px;
  cursor: pointer
}

#upload-button-container,
#image-width,
#image-thumb-width,
#image-insert-format,
#insert-all-images-container {
  margin-top: 10px
}

#image-source-list a,
#image-area-actions a,
#spoiler-sels a {
  margin-right: 15px;
  cursor: pointer
}

#insert-image-tip {
  margin-top: 10px
}

#upload-button-container img {
  cursor: pointer;
  width: 120px;
  height: 30px
}

#image_upload_input {
  position: absolute;
  z-index: -1;
  left: -9999px
}

#selected-image-width,
#selected-thumb-width {
  width: 6em
}

#imageupload-left input[type=button] {
  width: 11em;
  text-align: center
}

#upload-button-container input[type=button] {
  font-weight: bold
}

#image-width,
#image-thumb-width,
#image-insert-format strong {
  font-size: .9em
}

.uploadQueueItem {
  padding: .8em 1em;
  border: solid 1px #ddd;
  border-radius: 5px;
  margin-bottom: .5em;
  background: rgba(238, 238, 238, 0.22)
}

.uploadQueueItem.error {
  border-color: rgba(255, 0, 0, 0.25);
  background-color: rgba(255, 0, 0, 0.08)
}

.uploadQueueItem .cancel {
  font-size: 20px;
  font-weight: 700;
  font-family: Arial;
  float: right;
  margin: -.25em 0 0
}

.uploadQueueItem .cancel a {
  text-decoration: none;
  color: #333 !important
}

.uploadProgress {
  display: block;
  width: 98%;
  height: 3px;
  margin: 2px 0 0;
  background: #ddd;
  position: relative
}

.uploadProgressBar {
  position: relative;
  background: #00adff;
  height: 3px;
  width: .1%;
  transition: width .1s linear
}

/** jQuery plugins
---------------------------------------------------------------*/
.tipsy {
  padding: 5px;
  font-size: 11px;
  font-family: tahoma, helvetica, verdana, arial;
  position: absolute;
  z-index: 100000;
}

.tipsy-inner {
  padding: 5px 8px 4px;
  margin: -0.2px;
  background-color: black;
  color: white;
  max-width: 200px;
  text-align: center;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px
}

.tipsy-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border: solid 5px;
  border-color: transparent transparent black transparent
}

.tipsy-n .tipsy-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-top: 0
}

.tipsy-nw .tipsy-arrow {
  top: 0;
  left: 11px !important;
  border-top: 0
}

.tipsy-ne .tipsy-arrow {
  top: 0;
  left: auto !important;
  right: 11px;
  border-top: 0
}

.tipsy-s .tipsy-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-color: black transparent transparent transparent;
  border-bottom: 0
}

.tipsy-sw .tipsy-arrow {
  bottom: 0;
  left: 11px !important;
  border-color: black transparent transparent transparent;
  border-bottom: 0
}

.tipsy-se .tipsy-arrow {
  bottom: 0;
  left: auto !important;
  right: 11px;
  border-color: black transparent transparent transparent;
  border-bottom: 0
}

.tipsy-e .tipsy-arrow {
  top: 50%;
  margin-top: -5px;
  left: auto !important;
  right: 0;
  border-color: transparent transparent transparent black;
  border-right: 0
}

.tipsy-w .tipsy-arrow {
  top: 50%;
  margin-top: -5px;
  left: 0 !important;
  border-color: transparent black transparent transparent;
  border-left: 0
}

.jGrowl {
  z-index: 9999;
  color: #fff;
  font-size: 12px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  position: fixed
}

.jGrowl.top-left {
  left: 0;
  top: 0
}

.jGrowl.top-right {
  right: 0;
  top: 0
}

.jGrowl.bottom-left {
  left: 0;
  bottom: 0
}

.jGrowl.bottom-right {
  right: 0;
  bottom: 0
}

.jGrowl.center {
  top: 0;
  width: 50%;
  left: 25%
}

.jGrowl.center .jGrowl-closer,
.jGrowl.center .jGrowl-notification {
  margin-left: auto;
  margin-right: auto
}

.jGrowl-notification {
  background-color: #000;
  opacity: .9;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
  zoom: 1;
  width: 250px;
  padding: 10px;
  margin: 10px;
  text-align: left;
  display: none;
  border-radius: 5px;
  min-height: 40px
}

.jGrowl-notification .ui-state-highlight,
.jGrowl-notification .ui-widget-content .ui-state-highlight,
.jGrowl-notification .ui-widget-header .ui-state-highlight {
  border: 1px solid #000;
  background: #000;
  color: #fff
}

.jGrowl-notification .jGrowl-header {
  font-weight: 700;
  font-size: .85em
}

.jGrowl-notification .jGrowl-close {
  background-color: transparent;
  color: inherit;
  border: none;
  z-index: 99;
  float: right;
  font-weight: 700;
  font-size: 1em;
  cursor: pointer
}

.jGrowl-closer {
  background-color: #000;
  opacity: .9;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
  zoom: 1;
  width: 250px;
  padding: 10px;
  margin: 10px;
  display: none;
  border-radius: 5px;
  padding-top: 4px;
  padding-bottom: 4px;
  cursor: pointer;
  font-size: .9em;
  font-weight: 700;
  text-align: center
}

.jGrowl-closer .ui-state-highlight,
.jGrowl-closer .ui-widget-content .ui-state-highlight,
.jGrowl-closer .ui-widget-header .ui-state-highlight {
  border: 1px solid #000;
  background: #000;
  color: #fff
}

@media print {
  .jGrowl {
    display: none
  }
}

.pun-modal {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 100000
}

.pun-modal .modal-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .5);
  cursor: pointer;
  z-index: 110000
}

.pun-modal .modal-inner {
  width: 700px;
  max-width: 94%;
  height: auto;
  max-height: 44em;
  max-height: 62vh;
  margin: 12% auto 0;
  margin-top: 20vh;
  box-shadow: 0 0 14px rgba(0, 0, 0, .3);
  position: relative;
  z-index: 120000;
  overflow: hidden
}

.pun-modal h2,
.pun-modal h1 {
  max-width: 700px;
  margin: 0 !important
}

.pun-modal .container {
  padding: .6em 1em;
  max-height: 40em;
  max-height: 54vh;
  overflow: auto
}

.pun-modal .container .container {
  max-height: unset
}

.pun-modal .closer {
  position: absolute;
  font-size: 1.5em !important;
  line-height: .8em;
  right: .4em;
  padding: .3em !important;
  margin: -.3em !important;
  cursor: pointer;
  background: none 0 transparent !important
}

.noscroll {
  overflow: hidden !important
}

/** Social icons
---------------------------------------------------------------*/
.social {
  background-image: url('/i/social.1.png');
  background-repeat: no-repeat;
  float: left;
  display: block;
  margin: 3px 5px;
  width: 16px;
  height: 16px
}

.social-facebook {
  background-position: 0 0
}

.social-google {
  background-position: -26px 0
}

.social-mailru {
  background-position: -52px 0
}

.social-odnoklassniki {
  background-position: -78px 0
}

.social-twitter {
  background-position: -104px 0
}

.social-vkontakte {
  background-position: -130px 0
}

.social-yandex {
  background-position: -156px 0
}

.social-youtube {
  background-position: -182px 0
}

.social-instagram {
  background-position: -312px 0
}

.social-linkedin {
  background-position: -338px 0
}

.social-reddit {
  background-position: -442px 0
}

.social-share {
  background-position: -468px 0
}

.social-tumblr {
  background-position: -546px 0
}

.topic a.sharelink {
  float: right;
  margin-left: 1em
}

.post-share-tip {
  width: 164px;
  height: 124px
}

.post-share-legend {
  background: rgba(255, 255, 255, 0.2);
  text-align: center
}

.post-share-tip span {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #fff;
  font-size: 13px;
  line-height: 27px
}

.post-share-icons {
  padding: 10px
}

.post-share-tip a {
  margin: 5px 10px
}

/** Avatars
---------------------------------------------------------------*/
.punbb .user-avatar {
  float: left;
  position: relative;
  height: 36px;
  width: 36px;
  margin: 1px 9px 2px 0px
}

#pun-index .user-avatar {
  height: 40px;
  vertical-align: middle
}

.punbb .user-avatar a {
  padding: 0 !important;
  background: none transparent !important
}

.punbb .user-avatar a::after {
  content: none !important
}

.punbb .user-avatar .avatar-image {
  border-radius: 50%;
  height: 36px;
  width: 36px;
  opacity: 0.85;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  float: left
}

.punbb .user-avatar .avatar-image:hover {
  opacity: 1
}

.punbb .user-avatar .isonline {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: block;
    position: absolute;
    top: 2px;
    right: 0px;
    animation: blinkColor .9s linear infinite;
    -moz-animation: blinkColor .9s linear infinite;
    -webkit-animation: blinkColor .9s linear infinite;
    background: #d07e83 !important;
    z-index: 100;
}

@keyframes blinkColor {
  0% {
    opacity: 1.0
  }

  50% {
    opacity: .3
  }

  100% {
    opacity: 1.0
  }
}

@-moz-keyframes blinkColor {
  0% {
    opacity: 1.0
  }

  50% {
    opacity: .3
  }

  100% {
    opacity: 1.0
  }
}

@-webkit-keyframes blinkColor {
  0% {
    opacity: 1.0
  }

  50% {
    opacity: .3
  }

  100% {
    opacity: 1.0
  }
}

/** Flags
---------------------------------------------------------------*/
.punbb .flag-i {
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
  position: relative;
  display: inline-block;
  width: 1.33333333em;
  line-height: 1em;
  margin-right: 1em;
}

.punbb .pa-author .flag-i {
  margin-right: 0.5em;
}

.punbb .flag-i:before {
  content: '\00a0';
}

.post-content abbr {
  border-bottom: 1px dotted var(--canvas-tertiary);
  text-decoration: none;
}

/** Font icons
---------------------------------------------------------------*/
@font-face {
  font-family: 'mybb';
  src: url('./res/font/icons.woff2?3') format('woff2'),
    url('./res/font/icons.woff?3') format('woff'),
    url('./res/font/icons.ttf') format('truetype'),
    url('./res/font/icons.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

i[class^="icons-"]:before,
i[class*=" icons-"]:before,
.i[class*=" icons-"]:before,
.i[class^="icons-"] {
  font-family: "mybb";
  font-style: normal;
  font-weight: normal;
  speak: never;

  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: .2em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icons-search:before {
  content: '\e095';
}

/* 'о‚•' */
.icons-font:before {
  content: '\e800';
}

/* 'о Ђ' */
.icons-size:before {
  content: '\e801';
}

/* 'о Ѓ' */
.icons-video:before {
  content: '\e802';
}

/* 'о ‚' */
.icons-image:before {
  content: '\e803';
}

/* 'о ѓ' */
.icons-plus:before {
  content: '\e804';
}

/* 'о „' */
.icons-cancel:before {
  content: '\e805';
}

/* 'о …' */
.icons-minus:before {
  content: '\e806';
}

/* 'о †' */
.icons-star:before {
  content: '\e807';
}

/* 'о ‡' */
.icons-cog:before {
  content: '\e808';
}

/* 'о €' */
.icons-play:before {
  content: '\e809';
}

/* 'о ‰' */
.icons-pause:before {
  content: '\e80a';
}

/* 'о Љ' */
.icons-fast-fw:before {
  content: '\e80b';
}

/* 'о ‹' */
.icons-fast-bw:before {
  content: '\e80c';
}

/* 'о Њ' */
.icons-code:before {
  content: '\e80d';
}

/* 'о Ќ' */
.icons-table:before {
  content: '\e80e';
}

/* 'о Ћ' */
.icons-spoiler:before {
  content: '\e80f';
}

/* 'о Џ' */
.icons-calendar:before {
  content: '\e810';
}

/* 'о ђ' */
.icons-pencil:before {
  content: '\e811';
}

/* 'о ‘' */
.icons-hide:before {
  content: '\e812';
}

/* 'о ’' */
.icons-list:before {
  content: '\e813';
}

/* 'о “' */
.icons-indent-left:before {
  content: '\e814';
}

/* 'о ”' */
.icons-indent-right:before {
  content: '\e815';
}

/* 'о •' */
.icons-trash-empty:before {
  content: '\e816';
}

/* 'о –' */
.icons-off:before {
  content: '\e817';
}

/* 'о —' */
.icons-heart:before {
  content: '\e818';
}

/* 'о ' */
.icons-user:before {
  content: '\e819';
}

/* 'о ™' */
.icons-left:before {
  content: '\e81a';
}

/* 'о љ' */
.icons-center:before {
  content: '\e81b';
}

/* 'о ›' */
.icons-right:before {
  content: '\e81c';
}

/* 'о њ' */
.icons-italic:before {
  content: '\e81d';
}

/* 'о ќ' */
.icons-bold:before {
  content: '\e81e';
}

/* 'о ћ' */
.icons-comment:before {
  content: '\e81f';
}

/* 'о џ' */
.icons-resize-full:before {
  content: '\e820';
}

/* 'о  ' */
.icons-resize-small:before {
  content: '\e821';
}

/* 'о Ў' */
.icons-quote:before {
  content: '\e822';
}

/* 'о ў' */
.icons-share:before {
  content: '\e823';
}

/* 'о Ј' */
.icons-smile:before {
  content: '\e824';
}

/* 'о ¤' */
.icons-youtube:before {
  content: '\e825';
}

/* 'о Ґ' */
.icons-link:before {
  content: '\e826';
}

/* 'о ¦' */
.icons-volume-off:before {
  content: '\e827';
}

/* 'о §' */
.icons-volume-down:before {
  content: '\e828';
}

/* 'о Ё' */
.icons-volume:before {
  content: '\e829';
}

/* 'о ©' */
.icons-volume-up:before {
  content: '\e82a';
}

/* 'о Є' */
.icons-addition:before {
  content: '\e82b';
}

/* 'о «' */
.icons-infinity:before {
  content: '\e82c';
}

/* 'о ¬' */
.icons-facebook:before {
  content: '\f09a';
}

/* 'п‚љ' */
.icons-strike:before {
  content: '\f0cc';
}

/* 'пѓЊ' */
.icons-underline:before {
  content: '\f0cd';
}

/* 'пѓЌ' */
.icons-mail:before {
  content: '\f0e0';
}

/* 'пѓ ' */
.icons-keyboard:before {
  content: '\f11c';
}

/* 'п„њ' */
.icons-help:before {
  content: '\f128';
}

/* 'п„Ё' */
.icons-vkontakte:before {
  content: '\f189';
}

/* '' */
.icons-color:before {
  content: '\f1fb';
}

/* '' */
.icons-odnoklassniki:before {
  content: '\f263';
}

/* 'п‰Ј' */
.icons-vimeo:before {
  content: '\f27d';
}

/* 'п‰Ѕ' */

.icons-cancel-outline:before {
  content: '\e82d';
}

/* 'о ­' */
.icons-ok-outline:before {
  content: '\e82e';
}

.adminmain {
  margin-top: 1em;
}

/* ссылки главная */

.please-links {
  display: flex;
  gap: 5px;
  margin: 7px 0 13px;
  flex-wrap: wrap;
}

.please-links a {
  background: rgba(var(--canvas-tertiary), 0.04);
  padding: 1px 8px 2px !important;
  border-radius: var(--bradius-major);
  transition: background var(--anim-hover) !important;
  margin-right: 5px !important;
}

.please-links a:hover {
  background: var(--bg-accent-rgba);
}





#profile8 #fld2,
#profile8 #fld3,
#profile8 #fld4 {
  display: block;
  width: 100%;
  height: 100px;
  resize: vertical;
  white-space: pre-wrap;
  overflow: auto;
}


/* ПРОФИЛЬ */



/* админка и мгновенные уведомления */

#pun-modviewforum tbody tr,
#pun-modviewforum thead tr {
  display: grid;
  position: relative;
  width: 1040px;
  grid-template-columns: 2fr .5fr .5fr 1fr .1fr;
    color: rgb(var(--text-primary));
  border-radius: 10px;
  margin: 2px 30px;
  align-items: center;
}

#pun-modviewforum .modmenu .container {
  width: 60em;
  padding: 0.5em 1em;
  text-align: right;
  text-transform: lowercase;
  left: 15px;
  position: relative;
  font: var(--font-second);
  color: var(--text-primary);
}

#pun-modviewforum table div.icon {
  background: var(--bg-accent-rgba);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  position: absolute;
  left: 28px;
  top: 4px;
}

#pun-modviewforum table div.icon::after {
  content: none;
}


#pun-modviewforum table tr.iclosed div.icon {
  background: var(--canvas-tertiary);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  position: absolute;
  left: 10px;
  top: 10px;
}



#pun-multimove .modmenu .container {
  width: 963px;
  padding: 0.5em 1em;
  text-align: right;
  text-transform: lowercase;
  display: grid;
  grid-template-columns: 5fr .1fr 1fr .3fr;
  gap: 5px;
  left: 9px;
  position: relative;
  font: var(--font-second);
  color: var(--text-primary);
  align-items: center;
  justify-items: start;
}

.pun-modal .closer {
  position: relative !important
}


li.pa-fld6 {
  display: flex;
  position: absolute;
  z-index: 5;
  width: 250px;
  top: -15px;
  justify-content: center;
}

li.pa-fld6 img {
  width: 16px;
  height: 16px;
  object-fit: cover;
  background: var(--canvas-primary);
  padding: 7px;
  border-radius: 50%;
  box-shadow: 0px 4px 4px 0px rgba(81, 57, 46, 0.67);
  border: 1px solid rgba(185, 176, 170, 1);
}

.post-content hr {
  opacity: 0.5;
  filter: alpha(opacity=50);
  margin-bottom: 0.8em;
}

div.pun-modal.unread-notifications>div.modal-inner.section>h2>span {
  height: 10px;
  width: 100%;
  text-align: center;
  color: var(--text-primary);
  font: var(--fw700) var(--fs12) var(--font-second-sa);
  text-transform: lowercase;
}

div.pun-modal.unread-notifications>div.modal-inner.section>h2>span:nth-child(2) {
  position: absolute !important;
  top: 5px;
}

div.pun-modal.unread-notifications>div.modal-inner.section {
  padding: 10px;
  border-radius: 10px;
}

.notification-image {
  width: 35px !important;
  height: 35px !important;
  padding: 0 !important;
}

.notification-image:hover {
  box-shadow: none !important;
}

#notifications-wrap {
  text-transform: lowercase;
  font-size: var(--fs10);
}

.notification-item {
  padding: 2px 10px !important
}

.notification {
    min-height: 50px;
    cursor: pointer;
    text-transform: lowercase;
}



/* Flow Around */

#button-float {
  width: 20px;
  height: 20px;
}

#button-float::before {
  content: '\f03c';
  font: var(--fa-font-solid);
  font-size: 12px;
  top: 0;
  left: 0;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 45%;
  position: relative;
  color: rgb(var(--gray-text));
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  pointer-events: none;
  -webkit-transition: var(--anim-hover);
  -o-transition: var(--anim-hover);
  transition: var(--anim-hover);
  z-index: 1;
  width: 23px;
  height: 20px;
  border-radius: var(--bradius-minor);
  background: transparent;
}


#float {
  display: none;
  position: absolute;
  margin-top: 71px;
  left: 48%;
  text-align: center;
  background: rgba(var(--gray-main));
  border-radius: var(--bradius-medium);
  padding: 3px 15px;
  z-index: 1;
}

#float strong {
  display: block;
  margin-bottom: 7px;
}

#float i {
  font-size: 16px;
  padding: 0 8px;
}

#float i:hover {
  opacity: .6;
}

/*кнопки копирования в форму ответа*/
.copy-to-reply-toform {
    padding: 5px 15px !important;
    background: rgb(var(--canvas-post-body), 0.5);
    color: rgb(var(--accent));
    border-radius: 20px;
    margin: 5px !important;
    transition: var(--anim-hover) !important;
    border: 0px;
    width: inherit;
}

.copy-to-reply-toform:hover {
  box-shadow: none !important;
  background: var(--bg-accent-rgba);
}


/*маска*/
.hv-mask-field title {
  display: none
}

/*------------ПРЕВЬЮ КОЛЛЕКЦИЙ------------*/


.coll_preview {
  width: fit-content;
  height: 100px;
  border-radius: var(--bradius-medium);
  display: flex;
  align-items: center;
  justify-content: center;
}

.coll_preview_name {
  font-family: Cormorant Infant;
  font-size: 12px;
  line-height: 25px;
  font-weight: 900;
  width: 200px;
  margin-top: 96px;
  position: absolute;
  text-align: center;
  color: rgb(var(--canvas-tertiary));
  background-color: rgb(var(--canvas-quarternary));
  border-radius: var(--bradius-minor);
  text-transform: uppercase;
  box-shadow: 0px 7px 13px -9px #000000a6;
  padding-left: 10px;
  padding-right: 10px;
}

.coll_preview_icons {
  display: flex;
  flex-direction: row;
  align-content: flex-start;
  justify-content: center;
  gap: 25px;
  padding: 10px;
}

.coll_preview_icons img {
  width: 70px;
}

/* картинка в нужных */

img.wanted_img {
  width: 245px;
  height: 150px;
  object-fit: cover;
  border-radius: 1rem;
}

/*эмодзи*/

.hvStickerPackModal {
  padding: 16px 16px 8px !important;
  -webkit-box-sizing: border-box !important;
  border-radius: 4px !important;
  background: #e4e2e2 url(95851.css) !important;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow: 0px 30px 20px -12px rgba(0, 0, 0, 0.16), 0px 20px 20px -50px rgba(0, 0, 0, 0.23) !important;
  left: 28px !important;
  /* top: -126px !important; */
}

.hvStickerPackModalTabs {
  text-transform: lowercase;
}

.hvStickerPackModalTab.active {
  background: #ccd4e1 !important;
}

.hvStickerPackModalTab {
  padding: 5px 9px !important;
  border-radius: 4px !important;
  font-size: 12px !important;
  margin-top: 8px !important;
  margin-right: 8px !important;
  background: transparent !important;
  -webkit-transition: background var(--anim-hover);
  -o-transition: background var(--anim-hover);
  transition: background var(--anim-hover);
}


.hvStickerPackModalTab:hover {
  background: #ccd4e1 !important;
}

/************************* 
Стиль для Быстрой смены аккаунтов 
Deff 
*************************/

/*Cкрытие формы входа без клика*/
#pun-navlinks li>a:not(.NextShow)+span.odd {
  display: none !important;
}

#navlogout>span {
  background: rgb(var(--canvas-primary));
  width: 495px;
  height: 271px;
  position: absolute !important;
  z-index: 100;
  left: 392px;
  border-radius: var(--bradius-medium);
  top: 30px !important;
}

#navlogin>span {
  background: rgb(var(--canvas-primary));
  /* width: 500px; */
  /* height: 271px; */
  position: absolute !important;
  z-index: 100;
  left: 56%;
  border-radius: var(--bradius-medium);
  top: 30px !important;
}

#pun-navlinks li>a:not(.NextShow)+span.odd {
  display: none !important;
}

/*Стиль доп-иконки Выход!*/
#pun-navlinks a#New-exit {
  background: transparent !important;
  position: absolute;
  z-index: 100000 !important;
  margin-top: 1px !important;
  margin-left: 15px !important;
  display: inline-block !important;
}

#pun-navlinks #New-exit img {
  position: absolute;
  width: 20px;
  height: auto;
  transition: .63s;
  background-color: rgb(var(--accent-secondary));
  border-radius: 100px;
  margin-top: -6px;
  margin-left: -23px;
  opacity: .5;
}

#pun-navlinks #New-exit:hover img {
  transition: .63s;
  opacity: .64;
}

.punbb #pun-navlinks a#New-exit:before {
  content: none;
}

.punbb #pun-navlinks #form-login input {
  text-rendering: auto;
  margin-top: 4px !important;
  margin-bottom: 3px !important;
  display: inline-block !important;
  font: var(--font-second-sa) !important;
  height: 25px;
  border: 1px solid var(--bg-navlinks) !important;
  padding: 0 10px !important;
  background: transparent !important;
  width: 155px;
  -webkit-transition: background var(--anim-hover);
  -o-transition: background var(--anim-hover);
  transition: background var(--anim-hover);
}

.punbb #pun-navlinks #form-login input:hover {
  background: rgba(var(--accent), 0.2);
}

.punbb #form-login #fld1,
#form-login #fld2 {
  background-color: rgb(222, 231, 228);
}

.punbb #pun-navlinks #form-login input[type="submit"] {
  margin: 10px 0 2px !important;
  height: 26px;
  width: 133px;
  font-size: 12px !important;
  color: var(--text) !important;
  background: var(--links) !important;
  text-align: center !important;
  transition: all 0.5sease-in-out 0s;
  cursor: pointer;
  text-transform: lowercase;
}

.punbb #pun-navlinks #form-login,
.punbb #pun-navlinks #form-login * {
  box-sizing: content-box !important;
}

/*Стиль формы входа*/
.punbb #pun-navlinks #form-login {
  background: rgb(var(--canvas-primary));
  min-height: 183px;
  border: 1px solid var(--text2);
  border-radius: 0px 10px 10px 0px;
  color: #000000;
  display: block;
  font: var(--font-second-sa);
  left: 0%;
  padding: 8px 12px;
  margin: 1px 0;
  position: absolute !important;
  text-align: center;
  word-spacing: normal;
  white-space: normal;
  letter-spacing: 0.2px !important;
  top: 8px;
  width: 236px !important;
  /* z-index: 100000 !important; */
  text-transform: lowercase;
  font-size: 11px;
  height: 237px;
}

#pun-navlinks #navlogin #form-login {
  margin-left: -40px;
  /*Подвижки формы влево от вход*/
}

#pun-navlinks #navlogout #form-login {
  margin-left: -40px;
  /*Подвижки формы влево от выход*/
}

.ismoderator #pun-navlinks #navlogout #form-login {
  margin-left: 235px !important;
}

/*Стиль ссылок в форме "Не зарегистрированы" и "Забыли пароль" */
#pun-navlinks #form-login input[value="Войти"]+p {
  margin: 5px 0 2px 0;
}

.punbb #pun-navlinks #form-login a.Rega,
.punbb #pun-navlinks #form-login a.Forgot {
  position: relative;
  text-transform: lowercase;
  z-index: 20;
  cursor: pointer;
  background: none !important;
  padding: 0 0 3px !important;
  color: var(--black) !important;
  font-size: 9px !important;
  font-weight: 400;
}


.punbb #pun-navlinks #form-login a.Rega:before,
.punbb #pun-navlinks #form-login a.Forgot:before {
  content: none;
}

/* Помечаем красным незаполненные поля!*/
#form-login input.none {
  outline: red dashed 2px !important;
}

input#Paste-And-Copy {
  width: 244px !important;
}


/*Форма слева(с Никами) */

#List-UserNames {
  position: absolute;
  margin-top: -11px;
  min-height: 235px;
  width: 270px;
  right: 97%;
  padding: 12px 19px 12px 17px;
  background: rgb(var(--canvas-post-body));
  border-color: rgb(var(--canvas-quarternary));
  border-style: solid;
  border-width: 0px;
  border-radius: var(--fs8);
  text-align: center;
}

/*Стиль контейнера под список Ников*/

.punbb #List-UserNames ul {
  padding: 0;
  overflow: hidden;
  overflow-y: auto;
  min-height: 36px;
  max-height: 113px !important;
  height: 149px;
}

.punbb #List-UserNames li {
  display: flex;
  position: relative;
  text-align: left;
  padding-left: 5px !important;
  font: var(--font-reserve);
  margin: 1px auto !important;
  padding: 7px 5px;
  transition: .33s;
  border-radius: var(--fs8);
  border: 1px solid #d2d2d2;
  gap: 3px;
  align-items: center;
}

.punbb #List-UserNames li:hover {
  opacity: .84;
  /*background:#83693E!important;*/
}

/*Стиль Ников*/

.punbb #List-UserNames li>b {
  cursor: pointer;
  opacity: .8;
  color: var(--black);
}

.punbb #List-UserNames li>b:hover {
  opacity: .93;
  color: var(--links) !important;
}

/*Скролл контейнера с никами*/
#List-UserNames ul::-webkit-scrollbar {
  width: 3px;
  height: 5px;
}

#List-UserNames ul::-webkit-scrollbar-track {
  background-color: #393A38;
  border: 0px solid #d7d8d9;
  box-shadow: none;
}

#List-UserNames ul::-webkit-scrollbar-thumb {
  background-color: #C0BFBD;
  border: 0px solid #d7d8d9;
  box-shadow: none;
}

/*Кнопки Удалить (правее ников)*/
#List-UserNames ul li>span {
  display: flex;
  padding: 0 3px;
  position: absolute;
  opacity: .88;
  cursor: pointer;
  top: 0;
  bottom: 0;
  right: 6px;
  color: var(--text-2);
  font: var(--mainfont);
  align-items: center;
  font-weight: 900;
}

/*Текст при отсутствии запомненных Ников!*/
#List-UserNames ul:empty:before {
  display: inline-block;
  content: "У Вас нет запомненных ников, введенных через форму справа, или через перенос ниже!";
}

/*Кнопка выход-2*/
#navlogin #exit-2 {
  display: none;
}

#pun:not(.isguest) #navlogout .Rega,
#pun:not(.isguest) #navlogout .Forgot {
  display: none !important;
}

/*Стиль блока с инпутом для переноса и вставки запомненных Аккаунтов*/
#List-UserNames ul+span {
  display: inline-block;
  padding: 6px 0 8px 0;
  text-align: left;
  margin-top: 21px;
}

/*Сам инпут*/
.punbb #List-UserNames input {
  border: 1px solid #5D6755 !important;
  text-shadow: none !important;
  color: #333 !important;
  background-color: #D4D4D4;
  font: normal normal 400 11px/normal Verdana !important;
  /* box-shadow: inset 0px 0px 3px rgba(100,102,80,.97); */
  margin-top: 9px;
  padding: 2px !important;
  vertical-align: middle;
}

/*Стрелочки к инпуту*/
#List-UserNames ul+span b {
  font: normal normal 400 13px/normal Verdana;
  padding: 0 3px;
  color: #000000;
}

/*Кликалка слева, чуть выше инпута*/
#List-UserNames .a1-copy {
  display: inline-block !important;
  cursor: pointer;
  float: left;
}

/*Кликалка справа*/
#List-UserNames .a1-paste {
  cursor: pointer;
  display: inline-block !important;
  float: right;
}

/*Подсказки на кликалках*/
.tipsy.a11 {
  font: normal normal 400 11px/normal Verdana !important;
  margin-top: -22px !important;
  margin-left: 148px !important;
  max-width: 170px;
}

#pun-navlinks #form-login div#List-UserNames::after {
  content: "обязатель укажите ник в том же регистре, что и в профиле, чтобы скрипт сработал";
  font-size: 9px;
  margin: 4px 0px 4px;
}

/************************* 
//Конец Стиля для Быстрой смены аккаунтов 
*************************/






/***************МАСКА*************/
#mask_dialog .hv-preview-block {
  flex: 0 0 120px;
  text-align: center;
  max-width: 120px;
  overflow: hidden;
  word-break: break-word;
  max-height: 360px;
  overflow-y: auto;
  overflow-x: hidden;
  min-width: 238px;
}

#mask_dialog .hv-preview-block {
  flex: 0 0 120px;
  text-align: center;
  max-width: 120px;
  overflow: hidden;
  word-break: break-word;
  max-height: 360px;
  overflow-y: auto;
  overflow-x: hidden;
  min-width: 253px;
  padding: 10px;
}

#mask_dialog .inner {
  cursor: default;
  margin: 0;
  width: 850px;
  max-width: 99%;
  max-height: 90%;
  overflow-x: auto;
  z-index: 100;
  box-shadow: 0 0 40px #222;
  background: rgb(var(--canvas-primary));
  padding: 8px;
  text-transform: lowercase;
  border-radius: var(--bradius-medium);
}


/*****************
Стиль "Тихой Цитаты"
*****************/
.quiet-quote {
  position: relative;
  margin: 4px 15px 0px 19px !important;
  /*Отступы*/
  font-style: italic;
  font-size: 11px;
  color: #695f5f;
  /*text-align:justify;
  border:red solid 1px;*/
}

.quiet-quote>p {
  line-height: normal !important;
}

.quiet-quote:before,
/*Шрифт, Цвет, Размер иконок*/
.quiet-quote:after {
  font-size: 17px;
  display: inline-block;
  position: absolute;
  z-index: 10;
  font-weight: 900;
  color: #695f5f;
  /*Цвет Кавычек*/
  font-family: System, Arial, sans-serif;
}

.quiet-quote:before {
  content: "\201C";
  /*Код левой кавычки к Тихой цитате*/
  left: -13px;
  top: -4px;
}

/* Cкрыл Правую кавычку
.quiet-quote:after{
  content: "\201D";  */
/*Код правой кавычки к Тихой цитате
right: -15px;
bottom: -20px;
}*/

/*************************
/END//Стиль "Тихой Цитаты"
*************************/

/* мелочи под диз */

#notify-link .unreads,
#navpm .unreads,
span.num_msg,
span.num_msg:before {
  background: rgba(220, 157, 164, 1) !important;
}

#BookmCntToggle.default-style {
  background: rgba(var(--canvas-primary)) !important;
  border-left: solid 5px rgb(var(--accent)) !important;
  box-shadow: 0 0 6px rgba(0, 0, 0, .42);
  color: rgb(var(--accent)) !important;
  display: block;
  height: 26px;
  width: 21px;
}

.closedatafield {
  display: none
}

.gallery-song {
  color: #333;
  width: auto;
  text-align: center;
  text-transform: uppercase;
  border-top: 1px solid #cacaca;
  margin-top: 5px;
  font-family: 'Cormorant Infant';
  font-size: 15px;
  font-weight: 600;
  padding-top: 5px;
  margin-bottom: -8px;
}

.hv-mask-field title {
  display: none
}

















/*фикс поиска в топике*/
#tuser {
    cursor: pointer;
    opacity: 0.5;
    padding: 2px;
    width: 20px;
    height: 20px;
    position: absolute!important;
    margin-top: -10px !important;
    margin-left: -250px !important;
}


.icons-search:before {
    content: '\f002'!important;
    font: var(--fa-font-solid) !important;
}

#isk {
    border: none !important;
    font-size: 14px!important;
    margin-top: 3px!important;
    cursor: pointer !important;
    height: 23px !important;
    width: 23px !important;
    display: flex !important;
    justify-content: center !important;
    font-size: 11px !important;
    color: rgb(var(--gray-text)) !important;
    align-items: stretch !important;
}

#sTheme {
    border-radius: var(--bradius-minor) !important;
    height: 25px !important;
    width: 200px !important;
    opacity: .5;
    border: 1px solid #c5c5c5 !important;
}

#text-left,
#text-right {
  height: 20px;
  width: 20px;
}

#form-buttons td#button-smile {
  display: none;
}

/* описание форумов на главной и ссылки там же */

forumdesc {
    display: block;
    width: 525px;
    font-size: var(--fs10);
    color: rgb(var(--text-color-secondary), .7);
    text-transform: lowercase;
    letter-spacing: 0.2px;
    line-height: 140%;
}

forumlinks {
    display: flex;
    gap: 5px;
    margin-top: 11px !important;
}

forumlinks a {
    padding: 4px 8px 6px;
    background: rgba(var(--light-accent), .5);
    border-radius: var(--bradius-major);
    color: rgba(var(--text-color-secondary)) !important;
    box-shadow: 0px 0px 0px 0px rgba(208, 126, 131, 0.6), 0px 0px 0px 0px rgba(255, 255, 255, 0.67) inset;
    transition: box-shadow .3s cubic-bezier(0.62, -0.09, 0.23, 0.9), background .4s ease-in-out, color .4s ease-in-out;
}

forumlinks a:hover {
    box-shadow: 0px 4px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
    background: rgba(var(--accent), 1);
    border-radius: var(--bradius-major);
    color: rgba(var(--gray-main)) !important;
}


/* к шрифтам */ 

#font-area {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    max-height: 200px;
    overflow: auto;
}

.font-category-title:last-of-type::after {
content:'дефолтные';
display:block;
position:relative;
bottom: -30px;

}

.font-category-title:last-of-type::after, 
.font-category-title {
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    padding: 3px 0;
    background: rgb(var(--gray-second));
    border-bottom: 1px solid #ccc;
}

#font-area span, #font-area img {
    -webkit-transition: background var(--anim-hover);
    -o-transition: background var(--anim-hover);
    transition: background var(--anim-hover);
    display: flex !important;
    align-items: center;
    justify-content: center;
border-radius: 100px;
}

#font-area span:hover, #font-area img:hover {
  background: rgba(var(--accent), 0.2);
 border-radius: 100px;
}

.font-category {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 10px 0;
}

.font-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

#font-area .container:not(.font-category-title):not(.font-category) {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

#font-area .font-category-title,
#font-area .font-category {
    grid-column: span 2;
}
 


.font-column {
    flex: 1;
    min-width: 150px;
}

.font-item {
    justify-content: space-between;
    padding: 2px 5px;
}

.font-item img {
    cursor: pointer;
    opacity: 0.7;
}

.font-item img:hover {
    opacity: 1;
}

#font-area .container {
    width: 400px;
    font-size: 16px;
    padding: 5px;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

#pun-viewtopic .topic {
    width: 1020px;
    margin: auto;
    background: rgba(var(--gray-main), .3);
    border-radius: 16px;
    padding-top: 1px;
}

.punbb .toppost, .punbb .topicpost {
    margin-top: 15px;
}


.post-content .spoiler-box > blockquote {
display: block !important;
max-height: 0;
padding: 0px 10px!important;
overflow: hidden!important;
margin-top: 2px;
  transition: opacity 0.3s ease, padding 0.3s ease, max-height 0.5s ease;
opacity: 0;
width: 97%;
}

.post-content .spoiler-box > blockquote.visible {
    margin-top: 2px;
    opacity: 1;
    padding: 10px 10px !important;
    max-height: 3000px;
    overflow: auto !important;
    transition: opacity 0.3s ease, padding 0.3s ease, max-height 0.5s linear;
}


.post-content .spoiler-box > blockquote.visible p {
overflow: hidden;
}



.post.mylike .post-rating a.noNull {
  background: rgb(var(--accent)); 
}

.edit-pp {
    position: absolute;
    left: 4px;
    margin-top: -1px;
}

.edit-pp a {
    display: block;
    position: relative;
    width: 28px;
    margin: 0 3px;
    height: 25px;
    box-sizing: border-box;
    border-radius: 5px;
    background: rgb(var(--light-accent), .2) !important;
}

.edit-pp a::after {
    content: '\f4ff';
    font-family: 'FontAwesome';
    font-size: 10px;
    position: absolute;
    top: 2px;
    left: 8px;
    color: rgb(var(--text-primary), .1);
}

#tuser {
    cursor: pointer !important;
    opacity: 0.1 !important;
    padding: 2px !important;
    margin-top: -65px !important;
    margin-left: -185px !important;
}

#isk::before {
    margin-top: .2em;
    opacity: .3 !important;
}

#s-block {
    display: flex;
    justify-content: flex-end;
    margin-right: 29px;
}

.code-box .scrollbox {
    width: 100%;
    overflow: hidden auto;
    height: auto !important;
    max-height: 20vh;
}
/*отключение плашки в просмотре профиля*/
li#pa-fld2 {
    display: none;
}

/*скрыть email*/
li.pl-email.email {
    display: none;
}

li.pl-share {
    display: none !important;
} 

0

25

цвета
Код:
#Bubble a {
width: 25px;
height: 20px;
display: block;
}

#Bubble a::before {
    content: '\f10e';
    width: 25px;
    height: 20px;
    display: block;
    position: absolute;
    font-family: 'FontAwesome';
    top: -16px;
    color: rgb(var(--white));
    background: rgb(var(--text-color-secondary));
    border-radius: 4px;
    backdrop-filter: blur(2px);
    text-align: center;
    padding: 5px 0 0px 0;
    font-size: 14px;
}


/* Spoiler animation */ 

.spoiler-box > blockquote {
    display: block !important;
    opacity: 0;
    transform-origin: 50% 0;
    height: 0;
    padding-top: 0 !important;
    transition: all .2s ease;
}

.spoiler-box > blockquote.visible {
    padding-top: 16px !important;
    opacity: 1;
    height: auto;
} 





/* шрифты тёмная тема */ 

.dark #newFunc a {
    background: rgb(var(--quote-code));
}






#post-form h2 {display:none}

.theme-button {
    width: 18px;
    height: 18px;
    padding: 15px;
    border-radius: 50%;
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center;
    border: none;
    cursor: pointer;
    transition: transform var(--anim-hover), box-shadow var(--anim-hover);
    transform: translatey(0px);
    box-shadow: 0px 3px 3px #0000001c;
}

.theme-button:hover {
    transform: translatey(-3px);
box-shadow: var(--box-shadow-news);
}

html.light .theme-button {
    background: url('https://forumstatic.ru/files/001c/74/d2/54728.svg') no-repeat center, rgba(218, 223, 228, 1); /* луна */ 
}

html.dark .theme-button {
    background: url('https://forumstatic.ru/files/001c/74/d2/38480.svg') no-repeat center, rgba(39, 39, 39, 1); /* искры */ 
}

html.gray .theme-button {
    background: url('https://forumstatic.ru/files/001c/74/d2/30930.svg') no-repeat center, rgba(208, 126, 131, 1);  /* солнце */ 
}

.blushnews>div.overflown {
   justify-content: left;
}

/* набор новичка */ 

newbiestuff {
margin: 61px auto 0px!important;
display: block;
width: 956px;

}

newbiestuff ul {
padding: 0!important
}

newbiestuff > p {
border-radius: 10px;
padding: 20px;
position: relative;
    background: rgb(var(--light-accent), .15);
    color: rgb(var(--text-color-secondary));
}

newbiestuff::before {
    content: 'набор новичка';
    font: var(--fw900) 32px var(--font-cat-title);
    position: absolute;
    color: rgb(var(--text-color-secondary), .2);
    right: 22px;
    top: 30px;
}

newbiestuff li.pa-avatar {
    background: var(--avatar-newbie);
    background-size: 100%;
    padding: 0 !important;
    width: 60px;
    height: 60px;
    border-radius: 10px;
}



newbies {
display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px !important;
}

newbiestuff .pa-author #tuser { display: none;}

 

/* карточки */ 

.vtab-content {
  display: none;
}

.vtab-content.active {
  display: flex;
}

.vtab-btn {
  padding: 5px 10px;
  margin-right: 5px;
  cursor: pointer;
  transition: 0.4s ease-in-out;
  border: none;
}

.vtab-btn.active {

}

blushcards * {box-sizing: border-box}

blushcards {
display: block;
position: relative;
margin-top: 60px!important;
width: 726px;
text-transform: lowercase;
}

blushcards > p {
border-radius: 10px;
padding: 20px;
position: relative;
    background: rgb(var(--light-accent), .15);
    color: rgb(var(--text-color-secondary));
}


blushcards::before {
    content: 'the card';
    font: var(--fw900) 32px var(--font-cat-title);
    position: absolute;
    color: rgb(var(--text-color-secondary), .2);
    right: 0px;
    top: -41px;
}

blushcards .vtabs-wrapper {
    width: 726px;
    height: 440px;
    margin-top: 31px !important;
    position: relative;
    border-radius: 10px;
    background: rgb(var(--light-accent), .15);
}

blushcards .vtab-buttons {
position: absolute;
left: 50%;
transform: translatex(-50%);
    top: -12px;
}


blushcards .vtab-btn {
    padding: 2px 16px 3px;
color: white;
border-radius: var(--bradius-major);
box-shadow: 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
background: rgb(var(--light-accent));
font-size: var(--fs12);
font-weight: var(--fw700);
height: 23px;
}


blushcards button.vtab-btn.active {
background: rgb(var(--accent));
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
}

blushcards .vtab-content {
position: relative;
    top: 15px;
    width: 726px;
    height: 425px;
}

blushcards .vtab-content.active {
    align-items: flex-end;
    justify-content: space-between;
}

cardblock {
display: flex;
flex-wrap: wrap;
width: 335px;
height: 370px;
gap: 5px;
    left: 45px;
    bottom: 20px;
    position: relative;
}

cardblock img {
height: 120px;
width: 80px;
object-fit: cover;
border-radius: 10px;
}



secretcard {
    display: flex;
    position: relative;
    height: 339px;
    width: 260px;
    border: 1px dashed rgb(var(--text-color-secondary), .4);
    border-radius: 10px;
    flex-direction: column;
    align-items: center;
    right: 45px;
    bottom: 20px;
}


secretcard img:first-of-type {
height: 240px;
width: 160px;
object-fit: cover;
border-radius: 10px;
    position: absolute;
top: -50px;
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;

}


secretcard img:nth-of-type(3) {
    width: 24px;
    height: 24px;
    padding: 3px;
    border-radius: 50%;
    background: rgb(var(--canvas-primary), .9);
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: 249px;
    z-index: 4;
}

secretcard span:first-of-type { 
position: absolute;
top: 195px;
color: rgb(var(--text-color-secondary), .6);
}

secretcard span:nth-of-type(2) { 
position: absolute;
bottom: 16px;
color: rgb(var(--text-color-secondary), .6);
}

secretcard img:nth-of-type(2) {
width: 219px;
height: 39px;
object-fit: cover;
border-radius: 10px;
    position: absolute;
top: 221px;
}

secretcard plaque {
position: absolute;
    top: 265px;
    left: calc(50% + 1px);
    transform: translateX(-50%);
    width: 220px;
}
newbiestuff plaque p,
secretcard plaque p {
margin-bottom: 0!important;
}













/* парфюм */ 

perfume {
    display: flex;
    gap: 20px;
    position: relative;
    width: 956px;
    height: auto;
    margin: 0 auto !important;
    flex-direction: column;
    text-transform: lowercase;

}

perfume * {
box-sizing: border-box;
}

perfume::before {
    content: attr(data-title);
    font: var(--fw900) 32px var(--font-cat-title);
    position: absolute;
    color: rgb(var(--text-color-secondary), .2);
    right: 0px;
    top: 0px;

}

perfumeinfo {
display: block;
width: 956px;
padding: 20px;
    position: relative;
    top: 41px;
    margin-bottom: 41px !important;
border-radius: 10px;
    background: rgb(var(--light-accent), .2);
}

perfumeblock {
    width: 956px;
    display: flex;
    gap: 10px;
    border-radius: 10px;
    padding: 20px;
    background: rgb(var(--light-accent), .2);
    flex-direction: column;
}

perfumeblock > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-items: center;
    gap: 10px;
    max-height: 622px;
overflow:auto;
}


perfitem {
    padding: 10px;
    width: 446px;
    display: grid;
    grid-template-columns: 150px 260px;
    grid-template-rows: minmax(auto, 122px) auto;
    gap: 10px;
    border-radius: 10px;
    background: rgb(var(--canvas-quarternary), .3);
    justify-content: center;
}


perfitem ul {
    padding: 10px 10px 10px 30px !important;
    background: rgb(var(--gray-main), .4);
    border-radius: 10px;
    list-style-type: decimal !important;
    color: rgb(var(--text-color-secondary));
}

perfitem ul::before {
content: attr(data-title);
position: relative;
font-weight: var(--fw700);
    left: -20px;
    top: -3px;
}

.perf-rewards {
height: 122px;
}

perfitem ul li::marker {
padding-left: 10px!important;
}

.perf-list {
grid-column: span 2;
}

perfimg {
position: relative;
    width: 150px;
    height: 122px;
    display: flex;
    border-radius: 10px;
    background: rgb(var(--accent), .15);
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

perfimg::before {
    content: attr(data-title);
    position: absolute;
    background: url(https://forumstatic.ru/files/001c/74/d2/42222.svg);
    width: 108px;
    height: 77px;
    top: 13px;
}

.dark perfimg::before {
opacity: .2;
}

perfimg p {
 /*   font-size: 10px !important;
    text-align: center;
    height: 25px;
    display: flex;
    bottom: 0px;
    position: absolute;
    overflow: hidden;
    align-items: center; */
    font-size: 10px !important;
    text-align: center !important;
    height: 25px;
    display: flex;
    line-height: 9px !important;
    color: rgb(var(--text-primary)) !important;
    bottom: 0px;
    position: absolute !important;
    overflow: hidden;
    width: 100%;
    align-items: center;
    justify-content: center;
}

perfimg img {
max-width: 90px;
max-height: 90px;
object-fit: contain;
position: absolute;
top: 4px;
left: 50%;
    transform: translateX(-50%);
}








/* гостевая */

guestroom {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgb(var(--light-accent), .15);
    width: 718px;
    height: auto;
    border-radius: 15px;
    padding-bottom: 18px;
    margin: 0 auto !important;
}

guestheader {
    display: block;
    width: 680px;
    height: 160px;
    top: 30px;
    position: relative;
    background: var(--bg-guestroom);
    border-radius: 10px;
}

div#guestlinks {
    width: 718px;
    display: flex;
    justify-content: center;
    gap: 10px;
    position: absolute;
    margin-top: 36px !important;
    z-index: 2;
}


div#guestlinks a {
    color: rgba(255, 255, 255, 1) !important;
    background: rgb(183, 188, 183);
    box-shadow: 0px 0px 0px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset !important;
    padding: 4px 15px 5px !important;
    border-radius: var(--bradius-major);
    margin: -18px 0 0 0 !important;
    transition: var(--anim-hover) !important;
    font-weight: var(--fw700);
}

div#guestlinks a:hover {
  background: rgb(var(--accent));
  box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6),  0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset !important;
  color: rgba(255, 255, 255, 1) !important;
}

guestdesc {
    width: 678px;
    margin: 30px 0px -10px !important;
    padding: 15px 0;
    font: var(--fw400) var(--fs11) var(--font-second-sa);
    text-transform: lowercase;
}

.blush-ams-links {
  display: flex;
  gap: 4px;
  align-items: center;
}

.blush-amt-links {
    margin-top: 15px !important;
}

.blush-amt-links p {
  background: rgba(35, 37, 40, 1);
  padding: 2px 10px !important;
  box-sizing: border-box;
  color: rgba(238, 238, 238, 1);
  font: var(--fw400) var(--fs10) var(--font-second-sa) !important;
  border-radius: var(--bradius-major);
  margin: 0 !important;
  text-transform: lowercase;
}

.blush-amt-links a {
  font: var(--fw400) var(--fs11) var(--font-second-sa) !important;
  background: rgba(35, 37, 40, 0.1);
  margin: 0 !important;
  padding: 1px 8px 2px !important;
  border-radius: var(--bradius-major);
  color: rgb(var(--text-color-secondary), 1) !important;
  transition: var(--anim-hover) !important;
  box-shadow: 0px 0px 0px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset !important;
}

.blush-amt-links a:hover {
  background: rgb(var(--accent));
  box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6),  0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset !important;
}

.blush-guest-chars {
    width: 673px;
    display: flex;
    margin-top: 26px !important;
    gap: 5px;
}

reserved::before {
    content: attr(data-title);
    position: absolute;
    height: 25px;
    width: auto;
    border-radius: var(--bradius-major);
    font: var(--fw700) var(--fs12) var(--font-second-sa) !important;
    padding: 5px 8px 7px 8px;
    box-sizing: border-box;
    background-color: rgb(var(--light-accent), .2);
    color: rgb(var(--text-color-secondary));
    top: -13px;
    left: 50%;
    transform: translateX(-50%);
}

reserved {
    width: 333px;
    height: 280px;
    border-radius: 10px;
    position: relative;
    padding: 16px 35px;
    box-sizing: border-box;
    background: rgb(var(--light-accent), .15);
    text-transform: lowercase;
}

.gray reserved {
    background: rgb(var(--light-accent), .15);
}

reserved>div {
    width: 290px;
  height: 250px;
  position: relative;
  overflow: auto;
    line-height: 170%;
}

d {
    position: relative;
    background: rgb(var(--light-accent), .2);
    display: block;
    left: 19px;
margin: 5px 0 !important;
    width: fit-content;
    padding: 2px 8px 4px;
    font: var(--fw700) var(--fs11) var(--font-second-sa);
    border-radius: var(--bradius);
    height: 16px;
    box-sizing: border-box;
}

d::before {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    background: url(https://forumstatic.ru/files/001c/74/d2/66642.svg) no-repeat;
    border-radius: var(--bradius-major);
    left: -20px;
    top: -2px;
}














charlist { 
width: 796px;
height: 877px;
display: flex;
flex-direction: column;
margin: auto!important;
gap: 40px;
padding: 50px 0 0;
}

charlist::before {
    content: attr(data-title);
    font: var(--fw900) 32px var(--font-cat-title);
    position: absolute;
    color: rgb(var(--text-color-secondary), .2);
    right: 100px;
    top: 25px;
}

charlist div::before { 
    content: attr(data-title);
    position: absolute;
top: -49px;
    left: 6px;
    width: 136px;
    height: 34px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
    z-index: 10;
    font-weight: 600;
    background: rgb(208, 126, 131, 1);
    padding: 4px 18px 6px;
    border-radius: 100px;
    font-size: 18px;
    box-shadow: 0px 4px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
    color: rgba(255, 255, 255, 1) !important;
}

charlist div:nth-of-type(2)::before {
    left: auto;
    right: 6px;
}

charlist div:nth-of-type(2)::after{
    left: auto;
right: 25px;
}

charlist div p {
position: relative;
width: 368;
height: 206;
overflow: auto;
}

charlist div::after{
    content: '';
    width: 20px;
    height: 20px;
    border-radius: 50%;
    box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
    background: rgb(var(--accent));
    position: absolute;
    top: -11px;
    left: 8px;
}

charlist div {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 796px;
    height: 246px;
    padding: 20px 25px;
    position: relative;
    gap: 20px;
    border-radius: 4px;
    box-sizing: border-box;
    background: rgb(var(--light-accent), .15);
}




socnet {
    display: block;
    position: relative;
    margin: 0 auto !important;
    width: 320px;
    border-radius: 20px;
    background: rgb(var(--gray-main));
    box-sizing: border-box;
    padding: 10px;
    box-shadow: 0px 1px 10px 0px #00000024;
}

socnet.main {
border-top-left-radius: 40px;
height: 479px;


}
socnet.main>div {
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 0px 8px 0px rgba(255, 255, 255, 0.67) inset;
background: rgb(var(--accent));
width: 100px;
height: 100px;
display: flex;
position: absolute;
top: -11px;
left: -4px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
z-index: 2;
}

socnet.main>div>img {
    width: 82px;
    height: 82px;
border-radius: 50%;
    object-fit: cover;
box-shadow: 0px 1.85px 7.41px 0px rgba(255, 255, 255, 0.67) inset;

}

socnick {
display: flex;
position: absolute;
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
background: rgb(var(--accent));
color: white;
font: var(--fw700) var(--fs12) var(--font-main);
height: 34px;
border-radius: var(--bradius-major);
    padding: 5px 8px 6px;
    box-sizing: border-box;
    right: 10px;
    top: 10px;
    align-items: center;
    gap: 10px;
z-index: 2;
}

socnick::before {
content: '';
background: url(https://forumstatic.ru/files/001c/74/d2/83841.svg);
width: 24px;
height: 24px;
position: relative;
    display: inline-block;
}


socnick::after {
content: '';
background: url(https://forumstatic.ru/files/001c/74/d2/74092.svg);
width: 24px;
height: 24px;
position: relative;
    display: inline-block;
}


socstats {
    width: 256px;
    height: 65px;
    display: flex;
    position: absolute;
    background: linear-gradient(271.97deg, rgba(225, 225, 225, 0.385) 51.71%, rgba(255, 255, 255, 0) 136.44%);
    top: 26px;
    right: 18px;
    border-radius: 10px;
    z-index: 1;
    justify-content: flex-end;
    align-items: flex-end;
gap: 5px;
box-sizing: border-box;
padding: 8px;
}



socposts,
socfollowers,
socfollowing {
    display: flex;
    font: 700 9px verdana;
    background: rgb(var(--gray-main), .6);
    border-radius: 6px;
    padding: 3px 8px;
    box-sizing: border-box;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

socposts::before,
socfollowers::before,
socfollowing::before {
font: 400 9px verdana;

}

socposts::before {
content: 'posts';
}
socfollowers::before{
content: 'followers';
}
socfollowing::before {
content: 'following';
}


socphoto {
width: 284px;
    height: auto;
    position: relative;
    display: flex;
    top: 93px;
    margin: auto !important;
    flex-wrap: wrap;
    gap: 4px;
}

socphoto img {
   width: 92px;
    height: 118px;
border-radius: 10px;
    object-fit: cover;
}

socphoto img:first-of-type {
   width: 284px;
    height: 190px;
}

socmenu {
display: block;
background: url(https://forumstatic.ru/files/001c/74/d2/37935.svg) center no-repeat, rgb(var(--accent));
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 0px 8px 0px rgba(255, 255, 255, 0.67) inset;
height: 30px;
width: 240px;
margin: 0px 30px!important; 
position: absolute;
bottom: 20px;
border-radius: var(--bradius-major);
}

socnet.socpost {
height: 470px;

}

socnet.socpost > img {
width: 288px;
height: 288px;
margin: 0 6px!important;
position: relative; 
top: 22px;
border-radius: 10px;
object-fit: cover;
}

socnick2 {
display: flex;
position: absolute;
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
background: rgb(var(--accent));
color: white;
font: var(--fw700) var(--fs12) var(--font-main);
height: 40px;
border-radius: var(--bradius-major);
    padding: 5px 16px 6px 8px;
    box-sizing: border-box;
    left: -10px;
    top: -1px;
    align-items: center;
    gap: 7px;
z-index: 2;
}

socnick2 img {
    width: 30px;
    height: 30px;
border-radius: 50%;
    object-fit: cover;
box-shadow: 0px 1.85px 7.41px 0px rgba(255, 255, 255, 0.67) inset;
position: relative;
    top: 1px;
    left: -3px;
}

soclikes {
display: flex;
position: absolute;
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
background: rgb(var(--accent));
color: white;
font: var(--fw400) var(--fs9) var(--font-main);
height: 30px;
border-radius: var(--bradius-major);
    padding: 7px 16px 6px 16px;
    box-sizing: border-box;
    right: -10px;
    top: 305px;
    align-items: center;
    gap: 8px;
z-index: 2;
}

soclikes span{
    display: flex;
    align-items: center;
    gap: 4px;
}


soclikes span::before {
    content: '';
    background: url(https://forumstatic.ru/files/001c/74/d2/83841.svg);
    width: 18px;
    height: 18px;
    position: relative;
    display: inline-block;
}

soclikes span:first-of-type::before {  background: url(https://forumstatic.ru/files/001c/74/d2/98806.svg); }

soclikes span:last-of-type::before {  background: url(https://forumstatic.ru/files/001c/74/d2/95471.svg); }

socnet.socpost > span {
    height: 84px;
    width: 287px;
    position: relative;
    text-align: left;
    scrollbar-gutter: stable;
    display: block;
    overflow: auto;
    line-height: 127% !important;
    bottom: -71px;
    left: 7px;
    font: var(--fw400) var(--fs11) var(--font-main);
    color: rgb(var(--text-socnet), 1);
}

socdate {
    content: attr(data-date);
    height: 25px;
    border-radius: 7px;
    position: absolute;
    left: 15px;
    background: rgb(var(--canvas-secondary), .5);
    bottom: 112px;
    font: var(--fw400) var(--fs9) var(--font-main);
    padding: 8px 8px !important;
    box-sizing: border-box;
}

socnet.messenger {
height: 519px;
    margin: 25px auto 0 !important;
}

.socinput-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
height: 18px;
  pointer-events: none;
  background: url(https://forumstatic.ru/files/001c/74/d2/56792.svg);
}

.message-input {
    padding-left: 35px !important;
    width: 298px;
    height: 30px;
    box-sizing: border-box;
    background: rgb(var(--text-color-secondary), 0.05) !important;
    border-radius: var(--bradius-major) !important;
}

inputjoke {
display: block;
position: absolute;
height: 30px;
bottom: 11px;
}

socnet.messenger > div {
    display: flex;
    justify-content: center;
    position: relative;
    top: -30px;

}

socnet.messenger socnick2 {
    position: relative;
}

socialcall {
display: flex;
position: relative;
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
color: white;
font: var(--fw700) var(--fs12) var(--font-main);
height: 40px;
width: 40px;
border-radius: var(--bradius-major);
    padding: 5px 16px 6px 8px;
    box-sizing: border-box;
    background: url(https://forumstatic.ru/files/001c/74/d2/19182.svg) no-repeat center, rgb(var(--accent));
}


messenger {
    height: 440px;
    width: 300px;
    margin: auto !important;
    box-sizing: border-box;
    scrollbar-gutter: stable;
    overflow: auto;
    display: flex;
    left: 5px;
    flex-direction: column;
    gap: 10px;
    position: relative;
    top: -23px;
}



postleft {
border-radius: 20px 20px 20px 0px;
display: block;
    background: rgb(var(--text-color-secondary), 0.04);
padding: 10px;
width: 278px;
    box-sizing: border-box;
    color: rgb(var(--text-color-secondary));
}

postright > img,
postleft > img {
max-height:200px;
max-width: 200px;
object-fit:cover;
border-radius: 5px;
display: block;
margin-bottom: 10px !important;
}


postright {
    display: flex;
    position: relative;
    right: -11px;
    width: 278px;
    border-radius: 20px 20px 0px 20px;
    background: rgb(var(--accent), 0.07);
    padding: 10px;
    box-sizing: border-box;
    color: rgb(var(--text-socnet));
    flex-direction: column;
    align-items: flex-end;
}


.postimgleft,
.postimgright {
    position: relative;
width: 120px;
height: 120px;
border: 4px solid rgb(var(--accent)) !important;
object-fit:cover;
border-radius: 50%;
    flex-shrink: 0;
}

.postimgright {
    align-self: end;
    right: 10px;

}

socvoiceleft,
socvoiceright {
width: 186px;
height:34px;
display: block;
    flex-shrink: 0;
position: relative;
}

socvoiceleft {
background: url(https://forumstatic.ru/files/001c/74/d2/21494.svg) no-repeat;
}

socvoiceright {
background: url(https://forumstatic.ru/files/001c/74/d2/60366.svg) no-repeat;
    align-self: end;
    right: 10px;
}

/* примерочная */ 

fittingroom {
  display: flex;
    background: rgb(var(--light-accent), .15);
border-radius: 10px;
    justify-content: space-around;
padding: 10px;
margin-top: 41px !important;
}

fittingroom * {
box-sizing: border-box;
}

fitprofile ul {
padding: 0!important;

}

.plaque-controls button {
font: 700 12px rubik;

}

fitcont {
display: grid; 
grid-template-columns: repeat(2, 1fr);
gap: 18px 10px ;
}

fittingbg,
fittingicons {
  grid-column: span 2;
    background: rgb(var(--canvas-quarternary), .3);
 border-radius: var(--bradius-minor);
width: 590px;
position: relative;
padding: 21px 8px 12px;
}

fittingicons {
height: 127px;
}

fittingicons > div {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    box-sizing: content-box;
    overflow: auto;
    padding-left: 8px;
    padding-top: 1px;
    height: 95px;
    scrollbar-gutter: stable;
    align-content: flex-start;
}

fittingicons > div img {
    background: rgb(var(--text-primary), .05);
    padding: 3px;
    border-radius: 50%;
    box-sizing: content-box;
    overflow: visible;
    width: 20px;
    height: 20px;
    object-fit: contain;
}

fittingroom::before {
    content: 'the store';
    font: var(--fw900) 32px var(--font-cat-title);
    position: absolute;
    color: rgb(var(--text-color-secondary), .2);
    right: 22px;
    top: 16px;

}

fittingbg > div {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    box-sizing: content-box;
    overflow: auto;
    padding-left: 7px;
    padding-top: 1px;
    height: 285px;
    scrollbar-gutter: stable;
}

fittingbg >div img {
    border-radius: 10px;
    box-sizing: content-box;
    width: 89px;
    height: 90px;
    object-fit: cover;
    image-rendering: auto;
}

fittingbg {
height: 320px;

}


plaquedesc {
    padding: 20px;
    display: flex;
    width: 290px;
    height: 96px;
    color: rgb(var(--text-color-secondary), .6);
    text-align: center;
    position: relative;
    justify-content: center;
    align-items: center;
    border-radius: var(--bradius-minor);
    background: rgb(var(--canvas-quarternary), .3);
}

fittingbg::before,
fittingicons::before,
plaquedesc::before { 
    content: attr(data-title);
    position: absolute;
    top: -14px;
    right: 8px;
    width: 136px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
    z-index: 10;
    font-weight: 600;
    font-size: var(--fs12);
    background: rgb(208, 126, 131, 1);
    padding: 4px 18px 6px;
    border-radius: 100px;
    box-shadow: 0px 4px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
    color: rgba(255, 255, 255, 1) !important;
}


.fitting-plaque p {
padding: 0!important;
margin: 0!important;
margin-bottom: 0!important

}

.fitting-plaque img {
box-sizing: content-box;
}

img.fit-selected {
opacity: .3;
}

fittingicons > div > div {
  width: 26px;
height: 26px;
border-radius: 50%;
position: relative;
}

fittingicons > div > div:has(> img.fit-selected) {
  outline: 1px solid rgb(var(--accent));
}

fittingicons > div > div:has(> img.fit-selected)::before {
content: '';
background: url(https://forumstatic.ru/files/001c/74/d2/12074.svg);
background-size: 10px 10px;
position: absolute;
width: 10px;
    height: 10px;
    top: -1px;
    right: -2px;
    z-index: 4;
}

fittingbg > div > div {
    border-radius: 10px;
    width: 89px;
    height: 90px;
position: relative;
}

fittingbg > div > div:has(> img.fit-selected) {
  outline: 1px solid rgb(var(--accent));
}

fittingbg > div > div:has(> img.fit-selected)::before {
content: '';
background: url(https://forumstatic.ru/files/001c/74/d2/12074.svg);
background-size: 10px 10px;
position: absolute;
width: 10px;
    height: 10px;
    top: 4px;
    right: 4px;
    z-index: 4;
}

.plaque-controls > input:nth-of-type(1),
.plaque-controls > input:nth-of-type(2) {
    width: 220px;
    height: 25px;
    border-radius: 4px;
    margin-bottom: 7px;
}

.plaque-controls {
    width: 220px;
    margin-left: 11px !important;
}



.plaque-controls > div > input[type="color"] {
    padding: 0px !important;
    background: transparent;
    width: 28px;
    border-radius: 47px;
    height: 28px;
    flex-shrink: 0;
    cursor: pointer;
}

.plaque-controls > div > input[type="text"] {
    width: 70px;
    height: 25px;
    border-radius: 4px;
    cursor: text;
}

.plaque-controls button {
    font: 400 12px rubik;
    padding: 2px 10px !important;
    border: none;
    background: rgb(var(--accent), .4);
    border-radius: 30px;
    margin: 0 !important;
    color: rgba(39, 39, 39, 1);
}


fitprofile button {
font: 400 12px rubik;
    padding: 2px 10px !important;
    border: none;
    background: rgb(var(--accent), .4);
    border-radius: 30px;
    cursor: pointer;
    color: rgba(39, 39, 39, 1);
}

fitprofile {
    width: 288px;
    padding: 23px;
    background: rgb(var(--canvas-quarternary), .3);
    border-radius: 10px;
}

 button.fit-copy {
    margin-left: 11px !important;
}


.plaque-controls span {
    text-align: left;
    display: block;
    padding: 1px 4px 4px;
    color: rgb(var(--text-dark-accent), .7);
}

/* личная страница */ 

personalpage {
    display: block;
    position: relative;
    width: 926px;
    height: 445px;
    border-radius: 10px;
    background: url(https://forumstatic.ru/files/001c/74/d2/91589.svg);
}



personalpage .vtab-content {
  display: none;
  padding: 10px;
    box-shadow: 0 0 0 2px rgb(var(--canvas-primary), .54);

}

personalpage * {
box-sizing: border-box;
    scrollbar-gutter: stable;

}

personalpage .vtab-content.active {
  display: block;
}

personalpage .vtab-btn {
    padding: 0px 12px;
    height: 25px;
    cursor: pointer;
    gap: 4px;
    display: flex;
    background: rgb(var(--accent));
    transition: background 0.3s, width 0.3s, box-shadow 0.3s;
    color: rgba(255, 255, 255, 1);
    font-size: 12px;
    box-shadow: 0px 0px 0px 0px rgba(208, 126, 131, 0.6), 0px 0px 0px 0px rgba(255, 255, 255, 0.67) inset;
    font-weight: var(--fw400);
    text-transform: lowercase;
    border-radius: var(--bradius-major);
    align-items: center;
    width: 96px;
}

personalpage .vtab-btn::before {
    content: '';
    position: relative;
    left: 0px;
    top: -1px;
    display: block;
    width: 18px;
    height: 18px;
}

personalpage .vtab-btn:first-of-type::before {
    background: url(https://forumstatic.ru/files/001c/74/d2/72866.svg);
}

personalpage .vtab-btn:nth-of-type(2)::before {
    background: url(https://forumstatic.ru/files/001c/74/d2/47350.svg);
}

personalpage .vtab-btn:last-of-type::before {
    background: url(https://forumstatic.ru/files/001c/74/d2/22056.svg);
}

personalpage .vtab-btn.active {
    box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
    width: 113px;
}

personalpage .vtab-buttons {
    position: absolute;
    display: flex;
    gap: 12px;
    flex-direction: column;
    top: 60px;
    left: 34px;
    z-index: 3;
}

personalpage .vtabs-cont {
    display: flex;
}

personalpage .vtab-content.active {
    position: absolute;
    display: block;
    width: 766px;
    height: 377px;
    right: 24px;
    bottom: 24px;
    box-sizing: border-box;
    border-radius: 10px;
    border-width: 2px;
    background: rgba(242, 242, 242, 1);
    backdrop-filter: blur(4px);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.54), 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
}
pptwinks {
    position: absolute;
    padding: 0 2px;
    top: -71px;
    left: 147px;
    height: 192px;
    display: flex;
    gap: 8px;
    width: 750px;
    overflow-x: auto;
    align-items: flex-end;
    scroll-behavior: smooth;
}

pptwinks > div {
    width: 131px;
    height: 117px;
    top: -14px;
    position: relative;
    background: rgba(229, 229, 229, 1);
    border-radius: var(--bradius-top);
    box-shadow: 0 0 0 2px rgba(229, 229, 229, 0.54);
   transform: translatey(0px);
    transition: transform var(--anim-hover);
    flex-shrink: 0;
}

pptwinks > div:hover {
   transform: translatey(-42px);
}

pptwinks > div:has(p):hover {
   transform: translatey(-42px);
}
pptwinks > div:not(:has(p)):hover {
   transform: translatey(-12px);
}

pptwinks > div > a > img {
    width: 35px;
    height: 35px;
    width: 35px;
    height: 35px;
    position: absolute;
    left: 50px;
    top: 4px;
    border-radius: var(--bradius-major);
    box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
}

pptwinks > div > a > span {
font-weight: var(--fw500);
font-size: var(--fs10);
text-transform: uppercase;
position: absolute;
width: 95%;
    text-align: center;
color: black;
top: 47px;
    border-bottom: 1px dashed rgba(136, 136, 136, 0.51);
    left: 50%;
    padding-bottom: 3px;
    transform: translatex(-50%);
}

pptwinks > div > a > p {
    font-weight: var(--fw400);
    font-size: var(--fs10);
    text-transform: lowercase;
    position: absolute;
    width: 95%;
    left: 50%;
    padding-top: 5px;
    transform: translatex(-50%);
    text-align: center;
    color: black;
    line-height: 10px !important;
    top: 63px;
}


ppcoupons {
    position: absolute;
    width: 701px;
    height: 186px;
    top: 15px;
    left: 35px;
    display: flex;
    align-items: flex-end;
}

ppcoupons > div {
    display: flex;
    height: 186px;
    width: 701px;
    gap: 5px;
    overflow-x: auto;
    overflow-y: hidden;
    align-items: flex-end;
    scroll-behavior: smooth;
}

ppcoupons > div::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}

coupon {
    display: flex;
    width: 110px;
    height: 136px;
    position: relative;
    border-radius: 10px;
    gap: 2px;
    padding: 6px;
    background:rgba(255, 255, 255, 1);
    justify-content: center;
    flex-direction: column;
    flex-shrink: 0;
}

coupon img {
position: absolute;
box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
width: 80px;
height: 120px;
border-radius: 5px;
object-fit: cover;
    left: 15px;
    top: -37px;
}

coupon.__0 {
filter: opacity(.6) grayscale(1);
}

coupon span {
    font-size: 10px;
    font-weight: var(--fw700);
    width: 98px;
    height: 12px;
    line-height: 8px !important;
    position: absolute;
    bottom: 26px;
    text-align: center;
    color: rgb(var(--canvas-tertiary));
    text-transform: lowercase;
}


coupon p {
    font-size: 8px;
    width: 101px;
    height: 25px;
    line-height: 8px !important;
    position: absolute;
    bottom: 0px;
    text-align: center;
    color: rgb(var(--canvas-tertiary), .6);
    text-transform: lowercase;
}

coupon coupcount {
    display: flex;
    border-radius: var(--bradius-major);
    background: rgb(var(--accent));
    width: 20px;
    height: 20px;
    box-shadow: 0px 6px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
    justify-content: center;
    align-items: center;
    color: rgb(var(--white));
    z-index: 3;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 72px;
    font-size: var(--fs11);
}

cardscollect {
display: block;
width: 500px;
height: 120px;
position: absolute; 
bottom: 32px;
left: 35px;
}

cardscollect div {
    display: flex;
    height: 100%;
    width: 100%;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    align-items: flex-end;
    scroll-behavior: smooth;
}

cardscollect div::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}

.vtab1desc {
    position: absolute;
    width: 139px;
    height: 44px;
    font-size: var(--fs9);
    text-align: end;
    line-height: 12px;
    bottom: 70px;
    right: 36px;
 color: rgba(35, 37, 40, 0.6);;
}

.vtab1desc a {
font-weight: var(--fw700);
    text-decoration: underline !important;
    color: rgb(var(--accent)) !important;
}

ppplaques {
    display: block;
    background: rgba(255, 255, 255, 0.6);
    width: 243px;
    height: 313px;
    border-radius: 10px;
    position: absolute;
    padding: 8px;
    top: 32px;
    right: 12px;
}

ppplaques div {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 230px;
    overflow: auto;
    height: 100%;
}


ppplaques div plaque {
position: relative;
    flex-shrink: 0;
}

pppbgs {
display: block;
position: absolute;
width: 482px;
height: 198px;
border-radius: 10px;
padding: 8px;
background: rgba(255, 255, 255, 0.6);
bottom: 32px;
left: 19px;
}

pppbgs div {
    display: flex;
    gap: 4px;
    overflow: auto;
    flex-wrap: wrap;
    height: 100%;
    width: 102%;
}

ppicons {
    background: url(https://forumstatic.ru/files/001c/74/d2/69054.svg);
    display: flex;
    width: 198px;
    height: 101px;
    position: absolute;
    top: 34px;
    right: 263px;
    border-radius: 10px;
    padding: 8px;
    align-items: center;
}

ppicons div {
    gap: 4px;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    max-height: 100%;
    justify-content: center;
    overflow: auto;
    align-content: flex-start;
}

ppicons div img {
background: rgba(35, 37, 40, 0.05);
width: 26px;
height: 26px;
gap: 10px;
padding: 3px;
border-radius: 50%;
}

.vtab2desc {
    width: 163px;
    height: 36px;
    top: 74px;
    left: 61px;
    font-size: 10px;
    text-align: center;
    position: absolute;
    color: rgba(35, 37, 40, 0.6);
}

.vtab2desc a {
    font-weight: 700;
    text-decoration: underline !important;
    color: rgb(var(--accent)) !important;
}

.vtab2desc::before {
    content: '';
    height: 39px;
    width: 46px;
    position: absolute;
    top: 8px;
    left: -36px;
background: url(https://forumstatic.ru/files/001c/74/d2/69820.svg);

}

.vtab2desc::after{
    content: '';
    height: 48px;
    width: 54px;
    position: absolute;
    top: -24px;
    right: -42px;
background: url(https://forumstatic.ru/files/001c/74/d2/25608.svg);

}

ppperfume {
width: 624px;
height: 286px;
top: 36px;
left: 77px;
position: absolute;

}

ppperfume div {
display: flex;
gap: 6px;
height: 100%;
overflow: auto;
    flex-wrap: wrap;
}

ppperfume perfume {
background-image: url(https://forumstatic.ru/files/001c/74/d2/56619.svg);
background-repeat: no-repeat;
    background-position: 35px 19px;
    position: relative;
width: 150px;
height: 140px;
border-radius: 10px;
    margin: 0 !important;
}

perfume img {
width: 85px;
height: 90px;
position: absolute;
top: 4px;
left: 50%;
transform: translatex(-50%);

}

perfume p { 
    color: rgba(0, 0, 0, 1);
    font-size: 10px;
    font-weight: 700;
    position: relative;
    left: 50%;
    text-align: center;
    letter-spacing: 0.3px;
    transform: translatex(-50%);
    top: 98px;

}

perfume span { 
    color: rgba(0, 0, 0, 1);
    font-size: 12px;
    font-weight: 700;
    position: absolute;
    display: block;
    text-align: center;
    top: 114px;
    left: 50%;
    transform: translatex(-50%);
}


perfume.__2 {
background-color: rgba(208, 126, 131, 0.15);
}

perfume.__1 {
background-color: rgba(229, 229, 229, 1);

}

perfume.__0 {
background-color:  rgba(229, 229, 229, 1);
opacity: .7;
}

.vtab3desc {
font-size: 9px;
color: rgba(35, 37, 40, 0.6);
position: absolute;
bottom: 23px;
left: 77px;
}

.vtab3desc a {
font-weight: 700;
    text-decoration: underline !important;
    color: rgb(var(--accent)) !important;
}

/* шапка */ 

headcouple {
    width: 360px;
    height: 23px;
    position: absolute;
    top: 9px;
    display: flex;
    font: var(--fw700) var(--fs10) var(--font-third);
    justify-content: center;
    z-index: 22;
}

headcouple div {
    display: flex;
    gap: 8px;
    position: absolute;
    border-radius: var(--bradius-major);
    background: rgba(34, 42, 53, 1);
    padding: 5px 20px;
    height: 23px;
    box-sizing: border-box;
    color: rgb(var(--accent));
}

headcouple div a { 
    color: rgb(var(--accent));
    transition: color var(--anim-hover);
}

headcouple div a:hover {
color: rgb(var(--light-accent))!important;
}

headepisode {
    width: 360px;
    height: 23px;
    position: absolute;
    top: 9px;
    right: 0px;
    display: flex;
    font: var(--fw700) var(--fs10) var(--font-third);
    justify-content: center;
    z-index: 22;
}

headepisode div {
    display: block;
    position: absolute;
    border-radius: var(--bradius-major);
    background: rgba(34, 42, 53, 1);
    padding: 5px 20px;
    height: 23px;
    box-sizing: border-box;
    color: rgb(var(--accent));
}

headepisode div a { 
    color: rgb(var(--accent));
    transition: color var(--anim-hover);
}

headepisode div a:hover {
color: rgb(var(--light-accent))!important;
}

headdesc {
    display: flex;
    width: 1100px;
    height: 15px;
   /*position: absolute;*/
    z-index: -1;
    top: -28px;
    gap: 5px;
    align-items: center;
    font: var(--fw700) var(--fs12) var(--font-third);
    color: rgba(208, 208, 208, 1);
    justify-content: center;
}

headdesc span {
display: block;
    font: var(--fw700) var(--fs9) var(--font-third);
position: relative;
top: 1px;
text-decoration: underline;
}

headamt {
    display: flex;
    gap: 2px;
    position: absolute;
    top: 287px;
    left: 379px;
    width: 360px;
    flex-direction: row;
    align-items: flex-start;
    z-index: 22;
    justify-content: center;
}

headamt a {
    color: rgb(var(--accent)) !important;
    transition: color var(--anim-hover);
        font: var(--fw400) var(--fs8) var(--font-third);

}

headamt a:hover {
color: rgb(var(--light-accent))!important;

}

headpair {
    display: flex;
    z-index: 22;
    overflow: visible;
    right: 869px;
    height: 23px;
    padding: 5px 10px;
    top: 330px;
    position: absolute;
    align-items: center;
    flex-direction: row;
    box-sizing: border-box;
    gap: 8px;
    border-radius: 20px;
    background: rgb(0 0 0 / 60%);
    backdrop-filter: blur(4px);
    flex-wrap: nowrap;
}

headpair a {
     color: rgb(var(--accent))!important;
    transition: color var(--anim-hover);
        font: var(--fw700) var(--fs10) var(--font-third);
}

headpair a:hover {
color: rgb(var(--light-accent))!important;
}

headpair::before,
headactive::before {
content: attr(data-title);
color: rgba(255, 255, 255, 0.7);
font: var(--fw800) var(--fs14) var(--font-cat-title);
position: absolute;
left: 50%;
top: -8px;
transform: translatex(-50%);
}

headpost {
    display: flex;
    z-index: 22;
    overflow: visible;
    right: 399px;
    padding: 8px 10px 10px 10px;
    top: 311px;
    height: 51px;
    width: 295px;
    position: absolute;
    box-sizing: border-box;
    flex-direction: column;
    gap: 4px;
    border-radius: 10px;
    /* background: rgba(255, 255, 255, 0.38); */
    backdrop-filter: blur(4px);
    flex-wrap: nowrap;
    border: 1px solid rgb(186 186 186 / 30%);
    align-items: flex-start;
}

headpost a {
    color: rgb(var(--accent)) !important;
    transition: color var(--anim-hover);
    font: var(--fw700) var(--fs10) var(--font-third);
    position: absolute;
    top: -7px;
    background: rgb(var(--canvas-tertiary));
}

headpost a:hover {
color: rgb(var(--light-accent))!important;
}

headpost::before {
content: attr(data-title);
position: relative;
        font: var(--fw400) var(--fs10) var(--font-third);
color: rgba(203, 200, 196, 1);
    top: -1px;
}

headpost span {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font: var(--fw400) var(--fs8) var(--font-third);
    line-height: 9px;
    color: rgba(205, 205, 205, .9);
    position: relative;
    width: 100%;
    text-transform: lowercase;
    letter-spacing: 0.1px;
    text-align: justify;
}


headactive {
    display: flex;
    z-index: 28;
    overflow: visible;
    left: 841px;
    height: 23px;
    padding: 5px 10px;
    top: 320px;
    position: absolute;
    align-items: center;
    flex-direction: row;
    box-sizing: border-box;
    gap: 8px;
    border-radius: 20px;
    background: rgb(0 0 0 / 60%);
    backdrop-filter: blur(4px);
    flex-wrap: nowrap;
}

headactive a {
     color: rgb(var(--accent))!important;
    transition: color var(--anim-hover);
        font: var(--fw700) var(--fs10) var(--font-third);
padding-left: 8px;
}

headactive a:hover {
color: rgb(var(--light-accent))!important;
}


headactive img {
    background: rgba(33, 34, 34, 1);
    width: 18px;
    height: 18px;
    padding: 8px;
    border-radius: 50%;
    box-shadow: 0px 5px 15px 0px rgba(96, 110, 135, 1);
    position: absolute;
    pointer-events: none;
    top: -5px;
    left: -23px;
}

.blush-dropdown-wrapper {
    top: 381px;
    left: 117px;
    z-index: 22;
    position: absolute;
}

.blush-dropdown {
  position: relative; 
  display: inline-block;
  z-index: 22;
}

.blush-dropdown-toggle {
   padding: 0.5em 2.6em;
    background: rgb(var(--menu));
    border-radius: 50px;
    display: flex;
    border: none;
    width: 170px;
    gap: 6px;
    height: 27px;
    cursor: pointer;
    z-index: 2;
    position: relative;
    align-items: flex-end;
    color: rgb(var(--text-color-secondary), .7);
    font: var(--fw800) var(--fs12) var(--font-cat-title);
    transition: var(--anim-hover);
}

.blush-dropdown-toggle::before {
    content: '';
    display: block;
    position: relative;
    background: url(https://forumstatic.ru/files/001c/74/d2/85802.png);
    width: 23px;
    height: 20px;
    top: 2px;
    background-size: contain;
}


div.blush-dropdown.open .blush-dropdown-toggle {
background: rgb(var(--accent));
box-shadow: 0px 4px 8px 0px rgba(208, 126, 131, 0.6), 0px 2px 8px 0px rgba(255, 255, 255, 0.67) inset;
color: white;
}

.blush-dropdown-menu {
    position: absolute;
    bottom: 60%;
    left: 0;
    background: rgb(var(--quote-code));
    backdrop-filter: blur(4px);
    width: 170px;
    overflow: hidden;
    padding: 10px 0 20px;
    margin-bottom: -10px;
    border-radius: 15px 15px 0 0;
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.1);
    clip-path: inset(100% 0 0 0);
    opacity: 0;
    pointer-events: none;
    transition: clip-path 0.4s ease, opacity 0.3s ease;
    z-index: 1;
    align-items: center;

}

.blush-dropdown-menu a {
    width: 154px;
    height: 24px;
    text-align: center;
    color: rgb(var(--text-color-secondary)) !important;
    background: rgb(var(--light-accent), .4);
    border-radius: var(--bradius-major);
    box-sizing: border-box;
    padding-top: 5px;
    transition: background 0.3s ease, color 0.3s ease-in-out;
    font: var(--fw400) var(--fs12) var(--font-third);
}

.blush-dropdown-menu a:hover {
    background: rgb(var(--light-accent), 1);
}

.blush-dropdown.open .blush-dropdown-menu a {
}

.blush-dropdown.open .blush-dropdown-menu {
  clip-path: inset(0 0 0 0);
  opacity: 1;
  pointer-events: all;
}



.blushnews {
    position: absolute;
    top: 365px;
    left: 307px;
    width: 717px;
    z-index: 25;
}

.blushnews > div {
    display: flex;
    justify-content: center;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 10px 10px 0;
    box-sizing: border-box;
  white-space: nowrap;
  scroll-behavior: smooth;
}

.blushnews > div::-webkit-scrollbar {
  width: 2px;
  height: 2px;

}

.blushnews > div > div { 
height: 46px;
    flex-shrink: 0;
}

.blushnews > div > div > a {
    display: grid; 
    grid-template-columns: 51px 1fr;
    height: 39px;
    position: relative;
    align-items: center;
    background: rgb(var(--menu));
    border-radius: 5px;
    transition: var(--anim-hover);
}



.blushnews > div > div > a > date {
    display: block;
    grid-row: span 2;
    font: var(--fw800) var(--fs12) var(--font-cat-title);
    color: rgb(var(--accent));
    padding: 3px 10px 0 8px;
}

.blushnews > div > div > a > l1 {
    font: var(--fw700) var(--fs10) var(--font-third);
    color: rgb(var(--text-color-secondary), .6);
    padding-right: 8px;
    align-self: end;
}

.blushnews > div > div > a > l2 {
    font: var(--fw400) var(--fs10) var(--font-third);
    color: rgb(var(--text-color-secondary), .6);
    padding-right: 8px;
    align-self: start;
}

.blushnews > div > div:hover > a {
transform: translateY(-8px); 
box-shadow: var(--box-shadow-news);
    background: rgb(var(--quote-code));
}

@media screen and (orientation: portrait) {
  .changecase-button {
    display: none
  }
}

0

26

верх
Код:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" />

<!-- патчик к смене стиля -->
<script>
	(function () {
    try {
    	const theme = localStorage.getItem('selectedTheme');
    	if (theme === 'dark' || theme === 'light' || theme === 'gray') {
        document.documentElement.classList.add(theme);
    	}
    } catch (e) {
    }
	})();
</script>

<!-- Смена стиля v1.1 © max, the murderer! -->
<script type="text/javascript">
	$(document).ready(function () {
    const themes = ['light', 'dark', 'gray'];

    if (!$('#theme-overlay').length) {
    	$('body').prepend('<div id="theme-overlay"></div>');
    }

    const $overlay = $('#theme-overlay');

    function setTheme(theme) {
    	$overlay.css('opacity', '1');

    	setTimeout(() => {
        $('html').removeClass(themes.join(' ')).addClass(theme);
        localStorage.setItem('selectedTheme', theme);

        setTimeout(() => {
        	$overlay.css('opacity', '0');
        }, 50);
    	}, 200);
    }

    let savedTheme = localStorage.getItem('selectedTheme') || 'light';
    $('html').addClass(savedTheme);

    $('#theme-toggle').on('click', function () {
    	let currentIndex = themes.indexOf(savedTheme);
    	let newIndex = (currentIndex + 1) % themes.length;
    	let newTheme = themes[newIndex];
    	setTheme(newTheme);
    	savedTheme = newTheme;
    });
	});
</script>


<!--------------------- Выделение кода в блоке "Код" © Alex_63 --------------------->
<script type="text/javascript" src="https://forumstatic.ru/files/0015/c4/3f/26102.js"></script>
<script>eval(select_text.toString().replace(/\}$/, 'try{document.execCommand("copy")}catch(e){}}'))</script>
<script type="text/javascript">select_text.linkText = 'выделить код [копируется сразу]'</script>


<!----------------- кнопки для копирования кода в сообщение by Vandra ----------------->
<script>
	let buttonTitle = "Скопировать в форму ответа"; // можно изменить название
</script>
<script type="text/javascript" src="https://forumstatic.ru/files/001c/04/0a/39299.js"></script>


<!----------------- кнопки для копирования кода в сообщение by Vandra ----------------->
<script type="text/javascript" src="https://forumstatic.ru/files/001c/17/76/53217.js"></script>



<!-- Всплывающее окно с информацией ч.1 © sadhaka -->
<script src="https://forumstatic.ru/files/0011/e9/e1/56920.js" type="text/javascript"></script>

<!-- HTML в постах с допуском по группам © Alex_63 -->
<script type="text/javascript" src="https://forumstatic.ru/files/0015/c4/3f/52361.js"></script>
<script type="text/javascript">
	HTMLinPost.groups = [1, 2, 4]; // Группы, допущенные к вставке HTML в посты
	HTMLinPost.noAccess = ['user', 'newTst2']; // Пользователи с запретом вставки HTML в посты
	HTMLinPost.parseHTMLinPosts()
</script>



<!-- Смена аватара в топике (в HTML верх) © Deff, Alex_63 -->
<link rel="stylesheet" type="text/css" href="http://forumstatic.ru/files/0015/c4/3f/67168.css" />
<script type="text/javascript" src="http://forumstatic.ru/files/0015/c4/3f/67169.js"></script>
<!-- конец -->



<!--Скрытие профиля в теме тегом-->
<style type="text/css">
	.hideprofile .post-author,
	.hideprofile .pl-email,
	.hideprofile .pl-website {
    display: none !important
	}

	.hideprofile .post-body,
	.hideprofile .post-links,
	.hideprofile .post-links ul {
    margin-left: 0px !important;
	}
</style>
<script>
	FORUM.set('editor.addition.tags.hideprofile', { name: 'Скрыть минипрофиль', onclick: function () { insert('[hideprofile]'); } });
	$().pun_mainReady(function () { $('.post:contains("[hideprofile]")').addClass('hideprofile').html(function () { return $(this).html().replace(/\[hideprofile\]/gim, '') }) });
</script>


<!---------------------- МАСКА ОТ ШАМАНА ----------------------->
<script src="https://forumstatic.ru/files/0017/95/29/96214.js"></script>
<script>
	hvScriptSet.addMask({
    guestAccess: ['archive', 'data log', 'alternate route', 'core storage'],
    forumAccessExtended: {
    	'Data log': ['Пользователи'],
    	'Alternate route': ['Пользователи'],
    	'Core storage': ['Пользователи', 'Гость'],
    	'Public chatroom': ['Пользователи'],
    	'Unfinished business': ['Пользователи', 'Гость'],
    	'Community network': ['Пользователи'],
    	'DATA LOG': ['Пользователи']
    },
    changeList: {
    	'pafld1': {
        title: 'ЛЗ',
        description: 'личное звание',
        tag: 'lz',
        class: 'pa-fld1',
        defaultCode: '<div>Имя Фамилия, 00</div> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vulputate mauris at metus tristique, egestas posuere tortor porta. Nulla facilisi. Nunc scelerisque elementum sem porta euismod.',
        type: 'html'
    	}
    }
	});
</script>
<!---------------------- Маска конец ----------------------->


<!-- Подсчет символов в постах игры -->
<style>
	.send-sumb {
    margin: 28px 0 12px;
    padding: 2px 7px;
    float: right;
    color: #800;
    min-width: 25px;
    cursor: pointer;
    border: 1px solid;
	}

	.post.topicpost .send-sumb {
    display: none
	}
</style>
<script type="text/javascript">
	if ([1, 2, 3, 4, 6, 7, 16].indexOf(+FORUM.topic.forum_id) != -1) {//id Нужных форумов для подсчета
    document.write('<script type="text/javascript" data="137pj" src="//forumstatic.ru/files/001b/93/2e/18162.js?"><\/script>')
	}
	$(function () {
    $(".post-content .send-sumb").each(function () {
    	$(this).attr("title", $(this).attr("original-title"))
    	.removeAttr("original-title")
    })
	});
</script>
<!-- конец -->


<!---------------------------- пиар-вход ---------------------------->
<script src="https://forumstatic.ru/files/0015/c4/3f/26781.js"></script>
<script type="text/javascript">
	PR.nick = 'Gonzo'; //Ник PR-аккаунта
	PR.pass = '0000'; //Пароль PR-аккаунта
	PR.btn_text = 'pr'; //Надпись на кнопке PR-входа(или ссылка на картинку);
	PR.set();</script>
<script type="text/javascript">
	PR.nick = 'AV Tours'; //Ник читателя
	PR.pass = '1111'; //Пароль читателя
	PR.btn_text = 'Читать'; //Надпись на кнопке читателя;
	PR.set();</script>

<!-- font ico -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
	integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
	crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- END. font ico -->

<!-- post setting -->
<script src="//forumstatic.ru/files/001c/6f/83/90859.js?2"></script>
<link rel="stylesheet" href="//forumstatic.ru/files/001c/6f/83/13151.css?v=9">

<script>
	const mode = 'false';
	setChangeFont(mode);
</script>
<!-- END. post setting -->

<script>RusffCore.sets.show_reportBtn = 0;</script>


<!-- Тег [block] в форме ответа © max, the murderer! -->
<script type="text/javascript">
	if (GroupID <= 2) {
    FORUM.set('editor.addition.tags.block', {
    	name: 'Кастомный блок',
    	class_name: function () {
        return prompt("Введите класс", "myclass")
    	},
    	onclick: function () {
        var blockClass;
        (blockClass = FORUM.get('editor.addition.tags.block.class_name()')) ? bbcode('[block=' + blockClass + ']', '[/block]') : bbcode('')
    	}
    })
	}
</script>
низ
Код:
<!--------------- БАННЕРЫ  ---------------------------------------------------->

<banners><div>

<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>
<a href='#'> <img src='https://forumstatic.ru/files/001c/74/d2/60467.svg' /> </a>



</div></banners>



<style> 
.changecase-button {
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 9999;
  padding: 10px;
  background: black;
  color: white;
  border-radius: 5px;
  cursor: pointer;
  font-size: 16px;
  user-select: none;
}

</style>

<div class="changecase-button">Aa</div>

<!-- кнопка переключения капса на обычный шрифт by Vandra -->
<script type="text/javascript" src="https://forumstatic.ru/files/001c/17/73/32442.js"></script>


<!-- примерочная by Vandra -->
<script type="text/javascript" src="https://forumstatic.ru/files/001c/74/d2/51485.js"></script>


<!-- замена стандартных слов -->
<script>
function UniverСhange(selektor,changed,substitute){
$(selektor).each(function(){if ($(this).parent().html()!=null){if($(this).parent().html().indexOf(changed)!=-1){
$(this).parent().html($(this).parent().html().replace(changed,substitute));};};});}
UniverСhange("#pun-stats .item2","Зарегистрированных пользователей:","пользователей:");
UniverСhange("#pun-stats .item3","Зарегистрированных пользователей:","пользователей:");
// UniverСhange("#pun-stats .item4","Последним зарегистрировался:","новорег:"); 
UniverСhange("#pun-stats .item5","Активны","<b>онлайн:</b>");
UniverСhange("#pun-stats .item5","Посетили за сутки","<b>Проходили мимо:</b>");
// UniverСhange("span.item1","Привет,","Добро пожаловать,<br>");
UniverСhange("span.item1",".","!");
 //На следующей строке можно добавить еще запрос
</script>
<!-- замена стандартных слов -->

<!-- Мгновенный предпросмотр сообщения © Alex_63 -->
    <script type="text/javascript">
    var PPREV = {};
    PPREV.position = 0; //Положение окна Предпросмотра: 0 - над полем ввода, 1 - под полем ввода, 2 - справа
    PPREV.quote_cite = 'написал(а):'; //Надпись в окне цитаты
    </script>
    <script type="text/javascript" src="https://forumstatic.ru/files/0015/c4/3f/10524.js"></script>

   <!-- Кнопка отключения мгновенного предпросмотра -->
    <style>#togglePreview{margin-top: 0px;}</style>
    <script type="text/javascript">(function (){
      var a='Включить быстрый предпросмотр';
      var b='Отключить быстрый предпросмотр';
      var d='_PreviewToggle';
      setCookiePPrev=function(a,b,c){if(c){var d=new Date();d.setTime(d.getTime()+c);}if(a && b)document.cookie=a+'='+b+(c ? '; expires='+d.toUTCString() : '');else return false;}
      getCookiePPrev=function(a){var b=new RegExp(a+'=([^;]){1,}');var c=b.exec(document.cookie);if(c)c=c[0].split('=');else return false;return c[1] ? c[1] : false;}
      $('<small id="togglePreview"><input type="button" class="button" value="'+ b +'" onclick="togglePreview(this)"/></small>').insertAfter('#post fieldset:last legend');
      var x = ParseContent;
      window.togglePreview = function(sel){//alert(sel.value);
        if(sel.value==a){sel.value=b;setCookiePPrev(d,'0',-1000);ParseContent=x;ParseContent();$('#post-preview').show(); return}
        if(sel.value==b){sel.value=a;setCookiePPrev(d,'OFF',30*3600*24*30*1000);if($('#pun-viewtopic').length){$('#post-preview').hide()}ParseContent=function(){return};return}
      }; if(getCookiePPrev(d)=='OFF'){$('#togglePreview>.button').click()};
    }())
    </script>

<!------------- переключатель меню в шапке -------------------------------------------------------------------------->
<script>
document.querySelector('.blush-dropdown-toggle').addEventListener('click', () => {
  document.querySelector('.blush-dropdown').classList.toggle('open');
});
</script>

<!-- Объявление по центру и с прокруткой by Vandra -->
<script>
document.addEventListener("DOMContentLoaded", () => {
    const c = document.querySelector('.blushnews div');
    c.classList.toggle('overflown', c.scrollWidth > c.clientWidth);
});
</script>



<!--------------- Дополнительные шрифты по категориям by Vandra ----------------->
<script>
(function() {
    if (!$('#pun-viewtopic,#pun-post,#pun-edit,#pun-poll,#pun-messages').length) return;
    const fontContainer = document.getElementById("font-area");
    if (!fontContainer) return;
    const fontCategories = {
        "Латиница": [
           "Boldonse", "Abril Fatface", "Satisfy", "Oleo Script", "Bodoni Moda", "Readex Pro", "Zeyada", "Staatliches", "Antonio", "League Gothic", "Anton SC"
        ],
        "Кириллица": [
            "Unbounded", "Playfair Display", "Dela Gothic One", "Caveat", "Ponomar", "Amatic SC", "Alumni Sans", "Noto Serif Display", "Comforter Brush", "Oswald", "Montserrat", "Raleway", "Great Vibes", "Russo One", "Dela Gothic One", "Yeseva One", "Poiret One", "Viaoda Libre"
        ]
    };
    function createCategory(title, fonts) {
        const categoryTitle = document.createElement("div");
        categoryTitle.className = "font-category-title";
        categoryTitle.textContent = title;
        const categoryWrapper = document.createElement("div");
        categoryWrapper.className = "font-category";
        fonts.forEach(font => {
            const fontItem = document.createElement("div");
            fontItem.className = "font-item";
            fontItem.dataset.font = font;
            fontItem.innerHTML = `
                <span class="font-name" style="font-family: '${font}';">${font}</span>
                <img class="font-btn" src="/i/blank.gif" />
            `;
            categoryWrapper.appendChild(fontItem);
        });
        const firstChild = fontContainer.firstChild;
        if (firstChild) {
            fontContainer.insertBefore(categoryWrapper, firstChild);
            fontContainer.insertBefore(categoryTitle, categoryWrapper);
        } else {
            fontContainer.appendChild(categoryTitle);
            fontContainer.appendChild(categoryWrapper);
        }
    }
    for (const [category, fonts] of Object.entries(fontCategories)) {
        createCategory(category, fonts);
    }
const defaultTitle = document.createElement("div");
defaultTitle.className = "font-category-title";
defaultTitle.textContent = "дефолтные";
const firstDivWithoutClassOrId = fontContainer.querySelector('div:not([class]):not([id])');
if (firstDivWithoutClassOrId) {
    fontContainer.insertBefore(defaultTitle, firstDivWithoutClassOrId);  
} else {
    fontContainer.appendChild(defaultTitle);  
}
    fontContainer.addEventListener("click", function(event) {
        let target = event.target.closest(".font-item");
        if (target) {
            let font = target.dataset.font;
            bbcode(`[font=${font.includes(' ') ? `'${font}'` : font}]`, `[/font]`);
        }
    });
})();
</script>



<!-- Снять автоматическую галочку удаления всех сообщений © Duka -->
<script type="text/javascript">
if (document.getElementById('pun-deleteuser')) {
    document.querySelector('input[name=delete_posts]').checked = false;
}
</script>


<!------------ быстрое редактирование личной страницы by Vandra ------------->

<script>
let plaqueField = 'li.pa-fld5';
let forumLinkPl = 'https://testvandra3.rusff.me';
</script>
<script type="text/javascript" src="https://forumstatic.ru/files/001c/04/0a/95884.js"></script>


<!-- кнопка редактирования лз для админов / © hagalnaud&nothingale -->
 <script type="text/javascript">
var posts = $(".post");
posts.each(function() {
  var senderId = $(this).data("user-id");
  var editLink = $("<a>").attr("href", "/profile.php?section=fields&id=" + senderId).attr("rel", "nofollow").text("Смена ЛЗ");
  var editLi = $("<li>").addClass("editpole").append(editLink);
  $(this).find(".pl-email.pm").after(editLi);
});</script>
<style>li.editpole {display: none!important; float: left;}
.isadmin li.editpole {display: inline-flex!important;}
</style>


<!---------- Разделение тем: "Важные темы" и "Темы форума" // © Alex_63 ---------->
<script type="text/javascript">if($('#pun-viewforum').length){$('tr[class$="isticky"]:first').before('<tr class="tr-divider imp"><td class="td-divider" colspan="4">Важные темы</td></tr>');$('tr[class$="isticky"]:last').next('tr').before('<tr class="tr-divider st"><td class="td-divider" colspan="4">Темы форума</td></tr>')}</script>

<script> 
function openModal(imgSrc) {
    const $vfModal = $('<div>', { class: 'vf-modal' });
    const $img = $('<img>', { src: imgSrc });
    $vfModal.append($img);
    $('body').append($vfModal);
    $vfModal.css('display', 'block');

    $vfModal.on('click', function () {
        $vfModal.remove();
    });
}

$(document).on('click', '.photo-viewer img', function () {
    openModal($(this).attr('src'));
});
</script>

<!------------- Обтекание изображения 2.4.4 © Romych, мод. max, the murderer! ------------->
<div id="float"><strong>направление обтекания</strong><span class="vibor" title="слева" onclick="bbcode('[float=left]', '[/float]')"><i class="fa-solid fa-indent"></i></span><span class="vibor" title="справа" onclick="bbcode('[float=right]', '[/float]')"><i style="transform: scaleX(-1)" class="fa-solid fa-indent"></i></span></div>
<script language="javascript">
$(function(){
$('td#button-link').before('<td id="button-float" title="Обтекание"></td>');
$('#button-float, .vibor').click(function(){
$('div#float').toggle();});
  });
elm=document.getElementsByTagName("div")
for(x in elm) if(elm[x].className=="post-content") 
{
post = elm[x].innerHTML;
if(post.indexOf("[/float]") != -1) {
floats = /\[float=(.*?)\]([^\[]{1,11000})\[\/float\]/gi
elm[x].innerHTML = elm[x].innerHTML.replace(floats, "<span style='float: $1; margin: 15px; text-align: $1;'>$2</span>")
}};
$('#float').insertBefore('#button-link');
</script>


<!-- Удаляем лишние строки после цитаты и кода // v.3 © Alex_63 -->
    <script type="text/javascript">
    $('.post-content').each(function() {
        var CNT = $(this).html();
        CNT = CNT.replace(/<p><br><\/p>/img,'');
        CNT = CNT.replace(/<p><br><br>(.*?)<\/p>/img,'<p>$1</p>');
        CNT = CNT.replace(/<p><br>(.*?)<\/p>/img,'<p>$1</p>');
        $(this).html(CNT);
    });
    </script>
<!-- Удаляем лишние строки после цитаты и кода -------------> 
<script>
document.addEventListener("DOMContentLoaded", function () {
    const MAX_HEIGHT = 500;
    const CHECK_INTERVAL = 200;
    const CHECK_DURATION = 4000;
    const adjustHeights = () => {
        document.querySelectorAll('.code-box .scrollbox').forEach(scrollbox => {
            const pre = scrollbox.querySelector('pre');
            if (pre) {
                const contentHeight = pre.scrollHeight;
                const finalHeight = Math.min(contentHeight + 8, MAX_HEIGHT);
                scrollbox.style.height = finalHeight + "px";
            }
        });
    };
    adjustHeights();
    let elapsed = 0;
    const interval = setInterval(() => {
        adjustHeights();
        elapsed += CHECK_INTERVAL;
        if (elapsed >= CHECK_DURATION) clearInterval(interval);
    }, CHECK_INTERVAL);
});
</script>


<!-- запятая после ника -->
<script type="text/javascript">
function to(username)
{insert('[b]' + username + '[/b]' + ', ');}
</script>


<!-- Разделение ников пользователей в теме запятой -->
<script>$('#topic-users-in a').prev('a').after(',');</script>
<!--конец-->


<!-- аватар для гостя и по умолчанию --------------------------------------------------------------->
<script type="text/javascript">
var DefAvtr="https://upforme.ru/uploads/001c/71/74/2/713895.png"; //Для Игрока
var GuestAvtr="https://upforme.ru/uploads/001c/71/74/2/713895.png";//Для Гостя
$("li.pa-author").each(function(){
var b = DefAvtr;if($(this).text()=='Гость')b = GuestAvtr;
var s='<li class="pa-avatar item2"><img class="defavtr" src="'+b+'" alt="Аватар"/></li>';
if (($(this).parents(".post-author").find("li.pa-avatar").length)==0){$(this).after(s);};});
</script>


<!-- стрелки вверх-вниз ------------------------------------------------------------------------------>
<div class="go-up" id='ToTop'></div>
<div class="go-down" id='OnBottom'></div>
<script type="text/javascript">
$(function(){
if ($(window).scrollTop()>="250") $("#ToTop").fadeIn("slow")
$(window).scroll(function(){
  if ($(window).scrollTop()<="250") $("#ToTop").fadeOut("slow")
  else $("#ToTop").fadeIn("slow")
});
if ($(window).scrollTop()<=$(document).height()-"999") $("#OnBottom").fadeIn("slow")
$(window).scroll(function(){
  if ($(window).scrollTop()>=$(document).height()-"999") $("#OnBottom").fadeOut("slow")
  else $("#OnBottom").fadeIn("slow")
});
$("#ToTop").click(function(){$("html,body").animate({scrollTop:0},"slow")})
$("#OnBottom").click(function(){$("html,body").animate({scrollTop:$(document).height()},"slow")})
});</script> 


<!-- Ссылка на новые сообщения -->
<script type="text/javascript">
$('#pun-ulinks ul').prepend('<li class="item1"><a href="/search.php?action=show_new">Новые сообщения</a></li>');
</script>


<!-- Исключение из "Цитировать" подписи и "отредактировано" © Deff -->
<script type="text/javascript"> (function(){    var p =[];
  $('.post').find('.pl-quote').click(function(){
    p[0] = $(this).parents('.post').find('.lastedit');
    p[1] = $(this).parents('.post').find('.post-sig');
    p[2] = p[0].html();p[3] = p[1].html();
    p[0].html('');p[1].html('');
    setTimeout(function(){p[0].html(p[2]);p[1].html(p[3])},600);});
}());
</script>

<!-- Кликабельность ника в постах Гостя --><script>$(".post[data-group-id=3]").find(".pa-author").html(function(){return this.innerHTML.replace(/(<.+>)(.+)$/,'$1<a href="javascript:to(\'$2\')">$2</a>')});</script>
<!--Конец -->

<!-- ТЕГ абзаца - [indent] © Deff -->
<style>#button-indent {background:transparent;}</style>
<script type="text/javascript">(function(){ var b = '[indent]';
$("#button-strike").after('<td id="button-indent" title="Отступы"><img src="/i/blank.gif"  onclick="smile(\''+b+'\')"></td>');
var indent = '<span style="display:inline-block;margin:1em 2.1em;"></span>'; /*удвоенные Отступы сверху и слево*/
$('.post-content p:contains("'+b+'")').each(function(){ $(this).html( $(this).html().replace(/\[indent\]/gm,indent));});}());
</script>


<!-- Замена дефисов на тире © Deff -->
<script>$('.post-content p').html(function(){return this.innerHTML.replace(/(\s|&nbsp;)?-(\s|&nbsp;)/g,'$1&mdash;$2')})</script>


<!--Всплывающие Подсказки при наведении-->
<script type="text/javascript" src="https://forumstatic.ru/files/0015/c4/3f/26671.js"></script>
<!--//End//-Всплывающие Подсказки при наведении-->


<!-------------------- личная страница ---------------------------------->

<div id="character" class="reveal-modal xlarge main container">
<div class='modal_wrap'></div>
<a class="close-reveal-modal">×</a>
</div>

<!-- фиксированное окно, плавный выезд, доработано Vandra --> 
<script type="text/javascript">
$(document).ready(function () {
    $(".modal-link").click(function (e) {
        e.preventDefault();
        var modId = $(this).attr('id');
        $('.modal_wrap').html('');
        $.get('pages/' + modId, function (data) {
            $('.modal_wrap').html($(data).find('.character').html());
            $('.pp-profile > a').after('<a class="edit-page" href="/admin_pages.php?edit_page='+modId+'" title="Редактировать страницу"></a>');
            let modal = $("#character");
            modal.removeClass("open").css({ 
                "top": "-100vh", 
                "visibility": "hidden", 
                "transition": "none"
            });
            setTimeout(() => {
                modal.css("visibility", "visible"); 
                modal.css("transition", "top 0.4s ease"); 
                modal.addClass("open"); 
            }, 50);
        });
    });
    $(document).on("click", ".close-reveal-modal", function () {
        let modal = $("#character");
        modal.css("top", "-100vh");
        setTimeout(() => {
            modal.removeClass("open").css({ "visibility": "hidden", "transition": "none" }); 
        }, 400);
    });
});
</script>

<script> 
$(document).ready(function () {
    const $statsContainer = $("#pun-stats ul.container");
    const $itemsStats = $statsContainer.find("li.item1, li.item2, li.item3, li.item4");
    if (!$statsContainer.length || !$itemsStats.length) return;
    const $targetCrumb = $("<li>", { class: "stats-crumbs" }).append($itemsStats);
    $statsContainer.prepend($targetCrumb);
});
</script>

<!-- горизонтальный скролл для указанных контейнеров by Vandra  -->
<script>
function applyHorizontalScroll(containers) {
    $(containers.join(", ")).each(function () {
        if (!this.dataset.scrollApplied) { 
            this.addEventListener("wheel", function (e) {
                e.preventDefault();
                  this.scrollLeft += e.deltaY * (navigator.platform.includes('Mac') ? 12 : 6);
            }, { passive: false }); 
            this.dataset.scrollApplied = "true";
        }
    });
}
$(document).ready(function () {
    const containers = ["ppcoupons div", ".blushnews div", "cardscollect div", "pptwinks", "banners div"];
    applyHorizontalScroll(containers);
    const scrollObserver = new MutationObserver(() => applyHorizontalScroll(containers));
    scrollObserver.observe(document.body, { childList: true, subtree: true });
});

</script>


<!-- текстовые поля вместо строк для ввода в профиле by Vandra  -->
<script>
document.addEventListener("DOMContentLoaded", function () {
    const profileContainer = document.getElementById("profile8");
    if (!profileContainer) return; 
    const profInputs = profileContainer.querySelectorAll("#fld2, #fld3, #fld4, #fld5");
    profInputs.forEach(profInput => {
        const profTextarea = document.createElement("textarea");
        for (let { name, value } of profInput.attributes) {
            profTextarea.setAttribute(name, value);
        }
        profTextarea.value = profInput.value;
        profInput.replaceWith(profTextarea);
    });
});
</script>

<!-- вкладки для ЛС без ID by Vandra  -->
<script>
function initTabs(container) {
    container.querySelectorAll(".vtabs-cont").forEach(tabContainer => {
        const buttons = tabContainer.querySelectorAll(".vtab-btn");
        const tabs = tabContainer.querySelectorAll(".vtab-content");

        if (!buttons.length || !tabs.length) return;
        if (tabContainer.dataset.tabsInitialized === "true") return;

        tabContainer.dataset.tabsInitialized = "true";

        function switchTab(index) {
            tabs.forEach(tab => tab.classList.remove("active"));
            buttons.forEach(btn => btn.classList.remove("active"));

            tabs[index].classList.add("active");
            buttons[index].classList.add("active");
        }

        buttons.forEach((button, index) => {
            button.addEventListener("click", () => switchTab(index));
        });

        switchTab(0);
    });
}

const observer = new MutationObserver(mutations => {
    mutations.forEach(mutation => {
        mutation.addedNodes.forEach(node => {
            if (node.nodeType !== 1) return;

            if (node.classList && node.classList.contains("vtabs-wrapper")) {
                initTabs(node);
            }

            const nestedWrappers = node.querySelectorAll?.(".vtabs-wrapper");
            nestedWrappers?.forEach(wrapper => {
                initTabs(wrapper);
            });
        });
    });
});

observer.observe(document.body, { childList: true, subtree: true });

document.querySelectorAll(".vtabs-wrapper").forEach(initTabs);
</script>

<!-- Запрет редактировать свой профиль определённой группе © rps -->
<style type="text/css">#pun-profile input, #pun-changepass input, #pun-upavatar input { display: none }</style>
<script type="text/javascript">
function disabled_profile(g_id) {
 $('input').show();
 if( GroupID == g_id )
 {
  $('input[type=submit]').attr('disabled', true);
  var text = $('.formsubmit').html().replace(/После обновления профиля, вы будете перенаправлены назад на эту страницу./, "<span style='color: red;'>Администратор форума запретил Вам изменять профиль.</span>");
  $('.formsubmit').html(text);
 }
}
 
if (document.URL.indexOf("profile.php") != -1)
disabled_profile("5");
</script>

<!-- Всплывающее окно цитирования © kozhilya, Deff -->
<div id="Bubble" style="margin-left:-20px;margin-top:-12px;display:none;position:absolute;z-index:100000"><span></span></div><script>function PopUpPL_Quote(){var fresh=false,SSsq='<div></div>';$("#Bubble").prependTo("body");$('.post[id]').mouseup(function(pos){if((window.getSelection&&!getSelection().isCollapsed)&&!(fresh)){$("#Bubble").css({'left': (pos.pageX+5)+'px', 'top':(pos.pageY+4)+'px', 'display': 'none' });$("#Bubble span").html('<a href="javascript:$(\'#p'+$(this).attr('id').substr(1)+' .pl-quote a\').click();'+$(this).find("li.pl-quote a:first").attr("href")+';void(0)">'+SSsq+'</a>');$("#Bubble").fadeIn(200);fresh=true}else if(fresh){fresh=false}});$('#Bubble span').click(function(){$('#Bubble').hide(200);fresh=false});$('.post').mousedown(function(){if(fresh){$("#Bubble:visible").hide(200);fresh=false}});}
if($("#pun-viewtopic").length){PopUpPL_Quote()}
</script>

<!-- Быстроплюсы v.2 by Deff -->
<script type="text/javascript" src="https://forumstatic.ru/files/0012/d8/04/58219.js" addComment="1"></script>

<!---- перенос кнопки быстрого редактирования в кнопки формы ответа ------------------>
<script>
$(function () {
    var $toggle = $('#togglePreview');
    var $target = $('.formsubmit');
    if ($toggle.length && $target.length) {
        $toggle.appendTo($target);
    }
});
</script>

<!-- Возможность скопировать последний пост при переполнении темы -->
<script>
$(document).ready(function() {
  $('#pun-viewtopic #pun-main > h2')
    .append('<div style="opacity: 0;position: absolute;bottom: 210px;right: 60px;width: 10px;height: 10px;"><textarea id="reserved_post">' + localStorage.ReservePost + '</textarea></div>');
  $('#pun-viewtopic #pun-main > h2')
    .append('<div id="reserve_post">Если вы потеряли свой пост из-за этого, нажмите на этот текст — отправленный пост будет скопирован в буфер обмена.</div>');
  $('#reserve_post').on('click', function () {
    var post = document.getElementById('reserved_post');
    post.select();
    document.execCommand('copy');
  });
});
</script>

<!-- Переключение раскладки выделенного текста © Deff -->
<style>#button-transL{background-image:url(https://upforme.ru/uploads/000f/09/5e/6201/44477.png)}</style>
<script type="text/javascript">S='<img src="https://forum.mybb.ru/i/blank.gif" title="Lat↔ Русс" onclick="bbcode(\'[Lat-Rus]\',\'[/Rus-Lat]\');LatRus();"/>';
$("#button-font").after('<td id=button-transL>'+S+'</td>');var TxtTrans1='lat';
function LatRus(){if(TxtTrans1=='lat'){TxtTrans1='rus'}else{TxtTrans1='lat'};
lat0='qwertyuiopasdfghjkl;\'zxcvbnm\,QWERTYUIOP{}ASDFGHJKL:"ZXCVBNM<>`~[].'.split('');
lat='qwertyuiopasdfghjkl;\'zxcvbnm\,QWERTYUIOP{}ASDFGHJKL:"ZXCVBNM<>`~'.split('');
lat.push('\\[');lat.push('\\]');lat.push('\\.');
rus=('йцукенгшщзфывапролджэячсмитьбЙЦУКЕНГШЩЗХЪФЫВАПРОЛДЖЭЯЧСМИТЬБЮёЁхъю').split('');
function transF(p){ar1=lat;ar2=rus;if(TxtTrans1=='lat'){ar2=lat0;ar1=rus}for(var i=0; i<ar1.length; i++){trans='/'+ar1[i]+'/g';p=p.replace(eval(trans), ar2[i])}return p;}L=$('#main-reply').val();L=L.replace(/\[Lat-Rus\]([\s\S]*)\[\/Rus-Lat\]/mg,function(a,b,c){return transF(b);});$('#main-reply').val(L);}
</script>

<!-- Вставить картинку © Deff -->
<script>
var oldIMG="<td id=\"button-image\" title=\"Изображение2\"><img onclick=\"bbcode('[img]','[/img]')\" src=\"/i/blank.gif\"/><b><p style=\"z-index:20;position:absolute;height14px;margin:-15px 0 0 22px;\">2</p></b></td>"
$("#button-image").after(oldIMG);
</script>

<!-- Восстановление последнего поста при утере by Человек-Шаман -->
<script>
$(document).ready(function() {
  $('#addition-area').append(function() {
    return $('<div>Восстановить последний пост</div>').click(restoreLastPost);
  });
  function restoreLastPost() {
    $('#main-reply').val(localStorage.ReservePost);
  };
});
</script>
<!--конец-->

<!-- Счётчик символов в форме ответа © Deff -->
<script>var a,L,epl=$("#main-reply"),str='<small id="plng" style="background: rgb(var(--canvas-secondary)); padding: 3px 10px; border-radius: 4px; margin: 0 20px 0 0px; color: rgba(var(--text-primary)); opacity: .6;">Написано символов: <b>00</b> </small>';epl.parents("fieldset").find("legend").prepend(str);function epl3(){a=epl.val().length;if(a>9){L=''}else{L='0'};$("#plng b").text(L+a)};epl3();$(".pl-quote").click(function (){setTimeout('epl3()',100)});epl.bind('mouseout mousemove keydown keypress keyup',function(e){epl3()});</script>
объява
Код:
<!------ НОВОСТИ ---------------------------------------------------------------->

<section class='blushnews'><div>


<!------ блочок новостей ---------------------------------->
<div><a href='#'>
<date>17.04</date>

<l1> об устройстве мира </l1>
<l2> об устройстве мира </l2>

</a></div>

<!------ блочок новостей ---------------------------------->
<div><a href='#'>
<date>17.04</date>

<l1> об устройстве мира </l1>
<l2> об устройстве мира </l2>

</a></div>

<!------ блочок новостей ---------------------------------->
<div><a href='#'>
<date>17.04</date>

<l1> об устройстве мира </l1>
<l2> об устройстве мира </l2>

</a></div>

<!------ блочок новостей ---------------------------------->
<div><a href='#'>
<date>17.04</date>

<l1> об устройстве мира </l1>
<l2> об устройстве мира </l2>

</a></div>

<!------ блочок новостей ---------------------------------->
<div><a href='#'>
<date>17.04</date>

<l1> об устройстве мира </l1>
<l2> об устройстве мира </l2>

</a></div>




</div></section>


<!------ ПАРА ---------------------------------------------------------------->

<headcouple><div>

<a href='#'> name surname </a>
+
<a href='#'> name surname </a>

</div></headcouple>

<!------ ЭПИЗОД ---------------------------------------------------------------->

<headepisode><div>

<a href='#'> long title of the episode episode </a>

</div></headepisode>


<!------ АМС ---------------------------------------------------------------->

<headamt>
<a href='#'> user name</a>
<a href='#'> user name</a>
<a href='#'> user name</a>
<a href='#'> user name</a>
<a href='#'>user name </a>

</headamt>

<!------ Постописцы? ---------------------------------------------------------------->

<headpair data-title='posts'>

<a href='#'>maureen</a>

<a href='#'>maureen</a>

</headpair>


<!------ ПОСТ ---------------------------------------------------------------->

<headpost>

<a href='#'>maureen</a>

<span>
В дополнительной секции редактора появится кнопка "Шаблон", при нажатии на которую в форму ответа вставится тот шаблон, который вы введете ниже. Если добавите тег [cursor], то в это место будет установлен курсор пользователя.
</span>

</headpost>


<!------ Активисты? ---------------------------------------------------------------->

<headactive data-title='flood'>

<a href='#'>maureen</a>

<a href='#'>maureen</a>

</headactive>



<!------ ОПИСАНИЕ ---------------------------------------------------------------->
<headdesc>

real-life; usa: p+s

</headdesc>


<section class='blush-dropdown-wrapper'>
<div class="blush-dropdown">
  <button class="blush-dropdown-toggle">навигация</button>
  <div class="blush-dropdown-menu">
    <a href="#">гостевая</a>
    <a href="#">список персонажей</a>
    <a href="#">занятые внешности</a>
    <a href="#">пункт 1</a>
    <a href="#">пункт 2</a>
    <a href="#">пункт 3</a>
  </div>
</div>
</section>

<!-------- ПЕРЕКЛЮЧЕНИЕ ТЕМ ДИЗАЙНА -------------------------------------------------------------------->
<ul id="theme_switcher">
    <li title="Переключить тему">
        <button id="theme-toggle" class="theme-button"></button>
    </li>
</ul>
форма ответа
Код:
<!-- Взаимная реклама v1.2 © max, the murderer! -->
<script>
var groups = [1, 2, 4, 5]; // ID групп, которые видят кнопку

if (groups.includes(GroupID) && FORUM.get('topic.subject') && FORUM.get('topic.subject').match("Ваши листовки")) $(document).on('pun_main_ready pun_post', function() {
    $('.post').each(function() {        
        if ($(this).find('.pl-mutualPR').length) return;
        var link = $(this).find('h3 span > a.permalink').attr('href');
        link = '\n\n[url='+link+']Взаимная реклама[/url]';
        
        // Задаём шаблоны
        var template = [
            
            '[align=center][url=https://mayak.f-rpg.me/][img]https://upforme.ru/uploads/001b/ff/2a/4/483204.jpg[/img][/url][/align]' // последний элемент БЕЗ запятой

        ];
        
        template = template[Math.floor(Math.random() * template.length)];
        $(this).find('.post-links ul').append('<li class="pl-mutualPR"><a href="javascript://">Взаимная реклама</a></li>');
        $(this).find('.pl-mutualPR a').click(function() {
            var temp = $('<textarea>');
            $('body').append(temp);
            $(temp).val(template + link).select();
            document.execCommand('copy');
            $(temp).remove();
            $.jGrowl("Наш шаблон и ссылка на взаимную рекламу скопированы!");
        });
    });
    RusffCore.sets.show_reportBtn = 0; // Отключение кнопки "Пожаловаться" от Rusff (конфликтует)
});
</script>



<!--Стикеры-->
<script src="https://forumstatic.ru/files/001c/72/80/46301.js"></script>
<script>
$(document).ready(function() {
  hvStickerPack.init("https://forumstatic.ru/files/001c/71/74/43219.txt?v=6");
});
</script>
<!--Стикеры end-->

0

27

b

0

28

Whoopie написал(а):

rewwrfsdfsdf d sfsdfsd dfsdf dsdfsdf sd f

0


Вы здесь » Test » Гостевая книга » Хуехуехехе


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