/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
	:root{
	  --lebar-app: calc(100vw - 110px);
/*	  --wid-space: 0.05;*/
	}
	/*body{ background-color: #f7f7f9; }
	body > div.app { margin-top: 80px; }
	body > div.app { margin-bottom: 80px; }*/
	.app{
		/*position: relative;
		box-sizing: border-box;
		width: var(--lebar-app);
		max-width: var(--lebar-app);
		min-width: var(--lebar-app);
		overflow-x: hidden;*/
/*		margin: inherit;*/
/*		left: 200px;*/
	}

	.app:not(:has(nav)){
		margin: auto;
		left: 0;
	}

	header{
		/*width: calc(var(--lebar-app) - var(--lebar-app) * var(--wid-space));
		translate: calc(var(--lebar-app) * 0.5 * var(--wid-space)) 0;*/
/*		border-bottom-right-radius: 0;*/
/*		border-bottom-left-radius: 0;*/
	}
/*	header.header-tipe-2{*/
/*		justify-content: space-between;*/
/*	}*/
	header > a{ margin: inherit; }
	nav2 {
		box-shadow: rgba(108,114,124,.16) 5px 0 4px 0;
		overflow-y: auto;
/*		font-size: 10px;*/
/*		padding: 80px 15px 20px;*/
/*		height: inherit;*/
/*		bottom: 0;*/
/*		border-top-right-radius: 0;*/
/*		border-top-left-radius: 0;*/
/*		translate: inherit;*/
/*		left: 0;*/
/*		top: 0;*/
/*		width: 200px;*/
/*		flex-direction: row;*/
/*		justify-content: start;*/
/*		gap: 25px;*/
	}
	nav2 > div { width: 100% }
	nav2 > div > a {
		font-size: 15px;
		flex-direction: row;
		justify-content: flex-start;
	}
	nav.tipe1 summary {
		display: flex;
		justify-content: space-between;
		align-items: center;
		cursor: pointer;
	}
	nav.tipe1 details > summary::after{ content: '\25BF'; }
	nav.tipe1 details[open] > summary::after{ content: '\25B5'; }
	nav.tipe1 details > a {
		text-decoration: none;
		display: block;
		padding: 5px 0 5px 25px;
		margin: 10px 0;
	}
	nav2 summary > div {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		gap: 5px;
	}
	nav2 details > a:last-child { margin-bottom: -10px; }

	.hdodesk{ display: none; }
	.hdophon { display: block; }
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { ... }