/*************************************************************
A - SETUP
**************************************************************/

/* A1 Import the colour scheme
-------------------------------------------------------------*/

/* A1.1 */
 @import url(style_cs.1767970560.css);

@font-face {font-family: Gotham Pro; 
src: local("Gotham Pro"), url(https://forumstatic.ru/files/001c/0e/72/52107.ttf);}
@font-face {font-family: Gotham Pro Bold; 
src: local("Gotham Pro Bold"), url(https://forumstatic.ru/files/001c/0e/72/32989.ttf);}




@font-face {font-family: Font Awesome; 
src: local("Font Awesome"), url(https://forumstatic.ru/files/001b/ae/80/75483.otf);}
@font-face {font-family: Font Awesome; 
src: local("Font Awesome"), url(https://forumstatic.ru/files/001b/ae/80/89179.eot);}
@font-face {font-family: Font Awesome; 
src: local("Font Awesome"), url(https://forumstatic.ru/files/001b/ae/80/29031.ttf);}
@font-face {font-family: Font Awesome; 
src: local("Font Awesome"), url(https://forumstatic.ru/files/001b/ae/80/54865.woff);}
@font-face {font-family: Font Awesome; 
src: local("Font Awesome"), url(https://forumstatic.ru/files/001b/ae/80/66861.woff2);}



:root {
--fon1: url(https://upforme.ru/uploads/001c/9e/1a/6/630438.png) no-repeat top center;
--fon1-1: #121212;

--shapka: url(https://upforme.ru/uploads/001c/9e/1a/6/368862.png) no-repeat top center;
--white: #fff;

--textshadow: 0 0 1px #000;

--fon2-1: #e1e1e1;
--text: 222222;
--text2: #363636;

--fon3-1: #d5d5d5;

--trans: transparent;
--border2: 0px transparent;

--link1: #787878;
--link2: #fff;

--color1: #1b1b1b;
--color2: #c4c4c4;
--color3: #999999;

  --color-accent: #ad9ca9;


}

/* A2 Deal with browser defaults and wonkiness
-------------------------------------------------------------*/

/* A2.1 */
html, body {margin: 0; padding: 0}

/* 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%;
  }

/* 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: 11px;
}


/* A3.2 */
.punbb {
font-family: Gotham Pro, sans-serif!important;
}

/* A3.3 */
.punbb textarea, .punbb input, .punbb select, .punbb optgroup {
font: 1em verdana, arial, helvetica, sans-serif
}

/* A3.4 */
.punbb h1, .punbb h2, .punbb h3, .punbb h4, .punbb table, .punbb th {
font-size: 1em;
font-weight: normal;
}

/* A3.5 */
.punbb h1 span, .punbb legend span {
    font-size: 0px;
}

/* A3.6 */
.punbb pre {
  font: 11px/100% Gotham Pro;
}

/* A3.7 */
.punbb address, .punbb em {
font-style: normal
}

/* A3.8 */
.punbb .post-content em {
font-style: italic;
}


/* A3.9 */
.punbb .post-content em.bbuline {
  font-style: normal;
  text-decoration: underline;
  }

/* A3.10 */
.punbb a {
text-decoration: none;
}

/* A3.11 */
.punbb optgroup {
font-weight: normal;
}


/* A4 Float clearing and hidden items
-------------------------------------------------------------*/

/* A4.1 */
#pun:after,
.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 {
width : 1100px;
padding: 0px 0px 0px 0px;
margin: 80px auto 100px auto!important;
  float: center;
}


/* A5.2 */
.punbb {
  float: center;
  height: auto;
  padding-left: 50px;
width : 1080px;
  }

/* A5.3 */
#pun-redirect, #pun-maint {
  margin: 60px 20% 12px 20%;
  width: auto;
  float: none;
  }

/* A5.4 */
.punbb .section, .punbb .main {
  margin-bottom: 1em;
  }

/* A5.5 */
.punbb .category, .punbb .post {
  margin-top: 0.4em;
  }

/* A5.6 */
.punbb #pun-category1, .punbb .toppost, .punbb .topicpost {
  margin-top: 0;
  }

/* 5.7 */
#pun-post .topic {
  margin-top: 1em;
  }

/* A5.8 */
.punbb .section, .punbb .forum, .punbb .formal, .punbb .modmenu, .punbb .info,
.punbb .category, .punbb .post {
  border-style: none none solid none;
  border-width: 0px 0px 2px 0px;
  width:92%;
  }

/* A5.9 */
.punbb .container {
  border-style: solid;
  border-width: 1px;
  }

/* 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 1px 1px 0;
  }

.post-content abbr { text-decoration: underline!important;}


/*************************************************************
B - MAIN CONTENT - GENERAL
**************************************************************/

/* B1 Parsed Content, Signatures and Scroll Boxes
-------------------------------------------------------------*/

/* B1.1 */
.punbb .post-content {
  padding: 0;
  margin: 0;
  width: 100%;
  overflow: hidden;
  }

/* B1.2 */
.punbb .post-sig dt {
  display: block;
  }

/* B1.3 */
.punbb .post-content p {
  margin: 0;
  padding: 0 0 1em 0;
  line-height: 150%;
  }

/* B1.4 */
.punbb .post-content img {
  vertical-align: baseline
  }

/* B1.5 */
.punbb .post-content img.postimg {
  vertical-align: middle;
  }

/* B1.6 */
.punbb .post-content .blockcode, .punbb .post-content blockquote {
  width: 100%;
  overflow: hidden;
  }

/* B1.7 */
.punbb .post-content .scrollbox {
  width: 100%;
  overflow: auto;
  }

/* B1.8 */
.punbb .post-content .quote-box, .punbb .post-content .code-box {
  margin: 0.4em 1.8em 1.4em 1.8em;
  padding: 1em;
  border-style: solid;
  border-width: 1px;
  }

/* B1.9 */
.punbb .quote-box cite, .punbb .code-box strong.legend {
  display: block;
  padding-bottom: 0.7em;
  font-size: 1.1em;
  font-weight: bold;
  font-style: normal;
  margin: 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: 92%;
  font-size: 1.1em;
  height: 0;
  }

/* B3.2 */
.multipage {
  margin-top: 3em;
  }

/* B3.3 */
.linkst .pagelink {
  position: absolute;
  top: -2.3em;
  left: -2px;
  width: 200px;
  padding: 3px 0px 3px 0px;
  text-align: left;
  text-transform: lowercase;
  font-size: 10px;
color: var(--text2);
  }

/* B3.4 */
.linkst .postlink {
  position: absolute;
   top: -2.3em;
  right: 0em;
 width: 200px;
  padding: 3px 0px 3px 0px;
  text-align: right;
  text-transform: lowercase;
  font-size: 10px;
color: var(--text2);
  }

/* B3.5 */
.punbb .linksb {
  text-align: right;
  padding: 0.4em 1em 0.5em 1em;
  font-size: 1.1em;
  }

/* B3.6 */
.linksb .pagelink {
  top: -0em;
  margin-left: 0px!important;
  width: 200px;
  padding: 3px 0px 3px 0px;
  text-align: left;
  text-transform: lowercase;
  font-size: 10px;
color: var(--text2);
  }


/* B3.7 */
.linksb .postlink {
  float: right;
  margin-right:90px;
  width: 200px;
  padding: 3px 0px 3px 0px;
  text-align: right;
  text-transform: lowercase;
  font-size: 10px;
  margin-top: -5px;
color: var(--text2);
  }


/* B3.8 подписаться*/
.subscribelink {
  clear:both;
  font-size: 9px; margin-right: 90px;
  text-transform: lowercase;
color: var(--text2);
  }


/*************************************************************
C - MAIN CONTENT - SPECIFIC
**************************************************************/

/* C1 Form layout
-------------------------------------------------------------*/

/* C1.1 */
.punbb .formal .container {
  padding: 1.7em 2.3em 1.1em 2.3em;
  }

/* C1.2 */
.punbb .formsubmit {
  padding: 0 0 0 1.7em;
  margin: 1em 0 0 0;
  }

/* C1.3 */
.punbb .formsubmit input, .punbb .formsubmit a, .punbb .formsubmit span {
  margin: 0 0.6em 0 0
  }

/* C1.4 */
.punbb fieldset {
  border-style: solid;
  border-width: 1px;
  padding: 0 18px 0 18px;
  margin: 0 0 1em 0
  }

/* C1.5 */
.punbb fieldset legend {
  padding: 0;
  margin: 0 0 0 11px;
  font-size: 1.1em
  }

/* C1.6 */
.punbb fieldset legend span {
  padding: 0 5px;
  margin: 0 0 0 -15px;
  }

/* C1.7 */
.punbb fieldset fieldset {
  border-style: none;
  margin: 0;
  padding: 0 0 8px 0
  }

/* C1.8 */
.punbb .fs-box {
  padding: 1em 0 0.8em 0;
  }

/* C1.9 */
.punbb .fs-box p, .punbb .fs-box fieldset {
  padding: 0 0 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: center;
  width: 10%;
  }

/* C2.3 */
.punbb .main .tcr {
  overflow: hidden;
  text-align: left;
  width: 30%;
  }

/* C2.4 */
#pun-userlist .main .tcl,
#pun-searchtopics .main .tcl,
#pun-modviewforum .main .tcl {
  width: 40%
  }

/* C2.5 */
#pun-userlist .main .tc2,
#pun-searchtopics .main .tc2 {
  text-align: left;
  width: 20%;
  }

/* C2.6 */
#pun-debug table .tcl {
  width: 15%;
  white-space:normal;
  }

/* C2.7 */
#pun-debug .tcr {
  width: 90%;
  white-space: normal;
  }

/* C2.8 */
#pun-index .tcl h3 {
  }

/* 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: 1px 0 0 1px;
  padding: 0.8em 1em;
  }

/* C2.12 */
.punbb .main th {
  border-style: none none none solid;
  border-width: 0 0 0 1px;
  padding: 0.4em 1em 0.4em 1em;
  }

/* C2.13 */
.punbb .main .tcl {
  border-left-style: none;
  border-left-width: 0
  }

/* C2.14 */
.punbb tbody.hasicon td.tcl {
  padding-left: 3.2em;  padding-top: 3.0em;
  }


/* C2.16 */
.punbb  table div.icon {
  font-size: 1.05em;
  position: absolute;
  margin-left: -2.2em;
  }


 /* C3 Topics
-------------------------------------------------------------*/

/* C3.1 */
.punbb .post .container {
  border-style: none solid solid solid;
  border-width: 1px;
  margin-top: -1px;
  padding-bottom: 1px;
  }

/* C3.2 */
.punbb .post h3 {
  border-style: solid solid none solid;
  border-width: 1px;
  }

/* C3.3 */
.punbb .post h3 span {
  padding: 8px 19px 2px 19px;
  display: block;
  margin-left: -30px;
  margin-bottom: 10px;
  }
a.sharelink {font-size: 0px;}
/* C3.4 */
.punbb .post h3 strong {
  float: right;
  width: 5em;
  text-align: right;
  font-weight: normal;
  }

/* C3.5 */
.punbb .post .post-author {
  float: left;
  margin-top: 0px;
  margin-left: -12px;
  overflow: hidden;
  text-align: center;
  }

/* C3.6 */
.punbb .post .post-author ul, .punbb .post .post-author p {
  padding: 0 1em 1em 1em;
  line-height: 140%;
  }

/* C3.7 */
.pa-author {
  font-size: 1.1em;
  font-weight: bold;
  }

/* C3.8 */
.pa-author a {
  text-decoration: none
  }

/* C3.9 */
li.pa-title {
  padding-bottom: 0.4em;
  font-weight: bold;
  }


li.pa-online {
  line-height: 0.8em;
  border-left-style: solid;
  border-left-width: 0.7em;
  padding-left: 0.4em;
  margin-top: 0.7em;
  }

/* C3.11 */
.punbb .post-body {
  margin-left: 21em;
  border-left-style: solid;
  border-left-width: 0px;
  padding: 0 0 1px 0;
  margin-right: -28px;
  }

/* C3.12 */
.punbb .post-box {
  padding: 2em;
  text-align: justify;
  }

/*C3.13 */
.punbb fieldset .post-box {
  margin-bottom: 0.8em
  }

/* C3.14 */
.punbb .post-links {
  margin-left: 19em;
  border-left-style: solid;
  border-left-width: 1px;
  }

/* C3.15 */
.punbb .post-links ul {
  padding: 10px 1em 0 2.2em;
  height: 1em;
  line-height: 1em;
  margin-left: -240px;
  border-top-style: dashed;
  border-top-width: 1px;
  background: transparent;
  text-align: right;
  text-transform: lowercase;
  font-size: 12px;
  }


/* C3.16 */
.punbb .post-links li {
  display: inline;
  padding-left: 1em;
  }

/* C3.17 */
.pl-email, .pl-website {
  float: left;
  }

/* C3.18 */
.punbb .clearer {
  clear: both;
  height: 0;
  font-size: 0;
  }


/* C4 Moderator menu
-------------------------------------------------------------*/

/* C4.1 */
.punbb .modmenu .container {
  padding: 0.5em 1em;
  text-align: right;
  }

/* C4.2 */
.punbb .modmenu strong, .punbb .modmenu a {
  height: 1.8em;
  line-height: 1.8em;
  }

/* C4.3 */
.punbb .modmenu .container strong {
  float: left;
  }

/* C4.4 */
.punbb .modmenu input {
  margin-left: 1em;
  }


/* C5 Message boxes
-------------------------------------------------------------*/

/* C5.1 */
.punbb .info .container {
  padding: 0.8em 1em
  }

/* C5.2 */
.punbb .info .container .backlink {
  padding-top: 0.8em;
  }


/* C6 Profile
-------------------------------------------------------------*/

/* C6.1 */
#profile .container {
  padding-left: 18.6em;
  }

/* C6.2 */
#profilenav {
  float: left;
  width: 14em;
  margin-left: -16.3em;
  display: inline;
  }

/* C6.3 */
#profilenav li {
  padding-bottom: 0.8em;
  font-weight: bold;
  }

/* C6.4 */
#viewprofile ul, #profilenav ul {
  border-style: solid;
  border-width: 1px;
  padding: 1.5em 18px 0.8em 18px;
  margin: 0 0 1em 0;
  }

/* C6.5 */
#viewprofile h2, #profilenav h2 {
  background: transparent;
  border: none;
  padding: 0 0 0 0;
    margin: 0 14px 1em 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;
  width:86%;
  }

/* C7.3 */
#pun-userlist .usertable table {
  border-style: solid;
  border-width: 1px;
  }


/*************************************************************
D - PUNBB SECTIONS OTHER THAN MAIN CONTENT
**************************************************************/

/* D1 Logo and description
-------------------------------------------------------------*/

#pun-title {
  margin: 0!important;
  border-style: solid solid none solid!important;

  }


/* D1.2 */
#pun-title h1 {

  position: absolute!important;

  }

