.byuser {/*display:block;*/}

#reputationText {width:90%;}

/* оформление в предпросмотре */
#profile-right li#pa-invites,
#viewprofile-next #profilenav {display: none;}
#viewprofile table, #viewprofile tbody, #viewprofile td {display: block;}
#viewprofile tr {
  display: grid;
  gap: 10px 20px;
  grid-template-columns: 230px auto;
}
#viewprofile #profile-right {width: auto;}
#viewprofile #profile-left {width: 230px; height: 300px; background: var(--one3);}
#viewprofile ul  {
padding: 10px;
margin: 0 0 10px 0;
font-family: Arial Narrow;
text-transform: lowercase;
font-size: 13px;
}
#viewprofile li {margin-bottom:2px;}
#viewprofile li span {
padding: 5px 10px;
}
#viewprofile li strong, #viewprofile li div {
display: block;
padding: 5px 10px;
font-weight: normal;
}
#viewprofile #profile-right li strong {padding:5px;}
#post fieldset .hashelp div input {}

#profile-left {position: relative}
#profile-left li#profile-name {padding: 10px 10px 0px;}
#viewprofile #profile-left strong {font-weight: bold !important;}
#profile-title {
/*position: absolute;
top: 0;*/
width: 100%;
}
#viewprofile #profile-left strong {font-weight: normal !important;}

#profile-right li {
display: inline-block;
text-transform: lowercase;
margin: 10px;
border: 1px solid var(--one2);
background: var(--one3);
border-radius: 5px;
padding: 4px 0;
text-align: center;
border-radius: 10px;
}

/* оформление полей в предпросмотре профиля */
/* репутация, позитив */
#profile-right li#pa-respect,
#profile-right li#pa-positive {
  background: var(--one4);
  color: var(--one3);
  width: 100px;
}
#profile-right li#pa-respect a,
#profile-right li#pa-positive a {
  color: var(--one3);
}

/* поле 1 */
#profile-right li#pa-fld1 {
  background: var(--one1);
  width: 135px;
  color: var(--one3);
position: relative;
top: -73px;
left: 180px;
}

/* поле 2 */
#profile-right li#pa-fld2 {
  display: none;
}

#profile-right li#pa-fld2 span,
#profile-right li#pa-email span {
  display: none;
}

/* e-mail */
#profile-right li#pa-email {
width: 260px;
height: 45px;
position: relative;
top: -75px;
left: 400px;
justify-content: center;
display: flex;
align-items: center;
}

#profile-right li#pa-posts {
display: grid;
ustify-content: center;
position: relative;
top: -70px;
align-items: center;
}
#profile-right li#pa-last-post,
#profile-right li#pa-last-visit {
display: inline-block;
  width: 318px;
  background: var(--one4);
  color: var(--one3);
  position: relative;
    top:-70px;
}

/* разделитель hr */
.post-content hr {
border: 0;
height: 1px;
background: #333;
  background-image: none;
background-image: -webkit-linear-gradient(left, var(--one2), var(--one4), var(--one2));
/*background-image: -moz-linear-gradient(left, var(--one2), var(--one4), var(--one2));
background-image: -ms-linear-gradient(left, var(--one2), var(--one4), var(--one2));
background-image: -o-linear-gradient(left, var(--one2), var(--one4), var(--one2));*/
}
/* маркерованный текст */
.post-body .post-content .highlight-text {
background-color: var(--one1);
color: var(--one2);
padding: 1px 7px 3px 7px;
border-radius: 4px;
}


/* Шапка */
#pun-title {
background: url(http://forumstatic.ru/files/001b/d3/91/27938.jpg) no-repeat top center;
height: 308px;
border-radius: 15px;
}

.punbb .tcr .user-avatar {float: right; margin: 0 9px 2px 10px !important;}

/* Футер */
#pun-about {
background: url(http://forumstatic.ru/files/001b/d3/91/29611.jpg) bottom center no-repeat;
border-radius: 0 0 20px 17px;
height: 100px;
}



