
@keyframes animation
{
    from { top:0%;

    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top:30px;
     filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
    -moz-opacity:0; /*Firefox私有，透明度50%*/
    opacity:0;/*其他，透明度50%*/
    }
}


@keyframes myfirst
{
    from {top:0px;

    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
     filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
    -moz-opacity:0; /*Firefox私有，透明度50%*/
    opacity:0;/*其他，透明度50%*/
    }
}

@-moz-keyframes myfirst /* Firefox */
{
    from {top:0px;

    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
     filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
    -moz-opacity:0; /*Firefox私有，透明度50%*/
    opacity:0;/*其他，透明度50%*/
    }
}

@-webkit-keyframes myfirst /* Safari 和 Chrome */
{
    from {top:0px;

    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
     filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
    -moz-opacity:0; /*Firefox私有，透明度50%*/
    opacity:0;/*其他，透明度50%*/
    }
}

@-o-keyframes myfirst /* Opera */
{
    from {top:0px;
    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
     filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
    -moz-opacity:0; /*Firefox私有，透明度50%*/
    opacity:0;/*其他，透明度50%*/
    }
}


@keyframes myfirst2
{
 from {top:0px;
    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
         filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
        -moz-opacity:0; /*Firefox私有，透明度50%*/
        opacity:0;/*其他，透明度50%*/
    }
}

@-moz-keyframes myfirst2 /* Firefox */
{
 from {top:0px;
    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
         filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
        -moz-opacity:0; /*Firefox私有，透明度50%*/
        opacity:0;/*其他，透明度50%*/
    }
}

@-webkit-keyframes myfirst2 /* Safari 和 Chrome */
{
 from {top:0px;
    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
         filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
        -moz-opacity:0; /*Firefox私有，透明度50%*/
        opacity:0;/*其他，透明度50%*/
    }
}

@-o-keyframes myfirst2 /* Opera */
{
 from {top:0px;
    filter:alpha(opacity=100); /*IE滤镜，透明度50%*/
    -moz-opacity:1; /*Firefox私有，透明度50%*/
    opacity:1;/*其他，透明度50%*/
    }
    to {top: 30px;
         filter:alpha(opacity=0); /*IE滤镜，透明度50%*/
        -moz-opacity:0; /*Firefox私有，透明度50%*/
        opacity:0;/*其他，透明度50%*/
    }
}




@keyframes cpHeight
{
    from {height:0px;
    }
    to { height:210px;
    }
}

@-moz-keyframes cpHeight
{
    from {height:0px;
    }
    to { height:210px;
    }
}

@-webkit-keyframes cpHeight
{
    from {height:0px;
    }
    to { height:210px;
    }
}

@-o-keyframes cpHeight
{
    from {height:0px;
    }
    to { height:210px;
    }
}