/*
FireOfWar, Enirin
© Design, ForumD.ru (Gerda, satsana), 2018—2026
*/

@charset "windows-1251";

@import url(style_cs.1780044847.css);

#pun-title,
#pun-index h1,
#pun-announcement h2,
#pun-navlinks h2,
#pun-ulinks h2,
#pun-status h2,
#profilenav h2,
#post-form h2,
.forum h2,
.topic h2,
.crumbs strong,
.divider hr,
.hidden,
.acchide,
.lastedit,
.post-sig dt {
    display: none;
}

.divider,
.clearer {
    clear: both;
}

#pun:after,
#pun-admain:after,
#pun-admain fieldset .adfs-box p:after {
    content: "" !important;
}

#pun-main h1,
#pun-main h2,
h3 {
    font-family: var(--fontTitle);
    text-align: center;
    line-height: 1.2em;
}

h3 {
    margin: 0.5em 0;
    font-size: 1.2em;
}

p {
    margin: 0 0 .5em;
}

table {
    width: 100%;
    margin: 0 0 .5em;
}

td {
    padding: 0.5em;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

img {
    max-width: 100%;
}

textarea,
input,
select,
button,
#form-buttons td img {
    font-family: var(--fontMain);
    font-size: 16px;
    background-color: var(--cButton);
    color: var(--cDark);
    border-color: var(--cBorder);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    max-width: 100%;
}

@media screen and (max-width: 979px) {
  input[type="text"],
  input[type="password"],
  input[type="url"] {
    width: 100%;
  }
}

textarea {
    resize: vertical;
    width: 100%;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    background-image: var(--arrv2);
    background-repeat: no-repeat;
    background-position: calc(100% - 4px) 50%;
    padding: 2px 3px;
    padding-right: 15px;
}

fieldset {
    border-color: var(--cBorder);
    margin: .5em 0;
}

fieldset fieldset {
    margin: 0;
    padding: 0 1em 0 0;
    border: none;
}

fieldset legend + fieldset,
fieldset:first-child {
    margin-top: 0;
}

label {
    cursor: pointer;
}

:focus-visible {
    outline-color: var(--cLinkHover);
    outline-width: 1px;
    outline-style: inset;
    outline-offset: -1px;
}

a {
    text-decoration: none;
    color: var(--cLink);
}
a:hover,
a:focus,
a:active {
    text-decoration: underline;
    color: var(--cLinkHover);
}

#pun-navlinks li a,
#pun-announcement a,
#html-footer a {
    color: var(--cLinkLight);
}

#pun-navlinks li a:hover,
#pun-ulinks a:hover {
    color: var(--cFire);
    text-decoration: none;
}

::selection {
    color: var(--cLight);
    background-color: #221611;
}

::-webkit-scrollbar,
::-webkit-scrollbar-corner {
    background-color: var(--cLight);
    width: 12px;
    height: 12px;
}
::-webkit-scrollbar-thumb,
::-webkit-scrollbar-button {
    -webkit-box-shadow: inset 0 0 10px var(--cShadow);
    box-shadow: inset 0 0 10px var(--cShadow);
    background-repeat: no-repeat;
    background-position: center;
    width: 12px;
    height: 12px;
}
::-webkit-scrollbar-button:horizontal:start {
    background-image: var(--arrh1);
}
::-webkit-scrollbar-button:horizontal:end {
    background-image: var(--arrh2);
}
::-webkit-scrollbar-button:vertical:start {
    background-image: var(--arrv1);
}
::-webkit-scrollbar-button:vertical:end {
    background-image: var(--arrv2);
}


/* Main */

body {
    min-width: 480px;
    margin: 0;
    font-family: var(--fontMain);
    font-size: 16px;
    color: var(--cDark);
    background-color: var(--cBack);
    background-image: var(--texture);
    background-repeat: repeat-y;
    background-position-x: center;
    background-position-y: 0, 100%, 482px;
    line-height: 1.2em;
    word-wrap: break-word;
}
@media screen and (min-width: 980px) {
  body {
    background-image: var(--top), var(--bottom), var(--texture);
    background-repeat: no-repeat, no-repeat, repeat-y;
  }
}
@media screen and (max-width: 1250px) {
  body {
    background-position-y: 0, calc(100% + 60px), 482px;
  }
}


#pun_wrap {
    margin: auto;
    padding-top: 62px;
    background: var(--topwrap) top no-repeat;
}

@media screen and (min-width: 980px) {
  #pun_wrap {
    margin-top: 482px;
  }
}

.punbb {
    position: relative;
    width: calc(98% - 60px);
    padding: 0 29px;
    margin: auto;
    background-repeat: repeat-y;
    background-position: left, right, center;
    background-image: var(--vline), var(--vline), var(--page);
    -webkit-background-size: auto, auto, calc(100% - 28px) auto;
    -moz-background-size: auto, auto, calc(100% - 28px) auto;
    -o-background-size: auto, auto, calc(100% - 28px) auto;
    background-size: auto, auto, calc(100% - 28px) auto;
}

.punbb::after {
    content: '';
    display: block;
    position: absolute;
    pointer-events: none;
}

#pun-break4 {
    position: absolute;
    z-index: 1;
    left: 44px;
    width: calc(100% - 88px);
    bottom: -40px;
    height: 13px;
    background: var(--skirt) top repeat-x;
}

#pun-break4::before {
    content: '';
    display: block;
    height: 7px;
    width: 100%;
    position: absolute;
    left: 0;
    top: -7px;
    background: var(--border2) center repeat-x;
}

@media screen and (max-width: 979px) {
  #pun-break4 {
    left: 2px;
    width: calc(100% - 4px);
    bottom: -18px;
  }
}

