html {
	height: 101%; 
	background-color: #fff; 
	color: #444; 
}

html, body { 
	font-family: "Inter", arial, helvetica, "sans-serif"; 
	font-weight: 400; 
	font-size: 16px; 
	line-height: 16px; 
	margin: 0; 
	padding: 0; 
	border: 0; 
}

body, div, span, p, form, input, select, textarea, label, table, tr, th, td, img, a, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dd, dt { 
	margin: 0; 
	padding: 0; 
	border: 0; 
	font: inherit; 
	line-height: inherit; 
	background-color: inherit; 
	color: inherit; 
	vertical-align: baseline; 
}

table { 
	border-spacing: 0; 
	border-collapse: collapse; 
}

div#head { 
	display: flex;
	margin: 0 auto; 
	font-size: 24px; 
	line-height: 24px;
	padding: 22px 0;
	border-bottom: 3px solid #444; 
}

h1 {
	flex: 1;
}

div#head ul {
	flex: 1;
	text-align: right;
}

div#head ul li {
	display: inline;
	padding-left: 16px;
}

div#head a {
	text-decoration: none;
}

div#main { 
	clear: both;
	margin: 22px auto;
}

h2 { 
	font-size: 22px;
	line-height: 30px;
	font-weight: 700;
}

h3 {
	margin-top: 25px;
	font-size: 20px;
	line-height: 28px;
	font-weight: 700;
}

div#main p { 
	margin-top: 20px;
	line-height: 25px;
}

div#main ul, div#main ol, div#main dl {
	margin-top: 20px;
}

div#main ul li, div#main ol li {
	margin-left: 30px;
	padding-left: 5px;
	line-height: 25px;
}

div#main dl dt, div#main dl dd {
	line-height: 25px;
}

div#foot { 
	margin: 0 auto; 
	clear: both; 
	border-top: 3px solid #444; 
	padding: 18px 0 40px 0;
	font-size: 12px; 
	line-height: 12px; 
}

div#foot p { 
	float: left; 
}

div#foot ul li { 
	display: inline; 
	border-left: 1px solid #aaa; 
	margin-left: 5px;
	padding: 0 0 1px 5px; 
}

div#foot ul li a { 
	text-decoration: none; 
}

div#foot ul li a:hover { 
	text-decoration: underline; 
}

.monospace {
	font-family: "Roboto Mono";
}

@media screen and (min-width: 1050px) {
	div#head { width: 1000px; }
	div#main { width: 1000px; }
	div#foot { width: 1000px; }
}

@media screen and (max-width: 1050px) { 
	div#head { width: 95%; }
	div#main { width: 95%; }
	div#foot { width: 95%; }
}

@media screen and (max-width: 400px) {
/*	span#title-surname { display: none; }*/
}
