body 			{	background-color: lightyellow;
					color:  black;
					font-size: 100%;
					margin: 0;
					padding: 0;							}
.MenuBar		{	font-family: 'Roboto Condensed';
					font-size: 0.9vw;
					text-align: center;
					background-color: brown;
					color: white;
					line-height: 1.2;
					margin: 0;
					padding: 0;
					padding-bottom: 0.5vw;				}
.row 			{	background-color: lightyellow;
					margin: 0 auto;
					padding: 0;
					position: relative;
					width: 100%;						}
.divtop 		{	background-color: orange;
					height: 8.8vw;
					margin: 0 auto;
					padding: 0;
					position: absolute;
					top: 0;
					width: 100%;
					z-index: 0;							}
.divbottom 		{	background-color: lightorange;
					height: calc(100% - 8.8vw);
					margin: 0 auto;
					overflow: auto;
					padding: 0;
					position: absolute;
					top: 8.8vw;
					width: 100%;
					z-index: -99;						}
.divYTT			{	background-color: orange;
					height: 4vw;
					margin: 0 auto;
					padding: 0;
					position: absolute;
					top: 0;
					width: 100%;
					z-index: 0;							}
.divYTB 		{	background-color: lightorange;
					height: calc(100% - 4vw);
					margin: 0 auto;
					overflow: auto;
					padding: 0;
					position: absolute;
					top: 4vw;
					width: 100%;
					z-index: -99;						}

@media screen and (max-width: 600px) {
  .column {
    width: 96%;
  }
}
.col-container	{	display: table;
					margin: 0 auto;
					padding-top: 2vh;
					width: 96%;							}
.col1-width		{	width: 40%;							}
.col2-hymn		{	width: 68%;							}
.col2-width		{	width: 80%;							}
.index-width	{	width: 80%;							}
.col			{	display: table-cell;
					padding-top: 1vh;
					width: 27%;							}
.col1			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 40%;							}
.col2			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 40%;							}
.col3			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 32%;							}
.col3A			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 28%;							}
.col3B			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 40%;							}
.col3C			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 28%;							}
.col3D			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 33%;							}
.col3E			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 30%;							}
.col3F			{	display: table-cell;
					padding: 2vh;
					padding-top: 0;
					vertical-align: top;
					width: 33%;							}
.col4			{	display: table-cell;
					padding: 1vh;
					padding-top: 0;
					vertical-align: top;
					width: 24%;							}
.box1			{	background-color: lavender;			}
audio			{	height: 4vh;
					margin: 0;
					padding-bottom: 1vh;
					padding-top: 0.2vw;
					width:100%;						}
.tblt			{	border: 0 solid black;
					width: 100%;					}
.soon 			{	background-color: lightgreen;
					margin-left: 10%;
					margin-top: 2vh;
					padding: 1vh;
					position: absolute;
					width: 38%;						}
.news 			{	background-color: lightgreen;
					margin-left: 52%;
					margin-top: 2vh;
					padding: 1vh;
					position: absolute;
					width: 38%;						}
.melody 		{	aspect-ratio: 16 / 9;
					border: 1px solid black;
					display: block;
					margin: 0 auto;
					margin-bottom: 1.5vw;
					margin-top: 1.5vw;
					width: 80%;						}
.youtube-video {	aspect-ratio: 16 / 9;
					background-color: lightyellow;
					display: block;
					margin: 0;
					padding-bottom: 0.8vw;
					padding-top: 0.2vw;
					width: 100%;					}
.low			{	margin-left: auto;
					margin-right: auto;
	 				width: 80vh;						}
.player			{	font-family: 'Roboto Condensed';
					font-size: 5vh;
					display: table;
					margin: 0 auto;
					margin-top: 3vh;
					padding: 0;							}
.selected		{	background-color: BlueViolet;
					color: white;
					font-size: 0.95vw;
					padding: 1 vw;
					cursor: pointer;					}
.notselected	{	background-color: lightyellow;
					color: BlueViolet;
					font-size: 0.95vw;
					margin: 1 vw;
					cursor: pointer;						}
h1				{	font-family: 'Roboto Condensed';
					font-size: 2.0vw;
					text-align: center;
					background-color: brown;
					color: yellow;
					line-height: 2;
					margin: 0;
					padding: 0;							}
h2				{	font-family: 'Roboto Condensed';
					font-size: 1.7vw;
					text-align: center;
					color: black;
					margin: 0.5vw;
					padding: 0;							}
h3				{	font-family: 'Roboto Condensed';
					font-size: 1.5vw;
					font-weight: bold;
					margin: 0;
					padding-top: 1.5vw;
					padding-bottom: 0.75vw;
					text-align: center;					}
