How to style your post blockquote - Style 2

This is the live preview of blockquote style 2. Please hover this blockquote to see the hover effect. To use blockquote, highlight the text and click .   To have this kind of blockquote in your blog, simply follow the instruction below.

1. Blogskins/ Classic template : Paste the codes given before/above </style>

2. Template designer : Paste codes given before/above ]]></b:skin> 

blockquote { background:url(http://i.imgur.com/2qzVi.png); padding:15px; border:1px solid #E4F2C7; border-left:20px solid #E4F2C7; border-right:1px solid #E4F2C7; color:#aaaaaa; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; margin-top:10px; margin-bottom:10px; } blockquote:hover { padding:15px; border-left:1px solid #F2EAC7; border-right:20px solid #F2EAC7; color:#555; }