/* =======================================================================================================
   3XW v2.01 // OPTIONAL // Menu Options
   =======================================================================================================
    HAMBURGER ICON
   ------------------------------------------------------------------------------------------------------- */
.txw-menu-toggle, .txw-hamburger, .txw-hamburger::before, .txw-hamburger::after {
  transition-property: 	all, 	opacity,	transform,	border-color;
  transition-delay: 		0ms,	0ms,  		0ms, 		150ms;
  transition-duration: 	500ms,	500ms, 		500ms, 		350ms;		    /* transitions default */
}
.txw-hamburger {
  position: relative;						                            /* prepare for placement pseudo-elements */
  width: var(--hdr-ham-size);
  height: calc( 0.66 * var(--hdr-ham-size) );
  border: 2px solid var(--clr-link);									/* top and bottom stripes */
  border-left-width: 0px; border-right-width: 0px;
  opacity: 0.85;														/* match icon color */
}
.txw-hamburger::before, .txw-hamburger::after { 
  content:''; width: var(--hdr-ham-size); height: 2px;									/* center stripe twice */
  position: absolute; background: var(--clr-link);
  top: calc( 50% - 1px );
  left: calc( 50% - ( 0.5 * var(--hdr-ham-size) ) );
}
.txw-hamburger:hover { opacity: 1; }									/* match icon color on hover */

header .txw-hamburger { border-color: var(--hdr-clr-hamburger); }
header .txw-hamburger::before,
header .txw-hamburger::after { background-color: var(--hdr-clr-hamburger); }

.active .txw-hamburger {									            /* activated */
  width: 0px; height: 40px; border-color: rgba(255,255,255,0);	 		/* - top and border stripes fade and shrink */

  transition-property: 	all,	border-color;
  transition-delay: 		0ms,	100ms;
  transition-duration: 	500ms,	300ms;
}
.active .txw-hamburger::before { transform: rotate(45deg); }			/* - center strips form X */
.active .txw-hamburger::after { transform: rotate(-45deg); }