body {
    margin: 0;
    font-family: Arial, sans-serif;
}

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 35px 15px;
    background-color: #222;
    color: #03cce6;
    height:12vh;
}

nav ul {
    list-style: none;
    display: flex;
    gap: 5rem;
    margin: 0;
    padding: 0;
    align-items: center;
}

nav a {
    text-decoration: none;
    color: #03cce6;
    font-size: 1.5rem;
    transition: transform 0.2s ease, color 0.2s ease;
    display: inline-block;
}

nav a:hover {
    color: #7ee700; 
    transform: scale(1.1);
}

#book-nav-button{
  background-color: #28a745;
  color: white;
  outline: 10px solid #28a745;
  outline-offset: 0px;
  border-radius: 5%;
  transition: transform 0.2s ease, color 0.2s ease;
}

#book-nav-button:hover{
    color: #03cce6;; 
    transform: scale(1.1);
    border:none
}

.media a img {
  width: 65px; /* adjust size */
  height: 65px;
  transition: transform 0.3s ease;
}

/* Match anchor hover effect */
.media a:hover img {
  transform: scale(1.1); 
}