﻿/* 
COLORS: 
dark blue (bluemode): 	#004670
dark blue: 		#0B0B61
dk sky blue		#004670
blue gray		#3976A8
dark brown: 	#704214
cream:			#F4E4CA
lt cream		#FFF8DC
x cream2		#E9DBC0
x light greenish: #F5F5DC
x light blue purp	#D4D4FF
gray: 			#A1A1A1
black gray: 	#333333
light gray 		#DFDFDF
light gray		#eee
lightgray
med gray		#ccc
white			#fff
red
lightgreen (toggle)
maroon
black
*/

#versionNumber::after {
	content: " | CSS 6.2.3"
}

/* don't display this option until it works in both players */
/*
#RepeatAudioToggleButton {
	display:none !important;
}
*/

@-ms-viewport{
  width: device-width;
}

/*
@viewport{
  zoom: 1.0;
  width: device-width;
}
@-ms-viewport{
  width: device-width;
  zoom: 1.0;
}
*/
/*
@viewport{
  zoom: 1.0;
  width: extend-to-zoom;
}
@-ms-viewport{
  width: extend-to-zoom; 
  zoom: 1.0;
}
*/
/* enables browser inflation algorhythm. Was instructed to do this in order to help with something!  https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust */
/*
html { 
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
*/

/* remove Hymn Book Menu (unless it is not Make Your Own Hymnbook app, below) */
.HymnBookMenu { display:none; }

.noteFont {display: none !important;}

html {
	font-size: 16px;
}

body {
	min-height: 100%;
	width:100%;
	margin:0;
	overflow-x: hidden;
	font-size:16px;
	/* insert default values here, without background image */ 
	font-family: "San Francisco", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Coolvetica, Arial, "Lucida Grande", sans-serif;
	touch-action: manipulation; /* disable double-tap zoom for iOS and Android https://stackoverflow.com/questions/10614481/disable-double-tap-zoom-option-in-browser-on-touch-devices */
}
textarea {
	background: transparent;
}

/* prevent zoom in effect when selecting text input */
select,
textarea,
input,
select:focus,
textarea:focus,
input:focus {
    font-size: 16px;
}

body a { /* default link color */ 
	color:#0B0B61; 
	text-decoration: none;
}
.quote {
	margin-left:2em;
	font-style:italic;
	margin-bottom:15px;
}

#backgroundImage {
	/* background-image:url('Graphics/fav-header.png'); removed and added below with formula if localStoragePrefix1 = "fav"  edit 4.0.1 */ 
	background-image:none; 
	padding-top:0px;
}

.button, button { width: 250px; text-align:left; padding-left:5px; padding-right:5px;} 
.buttonAutoWide { width:auto; text-align:center; border-radius: 10px;}
.buttonLetter { 
	margin:0; padding:1px; min-width:27px; text-align:center; background-color:#F4E4CA; border-color: #E9DBC0; font-size:.8em;
}
.button, .buttonAutoWide, .buttonLetter, .buttonPressed, button { 
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

.buttonLetter, .buttonLetter.colorToggle, input.buttonLetter {
	border: none!important;
	border-radius: 0px;
	padding: 5px;
	margin-bottom: 5px;
	font-size: .8em;
}
select#selectCategoryId {
	font-size: .8em;
}

.tunes,
.buttonLetter{
	border: none!important;
	border-radius: 0px;
	padding: 5px;
}

.buttonPressed { /* a toggled button */
	text-align:center;
	border-style:inset;
	display:none;
}

.buttonPressed, .colorToggle, .buttonAutoWide.colorToggle, input.buttonLetter.colorToggle, .buttonAutoWide.numPadOther { background-color:#F8EFE0; } 

.copyrightedButton {
	opacity:0.5;
	filter:alpha(opacity=50);
}

.setBookmarkImage { 
	font-size: 35px;
}
.bookmarkWidth {
	min-width:48px;
	display: inline-block;
}
.bookmarkWidth button, .setBookmarkImage { /* edit 2/15/13 */
	padding:2px;
	margin:0;
	display: inline-block;
	width:40px;
}
#historycontainer {
	margin-bottom:10px; 
	/* margin-top:20px; */
}
#historyEntries button.buttonAutoWide {
	font-size:20px;
	margin:4px;
}
#showHistory > img[src*="-close"],
#bookmarksIcons > img[src*="-close"] {
	position: absolute;
	/* opacity: 0; */
	left: 0px;
	top: 5px;
	/* width: 20px;
	height: 20px; */
}
#showHistory:before,
#bookmarksIcons:before {
	/*content: 'Bookmarks';*/
	display: block;
	margin-bottom: 10px;
	padding-left: 30px;
	padding-right: 30px;
	overflow: visible;
	color: #000;
	background-image: url('Graphics/clear.png');
	background-size: auto 25px;
	background-repeat: no-repeat;
	background-position-x: -3px;
	background-position-y: -3px;
	text-align:center;
	font-weight:bold;
}
/*
#showHistory:before {
	content: 'History';
}
*/
#historyEntries > span {
	margin: 0px!important;
	display: inline-block;
}
#historyEntries {
	display:flex;
	overflow-x: scroll;
}
#bookmarksIcons,
#showHistory {
	position: relative;
	width: inherit!important;
	border: none;
	text-align: center;
	/* max-width: 600px; */
	margin: auto!important;
	float: none!important;
	/* padding-top: 0px!important;
	padding-bottom: 10px!important; */
	box-sizing: border-box;	
	padding:10px;
}
#bookmarksIcons {
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}

#bookmarksIcons {
	max-width:365px;
}
#showHistory {
	/* margin-top:-20px !important; */
}
#bookmarkTitle, #historyTitle {
	width: 280px;
	margin:auto;
}
#bookmarksCloseButton, #historyCloseButton {
	float:left;
	margin:0px;
	margin-top:-7px; 
	height:30px; 
	width:30px;
}
#bookmarksHeader {
	display:block;
	margin:0;
	padding:0;
	min-height:30px;
}
#historyHeader {
	display:inline-block;
	margin:0;
	padding:0;
	width:100%;
}

body #indexTable { /* indexArea */
	padding-left:10px;
	padding-right:10px;
	margin-top:0px;
	margin-bottom: 150px; /* for scroll room */
	/* width:95%;  edit 3/2/13 NB */
	/* max-width:640px; */ /* can't do this - removes auto width */
}
.scriptures {
	font-style: italic;
	font-size: 13px;
	font-weight:normal;
	/* font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Coolvetica, Arial, "Lucida Grande", sans-serif; */
	margin-bottom: 10pt;
	padding-left:20px;
}

ol li { margin-bottom:13px; }
ul { padding-left:20px; }
ul li {
	list-style-type: none;
	margin:0;
}
.indent { padding-left:25px; }
.index {
	text-align:center;
	margin-top:5px;
}

#index.favoritesPage #indexArea .row, #index.favoritesPage #indexAreaNumberOrder .row {
	display:none;
}
/*
#index.favoritesPage .hideOnFavoritesPage {
	display:none;
}
*/
#index.favoritesPage #indexArea .row.fav, #index.favoritesPage #indexAreaNumberOrder .row.fav {
	display:table-row;
}
#index #indexArea .hideCat, #index #indexAreaNumberOrder .hideCat { display:none !important; }
#index input.button {
	width: inherit;
}
#indexArea .cell, #indexAreaNumberOrder .cell { 
	/* font-size: .9rem; */
	text-align:left; /* forces button to be next to number */
	display:inline;
}
#indexArea, #indexAreaNumberOrder  { 
	text-align:left;
}
#indexArea .buttonLetter, #indexAreaNumberOrder .buttonLetter { 
	text-align:left; 
	padding-left: 5px; 
	font-size: 1.1rem; 
}
#indexContainer {
	margin-left:auto;
	margin-right:auto;
	max-width: 900px;
}
div.thead {
	display:inline;
	text-align:left;
}
#index select {
	max-width:80%;
}
select {
	border-radius: 20px;
	color:black;
	font-weight:bold;
	padding:5px;
}

.hideMe, .hiddenNoToggle { display:none !important; } /* class hiddenNoToggle does not toggle */
hr {
	color:#704214;
	height:2px;
	border: none;
	background: #eee;
}

.titles { /* #topItems, #favoritesTitle, #searchResultsTitle */
	font-size:18px; 
	font-weight:bold; 
	margin-bottom:0px; 
	color:white; 
	padding-right:38px; /* offset arrow */
	display:none;
	padding-top: 10px;
	padding-bottom:7px;
}
#titleContainer.titles {
	padding-right:0px; /* other titles do have one due to back arrow */
}
#topItems {
	padding-right:0px;
}
.title, .title a, #changeHymnalOptions { /* edit 3.1.0 */
	font-size: 20px !important;
	/* font-family: "Monotype Corsiva", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Coolvetica, Arial, "Lucida Grande", sans-serif; */
	font-style: normal;
	/* font-weight:bold; */
	/* color:#704214; */
	background: transparent;
	text-align: center;
	border: none;
	/* font-family: 'arial','helvetica',sans-serif; */
	padding-bottom: 8px;
}
#title {
	padding-bottom:0px;
}
.titlespan {
	font-size: .8em !important; /* try to prevent wrapping */
}
#hymnalInformationLink {
	display: inline;
	margin-left:10px;
}
#shareHymnalIcon {
	display:inline-block; 
	vertical-align:middle; 
	margin:4px;
	/*float:right;
	margin-top:0;
	padding-top:0;*/
}
/* forces centering, but we don't want to center if screen is too small */
/*
#shareHymnalIconSpacer { 
	float:left;
	width:40px;
	height:20px;
	margin:0px;
}
*/

#customTuneHeader  {
	font-size:110%;
	display:inline-block;
}
#selectATune {
	margin:20px;
	margin-top:5px;
	margin-bottom:10px;
	height:300px;
	float:left;
	overflow-y:scroll;
	padding:10px;
	max-width:700px;
	/* scrollbar-color: lightgray gray; */
}
/* needed for the rest to work */
#selectATune::-webkit-scrollbar { 
	background-color:#f1f1f1;
}
#selectATune::-webkit-scrollbar-track {
	background: #f1f1f1;
}
#selectATune::-webkit-scrollbar-thumb {
	background: #888;
}
#selectATune::-webkit-scrollbar-hover {
	background: #555;
}
#selectATune {
	-webkit-overflow-scrolling: auto;
}
#selectATune::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}
#selectATune .selectATune {
	font-size:110%;
	font-weight:bold;
}
#tunesSection {
	margin-bottom:200px;
	margin-left:10px;
}
/* add transparency to show there is more data for ios since it hides the scroll bar */
#tunesPopupCustomReplaceContainer {
	 position: relative;
	 padding-bottom:20px;
}
#selectATune:after {
  content: '';
  position: absolute;
  bottom: 0;
  width: 95%;
  height: 65px;
/*	background: -moz-linear-gradient(down, rgba(255,255,255, 0), rgba(255,255,255,255));
	background: -webkit-linear-gradient(down, rgba(255,255,255, 0), rgba(255,255,255,255));
	background: linear-gradient(to up, rgba(255,255,255, 0), rgba(255,255,255,255));
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='transparent',GradientType=1 ); */
  pointer-events: none;
}
/*
#tunesPopup {
	padding-bottom:30px;
}
*/
#tunesSelection {
	margin-left:auto;
	margin-right:auto;
	max-width:800px;
}
#tunesPopupReplace, #tunesPopupCustomReplace {
	margin:10px;
	margin-bottom:20px;
}
.customTuneDiv  {
	border-bottom: solid 1px black;
}
#tunesPopupReplace .listen, #tunesPopupCustomReplace .listen {  /* play button in popup */
	margin-top:10px;
	margin-bottom:-10px;
	font-size: 1.5rem;
}
#tuneSelection .thead {
	text-align:center;
}
div#tuneSelection .cell, div#tuneSelection .thead .cell {
	display:table-cell;
}
div#tuneSelection .cell, div#tuneSelection .row {
	padding:2px;
	font-size:14px;
}
div#tuneSelection {
	margin-bottom:0px;
	max-width:100%;
}
div#tuneSelection .row, div#tuneSelection .thead {
	width:100%;
}
#tuneSelection div .thead:nth-of-type(1), #tuneSelection div.thead .cell:nth-of-type(1) {
	width:1rem;
	min-width:27px;
}
#tuneSelection .button div:nth-of-type(2), #tuneSelection div.thead .cell:nth-of-type(2) {
	width:60%;
}
#tuneSelection .button div:nth-of-type(3), #tuneSelection div.thead .cell:nth-of-type(3) {
	width:40%;
}

#tunesPopupCustomReplaceContainer {
	float:left;
	border-color: #004670;
	border-width:1px;
	border-style:solid;
	max-width:100%;
}
#tuneSelection .playButtonTD {
	background-color: white;
	width:1rem;
}

.tuneForText {
	font-weight:bold;
}

