index.html

---
layout: default
snail_trail: disabled
meta:
  title: You Were Born for Adventure
  description: Whatever your thoughts on church or your beliefs about God, you're welcome here.
  image:
    url: "//crds-media.imgix.net/7EFusaW9y0WFSxO9KCdumH/2edc127ce50430b3894692f7075122fb/spiritual-outfitters.jpg"
paginate:
  articles:
    per: 15
    offset: 1
    limit: 1
    sort: published_at desc
  topics:
    per: 5
    limit: 1
    sort: published_at
  series:
    per: 1
    limit: 1
    sort: starts_at desc
  messages:
    per: 3
    limit: 1
    sort: published_at desc
  home_collection:
    collections:
      - articles
      - videos
      - episodes
    per: 10
    limit: 1
    sort: published_at desc
  episodes:
    per: 3
    limit: 1
    sort: published_at desc
  podcasts:
    per: 6
    offset: 1
    limit: 1
---

{% include home/_jumbotron.html %}

<!-- Good News Graphic -->
{% assign good_news_graphic = site.content_blocks | where: 'slug', 'good-news-graphic' | first %}

<!-- Assign Logged Out Home Ad -->
{% assign logged_out_home_ad = site.content_blocks | where: 'slug', 'logged-out-home-ad' | first %}

<!-- From /Watch -->
{% for serie in site.series %}
{% if serie.videos.size > 0 or serie.live_messages.size > 0 and serie.slug != 'easter-a-love-story' %}
{% assign series = serie %}
{% endif %}
{% endfor %}

{% if series.videos and series.videos.size != 0 %}
  {% assign online = series.videos | sort: 'published_at' | last | get_doc %}
  {% assign online_title = online.title | split: "|" %}
  {% assign split_title = online.title | split: " " %}
  {% assign current_week = split_title | slice: -1 %}
{% endif %}

{% if series.live_messages and series.live_messages.size != 0 %}
  {% assign at_site = series.live_messages | sort: 'published_at' | last | get_doc %}
  {% assign live_title = at_site.title | split: "|" %}
{% endif %}

{% assign watch_in_room_image = site.content_blocks | where: 'slug', 'watch-in-room-image' | first %}
{% assign watch_in_room_details = site.content_blocks | where: 'slug', 'watch-in-room-details' | first %}
{% assign watch_online_image = site.content_blocks | where: 'slug', 'watch-online-image' | first %}
{% assign watch_online_details = site.content_blocks | where: 'slug', 'watch-online-details' | first %}
{% assign watch_bottom_cta = site.content_blocks | where: 'slug', 'watch-bottom-cta' | first %}


<section class="bg-black flush-top" style="top: -1.5rem; position: relative;">
  <div class="container">
    <div class="row">
      <div class="col-sm-12">
        <!-- Logged Out Home Ad -->
        {{ logged_out_home_ad.content_block | markdownify }}
      </div>
    </div>
  </div>
</section>

