/*
Style sheet (screen) for the Sorabji Resource Site (SRS)
© Marc-André Roberge 2025
*/
#wrapper {
	/*	position: relative;*/
	margin-left: auto;
	margin-right: auto;
	/* text-align must be set to "left" here and to "center" in body */
	width: 760px;
	text-align: left;
}
#banner .srslogo {
	margin-top: 1em;
	margin-bottom: 1.5em;
	height: 4em;
	float: left;
}
#banner .googlesearch {
	margin-top: 1.25em;
	margin-bottom: 1.5em;
	height: 3.5em;
	width: 194px;
	float: right;
}
#indexpage {
}
#indexpage .name {
	font-size: 100%;
	font-weight: bold;
}
#indexpage .identification {
	font-size: 95%;
	font-weight: normal;
}
#menu {
	width: 100%;
	/*The font-size must be set to 85% (now 80%, 2019-05-27) to prevent the menu bar from extending beyond the page's right boundary when the screen is set to 120dpi rather than 96dpi. Display will be correct when the text size is set to Medium or Smaller in Internet Explorer. Font size must be set to 12 rather than 14 in srs_menu.js.*/
	font-size: 80%;
}
#contents {
	/*	margin-top: 4em;*/
/*Display differences between IE7 (OK)/IE8 (omits top margin), Firefox (adds line)*/
/*	float: left;*/
/*padding-top: 18px appears to render correctly in both browers*/
	padding-top: 18px;
}
#links {
	font-size: 95%;
	text-align: center;
	margin-top: 20px;
}
#modified {
	font-size: 80%;
	margin-top: 20px;
	text-align: left;
}
#warning {
	font-size: 75%;
	text-align: left;
}
#logos .famul {
	float: left;
	margin-top: 0.5em;
}
#logos .milonic {
	float: right;
	margin-top: 0.5em;
}
#printMsg {
	display: none;
}
/* Must be positioned before the <a> tags to avoid making the links invisible when hovering the mouse */
a[href $="pdf"] {
	padding-right: 18px;
	background: url(../images/pdficon-small.png) no-repeat center right;
}
a {
	outline: none;
	text-decoration: underline;
}
a:link {
	color: #AC0200;
}
a:visited {
	color: #F75D59;
}
a:hover {
	text-decoration: none;
	color: rgba(255, 255, 255, 1.0);
	/*	color: #AC0200; */
	background-color: rgba(172, 2, 0, 0.7);
}
a:active {
	color: #AC0200;
	background-color: rgba(172, 2, 0, 0.2);
}
/*a:link {
	color: #AC0200;
	text-decoration: underline;
}
a:visited {
	color: #F75D59;
	text-decoration: underline;
}
a:hover {
	color: #336043;
	text-decoration: underline;
}
a:active {
	color: #336043;
	text-decoration: underline;
}
*/
body {
	margin: 0;
	padding: 0;
	background-color: #FFFFFF;
	color: #000000;
	/* Tahoma replacing Verdana in first position for support of Unicode character U+01E6 and other characters with diacritics */
	font-family: Tahoma, Arial, Verdana, Helvetica, sans-serif;
	/*	font-size: 11pt; */
	font-size: 95%;
	/* font-size: 95%;*/
	/* https://kyleschaeffer.com/css-font-size-em-vs-px-vs-pt-vs-percent */
	/* text-align must be set to center here and to left in wrapper */
	text-align: center;
}
/* This line added to force Android phones (from 4.2, but probably also from after 2.2) to display the text to the screen's full width rather than just the left half or so; solution found at <http://code.google.com/p/android/issues/detail?id=16287> */
p, h1, h2, h3, h4, td, th, tr, ul, li {
	background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);
}
/*Increase space before a section title (and decrease between a title and the text that follows).
h1, h2, h3, h4, h5, h6 {
  margin-top: 15px;
  margin-bottom: 10px;
  padding-top: 5px;
  padding-bottom: 0px;
}
*/

