body {
	text-align: left;
	background-color: black;
	color: #EEEEEE;
	box-sizing: border-box;
}

a:link {
	color: #8080FF;
}

a:visited {
	color: #4040FF;
}

a:hover {
	color: #606080;
}

a:active {
	color: #A0A0C0;
}

/* outer border */
div#all {
	width: 80%;
	min-width: 420px;
	margin-left: auto;
	margin-right: auto;
	padding: 16px 16px 0px 16px;
	border: 1px solid #8080FF;
	background-color: #00000A;
}

/* at the top of the page */
div#title {
	text-align: center;
}

/* use for title */
h1 {
	text-align: center;
	font-size: 60px;
	font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
}

/* make bold text stand out */
strong {
	color: #FFFFFF;
}

/* div for each link to Ashkenazic recordings in resources */
div.link {
	border: 1px solid #060C6A;
	margin-top: 16px;
	margin-bottom: 16px;
	padding-left: 16px;
	padding-right: 16px;
	padding-top: 16px;
	padding-bottom: 0px;
	background-color: #000014;
}

/* div for each link to non-Ashkenazic recordings in resources */
div.acher {
	border: 1px solid #292929;
	margin-top: 16px;
	margin-bottom: 16px;
	padding-left: 16px;
	padding-right: 16px;
	padding-top: 16px;
	padding-bottom: 0px;
	background-color: #0A0A0A;
}

/* text below the all div */
div#bottom {
	padding-top: 16px;
	text-align: center;
}

/* for displaying text in columns */
div.columns {
	column-count: 3;
	-moz-column-count: 3;
	-webkit-column-count: 3;
	padding-bottom: 12px;
}

/* link to a resource site */
span.site {
	font-size: 120%;
}

/* link to a resource subsite */
span.subsite {
	font-size: 120%;
}

/* text to be made larger */
span.larger {
	font-size: 120%;
}

dl.legend {
	margin-left: 5em;
}

dl.legend dt {
	font-weight: bold;
}

/* notes about a resource site's collection for a particular service */
p.note {
	font-size: 90%;
}

/* menu of services for resources */
div#menu {
	text-align: center;
	font-size: 100%;
	padding: 16px;
	border: 1px solid #8080FF;
	background-color: #000014;
}

/* top menu bar, under title, with navigation to different parts of this site */
div#menudb {
	text-align: center;
	font-size: 150%;
	padding: 16px;
	margin-bottom: 16px;
	border: 1px solid #4040FF;
	background-color: #000014;
}

/* name of service, both in resources and in nusachdb */
div#subtitle {
	text-align: center;
	font-size: 150%;
}

/* general subtitle */
div.subtitle {
	text-align: center;
	font-size: 150%;
}

/* header that says FAQ */
div#faq {
	text-align: center;
	font-size: 150%;
}

/* link to current page */
a.chosen:link {
	color: #EEEEEE;
}

a.chosen:visited {
	color: #EEEEEE;
}

a.chosen:hover {
	color: #606080;
}

a.chosen:active {
	color: #A0A0C0;
}

/* container content area to the right of the service navigation bar in nusachdb */
div.contentContainer {
	float: left;
	width: 75%;
	padding-bottom: 16px;
}

/* container for service navigation bar on the left in nusachdb; places it on the page */
div.serviceNavContainer {
	float: left;
	width: 25%;
}

/* actual service navigation bar content */
div.serviceNav {
	border: 1px solid #8080FF;
	margin-right: 16px;
	margin-bottom: 16px;
	padding: 16px;
	background-color: #000014;
}

/* newline when divs are floated next to each other */
div.noFloat {
	clear: both;
}

/* a unit of indentation for normal text */
div.tab {
	width: 1em;
	float: left;
	text-align: center;
	line-height: 120%;
}

/* a unit of indentation for larger text */
div.bigtab {
	font-size: 135%; /* should match sectionHead */
	width: 1em;
	float: left;
	text-align: center;
	line-height: 120%;
}

/* container for each actual link in service nav bar in nusachdb */
div.serviceNavLink {
	width: auto;
	overflow: auto;
	word-wrap: break-word;
	padding-left: 1em;
	text-indent: -1em;
}

/* actual link in service nav bar in nusachdb */
div.serviceNavLink a {
	text-decoration: none;
}

div.serviceNavLink a:link {
	color: #8080FF;
}

div.serviceNavLink a:visited {
	color: #8080FF;
}

div.serviceNavLink a:hover {
	color: #4040FF;
}

div.serviceNavLink a.chosen:link {
	color: #EEEEEE;
}

div.serviceNavLink a.chosen:visited {
	color: #EEEEEE;
}

div.serviceNavLink a.chosen:hover {
	color: #606080;
}

div.serviceNavLink a.chosen:active {
	color: #A0A0C0;
}

div.serviceNavLink a.empty:link {
	color: #6060C0;
}

div.serviceNavLink a.empty:visited {
	color: #6060C0;
}

div.serviceNavLink a.empty:hover {
	color: #484860;
}

div.serviceNavLink a.empty:active {
	color: #787890;
}

/* disclosure triangle in service nav bar */
div.serviceNavContainer a.triangle:link, div.serviceNavContainer a.triangle:visited, div.serviceNavContainer a.triangle:hover, div.serviceNavContainer a.triangle:active {
	color: #EEEEEE;
	text-decoration: none;
}

/* contains the entire service in nav bar in nusachdb including link and triangle; gets shown and hidden when necessary */
div.serviceNavService:hover a {
	color: #4040FF;
}

/* container for actual link for a section in nusachdb */
span.sectionLink {
	width: auto;
	overflow: auto;
	word-wrap: break-word;
}

