@charset "UTF-8";
/* CSS Document */

/* TOGGLE */
.toggle { width:40px; height:40px; padding:10px 2px; cursor:pointer; display:block; background-color: rgba(0,0,0,0); box-sizing: border-box; pointer-events:all; position: absolute; top:8px; right:0; z-index: 9999;}
.toggle .in { padding:0; box-sizing: border-box; }

.toggle span { display:block; width:100%; height:2px; background:#000; }
.open .toggle span { background:#FFF;}

.toggle span.t2 { margin:7px 0; }

.toggle, .toggle span { transition:all 0.3s cubic-bezier(0.42, 0.02, 0.33, 1.05);}
.open .toggle span.t2 { opacity:0; }
.open .toggle {}
.open .toggle span.t1 { transform: translate(0px, 9px) rotate(135deg);}
.open .toggle span.t3 { transform: translate(0px, -9px) rotate(-135deg);}


@media screen and (max-width:680px) {
.toggle { width:40px; height:32px; padding:7px 9px; top:1px; right:-4px;}
.toggle .in { padding:0; box-sizing: border-box; }

.toggle span.t2 { margin:6px 0; }

.toggle, .toggle span { transition:all 0.3s cubic-bezier(0.42, 0.02, 0.33, 1.05);}
.open .toggle span.t2 { opacity:0;}
.open .toggle {}
.open .toggle span.t1 { transform: translate(0px, 8px) rotate(135deg);}
.open .toggle span.t3 { transform: translate(0px, -8px) rotate(-135deg);}

}