/*
accordiantitlesonglist  heading for songlist
aud				player
btnscroll    	btn sat bottom of each song table
buttontool 		buttons within toolbox
checkskip  		skip intro outro
currentartist  	currentsong  current artist and song 
currentby     	name of song BY 
divaud			audio player
divborder   	around toolbox
divborder3  	around song list tables

divbyartist   	around the 3 selects
divbysong	 	around the 3 selects
divbygenre	 	around the 3 selects

divmanual						around the manual

divtools  around the toolbox
divvid    video player

imgport  		img land retired
imgtablet

labskip			label for skip checkboxes
limanual		bullets for manual
list			section around the tables
manualclick		 manual buttons 
menu				for top menu but no section exists for it
navtable			td's in songtable
navtablegrab		td in songtable
pmanual				some headings in the manual block

portbtntext			portrait  but text is really an image

selectartist     	select
selectgenre			select
selectsong			select
selecttheme			select

selectop			option
selectthemeop		option

songid              the base 1 number of the song

tabdropdowns		around the artist song genre dropdowns
tablelinks			sections for song tables
tabletbtntext		the text is really an image

tabmanual			manual
tabmenuport			portrait
tabmenutablet		tablet

tabpref				preferences
tabtool				toolbox
tbtop				name of current song
tdadvancedtools		advanced tools buttons 
tdlabel		 		text to the left of the top 3 selects 

tdlink1				song table row
tdlink2				song table row
tdlink3				song table row

tdman1				manual instructions
tdman2				manual instructions
tdman3				manual instructions
tdman4				manual instructions

tdmarker			which song is playing

tdpref				theme and skip preferences
tdscroll			nav buttons at bottom of song tables
tdtop				table holding the top blocks
textarea			 memo in the toolbox 

thman1				manual instructions
thman2				manual instructions
thman3				manual instructions
thman4				manual instructions

tight

toolbutton			toolbox buttons
topheadingthis  	name of the song
ulmanual			some headings in the manual block
vid					video


*/

audio::-webkit-media-controls-play-button,
audio::-webkit-media-controls-panel {
	background-color: #fff;
	color: #ffffff;
	border: none;
	border-radius: 0px;
	margin: 0px;
	padding: 0px;
}

progress::-webkit-progress-bar {
	width: 80px;
	height: 12px;
	color: orange;
	background-color: midnightblue;
	border: 1px solid gray;
	margin-top: 1px;
	margin-bottom: 6px;
}


progress[value] {
	/* Reset the default appearance */
	-webkit-appearance: none;
	appearance: none;

	width: 100px;
	height: 12px;
	color: pink;
	background-color: midnightblue;
	border-radius: 4px;
}

progress::-webkit-progress-value {
	color: orange;
	background-color: lime;
	border-radius: 6px;
}

