@font-face {
		font-family: dosvga;
		src: url('MorePerfectDOSVGA.ttf') format('truetype');
}

html {
		height: 100vh;
}

body {
		margin: 0;
		padding: 0;
		background: #41cacc;
		overflow: hidden;
}

#topbar {
		font-family: dosvga;
		background: gray;
		font-size: 0;
}

#topbar button {
		font-family: dosvga;
		font-size: 14px;
		padding: 5px;
		margin: 0;
		background: none;
}

.window {
		margin: 0;
		padding: 0;
		position: absolute;
		border: 2px solid;
		border-color: gray;
		background: white;
		resize: both;
		overflow: hidden;
}

.window .windowtext {
		background: white;
		font-family: dosvga;
		padding: 4px;
}

.windowtext p {
		margin: 0;
}

.windowbar {
		background: gray;
}

.windowbar button {
		font-family: dosvga;
		font-size: 14px;
		padding: 3px;
		margin: 0;
		background: none;

}
		
.windowbar .windowtitle {
		font-size: 14px;
		font-family: dosvga;
		padding: 5px;
		display: inline-block;
		user-select: none;
}

.desktopIcon {
		font-family: dosvga;
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 64px;
		margin: 8px;
}

.desktopIcon img {
		
}

.desktopIcon strong {
		font-size: 14px;
		margin: 0;
		padding: 4px;
}

.desktopContainer {
		margin: 8px;
}

.browserbar {
		background: gray;
		font-size: 0;
		display:flex;
		flex-direction:row;
}

.browserbar input, button {
		font-family: dosvga;
		font-size: 14px;
		background: none;
		padding: 3px;
		margin: 0;
}

.browserbar input[type=text] {
		flex-grow: 1;
}

.browserbar input[type=text] :focus {
		border-color: black;
}

.browserbar strong {
		font-family: dosvga;
		font-size: 14px;
		padding: 5px;
		margin: 0;
}

#browser_content {
	width: 100%;
	height: 100%;
	border: none;
	overflow: hidden;
}

.explorerbar {
		background: gray;
		font-size: 0;
		display:flex;
		flex-direction:row;
		justify-content: center;
}

.explorerbar input {
	font-family: dosvga;
	font-size: 14px;
	background: none;
	padding: 3px;
	margin: 0;
}

.explorerbar input[type=text] {
	width: 50%;
	align-self: center;
}

.explorer {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 100%;
	background: gray;
	font-size: 14px;
}

.explorer .icon {
		font-family: dosvga;
		display: flex;
		flex-direction: column;
		align-items: center;
		max-height: 6em;
		margin: 0.5em; 
	}

.explorer .icon strong {
		font-size: 1em;
		margin: 0;
		padding: 4px;
	}

.explorer .icon img {
	width: 3.4em;
}