/* D1.3 */
#pun-title .container {
  border-style: none solid none solid!important;
  }

/* D1.4 */
#pun-title h1 span  {
 font-size: 0px!important;
  z-index: -1!important;
  }



/* 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, #pun-navlinks .container {
  border-style: none;
  border-width: 0;
  margin: 0;
  }

/* D3.2 */
#pun-navlinks .container {
  padding: 0.7em 1em;
  }

/* D3.3 */
#pun-navlinks li {
  display: inline;
  padding-right: 1em;
  }

/* D3.4 */
#pun-navlinks li a {
  }

/* D4 User links
-------------------------------------------------------------*/

/* D4.1 */
#pun-ulinks  {
  margin-top: 0;
  }

/* D4.2 */
#pun-ulinks .container {
  border-top: none;
  padding: 0.7em 1em;
  }

/* D4.3 */
#pun-ulinks li, #pun-ulinks li a {
  display: inline;
  white-space: nowrap;
  }

/* D4.4 */
#pun-ulinks li a {
  padding: 0 0.3em 0 0.6em
  }

/* 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;
  }

/* D5.2 */
#pun-status .container {
  padding: 0.8em 1em 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;
  }

/* D5.5 */
#pun-crumbs1 p.container {
  border-top: none;
  padding: 1em 1em 0.8em 1em;
  font-size: 1.1em;
  }

