Show in hover navbar dropdown-menu bootstrap

navbar.scss

.dropdown {
    &:hover {
    	.dropdown-menu{
    		display: initial;
    		visibility: visible;
    		opacity: 1;
    		@include transition(0.1s ease-in-out);
    	}
    }
}

.dropdown-menu {
	display: initial;
	opacity: 0;
	visibility: hidden;
	@include transition(0.1s ease-in-out);

    &.sub-menu {
    	left: 100%;
        position: absolute;
        top: 0;
        visibility: hidden;
        margin-top: -1px;
    }

    li {
    	&:hover {
    		.sub-menu {
    			visibility: visible;
    		}
    	}
    }
}

.open > .dropdown-menu {
	display: initial;
	visibility: visible;
	opacity: 1;
	@include transition(0.1s ease-in-out);
}