@media screen and (max-width: 979px) {
  .punbb:not(html)::before {
    content: '';
    display: block;
    position: absolute;
    pointer-events: none;
    width: calc(100% - 4px);
    height: 24px;
    left: 2px;
    top: -18px;
    background: var(--border1) center repeat-x;
  }
}

@media screen and (min-width: 980px) {
  .punbb {
    width: calc(98% - 230px);
    max-width: 1080px;
    padding: 0 60px;
    margin-bottom: 300px;
    background-image: var(--lline), var(--rline), var(--page);
    -webkit-background-size: auto, auto, calc(100% - 88px) auto;
    -moz-background-size: auto, auto, calc(100% - 88px) auto;
    -o-background-size: auto, auto, calc(100% - 88px) auto;
    background-size: auto, auto, calc(100% - 88px) auto;
  }
  .punbb::after {
    position: absolute;
    left: -1px;
    bottom: -200px;
    width: calc(100% - 318px);
    border-style: solid;
    border-color: transparent;
    border-width: 88px 160px 112px;
    -webkit-border-image: var(--bline) 88 160 112 161 round;
    -moz-border-image: var(--bline) 88 160 112 161 round;
    -o-border-image: var(--bline) 88 160 112 161 round;
    border-image: var(--bline) 88 160 112 161 round;
    background-image: var(--page);
    background-repeat: no-repeat;
    background-position: bottom;
    -webkit-background-size: calc(100% + 230px);
    -moz-background-size: calc(100% + 230px);
    -o-background-size: calc(100% + 230px);
    background-size: calc(100% + 230px);
  }
}

#pun-main {
    position: relative;
}

#pun-index #pun-main h2,
#pun-main h1,
#pun-stats h2,
#MyBookmarks h2 {
    clear: both;
    text-transform: uppercase;
    font-weight: normal;
    text-align: center;
    width: calc(100% + 30px);
    position: relative;
    left: -15px;
    height: 28px;
    line-height: 28px;
    background: var(--catc) center repeat-x;
    border-width: 24px 0;
    border-style: solid;
    border-color: transparent;
    -webkit-border-image: var(--border1) 24 0 repeat;
    -moz-border-image: var(--border1) 24 0 repeat;
    -o-border-image: var(--border1) 24 0 repeat;
    border-image: var(--border1) 24 0 repeat;
    font-size: 1.5em;
    margin: 0;
    position: relative;
    color: #120400;
    text-shadow: 0 1px 0 var(--hShadow);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#pun-index #pun-main h2,
#pun-stats h2 {
    font-weight: bold;
}

#pun-index #pun-main h2::before,
#pun-main h1::before,
#pun-stats h2::before,
#pun-index #pun-main h2::after,
#pun-main h1::after,
#pun-stats h2::after,
#MyBookmarks h2::after {
    content: '';
    display: block;
    width: 76px;
    height: 121px;
    position: absolute;
    top: -47px;
    pointer-events: none;
    z-index: 1;
}

.offctgr {
    z-index: 10;
    position: absolute;
    right: -28px;
    cursor: pointer;
}

@media screen and (max-width: 979px) {
  #pun-index #pun-main h2::before,
  #pun-main h1::before,
  #pun-stats h2::before,
  #pun-index #pun-main h2::after,
  #pun-main h1::after,
  #pun-stats h2::after,
  #MyBookmarks h2::after {
    display: none;
  }
  .offctgr {
    right: 4px;
  }
}

#pun-index #pun-main h2::before,
#pun-main h1::before,
#pun-stats h2::before {
    background: var(--catl) center no-repeat;
    left: -38px;
}

#pun-index #pun-main h2::after,
#pun-main h1::after,
#pun-stats h2::after,
#MyBookmarks h2::after {
    background: var(--catr) center no-repeat;
    right: -38px;
}

.crumbs {
    font-family: var(--fontTitle);
    font-size: 18px;
    font-weight: bold;
    margin: 0;
}

#pun-crumbs1 {
    margin-top: -1.5em;
    z-index: 1;
}

@media screen and (min-width: 980px) {
  #pun-crumbs1 {
    padding: 0 120px;
    text-align: center;
  }
}

#pun-crumbs2 {
    clear: both;
    margin-top: 1em;
}

.crumbs p {
    margin: 0;
}

.crumbs a,
.crumbs span {
    display: inline-block;
    padding: 0.5em 0.2em;
}

#pun-about,
#html-footer {
    position: absolute;
    z-index: 1;
    width: calc(100% - 120px);
    text-align: right;
    bottom: -74px;
}

#html-footer {
    bottom: -170px;
    padding-bottom: 20px;
}

#pun-about p {
    margin: 0;
}

#enirin,
#fdcop {
    color: var(--cLight);
    width: 100%;
    text-align: center;
}

@media screen and (max-width: 979px) {
  #pun-crumbs1 {
    margin-top: 0;
    padding: 0;
  }
  #pun-about {
    position: relative;
    bottom: -64px;
    width: 100%;
  }
  #pun-about a {
    color: var(--cLinkLight);
  }
  #html-footer {
    bottom: -124px;
    width: calc(100% - 56px);
  }
}


/* Header */

#menu {
    display: none;
}

@media screen and (max-width: 979px) {
  #html-header {
    position: relative;
    top: -62px;
  }
}

