/**
 * Main CSS file for all screen media for rsarchive.org
 */

/*************************
*** NORMALIZING STYLES ***
*************************/

html,body,address,blockquote,div,
form,fieldset,caption,
h1,h2,h3,h4,h5,h6,hr,
table,tr,td,th,p,img {
	margin:0;
	padding:0;
}

img, fieldset {
	border:none;
}

*,
*::before,
*::after {
    box-sizing: border-box;
 }

/* FONTS */

@font-face {
  font-family: 'Baar-Antropos';
  src: url('/fonts/8541Baar-Antropos.woff2');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "PT Sans";
  src: url("/fonts/pt-sans-v12-latin-regular.woff2");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "PT Sans";
  src: url("/fonts/pt-sans-v12-latin-italic.woff2");
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: "PT Sans";
  src: url("/fonts/pt-sans-v12-latin-700.woff2");
  font-weight: bold;
  font-style: normal;
}

/* Prevent Google translate from messing up footnote numbers */
font {
	vertical-align: unset !important;
}

/******************
*** BASE STYLES ***
******************/

html, body {
	width:100%;
	height:100%;
}

body {
	display: flex;
	display: -webkit-flexbox;       /* Enables flex in UC Browser */
	display: -ms-flexbox;           /* Enables flex in IE 10 */
	
	flex-direction: column;
	-webkit-flex-direction:column;
	-ms-flex-direction:column;
	
    font: normal 105%/150% "PT Sans",helvetica,sans-serif;

	min-width: 48em;                 /* for pre CSS3 browsers */
}

/* GENERIC HTML */

h1,h2,h3,h4,h5,h6 {
    font-family: Baar-Antropos,veranda,arial;
	color: midnightblue;
	line-height: 100%;
}

h1 {
	padding: 0.5em 0 0 0;
}

h2,h3,h4,h5,h6 {
	padding: 0.5em 0;
}

h2 {
	font-size: 1.75em;
	text-align: center;
}

h3 {
	font-size: 1.5em;
}

h4 {
	text-align: center;
	font-size: 1.25em;
}

h5 { /* Same size as h3 but centered */
	font-size: 1.5em;
	text-align: center;
}

h6 { /* Same size as h4 but not centered */
	font-size: 1.25em;
}

p {
	padding-bottom:1em;
}

a {
	font-weight: bold;
}

.center {
	text-align: center;
}

hr {
	display: block;
	margin: 2em auto;
	width: 33%;
}

mark {
	color: DarkSlateBlue;
	font-weight: bold;
	background-color: yellow;
	cursor: pointer;
}

mark:hover {
    color: coral;
	font-weight: bold;
}

blockquote {
    margin: 0 3em 1em 3em;
	font-size: 0.9em;
}

blockquote p:last-of-type {
	padding-bottom: 0;
} /*Prevents double padding following a blockquote */

dt {
	font-weight:bold;
}

legend {
	color: midnightblue;
	font-weight: bold;
	text-align: left;
}

fieldset {
	display: inline-block;
	max-width: 100%;
	margin: 0.5em auto 0;
}

label {
	font-size: 0.9em;
	margin: 0 0.25em 0.25em;
}

aside {
	position:relative;
	float:left;
	padding-top: 1em;
	width:16em;
	margin-left:-16em;
}

footer {
	display: flex;
	justify-content: space-between;
	font-size: 0.9em;
	color: white;
}

footer h3 {
	color: #666f7f;
}

footer p {
	font-weight: bold;
	padding-bottom: 0;
}

/*
button {
    background-color: lightsteelblue;
	color: midnightblue;
	border: 1px solid midnightblue;
	border-radius: 1em;
	font-weight: bold;
	padding: 0.5em;
} */

/* This should replace block-quoted lists */

.textList {
	margin: 0 3em 1em 3em;
}

.contentList {
	margin-inline-start: 40px;
	clear: both;
}

.wrapFloats {
	clear: both;
}

ol.contentList {
	list-style-type: upper-roman;
}

.nestedList {
padding-inline-start: 1em;
list-style-type: none;
}

