body{background:#f1f1f1;cursor:default;moz-user-select:-moz-none;-moz-user-select:none;-o-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;}
@media screen and (min-width:400px ) {
	.app{display:inline-block;padding:0px;color:black;text-decoration:none;text-align:center;width:150px;margin-top:10px;cursor:default!important}
	.app img{box-shadow:2px 2px 5px 0 rgba(0,0,0,0.1);width:100px;height:100px;padding:10px;border-radius:20px;background:white;transition:all .1s}
	.app:hover img{background:#ececec}
	.app:active img{background:#d8d8d8}
	.app p{font-size:1.2em;margin:0;margin-top:10px}
	.app h3{font-size:1em;font-weight:normal;color:grey;margin:0}
	.appsbox{overflow-x:scroll;width:100vw;position:absolute;top:70px;bottom:30px;margin:auto;left:0;right:0;text-align:center;height:210px;width:100vw}
	.appcontainer{width:fit-content;white-space:nowrap;height:fit-content}
}
@media screen and (max-width:400px ) {
	.appcontainer{padding-top:100px;padding-bottom:50px}
	.app{display:block;text-align:left;margin:10px;text-decoration:none}
	.app img{box-shadow:2px 2px 5px 0 rgba(0,0,0,0.1);margin-top:5px;vertical-align:middle;height:60px;width:60px;border-radius:5px;background:white;transition:all .1s}
	.app:active img{background:#d8d8d8}
	.detail{margin-left:10px;display:inline-block;vertical-align:middle}
	.detail p,.detail h3{text-decoration:none;margin:0}
	.detail p{color:black;font-size:1.5em;}
	.detail h3{color:grey;font-size:1em;font-weight:normal}
	.app:active .detail{opacity:0.7}
	.positiondiv{display:none}
	*{cursor:default}
	.header,.footer{background:rgba(255,255,255,0.8)!important;backdrop-filter:blur(5px)}
	.footer{font-size:0.9em!important}
}
.clickable{color:#1E9FFF;text-decoration:none}
.btm-list{float:right;padding-right:10px;color:#1E9FFF;text-decoration:none}
.clickable:hover,.btm-list:hover{color:#0091ff;}
.clickable:active,.btm-list:active{text-shadow:0 0 1px #1E9FFF}
.header{z-index:100;background:white;position:fixed;top:0;left:0;width:100%;border-radius:0 0 10px 10px;text-align:center;box-shadow:0 0 10px 0 rgba(0,0,0,0.3)}
.footer{height:20px;position:fixed;bottom:0;left:0;width:calc(100% - 10px);background:white;padding:5px;border-radius:10px 10px 0 0;box-shadow:0 0 10px 0 rgba(0,0,0,0.3)}
*::-webkit-scrollbar{display:none;cursor:default!important}
*{ -ms-overflow-style:none;overflow:-moz-scrollbars-none;}
*{scrollbar-width:none}
.btm-menu{box-shadow:0 -10px 8px -5px rgba(0,0,0,0.3);z-index:10;position:fixed;background:white;border-radius:5px;padding:5px;right:30px;bottom:25px;padding-bottom:10px;display:none;text-align:left}

@media (prefers-color-scheme: dark) {
	body{background:#242424;cursor:default;moz-user-select:-moz-none;-moz-user-select:none;-o-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;}
	@media screen and (min-width:400px ) {
		.app{display:inline-block;padding:0px;color:black;text-decoration:none;text-align:center;width:150px;margin-top:10px;cursor:default!important}
		.app img{box-shadow:2px 2px 5px 0 rgba(0,0,0,0.1);width:100px;height:100px;padding:10px;border-radius:20px;background:rgb(0, 0, 0);transition:all .1s}
		.app:hover img{background:#141414}
		.app:active img{background:#1b1b1b}
		.app p{font-size:1.2em;margin:0;margin-top:10px;color:white}
		.app h3{font-size:1em;font-weight:normal;color:grey;margin:0}
		.appsbox{overflow-x:scroll;width:100vw;position:absolute;top:70px;bottom:30px;margin:auto;left:0;right:0;text-align:center;height:210px;width:100vw}
		.appcontainer{width:fit-content;white-space:nowrap;height:fit-content}
	}
	@media screen and (max-width:400px ) {
		.appcontainer{padding-top:100px;padding-bottom:50px}
		.app{display:block;text-align:left;margin:10px;text-decoration:none}
		.app img{box-shadow:2px 2px 5px 0 rgba(24, 24, 24, 0.1);margin-top:5px;vertical-align:middle;height:60px;width:60px;border-radius:5px;background:rgb(0, 0, 0);transition:all .1s}
		.app:active img{background:#1b1b1b}
		.detail{margin-left:10px;display:inline-block;vertical-align:middle}
		.detail p,.detail h3{text-decoration:none;margin:0}
		.detail p{color:white;font-size:1.5em;}
		.detail h3{color:grey;font-size:1em;font-weight:normal}
		.app:active .detail{opacity:0.7}
		.positiondiv{display:none}
		*{cursor:default}
		.header,.footer{background:rgba(55,55,55,0.8)!important;backdrop-filter:blur(5px)}
	}
	.clickable{color:#1E9FFF;text-decoration:none}
	.btm-list{float:right;padding-right:10px;color:#1E9FFF;text-decoration:none}
	.clickable:hover,.btm-list:hover{color:#0091ff;}
	.clickable:active,.btm-list:active{text-shadow:0 0 1px #1E9FFF}
	.header{background:rgb(0, 0, 0);position:fixed;top:0;left:0;width:100%;border-radius:0 0 10px 10px;text-align:center;box-shadow:0 0 10px 0 rgba(0,0,0,0.3)}
	.footer{height:20px;position:fixed;bottom:0;left:0;width:calc(100% - 10px);background:rgb(0, 0, 0);padding:5px;border-radius:10px 10px 0 0;box-shadow:0 0 10px 0 rgba(0,0,0,0.3)}
	*::-webkit-scrollbar{display:none;cursor:default!important}
	*{ -ms-overflow-style:none;overflow:-moz-scrollbars-none;}
	*{scrollbar-width:none}
	.btm-menu{box-shadow:0 -10px 8px -5px rgba(0,0,0,0.3);z-index:10;position:fixed;background:white;border-radius:5px;padding:5px;right:30px;bottom:25px;padding-bottom:10px;display:none;text-align:left}
}