.test1234 {
    background: #8a2be2; /* blueviolet */
    margin: 0; /* kill the bottom‑margin */
    padding: .25rem .75rem; /* keep a bit of air inside */
    color: #fff;
}

header, nav {
    margin: 0; /* belt‑and‑suspenders */
}

#pageHeader.top-bar {
    background: #0d6cbc; /* same solid blue */
    color: #fff;
    font-size: .875rem; /* 14 px */
    line-height: 1;
    font-family:Arial, Helvetica, sans-serif;
}

/* container already sets the max‑width, so just space things out */
.top-bar__wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .35rem 0; /* slim vertical padding */
}

/* left & right groups share the same flex layout  */
.top-bar__left,
.top-bar__right {
    display: flex;
    flex-wrap: wrap; /* wrap on narrow screens */
    gap: 1.25rem; /* space between items */
    align-items: center;
}

/* link styling ------------------------------------------------------ */
.top-bar__item,
.top-bar__icon {
    display: flex;
    align-items: center;
    gap: .4rem; /* space between icon and text */
    color: inherit; /* inherit white text */
    text-decoration: none;
    transition: opacity .2s ease;
}

.top-bar__icon { /* icon‑only links (FB / IG) */
    font-size: 1.1rem;
    padding: 0 .15rem;
}

    .top-bar__item:hover,
    .top-bar__icon:hover {
        opacity: .8; /* simple hover feedback */
    }

/* optionally tone down icon weight a bit */
.top-bar i {
    font-size: 1rem;
}
