@import url(https://fonts.googleapis.com/css?family=Lato);.card-frame textarea,header h1{-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);overflow:hidden}header,main{text-align:center;margin:30px auto}.card-embed-button span,.copied-success,body,footer a,footer textarea{color:var(--inverted-color)}:root{--bg-color:#323554;--inverted-color:#cdcaab;}body{margin:0;font-family:Lato,sans-serif;background-color:var(--bg-color)}header{width:100%;max-width:960px}header .og-wrapper{position:relative;width:100%;min-height:100px;text-align:center}header img{width:100%;height:auto;display:block}header h1{position:absolute;width:80%;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-1;margin:0}footer{width:100%;text-align:center;padding:15px 0 70px;margin:auto}footer textarea{max-width:500px;width:90%;height:55px;border: solid 1px var(--inverted-color);outline:0;background-color:transparent;border-radius:3px;padding:5px 10px;resize:none;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}footer textarea:hover{-webkit-box-shadow:0 0 10px 2px #5a59596e;box-shadow:0 0 10px 2px #5a59596e}main{max-width:900px}.card{margin-bottom:50px}.card.sources .card-frame{border:none;min-height:auto;}.card:last-of-type{margin-bottom:0}.card-frame{width:100%;min-height:200px;position:relative;overflow:hidden;border-style: solid;border-color: var(--inverted-color);border-width: 1px}.card-embed-button,.card-overlay{position:absolute;-webkit-transition:all .3s ease;-o-transition:all .3s ease}.card-overlay{width:100%;height:100%;top:0;left:0;background-color:rgba(0,0,0,.7);opacity:0;transition:all .3s ease}.card-frame.show-code .card-overlay{opacity:1;cursor:pointer}.card-embed-button{bottom:-50px;right:0;width:110px;height:50px;cursor:pointer;transition:all .3s ease;background:var(--bg-color)}.card-embed-button svg,.card-frame textarea{-webkit-transition:all .3s ease;-o-transition:all .3s ease;position:absolute}.card-embed-button svg{bottom:0;right:10px;width:30px;height:50px;fill:var(--inverted-color);transition:all .3s ease}.card-embed-button span{content:'Embed';position:absolute;bottom:17px;right:40px;opacity:0;-webkit-transition:all .6s ease;-o-transition:all .6s ease;transition:all .6s ease}.card-embed-button:hover{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}.card-frame:hover .card-embed-button{bottom:0}.card-frame:hover .card-embed-button span{opacity:1;right:47px}.card-frame.show-code .card-embed-button{bottom:-50px}.card-frame img{width:100%;height:auto;display:block}.card-frame textarea{width:80%;height:80%;max-width:500px;max-height:80px;left:50%;top:50%;transform:translate(-50%,-50%);outline:0;padding:5px 10px!important;font-size:14px;line-height:16px;font-family:Consolas;resize:none;opacity:0;pointer-events:none;transition:all .3s ease}.card-frame textarea:hover{-webkit-box-shadow:0 0 15px 10px #5a59596e;box-shadow:0 0 15px 10px #5a59596e}.card-frame.show-code textarea{opacity:1;pointer-events:all}.copied-success{background-color:var(--bg-color);padding:5px 10px;border-radius:3px;position:absolute;left:50%;top:calc(50% + 70px);-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);opacity:0;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}.copied-success.show{opacity:1}.footer-textarea-wraper{position:relative}