:root {
    --header-background: #FFFFFF05;
    --header-text-size: 3rem;
}

.main-header {
    position: fixed;
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.5s ease;
    backdrop-filter: blur(var(--blur));
    -webkit-backdrop-filter: blur(var(--blur));
    background-color: var(--header-background);
    z-index: 2;
  }
  
.main-header.hidden {
    transform: translateY(-100%);
}

.main-header-title {
    font-family: "Lily Script One";
    font-size: var(--header-text-size);
}