ul.contentList,
ul.navigationLinks {
	list-style-type: none;
}

ul.structuredList {
	margin-left: 1em;
}

p + ol,
p + ul {
	margin-block-start: 0;
}

.description {
	font-size: small;
}

.German {
	display: none;
}

#autoTranslation {
	display: none;
}

iframe.sidebar {
	width: 382px;
    height: 440px;
	transform:scale(0.75);
	position: absolute;
	top: -15px;
	left: -57px;
}

/* TABLES */

table {
	  /* padding: 0 0 0.5em 0;    Helps create a little more space especially where there are multiple tables */
	  /*border-spacing: 0;        Keep browsers from breaking cells  */
	  margin: 0 auto 1em;
	  border-collapse: collapse;
}

.dialog {
	margin: 0 0 1em 0;
}

.dialog td {
	border: none;
}

caption {
	font-weight: bold;
	padding-bottom: 0.5em;
	}

th, td {
	border: 1px solid #ddd;
    padding: 5px;
	font-size: 0.9em;
	text-align: left;
	vertical-align: top;
  }
  
.borderless th,
.borderless td {
	border: 0;
	text-align: center;
}

#btnAutoTranslate {
	display: none;
}

.paragraphMarker {
	display: none;
}

.solrOptions {
	font-size: 0.9em;
	margin-bottom: 1em;
}

.search-help,
.reset,
.solrOptions form {
	display: inline-block;
	padding: 0 0.5em;
	margin: 0;
}

.select {
	width: inherit;
    border: 1px solid #777;
	border-radius: 0.2em;
    padding-right: 0.25em;
    cursor: pointer;
	display: grid;
	grid-template-areas: "select";
	align-items: center;
}

.sort,
.city {
	width: 7em;
}

/* Don't confuse .year with .date that we use for date display on documents */
.year,   
.volume {
	width: 6em;
}

.title {
	 width: 32em;
}

.operator {
	width: 4em;
}

.reset {
    border: 1px solid #777;
	margin: 0.5em 0 0 0.5em;
	background-color: lightgrey;
	border-radius: 0.2em;
}

label {
	font-weight: bold;
	color: midnightBlue;
}

select,
.select::after {
    grid-area: select;
}

.select::after {
  content: "";
  width: 0.8em;
  height: 0.5em;
  background-color: #777;
  clip-path: polygon(100% 0%, 0 0%, 50% 100%);
  justify-self: end;
  transition: .25s all ease;
}

.select select {
	appearance: none; /* Removes default drop down arrow */
	background-color: transparent;
	border: none;
	padding: 0;
	margin: 0;
	width: 100%;
	font-family: inherit;
	cursor: inherit;
	line-height: inherit;
	z-index: 1;
	outline: none;
}

.select:focus-within {
  border: 2px solid MidnightBlue;
  border-radius: 0.2em;
}


/* contentsTable need to be converted to a class */

#contentsTable,
.databaseTable,
.gaTable {
	width: 100%;
}

#contentsTable th,
#contentsTable td,
.databaseTable th,
.databaseTable td,
.gaTable th,
.gaTable td {
	border: 0;
}

.databaseTable tbody tr:nth-child(even),
      .gaTable tbody tr:nth-child(even) {
	background-color: Gainsboro;
}

.databaseTable th,
      .gaTable th {
	background-color: lightsteelblue;
}

/* Nudges the Lecture number to the right next to its name */

.gaTable td:nth-child(1),
.gaTable th:nth-child(1) {
	text-align: right;
}

/* Prevent date from wrapping on larger displays */

.gaTable td:nth-child(4) {
	white-space: nowrap;
}

/* Text in this class should not be in ALL CAPS! */
.sc {
      font-variant: small-caps;
  }

}
#contentsTable th {  
	text-align: center;
	font-weight: bold;
	background-color: inherit;
}

#contentsTable tr:nth-child(even) {  /* Tables of Contents does not have stripes */
    background-color: inherit;
}

#contentsTable td:nth-child(1),  /* Keep roman numerals and dates to the right */
#contentsTable td:nth-child(3) {
	text-align: right;
	vertical-align: top;
	white-space: nowrap;
}