@media screen and (min-width: 980px) {
  #html-header {
    position: absolute;
    margin-left: calc(-1.02% - 115px);
    top: -544px;
    width: calc(102.04% + 110px);
  }

  #menu {
    display: block;
    width: 936px;
    padding: 0 12px;
    height: 106px;
    margin: auto;
    text-align: center;
    background: var(--topbar) top no-repeat;
    display: -webkit-flex;
    display: flex;
  }

  #menu a {
    color: var(--cGold);
    text-shadow: 1px 1px 2px black;
    text-decoration: none;
    text-transform: uppercase;
    line-height: 58px;
    font-size: 20px;
    font-family: var(--fontTitle);
    margin: 0 36px;
    width: 110px;
  }

  #menu a:hover {
    color: var(--cFire);
    text-shadow: 0px 0px 5px var(--cFire), 2px 3px 2px black;
  }

  #menu a#snd {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    text-align: left;
  }

  #menu a#thrd {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    text-align: right;
  }

  #menu #center {
    position: absolute;
    top: 0;
    left: calc(50% - 144px);
    margin: 0;
    width: 288px;
    height: 162px;
    background: var(--logo) top no-repeat;
  }
  #menu #center:hover {
    background: var(--logo1) top no-repeat;
  }

  #menu #center a {
    display: block;
    height: 100%;
    font-size: 0;
    color: transparent;
  }

  #pun-title {
    display: none;
    position: absolute;
    top: -378px;
    left: calc(50% - 120px);
    color: var(--cGold);
    margin: 0;
    padding: 10px;
    width: 220px;
    min-height: 46px;
    min-width: 70px;
    background-color: var(--cTBack);
    text-shadow: 1px 1px 2px black;
    text-align: center;
    line-height: 20px;
  }

  #html-header:hover + #pun-title {
    display: block;
  }

  #pun-title table {
    width: 100%;
    margin: 0;
  }

  #pun-title h1 {
    display: block;
    font-family: var(--fontMain);
    font-weight: normal;
    font-size: 1em;
  }

  #pun-title::before {
    content: '';
    position: absolute;
    top: -19px;
    left: -19px;
    width: calc(100% - 90px);
    height: calc(100% - 66px);
    pointer-events: none;
    border-style: solid;
    border-color: transparent;
    border-width: 52px 64px;
    -webkit-border-image: var(--frame1) 52 64 round;
    -moz-border-image: var(--frame1) 52 64 round;
    -o-border-image: var(--frame1) 52 64 round;
    border-image: var(--frame1) 52 64 round;
  }
}

#pun-announcement {
    background: var(--texture) center repeat-y;
    background-color: #d9bc8d;
    background-blend-mode: hard-light;
    color: var(--cLight);
    position: relative;
    width: calc(100% + 30px);
    margin-left: -15px;
}

#pun-announcement::before,
#pun-announcement::after {
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 24px;
    background: var(--border1) center repeat-x;
}

#pun-announcement::before {
    top: -19px;
}

#pun-announcement::after {
    bottom: -19px;
}

#pun-announcement .container{
    margin: auto;
    padding: 0.5em 0;
    text-align: justify;
}

#pun-announcement .s-tabs {
    display: block;
    margin: 0 5px;
    text-align: center;
}

#pun-announcement .s-tabs span {
    display: none;
}

#pun-announcement .s-tabs .stab {
    width: 100%;
    text-align: center;
    max-height: 230px;
    overflow: hidden;
}

#pun-announcement .s-link section {
    display: -webkit-flex;
    display: flex;
    width: 100%;
    -webkit-justify-content: space-evenly;
    justify-content: space-evenly;
    -webkit-align-items: center;
    align-items: center;
    height: 100%;
}

#pun-announcement .s-tabs .stab .stabEpisodes {
    width: 180px;
    float: left;
    display: block;
    text-transform: uppercase;
    text-align: left;
    line-height: 2em;
}

#pun-announcement .s-tabs .stab .stabEpisodesRight {
      float: right;
      text-align: right;
      padding-right: 10px;
}

#pun-announcement .s-tabs .stab .stabEpisodesLeft {
      padding-left: 10px;
}

#pun-announcement .s-tabs .stab .stabEpisodesLeft a::before {
    content: '\2727';
    margin-right: 0.5em;
}
#pun-announcement .s-tabs .stab .stabEpisodesRight a::after {
    content: '\2727';
    margin-left: 0.5em;
}

#pun-announcement .stabEpisodes li a {
    font-family: var(--fontTitle);
    color: var(--cLinkHover);
    margin-left: -5px;
    text-shadow: 2px 3px 2px black;
    -webkit-transition-duration: .7s;
    -moz-transition-duration: .7s;
    o-duration: .7s;
    transition-duration: .7s;
}

#pun-announcement .stabEpisodesRight li a {
    margin-left: 0px;
    margin-right: -5px;
}

#pun-announcement .stabEpisodes li a:hover {
    color: var(--cFire);
    text-shadow: 0px 0px 5px var(--cFire), 2px 3px 2px black;
    text-decoration: none;
}

#pun-status {
    margin-top: 20px;
    line-height: 2em;
}

@media screen and (max-width: 979px) {
  #pun-navlinks {
    position: absolute;
    top: -56px;
    left: 0;
    width: calc(100% - 48px);
    height: 42px;
    padding-left: 48px;
  }
  #pun-navlinks ul {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    width: 100%;
    height: 100%;
  }
  #pun-navlinks li a {
    font-size: 0;
    display: inline-block;
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
  }
  #pun-navlinks li a::before {
    font-family: var(--fontIcon);
    font-size: 20px;
  }
  #navindex a::before {content: '\f015';}
  #navuserlist a::before {content: '\f0c0';}
  #navrules a::before {content: '\f24e';}
  #navsearch a::before {content: '\f002';}
  #navprofile a::before {content: '\f2bb';}
  #navpm a::before {content: '\f27a';}
  #navadmin a::before {content: '\f013';}
  #navregister a::before {content: '\f234';}
  #navlogin a::before {content: '\f2f6';}
  #navpr_1 a::before {content: '\f21b';}
  #navlogout a::before {content: '\f2f5';}

  #pun-ulinks {
    padding: .5em 0 1.5em;
    text-align: right;
  }
  #pun-ulinks li {
    display: inline-block;
  }
  #pun-ulinks li a {
    margin-left: 1em;
    display: inline-block;
    line-height: 2em;
    font-weight: bold;
    font-family: var(--fontTitle);
  }
  #pun-ulinks li a:hover {
    text-decoration: underline;
  }
}

