/* Ensure the image is responsive */
.logo {
  max-width: 100%;  /* Ensure the image scales based on its container */
  height: auto;     /* Maintain aspect ratio */
  margin-top: 5px;  /* Keeps the margin-top from the original */
}

/* Media Queries for responsiveness */

/* Desktop and larger devices */
@media (min-width: 768px) {
  .logo {
    max-width: 50px;  /* Max width for larger screens like desktops */
    margin-top: 0; /* Remove the top margin and move it up */
  }
}

/* Mobile and smaller devices */
@media (max-width: 767px) {
  .logo {
    width: 50px;  /* Set the width to 50px on mobile */
    height: auto; /* Maintain aspect ratio */
    margin-top: 0; /* Remove the top margin and move it up */
  }
}