.snippets th,
.fullDoc thead {
	background-color: LightSteelBlue;
}

/* Covers show- through at the top of the header */

.fullDoc th {
	border-top: 10px;
}

/* IMAGES */

img {
    display: block;
    max-width: 100%;
	height: auto;        /* Maintains aspect ratio by ignoring width and height defined in the img tag */
    margin: 0 auto 1em;
}

img.BlogImage {
	max-width: 70%
}

img.inline {
	display: inline;
	margin: 0;
}

.banner {
	width: 100%;
	aspect-ratio: 205 / 39;
}

.leftSidebar img {
	width: 100%;
	box-shadow: 0.1em 0.15em 0.6em #7b693e;
}

aside img {
    margin: 0.5em auto 1em;
}

.bookImageGA { /* Images on the Book 'GA' index pages */
	float: left;
	margin-right: 1em;
	box-shadow: 0.1em 0.15em 0.6em #7b693e;
}

.shadow {
	box-shadow: 0.1em 0.15em 0.6em #7b693e;
}

.bookImage {
	float: right;
	width: 200px;
	margin-left: 1em;
	box-shadow: 0.1em 0.15em 0.6em #7b693e;
}

.smallBookImage {
	float: right;
	width: 125px;
	margin-left: 1em;
	box-shadow: 0.1em 0.15em 0.6em #7b693e;
}

#btnShowGerman {
	margin-bottom: 0.5em;
}

.printerButton {
	display: inline;
	position: relative;
	top: 10px;
	margin: 0;
}

#socialMedia {
	padding-top: 1.5em;
}

#socialMedia img {
	float: left;
	display: inline;
}

#google_translate_element img {
	display: inline;
	vertical-align: top;
}

figcaption {
	text-align: center;
	font-size: small;
	font-weight: bold;
}

/* LISTS & ANCHORS */

.databaseTable a,
.gaTable a {
	color: #36454F;
}
/*
.gaTable a:hover {
	color: coral;
} */

a,
p.print {
	color: midnightblue;
    text-decoration: none;
}

.navigationLinks a {
	font-family: Baar-Antropos,arial;
	color: midnightblue;
	line-height: 100%;
}

a:hover {
	color: coral;
}

h1 a,
h1 a:hover { /* h1 works as a link back to the main page but is not styled */
	color: midnightblue;
}

footer a {
	color: white;
}

footer a:hover {
	color: #666f7f;
}


/*********************/
/* STRUCTURAL STYLES */
/*********************/

.top,
.searchMezzanine,
.column-wrapper,
footer,
.copyright {
	flex: 1 0 auto;      /* Keeps floated elements visible by not allowing the parent container to collapse on them */
    -webkit-flex:1 0 auto;
	-ms-flex:1 0 auto;
	
}

.announcement {
	overflow:hidden;    /* Creates Block Formatting Context for floated children. KEEP - Removing messes up background */
	/*max-width:68em; */
	text-align: center;
	background-color: #1b2136;
	padding: 0.75em 0;
	margin: auto;
}

.announcement a {
	color: white;
	font-weight: normal;
}

.announcement a:hover {
	text-decoration: underline;
}

.widthWrapper {
	overflow:hidden;    /* Creates Block Formatting Context for floated children. KEEP - Removing messes up background */
	/*max-width:68em; */
	/* background-color: #fffff8; */
	padding: 0 1em;
	margin: auto;
}

.top .widthWrapper {  /* Creates a small amount of separation from the background */
	padding-top: 0.5em;
}

.contentWrapper {
	float:left; /* Allows placing of sidebars over main */
	width:100%; /* Not sure this is needed with flex*/
}

.content {
	padding:1em 1em 0 0;
	margin-right:16em;
}

.articleBox,      /* All compartmentalized content gets padding and a border */
.contentBox {
	margin-bottom: 1em;
	border: 1px solid lightsteelblue;
	padding: 1em;
	border-radius: 0.5em;
}

.plugin {
	overflow: hidden;
    display: flex;
	justify-content: center;
	height: 600px;
	width: 100%;
	border: 1px solid lightsteelblue;
	border-radius: 0.5em;
	margin-bottom: 1em;
}

