@charset "utf-8";
@import url("page-animation.css");
:root {
	--bodyTextColor: rgb(238,238,238);
	--appbodyBackgroundColor: rgb(46,46,46);
	--invertImage100: invert(100%);
	--sidenav-ham-width: 256px;
}
html {
	min-height: 100%;
	background-color: var(--appbodyBackgroundColor);
}
body {
	margin: 0;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	color: var(--bodyTextColor);
	-webkit-user-select: none;
	cursor: default;
}
p, a, h1, h2, h3, h4, h5, h6 {
	margin: 0;
	cursor: default;
}
/*//TITLEBAR and NAVIGATION//*/
topnav {
	position: fixed;
	width: 100%;
	/*-webkit-app-region: drag;*/
	background-color: var(--appbodyBackgroundColor);
	filter: opacity(94%);
	z-index: 5;
	color: var(--bodyTextColor);
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	height: 78px;
}
@supports (-webkit-backdrop-filter: blur(20px)) or (backdrop-filter: blur(20px)) {
	topnav {
		filter: opacity(100%);
    	backdrop-filter: blur(20px) saturate(100%);
    	-webkit-backdrop-filter: blur(22px);
    	background-color: var(--appbarBackgroundColorBlur);
    	background-image: url(http://api.thumbr.it/whitenoise-362x370.png?background=ffffff00&noise=a0a0a0&density=35&opacity=4);
	}
}
/*titlebar*/
topnav>div>header {
	font-size: 0.75em;
	padding-left: 12px;
	font-weight: 500;
	line-height: 250%;
	width: calc(100% - 138px);
	-webkit-app-region: drag;
}
/*navigation bar*/
#sidenav {
	font-size: 0.94em;
	display: inline-block;
	-webkit-app-region: no-drag;
	padding: 14px 0 14px 50px;
}
#sidenav>div {
	display: inline-block;
}
/*navigation bar link*/
#sidenav a, .navright a {
	text-decoration: none;
	color: var(--bodyTextColor);
	filter: contrast(60%);
	padding: 10px;
	transition: box-shadow 0.05s ease-in-out;
}
#sidenav a:hover, .navright a:hover {
	filter: contrast(90%);
	margin: 0;
	padding: 10px;
	/*box-shadow: 0 4px 8px 0 var(--cardShadowColor);
	outline: 1px solid rgba(128,128,128,0.1);*/
}
#sidenav a:target, .navright a:target {
	border-bottom: 2px solid #0063B1;
	filter: contrast(100%);
	margin: 0 10px;
	padding: 10px 0;
}
#sidenav a:target:hover {
	box-shadow: none;
	outline: none;
}
#sidenav a:focus {
	outline: none;
}
/*navigation bar - right side*/
.navright {
	font-size: 0.94em;
	-webkit-app-region: no-drag;
	float: right;
	z-index: 2;
	width: auto;
	margin-top: 14px;
}
/*back button svg*/
/*.back {
	width: 16px;
	padding: 16px;
	filter: var(--invertImage100);
	-webkit-app-region: no-drag;
	margin: 0 0 0 -657px;
	position: fixed;
	cursor: default;
}
.back:hover {
	background-color: hsla(0,0%,0%,0.10);
}*/
/*back button unicode*/
back {
	display: inline-block;
	position: fixed;
	margin: 0 0 0 -636px;
}
.back {
    color: var(--bodyTextColor);
}
/*navigation dropdown*/
select {
	display: none;
	height: 48px;
	background-color: var(--appbodyBackgroundColor);
	color: var(--bodyTextColor);
	border: none;
	-webkit-app-region: no-drag;
	font-size: 0.94em;
}
select:focus {
	outline: none;
}
select::after {
	background-color: var(--appbodyBackgroundColor);
	color: var(--bodyTextColor);
}
/*side navigation hamburger menu*/
#hamburger-button {
	display: none;
	position: fixed;
	margin: 0 0 0 48px;
}
#sidenav-ham {
	background-color: #111;
	background-color: rgba(45,45,45,.6);
	height: 100vh;
	width: var(--sidenav-ham-width);
	position: fixed;
	transition: margin-left 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
	margin-left: -256px;
	z-index: 5;
	background-color: var(--appbodyBackgroundColor);
	filter: opacity(94%);
}
@supports (-webkit-backdrop-filter: blur(20px)) or (backdrop-filter: blur(20px)) {
	#sidenav-ham {
		filter: opacity(100%);
    	backdrop-filter: blur(20px) saturate(100%);
    	-webkit-backdrop-filter: blur(22px);
    	background-color: var(--appbarBackgroundColorBlur);
    	background-image: url(http://api.thumbr.it/whitenoise-362x370.png?background=ffffff00&noise=a0a0a0&density=35&opacity=4);
	}
}
#sidenav-ham a:target {
	border-left: 4px solid #0063b1;
}
#sidenav-ham .btn {
	margin: 1px;
}
.sideButton {
	background-color: #111;
	background-color: transparent;
	trasition: none;
	transition: 0.1s background-color;
}
.sideButton:hover {
	background-color: transparent;
	background-color: rgba(136,136,136,0.30);
}
.btn-border {
	display: inline-block;
}
#sidenav-ham .sideButtonText {
	color: var(--bodyTextColor);
	margin: 0;
	line-height: 38px;
	width: 218px;
	padding: 0 18px;
	font-size: 1em;
}
.hamburgerMenuShow, .hamburgerMenuHide, .back {
	width: 48px;
	line-height: 48px;
	margin: 0;
	text-align: center;
	font-family: 'Segoe MDL2 Assets';
	display: inline-block;
	trasition: none;
	transition: 0.1s background-color;
}
.hamburgerMenuShow:hover, .back:hover {
	background-color: transparent;
	background-color: rgba(136,136,136,0.30);
}
#sidenav-ham .menuButtonMargin {
	margin: 28px 0px 8px 0px;
}
/*switch to dropdown or sidenav-ham on smaller screen size*/
@media only screen and (max-width: 760px) {
	select {
		display: block;
		margin-left: 48px;
	}
	#sidenav {
		display: none;
	}
	.navright {
		display: none;
	}
	back {
		margin: 0 0 0 1px;
	}
	#hamburger-button {
		display: inline-block;
	}
}
/*window buttons container*/
window_buttons {
	height: 32px;
	width: 138px;
	-webkit-app-region: no-drag;
	z-index: 999;
	margin-top: -80px;
}
window_buttons:hover {
	opacity: 1 !important;
}
/*close button*/
.window_buttons {
	display: inline-block;
	float: right;
	height: 14px;
	padding: 9px 16px;
	filter: var(--invertImage100);
	-webkit-app-region: no-drag;
}
.window_buttons:hover {
	background-color: #17EEDC;
	filter: invert(100%);
	-webkit-app-region: no-drag;
}
/*maximize and minimize buttons*/
.window_buttons_b {
	display: inline-block;
	float: right;
	height: 10px;
	padding: 11px 18px;
	filter: var(--invertImage100);
	-webkit-app-region: no-drag;
}
.window_buttons_b:hover {
	background-color: hsla(0,0%,0%,0.12);
	-webkit-app-region: no-drag;
}
/*----------*/
/*//WINDOW BORDERS//*/
borders>bordertop {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background-color: #0063B1;
	z-index: 5;
}
borders>borderbottom {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	height: 1px;
	background-color: #0063B1;
	z-index: 5;
}
borders>borderleft {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	width: 1px;
	background-color: #0063B1;
	z-index: 5;
}
borders>borderright {
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	width: 1px;
	background-color: #0063B1;
	z-index: 5;
}
/*----------*/
/*page banner solid*/
.page_banner {
	background-color:#0078D7;
	padding: 1.8% 18%;
	text-align: center;
	line-height: 260%;
	color: #fff;
}
.page_banner>h1 {
	font-weight: 600;
}
.page_banner>p {
	line-height: 1.5;
	padding: 9px 0;
}
/*area with apps*/
.app_section {
	padding: 0 25px 0 25px;
}
/*app section headers*/
.app_section>h2, .sectionh {
	font-weight: 600;
	padding-bottom: 18px;
	padding-top: 40px;
}
/*//APP CARDS//*/
.app_name {
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size: 16px;
	text-decoration: none;
	line-height: 1;
	margin: 16px 0 4px 8px;
	font-weight: 600;
}
.app_image {
	margin: -8px 0px -12px 0px;
}
.price {
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size: 14px;
	line-height: 4;
	margin-left: 8px;
	margin-top: 26px;
	margin-bottom: -100px;
}
.price_double {
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size: 14px;
	line-height: 1.7;
	margin-left: 8px;
}
.ratingValue {
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size: 11px;
	margin-left: 8px;
	line-height: 1;
}
.appListing {
	width: 150px;
	background-color: var(--appCardBackground);
	min-height: 248px;
	display: inline-block;
	margin-left: auto;
    margin-right: auto;
	margin-bottom: 12px;
	transition: 0.1s ease-in-out;
}
.appListing:hover {
	background-color: var(--appCardBackgroundHover);
	box-shadow: 0 4px 8px 0 var(--cardShadowColor);
}
.applink {
	color: var(--appCardTextColor);
}
/*----------*/
/*hide scrollbar*/
::-webkit-scrollbar {
    width: 0px;
}
/*page frame*/
.iframe_a {
	position: fixed;
	height: 100%;
	width: 100%;
	border: none;
	background: hsla(0,0%,0%,0.00);
	z-index: 99;
	    margin: 0 0 0 -6px;
}

/*@media only screen and (max-width: 900px) {
	topnav > nav {
		padding: 0;
		margin: 40px 0 0 0;
		background-color: rgba(46,46,46,1.00);
		z-index: 99999;
	}
	topnav > nav > a {
		display: block;
		margin-left: 0;
	}
	.settingsTab {
		background-image: image();
	}
}

@media only screen and (min-width: 900px) {
	.settingsTab {
	background-image: none !important;
}
}

#sidenav>div {
	padding: 10px;
}
#sidenav>*/