
.menu_back{width:60px;height:60px;background:#31345b;position:relative}

.menu_back2{width:60px;height:60px;background:#c90816;position:relative}

.menu_back span,.menu_back2 span{width:30px;height:5px;position:absolute;top:25px;left:15px;background:#ffffff;-moz-transition:all 500ms ease-in-out;-o-transition:all 500ms ease-in-out;-webkit-transition:all 500ms ease-in-out;transition:all 500ms ease-in-out;-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-webkit-transform:rotate(180deg);transform:rotate(180deg)} 

.menu_back span:before,.menu_back span:after,.menu_back2 span:before,.menu_back2 span:after{content:'';width:30px;height:5px;position:absolute;background:#ffffff;-moz-transition:all 500ms ease-in-out;-o-transition:all 500ms ease-in-out;-webkit-transition:all 500ms ease-in-out;transition:all 500ms ease-in-out;-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}

.menu_back span:before,.menu_back2 span:before{top:-10px;left:0}

.menu_back span:after,.menu_back2 span:after{top:10px;left:0}

.menu_back.active span,.menu_back2.active span{width:35px;left:13px;-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}

.menu_back.active span:before,.menu_back.active span:after,.menu_back2.active span:before,.menu_back2.active span:after{width:20px}

.menu_back.active span:before,.menu_back2.active span:before{top:-6px;left:-5px;-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}

.menu_back.active span:after,.menu_back2.active span:after{top:6px;left:-5px;-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}

.menu_close{width:60px;height:60px;background:#31345b;position:relative}

.menu_close2{width:60px;height:60px;background:#c90816;position:relative}

.menu_close span,.menu_close2 span{width:30px;height:5px;position:absolute;top:25px;left:15px;background:#ffffff;-moz-transition:all 500ms ease-in-out;-o-transition:all 500ms ease-in-out;-webkit-transition:all 500ms ease-in-out;transition:all 500ms ease-in-out;-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-webkit-transform:rotate(180deg);transform:rotate(180deg)}

.menu_close span:before,.menu_close span:after,.menu_close2 span:before,.menu_close2 span:after{content:'';width:30px;height:5px;position:absolute;background:#ffffff;-moz-transition:all 500ms ease-in-out;-o-transition:all 500ms ease-in-out;-webkit-transition:all 500ms ease-in-out;transition:all 500ms ease-in-out;-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}

.menu_close span:before,.menu_close2 span:before{top:-10px;left:0}

.menu_close span:after,.menu_close2 span:after{top:10px;left:0;opacity:1}

.menu_close.active span,.menu_close2.active span{width:40px;top:27px;left:10px;-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}

.menu_close.active span:before,.menu_close2.active span:before{width:40px;top:0;left:0;-moz-transform:rotate(-90deg);-ms-transform:rotate(-90deg);-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}

.menu_close.active span:after,.menu_close2.active span:after{opacity:0}

.next_back{width:60px;height:60px;background:#31345b;position:relative}

.next_back2{width:60px;height:60px;background:#c90816;position:relative}

.next_back span,.next_back2 span{width:35px;height:5px;position:absolute;top:25px;left:13px;background:#ffffff;-moz-transition:all 500ms ease-in-out;-o-transition:all 500ms ease-in-out;-webkit-transition:all 500ms ease-in-out;transition:all 500ms ease-in-out;-moz-transform:rotateY(0deg);-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}

.next_back span:before,.next_back span:after,.next_back2 span:before,.next_back2 span:after{content:'';width:20px;height:5px;position:absolute;background:#ffffff;-moz-transition:all 500ms ease-in-out;-o-transition:all 500ms ease-in-out;-webkit-transition:all 500ms ease-in-out;transition:all 500ms ease-in-out;-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}

.next_back span:before,.next_back2 span:before{top:-6px;left:20px;-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}

.next_back span:after,.next_back2 span:after{top:6px;left:20px;-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}

.next_back.active span,.next_back2.active span{-moz-transform:rotateY(180deg);-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}
