@media screen and (max-width: 580px) {
body {
background-color: var(--body) !important;
background-image: none !important;
font-size: .75rem;
}
#pun {
border-left: none;
border-right: none;
border-top: none;
margin: 0 0 80px;
padding: 0 20px 20px;
width: 100%;
}
.punbb, #pun-index.punbb {
padding: 0;
}
#pun-title {
background-image: var(--header-img-m);
background-position: -260px 0;
background-repeat: no-repeat;
background-size: auto;
height: 200px;
left: -20px;
margin: 0;
overflow: hidden;
position: relative;
top: 0;
width: calc(100% + 40px);
}
#pun-title:before {
align-content: center;
color: #DEDEDE;
content: "alicormen";
display: block;
font-family: 'TanPearl';
font-size: 50px;
height: 100%;
line-height: 60px;
margin-top: 0;
text-align: center;
text-shadow: 2px 2px 2px rgba(0,0,0,.25);
text-transform: uppercase;
width: 100%;
}
#pun-navlinks {
background: var(--container);
border-bottom: var(--border1);
margin: 0 -20px 20px;
padding: 0;
top: 0;
width: calc(100% + 40px) !important;
}
#pun-index #pun-navlinks, #pun-index #pun-ulinks {
margin-left: -20px;
}
#pun-navlinks .container {
align-items: center;
gap: 0;
height: 60px;
justify-content: space-evenly;
padding: 0;
text-align: center;
width: 100% !important;
}
#pun-navlinks a {
align-items: center;
color: var(--text);
display: flex;
height: 40px;
justify-content: center;
padding: 0;
width: 40px;
}
#pun-navlinks a>span {
display: none;
}
#pun-navlinks li a:before {
color: var(--text);
display: flex;
font-family: var(--fa);
font-size: 22px;
font-weight: 900;
}
#pun-navlinks li#navindex a:before {
content: "\f015";
}
#pun-navlinks li#navuserlist a:before {
content: "\f0c0";
}
#pun-navlinks li#navsearch a:before {
content: "\f002";
}
#pun-navlinks li#navprofile a:before {
content: "\f004";
}
#pun-navlinks li#navpm a:before {
content: "\f0e0";
}
#pun-navlinks li#navadmin a:before {
content: "\f013";
}
#pun-navlinks li#navlogout a:before {
content: "\f011";
}
#pun-navlinks li#navlogin a:before {
content: "\f084";
}
#pun-navlinks li#navregister a:before {
content: "\2b";
}
#pun-ulinks {
left: 0;
margin: 20px -20px 40px;
padding: 20px;
top: 61px;
width: calc(100% + 40px) !important;
}
#pun-ulinks .container {
flex-wrap: wrap;
font-size: 1.25em;
gap: 1em .8em;
justify-content: end;
padding: 0;
}
#pun-navlinks.scrolled, #pun-ulinks.scrolled {
top: -146px;
}
#pun-announcement {
display: none;
}
#pun-status {
font-size: .75em;
margin-bottom: 10px;
padding: 0;
position: relative;
right: 0;
width: 100%;
}
#pun-status .container {
gap: 16px 4px;
}
.show_sidebar {
bottom: 10px;
font-size: 16px;
height: 40px;
top: initial;
width: 40px;
}
#sidebar .tab_family[data-number="1"] {
margin-top: 0;
}
#sidebar .tab > p.checkfield {
display: flex;
flex-direction: row-reverse;
flex-wrap: wrap;
gap: 8px;
height: fit-content;
line-height: 1;
padding: 0;
width: 100%;
}
#sidebar input#mobileVersionToggle {
height: 15px;
margin: 0 auto;
width: 15px;
}
#sidebar .tab > p.checkfield label {
color: var(--text);
display: block;
font-family: var(--font);
font-size: 12px;
font-weight: 500;
height: 100%;
line-height: 110%;
text-transform: lowercase;
width: 100%;
}
#pun-index .icon.inew, .light #pun-index .icon.inew {
background: var(--accent1);
border-radius: 60px;
height: 20px;
left: calc(0px - 20px - 11px);
top: 0;
width: 20px;
}
.category {
margin-bottom: 30px;
padding: 20px;
}
.category h2 {
top: -28px;
}
.light .category h2 {
top: -27px;
}
#pun-index .tclcon {
gap: 1em;
}
#pun-index .tclcon b {
display: block;
font-size: 1em;
margin-right: 0;
width: 100% !important;
}
#pun-index .tclcon>a {
font-size: 1em;
height: auto;
line-height: 1.1em;
padding: .25em 1em;
}
#pun-index .tclcon>p {
font-size: 1em;
}
#pun-index #pun-main tbody tr {
border-bottom: var(--border2);
flex-direction: column;
gap: 10px;
margin-bottom: 30px;
padding-bottom: 30px;
}
#pun-index #pun-main tbody tr:last-of-type {
border-bottom: none;
padding-bottom: 0;
}
#pun-index #pun-main .tcl {
width: 100%;
}
#pun-index #pun-main .tcr {
gap: 8px 10px;
margin-top: 8px;
width: 100%;
}
#pun-index #pun-main .tcr .lastpost-link {
font-size: 13px;
}
#pun-index #pun-main .tcr .lastpost span {
font-size: 10px;
}
#pun-stats {
padding: 0 20px 20px;
}
#pun-stats .statsinfo {
align-items: center;
background: var(--accent2);
display: flex;
flex-wrap: wrap;
height: fit-content;
justify-content: space-between;
margin: 0 -20px 0;
padding: 0 20px;
width: calc(100% + 40px);
}
#pun-stats .item1, #pun-stats .item2, #pun-stats .item3, #pun-stats .item4 {
height: 40px;
white-space: normal;
width: calc(50% - 5px);
}
#pun-stats .item3, #pun-stats .item4 {
margin-top: -20px;
}
#pun-stats .onlinelist {
margin-top: 0;
}
#pun-stats .onlinelist div, #pun-stats .users_24h div {
font-size: 1em;
}
#pun-crumbs1, #pun-crumbs2, .linkst .pagelink strong, .linksb .pagelink strong, .linkst .pagelink a, .linksb .pagelink a {
font-size: 1rem;
}
.container.crumbs {
line-height: 1.5em;
}
.linksb {
margin: 28px 0 0;
}
.linksb, .linkst {
align-items: flex-start;
flex-direction: column;
gap: 16px;
}
.linkst .pagelink, .linksb .pagelink {
gap: 5px;
padding: 5px 5px 5px 0;
}
.linkst .pagelink strong, .linksb .pagelink strong, .linkst .pagelink a, .linksb .pagelink a {
padding: 2px 6px;
}
#viewprofile .container tr {
flex-direction: column;
}
#viewprofile .container tr td {
width: 100% !important;
}
#viewprofile bg {
display: none;
}
#viewprofile #profile-left {
margin: 0;
}
#viewprofile #profile-name {
border: none;
font-size: 1rem;
height: fit-content;
padding-bottom: 10px;
width: 100%;
}
#viewprofile #profile-right {
margin-top: 20px;
}
#viewprofile #profile-right li {
align-items: center;
flex-direction: column;
gap: 10px;
justify-content: center;
}
#viewprofile #profile-right li span, #viewprofile #profile-right li span a {
font-size: 1em;
}
#viewprofile #profile-right li span {
line-height: 110%;
padding: .4em 0;
width: 50%;
}
#profile-right li strong {
padding: 0 !important;
}
#viewprofile #pa-edit a {
font-size: 1em;
line-height: 110%;
padding: .4em 2em;
}
#viewprofile #profile-right li#pa-fld1>strong {
width: 100%;
}
#viewprofile #profile-right li#pa-fld1>strong>a, #viewprofile #profile-right li#pa-fld1>strong lz {
font-size: 1em;
}
#profilenav ul {
gap: 12px;
}
#profile4 img.avatardemo {
float: none !important;
margin: 0 auto 10px;
}
#pun-profile #profile {
min-height: 452px;
}
#pun-messages #profile {
min-height: 312px;
}
.formal * {
font-size: .75rem;
}
#form-buttons {
display: flex;
flex-direction: column;
}
#form-buttons table {
width: 100% !important;
}
#form-buttons tr {
flex-wrap: wrap;
gap: 5px;
}
#form-buttons td {
height: 38px;
width: 38px;
}
#symbol-counter {
border: var(--border2) !important;
font-size: 1em;
height: 40px;
width: 100%;
}
.button-ban {
margin-top: 10px !important;
}
#pun-messages #profilenav {
margin-bottom: 30px;
width: 100%;
}
#pun-messages #profilenav ul {
flex-direction: row;
flex-wrap: wrap;
gap: 16px;
justify-content: center;
}
#pun-messages #profilenav ul li {
width: calc(50% - 8px);
}
#pun-messages #messages fieldset, #pun-messages #profile .container>fieldset {
margin: 0 0 10px;
width: 100%;
}
#pun-messages .linksb {
margin: auto;
width: 100%;
}
#pun-messages .post-author ul {
align-items: center;
flex-direction: column;
margin: 0;
}
#pun-messages .post-author ul .pa-author {
border: none;
height: fit-content;
padding: 10px;
width: 100%;
}
#pun-messages .post-author .pa-online {
right: 10px;
top: 10px;
}
#pun-messages .post-author .pa-author a {
font-size: 1em;
}
#pun-messages .postlink input.button {
height: 30px;
}
.post {
margin-top: 30px;
}
.post h3 span {
font-size: 1em;
}
.post h3 a {
max-width: none;
}
h3 {
font-size: 1em;
}
.post>.container {
flex-direction: column;
}
.post>.container > div {
width: 100%;
}
.post-author .pa-author {
font-size: 1rem !important;
width: 100%;
}
.post-author .pa-online strong, .post-author .pa-last-visit strong {
font-size: 0 !important;
}
#profile.formal.messages-container .post .container {
flex-direction: column;
gap: 10px;
}
#profile.formal.messages-container .post .container > div {
width: 100%;
}
#profile.formal.messages-container .post .container > div.post-author {
width: calc(100% + 20px);
}
.post-links li a {
font-size: 0;
height: 36px;
line-height: 1 !important;
padding: 0;
width: 36px;
}
.post-links li a:before {
font-family: var(--fa);
font-size: 14px;
font-weight: 900;
}
.pl-email a:before {
content: "\40";
}
.pl-email.profile a:before {
content: "\f007";
}
.pl-email.pm a:before {
content: "\f0e0";
}
.editpole a:before {
content: "\f013";
}
.pl-delete a:before {
content: "\f1f8";
}
.pl-edit a:before {
content: "\f303";
}
.pl-quote a:before {
content: "\f10e";
}
.quote-box cite, .code-box .legend {
font-size: 1em;
padding: 8px 15px;
}
.code-box .legend.legend-processed {
flex-wrap: wrap;
justify-content: flex-end;
text-align: right;
}
strong.legend.legend-processed a {
text-align: right;
white-space: normal;
}
strong.legend.legend-processed a:last-of-type {
margin-right: 0;
padding: 4px 0 4px 5px;
}
#pun-searchtopics table tr, #pun-viewforum table tr, #pun-modviewforum table tr {
display: flex;
flex-wrap: wrap;
gap: 8px;
width: 100%;
}
#pun-searchtopics table tbody tr, #pun-viewforum table tbody tr, #pun-modviewforum table tbody tr {
border-bottom: var(--border2);
margin-bottom: 10px;
padding-bottom: 10px;
}
#pun-searchtopics table tbody tr:last-of-type, #pun-viewforum table tbody tr:last-of-type, #pun-modviewforum table tbody tr:last-of-type {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
#pun-searchtopics table tr td, #pun-viewforum table tr td, #pun-modviewforum table tr td {
border: none !important;
}
#pun-searchtopics thead, #pun-viewforum thead, #pun-modviewforum thead {
display: none;
}
#pun-searchtopics .container tbody td, #pun-viewforum .container tbody td, #pun-modviewforum .container tbody td, #pun-userlist .usertable table tbody td {
min-height: auto;
word-break: break-word;
}
#pun-searchtopics .container tbody .tcl, #pun-viewforum tbody .tcl, #pun-modviewforum tbody .tcl {
padding: 0 !important;
width: 100% !important;
}
#pun-searchtopics .container .tcr, #pun-viewforum .tcr, #pun-modviewforum .tcr {
align-items: flex-start;
gap: 0 8px;
margin-left: auto;
width: 45%;
}
#pun-viewforum .tcr, #pun-modviewforum .tcr {
width: 50%;
}
#pun-searchtopics .container td:before, #pun-viewforum .container td:before {
color: var(--text-pale);
display: block;
font-size: 9px;
font-weight: 600;
padding-bottom: 4px !important;
text-align: left;
text-transform: lowercase;
}
#pun-searchtopics .container .tc2:before { content: "форум"; }
#pun-searchtopics .container .tc3:before, #pun-viewforum .container .tc2:before { content: "ответов"; }
#pun-searchtopics .tcl a, #pun-viewforum .tcl a, #pun-modviewforum .tcl a {
font-size: .9rem;
}
#pun-searchtopics .tcl .intd, #pun-viewforum .tcl .intd, #pun-modviewforum .tcl .intd {
align-items: baseline;
}
#pun-searchtopics .container .tc2, #pun-viewforum .container .tc2, #pun-modviewforum .container .tc2, #pun-viewforum .tc2, #pun-modviewforum .tc2 {
overflow: hidden;
padding: 6px 4px 7px 16px;
text-align: left;
text-overflow: ellipsis;
vertical-align: middle;
white-space: nowrap;
width: 36%;
}
.topic .post-author {
padding: 10px;
width: calc(100% + 20px) !important;
}
.topic .post-author bg {
display: none;
}
.topic .post-author ul {
display: grid;
grid-column-gap: 20px;
grid-row-gap: 0;
grid-template-areas: "author avatar"
"title avatar"
"lz avatar"
"row avatar"
"plash plash";
grid-template-columns: 1fr 92px;
grid-template-rows: auto;
margin: 0;
padding: 0;
}
.topic .post-author .pa-author {
grid-area: author;
height: fit-content;
margin-bottom: 10px;
padding: 0;
}
.topic .post-author .pa-avatar.item2 {
grid-area: avatar;
}
.topic .post-author .pa-avatar.item2, .topic .post-author .pa-avatar.item2 img {
max-height: 135px;
max-width: 90px;
object-fit: cover;
object-position: center;
}
.topic .post-author .pa-title {
font-size: .8em;
grid-area: title;
margin: 0;
padding: 0;
}
.topic .post-author .pa-fld1 {
grid-area: lz;
margin: 20px 0 10px;
padding: 0;
}
.topic .post-author .pa-row {
grid-area: row;
margin: 10px 0 0;
padding: 0;
}
.topic .post-author .pa-row li {
font-size: 1em;
}
.topic .post-author .pa-fld5 {
grid-area: plash;
margin: 20px auto 5px;
}
.topic .post-author .pa-ip {
display: none;
position: absolute;
}
.topic .post-author .pa-fld1 lz {
font-size: 1em;
margin: 0;
}
.topic .post-author .pa-fld1 > a {
font-size: 1em;
}
.topic .post-author .pa-online, .topic .post-author .pa-last-visit {
right: 98px;
top: 0;
}
.post-author .pa-fld4 {
left: 0;
top: 0;
}
.topic .post-author .pa-fld5 pl {
margin: 0 auto;
}
#tuser {
left: unset !important;
margin: 0 !important;
position: absolute !important;
right: 118px !important;
top: 40px !important;
}
#pun-searchposts .post-author, #pun-multimove .post-author, #pun-multidelete .post-author, #pun-multimegre .post-author, #pun-post .pa-author {
width: calc(100% + 20px);
}
#pun-searchposts .post h3 span {
flex-wrap: wrap;
gap: 12px 6px;
}
#pun-userlist .tc2.user_title, #pun-userlist .tc2.title, #pun-userlist .tc3.registered {
display: none;
}
#pun-userlist .usertable .tcl.username {
display: table-cell;
width: 30%;
}
#pun-userlist .usertable .tcl.username .user-avatar {
margin: 0 8px 0 0 !important;
}
#pun-userlist .usertable .tcl.username .usersname {
display: inline-block;
margin-top: 5px;
width: calc(100% - 24px - 8px);
}
input.button, .formsubmit a {
font-size: 1em;
}
.subscribelink a, .postlink a {
height: 30px;
padding: 0 1em;
}
#chfontsize {
margin-bottom: 10px;
}
#video-area, #image-area, #spoiler-area {
width: 456px !important;
}
#volSlider .thumb {
top: -10px !important;
}
.go-up, .go-down {
background: var(--container);
border: var(--border2);
border-right: none !important;
height: 40px;
opacity: 1;
right: 0;
width: 32px;
}
.go-up {
top: calc(50% - 40px);
}
.go-down {
top: calc(50% + 40px);
}
.go-up:before, .go-down:before {
align-items: center;
color: var(--text);
display: flex;
font-family: var(--fa);
font-size: 16px;
height: 100%;
justify-content: center;
width: 100%;
}
.go-up:before {
content: "\f077";
}
.go-down:before {
content: "\f078";
}
.post-content, .post-content p {
line-height: 200%;
}
.banners {
bottom: -94px !important;
margin: 10px 0 0 0 !important;
right: 0 !important;
width: 100% !important;
}
#pun-about {
bottom: -38px !important;
right: unset !important;
text-align: center !important;
width: 100% !important;
}
#pun-crumbs2 {
margin-bottom: 0 !important;
padding-bottom: 20px;
}
.judascare {
bottom: -53px;
justify-content: center;
right: 0;
text-align: center;
width: 100%;
}
.al-admin1 section {
background: var(--accent2);
background-image: none !important;
height: auto;
width: calc(100% - 20px);
}
.light .al-admin1 section {
background: var(--accent1);
}
.al-admin1 section:before, .al-admin2 section:before, .al-admin1 section:after, .al-admin2 section:after {
content: none;
}
.al-admin2 section {
display: none;
}
.al-admin1 h1 {
padding: 10px 1em;
}
.al-admin1 article {
margin: 0 20px;
width: calc(100% - 40px);
}
.al-admin2 article {
margin: 0 10px;
width: calc(100% - 20px);
}
.ffr p {
font-size: 1em !important;
}
.ffr pp, .ffr bpost p, .al-weekly bpost>a:nth-of-type(2) {
font-size: .9em !important;
}
.ffr h2 {
padding: 7px 20px 6px;
}
.ffr h3 {
font-size: 1.1em;
}
.al-weekly h1, .al-news h1 {
padding: 10px 1em;
}
.al-weekly article, .al-news article {
padding: 20px;
}
.al-weekly writers {
margin: 20px 30px 0;
width: 100%;
}
.al-weekly ep {
width: 100%;
}
.al-weekly section, .al-news section {
background: var(--accent2);
}
.light .al-weekly section, .light .al-news section {
background: var(--accent1);
}
.al-accept {
background: linear-gradient(180deg, var(--accent2) 40px, var(--pun) 40px);
padding: 20px;
width: 100%;
}
.light .al-accept {
background: linear-gradient(180deg, var(--accent1) 40px, var(--container) 40px);
padding: 20px;
}
.al-accept h1 {
margin: 0 auto 20px;
padding: 10px 1em;
}
.al-accept links, .al-gost links {
margin-top: 8px;
}
.al-accept links a, .al-gost links a {
font-size: 1em;
padding: 4px 1em;
}
.al-gost section h1 {
font-size: 3em !important;
line-height: 1em;
}
.al-gost section span {
font-size: 1em;
font-weight: 400;
letter-spacing: .05em;
line-height: 130%;
}
.al-gost article:nth-of-type(1), .al-gost article:nth-of-type(2) {
margin: 0 !important;
padding: 0 20px !important;
width: 100% !important;
}
.al-gost article:nth-of-type(1) {
margin: 20px 0 0 !important;
}
.al-gost article:nth-of-type(2) {
gap: 35px 0;
margin: 35px 0 0 !important;
}
.al-gost list1, .al-gost list2 {
height: 165px;
}
.al-gost list1 h, .al-gost list2 h {
width: 100%;
}
.al-gost list1 div, .al-gost list2 div {
padding-left: 0;
}
.al-gost links {
margin-top: 10px;
}
.al-fcs > span, .al-roles > span {
font-size: 1em;
padding: 1em;
}
.al-fcs boxes, .al-roles boxes {
padding: 45px 20px 20px;
}
.al-fcs boxes item, .al-roles boxes item {
padding: 32px 1em 1em;
width: 100%;
}
.al-fcs scroll a, .al-roles scroll a {
line-height: 160%;
}
.al-need .short {
padding: 0 20px;
}
.al-ank {
padding: 20px 0;
width: 100%;
}
.al-ank .short {
border-left: none;
border-right: none;
margin: 0;
padding: 10px;
width: 100%;
}
.al-ank .short:before, .al-ank .short:after {
content: none;
}
.al-ank .about {
border-left: none;
border-right: none;
}
.al-ank .chips {
padding: 0 10px;
}
.al-ank .chips p {
align-items: stretch;
flex-direction: column;
gap: 10px;
}
.al-ank .chips p span {
text-align: center;
width: 100%;
}
.al-ank .icons {
gap: 0;
justify-content: space-evenly;
}
.al-ank .icons>div p {
width: 120px;
}
.al-ank .spoilers {
border: none;
padding: 20px 0 1px;
}
.al-ep .chips p {
align-items: stretch;
flex-direction: column;
gap: 10px;
justify-content: flex-start;
}
.al-ep .title p {
padding: 9px 1em !important;
}
.al-chrono .title p {
padding: 7px 1em !important;
}
.al-chrono .year>p {
position: static;
width: 100%;
}
.al-chrono .year .episode {
border-left: none;
margin: 0;
padding: 14px 0;
}
.al-chrono .year .episode:before {
content: none;
}
.al-chrono .year .episode > p {
font-size: 1em !important;
}
.al-chrono .year .episode p .highlight-text>strong {
font-size: .8em !important;
}
.al-chrono .year .episode p .highlight-text>strong:before {
width: 20px;
}
.al-need .gif p img.postimg+img, .al-ank .gif p img.postimg+img, .punbb .post-content .al-ep .gif p img.postimg+img {
margin: 0 !important;
}
}