/* Mobile
------------------------------------------------------------------ */


@media screen and (max-device-width: 580px) {
    
    
    /* General */
    
    html {
        padding: var(--80) 0 0 !important;
    }
    
    html #pun {
        width: unset;
    }
    
    html .punbb {
        padding: var(--16);
   }
    
    html .jGrowl.top-right,
    html .jGrowl.top-left {
        top: var(--64);
    }
    
    
    /* Hide elements */
    
    html .post-author .pa-ip,
    html #pun-viewforum thead,
    html #pun-modviewforum thead,
    html #pun-searchtopics thead,
    html #pun-messages thead,
    #pun-navlinks .container::-webkit-scrollbar,
    #pun-ulinks::-webkit-scrollbar,
    html #announcements .inner::-webkit-scrollbar, html #pun-stats .statsinfo::-webkit-scrollbar,        
    html #form-buttons tr::-webkit-scrollbar {
        display: none !important;
    }


    /* Header */

    #header_table {
        border-radius: 1rem;
    }
    
    
    /* Menu */
    
    html #pun-navlinks {
        overflow: auto hidden;
        padding: var(--2) var(--8);
        border-radius: 0;
        position: fixed;
        top: -0.8%;
        left: 0;
        right: 0;
        margin: 0 !important;

    
    }
    html #pun-navlinks .profilemenu,
    html #pun-navlinks .adminmenu {
        display: none;
    }
    html #pun-ulinks {
        overflow: auto hidden;
        padding: 0 var(--8);
        position: fixed;
        left: 0;
        right: 0;
        top: calc(var(--32) + var(--2));
        box-shadow: 0 var(--8) var(--32) rgb(var(--dark900c) / .2);
        margin: 0 !important;
    }
    #pun-navlinks .container,
    #pun-ulinks .container {
        white-space: nowrap;
    }

#pun-navlinks .container {
    padding: var(--2) var(--8) !important;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    justify-content: start;
    display: flex;
overflow: auto hidden;
}

   
    /* Announcements */
    
    #announcements .inner {
        overflow: auto hidden !important;
        margin: var(--8) 0 0;
        padding: 0;
        flex-wrap: nowrap !important;
        justify-content: start !important;
}
    
    
    /* Status */
    
    #pun-status .item3 {
        padding-top: var(--8);
        float: left !important;
    }
    
    
    /* Categories */
    
    html #pun-index .category tbody {
        padding: 0 var(--16);
        border-radius: 1rem;
    }
    
    html #pun-index .category tr {
        flex-direction: column;
        align-items: start;
        padding: var(--16) 0;
    }
    html #pun-index .category .tcl,
    html #pun-index .category tr .tcr {
        width: 100%;
    }
    html #pun-index .category tr .tcr {
        align-items: start;
        padding-left: calc(var(--32) + var(--8));
    }
    
    
    /* Banners */
    
    #banners {
        padding: var(--16);
             margin-top: 40px !important;
}
    
    
    /* Statistics */
    
    html #pun-stats .container {
        padding: var(--16);
        margin-left: 4% !important;
        width: 92% !important;
    }
    html #pun-stats .statsinfo {
        overflow: auto hidden !important;
justify-content: start !important;
           }
    
    
    /* User Avatar */
    
    #pun .user-avatar {
        width: var(--32) !important;
        height: var(--32) !important;
    }

