j1-template 2024.3.16 → 2024.3.18

data/assets/theme/j1/modules/amplitudejs/js/tech/youtube_example.js

@@ -1,211 +0,0 @@
-/*
- # -----------------------------------------------------------------------------
- # ~/assets/theme/j1/modules/amplitudejs/js/plugins/tech/youtube.js
- # AmplitudeJS V5 Plugin|Tech for J1 Template
- #
- # Product/Info:
- # https://jekyll.one
- #
- # Copyright (C) 2023, 2024 Juergen Adams
- #
- # J1 Template is licensed under the MIT License.
- # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
- # -----------------------------------------------------------------------------
-*/
-"use strict";
-  function ytAudio() {
-  }
-
-  // 2. This code loads the IFrame Player API code asynchronously.
-  var player1, player2, player3, player4;
-  var firstScriptTag;
-
-  var tag = document.createElement('script');
-  tag.src = "https://www.youtube.com/iframe_api";
-  firstScriptTag = document.getElementsByTagName('script')[0];
-  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
-
-  // 3. This function creates an <iframe> (and YouTube player)
-  //    after the API code downloads.
-  function onYouTubeIframeAPIReady() {
-
-    var ctrlq1 = document.getElementById("youtube-audio1");
-    ctrlq1.innerHTML = '<img id="youtube-icon1" src=""/><div id="youtube-player1"></div>';
-    ctrlq1.style.cssText = 'width:150px;margin:2em auto;cursor:pointer;cursor:hand;display:none';
-    ctrlq1.onclick = toggleAudio1;
-
-    player1 = new YT.Player('youtube-player1', {
-      height: '0',
-      width: '0',
-      videoId: ctrlq1.dataset.video,
-      playerVars: {
-        autoplay: ctrlq1.dataset.autoplay,
-        loop: ctrlq1.dataset.loop,
-      },
-      events: {
-        'onReady': onPlayerReady1,
-        'onStateChange': onPlayerStateChange1
-      }
-    });
-
-    var ctrlq2 = document.getElementById("youtube-audio2");
-    ctrlq2.innerHTML = '<img id="youtube-icon2" src=""/><div id="youtube-player2"></div>';
-    ctrlq2.style.cssText = 'width:150px;margin:2em auto;cursor:pointer;cursor:hand;display:none';
-    ctrlq2.onclick = toggleAudio2;
-
-    player2 = new YT.Player('youtube-player2', {
-      height: '0',
-      width: '0',
-      videoId: ctrlq2.dataset.video,
-      playerVars: {
-        autoplay: ctrlq2.dataset.autoplay,
-        loop: ctrlq2.dataset.loop,
-      },
-      events: {
-        'onReady': onPlayerReady2,
-        'onStateChange': onPlayerStateChange2
-      }
-    });
-
-    var ctrlq3 = document.getElementById("youtube-audio3");
-    ctrlq3.innerHTML = '<img id="youtube-icon3" src=""/><div id="youtube-player3"></div>';
-    ctrlq3.style.cssText = 'width:150px;margin:2em auto;cursor:pointer;cursor:hand;display:none';
-    ctrlq3.onclick = toggleAudio3;
-
-    player3 = new YT.Player('youtube-player3', {
-      height: '0',
-      width: '0',
-      videoId: ctrlq3.dataset.video,
-      playerVars: {
-        autoplay: ctrlq3.dataset.autoplay,
-        loop: ctrlq3.dataset.loop,
-      },
-      events: {
-        'onReady': onPlayerReady3,
-        'onStateChange': onPlayerStateChange3
-      }
-    });
-
-    var ctrlq4 = document.getElementById("youtube-audio4");
-    ctrlq4.innerHTML = '<img id="youtube-icon4" src=""/><div id="youtube-player4"></div>';
-    ctrlq4.style.cssText = 'width:150px;margin:2em auto;cursor:pointer;cursor:hand;display:none';
-    ctrlq4.onclick = toggleAudio4;
-
-    player4 = new YT.Player('youtube-player4', {
-      height: '0',
-      width: '0',
-      videoId: ctrlq4.dataset.video,
-      playerVars: {
-        autoplay: ctrlq4.dataset.autoplay,
-        loop: ctrlq4.dataset.loop,
-      },
-      events: {
-        'onReady': onPlayerReady4,
-        'onStateChange': onPlayerStateChange4
-      }
-    });
-  }
-
-  function togglePlayButton1(play) {
-    document.getElementById("youtube-icon1").src = play ? "/assets/theme/j1/modules/amplitudejs/icons/player/blue/play.png" : "/assets/theme/j1/modules/amplitudejs/icons/player/blue/pause.png";
-  }
-
-  function toggleAudio1() {
-    if ( player1.getPlayerState() == 1 || player1.getPlayerState() == 3 ) {
-      player1.pauseVideo();
-      togglePlayButton1(false);
-    } else {
-      player1.playVideo();
-      togglePlayButton1(true);
-    }
-  }
-
-  function togglePlayButton2(play) {
-    document.getElementById("youtube-icon2").src = play ? "/assets/theme/j1/modules/amplitudejs/icons/player/blue/play.png" : "/assets/theme/j1/modules/amplitudejs/icons/player/blue/pause.png";
-  }
-
-  function toggleAudio2() {
-    if ( player2.getPlayerState() == 1 || player2.getPlayerState() == 3 ) {
-      player2.pauseVideo();
-      togglePlayButton2(false);
-    } else {
-      player2.playVideo();
-      togglePlayButton2(true);
-    }
-  }
-
-  function togglePlayButton3(play) {
-    document.getElementById("youtube-icon3").src = play ? "/assets/theme/j1/modules/amplitudejs/icons/player/blue/play.png" : "/assets/theme/j1/modules/amplitudejs/icons/player/blue/pause.png";
-  }
-
-  function toggleAudio3() {
-    if ( player3.getPlayerState() == 1 || player3.getPlayerState() == 3 ) {
-      player3.pauseVideo();
-      togglePlayButton3(false);
-    } else {
-      player3.playVideo();
-      togglePlayButton3(true);
-    }
-  }
-
-  function togglePlayButton4(play) {
-    document.getElementById("youtube-icon4").src = play ? "/assets/theme/j1/modules/amplitudejs/icons/player/blue/play.png" : "/assets/theme/j1/modules/amplitudejs/icons/player/blue/pause.png";
-  }
-
-  function toggleAudio4() {
-    if ( player4.getPlayerState() == 1 || player4.getPlayerState() == 3 ) {
-      player4.pauseVideo();
-      togglePlayButton4(false);
-    } else {
-      player4.playVideo();
-      togglePlayButton4(true);
-    }
-  }
-
-  function onPlayerReady1(event) {
-    player1.setPlaybackQuality("small");
-    document.getElementById("youtube-audio1").style.display = "block";
-    togglePlayButton1(player1.getPlayerState() !== 5);
-  }
-
-  function onPlayerStateChange1(event) {
-    if (event.data === 0) {
-      togglePlayButton1(false);
-    }
-  }
-
-  function onPlayerReady2(event) {
-    player2.setPlaybackQuality("small");
-    document.getElementById("youtube-audio2").style.display = "block";
-    togglePlayButton2(player2.getPlayerState() !== 5);
-  }
-
-  function onPlayerStateChange2(event) {
-    if (event.data === 0) {
-      togglePlayButton2(false);
-    }
-  }
-
-  function onPlayerReady3(event) {
-    player3.setPlaybackQuality("small");
-    document.getElementById("youtube-audio3").style.display = "block";
-    togglePlayButton3(player3.getPlayerState() !== 5);
-  }
-
-  function onPlayerStateChange3(event) {
-    if (event.data === 0) {
-      togglePlayButton3(false);
-    }
-  }
-
-  function onPlayerReady4(event) {
-    player4.setPlaybackQuality("small");
-    document.getElementById("youtube-audio4").style.display = "block";
-    togglePlayButton4(player4.getPlayerState() !== 5);
-  }
-
-  function onPlayerStateChange4(event) {
-    if (event.data === 0) {
-      togglePlayButton4(false);
-    }
-  }

