/* Shared logo sizing for the Complify Learning brand system. */
.logo {
  width: 260px !important;
  height: 84px;
  overflow: hidden;
}

.logo img {
  width: 280px !important;
  max-width: none !important;
  height: 140px !important;
  object-fit: contain;
  transform: none !important;
}

.logo-panel img,
.hero-logo img,
.hero-card img,
.logo-card img {
  width: min(100%, 600px) !important;
  max-width: 600px !important;
  height: auto !important;
  transform: none !important;
}

.commerce-logo {
  display: block;
  flex: 0 0 auto;
  width: 300px;
  height: 80px;
  overflow: hidden;
}

.commerce-logo img,
body[data-commerce-page="account"] .commerce-logo img {
  display: block;
  width: 300px !important;
  max-width: none !important;
  height: 150px !important;
  object-fit: contain;
  transform: translateY(-32px);
}

.course-player-header a {
  display: block;
  flex: 0 0 auto;
  width: 190px;
  height: 56px;
  overflow: hidden;
}

.course-player-header img {
  display: block;
  width: 200px !important;
  max-width: none;
  height: 100px;
  object-fit: contain;
  transform: translateY(-22px);
}

.brand {
  display: block;
  width: 260px;
  height: 72px;
  overflow: hidden;
}

.brand img {
  display: block;
  width: 260px;
  max-width: none;
  height: 130px;
  object-fit: contain;
  transform: translateY(-29px);
}

@media (min-width: 901px) {
  .logo img {
    transform: translateX(-18px) !important;
  }
}

@media (max-width: 700px) {
  .commerce-nav {
    align-items: center;
  }

  .commerce-logo {
    width: min(300px, 100%);
  }

  .commerce-links {
    justify-content: center;
  }

  .legal-nav {
    flex-wrap: wrap;
  }
}