.card{z-index:9999;position:relative;margin-top:260px;margin-bottom:430px;right:120px}.card ul{list-style:none;text-align:center;position:absolute;left:50%;top:50%;margin-left:-125px;margin-top:-180px}.card h1,.card span,.card a{z-index:99;position:relative}.card ul li{display:block;position:absolute;background-color:#fefefe;width:250px;height:320px;top:0;left:0;transform:rotate(10deg) skew(-60deg);transform-origin:bottom center;box-shadow:10px 10px 30px rgba(0,0,0,.3);transition:.4s;z-index:-1;overflow:hidden}.card ul li:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:10px;background:#28fff7;background:-moz-linear-gradient(45deg,rgba(40,255,247,1) 0%,rgba(129,40,255,1) 100%);background:-webkit-linear-gradient(45deg,rgba(40,255,247,1) 0%,rgba(129,40,255,1) 100%);background:linear-gradient(45deg,rgba(40,255,247,1) 0%,rgba(129,40,255,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28fff7', endColorstr='#8128ff',GradientType=1 );transition:.6s}.card ul li h1{font-size:2.2em;background:-webkit-linear-gradient(#28fff7,#8128ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-top:18px;transition:.4s}.card ul li>span{font-size:1.3em;color:#999}.card ul li a{display:inline-block;padding:10px 20px;top:40px;border:1px solid #fff;transition:all .7s cubic-bezier(.68,0,.265,1.55);color:#fff;text-decoration:none;transform:scale(0);position:relative;overflow:hidden}.card ul li a:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:0%;transform-origin:center top;background-color:rgba(0,0,0,.3);border-radius:100% 0 0 0;transition:all .6s linear}.card ul li:hover a:hover:after{height:1000%;width:100%;position:absolute}.card ul li a:hover{border-color:transparent;transform:scale(1.2)!important}.card ul li:nth-child(1) {transform:rotate(20deg) skew(-20deg) translate(10px,10px)}.card ul li:nth-child(2) {transform:rotate(20deg) skew(-20deg) translate(0,0)}.card ul li:nth-child(3) {transform:rotate(20deg) skew(-20deg) translate(-10px,-10px)}.card ul:hover li:nth-child(1) {transform:rotate(40deg) skew(0) translate(100px,0)}.card ul:hover li:nth-child(2) {transform:rotate(0) skew(0)}.card ul:hover li:nth-child(3) {transform:rotate(-40deg) skew(0) translate(-100px,0)}.card ul:hover li:hover{z-index:9;background-color:#0e1826;box-shadow:10px 10px 40px rgba(0,0,0,.5)}.card ul:hover li:hover a{top:30px;transform:scale(1)}.card ul:hover li:hover:after{height:100%}.card ul:hover li:hover *{color:#fff;background:-webkit-linear-gradient(#fff,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}