html {
	width: 100%;
	height: 100%;
}

html, body {
	padding: 0;
	margin: 0;
	background: var(--document-background);
}

body {
	min-height: 100%;
	min-width: 100%;
	display: flex;
	flex-direction: vertical;
	color: var(--text-color);
}

:root {
	--header-height: 4em;
	--document-background: #FFF;
	
	--panel-border: #DDD;
	--panel-background: #FFF;
	--panel-hover: #EEE;
	
	--text-color: #222;
	--link-color: #F63;
	--link-hover: #F74;
}


#site-header {
	position: fixed;
	width: 100%;
	top: 0;
	right: 0;
	left: 0;
	height: var(--header-height);
	background: var(--document-background);
	border-bottom: 1px solid var(--panel-border);
}

#site-header .header-home {
	
}


#site-body {
	margin-top: var(--header-height);
	background: var(--document-background);
	padding: 0.25em;
	width: 100%;
}

* {
	box-sizing: border-box;
}

a {
	cursor: pointer;
	color: var(--link-color);
}

a:hover {
	color: var(--link-hover);
}



.click-panel {
	cursor: pointer;
	background: var(--panel-background);
}

.click-panel:hover {
	background: var(--panel-hover);
}