/* Main navigation */
@media screen and (max-width: 1150px)	{ #headgrid { transform: scale(0.8); } }
@media screen and (max-width: 1000px)	{ #headgrid { transform: scale(0.85); } }
@media screen and (max-width: 950px)	{ #headgrid { transform: scale(0.65); } }


/* Media stylesheets, mostly */
@media only screen and (max-width: 999px) {
}

@media only screen and (min-width: 1000px) {
}

@media screen and (max-width: 800px) {
}

@media screen and (min-width: 870px) {
	.mobnav, #showmobmenu, .tmobnav							{ display: none }
	.linknav .mnav, #mainhead, #unavmenu						{ display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; align-content: center }
	.linknav .mnav, #mainhead, #unavmenu						{ justify-content: center; }
}

@media screen and (max-width: 870px)
{
	/* Grid fix */
	div[class^="maincol"]				{ grid-column: 1 !important; }
	div[class^="mainrow"]				{ grid-row: 1 !important; }

	/* User sidebar hide */
	.header								{ max-width: 100%; top: 0; }
	.usplit								{ grid-template-columns: 100% }
	.ucontent							{ grid-column: 1 / 1 }
	.ucpanel							{ opacity: 0; grid-column: unset }
	#userbtns							{ display: flex; opacity: 1; padding: 0px 10px 0 0 ; }
	#ubar_field							{ padding: 0 5px 0 5px; width: unset }
	.upanel								{ right: -255px; }
	
	/* Hide given elements */
	.ucpanel, #unavmenu,#touractarea, #pausebtn	{ 
		display: none 
	}
	
	
	#ubar_field							{ line-height: 30px; height: 90px; }
	#mainhead, .tmobnav, .critem, .csendmain, .mtitles { display: none; }
	
	#tournav_show						{ display: block; }
	
	.mobnav								{ display: block; position: fixed; top: 0; padding: 0 !important; left: 0; z-index: 190; height: 60px; width: 100%; }
	.mobarea							{ grid-template-columns: 25px minmax(100px, auto); }
	#corealign							{ padding-top: 50px;  }
	.mainbg								{ height: 100%; }
	.moblink							{ margin-bottom: 2px; }

	.tournav							{ display: block; text-align: left; width: 100%; margin: 0  }
	.navicon							{ max-height: 12px; margin-right: 5px; }
	.mw.cwidth.mwflex					{ margin-top: 0px; }
	img.topmoblogo						{ max-height: 40px; }
	div.topmoblogo						{ margin: 10px 0 0 0 }
	
	#matchinfo							{ padding: 10px; max-width: calc(100% - 30px); }
	
	
	/* Chats */
	.chat2						 		{ grid-template-columns: auto 25px }
	.csendmain							{ opacity: 0; }
	.csendmobile						{ opacity: 1; display: block }
	.cmactive.cmroom					{ width: 100%;  }
	.cminactive.cmroom					{ width: 0px; }
	.cminactive.cmessages				{ width: calc(100% - 10px); }

	
	.chat_rlist input						{ max-width: unset; min-width: unset }
	.sflex								{ flex-flow: row wrap; grid-template-columns: 100%; padding: 0 0 0 0; margin: 0 0 0 0  }
	.crlbase							{ height: 150px; }
	.chatsendnarrow						{ width: 25px; }
	
	.crcombined							{ display: inline-block;  }
	.crcomnum							{ text-align: center; height: 23px; padding: 1px; margin: 1px; width: 50px; white-space: nowrap; }
	.crcomdate							{ height: 23px; padding: 1px; margin: 1px; }
	.crcomdate, .crcomnum, .crcomteam	{ font-size: 11px; }
	.crcombined div 					{ display: inline-block; }
	.crcombtn input						{ width: 100%; }
	.chat_rlist					 		{ grid-template-columns: 50px minmax(50px, 120px) auto minmax(80px, 100px)}
	.cb, .cbr							{ max-width: unset; min-width: unset; padding: 3px 5px 3px 5px; }
	
	/* matchmaking grids */
	.gridmscore							{ grid-template-columns: 100%; }
	.pline::before						{ display: block; top: 0; left: 0; height: 30px; width: 100%; content: attr(st); }
	.lastline							{ margin-bottom: 10px; }
	
	label[class^="btnno"], label[class^="btnno"]::after, 
	label[class^="btnbase"], label[class^="btnbase"]::after { }
	label[class^="btnno"], div:not(.calign) > label[class^="btnbase"] {
		display: flex; justify-content: flex-start; align-items: center; align-content: center;
	}
	
	div:not(.calign) > label[class^="btnbase"]			{  }
	div:not(.calign) > label[class^="btnbase"]			{ height: 22px; text-align: left; padding: 0 0 0 5px }
	div:not(.calign) > label[class^="btnbase"]::after	{ height: 22px; }
	label[class^="btnno"]								{ height: 22px; margin: 0 0 0 2px; padding: 0 0 0 5px }
	
	.egrid.w2							{ grid-template-columns: 1fr; }
	
}

@media screen and (max-width: 500px) {

}

@media (pointer: fine)  {
	.sloga .lognav:hover				{ box-shadow: 2px 0 7px 7px rgba(0, 0, 0, .3); filter: brightness(1.1); }
}