/* Font Sources:
https://www.fontsquirrel.com/
https://fonts.google.com/ 	
padding: 10px;
	text-indent: 10px;
/* The Times New Roman-based serif stack: */
@font-face {
    font-family: 'roboto_condensedlight';
    src: url('fonts/RobotoCondensed-Light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'roboto_condensedbold';
    src: url('fonts/RobotoCondensed-Bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotolight';
    src: url('fonts/Roboto-Light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotolight_italic';
    src: url('fonts/Roboto-LightItalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotomedium';
    src: url('fonts/Roboto-Medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotoblack';
    src: url('fonts/Roboto-Black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
:root {
  --bkg: hsl(200,50%,25%);
  --art-bkg: hsl(180,10%,95%);
  --art-title: hsl(240,67%,10%);
  --art-title-visited: hsl(240,25%,50%);
  --art-hover-bkg: hsl(60,90%,85%);
  --mainheader: hsl(180,0%,0%);
}
a {
	text-decoration: none;
}
.frameset {
	columns: 400px; 
	column-gap: 6px;
	width: 98%;
	height: 100%;
	background-color: var(--bkg);
	padding: 8px;
}
.article, .mainheader, .media-info, .title, .description, .pageselect, .pageselect_current { 
	font-family: "robotolight";
	font-size: 12pt;
	line-height: 1.4em;
	line-length: 90%;
	text-decoration: none;
	color: var(--art-title);
}
.media-info, .pageselect, .pageselect_current { 
	font-family: "roboto_condensedlight";
}
.article, .mainheader-box {
	background-color: var(--art-bkg);
	padding: 12px;
	padding-right: 9px;
	border-width:1px;
	border-style:solid;
	border-color:var(--bkg);
	height: auto;
}
.sharebox {
	margin-left: 24px;	
	padding-top: 4px;
	padding-bottom: 4px;
	width: 640px;
	height: 24px;
	text-align:left;
}
.fb-share-button, .twitter-share-button { 
	vertical-align: bottom;
	padding-left: 4px;
}
.feed {
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 8px;
  width: 24px;
  height: 24px;
}
.about {
	padding-bottom: 32px;
}
.mainheader-box { 
	column-span: all;
	height: 48px;
	margin-bottom: 6px;
	margin-top: 6px;
	padding-top: 6px;
}
.mainheader, a:link, a:visited {
	text-decoration: none;
}
.mainheader:link, .mainheader:active, .mainheader:visited , .mainheader:hover {
	font-family: "robotoblack";
	font-size: 20pt;
	line-height: 2.3em;
	line-length: 90%;
	text-decoration: none;
	color: var(--mainheader);
	letter-spacing: 6px;
}
.title {
	font-family: "roboto_condensedbold";
	font-size: 120%;
	text-decoration: none;
}
.title:link {
	color: var(--art-title);
}
.title:visited {
	background-color: white; 
	color: var(--art-title-visited);
	text-decoration: none;
	display: inline-block;
}
.title:hover, .title:active {
	background-color: var(--art-hover-bkg);
}
.pageselect, .pageselect_current {
	margin-left: 12px;
	margin-right: 12px;	
	text-align:left;
	color: var(--art-title);
	background-color: var(--art-bkg); 
}
.pageselect_current {
	background-color: var(--art-hover-bkg); 
}
.pageselect:link {
	color: var(--art-title);
	background-color: var(--art-bkg); 
}
.pageselect:visited {
	color: var(--art-title-visited);
	background-color: var(--art-bkg); 
	text-decoration: none;
	display: inline-block;
}
.pageselect:active {
	background-color: var(--art-hover-bkg); 
}

/* .pageselect:hover,
.current {
	background-color: #ffffff; 
}
*/