.starterDiv {
	z-index:300;
	height:70px; 
	margin-top:0px;
	white-space: nowrap; /* prevent score from wrapping to next line */
}
img.listen { /* play button image */
	width:30px;
	height:30px;
	z-index:300;
}
img #repeatButton { /* edit 2.5.0 */
	width:30px;
	height:30px;
}
#instrucciones {
	/* font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Coolvetica, Arial, "Lucida Grande", sans-serif; */
	font-size:24px;
}
.playButton:hover {
	opacity:0.5;
	filter:alpha(opacity=50); /* For IE8 and earlier */
}
.playButton {
	margin-bottom: -10px;
}
#secondRowButtons { padding-top:10px; }
.toggleThis {
	display:none;
	margin-top:10px;
}
.topText, .meterText { /* edit 2.5.0 */
	text-align:center;
	margin-top:5px;
	font-style:italic;
	/* max-width:500px; */ /* edit 3.3.0 NEB */
}
.meterText a {
	text-decoration:none;
}
.topText ul { /* edit 2.5.0 */
	margin-top:0;
}
.tunes { margin-left:10px;  } /* edit 9/4/12 float:right;  edit 2/16/13  */
.source { padding-left:15px; display:none;} /* edit 3.3.0 */
.toggleNext {
	text-align:center;
	/* margin-bottom:10px; */ /* edit 9/3/12 */
}
.tuneFor {
	font-style:italic;
}
/* .song { margin-top:25px; }  edit 9/1/12 */
.asterisk { color:#C11B17; }
.info { /* edit 3.0.0 */
	text-align: left;
	font-size: 20px;
	margin-left: 0px;
	margin-bottom: 10px;
	margin-top:0px;
	/* color:#C11B17; */
}
.info ul { /* edit 3.0.0 */
	margin:0;
}
.infoTitle{ /* edit 3.0.0 */
	font-weight: bold;
	font-style: italic;
	padding-bottom: 5px;
}
#footer {
	text-align:center;
	font-size:11px;
	font-style:italic;
}
.highlight { background-color: yellow; }

.playerWindow { 
	display:inline-block;	
}
/* audio {  is calculated in index.html } */
.chorus {
	font-style: italic;
	padding-top:16px;
	padding-bottom:5px;
	padding-left: 16px;
}
.addedChorus {
	color: #C11B17;
	font-style:italic;
	padding-top: 16px;
	padding-left: 16px;
}
.abcjs-css-warning { /* display bug */
	display:none;
}				  
/* #topItems { padding-left:38px; padding-right:38px; }  edit 2/17/13 */

#enterNumber { background : url('Graphics/num-field.gif') no-repeat; background-size: 100%; background-color:white; }
#enterNumber:focus { background-image:none; }
.opaque {
	opacity:0.8; filter:alpha(opacity=80);
}
.opaque:hover {
	opacity:1.0; filter:alpha(opacity=100);
}


.bottomText {
	font-style:italic;
	margin-bottom:15px;
	margin-top:15px; /* edit 2.6.2 */
	max-width:700px;
	margin-left:auto;
	margin-right:auto;
}
/* edit 1.2.4 */
.copyrighted ol { 
	display:none !important;
}
/* edit 2.2.0 1/17/16 NEB */
div.copyrightStatement {
	padding-top:50px;
	font-style:italic;
}

.copyrightNotice {
	font-style:italic; 
	font-size:15px;
}
.userNoteTextArea, #noteEditorTextArea { /* edit 1/30/13 NB */
	/* background-color:transparent; removed 2/16/14 */
	width:96%; 
	/* min-width:280px; */ /* removed - two column needs smaller size */
	max-width:640px;
	margin-left:auto;
	margin-right:auto;
	height:100px;
}
#noteEditorTextArea {
	background-color:lightgray;
}

#notesCloseButton {
	text-align:left;
}
#noteSaveArea, #hymnalNoteTextAreaContainer {
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
	border-radius:10px;
	padding:4px;
	font-weight:bold;
	border-width:1px;
	border-style:solid;
}
#noteLabel {
	display:inline-block;
	font-style:italic;
	font-size: .8em;
}
div.noteEditIcon {
	display:inline-block;
	margin-top:0;
	/* font-size:1.7em; */
}
#tunesSection div.noteEditIcon {
	margin-top:10px;
}

.invisibleTextArea {
	width:96%; 
	min-width:280px; 
	max-width:640px;
	margin-left:2%;
	margin-right:2%;
	color:#704214;
	background: transparent;
	text-align: center;
	border: none;
}


.settingsButton { 
	display:inline-block; 
	width:260px; min-height:40px; 
	
	text-align:left; 
	background-color:white; 
	margin:0;
	margin-bottom:-2px;
	border-color: #DFDFDF; 
	border-width:2px;
	border-style:solid; 
	font-size:18px;
}

.roundedTop {
	-moz-border-bottom-left-radius: 0;
	-webkit-border-bottom-left-radius: 0;
	border-bottom-left-radius: 0;
	-moz-bottom-border-right-radius: 0;
	-webkit-bottom-border-right-radius: 0;
	border-bottom-right-radius: 0;
}
.roundedBottom {
	-moz-border-top-left-radius: 0;
	-webkit-border-top-left-radius: 0;
	border-top-left-radius: 0;
	-moz-top-border-right-radius: 0;
	-webkit-top-border-right-radius: 0;
	border-top-right-radius: 0;
	margin-bottom:0;
}
.noRound {
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
}
.rounded {
	display:inline-block; 
	width:96%;
	text-align:center; 
	background-color:white; 
	padding:10px;
	border-color: #DFDFDF; 
	border-width:2px;
	border-style:solid; 
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	color:black; /* edit 2.6.6 */
}
.rounded a { /* edit 2.6.6 */
	color: black;
}
.checkmark { 
	float:right;
	margin-right:0px;
	vertical-align:middle;
	line-height: 30px;
	font-size:22px;
}
.icon-container {
	width: 40px;
	display: inline-block;
	text-align:center;
	vertical-align:middle;
	/* font-size:8px; edit 4.0.2 NEB */
}
/* edit 2/26/13 */
.options-label {
	display:inline-block; 
	margin-left:10px;
	vertical-align:middle;
	line-height: 30px;
	font-size:18px;
	max-width:210px;
}
.noWrap {
	overflow: hidden;
	white-space: nowrap;
}
.blueButton, .blueButtonAuto {
	background: #3976A8; /* Old browsers and IE filters remove rounded corners in IE*/
	background: -moz-linear-gradient(top,  #7ab3e1 2%, #0c436b 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#7ab3e1), color-stop(100%,#0c436b)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #7ab3e1 2%,#0c436b 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #7ab3e1 2%,#0c436b 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #7ab3e1 2%,#0c436b 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #7ab3e1 2%,#0c436b 100%); /* W3C */
	/* color:white !important; */
	font-size:1.2em !important; /* edit 2.5.0 */
	margin:5px;
	padding:0;
	height:32px;
	width:32px;
	text-align:center;
	border:none;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
}
.blueButtonAuto {
	padding-left:5px;
	padding-right:5px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
.blueButton.colorToggle, .blueButtonAuto.colorToggle { /* edit 3/2/13 */
	background: #5895C6; /* Old browsers and IE filters remove rounded corners in IE*/
	background: -moz-linear-gradient(top,  #91B9D9 2%, #105D94 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#91B9D9), color-stop(100%,#105D94)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #91B9D9 2%,#105D94 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #91B9D9 2%,#105D94 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #91B9D9 2%,#105D94 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #91B9D9 2%,#105D94 100%); /* W3C */
}
.buttonAutoWide.blueButton { /* edit 2.5.0 */
	width: auto;
	padding-left: 7px;
	padding-right: 7px;
}
.colorToggle { /* edit 3/2/13 */
	border:yellow !important;
	border-style:inset !important;
	border-width:3px !important;
}
.imageButtons {
	display:inline-block;
	vertical-align: middle;
	width:32px;
	height:32px;
}
.addBorder {
	border-color: #DFDFDF; 
	border-width:2px;
	border-style:solid; 
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;
}
#HTML5PlayerToggleButton { /* edit 11/2/13 */
	display:none;
}
#songPlaylistTitle img { /* edit 3/1/13 */
	display:none;
}
#userNoteTextArea, #hymnalNoteTextArea, #hymnalNoteTextAreaContainer, #noteEditorTextArea , #userNoteTextAreaViewer { /* edit 3/2/13 NB edit 2.4.0 */
	/* background-color:transparent; removed 2/16/14 */
	width:94%; 
	max-width:640px;
	margin-left:3%;
	margin-right:3%;
}
#hymnalNoteTextAreaContainer {
	margin-left:auto;
	margin-right:auto;
}
#instructionsAddingText ul li{
	list-style-type:disc;
	padding-bottom:5px;
	margin-left:15px;
}
#instructionsAddingText ul {
	list-style-position:outside;
}
#getTheAppButton { /* use if no app is available  edit 1/28/14 */
	/*	display:none; */
}
/* edit 2/15/14 */
.fav::before {font-weight: bold; color: maroon;}



/* added below:
.hideIfNotMYOH
#optionsMenu1 .hideForAndroid 
.noteFont
.hideIfMYOH

added in index.html
.hideForWeb
.hideForApp

*/

button.roundedBottom { margin-bottom:0; }
.spacer {padding-left:15px;}
.showForAndroid {display:none;} /* hide unless Android app */


.autoWidthButton { /* edit 2.5.0 */
	font-size:16px; 
	width: auto; 
	padding:5px;
}

.autoWidthButton { 
	font-size:16px; 
	width: auto; 
	padding:5px;
}

#verseToday { 
	text-align:center;
/*	background-color:white;
	margin-left:auto;
	margin-right:auto;
	width:auto;
	color:black;
	padding:0; */
	disc-style:none;
}
#updateMessage, #welcomeMessage, #verseToday {
	padding:20px;
}

#updateMessage .faButton, #welcomeMessage .faButton {
	margin:0 !important;
	/* color:black !important; */
}

#welcomeMessage .content {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}
#verseToday {
	/* font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Coolvetica, Arial, "Lucida Grande", sans-serif; */
	max-width:90%;
	text-align:center;
	color:#704214; background-color: #FFF8DC;
	padding:10px;
	border-color: #704214; 
	border-width:4px;
	border-style:solid; 
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	display:inline-block;
	border: none;
	background-color: transparent;
	max-width: 400px;
	font-size: 150%;
	color: #000;
	margin: 40px 0px;
	line-height: 150%;
	font-family: times;
	font-style: italic;
}

#verseToday img{
	display: none;
}

/*
#updateMessage, #welcomeMessage{
	max-width: 600px;
	margin: 20px;
	text-align: left;
}

#updateMessage, #welcomeMessage ul li{
	text-align: left;
	padding-left: 10px;
	margin-bottom: 10px;
}

#updateMessage button, #welcomeMessage button{
	margin: auto;
	display: block;
	margin-bottom: 20px;
}
*/

.reference {
	font-style:italic;
	margin-top:7px;
	font-size:80%;
}
.tunes.colorToggle { /* edit 2.6.2 */
	-webkit-transform: rotate(180deg); /* Safari and Chrome */
	-moz-transform: rotate(180deg);   /* Firefox */
	-ms-transform: rotate(180deg);   /* IE 9 */
	-o-transform: rotate(180deg);   /* Opera */
	transform: rotate(180deg);
}
/* edit 2.6.2 */
.spanishButton, .spanishButton.roundedButtonMinWidth {
	margin-bottom:15px;
}
.spanish { display:none; }
/* end 2.6.2 */
.margin5px { /* edit 3.1.0 */
	margin:5px;
}
/* edit 3.2.0 */
/*.starterABC {zoom:70%; margin:0; margin-left:110px; margin-bottom:-50px;}*/
#notationContainer svg, .introNotationContainer svg {z-index:-1; position:relative;}
/*#notationContainer.soprano .abcjs-v1, #notationContainer.soprano .abcjs-v2, #notationContainer.soprano .abcjs-v3 { opacity:0.7;	filter:alpha(opacity=70); }
#notationContainer.alto .abcjs-v0, #notationContainer.alto .abcjs-v2, #notationContainer.alto .abcjs-v3 { opacity:0.7;	filter:alpha(opacity=70); }
#notationContainer.tenor .abcjs-v0, #notationContainer.tenor .abcjs-v1, #notationContainer.tenor .abcjs-v3 { opacity:0.7;	filter:alpha(opacity=70); }
#notationContainer.bass .abcjs-v0, #notationContainer.bass .abcjs-v1, #notationContainer.bass .abcjs-v2 { opacity:0.7;	filter:alpha(opacity=70); }*/
#himnario.soprano svg .abcjs-v0.abcjs-note path, #himnario.soprano svg path.abcjs-v0.abcjs-beam-elem { fill: red; color: red;}
#himnario.alto svg .abcjs-v1.abcjs-note path, #himnario.alto svg path.abcjs-v1.abcjs-beam-elem { fill:red; color: red;}
#himnario.tenor svg .abcjs-v2.abcjs-note path, #himnario.tenor svg path.abcjs-v2.abcjs-beam-elem { fill:red; color: red; }
#himnario.bass svg .abcjs-v3.abcjs-note path, #himnario.bass svg path.abcjs-v3.abcjs-beam-elem { fill:red; color: red;}
.redMode #himnario.soprano svg .abcjs-v0.abcjs-note path, .redMode #himnario.soprano svg path.abcjs-v0.abcjs-beam-elem { fill:#004670; color: #004670;}
.redMode #himnario.alto svg .abcjs-v1.abcjs-note path, .redMode #himnario.alto svg path.abcjs-v1.abcjs-beam-elem { fill:#004670; color: #004670;}
.redMode #himnario.tenor svg .abcjs-v2.abcjs-note path, .redMode #himnario.tenor svg path.abcjs-v2.abcjs-beam-elem { fill:#004670; color: #004670; }
.redMode #himnario.bass svg .abcjs-v3.abcjs-note path, .redMode #himnario.bass svg path.abcjs-v3.abcjs-beam-elem { fill:#004670; color: #004670;}