/*
h1, h2, h3, h4, h5, h6 {
	margin-top: 30px;
}
*/
@media screen {
	.title-print {display: none;}
}

figure {
	padding-top: 1em;
	padding-bottom: 0em;
	margin-left: 0;
	margin-right: 0;
}
figcaption {
	padding: 0.5em 10em 1em 0em;
	text-align: left;
	font-size: 90%;
}
h1 {
	color: #336043;
	font-size: 115%;
	font-style: normal;
	font-weight: bold;
	margin-top: 2em;
}
h2 {
	color: #996600;
	font-size: 110%;
	font-style: normal;
	font-weight: bold;
	padding-left: 2em;
}
h3 {
	font-size: 100%;
	font-style: normal;
	font-weight: bold;
	font-style: italic;
	padding-left: 4em;
}
h4 {
	font-size: 100%;
	font-style: normal;
	font-weight: bold;
	padding-left: 6em;
}
img {
	border: 0;
	display: block;
}
img:hover {
	/* a:hover img { */
	border: none;
	display: block;
}
input.txt {
	background-color: #FFFFFF;
	color: #000000;
	margin-top: 2px;
	margin-bottom: 2px;
	width: 186px;
}
input.btn {
	background-color: #996600;
	color: #FFFFFF;
	font-weight: bold;
	border: 1px outset #CC9933;
	padding: 1px 2px 1px 2px;
	height: 24px;
	width: 192px;
}
html[lang="en"] q {
	quotes: "\201C" "\201D" "\2018" "\2019";
}
strong {
	font-family: Verdana, Arial, Helvetica, serif;
	font-weight: bold;
	font-style: normal;
	font-size: 85%;
}
/*sup {
	font-size: smaller;
	vertical-align: baseline;
	position: relative;
	bottom: 0.75em;
}
sub {
	font-size: smaller;
	vertical-align: baseline;
	position: relative;
	bottom: -0.25em;
}*/

/* Solution found at: http://www.cs.tut.fi/~jkorpela/www/linespacing.html */
sup, sub {
	vertical-align: 0;
	position: relative;
}
sup {
	bottom: 1ex;
}
sub {
	top: 0.8ex;
}
ul {
	list-style-type: square;
}
.align-center {
	text-align: center;
}
.align-right {
	text-align: right;
}
.bannertable {
	border: 0;
	padding: 0;
	text-align: left;
	vertical-align: top;
	font-weight: normal;
}
.bracketedchapternumber {
	font-size: 90%;
	font-weight: bold;
}
.caption {
	font-size: 80%;
}
.centeredtext {
	text-align: center;
	font-weight: normal;
}
.check {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	color: #3300FF;
}
.clear {
	/*Essential to display the Google search box correctly in Firefox*/
	clear: both;
}
.clicktosort {
	color: #666666;
	text-align: center;
}
.comment {
	font-weight: bold;
}
.contents {
	font-size: 100%;
	font-weight: normal;
}
/* Not used? */
.banner1, .banner2, .banner3 {
	font-weight: bold;
}
.banner1 {
	color: #AC0200;
}
.banner2 {
	color: #336043;
}
.banner3 {
	color: #996600;
}
.doubleunderline {
	border-bottom: 3px double;
}
.downloadlink {
	text-align: center;
	font-size: 160%;
	font-weight: bold
}
.dynamics {
	font-style: italic;
	font-weight: bold;
}
.sortinginstructions {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
	color: #575757;
	text-align: center;
}
.explanation {
	font-size: 90%;
	font-weight: normal;
}
.indent {
	text-indent: 1.5em;
}
.googlesearch {
	border: 1px solid #CCCCCC;
	margin-top: 6px;
	padding: 0px 2px 1px 2px;
}
.introduction {
	font-size: 85%;
	font-weight: normal;
	border: 1px solid #000000;
	padding: 0.75em;
}
.invisible {
	font-size: 1px;
	color: #FFFFFF;
}
.keyword {
	font-family: Verdana, Arial, Helvetica, serif;
	font-weight: bold;
	font-size: 90%;
}
.lae {
	font-weight: bold;
}
.list {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	font-weight: normal;
}
.location {
	font-style: italic;
	font-weight: normal;
}
/*top right bottom left*/
.mpb {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 95%;
	font-weight: normal;
	color: #000000;
	padding: 0em 0.5em;
	border: solid #336043;
	border-width: 1px 6px 1px 6px;
}
/*
Code adapted from Russ Weakley <http://css.maxdesign.com.au/listamatic/vertical08.htm> (Listmatic, one list, many options; used only in 10-test.htm)

.navcontainer {
	width: 360px;
}
.navcontainer ul {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
.navcontainer a {
	display: block;
	padding: 4px 8px 4px 8px;
	width: 320px;
	background-color: #FFFFFF;
	border: 1px solid #AC0200;
	border-left: 10px solid;
	text-decoration: none;
}
.navcontainer a:link {
	color: #AC0200;
	text-decoration: none;
}
.navlist a:visited {
	color: #F75D59;
	text-decoration: none;
}
.navcontainer a:hover {
	border-color: #AC0200;
	border-left: 10px solid #CC9933;
	background-color: #CC9933;
	color: #000000;
	text-decoration: none;
}*/

