@media screen and (max-width: 720px) {

	html,
	body,
	#pun,
	.punbb {
		width: 100% !important;
		height: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		-webkit-text-size-adjust: none;
		overflow-wrap: break-word;
		float: none;
	}

	body {
		position: relative;
		overflow: hidden !important;
		-webkit-overflow-scrolling: touch !important;
		overflow-y: auto !important;
		z-index: 1;
	background:
		url(https://forumstatic.ru/files/001c/97/9f/96285.png) no-repeat fixed top center / cover,
		url(https://forumstatic.ru/files/001c/97/9f/53430.png) no-repeat fixed center top,
		url(https://forumstatic.ru/files/001c/97/9f/61993.png) no-repeat fixed center bottom,
		#0C0C0C url(https://forumstatic.ru/files/001c/97/9f/23775.png) no-repeat fixed center bottom;
	background-blend-mode: normal, normal, normal, normal, normal;
		padding-top: 200px !important;
	}

	img {
		max-width: 100% !important;
		height: auto;
	}

	#pun_wrap #pun {
		width: 100% !important;
		border-width: 0 !important;
		overflow: hidden !important;
		margin: 0 0 150px !important;
		padding: 0 !important;
		border-radius: 0 !important;
	}

	#pun .punbb {
		padding: 15px !important;
		box-sizing: border-box;
	}

	#pun #pun-redirect.punbb .info .container {
		width: 100% !important;
	}
	
	#header_logo {
		right: 20px;
		margin: 0 !important;
		top: 90px;
		width: 80%
	}
	
	#pun-navlinks {
		justify-content: center;
		box-sizing: border-box;
		margin: 0 !important;
		width: auto !important;
		left: 0 !important;
		width: 100% !important;
		top: 0;
		border-radius: 0;
		right: unset;
	}
	
	#pun-navlinks .container:after {
		display: none !important;
	}

	#pun-navlinks span, #pun #nota-ql-navbtn {
		font-size: 0 !important;
		position: relative
	}

	#pun-navlinks>ul {
		gap: 10px;
		justify-content: flex-start;
		height: auto;
		padding: 0 !important;
	}
	
	#pun-navlinks ul.container >li > a {
		background: transparent;
		padding: 5px !important;
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		border: none
	}
	
	#pun-navlinks a span:before {
		font-size: 14px !important;
	}
	
	#navindex a span:before {
		content: "\f015";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navuserlist a span:before {
		content: "\f0c0";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navsearch a span:before {
		content: "\f002";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navprofile a span:before {
		content: "\f2bb";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navpm a span:before {
		content: "\f0e0";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	.settings_wrap .slide_button {
		font-size: 0;
	}
	

	#navadmin a span:before, .settings_wrap .slide_button:before {
		content: "\f013";
		font-family: FontAwesome;
		font-size: 14px;
		display: block;
		font-weight: normal !important;
	}


	#navlogout a span:before {
		content: "\f2f5";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navprofiles > a:before {
		content: "\f021";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
		font-size: 14px !important;
	}

	#navlogin a span:before {
		content: "\f2f6";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navregister a span:before {
		content: "\f234";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navpr_1 a span:before {
		content: "\f0f3";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}
	
	#navpr_2 a span:before {
		content: "\f02d";
		font-family: FontAwesome;
		display: block;
		font-weight: normal !important;
	}

	#navlogout {
		gap: 5px
	}

	#pun #pun-navlinks ul > li > a {
		flex: unset !important;
	}
	
	#pun-announcement .container .html-box {
		margin: 15px 0 0 !important;
	}

	#pun-ulinks .container,
	#pun-ulinks.section {
		flex-wrap: wrap;
		height: auto !important;
		align-items: center !important;
		justify-content: flex-start;
		display: flex;
		gap: 5px;
		padding:0 !important;
		margin: 0px -15px 0px !important;
		border-radius: 0 !important;
		position: relative;
		width: auto !important;
		right: unset;
	}
	
	#pun #pun-ulinks {
		border: 1px solid var(--borders) !important;
		margin-top: 20px !important;
		padding: 10px 20px !important;
		box-sizing: border-box
	}
	
	#pun-ulinks.section {
		margin-bottom: 20px !important;
	}
	
	#pun-ulinks li {
		display: block
	}

	#pun-ulinks .container a {
		padding: 2px 10px 3px !important;
		background: var(--beg100);
		border-radius: 10px;
		margin: 0 !important;
		display: block;
		border: none !important;
	}
	
 #pun-ulinks.fixed {
		display: none
	}
	
	#pun-status {
		margin-left: 0 !important;
		width: 100% !important;
		left: 0;
		top: 0 !important;
		position: relative;
		text-align: left;
		margin: 0 !important;
		color: var(--text1);
		background: transparent;
		padding: 0 !important;
		justify-content: flex-start;
		text-shadow: none
	}
	
	#pun-status .container {
		text-transform: lowercase
	}
	
	#pun-status .item3,
	#pun-status .item4,
	#pun-status .item2 {
		display: none !important;
	}
	
	#pun-crumbs1, #pun-crumbs2 {
		padding: 0;
	}

	#pun-crumbs2 {
		margin-top: 20px !important;
	}

	#pun-index .category {
		padding: 0px 0px !important;
	}

	#pun-index .category tr {
		padding: 0 0 15px !important;
		flex-direction: column;
		width: auto !important;
		align-items: flex-end;
		gap: 10px !important;
		margin: 0 0px !important;
	}
	
	#pun-index .category tr + tr {
		margin-top: 15px !important;
	}

	#pun-index td.tcl,
	#pun-index td.tcr {
		width: 100% !important;
		overflow: visible;
		padding: 0 15px !important;
	}

	#pun-index .tclcon {
		display: flex;
		flex-direction: column;
		padding: 0px
	}

	#pun-index .subforums {
		margin-top: 10px
	}


	#pun-index td.tcr {
		padding: 10px !important;
		box-sizing: border-box;
		background: var(--beg100);
		border-radius: 10px;
		overflow: visible !important;
	}
	
	#pun .lastmess_wrap {
		display: flex;
		flex-direction: column;
		gap: 3px;
		flex: 1;
		align-items: flex-end;
		text-align: right
	}

	#pun-index .tcr a.lastpost-link {
		width: auto !important;
		text-align: right;
		white-space: wrap
	}

	#pun-stats {
		margin: 0px 0 0px !important;
	}

	#pun #pun-stats .container {
		padding: 0 0px 0px !important;
		flex-direction: column;
		display: flex;
		height: auto
	}
	

	.ststitems {
		display: none
	}

	.onlinelist,
	.users_24h {
		width: 100%;
	}
	
	.banners_wrapper {
		border-radius: 0 !important;
	}

	#pun-viewforum .forum .tc2,
	#pun-viewforum .forum .tc3,
	#pun-searchtopics .forum .tc3 {
		display: none
	}

	#pun .forum thead {
		display: none !important;
	}
	
	#pun .forum {
		padding: 10px !important;
	}
	
	#pun .forum tr {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 5px;
	}

	#pun .forum .tcr {
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		text-align: right
	}
	
	#pun .forum .user-avatar {
		display: none;
	}

	#pun .forum tr td {
		width: auto !important;
	}

	#pun-messages .fs-box {
		padding: 25px 15px 15px !important;
	}

	.post {
		padding: 0 !important;
	}

	#pun .post-author {
		float: none !important;
		width: 100% !important;
		margin: 0 0 20px !important;
		padding: 10px;
					background: 
		#202020 url(https://forumstatic.ru/files/001c/97/9f/52076.png);
	background-blend-mode:normal;
	}
	

	.pa-fld1,
	.pa-fld2,
	.pa-fld4,
	.pa-fld5,
	.pa-fld6,
	.pa-ip {
		display: none !important;
	}

	.post-author ul {
		border-radius: 0px !important;
		display: grid;
		grid-template-columns: 50px 1fr;
		grid-template-rows: minmax 1fr;
		gap: 10px 20px;
		grid-template-areas:
			"ava name"
			"ava title";
		padding: 0px !important;
		width: auto;
		background: transparent
	}

	#pun .pa-author {
		align-self: end;
		grid-area: name;
		margin: 0 0 -10px !important;
		justify-self: stretch;
		text-align: left !important;
		justify-content: flex-end;
		padding: 0 !important;
	}

	#pun .pa-title {
		align-self: start;
		grid-area: title;
		margin: 0 !important;
		text-align: left !important;
	}

    #pun .pa-avatar {
        grid-area: ava;
    height: 50px;
    width: 50px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    }
	
	#pun .field_wrap2 {
		padding: 0px 10px !important;
		margin: 10px 0 0 !important;
		justify-content: flex-start;
	}
	
	.pa-links ul {
		display: flex;
		margin: 0 !important;
		padding: 0 !important;
	}

	#pun .post-body {
		margin: 0 !important;
		padding: 0px !important;
	}
	
	#pun .post-box {
		padding: 0 !important;
	}

	#pun .punbb .post-links {
		padding: 0 !important;
		margin: 0 !important;
	}

	#pun .punbb .post-links ul {
		display: flex;
		flex-wrap: wrap;
		gap: 10px 5px;
		padding-top: 10px
	}

	#pun .punbb .post-links ul a {
		font-size: 10px !important;
	}

	.pl-email.pm {
		margin-right: auto !important;
	}

	.post-links li+li,
	.pa-links li+li {
		margin: 0 !important;
	}

	#pun #post.container {
		padding: 0 !important;
		padding: 10px !important;
	}
	
	.punbb .formsubmit {
		flex-wrap: wrap;
		gap: 5px;
	}
	
	.punbb .formsubmit input {
		margin: 0 !important;
	}
	
	#togglePreview {
		margin: 0;
	}

	#pun #post-form {
		padding: 0 !important;
	}

	#pun #form-buttons {
		flex-direction: column;
	}

	.tcl.username {
		width: 20% !important;
	}

	.tc3.num_posts,
	.tc3.registered {
		display: none
	}

	.tc3.last_visit {
		width: 20% !important;
	}

