article{
	margin: 1em;
	padding: 1em;
	color: var(--default-text-color);
	font-family: var(--default-font);
	font-size: var(--default-text-size);
}
article a{
	color: var(--link-color);
}
article a:visited{
	color: var(--visited-link-color);
}
article a:active{
	color: var(--active-link-color);
}
article p,
article li,
article th,
article td{
	line-height: 1.5em;
	font-family: var(--readable-font);
	font-size: var(--readable-size);
}
label, button,
input[type=submit],
input[type=reset],
a[role=button]{
	font-family: var(--readable-font);
	font-size: var(--readable-size);
	margin: 3px;
}
h1, h2, h3, h4, h5, h6{
	font-family: var(--nice-font);
	color: var(--title-color);
}
h1{
	font-size: 210%;
}
h2{
	font-size: 190%;
}
h3{
	font-size: 170%;
}
h4{
	font-size: 150%;
}
h5{
	font-size: 130%;
}
h6{
	font-size: 120%;
}
h1{
	width: fit-content;
	margin-left: -10px;
	padding: 0 10px 0 10px;
	border-bottom: solid 1px var(--default-border-color);
}
article th,
article td{
	padding: 0.4em 1em 0.4em 1em;
}
article form div{
	/*padding: 3px;
	margin: 0.2em;*/
}
article form div label{
	margin: 0.2em 0.3em 0.2em 0;
}
article input,
article select,
article textarea{
	display:block;
	width:60%;
	padding: 0.6em 0.8em 0.6em 0.8em;
	margin: 3px 0.5em 3px 0;
	color: var(--default-text-color);
	border: solid 1px;
	border-color: var(--default-border-color);
	background: var(--transparent-background-color);
	border-radius: 2px;
}
article input[type=color]{
	padding: 2px;
	max-width: 7em;
	min-width: 7em;
}
article input[type=color],
article input[type=checkbox],
article input[type=radio]{
	display: inline-block;
	margin-left:1em;
	margin-right:1em;
}
article input[type=checkbox],
article input[type=radio]{
	max-width: 2vw;
	min-width: 2vw;
}
article button,
article input[type=submit],
article input[type=reset],
article a[role=button]{
	display: inline-block;
	padding: 0.6em 0.8em 0.6em 0.8em;
	font-size: 12px;
	border: solid 1px;
	text-decoration: none;
	cursor:pointer;
	background-color: var(--button-background);
	color: var(--button-color);
	border-color: var(--button-color);
	border-radius: 2px;
}
article button:hover,
article input[type=submit]:hover,
article input[type=reset]:hover,
article a[role=button]:hover{
	background-color: var(--button-color);
	color: var(--button-background);
	border-color: var(--button-background);
}
article input[type=submit],
article button[type=submit]{
	background-color: var(--submit-background);
	color: var(--submit-color);
	border-color: var(--submit-color);
}
article input[type=submit]:hover,
article button[type=submit]:hover{
	background-color: var(--submit-color);
	color: var(--submit-background);
	border-color: var(--submit-background);
}
article input[type=reset],
article button[type=reset]{
	background-color: var(--reset-background);
	color: var(--reset-color);
	border-color: var(--reset-color);
}
article input[type=reset]:hover,
article button[type=reset]:hover{
	background-color: var(--reset-color);
	color: var(--reset-background);
	border-color: var(--reset-background);
}
/*article input[type=submit],
article button[type=submit]{
	background-color: var(--submit-background);
	color: var(--submit-hover-background);
	border-color: var(--submit-background);
}
article input[type=submit]:hover,
article button[type=submit]:hover{
	background-color: var(--submit-hover-background);
	color: var(--submit-background);
}
article input[type=reset],
article button[type=reset]{
	background-color: var(--reset-background);
	color: var(--reset-hover-background);
	border-color: var(--reset-background);
}
article input[type=reset]:hover,
article button[type=reset]:hover{
	background-color: var(--reset-hover-background);
	color: var(--reset-background);
}
article a[role=button]{
	background-color: var(--action-background);
	color: var(--action-hover-background);
	border-color: var(--action-background);
}
article a[role=button]:hover{
	background-color: var(--action-hover-background);
	color: var(--action-background);
}*/

article table{
	font-size: 0.9em;
}

article table th,
article table td{
	border: solid 1px;
	border-color: var(--default-border-color);
	padding: 0.3em 0.5em 0.3em 0.5em;
}

article table th a[role=button],
article table td a[role=button]{
	font-size: 0.9em;
	padding: 0.3em 0.5em 0.3em 0.5em;
	margin: 2px;
	min-width: 40px;
	text-align: center;
}

article table thead tr{
	color: var(--table-background);
	background-color: var(--table-text-color);
	color: var(--table-background);
}

article table thead th{
	border-color: var(--table-text-color);
}

article table tbody tr{
	color: var(--table-text-color);
	background-color: var(--table-background);
	border-color: var(--default-border-color);
}

article table tbody tr:nth-child(odd){
	background-color: var(--table-odd-background);
}

article > div,
article p,
article ul,
article ol,
article table,
article form{
	margin: 2em 0 2em 0;
}

article > img{
	max-width: 30%;
	float: left;
	margin-right: 2em;
}
article > img:nth-child(odd){
	float: right;
	margin-left: 2em;
}