.bi-mail-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48H48zM0 176V384c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V176L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z'/%3E%3C/svg%3E");
}

.bi-development-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M9.4 86.6C-3.1 74.1-3.1 53.9 9.4 41.4s32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L178.7 256 9.4 86.6zM256 416H544c17.7 0 32 14.3 32 32s-14.3 32-32 32H256c-17.7 0-32-14.3-32-32s14.3-32 32-32z'/%3E%3C/svg%3E");
}

.bi-design-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M502.3 159.7l-234-156c-8-4.9-16.5-5-24.6 0l-234 156C3.7 163.7 0 170.8 0 178v156c0 7.1 3.7 14.3 9.7 18.3l234 156c8 4.9 16.5 5 24.6 0l234-156c6-4 9.7-11.1 9.7-18.3V178c0-7.1-3.7-14.3-9.7-18.3zM278 63.1l172.3 114.9-76.9 51.4L278 165.7V63.1zm-44 0v102.6l-95.4 63.7-76.9-51.4L234 63.1zM44 219.1l55.1 36.9L44 292.8v-73.7zm190 229.7L61.7 334l76.9-51.4L234 346.3v102.6zm22-140.9l-77.7-52 77.7-52 77.7 52-77.7 52zm22 140.9V346.3l95.4-63.7 76.9 51.4L278 448.8zm190-156l-55.1-36.9L468 219.1v73.7z'/%3E%3C/svg%3E");
}


.sidebar-absolute {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 2;
    height: 100%;

}

.sidebar-absolute-logo {
    position: absolute;
    top: 0px;
    right: 0px;
    /* z-index: 2;*/
    height: 100%;
}

.sidebar {
    padding: .5rem;
    transition: all linear .2s;
    position: fixed;
}

.nav-link {
    padding: 0rem .5rem;
    display: flex;
    flex-direction: row;
    height: 2.5rem;
}

.nav-link .bi {
    margin-right: 0px;
    min-width: 1.25rem;
}

.sidebar {
    background-image: linear-gradient(45deg, transparent, transparent);
}

@media (max-width: 640px) {
    .sidebar:has(> .navbar-toggler:checked ) {
        /*background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);*/
        background-color: var(--black);
        width: 50vw;
        height: 100%;
    }
    .sidebar:hover .bi {
        margin-right: 0.75rem;
    }
}

@media (min-width: 641px) {
    main {
        padding-left: 48px;
        width: 100vw;
    }

    .sidebar:hover {
        width: 200px;
    }

    .nav-copy {
        display: none;
        width: auto;
    }
    .sidebar:hover .nav-copy {
        display: block;
    }

    .sidebar:hover .bi {
        margin-right: 0.75rem;
    }

    .sidebar {
        width: 50px;
        /*background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);*/
        background-color: var(--black);
        background-color: #151515;
    }

    .sidebar-absolute {
        /*border-right: 1px solid var(--bg-1);*/
        box-sizing: var(--box-shadow-standard);
    }

    .testing {
    }
}

#website-logo {
    position: sticky;
    right: 0px;
    top: 0px;
    z-index: 2;
    max-width: 100%;
    width: 9rem;
    padding: 1rem;

}

#website-logo img {
    background-blend-mode: multiply;
}