Embed

<!DOCTYPE html>
<html lang="nl">
<head>
  <meta charset="UTF-8">
  <title>Je Xperience start hier</title>
  <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600&display=swap" rel="stylesheet">
  <style>
    body {
      margin: 0;
      height: 100vh;
      background: linear-gradient(to bottom, #000814 0%, #001d3d 100%);
      overflow: hidden;
      font-family: 'Playfair Display', serif;
    }

    /* Tekst */
    .float-text {
      font-size: 3.2vw; /* iets kleiner */
      font-weight: 600;
      color: #e6e6e6;
      text-shadow: 0 2px 6px rgba(0,0,0,0.7),
                   0 0 12px rgba(0,120,255,0.4);
      position: absolute;
      top: 52%; /* iets lager */
      width: 100%;
      text-align: center;
      z-index: 3;
      animation: textWave 8s ease-in-out infinite;
    }

    @keyframes textWave {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-2vh); } /* subtieler */
    }

    /* Golven */
    .waves {
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 18vh;
      overflow: hidden;
      line-height: 0;
      z-index: 1;
    }

    .waves svg {
      display: block;
      width: 300%;   /* extra breed zodat er geen gat komt */
      height: 100%;
      animation: waveMove 25s linear infinite;
    }

    @keyframes waveMove {
      from { transform: translateX(0); }
      to { transform: translateX(-33.3%); } /* schuift precies 1/3, sluit naadloos */
    }

    .waves path {
      fill: rgba(255,255,255,0.12);
    }

    /* Media queries */
    @media (max-width: 1024px) { /* iPad */
      .float-text {
        font-size: 4vw;
        top: 54%;
      }
      .waves {
        height: 16vh;
      }
    }

    @media (max-width: 768px) { /* kleine tablets */
      .float-text {
        font-size: 5.5vw;
        top: 56%;
      }
      .waves {
        height: 13vh;
      }
    }

    @media (max-width: 480px) { /* telefoons */
      .float-text {
        font-size: 7vw;
        top: 58%;
      }
      .waves {
        height: 10vh;
      }
    }
  </style>
</head>
<body>
  <h1 class="float-text">Je Xperience start hier</h1>

  
  <div class="waves">
    <svg viewBox="0 0 3600 200" preserveAspectRatio="none">
      <path d="M0,100 
               C600,150 1200,50 1800,100 
               C2400,150 3000,50 3600,100 
               V200 H0 Z"></path>
    </svg>
  </div>
</body>
</html>

Contact form

<h3>Elke reis begint bij een formulier</h3>
<p>neem hier contact op met de coaches en laat weten hoe je ervoor staat. Vragen? <a href="https://wikipedia.nl/">klik hier</a> om je vraag te stellen. is er iets niet van toepassing? Vul dan NVT in. De Self Journey Xperience start in nader overleg.</p>

name

email

message

Vink aan wat voor jou geldt

Ik voel(de) mij niet vrij in mijn werk

Ik voel(de) mij niet gelukkig in mijn werk

Mijn talenten worden niet (genoeg) gezien/benut in mijn werk

Ik heb momenteel geen werk maar ben wel op zoek

Ik denk dat ander werk beter bij mij past

Ik zit/zat in een gouden kooi waarin ik wel veel verdien met mijn werk maar het niet goed voelt

Ik vind/vond te weinig zingeving in mijn werk

geen van de bovenstaande opties

als je voor 'geen van de bovenstaande opties' hebt gekozen, vul hier dan in wat bij jou het geval is:

Wil je nog iets kwijt of heb je nog een vraag? Vul dat dan hier in:

Self Journey Xperience 

Self Journey Xperience, based in Amsterdam, offers a self‑journey experience focused on encouraging individuals to embrace new career opportunities and achieve happiness. As a newly launched venture, it is just starting out.

PT Serif

Rufina