/* ================================================================================= */
body {
	margin: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.tight
{
  padding:0px;
  margin:0px;
}

.nobord
{
  border:none;
}

.link,
select,
option,
a,
button 
{
	cursor: pointer;
	text-decoration: none;
}

/* audio player */
div.divaud 
{
	width: 100%;
	padding:0px;
	margin:0px;
}

div.topheadingthis {
	font-size: 20px;
}

div.divred {
	border: 1px solid red;
}

/* heading for songlist */
/* h4.ac cordiantitle, */
h4.accordiantitlesonglist 
{
	padding: 0px;
	margin-top: 0px;
	font-size: 14px;
	line-height: 15px;
	margin-bottom: 5px;
	cursor: pointer;
}

audio.aud,
video.vid 
{
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
}

/* buttons within toolbox */
button.buttontool {
	font-size: 11px;
	border: 1px solid silver;
	border-radius: 3px;
	margin: 3px;
	padding: 2px;
  font-family: 'Arial Narrow', sans-serif;
	font-size: 11px;
}

/*  current artist and song */
span.currentartist, span.currentsong  
{
	font-size: 14px;
	margin: 0px;
	padding: 0px;
}

/* name of song BY  */
span.currentby 
{
	color: silver;
	font-size: 12px;
}
/* 
span.topheadingnext {
	font-size: 14px;

	padding: 2px;
	padding-top: 4px;
	padding-bottom: 0px;
	border: 1px solid red;
	height: 25px;
} */


/* around toolbox */
div.divborder 
{
	margin: 2px;
	margin-top: 4px;
	padding: 4px;
	border-radius: 5px;
	border-top: ridge;
	border-bottom: groove;
	border-right: groove;
	border-left: ridge;
}

/* around song list tables */
div.divborder3
{
	margin: 0px;
	padding: 0px;
	border-radius: 5px;
	max-width: 99%;
	margin-left: auto;
	margin-right: auto;
}

/* div.divborderdropdown 
{
	margin: 6px;
	margin-top: 10px;
	padding: 4px;
	border-radius: 5px;
	border-top: ridge;
	border-bottom: groove;
	border-right: groove;
	border-left: ridge;
	margin-left: auto;
	margin-right: auto;
} */



/* div.divtitle {
	border: 0px solid red;
	padding: 0px;
	margin-top: 5px;
} */

/* around the toolbox */
div.divtools {
	display: none;
	margin: 5px;
	padding: 5px;
	text-align: center;
	width: 98%;
	margin-left: auto;
	margin-right: auto;
  /* border:1px solid red; */
}

/* video player */
div.divvid {
	border: none;
	padding: 2px;
}

/* img land retired */
/* img.imgland, */
img.imgtablet,
img.imgport {
	border: 2px solid #666;
	padding: 2px;
	border-radius: 2px;
	margin: 0px;
}

/* img.imgport,
img.imgland,
img.imgtablet {
	margin: 0px;
} */

/* retired */
/* img.imgland {
	margin-left: 2px;
	margin-right: 4px;
} */

/* retired */
/* button.landbtntext {
	padding-top: 15px;
	padding-bottom: 10px;
	font-size: 10px;
	line-height: 12px;
	width: 70px;
	height: 40px;
} */




/* a.navtabler, */
/*  */
a.navtable,
a.navtable0,
a.navtable1,
a.navtable2,
a.navtable3,
a.navtable4,
a.navtable5,
a.navtable6 {
	font-size: 11px;
	line-height: 15px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 3px;
	padding-right: 3px;
	margin: 1px;
	font-family: verdana, arial, helvetica, serif;
	font-weight: 400;
}

a.navtable
{
    font-family: 'Arial Narrow', sans-serif;
    font-size: 11px;
}

a.navtablegrab {
	cursor: -webkit-grabbing;
	cursor: grabbing;
}

a.navtablegrab:hover {
	cursor: -webkit-grabbing;
	cursor: grabbing;
}


/* portrait  but text is really an image */
button.portbtntext {
	padding-top: 10px;
	padding-bottom: 10px;
	width: 40px;
	height: 40px;
}

/* button.landbtntext  */
/* the text is really an image */
button.portbtntext,
button.tabletbtntext
{
	margin: 0px;
	padding: 0px;
}

/* section around the tables */
section.list 
{
	/* float: left; */
	margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
	margin-bottom: 6px;

	padding: 0px;

	/* width: 340px;
	min-width: 339px; */
    max-width: 300px;
    width: 299px;
	min-width: 298px;
	text-align: center;
	border:0px solid lime;
}

/* sections for song tables */
table.tablelinks {
	/* width: 335px; */
    width: 290px;
	border-collapse: collapse;
	font-size: 11px;
	border: none;
	padding: 0px;
	padding-top: 2px;
	margin: 0px;
	margin-left: auto;
	margin-right: auto;
}

/* row of songtable */
td.tdlink1,
td.tdlink2,
td.tdlink3 {
	margin: 0px;
	padding: 0px;
	border: none;
}

/* which song is playing */
td.tdmarker 
{
	/* background-color: lime; */
	border: none;
	width: 10px;
	margin: 0px;
	padding: 0px;
	color: black
}

/* which song is playing */
td.tdmarkerhighlight 
{
	background-color: lime;
	border: none;
	width: 10px;
	margin: 0px;
	padding: 0px;
	color: black;
}

/* which song is paused */
td.tdmarkerhighlightpause {
	background-color: yellow;
	border: none;
	width: 10px;
	margin: 0px;
	padding: 0px;
	color: black;
}

/* song table row */
td.tdlink1 
{
	text-align: center;
	width: 25px;
	min-width: 24px;
	background-color: gray;
	color: white;
}

/* song table row */
td.tdlink2 
{
	text-align: left;
	width: 120px;
	max-width: 121px;
	min-width: 119px;
}

/* song table row */
td.tdlink3 
{
	text-align: left;
	width: 120px;
	max-width: 121px;
	min-width: 119px;

}

/* memo in the toolbox */
textarea.textarea {
	width: 98%;
	height: 100px;
	margin: 2px;
	font-family: 'Courier New', Courier, monospace;
	font-size: 14px;
	line-height: 17px;
	font-weight: 600;
}

/* around the 3 selects  */
div.divbyartist,
div.divbysong,
div.divbygenre 
{
	padding: 0px;
	margin: 0px;
	margin-left: auto;
	margin-right: auto;

}

/* select
{
	width: 320px !important;
	font-family: 'Arial Narrow', sans-serif;
	font-size: 10px;
	cursor: pointer;
	padding:2px;
} */

option.selectoprate
{
  font-family: 'Arial Narrow', sans-serif;
	font-size: 13px;
	cursor: pointer;
	padding:2px;
	margin:0px;
	text-align: left;

}

/* option */
option.selectop
{
	max-width: 321px !important;
    width: 320px !important;
    min-width: 319px !important;
	font-family: 'Arial Narrow', sans-serif;
	font-size: 10px;
	cursor: pointer;
	padding:2px;
	margin:0px;
	text-align: left;
}

select 
{
	border: none ; 
}

/*none
border-top:ridge ; 
border-bottom: groove  ;
border-right:groove  ; 
border-left:ridge  ; 
}
*/

table.tbrate
{
  width:100%;
  border-collapse: collapse;
  margin:0px;
  margin-top:10px;
  margin-bottom:10px;
}

td.tdstar1,
td.tdstar2,
td.tdstar3
{
  font-family: 'Arial Narrow' sans-serif;
  font-size: 11px;
  line-height: 12px;
  /* border: 1px solid white; */
  padding:0px;
  margin:0px;
  margin-top:10px;
  margin-bottom:10px;
}

td.tdstar1
{
  text-align: left;
  padding-left:10px;
  width:25%;
}

td.tdstar2
{
  text-align:center;
  width:50%;
}

td.tdstar3
{
  text-align:right;
  width:25%;
  padding-right:10px;
}


select.selectrating
{
	max-width: 60px;
	font-size: 12px;
	margin: 0px;
	padding: 0px;
  border:1px dashed silver;
}



select.selecttheme 
{
	max-width: 100px;
	font-size: 10px;
	margin: 0px;
	padding: 0px;
}


select.selectartist,
select.selectsong,
select.selectgenre 
{
    width:280px;
	max-width: 281px;
    max-width: 279px;

	cursor: pointer;
    
	font-size: 11px;
	font-family: 'Arial Narrow', sans-serif;
	margin: 0px;
	padding: 0px;
    text-align: center;
}


#sortselec {
	width: 280px !important;
	border: none;
}

