header {
    max-height: 4em;
    position: fixed;
    top: 0;
    width: -webkit-fill-available;
    z-index: 3000;
    background: linear-gradient(#d73301ee,#800000ee);
    box-shadow: 0 2px 12px #000000
}

header .container {
    height: 4em;
    display: inline-flex;
    width: -webkit-fill-available;
    justify-content: space-between;
    box-shadow: 0 0 5px #00000055;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    background: url(/images/bg.webp)
}

header #logo {
    display: block;
    height: -webkit-fill-available
}

header #menu {
    display: flex;
    height: 48px;
    margin-block:auto;margin-inline:auto 0}

header #menu ul {
    list-style: none;
    display: flex
}

header #menu a {
    text-decoration: none;
    height: -webkit-fill-available;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: xx-small;
    padding: .4em;
    justify-content: center;
    color: #fefefe
}

header #navigation img,header #customization img {
    padding-inline:.4em;padding-block-start:.4em;max-height: 32px
}

header #customization {
    border-left: 1px solid
}

header img {
    height: -webkit-fill-available;
    width: auto
}