/* ANIMATED BURGER MENU */

.c-hamburger {display:block; position:relative; overflow:hidden; margin:0; padding:0!important; width:74px; height:48px; font-size:0; appearance:none; transition:background .3s; background: transparent!important;}
.c-hamburger:focus {outline:0}

.c-hamburger span {
	display: block;
	position: absolute;
	top: 22px;
	left: 18px;
	right: 18px;
	height: 4px;
	background: #000;
}
.c-hamburger span::after, .c-hamburger span::before {
	position: absolute;
	display: block;
	left: 0;
	width: 100%;
	height: 4px;
	background: #000;
	content: "";
}
.c-hamburger span::before {top:-10px; background: #000;}
.c-hamburger span::after {bottom:-10px; background: #000;}

.c-hamburger--htla.is-active span::after,.c-hamburger--htla.is-active span::before,.c-hamburger--htra.is-active span::after,.c-hamburger--htra.is-active span::before{width:50%}



/* animations below - HTLA HTRA ROT HTX */

.c-hamburger--rot{background-color:#28aadc}

.c-hamburger--rot span{-webkit-transition:-webkit-transform .3s;transition:transform .3s}

.c-hamburger--rot.is-active{background-color:#166888}

.c-hamburger--rot.is-active span{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}

.c-hamburger--htx{background-color: transparent;/*Insert background for burger here*/}

.c-hamburger--htx span{-webkit-transition:background 0s .3s;transition:background 0s .3s}

.c-hamburger--htx span::after,.c-hamburger--htx span::before{-webkit-transition-duration:.3s,.3s;transition-duration:.3s,.3s;-webkit-transition-delay:.3s,0s;transition-delay:.3s,0s}

.c-hamburger--htx span::before{-webkit-transition-property:top,-webkit-transform;transition-property:top,transform}

.c-hamburger--htx span::after{-webkit-transition-property:bottom,-webkit-transform;transition-property:bottom,transform}

.c-hamburger--htx.is-active{background-color:#4b4b4b; /*Insert active background for burger here*/}

.c-hamburger--htx.is-active span{background:0 0}

.c-hamburger--htx.is-active span::before{top:0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}

.c-hamburger--htx.is-active span::after{bottom:0;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}

.c-hamburger--htx.is-active span::after,.c-hamburger--htx.is-active span::before{-webkit-transition-delay:0s,.3s;transition-delay:0s,.3s}

.c-hamburger--htla{background-color:#32dc64}

.c-hamburger--htla span{-webkit-transition:-webkit-transform .3s;transition:transform .3s}

.c-hamburger--htla span::before{-webkit-transform-origin:top right;-ms-transform-origin:top right;transform-origin:top right;-webkit-transition:-webkit-transform .3s,width .3s,top .3s;transition:transform .3s,width .3s,top .3s}

.c-hamburger--htla span::after{-webkit-transform-origin:bottom right;-ms-transform-origin:bottom right;transform-origin:bottom right;-webkit-transition:-webkit-transform .3s,width .3s,bottom .3s;transition:transform .3s,width .3s,bottom .3s}

.c-hamburger--htla.is-active{background-color:#18903c}

.c-hamburger--htla.is-active span{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}

.c-hamburger--htla.is-active span::before{top:0;-webkit-transform:translateX(38px)translateY(4px)rotate(45deg);-ms-transform:translateX(38px)translateY(4px)rotate(45deg);transform:translateX(38px)translateY(4px)rotate(45deg)}

.c-hamburger--htla.is-active span::after{bottom:0;-webkit-transform:translateX(38px)translateY(-4px)rotate(-45deg);-ms-transform:translateX(38px)translateY(-4px)rotate(-45deg);transform:translateX(38px)translateY(-4px)rotate(-45deg)}

.c-hamburger--htra{background-color:#ff9650}

.c-hamburger--htra span{-webkit-transition:-webkit-transform .3s;transition:transform .3s}

.c-hamburger--htra span::before{-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-transition:-webkit-transform .3s,width .3s,top .3s;transition:transform .3s,width .3s,top .3s}

.c-hamburger--htra span::after{-webkit-transform-origin:bottom left;-ms-transform-origin:bottom left;transform-origin:bottom left;-webkit-transition:-webkit-transform .3s,width .3s,bottom .3s;transition:transform .3s,width .3s,bottom .3s}

.c-hamburger--htra.is-active{background-color:#e95d00}

.c-hamburger--htra.is-active span{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}

.c-hamburger--htra.is-active span::before{top:0;-webkit-transform:translateX(-8px)translateY(4px)rotate(-45deg);-ms-transform:translateX(-8px)translateY(4px)rotate(-45deg);transform:translateX(-8px)translateY(4px)rotate(-45deg)}

.c-hamburger--htra.is-active span::after{bottom:0;-webkit-transform:translateX(-8px)translateY(-4px)rotate(45deg);-ms-transform:translateX(-8px)translateY(-4px)rotate(45deg);transform:translateX(-8px)translateY(-4px)rotate(45deg)}