{# block page %}
	<section id="contact" class="contact gray-bg">
		<h1>{{ page.name }}</h1>
		<div class="container">
			{% block title %}
				<div class="row os-animation text-center" data-os-animation="fadeInUp">
					<div class="col-xxs-12 title-text">
						<h2 class="title">{{ page.name }}</h2>
					</div>
				</div>
			{% endblock %}
			{% block contents %}
				<div class="row contact-info os-animation" data-os-animation="fadeInUp">
					<div class="col-sm-6">
					
						{% block contact_contents_contacts %}
							{% if site.addr_street and site.addr_city %}
								<div class="head">
									<h3><i class="fa fa-map-marker"></i> {{ out.other }}</h3>
									<p class="description content contact-text address">
										{{ site.addr_street }}<br>
										{{ site.addr_city }}.
									</p>
								</div>
							{% else %}
								<div class="head">
									<h3><i class="fa fa-map-marker"></i> {{ out.other }}</h3>
								</div>
							{% endif %}
							
							<ul class="icon-list">
								
								{% if site.phone %}
									<li><i class="fa fa-phone"></i> {{ out.phone }}: {{ site.phone }}</li>
									<li class="divider"></li>
								{% endif %}
								
								{% if site.cellphone %}
									<li><i class="fa fa-mobile"></i> {{ out.cellphone }}: {{ site.cellphone }}</li>
									<li class="divider"></li>
								{% endif %}
								
								{% if site.fax %}
									<li><i class="fa fa-print"></i> {{ out.fax }}: {{ site.fax }}</li>
									<li class="divider"></li>
								{% endif %}
								
								<li><i class="fa fa-envelope-o"></i> {{ text.misc.email }}: {{ site.email }}</li>
								
								{% if site.skype %}
									<li class="divider"></li>
									<li><i class="fa fa-skype"></i> {{ site.skype }}</li>
								{% endif %}
								
							</ul>
						{% endblock %}

						{% if site.facebook %}
							{% block facebook %}
								{% block facebook_script %}
									<script>
										(function($){
											$(window).load(function(){
												(function(d, s, id) {
													var js, fjs = d.getElementsByTagName(s)[0];
													if (d.getElementById(id)) return;
													js = d.createElement(s); js.id = id;
													js.src = "//connect.facebook.net/pt_PT/sdk.js#xfbml=1&version=v2.5";
													fjs.parentNode.insertBefore(js, fjs);
												}(document, 'script', 'facebook-jssdk'));
											});
										})(jQuery);
									</script>
								{% endblock %}
								
								{% block facebook_content %}
									<p></p>
									<div class="fb-page" data-href="{{ site.facebook }}" data-width="470" data-height="320" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false" data-show-posts="true">
										<div class="fb-xfbml-parse-ignore">
											<blockquote cite="{{ site.facebook }}"><a href="{{ site.facebook }}">{{ site.name }}</a></blockquote>
										</div>
									</div>
								{% endblock %}
							{% endblock %}
						{% endif %}
						
					</div>
					
					<div class="col-sm-6">
						{% block form %}
							<h3><i class="fa fa-envelope-o"></i> {{ page.name }}</h3>
							<div class="form-group">
								<form id="contact-form" method="post" action="contact.php" enctype="application/x-www-form-urlencoded">
									{% block form_content %}
										<label>{{ out.name }} *</label>
										<input type="text" id="name" name="contact[name]" class="form-control" required>
										<label>{{ text.misc.email }} *</label>
										<input type="text" id="email" name="contact[email]" class="form-control" required>
										<label>{{ out.subject }} *</label>
										<input type="text" id="subject" name="contact[subject]" class="form-control" required>
										<label>{{ out.message }} *</label>
										<textarea id="message" name="contact[message]" class="form-control" required></textarea>
										{% if site.contact_captcha %}
											<label>{{ out.captcha }}: <span id="captcha_question">{{ captcha() | raw }}</span> *</label>
											<input id="captcha" name="contact[captcha]" class="form-control" type="text" required>
										{% endif %}
										{% block _ext_data_form_content_consent %}{% endblock %}
										<button id="submit-mail" class="small-button text-left">{{ out.send | upper }}</button>
									{% endblock %}
								</form>
								<div id="contact-form-message"></div>
							</div>
							<div id="success"></div>
						{% endblock form %}
					</div>
				</div>
			{% endblock contents %}
		</div>
	</section>

	{% if site.google_maps %}
		{% block google_maps %}
			<section class="map">
				<h1>{{ out.find_us }}</h1>
				{% block google_maps_content %}
					<div class="map-overlay">
						<button class="map-button" value="{{ out.find_us }}">{{ out.find_us }}</button>
					</div>
					<div id="googlemap">
						<div id="map" data-ll="{{ site.google_maps.ll }}" data-zoom="{{ site.google_maps.z ?: 16 }}"></div>
					</div>
				{% endblock google_maps_content %}
			</section>
		{% endblock google_maps %}
	{% endif %}
{% endblock page #}

{% block page %}
<section id="contact" class="contact container-fluid section">
	{% block title %}
		<header class="title mobile-center">
			<h1>{{ page.name }}</h1>
			<h2 class="text-center">{{ page.name }}</h2>
		</header>
	{% endblock %}

	{% if site.google_maps %}
		{% block google_maps %}
			<div class="map">
				{% block google_maps_content %}
					<div id="map" data-ll="{{ site.google_maps.ll }}" data-zoom="{{ site.google_maps.z ?: 16 }}"></div>
				{% endblock google_maps_content %}
			</div>
		{% endblock google_maps %}
	{% endif %}
	
	<div class="container">
		<div class="row">
			{% block contact_contents_contacts %}
				<div class="col-sm-6 padding-top-80">
					<ul class="contact-list">
						{% if site.addr_street and site.addr_city %}
						<li>
							<i class="fa fa-fw fa-location-arrow"></i>
							<div>
								{{ out.find_us }}
								<span>{{ site.addr_street }}<br>{{ site.addr_city }}</span>
							</div>
						</li>
						{% endif %}
						
						{% for key, item in {
								'phone': {'icon': 'phone'},
								'phonecall': {'icon': 'phone'},
								'cellphone': {'icon': 'mobile'},
								'cellphonecall': {'icon': 'mobile'},
								'fax': {'icon': 'print'},
								'email': {'text': text.misc.email, 'icon': 'envelope-o'},
								'skype': {'icon': 'skype'}
							}
						%}
							{% if site[key] %}
								<li>
									<i class="fa fa-fw fa-{{ item.icon }}"></i> 
									<div> 
										{{ item.text ?: out[key] }}
										<span>{{ site[key] }}</span>
									</div>
								</li>
							{% endif %}
						{% endfor %}
						
					</ul>
					
					{% if site.facebook %}
						{% block facebook %}
							{% block facebook_script %}
								<script>
									(function($){
										$(window).load(function(){
											setTimeout(function(){
												(function(d, s, id) {
													var js, fjs = d.getElementsByTagName(s)[0];
													if (d.getElementById(id)) return;
													js = d.createElement(s); js.id = id;
													js.src = "//connect.facebook.net/pt_PT/sdk.js#xfbml=1&version=v2.5";
													fjs.parentNode.insertBefore(js, fjs);
												}(document, 'script', 'facebook-jssdk'));
											}, 2000);
										});
									})(jQuery);
								</script>
							{% endblock %}
							
							{% block facebook_content %}
								<div class="fb-page" data-href="{{ site.facebook }}" data-width="470" data-height="320" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false" data-show-posts="true">
									<div class="fb-xfbml-parse-ignore">
										<blockquote cite="{{ site.facebook }}"><a href="{{ site.facebook }}">{{ site.name }}</a></blockquote>
									</div>
								</div>
							{% endblock %}
						{% endblock %}
					{% endif %}
					
				</div>
			{% endblock %}
			{% block form %}
				<div class="col-sm-5 col-sm-push-1 padding-top-80">
					<section>
						<form id="contact-form" method="post" action="contact.php" enctype="application/x-www-form-urlencoded" class=" scrollme animateme" data-when="enter" data-from="1" data-to="0" data-opacity="0" data-scale="1.1">
							<input type="hidden" name="csrf_token" value="{{ SESSION.csrf_token }}"/>
							{% block form_content %}
								<label>{{ out.name }} *</label>
								<input type="text" id="name" name="contact[name]">
								
								<label>{{ text.misc.email }} *</label>
								<input type="text" id="email" name="contact[email]">
								
								<label>{{ out.subject }} *</label>
								<input type="text" id="subject" name="contact[subject]">
								
								<label>{{ out.message }} *</label>
								<textarea id="message" name="contact[message]" rows="5"></textarea>
								
								{% if site.contact_captcha %}
									<label>{{ out.captcha }}: <span id="captcha_question">{{ captcha() | raw }}</span> *</label>
									<input id="captcha" name="contact[captcha]" type="text">
								{% endif %}

								{% if site.show_privacy_policy %}
									<div style="display: flex">
    									<div style="margin-bottom: 15px;">
                							<label class="switch">
                                                <input type="checkbox" class="switch-input" id="privacy_policy" name="contact[privacy_policy]"><!--<i class="icon-play" required></i>-->
                                                <span class="switch-label" data-on="{{ out.yes }}" data-off="{{ out.no }}"></span>
                                                <span class="switch-handle"></span>
                                            </label>
                                            <div style="display: inline-block; margin-top: 5px; margin-left: 10px;">
                								{{ out.accept }} <a href="/privacy/privacy_{{ constant('SITE_LANG') }}.html?lightbox[height]=60p&lightbox[width]=50p&page=website" class="lightbox" rel="nofollow"><b>{{ out.privacy_policy_text }}</b></a>
                                            </div>
                						</div>
            						</div>
								{% endif %}
								<div style="display: flex">
        							<div style="display: inline-block">
            							<label class="switch">
                                            <input type="checkbox" class="switch-input" id="marketing_publicity" name="contact[marketing_publicity]" required>
                                                <span class="switch-label" data-on="{{ out.yes }}" data-off="{{ out.no }}"></span>
                                                <span class="switch-handle"></span>
                                        </label>
        							</div>
                                    <div style="display: inline-block; margin-top: -5px; margin-left: 10px;">{{ out.marketing }}</div>
        						</div>
								
								{% block _ext_data_form_content_consent %}{% endblock %}
								
								<input id="submit-mail" type="submit" value="{{ out.send | upper }}" class="btn btn-default">
							{% endblock %}
							<div id="contact-form-message"></div>
						</form>
						<div id="success"></div>
					</section>
				</div>
			{% endblock form %}
		</div>
	</div>
</section>
{% endblock page %}