<div role="main" class="main main-home">

	<!-- ---------------------------------------------------------------------------------------------------------- -->
	<!-- ------------------------------------------------[ DESKTOP ]----------------------------------------------- -->
	<!-- ---------------------------------------------------------------------------------------------------------- -->

	<?php if(isset($lighthouse) AND empty($lighthouse)) { ?>

		<?php if(isset($banners) AND !empty($banners)) { ?>
			<section class="banners-desktop mb-0 d-none d-sm-none d-md-none d-lg-block d-xl-block">
				<div class="container-fluid m-0 p-0">
					<div class="row">
						<div class="mb-0 owl-carousel owl-theme nav-inside nav-inside-edge nav-squared nav-with-transparency nav-dark" data-plugin-options="{'items': 1, 'margin': 0, 'loop': true, 'nav': false, 'dots': false, 'autoplay': true, 'autoHeight': true, 'autoplayHoverPause': true, 'autoplayTimeout': 3000, 'autoplaySpeed': 1000}">
							<?php foreach($banners as $key => $banner) {
								if(!empty($banner->imagem)) { ?>
									<div>
										<div class="img-thumbnail border-0 p-0 d-block">
											<?php if($banner->tipo == 2) { ?> 
												<a data-hash data-hash-offset="68" href="<?php if(isset($banner->ancora) AND !empty($banner->ancora)) { echo '#'.$banner->ancora; } ?>">
													<img class="img-fluid" src="<?php echo PUBLICURL . 'uploads/upload_cad_banner/item_' . $banner->id . '/' . $banner->imagem; ?>" alt="<?php echo $banner->titulo; ?>">
												</a>
											<?php } else { ?> 
												<a target="<?php if(isset($banner->target) AND !empty($banner->target)) { echo $banner->target; } ?>" href="<?php if(isset($banner->link) AND !empty($banner->link)) { echo $banner->link; } ?>">
													<img class="img-fluid" src="<?php echo PUBLICURL . 'uploads/upload_cad_banner/item_' . $banner->id . '/' . $banner->imagem; ?>" alt="<?php echo $banner->titulo; ?>">
												</a>
											<?php } ?>
										</div>
									</div>
								<?php }
							} ?>
						</div>
					</div>
				</div>
			</section>
		<?php } ?>

		<?php if(isset($banners) AND !empty($banners)) { ?>
			<section class="banners-mobile mb-0 d-block d-sm-block d-md-block d-lg-none d-xl-none mb-0">
				<div class="container-fluid m-0 p-0">
					<div class="row">
						<div class="mb-0 owl-carousel owl-theme nav-inside nav-inside-edge nav-squared nav-with-transparency nav-dark m-0 p-0" data-plugin-options="{'items': 1, 'margin': 0, 'loop': true, 'nav': false, 'dots': false, 'autoplay': true, 'autoHeight': true, 'autoplayHoverPause': true, 'autoplayTimeout': 3000, 'autoplaySpeed': 1000}">
							<?php foreach($banners as $key => $banner) {
								if(!empty($banner->imagem_mobile)) { ?>
									<div>
										<div class="img-thumbnail border-0 p-0 d-block">
											<?php if($banner->tipo == 2) { ?> 
												<a data-hash data-hash-offset="68" href="<?php if(isset($banner->ancora) AND !empty($banner->ancora)) { echo '#'.$banner->ancora; } ?>">
													<img class="img-fluid" src="<?php echo PUBLICURL . 'uploads/upload_cad_banner/item_' . $banner->id . '/' . $banner->imagem_mobile; ?>" alt="<?php echo $banner->titulo; ?>">
												</a>
											<?php } else { ?> 
												<a target="<?php if(isset($banner->target) AND !empty($banner->target)) { echo $banner->target; } ?>" href="<?php if(isset($banner->link) AND !empty($banner->link)) { echo $banner->link; } ?>">
													<img class="img-fluid" src="<?php echo PUBLICURL . 'uploads/upload_cad_banner/item_' . $banner->id . '/' . $banner->imagem_mobile; ?>" alt="<?php echo $banner->titulo; ?>">
												</a>
											<?php } ?>
										</div>
									</div>
								<?php }
							} ?>
						</div>
					</div>
				</div>
			</section>
		<?php } ?>

	<?php } ?>

	<!-- ---------------------------------------------------------------------------------------------------------- -->

	<section class="py-5 section-menu d-none d-lg-flex bg-app-custom-color-duo">
		<div class="container">
			<div class="row">
				<div class="col-12">
					<h1 class="m-0 p-0 text-13 lh-1 ls-1 font-weight-bold text-white text-center">
						Contato
					</h1>
				</div>
			</div>
		</div>
	</section>

	<!-- ---------------------------------------------------------------------------------------------------------- -->

	<section class="section section-default border-0 bg-white d-none d-lg-flex">
		<div class="container">
			<div class="row d-flex justify-content-center align-items-center flex-column">
				<div class="col-8">
					<?php echo form_open_multipart(site_url('contato/cadastrar'), array ('class' => 'customForm col-12 m-0 p-0', 'id' => 'contactForm')); ?>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="titulo" id="titulo" class="form-control rounded-0" required placeholder="Nome completo:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="email" id="email" class="form-control rounded-0" required placeholder="E-mail:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="celular" id="celular" class="form-control rounded-0 mask-phone" required placeholder="Celular/WhatsApp:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12 col-lg-6">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<select class="form-control rounded-0 custom-pointer select-estado" name="estado" id="estado" required placeholder="Estado:" data-msg-required="Campo obrigatório!">
									<option value="" selected disabled>Estado:</option>

									<?php foreach($appEstados as $key => $estado) { ?>
										<option value="<?php echo $estado->id; ?>"><?php echo $estado->titulo; ?></option>
									<?php } ?>
								</select>
							</div>
						</div>

						<div class="col-12 col-lg-6">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<select class="form-control rounded-0 custom-pointer select-cidade" name="cidade" id="cidade" required placeholder="Cidade:" data-msg-required="Campo obrigatório!">
									<option value="" selected disabled>Selecione primeiro o estado!</option>
								</select>
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="descricao" id="descricao" class="form-control rounded-0" required placeholder="Mensagem:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-4">
						<div class="col-12 d-flex justify-content-center align-items-center">
							<input class="js-switch-form" type="checkbox" name="aceito" id="aceito" required data-msg-required="Campo obrigatório!">

							<label class="m-0 ms-2 p-0 text-3 text-black">
								Aceito os <a class="m-0 p-0 text-3 text-black text-decoration-none" target="_blank" href="<?php echo BASEURL . 'termos-de-uso-e-politicas-de-privacidade' ?>">termos de uso e política de privacidade</a>
							</label>
						</div>
					</div>

					<div class="row mb-0">
						<div class="col-12 d-flex justify-content-center align-items-center">
							<button type="button" class="btn btn-rounded btn-app-custom-duo btn-submit" data-page="contact" data-form="contactForm" data-url="contato">
								Enviar mensagem
							</button>
						</div>
					</div>

					<?php echo form_close(); ?>
				</div>
			</div>
		</div>
	</section>

	<!-- ---------------------------------------------------------------------------------------------------------- -->
	<!-- ------------------------------------------------[ MOBILE ]------------------------------------------------ -->
	<!-- ---------------------------------------------------------------------------------------------------------- -->

	<section class="d-flex d-lg-none bg-app-custom-color-duo py-4">
		<div class="container px-4">
			<div class="row">
				<div class="col-12">
					<h1 class="m-0 p-0 text-8 lh-1 ls-1 font-weight-bold text-white text-center">
						Contato
					</h1>
				</div>
			</div>
		</div>
	</section>

	<!-- ---------------------------------------------------------------------------------------------------------- -->

	<section class="section section-default border-0 bg-white d-flex d-lg-none py-0">
		<div class="container px-4">
			<div class="row d-flex justify-content-center align-items-center flex-column">
				<div class="col-12">
					<?php echo form_open_multipart(site_url('contato/cadastrar'), array ('class' => 'customForm col-12 m-0 p-0', 'id' => 'contactFormMobile')); ?>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="titulo" id="titulo" class="form-control rounded-0" required placeholder="Nome completo:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="email" id="email" class="form-control rounded-0" required placeholder="E-mail:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="celular" id="celular" class="form-control rounded-0 mask-phone" required placeholder="Celular/WhatsApp:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<select class="form-control rounded-0 custom-pointer select-estado" name="estado" id="estado" required placeholder="Estado:" data-msg-required="Campo obrigatório!">
									<option value="" selected disabled>Estado:</option>

									<?php foreach($appEstados as $key => $estado) { ?>
										<option value="<?php echo $estado->id; ?>"><?php echo $estado->titulo; ?></option>
									<?php } ?>
								</select>
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<select class="form-control rounded-0 custom-pointer select-cidade" name="cidade" id="cidade" required placeholder="Cidade:" data-msg-required="Campo obrigatório!">
									<option value="" selected disabled>Selecione primeiro o estado!</option>
								</select>
							</div>
						</div>
					</div>

					<div class="row mb-1">
						<div class="col-12">
							<div class="form-group position-relative">
								<label class="form-label m-0 p-0 text-2 text-black">
									<span class="input-required-msg text-danger"></span>
								</label>

								<input type="text" name="descricao" id="descricao" class="form-control rounded-0" required placeholder="Mensagem:" data-msg-required="Campo obrigatório!">
							</div>
						</div>
					</div>

					<div class="row mb-4">
						<div class="col-12 d-flex justify-content-center align-items-center">
							<input class="js-switch-form" type="checkbox" name="aceito" id="aceito" required data-msg-required="Campo obrigatório!">

							<label class="m-0 ms-2 p-0 text-2 text-black">
								Aceito os <a class="m-0 p-0 text-2 text-black text-decoration-none" target="_blank" href="<?php echo BASEURL . 'termos-de-uso-e-politicas-de-privacidade' ?>">termos de uso e política de privacidade</a>
							</label>
						</div>
					</div>

					<div class="row mb-0">
						<div class="col-12 d-flex justify-content-center align-items-center">
							<button type="button" class="btn btn-rounded btn-app-custom-duo btn-submit btn-submit-mobile" data-page="contact" data-form="contactFormMobile" data-url="contato">
								Enviar mensagem
							</button>
						</div>
					</div>

					<?php echo form_close(); ?>
				</div>
			</div>
		</div>
	</section>

	<!-- ---------------------------------------------------------------------------------------------------------- -->

</div>