$navbar-background-image-light: linear-gradient(to right, #46d4ff 0%, #a606d6 100%);
$navbar-background-image-dark: linear-gradient(to right, #333338 0%, #171618 100%);
$navbar-font-size:0.75rem;
.light-mode{
    .navbar-style{
        background-image: $navbar-background-image-light;
        font-size: $navbar-font-size;
        .navbar-item{
            color: #ffffff;
            &:hover, &:focus, &active{
                background-color: rgba(0, 0, 0, 0.089);
            }
            .navbar-dropdown{
                .navbar-item{
                    color: gray;
                    &:hover{
                        background-color: rgba(0, 0, 0, 0.089);
                    }
                }
            }
            .navbar-link{
                color: #ffffff;
                &:hover, &:focus, &active{
                    background-color: rgba(0, 0, 0, 0.089);
                }
            }
        }
        .navbar-item.has-dropdown:hover .navbar-link{
            background-color: rgba(0, 0, 0, 0.089);
        }
        .navbar-link:not(.is-arrowless)::after{
            border-color: #ffffff;
        }
        .navbar-burger{
            color: #ffffff;
        }
    }
}
.dark-mode{
    .navbar-style{
        background-image: $navbar-background-image-dark;
        font-size: $navbar-font-size;
        .navbar-item{
            color: #ffffff;
            &:hover, &:focus, &active{
                background-color: rgba(0, 0, 0, 0.089);
            }
            .navbar-dropdown{
                .navbar-item{
                    color: gray;
                    &:hover{
                        background-color: rgba(0, 0, 0, 0.089);
                    }
                }
            }
            .navbar-link{
                color: #ffffff;
                &:hover, &:focus, &active{
                    background-color: rgba(0, 0, 0, 0.089);
                }
            }
        }
        .navbar-item.has-dropdown:hover .navbar-link{
            background-color: rgba(0, 0, 0, 0.089);
        }
        .navbar-link:not(.is-arrowless)::after{
            border-color: #ffffff;
        }
        .navbar-burger{
            color: $dark-color-font;
        }
    }
}