{% set active_page = 'sermons-list.html' -%}

{% extends "layouts/default.html" %}

{% block content %}
<div class="section">
    <div class="section-background">
        <div class="section-bg-image section-bg-image-size-lg-100 section-bg-image-position-xs-top section-bg-image-paralax --o--demo-bg-image-15 --o--opacity-5"></div>
    </div>
    <div class="section-content">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h2 class="--o--heading-bordered text-capitalize --o--os-animation  m-t-25 m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".3s">
                        <small class="text-muted font-italic">Latest</small> Sermons
                    </h2>
                </div>

                <div class="col-md-6">
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".3s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">About Love & Faith</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Christos</a> on <a href="sermons-list-alt.html">May 12 1977</a> about <a href="sermons-list-alt.html">God & All</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?t&v=GKWYhSEml0w">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                        <a target="_blank" class="--o--icon-set-item --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.pdf">
                                            <i class="fa fa-file-text-o"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".4s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">Where You'll Find Grace</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Christos</a> on <a href="sermons-list-alt.html">May 12 1977</a> about <a href="sermons-list-alt.html">God & All</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".5s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">The Peril Of Proud Praying!</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">John</a> on <a href="sermons-list-alt.html">May 12 1977</a> about <a href="sermons-list-alt.html">Faith in our Lord</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".6s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">Overcoming Fear In Witnessing</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Manos</a> on <a href="sermons-list-alt.html">January 9 1985</a> about <a href="sermons-list-alt.html">God & All</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                        <a target="_blank" class="--o--icon-set-item --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.pdf">
                                            <i class="fa fa-file-text-o"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".7s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">10 Assets Of Justification</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Proistak</a> on <a href="sermons-list-alt.html">January 9 1985</a> about <a href="sermons-list-alt.html">Faith in our Lord</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".4s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">Help For The Hopeless</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Langan</a> on <a href="sermons-list-alt.html">March 10 1979</a> about <a href="sermons-list-alt.html">South</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                        <a target="_blank" class="--o--icon-set-item --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.pdf">
                                            <i class="fa fa-file-text-o"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".5s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">Help For Hurting Parents</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Manos</a> on <a href="sermons-list-alt.html">June 21 1991</a> about <a href="sermons-list-alt.html">Holy Spirit</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".6s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">The Worst Sluggard</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Mike</a> on <a href="sermons-list-alt.html">May 12 1981</a> about <a href="sermons-list-alt.html">Faith in our Lord</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".7s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">Carnal Or Spiritual In Our Hearts</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Christos</a> on <a href="sermons-list-alt.html">December 25 1981</a> about <a href="sermons-list-alt.html">God & All</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card  card-horizontal --o--shadow-8 --o--shadow-hover-16 --o--transition --o--flex-items-lg-strech --o--os-animation m-b-3" data-os-animation="fadeIn" data-os-animation-delay=".8s">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="card-img-container">
                                    <img class="card-img" src="https://placehold.it/500x600" alt="Sermon image">
                                </div>
                            </div>
                            <div class="col-lg-8">
                                <div class="card-block">
                                    <h3 class="card-title">Touching Jesus</h3>
                                    <h6 class="card-subtitle font-italic text-muted m-b-0">By <a href="staff-single.html">Proistak</a> on <a href="sermons-list-alt.html">May 12 1972</a> about <a href="sermons-list-alt.html">Faith in our Lord</a></h6>
                                </div>
                                <div class="card-footer">
                                    <div class="--o--icon-set pull-xs-right">
                                        <a class="--o--icon-set-item magnific-audio --o--transition text-muted" href="http://oxy-wp-media.s3.amazonaws.com/divinity-html/sermon.mp3">
                                            <i class="fa fa-headphones"></i>
                                        </a>
                                        <a class="--o--icon-set-item --o--transition text-muted magnific-youtube" href="https://www.youtube.com/watch?v=bofF_aRIILI">
                                            <i class="fa fa-play-circle"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-6 col-xs-6 m-t-9">
                    <h3 class="--o--heading-bordered text-capitalize --o--os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".3s">
                        <a href="sermons-list-alt.html">
                            <small class="text-muted font-italic">&larr; Previous</small> Church Sermons
                        </a>
                    </h3>
                </div>
                <div class="col-md-6 col-xs-6 m-t-9 m-b-30">
                    <h3 class="--o--heading-bordered --o--heading-bordered-reversed text-capitalize --o--os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".6s">
                        <a href="sermons-list-alt.html">
                            <small class="text-muted font-italic">Next &rarr;</small> Church Sermons
                        </a>
                    </h3>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}