h4				{	font-family: 'Roboto Condensed';
					font-size: 1.4vw;
					font-weight: bold;
					line-height: 1.2;
					margin-bottom: 0;
					margin-left: auto;
					margin-right: auto;
					margin-top: 0;
					padding-top: 1vh;
					padding-bottom: 0.5vh;
					text-align: left;
					width: 60%;							}
h4				{	font-family: 'Roboto Condensed';
					font-size: 1.4vw;
					font-weight: bold;
					margin: 0;
					padding-top: 1.5vw;
					padding-bottom: 0.75vw;
					text-align: left;					}
h5				{	font-family: 'Roboto Condensed';
					font-size: 2vw;
					font-weight: bold;
					line-height: 1.2;
					margin: 0;
					padding-top: 0vh;
					padding-bottom: 0.75vh;
					text-align: center;					}
h6				{	font-family: 'Roboto Condensed';
					font-size: 1.5vw;
					font-weight: bold;
					line-height: 1.2;
					margin-bottom: 0;
					margin-left: auto;
					margin-right: auto;
					margin-top: 0;
					padding-top: 1vh;
					padding-bottom: 1vh;
					text-align: center;					}
p				{	font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					text-align: left;
					line-height: 1.15;
					margin: 0;
					padding: 0;
					padding-bottom: 0.4vw; 				}
.ctr			{	text-align: center;					}
.info			{	margin-left: auto;
					margin-right: auto;
					width: 60%;							}
.Latin			{	font-size: 0.8vw;
					font-style: italic;
					padding: 0;
					padding-top: 0;
					text-align: center;					}
.poet			{	font-size: 0.8vw;
					font-style: normal;
					padding: 0;
					padding-bottom: 0.0.95vw;
					text-align: center;					}
.t				{	font-size: 0.8vw;					}
.title			{	padding: 0;
					padding-top: 0.95vw;
					text-align:center;					}
.HymnTitle		{	font-size: 1.5vw;
					font-weight: bold;
					margin: 0;
					padding: 0;
					text-align: left;					}
.meter			{	line-height: 1.15;
					margin: 0;
					padding: 0;
					padding-bottom: 0.25vw;
					padding-top: 0.5vw;
					text-align: left;					}
.place			{	font-weight: bold;
					line-height: 1.15;
					margin: 0;
					padding: 0;
					padding-bottom: 0.4vw;
					padding-top: 0.8vw;
					text-align: left;					}
.hymn			{	font-size: 0.95vw;
					padding: 0;
					padding-bottom: 0.4vw;
					text-align: left;					}
.hymn1			{	background-color: lavender;	
					font-size: 0.95vw;
					padding: 0;
					padding-bottom: 0.4vw;
					text-align: left;					}
.hymn2			{	background-color: gold;	
					font-size: 0.95vw;
					padding: 0;
					padding-bottom: 0.4vw;
					text-align: left;					}
.hymnL			{	font-size: 0.95vw;
					padding: 0;
					padding-bottom: 0.25vw;
					text-align: left;					}
.DO				{	font-size: 0.75vw;
					font-weight: normal;
					color: DarkGrey;					}
.about			{	font-size: 0.95vw;
					font-style: normal;
					line-height: 1.15;
					padding: 0;
					text-align: left;					}
.tune			{	font-size: 0.95vw;
					font-weight: bold;
					padding: 0;
					padding-top: 0.6vw;
					text-align: left;					}
.tunehymn		{	font-size: 0.95vw;
					font-style: normal;
					line-height: 1.15;
					padding: 0;
					padding-top: 0.4vw;
					text-align: left;					}
.source			{	font-weight: bold;
					padding: 0;
					padding-bottom: 0.4vw;
					padding-top: 0vw;
					text-align: left;					}
.detail			{	font-size: 0.95vw;
					font-style: normal;
					line-height: 1.15;
					padding: 0;
					padding-bottom: 0.4vw;
					text-align: left;					}
.brk			{	padding-top: 0.4vw;					}
.spc			{	padding-bottom: 0.4vw;				}
.top			{	padding-top: 0vw;					}
.choice			{	font-size: 0.95vw;
					font-style: normal;
					line-height: 1.15;
					padding: 0;
					padding-bottom: 0.7vw;
					text-align: center;					}
.hmnl			{	font-size: 0.8vw;
					font-weight: normal;				}
.gspl			{	background-color: brown;
					color: white;
					font-variant: small-caps;
					font-weight: bold;				}
.oz1			{	background-color: green;
					color: gold;
					font-weight: bold;				}
.oz2			{	background-color: gold;
					color: white;
					font-weight: bold;				}
.summary		{	font-size: 0.95vw;
					font-style: italic;
					line-height: 1.15;
					padding: 0;
					padding-bottom: 0.0.95vw;
					text-align: left;					}
ul				{	font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					text-align: left;
					line-height: 1.15;
					list-style-type: disc;
					margin: 0;
					padding: 0;
					padding-bottom: 0.2vw;
					padding-left: 1vw;					}
