html {
    background:url(https://i.imgur.com/hxBFysF.jpg) 
               top center no-repeat fixed #242520;
    }

body {
    margin:0px !important;
    padding-top:160px !important;
    padding-bottom:130px !important;
    }

#pun {
    width:1000px !important;
    color:#323232;
    border-radius:40px;
    margin-top:0px !important;
    background:#eaeaea;
    border:1px solid #31a496;
    }

.punbb {
    width:950px !important;
    padding-left:25px !important;
    }


.punbb a, .punbb a:link, .punbb a:visited, .punbb-admin #pun-admain a, .punbb-admin #pun-admain a:link, .punbb-admin #punbb-admain a:visited, .punbb li.isactive a, .punbb li.isactive a:link, .punbb li.isactive a:visited, .punbb li.isactive a:focus {
    color:#2a897e;
    text-decoration:none;
    }

.punbb a:hover, .punbb a:focus, .punbb a:active, .punbb-admin #pun-admain .nodefault,
.punbb-admin #punbb-admain a:hover, .punbb-admin #punbb-admain a:focus, .punbb-admin #punbb-admain a:active, .punbb li.isactive a:focus {
    color:#92bbb3;
    text-decoration:none;
    }


#pun-navlinks {
    margin:-154px 0 0 230px !important;
    text-align:left !important;
    z-index:201;
    position:absolute;
    }

#pun-ulinks {
    position:absolute;
    display:block;
    margin:10px 0 0 255px !important;
    text-align:left!important;
    z-index:201!important;
    }


#pun-navlinks a:link, #pun-navlinks a:visited,
#navpiar a {
    display:inline-block;
    font:500 11px Arial Black !important;
    margin:2px 0px;
    text-transform:uppercase;
    text-decoration:none;
    color:#9e384b;
    letter-spacing:0px;
    }
#pun-navlinks a:hover, #pun-navlinks a:focus,
#pun-navlinks a:active, #navpiar {
    color:#7e9f9f;
    }

#pun-ulinks a:link, #pun-ulinks a:visited, #pun-ulinks a:hover, 
#pun-ulinks a:focus, #pun-ulinks a:active {
    font:500 11px manrope;
    letter-spacing:0px;
    text-transform:lowercase;
    color:#9b9b9b;
    }
#pun-ulinks a:hover, #pun-ulinks a:focus, #pun-ulinks a:active {
    color: #937c83 !important;
    }


#pun-status .container {
    margin:80px 0 10px 0px!important;
    font-size:11px;
    text-transform:lowercase;
    }
#pun-status .status-right {display:none;}

#pun-crumbs1 p.container, 
#pun-crumbs2 .container {
    font-size:11px !important;
    margin:0px 0 10px 0px!important;
    text-transform:lowercase;
    }

#pun-announcement {
    text-align:center !important;
    }

/*------------ category and statistics ----------------------------------*/


#pun-index #pun-main h2, #pun-stats.section h2 {
    height:35px;
    width:1002px;
    margin-left:-26px;
    padding-left:0px;
    border-top:1px solid #31a496;
    border-bottom:1px solid #31a496;
    background:url(https://i.imgur.com/p279yHs.jpg) 
               top left no-repeat #242520;
    background-size:100%;
    -webkit-background-size:100%;
    -o-background-size:100%;
    -moz-background-size:100%;
    }

#pun-index #pun-main h2 span,
#pun-stats.section h2 span {
    display:block;
    margin-left:0px;
    padding-left:250px;
    text-align:left;
    font:11px Arial Black;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#9e384b;
    line-height:36px;
    }

#pun-stats.section h2 {
    margin-bottom:0px!important;
    }

/*------------ icon ----------------------------------------------------*/

.punbb table Div.icon {
    display:block;
    position:absolute;
    text-align:right;
    width:20px;
    height:20px;
    margin:25px 0px 0 -36px;
    border-radius:100%;
    background:#eaeaea;
    border:1px solid #99b7b9;
    }

TR.inew Div.icon {
    background:#9e384b;
    }

TR.isticky Div.icon {
    background:#99b7b9;
    }

TR.iclosed Div.icon {
    background:#cdcdcd;
    }





/*------------ forumname + title -------------------------------------*/

#pun-index .tcl h3 {
    margin:0px -25px 10px -25px;
    text-align:right;
    height:26px;
    border-bottom:1px solid #99b7b9;
    outline:8px solid #eaeaea;
    }
    