#pun .user-avatar .isonline {
    top: 8px;
    right: 11px;
}
html #generateButton, html #copyBBCodeButton {
    width: 100% !important;
}
    
    /* Tables */
    
    html .punbb:not(.punbb-admin) th {
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
        overflow: hidden;   
    }
    html td,
    html th {
        padding: var(--16);
    }
    #pun-viewforum tr,
    #pun-modviewforum tr,
    #pun-searchtopics tr,
    #pun-userlist tr,
    #pun-statistic tr,
    #pun-respect tr,
    #pun-positive tr,
    .profile-awards-container tr {
        flex-flow: wrap;
    }
    html #pun-viewforum tr .tcr,
    html #pun-modviewforum tr .tcr,
    html #pun-searchtopics tr .tcr,
    html #pun-userlist tr .tcl,
    html #pun-viewforum tr .tcl .intd,
    html #pun-modviewforum tr .tcl .intd,
    html #pun-searchtopics tr .tcl .intd,
    html #pun-userlist tr .tcl .intd {
        gap: var(--8);
    }
    
    
    /* Viewforum tables */

    html .punbb table .tcl {
        box-sizing: border-box;
    }

    html .punbb:not(#pun-index) div.icon {
        flex-shrink: 0;
        align-self: start;
        margin: 0 !important;
    }
    
    html .punbb:not(#pun-index, #pun-mod, #pun-online, #pun-statistic, .punbb-admin) .tcl {
        width: unset;
        width: 50%;
        flex-grow: 1;
    }
    html .punbb:not(#pun-index, #pun-mod, #pun-searchtopics, #pun-statistic, #pun-userlist, .punbb-admin) .tc2,
    html .punbb:not(#pun-index, #pun-mod, #pun-searchtopics, #pun-statistic, #pun-userlist, .punbb-admin) .tc3 {
        text-align: right;
        width: 15% !important;
    }
    html .punbb:not(#pun-index, #pun-mod, #pun-online, #pun-statistic, .punbb-admin) .tcr {
        border-top: 1px solid rgb(var(--secondary400) / .38);
        align-items: start;
        width: 100%;
    }
    html .punbb:not(#pun-index, #pun-mod, #pun-online) .tcr div {
        width: 100%;
        align-self: stretch;
        display: flex;
        align-items: center;
    }
    
    
    /* Searchtopics tables */

    .punbb#pun-searchtopics .tc3 {
        width: 20% !important;
        text-align: right;
    }
    
    
    /* Userlinst tables */
    
    html #pun-userlist tr td,
    html #pun-userlist tr th {
        box-sizing: border-box;
    }
    html #pun-userlist tr .username {
        width: 40% !important;
    }
    html #pun-userlist tr .title,
    html #pun-userlist tr .user_title {
        width: 60% !important;
    }
    html #pun-userlist tr .relation,
    html #pun-userlist tr .posts,
    html #pun-userlist tr .num_posts {
        width: 20% !important;
        flex-grow: 1 !important;
    }
    html #pun-userlist tr .registered,
    html #pun-userlist tr .last_visit {
        width: 30% !important;
        flex-grow: 1 !important;
        text-align: left !important;
    }
    html #pun-userlist tr .relation,
    html #pun-userlist tr .posts,
    html #pun-userlist tr .num_posts {
        text-align: left !important;
    }


    /* Statistic page tables */

    #pun-statistic tr th,
    #pun-statistic tr td {
        box-sizing: border-box;
    }

    #pun-statistic tr .tcl {
        width: 33% !important;        
    }
    
    #pun-statistic tr .tc2 {
        width: 66% !important;
        text-align: right;
    }

    #pun-statistic tr .tc3 {
        width: 33% !important;
    }

    #pun-statistic tr .tc3:last-child {
        text-align: right;
    }

    #pun-statistic #most_viewed_topics .tcl,
    #pun-statistic #most_viewed_topics .tc2,
    #pun-statistic #most_replied_topics .tcl,
    #pun-statistic #most_replied_topics .tc2 {
        width: 30% !important;
    }

    #pun-statistic #most_viewed_topics .tc3,
    #pun-statistic #most_replied_topics .tc3 {
        width: 20% !important;
    }
    
    
    /* Icons */
    
    html .punbb div.icon::after {
        margin: 0;
    }
    
    
    /* Other buttons */
    
    html #topic-modmenu span,
    html .forum ~ .modmenu span {
        float: none;
        display: block;
        margin-top: var(--8);
    }
    .forum ~ .modmenu strong {
        display: block;
    }
    .forum ~ .modmenu input:last-child {
        margin-top: 0;
    }
    
    
    /* Paginator */
    
    html #pun-viewforum .pagelink,
    html #pun-modviewforum .pagelink,
    html #pun-searchtopics .pagelink,
    html .punbb:not(.punbb-admin) .pagelink {
        display: flex;
        justify-content: center;
    }
    html .punbb:not(.punbb-admin) .pagelink {
        margin-bottom: var(--16);
    }
    html .punbb:not(.punbb-admin) .pagelink .prev {
        margin-right: auto;
    }
    html .punbb:not(.punbb-admin) .pagelink .next {
        margin-left: auto;
    }
    
    
    /* Topic bottom */
    
    html #pun-viewtopic .linksb {
        display: block;
    }
    html #s-block {
        float: none;
        margin-bottom: var(--16);
    }
    
    
    /* Reply form */

    html #main-reply {
        padding: var(--12);
        font-size: 1.2rem !important;
    }
    
    html #form-buttons table {
        width: unset !important;
        display: flex;
    }
    html #form-buttons tr {
        white-space: nowrap;
        overflow-x: auto;
    }
    html #form-buttons td {
        flex-shrink: 0;
    }
    html #pun #tags .container {
        box-sizing: border-box;
        max-width: calc(100vw - var(--32));
    }
    
    
    /* Post */
    
    html .post h3 {
        float: none;
        width: unset;
    }
    html .post h3:has(#fntSlider) strong {
        padding-top: var(--32)
    }
    html #fntSlider {
        display: block;
    }
    html .punbb:not(#pun-messages) #fntSlider {
        float: none;
        width: 100%;
        margin: 0 0 var(--12);
    }
    html .post .container {
        flex-flow: nowrap;
        flex-direction: column;
    }
    html .post-body {
        width: unset;
        padding: 0;
    }
    html .post .bookmark {
        right: calc(var(--16) * -1);
    }
    
    
    /* Post links */
    
    .punbb .post-links li a {
        font-size: 0;
    }    
    .punbb .post-links li a::before {
        content: '';
        font: 400 1.4rem/100% var(--fa);
        background: rgb(var(--secondary400) / .38);
        padding: var(--6) var(--8);
    }
    .punbb .post-links .pl-email.block a::before {
        content: '\f05e';
    }
    .punbb .post-links .pl-email.profile a::before {
        content: '\f007';
    }
    .punbb .post-links .pl-email.pm a::before {
        content: '\f0e0';
    }
    .punbb .post-links .pl-email.email a::before,
    #pun-messages .post-links .pl-email a::before {
        content: '\40';
    }
    .punbb .post-links .pl-website.website a::before {
        content: '\f06b';
    }
    .punbb .post-links .pl-email.social-telegram a::before {
        content: '\f1d8';
    }
    .punbb .post-links .pl-delete a::before {
        content: '\f2ed';
    }
    .punbb .post-links .pl-edit a::before {
        content: '\f304';
    }
    .punbb .post-links .pl-quote a::before {
        content: '\f3e5';
    }
    #pun-searchposts .post-links a::before {
        content: '\f08e';
    }

   .isadmin li.editpole a::before  {
     content: '\f2bb';
	}


    
    
    /* Post profile */
    
