#SideBarButton{
    /*position: absolute;*/
    /*inset-inline-end: 0px;*/
    /*z-index: 21;*/

    display: flex;
    align-items: center;
    justify-content: center;

    background: transparent;

    border: none;
    padding: 8px;

    cursor: pointer;
}

.SideBarSvg{
    width: 24px;
    height: 24px;
}

#svgClose {
    margin-left: 5px;
}

#SideBarButton:hover{
    background-color: var(--secondaryColor);
    /*background-color: #3c5110;*/
    border-bottom-left-radius: 50px;
    border-top-left-radius: 50px;
}

#SideBarLinks{
    display: none;

    height: auto;

    /*background-color: #4b6122;*/
    /*border-left: solid 1px #3c5110;*/
    /*border-bottom: solid 1px #3c5110;*/
    background-color: var(--backgroundColor);
    border-left: solid 1px var(--secondaryColor);
    border-bottom: solid 1px var(--secondaryColor);
    border-bottom-left-radius: 10px;

    inset-inline-end: 0px;
    padding: 20px;

    z-index: 21;
}

.hideSideBar{
    display: none !important;
}

.OpenSideBar{
    display: block !important;
}

#SideBarLink{

}

#SideBarLink:hover{
    font-weight: bold;
}

.SideBarlogout{
    color: #1e18e8 !important;
}

.SideBarlogout:hover{
    color: #071fff !important;
}

#SideBarResponsiveLinks{
    display: none;
}

@media screen and (max-width: 930px) {
    #SideBarResponsiveLinks{
        display: block;
    }
}

@media screen and (min-height: 1130px) {
    #SideBarLinks{
        font-size: 2vh;
    }

    .SideBarSvg{
        width: 40px;
        height: 40px;
    }
}

@media screen and (min-height: 1360px) {

    .SideBarSvg{
        width: 50px;
        height: 50px;
    }
}