.articleBox {
	background-color: white;
}

.leftNavigation,
.rightNavigation {
	position:relative;
}

footer {
	background-color: #262e4a;
	color: #959fb0;
}

.footerContact, /* Initially this will flex but will eventually they will float */
.footerLinks,
.footerSearch {
	flex: 1;
	padding: 1em 1em 0 1em;
}

.newsletter {
	/* display: flex; */
	/* align-self: flex-end; */
	/* left: 1em; */
	flex: 0 1 40%;
	padding: 1em 0;
}

/********************/
/* COMPONENT STYLES */
/********************/

/* Head and Navigation */

.logo {
	float: left;
}

.logo img {
	max-width: 100%;
	margin: 1em auto;
}

.h1-block {
	float: left;
}

.tagline {
	font-style: italic;
	color: DarkSlateBlue;
	margin-left: 1em;
	padding-bottom: 0;
}

.primaryNav {
    float:right;
	padding-bottom: 0.5em;
}

.navigationLinks a {
	display:inline-block;
	padding:0.25em 1em;
	margin:0 0 0 0.2em;
	text-transform: uppercase;
}

.breadcrumbs {
	padding: 0;
	margin: 0.75em 0 0.25em  0;
}

.navigationLinks li {
	display: inline-block;
}

/* Book GA Indices and Tables of Contents */

.heading {
	font-size: 1.25em;
	text-align: center;
	font-weight: bold;
	padding: 1em 0 0.5em 0;
}

.summary {
	font: normal 90%/135% "PT Sans","segoe ui",helvetica,sans-serif;
	text-align: left;
	padding-top: 1em;
	margin-inline-start: 40px;
	clear: both;
}

.tableOfContents {
	margin: 1em 7.5%;
}

.tableOfContents ol,
.tableOfContents ul {
	margin-left: 2em;
}

/* Individual Lectures */

.date {
	text-align: right;
	font-style: italic;
}

.translator {
	font-size: small;
	font-style: italic;
}

.lectureNav {
	display: flex;
	display:-webkit-flexbox;
	display:-ms-flexbox;
	justify-content: center;
}

.lectureNav ul {
	overflow: hidden;
	margin-right: 3em;
}

.lectureNav li {
	display:inline;
	flex: 0 0 auto;
	margin: auto;
}

.lectureNav a {
	display:inline-block;
	padding: 0.5em;
}

.footnote {
	position: relative;
	display: inline-block;
	font-weight: bold;
	color: #006;
	/* line-height: normal; */
	cursor: pointer;
}

sup {
	line-height: 0;
}

.footnoteText {
	visibility: hidden;
	min-width: 10em;
	background-color: #fffff8;
	box-shadow:0.1em 0.15em 0.6em #7b693e;
	color: black;
	font-weight: normal;
	padding: 10px;
	border-radius: 10px;
	line-height: normal;
	position: absolute;
	cursor: pointer;
	z-index: 1;
}

.quadTwo {
	right: 0em;
}
.quadThree {
	bottom: 0em;
}
.quadFour {
	bottom: 0em;
	right: 0em;
}

.footnote:hover .footnoteText {
	visibility: visible;
}

/* SEARCH CONTROLS */

/* Search By Day */

.chooseDay {
	display: flex;
	justify-content: center;
}

.chooseDay p {
	text-align: center;
}

.chooseDay form {
	display: block;
	width: 16em;
	margin: 0 auto;
}
/* Search by GA */

.gaNumber {
    width: 50px;
    height: 50px;
    float: left;
    display: flex;
	display:-webkit-flexbox;
	display:-ms-flexbox;
    align-items: center;
    justify-content: center;
    margin: 0.25em;
    border: 1px solid #000;
    border-radius: 4px;
    box-shadow: 0.1em 0.15em 0.3em #7b693e;
}

.gaNumber:hover {
	border: 1px solid coral;
	font-weight: bold;
}

.gaNumber p {
	padding-bottom: 0;
	font-weight: bold;
}