.starterABC {margin-bottom:-35px;margin-top:-10px;z-index:-1; position:relative; height:80px !important;}
.starterABCfile { /* starter notation graphic -- allows tune name to cover the notation to allow click event */
	margin-bottom:0px;
	/* margin-top:-35px; */ /* was -65 */
	/* margin-left:-20px; */
	z-index:-1; 
	position:relative; 
	height:70px !important;
	overflow:hidden !important;
	padding-bottom:0px !important;
	max-width:250px !important;
	display: inline-block;
	vertical-align: top !important;
}
.starterABCfile text {display:none;} 
img.sheetMusic_button {  /* edit 4.0.1 NEB */
	width:50px;
	margin-top:10px;
	z-index: -1;
	position:relative;
	margin-bottom:0px;
}
div.tuneNameABC {
	margin:0;
	padding-top: 0px;
	padding-bottom:0px; 
}
div.tuneNameABC1 {
	display:inline-block;
}
div.tuneNameABC2 {
	display:inline-block;
	vertical-align:middle;
	margin-bottom:7px;
}
.insertNotationHereABC, #notationContainer {
  display:inline-block;
  vertical-align:top;
  z-index: 0;
  position:relative;
  margin-left:2px; /* eliminates issue with left staff bar not being seen on iOS */
  width:100%;
}
#insertNotationHereABC img {
	width: 100% !important;
}
#insertNotationHereABCZoomContainer {
	margin-left:auto;
	margin-right:auto;
}


/* try paper effect  https://css-tricks.com/snippets/css/stack-of-paper/ */
#ZZinsertNotationHereABC {
  box-shadow:
    /* The top layer shadow */
    0 -1px 1px rgba(0,0,0,0.15),
    /* The second layer */
    0 -10px 0 -5px #eee,
    /* The second layer shadow */
    0 -10px 1px -4px rgba(0,0,0,0.15),
     /* The third layer */
    0 -20px 0 -10px #eee,
    /* The third layer shadow */
    0 -20px 1px -9px rgba(0,0,0,0.15);
}




div.introNotationContainer {  /* convert full score to first line score at top */
	display: block;
	/* vertical-align:top; */
	z-index: 0;
	position:relative;
	margin:10px;
}
.insertIntroNotationHereABC {
	margin-left: auto;
	margin-right:auto;
	width: 100% !important;
	max-width: 300px !important;
	padding-bottom:0 !important;  /* offsets issue with coded margin when using relative spacing */
	height:4.5rem; /* offsets issue with coded margin when using relative spacing */
	overflow:visible !important;
}
.insertIntroNotationHereABC svg {
	transform-origin: left top;
}
div.insertIntroNotationHereABC svg text:nth-of-type(2), div.insertIntroNotationHereABC svg text:nth-of-type(3), div.insertIntroNotationHereABC svg text:nth-of-type(4) { /* remove meter and author and tempo for intro score */
	display:none;
}
div.insertIntroNotationHereABC text {
	display:none;
}

div.scoreButtons {
	display:inline-block; 
	z-index:150; 
	text-align:center;
	margin-left:30px;
	margin-right:30px;
}

.abcjs-midi-tempo {width: 45px !important; } /* tempo area for abcjs player */
.abcjs-tempo {display:none;} .abcjs-tempo.abcjs-mm0 {display: revert;}  /* hide tempos after the initial tempo */
.abcjs-tempo {transform: translateY(7px);}
.abcjs-tempo-wrapper span {display:none;} /* (BPM) tempo info */
.abcjs-inline-audio {width:300px !important; } /* width of abcjs audio player */
#ABCJS_player {
	width:400px;
	display:inline-block;
	vertical-align:middle;
}
#playImgABC {
	display:inline-block;
	margin-left:10px;
}
.abcjs-play-svg, .abcjs-inline-audio, .abcjs-midi-tempo { /* play button, abcjs player */
	font-size:14px !important;
}

.tuneName {  /* tune name within the hymnal above the lyrics */
	display:none;
}

svg .abcjs-title {
	font-style:italic;
	font-size:20px;
}
svg .abcjs-part, svg .abcjs-meta-bottom text {
	font-size:15px !important;
	transform: translate(0px,-5px);
	-ms-transform: translate(0px,-5px); /* IE 9 */
	-webkit-transform: translate(0px,-5px); /* Safari and Chrome */
	-o-transform: translate(0px,-5px); /* Opera */
	-moz-transform: translate(0px,-5px); /* Firefox */		
}
svg .abcjs-meta-bottom text {
	transform: translate(0px,-20px);
	-ms-transform: translate(0px,-20px); /* IE 9 */
	-webkit-transform: translate(0px,-20px); /* Safari and Chrome */
	-o-transform: translate(0px,-20px); /* Opera */
	-moz-transform: translate(0px,-20px); /* Firefox */	
}

div.tuneNameAboveScore {
	font-family: "Times New Roman", "serif";
	font-size:1.1rem;
	text-align: center;
	margin-top:15px;
	color:black;
	margin-left:auto;
	margin-right:auto;
	max-width:400px;
}
#notationContainer {
	overflow-wrap: break-word; /* so text wraps if necessary */
	width:100%;
	/* max-width: 300px; */
	display:block;
	margin-left:auto;
	margin-right:auto;
}
#himnos.twoColumns #notationContainer, #himnos.twoColumns div.songPart {
	width:48%;
	display: inline-block;
}
div.introNotationContainer div.tuneNameAboveScore {
	max-width:100%;
	font-size:1rem;
}
div.wideStaff #notationContainer {
	/* max-width:400px !important;	 */
}

.songPart, #songPartAlternate {
	display:inline-block;
	margin-bottom: 50px;
	text-align:left;
	/* max-width: 50%; */
	/* min-width: 365px; */ /* relates to .songPart min-width media query below */
}

/*
@media (max-width:768px){
	.songPart {
		max-width: initial;
	}
}
*/
.displayIfUserNotesEnabled {display:none;} /* edit 4.0.1 dropdown toggle arrow for notes only */
#userNotes, #userNotesGeneral {
	margin-left:auto;
	margin-right:auto;
	width:100%;
	margin-top:20px;
}

.fa-check-circle {font-size:20px;margin-left: 10px; margin-bottom:-2px;}
.fa-check-circle,.fa-pause-circle {font-size:1.2em; margin-left: 10px; margin-bottom:-2px;}
/* .fontawesome {font-family: Font Awesome 5 Free; font-size:16px; font-weight: 900;} */
.fa-check-square, .fa-square {
	font-weight: 100;
}

.fullPopup {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.98);
	z-index: 500 !important; /* needs to be above the tutorial alertokcancel popup */
	cursor: pointer;
	display: block;
	padding: 10px;
	border-color: #DFDFDF;
	border-width: 2px;
	border-style: solid;
	color: black;
	text-align: left;
	box-sizing: border-box;
	overflow: auto;
}
.fullPopup ul li, #updateMessage ul li {
	margin-top:5px;
	list-style-type: disc;
}
.fullPopup li, #updateMessage li { /* produce hanging indent */
	text-indent: -10px;
	padding-left: 12px;
}
.fullPopup li i, #updateMessage li i { /* strangely, the li entry affects i font awesome as well */
	text-indent: 0px;
	padding-left: 0px;
}
.update_li_title {
	list-style-type:none !important; 
	margin-left:-14px !important;
}

.unofficial {
	font-style:italic;
	opacity:0.7;
	filter:alpha(opacity=70);
}
#results {
	padding: 10px;
	text-align: center;
	margin-top: 10px;
	display: block;
	margin:auto;
	max-width: 500px;
	border-radius: 10px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}
.searchResultsSongButton {
	margin:10px;
}
#resultsSongList {
	margin-left:auto;
	margin-right:auto;
	max-width:600px;
	margin-bottom:150px;
}

textarea.userNoteTextArea, textarea#noteEditorTextArea {
	border-radius: 0px;
}
.userNoteButtons { text-align:center; }
.fa-toggle-on {color:lightgreen !important;}


/*  ------------------------------------ FERNANDO STYLE.CSS ------------------------------------  */  

button,
[type="submit"],
[type="button"] {
	-webkit-appearance: none!important;
}

#upperPortion {
	position: relative;
	z-index: 10;
}

.song > button,
.song > toggleThis,
.song > span {
	position: relative;
	z-index: 8;
}

#all-menus{
	position: fixed;
	top: 0px;
	right: 0px;
	height: 100%;
	z-index: 300;
	background-color: rgba(0, 0, 0, .85);
	max-width: 100%;
	padding: 20px 0px;
	overflow: auto;
	box-sizing: border-box;
	padding-bottom:100px;
}

#all-menus .settingsButton{
	background: none;
	color: #fff;
	border: none;
	border-bottom: 1px solid #A1A1A1;
	padding: 5px 0px;
	border-radius: 0px;
	margin: 0px 20px;
}

#all-menus .title{
	color: #fff;
	/*font-family: 'arial','helvetica',sans-serif;*/
	text-transform: uppercase;
}

#all-menus a {
	color: #fff;
}


#helpMenu {
	width: inherit!important;
}
#helpMenu ul {
	display:block;
}
#helpMenu ul li {
	margin-left:30px;
}

#tuneMenu {
	min-width: 300px; /* for when there is nothing to display */
}

.rounded {
	box-sizing: border-box;
}

img{
	max-width: 100%!important;
}

input,
textarea{
	outline: none!important;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}

#secondRowButtons{
	padding-bottom: 10px;
	position: relative;
	border-bottom: 3px solid #888;
}

#secondRowButtons *{
	vertical-align: middle!important;
}

#secondRowButtons .blueButton{
	margin: 0px;
	float: left;
}

#secondRowButtons input[type="button"]{
	padding: 0px 20px!important;
	font-size: 14px!important;
	border: none!important;
}

#clearButton, #clearButton-presentation {
	background-color: transparent!important;
	background-image: url('Graphics/clear.png');
	text-indent: -9999px;
	background-size: contain;
	padding: 0px;
	width: 32px;
	margin-left: -40px!important;
}

#additionalInfo{
	padding: 10px;
	font-size: 13px;
	padding-bottom: 15px;
}

#titleArea select{
	position: absolute;
	opacity: 0;
	left: 0px;
	right: 0px;
	margin: auto;
	/* font-family: 'arial','helvetica',sans-serif; */
	background: none!important;
	outline: none;
	max-width: 400px;
	width: 100%;
	color: #000;
}

#titleArea .titlespan{
	text-transform: uppercase;
	letter-spacing: 2px;
	font-weight: bold;
	border: 1px solid #ccc;
	padding: 5px 20px;
	display: inline-block;
	margin-bottom: 10px;
}

#titleArea .titlespan:after{
	content: '▼';
}




button[title="Back to top"]{
	border: solid 1px #A1A1A1;
	background: rgba(255, 255, 255, .75);
	height: 40px;
	width: 40px;
	border-radius: 50%;
	color: #004670!important;
	right: 10px!important;
	bottom: 10px!important;
	left: inherit!important;
	z-index: 999999999;
}

button[title="Back to top"]:active{
	color: #004670;
}

.buttonAutoWide,
.blueButton{
	border: none;
	border-radius: 0px;
}

button.songTitle{
	/* width: inherit!important; */
	border: none!important;
	font-size: inherit;
	width: 75%; /* calc(100% - 120px); */
	max-width: 22em;
	white-space: normal;
	border-radius: 0px;
	padding:5px;
	margin-left: 5px;
}



.song [title="Listen"] + .toggleThis{
	padding: 5px;
}

ol.lyricsList{
	text-align: left;
	/* padding-left: 60px; */
	display: inline-block;
}

.row2-group{
	display: inline-block;
	margin: 0px 5px;
}

#searchImage-container,
#optionsImage-group{
	background-color: #3976A8; /* Old browsers and IE filters remove rounded corners in IE*/
	background-color: -moz-linear-gradient(top,  #7ab3e1 2%, #0c436b 100%); /* FF3.6+ */
	background-color: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#7ab3e1), color-stop(100%,#0c436b)); /* Chrome,Safari4+ */
	background-color: -webkit-linear-gradient(top,  #7ab3e1 2%,#0c436b 100%); /* Chrome10+,Safari5.1+ */
	background-color: -o-linear-gradient(top,  #7ab3e1 2%,#0c436b 100%); /* Opera 11.10+ */
	background-color: -ms-linear-gradient(top,  #7ab3e1 2%,#0c436b 100%); /* IE10+ */
	background-color: linear-gradient(to bottom,  #7ab3e1 2%,#0c436b 100%); /* W3C */
	
	display: inline-block;
	height: 32px;
}

#viewAllButton{
	margin-right: 1px!important;
}

#showNumPad{
	background-size: contain;
	background-position: center;
	background-color: #3976A8; 
	background-image: url('Graphics/keyPad.png');
	margin:5px;
	margin-left:5px !important;
	border-style:solid;
	border-width: 2px;
}

#hideNumPad{
	background-size: contain!important;
	background-position: center!important;
	background-color: #3976A8;
	background-image: url('Graphics/keyPad.png')!important;
	border-radius: 0px;
	margin-left:5px !important;
	border-style:solid;
	border-width: 2px;
}
#searchSettingsMenuButton, #tuneSettingsMenuButton, #historyDeleteButton {
	vertical-align:middle;
	width:30px; 
	height:30px;
	margin-left:5px;
	border-style:solid;
	border-width: 0px;
	border-radius:20px;
}
#changeNumberLetterButton {
	vertical-align:middle;
	width:32px; 
	height:32px;
	border-style:solid;
	border-width: 2px;
	border-radius:20px;
	font-weight:bold;
}
#tuneSettingsMenuButton {
	margin-right:10px;
}

