Затухающий текст

by Axelvaisper

HTML

<div class="text">
    <div>
        <span></span>Проблема в том, что никогда не нужно затухание всего текста, текст обрывается на последней строчке, её и нужно затухать. Пример, о чем я говорююю:
    </div>
</div>

CSS

div.text {
    width:300px;
    color:#000;
    position:relative;
    overflow:hidden;
}

div.text div {
    width:10000px
}

div.text span {
    width:9700px;
    float:right;
    height:40px;
    display:block}


div.text:after{
    content:"";
    position:absolute;
    bottom:-20px;
    right:-20px;
    width:30px;
    height:30px;
    border-radius:30px;
    background:#fff;
    box-shadow:-30px 30px 35px 55px #fff;
}