.fade-enter-active,.fade-leave-active{transition:opacity .32s ease-in-out}.fade-enter-from,.fade-leave-to{opacity:0}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50;margin-top:60px}html{justify-content:center}body,html{display:flex;align-items:center;margin:0}body{justify-content:space-between;min-height:100vh;background-color:#aeaeaf;font-family:system,-apple-system,BlinkMacSystemFont,sans-serif;font-size:20px;color:#5d6494;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.box,.container{width:220px;height:220px;display:flex;justify-content:center;align-items:center}.box{position:absolute;flex-direction:column;border-radius:3px;overflow:hidden;transition:box-shadow 1s ease}.badge{position:relative;margin-top:8px}.badge,.badge_bg{transition:all .6s ease;transition-delay:.32s;will-change:transform}.badge_bg{width:80px;height:80px;border-radius:100%;border:1px solid rgba(225,227,232,.18);box-shadow:0 3px 4px 0 rgba(44,71,146,.25);background-color:#fff;display:flex;justify-content:center;align-items:center}.title{position:relative}.card.loaded .box{box-shadow:0 3px 4px 0 rgba(44,71,146,.25);transition-delay:.32s}.card.loaded .badge_bg{transform:translateY(-32px) scale(6)}.card.loaded .badge{transform:translateY(-48px) scale(1.4)}.card{width:220px;height:220px;display:flex;justify-content:center;align-items:center;flex-direction:column}.text{position:relative;top:-32px;width:200px;text-align:center;transition:all .4s ease;transition-delay:.32s}.card.loaded .text{opacity:0;transform:translateY(-4px) scale(.8)}.box.success:after{content:"U bent succesvol verbonden, u kunt deze pagina sluiten!";color:#3d516a}.box.pending:after,.box.success:after{position:absolute;width:170px;top:111px;opacity:0;font-size:13px;line-height:20px;transition:all .3s ease;transition-delay:.32s}.box.pending:after{content:"Nog even geduld, de verbinding wordt nog tot stand gebracht!";color:#8d4e14}.box.failed:after{content:"Verbindig mislukt, probeert u het later opnieuw!";position:absolute;width:170px;top:111px;opacity:0;font-size:13px;color:#a24f4f;line-height:20px;transition:all .3s ease;transition-delay:.32s}.card.loaded .box:after{opacity:1}.loader{display:inline-block;position:relative;width:80px;height:80px}.loader div{position:absolute;top:33px;width:13px;height:13px;border-radius:50%;background:#3d516a;animation-timing-function:cubic-bezier(0,1,1,0)}.loader div:first-child{left:8px;animation:loader1 .6s infinite}.loader div:nth-child(2){left:8px;animation:loader2 .6s infinite}.loader div:nth-child(3){left:32px;animation:loader2 .6s infinite}.loader div:nth-child(4){left:56px;animation:loader3 .6s infinite}@keyframes loader1{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes loader3{0%{transform:scale(1)}to{transform:scale(0)}}@keyframes loader2{0%{transform:translate(0)}to{transform:translate(24px)}}