<div class="content-row" style="padding: 30px 0 40px;">
    <div class="row">
        <div class="col-lg-7">
            <h2>OUR HISTORY</h2>
            <p style="font-family:'Open Sans';font-size:15px;font-weight:400;color:#767f84;margin-bottom:20px;line-height:2;padding-right: 25px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus a eros in venenatis. Cras mauris arcu, suscipit id lacinia sed, pulvinar in urna. Donec urna nisi, efficitur fermentum ullamcorper non, mattis et est. Nullam malesuada leo leo, non tempus turpis accumsan a. Sed tincidunt feugiat purus, sed lobortis justo consequat in. Phasellus lectus magna, accumsan eget felis in, hendrerit malesuada lectus. Duis orci nunc, vulputate vel sapien nec, sodales sollicitudin ligula.</p>
        </div>
        <div class="col-lg-5">
            <h2>CLIENT REVIEWS</h2>
            <div id="testimonials-slider" class="owl-carousel owl-theme">
                <div class="item">
                    <div class="testimonial-author">
                        <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client1.png"}}" alt=""/></div>
                        <p><strong>John Smith</strong><span>Porto CO SEO</span></p>
                    </div>
                    <blockquote class="testimonial">
                        <p>Lorem ipsum dolor sit amet, consectetur elitad adipiscing Cras non placerat mipsum dolor sit amet, consectetur elitad adipiscing.</p>
                    </blockquote>
                </div>
                <div class="item">
                    <div class="testimonial-author">
                        <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client2.png"}}" alt=""/></div>
                        <p><strong>Bob Smith</strong><span>Porto CO SEO</span></p>
                    </div>
                    <blockquote class="testimonial">
                        <p>Lorem ipsum dolor sit amet, consectetur elitad adipiscing Cras non placerat mipsum dolor sit amet, consectetur elitad adipiscing.</p>
                    </blockquote>
                </div>
            </div>
            <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#testimonials-slider").owlCarousel({
                    items: 1,
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    margin: 0,
                    nav: false,
                    dots: false,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true
                });
            });
            </script>
        </div>
    </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#f1f1f1;padding:50px 0 30px;">
    <div class="container">
        <h2>PHOTO GALLERY</h2>
        <div class="photo-gallery">
            <div class="row">
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery1.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery2.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery3.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery4.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-row" style="padding: 60px 0">
    <div class="row">
        <div class="col-lg-6">
            <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/our-mission.jpg"}}" alt="" style="width: 100%;" />
        </div>
        <div class="col-lg-6">
            <div style="padding:45px 0 45px 20px;">
                <h2>OUR MISSION</h2>
                <p style="font-size:15px;font-weight:400;line-height:1.8;color:#767f84;margin-bottom: 30px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;max-height: 77px;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.</p>
                <h2>OUR VISION</h2>
                <p style="font-size:15px;font-weight:400;line-height:1.8;color:#767f84;margin-bottom:0;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;max-height: 77px;">Standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only look now. </p>
            </div>
        </div>
    </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#f1f1f1;">
    <div class="container">
        <div class="support-block row">
            <div class="col-lg-4">
                <i class="porto-icon-shipped"></i>
                <h3>FREE SHIPPING</h3>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
            </div>
            <div class="col-lg-4">
                <i class="porto-icon-us-dollar"></i>
                <h3>100% MONEY BACK GUARANTEE</h3>
                <p>There are many variations of passages of Lorem Ipsum available, but the majority.</p>
            </div>
            <div class="col-lg-4">
                <i class="porto-icon-online-support"></i>
                <h3>ONLINE SUPPORT 24/7</h3>
                <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form.</p>
            </div>
        </div>
    </div>
</div>
<style type="text/css">
.content-row h2 {
    font-size: 16px;
    font-family: 'Oswald';
    color: #282d3b;
    font-weight: 700;
    line-height: 1;
    padding: 10px 0;
    border-bottom: 1px solid #e7e7e7;
    margin-bottom: 30px;
}
blockquote.testimonial {
    border: 0;
    background-color: transparent !important;
    color: #62615e;
    font-size: 14px;
    font-style: normal;
    line-height: 24px;
    font-weight: 400;
    font-family: 'Open Sans';
    margin: 0;
    padding: 15px 30px 15px 50px;
    float: left;
    margin-top: 5px;
    position: relative;
    margin-left: 73px;
}
blockquote.testimonial p {
    line-height: 1.8;
}
blockquote.testimonial:before {
    left: 10px;
    top: 0;
    content: "\201C";
    font-style: normal;
    line-height: 1;
    position: absolute;
    color: #ee3d43;
    font-family: 'porto';
    font-weight: 400;
    font-size: 54px;
}
.testimonial-arrow-down {
    border:15px solid transparent;
    border-top-color:#ee3d43;
    border-bottom:0;
    height:0;
    margin:0 0 0 25px;
    width:0;
}
.testimonial-author {
    margin:8px 0 0 8px;
}
.testimonial-author .img-thumbnail {
    float: left;
    margin-right: 25px;
    position: relative;
    line-height: 1.5;
    background-color: #fff;
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 50% !important;
}
.testimonial-author .img-thumbnail img {
    max-width:60px;
    display:inline-block;
    height:auto;
}
.testimonial-author p {
    color:#666;
    margin:0 0 0 25px;
    text-align:left;
    line-height:24px;
    text-transform: uppercase;
}
.testimonial-author p >strong {
    color:#111;
    display:block;
    padding-top:7px;
    font-size:14px;
}
.testimonial-author span {
    color:#666;
    display:block;
    font-size:12px;
}
.columns .column.main {
    padding-bottom: 0;
}
.support-block {
}
.support-block > div {
    padding: 50px 15px 50px 5px;
    line-height: 1.4;
}
.support-block > div:after {
    content: '';
    display: table;
    clear: both;
}
.support-block > div > i {
    font-size: 55px;
    color: #ee3d43;
    float: left;
    margin: 0 15px 0 0;
}
.support-block > div > h3 {
    color: #21293c;
    font-family: 'Oswald';
    font-size: 14px;
    font-weight: 700;
    margin: 10px 0;
}
.support-block > div > p {
    margin: 0;
    font-family: 'Open Sans';
    font-size: 15px;
    font-weight: 400;
    color: #7b858a;
    line-height: 1.8;
    margin-left: 92px;
    letter-spacing: -0.5px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: 60px;
}
.page-main {
    padding-bottom: 0;
}
</style>