@import url(https://fonts.googleapis.com/css?family=Open+Sans:600,400,300,300italic);.frame{position:absolute;top:50%;left:50%;width:400px;height:400px;margin-top:-200px;margin-left:-200px;border-radius:2px;box-shadow:1px 2px 10px 0px rgba(0,0,0,0.3);background:#4CB6DE;color:#fff;font-family:'Open Sans', Helvetica, sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.quote{position:relative;margin-top:90px;padding:0 30px}.quote:before{display:block;position:absolute;z-index:0;content:',,';font-family:Arial;font-size:250px;color:#6AC2E3;line-height:35px;top:-100px;left:7px}.quote p{position:relative;z-index:1;font-size:24px;line-height:35px;margin:20px 0}.quote .author{font-weight:300;font-style:italic;font-size:20px;line-height:28px}.quote .tooltip{position:relative;display:inline-block;background:#286F8A;padding:0px 8px 5px 8px;margin:-10px 0;cursor:pointer}.quote .tooltip:hover .info,.quote .tooltip:focus .info{visibility:visible;opacity:1;transform:translate3d(0, 0, 0)}.quote .tooltip .info{box-sizing:border-box;position:absolute;bottom:53px;left:-85px;display:block;background:#286F8A;width:300px;font-size:16px;line-height:24px;cursor:text;visibility:hidden;opacity:0;transform:translate3d(0, -20px, 0);transition:all .5s ease-out}.quote .tooltip .info:before{position:absolute;content:'';width:100%;height:14px;bottom:-14px;left:0}.quote .tooltip .info:after{position:absolute;content:'';width:10px;height:10px;transform:rotate(45deg);bottom:-5px;left:50%;margin-left:-5px;background:#286F8A}.quote .tooltip .info .pronounce{display:block;background:#fff;color:#286F8A;padding:8px 17px 10px 17px;line-height:16px}.quote .tooltip .info .pronounce .fa{position:relative;margin-left:10px;top:1px;cursor:pointer;transition:all .2s ease-out}.quote .tooltip .info .pronounce .fa:hover{transform:scale(1.15) translate3d(0, 0, 0);backface-visibility:none}.quote .tooltip .info .text{display:block;padding:13px 17px}