/* actual link for a section in nusachdb */
span.sectionLink a {
	text-decoration: none;
}

span.sectionLink a:link {
	color: #8080FF;
}

span.sectionLink a:visited {
	color: #8080FF;
}

span.sectionLink a:hover {
	color: #4040FF;
}

span.sectionLink a.empty:link {
	color: #6060C0;
}

span.sectionLink a.empty:visited {
	color: #6060C0;
}

span.sectionLink a.empty:hover {
	color: #484860;
}

span.sectionLink a.empty:active {
	color: #787890;
}

/* permalink for a section in nusachdb */
span.sectionPermalink {
	font-size: 80%;
	vertical-align: 2px;
}

span.sectionPermalink a {
	text-decoration: none;
}

span.sectionPermalink a:link {
	color: #8080FF;
}

span.sectionPermalink a:visited {
	color: #8080FF;
}

span.sectionPermalink a:hover {
	color: #4040FF;
}

/* disclosure triangle in main area of nusachdb */
div.contentContainer a.triangle:link, div.contentContainer a.triangle:visited, div.contentContainer a.triangle:hover, div.contentContainer a.triangle:active {
	color: #EEEEEE;
	text-decoration: none;
}

/* entire line with section link, including triangle */
span.sectionHead:hover a {
	color: #4040FF;
}

span.sectionHead {
	font-size: 135%;
}

/* notes for sections or tunes (not recordings) */
div.note {
	width: auto;
	overflow: auto;
	word-wrap: break-word;
}

/* container for tune links (ex: Melody 1) */
span.tuneLink {
	width: auto;
	overflow: auto;
	word-wrap: break-word;
}

/* tune link itself */
span.tuneLink a {
	text-decoration: none;
}

span.tuneLink a:link {
	color: #8080FF;
}

span.tuneLink a:visited {
	color: #8080FF;
}

span.tuneLink a:hover {
	color: #4040FF;
}

/* permalink for a tune in nusachdb */
span.tunePermalink {
	font-size: 80%;
	vertical-align: 1px;
}

span.tunePermalink a {
	text-decoration: none;
}

span.tunePermalink a:link {
	color: #8080FF;
}

span.tunePermalink a:visited {
	color: #8080FF;
}

span.tunePermalink a:hover {
	color: #4040FF;
}

/* included images of sheet music */
img.sheetmusic {
	width: 100%;
	height: auto;
}

/* Label that says "Recordings:" or "Sheet music:" or whatever before the list of recordings or sheet music or whatever */
div.recordingsLabel {
	width: auto;
	overflow: auto;
	word-wrap: break-word;
}

/* entire link to recording */
div.tuneRecording {
	width: auto;
	overflow: auto;
	word-wrap: break-word;
	padding-left: 1em;
	text-indent: -1em;
}

/* note on the recording from the site listing (as opposed to trNote, which is from the tune listing) */
span.recordingNote {
	font-style: italic;
}

/* loaded text file with nusach notes and translit */
div.nusachParagraph {
	white-space: pre-wrap;
	border: 1px solid #8080FF;
	margin-top: 16px;
	margin-bottom: 16px;
	padding-left: 16px;
	padding-right: 16px;
	padding-top: 16px;
	padding-bottom: 16px;
	background-color: #000014;
}

/* text that says "Loading..." while page loads */
div#loading {
	text-align: center;
}

/* div that contains recording groups */
div.recordinggroup {
	border-left: 1.5px solid #EEEEEE;
	border-radius: 10px;
	margin-left: -1em;
	padding-left: 1.2em;
}

/* span for treble clef icon */
span.treble {
	color: #A0A0C0;
}

/* span for recording and sheet music icons */
span.icon {
	color: #606080;
}

/* span for counts of icons */
span.iconcount {
	color: #A0A0C0;
}

/* div for site details */
div.detailslink {
	font-size: 90%;
	margin-bottom: 16px;
}

/* to make sure site details link stays the same color */
div.detailslink a.details:visited {
	color: #8080FF;
}

/* disclosure triangle in site details link */
div.detailslink a.triangle:link, div.detailslink a.triangle:visited, div.detailslink a.triangle:hover, div.detailslink a.triangle:active {
	color: #EEEEEE;
	text-decoration: none;
}

/* list of places where a recording is found */
ul.detailsul {
	margin-top: 0;
	list-style-type: none;
}

/* details div */
div.details {
	font-size: 90%;
	padding: 0px 16px 0px 16px;
	border: 1px solid #8080FF;
	margin-bottom: 16px;
}

/* subsite type title */
div.subsiteTypeTitle {
	color: #EEEEEE;
	text-decoration: none;
	font-size: 150%;
	text-align: left;
	position: relative;
	float: right;
	left: -50%;
}

/* to make magic center alignment work */
div.subsiteTypeTitle > .preclear {
  position: relative;
  left: 50%;
}

/* tab to hold triangle */
div.subsiteTypeTitle div.centertab {
	width: 1em;
	float: left;
}

/* actual text of subsite type title */
div.subsiteTypeTitle div.subsiteTypeTitleText {
	float: left;
}

/* disclosure triangle in subsite type title */
div.subsiteTypeTitle a.triangle:link, div.subsiteTypeTitle a.triangle:visited, div.subsiteTypeTitle a.triangle:hover, div.subsiteTypeTitle a.triangle:active {
	text-align: center;
}

/* link in subsite type title */
div.subsiteTypeTitle a:link, div.subsiteTypeTitle a:visited, div.subsiteTypeTitle a:hover, div.subsiteTypeTitle a:active {
	color: #EEEEEE;
	text-decoration: none;
}

/* hack to make bottom of Sound and Video look OK */
div.subsiteTypeSeparator {
	margin-bottom: 16px;
}