/* загрузка шрифтов
-------------------------------------------------------------*/

@import url(style_cs.1761565271.css);

@import url('https://kit-pro.fontawesome.com/releases/v6.6.0/css/pro.min.css');


/* Полезные сервисные настройки
-------------------------------------------------------------*/

.acchide,
#pun-index #pun-main h1,
#pun-navlinks h2,
#pun-pagelinks h2,
#pun-status h2,
#pun-ulinks h2,
.punbb .forum h2,
.punbb .multipage .topic h2,
.punbb dl.post-sig dt span,
.punbb p.crumbs strong,
.punbb .divider hr,
.punbb .required label em,
.punbb .formsubmit label,
.punbb .submitfield label,
.punbb .modmenu label,
#pun-userlist .main h2 {
  font-size: 0;
  height: 0;
  width: 0;
  line-height: 0.0;
  position: absolute;
  left: -9999px;
  overflow: hidden;
}

#pun:after,
.punbb .container:after,
.punbb .post-links ul:after,
.punbb .main div.inline:after,
.punbb .post-box:after,
.punbb .linksb:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
  overflow: hidden;
  line-height: 0.0;
  font-size: 0;
}

/* Основные переменные
------------------------------------------*/

:root {

--bodybg: #99CC99 url(https://forumstatic.ru/files/001c/8f/db/93015.jpg) no-repeat top center/cover; /* фон форума */
--linkmain: #993300; /* основные ссылки */
--navlink: #fff; /* верхняя навиг ссылки */
--hlink: #000; /* при наведении общ */
--hlinkl: #eee; /* при наведении светлые */
--punbg: #eee; /* фон тела */
--back1: #f3f3f3; /* фон в статистике */
--fa: 'Font Awesome 6 Pro', 'Font Awesome 6 Brands'; /* шрифт иконок */
--p-width:220px;
--lighttxt: #eee; /* светлый текст */

}

.dark {
--punbg: #626262; /* фон тела */
}

/* Дополнительные переменные
------------------------------------------*/

/*  для темной темы */


/* Основные настройки
------------------------------------------*/

* {
margin: 0;
padding: 0;
border:0;
text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
scrollbar-color: #fff #000;
scrollbar-width: thin;
}

*::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

*::-webkit-scrollbar-track {
  background-color: #000;
}

*::-webkit-scrollbar-thumb {
  background-color: #fff;
}

a, .punbb #pun-admain a {
color: var(--linkmain);
text-decoration:none;
}

a:hover, .punbb #pun-admain a:hover {
color: var(--hlink);
text-decoration:none;
}


input[type=button], input[type=submit] {
border:1px solid #000;
padding:3px 10px 5px;
}

input[type=text], select, input[type=password] {
border: 1px solid #eee;
padding: 5px;
}

textarea {
padding:5px 10px;
}

ul li {
list-style:none;
}


img {border: none;}

h1, h2 {
padding: 5px 20px;
text-align: center;
}

:focus {
outline:none;
}

table, table tbody {
width: 100%;
display: flex;
flex-direction: column;
gap: 10px;
background: var(--back1);
border-radius: 10px;
}

.main tr {
    width: 100%;
    justify-content: space-between;
    display: flex;
    text-align: left;
    gap: 10px;
    padding: 10px;
    box-sizing: border-box;
}



/* флажки и чекбоксы */

.checkfield input[type="checkbox"],
.radiofield input[type="radio"] {
  margin: 0 3px;
}

p[class="checkfield"] *,
div[class="checkfield"] *,
fieldset[class="radiofield"] * {
  height: 20px;
  vertical-align: middle;
}

.formal .container {
  padding: var(--pad1);
}

.formsubmit {
  padding: 0;
  margin: 10px 0 0 0;
}

.formsubmit input,
.formsubmit a,
.formsubmit span {
  margin: 0 6px 0 0;
}

fieldset {
  border: none;
}

fieldset legend {
  font-weight: bold;
}

fieldset fieldset {
  border: none;
  margin: 0;
  padding: 0 0 8px 0
}

.fs-box {
  padding: 5px 0;
}

.fs-box p,
.fs-box fieldset {
  padding: 0 0 8px 0;
}

.inline .inputfield,
.inline .selectfield,
.inline .passfield {
  float: left;
  margin-right: 10px;
}

.inline .infofield {
  clear: both
}

.datafield br {
  display: none
}

.required label,
.datafield span.input {
  font-size: 10px;
}

textarea,
.longinput input {
  width: 64%;
  margin: 0;
}

.hashelp {
  position: relative;
}





.tcl {
width: 50%;
}

.intd {
    display: flex;
    gap: 20px;
    align-content: center;
    align-items: center;
}

tr .icon {
display:block;
width:20px;
height:20px;
border-radius:50%;
background: #fff;
flex-shrink: 0;
}



.tc3, .tc2 {  
width: 10%;
text-align: center;
}

.tcr { 
width: 30%;
}

.modmenu .container {
display: flex;
justify-content: space-between;
}

.modmenu .container:after {
display:none;
}

.pagelink strong {
    background: #000;
    padding: 2px 5px;
    border-radius: 5px;
    color: #eee;
}

.pagelink {
    margin-right: auto;
    order: -1;
    background: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    text-transform: lowercase;
}

/* мобильный стиль
------------------------------------------*/

@media screen and (max-width: 540px) {

.punbb {
font-size:14px;

}

#pun, #pun-title, #html-header, .bcontainer, #pun-navlinks {
width:100%;
}

.tablica {
padding: 10px 20px;
}

.tabwant {
     transform: none;
}

.main tr {
    flex-direction: column;
}

.main .tcl, #pun-index .tcl, .main .tcr, #pun-index .tcr {
    width: 100%;
}

 .main tr:not(:last-of-type) {
    border-bottom: 1px solid #cecece;
}
 
.reveal-modal {
    width: 100%;
}

thead {display:none;}

#pun-searchtopics .tc3:before, #pun-viewforum .tc2:before {

content: '\f075';
font-family: var(--fa);
font-size:16px;
}

#pun-viewforum .tc3:before {
content: '\f06e';
font-family: var(--fa);
font-size:16px;
}


#pun-searchtopics .tc3, #pun-viewforum .tc2, #pun-viewforum .tc3 {
    align-items: center;
    display: flex;
    gap: 10px;

}


#pun-searchtopics .tc2 {
    width: 100%;
    text-align: left;
}

#pun-viewforum tr{
flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px 40px;
}



 }