CSS text effect style : demo 162

                        

                            Best jQuery
                        
                    

                    .text-effect{
                        font-family: 'Creepster', cursive;
                        font-size: 100px;
                        font-weight: 700;
                        text-align: center;
                        transform: rotate(-8deg);
                        text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 
                                        2px 2px 0 #fff, 6px 6px 0 #1E7C11, 10px 10px 0 #B2D054, 
                                        14px 14px 0 #311509, 18px 18px 0 #1E7C11, 22px 22px 0 #B2D054;
                        animation: tripy 0.33s infinite;
                    }
                    @keyframes tripy{
                        0%{
                            color: #311509;
                            text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff, 6px 6px 0 #1E7C11, 10px 10px 0 #B2D054, 14px 14px 0 #311509, 18px 18px 0 #1E7C11, 22px 22px 0 #B2D054;
                        }
                        33%{
                            color: #1E7C11;
                            text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff, 6px 6px 0 #B2D054, 10px 10px 0 #311509, 14px 14px 0 #1E7C11, 18px 18px 0 #B2D054, 22px 22px 0 #311509;
                        }
                        66%{
                            color: #B2D054;
                            text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff, 6px 6px 0 #311509, 10px 10px 0 #1E7C11, 14px 14px 0 #B2D054, 18px 18px 0 #311509, 22px 22px 0 #1E7C11;
                        }
                        100%{
                            color: #311509;
                            text-shadow: -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff, 6px 6px 0 #1E7C11, 10px 10px 0 #B2D054, 14px 14px 0 #311509, 18px 18px 0 #1E7C11, 22px 22px 0 #B2D054;
                        }
                    }
                    @media only screen and (max-width: 990px){
                        .text-effect{ font-size: 80px; }
                    }
                    @media only screen and (max-width: 767px){
                        .text-effect{ font-size: 60px; }
                    }
                    @media only screen and (max-width: 576px){
                        .text-effect{ font-size: 45px; }
                    }