.button-medium{transition:all 0.4s ease-in-out}.effect-1,.effect-2,.effect-3,.effect-4{position:relative;z-index:0;overflow:hidden}.effect-1:after,.effect-2:after,.effect-3:after,.effect-4:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}.effect-1:after{top:auto;bottom:-100%;transition:bottom 0.4s ease-in-out}.effect-1:hover:after{bottom:0}.effect-2:after{background:red;top:-50px;transition:top 0.4s ease-in-out}.effect-2:hover:after{top:0}.effect-3:after{left:-100%;background:red;transition:left 0.4s ease-in-out}.effect-3:hover:after{left:0}.effect-4:after{left:auto;right:-100%;background:red;transition:right 0.4s ease-in-out}.effect-4:hover:after{right:0}