@media screen and (min-width: 980px) {
  #pun-navlinks,
  #pun-ulinks {
    background: var(--stripe) top no-repeat;
    color: var(--cLight);
    width: 224px;
    height: 305px;
    position: relative;
    z-index: 1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 24px;
    font-family: var(--fontTitle);
  }
  #pun-navlinks {
    float: left;
    -webkit-filter: drop-shadow(4px 0 3px rgba(0, 0, 0, .65));
    filter: drop-shadow(4px 0 3px rgba(0, 0, 0, .65));
    margin-left: -15px;
    font-size: 20px;
    line-height: 1.5em;
    text-align: center;
  }
  #pun-ulinks {
    float: right;
    -webkit-filter: drop-shadow(-4px 0 3px rgba(0, 0, 0, .65));
    filter: drop-shadow(-4px 0 3px rgba(0, 0, 0, .65));
    margin-right: -15px;
    padding-right: 60px;
    line-height: 1.5em;
  }
  #pun-ulinks::before {
    content: '';
    position: absolute;
    display: block;
    width: 98px;
    height: 192px;
    left: -32px;
    top: -4px;
    background: var(--sword) center no-repeat;
    pointer-events: none;
  }
  #pun-navlinks::before,
  #pun-ulinks::after {
    content: '';
    position: absolute;
    display: block;
    width: 450px;
    height: 652px;
    pointer-events: none;
  }
  #pun-navlinks::before {
    left: -108px;
    top: -96px;
    background: var(--navl) top no-repeat;
  }
  #pun-ulinks::after {
    right: -108px;
    top: -96px;
    background: var(--navr) top no-repeat;
  }
  #pun-ulinks li {
    display: block;
    text-align: right;
  }
  #pun-ulinks a {
    color: var(--cLinkLight);
  }
  #pun-ulinks a:hover {
    font-weight: bold;
  }

  #pun-announcement {
    margin: auto;
    width: calc(100% - 200px);
    height: 235px;
    padding-top: 10px;
  }

  #pun-announcement .container{
    width: calc(100% - 230px - 1em);
  }

  #pun-announcement .s-tabs span {
    cursor: pointer;
    display: inline-block;
    padding: 4px 8px;
    height: 22px;
    position: relative;
    top: -70px;
    border-radius: 3px;
    background-color: rgba(36, 4, 4, 0.6);
    border: 1px solid #250203;
    margin: 0 2px;
    color: var(--cLinkLight);
  }
  #pun-announcement .s-tabs span:hover {
    background-color: rgba(201, 0, 0, 0.4);
    color: var(--cLight);
  }
  #pun-announcement .s-tabs span.selected {
    background-color: rgba(15, 0, 0, 0.7);
    border: 1px solid #000;
    color: #c03a3b;
  }

  #pun-announcement .s-tabs .stab {
    margin-top: -30px;
    display: none;
    height: 224px;
    overflow: hidden;
  }

  #pun-status {
    width: 214px;
    position: absolute;
    top: 210px;
    right: 52px;
    padding-top: 15px;
    margin: 0;
    color: var(--cLight);
    font-family: var(--fontTitle);
    font-size: 12px;
    line-height: 1.2em;
    text-align: center;
    z-index: 1;
  }

  #pun-status span {
    display: block;
  }
  #pun-status span.status-right {
    float: none;
    display: block;
  }
  #pun-status::before {
    content: '';
    position: absolute;
    display: block;
    width: 210px;
    height: 14px;
    left: 0;
    top: 0;
    background: var(--separator0) center no-repeat;
  }

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

@media screen and (max-width: 1050px) {
  #pun-announcement .s-tabs .stab {
    font-size: .9em;
  }
}
@media screen and (min-width: 1200px) {
  #pun-announcement .s-tabs .stab {
    font-size: 1.1em;
    padding: 0.5em 2em;
    box-sizing: border-box;
  }
}


/* Pages */

#pun-main {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
}

.pagelink,
.postlink,
.subscribelink,
.modmenu,
#profilenav {
    margin: 0;
    font-size: 15px;
    font-family: var(--fontTitle);
}

.postlink {
    text-align: right;
}

#profilenav li {
    display: inline-block;
}

.pagelink a,
.pagelink strong,
.postlink a,
.subscribelink a,
.modmenu a,
#profilenav a {
    font-weight: bold;
    display: inline-block;
    margin: 0 0.2em;
    padding: 0 0.3em;
    line-height: 2em;
}

.modmenu strong a {
    margin: 0;
    padding: 0;
}

.linkst {
    min-height: 2em;
    -webkit-order: -1;
    order: -1;
}

.postlink span:last-of-type a,
.modmenu span a:last-of-type {
    margin-right: 0;
    padding-right: 0;
}