#alpha{
	max-width: 600px;
	margin: auto;
	margin-bottom: 10px;
}

#categoryList{
	margin: 10px;
}

.topTextSearch {
	text-align: left;
}

.topTextSearch .listen {
	margin-bottom: 10px;
	padding-left: 60px;
}

/*.topTextSearch .infoTitle*/
/*.topTextSearch .tuneName,*/
/*.topTextSearch ul,*/

.topTextSearch ul {
	padding: 0px;
}

.topText {
	text-align:center !important;
	padding-left:0;
}

#content{
	position: relative;
	padding-top: 10px;
	overflow: hidden;
	/* overflow-x: scroll; */
}

#content.searchResults div.viewIcons, #content.searchResults #notationContainer, #content.searchResults div.songPart {
	display:none !important;
}

#himnos {
	text-align: center;
}

.song {
	text-align: center;
}

/*
#himnos > .song:not(.hideMe) {
	display: inline-block;
	margin-right: 10%;
	margin-left: 10%;
}

@media (min-width:1100px) {
	#himnos > .song:not(.hideMe) {
		margin-right: 30%;
		margin-left: 30%;
	}
}
*/

#nextPrevious{
	position: fixed;
	top: 55%;
	z-index: 8;
}

#nextPrevious input{
	left: 20px;
	position: fixed;
	text-indent: -9999px;
	width: 0px;
	height: 0px;
	padding: 15px;
	margin: 0px;
	border: 3px solid #000;
	transform: rotate(45deg);
	background: none;
	border-top: none;
	border-right: none;
	border-radius: 0px;
}

#nextPrevious input + input{
	left: inherit;
	right: 20px;
	border-top: 3px solid #000;
	border-right: 3px solid #000;
	border-bottom: none;
	border-left: none;
}

#additionalInfo,
#secondRowButtons {
	position: relative;
	margin-bottom: 0px;
}

#footer {
	position: relative;
	z-index: 9;
	margin-bottom: 200px;
	padding: 20px;
}


#enterText, #enterText-presentation{
	min-height: 32px;
	padding: 0px 3px;
	max-width: 300px;
	border: solid 1px #ccc!important;
	color: #ccc;
	box-sizing: border-box;
	margin: 0px;
	outline: none;
	/* border-radius: 0px; */
	box-shadow: none!important;
	-webkit-box-shadow: none!important;
	-moz-box-shadow: none!important;
}
#enterText {
	width: calc(100% - 10px)!important;
	vertical-align:middle; 
	color:grey;
}
#enterText[type=number] {
	width:150px !important;
}

#enterText-presentation-group {
	margin-left: 0px;
	margin-top: 3px;
	vertical-align:middle;
}
#enterText-group {
	margin-left: 14px;
	text-align:left;
	display:block;
	padding-top:5px;
	position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
	z-index:199;
	width: 350px;
	box-sizing: border-box;
	max-width:100%;
}
.verseButton {
	font-size:25px;
	margin:5px;
	vertical-align:middle;
	color: #004670;
}
.verseListing .selected {
	background-color: black !important;
}
.verseListing input {
	margin:5px;
}
#verseListingTop {
	margin-top:10px;
}

#verseListingTop, #verseListingTop input, #verseListingTop .verseButton {
	z-index: 250; /* place above search */
	position: sticky;
	position: -webkit-sticky; /* Safari */
	top: 0;
}

/* when the screen is under this size, use these settings */
@media screen and (max-width:630px) {
	#enterText-group {
		overflow: hidden;
		display: block;
		margin: auto;
		padding: 0px 15px;
		margin-bottom: 10px;
		width: 350px;
		vertical-align:middle;
	}
	#footer input {
		display: block;
		float: none;
		width: 100%;
		margin: 0px!important;
		margin-bottom: 10px!important;
		box-sizing: border-box;
	}
	/*#himnos > .song:not(.hideMe) {
		margin-right: 0%;
		margin-left: 0%;
	}*/
}

@media screen and (max-width:520px) {
	#enterText, #enterText-presentation {
		width:210px;
		max-width:230px;
	}
	#songTitle{
		/*width: calc(100% - 120px)!important;*/
		white-space: normal;
	}
	#nextPrevious input {
		padding: 9px;
		left: 10px;
	}
	#nextPrevious input + input{
		padding: 9px;
		left: inherit;
		right: 10px;
	}
	.songPart {
		margin: 0px 0px;
	}
	.songPart .lyricsList {
		/* padding-left: 25px; */
	}
	nav ul li div {display: none !important; } /* hide navigation bar text for small screens */
	nav ul li { width: 25px !important; height: 30px !important; }
	.drawer.active { bottom:50px !important; }
	/* #navFeedback {display:none !important;}  feedback icon makes it too wide to see rest of icons */
	/* forces centering, but we don't want to center if screen is too small */
	/*
	#shareHymnalIconSpacer { 
		width:0px;
		height:0px;
	}
	*/
}

@media screen and (max-width:365px) {
	#secondRowButtons #viewAllButton,
	#secondRowButtons #changeIndex{
		padding: 0px 10px!important;
	}
	#titleArea .titlespan {
		width: 90%;
		box-sizing: border-box;
		padding: 10px;
	}
	.title, .title a {
		font-size: 15px !important;
	}
	/*body { font-size:16px;}
	input,select {font-size: 100% !important; } */
	nav ul li div {display: none !important; } /* hide navigation bar text for small screens */
	nav ul li { width: 25px !important; height: 30px !important; }
	.drawer.active { bottom:50px !important; }
	/* #navFeedback {display:none !important;} */
	.songPart {
		/*  min-width:inherit !important; */ /* relates to .songPart min-width entry above */
	}
	#tunesPopupReplace {	margin:0px;}
	#selectATune { margin:0px;}
	#tuneSelection {
		max-width:95%;
	}
}

@media screen and (max-width:320px) {
	body {
		font-size: 14px;
	}
	#secondRowButtons #viewAllButton,
	#secondRowButtons #changeIndex{
		padding: 0px 10px!important;
	}
	#titleArea .titlespan {
		width: 90%;
		box-sizing: border-box;
		padding: 10px;
	}
	#nextPrevious input {
		padding: 9px;
	}
	nav ul li div {display: none !important; } /* hide navigation bar text for small screens */
	nav ul li { width: 25px !important; height: 30px !important; }
	.drawer.active { bottom:50px !important; }
	#navFeedback {display:none !important;}
}

#himnario {
	z-index:0;
	width:100%;
	position: relative;
	padding-top: 0px;
	margin-bottom: 200px;
	min-height:250px; /* ensures left/right arrows are visible */
}

@media screen and (max-width:630px) {
	#himnario { 
		margin-top:0;
		margin-bottom:100px;
		margin-left:0;
		margin-right:0;
	}
	div.songPart ol {
		/* padding-left:20px; */
	}
}

#notationContainer[style*="display: none;"] + .songPart{
	max-width: inherit;
}


#saveUserNoteButtonFav {
	margin:5px;
}


.row2-group {
	display: inline-block;
    margin: 0px 5px;
	/* width:100%; */
}

/* -------------------------------------- STYLE UPDATE.CSS --------------------------------------------- */
nav {
	position: fixed;
	bottom: 0px;
	left: 0;
	right: 0px;
	z-index: 200; /* NEB */
	background-color: #fff;
	border-top: solid 1px #ccc;
	overflow:auto; /* NEB */
	white-space:nowrap; /* NEB */
}

nav .highlight {
	/*animation-name: border-yellow-white;
	animation-duration: 4s;*/
	border: solid 5px red !important;
	background-color: yellow !important;
}

@keyframes border-yellow-white {
  from {border-color: yellow;}
  to {border-color: white; }
}

nav ul {
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 0px;
}

nav ul li {
	width:45px;
	padding: 10px;
	font-size: 24px;
	text-align: center;
	justify-content: center;
	align-items: center;
	color: gray;
	display: flex;
	flex-direction: column;
	height:40px;
}

nav ul li a{
	color: gray;
	font-size: 0px;
}

nav ul li.opened, nav ul li.selected {
	color: #004670;
	background-color:lightgray;
}

nav ul li div{
	font-size: 12px;
	margin-top: 10px;
}

nav.update li i{
	font-size: 24px;
}

@media (max-width:560px){ /* if browser window is 560px or less, make nav menu scrollable */
	nav.update ul{
		overflow: scroll;
		justify-content: flex-start;
	}

	nav.update ul li{
		/* width: 100%; */
		text-align: center;
	}
}

/* this isn't used */
@media (max-width:560px){
	nav.updateSmall ul li{
		padding: 10px 5px;
	}
	nav.updateSmall ul li div{
		font-size: 10px;
	}
	nav.updateSmall li i{
		font-size: 14px;
	}
}
@media (max-width:320px){
	nav.updateSmall ul li div{
		font-size: 9px;
	}
}


/* HIDING ITEMS */
#optionsImage-group,
#topItems #additionalInfo,
#viewAllButton,
#changeIndex,
#hideIndex,
#secondRowButtons,
button[title='Back to top']{
	display: none!important;
}
/* END HIDING ITEMS */

#secondRowButtons{
	display: flex;
	justify-content: center;
}

#secondRowButtons > *{
	display: inherit;
	margin: 0px 5px;
	padding: 0px;
}

#topItems{
	padding-bottom: 0px;
}


#hymnbooks-drawer {
	z-index:300;
}
.drawer {
	position: fixed;
	opacity: 0;
	width: 100%;
	/* background-color: #eee;  set in individual themes */
	transition: all .5s ease;
	z-index: 200;
	box-sizing: border-box;
	bottom: 0px;
}
.drawer.active {
	bottom: 60px;
	opacity: 1;
}
li.disabled {
	color:lightgray;
}
#input_container {
	width: 100%;
	max-width: 600px; /* was 420 */
	/* display: flex; */
	justify-content: center;
	margin: auto;
}
#input_container-presentation  {
	width: 100%;
	top: 0px !important;
	background-color: transparent !important;
/*	z-index: 300 !important; */
	max-width: 350px;
	display:block;
	margin-bottom:0px;
	position: -webkit-sticky; /* Safari */
	position: sticky;
	top: 0;
	z-index:199;
}
#search { /* , #hymnbooks, #settings, #navHelp */
	border: 3px outset;
	padding: 7px;
}	
#search.opened { /* , #hymnbooks.opened, #settings.opened, #navHelp.opened */
	border: 3px inset;
}
#search_drawer {
	z-index:100;
	border-top: 2px white solid;
}
#search_drawer:not(.active), #hymnbooks_drawer:not(.active), #views_drawer:not(.active) {
	z-index:-1; /* for some reason the seek and hymnbook selection still allow selection even though hidden */
}
#search_drawer input{
	/* width: inherit!important; */
	margin: 0px 5px;
}
#search_drawer input.buttonAutoWide, i.buttonAutoWide {
	margin:0;
	border-color: white;
    border-width: 2px;
	border-style: solid;
	padding: 2px 7px;
}

@media screen and (max-width:500px){
	#search_drawer input{
		width: inherit!important;
	}
}

i.buttonAutoWide {
	height:18px;
}

#search_drawer #enterNumber{
	width: 50px!important;
	text-align: center;
}

#keypad {
	text-align:center;
	margin-bottom:0px;
	background:inherit !important;
	display: flex;
	justify-content: center;
	padding:10px;
	padding-bottom:0px;
}
#keypad input.buttonAutoWide { 
	font-size:20px; 
	font-weight:bold; 
	height:30px; 
	width:40px !important;
	margin-bottom:10px;
	padding:0px;
}
#keypad .fa-backspace {
	vertical-align:middle;
	/* height:20px; */
	margin-top:0px;
	padding-top:4px;
}
#keypad .fa-backspace:before {
	vertical-align:middle;
}
@media only screen and (max-width: 290px) {  /* adjust keypad numbers for small screens to more likely fit on one line */
	#keypad input {
		font-size: 14px; font-weight:bold;
	}
	i.buttonAutoWide {
		height:17px;
	}
	#keypad .fa-backspace {
		height:18px;
		margin-top:2px;
		padding-top:2px;
	}
}
#keypad input, #keypad i, #keypad .buttonAutoWide { /* buttons */
	border-radius: 0px;
	margin-bottom: 3px;
	background-color: #eee;
}

#seek{
	/*position: fixed;*/
	bottom: 61px;
	width: 100%;
	background-color: transparent;
	z-index: 100;
	padding: 5px 20px;
	padding-top:10px;
	box-sizing: border-box;
	left: 0px;
	text-align: center;
}

#seek input{
	width: calc(100% - 100px) !important;
	max-width: 400px;
}

#zoomSeek {color:gray; text-align:center; margin:10px; position: relative;}
#zoomSeeker{
	transform: rotate(-90deg);
    position: absolute;
    left: 0px;
    right: 0px;
    top: 50%;
    transform-origin: center;
    margin: auto;
}
#zoomSettings, #zoomSeek {
	height:95%;
	min-width:200px;
}

