/* TABLA
--------------------------------------------------------------------------------------------------------------------------*/
.banners::-webkit-scrollbar,
msg2 span::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}

/* banners */
.banners {
  margin: 0px 0px -10px -10px;
  width: calc(100% + 20px);
  height: 40px;
  overflow: auto;
  box-sizing: border-box;
  display: flex;
  gap: 9px;
}

.banners a {
  opacity: 0.3;
  mix-blend-mode: luminosity;
  filter: grayscale(1);
}

.banners a:hover {
  opacity: 1;
  mix-blend-mode: normal;
  filter: none;
}

/* copy */
a.copy {
  width: 100%;
  font-family: var(--font);
  text-transform: uppercase;
  font-size: 7px;
  letter-spacing: 1px;
  font-weight: 700;
  display: flex;
  justify-content: center;
  opacity: 0.85;
  height: 20px;
  margin: 0 0 20px 0;
  align-items: center;
  color: var(--col1) !important;
  opacity: 0.5;
}

a.copy:hover {
  opacity: 1;
}

a.copy span {
  position: absolute;
  background: var(--pun);
  transition: all 0.5s;
  opacity: 0;
  letter-spacing: 0.5px;
}

a.copy:hover span {
  opacity: 1;
  transform: scale(1.2) translateY(-1px);
}

/* FUNCTIONAL
--------------------------------------------------------------------------------------------------------------------------*/
ul,
dl,
li,
dd,
dt {
  padding: 0px;
  list-style: none;
}

.modal-inner {
  padding: 10px;
}

/* mask */
#mask_dialog .inner,
.editBookmark,
#MyBookmarks,
.hvStickerPackModal {
  font-family: var(--font);
  text-transform: lowercase;
  letter-spacing: 0.5px;
  border-radius: 0 !important;
}

#mask_dialog .hv-mask-dialog-title,
.editBookmark h1,
#MyBookmarks h2,
#MyBookmarks h1 {
  color: var(--notify);
}

#mask_dialog form#mask_form {
  max-width: 480px;
}

/* bookmark */
.post .bookmark,
#BookmCntToggle.default-style {
  color: var(--notify) !important;
}

.editBookmark h1,
#MyBookmarks h2,
#MyBookmarks h1 {
  display: block !important;
  font-size: 14px;
  margin: 10px 10px 0 10px;
  text-align: center;
}

#MyBookmarks span.scrl {
  box-shadow: none !important;
  margin-left: 5px !important;
  width: 114px !important;
  text-shadow: none !important;
  background: #00000014 !important;
  transition: all 0.5s;
  line-height: 0 !important;
  padding: 0 !important;
  height: 20px;
  display: flex;
  justify-content: center;
}

#MyBookmarks span.scrl span:before {
  content: '\e5ce' !important;
  font-family: var(--mat);
  font-size: 20px;
  font-weight: 800;
}

#MyBookmarks span.scrl span {
  height: 100%;
  display: flex !important;
  align-items: center;
}

#MyBookmarks span.scrl.b span {
  transform-origin: 50% 50% !important;
}

#MyBookmarks span.scrl:hover {
  background: var(--col1) !important;
}

#MyBookmarks .BookmarkL > span.last_click {
  box-shadow: none !important;
  background: var(--bg-color) !important;
}

#MyBookmarks inner {
  padding-top: 30px !important;
}

/* smilies */
.hvStickerPackModalContent {
  border: 1px solid var(--col1);
  align-items: center;
  justify-content: start !important;
}

/* legends */
#profile .container legend,
.adformal h2,
#viewprofile h2 span,
#profilenav h2,
#pun-adnav h2,
#pun-admain h2 span,
legend span {
  font-family: var(--font);
  font-weight: 600 !important;
  letter-spacing: 0.5px;
  text-transform: lowercase;
  font-size: 14px !important;
  margin: 0px;
  position: relative;
  padding: 0 50px 10px 0;
  color: var(--col2);
  border-bottom: 1px solid var(--col1);
}