#profile .container {
	padding: 0;
}

	#viewprofile-next .container {
		padding: 0px !important;
	}

	#viewprofile tr {
		flex-direction: column;
	}

	#pun #viewprofile #profile-left {
		width: 100% !important;
		align-items: center;
		padding: 10px !important;
		box-sizing: border-box
	}

	#pun #viewprofile #profile-right {
		padding: 10px !important;
		margin: 10px 0 0;
		border: 1px solid var(--borders) !important;
		border-radius: 12px;
	}

	#pun-messages #profilenav ul {
		flex-wrap: wrap
	}

	#pun-messages .fs-box .container tr {
		padding: 0 !important;
	}

	#pun-messages .fs-box .container td {
		text-align: left;
		padding: 5px !important;
	}

	.tc2.pmtc22,
	.tc3.pmtc33 {
		white-space: wrap !important;
		width: 25% !important;
	}

	#punbbsearch.container {
		padding: 0 !important;
	}

	.forum div.tclcon {
		flex: 1;
	}

	#pun .arrow_wrap {
		margin: 0 !important;
		z-index: 9999;
		right: 5px;
		justify-content: flex-end;
		height: auto;
		bottom: 0;
		top: unset;
		transform: unset
	}

	.go-up em,
	.go-down em {
		 display: none !important;
	}

	#profile {
		flex-wrap: wrap;
	}

	#profilenav {
		margin: 0 !important;
		width: 100%
	}

	#profilenav ul {
		display: flex;
		flex-wrap: wrap;
		gap: 5px;
		padding: 0
	}

	#profilenav li {
		padding: 0px !important;
		flex: auto;
		text-align: center;
	}

	#profilenav li a {
		display: block;
		background: var(--beg300);
		padding: 3px 10px;
		border-radius: 7px;
	}

	#profile form.container {
		padding: 0 !important;
		display: flex;
		flex-direction: column;
		margin-top: 10px
	}

	#tags .container {
		max-width: 100%;
		box-sizing: border-box
	}

	.post-rating {
		margin-right: 20px
	}

	.post-sig {
		display: none
	}

	#BookmCntToggle {
		top: 90px !important;
		left: 10px !important;
	}
	#mobile-style-toggler {
		right: unset;
		left: 10px;
		top: 130px;
		width: 26px;
		box-sizing: border-box;
		display: flex;
		justify-content: center;
	}
	.header_start {
		flex-direction: column;
		margin-top: 35px !important;
	}
	
	.header_whispers {
		width: auto;
	}
	.header_bottom {
		flex-wrap: wrap;
		margin-top: 5px;
	}
	
	.header_bottom a {
		border: 1px solid var(--borders) !important;
		border-radius: 10px;
	}
	.banners {
		left: 0 !important;
		margin: 0 !important;
		width: auto;
	}
	#form-buttons td {
		min-width: 30px;
		flex: 1;
	}
}