:root {
	--jsj-sidebar-width: 230px;
}

body{ margin: 1em 2em; padding: 1em; background: white; color: black;
	font: 1em verdana, arial, sans-serif; }
h1{ font-size: 1.25em; border-bottom: 1px solid; margin-bottom: 2em; }
/*pre{ overflow: auto; }*/

#sidebar{ float: left; width: fit-content; margin-right: 1em; } /* 210px; */

.linkbox {
	width: var(--jsj-sidebar-width);
	min-width: var(--jsj-sidebar-width);
	border: 1px solid #123456;
	font-size: 0.75em;
	margin-bottom: 1em;
}

.linkbox > .links > hr {
	margin-right: auto;
	margin-left: auto;
	width: 80%;
}

.linkbox .title
{ 
	font-weight: bold; border-bottom: 1px solid; color: rgb(75,75,75);	padding: 5px;
	text-align: center;
}

.linkbox .subtitle {
	text-align: center;
	font-style: italic;
}

.linkbox .links a{ display: block; text-align: center; padding: 5px 0; font-weight: bold; color: #123456; }
.linkbox .links a:hover{ background: #6789AB; color: white; text-decoration: none; }

#projects{ border-color: #123456; }
#projects .title{ color: rgb(75,75,75); }
#projects .links a{ color: #123456; }
#projects .links a:hover{ background: #6789AB; color: white; text-decoration: none; }

#glitches{ border-color: #654321; }
#glitches .title{ color: rgb(75,75,75); }
#glitches .links a{ color: #654321; }
#glitches .links a:hover{ background: #654321; color: white; text-decoration: none; }

#newsContainer{ margin: 0; width: 790px; float: left; }
.news{ margin: 0.5em 0 1em 0; border: 1px solid #000; padding: 0; width: auto; }
.news .title{ font-weight: bold; margin: 0.25em 0.5em; border-bottom: 1px solid;
	width: auto; }
.news .posted{ font-size: 90%; margin: 0.25em 2em; width: auto; }
.news .content{ background: #ddd; padding: 1em; width: auto; overflow: auto; }