/* del, abbr, underline */
del {
  filter: blur(1px);
  text-decoration: none;
  transition: all 1s cubic-bezier(0.2, 0.2, 0.2, 1), color 0.5s 0.2s linear;
  opacity: 0.5;
}
del:hover {
  font: inherit;
  filter: none;
  opacity: 1;
}

abbr {
  border-bottom: 2px dotted var(--col1);
  text-decoration: none;
}

.bbuline {
  border-bottom: 1px solid;
  font-style: normal;
}

/* lines */
.post-content hr {
  border-top: none;
}

.post-sig dt {
  border-top: 1px solid;
  margin-bottom: 20px;
}

dd {
  line-height: 150%;
  margin-left: 0px;
}

.fs-box.inline,
.post-sig dt,
.post-content hr {
  border-color: var(--col1) !important;
  opacity: 1 !important;
}

/* infoboxes */
.info-box,
.info {
  font-family: var(--font);
  text-transform: lowercase;
  letter-spacing: 0.5px;
  margin-bottom: 20px;
  line-height: 15px;
}

/* TITLE, TOOLTIP / NOTIFICATIONS
--------------------------------------------------------------------------------------------------------------------------*/
#tooltip,
.tipsy-inner {
  z-index: 999999;
  border-radius: 0px !important;
  padding: 3px 7px;
  font-family: var(--font);
  text-transform: uppercase;
  font-size: 9px;
  letter-spacing: 0.5px;
}

#tooltip,
.tipsy-inner,
#respect figure .prof,
.tipsy-inner a {
  color: var(--pun) !important;
  text-decoration: none !important;
}

#tooltip {
  position: absolute;
  max-width: 200px;
  display: none;
}

#tooltip,
.tipsy-inner,
.num_msg,
.bubble,
.jGrowl-notification,
.jGrowl .messag_theme,
#messages-list a.Author {
  background: var(--notify) !important;
}

/* notifications */
.num_msg,
.bubble,
.jGrowl-notification,
.jGrowl .messag_theme,
#messages-list a.Author {
  text-shadow: none !important;
  font-weight: normal !important;
}

.notification-right {
  overflow: hidden;
}
.notification-item {
  padding: 10px;
}

#navpm {
  position: relative;
}

.num_msg {
  margin: 0 !important;
  right: -11px;
  top: calc(50% - 5px);
  font-size: 8px !important;
  height: 10px !important;
  font-family: var(--font);
  font-weight: 600 !important;
  display: block !important;
  border-radius: 50% !important;
}

.bubble {
  position: relative !important;
  top: -1px !important;
  right: -4px !important;
}

.notify-message .jGrowl-close {
  padding: 2px 5px !important;
}

/* ADMINSTYLE
--------------------------------------------------------------------------------------------------------------------------*/
#pun-admain legend span {
  padding: 0 !important;
  border: none;
  margin: 10px 0 0 -10px !important;
}

#pun-admain h2 span {
  white-space: nowrap;
}

#pun-adnav li,
#pun-adnav h2,
.adformal h2 {
  padding: 0 !important;
}

.adcontainer {
  padding-top: 20px;
}

.contains-textarea .adlabel {
  color: #000 !important;
}

#pun-admain fieldset p {
  font-family: var(--font);
  text-transform: lowercase;
  margin: 10px 1px;
  background: #00000008 !important;
  border: none !important;
  outline: 1px solid var(--col1);
  border-left: 200px solid var(--col1) !important;
  min-height: 40px;
  padding: 10px !important;
}

#pun-adnav h2,
.adformal h2 {
  background-color: inherit !important;
  border: none !important;
}
.adcontainer {
  border: none !important;
}
#pun-admain1 form.adcontainer,
#pun-admain2 form.adcontainer,
#pun-admain-new form.adcontainer,
#pun-admain1 div.adcontainer,
#pun-admain2 div.adcontainer {
  padding: 0px !important;
}
#pun-adnav a {
  font-weight: normal !important;
}
.adformal h2 {
  margin-top: -20px !important;
}
#pun-admain fieldset {
  padding: 0 !important;
}
#pun-admain .adcontainer th {
  background-color: transparent !important;
}
#pun-admain .linksb {
  width: 733px;
  height: 40px !important;
}
#pun-admain .postlink {
  margin-top: -10px;
}