#songTitle { 
	margin-left:5px; 
	display:inline-block;
	font-size: 1.4rem;
	font-weight:bold;
	text-align:left;
}
#songTitleContainer div {
	vertical-align:top;
}
#songTitleContainer {
	vertical-align:top;
	margin-bottom: 15px;
	margin-left:auto;
	margin-right:auto;
}
#players {
	display:inline-block;
}

.num {
	font-family: 'Arial Rounded MT Bold','Arial','sans-serif'; 
	font-style: normal;
	font-weight:bold;
	margin-bottom:10px;
	/* width: 4rem; this is actually set based on max hymn number in importHymnal() function */
	display: inline-block;
	text-align: right;
	position: relative;
}
#indexArea .num, #indexAreaNumberOrder .num {
	margin-bottom:0;
	margin-top:5px;
	margin-right:5px;
	display:inline-block;
}
div.table div.thead {
	display:inline-block;
}
#indexLeftAlignTableHeader {
	text-align:left;
	white-space: nowrap;
	overflow:hidden;
}
span.num{
	font-family: arial,helvetica,sans-serif;
	margin-bottom: 0px;
	/*width: 50px;*/
}
.song .num{
	position: relative;
	/*width: inherit!important;*/
	/* margin-left:40px; */ /* makes room for favorite heart on mobile devices */
	/*width:70px;*/
}

.song .num::before, #indexArea .num::before, #indexAreaNumberOrder .num::before {
	font-family: "Font Awesome 5 Free";
	content: "\f005";
	/* position: absolute; */
	text-align: center;
	/*right: calc(100% + 10px);*/
	/*top: 30px;*/
	margin: auto;
	font-weight: 400;
	margin-right:3px;
}

.song .num.fav::before, #indexArea .num.fav::before, #indexAreaNumberOrder .num.fav::before  {
	content: "\f005";
	font-weight: 900;
}

#hymnbooks_drawer{
	overflow-y: scroll;
	border-top-color: white;
    border-top-width: 5px;
    border-top-style: solid;
}
#views_drawer {
	border-top: 5px;
    border-color: white;
    border-style: solid;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}
#hymnbooks_drawer ul, #views_drawer ul {
	max-width: 400px;
	margin: auto;
}

#hymnbooks_drawer li, #views_drawer li {
	/* margin: 5px 0px; */
	color: #004670;
	padding-bottom: 8px;
    border-bottom: 1px solid white;
    padding-top: 8px;
	font-weight:bold;
}

#views_drawer li.active, #hymnbooks_drawer li.active {
	font-weight:normal;
}

/*
#himnos.searchMeters .num:before{
	content: '';
	display:none;
}
*/

body {
	-moz-transform-origin: center bottom;
	-o-transform-origin: center bottom;
	-webkit-transform-origin: center bottom; 
	transform-origin: center bottom;
}
#dialogPopup , .dialogPopup {
	margin-top: 20px;
    clear: both;
    margin-left: calc(50% - 200px);
    position: fixed;
	width:100%;
    max-width: 400px;
	height:100%;
    max-height: 320px;
    background-color: rgba(255, 255, 255, 0.98);
    z-index: 450;
    cursor: pointer;
    display: block;
    padding: 10px;
    border-color: #DFDFDF;
    border-width: 2px;
    border-style: solid;
    color: black;
    text-align: center;
    box-sizing: border-box;
    overflow: auto;
}
/* when the screen is under 400px, use these settings to keep it centered */
@media screen and (max-width:400px){
	#dialogPopup , .dialogPopup {
		margin-left: 0;
	}
}
#dialogPopupMessage {
	text-align:center;
	height:170px;
	overflow:auto; /* allow scrolling if text too much for space. */
	margin-top:5px;
	color: black;
}
#popupFontColor, #popupFontColor a {
	color:black;
}
div.dialogPopupContainer {
	text-align:center; 
	height:180px;
	margin-bottom:10px;
}
#backupHymnalCustom, #restoreHymnal, #importHymnalByURL , #backupHymnal, #importHymnal, #backupToSite, .popupContainerCentered {
	margin: 0px;
    clear: both;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.98);
	z-index: 400 !important;
    cursor: pointer;
    display: block;
    padding: 10px;
    border-color: #DFDFDF;
    border-width: 2px;
    border-style: solid;
    color: black;
    text-align: center;
    box-sizing: border-box;
    overflow: auto;
}
.roundedButtonMinWidth {
	padding: 5px 10px; 
	min-width:150px; 
	width: auto;
    text-align: center;
	border: none;
	font-size:18px;
	font-weight:bold;
	margin:1px; /* in case close together on top of each other */
}
.instructionsIcon {
	font-size:20px;
}

.screenWidth {  /* full size popups */
	margin-bottom:100px; /* ensure scroll can see everything */
	font-style:normal; 
	font-size:16px; 
	display: inline-block; 
	text-align:left; 
	margin-left:40px; 
	margin-right:40px;
}
@media screen and (max-width:600px){
	.screenWidth {
		margin-left:10px; 
		margin-right:10px;
	}
}
.popupHeader {
	font-size:20px;
	font-weight:bold;
}
.popupPaddingBottom { /* also used in scripts.js to close popups on click */
	/* padding-bottom:80px !important; */ /* bottom bar in ipad sometimes covers things.... but slider doesn't work well when there is padding! */ 
}

/* ----------  Button container ------------- */
#faButtonContainer, .faButtonContainer {
	display:inline-block;
}
#transpose .faButtonContainer {
	float:right;
}
#transpose.settingsButton {
	min-height:30px;
}
.faButton, .faButtonInverted, .faButtonSolid {
	font-size: 1.3em;
	vertical-align:middle;
	margin:4px;
	z-index:150;
}
.faButtonInverted {
	vertical-align:top; /* zoom messes with these */
}
#all-menus .faButton {
	color:white !important;
}
/*
.faButton.inactive, #faButtonContainer .fa-music.inactive {
	color:gray;
	border-color:gray;
}
*/
.faButton.disabled {
	opacity:0.2;
	filter:alpha(opacity=20);
}
/*
.fa-times-circle {
	color:#A1A1A1;
}
*/
#faButtonContainer .fa-music, #songContainer .fa-eye, #closePresentationModeButton {
	font-size:.7em;
}
#faButtonContainer .fa-music , #songContainer .fa-eye, #closePresentationModeButton {
	border: .2em solid #004670;
	border-radius: .3em;
	padding: .15em .15em .15em;
}
#instructionsText2 .fa-music, #instructionsText2 .fa-eye, #closePresentationModeButton  {
	font-size: 1em;
}
#closePresentationModeButton {
	width:25px;
	height:21px;
	text-align:center;
	padding-top:5px;
}
.selectTuneButton {
	margin-top:15px;
	margin-right:10px;
	font-size:2em;
}


