/*header, body, main, nav, footer*/

body {
    background-color: var(--bg-canvas);
    background-repeat: repeat;

    /* background-image: url("/images/logo-motif-quinconce.svg");
    background-size: 200px 50px; */

    background-image: url("/images/logo-motif-square.svg");
    background-size: 80px 102px;
    /* background-size: 106px 136px; */
    
}

.navbar-base {
    background-color: var(--bg-secondary);
    color: var(--text-color-on-bg-secondary);
}


.navbar__container {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    max-width: 1440px;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
}

.nav__menu-item, .nav__menu-item a, .nav__menu-item svg {
    color: var(--text-color-on-bg-secondary);
    stroke: var(--text-color-on-bg-secondary);
}

.nav__menu-item, .nav__menu-item a, .nav__menu-item svg {
    color: var(--text-color-on-bg-secondary);
    stroke: var(--text-color-on-bg-secondary);
}

.nav__menu-item:hover, .nav__menu-item:hover a, .nav__menu-item:hover svg, .nav__menu-item.active, .nav__menu-item.active a, .nav__menu-item.active svg{
    color: var(--text-color-on-bg-secondary-hover);
    stroke: var(--text-color-on-bg-secondary-hover);
}