mirror of
https://github.com/Kugelschieber/schnittfest.git
synced 2026-01-18 10:20:27 +00:00
329 lines
18 KiB
HTML
329 lines
18 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<base href="/" />
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<meta name="copyright" content="Schnittfest GmbH" />
|
||
<meta name="author" content="Emvi Software GmbH" />
|
||
<meta name="title" content="Schnittfest" />
|
||
<meta name="description" content="Film, auf den Frame genau." />
|
||
<meta name="msapplication-TileColor" content="#000000" />
|
||
<meta name="theme-color" content="#000000" />
|
||
<meta name="twitter:card" content="product" />
|
||
<meta name="twitter:title" content="Schnittfest" />
|
||
<meta name="twitter:description" content="Film, auf den Frame genau." />
|
||
<meta name="twitter:image" content="/static/1.jpg" />
|
||
<meta property="og:url" content="https://schnittfest.gmbh/" />
|
||
<meta property="og:title" content="Schnittfest" />
|
||
<meta property="og:description" content="Film, auf den Frame genau." />
|
||
<meta property="og:image" content="/static/1.jpg" />
|
||
|
||
<link rel="stylesheet" type="text/css" href="static/main.css" />
|
||
<link rel="stylesheet" type="text/css" href="static/manrope.css" />
|
||
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet" />
|
||
<link rel="apple-touch-icon" sizes="180x180" href="/static/apple-touch-icon.png" />
|
||
<link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png" />
|
||
<link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png" />
|
||
<link rel="mask-icon" href="/static/safari-pinned-tab.svg" color="#000000" />
|
||
<link rel="shortcut icon" href="/static/favicon.ico" />
|
||
<meta name="apple-mobile-web-app-title" content="Schnittfest" />
|
||
<meta name="application-name" content="Schnittfest" />
|
||
<meta name="msapplication-TileColor" content="#000000" />
|
||
<meta name="theme-color" content="#000000" />
|
||
|
||
<title>Schnittfest</title>
|
||
</head>
|
||
<body class="bg-beige-to-black">
|
||
<nav class="header bg-beige-to-black">
|
||
<div class="container" data-aos="fade-in" data-aos-delay="50">
|
||
<div id="homeLink" class="wordmark black-to-beige">Schnittfest</div>
|
||
<ul class="links hide-sm black-to-beige">
|
||
<li class="scrollToService">Gewerke</li>
|
||
<li class="scrollToWork">Referenzen</li>
|
||
<li class="scrollToRental">Rental</li>
|
||
<li class="scrollToFooter">Kontakt</li>
|
||
</ul>
|
||
<ul class="show-sm black-to-beige">
|
||
<li id="mobileMenuOpen">Menü</li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
|
||
<nav id="mobileMenu" class="mobile-menu show-sm" style="display:none">
|
||
<ul>
|
||
<li class="scrollToService">Gewerke</li>
|
||
<li class="scrollToWork">Referenzen</li>
|
||
<li class="scrollToRental">Rental</li>
|
||
<li class="scrollToFooter">Kontakt</li>
|
||
</ul>
|
||
</nav>
|
||
|
||
<section id="start" class="section-start">
|
||
<div class="container" data-aos="fade-in">
|
||
<div class="headline">
|
||
<h1 data-aos="fade-in">
|
||
Film, auf den Frame genau.
|
||
<a href="mailto:hi@schnittfest.gmbh">⟶</a>
|
||
</h1>
|
||
</div>
|
||
<div id="hero" class="hero" data-aos="fade-in" data-aos-delay="200">
|
||
<video src="/static/hero.mp4" autoplay loop muted />
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="service" class="section-service bg-beige">
|
||
<div class="container">
|
||
<div class="services row">
|
||
<div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Film</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="100">sleep.shoot.eat.repeat. </p>
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Animation</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Herausstechen und Welten erschaffen.</p>
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="300">Sound</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="300">Keine Musik wäre wie Butter ohne Brot.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-8 col-sm-12 col-xs-12 img" data-aos="fade-in"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="work" class="section-work">
|
||
<div class="container">
|
||
<div class="video row reverse">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Commercial</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Bachelor Energiemanagement und industrielle Klimaschutztechnologie - ein Film für den neuen Studiengang an der TH OWL.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
|
||
<iframe src="https://www.youtube.com/embed/L4Te_ifGui4" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="video row reverse">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Imagefilm</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">GOLDBECK und Schüco, das Fenstersystem AWE80 in der Entwicklung und Produktion in Bielefeld.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
|
||
<iframe src="https://www.youtube.com/embed/sFjOfG-5cIE" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="video row reverse">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Porträtfilm</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Digitalisierung im Metallbau - Die berühmt-berüchtigte Industrie 4.0.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
|
||
<iframe src="https://www.youtube.com/embed/ktjlpv6j-Fw" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="video row reverse">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Kampagne</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Azubi Recruiting Film für die Berufe Metallbauer, Metalltechnik, Technischer Systemplaner, Büromanagement.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
|
||
<iframe src="https://www.youtube.com/embed/ji1ux1Y4Y_U" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="video row reverse">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Eventfilm</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Internationaler Reitsport – 140 Reiter aus mehr als 30 Nationen die an den German Friendships auf den Bexterhof in Herford teilnehmen.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
|
||
<iframe src="https://www.youtube.com/embed/X-hIy1Yv-Bw" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="video row reverse">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Eventfilm</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">50 führende Familienunternehmen aus ganz Deutschland zum Karrieretag Familienunternehmen in Bielefeld bei Schüco - Miele, Hilti, Haribo und viele mehr.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
|
||
<iframe src="https://www.youtube.com/embed/b8ASQboLCO8" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="video row reverse">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
|
||
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Porträtfilm</h2>
|
||
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Kurz-Porträtfilm über die Holztechniker im Fachbereich Architektur und Innenarchitektur in Detmold.</p>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
|
||
<iframe src="https://www.youtube.com/embed/8Q8Yb7QhUIA" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="rental" class="section-rental">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12" style="z-index: 1;">
|
||
<div class="square" data-aos="fade-in">
|
||
<h2 class="black-to-beige">Rental</h2>
|
||
<p class="black-to-beige">
|
||
Ready to Shoot Set mit ARRI Alexa Mini LF inkl. Zubehör ab 700€ pro Tag. Weitere Details entnehmen Sie bitte der <a href="static/Schnittfest_Rental_Preisliste.pdf" target="_blank">Preisliste</a>. Es gelten die <a href="/agb" target="_blank">allgemeinen Geschäftsbedinungen</a>.
|
||
</p>
|
||
<a class="button primary" href="mailto:rental@schnittfest.gmbh">Jetzt buchen</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
|
||
<div id="parts" class="parts" data-aos="fade-in" data-aos-delay="100">
|
||
<img id="part0" src="static/blank.png" alt="0">
|
||
<img id="part1" src="static/part1.png" alt="1">
|
||
<img id="part2" src="static/part2.png" alt="2">
|
||
<img id="part3" src="static/part3.png" alt="3">
|
||
<img id="part4" src="static/part4.png" alt="4">
|
||
<img id="part5" src="static/part5.png" alt="5">
|
||
<img id="part6" src="static/part6.png" alt="6">
|
||
<img id="part7" src="static/part7.png" alt="7">
|
||
<img id="part8" src="static/part8.png" alt="8">
|
||
<img id="part9" src="static/part9.png" alt="9">
|
||
<img id="part10" src="static/part10.png" alt="10">
|
||
<img id="part11" src="static/part11.png" alt="11">
|
||
<img id="part12" src="static/part12.png" alt="12">
|
||
<img id="part13" src="static/part13.png" alt="13">
|
||
<img id="part14" src="static/part14.png" alt="14">
|
||
<img id="part15" src="static/part15.png" alt="15">
|
||
<img id="part16" src="static/part16.png" alt="16">
|
||
<img id="part17" src="static/part17.png" alt="17">
|
||
<img id="part18-1" src="static/part18.png" alt="18-1">
|
||
<img id="part18-2" src="static/part18.png" alt="18-2">
|
||
<img id="part19-1" src="static/part19.png" alt="19-1">
|
||
<img id="part19-2" src="static/part19.png" alt="19-2">
|
||
<img id="part20" src="static/part20.png" alt="20">
|
||
<img id="part21" src="static/part21.png" alt="21">
|
||
<img id="part22" src="static/part22.png" alt="22">
|
||
<img id="part23" src="static/part23.png" alt="23">
|
||
<img id="part24" src="static/part24.png" alt="24">
|
||
<img id="part25" src="static/part25.png" alt="25">
|
||
<img id="part26" src="static/part26.png" alt="26">
|
||
<img id="part27" src="static/part27.png" alt="27">
|
||
<img id="part28" src="static/part28.png" alt="28">
|
||
<img id="part29-1" src="static/part29.png" alt="29-1">
|
||
<img id="part29-2" src="static/part29.png" alt="29-2">
|
||
<img id="part30" src="static/part30.png" alt="30">
|
||
<img id="part31-1" src="static/part31.png" alt="31-1">
|
||
<img id="part31-2" src="static/part31.png" alt="31-2">
|
||
<img id="part32-1" src="static/part32.png" alt="32-1">
|
||
<img id="part32-2" src="static/part32.png" alt="32-1">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="instagram" class="section-instagram">
|
||
<div class="container">
|
||
<script src="https://cdn.lightwidget.com/widgets/lightwidget.js"></script>
|
||
<iframe src="https://cdn.lightwidget.com/widgets/ea2fc8dd2d55541dbafdc312dbe28aee.html" scrolling="no" allowtransparency="true" class="lightwidget-widget" style="width:100%;border:0;overflow:hidden;"></iframe>
|
||
</div>
|
||
</section>
|
||
|
||
{{template "footer.html" .}}
|
||
|
||
<script type="text/javascript" src="https://player.vimeo.com/api/player.js"></script>
|
||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.0.4/gsap.min.js"></script>
|
||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/ScrollMagic.min.js"></script>
|
||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/plugins/animation.gsap.min.js"></script>
|
||
<script type="text/javascript" src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
|
||
<script type="text/javascript" src="https://cdn.lightwidget.com/widgets/lightwidget.js"></script>
|
||
<script type="text/javascript" src="js/color.js"></script>
|
||
<script type="text/javascript" src="js/parts.js"></script>
|
||
<script type="text/javascript" src="js/instafeed.min.js"></script>
|
||
|
||
<script>
|
||
AOS.init({
|
||
duration: 1000,
|
||
easing: "cubic-bezier(0.4, 0.0, 0.2, 1)",
|
||
once: true,
|
||
offset: 32
|
||
});
|
||
|
||
// navbar mobile menu
|
||
let mobileMenu = document.getElementById("mobileMenu");
|
||
let mobileMenuOpen = document.getElementById("mobileMenuOpen");
|
||
let mobileMenuClose = document.getElementById("mobileMenuClose");
|
||
|
||
function toggleMobileMenu() {
|
||
let hidden = mobileMenu.style.display;
|
||
|
||
if(hidden) {
|
||
mobileMenu.style.display = "";
|
||
} else {
|
||
mobileMenu.style.display = "none"
|
||
}
|
||
}
|
||
|
||
mobileMenuOpen.addEventListener("click", e => {
|
||
e.preventDefault();
|
||
e.stopPropagation();
|
||
toggleMobileMenu();
|
||
});
|
||
|
||
// scroll to from navigation
|
||
let scrollToService = document.getElementsByClassName("scrollToService");
|
||
let scrollToWork = document.getElementsByClassName("scrollToWork");
|
||
let scrollToRental = document.getElementsByClassName("scrollToRental");
|
||
let scrollToFooter = document.getElementsByClassName("scrollToFooter");
|
||
|
||
function addScrollTo(nodes, anchor) {
|
||
for (let node of nodes) {
|
||
node.addEventListener("click", () => {
|
||
toggleMobileMenu();
|
||
let section = document.getElementById(anchor);
|
||
|
||
if (window.location.pathname === "/") {
|
||
window.scrollTo({top: section.offsetTop, behavior: "smooth"});
|
||
} else {
|
||
window.location = `/#${anchor}`;
|
||
}
|
||
});
|
||
}
|
||
}
|
||
|
||
document.addEventListener("click", e => {
|
||
if(!mobileMenu.style.display) {
|
||
mobileMenu.style.display = "none"
|
||
}
|
||
});
|
||
|
||
addScrollTo(scrollToService, "service");
|
||
addScrollTo(scrollToWork, "work");
|
||
addScrollTo(scrollToRental, "rental");
|
||
addScrollTo(scrollToFooter, "footer");
|
||
|
||
// click on logo navigation
|
||
let homeLink = document.getElementById("homeLink");
|
||
|
||
homeLink.addEventListener("click", e => {
|
||
e.preventDefault();
|
||
e.stopPropagation();
|
||
|
||
if(window.location.pathname === "/") {
|
||
window.scrollTo({top: 0, behavior: "smooth"});
|
||
}
|
||
else {
|
||
window.location = "/";
|
||
}
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|