html .post-author {
    margin-top: 0;
    width: unset;
    align-self: unset;
    margin-bottom: 0 !important;
    padding: var(--16);
    background: url(https://forumstatic.ru/files/001c/80/ee/85572.png);
}
    
html .post-author ul {
    display: grid;
    grid-template-columns: max-content 1fr;
    grid-template-rows: max-content max-content 1fr max-content;
    grid-template-areas: "avatar author"
            "avatar title"
            "avatar parow"
            "avatar pa-fld1"
            "pa-posts pa-respect";
}
    
    html .post-author .pa-author {
        grid-area: author;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        padding-right: 0;
    }
    html .post-author .pa-author a,
    html .post-author .pa-author strong {
        font-size: 1.2rem;
    }
    
    html .post-author .pa-title {
        grid-area: title;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        padding-right: 0;
    }
    
    html .post-author .pa-avatar {
        grid-area: avatar;
        padding: 0;
        margin: 0;
    }
    
    html .post-author .pa-avatar img {
        height: 100px;
        width: 100px;
        object-fit: cover;
        display: block;
    }

html .post-author .pa-fld1 {
       display: none						
}

html .post-author .pa-fld2 {
    margin: 0 0 0 16px;

}

html .post-author .pa-posts, html .post-author .pa-respect, html .post-author .pa-fld3, html .post-author .pa-fld4{
	 grid-area: pa-respect;
}

html .post-author .pa-posts{
	left: 10%
} 
	
html .post-author .pa-respect{
	left: 30%;
top: -4px;

}

html .post-author .pa-fld3{
	left: 50%;
top: -4px;
}

html .post-author .pa-fld4{
	left: 70%;
top: -4px;
}

html .post-author .pa-fld5{
	transform:none;
	top: 4%;
	left:34%
}
    
html .post-author .pa-online {
	  top: -7% !important;
	right: -2% !important  
   }
      
    
    /* Profile page */
    
    html #viewprofile-next {
        flex-direction: column;
        gap: 0;
    }
    html #pun-profile #profile .container {
        padding-left: 0 !important;
    }
    html #profilenav {
        width: unset !important;
        display: block;
        float: none !important;
        margin: 0 0 var(--16) 0 !important;
    }
    html #profilenav li {
        display: inline-block;
    }
    html #viewprofile .container tr {
        flex-direction: column;
        gap: var(--16);
    }
    html #profile-left {
        width: unset !important;
    }
    html #profile-right {
        width: unset;
    }
    html #profile-right li {
        padding: var(--8) var(--16);
        border-radius: 1rem;
        background: rgb(var(--secondary400) / .2);
        margin-bottom: var(--8);
        list-style: none;
    }
    html #profile-right li > strong {
        display: block;
        padding: 0;
    }
    html #profile-right li > span {
        min-width: unset;
    }
    
    
    /* Messages page */

    html #pun-messages .hasicon tr {
        flex-flow: wrap;
    }

    html #pun-messages .tcl.pmtcl1 {
        border-bottom: 1px solid rgb(var(--secondary400) / .38);
        width: 100% !important;
        text-align: left;
    }

    html #pun-messages .tc2.pmtc22 {
        box-sizing: border-box;
        width: 50% !important;
        text-align: left;
    }
    
    html #pun-messages .tc3.pmtc33 {
        box-sizing: border-box;
        width: 40% !important;
        text-align: left;
    }
    
    html #pun-messages .tc2.pmtc24 {
        box-sizing: border-box;
        width: 10% !important;
        text-align: right;
        padding: var(--8) !important;
    }

    html #pun-messages #profilenav {
        display: block;
    }

    html #pun-messages #profilenav ul {
        margin-bottom: var(--8) !important;
    }

    html #pun-messages .post .container {
        padding: var(--16) 0 !important;
    }
    
    
    /* Awards page */

    html .fr {
        float: none;
    }


    /* Reactions */

    html .reaction-picker {
        position: unset;
    }

    html .topic .reaction-picker-panel {
        top: unset;
        left: unset;
        right: 0;
        transform: none;
        z-index: 7;
    }

    html .reactions-root .emoji-mart {
        width: unset !important;
    }
    
    
    /* Admin pages */

    html .adminmain {
        padding: 0;
    }

    html #pun-adnav {
        float: none;
        width: unset;
        display: block;
        margin: 0;
        background: rgb(var(--light100));
        z-index: 7;
        position: relative;
        top: 0;
    }
    html #adnav-standard > ul {
        -webkit-column-count: 2;
        column-count: 2;
    }
    html #pun-adnav ul.adsubnav li {
        padding: 0 !important;
    }
    html #pun-adnav ul.adsubnav li a {
        display: inline-block;
        padding-bottom: var(--4)
    }
    html #pun-admain .adsubmit {
        display: block;
        position: relative !important;
        top: unset !important;
        left: unset !important;
        width: unset !important;
        padding: 1em;
    }
    html #pun-admain .adcontainer {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    html #pun-admain fieldset {
        min-inline-size: auto;
    }
    html #pun-admain fieldset .handle,
    html #pun-admain fieldset p {
        border: none;
    }
    html #pun-admain .adlabel,
    html #pun-admain .adinput {
        display: block;
        padding-bottom: var(--8);
        float: none;
        margin: 0;
    }
    html #pun-admin_index #pun-admain .adformal div ul,
    html #pun-admin_index #pun-admain div p {
        padding-top: 0.8em;
    }
    html #pun-admain2 fieldset .subforums {
        margin-left: 2em;
    }
    html:has(#pun-admain) .jGrowl.top-right,
    html:has(#pun-admain) .jGrowl.top-left {
        display: none;
    }
    html #pun-admain .submittop {
        position: relative;
        top: unset;
        background: transparent;
        z-index: unset;
    }
    html #pun-admain .submitend {
        margin: 0 calc(var(--16) * -1);
        background: rgb(var(--light100));
        position: sticky;
        bottom: 0 !important;
        padding: var(--8) var(--16);
        z-index: 6;
    }

    html #pun-admain .adfs-box:has(#filetable, #domcontainer),
    html #pun-admin_logs .adformal {
        overflow-x: auto;
    }
    
    html #pun-admain #filetable .tcl {
        width: 88px !important;
    }
     
    html #pun-admain #domcontainer .tcl,
    html #pun-admin_logs table .tc2,
    html #pun-admin_logs table .tc3,
    html #pun-admin_logs table .tcr {
        width: 120px !important;
    }
    
    html #pun-admain #filetable .tc2,
    html #pun-admin_logs table .tcl {
        width: 80px !important;
    }
    
    html #pun-admain #domcontainer .tc2 {
        width: 120px !important;
    }
    
    html #pun-admain #filetable .ft-tags {
        width: 32px !important;
    }
    
    html #pun-admain #filetable .tc3, 
    html #pun-admain #domcontainer .tc3 {
        width: 48px !important;
    }
    
    html #pun-admain #filetable .tcr, 
    html #pun-admain #domcontainer .tcr {
        width: 180px !important;
    }
    
    html #pun-admain #filetable .checker {
        width: 24px !important;
    }


.punbb:before,  .frosted_glass, .add, .ams-line {display:none !important}

#pun-announcement {
width: 100%}

#pun-index #pun-main table tr {
        margin-left: 0 !important;
        width: 100% !important;
        padding: 4%;
}

.f_links{
margin-bottom:5%}

html .bpost-title a, html .bpost, html .bpost_bg,
html .activ-info-sp, html .activ-info, html .bepiz, html .bepiz_bg, html .citata, html .citata_bg, html .snowbox-toggle, html #snow_box.enabled {
	display:none
}

html .news-post-ep{
	width:100%
}
	
html .news-post-ep text{
        width: 88%;
border:none
}

}


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

  
html .side-button-1 .side-b{
    top: 70px;
	left:0
}

html .snowbox-toggle {
left:0
}

html .pulsen {
    font-size: 2.5rem;
    top: 4%;

  }


}


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

html .blood-svg {
margin-top: 2% !important;
}
	

html .blood-splash-2 {
  width: 300px;
}



}