<!-- Curent Series Section -->
<section class="bg-blue watch-section" style="margin-top:-24px;"> 
  <div class="home-jumbo-rel" style="background-image: url('{{ series.background_image.url | imgix: site.imgix }}?{{ site.imgix_params.placeholder }}');" data-optimize-bg-img>
    <div class="home-jumbo-overlay soft-ends">
      <div class="container soft-ends">
        <div class="row text-center push-top soft-ends">
          <div class="col-sm-12">
            <p calss="flush-bottom font-size-small text-white">
              <strong class="cs-header text-uppercase">Current Series</strong>
            </p>
            <h2 class="section-header flush-ends text-white">{{ series.title }}</h2>
            <p class="push-top col-sm-10 col-sm-offset-1">{{ series.description }}</p>
            <div class="row btn push-right">
              <crds-button block="true" display="outline" color="white" href="/watch" text="Watch the current teaching series"></crds-button>
            </div>
          </div>
        </div>
  
        <div class="row mobile-hard-bottom mobile-flush-bottom push-bottom soft-bottom">
  
          <!-- Online Message -->
          {% if online %}
          {% if at_site %}
          {% assign online_offset_classes = "col-md-offset-0" %}
          {% else %}
          {% assign online_offset_classes = "col-md-offset-3" %}
          {% endif %}
          <div class="col-md-6 {{ online_offset_classes }} col-sm-12 push-bottom series-card-pad">
            <div class="bg-white weekend-container">
              <div class="col-md-12 col-sm-8 col-xs-12 push-top soft-sides">
                <h3 class="cs-med-header flush-ends push-quarter-bottom">Online Message</h3>
                <p class="text-gray-light push-quarter-top">
                  25 minutes or less, created and optimized for video viewing.
              </div>
              <div class="row">
                <div class="col-xs-12 weekend-message">
                  <hr class="push-sides">
                  <div class="row soft-sides soft-half-ends">
                    <a href="{{ online | media_url }}" class="push-half-bottom col-sm-6 col-xs-12" data-automation-id="message-video">
                      <div class="">
                        <img class="img-responsive img-full-width"
                          src="{{ online.image.url | imgix: site.imgix }}?{{ site.imgix_params.placeholder_sixteen_nine }}"
                          sizes="{{ site.image_sizes.one_fourth }}" data-optimize-img />
                      </div>
                    </a>
                    <div class="col-sm-6 col-xs-12">
                      <h5 class="component-header flush-ends">
                        <a href="{{ online | media_url }}" data-automation-id="message-title">{{ online_title | slice: 0 }} | week {{ current_week }}</a>
                      </h5>
                      <p class="text-gray-light push-quarter-top">{{ series.title }}</p>
                    </div>
                  </div>
                </div>
              </div>

            </div>
          </div>
          {% endif %}
  
          <!-- In-Room Message -->
          {% if at_site %}
          {% if online %}
          {% assign at_site_offset_classes = "col-md-offset-0" %}
          {% else %}
          {% assign at_site_offset_classes = "col-md-offset-3" %}
          {% endif %}
          <div class="col-md-6 {{ at_site_offset_classes }} col-sm-12 push-bottom series-card-pad">
            <div class="bg-white weekend-container">
              <div class="col-md-12 col-sm-8 col-xs-12 push-top soft-sides">
                <h5 class="cs-med-header flush-ends push-quarter-bottom">In-Room Message</h5>
                <p class="text-gray-light push-quarter-top">
                  65 minute service filmed in front of a live audience.
                </p>
              </div>
              <div class="row">
                <div class="col-xs-12 weekend-message">
                  <hr class="push-sides">
                  <div class="row soft-sides soft-half-ends">
                    <a href="{{ at_site | media_url }}" class="push-half-bottom col-sm-6 col-xs-12" data-automation-id="message-video">
                      <div class="">
                        <img class="img-responsive img-full-width"
                          src="{{ at_site.image.url | imgix: site.imgix }}?{{ site.imgix_params.placeholder_sixteen_nine }}"
                          sizes="{{ site.image_sizes.one_fourth }}" data-optimize-img />
                      </div>
                    </a>
                    <div class="col-sm-6 col-xs-12">
                      <h5 class="component-header flush-ends">
                        <a href="{{ at_site | media_url }}" data-automation-id="message-title">{{ live_title | slice: 0 }} | week {{ current_week }}</a>
                      </h5>
                      <p class="text-gray-light push-quarter-top">{{ series.title }}</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          {% endif %}
        </div>
      </div>
    </div>
  </div>
</section>

<section class="soft-top bg-blue soft-bottom bg-topo best-content-pos">
  <div class="container">
    <div>
      <div class="col-sm-8 mobile-hard soft-ends">
        <div>
          {% assign homepage_cards = site.content_blocks | where: 'slug', 'homepage-cards' | first %}
          {{ homepage_cards.content_block }}
        </div>
      </div>
      <div class="col-sm-4 soft-ends">
        {% include home/_our-best-content.html %}
      </div>
    </div>
  </div>
</section>

{% comment %}Kids Club Jumbotron{% endcomment %}
{% include home/_kids-club-jumbotron.html %}

{% comment %}Gear Up for Your Adventure{% endcomment %}
<section class="bg-orange">
  <div class="bg-topo-50">
    {% assign gear_up = site.content_blocks | where: 'slug', 'gear-up-home' | first %}
    {{ gear_up.content_block }}
  </div>
</section>