h4.dropdowntitle {
	margin: 0px;
	padding: 0px;
	font-size: 17px;
}

a.amisclink1 {
	font-size: 18px;
	vertical-align: middle;
}

/* ######################################################################### */

div.subbar {
  margin-left: auto;
  margin-right: auto;
  width: 300px;
  text-align: center;
}

table.startend 
{
  width:370px;
  border: 1px solid blue;
  margin: 20px;
  margin-left: auto;
  margin-right: auto;
  font-size: 12px;
  border-collapse: collapse;
  table-layout: fixed;
  border:0px solid red;
}

th.thstartend1,
th.thstartend2,
th.thstartend3,
th.thstartend4,
th.thstartend5,
th.thstartend6,
th.thstartend6a,
th.thstartend7,
th.thstartend8,
th.thstartend9 
{
  border: 0px solid snow;
  padding: 0px;
  font-family: 'Arial Narrow', sans-serif;
  font-size: 10px;
}

td.tdstartend1,
td.tdstartend2,
td.tdstartend3,
td.tdstartend4,
td.tdstartend5,
td.tdstartend6,
td.tdstartend6a,
td.tdstartend7,
td.tdstartend8,
td.tdstartend9 
{
  border: 1px solid gray;
  padding: 0px;
  font-family: 'Arial Narrow', sans-serif;
  font-size: 11px;
}

th.thstartend1 
{
  width: 20px !important;
  max-width:20px;
}

/* song */
th.thstartend2 
{
  width: 100px !important ;
  max-width:100px;
}

/* artist */
th.thstartend3 
{
  width: 60px !important;
  max-width:60px;
}

/* startat endat */
th.thstartend4,
th.thstartend5 
{
  width: 30px !important;
  max-width:30px;
}

/*  */
th.thstartend6,
th.thstartend6a 
{
  width: 35px !important;
  max-width:35px;
}

th.thstartend7,
th.thstartend8 {
  width: auto;
}
th.thstartend9 {
  /* width: 60px; */
  width:auto ;
}


td.tdstartend1 {
  text-align: center;
}
td.tdstartend2,
td.tdstartend3 {
  text-align: left;
}

td.tdstartend4,
td.tdstartend5,
td.tdstartend6,
td.tdstartend6a,
td.tdstartend7,
td.tdstartend8,
td.tdstartend9 
{
  text-align: center;
}