/* участники */
#userlist {
  margin-top: 20px;
}
#pun-userlist .usertable .container {
  padding: 10px;
}
#pun-userlist .usersname {
  margin-left: 10px;
}
#pun-userlist td.tcl.username {
  display: flex;
  align-content: center;
  align-items: center;
}
#pun-userlist td.tcl.username,
#pun-userlist tr {
  height: 40px;
}

/* оформление навигационных страниц и страницы статистики */
thead {text-align: center; font-family: 'Arial'; font-size: 10px;}
#pun-userlist .usertable thead tr {background: transparent; border: none; margin: 0;}
#pun-userlist .usertable tr {
display: flex;
align-items: center;
background: var(--one3);
border: 1px solid var(--two3);
border-radius: 10px;
margin-bottom: 3px;
padding: 5px 0;
}

#pun-userlist .usertable th.tc3.relation, .usertable td.tc3.relation, .usertable th.tc3.registered, .usertable td.tc3.registered, .usertable th.tc3.posts, .usertable td.tc3.num_posts, .usertable th.tc3.last_visit, .usertable td.tc3.last_visit {width: calc(10% - 24px); text-align: center;}

/* строка с сообщением в сообщениях 
#pun-messages .tc2.pmtc22 {
display: grid;
grid-template-columns: 1fr 2fr;
overflow: visible !important;
white-space: normal !important;
text-transform: uppercase;
font-size: 9px !important;
margin: 5px 0 0 20px !important;
}*/

/* форма ответа */
#main-reply {
font-family: var(--font6);
background: var(--one3);
width: 100% !important;
}

/* оформление окон в форме */
#font-area,
#size-area,
#spoiler-area,
#image-area,
#video-area-hsel,
#video-area-tcon,
#color-area,
#table-area,
#keyboard-area,
#addition-area
{
background: var(--one3) !important;
border-radius: 20px;
border: 1px solid var(--two3);
}
#video-area-hsel, #video-area-tcon {padding: 10px; margin-top: -9px;}
#video-area-hsel a:hover {color: var(--one1); background: var(--one2);}
#video-area-actions a {
  background: var(--one4);
  color: var(--one3);
  padding: 3px 10px;
  border-radius: 20px;
  position: relative;
  top: -20px;
  left: 12px;
}
#video-area-actions a:hover {
  background: var(--one2);
  color: var(--two2);
  border: 1px solid var(--one4);
}
#image-source-list {margin-top: 5px;}
#action-computer, #action-internet {
  background: var(--one4);
  color: var(--one3);
  padding: 3px 10px;
  border-radius: 20px;
}
#post fieldset .hashelp div input {
  background: var(--one3);
  padding: 0;
  border: 1px solid var(--two3);
}
#action-computer:hover,
#action-internet:hover {
  background: var(--one2);
  color: var(--two2);
  border: 1px solid var(--one4);
}
#table-area td.selected {background-color: var(--one1) !important;}






/* прокрутка */
::-webkit-scrollbar-thumb {
    background-color: var(--two1);
    border-radius: 5px;
}

::-webkit-scrollbar-corner {
    background-color: #707070;
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background-color: var(--one3);
}

/* выделение */
::selection {
    background: var(--one4);
    color: var(--one2);
}

::-moz-selection {
  background: var(--one4);
    color: var(--one2);
}

