{% extends 'layout.html.twig' %}
{% block title %}{{ parent() }} - Kontakt{% endblock %}
{% block javascript %}
{{ parent() }}
{{ encore_entry_script_tags('frontend_contact') }}
{% endblock %}
{% block content %}
<div id="map"></div>
<section class="section is-medium has-background-black has-text-centered">
<div class="container">
<div class="columns is-mobile is-centered mb-6">
<div class="column is-four-fifths-mobile is-half-tablet is-one-third-fullhd">
<div class="columns is-mobile is-variable is-0 is-6-tablet">
<div class="column">
<a href="https://www.facebook.com/HilkerSolarGmbh" target="_blank">
<span class="icon">
<i class="fab fa-lg fa-facebook-f"></i>
</span>
</a>
</div>
<div class="column">
<a href="https://www.instagram.com/hilker_solar" target="_blank">
<span class="icon">
<i class="fab fa-lg fa-instagram"></i>
</span>
</a>
</div>
<div class="column">
<a href="https://www.youtube.com/channel/UC5ilz4EXTMnJkS3LB-67lkw" target="_blank">
<span class="icon">
<i class="fab fa-lg fa-youtube"></i>
</span>
</a>
</div>
<div class="column">
<a href="https://www.xing.com/pages/hilker-group" target="_blank">
<span class="icon">
<i class="fab fa-lg fa-xing"></i>
</span>
</a>
</div>
<div class="column">
<a href="https://de.linkedin.com/company/hilker-solar-gmbh" target="_blank">
<span class="icon">
<i class="fab fa-lg fa-linkedin"></i>
</span>
</a>
</div>
</div>
</div>
</div>
<div class="columns is-centered">
<div class="column is-four-fifths is-two-thirds-desktop">
<div class="columns">
<div class="column">
<h2 class="h3 has-text-white">Adresse</h2>
<p>Carl-Zeiss-Str. 24 – 26<br>32369 Rahden</p>
</div>
<div class="column">
<h2 class="h3 has-text-white">Öffnungszeiten</h2>
<p>Montag – Freitag<br>08:00 – 16:00</p>
</div>
<div class="column">
<h2 class="h3 has-text-white">Telefon & Email</h2>
<p><a href="tel:+495771914990">+49 (0) 5771 – 914 99 0</a><br><a href="mailto:info@hilker-solar.de">info@hilker-solar.de</a></p>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="contact_form" class="section is-medium">
<div class="container has-text-centered">
<div class="columns is-desktop">
<div class="column is-8-tablet is-offset-2-tablet is-10-desktop is-offset-1-desktop">
{{ form_start(contactForm) }}
<h1 class="h1">
Kontakt
</h1>
<div class="field-body mb-3">
<div class="field has-text-left">
<label class="label">Nachname</label>
<div class="control">
{{ form_widget(contactForm.last_name, {'attr': {'class': 'input', 'placeholder': 'Nachname'}}) }}
</div>
</div>
<div class="field has-text-left">
<label class="label">Vorname</label>
<div class="control">
{{ form_widget(contactForm.first_name, {'attr': {'class': 'input', 'placeholder': 'Vorname'}}) }}
</div>
</div>
</div>
<div class="field-body mb-3">
<div class="field has-text-left">
<label class="label">E-Mail</label>
<div class="control">
{{ form_widget(contactForm.email, {'attr': {'class': 'input', 'placeholder': 'E-Mail-Adresse'}}) }}
</div>
</div>
<div class="field has-text-left">
<label class="label">Telefonnummer</label>
<div class="control">
{{ form_widget(contactForm.phone, {'attr': {'class': 'input', 'placeholder': 'Telefonnummer'}}) }}
</div>
</div>
</div>
<div class="field has-text-left">
<label class="label">Thema</label>
<div class="select">
{{ form_widget(contactForm.subject) }}
</div>
</div>
<div class="field has-text-left">
<label class="label">Nachricht</label>
<div class="control">
{{ form_widget(contactForm.message, {'attr': {'class': 'textarea', 'placeholder': 'Nachricht'}}) }}
</div>
</div>
{{ form_widget(contactForm.captcha) }}
<div class="field">
<div class="control">
<button type="submit" class="button is-medium is-rounded mt-5" style="min-width: 50%;">Senden</button>
</div>
</div>
{{ form_end(contactForm) }}
</div>
</div>
</div>
</section>
{% include 'frontend/_sections/_showroom.html.twig' %}
{% endblock %}