.modmenu:not(#topic-users-in) span,
.linksb .postlink {
    float: right;
}

noindex .postlink.long {
    width: auto;
}

.linkst .pagelink {
    float: left;
}

.subscribelink {
    text-align: center;
    padding: 0.5em 0;
}

.modmenu:not(#topic-users-in) {
    height: 38px;
    font-family: var(--fontTitle);
    font-size: 18px;
    background: var(--th) center repeat;
    border-width: 0 0 3px;
    border-style: solid;
    border-color: transparent;
    -webkit-border-image: var(--border3) 0 0 3 repeat;
    -moz-border-image: var(--border3) 0 0 3 repeat;
    -o-border-image: var(--border3) 0 0 3 repeat;
    border-image: var(--border3) 0 0 3 repeat;
    padding: 0 15px;
    margin: 0 -15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.modmenu select {
    position: relative;
    top: 6px;
}


/* Tables */

#pun-index #pun-main {
    margin-top: 8px;
}

.category,
#pun-stats {
    margin-top: -8px;
}

.forum td,
.category td {
    padding: 1em 0;
}

.tcl {
    text-align: left;
}

.forum .tcl {
    width: 50%;
}

.category .tcl {
    padding-left: 15px;
    width: 50%;
}

.forum th.tcl,
.category th.tcl {
    padding-left: 84px;
    width: 50%;
}

.tcl h3 {
    text-align: left;
    margin-top: 0;
}

.icon {
    -moz-opacity: 0.5;
    opacity: 0.5;
    height: 62px;
    width: 56px;
    background-image: var(--icon);
    background-repeat: no-repeat;
    background-position: -220px 0;
    margin-right: 12px;
    float: left;
}

.iclosed .icon {background-position: -72px 0;}
.isticky .icon {background-position: 0 0;}
.inew .icon {
    -moz-opacity: 1;
    opacity: 1;
}

.stickytext,
.closedatafield {
    font-size: 0;
    float: right;
}

.stickytext::before,
.closedatafield::before {
    font-family: var(--fontIcon);
    font-style: normal;
    font-size: 12px;
}
.stickytext::before {content: '\202F\f071';}
.closedatafield::before {content: '\202F\f023';}

.tc2,
.tc3 {
    text-align: center;
    width: 104px;
}

.tcr {
    text-align: right;
}

.category .tcr,
.forum .tcr {
    -webkit-flex: 1;
    flex: 1;
}

.category .tcr {
    padding-right: 15px;
}

.category th.tcr,
.forum th.tcr {
    padding-right: 60px;
}

.punbb .tcr .user-avatar {
    float: right;
    margin: 0 0 0 0.5em;
}

.punbb .tcr .user-avatar .avatar-image {
    background-position: top;
}

.category .container {
    margin: -6px -15px;
}

.category table,
.category tbody,
.forum table,
.forum tbody {
    display: block;
    margin: 0;
}

.category thead,
.forum thead {
    display: block;
    background: var(--th) center repeat;
    border-width: 0 0 3px;
    border-style: solid;
    border-color: transparent;
    -webkit-border-image: var(--border3) 0 0 3 repeat;
    -moz-border-image: var(--border3) 0 0 3 repeat;
    -o-border-image: var(--border3) 0 0 3 repeat;
    border-image: var(--border3) 0 0 3 repeat;
    color: #7d7658;
    font-family: var(--fontTitle);
    font-size: 14px;
    font-weight: normal;
    font-variant: all-small-caps;
}

.forum thead {
    margin: -6px -15px 0;
}

.category tr,
.forum tr {
    display: -webkit-flex;
    display: flex;
    width: 100%;
    position: relative;
}

.category tbody tr,
.forum tbody tr {
    min-height: 96px;
}

.category tbody tr {
    background-color: rgba(37, 25, 20, .25);
    padding-bottom: 7px;
    -webkit-align-items: center;
    align-items: center;
}

.category tbody tr:hover {
    background-color: transparent;
}

.category tbody tr::after,
#pun-stats ul::after,
#onlinelist::after,
.forum tbody tr::after {
    content: '';
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    background: var(--border3) center repeat-x;
}

.forum tbody tr::after,
#pun-stats ul::after,
#onlinelist::after {
    margin: 0 -15px;
    width: calc(100% + 32px);
}

.category tbody tr::after,
#pun-stats ul::after,
#onlinelist::after {
    height: 7px;
    background: var(--border2) center repeat-x;
}

.category th,
.category td,
.forum th,
.forum td {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 1059px) {
  .forum .tc3,
  .category .tc3 {
    display: none;
  }
}

@media screen and (max-width: 719px) {
  .category tbody tr,
  .forum tbody tr {
    display: block;
  }
  .forum .tc2,
  .category .tc2 {
    display: none;
  }
  .category tbody .tcl,
  .forum tbody .tcl {
    display: block;
    width: 100%;
  }
  .category tbody .tcr,
  .forum tbody .tcr {
    display: block;
    margin-left: 60px;
    width: calc(100% - 60px);
    padding-top: 0;
  }
  .category th.tcr,
  .forum th.tcr {
    padding-right: 15px;
  }
  .category .tcr br,
  em.user-avatar {
    display: none;
  }
  .category .lastpost {
    margin-left: 0.5em;
  }
}
@media screen and (min-width: 720px) {
  .category .lastpost {
    margin-right: 44px;
  }
}

#pun-stats ul {
    position: relative;
}

#pun-stats li.item1, #pun-stats li.item2 {
    float: left;
    clear: both;
    line-height: 150%;
}

#pun-stats li.item3, #pun-stats li.item4 {
    text-align: right;
    line-height: 150%;
}

#pun-stats li.item4 {
    padding-bottom: 12px;
}

li#onlinelist {
    position: relative;
    float: left;
    width: 100%;
    line-height: 130%;
}

li#onlinelist div {
    padding: 15px 0 24px;
}