#pun-index .tcl h3 a {
    display:block;
    margin-bottom:-10px;
    padding:0px 25px 0px 24px!important;
    font:900 25px manrope;
    text-transform:lowercase;
    color: #99b7b9;
    }
#pun-index .tcl h3 a:hover {
    color: #9e384b;
    }

/*------------ description ---------------------------------------------*/

#pun-index .forum-links {
    margin-top:0px;
    padding-top:3px;
    text-transform:lowercase;
    }
#pun-index .forum-links a:hover, #pun-index .forum-links a:active {
    color:#99b7b9 !important;
    }

#pun-index .forum-links a:link, #pun-index .forum-links a:visited {
    color:#9e384b;
    font:800 11px manrope;
    margin:0 15px 0 0;
    }

#pun-index .category table {
    margin-left:0px;
    border-spacing:10px 20px;
    text-transform:lowercase;
    }

.punbb td div.tclcon {
    margin-left:0px;
    padding: 10px 15px 0px 0px;
    border-left:none;
    }

.punbb td div.tclcon a:link, .punbb td div.tclcon a:visited {
    color:#843a3a;
    font: 900 11px manrope;
    }

#pun-index td.tcl {
    display:block;
    width:580px;
    padding:0px 10px 15px 25px;
    text-transform:lowercase;
    font:11px manrope;
    line-height:14px;
    border:1px solid #99b7b9;
    border-radius:0 30px 30px 0;
    }

.Add {display:none;}

#pun-index td.tc2, 
#pun-index td.tc3 {
    display:none;
    }

#pun-index td.tcr {
    font-size:11px;
    padding-right:0px;
    }

#pun-index td.tcr a:link, #pun-index td.tcr a:visited {
    font:900 11px manrope;
    text-transform:none;
    }

.punbb .user-avatar .avatar-image {
    width:25px !important;
    height:25px !important;
    border-radius:100% !important;
    border:0px solid #31ac9c;
    filter:grayscale(100%);
    }

.punbb .main.multipage table td div.tclcon  {
    border:none;
    }

.tclcon img {opacity:0.8; filter:grayscale(40%)!important;}
.tclcon img:hover {opacity:1; filter:grayscale(0%)!important;}

/*------------ footer -------------------------------------------------*/

.statscon {text-align:center;}
.statscon li.item1, .statscon li.item2,
.statscon li.item3, .statscon li.item4 {
    position:absolute;
    display:block;
    width:190px;
    text-align:right!important;
    font:500 8px manrope;
    letter-spacing:0px;
    text-transform:uppercase;
    color:#707070;
    }
.statscon li.item1 { margin-top:20px; }
.statscon li.item2 { margin-top:40px; }
.statscon li.item3 { margin-top:60px; }
.statscon li.item4 { margin-top:80px; }

.statscon li.item5 {
    display:block;
    font:11px manrope;
    margin-left:230px;
    width:720px!important;
    min-height:45px;
    text-align:justify!important;
    text-transform:lowercase;
    }

#pun-about .container {
    margin-top:0px;
    text-align:left !important;
    text-transform:uppercase;
    padding-left:230px !important;
    color:#b4b4b4;
    }
#pun-about .container a:link, #pun-about .container a:active,
#pun-about .container a:visited, #pun-about .container a:hover {
    font:8px manrope !important;
    padding:0 5px 0 5px !important;
    color:#b4b4b4;
    }


.banners {
    position:absolute;
    overflow-y:scroll;
    width:750px!important;
    height:73px!important;
    padding-right:10px!important;
    margin:20px 0 0px 190px!important;
    text-align:right;
    justify-content:space-between;
    }

.banners img {
    margin:0 10px 7px 0;
    filter: grayscale(100%) opacity(30%);
    transition: all .5s ease-in-out 0s;
    }
.banners img:hover {
    filter: none;
    transition: all .5s ease-in-out 0s;
    }


.banners::-webkit-scrollbar {width:1px; height:1px;}

.banners::-webkit-scrollbar-track:vertical {
    background:#d0d0d0 !important;
    }
.banners::-webkit-scrollbar-thumb:vertical {
    background:#899496 !important;
    }


/* -------------- page ------------------------------------------------- */

#pun-main h1 {
    font-size:0px;
    height:25px;
    }

#pun-main .topic h3 span {
    display:block;
    height:20px;
    border-bottom:1px solid #92bbb3;
    margin:10px 0px 10px 0px;
    }

#pun-main .topic h3 a,
#pun-viewtopic div.post h3 strong,
#pun-viewtopic div.post.topicpost h3 strong.fnt {
    font:500 13px Roboto;
    color:#2a897e;
    }

