/*burger menu*/
.menubtn
{
    width:30px;
    position:relative;
    float:left;
    height:100%;
    margin-top: 46px;
}
.menu_item 
{
    padding:1vw;
    border-bottom:1px solid rgba(255,255,255, 0.4);
     font-size:24px; 
     line-height:1vw; 
}
.menu_item a {line-height:1.6vw;}
 .mobile-menu {
     max-width:100%; 
     width: 100%;
     font-weight: 500; 
     position:fixed; 
     float:right;
     top:0vh; 
     bottom:0; 
     height:0; 

     z-index:1; 
     padding-top:0%;
	}

	body.is-menu-active .mobile-menu {
        top:6vh;
        height:200px; 
        overflow-x: hidden;
        overflow-y: scroll;
	}

.mobile-btn 
{
    position:absolute; 
    bottom: 20%;
    right: 2%;
    z-index:600;
    -webkit-transition: all 1800ms ease; 
    -moz-transition: all 1800ms ease; 
    transition: all 1800ms ease; 
    padding:0;
    cursor:pointer;
    border:none;
    z-index: 10001;
    max-width: 30px;
    width: 1005%;
    height:5vh;
    max-height:27px;
}
 .menu_selection
{
    width: 100%;
    /*max-width:180px;*/
    height:0;
    position: relative;
    margin:0 auto;
    margin-top: 0%;
    background: rgba(50,181,208, 0.8);
    -webkit-transition: all 1.5s cubic-bezier(.25,.34,.17,.86); /*all 520ms ease; */
    -moz-transition: all 1.5s cubic-bezier(.25,.34,.17,.86); /*all 520ms ease; */
    transition: all 1.5s cubic-bezier(.25,.34,.17,.86); /*all 520ms ease; */ 
}
body.is-menu-active .menu_selection {
    height:auto; 
}
body.is-menu-active .mobile-btn {
	bottom: 80%;
    right: 5%;
}
.c-hamburger {		
	display: block;
	position: relative;
	overflow: hidden;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
	text-indent: -9999px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	box-shadow: none;
	border-radius: 0;
	background:none;
	border: none;
	cursor: pointer;
	-webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    transition: background 0.3s;
}	
.c-hamburger:focus {
	outline: none;
}	
.c-hamburger span {
	display: block;
	position: absolute;
	top:0px;
	left: 0px;
	right: 0px;
	height: 3px;
	background: #32b5d0;
	}	
.c-hamburger span::before,
.c-hamburger span::after {
	position: absolute;
	display: block;
	left: 0;
	width: 100%;
	height:3px;	  
	background-color: #32b5d0;
	content: "";
}
.c-hamburger span::before {
	top:18px;
}
.c-hamburger span::after {
	top:9px;
}
.c-hamburger--htx {
	  
}
.c-hamburger--htx span {
	-webkit-transition: background 0s 0s;
			transition: background 0s 0s;
            -webkit-transition-delay: 0s, 0s;
			transition-delay: 0s, 0s;
}
.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
	-webkit-transition-duration: 0.3s, 0.3s;
			transition-duration: 0.3s, 0.3s;
	-webkit-transition-delay: 0s, 0s;
			transition-delay: 0s, 0s;
}
.c-hamburger--htx span::before {
	-webkit-transition-property: top, -webkit-transform;
			transition-property: top, -webkit-transform;
			transition-property: top, transform;
			transition-property: top, transform, -webkit-transform;
}
.c-hamburger--htx span::after {
    -webkit-transition-property: top, -webkit-transform;
			transition-property: top, -webkit-transform;
			transition-property: top, transform;
			transition-property: top, transform, -webkit-transform;
}
/* active state, i.e. menu open */
.c-hamburger--htx.is-active {
	  
}
.c-hamburger--htx.is-active span {
	background: none;
}
.c-hamburger--htx.is-active span::before {
	top: 12px;
    background-color:#32b5d0;
	-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
}
.c-hamburger--htx.is-active span::after {
	/*bottom: 0;*/
    top: 12px;
    background-color:#32b5d0;
	-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
}
.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
	-webkit-transition-delay: 0s, 0s;
			transition-delay: 0s, 0s;
}

/*MEDIA SCREEN*/
@media screen and (max-height:770px) {
    .mobile-menu {top: 6vh;height: 0;}
}

@media screen and (max-height:420px) {
    /* .mobile-menu {top: -200vh; overflow-y: scroll;}
    .menu_selection {height: 100vw;}
    .mobile-btn {bottom: 8%; height: 9vh;}
    body.is-menu-active .mobile-btn {right: 5%;} */
}
@media screen and (max-height:360px) {
    /* .mobile-menu {top: -250vh; overflow-y: scroll;}
    .menu_selection {height: 100vw;}
    .mobile-btn {bottom: 8%; height: 9vh;} */
}