@import "news.css";

#banner-container {
    position: absolute;
    width: 100%;
    top: 10vw;
    left: 0px;
    font-size: max(2.5vw,30px);
}

#site-title {
    z-index: 1;
    width: 100%;
    position: absolute;
    margin-top: 3vw;
    z-index: 1;
}

:root {
    --gold: #ffb338;
    --light-shadow: #77571d;
    --dark-shadow: #3e2904;
}

#site-title.wrapper {
    display: grid;
    grid-template-areas: 'overlap';
    place-content: center;
    font-family: 'Uncial Antiqua', cursive;
}

#site-title.wrapper>div {
    background-clip: text;
    -webkit-background-clip: text;
    color: #363833;
    grid-area: overlap;
    letter-spacing: 1px;
    -webkit-text-stroke: 2px transparent;
}

#site-title div.bg {
    background-image: repeating-linear-gradient(105deg,
            var(--gold) 0%,
            var(--dark-shadow) 5%,
            var(--gold) 12%);
    color: transparent;
    filter: drop-shadow(2px 7px 3px black);
    transform: scaleY(1.05);
    transform-origin: top;
}

#site-title div.fg {
    background-image: repeating-linear-gradient(5deg,
            var(--gold) 0%,
            var(--light-shadow) 23%,
            var(--gold) 31%);
    color: #d8d3f191;
    transform: scale(1);
}