#pun-viewtopic div.post h3 strong.fnt img {height:7px;}


#pun-main .linkst .pagelink {
    font-size:10px;
    color:#606060;
    text-transform:lowercase;
    margin-top:0px;
    }

#pun-viewtopic .linkst .postlink a {
    display:block;
    margin-top:-25px;
    font-size:10px;
    color:#606060;
    text-transform:lowercase;
    font-weight:normal;
    padding-bottom:5px;
    }


#pun-main .post-links a {
    text-transform:uppercase;
    font:500 10px manrope, sans-serif;
    color:#606060;
    }

#pun-main .post-links a:hover {
    color:#2a898c;
    }


.punbb .post-content .quote-box, .punbb .post-content .code-box {
    padding:15px 20px 5px 20px;
    background:#e3e3e3;
    border:1px solid #92bbb3;
    border-radius:20px;
    text-align: justify;
    }

.punbb .post-content .quote-box cite,
.punbb .post-content .code-box strong.legend {
    display:block;
    margin:0px -20px 10px -20px!important;
    padding:0px 0px 10px 20px;
    border-bottom:1px solid #92bbb3;
    border-radius:0px;
    text-align: justify;
    font: 900 10px manrope !important;
    text-transform:uppercase;
    }
.code-box strong.legend a {
    color:#373737;
    }

.spoiler-box {
    padding:15px 20px 15px 20px !important;
    }


hr {
    background:#92bbb3; 
    height:1px;
    opacity:1!important;
    border:none!important;
    }


.punbb .formsubmit input, .punbb .formsubmit span, .punbb select, 
.punbb input, .inputfield.required.longinput input {
    display:inline-block;
    height:25px;
    padding:0 15px;
    background:#242422;
    border:1px solid #acacac;
    border-radius:15px;
    font:10px manrope;
    color:#eaeaea;
    text-transform:lowercase;
    letter-spacing:0.5px;
    }
.punbb .formsubmit input:hover, .punbb .formsubmit span:hover, .punbb select:hover, .punbb input:hover {
    background:#9e384b;
    }

#pun-viewtopic .subscribelink a {
    margin-top:0px;
    font-size:10px;
    color:#606060;
    text-transform:lowercase;
    }

#topic-users-in p.container {
    margin-left:230px;
    font-size:11px;
    }

#pun-main .linksb {padding-bottom:0px;}

#pun-main .linksb .pagelink {
    font-size:10px;
    color:#606060;
    text-transform:lowercase;
    }

#pun-viewtopic .linksb .postlink a {
    display:block;
    float:right;
    font-size:10px;
    color:#606060;
    text-transform:lowercase;
    font-weight:normal;
    }




.punbb #post.container {
    padding-left:0px !important;
    margin-right:40px;
    }

.punbb #post-form fieldset legend {
    display:block;
    margin:0px 0px -20px -10px;
    text-transform:uppercase;
    text-align:left;
    padding:0px 0px 0px 0px;
    }

.punbb #post-form fieldset legend #plng {
    font:8px Arial Black!important;
    color:#92bbb3 !important;
    }

.punbb .main.multipage #post-form #form-buttons {
    width:945px;
    }
.punbb #form-buttons {
    background:#8daca5;
    border-radius:0px;
    margin:0px 0 10px 0;
    }

#pun-main .fs-box {
    margin-top:25px;
    }

#togglePreview {
    float:right;
    margin-right:-40px;
    }

#main-reply, #pun-viewtopic #post-form textarea {
    background:#e3e3e3;
    border:1px solid #92bbb3;
    border-radius:20px;
    box-shadow:0px 0px 50px #d1d1d1 inset;
    font:12px Roboto;
    line-height:18px;
    padding:20px;
    }
#profile .fs-box.hashelp textarea {
    width:655px!important;
    }

.punbb #post-form .formsubmit {
  text-align:center;
    }
.fs-box.hashelp input, #togglePreview input {
    text-transform:uppercase;
    font:500 9px manrope;
    }
.punbb #post-form .formsubmit input {
    text-transform:uppercase;
    font:900 9px manrope;
    background:#eaeaea;
    color:#555;
    }
.punbb #post-form .formsubmit input:hover {
    background:#242422;
    color:#eaeaea;
    }

/* --------------- profile -------------------------------------------- */

.pa-fld1 .fld-name, .pa-fld2 .fld-name {display: none;}

