@media (prefers-color-scheme: dark) {
	body {
		background-color: #f3f3f3;
	}
}

#wrap {
	padding: 0 8px;
}
.linklist.navlinks, #page-body > h2 > a, .linklist {

}
.linklist.navlinks, .linklist {

}
#page-body > h2 {
	margin: 0.8em 0 0.5em 0;
}
#page-body > h2 > a {
	font-family: system-ui, arial, helvetica, sans-serif;
	font-size: 1.5rem;
}
.headerbar {
	border-top-right-radius: 2px;
	border-top-left-radius: 2px;
	margin-bottom: 0;
}
.page-header .navbar {
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
}
.postprofile dt a {
	font-size: 13px;
}
ul.navlinks {
	border-bottom: none;
}
#page-footer .navbar {
	background-color: #f49ac1;
	color: #111;
	padding: 0.25rem 1rem;
    border-radius: 4px;
}
#page-footer .navbar a {
	color: white;
}

.modalBox {
	width: 400px;
	height: 200px;
	max-width: 100%;
	padding: 1rem;
	box-sizing: border-box;
	position: relative;
	left: calc(50% - 200px);
	top: calc(50% - 100px);
	background-color: #cadceb;
	border-radius: 2px;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.modalBoxHeader {
	text-align:  center;
	color: #222;
	font-size: 1.15rem;
}
h3 {
	font-size: 0.9rem;
	letter-spacing: 0.5px;
	text-transform: none;
}
.textFlip {
	display: inline-block;
	-moz-transform: scale(-1, 1);
	-webkit-transform: scale(-1, 1);
	-o-transform: scale(-1, 1);
	-ms-transform: scale(-1, 1);
	transform: scale(-1, 1);
}
.textRotate {
	transform: rotate(90deg);
    display: inline-block;
}
@media (max-width:480px) {
	body {
		padding: 0;
	}
	.topic-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	ul.topiclist li.row dl {
		padding: 0;
	    display: grid;
	    grid-template-columns: 3fr 1px 1px 1fr;
	}
	.lastpost_time {
		display: none;
	}
	.mobile-centered {
		float: none !important;
		text-align: center;
	}

	#search-box a {
		display: none;
	}

	.post {
		border-bottom: 1px solid #ccc;
		overflow: hidden;
	}
	
	.post-text {
		font-size: 18px !important;
	}

	.post-user-details {
		max-height: 120px;
		overflow: hidden;
	}	

	#wrap {
		width: 100%;
		min-width: auto;
		padding: 0;
	}

	.headerbar .inner {
		grid-template-columns: 0 auto 45%;
    	display: grid;
	}
	.navbar {

	}

	h2 {
		font-size: 22px;
	}

	.forumbg {
		padding: 0;
	}

	.corners-top {
		display: none;
	}

	#page-body {
		padding: 5px;
	}

	ul.topiclist dd.posts, ul.topiclist dd.views {
		display: none;
	}
	ul.topiclist dt {
		float: none;
		width: calc(100% - 10px);
	}

	ul.topiclist .row a img {
		display: none;
	}

	ul.topiclist dt a.topictitle {
		font-size: 15px;
	}

	ul.topiclist .row {
		padding-top: 10px;
				padding-bottom: 10px;
	}

	.post {
		padding: 0;
	}
	.post .inner {
		display: grid;
		grid-template-columns: 0px auto 85px 0px 0px;
		direction: rtl;
	}

	.corners-top {
		width: 0px;
		height: 0px;s
	}
	.back2top {
		display: none;
	}
	.postbody {
	    padding: 15px;
	    padding-left: 10px;
	    padding-right: 10px;
	    width: auto;
	    float: none;

	}
	ul.profile-icons li {
    float: none; 

    display: inline-block;
}
.post .author {
	display: block;
	width: calc(100% - 8px);
	text-align: right;
	padding: 4px;
	position: absolute;
	bottom: 0;
	left: 0;
	margin: 0;
}
.post .author strong, .post .author .author_by {
	display: none;
}
.postbody ul.profile-icons {
	float: none;
	text-align: right;

}
	.postbody, .postbody .content {
		direction: ltr;
	}
	.postbody {
		position: relative;
	}

	.postbody .content {
		line-height: 1.6em;
		max-width: 250px;
	}
	.postprofile {
    border-left: none;
    float: none;
    width: auto;
	}

	.content {
		text-align: left;
	}

	#message-box textarea {
		width: 100%;
	}
	twitter-widget, .postbody iframe, .postbody blockquote {
		max-width: 250px !important;
		transform: none !important;
		width: initial !important;
		min-width: initial !important;
	}
	.postprofile > dt {
		text-align: right;
	}
	.postprofile a {
    	font-size: 14px;
	}
	.topic-actions .search-box {
		display: none;
	}
	.username-coloured {
		font-size: 14px;
		padding: 4px !important;
		padding-bottom: 4px !important;
		display: inline-block !important;
		text-align: center;
		line-height: 18px;
	}
	.postprofile .username-coloured {
		display: inline-block !important;
		text-align: center;
	}
	.postprofile {
		margin: 0;
	}