.COTS {
	display: grid;
	grid-template-columns: 1fr 1fr;
	/* grid-template-rows: 1fr 1fr; make this all or none otherwise it makes the first two independent */
	gap: 20px;
}

.COTS-sidebar {
	font-size: smaller;
}

.COTS-sidebar p {
	text-align: center;
}


/* MAIN SEARCH BOX */

::placeholder {
	font: normal 110%/150% novalismedium_97,verdana,arial,trebuchet;
}


.buttonBox {
	position: relative;
}

.lectureTable {
	max-height: 1500px;
	overflow-y: auto;
}

.solrTable table,
.lectureTable table {
	position: relative;
}


/* Common Search Syles */

.formWrapper {
	width: 17.25em;
	margin: 1em auto 0;
}

/* Styles NOT on Search.php */

.initialSearch {
	display: flex;
	justify-content: center;
}

.initialSearch label {
	margin: 0 0.5em;
}
.initialSearch input {
	margin-top: 0.33em;
}

/* Styles ONLY on Search.php */

.docType {            /* Separate form on Search.php for search type */
	display: flex;
	display: -webkit-flexbox;
	display: -ms-flexbox;
}

.search-report {
	text-align: center;
	font-weight: bold;
	padding-bottom: 0;
}

/* Day of the Week in SOL translation of COTS. Do not remove */
.dow {
	display: none;
}

.search-report mark {
		color: black; /* Do not look like a link! */
}

.search-report mark:hover {
	color: black; /* Do not look like a link! */
}

.search-choices {   /* Categories */
	text-align: left;
}

.snippets {
	width: 100%;
}

.hidden,
.fullText,
.footnoteAppeal,
.printedFootnotes {
	display: none;
}

.visible {
	display: block;
}

.fullDoc {
	height: 75vh;
	overflow-x: hidden;
	overflow-y: auto;
	margin-top: 2em;
}

.fullDoc thead {
	position: sticky;
	top: 0;
	z-index: 10;            /* Prevents footnote numbers from showing through header */
}

.fullDoc mark {            /* Cursor acts like text not an action item */
	cursor: text;
}

.fullDoc mark:hover {      /* Prevents mark from acting like a link */
	color: DarkSlateBlue;
}

.close-Button {
    position: absolute;
	z-index: 3;  /* Shows over header and any potential footnote numbers */
	top: -1.5em;
	right: 0;
	color: grey;
	font-size: 1.25em;
	border-radius: 4px;
	border: 0;
	cursor: pointer;
}

.close-Button:hover {
	color: black;
}

.searchNav {
	text-align: center;
	padding-bottom: 1em;
}

/* Small Device Search Controls */

.section {
	text-align: center;
	font-weight: bold;
	padding-top: 1em;
}

/*  FOOTER AREA */
/* Newsletter */

.newsletter > div {
	max-width: 30em;
	margin: auto;
}

.newsletter {
	background-color: #1b2136
}

.copyright {
	background-color: #14192b;
	color: #666f7f;
	text-align: center;
	/* margin-bottom: 0.5em;
	border-radius: 0 0 0.5em 0.5em; */
}

/* Copyright and Legal */ 
.copyright p{
	font-size: 0.8em;
	padding-bottom: 0;
}

.copy {
	float: left;
	padding-left: 3em;
}

.legal {
	float: right;
	padding-right: 3em;
}

.legal a {
	color: #666f7f;
	font-weight: normal;
}

.legal a:hover {
	color: white;
}

/* Search Box */

input[type="text"] {
	width: 100%;
	height: 1.75em;
	padding: .75em 1em .5em;
	font-size: 16px;
	border: 0;
	border: 1px solid lightsteelblue;
	border-radius: 0.75em 0.75em 0.5em 0.5em;
	box-shadow: .05em .1em .15em rgba(0,0,0,.3) inset;
}

input::placeholder {
	font-family: Baar-Antropos,veranda;
}

input[type="text"]:focus {
    outline-color: lightsteelblue;
}


/****** START MEDIA QUERIES ******/

/* Three Column layout for modern screens */

