Софи

/* ОБЪЯВЛЕНИЕ
-------------------------------------------------------------*/
/* форма объявления */
#pun-announcement {
  position: relative;
  z-index: 1;
}

#pun-viewtopic #pun-announcement {
}

#pun-announcement .container::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

/* ТАБЛИЦА ТУТ */

.t {
    width: 1046px;
    height: 450px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: #747474;
    top: -481px;
}

.t > * {
  position: absolute;
  white-space: pre-wrap;
}

.t a {
      color: var(--deep-blue)!important;
}

.t a:hover {
      color: #6d7685!important;
}

.t_info {
    width: 180px;
    height: 200px;
    padding: 15px 12px 15px 15px;
    letter-spacing: -0.1px;
    background: var(--extra-back);
    border-radius: 5px;
    box-shadow: var(--t-shadow);
    bottom: 50px;
    left: -2px;
    box-sizing: border-box;
    display: flex;
}

.t_info p {
    width: 195px;
    height: 172px;
    overflow: auto;
    font-size: 9px;
    line-height: 12px;
    text-align: justify;
    margin: 0;
    padding-right: 4px;
}

.t_info p::-webkit-scrollbar,
.t_game a::-webkit-scrollbar,
.t_post p::-webkit-scrollbar,
.card-back p::-webkit-scrollbar { width: 1px!important; }
.t_info p::-webkit-scrollbar-thumb,
.t_game a::-webkit-scrollbar-thumb,
.t_post p::-webkit-scrollbar-thumb,
.card-back p::-webkit-scrollbar-thumb {  background-color: #3f4850!important;  }

.t_info p .gn {
   text-transform: uppercase;
    font-weight: 500!important;
    padding-top: 6px!important;
}

.t_info p .tn {
   text-transform: lowercase;
    font-weight: 400!important;
}

.t_ams {
    height: 40px;
    background: var(--extra-back);
    border-radius: 5px;
    border: 1px solid #000;
    bottom: -20px;
    right: 135px;
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 8px;
    padding: 7px 20px;
    width: 220px;
    box-sizing: border-box;
}

.t_ams h4,
.spirit-navigation h4 {
    margin: 0!important;
    text-transform: uppercase;
    font-family: 'Anticva';
    text-shadow: 1px 1px 1px #000;
}

.t_ams span {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    line-height: 0px;
    text-shadow: 0 0 1px #000;
    justify-content: center;
}

.t_ams span a {
    text-transform: uppercase;
    font-weight: 400 !important;
    margin-right: 3px;
    font-size: 10px;
}

.t_game {
    background: var(--extra-back);
    border-radius: 5px;
    box-shadow: var(--t-shadow);
    height: 70px;
    width: 130px;
    box-sizing: border-box;
    padding: 0px 22px 10px;
    top: 92px;
    right: 280px;
    font-size: 10px;
    line-height: 13px;
    display: flex;
    flex-direction: column;
    text-transform: uppercase;
    text-align: center;
    gap: 7px;
    text-shadow: 0 1px 1px #000;
}

.t_game a {
    font-family: 'Anticva';
    font-size: 12px;
    line-height: 13px;
    font-weight: 400 !important;
    max-height: 26px;
    overflow: auto;
    padding-right: 1px;
}

.t_faces {
    height: 50px;
    border-radius: 5px;
    width: 180px;
    top: 338px;
    right: 242px;
    background: var(--extra-back);
    box-shadow: var(--t-shadow);
    display: flex;
    flex-direction: column;
}

.t_faces:nth-of-type(even) {
    width: 150px;
    right: 115px;
    top: 112px;
}

.t_wanted {
    border-radius: 10px;
    text-transform: uppercase;
    text-shadow: 0 1px 1px black;
    text-align: center;
    font-weight: 400;
    font-size: 10px;
    margin: 8px 0px;
}

.t_wanted_c {
    display: flex;
    justify-content: center;
    gap: 9px;
}

.t_wanted_c a, .t_post a {
    display: flex;
    justify-content: center;
    gap: 9px;
    position: relative;
    box-shadow: var(--t-shadow) !important;
    border-radius: 5px;
}

.t_wanted_c a::after, .t_post a:after {
    position: absolute;
    content: attr(data-text);
    z-index: 1;
    text-align: center;
    padding: 4px 4px 6px;
    border-radius: 5px;
    line-height: 11px;
    pointer-events: none;
    transition: all .3s ease-in-out;
    opacity: 0;
    text-transform: none;
    font-weight: 400;
    min-width: 68px;
    text-shadow: 0 0px 1px #000;
    top: 47px;
    font-family: var(--body-font);
    font-size: 10px;
    color: var(--deep-blue);
    background: var(--extra-back);
    box-shadow: var(--t-shadow);
}

.t_wanted_c a:hover:after,
.t_post a:hover:after { opacity: 1; }

.t_wanted_c a img,
.t_post a img {
    display: block;
    width: 40px;
    height: 40px;
    object-fit: cover;
    filter: grayscale(1) brightness(0.4);
    border-radius: 5px;
    transition: filter 0.3s ease-in-out;
}

.t_wanted_c a::before,
.t_post a::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 40px;
    height: 40px;
    border-radius: 5px;
    opacity: .2;
    z-index: 1;
    background-color: #18293a;
    transition: all 0.4s ease;
}

.t_wanted_c a:hover:before,
.t_post a:hover:before {
  opacity: 0;
}

