Testimonial Speech Bubble

by mlms13

HTML

<blockquote>
    <p>I'm taking a minute to write about my experience at the USF Monsour Executive Wellness Center. Over the past few years, like many of you, I've read about these all day comprehensive and collaborative physicals at many well known institutions around the country. When I discovered that in our community USF HEALTH offered these, I investigated both the diagnostic services offered and the financial value.</p>

    <p>I chose to move forward and spend the day with the Monsour Executive Wellness team…..it was time extremely well spent.</p>

<p>The comprehensiveness  of all of the tests, the attending physicians , the concierge like chaperoning, the same day reports were all, in and of themselves, terrific…but overshadowing of that was the personal and thoughtful  review conducted, at length, by Dr Brownlee. </p>

<p> As a husband ,a father, a grandfather, and an employer I feel a deep responsibility to many…it’s a very good feeling and protecting my health is the  primary responsibility  that we all share. I highly recommend the program , again time and money very well spent.</p>

</blockquote>

<div class="author">
    <span class="name">Joe Part</span>
    <span class="org">Founder, All Trust Insurance</span>
</div>

CSS

body {
    font-family: sans-serif;
    margin: 40px;
}
blockquote {
    background: #fff;
    border: 3px solid #555;
    border-radius: 8px;
    margin: 0;
    padding: 16px 0 0;
    position: relative;
}
blockquote:before, blockquote:after {
    bottom: 0;
    content: "";
    position: absolute;
}
blockquote:before {
    bottom: -42px;
    border: 42px solid transparent;
    border-left-color: #555;
    right: 80px;
}
blockquote:after {
    bottom: -32px;
    border: 32px solid transparent;
    border-left-color: #fff;
    right: 96px;
}
blockquote p {
    background: #fff;
    border-radius: 8px;
    font-size: 14px;
    margin: 0;
    padding: 0 12px 16px;
    position: relative;
    z-index: 1;
}
div.author {
    background: #eaeaea;
    margin: 8px 3px 0;
    padding: 14px;
}
div.author span {
    display: block;
}
div.author .name {
    font-size: 18px;
}
div.author .org {
    color: #555;
    font-size: 14px;
    font-style: italic;
}