@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400);.card,.content{position:relative}.badgescard,.card{border-radius:3px;box-shadow:0 10px 20px rgba(0,0,0,.2)}.badgescard,.firstinfo{display:flex;justify-content:center;align-items:center}*,:after,:before{box-sizing:border-box}.bio{font-size:12px}.content{animation:.9s cubic-bezier(.425,1.14,.47,1.125) forwards animatop}.card{min-height:215px;max-height:200px;padding:20px;background-color:#fff;overflow:hidden}.badgescard,.card:after,.firstinfo{position:absolute}.card:after{content:'';display:block;width:190px;height:400px;background:#fc8029;animation:.75s cubic-bezier(.425,1.04,.47,1.105) 1s both rotatemagic}.badgescard{padding:10px 20px;background-color:#ececec;width:480px;z-index:-1;left:10px;bottom:10px;animation:.5s cubic-bezier(.425,1.04,.47,1.105) .75s forwards animainfos}.badgescard span{font-size:1.6em;margin:0 6px;opacity:.6}.firstinfo{flex-direction:row;z-index:2}.firstinfo img{border-radius:50%;width:120px;height:120px}.firstinfo .profileinfo{padding:0 10px}.firstinfo .profileinfo h1{font-size:1.8em}.firstinfo .profileinfo h3{font-size:1.2em;color:#009688;font-style:italic}.firstinfo .profileinfo p.bio{padding:10px 0;color:#5a5a5a;line-height:1.2;font-style:initial}@keyframes animatop{0%{opacity:0;bottom:-500px}100%{opacity:1;bottom:0}}@keyframes animainfos{0%{bottom:10px}100%{bottom:-42px}}@keyframes rotatemagic{0%{opacity:0;transform:rotate(0);top:-24px;left:-253px}100%{transform:rotate(-30deg);top:-24px;left:-78px}}