j1-template 2020.0.25 → 2021.0.4

data/lib/starter_web/pages/public/test_pages/breadcrumbs_tester.adoc

@@ -1,62 +0,0 @@
----
-title:                                  breadcrumbs Tester
-tagline:                                breadcrumbs
-description:                            breadcrumbs
-
-tags:                                   [ Page, Roundtrip ]
-index:                                  [ Template, Roundtrip, Images ]
-categories:                             [ pages ]
-
-toc:                                    true
-scrollbar:                              false
-date:                                   2020-11-08 12:00:00
-
-permalink:                              /pages/public/tester/breadcrumbs/
-regenerate:                             true
-
-resources:                              [ lunr ]
-resource_options:
-  - attic:
-      padding_top:                      400
-      padding_bottom:                   50
-      opacity:                          0.5
-#     slides:
-#       - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
-#         alt:                          Photo by Ricardo Gomez Angel on Unsplash
-#         badge:
-#           type:                       unsplash
-#           author:                     Ricardo Gomez Angel
-#           href:                       https://unsplash.com/@ripato/portfolio
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// Set page (local) attributes here
-// -----------------------------------------------------------------------------
-// :page--attr:                         <attr-value>
-
-//  Load Liquid procedures
-// -----------------------------------------------------------------------------
-{% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%}
-
-// Load page attributes
-// -----------------------------------------------------------------------------
-{% include {{load_attributes}} scope="all" %}
-
-
-// Page content
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-
-++++
-{% include breadcrumbs.html %}
-++++
-
-== Deck of posts
-
-Bootstrap `card decks` are *not* responsive by default. Additional breakpoint
-classes for J1 Template introduce support on card decks for responsiveness.
-With the values for `break_on_XX`, the number of cards can be specified to be
-shown on a deck per *row*.

data/lib/starter_web/pages/public/test_pages/carousel_captions.adoc

