body {
  text-align: center;
  font-family: "MS Gothic", sans-serif;
  margin: 0;
  color:#f4f4d0;
  background-color: #000;
  background-image: url(/images/bluegrid.png);
  background-repeat: repeat;
}
#container {
  margin: 0 auto;
}
#container a {
  color: #ed64f5;
  font-weight: 700;
  text-decoration: none;
}
#container a:hover {
  color: #a010a0;
}
#flex {
  display: flex;
  justify-content: center;
  width: 100%;
  /*background-color: #101010;*/
}
main {
  background-color:#040810;
  border: 2px solid #2D4696;
  margin: 0 auto;
  width: 960px;
}
#header {
  text-align: center;
  background-color: transparent;
}
#header h1 {
  padding: 20px 0;
  margin: 0;
  font-family: "MS Gothic";
}
#navbar {
  height: 22px;
  background-color:#020408;
  border: 2px solid #2D4696;
  border-bottom:none !important;
  margin: auto;
  display: flex;
  justify-content: center;
  font-family: "MS Gothic";
  width:960px;
}
#navbar ul {
  display: flex;
  padding: 0;
  margin: 0;
}
#footer #navbar ul {
  margin: -8px 0 24px 0;
}
#navbar li::marker {
  content: "";
}
#navbar li {
  margin-left: 0;
}
#navbar li a {
  color: #5878a8;
  font-weight: bold;
  font-size: 14px;
  text-decoration:underline
}
#navbar li a:hover, #footer li a:hover {
  color: #3a4e80;
  text-decoration:underline
}
#footer {
  width: 100%;
  height: 40px;
  text-align: center;
  margin: 0 auto;
}
#footer img {
  width:88px;
  height:31px
}
table {
  margin-top: 48px;
  background-color: #03060c;
}
td {
  font-size: 20px;
  text-align: center;
  max-height: 720px;
}
th {
  font-weight: 700;
  font-size: 20px;
}
#title {width: 160px;}
#artist {width: 190px;}
#date {width: 215px;}
#genre {width: 120px;}
#rating {width: 130px;}
#favorite {width: 145px;}

#musictable {
  margin: 20px auto;
  border: solid #304060 1px;
  max-width: 920px;
}
#musictable th {
  border: solid #304060 1px;
  background-color: #03060c;
  user-select: none;
}
#musictable th:hover {
  background-color: #060c18;
}
#musictable td {
  border: solid #304060 1px;
}
#musictable img {
  max-width: 240px;
  max-height: 240px;
}
table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after {
  content: " \2B25";
}
th.sorttable_sorted::after {
  content: " \23F7";
}
th.sorttable_sorted_reverse::after {
  content: " \23F6";
}
#sorttable_sortfwdind, #sorttable_sortrevind {
  display: none;
}
table.sortable th:hover {
  background-color: #020408;
  color: silver;
}
th#notes.sorttable_nosort:hover {
  background-color: unset;
  color: unset;
}
table.sortable tbody tr:nth-child(2n) td {
  background: #03060c;
}
table.sortable tbody tr:nth-child(2n + 1) td {
  background: #060c18;
}
.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}