Beautifull Blockquote With Hover Effects For Blogger Blogs

Add CSS Style Sheet in Blogger Template:

• Backup your template

• Go to Blogger >> Your Blog >> Template >> Layout >>  EDIT HTML >> Proceed 

• And now Search For ]]>

With (CTRL+F)

• After you find ]]>

just above it paste the following coding

/**************************************************
 www.TricksIsland.com  post blockquote
***************************************************/
.post blockquote
{
font-size: 15px;font-family: Verdana;font-weight: normal;font-style:italic;
background-color: #F2F1F1;
color: #000;
margin: 5px 10px;
padding: 20px 20px 20px 20px;
border: 2px dotted lightgrey;
border-radius: 10px;
box-shadow: -1px -1px 12px 2px gainsboro;
transition: background-color .777s;
-webkit-transition: background-color .777s;
-moz-transition: background-color .777s;
-o-transition: background-color .777s;
-ms-transition: background-color .777s;
}
.post blockquote:hover
{
background-color: darkgreen ;
color: #fff;
}
.post blockquote:active
{
background-color: CornflowerBlue ;
color: #000;
}

Note 1: 
If you want to change to change the backgrounf color then please change darkgreen and CornflowerBlue to your color eg.darkblue or lightblue or any hex code eg. #ffffff (White) or #000000 (Black)...


Now After pasting the above code save your template by clicking Save Template Button
That's All...... You Are Done.