a.submenu,
button.submenu {
  /* co lor : red; */
  /* line-height:1.0; */
  position: relative;
  top: 4px;
  vertical-align: middle;
}

a.songid {
  height: 25px;
  margin: 2px;
  padding: 2px;
  font-size: 12px;
  border: 0px;
  border-radius: 5px;
}

button.toolbutton,
div.toolbutton
{
  height: 25px;
  margin: 2px;
  padding: 2px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 3px;
  font-size: 10px;
  border: 0px;
  border-radius: 5px;
}

a.toolbutton 
{
  height: 25px;
  /* margin: 2px; */
  margin-left: auto;
  margin-right: auto;
  padding: 2px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 3px;
  font-size: 10px;
  border: 0px;
  border-radius: 5px;
  border:1px solid blue;
}

a.dropdown 
{
  font-size: 10px;
  line-height: 0.9;
  border: 0px;
  width: 50px;
}

/* toolbox */
table.tabtool 
{
  border: 0px solid red;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
}

/* advanced tools buttons */
td.tdadvancedtools
{
  text-align: center;
  border: none;
}

td.tdtool 
{
  text-align: center;
  width: 24%;
  border: 0px solid red;
  /* font-size: ; */
}

td.tdtool1 
{
  text-align: center;
  width: 40%;
  border: 0px solid red;
}

/* td.tdtool2,
td.tdtool3,
td.tdtool4 
{
  text-align: center;
  width: 20%;
  border: 0px solid red;
} */

/* div.divbutton3 
{
  margin: 0px;
  padding: 0px;
} */

button.btntoggle 
{
  width: 75px;
  height: 25px;
  font-size: 11px;
  padding: 0px;
  padding-left: 10px;
  padding-right: 10px;
  margin: 0px;
}

/* name of current song */
table.tbtop 
{
  margin-left: auto;
  margin-right: auto;
  margin-top: 15px;
  margin-bottom: 10px;
  border:none;
  width:370px;
}

/* around the artist song genre dropdowns */
table.tabdropdowns
{
margin-top:2px;
margin-bottom: 2px;
}

/* text to the left of the top 3 selects */
td.tdlabelleft
{
text-align: center;
  margin: 0px;
  padding: 0px;
  border:none;
  font-size: 10px;
  line-height: 10px;
  width:70px;
}

/* table holding the top blocks */
td.tdtop 
{
  text-align: center;
  margin: 0px;
  padding: 0px;
  border:none;
  /* border:1px solid white; */
}

/* skip intro outro */
input.checkskip
{
  height: 10px;
}

/* label for the skip check boxes */
label.labskip
{
  font-size: 12px;
  cursor: pointer;
}

label.labtext
{
  font-size: 12px;
  margin-left: auto;
  margin-right: auto;
}

table.tabscroll
{
  border: none;

  border-collapse: collapse;
  width:250px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: auto;
  margin-right: auto;
}

/* nav buttons at bottom of song tables */
td.tdscroll
{
  /* width:25%; */
  width:50px;
  text-align: center;
  border: none;
}

/* btn sat bottom of each song table */
button.btnscroll
{
  padding: 1px;
  padding-left:5px;
  padding-right:5px;
  line-height: 10px;
  font-size: 10px;
  font-weight: 600;
  width:32px;
  border:none;
  margin:0px;
}

/* theme and skip preferences */
table.tabmenuport
{
  width:370px;
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
  border:none;

}

table.tabpref
{
  width:250px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  border-collapse: collapse;
  /* border:2px solid red; */
}


/* theme and skip preferences  */
td.tdpref
{
  width:33%;
  padding:0px;
  text-align: center;
  font-family: 'Arial Narrow', sans-serif;
  font-size: 10px;
  border:0px solid white;
}

.taleft
{
  text-align: left;
}

.taright
{
  text-align: right;
}

.tacenter
{
  text-align: center;
}


/* menu for tablet */
table.tabmenutablet
{
  width:650px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  margin-bottom: 5px;
  padding:4px;
  border-collapse: collapse;
  border:none;
}

/* retired */
/* table.tabmenuland
{
  width:1200px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  margin-bottom: 5px;
  border-collapse: collapse;
  border:none;
} */

/* manual */
table.tabmanual
{
  width:300px;
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
  table-layout: fixed;
  border:1px solid silver;
}

table.tabp1manual
{
  width:300px;
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
  /* table-layout: fixed; */
  /* border:1px solid silver; */
}

table.tabmanual2
{
  width:300px;
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
  /* table-layout: fixed; */
  /* border:1px solid silver; */
}



