/* 60-responsive_menu.css */

.c-responsive-menu__move {
  position: relative;
}

.c-responsive-menu__toggle {
  /* positioning */

  /* layout */
  align-items: center;
  display: flex;
  flex-direction: column;
  height: 2.5em;
  justify-content: center;
  width: 2.5em;

  /* appearance */
  background-color: transparent;
  border: none;
  cursor: pointer;
  margin-left: inherit;
  margin-right: inherit;
}

.c-responsive-menu__toggle span {
	display: block;
	width: 25px;
	height: 4px;
	margin: 2px;
	transition: background-color 0.2s ease-in-out,
							transform 0.2s ease-in-out,
							opacity 0.2s ease-in-out;
	background-color: gray;
}

.c-responsive-menu__toggle[behavior-toggle-menu=open] span:first-child {
    margin: 0;
    position: absolute;
    transform: rotate(45deg);
    width: 30px;
}

.c-responsive-menu__toggle[behavior-toggle-menu=open] span:nth-child(2) {
    opacity: 0;
}

.c-responsive-menu__toggle[behavior-toggle-menu=open] span:last-child {
    margin: 0;
    position: absolute;
    transform: rotate(-45deg);
    width: 30px;
}

/* styles for larger screens */
@media (min-width: 40em) {

}