/*БыстроПлюсы для Топика!*/
.noNull:before {
  content: "+";
  font-size: 9px;
  display: inline-block;
  margin-left: -6px;
  margin-top: 0px;
  position: absolute;
}
div .post-rating p>a {
  text-align: center;
  outline: 1px solid transparent;
  font-weight: 700;
  background: url(https://forumstatic.ru/files/001b/a6/d4/26514.svg) no-repeat center;
  background-size: 38px auto;
  position: relative;
  padding-left: 1px;
  z-index: 100;
  width: 38px;
  height: 38px;
  text-align: center;
  font-size: 12px !important;
  display: inline-block;
  vertical-align: middle;
  line-height: 34px;
  letter-spacing: -1px;
  color: #336B5E;
}
div.dark-style .post-rating p>a {/*перекраска для другого стиля, удалите если у вас стоит стиль без перекрасок*/
  color: #6BC8AF !important;
}
div.post-vote {
    margin-bottom: 65px;
}
div.post-vote p>a {
  font-size: 0 !important;
  position: absolute;
  cursor: pointer;
  z-index: 200;
  width: 23px;
  height: 23px;
  background: url(https://forumstatic.ru/files/0012/d8/04/75043.png?) no-repeat;
  display: block;
  background-size: 100%;
  margin-left: 29px;
  margin-top: 42px;
}
.post.dark-style div.post-vote p>a {/*перекраска для другого стиля, удалите если у вас стоит стиль без перекрасок*/
  background: url(https://forumstatic.ru/files/0012/d8/04/38128.png?) no-repeat;
  background-size: 100%;
}

/* это интересно */
#pun-live-rusff {
z-index: 1 !important;
width: 440px;
height: 20px;
margin: auto 60px 3px auto !important;
background: transparent;
text-align: right;
position: relative; 
line-height: 17px !important;
text-transform: lowercase; }

.cool1 {
width: 80px !important;
padding: 0px 8px 2px 8px !important;
background: var(--one4) !important;
color: var(--one3) !important;
font-size: 10px !important;
font-family: var(--font4) !important;
border-radius: 15px;
box-shadow: none !important;
margin: 10px -30px 3px 0 !important;
}
.cool1:hover, .cool3:hover {background: #B8CCCC!important; color:#333!important; text-shadow: none!important;}
.cool2, .cooltext {display:none!important;}
.cool3 {
border-radius: 15px;
background: var(--one4) !important;
box-shadow: none !important;
margin: 10px -60px 3px 0 !important;
}

/* контейнер "символов написано" */
#symbol-counter {
    width: 100px;
    margin: 5px 0 -15px 0;
    float: left;
    text-transform: lowercase;
    font-size: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    border-right: 1px solid var(--two3);
}
#symbol-counter span {
    font-weight: 500;
}

/* убираем стандартные иконки*/
#form-buttons {
  background: var(--one3);
  border-radius: 15px;
  padding: 2px 10px;
  margin: 0 0 -11px 0;
  box-sizing: border-box;
  border: 1px solid var(--two3);
  width: 100%;
}
#form-buttons td {
  background: transparent!important;
  height: 20px;
  width: 17px;   position: relative; left:100px;}
#button-transL img, #button-ChangeСase img {opacity: 0;}
#form-buttons td img {
position: absolute;
z-index: 2;
margin-top: -15px !important;
width: auto !important;
margin: -15px 0 0 -18px;}
#form-buttons table, .punbb .formal textarea {
  width: 93% !important;
}



/* содержимое */
#button-font,
#button-size,
#button-bold,
#button-italic,
#button-underline,
#button-strike,
#button-indent,
#button-left,
#button-center,
#button-justify,
#button-right,
#button-link,
#button-spoiler,
td#button-image,
#button-video,
#button-hide,
#button-quote,
#button-code,
#button-color,
#button-smile,
#button-table,
#button-sticker,
#button-keyboard,
#button-addition,
#button-vb1,
#button-vb2,
#floatbut,
#button-mask,
#button-transL,
#button-ChangeСase
{font-family: 'Font Awesome 5 Free';font-weight: 900;}