.punbb .post .post-author {
    position:relative;
    margin-top:0px;
    margin-bottom:20px;
    margin-left:-25px;
    padding-bottom:0px;
    width:209px;
    background:#242520;
    border:1px solid #9e384b;
    border-left:none;
    border-radius:0 20px 20px 0;
    }

.punbb .post .post-author ul, .punbb .post .post-author p {
    text-align:center;
    padding:0px 0 0px 0;
    border-radius:0 17px 17px 0;
    }

#pun-viewtopic .pa-author {
    text-align:right;
    padding-right:15px;
    height:45px;
    line-height:50px;
    border-bottom:1px solid #9e384b;
    border-radius:0 17px 0 0;
    }

.pa-author, li.pa-author a:link, li.pa-author a:visited, 
li.pa-author a:hover, li.pa-author a:active {
    text-decoration:none;
    color:#92bbb3;
    font: 800 14px manrope, sans-serif;
    text-transform:uppercase;
    }

li.pa-title {
    text-align:right;
    margin:8px 0px 3px 25px;
    height:21px;
    width:170px;
    font: 400 8px manrope;
    text-transform:lowercase;
    color:#eaeaea;

    }

.pa-fld5 {
    position: absolute;
    top: 34px!important;
    left: 10px !important;
    border: 1px solid #9e384b !important;
    background: #9e384b;
    padding: 3px 3px !important;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    z-index: 9;
    }
.pa-fld5 img {
    width: 15px;
    height: 15px;
    }
.pa-fld5 a {
    width: 15px;
    height: 15px;
    display: block;
    }

.pa-avatar img {
    max-width:180px;
    margin-bottom:10px;
    border:1px solid #9e384b!important;
    }

li.pa-fld3 {
    margin:-20px 0 0px 0px;
    }

li.pa-fld1 {
    width:180px;
    height:30px;
    border-left:1px solid #9e384b;
    padding-left:10px!important;
    margin:0px 0 0px 25px;
    font:900 12px manrope;
    line-height:36px;
    text-transform:uppercase;
    text-align:left;
    }
li.pa-fld1 a:link, li.pa-fld1 a:visited {color:#6eaca4;}
li.pa-fld1 a:hover, li.pa-fld1 a:active {color:#eaeaea;}

li.pa-fld4 {
    width:168px;
    background:#242422;
    padding:15px!important;
    margin:0px 0 10px 10px;
    border:1px solid #9e384b;
    border-right:none;
    border-radius:15px 0 0 15px;
    font:10px manrope;
    line-height:13px;
    letter-spacing: 0.2px;
    text-transform:lowercase;
    text-align:justify;
    color:#eaeaea;
    }
li.pa-fld4 a:link, li.pa-fld4 a:visited {color:#92bbb3;}
li.pa-fld4 a:hover, li.pa-fld4 a:active {color:#9e384b;}


li.pa-fld2 {
    display:none;
    }

.pa-posts, .pa-respect {
    display:inline-block;
    width:96px;
    text-align:center;
    margin:0px 0 10px 0!important;
    padding:0 0 0px 0!important;
    font: 500 9px manrope;
    text-transform:lowercase;
    }

.pa-respect1, .pa-respect img {width:7px;mix-blend-mode: hard-light;filter: grayscale(1);}
.pa-fld2, .pa-posts, .pa-respect1, .pa-respect, li.pa-respect a:link, 
li.pa-respect a:visited, li.pa-respect a:active, li.pa-respect a:hover, 
li.pa-ip, li.pa-ip a:link {
    color: #eaeaea;
    }

li.pa-ip{
    font:8px manrope;
    padding:5px!important;
    opacity:0.8;
    }

li#guest.pa-online {display:none;}
li.pa-online {
    display:block;
    margin:0px 0 0 0 !important;
    padding:0px 0 0px 0!important;
    text-align:center;
    height:20px;
    font: 400 7px manrope;
    text-transform:uppercase;
    background:#9e384b;
    color:#242422;
    line-height:20px;
    border-radius:0 0 17px 0;
    }

.punbb .post-body {
    margin-left:205px !important;
    font:12px Arial;
    text-transform:none;
    }

.post-box {font:12px Arial;}


/* --------------- multipage ------------------------------------------- */

.main.multipage .container {
    padding:0px;
    margin-left:0px!important;
    font-size:10px;
  
    }

.main.multipage td div.tclcon {
    padding:0px;
    margin:15px 0 0px 30px;
    }

.main.multipage .hasicon .tcl {
    width:450px!important;
    }

.punbb .main.multipage thead, 
.punbb .main.multipage .user-avatar .avatar-image {
    display:none;
    }

.punbb .main.multipage Div.icon {
    margin:0 0 0 -10px;
    }

.punbb .main.multipage td div.tclcon a:link, .punbb td div.tclcon a:visited {
    color:#9e384b;
    font: 600 11px manrope;
text-transform: lowercase;
    }
.punbb .main.multipage td div.tclcon a:hover, .punbb td div.tclcon a:active {
    color:#2a897e;
    }

.linkst .postlink.long {
    margin-top:-45px;
    width:950px;
    padding-bottom:5px;
    border-bottom:1px solid #99b7b9;
    text-transform:lowercase;
    font-size:10px;
    }

.punbb .main.multipage tr.isub {
    display: none!important;
    }

#punbbsearch {margin-left:0px!important;}

.punbb .fs-box Div.icon {
    margin:0px 0px 0 0px;
    }
.punbb .fs-box div.tclcon {
    margin-left:70px;
    }


/* --------------- scrollbar ---------------------------------------- */

::-webkit-scrollbar {width:6px; height:6px;}

::-webkit-scrollbar-track:vertical {
    background:#d0d0d0 !important;
    }
::-webkit-scrollbar-thumb:vertical {
    background:#7e9f9f !important;
    }


/* --------------- arrows ---------------------------------------- */

.go-up, .go-down {
    cursor: pointer;
    display: none;
    opacity: 1;
    position: fixed;
    z-index: 9999;
    }

.go-up {
    top: 45%;
    margin-left: 1000px !important;
    }

.go-down {
    top: 47%;
    margin-left:1015px !important;
    }

.go-down:hover, .go-up:hover {
    opacity:0.5;
    }

/* Панель в форме ответа (коды принадлежат judascare & eos)
-------------------------------------------------------------*/
#font-area,
#size-area,
#color-area,
#table-area,
#image-area,
#imageup-area,
#imageattach-area,
#keyboard-area,
#video-area,
#addition-area,
#smilies-area,
#video-area,
#spoiler-area,
#float {
  background: var(--color-bg);
  border: 1px solid #525252 !important;
  border-top: none !important;
  color: var(--color-buttont);
}

#tags .container {
  text-transform: lowercase;
}

#tags .container a {
  color: var(--color-linkhov);
}

#tags .container a:hover {
  color: var(--color-inputbg);
}