/* D5.6 */
#pun-break1 {
  margin: 0 1em;
  border-style: solid none;
  border-width: 1px 0;
  height: 0;
  margin: -2px 1em;
  position: relative;
  z-index: 1;
  }

/* D6 Announcement
-------------------------------------------------------------*/

/* D6.1 */
#pun-announcement h2 {
  padding: 0;
  margin: 0 1em -3.5em 1em;
  border-style: none none solid none;
  border-width: 0 0 1px 0;
  position: relative;
  font-weight: bold;
  }

/* 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: 4.3em 1em 1em 1em;
  }

/* D7 Statistics
-------------------------------------------------------------*/

/* D7.1 */
#pun-stats .container {
  padding: 0.8em 1em
  }

/* D7.4 */
li#onlinelist {
  margin-top: 1em;
  float: left;
  }


/* D8 Quick Jump - About - Bottom Breadcrumbs
-------------------------------------------------------------*/

/* D8.1 */
#pun-qjump {
  margin: 0;
  border: none;
  width: 50%;
  position: relative;
  float: left;
  }

/* D8.2 */
#pun-qjump .container {
  border: none;
  background: transparent;
  padding: 0.8em 1em;
  }

/* D8.3 */
#pun-about {
  margin-top: 0;
  }

/* D8.4 */
#pun-about .container {
  border-top-style: none;
  text-align: right;
  line-height: 150%;
  padding: 0.8em 1em;
  }

/* D8.5 */
#pun-about p span {
  display:block;
  padding-left: 50%;
  }

/* D8.6 */
#pun-crumbs2 {
  font-weight: bold;
  overflow: hidden;
  margin-bottom: 0;
  border-bottom: none;
  }

/* D8.7 */
#pun-crumbs2 .container {
  border-bottom: none;
  padding: 0.8em 1em;
  font-size: 1.1em;
  }

/* D8.8 */
#pun-break4 {
  margin: -2px 1em;
  border-style: solid none;
  border-width: 1px 0;
  position: relative;
  height: 0;
  z-index: 1;
  }

/* D8.9 */
div.punbb-admin #pun-about .container {
  border-top-style: solid;
  border-top-width: 1px;
  }


/* D9 Help file
-------------------------------------------------------------*/

/* D9.1 */
#pun-help .formal .info-box h3.legend {
  border-bottom-style: solid;
  border-bottom-width: 1px;
  padding-bottom: 0;
  margin-bottom: 0.8em;
  }

/* D9.2 */
#pun-help .formal .info-box h3.legend span {
  padding-bottom: 0.6em;
  display: block;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  font-size: 1.1em;
  }

/* D9.3 */
#pun-help .formal p, #pun-help .formal dd {
  margin-bottom: 1em
  }

/* D9.4 */
#pun-help .formal ul, #pun-help .formal dl {
  padding: 0 0 0 1em
  }

/* D9.5 */
#pun-help .formal li {
  padding: 0;
  line-height: 130%
  }

/* D9.6 */
#pun-help .formal li * {
  vertical-align: text-top
  }

/* D9.7 */
#pun-help .formal dt span {
  font: 1.4em/120% monaco, "bitstream vera sans mono", "courier new", courier, monospace
  }

/* D9.8 */
#pun-help .formal .parsedmsg, #pun-help .formal .parsedmsg .incode {
  padding-bottom: 0;
  }

.stickytext, .closedatafield, #pun-live-rusff, .pl-reports  {display: none}






.pl-share {font-size: 0px;}

.post-content td {vertical-align: top!important;}

/*Скрыть VIP-аккаунт*/
#pun-status .item4.status-right{
  display:none;
}




"use strict";

/**
 * hvScriptSet
 * Version: 1.0.15
 * Author: Человек-Шаман
 * license: MIT
 *
 * Что нового:
 * 1. Стили переехали в отдельный файл
 * 2. Небольшие изменения под обновления сервиса
 * 3. Теперь по умолчанию можно хранить до 20 масок, есть настройка для изменения лимита
 */

