.te-wrapper{
    position: relative;
    display: inline-block;
}
.te-wrapper textarea, .te-wrapper input{
    width:inherit;
    height:inherit;
    font-family: "Courier New", Courier, monospace;
    font-size: 12px;
}
.te-wrapper .te-mask{
    position:absolute;
    top:0;
    left:0;
    padding:5px;
/*    background-color:#fff; */
    z-index:-1;
    text-align: left;
    color:rgba(0,0,0,0);
    font-family: "Courier New", Courier, monospace;
    font-size: 12px;
    white-space: pre-wrap;
    word-wrap: break-word;
  /*  width:300px; */
/*    height:300px; */
}
.te-wrapper .te-mask span{
    z-index: 10;
    position:absolute;
   /* animation-timing-function: linear; */
    animation-delay: .1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
}
/* Animations ============================ */
/* zoom */
@keyframes zoom {
    0% {
        transform:scale(1,1);
    }
    50% {
        transform:scale(1.5,1.5);
    }
    100% {
        transform:scale(1,1);
    }
}
@-webkit-keyframes zoom {
    0% {
        -webkit-transform:scale(1,1);
    }
    50% {
        -webkit-transform:scale(1.5,1.5);
    }
    100% {
        -webkit-transform:scale(1,1);
    }
}
/* explode */
@keyframes explode {
    0% {
        transform:scale(1,1) translateY(-5%);
    }
    50% {
        transform:scale(1.5,1.5) translateY(-5%);
        opacity:1;
    }
    100% {
        transform:scale(2,2) translateY(-5%);
        opacity:0;
    }
}
@-webkit-keyframes explode {
    0% {
        -webkit-transform:scale(1,1) translateY(-5%);
    }
    50% {
        -webkit-transform:scale(1.5,1.5) translateY(-5%);
    }
    100% {
        -webkit-transform:scale(2,2) translateY(-5%);
        opacity:0;
    }
}
/* shake */
@keyframes shake {
    0% {
        transform:translateX(0);
    }
    10%,30%,50%,70%,90% {
        transform:translateX(5px);
    }
    20%,40%,60%,80%,100% {
        transform:translateX(-5px);
    }
}
@-webkit-keyframes shake {
    0% {
        -webkit-transform:translateX(0);
    }
    10%,30%,50%,70%,90% {
        -webkit-transform:translateX(5px);
    }
    20%,40%,60%,80%,100% {
        -webkit-transform:translateX(-5px);
    }
}
/* blink */
@keyframes blink {
    0% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
@-webkit-keyframes blink {
    0% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
/* ease */
@keyframes ease {
    0% {
        transform:scale(1,1) translateY(-5%);
    }
    50% {
        transform:scale(1,2) translateY(-5%);
    }
    100% {
        transform:scale(1,1) translateY(-5%);
    }
}
@-webkit-keyframes ease {
    0% {
        -webkit-transform:scale(1,1) translateY(-5%);
    }
    50% {
        -webkit-transform:scale(1,2) translateY(-5%);
    }
    100% {
        -webkit-transform:scale(1,1) translateY(-5%);
    }
}
/* rotate  */
@keyframes rotate {
    0% {
        transform:rotate(0deg);
    }
    100% {
        transform:rotate(359deg);
    }
}
@-webkit-keyframes rotate {
    0% {
        -webkit-transform:rotate(0deg);
    }
    100% {
        -webkit-transform:rotate(359deg);
    }
}
/* bounce */
@keyframes bounce {
    0% {
        transform: translate3d(0,-10px,0);
    }
    50% {
        transform: translate3d(0,10px,0);
    }
    100% {
        transform: translate3d(0,0,0);
    }
}
@-webkit-keyframes bounce {
    0% {
        -webkit-transform: translate3d(0,-10px,0);
    }
    50% {
        -webkit-transform: translate3d(0,10px,0);
    }
    100% {
        -webkit-transform: translate3d(0,0,0);
    }
}
/* flipy */
@keyframes flipy {
    0% {
        transform:rotateY(0deg);
    }
    100% {
        transform:rotateY(359deg);
    }
}
@-webkit-keyframes flipy {
    0% {
        -webkit-transform:rotateY(0deg);
    }
    100% {
        -webkit-transform:rotateY(359deg);
    }
}
/* flipx */
@keyframes flipx {
    0% {
        transform:rotateX(0deg) translateY(-5%);
    }
    100% {
        transform:rotateX(359deg) translateY(-5%);
    }
}
@-webkit-keyframes flipx {
    0% {
        -webkit-transform:rotateX(0deg) translateY(-5%);
    }
    100% {
        -webkit-transform:rotateX(359deg) translateY(-5%);
    }
}