div.divmanual
{
  /* width:344px; */
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
  table-layout: fixed;
  /* border:1px solid cyan; */
  /* text-align: center; */
}

/* manual instructions */
/* td.tdman0
{
  border:1px solid red; 
}

td.tdman1, td.tdman2, td.tdman3, td.tdman4
{
  border:none;
} */

/* manual instructions */
/* th.thman3, th.thman4, th.thman0
{
  font-size: 11px;
  font-family: 'Arial Narrow', sans-serif;
} */

/* manual instructions */
th.thp2man1, th.thp2man2, th.thp2man3
{
  text-align: center;
  padding:0px;
  font-size: 11px;
  font-family: 'Arial Narrow', sans-serif;
}


/* manual instructions asterisk */
/* td.tdman2
{
  color: white;
  font-weight: 700;
  font-size: 13px;
} */


h4.manhead
{
  font-size: 14px;
}


/* some headings in the manual block */
/* li.limanual,p.manual
{
  font-size: 11px;
  font-family: 'Arial Narrow', sans-serif;
} */


	
/* manual buttons */
td.manualclick
{
  text-align: center;
  border:1px solid silver;
}

td.manualclick2
{
  text-align: center;
  padding:5px;
  padding-bottom:10px;

}

td.tdpmanual
{
   padding:0px;
   margin:0px;

}

/* some headings in the manual block */
p.pmanual
{
  font-size: 11px; 
  padding:4px;
  margin:0px;
  margin-top:0px;
  margin-bottom:10px;
  text-align: left;
}

p.pmanual3,p.pmanual4
{
  font-size: 11px; 
  padding:4px;
  margin:0px;
  margin-top:0px;
  /* margin-bottom:6px; */
  text-align: left;
}





p.phead
{
  font-size: 11px; 
  margin-top:10px;
  margin-bottom:7px;
  padding:2px;
  width:270px;
  margin-left: auto;
  margin-right: auto;

  font-weight: 550;
  text-align: center;
}
	  
video,audio
{
    padding:0px;
    margin: 0px;
}

div.divvid, div.divaud
{
    padding:0px;
    margin:0px;
    margin-left: auto;
    margin-right: auto;   
    width:350px;
}

video.vid
{
    width:350px;
    padding:0px;
    margin:0px;
    margin-left: auto;
    margin-right: auto;
}

a.dashed,
button.dashed
{
  border:1px ridge silver;
}

th.thp1man1,th.thp1man2,th.thp1man3
{
  font-size: 10px;
  font-family: 'Arial Narrow',  sans-serif;
}

th.thp1man0,th.thp2man0
{
  font-size: 13px;
  font-family: 'Arial Narrow',  sans-serif;
}

th.thp2man1
{
  font-size: 10px;
  font-family: 'Arial Narrow',  sans-serif;
}

th.thp1man1
{
  width:50px;
}

th.thp1man2
{
  width:100px;
}

td.tdp1man1
{
  font-size: 14px;
  font-family: 'Arial Narrow',  sans-serif;
}

td.tdp1man2,td.tdp1man3
{
  font-size: 13px;
  font-family: 'Arial Narrow',  sans-serif;
  text-align: left;
}

div.divmanual1,div.divmanual2,div.divmanual3,div.divmanual4
{
  display:none; 
}

.star {
  font-size: 20px;
  cursor: pointer;
  margin-left:4px;
  margin-right: 4px;
  color: silver;
  font-weight: 550;
}
 
/* .one {
  color: rgb(255, 0, 0);
}
 
.two {
  color: rgb(255, 106, 0);
}
 
.three {
  color: rgb(255, 255, 0);
}
 
.four {
  color: rgb(24, 159, 14);
} */

span.one,
span.two,
span.three,
span.four, 
span.five 
{
  color:yellow;
  font-weight: 900;
  /* color: rgb(255, 255, 255); */
  /* background-color: yellow; */
}

label.labrate
{
  font-size: 24px;
  cursor:pointer;
}

/* a.advancedtoolsbutton, */
h6.advancedtoolsbutton
{
  font-size: 6px;
}

label.starlab  
{
  font-size:10px;
  line-height: 10px;
  padding:0px;
  margin:0px;
}

input.starinp
{
  height:10px;
  line-height: 10px;
  padding:0px;
  margin:0px;
}

table.tbstar
{
  border-collapse: collapse;
  padding:0px;
  margin:0px;
}

td.tdstar
{
  line-height: 10px;
  padding:0px;
  margin:0px;
}

.calendar
{
  margin:4px;
  padding:4px;
}