/* Topic */

.topic {
    margin: -6px -15px 0;
}

.post:not(.mask-area-preview)::after {
    content: '';
    display: block;
    width: 100%;
    height: 24px;
    margin-top: -5px;
    margin-bottom: -5px;
    background: var(--border1) center repeat-x;
    pointer-events: none;
}

.post h3 {
    margin: 0;
    padding: 0.5em 15px;
    height: 16px;
    line-height: 16px;
    color: #fcedc6;
    background: var(--th) center repeat;
    border-width: 0 0 3px;
    border-style: solid;
    border-color: transparent;
    -webkit-border-image: var(--border3) 0 0 3 repeat;
    -moz-border-image: var(--border3) 0 0 3 repeat;
    -o-border-image: var(--border3) 0 0 3 repeat;
    border-image: var(--border3) 0 0 3 repeat;
    font-weight: normal;
    text-align: right;
}

.post h3 strong {
    margin-left: 1em;
    font-weight: normal;
    float: right;
}

.post h3 strong::before {
    content: '#';
}

.post h3 a,
.post-author a,
.post-links a,
.modmenu:not(#topic-users-in) a {
    color: var(--cLinkLight);
}

.post h3 a:hover,
.pa-author a:hover,
.post-links a:hover,
.modmenu:not(#topic-users-in) a:hover {
    color: var(--cLinkHover);
    text-decoration: none;
}

.post > .container {
    display: -webkit-flex;
    display: flex;
    width: 100%;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.post-author,
.post-body,
.post-links {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
}

.post-author {
    position: relative;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    background-color: var(--cPBack);
    border-width: 0;
    border-style: solid;
    border-color: transparent;
    -webkit-border-image: var(--vline0) 0 3 0 0 repeat;
    -moz-border-image: var(--vline0) 0 3 0 0 repeat;
    -o-border-image: var(--vline0) 0 3 0 0 repeat;
    border-image: var(--vline0) 0 3 0 0 repeat;
    color: var(--cLight);
    line-height: 1.5em;
    padding: 0 15px;
}

.post-author::after {
    content: '';
    display: block;
    clear: both;
    width: calc(100% + 32px);
    height: 3px;
    margin-left: -16px;
    background: var(--border3) center repeat-x;
}

.pa-author {
    padding: 0.5em 0;
    height: 16px;
    line-height: 16px;
    position: absolute;
    top: -38px;
    font-family: var(--fontTitle);
    font-size: 1.4em;
}

.punbb .pa-author .flag-i {
    width: 1em;
    position: absolute;
    left: -35px;
}

@media screen and (max-width: 640px) {
  .post h3 {
    font-size: 1em;
  }
  .pa-author {
    font-size: 1.2em;
  }
}

.pa-title {
    font-style: italic;
    color: #d6d5d5;
    margin-bottom: 0.5em;
    font-family: var(--fontTitle);
    font-size: 1.2em;
}

.pa-avatar img {
    border: 2px solid #1a0100;
    box-shadow: 0 0 8px #000;
    margin: 4px 0;
}

.post-img-Sp {
    max-width: 33.3%;
    position: relative;
}

@media screen and (min-width: 720px) {
  .post-author {
    width: 150px;
    border-right-width: 3px;
  }
  .post-author::after {
    display: none;
  }
  .post-body {
    width: calc(100% - 150px);
  }
  .pa-author {
    width: 120px;
    text-align: center;
    white-space: nowrap;
    overflow: visible;
  }
  .pa-title {
    text-align: center;
    margin-top: 0.5em;
    line-height: 1em;
  }
  .pa-avatar {
    text-align: center;
  }
  .post-img-Sp.Spb1 {
    left: -10px;
  }
  .post-img-Sp.Spb3 {
    right: -10px;
  }
  .post-author ul ul {
    font-size: .8em;
  }
}

@media screen and (min-width: 1000px) {
  .post-author {
    width: 208px;
  }
  .post-body {
    width: calc(100% - 208px);
  }
  .pa-author {
    width: 178px;
  }
  .post-author ul ul {
    font-size: 1em;
  }
}

@media screen and (max-width: 719px) {
  .post-author > ul {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    padding-bottom: 4px;
  }
  .pa-avatar {
    order: -1;
  }
  .pa-avatar img {
    max-width: 70px;
  }
  .pa-title {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    margin-left: 0.5em;
  }
  .post-author ul > img {
    -webkit-order: 2;
    order: 2;
  }
  .post-ul-Sp {
    position: absolute;
    z-index: 2;
    right: 15px;
    top: 80px;
    margin: 0;
    padding: 10px;
    min-height: 46px;
    min-width: 70px;
    max-width: 390px;
    background-color: var(--cTBack);
  }
  .post-ul-Sp::before {
    content: '';
    position: absolute;
    top: -19px;
    left: -19px;
    width: calc(100% - 90px);
    height: calc(100% - 66px);
    pointer-events: none;
    border-style: solid;
    border-color: transparent;
    border-width: 52px 64px;
    -webkit-border-image: var(--frame1) 52 64 round;
    -moz-border-image: var(--frame1) 52 64 round;
    -o-border-image: var(--frame1) 52 64 round;
    border-image: var(--frame1) 52 64 round;
  }
  .pa-online {
    position: absolute;
    right: 15px;
    bottom: 8px;
    max-width: calc(100% - 114px);
    text-align: right;
  }
  .pa-online strong {
    font-weight: normal;
  }
}

.post-body {
    padding: 0.5em 15px 0;
    text-align: justify;
}

.post-content {
    margin-bottom: 1em;
    line-height: 1.4em;
}

dl {
    margin: 1em 0 0;
}

dd {
    margin: 0;
}

.post-sig::before {
    content: '';
    display: block;
    margin: 0.5em 0;
    height: 14px;
    background: var(--separator) center no-repeat;
    -webkit-background-size: 100% 14px;
    -moz-background-size: 100% 14px;
    -o-background-size: 100% 14px;
    background-size: 100% 14px;
}

.post-rating {
    float: right;
}
.post-vote {
    display: inline-block !important;
    font-size: 2em;
    line-height: 20px;
}
div.post-vote p.container {
    padding: 0 !important;
    margin: 0 !important;
}
.positive,
.negative {
    display: inline-block !important;
    width: 24px;
    height: 24px;
    color: transparent !important;
    background: url(https://i.gyazo.com/b9ccb0b9e5ac0ceb66e94ef850ddd7ea.png) center no-repeat;
}
.positive:hover,
.negative:hover {
    background-image: url(https://i.gyazo.com/af3aeb41380030f6dd8bd0a3be4cf1b6.png);
}
div.post-vote p a.negative {
    transform: rotate(0.5turn);
    margin: 0 40px;
}

.post-links {
    margin: 0;
    padding: 0.5em 15px;
    height: 38px;
    line-height: 16px;
    font-family: var(--fontTitle);
    font-size: 18px;
    background: var(--th) center repeat;
    border-width: 3px 0 0;
    border-style: solid;
    border-color: transparent;
    -webkit-border-image: var(--border3) 3 0 0 repeat;
    -moz-border-image: var(--border3) 3 0 0 repeat;
    -o-border-image: var(--border3) 3 0 0 repeat;
    border-image: var(--border3) 3 0 0 repeat;
    text-align: right;
}

.post-links li {
    display: inline-block;
}

.pl-email {
    float: left;
    margin-right: 0.3em;
}

@media screen and (max-width: 560px) {
  .post-links li,
  .topic h3 a.sharelink {
    font-size: 0;
    margin-left: 20px;
  }
  .post-links .pl-email {
    margin-left: 0;
    margin-right: 20px;
  }
  .post-links a:before,
  .sharelink:before {
    font-family: var(--fontIcon);
    font-size: 16px;
  }
  .post-links .profile a::before {content: '\f406';}
  .post-links .pm a::before {content: '\f27a';}
  .post-links .email a::before {content: '\f0e0';}
  .post-links .pl-delete a::before {content: '\f2ed';}
  .post-links .pl-edit a::before {content: '\f044';}
  .post-links .pl-quote a::before {content: '\f086';}
  .sharelink:before {content: '\f1e0';}
}


#tags {
    position: relative;
}

#tags .container {
    position: absolute;
    z-index: 10;
    top: 0 !important;
    max-width: 90%;
    max-height: none;
    margin: 0.5em 0 0;
    background-color: var(--cButton);
    box-shadow: 0 0 8px #000;
    padding: 0.5em;
    text-align: justify;
}

#tags #keyboard-area {
    width: 436px;
    max-width: unset;
}