.postprofile dt {
    overflow: initial;
}
	.postprofile dd, .postprofile dt {
		margin-left: 0;
	}

}

.headerbar {
	background-color: #f49ac1;
}

@-webkit-keyframes LRScroll {
    0%{background-position:0% 55%}
    50%{background-position:100% 46%}
    100%{background-position:0% 55%}
}
@-moz-keyframes LRScroll {
    0%{background-position:0% 55%}
    50%{background-position:100% 46%}
    100%{background-position:0% 55%}
}
@keyframes LRScroll {
    0%{background-position:0% 55%}
    50%{background-position:100% 46%}
    100%{background-position:0% 55%}
}

.user_avatar_container {
	position: relative;
}

.user_avatar_container > a {
	display: inline-block;
	padding: 4px;
}

.user_avatar_container > a > span {
	display: inline-block;
}

.user_spirit {
	position: absolute;
	left: 10px;
	bottom: 10px;
	width: 30px;
	height: 30px;
}

.user_spirit.koala {
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 511.999 511.999' style='enable-background:new 0 0 511.999 511.999;' xml:space='preserve'%3E%3Cg%3E%3Cellipse transform='matrix(0.5892 -0.808 0.808 0.5892 -89.2781 142.5514)' style='fill:%23878791;' cx='95.549' cy='159.074' rx='107.356' ry='88.631'/%3E%3Cellipse transform='matrix(0.5892 0.808 -0.808 0.5892 299.6053 -271.1422)' style='fill:%23878791;' cx='416.45' cy='159.067' rx='107.356' ry='88.631'/%3E%3C/g%3E%3Cpath style='fill:%23A5A5AD;' d='M437.679,272.518c0,100.338-81.34,181.678-181.678,181.678S74.323,372.856,74.323,272.518 c0-21.235,3.643-41.619,10.338-60.561c16.422-46.463,51.209-84.251,95.639-104.643c23.044-10.577,48.683-16.474,75.701-16.474 C356.339,90.84,437.679,172.18,437.679,272.518z'/%3E%3Cpath style='fill:%23C0C0C6;' d='M305.549,396.389c0,18.243-26.745,41.29-49.548,41.29c-22.804,0-49.548-23.047-49.548-41.29 s26.745-24.774,49.548-24.774C278.805,371.615,305.549,378.146,305.549,396.389z'/%3E%3Cpath style='fill:%23D3D3D7;' d='M322.066,375.744c0,20.523-29.578,37.161-66.065,37.161s-66.065-16.638-66.065-37.161 s29.578-61.936,66.065-61.936S322.066,355.22,322.066,375.744z'/%3E%3Cg%3E%3Cpath style='fill:%23464655;' d='M256.001,289.034c-18.243,0-33.032,14.789-33.032,33.032v66.065 c0,18.243,14.789,24.774,33.032,24.774c18.243,0,33.032-6.531,33.032-24.774v-66.065 C289.033,303.822,274.244,289.034,256.001,289.034z'/%3E%3Ccircle style='fill:%23464655;' cx='181.678' cy='289.034' r='16.516'/%3E%3Ccircle style='fill:%23464655;' cx='330.324' cy='289.034' r='16.516'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.user_spirit.panda {
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:%236B676E;' d='M49.548,157.817c0,0-41.29-32.016-41.29-66.065c0-33.032,16.516-82.581,74.323-74.323 c41.685,5.955,49.548,82.581,49.548,82.581L49.548,157.817z'/%3E%3Cpath style='fill:%236B676E;' d='M462.453,157.817c0,0,41.29-32.016,41.29-66.065c0-33.032-16.516-82.581-74.323-74.323 c-41.685,5.955-49.548,82.581-49.548,82.581L462.453,157.817z'/%3E%3C/g%3E%3Cpath style='fill:%23FFEBD2;' d='M512,280.774c0,132.263-114.615,214.71-256.001,214.71S0,413.038,0,280.774 S141.98,33.032,256.001,33.032S512,148.511,512,280.774z'/%3E%3Cpath style='fill:%23E9D7C3;' d='M165.162,421.063c0,41.048,40.67,74.323,90.839,74.323s90.839-33.275,90.839-74.323H165.162z'/%3E%3Cpath style='fill:%23FFFFFF;' d='M322.065,305.549C297.291,264.258,280.775,256,256.001,256c-24.774,0-41.29,8.258-66.065,49.548 c-21.244,35.407-39.365,105.632-24.774,123.871c33.032,41.29,82.581,16.516,90.839,16.516c8.258,0,57.807,24.774,90.839-16.516 C361.43,411.181,343.308,340.954,322.065,305.549z'/%3E%3Cg%3E%3Cpath style='fill:%236B676E;' d='M305.549,247.742c0-22.804,18.487-41.29,41.29-41.29c24.774,0,99.097,49.549,99.097,82.581 s-39.967,72.452-74.323,49.548C346.839,322.065,305.549,264.258,305.549,247.742z'/%3E%3Cpath style='fill:%236B676E;' d='M206.452,247.742c0-22.804-18.487-41.29-41.29-41.29c-24.774,0-99.097,49.549-99.097,82.581 s39.967,72.452,74.323,49.548C165.162,322.065,206.452,264.258,206.452,247.742z'/%3E%3C/g%3E%3Cg%3E%3Cpath style='fill:%23464655;' d='M256.001,363.311c-15.03,0-57.807,2.834-57.807,16.516c0,24.819,52.742,42.62,57.807,41.29 c5.064,1.33,57.807-16.472,57.807-41.29C313.807,366.144,271.03,363.311,256.001,363.311z'/%3E%3Ccircle style='fill:%23464655;' cx='165.162' cy='247.742' r='16.516'/%3E%3Ccircle style='fill:%23464655;' cx='346.839' cy='247.742' r='16.516'/%3E%3C/g%3E%3C/svg%3E%0A");
}
/* marza */
fieldset.fields1 dd {
    margin-left: 0;
}
.headerbar .inner {
    grid-template-columns: 0 auto 50%;
}