@@ -1,1045 +0,0 @@
----
-title:                                  Carousel
-tagline:                                animated captions
-date:                                   2020-11-08 12:00:00
-description: >
-                                        animated captions
-
-tags:                                   [ Captions, Animated ]
-categories:                             [ Test, Carousel ]
-
-toc:                                    true
-advertising:                            false
-
-permalink:                              /pages/public/test_pages/carousel/
-regenerate:                             false
-
-resources:                              [ carousel, lightbox ]
-resource_options:
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// Set page (local) attributes here
-// -----------------------------------------------------------------------------
-// :page--attr:                         <attr-value>
-
-//  Load Liquid procedures
-// -----------------------------------------------------------------------------
-{% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%}
-
-// Load page attributes
-// -----------------------------------------------------------------------------
-{% include {{load_attributes}} scope="none" %}
-
-// See:
-//  https://codepen.io/QPLOT/pen/jOELrjo
-//  https://stackoverflow.com/questions/38409040/how-to-add-captions-for-images-in-owl-carousel
-
-// Page content
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-Welcome to the pages of J1 Template. If your here first time,
-hopefully you get on that page first. For sure, there is no better
-place to step in.
-
-== Animated captions
-
-To get better orientated, the site is organized for *natural reading*. As we
-use the English language for our international vistors (we are German),
-*natural reading* means for a western language, reading from the left to the
-right (LTR), and from top to down a page. The same to all menus, sections
-and pages.
-
-++++
-<!-- SECTION – HERO -->
-<section id="mainSlider">
-  <div id="owl-main" class="owl-carousel height-md owl-inner-nav owl-ui-lg">
-    <div class="item" style="background-image: url(/assets/images/modules/attics/mae-mue-1920x1280.jpg)">
-      <div class="container">
-        <div class="caption vertical-center text-center">
-          <h1 class="fadeInDown-1 light-color">Made for Designers</h1>
-          <p class="fadeInDown-2 medium-color">Create your online portfolio in minutes with the professionally and lovingly designed REEN website template. Customize your site with versatile and easy to use features.</p>
-          <div class="fadeInDown-3">
-            <a href="#" class="btn btn-large">Get started now</a>
-          </div>
-          <!-- /.fadeIn -->
-        </div>
-        <!-- /.caption -->
-      </div>
-      <!-- /.container -->
-    </div>
-    <!-- /.item -->
-    <div class="item" style="background-image: url(/assets/images/modules/attics/mae-mue-1920x1280.jpg)">
-      <div class="container">
-        <div class="caption vertical-center text-right">
-          <h1 class="fadeInLeft-1 light-color">Fresh and <br>beautiful design</h1>
-          <p class="fadeInLeft-2 light-color">REEN is designed to showcase your talent and put your work in the forefront. <br>Professionally use of typography and layout that fits your content.</p>
-          <div class="fadeInLeft-3">
-            <a href="#" class="btn btn-large">Get started now</a>
-          </div>
-          <!-- /.fadeIn -->
-        </div>
-        <!-- /.caption -->
-      </div>
-      <!-- /.container -->
-    </div>
-    <!-- /.item -->
-    <div class="item" style="background-image: url(/assets/images/modules/attics/mae-mue-1920x1280.jpg)">
-      <div class="container">
-        <div class="caption vertical-center text-left">
-          <h1 class="fadeInRight-1 dark-bg light-color"><span>Clean and <br>reusable code</span></h1>
-          <p class="fadeInRight-2 dark-color">The clean code allows you to easily copy code blocks from content <br>modules and past them in different places or layouts.</p>
-          <div class="fadeInRight-3">
-            <a href="#" class="btn btn-large">Get started now</a>
-          </div>
-          <!-- /.fadeIn -->
-        </div>
-        <!-- /.caption -->
-      </div>
-      <!-- /.container -->
-    </div>
-    <!-- /.item -->
-    <div class="item" style="background-image: url(/assets/images/modules/attics/mae-mue-1920x1280.jpg)">
-      <div class="container">
-        <div class="caption vertical-top text-right">
-          <h1 class="fadeIn-1 dark-bg light-color"><span>Just focus on <br>your creativity</span></h1>
-          <p class="fadeIn-2 light-color">Take a break from messing around with heavy coding and spend <br>your time brainstorming ideas for your next project.</p>
-          <div class="fadeIn-3">
-            <a href="#" class="btn btn-large">Get started now</a>
-          </div>
-          <!-- /.fadeIn -->
-        </div>
-        <!-- /.caption -->
-      </div>
-      <!-- /.container -->
-    </div>
-    <!-- /.item -->
-    <div class="item" style="background-image: url(/assets/images/modules/attics/mae-mue-1920x1280.jpg)">
-      <div class="container">
-        <div class="caption vertical-top text-center">
-          <h1 class="fadeInDown-1 light-color">Showcase <br>your content</h1>
-          <p class="fadeInDown-2 medium-color">With REEN you have the possibility to create websites for various <br>contents quickly and easily. Now it's up to you!</p>
-          <div class="fadeInDown-3">
-            <a href="#" class="btn btn-large">Get started now</a>
-          </div>
-          <!-- /.fadeIn -->
-        </div>
-        <!-- /.caption -->
-      </div>
-      <!-- /.container -->
-    </div>
-    <!-- /.item -->
-  </div>
-  <!-- /.owl-carousel -->
-</section>
-++++
-
-
-++++
-<style>
-// slider styles
-
-#mainSlider {
-  h1 {
-    font-size: 78px;
-    line-height: 110%;
-    font-weight: 900;
-    letter-spacing: .05em;
-    text-transform: uppercase;
-    margin-bottom: 0;
-    -webkit-transition: font 200ms ease-out;
-    -moz-transition: font 200ms ease-out;
-    -o-transition: font 200ms ease-out;
-    transition: font 200ms ease-out;
-  }
-  #owl-main .caption h1 {
-    &.light-bg, &.medium-bg, &.dark-bg, &.tint-bg {
-      font-size: 73px;
-    }
-  }
-  h4 {
-    font-size: 33px;
-    line-height: 120%;
-  }
-  p {
-    font-size: 24px;
-    line-height: 150%;
-    font-weight: 400;
-    letter-spacing: .015em;
-    text-transform: none;
-    margin-top: 20px;
-    margin-bottom: 0;
-    -webkit-transition: font 200ms ease-out, margin 200ms ease-out;
-    -moz-transition: font 200ms ease-out, margin 200ms ease-out;
-    -o-transition: font 200ms ease-out, margin 200ms ease-out;
-    transition: font 200ms ease-out, margin 200ms ease-out;
-  }
-  .btn {
-    background-color: #1ABB9C;
-    margin-top: 60px;
-    color: #fff;
-    margin-bottom: 0;
-    -webkit-transition: background 200ms ease-out, font 200ms ease-out, padding 200ms ease-out, margin 200ms ease-out;
-    -moz-transition: background 200ms ease-out, font 200ms ease-out, padding 200ms ease-out, margin 200ms ease-out;
-    -o-transition: background 200ms ease-out, font 200ms ease-out, padding 200ms ease-out, margin 200ms ease-out;
-    transition: background 200ms ease-out, font 200ms ease-out, padding 200ms ease-out, margin 200ms ease-out;
-  }
-  .btn-large {
-    font-size: 18px;
-    padding: 18px 70px 20px;
-  }
-}
-
-.owl-carousel {
-  text-align: center;
-  cursor: default;
-}
-
-.owl-controls {
-  display: inline-block;
-  position: relative;
-  margin-top: 40px;
-}
-
-.panel-group {
-  .panel .owl-controls {
-    margin-top: 25px;
-  }
-  &.blank .panel .owl-controls {
-    margin-top: 40px;
-  }
-}
-
-.owl-pagination {
-  position: relative;
-  line-height: 30px;
-}
-
-.owl-buttons {
-  display: none;
-}
-
-.owl-prev, .owl-next {
-  display: inline-block;
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  width: 30px;
-  height: 30px;
-  font-size: 30px;
-  color: #FFF;
-  background-color: #506A85;
-  border: none;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
-  border-radius: 3px;
-  margin: auto;
-  -webkit-transition: all 200ms ease-out;
-  -moz-transition: all 200ms ease-out;
-  -o-transition: all 200ms ease-out;
-  transition: all 200ms ease-out;
-  opacity: 0;
-}
-
-.owl-prev {
-  left: -35px;
-}
-
-.owl-next {
-  right: -35px;
-}
-
-.owl-carousel:hover {
-  .owl-prev {
-    left: -40px;
-    opacity: .25;
-  }
-  .owl-next {
-    right: -40px;
-    opacity: .25;
-  }
-  .owl-prev:hover, .owl-next:hover {
-    color: #1ABB9C;
-    opacity: 1;
-  }
-}
-
-.owl-outer-nav {
-  &:after {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: -15%;
-    width: 130%;
-    height: 100%;
-    z-index: 0;
-  }
-  .owl-wrapper-outer, .owl-pagination, .owl-prev, .owl-next {
-    z-index: 1;
-  }
-  .owl-controls {
-    position: static;
-  }
-  .owl-prev {
-    left: -65px;
-  }
-  .owl-next {
-    right: -65px;
-  }
-  &:hover {
-    .owl-prev {
-      left: -80px;
-    }
-    .owl-next {
-      right: -80px;
-    }
-  }
-}
-
-.owl-ui-md {
-  .owl-pagination {
-    line-height: 45px;
-  }
-  .owl-prev, .owl-next {
-    width: 45px;
-    height: 45px;
-    font-size: 45px;
-  }
-  .owl-prev {
-    left: -55px;
-  }
-  .owl-next {
-    right: -55px;
-  }
-  &:hover {
-    .owl-prev {
-      left: -60px;
-    }
-    .owl-next {
-      right: -60px;
-    }
-  }
-}
-
-.owl-outer-nav.owl-ui-md {
-  &:after {
-    left: -18%;
-    width: 136%;
-  }
-  .owl-prev {
-    left: -85px;
-  }
-  .owl-next {
-    right: -85px;
-  }
-  &:hover {
-    .owl-prev {
-      left: -100px;
-    }
-    .owl-next {
-      right: -100px;
-    }
-  }
-}
-
-.owl-ui-lg {
-  .owl-pagination {
-    line-height: 60px;
-  }
-  .owl-prev, .owl-next {
-    width: 60px;
-    height: 60px;
-    font-size: 60px;
-  }
-  .owl-prev {
-    left: -75px;
-  }
-  .owl-next {
-    right: -75px;
-  }
-  &:hover {
-    .owl-prev {
-      left: -80px;
-    }
-    .owl-next {
-      right: -80px;
-    }
-  }
-}
-
-.owl-outer-nav.owl-ui-lg {
-  &:after {
-    left: -22%;
-    width: 144%;
-  }
-  .owl-prev {
-    left: -105px;
-  }
-  .owl-next {
-    right: -105px;
-  }
-  &:hover {
-    .owl-prev {
-      left: -120px;
-    }
-    .owl-next {
-      right: -120px;
-    }
-  }
-}
-
-.owl-inner-nav {
-  .owl-controls {
-    position: static;
-  }
-  .owl-prev {
-    left: 45px;
-  }
-  .owl-next {
-    right: 45px;
-  }
-  &:hover {
-    .owl-prev {
-      left: 30px;
-    }
-    .owl-next {
-      right: 30px;
-    }
-  }
-}
-
-.owl-outer-nav {
-  .owl-prev, .owl-next {
-    bottom: 70px;
-  }
-}
-
-.owl-inner-nav {
-  .owl-prev, .owl-next {
-    bottom: 70px;
-  }
-}
-
-.owl-outer-nav.owl-ui-md {
-  .owl-prev, .owl-next {
-    bottom: 85px;
-  }
-}
-
-.owl-inner-nav.owl-ui-md {
-  .owl-prev, .owl-next {
-    bottom: 85px;
-  }
-}
-
-.owl-outer-nav.owl-ui-lg {
-  .owl-prev, .owl-next {
-    bottom: 100px;
-  }
-}
-
-.owl-inner-nav.owl-ui-lg {
-  .owl-prev, .owl-next {
-    bottom: 100px;
-  }
-}
-
-.owl-inner-pagination {
-  .owl-pagination, .owl-prev, .owl-next {
-    margin-top: -40px;
-    top: -60px;
-  }
-  &.owl-ui-md {
-    .owl-pagination, .owl-prev, .owl-next {
-      margin-top: -50px;
-      top: -65px;
-    }
-  }
-  &.owl-ui-lg {
-    .owl-pagination, .owl-prev, .owl-next {
-      margin-top: -60px;
-      top: -75px;
-    }
-  }
-  &.owl-outer-nav {
-    .owl-prev, .owl-next {
-      margin: auto;
-      top: 0;
-      bottom: 43px;
-    }
-  }
-  &.owl-inner-nav {
-    .owl-prev, .owl-next {
-      margin: auto;
-      top: 0;
-      bottom: 43px;
-    }
-  }
-  .owl-pagination {
-    -webkit-transition: all 200ms ease-out;
-    -moz-transition: all 200ms ease-out;
-    -o-transition: all 200ms ease-out;
-    transition: all 200ms ease-out;
-    opacity: 0;
-  }
-  &:hover .owl-pagination {
-    opacity: 1;
-  }
-  &.owl-inner-nav .owl-pagination, &.owl-outer-nav .owl-pagination {
-    top: -45px;
-  }
-  &.owl-inner-nav.owl-ui-md .owl-pagination, &.owl-outer-nav.owl-ui-md .owl-pagination {
-    top: -50px;
-  }
-  &.owl-inner-nav.owl-ui-lg .owl-pagination, &.owl-outer-nav.owl-ui-lg .owl-pagination, &.owl-inner-nav:hover .owl-pagination, &.owl-outer-nav:hover .owl-pagination {
-    top: -60px;
-  }
-  &.owl-inner-nav.owl-ui-md:hover .owl-pagination, &.owl-outer-nav.owl-ui-md:hover .owl-pagination {
-    top: -65px;
-  }
-  &.owl-inner-nav.owl-ui-lg:hover .owl-pagination, &.owl-outer-nav.owl-ui-lg:hover .owl-pagination {
-    top: -75px;
-  }
-}
-
-#owl-main {
-  .item {
-    height: 44vh;
-    background-color: #FFF;
-    background-position: center 55%;
-    -webkit-background-size: cover;
-    -moz-background-size: cover;
-    -o-background-size: cover;
-    background-size: cover;
-  }
-  &.height-md .item {
-    height: 61vh;
-  }
-  &.height-lg .item {
-    height: 90vh;
-  }
-  .container {
-    display: table;
-    height: inherit;
-  }
-  .caption {
-    display: table-cell;
-    &.vertical-center {
-      vertical-align: middle;
-      padding-bottom: 3vh;
-    }
-    &.vertical-top {
-      vertical-align: top;
-      // padding-top: 8vh;
-    }
-    &.vertical-bottom {
-      vertical-align: bottom;
-      padding-bottom: 14vh;
-    }
-    &.text-center {
-      padding-left: 10%;
-      padding-right: 10%;
-    }
-    &.text-left {
-      padding-right: 20%;
-    }
-    &.text-right {
-      padding-left: 20%;
-    }
-    h1, p, div {
-      position: relative;
-    }
-    h1 span {
-      padding: .250em 0;
-      line-height: 180%;
-    }
-    .light-bg, .medium-bg, .dark-bg, .tint-bg {
-      background: none;
-      padding-left: .500em;
-      padding-right: .500em;
-    }
-    h1.light-bg span, p.light-bg span {
-      background: #FFF;
-      box-shadow: -.500em 0 0 #FFF, .500em 0 0 #FFF;
-      -webkit-box-decoration-break: clone;
-      box-decoration-break: clone;
-    }
-    h1.medium-bg span, p.medium-bg span {
-      background: #A3B1BF;
-      box-shadow: -.500em 0 0 #A3B1BF, .500em 0 0 #A3B1BF;
-      -webkit-box-decoration-break: clone;
-      box-decoration-break: clone;
-    }
-    h1.dark-bg span, p.dark-bg span {
-      background: #506A85;
-      box-shadow: -.500em 0 0 #506A85, .500em 0 0 #506A85;
-      -webkit-box-decoration-break: clone;
-      box-decoration-break: clone;
-    }
-    h1.tint-bg span, p.tint-bg span {
-      background: #1ABB9C;
-      box-shadow: -.500em 0 0 #1ABB9C, .500em 0 0 #1ABB9C;
-      -webkit-box-decoration-break: clone;
-      box-decoration-break: clone;
-    }
-  }
-  .owl-controls {
-    display: block;
-    position: static;
-    margin-top: -47px;
-  }
-  .owl-pagination {
-    background: #FFF;
-    line-height: inherit;
-    position: relative;
-    bottom: -40px;
-    padding: 10px;
-    display: inline-block;
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-    border-radius: 3px;
-    margin: auto;
-    opacity: 0;
-    -webkit-transition: all 200ms ease-out;
-    -moz-transition: all 200ms ease-out;
-    -o-transition: all 200ms ease-out;
-    transition: all 200ms ease-out;
-  }
-  &:hover .owl-pagination {
-    bottom: -25px;
-    opacity: 1;
-  }
-  .owl-prev, .owl-next {
-    bottom: 0;
-  }
-}
-
-.owl-controls .owl-page {
-  display: inline-block;
-}
-
-.owl-pagination .owl-page {
-  span {
-    display: block;
-    width: 15px;
-    height: 15px;
-    background: #506A85;
-    border: none;
-    -webkit-border-radius: 50%;
-    border-radius: 50%;
-    margin: 0 5px;
-    -webkit-transition: all 200ms ease-out;
-    -moz-transition: all 200ms ease-out;
-    -o-transition: all 200ms ease-out;
-    transition: all 200ms ease-out;
-  }
-  &.active span, &:hover span {
-    background: #1ABB9C;
-  }
-}
-
-.owl-item-gap .item {
-  margin: 0 15px;
-}
-
-.owl-item-gap-sm .item {
-  margin: 0 10px;
-}
-
-/* preloading images */
-
-.owl-item.loading {
-  min-height: inherit;
-  background: none;
-}
-
-
-
-.tint-bg a:hover {
-  color: #506A85;
-}
-
-.light-color {
-  color: #FFF !important;
-  .dark-bg {
-    color: #FFF !important;
-  }
-}
-
-.medium-color {
-  color: #A3B1BF !important;
-}
-
-.dark-color {
-  color: #506A85 !important;
-}
-
-.tint-color, .green {
-  color: #1ABB9C !important;
-}
-
-.blue {
-  color: #3F8DBF !important;
-}
-
-.red {
-  color: #FA6C65 !important;
-}
-
-.pink {
-  color: #D487BE !important;
-}
-
-.purple {
-  color: #9B59B6 !important;
-}
-
-.orange {
-  color: #F27A24 !important;
-}
-
-.navy {
-  color: #34495E !important;
-}
-
-.gray {
-  color: #95A5A6 !important;
-}
-
-
-.owl-ui-lg .owl-prev, .owl-ui-lg .owl-next {
-    width: 60px;
-    height: 60px;
-    font-size: 60px;
-    line-height: 60px;
-}
-.owl-prev, .owl-next {
-    display: inline-block;
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    width: 30px;
-    height: 30px;
-    font-size: 30px;
-    color: #FFF;
-    background-color: #506A85;
-    border: none;
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-    border-radius: 3px;
-    margin: auto;
-    -webkit-transition: all 200ms ease-out;
-    -moz-transition: all 200ms ease-out;
-    -o-transition: all 200ms ease-out;
-    transition: all 200ms ease-out;
-    opacity: 0;
-}
-.owl-inner-nav .owl-prev {
-    left: 45px;
-}
-
-
-@media (min-width: 1200px) {
-  .owl-buttons {
-    display: block;
-  }
-}
-</style>
-
-<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script>
-
-<script>
-$(document).ready(function () {
-
-  var dragging = true;
-  var owlElementID = "#owl-main";
-
-  function fadeInReset() {
-    if (!dragging) {
-      $(owlElementID + " .caption .fadeIn-1, " + owlElementID + " .caption .fadeIn-2, " + owlElementID + " .caption .fadeIn-3").stop().delay(800).animate({
-        opacity: 0
-      }, {
-        duration: 400,
-        easing: "easeInCubic"
-      });
-    } else {
-      $(owlElementID + " .caption .fadeIn-1, " + owlElementID + " .caption .fadeIn-2, " + owlElementID + " .caption .fadeIn-3").css({
-        opacity: 0
-      });
-    }
-  }
-
-  function fadeInDownReset() {
-    if (!dragging) {
-      $(owlElementID + " .caption .fadeInDown-1, " + owlElementID + " .caption .fadeInDown-2, " + owlElementID + " .caption .fadeInDown-3").stop().delay(800).animate({
-        opacity: 0,
-        top: "-15px"
-      }, {
-        duration: 400,
-        easing: "easeInCubic"
-      });
-    } else {
-      $(owlElementID + " .caption .fadeInDown-1, " + owlElementID + " .caption .fadeInDown-2, " + owlElementID + " .caption .fadeInDown-3").css({
-        opacity: 0,
-        top: "-15px"
-      });
-    }
-  }
-
-  function fadeInUpReset() {
-    if (!dragging) {
-      $(owlElementID + " .caption .fadeInUp-1, " + owlElementID + " .caption .fadeInUp-2, " + owlElementID + " .caption .fadeInUp-3").stop().delay(800).animate({
-        opacity: 0,
-        top: "15px"
-      }, {
-        duration: 400,
-        easing: "easeInCubic"
-      });
-    } else {
-      $(owlElementID + " .caption .fadeInUp-1, " + owlElementID + " .caption .fadeInUp-2, " + owlElementID + " .caption .fadeInUp-3").css({
-        opacity: 0,
-        top: "15px"
-      });
-    }
-  }
-
-  function fadeInLeftReset() {
-    if (!dragging) {
-      $(owlElementID + " .caption .fadeInLeft-1, " + owlElementID + " .caption .fadeInLeft-2, " + owlElementID + " .caption .fadeInLeft-3").stop().delay(800).animate({
-        opacity: 0,
-        left: "15px"
-      }, {
-        duration: 400,
-        easing: "easeInCubic"
-      });
-    } else {
-      $(owlElementID + " .caption .fadeInLeft-1, " + owlElementID + " .caption .fadeInLeft-2, " + owlElementID + " .caption .fadeInLeft-3").css({
-        opacity: 0,
-        left: "15px"
-      });
-    }
-  }
-
-  function fadeInRightReset() {
-    if (!dragging) {
-      $(owlElementID + " .caption .fadeInRight-1, " + owlElementID + " .caption .fadeInRight-2, " + owlElementID + " .caption .fadeInRight-3").stop().delay(800).animate({
-        opacity: 0,
-        left: "-15px"
-      }, {
-        duration: 400,
-        easing: "easeInCubic"
-      });
-    } else {
-      $(owlElementID + " .caption .fadeInRight-1, " + owlElementID + " .caption .fadeInRight-2, " + owlElementID + " .caption .fadeInRight-3").css({
-        opacity: 0,
-        left: "-15px"
-      });
-    }
-  }
-
-  function fadeIn() {
-    $(owlElementID + " .active .caption .fadeIn-1").stop().delay(500).animate({
-      opacity: 1
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeIn-2").stop().delay(700).animate({
-      opacity: 1
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeIn-3").stop().delay(1000).animate({
-      opacity: 1
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-  }
-
-  function fadeInDown() {
-    $(owlElementID + " .active .caption .fadeInDown-1").stop().delay(500).animate({
-      opacity: 1,
-      top: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInDown-2").stop().delay(700).animate({
-      opacity: 1,
-      top: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInDown-3").stop().delay(1000).animate({
-      opacity: 1,
-      top: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-  }
-
-  function fadeInUp() {
-    $(owlElementID + " .active .caption .fadeInUp-1").stop().delay(500).animate({
-      opacity: 1,
-      top: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInUp-2").stop().delay(700).animate({
-      opacity: 1,
-      top: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInUp-3").stop().delay(1000).animate({
-      opacity: 1,
-      top: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-  }
-
-  function fadeInLeft() {
-    $(owlElementID + " .active .caption .fadeInLeft-1").stop().delay(500).animate({
-      opacity: 1,
-      left: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInLeft-2").stop().delay(700).animate({
-      opacity: 1,
-      left: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInLeft-3").stop().delay(1000).animate({
-      opacity: 1,
-      left: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-  }
-
-  function fadeInRight() {
-    $(owlElementID + " .active .caption .fadeInRight-1").stop().delay(500).animate({
-      opacity: 1,
-      left: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInRight-2").stop().delay(700).animate({
-      opacity: 1,
-      left: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-    $(owlElementID + " .active .caption .fadeInRight-3").stop().delay(1000).animate({
-      opacity: 1,
-      left: "0"
-    }, {
-      duration: 800,
-      easing: "easeOutCubic"
-    });
-  }
-
-  $(owlElementID).owlCarousel({
-
-    itemsDesktop:                         [1199,4],
-    itemsDesktopSmall:                    [980,3],
-    itemsTablet:                          [768,2],
-    itemsMobile:                          [479,1],
-    autoPlay:                             5000,
-    stopOnHover:                          true,
-    navigation:                           true,
-    pagination:                           true,
-    singleItem:                           true,
-    addClassActive:                       true,
-    transitionStyle:                      "fade",
-    navigationText:                       ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"],
-
-    afterInit:                            function () {
-                                            fadeIn();
-                                            fadeInDown();
-                                            fadeInUp();
-                                            fadeInLeft();
-                                            fadeInRight();
-                                          },
-    afterMove:                            function () {
-                                            fadeIn();
-                                            fadeInDown();
-                                            fadeInUp();
-                                            fadeInLeft();
-                                            fadeInRight();
-                                          },
-    afterUpdate:                          function () {
-                                            fadeIn();
-                                            fadeInDown();
-                                            fadeInUp();
-                                            fadeInLeft();
-                                            fadeInRight();
-                                          },
-    startDragging:                        function () {
-                                            dragging = true;
-                                          },
-
-    afterAction:                          function () {
-                                            fadeInReset();
-                                            fadeInDownReset();
-                                            fadeInUpReset();
-                                            fadeInLeftReset();
-                                            fadeInRightReset();
-                                            dragging = false;
-                                          }
-  });
-
-  if ($(owlElementID).hasClass("owl-one-item")) {
-    $(owlElementID + ".owl-one-item").data('owlCarousel').destroy();
-  }
-
-  $(owlElementID + ".owl-one-item").owlCarousel({
-    singleItem: true,
-    navigation: false,
-    pagination: false
-  });
-
-  $('#transitionType li a').click(function () {
-
-    $('#transitionType li a').removeClass('active');
-    $(this).addClass('active');
-
-    var newValue = $(this).attr('data-transition-type');
-
-    $(owlElementID).data("owlCarousel").transitionTypes(newValue);
-    $(owlElementID).trigger("owl.next");
-
-    return false;
-
-  });
-
-
-  $(".slider-next").click(function () {
-    owl.trigger('owl.next');
-  })
-
-  $(".slider-prev").click(function () {
-    owl.trigger('owl.prev');
-  })
-
-});
-</script>
-++++