{% comment %}Articles, Podcasts, & More{% endcomment %}
<section class="bg-tan-light">
  <div class="container">
    <div class="text-center push-bottom">
      <div class="text-blue mobile-push-half-sides">
        <h2 class="component-header-box text-orange">Articles, Podcasts, & More</h2>
      </div>
      <p class="text-blue font-family-serif font-size-large">Unfiltered & authentic takes on life</p>
    </div>
    <div class="col-md-8 push-top">
      {% assign most_recent = page.home_collection.docs | sort: "published_at" | reverse | first %}
      {% assign author = most_recent.author | first %}
      <a href="{{ most_recent.url }}" class="overlay-card">
        <div class="bg-overlay"></div>
        <div class="overlay-card-image">
          <div class="beige-overlay"></div>
          <img src="{{ most_recent.image.url | imgix: site.imgix }}?{{ site.imgix_params.placeholder_sixteen_nine }}"
            sizes="{{ site.image_sizes.three_fourths }}" data-optimize-img />
        </div>
        <div class="overlay-card-content">
          <p class="overlay-card-category">{{ most_recent.category.title }}</p>
          <h2 class="overlay-card-title">{{ most_recent.title }}</h2>
          <p class="overlay-card-author">{{ author.full_name }}</p>
          {% include _media-label.html source=most_recent %}
        </div>
      </a>

      <div class="card-deck carousel" data-crds-carousel="mobile-scroll" data-carousel-id="carousel-3cm29">
        <div class="feature-cards card-deck--expanded-layout" data-crds-carousel="mobile-scroll">

          {% assign recent = page.home_collection.docs | slice: 1, 2 %}
          {% for item in recent limit: 3 %}
          {% assign author = item.author | first %}
          {% assign category = item.category | get_doc %}
          <div class="card carousel-cell card-2x">
            <a class="relative" href="{{ item.url }}">
              {% if item.content_type == "article" or "video" %}
              <div class="beige-overlay"></div>
              {% endif %}

              {% assign image = item.image.url %}

              {% if item.content_type == 'episode' %}
                {% assign image =item.podcast.image.url %}
              {% endif %}
              {% if image == blank %}
                {% assign image = item.bg_image.url %}
              {% endif %}
              {% assign recommended_collection=site.messages %}
              {% include _video-player-card.html %}
              {% if image %}
                <img src="{{ image | imgix: site.imgix }}?{{ site.imgix_params.placeholder_sixteen_nine }}" sizes="{{ site.image_sizes.cards_2x }}" data-optimize-img>
              {% else %}
                <img src="{{ site.default_image | imgix: site.imgix }}?{{ site.imgix_params.placeholder_sixteen_nine }}" sizes="{{ site.image_sizes.cards_2x }}" data-optimize-img>
              {% endif %}
            </a>

            <div class="card-block hard soft-quarter-top">
              <a class="text-orange font-size-smaller font-family-base-mid text-uppercase" href="{{ category.url }}">
                {% if category.title %}
                  {{ category.title }}
                {% else %}
                  &nbsp;
                {% endif %}

              </a>
              <h3 class="component-header flush">
                <a href="{{ item.url }}">{{ item.title }}</a>
              </h3>
              <p class="card-text soft-quarter-top">
                <a class="text-gray-light font-size-smaller" href="{{ author.url }}">{{ author.full_name }}</a>
              </p>
            </div>
          </div>
          {% endfor %}
        </div>
      </div>
    </div>
    <div class="col-md-4">
      <div class="soft-ends">
        {% include home/_content-menu.html %}
      </div>
    </div>
  </div>
</section>

{% include _subscribe-modal.html %}

{% comment %}Make a difference{% endcomment %}
{% include home/_you-are-needed.html %}

{% comment %}Ready to start your adventure?{% endcomment %}
<section class="bg-orange">
  <div class="container soft-ends text-center softer-cta">
    {% assign homepage_sign_up_cta = site.content_blocks | where: 'slug', 'homepage-sign-up-cta' | first %}
    {{ homepage_sign_up_cta.content_block }}
  </div>
</section>

<!-- Trigger for Hotjar to start tracking visitors to home page who are unauthenticated -->
<script>
  if (window.hj) {
    var triggerTimer = setInterval(hotJarTrigger, 1000);
    function hotJarTrigger() {
      if (window.hj.scriptLoaded == true) {
        hj("trigger", "track_unauthenticated_homepage_users");
        triggerFired();
      }
    }
    function triggerFired() {
      clearInterval(triggerTimer);
      console.log("unauthenticated user - hotjar trigger");
    }
  }
</script>

<script>
  window.env = {
    gatewayServerEndpoint: '{{ site.gateway_server_endpoint }}',
    streamScheduleEndpoint: '{{ site.stream_schedule_endpoint }}'
  };

  document.addEventListener("deferred-js-ready", countdownInit);

  if (window.deferredJSReady) {
    countdownInit();
  }

  function countdownInit() {
    var c = new CRDS.Countdown();
    c.getEventStatus();
  }
</script>

{% javascript_link_tag autoplay async %}
{% javascript_link_tag skeleton async %}

<!-- we are crossroads -->