<!-- *** Matrix Add-ons blockquote *** -->
<div class="is-matrix cc-clearover">
    <div class="col-6">
        <div class="fa fa-quote-left fa-4x absolute-top-left" style="top:-10px;opacity:0.2;font-size:50px;">
        </div>
        <span style="font-size:25px;">Whatever it is, the way you tell your story online can make all the difference</span>
        <p class="weight-500 size-11 add-top-5">
            ( Quote style 1 )
        </p>
    </div>
</div>

<!-- *** Matrix Add-ons blockquote *** -->
<div class="is-matrix content-teaser bg-primary color-white is--flex is-flex-block cc-clearover">
    <div class="left-align col-12 add-20 cc-box">
        <div class="fa fa-quote-left fa-5x" style="margin-top:-30px;opacity:0.6;">
        </div>

        <p>
            Whatever it is, the way you tell your story online can make all the difference
        </p>

        <p class="add-top-10 size-13">
            - Quote ( Style 3 )
        </p>
    </div>
</div>

<!-- *** Matrix Add-ons blockquote *** -->
<div class="is-matrix bg-grey">
    <div class="hs-left-50 col-12">
        
    </div>

    <div class="hs-right-50 col-12 pull-top-50">
        <div class="gutter-20 clearover">
            
            <div class="center-align">
                <center>
                    <div class="fa fa-quote-left fa-4x rel" style="color:#888;">
                    </div>
                </center>
                <span style="font-size:19px;">Whatever it is, the way you tell your story online can make all the difference Sed porttitor lectus nibh</span>
                <p class="add-top-10">
                    (Style 4)
                </p>
            </div>
           
        </div>
    </div>
</div>

<!-- *** Matrix Add-ons blockquote *** -->
<div class="is-matrix bg-transparent">
    <center>
        <div class="col-6">
            <div class="image_wrapper resp-img" style="max-width:120px;">
                <img style="margin-top:-10px; border-radius:500px;" src="https://u.jimcdn.com/cms/o/sdc1e1935163480b6/userlayout/img/500x500.jpg?t=1568284490" alt="" />
            </div>
        </div>

        <div class="hs-right-50 col-12 pull-top-50">
            <div class="gutter-20 clearover">
                <!-- ************** Quote teaser ************** -->

                <center>
                    <div class="fa fa-quote-left fa-4x rel center-align" style="opacity:0.6;">
                    </div>
                </center>
                <span style="font-size:19px;">Whatever it is, the way you tell your story online can make all the difference</span>
                <p class="add-top-10">
                    (Quote 5)
                </p>
            </div>
            <!-- ************** End Quote teaser ************** -->
        </div>
    </center>
</div>

<!-- *** Matrix Add-ons blockquote *** -->
<div class="is-matrix bg-primary color-white mid-round">
    <center>
        <div class="col-6">
            <div class="image_wrapper resp-img" style="max-width:120px;">
                <img style="margin-top:-10px; border-radius:500px;" src="https://u.jimcdn.com/cms/o/sdc1e1935163480b6/userlayout/img/500x500.jpg?t=1568284490" alt="" />
            </div>
        </div>

        <div class="hs-right-50 col-12 pull-top-50">
            <div class="gutter-20 clearover">
                <!-- ************** Quote teaser ************** -->

                <center>
                    <div class="fa fa-quote-left fa-3x rel center-align" style="opacity:0.8;">
                    </div>
                </center>
                <span style="font-size:19px;">Whatever it is, the way you tell your story online can make all the difference</span>
                <p class="add-top-10">
                    (Quote 7)
                </p>
            </div>
            <!-- ************** End Quote teaser ************** -->
        </div>
    </center>
</div>

<!-- *** Matrix Add-ons blockquote *** -->
<div class="is-matrix bg-primary-dark color-white mid-round">
    <center>
        <div class="col-6">
            <div class="image_wrapper resp-img" style="max-width:120px;">
                <img style="margin-top:-10px; border-radius:500px;" src="https://u.jimcdn.com/cms/o/sdc1e1935163480b6/userlayout/img/500x500.jpg?t=1568284490" alt="" />
            </div>
        </div>

        <div class="hs-right-50 col-12 pull-top-50">
            <div class="gutter-20 clearover">
                <!-- ************** Quote teaser ************** -->

                <center>
                    <div class="fa fa-quote-left fa-3x rel center-align" style="opacity:0.8;">
                    </div>
                </center>
                <span style="font-size:19px;">Whatever it is, the way you tell your story online can make all the difference</span>
                <p class="add-top-10">
                    (Quote 8)
                </p>
            </div>
            <!-- ************** End Quote teaser ************** -->
        </div>
    </center>
</div>