data/lib/starter_web/pages/public/lazy_loader_tester.adoc

@@ -1,402 +0,0 @@
----
-title:                                  lazyLoader
-title_extention:                        Lazy loading HTML resources using J1 Template
-tagline:                                Lazy loading HTML resources
-
-date:                                   2020-11-04
-#last_modified:                         2023-01-01
-
-description: >
-                                        The J1 Template support playing video on web pages
-                                        by HTML5 Video, the new standard of HTML to show
-                                        videos on web pages.
-keywords: >
-                                        open source, free, template, jekyll, jekyllone, web,
-                                        sites, static, jamstack, bootstrap,
-                                        html, html5, video, support, flash player,
-                                        quicktime, silverlight
-
-categories:                             [ Roundtrip ]
-tags:                                   [ Module, Video ]
-
-image:
-  path:                                 /assets/image/icons/videojs/videojs-poster.png
-  width:                                1920
-  height:                               1280
-
-attic:                                  false
-regenerate:                             false
-personalization:                        true
-permalink:                              /pages/public/lazy_loader_tester/
-
-resources:                              []
-resource_options:
-  - attic:
-      slides:
-        - url:                          /assets/image/icons/videojs/videojs-poster.png
-          alt:                          VideoJS Poster
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// Set (local) page 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="global" %}
-
-
-// Page content
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-[role="dropcap"]
-The J1 Template support playing video on web pages by HTML5 Video, the new
-standard of HTML to show videos on webpages.
-
-Modern browsers support the video tag `<video>` for the new HTML5 video
-standard. The previous proprietary de facto standard software like
-_Flash Player_, _Quicktime_, or _Silverlight_ is no longer needed as the
-Jekyll theme J1 provides HTML5 Video support for local video content
-and from online sources on the Internet.
-
-// Include sub-documents (if any)
-// -----------------------------------------------------------------------------
-[role="mt-5"]
-== Load Images
-
-lorem:sentences[45]
-
-jQuery Lazy is a fast, feature-rich and lightweight delayed content loading
-plugin for jQuery.
-
-It's designed to speed up page loading times and decrease traffic to your
-users by only loading the content in view. You can use Lazy in all vertical
-and horizontal scroll ways.
-
-lorem:sentences[5]
-
-++++
-<img class="lazy" data-src="/assets/image/modules/attics/markus-spiske-1920x1280.jpg" src="" alt="markus-spiske">
-++++
-
-// ++++
-// <img class="lazy" data-src="/assets/image/icons/videojs/videojs-poster.png" src="" alt="VideoJS Poster">
-// ++++
-
-
-// [role="mt-5"]
-// == Load HTML5 Audio
-//
-// Audio players can easily be embedded in web pages using the *audio* tag
-// `<audio>.` Browsers have a built-in framework for decoding and playing audio
-// content directly within a webpage.
-//
-// lorem:sentences[5]
-//
-// .HTML5 Audio
-// ++++
-// <div class="lazy" data-loader="av">
-//   <audio src="/assets/audio/sound-effects/ambient-piano.mp3" controls="">
-//     Your browser does not support the audio tag.
-//   </audio>
-// </div>
-// ++++
-
-[role="mt-5"]
-== Load HTML5 Video
-
-lorem:sentences[5]
-
-.HTML5 Video
-++++
-<!-- video
-  data-poster="/assets/video/poster/html5/peck_pocketed.jpg"
-  src="/assets/video//html5/peck_pocketed.mp4" type="video/mp4"
->
-</video -->
-
-<!-- div class="lazy" data-loader="av">
-  <video
-    controls
-    src="/assets/video//html5/peck_pocketed.mp4"
-    poster="/assets/video/poster/html5/peck_pocketed.jpg">
-    Your browser does not support the video tag.
-  </video>
-</div -->
-
-<div class="lazy" data-loader="av">
-  <video controls data-poster="/assets/image/icons/videojs/videojs-poster.png">
-    <data-src src="/assets/video//html5/peck_pocketed.mp4" type="video/mp4"></data-src>
-  </video>
-</div>
-++++
-
-[role="mt-5"]
-== Load Scroll-Item Images
-
-lorem:sentences[5]
-
-[role="mt-5 mb-5"]
-.News Scroll Group
-++++
-<div id="home_news" class="preview_content">
-  <ul id="home_news-scroll-group" class="scroll-group scroll-group-horizontal align-items-stretch flex-wrap">
-    <!-- [INFO   ] [~/assets/data/panel.html              ] [ write post items (card_block == 'card-list')] -->
-    <li id="home_news-scroll-item" class="scroll-group-item items-2 p-0">
-      <article class="card card-same-height raised-z0 mb-5">
-        <img class="lazy img-fluid img-object--cover g-height-300" data-src="/assets/image/modules/attics/1920x1280/j1-starter-mockup-1.jpg" src="" alt="Protocol scheme" style="filter: grayscale(1) contrast(1) brightness(1);">
-        <!-- h3 id="639670" class="card-header bg-primary notoc notranslate">URLs</h3 -->
-        <h3 id="286107" class="card-header bg-primary notranslate">URLs</h3>
-        <!-- Body|Excerpt -->
-        <div class="card-body r-text-300 mt-0">
-          <div class="paragraph dropcap">
-            <p class="dropcap"><span class="j1-dropcap">W</span>hat is the difference between the URLs https://domain and //domain?</p>
-          </div>
-        </div>
-        <!-- End Body|Excerpt -->
-        <div class="card-footer speak2me-ignore r-text-200">
-          <div class="card-footer-text">
-            <i class="mdib mdib-calendar-blank md-grey-900 mr-1"></i>2023 October, 18
-            <!-- Cleanup categories by given blacklist -->
-            <!-- Build element strings -->
-            <p class="result-item-text small mb-3 notranslate">
-              <i class="mdib mdib-tag-text-outline mdib-18px mr-1"></i>
-              <span class="sr-categories">Web</span>
-              <br>
-              <i class="mdib mdib-tag mdib-18px mr-1"></i>
-              <span class="sr-tags">Protocols</span>
-            </p>
-          </div>
-          <a class="card-link text-lowercase" href="/posts/public/featured/web/2023/10/18/url-types/">
-          read · Protocol scheme
-          </a>
-        </div>
-      </article>
-    </li>
-    <li id="home_news-scroll-item" class="scroll-group-item items-2 p-0">
-      <article class="card card-same-height raised-z0 mb-5">
-        <img class="lazy img-fluid img-object--cover g-height-300" data-src="/assets/image/modules/attics/1920x1280/j1-starter-mockup-1.jpg" src="" alt="About the Template" style="filter: grayscale(1) contrast(1) brightness(1);">
-        <!-- h3 id="781169" class="card-header bg-primary notoc notranslate">J1 Theme</h3 -->
-        <h3 id="318611" class="card-header bg-primary notranslate">J1 Theme</h3>
-        <!-- Body|Excerpt -->
-        <div class="card-body r-text-300 mt-0">
-          <div class="paragraph dropcap">
-            <p class="dropcap"><span class="j1-dropcap">J</span>1 Template is a Bootstrap V5 website template for the static site generator
-              Jekyll.
-            </p>
-          </div>
-          <div class="paragraph">
-            <p>The Theme J1 has been developed to create simple but fully configurable
-              websites. Jekyll One is a full-featured Theme for Jekyll to create modern
-              websites for free.
-            </p>
-          </div>
-        </div>
-        <!-- End Body|Excerpt -->
-        <div class="card-footer speak2me-ignore r-text-200">
-          <div class="card-footer-text">
-            <i class="mdib mdib-calendar-blank md-grey-900 mr-1"></i>2022 February,  1
-            <!-- Cleanup categories by given blacklist -->
-            <!-- Build element strings -->
-            <p class="result-item-text small mb-3 notranslate">
-              <i class="mdib mdib-tag-text-outline mdib-18px mr-1"></i>
-              <span class="sr-categories">Jekyll</span>
-              <br>
-              <i class="mdib mdib-tag mdib-18px mr-1"></i>
-              <span class="sr-tags">Theme</span>
-            </p>
-          </div>
-          <a class="card-link text-lowercase" href="/posts/public/featured/jekyll/2022/02/01/about-j1/">
-          read · About the Template
-          </a>
-        </div>
-      </article>
-    </li>
-    <li id="home_news-scroll-item" class="scroll-group-item items-2 p-0">
-      <article class="card card-same-height raised-z0 mb-5">
-        <!-- [INFO   ] [j1.layouts.content_generator_news_panel_posts.html ] [ place post image ] -->
-        <img class="lazy img-fluid img-object--cover g-height-300" data-src="/assets/image/modules/attics/machine-generator-1920x1280.jpg" src=""  alt="Top open source Tools" style="filter: grayscale(1);">
-        <!-- h3 id="376383" class="card-header bg-primary notoc notranslate">Site Generators</h3 -->
-        <h3 id="955445" class="card-header bg-primary notranslate">Site Generators</h3>
-        <!-- Body|Excerpt -->
-        <div class="card-body r-text-300 mt-0">
-          <div class="paragraph dropcap">
-            <p class="dropcap"><span class="j1-dropcap">T</span>his article highlights the top Open Source projects providing static site
-              generators, so-called SSGs, in many different programming languages. You will
-              find Jekyll one of them.
-            </p>
-          </div>
-          <div class="paragraph">
-            <p>A SSG is a software tool that assists in creating websites by generating
-              static HTML, CSS, and JavaScript files. Unlike dynamic websites that generate
-              content on the server side in response to each request of a user, static sites
-              pre-generate the content upfront it is served to users.
-            </p>
-          </div>
-        </div>
-        <!-- End Body|Excerpt -->
-        <div class="card-footer speak2me-ignore r-text-200">
-          <div class="card-footer-text">
-            <i class="mdib mdib-calendar-blank md-grey-900 mr-1"></i>2021 February,  1
-            <!-- Cleanup categories by given blacklist -->
-            <!-- Build element strings -->
-            <p class="result-item-text small mb-3 notranslate">
-              <i class="mdib mdib-tag-text-outline mdib-18px mr-1"></i>
-              <span class="sr-categories">Jekyll</span>
-              <br>
-              <i class="mdib mdib-tag mdib-18px mr-1"></i>
-              <span class="sr-tags">Generators</span>
-            </p>
-          </div>
-          <a class="card-link text-lowercase" href="/posts/public/featured/jekyll/2021/02/01/static-site-generators/">
-          read · Top open source Tools
-          </a>
-        </div>
-      </article>
-    </li>
-    <li id="home_news-scroll-item" class="scroll-group-item items-2 p-0">
-      <article class="card card-same-height raised-z0 mb-5">
-        <!-- [INFO   ] [j1.layouts.content_generator_news_panel_posts.html ] [ place post image ] -->
-        <img class="lazy img-fluid img-object--cover g-height-300" data-src="/assets/image/modules/attics/cookies-1920x1200.jpg" src="" alt="Data for Site Control" style="filter: grayscale(1);">
-        <!-- h3 id="283406" class="card-header bg-primary notoc notranslate">Cookies</h3 -->
-        <h3 id="343365" class="card-header bg-primary notranslate">Cookies</h3>
-        <!-- Body|Excerpt -->
-        <div class="card-body r-text-300 mt-0">
-          <div class="paragraph dropcap">
-            <p class="dropcap"><span class="j1-dropcap">C</span>ookies can be used for various purposes, such as tracking user behavior,
-              remembering login credentials, and personalizing the user experience.
-            </p>
-          </div>
-          <div class="paragraph">
-            <p>Providing clear and transparent information about using cookies by website
-              operators helps users understand how their data is used and allows them to
-              make better choices about their privacy.
-            </p>
-          </div>
-        </div>
-        <!-- End Body|Excerpt -->
-        <div class="card-footer speak2me-ignore r-text-200">
-          <div class="card-footer-text">
-            <i class="mdib mdib-calendar-blank md-grey-900 mr-1"></i>2021 January,  1
-            <!-- Cleanup categories by given blacklist -->
-            <!-- Build element strings -->
-            <p class="result-item-text small mb-3 notranslate">
-              <i class="mdib mdib-tag-text-outline mdib-18px mr-1"></i>
-              <span class="sr-categories">Technology</span>
-              <br>
-              <i class="mdib mdib-tag mdib-18px mr-1"></i>
-              <span class="sr-tags">Cookies</span>
-            </p>
-          </div>
-          <a class="card-link text-lowercase" href="/posts/public/featured/technology/2021/01/01/about-cookies/">
-          read · Data for Site Control
-          </a>
-        </div>
-      </article>
-    </li>
-  </ul>
-</div>
-++++
-
-// [role="mt-5"]
-// == Load CSS Styles
-//
-// lorem:sentences[5]
-//
-// [role="mt-5 mb-5"]
-// .HTML Code
-// [source, html]
-// ----
-// <div class="lazy" data-loader="av">
-//   <audio src="/assets/audio/sound-effects/ambient-piano.mp3" controls="">
-//     Your browser does not support the audio tag.
-//   </audio>
-// </div>
-// ----
-
-
-[role="mt-5"]
-== Load Background Images
-
-lorem:sentences[5]
-
-++++
-<div class="lazy parallaxBg" alt="sigmund">
-
-    <style>
-        .parallaxBg{background:url("/assets/image/modules/attics/sigmund-1920x1280.jpg"); min-height: 450px; background-attachment: fixed; background-position: center;  background-repeat: no-repeat; background-size: cover; }
-        .banner_parallax-parallax-quote{color:#fff;padding:100px 0;position:relative;text-align:center}
-        .banner_parallax-parallax-quote:before{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;background: url("/assets/image/modules/patterns/gridtile.png") repeat;}
-        .banner_parallax-parallax-quote:after{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;background:rgba(0,0,0,0.6)}
-        .banner_parallax-parallax-quote-in{z-index: 2;position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; padding: 20px; text-align: center; font-family: "Roboto Slab", Helvetica, Arial, sans-serif; }
-        .banner_parallax-parallax-quote-in p{color:var(--md-gray-300);font-size:300%;text-transform:uppercase;line-height: 1.25;}
-    </style>
-
-</div>
-++++
-
-++++
-<div class="copyright">
-  <div class="container">
-    <div class="row">
-      <!-- [INFO   ] [~/assets/data/footer.html                ] [Enable horizontal list using id #inline] -->
-      <div class="col-md-10" id="inline">
-        <!-- [INFO   ] [legal_statements.proc              ] [ process legal statements configured ] -->
-        <ul class="list-inline terms-menu">
-          <li class="notranslate"><a class="link-no-decoration" href="/pages/public/legal/en/copyright/">© 2023, 2024, 2024 J1 · All rights reserved</a></li>
-          <li class="notranslate"><a class="link-no-decoration" href="/pages/public/legal/en/privacy/">Privacy</a></li>
-        </ul>
-      </div>
-      <div class="col-md-10" id="inline">
-        <!-- [INFO   ] [issue.proc                         ] [ issue date information ] -->
-        <!-- [INFO   ] [issue.proc                         ] [ place issue ] -->
-        <p class="footer-issue">Last modified: Saturday, 17 August 2024</p>
-      </div>
-      <div class="col-md-10">
-        <!-- [INFO   ] [social_media_icons.proc            ] [ place icons configured ] -->
-        <ul class="lazy social-icons">
-          <li><a id="footerGithubButton" href="//github.com/jekyll-one/j1-starter" aria-label="footerGithubButton" data-original-title="Github" class="lazy rounded-circle social_github     " target="_blank" rel="noopener noreferrer"></a></li>
-          <li><a id="footerFacebookButton" href="#" aria-label="footerFacebookButton" data-original-title="Facebook" class="lazy rounded-circle social_facebook   " target="_blank" rel="noopener noreferrer"></a></li>
-          <li><a id="footerXingButton" href="#" aria-label="footerXingButton" data-original-title="Xing" class="lazy rounded-circle social_xing       " target="_blank" rel="noopener noreferrer"></a></li>
-          <li><a id="footerLinkedinButton" href="#" aria-label="footerLinkedinButton" data-original-title="linkedin" class="lazy rounded-circle social_linkedin   " target="_blank" rel="noopener noreferrer"></a></li>
-        </ul>
-      </div>
-    </div>
-  </div>
-</div>
-++++
-
-// [role="mt-5 mb-5"]
-// .Parallax Banner
-// ++++
-// <div id="banner_parallax" class="elevated-z0"><div id="banner_parallax_content" class="lazy parallax"
-//   <style>
-//       .parallaxBg{background:url("/assets/image/modules/attics/ideas-start-here-1920x1280.jpg"); min-height: 450px; background-attachment: fixed; background-position: center;  background-repeat: no-repeat; background-size: cover; }
-//       .banner_parallax-parallax-quote{color:#fff;padding:100px 0;position:relative;text-align:center}
-//       .banner_parallax-parallax-quote:before{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;background: url("/assets/image/modules/patterns/gridtile.png") repeat;}
-//       .banner_parallax-parallax-quote:after{top:0;left:0;width:100%;height:100%;content:" ";position:absolute;background:rgba(0,0,0,0.6)}
-//       .banner_parallax-parallax-quote-in{z-index: 2;position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; padding: 20px; text-align: center; font-family: "Roboto Slab", Helvetica, Arial, sans-serif; }
-//       .banner_parallax-parallax-quote-in p{color:var(--md-gray-300);font-size:300%;text-transform:uppercase;line-height: 1.25;}
-//   </style>
-//
-//   <div class="panel-fluid ">
-//     <div class="lazy row no-gutters banner_parallax-parallax-quote parallaxBg parallax-quoteblock">
-//       <div class="col-md-12 col-xs-12 banner_parallax-parallax-quote-in quote-text">
-//          <p><strong>  <span class="text-primary">Making is</span>  <span class="text-light">like Wanting, <br> but even</span>  <span class="text-primary">Better</span></strong></p>
-//       </div>
-//     </div>
-//   </div>
-//
-// </div>
-// ++++
-
-// [role="mt-5 mb-8"]
-// lorem:sentences[5]