/*--- this changes the breakpoint for the default menu ---*/

body .wp-block-navigation__responsive-container-open:not(.always-shown) {
	display: block !important;
}
body .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
	display: none !important;
}

@media (min-width: 782px) {

	body .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: none !important;;
	}
	body .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: block !important;
	}
}
/*---end of breakpoint block---*/

/*--- this makes the hamburger ---*/

.wp-block-navigation__responsive-container-open svg {
	display: none !important;
}

@media screen and (max-width: 781px) {

	nav {
		width: 40px;
	}
}

.wp-block-navigation__responsive-container-open {
	position: relative;
	margin-left: 3rem !important;
}

.wp-block-navigation__responsive-container-open:before {
	content: "";
	display: block;
	position: absolute;
	top: -2vw !important;
	height: 1vw !important;
	width: 10vw;
	background-color: black !important;
	border-radius: 1vw;
	right: 1rem;
}

.wp-block-navigation__responsive-container-open svg {
	content: "";
	display: block !important;
	position: relative;
	height: 1vw !important;
	width: 10vw !important;
	background-color: black !important;
	border-radius: 1vw;
	right: 1rem;
}

.wp-block-navigation__responsive-container-open:after {
	content: "";
	display: block;
	position: absolute;
	top: 2vw !important;
	height: 1vw !important;
	right: 1rem;
	width: 10vw;
	background-color: black !important;
	border-radius: 1vw;
}

/* This makes the closing X */

.wp-block-navigation__responsive-container-close svg {
	display: none !important;
}

.wp-block-navigation__responsive-container-close:before {
	content: "";
	display: block;
	height: 1vw;
	width: 15vw;
	max-width: 100px;
	background-color: black !important;
	border-radius: .5vw;
	right: 45% !important;
	top: 150vw !important;
	transform: rotate(90deg);
	z-index: 20;
}

.wp-block-navigation__responsive-container-close {
  content: "";
  display: block;
  height: 1vw;
  width: 15vw;
  max-width: 100px;
  background-color: black !important;
  border-radius: .5vw;
  right: 45% !important;
  top: 150vw !important;
  transform: rotate(315deg);
  z-index: 20;
}


@media screen and (max-width: 781px) {
    header .current-menu-item a {
        background-color: rgba(0, 0, 0, 0.175);
    }
}