/* PLAY MUSIC ANIMATION */
		#playAnimation {
			/*overflow: hidden;*/
			height: 30px;
			width:70px;
			display:inline-block !important;
			vertical-align:middle;
		}
		.tile--css_animations__demo3.playing span {
			position: relative;
			display: block;
			width: 100%;
			height: 0;
			padding-top: 78%;
			overflow: hidden;
		}
		.tile--css_animations__demo3.playing div {
			margin-top: -17%;
			height: 34%;
			width: 2%;
			top: 30%;
			border-radius: 20px;
			position: absolute;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(1) {
			animation: wave 17s 0.000s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(2) {
			animation: wave 17s -16.227s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(3) {
			animation: wave 17s -15.455s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(4) {
			animation: wave 17s -14.682s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(5) {
			animation: wave 17s -13.909s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(6) {
			animation: wave 17s -13.136s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(7) {
			animation: wave 17s -12.364s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(8) {
			animation: wave 17s -11.591s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(9) {
			animation: wave 17s -10.818s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(10) {
			animation: wave 17s -10.045s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(11) {
			animation: wave 17s -9.273s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(12) {
			animation: wave 17s -8.500s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(13) {
			animation: wave 17s -7.727s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(14) {
			animation: wave 17s -6.955s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(15) {
			animation: wave 17s -6.182s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(16) {
			animation: wave 17s -5.409s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(17) {
			animation: wave 17s -4.636s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(18) {
			animation: wave 17s -3.864s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(19) {
			animation: wave 17s -3.091s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(20) {
			animation: wave 17s -2.318s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(21) {
			animation: wave 17s -1.545s linear infinite;
		}
		.tile--css_animations__demo3.playing div:nth-of-type(22) {
			animation: wave 17s -0.773s linear infinite;
		}
		@keyframes wave {
			0% {
				left: -2%;
				background: #3B44D1;
			}
			5% {
				background: #9337FE;
			}
			10% {
				height: 10%;
				margin-top: -5%;
				background: #C532FC;
			}
			15% {
				background: #F639F8;
			}
			20% {
				height: 34%;
				margin-top: -17%;
				background: #F236C8;
			}
			25% {
				background: #FF2F8D;
			}
			30% {
				height: 10%;
				margin-top: -5%;
				background: #EE3860;
			}
			35% {
				background: #DC5245;
			}
			40% {
				height: 34%;
				margin-top: -17%;
				background: #F38643;
			}
			45% {
				background: #F8B435;
			}
			50% {
				height: 10%;
				margin-top: -5%;
				background: #FAF444;
			}
			55% {
				background: #E0FF3B;
			}
			60% {
				height: 34%;
				margin-top: -17%;
				background: #E1FF3C;
			}
			65% {
				background: #46F443;
			}
			70% {
				height: 10%;
				margin-top: -5%;
				background: #54E67B;
			}
			75% {
				background: #4DF3A9;
			}
			80% {
				height: 34%;
				margin-top: -17%;
				background: #3AF9DA;
			}
			85% {
				background: #36EBF4;
			}
			90% {
				height: 10%;
				margin-top: -5%;
				background: #3DB3F3;
			}
			95% {
				background: #3C82F1;
			}
			100% {
				height: 34%;
				margin-top: -17%;
				left: 100%;
				background: #5B38EE;
			}
		}
.tuneComments {
	margin-left:20px;
	margin-top:10px;
	font-size:14px;
}
div.loading .fa {
	font-size:25px;
	margin-right:15px;
	vertical-align:middle;
}
div.loading {
	font-size:16px;
	/* font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Coolvetica, Arial, "Lucida Grande", sans-serif; */
	margin-top:30px;
	vertical-align:middle;
	opacity:0.5;
	filter:alpha(opacity=50);
}

input[type=range] {
	-webkit-appearance: none;
	width: 100%;
	margin: 7.3px 0;
  }
  input[type=range]:focus {
	outline: none;
  }
  input[type=range]::-webkit-slider-runnable-track {
	width: 100%;
	height: 11.4px;
	cursor: pointer;
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0);
	background: rgba(0, 70, 112, 0.78);
	border-radius: 25px;
	border: 0px solid #010101;
  }
  input[type=range]::-webkit-slider-thumb {
	box-shadow: 0.9px 0.9px 1px #000031, 0px 0px 0.9px #00004b;
	border: 1.8px solid #004670;
	height: 26px;
	width: 26px;
	border-radius: 15px;
	background: #ffffff;
	cursor: pointer;
	-webkit-appearance: none;
	margin-top: -7.3px;
  }
  input[type=range]:focus::-webkit-slider-runnable-track {
	background: rgba(0, 86, 138, 0.78);
  }
  input[type=range]::-moz-range-track {
	width: 100%;
	height: 11.4px;
	cursor: pointer;
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0);
	background: rgba(0, 70, 112, 0.78);
	border-radius: 25px;
	border: 0px solid #010101;
  }
  input[type=range]::-moz-range-thumb {
	box-shadow: 0.9px 0.9px 1px #000031, 0px 0px 0.9px #00004b;
	border: 1.8px solid #004670;
	height: 26px;
	width: 26px;
	border-radius: 15px;
	background: #ffffff;
	cursor: pointer;
  }
  input[type=range]::-ms-track {
	width: 100%;
	height: 11.4px;
	cursor: pointer;
	background: transparent;
	border-color: transparent;
	color: transparent;
  }
  input[type=range]::-ms-fill-lower {
	background: rgba(0, 54, 87, 0.78);
	border: 0px solid #010101;
	border-radius: 50px;
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0);
  }
  input[type=range]::-ms-fill-upper {
	background: rgba(0, 70, 112, 0.78);
	border: 0px solid #010101;
	border-radius: 50px;
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0);
  }
  input[type=range]::-ms-thumb {
	box-shadow: 0.9px 0.9px 1px #000031, 0px 0px 0.9px #00004b;
	border: 1.8px solid #004670;
	height: 26px;
	width: 26px;
	border-radius: 15px;
	background: #ffffff;
	cursor: pointer;
	height: 11.4px;
  }
  input[type=range]:focus::-ms-fill-lower {
	background: rgba(0, 70, 112, 0.78);
  }
  input[type=range]:focus::-ms-fill-upper {
	background: rgba(0, 86, 138, 0.78);
  }

/* himnario mensajes del amor de Dios */
span.u {
	font-family: "Courier New", "Courier", "Droid Sans Mono";
    min-width: 10px;
    display: inline-block;
    text-align: center;
}

/* for items that must not be shown for whatever reason */
.prevented {
	display:none !important;
}

@media print {
	.scoreButtons, .viewIcons, #seek, nav, #search_drawer, #hymnbooks_drawer, #views_drawer, #all-menus, .song .num::before, #enterText-group, #upperPortion, #footer, #noScoreAvailableMessage, .copyrightStatement, #songPartAlternate, #userNotes, .author a:after, #userNotesGeneral, #enterText-presentation, #closePresentationModeButton {
		display:none !important;
	}
	body, body a, .nightMode svg path {
		color:black !important;
		text-decoration: none;
		background-color:white !important;
		fill:black !important;
	}
	#backgroundImage, .dayModePlain #backgroundImage, .dayMode #backgroundImage {
		border-top:0px solid white;
		margin-top:0px;
		padding-top:0px;
	}
	#himnario, .songPart {
		margin-bottom:0;
	}
	svg text {
		color:black !important;
		fill:black !important;
	}
	#songUserNoteTextAreaContainer, #hymnalNoteTextAreaContainer {
		display:none;
	}
	.num {
		color:black !important;
	}
	#nextPrevious {
		display:none;
	}
	#verseListingTop, #verseListingBottom, #scoreZoom {
		display:none;
	}
}


.abcjs-annotation { /* chorus / refrain */
	transform: translate(-20px, 0px);
}
/* ABCJS special score tweaks */
/* https://configurator.abcjs.net/classes */

/* position changes */
	/* fix issue with Ebenezer score not in right place */
		#Ebenezerabc .starterABCfile {
			margin-top: -25px !important;
			height: 90px !important;	
		}
	/* voice, stanza(?), measure, note with 0-base */
	/* div #notationContainer contains the tune file name with spaces changed to _ */


/* color changes */
	#notationContainer.Ivory_Palaces svg .abcjs-v0 {	fill:red; } /* melody in red, but v0 changes more than we want */
	#notationContainer.Ivory_Palaces svg .abcjs-staff-extra, #notationContainer.Ivory_Palaces svg .abcjs-bar, #notationContainer.Ivory_Palaces svg text, #notationContainer.Ivory_Palaces svg .abcjs-tempo.abcjs-l0.abcjs-m0.abcjs-v0 { fill:black !important; }
	.nightMode #notationContainer.Ivory_Palaces svg .abcjs-staff-extra, .nightMode #notationContainer.Ivory_Palaces svg .abcjs-bar, .nightMode #notationContainer.Ivory_Palaces svg text, .nightMode #notationContainer.Ivory_Palaces svg .abcjs-tempo.abcjs-l0.abcjs-m0.abcjs-v0 { fill:#A1A1A1 !important; }
	#notationContainer.Seek_Ye_First svg .abcjs-l4.abcjs-v0, #notationContainer.Seek_Ye_First svg .abcjs-l5.abcjs-v0, #notationContainer.Seek_Ye_First svg .abcjs-l6.abcjs-v0, #notationContainer.Seek_Ye_First svg .abcjs-l7.abcjs-v0 {	fill:red; } /* melody in red, but v0 changes more than we want */
	#notationContainer.Seek_Ye_First svg .abcjs-staff-extra, #notationContainer.Seek_Ye_First svg .abcjs-bar, #notationContainer.Seek_Ye_First svg .abcjs-annotation.abcjs-l4.abcjs-m0.abcjs-mm8.abcjs-v0 { fill:black !important; }


.bhb, .nbhb {
	margin-top:10px;
}
.authorSources {
	font-size: 80%;
	opacity: .8;
	padding-top:20px;
	margin-top:40px;
	border-top:1px #eee solid;
	margin-bottom:20px;
	text-indent: -36px; /* indent following lines */
    padding-left: 36px; /* indent following lines */
}

img.authorImg {
  float: right;
  max-width: 50% !important;
  margin:10px;
  border:2px solid #fff;  
  -moz-box-shadow: 5px 5px 5px #ccc;
  -webkit-box-shadow: 5px 5px 5px #ccc;
  box-shadow: 5px 5px 5px #ccc;
  -moz-border-radius:25px;
  -webkit-border-radius:15px;
  border-radius:15px;
  clear:both;
}
img.authorImgHeader {
	max-height:200px;
}
.author a {
    position:relative;
}    
#bottomText .author a:last-of-type:after { /* i icon */
    content: "\f05a";
    font-family: "Font Awesome 5 Free";
    /*position:absolute;*/
    top:0;
	margin-left:5px;
	font-weight:900;
	font-style:normal;
 }
 
.bioinitials {
	font-size:80%;
	text-align:right;
	margin-bottom:15px;
}

#companionText h1 {
	text-transform: uppercase;
}
#hymnbooks_drawer i, #views_drawer i { /* hide information link in menu */
	display:none;
}

#welcomeMessage .fa-music.fa-border, #welcomeMessage .fa-eye.fa-border  {
	border-radius:.2em;
	border-color:black;
	margin:0;
}
#meterMessage {
	display:inline-block;
}
#searchOptions.numbersOnly #searchLyricsCheckbox, #searchOptions.numbersOnly #searchTuneTextCheckbox, #searchOptions.numbersOnly #searchTopTextCheckbox, #searchOptions.numbersOnly #searchBottomTextCheckbox, #searchOptions.numbersOnly #meterMessage {
	opacity: .5;
	filter:alpha(opacity=50);
}
	
/* ********** NOTES FOR ABCJS CLASSES   https://paulrosen.github.io/abcjs/visual/classes.html#found-classes  https://configurator.abcjs.net/classes *********** */
	/*  ************ CHANGES FOR SPECIFIC HYMNS ******************* */
		body[data-hymnal='BHB.txt'] #notationContainer.Whither_Pilgrims svg .abcjs-l6, body[data-hymnal='BHB.txt'] #notationContainer.Whither_Pilgrims svg .abcjs-l7, body[data-hymnal='BHB_new.txt'] #insertNotationHereABC270 svg .abcjs-l6, body[data-hymnal='BHB_new.txt'] #insertNotationHereABC270 svg .abcjs-l7 { /* Whither, Pilgrims optional last two lines make lighter */
			opacity:0.7;
			filter:alpha(opacity=70);
		}
		.abcjs-annotation { /* this doesn't work... */
			opacity:1 !important;
			filter:alpha(opacity=100) !important;
		}
		 #notationContainer.Llanelly_Roberts .abcjs-triplet.abcjs-v1, #notationContainer.Llanelly_Roberts .abcjs-triplet.abcjs-v3 {
			display:none;
		 }
		 #notationContainer.What_a_Day_That_Will_Be .abcjs-triplet.abcjs-v1, #notationContainer.What_a_Day_That_Will_Be .abcjs-triplet.abcjs-v3 {
			display:none;
		 }
		 #notationContainer.Ammanford .abcjs-v2.abcjs-note.abcjs-d0-375 { /* dotted quarter in tenor */
			 transform:translateX(10px);
		 }
		 
		#notationContainer.Ammanford .abcjs-v3.abcjs-d0-125 path[data-name="scripts.dfermata"] { /* eighth notes, bass, with fermata */
			transform:translateY(20px);
		}
		#notationContainer.batchellor .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.batchellor .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.batchellor .abcjs-v1.abcjs-n1 path[data-name="accidentals.dblsharp"] { /* bottom natural sign shift left */
			transform:translateX(-8px);
		}
		#notationContainer.Beautiful_Home .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Christ_Arose .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.A_Soldier_of_the_Cross .abcjs-v2.abcjs-rest { /* move rests down in 2nd voice */
			transform:translateY(15px);
		}
		#notationContainer.Calvary .abcjs-v1.abcjs-rest path[data-name="rests.8th"], #notationContainer.Calvary .abcjs-v1.abcjs-rest path[data-name="dots.dot"] { /* move rests down in 2nd voice */
			transform:translateY(15px);
		}
		#notationContainer.Calvary .abcjs-v2.abcjs-rest, #notationContainer.Calvary .abcjs-v2.abcjs-rest { /* move rests down in 2nd voice */
			transform:translateY(-10px);
		}
		#notationContainer.Constance .abcjs-v1.abcjs-note path[data-name="accidentals.sharp"]{ /* shift sharps left */
			transform:translateX(-7px);
		}
		#notationContainer.Crowning_Day .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Crowning_Day .abcjs-v1.abcjs-n1 path[data-name="accidentals.dblsharp"],#notationContainer.Crowning_Day .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"]{ /* shift sharps left */
			transform:translateX(-8px);
		}
		#notationContainer.Diadem .abcjs-v3.abcjs-slur {
			transform:translateY(25px);
		}
		#notationContainer.Dura .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Dura .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Dura .abcjs-v1.abcjs-n1 path[data-name="accidentals.flat"]{ /* shift sharps & naturals left */
			transform:translateX(-9px);
		}
		#notationContainer.Erie .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Erie .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Erie .abcjs-v1.abcjs-n1 path[data-name="accidentals.flat"]{ /* shift sharps & naturals left */
			transform:translateX(-9px);
		}
		#notationContainer.Epaphroditus .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Everybody_Ought_to_Know .abcjs-v2.abcjs-rest path[data-name="rests.half"], #notationContainer.Everybody_Ought_to_Know .abcjs-v2.abcjs-rest path[data-name="dots.dot"] { /* move rests down in 2nd voice */
			transform:translateY(15px);
		}
		#notationContainer.Eton .abcjs-v1.abcjs-n1[data-index="90"] path[data-name="accidentals.nat"],#notationContainer.Eton .abcjs-v1.abcjs-n1[data-index="90"] path[data-name="accidentals.sharp"],#notationContainer.Eton .abcjs-v1.abcjs-n1[data-index="90"] path[data-name="accidentals.flat"], #notationContainer.Eton .abcjs-v1.abcjs-n1[data-index="106"] path[data-name="accidentals.nat"],#notationContainer.Eton .abcjs-v1.abcjs-n1[data-index="106"] path[data-name="accidentals.sharp"],#notationContainer.Eton .abcjs-v1.abcjs-n1[data-index="106"] path[data-name="accidentals.flat"]{ /* shift sharps & naturals left */
			transform:translateX(-9px);
		}
		/* #notationContainer.Everybody_Ought_to_Know .abcjs-v1.abcjs-rest.abcjs-n0 path[data-name="rests.quarter"]{
			transform:translateY(10px);
		}*/
		#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm9 path[data-name="accidentals.nat"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm9 path[data-name="accidentals.sharp"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm9 path[data-name="accidentals.flat"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm10 path[data-name="accidentals.nat"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm10 path[data-name="accidentals.sharp"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm10 path[data-name="accidentals.flat"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm2 path[data-name="accidentals.nat"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm2 path[data-name="accidentals.sharp"],#notationContainer.Fishers_of_Men .abcjs-v1.abcjs-mm2 path[data-name="accidentals.flat"]{ /* shift sharps & naturals left */
			transform:translateX(-9px);
		}
		#notationContainer.Go_Tell_It .abcjs-annotation { transform: translate(0, 15px); }
		#Pilotabc  .starterABCfile  { overflow:visible !important; margin-top: -30px; }
		#notationContainer.Give_Me_a_Sight_O_Saviour .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.God_Be_With_You .abcjs-v3.abcjs-n0   path[data-name="scripts.dfermata"]{
			transform:translateY(23px);
		}
		#notationContainer.For_God_So_Loved_the_World_Townsend .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.For_Me_Long .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.God_Be_With_You .abcjs-v3.abcjs-n3 path[data-name="scripts.dfermata"] {
			transform:translateY(23px);
		}
		#notationContainer.God_is_Calling_the_Prodigal .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Hannah .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Heaven .abcjs-rest.abcjs-v2 {
			transform:translateY(15px);
		}
		#notationContainer.Heaven_Came_Down .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.He_Giveth_More_Grace .abcjs-v3 path[data-name="scripts.dfermata"], #notationContainer.He_Giveth_More_Grace_GHB2001294 .abcjs-v3 path[data-name="scripts.dfermata"], #notationContainer.He_Giveth_More_Grace_NBHB162 .abcjs-v3 path[data-name="scripts.dfermata"]{
			transform:translateY(23px);
		}
		#notationContainer.He_Lifted_Me .abcjs-v3.abcjs-n1   path[data-name="scripts.dfermata"]{
			transform:translateY(23px);
		}
		#notationContainer.Hold_Thou_My_Hand .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Hold_Thou_My_Hand .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"]{ /* shift sharps & naturals left */
			transform:translateX(-9px);
		}
		#notationContainer.Hudson_BHB006 .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_BHB006 .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_BHB006 .abcjs-v1 path[data-name="accidentals.flat"],
		#notationContainer.Hudson_CHB031 .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_CHB031 .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_CHB031 .abcjs-v1 path[data-name="accidentals.flat"],
		#notationContainer.Hudson_CHB099 .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_CHB099 .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_CHB099 .abcjs-v1 path[data-name="accidentals.flat"],
		#notationContainer.Hudson_GHB89167 .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_GHB89167 .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_GHB89167 .abcjs-v1 path[data-name="accidentals.flat"],
		#notationContainer.Hudson_GHB2001170 .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_GHB2001170 .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_GHB2001170 .abcjs-v1 path[data-name="accidentals.flat"],
		#notationContainer.Hudson_GHB2001278 .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_GHB2001278 .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_GHB2001278 .abcjs-v1 path[data-name="accidentals.flat"],
		#notationContainer.Hudson_NBHB230 .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_NBHB230 .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_NBHB230 .abcjs-v1 path[data-name="accidentals.flat"],
		#notationContainer.Hudson_no_words .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Hudson_no_words .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Hudson_no_words .abcjs-v1 path[data-name="accidentals.flat"]
		{
			transform:translateX(-7px);
		}
		#notationContainer.I_Met_Jesus_at_the_Crossroads .abcjs-v1.abcjs-triplet,#notationContainer.I_Met_Jesus_at_the_Crossroads .abcjs-v3.abcjs-triplet {
			display:none;
		}
		#notationContainer.I_Am_Redeemed .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.I_Know_Hes_Mine .abcjs-rest.abcjs-v2 {
			transform:translateY(15px);
		}
		#notationContainer.I_Know_Hes_Mine .abcjs-rest.abcjs-v1 {
			transform:translateY(5px);
		}
		#notationContainer.I_Know_Who_Holds_the_Future .abcjs-v1[data-index="317"] path[data-name="accidentals.nat"],#notationContainer.I_Know_Who_Holds_the_Future .abcjs-v1[data-index="317"] path[data-name="accidentals.sharp"],#notationContainer.I_Know_Who_Holds_the_Future .abcjs-v1[data-index="317"] path[data-name="accidentals.flat"], #notationContainer.I_Know_Who_Holds_the_Future .abcjs-v1[data-index="301"] path[data-name="accidentals.nat"],#notationContainer.I_Know_Who_Holds_the_Future .abcjs-v1[data-index="301"] path[data-name="accidentals.sharp"],#notationContainer.I_Know_Who_Holds_the_Future .abcjs-v1[data-index="301"] path[data-name="accidentals.flat"]{ /* shift sharps & naturals left */
			transform:translateX(-9px);
		}
		#notationContainer.I_Shall_Know_Him .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.I_Will_McGranahan .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.I_Will_Pass_Over_You .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Im_Redeemed .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Im_Redeemed .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Im_Redeemed .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Im_Redeemed .abcjs-v1 path[data-name="accidentals.flat"]
		{
			transform:translateX(-7px);
		}
		#notationContainer.in_memoriam_maker .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.in_memoriam_maker .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.in_memoriam_maker .abcjs-v1 path[data-name="accidentals.flat"]
		{
			transform:translateX(-9px);
		}
		#notationContainer.Ivory_Palaces .abcjs-v0.abcjs-p3 path[data-name="accidentals.nat"],#notationContainer.Ivory_Palaces .abcjs-v0.abcjs-p3 path[data-name="accidentals.sharp"],#notationContainer.Ivory_Palaces .abcjs-v0.abcjs-p3 path[data-name="accidentals.flat"]
		{
			transform:translateX(-9px);
		}
		#notationContainer.Jesus_Gave_Her_Water .abcjs-v1.abcjs-n2 path[data-name="accidentals.nat"],#notationContainer.Jesus_Gave_Her_Water .abcjs-v1.abcjs-n2 path[data-name="accidentals.sharp"],#notationContainer.Jesus_Gave_Her_Water .abcjs-v1.abcjs-n2 path[data-name="accidentals.flat"] {
			transform:translateX(-4px);
		}
		#notationContainer.Jesus_I_Come .abcjs-v1.abcjs-p-1 path[data-name="accidentals.nat"],#notationContainer.Jesus_I_Come .abcjs-v1.abcjs-p-1 path[data-name="accidentals.sharp"],#notationContainer.Jesus_I_Come .abcjs-v1.abcjs-p-1 path[data-name="accidentals.flat"] {
			transform:translateX(-8px);
		}
		#notationContainer.Jesus_Is_Mighty_to_Save .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Jesus_Is_Mighty_to_Save .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Jesus_Is_Mighty_to_Save .abcjs-v1.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-8px);
		}
		#notationContainer.Let_the_Blessed_Savior_In .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Llanelly_Roberts .abcjs-v1.abcjs-triplet,#notationContainer.Llanelly_Roberts .abcjs-v3.abcjs-triplet {
			display:none;
		}
		#notationContainer.Love_Love_L-O-V-E .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Love_Love_L-O-V-E .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Love_Love_L-O-V-E .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-8px);
		}
		#notationContainer.Love_Love_L-O-V-E .abcjs-v1.abcjs-mm6 path[data-name="accidentals.nat"],#notationContainer.Love_Love_L-O-V-E .abcjs-v1.abcjs-mm6 path[data-name="accidentals.sharp"],#notationContainer.Love_Love_L-O-V-E .abcjs-v1.abcjs-mm6 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.Love_Me .abcjs-v1.abcjs-mm13 path[data-name="accidentals.nat"],#notationContainer.Love_Me .abcjs-v1.abcjs-mm13 path[data-name="accidentals.sharp"],#notationContainer.Love_Me .abcjs-v1.abcjs-mm13 path[data-name="accidentals.flat"] {
			transform:translateX(-8px);
		}
		#notationContainer.Love_Me .abcjs-v3.abcjs-mm8 path[data-name="accidentals.nat"],#notationContainer.Love_Me .abcjs-v3.abcjs-mm8 path[data-name="accidentals.sharp"],#notationContainer.Love_Me .abcjs-v3.abcjs-mm8 path[data-name="accidentals.flat"] {
			transform:translateX(-8px);
		}
		#notationContainer.Lux_Eoi .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Lux_Eoi .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Lux_Eoi .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Lyngham .abcjs-rest, #notationContainer.Lyngham-orig .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Zhejiang .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Miles_Lane .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Nettleton .abcjs-annotation {
			transform:translateY(5px);
		}
		#notationContainer.Memories .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Memories .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Memories .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Neumeister .abcjs-rest, #notationContainer.Neumeister_CHB098 .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Not_Now_My_Child .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Not_Now_My_Child .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Not_Now_My_Child .abcjs-v1.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.O_Wonderful_Wonderful_Story .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.O_Wonderful_Wonderful_Story .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.O_Wonderful_Wonderful_Story .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Once_For_All .abcjs-v1.abcjs-mm3 path[data-name="accidentals.nat"],#notationContainer.Once_For_All .abcjs-v1.abcjs-mm3 path[data-name="accidentals.sharp"],#notationContainer.Once_For_All .abcjs-v1.abcjs-mm3 path[data-name="accidentals.flat"],#notationContainer.Once_For_All .abcjs-v1.abcjs-mm2 path[data-name="accidentals.nat"],#notationContainer.Once_For_All .abcjs-v1.abcjs-mm2 path[data-name="accidentals.sharp"],#notationContainer.Once_For_All .abcjs-v1.abcjs-mm2 path[data-name="accidentals.flat"] {
			transform:translateX(-5px);
		}
		#notationContainer.Orlington .abcjs-rest, #notationContainer.Orlington_BHB087 .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Pilot .abcjs-triplet.abcjs-v1, #notationContainer.Pilot .abcjs-triplet.abcjs-v3 {
			display:none;
		}
		#notationContainer.Power_in_the_Blood .abcjs-rest, #notationContainer.Power_in_the_Blood_CHB140 .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Precious_Name_GHB89095 .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.refuge .abcjs-v1.abcjs-n2 path[data-name="accidentals.nat"],#notationContainer.refuge .abcjs-v1.abcjs-n2 path[data-name="accidentals.sharp"],#notationContainer.refuge .abcjs-v1.abcjs-n2 path[data-name="accidentals.flat"], #notationContainer.refuge .abcjs-v1.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.refuge .abcjs-v1.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.refuge .abcjs-v1.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-7px);
		}
		#notationContainer.Reproach .abcjs-v1.abcjs-mm18.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Reproach .abcjs-v1.abcjs-mm18.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Reproach .abcjs-v1.abcjs-mm18.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Roll_Call .abcjs-rest, #notationContainer.Roll_Call_CHB133 .abcjs-rest, #notationContainer.Roll_Call_GHB89194 .abcjs-rest{
			transform:translateY(15px);
		}
		#notationContainer.Room_for_Thee .abcjs-v3.abcjs-n0   path[data-name="scripts.dfermata"]{
			transform:translateY(17px);
		}
		#notationContainer.Sagina .abcjs-rest.abcjs-v2, #notationContainer.Sagina_2 .abcjs-rest.abcjs-v2 {
			transform:translateY(15px);
		}
		#notationContainer.Seeds_of_Promise .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Seeking_the_Lost .abcjs-rest {
			transform:translateY(-15px);
		}
		#notationContainer.Seeking_the_Lost .abcjs-v1.abcjs-mm0.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Seeking_the_Lost .abcjs-v1.abcjs-mm0.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Seeking_the_Lost .abcjs-v1.abcjs-mm0.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-4px);
		}
		#notationContainer.Send_the_Light .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Sweet_Bye_and_Bye .abcjs-rest, #notationContainer.Sweet_Bye_and_Bye_BHB78 .abcjs-rest, #notationContainer.Sweet_Bye_and_Bye_CHB114 .abcjs-rest, #notationContainer.Sweet_Bye_and_Bye_GHB2001384 .abcjs-rest, #notationContainer.Sweet_Bye_and_Bye_Gospel .abcjs-rest, #notationContainer.Sweet_Bye_and_Bye_NW .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.St_Christopher .abcjs-v1.abcjs-mm1 path[data-name="accidentals.nat"],#notationContainer.St_Christopher .abcjs-v1.abcjs-mm1 path[data-name="accidentals.sharp"],#notationContainer.St_Christopher .abcjs-v1.abcjs-mm1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.St_Georges_Edinburgh .abcjs-rest.abcjs-v1 {
			transform:translateY(-15px);
		}
		#notationContainer.St_Georges_Edinburgh .abcjs-rest.abcjs-v2 {
			transform:translateY(15px);
		}
		#notationContainer.St_Hilda_Barnby .abcjs-v1.abcjs-mm8.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.St_Hilda_Barnby .abcjs-v1.abcjs-mm8.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.St_Hilda_Barnby .abcjs-v1.abcjs-mm8.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Staincliffe .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Staincliffe .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Staincliffe .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Take_the_Name_of_Jesus_With_You .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.The_Bright_Forevermore .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.The_Gospel_Bells .abcjs-rest, #notationContainer.The_Gospel_Bells_CHB106 .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.The_Half_was_Never_Told .abcjs-v1.abcjs-mm10 path[data-name="accidentals.nat"],#notationContainer.The_Half_was_Never_Told .abcjs-v1.abcjs-mm10 path[data-name="accidentals.sharp"],#notationContainer.The_Half_was_Never_Told .abcjs-v1.abcjs-mm10 path[data-name="accidentals.flat"],#notationContainer.The_Half_was_Never_Told .abcjs-v1.abcjs-mm8 path[data-name="accidentals.nat"],#notationContainer.The_Half_was_Never_Told .abcjs-v1.abcjs-mm8 path[data-name="accidentals.sharp"],#notationContainer.The_Half_was_Never_Told .abcjs-v1.abcjs-mm8 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.The_Hem_of_His_Garment .abcjs-v3   path[data-name="scripts.dfermata"]{
			transform:translateY(17px);
		}
		#notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm2.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm2.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm2.abcjs-n1 path[data-name="accidentals.flat"], #notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm8.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm8.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm8.abcjs-n1 path[data-name="accidentals.flat"], #notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm7.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm7.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.The_Hem_of_His_Garment .abcjs-v1.abcjs-mm7.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.The_Name_of_Jesus .abcjs-v1.abcjs-mm2 path[data-name="accidentals.nat"],#notationContainer.The_Name_of_Jesus .abcjs-v1.abcjs-mm2 path[data-name="accidentals.sharp"],#notationContainer.The_Name_of_Jesus .abcjs-v1.abcjs-mm2 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm1 path[data-name="accidentals.nat"],#notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm1 path[data-name="accidentals.sharp"],#notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm1 path[data-name="accidentals.flat"], #notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm9 path[data-name="accidentals.nat"],#notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm9 path[data-name="accidentals.sharp"],#notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm9 path[data-name="accidentals.flat"], #notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm6 path[data-name="accidentals.nat"],#notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm6 path[data-name="accidentals.sharp"],#notationContainer.The_Old_Rugged_Cross .abcjs-v1.abcjs-mm6 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.The_Prodigals_Return .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.The_Prodigals_Return .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.The_Prodigals_Return .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.The_Very_Same_Jesus .abcjs-v3   path[data-name="scripts.dfermata"]{
			transform:translateY(17px);
		}
		#notationContainer.The_Wise_Man_and_the_Foolish_Man .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.The_Wonderful_Story .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.They_Crucified_Him .abcjs-v3   path[data-name="scripts.dfermata"]{
			transform:translateY(17px);
		}
		#notationContainer.Thompson .abcjs-v1.abcjs-mm11.abcjs-n5 path[data-name="accidentals.nat"],#notationContainer.Thompson .abcjs-v1.abcjs-mm11.abcjs-n5 path[data-name="accidentals.sharp"],#notationContainer.Thompson .abcjs-v1.abcjs-mm11.abcjs-n5 path[data-name="accidentals.flat"] {
			transform:translateX(-7px);
		}
		#notationContainer.Toiling_On .abcjs-v1.abcjs-n2 path[data-name="accidentals.nat"],#notationContainer.Toiling_On .abcjs-v1.abcjs-n2 path[data-name="accidentals.sharp"],#notationContainer.Toiling_On .abcjs-v1.abcjs-n2 path[data-name="accidentals.flat"] {
			transform:translateX(-5px);
		}
		#notationContainer.Toiling_On .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Tranquility_No_Refrain .abcjs-v1.abcjs-n2 path[data-name="accidentals.nat"],#notationContainer.Tranquility_No_Refrain .abcjs-v1.abcjs-n2 path[data-name="accidentals.sharp"],#notationContainer.Tranquility_No_Refrain .abcjs-v1.abcjs-n2 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}	
		#notationContainer.Tranquillity .abcjs-v1.abcjs-n2 path[data-name="accidentals.nat"],#notationContainer.Tranquillity .abcjs-v1.abcjs-n2 path[data-name="accidentals.sharp"],#notationContainer.Tranquillity .abcjs-v1.abcjs-n2 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}	
		 #notationContainer.Trim_Your_Lamps .abcjs-triplet.abcjs-v3 {
			display:none;
		 }
		#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm9.abcjs-n0 path[data-name="accidentals.nat"],#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm9.abcjs-n0 path[data-name="accidentals.sharp"],#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm9.abcjs-n0 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm8.abcjs-n0 path[data-name="accidentals.nat"],#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm8.abcjs-n0 path[data-name="accidentals.sharp"],#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm8.abcjs-n0 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm7 path[data-name="accidentals.nat"],#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm7 path[data-name="accidentals.sharp"],#notationContainer.Vater_Unser .abcjs-v3.abcjs-mm7 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Venit .abcjs-v1.abcjs-mm5 path[data-name="accidentals.nat"],#notationContainer.Venit .abcjs-v1.abcjs-mm5 path[data-name="accidentals.sharp"],#notationContainer.Venit .abcjs-v1.abcjs-mm5 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}	
		#notationContainer.Veronica .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Veronica .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Veronica .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}	
		#notationContainer.Ville_de_Havre .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Washed_in_the_Blood .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.What_Did_He_Do .abcjs-rest.abcjs-v1 {
			transform:translateY(-15px);
		}
		#notationContainer.What_Did_He_Do .abcjs-rest.abcjs-v2 {
			transform:translateY(15px);
		}
		#notationContainer.What_Must_it_Be_to_Be_There .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm12.abcjs-n4 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm12.abcjs-n4 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm12.abcjs-n4 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm18 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm18 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm18 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm26 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm26 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm26 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm28.abcjs-n4 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm28.abcjs-n4 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm28.abcjs-n4 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm11.abcjs-n4 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm11.abcjs-n4 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm11.abcjs-n4 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm17.abcjs-n4 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm17.abcjs-n4 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm17.abcjs-n4 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm25.abcjs-n2 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm25.abcjs-n2 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm25.abcjs-n2 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm27.abcjs-n4 path[data-name="accidentals.nat"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm27.abcjs-n4 path[data-name="accidentals.sharp"],#notationContainer.What_Shall_the_Harvest_Be .abcjs-v1.abcjs-mm27.abcjs-n4 path[data-name="accidentals.flat"] {
			transform:translateX(0px);
		}
		#notationContainer.When_I_See_the_Blood .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.When_the_Harvest_Is_Past .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.Wounded_for_Me .abcjs-v1.abcjs-mm0.abcjs-n1 path[data-name="accidentals.nat"],#notationContainer.Wounded_for_Me .abcjs-v1.abcjs-mm0.abcjs-n1 path[data-name="accidentals.sharp"],#notationContainer.Wounded_for_Me .abcjs-v1.abcjs-mm0.abcjs-n1 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Wreford .abcjs-v1.abcjs-mm3.abcjs-n0 path[data-name="accidentals.nat"],#notationContainer.Wreford .abcjs-v1.abcjs-mm3.abcjs-n0 path[data-name="accidentals.sharp"],#notationContainer.Wreford .abcjs-v1.abcjs-mm3.abcjs-n0 path[data-name="accidentals.flat"],#notationContainer.Wreford .abcjs-v1.abcjs-mm2.abcjs-n3 path[data-name="accidentals.nat"],#notationContainer.Wreford .abcjs-v1.abcjs-mm2.abcjs-n3 path[data-name="accidentals.sharp"],#notationContainer.Wreford .abcjs-v1.abcjs-mm2.abcjs-n3 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.Ye_Must_Be_Born_Again .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Ye_Must_Be_Born_Again .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Ye_Must_Be_Born_Again .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-7px);
		}
		#notationContainer.Yet_There_Is_Room .abcjs-v1 path[data-name="accidentals.nat"],#notationContainer.Yet_There_Is_Room .abcjs-v1 path[data-name="accidentals.sharp"],#notationContainer.Yet_There_Is_Room .abcjs-v1 path[data-name="accidentals.flat"] {
			transform:translateX(-7px);
		}
		#notationContainer.Zhejiang .abcjs-rest {
			transform:translateY(15px);
		}
		#notationContainer.No_One_Ever_Cared_For_Me_Like_Jesus .abcjs-v1.abcjs-n5 path[data-name="accidentals.nat"],#notationContainer.No_One_Ever_Cared_For_Me_Like_Jesus .abcjs-v1.abcjs-n5 path[data-name="accidentals.sharp"],#notationContainer.No_One_Ever_Cared_For_Me_Like_Jesus .abcjs-v1.abcjs-n5 path[data-name="accidentals.flat"] {
			transform:translateX(-9px);
		}
		#notationContainer.you_raise_me_up .abcjs-rest {
			transform:translateY(-15px);
		}
		
		
		
		 