#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-justify:before {content: "\f039";}
#button-right:before {content: "\f038";}
#button-link:before {content: "\f0c1";}
#button-spoiler:before {content: "\f187";}
td#button-image:before {content: "\f03e";}
#button-video:before {content: "\f008";}
#button-hide:before {content: "\f023";}
#button-quote:before {content: "\f10e";}
#button-code:before {content: "\f121";}
#button-color:before {content: "\f1fc";}
#button-smile:before {content: "\f582";}
#button-table:before {content: "\f0ce";}
#button-sticker:before {content: "\f118";}
#button-keyboard:before {content: "\f11c";}
#button-addition:before {content: "\f0d7";}
#button-vb1:before {content: "\f005";}
#button-vb2:before {content: "\f205";}
#floatbut:before {content: "\f1fe";}
#button-mask:before {content: "\f007";}
#button-transL:before {content: "\f021";}
#button-ChangeСase:before {content: "\f15d";}

/* быстрый предпросмотр */

#togglePreview {
margin: 0 auto;
text-align: center;
display: block;
}

#togglePreview .button {
    background: none !important;
    border: none !important;
    color: var(--links-color) !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    font-size: 7px;
    cursor: pointer;
    letter-spacing: 1px;
}
#togglePreview .button:focus {
    border: none !important;
    outline: none !important;
}

#togglePreview .button:hover {
    color: var(--links-hover-color) !important;
}


/* окно повышения репутации и коммент */
#pun-reputation .inner .container {
background: var(--one2);
border-radius: 22px;
}
#pun-reputation .inner {
box-shadow:none !important;
border: 2px solid var(--two3);
  border-radius: 25px;
}
.punbb .main .tc2 #reputationText {
background: var(--one3);
  border-radius: 25px;
}
#rep_form {color: var(--one4);}

#rep_form .tc2 {
width: 80%;
text-align: left;
font-size: 17px;
font-family: var(--font4);
text-transform: lowercase;
letter-spacing: 0.5px;
font-weight: bold;
color: var(--one4);
}



/***************** элементы в шапке ****************/
.sh-elements {
position: relative;
background: #fff;
display: block;
width: 500px;
height: auto;
margin: 0 auto;
}

/* ïåñíÿ */
.day-song {
top: 237px;
left: -10px;
text-align: right;
}
.day-song a {color: var(--one3);}
.day-song, .k-name, .proc {
position: absolute;
width: 30%;
color: var(--one3);
letter-spacing: 0.3px;
font-family: var(--font4);
font-size: 9px;
display: block;
/*! background: #fff; */
}

/* êîðåÿ */
.k-name {
top: 43px;
left: 40%;
font-weight: bold;
}

/* ïðîöåíòû */
.proc {
font-size: 25px;
display: block;
width: 100px;
text-align: center;
position: absolute;
top: 220px;
left: -120px;
font-weight: bold;
font-family: var(--font3);
}

/* цвет уведомлений */
.bubble {background: var(--one1)!important;}
.bubble:after {border-color: var(--one1) transparent!important;}
span.num_msg {background: var(--one1)!important;}



.progress2 {
  padding: 3px;
  border-radius: 20px;
  background: var(--one2);
  border: 2px solid var(--two3);
  width: 180px;
  margin: 0 auto;
  height: 5px;
}
.progress-bar2 {
  height: 18px;
  border-radius: 30px;
  background: var(--one2);
  transition: 0.4s linear;
  transition-property: width, background-color;
    height: 5px;
}

.progress-moved .progress-bar2 {
 /* width: 85%;*/
  background-color: var(--one1);
  animation: progressAnimation 6s;
}

