oazaSrdceWeb / recreation.php
recreation.php
Raw
<?php

/**
 * @file recreation.php
 * @brief Stránka s informacemi o rekreačních pobytech v Oáze Brádlo.
 *
 * Tato stránka obsahuje informace o ubytování, stravování, wellness službách a tipy na výlety v okolí.
 * Je navržena tak, aby poskytovala návštěvníkům přehled o možnostech rekreace v zařízení.
 *
 */
?>
<!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="Objevte rekreační pobyty v Oáze Brádlo. Nabízíme ubytování, stravování, wellness a tipy na výlety v krásném prostředí." />
  <title>Rekreařní pobyty</title>
  <link rel="stylesheet" href="css/recreation.css" />
  <link
    href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
    rel="stylesheet" />
  <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í&nbsp;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í&nbsp;údajů</a>
          <a href="openPositions.php">Kariéra</a>
        </div>
      </div>
    </div>
  </div>
</nav>

<body>
  <section class="slideShow">
    <img src="media/recreation/recreationMain.jpg" alt="" class="photo1" />
    <img src="media/recreation/ef.png" alt="" class="photo2" />
  </section>
  <section class="rooms">
    <div class="heading2">Ubytování</div>
    <div class="container">
      <div class="row">
        <div class="col-4 position-relative">
          <img src="media/roomleft.png" alt="" class="leftRoom" />
          <div class="smallGone">
            <img src="media/smallWave1.png" alt="" class="smallWave" />
          </div>
          <div class="biggerGone smallShow">
            <img src="media/smallWavecenter.png" alt="" class="smallWave2" />
          </div>
          <p class="smallName">I.kategorie</p>
          <p class="hoverText1">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - WC
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
        <div class="col-4 position-relative">
          <img src="media/roomcenter.png" alt="" class="centerRoom" />
          <img src="media/smallWavecenter.png" alt="" class="smallWave2" />
          <p class="smallName">II.kategorie</p>
          <p class="hoverText2">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - WC
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
        <div class="col-4 position-relative">
          <img src="media/roomright.png" alt="" class="rightRoom" />
          <div class="smallGone">
            <img src="media/smallWaveright.png" alt="" class="smallWave3" />
          </div>
          <div class="biggerGone smallShow">
            <img src="media/smallWavecenter.png" alt="" class="smallWave2" />
          </div>
          <p class="smallName">Původní podkrovní</p>
          <p class="hoverText3">
            Pokoj je vybaven:
            <br class="mb-1" />
            - lůžka
            <br />
            - vlastní koupelna
            <br />
            - TV
            <br />
            - Wi-Fi
            <br />
            - sedací nábytek
            <br />
            - noční stolky + lampičky
            <br />
            - el. zásuvky
          </p>
        </div>
      </div>
    </div>
    <div class="spacer smallGone hideSmTablet"></div>
  </section>
  <section class="food">
    <div class="spacer50"></div>
    <div class="heading2">Stravování</div>
    <div class="container">
      <div class="row foodBar">
        <div class="col-1 smallGone hideSmTablet"></div>
        <div class="col-md-2 col-lg-2 col-6 foodBtn left" id="vegetarian">
          <h4>Vegetariánská</h4>
        </div>
        <div class="col-md-2 col-lg-2 col-6 foodBtn side" id="vegan">
          <h4>Veganská</h4>
        </div>
        <div class="col-md-2 col-lg-2 col-4 foodBtn center" id="raw">
          <h4>Živá / Raw</h4>
        </div>
        <div class="col-md-2 col-lg-2 col-4 foodBtn side" id="combi">
          <h4>Živá / Combi</h4>
        </div>
        <div class="col-md-2 col-lg-2 col-4 foodBtn right" id="meat">
          <h4>Domací masitá</h4>
        </div>
        <div class="col-md-1 col-lg-1 smallGone"></div>
      </div>
      <div class="spacer2"></div>
      <div class="row diningImg text-center">
        <div class="col-2.5 foodPlace">
          <img src="media/rent/gastro/bar.jpg" alt="" />
        </div>
        <div class="col-2.5 foodPlace">
          <img src="media/rent/gastro/bigfood.png" alt="" />
        </div>
        <div class="col-2.5 foodPlace">
          <img src="media/rent/gastro/blue.jpg" alt="" />
        </div>
        <div class="col-2.5 foodPlace">
          <img src="media/rent/gastro/red.jpg" alt="" />
        </div>
      </div>
    </div>
    <div class="spacer hideSmTablet"></div>
  </section>
  <section class="area">
    <div class="spacer50"></div>
    <div class="heading2">Areál a okolí</div>
    <div class="container">
      <div class="row areaTable text-center">
        <div class="col-6">
          <h1
            id="exercise-heading"
            class="clickable-heading selected-heading">
            Cvičení
          </h1>
        </div>
        <div class="col-6">
          <h1 id="walks-heading" class="clickable-heading">Procházky</h1>
        </div>
        <div class="col-12">
          <div class="row board optionExercise">
            <div class="col-6 text-center">
              <div class="spacer4"></div>
              <ul class="boardList text-left">
                <li>Velký & podkrovní sál</li>
                <li>2 pingpongové stoly</li>
                <a
                  href="https://www.hornibradlo.cz/viceucelove-hriste-a-pronajem-sokolovny/ds-1033"
                  style="text-decoration: none; color: black"
                  onmouseover="this.style.textDecoration='underline';"
                  onmouseout="this.style.textDecoration='none';">
                  <li>Horní Br. sokolovna</li>
                </a>
                <a
                  href="https://www.hornibradlo.cz/viceucelove-hriste-a-pronajem-sokolovny/ds-1033"
                  style="text-decoration: none; color: black"
                  onmouseover="this.style.textDecoration='underline';"
                  onmouseout="this.style.textDecoration='none';">
                  <li>Horní Br. víceúčelové hřiště</li>
                </a>
                <li>Orientační běh v okolí</li>
                <li>Zahradní plochy pro cvičení</li>
              </ul>
            </div>
            <div class="col-6 smallGone">
              <div class="row text-center">
                <div class="col-12">
                  <div class="topPhoto">
                    <img src="media/hotelArea.png" alt="" class="" />
                  </div>
                  <div class="botPhoto">
                    <img src="media/rent/attic/1.jpg" alt="" class="" />
                    <img src="media/prochazka4.png" alt="" class="" />
                    <img src="media/recreation/field.jpg" alt="" class="" />
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="row board optionWalks" style="display: none">
            <div class="col-6 text-center">
              <div class="spacer4"></div>
              <ul class="boardList text-left">
                <li>Hrobka rodiny Kustošů</li>
                <li>Jez Horní Bradlo</li>
                <li>Kaple Panny Marie (Dolní Bradlo)</li>
                <li>Krásné (Zvonička, vysílač)</li>
                <li>Studánka Vršov</li>
                <li>Vršov</li>
              </ul>
            </div>
            <div class="col-6 smallGone">
              <div class="row text-center">
                <div class="col-12">
                  <div class="topPhoto">
                    <img src="media/prochazka1.png" alt="" class="" />
                  </div>
                  <div class="botPhoto">
                    <img src="media/prochazka2.jpg" alt="" class="" />
                    <img src="media/prochazka3.png" alt="" class="" />
                    <img src="media/prochazka4.png" alt="" class="" />
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="spacer hideSmTablet"></div>
  </section>
  <section class="wellness">
    <div class="container">
      <div class="row">
        <div class="col-4 smallGone hideSmTablet">
          <img src="media/recreation/wellnessL.png" alt="" />
        </div>
        <div class="col-md-4 col-lg-4 col-12 heading3 mt-5 extraM">
          Wellness
        </div>
        <div class="col-4 smallGone hideSmTablet">
          <img src="media/recreation/wellnessR.png" alt="" />
        </div>
      </div>
      <div class="spacer2 smallGone hideSmTablet"></div>
      <div class="row wellnessIcons text-center">
        <div class="col-md-2 col-lg-2 smallGone"></div>
        <div class="col-md-4 col-lg-4 col-12 phone">
          <img src="media/recreation/massage.png" alt="" />
          <h2>Masáže</h2>
        </div>
        <div class="col-md-4 col-lg-4 col-12 phone">
          <img src="media/recreation/sauna.png" alt="" />
          <h2>Sauna</h2>
        </div>
        <div class="col-md-2 col-lg-2 smallGone"></div>
      </div>
      <div class="spacer2 smallGone hideSmTablet"></div>
      <div class="row wellnessIcons text-center">
        <div class="col-md-4 col-lg-4 col-12 phone">
          <img src="media/recreation/therapy.png" alt="" />
          <h2>Terapie</h2>
        </div>
        <div class="col-md-4 col-lg-4 col-12 phone">
          <img src="media/recreation/biores.png" alt="" />
          <h2>Biorezonance</h2>
        </div>
        <div class="col-md-4 col-lg-4 col-12 phone">
          <img src="media/recreation/yoga.png" alt="" />
          <h2>Jóga zóna</h2>
        </div>
      </div>
    </div>
    <div class="spacer smallGone hideSmTablet"></div>
    <div class="spacer50"></div>
  </section>
  <section class="tips">
    <div class="heading2">Tipy na výlety</div>
    <div class="spacer4"></div>
    <div class="container">
      <div class="row articleCart">
        <div
          class="col-md-3 col-lg-3 smallGone hideSmTablet"
          style="padding-left: 0">
          <div class="tipsPhotoTop mt-1">
            <img src="media/articles/trips/sec/sec1.png" alt="" />
          </div>
          <div class="tipsPhotoBott">
            <img
              src="media/articles/trips/sec/sec4.png"
              alt=""
              class="leftPhoto" />
            <img src="media/articles/trips/sec/sec2.png" alt="" />
            <img
              src="media/articles/trips/sec/sec3.png"
              alt=""
              class="rightPhoto" />
          </div>
        </div>
        <div class="col-9">
          <div class="row articleContent">
            <div class="col-8">
              <h1>Seč</h1>
            </div>
            <div class="col-md-4 col-lg-4 smallGone">
              <a href="trips.php?id=1"><img src="media/articles/info.png" alt="" /></a>
              <a
                href="https://www.kudyznudy.cz/kam-pojedete/pardubicky-kraj/chrudimsko-hlinecko/sec"><img src="media/articles/kudy.png" alt="" /></a>
              <a
                href="https://www.google.com/maps/place/Se%C4%8D,+%C4%8Cesko/@49.8361146,15.6632213,11289m/data=!3m1!1e3!4m6!3m5!1s0x470db315bbe4812d:0x400af0f6615d2b0!8m2!3d49.8469374!4d15.6564304!16zL20vMGI4eTcz?entry=ttu&g_ep=EgoyMDI0MTIxMS4wIKXMDSoASAFQAw%3D%3D"><img src="media/articles/map.png" alt="" /></a>
            </div>
            <div class="col-12">
              <p><strong>Vzdálenost:</strong> 10km</p>
            </div>
            <div class="col-12">
              <p>
                <strong>Co navštívit:</strong> Vodní hráz, koupaliště, kostel
                sv. Ant, Stezka lesem
              </p>
            </div>
            <div class="col-12">
              <p>
                <strong>Popis:</strong> V místě se nachází vodní hráz po které
                se lze projít s krásným výhledem do okolí. Nedaleko hráze se
                nachází veřejné koupaliště
              </p>
            </div>
            <div class="col-12 biggerGone smallShow">
              <a href="trips.php?id=1"><img src="media/articles/info.png" alt="" /></a>
              <a
                href="https://www.kudyznudy.cz/kam-pojedete/pardubicky-kraj/chrudimsko-hlinecko/sec"><img src="media/articles/kudy.png" alt="" /></a>
              <a
                href="https://www.google.com/maps/place/Se%C4%8D,+%C4%8Cesko/@49.8361146,15.6632213,11289m/data=!3m1!1e3!4m6!3m5!1s0x470db315bbe4812d:0x400af0f6615d2b0!8m2!3d49.8469374!4d15.6564304!16zL20vMGI4eTcz?entry=ttu&g_ep=EgoyMDI0MTIxMS4wIKXMDSoASAFQAw%3D%3D"><img src="media/articles/map.png" alt="" /></a>
            </div>
          </div>
        </div>
      </div>
      <div class="spacer4"></div>
      <div class="row articleCart">
        <div
          class="col-md-3 col-lg-3 smallGone hideSmTablet"
          style="padding-left: 0">
          <div class="tipsPhotoTop mt-1">
            <img src="media/articles/trips/chotebor/chotebor1.png" alt="" />
          </div>
          <div class="tipsPhotoBott" id="tablet">
            <img
              src="media/articles/trips/chotebor/chotebor2.png"
              alt=""
              class="leftPhoto" />
            <img src="media/articles/trips/chotebor/chotebor3.png" alt="" />
            <img
              src="media/articles/trips/chotebor/chotebor4.png"
              alt=""
              class="rightPhoto" />
          </div>
        </div>
        <div class="col-9">
          <div class="row articleContent">
            <div class="col-8">
              <h1>Chotěboř</h1>
            </div>
            <div class="col-md-4 col-lg-4 smallGone">
              <a href="trips.php?id=2"><img src="media/articles/info.png" alt="" /></a>
              <a
                href="https://www.kudyznudy.cz/kam-pojedete/kraj-vysocina/havlickobrodsko/chotebor"><img src="media/articles/kudy.png" alt="" /></a>
              <a
                href="https://www.google.com/maps/place/Chot%C4%9Bbo%C5%99,+583+01+Chot%C4%9Bbo%C5%99,+%C4%8Cesko/@49.7059415,15.651671,11320m/data=!3m2!1e3!4b1!4m6!3m5!1s0x470dac1ffa7f67a7:0xf3f39fe6ad8cf15e!8m2!3d49.7206138!4d15.6710415!16zL20vMGdmeWw0?entry=ttu&g_ep=EgoyMDI0MTIxMS4wIKXMDSoASAFQAw%3D%3D"><img src="media/articles/map.png" alt="" /></a>
            </div>
            <div class="col-12">
              <p><strong>Vzdálenost:</strong> 17km</p>
            </div>
            <div class="col-12">
              <p>
                <strong>Co navštívit:</strong> Zřícenina Sokolov, zámek
                Chotěboř, Údolí Doubravy, Vyhlídka Čertův stolek
              </p>
            </div>
            <div class="col-12">
              <p>
                <strong>Popis:</strong> Skála, na níž se vyhlídka nachází, je
                snadno dostupná a nabízí místo pro odpočinek. Legendy spojené
                s tímto místem dodávají výletu na zajímavosti.
              </p>
            </div>
            <div class="col-12 biggerGone smallShow">
              <a href="trips.php?id=2"><img src="media/articles/info.png" alt="" /></a>
              <a
                href="https://www.kudyznudy.cz/kam-pojedete/kraj-vysocina/havlickobrodsko/chotebor"><img src="media/articles/kudy.png" alt="" /></a>
              <a
                href="https://www.google.com/maps/place/Chot%C4%9Bbo%C5%99,+583+01+Chot%C4%9Bbo%C5%99,+%C4%8Cesko/@49.7059415,15.651671,11320m/data=!3m2!1e3!4b1!4m6!3m5!1s0x470dac1ffa7f67a7:0xf3f39fe6ad8cf15e!8m2!3d49.7206138!4d15.6710415!16zL20vMGdmeWw0?entry=ttu&g_ep=EgoyMDI0MTIxMS4wIKXMDSoASAFQAw%3D%3D"><img src="media/articles/map.png" alt="" /></a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="spacer smallGone hideSmTablet"></div>
    <div class="spacer50"></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 src="recreation.js"></script>
</body>

</html>