#pun-admain #form-buttons {
  display: block;
}

.punbb-admin thead tr {
  display: table-row;
}

#pun-admain .usermail {
  display: block;
  margin-top: 5px;
}

/* UPb / DOWNb
--------------------------------------------------------------------------------------------------------------------------*/
.go-up,
.go-down,
#Go_Top,
#Go_Bottom {
  cursor: pointer;
  opacity: 1;
  display: none;
  position: fixed;
  z-index: 9999;
  transition: all 0.5s;
  margin-left: 1040px;
  bottom: 50%;
}

.go-up,
#Go_Top {
  margin-bottom: 0px;
}

.go-up:before,
#Go_Top:before {
  content: 'up';
}
.go-down:before,
#Go_Bottom:before {
  content: 'down';
}

.go-up:before,
#Go_Top:before,
.go-down:before,
#Go_Bottom:before {
  display: block;
  transition: all 0.5s;
  font-size: 0;
  width: 50px;
  height: 50px;
  background: var(--pun);
  border-radius: 50%;
}

.go-down,
#Go_Bottom {
  margin-bottom: -130px;
}

.go-up:hover:before {
  transform: scale(1.3) translateY(-30px);
}
.go-down:hover:before {
  transform: scale(1.3) translateY(30px);
}

/* THEMES
--------------------------------------------------------------------------------------------------------------------------*/
msg {
    background: url(https://forumstatic.ru/files/001c/47/40/48828.jpg);
    display: grid;
    margin: auto;
    width: 650px;
    height: 600px;
    border-radius: 30px;
    font-family: var(--font1);
    font-size: 10px;
    position: relative;
    padding: 20px 55px;
    box-sizing: border-box;
    gap: 13px;
    grid-template-rows: 1fr 420px 57px;
}

msg1 {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 4px 27px;
    grid-template-rows: 1fr 1fr;
    grid-template-areas:
        'img name'
        'img online';
    align-items: center;
}

msg1 img, sms1 img.ava, sms2 img.ava {
    grid-area: img;
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 50%;
    border: 4px solid #CE8484;
    box-sizing: border-box;
}

msg1 b {
    grid-area: name;
    font-size: 15px;
    letter-spacing: 0.05em;
    color: var(--bg-color);
    display: flex;
    align-items: flex-end;
    height: 100%;
}

msg1 i {
    grid-area: online;
    font-weight: 600;
    font-style: normal;
    color: #959595;
    display: flex;
    align-items: flex-start;
    height: 100%;letter-spacing: 0.05em
}

msg2 {
    display: block;
    border-radius: 30px;
    background: #F0F0F0;
    width: 100%;
    height: 100%;
    padding: 27px 44px;
    box-sizing: border-box;
}

msg2 span {
    display: flex;
    width: 100%;
    height: 100%;
    overflow: auto;
    padding-right: 10px;
    flex-direction: column;gap: 20px;
}

time {
    display: block;
    text-align: center;
    color: #959595;
    letter-spacing: 0.1em;
}

sms1, sms2 {display: flex;flex-direction: column;position: relative;justify-content: flex-end;gap: 13px;}
sms1 {padding-right: 50px;}
sms2 {padding-left: 50px;}

sms1 img.ava {position: absolute;right: 0;}
sms2 img.ava {position: absolute;left: 0;}

txt {
    background: rgb(225 225 225 / 64%);
    border-radius: 25px;
    color: #5F5F5F;
    letter-spacing: 0.11em;
    text-transform: lowercase;
    padding: 20px;
}

sms1 txt:last-of-type {
    border-bottom-right-radius: 0 !important;
}

txt img {
    display: block;
    margin: 10px 0;max-width: 349px;
}

msg3 {
    border-radius: 25px;
    background: rgb(225 225 225 / 64%);
    display: flex;
    align-items: center;
    font-size: 12px;
    padding: 0 35px;
    color: #959595;
    letter-spacing: 0.05em;
}