/*Стиль к скрипту "Музыка в постах и подписях" (c) Emerael */
td#button-music {
    background: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%221em%22%20height%3D%221em%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M6%2013c0%201.105-1.12%202-2.5%202S1%2014.105%201%2013c0-1.104%201.12-2%202.5-2s2.5.896%202.5%202zm9-2c0%201.105-1.12%202-2.5%202s-2.5-.895-2.5-2s1.12-2%202.5-2s2.5.895%202.5%202z%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14%2011V2h1v9h-1zM6%203v10H5V3h1z%22%2F%3E%3Cpath%20d%3D%22M5%202.905a1%201%200%200%201%20.9-.995l8-.8a1%201%200%200%201%201.1.995V3L5%204V2.905z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E') center center no-repeat; /*èêîíêà, çàìåíèòå ññûëêó åñëè õîòèòå ïîñòàâèòü ñâîþ*/
    background-size: 16px; /*ðàçìåð èêîíêè*/
}
.audio-block {
background: var(--one3);
  border: 1px solid var(--two3);
border-radius: 20px;
width: 210px;
padding: 10px;
}
.audio-title {
font-size: 10px;
display: block;
width: 200px;
text-align: center;
font-family: var(--font6);
text-transform: lowercase;
font-weight: 600;
color: var(--three2);
}
audio {
opacity: 0.5;
border-radius: 20px;
height: 17px;
  width: 200px;
}

.play-day {
background: var(--one3);
border: 1px solid var(--two3);
width: 500px;
margin-left: 15%;
min-height: 400px;
border-radius: 25px;
position: relative;
}
.bt1-playlistG {
  width: 200px;
    border: var(--bt1pl-border);
    border-radius: 25px;
    overflow: hidden;
    z-index: 1;
    position: relative;
top: 30px;
left: 20px;
    height: 340px;
  background: var(--one4);
}
.play-who {
display:block;
width: 200px;
height: 300px;
border-radius: 15px;
clip-path: circle(55% at 50% 30%);
position: absolute;
  top: -4px;
}
.play-who img {border-radius: 15px;}

.play-list {
  display:block;
  position: absolute;
  top: 20px;
  left: 250px;
}
.my-ic {
width: 200px;
height: 70px;
position: absolute;
top: 185px;
text-align: center;
}
.my-ic::before {
  content: '\f7a9';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  color: var(--one3);
  font-size: 55px;
}
.play-list-name {
  display: block;
  color: var(--one3);
  position: absolute;
  top: 250px;
  width: 200px;
  text-align: center;
  font-family: var(--font3);
  text-transform: uppercase;
  font-size: 20px;
}
.name-ams {
  display: block;
  color: var(--one3);
  position: absolute;
  top: 290px;
  width: 200px;
  text-align: center;
  font-family: var(--font4);
  text-transform: lowercase;
  font-size: 10px;
}

/* эмоджи в окне со стандартными */
#smilies-area {
  display: block;
  background: var(--one3);
  border-radius: 20px;
  border: 1px solid var(--two3);
  padding: 5px;
}
#smilies-block {
  background: var(--one2);
  padding: 5px;
  margin: 0 auto;
  border-radius: 20px;
  border: 1px solid var(--two3);
}
#smilies-block img {padding: 2px;}

button {
  background: var(--one4);
  box-shadow: none;
  border: none;
  padding: 5px 15px 7px 15px;
  border-radius: 20px;
  color: var(--one3);
}

/* кнопки вверх/вниз */
.go-up, .go-down { cursor: pointer; display: none; height: 50px; margin-bottom: 160px;  opacity: 1; 
position: fixed; width: 50px;  z-index: 9999; }
.go-up { bottom: 58%; margin-left: 1075px !important;}
.go-down {bottom: 44%; margin-left: 1070px !important;}
.go-down:hover, .go-up:hover { opacity: 1;}

/* ссылки в подфорумах */
.tclcon-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 4px 0 0;
}

.tclcon-links a {
    width: 100px;
    background-color: var(--one1);
    color: var(--one3);
    margin: 6px 6px 0 0;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    padding: 4px 0;
    font-family: var(--fonr6);
    font-size: 7px;
    line-height: 10px;
    height: 8px;
    text-align: center;
border: 1px solid var(--two3);
}

.tclcon-links a:hover {
    background-color: var(--one2);
border: 1px solid var(--two3);
box-shadow: border-box;
}