/*  ************* END SPECIAL HYMNS CSS **************  */
/* Option for moving notes: transform:translateX(10px); 
stroke:red;
stroke-width:1;
svg .abcjs-tempo
*/

/* 
	HYMNAL SPECIFIC MODIFICATIONS
	the hymnal localStoragePrefix1 is added to the body tag.
*/

body[data-hymnal='hmad.txt'] #meterMessage, body[data-hymnal='Himnos_del_evangelio-Himnos.txt'] #meterMessage, body[data-hymnal='Himnos_del_evangelio-Coros.txt'] #meterMessage, body[data-hymnal='himnariocristiano.txt'] #meterMessage, body[data-hymnal='HC_nueva_edicion.txt'] #meterMessage  {
	display:none; /* remove if don't have meter */
}

#bottomTextNotation .author { /* this is usually the lyrics not the notation */
	display:none;
}
#bottomText {
	text-align:center;
}

/* hide classes that don't pertain to the current BHB for author information */
	body[data-hymnal='BHB.txt'] .nbhb {
		display:none;
	}
	body[data-hymnal='BHB_new.txt'] .bhb {
		display:none;
	}

body[data-hymnal='BHB_new.txt'] #songContainer[data-songnumber='360']  #notationContainer.Adeste_Fideles .abcjs-annotation.abcjs-l4.abcjs-m0.abcjs-mm17.abcjs-v0 { /* remove line in hymn 360 NBHB Adeste Fideles tune */
	display:none;
}

