323 lines
16 KiB
HTML
323 lines
16 KiB
HTML
{% load static bootstrap3 i18n %}
|
|
{% get_current_language as LANGUAGE_CODE %}
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="de">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
|
|
<title>ungleich GmbH</title>
|
|
|
|
<!-- Bootstrap Core CSS -->
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="{% static 'ungleich_page/css/lib/animate.min.css' %}" rel="stylesheet">
|
|
|
|
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
|
<!--[if lt IE 9]>
|
|
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
|
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
|
<![endif]-->
|
|
|
|
<link href="//fonts.googleapis.com/css?family=Open+Sans+Condensed:700|Lato:300,400,700|Montserrat:400,700" rel="stylesheet" type="text/css">
|
|
|
|
<!-- Custom CSS -->
|
|
<link href="{% static 'ungleich_page/css/agency.css' %}" rel="stylesheet">
|
|
<link href="{% static 'ungleich_page/css/ungleich.css' %}" rel="stylesheet">
|
|
<link href="{% static 'datacenterlight/css/landing-page.css' %}" rel="stylesheet">
|
|
<link href="{% static 'ungleich_page/css/glasfaser.css' %}" rel="stylesheet">
|
|
|
|
<!-- Google analytics -->
|
|
{% include "google_analytics.html" %}
|
|
<!-- End Google Analytics -->
|
|
|
|
<link rel="shortcut icon" href="{% static 'ungleich_page/img/favicon.ico' %}" type="image/x-icon">
|
|
</head>
|
|
|
|
<body id="page-top" class="index">
|
|
{% include "gdpr_banner.html" %}
|
|
<nav class="navbar navbar-default navbar-fixed-top topnav navbar-transparent">
|
|
<div class="topnav">
|
|
<!-- Brand and toggle get grouped for better mobile display -->
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
|
|
<span class="sr-only">{% trans "Toggle navigation" %}</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a href="https://ungleich.ch" id="logoBlack" class="navbar-brand topnav"><img src="{% static 'ungleich_page/img/logo_black.svg' %}"></a>
|
|
<a href="https://ungleich.ch" id="logoWhite" class="navbar-brand topnav"><img src="{% static 'ungleich_page/img/logo_white.svg' %}"></a>
|
|
</div>
|
|
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
|
<!-- Start Navbar collapse-->
|
|
<ul class="nav navbar-nav navbar-right">
|
|
<li>
|
|
<a class="url-init" href="#services">Technische Details</a>
|
|
</li>
|
|
<li>
|
|
<a class="url-init" href="#about">Wie funktioniert es?</a>
|
|
</li>
|
|
<li>
|
|
<a class="url-init" href="#contact">{% trans "CONTACT" %}</a>
|
|
</li>
|
|
</ul>
|
|
<!-- /.navbar-collapse -->
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Header -->
|
|
<div class="intro-header" id="home">
|
|
<div class="price-tag-container">
|
|
<div class="price-tag"></div>
|
|
</div>
|
|
<div class="high-speed">
|
|
<div class="high-speed-border"></div>
|
|
<h1>{% trans "HIGH SPEED INTERNET" %}</h1>
|
|
<div class="high-speed-border"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<section class="split-section left" id="your">
|
|
<div class="container">
|
|
<div class="split-text">
|
|
<div class="split-title">
|
|
<h2>Unser Glasfaser-Angebot für Glarus Nord, Glarus und Glarus Süd</h2>
|
|
</div>
|
|
<div class="split-description wow fadeInUp">
|
|
<p class="lead"><strong>Surfen Sie mit 100 Mbit/s im Internet!</strong></p>
|
|
<p class="lead">Mit dem neuen Glasfaser-Angebot der ungleich macht das Arbeiten im Internet richtig Spass. Das beste daran: die Geschwindigkeit ist symmetrisch in beide Richtungen verfügbar. Damit kann Ihr Firmennetzwerk auch Dienste bereitstellen.</p>
|
|
<p class="lead">Dieses Angebot ist im Moment ausschliesslich für Firmenkunden verfügbar. Die Aufschaltkosten der Glasfaserleitung sind von der Entfernung zum nächsten Anschlusspunkt abhängig. Fragen Sie noch heute nach einem individuellem Angebot. Gerne stellen wir Ihnen eine persönliche Offerte zusammen.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="split-section right" id="our">
|
|
<div class="container">
|
|
<div class="split-text text-center">
|
|
<div class="wow section-heading-contain fadeInDown">
|
|
<h2 class="section-heading text-center">Was ist es?</h2>
|
|
</div>
|
|
<div class="split-description text-center wow fadeInUp">
|
|
<p class="lead sm_left">Bei diesem Angebot handelt es sich um einen Internetzugang für Firmenkunden.</p>
|
|
<p class="lead sm_left">Sie erhalten in Zusammenarbeit mit unseren Partnern einen Glasfaseranschluss und eine Internetverbindung.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="services">
|
|
<div class="container">
|
|
<div class="text-center section-heading-contain wow fadeInDown">
|
|
<h2 class="section-heading">Technische Details</h2>
|
|
<h3 class="section-subheading text-muted">Im Angebot enthalten sind</h3>
|
|
</div>
|
|
<div class="row text-center">
|
|
<div class="col-sm-4">
|
|
<div class="team-member wow fadeInUp" data-wow-delay="0.25s">
|
|
<img src="{% static 'ungleich_page/img/glasfaser/business.svg' %}" class="img-responsive img-circle" alt="">
|
|
<div class="team-member-caption inline-block">
|
|
<h4 class="portfolio-caption">Business-Internet</h4>
|
|
<p class="text-muted sm_left">Symmetrische Internetleitung 100 Mbit/s upload und 100 Mbit/s download</p>
|
|
<p class="text-muted sm_left">Glasfaser-Installation bis ins Haus (keine Hausverkabelung)</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-4">
|
|
<div class="team-member wow fadeInUp" data-wow-delay="0.5s">
|
|
<img src="{% static 'ungleich_page/img/glasfaser/ip.svg' %}" class="img-responsive img-circle" alt="">
|
|
<div class="team-member-caption inline-block">
|
|
<h4 class="portfolio-caption">Erreichbarkeit im Internet</h4>
|
|
<p class="text-muted sm_left">1 öffentliches IPv6-Netzwerk (/64)</p>
|
|
<p class="text-muted sm_left">1 öffentliche IPv4-Adresse</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-4">
|
|
<div class="team-member wow fadeInUp" data-wow-delay="0.75s">
|
|
<img src="{% static 'ungleich_page/img/glasfaser/switch.svg' %}" class="img-responsive img-circle" alt="">
|
|
<div class="team-member-caption inline-block">
|
|
<h4 class="portfolio-caption">Einfach zu nutzen</h4>
|
|
<p class="text-muted sm_left">2 bereits für Sie konfigurierte Endgeräte (benötigt zwei Ihrer Steckdosen)</p>
|
|
<p class="text-muted sm_left">Einfach einstecken und los!</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- About Section -->
|
|
<section id="about">
|
|
<div class="container">
|
|
<div class="text-center wow fadeInDown section-heading-contain">
|
|
<h2 class="section-heading">Wie funktioniert es?</h2>
|
|
<h3 class="section-subheading text-muted sm_left">So kommen Sie in wenigen einfachen Schritten zu Ihrem High-Speed-Internet</h3>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<ul class="timeline">
|
|
<li>
|
|
<div class="timeline-image">
|
|
<img class="img-circle img-responsive" src="{% static 'ungleich_page/img/glasfaser/a.jpg' %}" alt="">
|
|
</div>
|
|
<div class="timeline-panel wow slideInLeft">
|
|
<div class="timeline-body">
|
|
<p>Senden Sie uns via E-Mail Ihren Firmennamen und Ihre Anschrift zu.</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="timeline-inverted">
|
|
<div class="timeline-image">
|
|
<img class="img-circle img-responsive" src="{% static 'ungleich_page/img/glasfaser/b.jpg' %}" alt="">
|
|
</div>
|
|
<div class="timeline-panel wow slideInRight">
|
|
<div class="timeline-body">
|
|
<p>Wir prüfen dann die Entfernung zum nächsten Anschlusspunkt und schicken Ihnen eine Offerte zu.</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="timeline-image">
|
|
<img class="img-circle img-responsive" src="{% static 'ungleich_page/img/glasfaser/c.jpg' %}" alt="">
|
|
</div>
|
|
<div class="timeline-panel wow slideInLeft">
|
|
<div class="timeline-body">
|
|
<p>Sollten Sie dem Angebot zustimmen, wird die Glasfaser zu Ihrem Standort verlegt und die Endgeräte installiert.</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="timeline-inverted" style="background: #fff;">
|
|
<div class="timeline-image">
|
|
<img class="img-circle img-responsive" src="{% static 'ungleich_page/img/glasfaser/d.jpg' %}" alt="">
|
|
</div>
|
|
<div class="timeline-panel wow slideInDown">
|
|
<div class="timeline-body">
|
|
<p>Sie müssen dann nur noch Ihre Geräte anschliessen und schon surfen Sie blitzschnell im Internet!</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- / contact section -->
|
|
<div id="contact" class="full-contact-section">
|
|
<div class="intro-header-2 contact-section" id="contact">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<div class="title">
|
|
<h2>Kontakt</h2>
|
|
</div>
|
|
<div class="contact-details">
|
|
<div class="subtitle">
|
|
<h3>ungleich glarus ag</h3>
|
|
</div>
|
|
<div class="description">
|
|
<p>glasfaser@ungleich.ch</p>
|
|
<p>Bahnhofstrasse 1, 8783 Linthal</p>
|
|
<p>Switzerland</p>
|
|
</div>
|
|
</div>
|
|
<div class="social">
|
|
<a target="_blank" href="https://twitter.com/datacenterlight"><i class="fa fa-twitter fa-fw"></i></a>
|
|
<a target="_blank" href="https://github.com/ungleich"><i class="fa fa-github fa-fw"></i></a>
|
|
<a target="_blank" href="https://www.facebook.com/ungleich.ch/"><i class="fa fa-facebook"></i></a>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<div id="contact-form" class="contact-form">
|
|
{% if success %}
|
|
<div class="contact-form-success">
|
|
<div class="subtitle text-center">
|
|
<h3>{% trans "Thank you for contacting us." %}</h3>
|
|
</div>
|
|
<p>
|
|
{% trans "Your message was successfully sent to our team." %}
|
|
</p>
|
|
</div>
|
|
{% else %}
|
|
<div class="row">
|
|
<div class="col-sm-offset-2 col-sm-10">
|
|
<div class="subtitle">
|
|
<h3>Senden Sie uns eine Nachricht.</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<form class="form-horizontal ajax-form" method="POST" action="{% url 'datacenterlight:contact_us' %}" data-toggle="validator" data-response="#contact-form">
|
|
{% csrf_token %}
|
|
<input type="hidden" value="glasfaser" name="from_page">
|
|
<div class="form-group">
|
|
<label class="control-label col-sm-2" for="name">{% trans "Name" %}</label>
|
|
<div class="col-sm-10">
|
|
<input type="text" name="name" class="form-control" data-minlength="3" data-error="{% trans 'Please enter your name.' %}" required>
|
|
{{contact_form.name.errors}}
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="control-label col-sm-2" for="email">{% trans "Email" %}</label>
|
|
<div class="col-sm-10">
|
|
<input name="email" type="email" pattern="^[^@\s]+@([^@\s]+\.)+[^@\s]+$" class="form-control" data-error="{% trans 'Please enter a valid email address.' %}" required>
|
|
{{contact_form.email.errors}}
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="control-label col-sm-2" for="message">{% trans "Message" %}</label>
|
|
<div class="col-sm-10">
|
|
<textarea class="form-control" name="message" id="message" rows="6" required></textarea>
|
|
{{contact_form.message.errors}}
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<div class="col-sm-offset-2 col-sm-10 text-right">
|
|
<div class="form-error hide">{% trans "Sorry, there was an unexpected error. Kindly retry." %}</div>
|
|
<button type="submit" class="btn btn-default">{% trans "SUBMIT" %}</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.banner -->
|
|
|
|
<!-- Footer -->
|
|
{% include "ungleich_page/includes/_footer.html" %}
|
|
|
|
<!-- jQuery -->
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
|
|
<script type="text/javascript">
|
|
$(document).ready(function () {
|
|
if ($(".has-error").length != 0) {
|
|
window.location = window.location.pathname + "#contact"
|
|
}
|
|
});
|
|
</script>
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>
|
|
|
|
<!-- Plugin JavaScript -->
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/1000hz-bootstrap-validator/0.11.9/validator.min.js"></script>
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/classie/1.0.1/classie.min.js" type="text/javascript"></script>
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js" type="text/javascript"></script>
|
|
|
|
<!-- Custom Theme JavaScript -->
|
|
<script src="{% static 'datacenterlight/js/main.js' %}"></script>
|
|
|
|
<!-- Custom Fonts -->
|
|
<link href="//fonts.googleapis.com/css?family=Raleway" rel="stylesheet" type="text/css">
|
|
<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
|
|
</body>
|
|
</html>
|