body { min-width: 1000px; font-family: arial; font-size: 18pt; }

/* Hide the skip link by default */
.skip-link {
  position: absolute;
  top: -40px; /* Move it above the viewport */
  left: -40px; /* Move it to the left of the viewport */
  background-color: #333;
  color: #fff;
  padding: 10px;
  text-decoration: none;
  transition: top 0.3s ease, left 0.3s ease;
  z-index: 999; /* Make sure it's on top of other elements */
}

/* Show the skip link when it receives keyboard focus */
.skip-link:focus {
  top: 0;
  left: 0;
}
header h2 { font-family: arial; font-weight: bold; font-size: 65pt; color: blue; }
nav { background-color: blue; }
nav a:link {font-family: arial; font-weight: bold; color: white; text-decoration: none; }
nav a:visited { font-family: arial; font-weight: bold; color: white; text-decoration: underline; }
nav a:active {font-family: arial; font-weight: bold; color: yellow; text-decoration: underline; }
.inline ul { list-style-type: none; }
.inline li { display: inline; padding: 5px; }

main { min-height: 1300px; }
main h1 { font-family: arial; font-weight: bold; text-align: center; }
main h2 { font-family: arial; font-weight: bold; text-align: center; }

.row { display: flex; }
.column1 { flex: 30%; padding: 5px; }
.column2 { flex: 70%; padding: 5px; }
.center { display: block; margin-left: auto; margin-right: auto; }

.content { display: flex; }
.leftside { flex: 10%; padding: 5px; }
.albuminfo { flex: 80%; padding: 5px; }

.sidebar nav { background-color: light gray; }
.sidebar ul { list-style-type: none; padding: 5px; }
.sidebar a:link { color: black; text-decoration: none; }
a:visited { color: black; text-decoration: underline; }
a:active { color: yellow; text decoration: underline; }
