header {
   position: fixed;
   width: 100%;
   height: 72px;
   display: flex;
   justify-content: center;
   z-index: 10;
   padding: 0 16px;
   background: white;
}
header > .container {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: space-between;
}
header > .container a.logo {
   display: block;
   width: 67px;
   height: 67px;
   background-image: url(/images/logo.png);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
}
header > .container > .current-song {
   flex: 1;
   margin: 0px 16px;
}
header > .container > ul.menu {
   display: none;
   height: 43px;
   margin: 32px 0px 0px;
   font-size: 24px;
   font-weight: 700;
   line-height: 31px;
   column-gap: 56px;
}
header > .container > ul.menu > li.menu-item > a {
   /* color: var(--kl-color-3); */
   color: #152735;
}
header > .container > ul.menu > li.menu-item.active,
header > .container > ul.menu > li.menu-item:hover {
   /* border-bottom: 2px solid var(--kl-color-3); */
   border-bottom: 2px solid #152735;;
}

@media screen and (min-width: 744px) {
   header {
      width: 100vw;
      height: 107px;
      margin: 0px 0px 57px;
      padding-top: 0px;
      background: white;
   }
   header > .container {
      align-items: unset;
   }
   header > .container > a.logo {
      width: 174px;
      height: 64px;
      margin-top: 18px;
      margin-left: 18px;
   }
   header > .container > .current-song {
      display: none;
   }
   header > .container > ul.menu {
      display: flex;
      margin-right: 36px;
   }
}

@media screen and (min-width: 1440px) {
   header > .container {
      width: 1440px;
   }
   header > .container > a.logo {
      margin-left: 124px;
      width: 174px;
      height: 64px;
   }
   header > .container > ul.menu {
      margin-right: 240px;
   }
}