#imageLoader {
	width: 100%;
    border: 1px dashed #000;
    padding: 0.5rem;
    box-sizing: border-box;
    text-align: center;
    margin-top: 0.5rem;
}
#imageLoader::file-selector-button {
	border-radius:  0;
}
#imageLoader::placeholder {

}
input[name="imageUpload"] {
	padding: 0.25rem;
	font-family: arial;
	font-size: 12px;
	background-image:  url('data:image/svg+xml,%3C%3Fxml version="1.0" encoding="iso-8859-1" --%3E%3Csvg id="chart" viewBox="0 0 500 500"%3E%3Crect x="25" y="25" width="450" height="450" fill="none" stroke="#000" stroke-width="10"%3E%3C/rect%3E%3Ccircle cx="100" cy="100" r="30" fill="#f00" stroke="#000" stroke-width="1"%3E%3C/circle%3E%3Cpath d="M60,450 L60,350 L120,280 L180,320 L320,140 L445,300 L445,450" fill="#111" stroke="#000" stroke-width="1"%3E%3C/path%3E%3C/svg%3E');
	background-size:  10px 10px;
	background-repeat: no-repeat;
}

.void_post_row {
	padding-top: 4px;
	padding-bottom: 4px;
}
.xvoid_post_row > dl {
	display: grid;
	grid-template-columns: 6fr 1fr 1fr 2fr;
	padding: 1rem;
}
.xvoid_post_row > dl > dt, .xvoid_post_row > dl > dd {
	padding-left: none;
	width: auto;
	float: none;
	display: block;
}
.xvoid_post_row .pagination {
	height: auto;
}
h3.void_topic_subtitle {
	border: none;
	margin: 0;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}
.forabg, .forumbg {
	background: none;
	padding: 0;
	border-radius: 12px;
}
.forumbg span.corners-top, .forumbg span.corners-bottom {
	display: none;
}
ul.forums {
	background: none;
}
ul.topiclist .header {
	background-color: #00608f;
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
}
.topiclist.forums, .topiclist.topics {

}
ul.topiclist dl.icon {
	display: grid;
	grid-template-columns: 10fr 1fr 1fr 3fr;
	align-items: center;
}
ul.topiclist dl.icon dt, ul.topiclist dl.icon dd {
	width: auto;
	float: none;
	line-height: auto;
}
ul.topiclist .header dl.icon dt, ul.topiclist .header dl.icon dd {
	min-height: auto;
	height: auto;
	margin: 0;
	padding: 8px 0 8px 0;
	font-size: 12px;
	text-transform: none;
}
ul.topiclist .header dl.icon dt {
	padding-left: 1rem;
}

.verified svg {
	vertical-align: bottom;
	width: 20px;
	margin-left: 4px;
}
.verified svg path {
	fill: #f49ac1;
}