@media screen and (max-width: 719px) {
  #form-buttons tr {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    gap: 4px;
    row-gap: 8px;
  }
}

#form-buttons td {
    position: relative;
    background: none !important;
}

#form-buttons td::before {
    font-family: var(--fontIcon);
    font-size: 14px;
    line-height: 26px;
    display: block;
    height: 26px;
    width: 100%;
    position: absolute;
    pointer-events: none;
}

#button-transL::before {content: '\f1ab';}
#button-font::before {content: '\f031';}
#button-size::before {content: '\f034';}
#button-bold::before {content: '\f032';}
#button-italic::before {content: '\f033';}
#button-underline::before {content: '\f0cd';}
#button-strike::before {content: '\f0cc';}
#button-indent::before {content: '\f03c';}
#button-left::before {content: '\f036';}
#button-center::before {content: '\f037';}
#button-right::before {content: '\f038';}
#button-link::before {content: '\f0c1';}
#button-spoiler::before {content: '\f518';}
#button-image::before {content: '\f03e';}
#form-audio::before {content: '\f025';}
#button-video::before {content: '\f03d';}
#button-hide::before {content: '\f023';}
#button-quote::before {content: '\f10e';}
#button-code::before {content: '\f121';}
#button-color::before {content: '\f53f';}
#button-table::before {content: '\f00b';}
#button-smile::before {content: '\f118';}
#button-mask::before {content: '\f630';}
#button-keyboard::before {content: '\f11c';}
#button-addition::before {content: '\f0d7';}

#form-buttons td img {
    border-width: 2px;
    border-style: outset;
}

#form-buttons td:hover::before {
    color: var(--cLinkHover);
}

.add_float {
    height: 18px !important;
    width: auto !important;
    position: absolute;
    z-index: 1;
    top: -14px;
    opacity: 0;
}

.add_float:first-of-type {
    left: -6px;
}

.add_float:last-of-type {
    right: -6px;
}

#button-image:hover .add_float {
    opacity: 1;
}

#rollHelp {
    display: inline-block;
    position: absolute;
    z-index: 2;
    right: 0;
    top: calc(100% + 10px);
    margin: 0;
    padding: 10px;
    background-color: var(--cTBack);
    color: var(--cLight);
}

#rollHelp::before {
    content: '';
    position: absolute;
    top: -19px;
    left: -19px;
    width: calc(100% - 90px);
    height: calc(100% - 66px);
    pointer-events: none;
    border-style: solid;
    border-color: transparent;
    border-width: 52px 64px;
    -webkit-border-image: var(--frame1) 52 64 round;
    -moz-border-image: var(--frame1) 52 64 round;
    -o-border-image: var(--frame1) 52 64 round;
    border-image: var(--frame1) 52 64 round;
}