const hvScriptSet = {

  addMask: function (opt) {
    let changeList = {
      'author': {
        title: 'Ник',
        description: 'Только текст',
        tag: 'nick,nic',
        class: 'pa-author',
        type: 'link'
      },
      'title': {
        title: 'Статус',
        description: 'Только текст',
        tag: 'status,sta',
        class: 'pa-title',
        type: 'text'
      },
      'avatar': {
        title: 'Аватар',
        description: 'Прямая ссылка на картинку формата jpg, gif или png',
        tag: 'icon,ava',
        class: 'pa-avatar',
        type: 'avatar'
      },
      'signature': {
        title: 'Подпись',
        description: 'Принимает bb-коды, кроме таблицы',
        tag: 'sign,sgn',
        class: 'post-sig',
        type: 'signature'
      },
      ...opt.changeList
    };

    let tmpMask = {};
    let previewForm = {};
    let errorList = {};

    let userFields = opt.userFields || ['pa-author', 'pa-title', 'pa-avatar', 'pa-fld1', 'pa-reg',
      'pa-posts', 'pa-respect', 'pa-positive', 'pa-awards', 'pa-gifts'];
    let allTagsList = getTagList();

    let defaultAvatar = opt.defaultAvatar || 'https://i.imgur.com/bQuC3S1.png';

    const maskLimit = opt.maskLimit || 20;

    let prevMasks = [];

    getStorageMask();

    let posts = [];

    function getPosts() {
      posts = document.querySelectorAll('.post');
      let changedPosts = {};
      let changedUsersId = [];
      for (let i = 0; i < posts.length; i++) {
        const postEl = posts[i].querySelector('.post-content');
        const postId = posts[i].getAttribute('id');
        const postProfile = posts[i].querySelector('.post-author ul');
        const postText = postEl.innerHTML;
        const postSignature = posts[i].querySelector('.post-sig dd');
        const postChangeList = getTags(postText);
        const userId = posts[i].dataset.userId;

        if (Object.keys(postChangeList).length !== 0) {
          changedPosts[i] = {
            postId: postId,
            userId: userId,
            text: postEl,
            clearedText: getClearedPost(postEl, postChangeList),
            profile: postProfile,
            changeList: postChangeList,
            signature: postSignature
          };
          if (!(changedUsersId.indexOf(userId) + 1)) {
            changedUsersId.push(userId);
          }
        }
      }
      let checkAccess = changedUsersId.length > 0 ? getAccess(changedUsersId) : {};
      for (let _i in changedPosts) {
        if (changedPosts.hasOwnProperty(_i)) {
          changedPosts[_i].username = checkAccess[changedPosts[_i].userId].username;
          changedPosts[_i].groupId = checkAccess[changedPosts[_i].userId].groupId;
          changedPosts[_i].groupTitle = checkAccess[changedPosts[_i].userId].groupTitle;
          changedPosts[_i].access = checkAccess[changedPosts[_i].userId].access;

          if (changedPosts[_i].changeList.avatar && changedPosts[_i].access.common) {
            if (!changedPosts[_i].profile.querySelector('.pa-avatar img')) {
              let fieldIndex = userFields.indexOf('pa-avatar');
              let block = document.createElement('li');
              block.className = 'pa-avatar';
              block.innerHTML = `<img src="" title="${changedPosts[_i].username}">`;
              for (let index = ++fieldIndex; index <= userFields.length; index++) {
                let nextSibling = changedPosts[_i].profile.querySelector('.' + userFields[index]);
                if (nextSibling) {
                  let parent = nextSibling.parentNode;
                  parent.insertBefore(block, nextSibling);
                  break;
                }
                if (index === userFields.length) {
                  changedPosts[_i].profile.appendChild(block);
                }
              }
            }
            let avatar = changedPosts[_i].profile.querySelector(`.pa-avatar img[title]`)
              || changedPosts[_i].profile.querySelector(`.pa-avatar img[alt]`)
              || changedPosts[_i].profile.querySelector(`.pa-avatar img`);
            avatar.src = changedPosts[_i].changeList.avatar.content;
            avatar.removeAttribute('width');
            avatar.removeAttribute('height');
          }
        }
        if (changedPosts.hasOwnProperty(_i) && changedPosts[_i].access.extended) {
          let thisChanges = changedPosts[_i].changeList;
          for (let change in thisChanges) {
            if (thisChanges.hasOwnProperty(change)) {
              if (thisChanges[change].field === 'pa-author' && changedPosts[_i].userId === '1') {
                changedPosts[_i].changeList[change].type = 'text';
              }
              if (change !== 'signature' && !changedPosts[_i].profile.getElementsByClassName(changedPosts[_i]
                .changeList[change].field)[0]) {
                let _fieldIndex = userFields.indexOf(changedPosts[_i].changeList[change].field);
                let _block = document.createElement('li');
                _block.className = thisChanges[change].field;
                for (let _index = ++_fieldIndex; _index <= userFields.length; _index++) {
                  let _nextSibling = changedPosts[_i].profile.querySelector('.' + userFields[_index]);
                  if (_nextSibling) {
                    let parent = _nextSibling.parentNode;
                    parent.insertBefore(_block, _nextSibling);
                    break;
                  }
                  if (_index === userFields.length) {
                    changedPosts[_i].profile.appendChild(_block);
                  }
                }
              }
              let fieldEl = changedPosts[_i].profile.getElementsByClassName(changedPosts[_i]
                .changeList[change].field)[0];
              switch (changedPosts[_i].changeList[change].type) {
                case 'html':
                  let content = strToHtml(changedPosts[_i].changeList[change].content);
                  if (content === '') {
                    console.error(`Что-то не так с маской в посте #${changedPosts[_i].postId}`);
                    if (GroupID === 1 || GroupID === 2) {
                      let errorMess = document.getElementById('admin_msg1');
                      errorMess.innerHTML = `Что-то не так с маской в посте #${changedPosts[_i].postId}. Он подсвечен красным.<br><i>Сообщение показано только администрации.</i>`;
                      errorMess.style.display = 'block';
                      errorMess.style.zIndex = 10000;
                      document.getElementById(changedPosts[_i].postId)
                        .style.border = 'solid 1px #f00';
                    }
                  }
                  fieldEl.innerHTML = content.length > 999 ? content.slice(0, 999) : content;
                  break;
                case 'bbcode':
                  let __content = changedPosts[_i].changeList[change].content;
                  fieldEl.innerHTML = __content.length > 999 ? __content.slice(0, 999) : __content;
                  break;
                case 'text':
                  let _content = changedPosts[_i].changeList[change].content
                    .replace(/</i, '&lt').replace(/>/i, '&rt');
                  switch (change) {
                    case 'author':
                      fieldEl.innerHTML = _content.length > 25 ? _content.slice(0, 25) : _content;
                      $('#' + changedPosts[_i].postId).find('.pl-quote a').attr('href', "javascript:quote('" + _content.replace(/\'/i, '\\\'') + "', " + changedPosts[_i].postId.slice(1) + ")");
                      break;
                    case 'title':
                      fieldEl.innerHTML = _content.length > 50 ? _content.slice(0, 50) : _content;
                      break;
                    default:
                      fieldEl.innerHTML = _content.length > 999 ? _content.slice(0, 999) : _content;
                  }
                  break;
                case 'link':
                  var linkContent = changedPosts[_i].changeList[change].content.length > 25 ?
                    changedPosts[_i].changeList[change].content.slice(0, 25) :
                    changedPosts[_i].changeList[change].content
                  fieldEl.querySelector('a').innerText = linkContent;

                  if (change === 'author') {
                    const nickLink = fieldEl.querySelector('a');
                    nickLink.href = nickLink.href.includes('profile')
                      ? nickLink.href
                      : "javascript:to('" + linkContent.replace(/\'/i, '\\\'') + "')";
                    $('#' + changedPosts[_i].postId).find('.pl-quote a').attr('href', "javascript:quote('" + linkContent.replace(/\'/i, '\\\'') + "', " + changedPosts[_i].postId.slice(1) + ")");
                  }
                  break;
                case 'signature':
                  if (GroupID !== '3') {
                    if (!changedPosts[_i].signature) {
                      let signEl = document.createElement('dl');
                      signEl.className = 'post-sig';
                      signEl.innerHTML = `
                        <dl class="post-sig">
                          <dt>
                            <span>Подпись автора</span>
                          </dt>
                          <dd></dd>
                        </dl>`;
                      changedPosts[_i].text.appendChild(signEl);
                      changedPosts[_i].signature = signEl.querySelector('.post-sig dd');
                    }
                    changedPosts[_i].signature.innerHTML = changedPosts[_i].changeList[change].content;
                  }
                  break;
              }
            }
          }
        }
        let sign = changedPosts[_i].text.innerHTML.match(/<dl class="post-sig">([\s\S]*?)?<\/dl>/);
        changedPosts[_i].profile.classList.add('hv-mask');
        changedPosts[_i].text.innerHTML = changedPosts[_i].clearedText + (sign ? sign[0] : '');
      }
    }

    function hideTags() {
      posts = document.querySelectorAll('.post');
      for (let i in posts) {
        if (posts.hasOwnProperty(i)) {
          let text = posts[i].querySelector('.post-content');
          for (let tag in allTagsList) {
            if (allTagsList.hasOwnProperty(tag)) {
              let pattern =
                new RegExp('\\[' + allTagsList[tag] + '\\](.*?)\\[\/' + allTagsList[tag] + '\\]', 'gi');
              text.innerHTML = text.innerHTML.replace(pattern, '');
            }
          }
        }
      }
    }

    function hidePreviewTags() {
      let text = document.querySelector('.post-content');
      if (!text) return;
      let tags = getTags(text.innerHTML);
      if (Object.keys(tags).length) {
        text.innerHTML = getClearedPost(text, tags);
      }
    }

    function getTags(text) {
      let postChangeList = {};
      let clearedText = text.replace(/<div class="code-box"><strong class="legend">([\s\S]*?)?<\/strong><div class="blockcode"><div class="scrollbox" style="(?:.*?)"><pre>([\s\S]*?)?<\/pre><\/div><\/div><\/div>/gi, '');
      for (let field in changeList) {
        if (changeList.hasOwnProperty(field)) {
          let tags = changeList[field].tag.split(',');
          for (let i = tags.length; i >= 0; i--) {
            if (tags.hasOwnProperty(i)) {
              let pattern = new RegExp('\\[' + tags[i] + '\\]([\\s\\S]*?)\\[\\/' + tags[i] + '\\]', 'gmi');
              let clearPattern = new RegExp('\\[(\\/?)' + tags[i] + '\\]', 'gmi');
              if (clearedText.match(pattern)) {
                postChangeList[field] = {
                  'tag': tags[i],
                  'field': changeList[field].class,
                  'content': text.match(pattern)[0].replace(clearPattern, ''),
                  'type': changeList[field].type
                };
              }
            }
          }
        }
      }
      return postChangeList;
    }

    function getTagList() {
      let tagList = [];
      for (let field in changeList) {
        if (changeList.hasOwnProperty(field)) {
          let tags = changeList[field].tag.split(',');
          for (let i in tags) {
            if (tags.hasOwnProperty(i) && !tagList.indexOf(tags[i]) + 1) {
              tagList.push(tags[i]);
            }
          }
        }
      }
      return tagList;
    }

    function getAccess(usersId) {
      let userInfo = getUsersInfo(usersId);
      const forumName = getClearedForumName(FORUM.topic.forum_name);
      for (let id in userInfo) {
        if (userInfo.hasOwnProperty(id)) {
          switch (userInfo[id].groupId) {
            case '1':
            case '2':
              userInfo[id].access = {
                'common': true,
                'extended': true
              };
              break;
            case '3':
              userInfo[id].access = {
                'common': opt.guestAccess ?
                  opt.guestAccess.includes(forumName) : false,
                'extended': opt.guestAccess ?
                  opt.guestAccess.includes(forumName) : false
              };
              break;
            default:
              userInfo[id].access = {
                'common': opt.forumAccess && opt.forumAccess[forumName] ?
                  opt.forumAccess[forumName].includes(userInfo[id].groupTitle) : true,
                'extended': opt.forumAccessExtended && opt.forumAccessExtended[forumName] ?
                  opt.forumAccessExtended[forumName]
                    .includes(userInfo[id].groupTitle) : false
              };
          }
        }
      }
      return userInfo;
    }

    function getUsersInfo(usersId) {
      let usersIdStr = usersId.filter(item => +item > 1).join(',');
      let usersInfo = {};
      if (usersId.includes('1')) {
        usersInfo['1'] = {
          'userId': '1',
          'username': 'Guest',
          'groupId': '3',
          'groupTitle': 'Гость'
        };
      }
      if (usersIdStr) {
        $.ajax({
          async: false,
          url: '/api.php',
          data: {
            method: 'users.get',
            user_id: usersIdStr
          },
          success: function success(json) {
            for (let i in json.response.users) {
              if (json.response.users.hasOwnProperty(i)) {
                usersInfo[json.response.users[i].user_id] = {
                  'userId': i,
                  'username': json.response.users[i].username,
                  'groupId': json.response.users[i].group_id,
                  'groupTitle': json.response.users[i].group_title
                };
              }
            }
          }
        });
      }

      return usersInfo;
    }

    function getDialog() {
      let maskButton = addButton();
      if (maskButton) {
        if (checkAccessExtended() || getAccessByForumName() === 'extended') {
          maskButton.addEventListener('click', (event) => {
            if (event.ctrlKey || event.metaKey) {
              insertAvatarTags();
            } else {
              callMaskDialog();
            }
          });
        } else {
          maskButton.addEventListener('click', insertAvatarTags);
        }
      }
      let maskDialog = buildMaskDialog();
      let main = document.querySelector('#pun-main');
      main.appendChild(maskDialog);

      getStyle();
    }

    function getStyle() {
      let style = document.createElement('link');
      style.rel = 'stylesheet';
      style.href = 'https://forumstatic.ru/files/0017/95/29/14188.css';

      let docstyle = document.head.querySelector('link[href*="style"]');
      document.head.insertBefore(style, docstyle);
    }

    function insertAvatarTags() {
      bbcode('[icon]', '[/icon]');
    }

    function setSelectionRange(input, selectionStart, selectionEnd) {
      if (input.setSelectionRange) {
        input.focus();
        input.setSelectionRange(selectionStart, selectionEnd);
      } else if (input.createTextRange) {
        let range = input.createTextRange();
        range.collapse(true);
        range.moveEnd('character', selectionEnd);
        range.moveStart('character', selectionStart);
        range.select();
      }
    }

    function changeMaskForm(field, value) {
      let str = '';
      switch (field) {
        case 'signature':
          break;
        case 'avatar':
          str = value !== '' ? value : getAvatar();
          if (!checkImage(str)) {
            errorList[field] = 'В поле [Аватар] должна быть ссылка на картинку формата jpg, gif или png';
          } else {
            delete errorList[field];
            previewForm.querySelector(`.hv-preview-${field} img`).src = str;
          }
          break;
        case 'author':
          if (value.length > 25) {
            errorList[field] = 'Поле [Ник] не должно содержать больше 25 символов';
          } else {
            str = value !== '' ? value : UserLogin;
            delete errorList[field];
            previewForm.querySelector(`.hv-preview-${field}`).innerText = str;
          }
          break;
        case 'title':
          if (value.length > 50) {
            errorList[field] = 'Поле [Статус] не должно содержать больше 50 символов';
          } else {
            delete errorList[field];
            str = value !== '' ? value : getUserTitle();
            previewForm.querySelector(`.hv-preview-${field}`).innerText = str;
          }
          break;
        default:
          if (value.length > 999) {
            errorList[field] = `Поле [${changeList[field].title}] не должно содержать больше 999 символов`;
          } else {
            delete errorList[field];
            str = value || '';
            switch (changeList[field].type) {
              case 'text':
                delete errorList[field];
                previewForm.querySelector(`.hv-preview-${field}`).innerHTML = str.replace(/</gi, '&lt;');
                break;
              case 'bbcode':
                delete errorList[field];
                previewForm.querySelector(`.hv-preview-${field}`).innerHTML = bbcodeToHtml(str);
                break;
              default:
                if (checkHtml(str)) {
                  errorList[field] = `В поле [${changeList[field].title}] недопустимые теги`;
                } else {
                  delete errorList[field];
                  previewForm.querySelector(`.hv-preview-${field}`).innerHTML = str;
                }
            }
          }
          break;
      }
      showErrors();
    }

    function showErrors() {
      let errorListBlock = document.querySelector('#mask_dialog .hv-error-list');
      errorListBlock.innerHTML = '';
      if (Object.keys(errorList).length) {
        errorListBlock.style.display = 'block';
        for (let error in errorList) {
          if (errorList.hasOwnProperty(error)) {
            let li = document.createElement('li');
            li.innerHTML = `<li> ! ${errorList[error]}</li>`;
            errorListBlock.appendChild(li);
          }
        }
      } else {
        errorListBlock.style.display = 'none';
      }
    }

    function fillForm(obj) {
      let form = document.querySelector('#mask_form');
      for (let change in changeList) {
        if (changeList.hasOwnProperty(change)) {
          let field = form.querySelector('#mask_' + change);
          if (obj[change]) {
            field.value = obj[change].value;
            tmpMask[change] = {
              'tag': obj[change].tag,
              'value': obj[change].value
            };
            changeMaskForm(change, obj[change].value);
          } else {
            field.value = '';
            delete tmpMask[change];
            changeMaskForm(change, '');
          }
        }
      }
    }

    function getAvatar() {
      return UserAvatar ? UserAvatar : defaultAvatar;
    }

    function getUserTitle() {
      return UserTitle ? UserTitle : 'Статус';
    }

    function addButton() {
      let form = document.getElementById("form-buttons");
      if (form && (checkAccess() || checkAccessExtended() || getAccessByForumName())) {
        let button = document.createElement('td');
        button.id = 'button-mask';
        button.title = 'Маска профиля';
        button.innerHTML = '<img src="/i/blank.gif">';
        let bgImage = opt.buttonImage ? opt.buttonImage : 'https://i.imgur.com/ONu0llO.png';
        button.style.backgroundImage = 'url("' + bgImage + '")';
        form.getElementsByTagName('tr')[0].appendChild(button);
        return button;
      } else {
        return null;
      }
    }

    function callMaskDialog() {
      let maskDialog = document.getElementById('mask_dialog');
      maskDialog.style.display = 'block';
      getMaskStorage(prevMasks);
      document.addEventListener('keyup', hideMaskByEsc);
    }

    function hideMaskDialog() {
      let maskDialog = document.getElementById('mask_dialog');
      maskDialog.style.display = 'none';
      document.removeEventListener('keyup', hideMaskByEsc);
    }

    function hideMaskByEsc(e) {
      if (e.keyCode === 27) hideMaskDialog();
    }

    function buildMaskDialog() {
      let code = document.createElement('div');
      code.id = 'mask_dialog';
      code.style.display = 'none';

      let bg = document.createElement('div');
      bg.className = 'hv-bg';

      bg.addEventListener('click', event => {
        if (event.target === bg) {
          hideMaskDialog();
        }
      });

      let inner = document.createElement('div');
      inner.className = 'inner container';

      let title = document.createElement('div');
      title.className = 'hv-mask-dialog-title';
      title.innerHTML = 'Маска профиля';

      let errorListBlock = document.createElement('ul');
      errorListBlock.className = 'hv-error-list';
      errorListBlock.style.display = 'none';

      let showPreviewFlag = opt.showPreview || true;

      let preview = document.createElement('div');
      previewForm = preview;
      preview.className = 'hv-preview-block';
      clearPreview();

      let form = document.createElement('form');
      form.id = 'mask_form';

      let previewMaskForm = document.createElement('form');
      previewMaskForm.id = 'hv_preview_form';
      previewMaskForm.style.display = 'none';

      let previewFormSent = document.createElement('input');
      previewFormSent.type = 'hidden';
      previewFormSent.name = 'form_sent';
      previewFormSent.value = 1;
      let previewFormUser = document.createElement('input');
      previewFormUser.type = 'hidden';
      previewFormUser.name = 'form_user';
      previewFormUser.value = UserLogin;
      let previewReqMessage = document.createElement('textarea');
      previewReqMessage.name = 'req_message';
      previewMaskForm.appendChild(previewFormSent);
      previewMaskForm.appendChild(previewFormUser);
      previewMaskForm.appendChild(previewReqMessage);

      let _loop = function _loop(mask) {
        if (changeList.hasOwnProperty(mask)) {
          (function () {
            let li = document.createElement('div');
            li.className = 'hv-mask-field ' + mask;
            let input = void 0;
            switch (changeList[mask].type) {
              case 'html':
              case 'signature':
              case 'bbcode':
                input = document.createElement('textarea');
                input.id = 'mask_' + mask;
                break;
              default:
                input = document.createElement('input');
                input.type = 'text';
                input.id = 'mask_' + mask;
            }
            input.addEventListener('blur', () => {
              let idField = input.id.split('mask_')[1];
              if (input.value !== '' && !checkHtml(input.value)) {
                tmpMask[idField] = {
                  'tag': changeList[idField].tag.split(',')[0],
                  'value': input.value
                };
              } else {
                delete tmpMask[idField];
              }
              changeMaskForm(idField, input.value);
            });
            let label = document.createElement('label');
            label.for = 'mask_' + mask;

            label.innerHTML += '<b>' + changeList[mask].title + '</b>';
            if (changeList[mask].description) {
              label.innerHTML += '<div class="description">' + changeList[mask].description + '</div>';
            }
            li.appendChild(label);
            if (changeList[mask].defaultCode) {
              const code = changeList[mask].defaultCode;

              if (typeof code === 'string') {
                let templateButton = document.createElement('div');
                templateButton.className = 'button hv-add-template';
                templateButton.innerText = '« вставить шаблон';
                templateButton.title = 'Вставить шаблон';
                templateButton.addEventListener('click', function () {
                  fillInput(input, changeList[mask].defaultCode);
                  changeMaskForm(mask, input.value);
                });
                label.insertBefore(templateButton, label.querySelector('b'));
              }

              if (Array.isArray(code)) {
                const templateSelect = document.createElement('select');
                templateSelect.className = 'button hv-add-template';
                const defaultOption = document.createElement('option');
                defaultOption.value = '';
                defaultOption.selected = true;
                defaultOption.text = 'Вставить шаблон';
                templateSelect.appendChild(defaultOption);
                code.forEach(item => {
                  const option = document.createElement('option');
                  option.value = item.template;
                  option.text = item.name;
                  templateSelect.appendChild(option);
                });
                templateSelect.addEventListener('change', event => {
                  const value = event.target.value;
                  fillInput(input, value);
                  changeMaskForm(mask, input.value);
                })
                label.insertBefore(templateSelect, label.querySelector('b'));
              }
            }
            li.appendChild(input);
            form.appendChild(li);
          })();
        }
      };

      for (let mask in changeList) {
        _loop(mask);
      }

      let formBlock = document.createElement('div');
      formBlock.className = 'hv-form-block';
      formBlock.appendChild(form);
      formBlock.appendChild(previewMaskForm);

      let userMasks = document.createElement('ul');
      userMasks.className = 'hv-masks-storage';
      userMasks.classList.toggle('hidden', prevMasks.length === 0);

      let block = document.createElement('div');
      block.className = 'hv-mask-block';
      if (showPreviewFlag) {
        block.appendChild(preview);
      }
      block.appendChild(formBlock);
      block.appendChild(userMasks);

      let okButton = document.createElement('input');
      okButton.type = 'button';
      okButton.className = 'button';
      okButton.name = 'insertMask';
      okButton.value = 'Вставить маску';
      okButton.addEventListener('click', saveMask);

      let insertButton = document.createElement('input');
      insertButton.type = 'button';
      insertButton.className = 'button';
      insertButton.name = 'insertMask';
      insertButton.value = 'Вставить без сохранения';
      insertButton.addEventListener('click', insertMask);

      let clearButton = document.createElement('input');
      clearButton.type = 'button';
      clearButton.className = 'button';
      clearButton.name = 'clearMask';
      clearButton.value = 'Очистить';
      clearButton.addEventListener('click', clearMask);

      let cancelButton = document.createElement('input');
      cancelButton.type = 'button';
      cancelButton.className = 'button';
      cancelButton.name = 'cancelMask';
      cancelButton.value = 'Отмена';
      cancelButton.addEventListener('click', cancelMask);

      let control = document.createElement('div');
      control.className = 'hv-control';
      control.appendChild(okButton);
      control.appendChild(insertButton);
      control.appendChild(clearButton);
      control.appendChild(cancelButton);

      inner.appendChild(title);
      inner.appendChild(errorListBlock);
      inner.appendChild(block);
      inner.appendChild(control);

      code.appendChild(bg);
      bg.appendChild(inner);

      return code;
    }

    function getMaskStorage(prevMasks) {
      const maskDialog = document.getElementById('mask_dialog');
      if (!maskDialog) return;
      let maskStore = maskDialog.querySelector('.hv-masks-storage');
      maskStore.classList.toggle('hidden', prevMasks.length === 0);
      maskStore.innerHTML = '';

      let _loop2 = function _loop2(mask) {
        let mymask = JSON.parse(prevMasks[mask]);
        let li = document.createElement('li');
        li.className = 'hv-mask-element';
        let tempavatar = mymask['avatar'] ? mymask['avatar'].value : defaultAvatar;
        let avatar = document.createElement('img');
        avatar.src = tempavatar;
        let infoBlock = '';

        for (let item in changeList) {
          if (changeList.hasOwnProperty(item) && item !== 'avatar' && mymask[item]) {
            if (!checkHtml(mymask[item].value.toString())) {
              infoBlock += '<div class="' + item + '"><b>' + changeList[item].title + ':</b> ' +
              mymask[item].value + '</div>';
            }
          }
        }

        let deleteMask = document.createElement('a');
        deleteMask.className = 'hv-delete-mask';
        deleteMask.innerText = 'Удалить';
        deleteMask.title = 'Удалить маску из списка';
        deleteMask.addEventListener('click', () => deleteMaskFromStorage(mask, li));
        li.appendChild(avatar);
        if ((mymask['avatar'] && Object.keys(mymask).length > 1) ||
          (!mymask['avatar'] && Object.keys(mymask).length > 0)) {
            li.dataset.content = infoBlock;
            $(li).tipsy({
              title: function() { return this.getAttribute('data-content'); },
              fade: true,
              html: true,
              gravity: 'e',
              className: 'hv-mask-tooltipsy'
            });
        }
        li.appendChild(deleteMask);
        avatar.addEventListener('click', () => fillForm(mymask));
        maskStore.appendChild(li);
      };

      for (let mask = 0; mask < prevMasks.length; mask++) {
        _loop2(mask);
      }
    }

    function fillInput(input, value) {
      input.value = value;
    }

    function insertMask () {
      insert(getStrMask());
      clearMask();
      hideMaskDialog();
    }

    function saveMask() {
      if (Object.keys(tmpMask).length > 0) {
        let tempMask = JSON.stringify(tmpMask);
        if (Object.keys(prevMasks).length > 0) {
          if (!(hasMaskInSrorage(prevMasks, tmpMask) + 1)) {
            if (prevMasks.length >= maskLimit) {
              prevMasks.splice(0, 1);
            }
          } else {
            prevMasks.splice(hasMaskInSrorage(prevMasks, tmpMask), 1);
          }
        }
        prevMasks.push(JSON.stringify(tmpMask));
        $.post('/api.php',
          {
            method: 'storage.set',
            token: ForumAPITicket,
            key: 'maskListUser',
            value: encodeURI(prevMasks.join('|splitKey|'))
          }
        )
        .done(function() {
          insert(getStrMask());
          getMaskStorage(prevMasks);
          clearMask();
          hideMaskDialog();
        })
        .fail(function() {
          errorList.common = 'Ошибка сохранения, попробуй ещё раз.';
          showErrors();
        });
      }
    }

    function hasMaskInSrorage(storage, item) {
      let res = -1;
      for (let i = 0; i < storage.length; i++) {
        let obj = JSON.parse(storage[i]);
        if (Object.keys(obj).length === Object.keys(item).length) {
          let counter = 0;
          for (let k in obj) {
            if (obj.hasOwnProperty(k)) {
              if (JSON.stringify(obj[k]) !== JSON.stringify(item[k])) {
                break;
              } else {
                counter++;
              }
            }
            if (counter === Object.keys(obj).length) {
              res = i;
            }
          }
        }
      }
      return res;
    }

    function deleteMaskFromStorage(mask, li) {
      $(li).tipsy('hide');
      prevMasks.splice(mask, 1);
      $.post('/api.php',
        {
          method: 'storage.set',
          token: ForumAPITicket,
          key: 'maskListUser',
          value: encodeURI(prevMasks.join('|splitKey|'))
        }
      );
      getMaskStorage(prevMasks);
    }

    function clearStorageMask() {
      prevMasks = [];
      $.ajax({
        async: false,
        url: '/api.php',
        data: {
          method: 'storage.delete',
          token: ForumAPITicket,
          key: 'maskListUser'
        }
      });
      getMaskStorage(prevMasks);
    }

    function clearMask() {
      tmpMask = {};
      clearPreview();
      errorList = {};
      showErrors();
      let maskForm = document.getElementById('mask_form');
      maskForm.reset();
    }

    function cancelMask() {
      clearMask();
      hideMaskDialog();
    }

    function clearPreview() {
      previewForm.innerHTML = '';
      for (let mask in changeList) {
        if (changeList.hasOwnProperty(mask)) {
          const div = document.createElement('div');
          div.className = `hv-preview-${mask}`;
          switch (mask) {
            case 'author':
              div.innerHTML = UserLogin;
              previewForm.appendChild(div);
              break;
            case 'title':
              div.innerHTML = getUserTitle();
              previewForm.appendChild(div);
              break;
            case 'avatar':
              let src = getAvatar();
              div.innerHTML = '<img src="' + src + '">';
              previewForm.appendChild(div);
              break;
            case 'signature':
              break;
            default:
              div.innerHTML = '';
              previewForm.appendChild(div);
              break;
          }
        }
      }
    }

    function getStrMask() {
      let str = '';
      Object.keys(tmpMask).forEach(change => {
        str += `[${tmpMask[change].tag}]${tmpMask[change].value}[/${tmpMask[change].tag}]`;
      });
      return str;
    }

    const forbiddenTags = ['input', 'button', 'script', 'iframe', 'frame', 'style', 'audio', 'video', 'form',
      'footer', 'header', 'head', 'html', 'map', 'select', 'textarea', 'xmp', 'object', 'embed',
      'var', 'meta'];
    const forbiddenEvents = ['onblur', 'onchange', 'onclick', 'ondblclick', 'onfocus', 'onkeydown', 'onkeypress',
      'onkeyup', 'onload', 'onmousedown', 'onmousemove', 'onmouseout', 'onmouseover', 'onmouseup', 'onreset',
      'onselect', 'onscroll', 'onsubmit', 'onunload', 'javascript', 'onerror', 'oninput', 'onafterprint',
      'onbeforeprint', 'onbeforeunload', 'onhashchange', 'onmessage', 'onoffline', 'ononline', 'onpagehide',
      'onpageshow', 'onpopstate', 'onresize', 'onstorage', 'oncontextmenu', 'oninvalid', 'onreset', 'onsearch',
      'ondrag', 'ondragend', 'ondragenter', 'ondragleave', 'ondragover', 'ondragstart', 'ondrop', 'onmousedown',
      'onmousewheel', 'onwheel', 'oncopy', 'oncut', 'onpaste', 'onabort', 'oncanplay', 'oncanplaythrough',
      'oncuechange', 'ondurationchange', 'onemptied', 'onended', 'onerror', 'onloadeddata', 'onloadedmetadata',
      'onloadstart', 'onpause', 'onplay', 'onplaying', 'onprogress', 'onratechange', 'onseeked', 'onseeking',
      'onstalled', 'onsuspend', 'ontimeupdate', 'onvolumechange', 'onwaiting'];

    function strToHtml(str) {
      let forbiddenTag = '';
      let forbiddenTagsCheck = false;
      for (let i = 0; i < forbiddenTags.length; i++) {
        let pattern = new RegExp('(<|&lt;)' + forbiddenTags[i]);
        forbiddenTagsCheck = pattern.exec(str);
        if (forbiddenTagsCheck) {
          forbiddenTag = forbiddenTagsCheck[0].replace('&lt;', '');
          console.error(`Forbidden tag <${forbiddenTag}> in mask`);
          return '';
        }
      }
      for (let _i2 = 0; _i2 < forbiddenEvents.length; _i2++) {
        let _pattern = new RegExp(forbiddenEvents[_i2] + '=');
        forbiddenTagsCheck = _pattern.exec(str);
        if (forbiddenTagsCheck) {
          forbiddenTag = forbiddenTagsCheck[0].replace('&lt;', '');
          console.error(`Forbidden event <${forbiddenTag}> in mask`);
          return '';
        }
      }
      let check = /&lt;(.*?)?( xlink:| id=(.*?)?)/.test(str);
      if (check) {
        console.error('Forbidden tag properties in mask');
      }
      return check ? '' : str.replace(/&lt;/g, '<').replace(/&gt;/g, '>');
    }

    function bbcodeToHtml(str) {
      let tempStr = str.replace(/</gi, '&lt;');

      tempStr = tempStr.replace(/\n/gi, `<br />`);

      tempStr = tempStr.replace(/\[font=(.*?)\](.*?)\[\/font\]/gi, `<span style="font-family: $1">$2</span>`);
      tempStr = tempStr.replace(/\[size=(\d*?)\](.*?)\[\/size\]/gi, `<span style="font-family: $1px">$2</span>`);
      tempStr = tempStr.replace(/\[b\](.*?)\[\/b\]/gi, `<strong>$1</strong>`);

      tempStr = tempStr.replace(/\[i](.*?)\[\/i\]/gi, `<span style="font-style: italic">$1</span>`);
      tempStr = tempStr.replace(/\[u\](.*?)\[\/u\]/gi, `<em class="bbuline">$1</em>`);
      tempStr = tempStr.replace(/\[s\](.*?)\[\/s\]/gi, `<del>$1</del>`);

      tempStr = tempStr.replace(/\[align=([left|center|right]*?)\](.*?)\[\/align\]/gi,
        `<span style="display: block; text-align: $1">$2</span>`);
      tempStr = tempStr.replace(/\[url=(https?:\/\/.*?)\](.*?)\[\/url\]/gi,
        `<a href="$1" rel="nofollow" target="_blank">$2</a>`);
      tempStr = tempStr.replace(/\[url\](https?:\/\/.*?)\[\/url\]/gi,
        `<a href="$1" rel="nofollow" target="_blank">$1</a>`);
      tempStr = tempStr.replace(/\[color=(.*?)\](.*?)\[\/color\]/gi, `<span style="color: $1">$2</span>`);

      tempStr = tempStr.replace(/\[img\](https?:\/\/.*?\.(?:jpg|png|jpeg|gif))\[\/img\]/gi, `<img class="postimg" src="$1" alt="$1">`);

      tempStr = tempStr.replace(/\[you\]/gi, UserLogin);
      tempStr = tempStr.replace(/\[hr\]/gi, `<hr>`);
      tempStr = tempStr.replace(/\[sup\](.*?)\[\/sup\]/gi, `<sup>$1</sup>`);
      tempStr = tempStr.replace(/\[sub\](.*?)\[\/sub\]/gi, `<sub>$1</sub>`);
      tempStr = tempStr.replace(/\[mark\](.*?)\[\/mark\]/gi, `<span class="highlight-text">$1</span>`);
      tempStr = tempStr.replace(/\[abbr="(.*?)"\](.*?)\[\/abbr\]/gi, `<abbr title="$1">$2</abbr>`);

      return tempStr;
    }

    function checkHtml(html) {
      let forbiddenTagsCheck = false;
      for (let i = 0; i < forbiddenTags.length; i++) {
        let pattern = new RegExp('(<|&lt;)' + forbiddenTags[i]);
        forbiddenTagsCheck = pattern.exec(html);
        if (forbiddenTagsCheck) return true;
      }
      for (let _i3 = 0; _i3 < forbiddenEvents.length; _i3++) {
        let _pattern2 = new RegExp(forbiddenEvents[_i3] + '=');
        forbiddenTagsCheck = _pattern2.exec(html);
        if (forbiddenTagsCheck) return true;
      }
      return forbiddenTagsCheck;
    }

    function checkImage(src) {
      return (/\.jpg|\.png|\.gif/.test(src));
    }

    function checkAccess() {
      if (!FORUM.topic) return false;
      if (!opt.forumAccess || GroupID === 1 || GroupID === 2) return true;

      let forumName = getClearedForumName(FORUM.topic.forum_name);

      return opt.forumAccess[forumName] ?
        opt.forumAccess[forumName].includes(GroupTitle) :
        false;
    }

    function checkAccessExtended() {
      if (!FORUM.topic) return false;
      if (GroupID === 1 || GroupID === 2) return true;
      if (!opt.forumAccessExtended) return false;

      let forumName = getClearedForumName(FORUM.topic.forum_name);

      return opt.forumAccessExtended[forumName] ?
        opt.forumAccessExtended[forumName].includes(GroupTitle) :
        false;
    }

    function getStorageMask() {
      let mask = $.ajax({
        async: false,
        url: '/api.php',
        data: {
          method: 'storage.get',
          key: 'maskListUser'
        },
        success: function (result) {
          const response = result.response;

          if (response) {
            prevMasks = decodeURI(response.storage.data.maskListUser).split('|splitKey|');
            getMaskStorage();
          }
        }
      });
    }

    function getClearedPost(post, chList) {
      let codeBoxes = post.innerHTML.match(/<div class="code-box"><strong class="legend">([\s\S]*?)?<\/strong><div class="blockcode"><div class="scrollbox" style="(?:.*?)"><pre>([\s\S]*?)?<\/pre><\/div><\/div><\/div>/gi, '|code-box-replacer|');
      let text = post.innerHTML.replace(/<div class="code-box"><strong class="legend">([\s\S]*?)?<\/strong><div class="blockcode"><div class="scrollbox" style="(?:.*?)"><pre>([\s\S]*?)?<\/pre><\/div><\/div><\/div>/gi, '|code-box-replacer|')
        .replace(/<dl class="post-sig">([\s\S]*?)?<\/dl>/g, '');
      for (let ch in chList) {
        if (chList.hasOwnProperty(ch)) {
          let pattern = new RegExp('\\[' + chList[ch].tag + '\\]([\\s\\S]*?)\\[\/' + chList[ch].tag + '\\]', 'gi');
          text = text.replace(pattern, '');
        }
      }
      for (let i in codeBoxes) {
        text = text.replace(/\|code-box-replacer\|/i, codeBoxes[i]);
      }
      return text;
    }

    function getClearedForumName(name) {
      return name[0] === String.fromCharCode(173) ?
        name.substr(1) // совместимость со скриптом подфорумов
        : name;
    }

    function getAccessByForumName() {
      if (GroupID === 1 || GroupID === 2) return 'extended';

      const crumbs = document.getElementById('pun-crumbs1');
      const crumbLinks = crumbs.querySelectorAll('a[href*="viewforum"]');
      const link = crumbLinks[crumbLinks.length-1];
      let name = link.innerText;
      name = getClearedForumName(name);

      if ((opt.forumAccessExtended && opt.forumAccessExtended[name])) {
        if (opt.forumAccessExtended[name].includes(GroupTitle)) {
          return 'extended';
        }
      }
      if (opt.forumAccess && opt.forumAccess[name]) {
        if (opt.forumAccess[name].includes(GroupTitle)) {
          return 'common';
        }
      }
      if (!opt.forumAccess && GroupID !== 3) {
        return 'common';
      }

      return null;
    }

    function notifyAdmin() {
      if (GroupID !== 1) return;
      var prevTime = localStorage.getItem('hvssUpdateNotificationTime') || 0;
      var nowTime = Date.now();

      if (nowTime - prevTime < 86400000) return;

      $.jGrowl('Сервис анонсировал <a href="https://forum.mybb.ru/viewtopic.php?id=39134#p955012" target="_blank">поддержку https</a>. Скрипт маски перестанет работать через этот протокол, поэтому поменяйте <a href="https://forum.mybb.ru/viewtopic.php?id=31044&p=21#p890211" target="_blank">ссылку на него</a> в настройках своего форума.', {
        header: 'Обновление скрипта маски',
        sticky: true,
        close: function() {
          localStorage.setItem('hvssUpdateNotificationTime', nowTime);
        }
      });
    }

    document.addEventListener('DOMContentLoaded', () => {
      notifyAdmin();
      if (FORUM.topic) {
        getPosts();
        if (GroupID !== 3) {
          getDialog();
        }
      } else if (!FORUM.topic && FORUM.editor) {
        if (GroupID !== 3) {
          getDialog();
        }
        hidePreviewTags();
      } else {
        hideTags();
      }
    });
  }
};