#tags .container strong,
div#video-area-thd,
div#image-area-thd,
div#float strong {
  font-family: var(--fonthel);
  font-weight: normal !important;
  text-transform: lowercase !important;
  letter-spacing: 0.6px;
  color: var(--color-inputbg) !important;
  font-size: 12px;
}

#imageupload-left input[type=button] {
  width: auto !important;
  color: var(--color-text) !important;
  font-family: var(--fonthelb) !important;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  background: var(--color-accent) !important;
}

#addition-area div:hover,
#font-area div:hover,
#size-area div:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-radius: 0;
}

#keyboard-span input {
  background-color: rgba(255, 255, 255, 0.1) !important;
  font-size: 13px !important;
  color: var(--color-inputbg) !important;
}

#keyboard-span input:hover {
  background-color: var(--color-body) !important;
  color: var(--color-text) !important;
}

.uploadQueueItem .cancel a {
  font-weight: normal !important;
  color: var(--color-inputbg) !important;
}

#uploaded-images img {
  border: 1px solid var(--color-grey) !important;
}

#form-buttons td {
  color: #000000;
  font-weight: 400;
  font-size: 16px !important;
}

#form-buttons td:hover {
  color: var(--color-text);
  font-weight: normal !important;
  background: var(--color-body) !important;
  -webkit-box-shadow: 0 3px 0 0 var(--color-bg);
          box-shadow: 0 3px 0 0 var(--color-bg);
}

#button-image p {
  color: var(--color-body) !important;
}

.punbb #post .tabs .active a,
.punbb #post .tabs li a:hover {
  background: #686868 !important;
}



div.post-rating a, div.post-vote a {
    font: 12px Arial Black;
    text-decoration: none !important;


.punbb #post .tabs li a {
  background: #3c3c3c !important;
}

.hvStickerPackModal {
  border-radius: 0 !important;
  background: var(--color-selectt) !important;
}

.hvStickerPackModalTab {
  padding: 6px 12px !important;
  border-radius: 0 !important;
  background: rgba(0, 0, 0, 0.1) !important;
  font-size: 9px !important;
  letter-spacing: 1px !important;
  font-family: var(--fonthelb) !important;
  font-weight: normal !important;
  text-transform: uppercase !important;
  color: #222 !important;
}