#tr-list {
    min-width: unset !important;
}

#tr-list .adinput {
    display: block;
    margin-top: 1em;
}

#tr-list .adinput input {
    width: auto;
}

#tr-list .material-icons {
    font-size: 0;
    line-height: 26px;
    display: inline-block;
    height: 26px;
    width: 26px;
    background-color: var(--cButton);
    color: var(--cDark);
    border-color: var(--cBorder);
    border-width: 2px;
    border-style: outset;
    cursor: pointer;
    margin: 4px 0 4px 8px;
    font-style: normal;
    text-align: center;
}

#tr-list h1 .material-icons {
    background: none;
    border: none;
    margin: 0 15px;
}

#tr-list .material-icons:hover {
    color: var(--cLinkHover);
}

#tr-list .material-icons::before {
    font-family: var(--fontIcon);
    font-size: 18px;
}

#tr-list #addtrack::before {
    content: '\f055';
}

#tr-list #deltrack::before {
    content: '\f056';
}

#tr-list h1 .material-icons::before {
    content: '\f057';
}


/* Post */

.punbb em.bbuline {
    font-style: normal;
    text-decoration: underline;
}

.punbb .post-content img {
    vertical-align: text-bottom
}

.punbb .post-content img.postimg {
    vertical-align: middle;
}

.punbb .post-content img.postimg[alt*="float:right"] {
    float: right;
    padding-left: 12px;
}

.punbb .post-content img.postimg[alt*="float:left"] {
    float: left;
    padding-right: 12px;
}

.imgWrap {
    padding: 0 12px;
    max-width: 100%;
    margin-bottom: 5px;
}

.imgTitle {
    width: 100%;
    display: block;
    font-style: italic;
    text-align: center;
}


/* Other */

.yrarrows {
    position: fixed;
    margin: 0;
    z-index: 999;
    right: 1%;
    bottom: 50px;
}

.yrarrows a {
    display: block;
    width: 40px;
    height: 40px;
    font-size: 0;
    color: transparent;
}

.yrarrows .cont {
    right: -1px;
    margin-top: -10px;
    margin-bottom: -10px;
    position: relative;
    z-index: 1;
    height: 30px;
    background: var(--arrc) center no-repeat;
}

.yrarrows .top {
    background: var(--arrt) center no-repeat;
}

.yrarrows .top:hover {
    background: var(--arrta) center no-repeat;
}

.yrarrows .bottom {
    background: var(--arrb) center no-repeat;
}

.yrarrows .bottom:hover {
    background: var(--arrba) center no-repeat;
}

@media screen and (max-width: 979px) {
  #menu {
    display: none;
  }
  .yrarrows {
    right: 20px;
  }
  .yrarrows:not(.active) {
    display: none;
  }
  .yrarrows .cont {
    margin-top: 15px;
    margin-bottom: 15px;
    height: 40px;
  }
  .punbb {
    margin-top: 0;
  }
}

@media screen and (min-width: 1352px) {
  .yrarrows {
    right: calc(51% - 670px);
  }
}


#MyBookmarks {
    border-width: 0 3px 0 0;
    border-style: solid;
    border-color: transparent;
    -webkit-border-image: var(--vline0) 0 3 0 0 repeat;
    -moz-border-image: var(--vline0) 0 3 0 0 repeat;
    -o-border-image: var(--vline0) 0 3 0 0 repeat;
    border-image: var(--vline0) 0 3 0 0 repeat;
}

#MyBookmarks h2 {
    width: calc(100% - 32px) !important;
    margin: -6px 0 -6px -20px !important;
    padding: 0 20px 0 48px !important;
    font-size: 18px !important;
    font-weight: bold;
}

#MyBookmarks h2 strong {
    margin-left: 0.2em;
}

#MyBookmarks .container {
    background-color: var(--cTBack);
    color: var(--cLight);
}

#MyBookmarks .container a {
    color: var(--cLinkLight);
}

#MyBookmarks .container li span strong {
    font-weight: bold;
}

#MyBookmarks .container span.scrl span:before {
    font-family: var(--fontIcon);
    font-size: 20px;
    content: "\f106";
}


#loginDiv {
    position: absolute;
    z-index: 1;
    left: calc(50% - 210px);
    top: 48px;
    color: var(--cLight);
    margin: 0;
    padding: 10px;
    width: 420px;
    min-height: 46px;
    background-color: var(--cTBack);
    text-align: center;
    line-height: 20px;
}

@media screen and (min-width: 980px) {
  #loginDiv {
    left: 64px;
  }
}

#loginDiv::before {
    content: '';
    position: absolute;
    top: -19px;
    left: -19px;
    width: calc(100% - 90px);
    height: calc(100% - 66px);
    pointer-events: none;
    border-style: solid;
    border-color: transparent;
    border-width: 52px 64px;
    -webkit-border-image: var(--frame1) 52 64 round;
    -moz-border-image: var(--frame1) 52 64 round;
    -o-border-image: var(--frame1) 52 64 round;
    border-image: var(--frame1) 52 64 round;
}

#loginDiv a {
    color: var(--cLinkLight);
}

#pun-navlinks #closeButton {
    font-size: 18px;
    line-height: 20px;
    display: block;
    width: 20px;
    height: 20px;
    text-align: center;
    float: right;
    text-decoration: none;
}

#pun-navlinks #closeButton::before {
    font-family: var(--fontIcon);
    content: "\f00d";
    font-weight: bold;
}

#form_login {
    margin-top: 20px;
}

#loginDiv .formsubmit {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin: 0;
}