File: /var/www/linde-ai/wp-content/themes/linde/footer-static.php
<footer class="site-footer">
<div class="container">
<div class="row">
<div class="col-12 col-md-10 offset-md-1">
<nav class="site-footer__nav">
<ul class="site-footer__list">
<li class="site-footer__item">
<a href="#" class="site-footer__link">Privacy Statement</a>
</li>
<li class="site-footer__item">
<a href="#" class="site-footer__link">Terms & Conditions</a>
</li>
<li class="site-footer__item">
<a href="#" class="site-footer__link">Cookie Policy</a>
</li>
<li class="site-footer__item">
<a href="#" class="site-footer__link">Contact us</a>
</li>
<li class="site-footer__item">
<a href="#" class="site-footer__link">LINDE PLANTSERV®</a>
</li>
</ul>
</nav>
<div class="subscribe">
<div class="subscribe__text">Subscribe to our newsletter and get notified about new courses</div>
<form action="#">
<input type="text" name="subscribe" id="subscribe">
<button class="btn btn--hollow"><span>Submit</span></button>
</form>
</div>
<div class="site-footer__copy">© Linde</div>
</div>
</div>
</div>
</footer>
<!-- Form modal -->
<div class="modal-window modal-form">
<div class="modal-inner">
<div class="close-modal">
<svg class="icon-close">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-close"></use>
</svg>
</div>
<div class="modal-content">
<h2>Send Inquiry</h2>
<form action="#">
<div class="form-wrap">
<div class="form-group">
<label for="name">First Name*</label>
<input type="text" name="name" id="name">
</div>
<div class="form-group">
<label for="surname">Last Name*</label>
<input type="text" name="surname" id="surname">
</div>
<div class="form-group">
<label for="email">Email*</label>
<input type="email" name="email" id="email">
</div>
<div class="form-group">
<label for="company">Company*</label>
<input type="text" name="company" id="company">
</div>
<div class="form-group">
<label for="job-title">Job title</label>
<input type="text" name="job-title" id="job-title">
</div>
<div class="form-group">
<label for="country">Country</label>
<input type="text" name="country" id="country">
</div>
<div class="form-group">
<label for="phone">Phone</label>
<input type="text" name="phone" id="phone">
</div>
<div class="form-group full-width">
<label for="message">Your message</label>
<textarea name="message" id="message" cols="30" rows="10"></textarea>
</div>
<div class="form-group full-width">
<div class="checkbox-styled">
<label for="terms" class="">
I accept Linde Engineering's <a href="#">Data Protection</a> terms and its <a href="#">Terms and Conditions of Use</a>.*
<input name="terms" type="checkbox" id="terms">
<span class="checkmark"></span>
</label>
</div>
</div>
<div class="form-group full-width">
<div class="checkbox-styled">
<label for="newsletter" class="">
I would like to be informed about products, innovations and news around Linde Engineering.
<input name="newsletter" type="checkbox" id="newsletter">
<span class="checkmark"></span>
</label>
</div>
</div>
<div class="btn-left">
<button type="submit" class="btn btn--gradient">Send</button>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- Cookies -->
<div class="cookie" style="display: none">
<div class="container">
<div class="row">
<div class="col-12 col-xl-9">
<h2>Cookie Preferences</h2>
<p>By clicking “Accept All Cookies”, you agree to the storing of cookies and similar technologies on your device to enhance site navigation, analyze site usage, offer certain functionalities and assist in our marketing efforts. Strictly necessary cookies are always active. You can read more about our policy in the <br /><a href="#">Privacy Policy.</a>.
</p>
</div>
<div class="col-12 col-xl-3 btn-col">
<div class="inline-buttons">
<button class="btn btn--gradient-small acceptAllCookies">Accept All Cookies</button>
<button class="btn btn--gradient-small acceptNecessaryCookies">Reject</button>
</div>
</div>
</div>
</div>
</div>
<!-- Video modal -->
<!-- data-video not needed if we inject the video dinamically (change in js too if needed) -->
<div class="modal-window modal-video" data-video="vid1">
<div class="modal-inner">
<div class="close-modal close-video-modal">
<svg class="icon-close">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-close"></use>
</svg>
</div>
<div class="modal-content">
<!-- alot of the logic (controls etc) uses ID on elements..if we can't inject a video on click (which I believe we should anyway cos of performance, videos are gonna be quite big I assume), this will have to be reworked a lot -->
<div class="video-container" id="video-container">
<div class="playback-animation" id="playback-animation">
<svg class="playback-icons">
<use class="hidden" href="#play-icon"></use>
<use href="#pause"></use>
</svg>
</div>
<video controls class="video" id="video" preload="metadata" poster="<?= THEMEROOT ?>/frontend/img/sample.jpg">
<source src="<?= THEMEROOT ?>/frontend/img/videoplayback.mp4" type="video/mp4">
</source>
</video>
<div class="video-controls hidden" id="video-controls">
<div class="bottom-controls">
<div class="left-controls">
<button data-title="Play (p)" id="play">
<div class="playback-icons">
<svg class="icon-play">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-play"></use>
</svg>
<svg class="icon-pause hidden">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-pause"></use>
</svg>
</div>
</button>
</div>
<div class="center-controls">
<div class="video-progress">
<progress id="progress-bar" value="0" min="0"></progress>
<input class="seek" id="seek" value="0" min="0" type="range" step="1">
<div class="seek-tooltip" id="seek-tooltip">00:00</div>
<time class="time-elapsed h6" id="time-elapsed">00:00</time>
<time class="time-duration h6" id="duration">00:00</time>
</div>
</div>
<div class="right-controls">
<div class="volume-controls">
<button data-title="Mute (m)" class="volume-button" id="volume-button">
<div class="volume-icons">
<svg class="icon-sound-off hidden">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-sound-off"></use>
</svg>
<svg class="icon-sound-low hidden">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-sound-low"></use>
</svg>
<svg class="icon-sound-on">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-sound-on"></use>
</svg>
</div>
</button>
<div class="volume-slider">
<div class="volume-value"></div>
<input class="volume" id="volume" value="1" data-mute="0.5" type="range" max="1" min="0" step="0.01">
</div>
</div>
<button data-title="Full screen (f)" class="fullscreen-button" id="fullscreen-button">
<div class="fullscreen-icons">
<svg class="icon-fullscreen">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-fullscreen"></use>
</svg>
<svg class="icon-exit-fullscreen hidden">
<use xlink:href="<?= THEMEROOT ?>/frontend/icons/icons.svg#icon-exit-fullscreen"></use>
</svg>
</div>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="http://cdn.knightlab.com/libs/juxtapose/latest/js/juxtapose.min.js"></script>
<script type='text/javascript' src='<?= THEMEROOT . 'frontend/js/vendor/vendor.bundle.js' ?>'></script>
<script type='text/javascript' src='<?= THEMEROOT . 'frontend/js/core.bundle.js' ?>'></script>
<?php wp_footer(); ?>
</body>
</html>