.main {
  padding: 0.25em;
  margin: 0.25em;
  background-color: #000000;
  /* color: #ff0000; */
  font-size: 1.25em;
  font-family: serif;
}

h1,h2 {
  text-align: center;
  color: #ff0000; 
}
h3 {
  color: #ff0000;
}
hr {
  color: #ff0000;
  width: 80%;
}
a:link {
  color: #ff0000;
}
a:hover {
  color: #ff00ff;
}
a:active {
  color: #ffffff;
}

.major {
  margin: 0.25em;
  padding: 0.25em;
  border-width: 1px;
  border-style: none;
  /* border-width without border-style */
  display: inline-block; 
  /* float: left; */
  position: relative;
}

.minor {
  margin: 0.5em;
  padding: 0.5em;
}

.abc {
  display: flex;
  padding-top: 0;
  margin-top: 0;
}

.bordered {
  padding: 0.5em;
  margin: 0.5em;
  border-width: 1px;
  border-color: #ff0000;
  border-style: solid;
}

.whitetext {
  color: #ffffff;
}
.redtext {
  color: #ff0000;
}
.sharp {
  font-weight: bold;
  font-size: 1.35em;
}

table.gem {
  border-style: solid;
  border-width: 1px;
  border-collapse: collapse;
}

td.gem {
  text-align: center;
  width: 3rem;
  border-style: solid;
  border-width: 1px;
}

caption.gem {
  padding: 0.5rem;
  font-style: italic;
  caption-side: bottom;
}