li				{	text-align: left;
					padding-bottom: 0.2vw;				}
table			{	border: 1px solid black;
					border-collapse: collapse;
					margin: 0;
					margin-left: auto;
					margin-right: auto;
					padding: 0;				}
td				{	border: 2px solid black;
					font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					margin: 0;
					padding: 0.0.95vw;
					padding-left: 0.5vw;
					padding-right: 0.5vw;
					text-align: left;
					vertical-align: middle;				}
.spcr			{	border-top: 0;
					border-bottom: 0;					}
.top			{	margin-top: 0;
					padding-top: 0;						}
.CellLeft		{	border: 0;
					padding-bottom: 0;
					text-align: left;					}
.CellRight		{	border: 0;
					padding-bottom: 0;
					text-align: right;					}
.Date			{	border: 0;
					font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					margin: 0;
					padding: 0vw;
					padding-bottom: 0.4vw;
					text-align: right;
					vertical-align: top;				}
.Liturgy		{	border: 0;
					font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					padding: 0vw;
					padding-bottom: 0.4vw;
					text-align: left;					}
.Hymnals		{	border: 0;
					font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					margin: 0;
					padding: 0vw;
					padding-bottom: 0.4vw;
					text-align: left;
					vertical-align: top;				}
.HymnalsSpc		{	border: 0;
					font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					font-weight: bold;
					margin: 0;
					padding: 0vw;
					padding-bottom: 0.4vw;
					padding-top: 0.8vw;
					text-align: left;
					vertical-align: top;				}
.HymnalsTop		{	border: 0;
					font-family: 'Roboto Condensed';
					font-size: 0.95vw;
					font-weight: bold;
					margin: 0;
					padding: 0vw;
					padding-bottom: 0.4vw;
					text-align: left;
					vertical-align: top;				}
.NoBorder		{	border: 0;
					padding-bottom: 0vw;
					text-align: left;					}
.NoBorderB		{	border: 0;
					padding-bottom: 0.5vw;
					text-align: left;					}
.abb			{	border: 0;
					padding-bottom: 0;
					padding-top: 0;						}
th				{	border: 2px solid black;
					font-family: 'Roboto Condensed';
					font-weight: bold;
					font-size: 2.0vh;
					padding: 0.2vh;
					text-align: center;
					vertical-align: middle;
					margin: 0;							}

.Menu			{	background-color: brown;
					margin:0;
					padding-bottom:0.5vh;		}
.Menu:link		{	color: white;				}
.Menu:visited	{	color: white;				}
.Menu:hover		{	color: pink;				}

a				{	text-decoration: none;		}

.Ext			{	color: red;	
					cursor: pointer;			}
.Ext:link		{	color: red;					}
.Ext:visited	{	color: red;					}
.Ext:hover		{	color: orange;				}

.Int			{	color: blue;	
					cursor: pointer;			}
.Int:link		{	color: blue;				}
.Int:visited	{	color: blue;				}
.Int:hover		{	color: cyan;				}

.Int2			{	color: BlueViolet;	
					cursor: pointer;			}
.Int2:link		{	color: BlueViolet;			}
.Int2:visited	{	color: BlueViolet;			}
.Int2:hover		{	color: cyan;				}

.Java			{	color: green;	
					cursor: pointer;
					padding-bottom: 0.4vw;		}

.Java:link		{	color: green;				}
.Java:visited	{	color: green;				}
.Java:hover		{	color: LightGreen;			}

.Show			{	background-color: #0d875d;	cursor: pointer;	margin:0;	padding-bottom: 0.4vh; padding-top: 0.1vh;	}
.Show:link		{	color: white;				}
.Show:hover		{	color: cyan;				}
.Show:visited	{	color: white;				}

.Dnld			{	background-color: blue;		margin:0;	padding-bottom: 0.4vh; padding-top: 0.1vh;	}
.Dnld:link		{	color: white;				}
.Dnld:hover		{	color: cyan;				}
.Dnld:visited	{	color: white;				}

.Tune			{	background-color: fuchsia;	margin:0;	padding-bottom: 0.4vh; padding-top: 0.1vh;	}
.Tune:link		{	color: white;				}
.Tune:hover		{	color: cyan;				}
.Tune:visited	{	color: white;				}

.Hmnl			{	font-size: 0.95vw;
					font-weight: normal;
					color: LightSeaGreen;
					cursor: text;				}
.Hmnl:link		{	color: LightSeaGreen;		}
.Hmnl:hover		{	color: LightSeaGreen;		}
.Hmnl:visited	{	color: LightSeaGreen;		}

.Rdng			{	color: red;					}

.Dtl			{	color: green;
					cursor: pointer;			}
.Dtl:link		{	color: green;				}
.Dtl:hover		{	color: green;				}
.Dtl:visited	{	color: green;				}