/* composer link */
#added_composer {
	color:black;
}
body[data-hymnal='BHB_new.txt'] a #added_composer, body[data-hymnal='BHB.txt'] a #added_composer {
	color:#004670;
}

/* author above sheet music doesn't work well with this hymnal. It is displayed below sheet music. */
body[data-hymnal='Gospel_Hymns.txt'] a #added_composer, body[data-hymnal='Gospel_Hymns_NBHB.txt'] a #added_composer, body[data-hymnal='Gospel_Hymns_Premium.txt'] a #added_composer {
	display:none;
}


/* COPYRIGHTS */
/*	.How_Deep_the_Fathers_Love_For_Us, #HowDeeptheFathersLoveForUsabc, .Before_the_Throne_of_God_Above, #BeforetheThroneofGodAboveabc, .In_Christ_Alone, #InChristAloneabc, .All_That_Thrills_My_Soul_is_Jesus, #AllThatThrillsMySoulisJesusabc {
		display:none;
	}
	body[data-hymnal='BHB_new.txt'] #HowDeeptheFathersLoveForUsabc, body[data-hymnal='BHB_new.txt'] #BeforetheThroneofGodAboveabc, body[data-hymnal='BHB_new.txt'] #InChristAloneabc, body[data-hymnal='BHB_new.txt'] #AllThatThrillsMySoulisJesusabc {
		display:block;
	}
	body[data-hymnal='BHB_new.txt'] .How_Deep_the_Fathers_Love_For_Us, body[data-hymnal='BHB_new.txt'] .Before_the_Throne_of_God_Above, body[data-hymnal='BHB_new.txt'] .In_Christ_Alone, body[data-hymnal='BHB_new.txt'] .All_That_Thrills_My_Soul_is_Jesus {
		display:table-row;
	}
*/
/* use these classes to designate to only show them for that app */
.BHBMus_app_only, .bhb_app_only, .BeforetheThroneofGodAboveabc, .InChristAloneabc, .HowDeeptheFathersLoveForUsabc, .AllThatThrillsMySoulisJesusabc {
	display:none;
}
body.BHBMus_app .BHBMus_app_only, body.BHBMus_app .BeforetheThroneofGodAboveabc, body.BHBMus_app .InChristAloneabc, body.BHBMus_app .HowDeeptheFathersLoveForUsabc, body.BHBMus_app .AllThatThrillsMySoulisJesusabc {
	display:revert;
}
body.bhb_app .bhb_app_only {
	display:revert;
}

/* use these classes to designate to only show them for that hymnal */
.bhb, .nbhb, .gospelHymns, .favHymns, .favHymnsPremium, .ghb1989, .ghb2001, .himnarioCristiano, .himnosDelEvangelio, .childrens, .childrensPremium, .UKGHB_1996, .UKGHB_1897, .hmad, .oldGospel, .sss, .seed { /* hide all info divs and then unhide the one we want to see */
	display:none;
}
body[data-hymnal='BHB.txt'] .bhb {
	display:initial;
}
body[data-hymnal='BHB.txt'] ul.bhb, body[data-hymnal='BHB.txt'] li.bhb {
	display:block;
}
body[data-hymnal='BHB_new.txt'] .nbhb {
	display:initial;
}
body[data-hymnal='BHB.txt'] ul.nbhb, body[data-hymnal='BHB.txt'] li.nbhb {
	display:block;
}
body[data-hymnal='BHB_new.txt'] .hideForNBHB  {
	 display:none;
}
body[data-hymnal='Gospel_Hymns.txt'] .gospelHymns {
	display:initial;
}
body[data-hymnal='Old_Gospel_premium.txt'] .oldGospel, body[data-hymnal='Old_Gospel.txt'] .oldGospel {
	display:initial;
}
body[data-hymnal='favoritehymns.txt'] .favHymns {
	display:initial;
}
body[data-hymnal='favoritehymns.txt'] ul.favHymns, body[data-hymnal='favoritehymns.txt'] li.favHymns {
	display:block;
}
body[data-hymnal='favoritehymns.txt'] .hideForFav  {
	 display:none;
}
body[data-hymnal='favoritehymnsPremium.txt'] .favHymnsPremium {
	display:initial;
}
body[data-hymnal='2001_GHB_Premium.txt'] .favHymnsPremium {
	display:initial;
}
body[data-hymnal='favoritehymnsPremium.txt'] ul.favHymnsPremium, body[data-hymnal='favoritehymnsPremium.txt'] li.favHymnsPremium {
	display:block;
}
body[data-hymnal='favoritehymnsPremium.txt'] .hideForFavPremium  {
	 display:none;
}
body[data-hymnal='1989_GHB.txt'] .ghb1989, body[data-hymnal='2001_GHB.txt'] .ghb2001, body[data-hymnal='2001_GHB_Premium_NBHB.txt'] .ghb2001 {
	display:initial;
}
body[data-hymnal='himnariocristiano.txt'] .himnarioCristiano, body[data-hymnal='HC_nueva_edicion.txt'] .himnarioCristiano {
	display:initial;
}
body[data-hymnal='Himnos_del_evangelio-Himnos.txt'] .himnosDelEvangelio, body[data-hymnal='Himnos_del_evangelio-Coros.txt'] .himnosDelEvangelio {
	display:initial;
}
body[data-hymnal='hmad.txt'] .hmad {
	display:initial;
}
body[data-hymnal='childrens.txt'] .childrens, body[data-hymnal='childrensPremium.txt'] .childrensPremium {
	display:initial;
}
body[data-hymnal='UKGHB-1996.txt'] .UKGHB_1996, body[data-hymnal='UKGHB-1996-premium_NBHB.txt'] .UKGHB_1996, body[data-hymnal='UK-gospel-hb_1897.txt'] .UKGHB_1897 {
	display:initial;
}
body[data-hymnal='hmad.txt'] .hideForHMAD {
	 display:none;
}
body[data-hymnal='himnariocristiano.txt'] .hideForHimnarioCristiano, body[data-hymnal='HC_nueva_edicion.txt'] .hideForHimnarioCristiano {
	display:none;
}
body[data-hymnal='Himnos_del_evangelio-Himnos.txt'] .hideForhimnosDelEvangelio, body[data-hymnal='Himnos_del_evangelio-Coros.txt'] .hideForhimnosDelEvangelio {
	display:none;
}
body[data-hymnal='hmad.txt'] .songPart.hideMe {  /* for hmad, we want to see the lyrics under the music */
	display:block !important;
}
body[data-hymnal='sacred_songs_solos.txt'] .sss {
	display:initial;
}
body[data-hymnal='SS2_premium.txt'] .seed {
	display:initial;
}
body[data-hymnal='SS2_online.txt'] .seed {
	display:initial;
}

#hmadPreface img {
	width:100%;
	max-width:800px !important;
}

/* 	END MODIFICATIONS 	*/