.menu{content:"";display:inline-block;position:relative;opacity:1;height:3px;width:30px;background-color:#fff;-webkit-transition:-webkit-transform .4s ease;transition:-webkit-transform .4s ease;transition:transform .4s ease;transition:transform .4s ease,-webkit-transform .4s ease}.menu.active{-webkit-transform:rotate(45deg) translateY(12px);transform:rotate(45deg) translateY(12px)}.menu.active:before{opacity:0}.menu.active:after{-webkit-transform:rotate(-450deg) translateX(16px);transform:rotate(-450deg) translateX(16px)}.menu:after,.menu:before{content:"";display:block;position:absolute;opacity:1;height:3px;width:30px;background-color:#fff}.menu:before{top:8px;-webkit-transition:opacity .4s ease;transition:opacity .4s ease}.menu:after{top:16px;-webkit-transition:-webkit-transform .4s ease;transition:-webkit-transform .4s ease;transition:transform .4s ease;transition:transform .4s ease,-webkit-transform .4s ease}