Best CSS blockquote styles / designs for HTML5 websites

best-css-blockquote-styles.css

/*www.lsauer.com, lo sauer 2013
*/
@media screen {
  blockquote {
    display: block;
    margin: 1.5em 0 1.5em -1.5em;
    padding: .75em .5em .75em 1em;
    background: #fff;
    border-left: 0.5em solid #DDD;
    font-size: 1em;
    line-height: 1.5;
    -webkit-box-shadow: 0 0 5px rgba(20,20,20,0.5);
    -moz-box-shadow: 0 0 5px rgba(20,20,20,0.5);
    box-shadow: 0 0 5px rgba(20,20,20,0.5);
  }
  
  blockquote:before {
    display: block;
    height: 0px;
    margin-left: -.95em;
    font: italic 450% serif,Georgia,Cochin;
    color: #999;
    position: relative;
    top: -30px;
    content: "\"";
  }
  
  blockquote::selection {
    background: rgba(50,50,50,.5);
    color: #FFF;
  }
}