.t_post {
    height: 100px;
    width: 230px;
    background: url(https://forumstatic.ru/files/001c/18/b8/47021.png?v=1);
    border-radius: 5px;
    border: 1px solid #000;
    top: 185px;
    right: 115px;
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 8px;
    padding: 27px 15px 8px;
    box-sizing: border-box;
}

.t_post p {
    text-align: justify;
    font-size: 9px;
    padding-right: 5px;
    margin: 0;
    height: 60px;
    width: 195px;
    overflow: auto;
}

.t_post a {
    position: absolute;
    top: -20px;
    left: 60px;
}

.t_card {
    width: 174px;
    height: 272px;
    perspective: 1000px;
    top: 117px;
    left: 224px;
}

.card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d; /* Устанавливаем 3D-пространство */
  transition: transform .8s; /* Плавный переход для переворота */
}

.t_card:hover .card-inner {
  transform: rotateY(-180deg); /* Переворачиваем карту по оси Y при ховере */
}

.card-front, .card-back {
  top: 0px;
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden; /* Скрываем обратную сторону */
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.card-front {
  background: url(https://forumstatic.ru/files/001c/18/b8/57120.png?v=1);
}

.card-back {
  background: url(https://forumstatic.ru/files/001c/18/b8/58752.png?v=1);
  transform: rotateY(-180deg);
}

.card-back h4 {
    font-size: 11px;
    font-family: 'Anticva';
    position: absolute;
    top: 12px;
    margin: 0;
    width: 26px;
    text-align: center;
    color: var(--deep-blue);
}

.card-back h3 {
    margin: 0;
    font-family: 'Anticva';
    position: absolute;
    bottom: 21px;
    font-size: 11px;
    font-weight: 400;
    width: 100%;
    text-align: center;
    color: var(--deep-blue);
    text-shadow: 0 1px 1px #000;
}

.card-back p {
    margin: 0;
    height: 100px;
    width: 116px;
    position: absolute;
    top: 78px;
    font-size: 9px;
    overflow: auto;
    padding-right: 4px;
text-align: justify;
}

/* ОФОРМЛЕНИЕ ТЕМ */
/* конец оформления тем */

.linksb .pagelink strong,
.linkst .pagelink strong {
  font-family: var(--body-font);
  font-weight: 900;
    font-size: 10px;
}

.isguest #pun-viewtopic .topic {
  margin-bottom: 15px;
}

.lastedit {
  display: none;
}

#pre_placement>a {
  height: 0px !important;
  top: 30px !important;
  right: 4px !important;
}

#pre_placement>a:after {
  content: '\f358';
  font-family: Font Awesome;
  font-size: 16px;
}

.Form-Table {
  width: 95%;
  top: 30px;
  left: 20px;
  margin-bottom: 10px;
}

.table_GamePosts tr:nth-child(odd) {
  background: #00000010 !important;
}

.table_GamePosts {
  background: none !important;
}

.punbb .table_GamePosts td {
  border: 1px solid #74726e !important;
}

.punbb .table_GamePosts tbody tr:not(.first) .aa {
  color: #c4c0b9 !important;
  background: url(https://forumstatic.ru/files/0018/b2/d3/45858.png?v=1) !important;
}

/* убрать "кричалку" из хайда */
.hide-box .qcn {
  display: none;
}

/* тег лапслока */
.custom_tag_lower {
  text-transform: lowercase;
}

/* тег капслока */
.custom_tag_upper {
  text-transform: uppercase;
}

#notify-link .unreads, #navpm .unreads {
background: var(--hovlink) !important;
    font-size: 8px !important;
    color: #ccc7bf !important;
    right: -1.3em!important;
    top: -1em!important;
}

#notifications .notification-item {
    box-sizing: border-box;
    padding: 10px 15px 0px!important;
}

#notifications .notification-item:last-of-type { padding: 10px 15px 10px!important; }

.unread-notifications .modal-inner { margin-top: 0!important; }
.unread-notifications h2 {
    background-color: #aaa69f!important;
    box-sizing: border-box!important;
    padding: 6px!important;
}
.notification-right span { font-weight: 600!important; }
.notification-right span a { font-weight: 700!important; }
#notifications-stored tbody tr {
    box-sizing: border-box;
    padding: 10px 15px 0px;
    display: flex;
}

.notification-image {
    opacity: 0.85;
    float: left;
    border-radius: 5px!important;
    filter: grayscale(0.5) brightness(0.9);
    border: 1px solid #978d7b;
    box-sizing: border-box;
}

.notification-image:hover {
    opacity: 1;
}

.reactions-root {
display: none;
}

=============================

@media (max-width: 620px) {
   body {
     -webkit-text-size-adjust: none;
   }
}

=========================
/* описание подфорумов и ссылки */
.f_desc_wrap {
display: flex;
    justify-content: space-between;
    gap: 0px;
    flex-direction: column;}

.f_desc {
  flex: 0 0 1;
    width: auto /*ширина блока с текстом*/;
}

.f_links {
  flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 2px;
    width: 100% /*ширина блока ссылок*/;
}

.f_links a {
    color: #393532 !important;
    background: var(--forcol);
    padding: 2px 10px;
    flex: auto;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    transition: all .3s !important;
    font: var(--h1-font);
    font-size: 9px;
    line-height: 13px !important;
    border-radius: 2px;
}

.f_links a:hover {
    transition: all .5s ease-in-out !important;
    background: var(--smoke) top;
    color: var(--proftext) !important;
}

============