<?php
/**
* @file companies.php
* @brief Stránka pro firemní akce a pronájem prostor v Oáze Srdce.
*
* Tento skript:
* - Zobrazuje nabídku firemních akcí, kapacity prostor a možnosti pronájmu (velký sál, podkrovní sál, školící středisko, restaurace & bar).
* - Obsahuje sekci s dalšími službami (catering, ubytování, projekce, program, ozvučení, parkování).
* - Umožňuje odeslat kontaktní formulář pro poptávku firemní akce.
* - Zobrazuje kontaktní údaje na odpovědnou osobu.
* - Obsahuje JavaScript pro animaci čísel kapacit.
*
*/
?>
<!DOCTYPE html>
<html lang="cs">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Firemní akce, školení a pronájem prostor v Oáze Srdce. Kapacita až 120 osob, catering, ubytování, projekce, ozvučení a další služby.">
<title>Firemní</title>
<link
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
rel="stylesheet" />
<link rel="stylesheet" href="css/companies.css" />
<link rel="icon" href="media/logo-oaza2.png" type="image/x-icon" />
</head>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-FB7MMZ9KBB"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-FB7MMZ9KBB');
</script>
<nav>
<div class="container" id="home">
<div class="row"></div>
<div class="row navLinks text-center">
<div class="col-md-2 col-lg-2 col-12 link mt-3">
<a href="domů"> Domů </a>
</div>
<div class="col-md-2 col-lg-2 col-12 link expandable mt-3">
<a href="domů#akce">Akce</a>
<div class="submenu">
<a href="semináře">Semináře</a>
<a href="rekreace">Ozdravné pobyty</a>
<a href="dětské-pobyty">Dětské pobyty</a>
<a href="firemní">Firemní</a>
<a href="ostatní">Ostatní</a>
</div>
</div>
<div class="col-md-2 col-lg-2 col-12 text-center">
<a href="domů"><img src="media/logo-oaza2.png" alt="" width="80px" height="80px" /></a>
</div>
<div class="col-md-2 col-lg-2 col-12 link expandable mt-3">
<a href="fotogalerie">Fotogalerie</a>
<div class="submenu">
<a href="blog#tipy-na-výlety">Tipy na výlety</a>
<a href="blog">Aktuality</a>
</div>
</div>
<div class="col-md-1 col-lg-1 col-12 link expandable mt-3">
<a href="ceník">Ceník</a>
<div class="submenu">
<a href="platební-podmínky">Platební podmínky</a>
</div>
</div>
<div class="col-md-2 col-lg-2 col-12 link expandable mt-3">
<a href="domů#kontakt">Kontakt</a>
<div class="submenu">
<a href="gdpr">Zpracování údajů</a>
<a href="openPositions.php">Kariéra</a>
</div>
</div>
</div>
</div>
</nav>
<div class="top">
<img src="media/companies/2.png" alt="" />
</div>
<body>
<section class="intro">
<div class="container">
<div class="row text-center">
<div class="col-12">
<div class="spacer2"></div>
<p>
Nabízíme možnost pořádání firemních akcí a společenských událostí
</p>
<div class="spacer2"></div>
</div>
<div class="col-md-6 col-lg-6 col-12">
<h5>Kapcita <br />ubytování</h5>
<span class="numbers" data-target="100">0</span>
</div>
<div class="col-md-6 col-lg-6 col-12">
<h5>
Kapacita <br />
prostor
</h5>
<span class="numbers" data-target="200">0</span>
</div>
</div>
</div>
<div class="spacer"></div>
</section>
<section class="rentCards">
<div class="spacer50 "></div>
<div class="cardR">
<div class="container">
<div class="row text-center lg-card">
<div class="col-12 spacer3-5"></div>
<div class="col-md-6 col-lg-6 col-12 ">
<div class="spacer50 hideTablet"></div>
<h2>Velký sál</h2>
<div class="spacer4"></div>
<h5>Kapacita</h5>
<span class="number2">120</span>
<div class="spacer4"></div>
<p>
Rozměr 12 x 18 m <br />
Kapacita až 120 osob<br />
Cena: 4500,-Kč/den
</p>
</div>
<div class="col-md-6 col-lg-6 smallGone photoPart hideSmTablet mb-4">
<div class="topRentPhoto">
<div class="topFrame"></div>
<img src="media/rent/big/5.png" alt="Velký sál Oáza Srdce" />
</div>
<div class="botRentPhoto mb-2">
<img src="media/rent/big/6.png" alt="Velký sál Oáza Srdce" />
<img src="media/rent/big/8.jpg" alt="Velký sál Oáza Srdce" />
<img src="media/rent/big/7.png" alt="Velký sál Oáza Srdce" />
</div>
</div>
</div>
</div>
</div>
<div class="spacer4 "></div>
<div class="cardR">
<div class="container">
<div class="row text-center lg-card">
<div class="col-12 spacer3-5"></div>
<div class="col-md-6 col-lg-6 photoPart hideSmTablet smallGone mb-4">
<div class="topRentPhoto">
<div class="topFrame"></div>
<img src="media/rent/attic/1.jpg" alt="Podkrovní sál Oáza Srdce" />
</div>
<div class="botRentPhoto mb-2">
<img src="media/rent/attic/3.jpg" alt="Podkrovní sál Oáza Srdce" />
<img src="media/rent/attic/4.jpg" alt="Podkrovní sál Oáza Srdce" />
<img src="media/rent/attic/2.jpg" alt="Podkrovní sál Oáza Srdce" />
</div>
</div>
<div class="col-md-6 col-lg-6 col-12">
<div class="spacer50 hideTablet"></div>
<h2>Podkrovní sál</h2>
<div class="spacer4"></div>
<h5>Kapacita</h5>
<span class="number2">40</span>
<div class="spacer4"></div>
<p>
Rozměr 12 x 12 m<br />
Kapacita až 40 osob<br />
Cena: 1500,-Kč/den
</p>
</div>
</div>
</div>
</div>
<div class="spacer4 "></div>
<div class="cardR">
<div class="container">
<div class="row text-center lg-card">
<div class="col-12 spacer3-5"></div>
<div class="col-md-6 col-lg-6 col-12">
<div class="spacer50 hideTablet"></div>
<h2>Školící středisko</h2>
<div class="spacer4"></div>
<h5>Kapacita</h5>
<span class="number2">30</span>
<div class="spacer4"></div>
<p>
Části střediska: <br />velká učebna + předsálí, <br />
malá učebna a pracovna
</p>
</div>
<div class="col-md-6 col-lg-6 smallGone photoPart hideSmTablet mb-4">
<div class="topRentPhoto ">
<div class="topFrame"></div>
<img src="media/rent/schooling/1.png" alt="Školící středisko Oáza Srdce" />
</div>
<div class="botRentPhotoSchool mb-2">
<img src="media/rent/schooling/2.png" alt="Školící středisko Oáza Srdce" />
<img src="media/rent/schooling/4.png" alt="Školící středisko Oáza Srdce" />
<img src="media/rent/schooling/5.png" alt="Školící středisko Oáza Srdce" />
<img src="media/fotogalery/rent/4.1.png" alt="Školící středisko Oáza Srdce" />
</div>
</div>
</div>
</div>
</div>
<div class="spacer4 "></div>
<div class="cardR">
<div class="container">
<div class="row text-center lg-card">
<div class="col-12 spacer3-5"></div>
<div class="col-md-6 col-lg-6 smallGone photoPart hideSmTablet mb-4">
<div class="topRentPhoto ">
<img src="media/rent/gastro/bigNow.png" alt="Restaurace a Bar Oáza Srdce" />
<div class="topFrame"></div>
</div>
<div class="botRentPhoto mb-2">
<img src="media/rent/gastro/bar.jpg" alt="Restaurace a Bar Oáza Srdce" />
<img src="media/rent/gastro/red.jpg" alt="Restaurace a Bar Oáza Srdce" />
<img src="media/rent/gastro/blue.jpg" alt="Restaurace a Bar Oáza Srdce" />
</div>
</div>
<div class="col-md-6 col-lg-6 col-12">
<div class="spacer50 hideTablet"></div>
<h2>Restaurace & Bar</h2>
<div class="spacer4"></div>
<h5>Kapacita</h5>
<span class="number2">120</span>
<div class="spacer4"></div>
<p>
Součástí hotelu je restaurace s barem. <br />
K dispozici jsou 2 stravovací místnosti, <br />
posezení u baru a větší sál <br />
pro potřeby cateringu
</p>
</div>
</div>
</div>
<div class="spacer4 "></div>
</div>
</section>
<div class="spacer"></div>
<section class="additionals">
<div class="container blockA">
<div class="spacer4"></div>
<div class="heading1">Zajišťujeme</div>
<div class="spacer4"></div>
<div class="row additional text-center">
<div class="col-md-4 col-md-4 col-12">
<img src="media/companies/cattering.png" alt="https://unsplash.com/photos/clear-glass-pitcher-with-content-MF6yy22F5rE" />
<h2>Cattering</h2>
</div>
<div class="col-md-4 col-md-4 col-12">
<img src="media/companies/rooms.png" alt="" />
<h2>Ubytování</h2>
</div>
<div class="col-md-4 col-md-4 col-12">
<img src="media/companies/projection.png" alt="Foto oleh Mikael Blomkvist: https://www.pexels.com/id-id/foto/orang-orang-wanita-kantor-muda-6476783/" />
<h2>Projekce</h2>
</div>
</div>
<div class="spacer4"></div>
<div class="row additional text-center">
<div class="col-md-4 col-md-4 col-12">
<img src="media/companies/program.png" alt="Photo by RDNE Stock project from Pexels: https://www.pexels.com/photo/party-table-event-lighting-7648022/" />
<h2>Program</h2>
</div>
<div class="col-md-4 col-md-4 col-12">
<img src="media/companies/sounds.png" alt="Foto von Pixabay von Pexels: https://www.pexels.com/de-de/foto/hochtoner-lautsprecher-in-gold-und-grau-373632/" />
<h2>Ozvučení</h2>
</div>
<div class="col-md-4 col-md-4 col-12">
<img src="media/companies/parking.png" alt="" />
<h2>Parkování</h2>
</div>
</div>
<div class="spacer2"></div>
</div>
</section>
<div class="spacer smallGone"></div>
<div class="spacer50 smallShow biggerGone"></div>
<section class="contactForm">
<div class="heading1">Kontakt</div>
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-6 col-12">
<h4>Kontaktní formulář</h4>
<form action="email-send.php" method="post" id="form">
<input type="text" name="name" id="name" placeholder="jméno:" />
<input
type="text"
name="surname"
id="surname"
placeholder="přijmení:" />
<input
type="email"
name="email"
id="email"
placeholder="email:" />
<input type="tel" name="tel" id="tel" placeholder="tel:" />
<textarea
name="description"
id="description"
placeholder="popis:"></textarea>
<div class="submit-wrapper">
<input type="submit" value="Odeslat" />
</div>
</form>
<?php if (isset($_GET['success']) && $_GET['success'] == 1): ?>
<p>Zpráva úspěšně odeslána</p>
<?php endif; ?>
</div>
<div class="col-md-6 col-lg-6 col-12 contactR mt-3">
<div class="spacer4 "></div>
<div class="row text-center">
<div class="col-12 imgContact">
<div class="borderImgContact"></div>
<img src="media/seminar/hotel.png" alt="Hotel Bradlo" />
</div>
<div class="col-12">
<h4>Iveta Pospíšilová</h4>
</div>
<div class="col-12">
<h5><em>Firemní akce</em></h5>
</div>
<div class="col-12">
<p>+420 606 892 843<br />vrsovskabrana@email.cz</p>
</div>
</div>
</div>
</div>
</div>
<div class="spacer smallGone hideSmTablet"></div>
<div class="spacer4 biggerGone smallShow showSmTablet"></div>
</section>
<footer>
<div class="container">
<div class="row text-center">
<div class="col-4 mt-2">
<p>+420 606 892 843</p>
</div>
<div class="col-4 mt-2"><a href="">©Oáza Srdce</a></div>
<div class="col-4 mt-2"><a href="gdpr">GDPR</a></div>
</div>
</div>
</footer>
<script>
// Po načtení stránky spustí animaci číselných hodnot v elementech s třídou .numbers
document.addEventListener("DOMContentLoaded", function() {
const numbers = document.querySelectorAll(".numbers");
// Vytvoří IntersectionObserver, který sleduje, kdy se číslo objeví ve viewportu
const observer = new IntersectionObserver(
(entries, observer) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
const number = entry.target;
// Funkce pro animované navyšování čísla až na cílovou hodnotu
const updateCount = () => {
const target = +number.getAttribute("data-target");
const count = +number.innerText;
const increment = target / 100; // Rychlost animace čísel
if (count < target) {
number.innerText = Math.ceil(count + increment);
requestAnimationFrame(updateCount);
} else {
number.innerText = target;
}
};
updateCount();
observer.unobserve(number); // Po animaci už nesleduje tento prvek
}
});
}, {
threshold: 0.1 // Spustí animaci, když je alespoň 10 % prvku viditelné
}
);
// Každé číslo začne být sledováno
numbers.forEach((number) => {
observer.observe(number);
});
});
</script>
</body>
</html>