button.navbar-toggler{
	--navbar-toggler-button-padding-x: 20px;
	--navbar-toggler-button-padding-y: 21px;
	--navbar-toggler-button-line-w: 16px;
	--navbar-toggler-button-line-h: 2px;
	--navbar-toggler-button-line-spacing: 4px;
	--navbar-toggler-button-line-color: #000;
	--navbar-toggler-button-line-color-x: #fff;

	position: relative;
	z-index: 999;
	margin-left: max( var(--snap), calc( -1 * var(--navbar-toggler-button-padding-x) ) ) !important;
	padding: var(--navbar-toggler-button-padding-y) var(--navbar-toggler-button-padding-x) !important;
	border: none !important;
	border-radius: 50%;
	transition: background-color .3s ease;
}
@media (hover: hover){
	button.navbar-toggler:hover{
		background-color: var(--wp--preset--color--desert-storm);
	}
	.menu-open button.navbar-toggler:hover{
		background-color: var(--wp--preset--color--valentino);
	}
}
button.navbar-toggler:focus{
	box-shadow: none;
}
button.navbar-toggler span,
button.navbar-toggler::before,
button.navbar-toggler::after{
	width: var(--navbar-toggler-button-line-w);
	height: var(--navbar-toggler-button-line-h);
	border-radius: 4px;
}
button.navbar-toggler span{
	display: block;
	margin: calc( var(--navbar-toggler-button-line-h) + var(--navbar-toggler-button-line-spacing) ) 0;
	background-color: var(--navbar-toggler-button-line-color);
	opacity: 0;
	transition-delay: 300ms;
	transition: opacity 300ms ease 0ms;
}
button.navbar-toggler::before,
button.navbar-toggler::after{
	content: "";
	position: absolute;
	left: var(--navbar-toggler-button-padding-x);
	background-color: var(--navbar-toggler-button-line-color-x);
	transition: top 300ms ease 0s, bottom 300ms ease 0s, transform 300ms ease 350ms, background-color 300ms ease 0ms;
	transform-origin: center;
}
body.menu-opening button.navbar-toggler span,
body.menu-opening button.navbar-toggler::before,
body.menu-opening button.navbar-toggler::after{
	background-color: var(--navbar-toggler-button-line-color-x) !important;
}
button.navbar-toggler::before{
	top: calc( var(--navbar-toggler-button-padding-y) + var(--navbar-toggler-button-line-spacing) + var(--navbar-toggler-button-line-h) );
	transform: rotate(45deg);
}
button.navbar-toggler::after{
	bottom: calc( var(--navbar-toggler-button-padding-y) + var(--navbar-toggler-button-line-spacing) + var(--navbar-toggler-button-line-h) );
	transform: rotate(-45deg);
}
button.navbar-toggler.collapsed span{
	opacity: 1;
}
button.navbar-toggler.collapsed::before,
button.navbar-toggler.collapsed::after{
	background-color: var(--navbar-toggler-button-line-color);
	transition: top 300ms ease 350ms, bottom 300ms ease 350ms, transform 300ms ease 0ms, background-color 300ms ease 0ms;
}
button.navbar-toggler.collapsed::before{
	top: var(--navbar-toggler-button-padding-y);
	transform: rotate(0deg);
}
button.navbar-toggler.collapsed::after{
	bottom: var(--navbar-toggler-button-padding-y);
	transform: rotate(0deg);
}

@media (max-width: 767px){
	button.navbar-toggler{
		--navbar-toggler-button-padding-x: 16px;
	}
}