.photo_roberge {
	/*
	padding-bottom: 2em;
	padding-left: 2em;
*/
	float: right;
	margin-left: 10px;
	margin-bottom: 15px
}
/*
.picture_image {
	padding-top: 1em;
	padding-bottom: 1em;
	text-align: left;
}
.picture_caption {
	padding-top: 0em;
	padding-bottom: 0em;
	padding-right: 10em;
	text-align: left;
	font-size: 90%;
}
.picture_image td {
	text-align: left;
}
*/
.rightalignedtext {
	text-align: right;
}
.ruler {
	color: #336043;
	margin: auto;
	width: 100%;
	border-top: 2px solid;
	margin-top: 2.5em;
}
/* This is used in library items to display Opus sorabjianum and Sorabji Resource Site*/
.smallcaps {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-variant: small-caps;
	font-weight: bold;
}
.smcaps {
	font-variant: small-caps;
}
.source {
	font-size: 80%;
	margin-left: 30px;
}
.strikethrough {
	text-decoration: line-through;
}
.title {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 140%;
	font-weight: bold;
	color: #AC0200;
}
.toctitles {
	font-size: 105%;
	font-weight: bold;
}
.tocchapters {
	font-size: 90%;
	font-weight: bold;
}
.underline {
	text-decoration: underline;
}
.unicode {
	font-family: "Arial Unicode MS", "Lucida Sans Unicode", Tahoma, "Times New Roman";
}
.whitetext {
	display: none;
}
.worktitle {
	font-style: italic;
	font-weight: normal;
}
.worktitle_left-aligned {
	font-style: italic;
	font-weight: bold;
}
.red_warning {
	margin: 20px auto 20px auto;
	font-size: 100%;
	text-align: left;
	background-color: #FFFFFF;
	color: #FF0000;
}
.wrap_urls {
	/* Chris Collier, "Handling Long Words and URLs (Forcing Breaks, Hyphenation, Ellipsis, etc)" <https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/> */
	overflow-wrap: break-word;
	word-wrap: break-word;
	-ms-word-break: break-all;
	word-break: break-all;
	word-break: break-word;
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}
.yellow_warning {
	margin: 20px auto 20px auto;
	font-size: 90%;
	text-align: left;
	/* 	border: 1px solid #FFF019; */
	background-color: #FFF019;
	color: #000000;
	padding: 0.5em;
	width: 90%;
	border-radius: 4px;
}