@media (min-width:84em) {
	.widthWrapper {
		max-width:84em;
	}
	
	.content {
		padding-left:1em;
		margin-left:16em;
	}
	
	footer {
		padding-left: 5%;
	}
	
	.primaryNav {
	    padding-top: 2em;
    }
	
	aside {
		float:none;
		width:auto;
		margin:0;
		padding:0;
	}
	
	aside .leftNavigation,
	aside .rightNavigation {
		width:16em;
		float:left;
		padding-top:1em;
	}
	
	aside .leftNavigation {
		margin-right:-16em;
		left:-100%;
	}
	
	aside .rightNavigation {
		margin-left:-16em;
	}
	
} /* END min-width:84em */


/********** Default styling applies to screens 61-83em wide with right sidebar ********/

@media (max-width:60em) { /* ONE MAIN COLUMN WITH SIDEBARS BELOW IN TWO COLUMNS? [37-60em] */
	body {
		min-width:192px;
	}
	.content {
		margin:0;
		padding:1em 0 0;
	}
	
	aside {
		float:none;
		display: flex;
		position: static;
		width: 100%;
		margin:0;
		padding-top: 0;
	}
	
	.subscribe {
	display: none;
    }
	
	.leftNavigation,
    .rightNavigation {
		width: 50%;
		position: static;
	}
	
	.rightNavigation {
		margin-left: 1em;
	}
	
	.leftSidebar img {
	width: 250px;
	box-shadow: 0.1em 0.15em 0.6em #7b693e;
    }
	
	footer {
		display: block;
	}
	
	footer .widthWrapper {
		padding: 0;
	}
	
	footer .footerContact,
    footer .footerLinks,
    footer .footerSearch {
		float: left;
		padding: 1em 0 2em 1em;
		min-width: 33.3%;
	}

	footer .newsletter {
		float: left;
		min-width: 100%;
		padding: 0;
	}
}

@media (max-width:43em) {
	.title {
	 width: 100%;
    }
	
    aside {
		float: none;
		display: block;
		position: static;
		width: 100%;
		margin:0;
		padding-top: 0;
	}
	
	.leftNavigation,
    .rightNavigation {
		width: 100%;
		position: static;
	}
	
	.rightNavigation {
		margin: 0;
	}
	
	.logo,
	.bookImage {
	    float: none;
    }
	
	img.BlogImage {
	max-width: 100%
    }
	
	.bookImage {
	margin: 0 auto 1em;
	box-shadow: 0.1em 0.15em 0.6em #7b693e;
    }
	
	.h1-block,
    .primaryNav	{
		float: none;
		max-width: 95%;
		margin: auto;
    }
	.h1-block p {
		text-align:center;
		margin-left: 0;
	}
	.navigationLinks {
		text-align:center;
		padding: 0;
	}
	h1 {
	    padding: 0;
	}
	h1,
	#mainMenu {
		float:none;
		text-align:center;
	}
	#mainMenu {
		padding:0 0.5em 0.75em;
		max-width:90em;
	}
	#mainMenu a {
		width:auto;
		padding:0.75em 1.5em;
	}
	#menuBar {
		padding:0.5em;
		text-align:center;
	}
	.widthWrapper {
		padding:0;
	}

	/* No longer prevent date from wrapping */
	.gaTable td:nth-child(4) {
		white-space: normal;
    }
	#contentsTable td:nth-child(3) {
		white-space: normal;
    }
	.contentBox,
    .articleBox {
		padding:1em;
		margin-bottom:0;
		border: none;
	}
	
	footer .footerLinks {
		clear: left;
		float: left;
	}
	
	footer .footerContact,
	footer .footerLinks,
	footer .footerSearch {
		min-width: 50%;
	}
	.copy,
	.legal {
		float: none;
		padding: 0 1em;
	}
}

@media (max-width:34em) {
	#mainMenu {
		max-width:24em;
		margin:0 auto;
	}
}

@media (max-width:20em) {
	input[type="text"] {
	    width: 14em;
	}
}

@media (max-width:480px) { /*Force small devices to honor text size */
	* {
		-webkit-text-size-adjust:none;
		-ms-text-size-adjust:none;
	}
}
