pfostendynamics.com/about.html

<!DOCTYPE html>
<html lang="en" style="scroll-behavior: smooth">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />

    <!-- Bootstrap CSS -->
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
      integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
      crossorigin="anonymous"
    />

    <title>About | Pfosten Dynamics</title>
    <link rel="icon" href="./img/favicon.png" />
  </head>
  <body>
    <!--Begin Navbar-->
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
      <div class="container">
        <a class="navbar-brand" href="./"
          ><img
            src="./img/PfostenDynamics.png"
            style="max-height: 60px"
            class="d-inline-block align-top"
            alt=""
            loading="lazy"
        /></a>
        <button
          class="navbar-toggler"
          type="button"
          data-toggle="collapse"
          data-target="#navbarNavDropdown"
          aria-controls="navbarNavDropdown"
          aria-expanded="false"
          aria-label="Toggle navigation"
        >
          <span class="navbar-toggler-icon"></span>
        </button>
        <div
          class="collapse navbar-collapse justify-content-end"
          id="navbarNavDropdown"
        >
          <ul class="navbar-nav">
            <li class="nav-item">
              <a class="nav-link" href="./"
                >Home <span class="sr-only">(current)</span></a
              >
            </li>
            <li class="nav-item dropdown">
              <a
                class="nav-link dropdown-toggle"
                href="#"
                id="navbarDropdownMenuLink"
                role="button"
                data-toggle="dropdown"
                aria-haspopup="true"
                aria-expanded="false"
              >
                Vehicles
              </a>
              <div
                class="dropdown-menu"
                aria-labelledby="navbarDropdownMenuLink"
              >
                <a class="dropdown-item" href="./bobbycar">Bobbycar</a>
                <a class="dropdown-item" href="./bobbyquad">Bobbyquad</a>
                <a class="dropdown-item" href="./bobbybob">Bobbybob</a>
                <a class="dropdown-item" href="./bobbyklo">Bobbyklo</a>
                <a class="dropdown-item" href="./bobbyboot">Bobbyboot</a>
                <a class="dropdown-item" href="./bobbyhubschrauber"
                  >Bobbyhubschrauber</a
                >
                <a class="dropdown-item" href="./raupenfahrzeug"
                  >Raupenfahrzeug</a
                >
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="./careers">Careers</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="./news">News</a>
            </li>
            <li class="nav-item active">
              <a class="nav-link" href="./about">About</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="./shop">Shop</a>
            </li>
          </ul>
        </div>
      </div>
    </nav>
    <!--End Navbar-->

    <div>
      <header
        style="background-color: rgba(219, 219, 219, 0.448)"
        class="shadow p-10 mb-3"
      >
        <img
          id="background-image"
          src="./img/new-about.jpg"
          style="
            display: block;
            margin-left: auto;
            margin-right: auto;
            border: 2px;
            border-style: ridge;
            border-color: gray;
          "
          class="img-fluid"
          draggable="false"
          ondragstart="return false;"
        />
        <h1 style="text-align: center; position: relative"></h1>
      </header>
    </div>

    <div class="container">
      <br />
      <div class="h5">
        <p style="hyphens: auto; text-align: justify">
          Pfostendynamics is a world leader in building electric bobbycars,
          tackling some of the toughest electronic and mechanical challenges. We
          combine the principles of dumb ideas and too much free time,
          cutting-edge Chinese electronics, and next-generation software for
          high-performance bobbycars equipped with BMS, Battery, and
          micro-controllers. Pfostendynamics has an extraordinary and
          fast-growing technical team of engineers and scientists who seamlessly
          combine next level bullshit with bold engineering and crashing into
          things.
        </p>
      </div>

      <h2
        class="mt-5 display-4 text-uppercase"
        style="text-shadow: 1px 1px #686868"
      >
        FAQs about Pfosten Dynamics
      </h2>
      <div id="faq">
        <div>
          <a href="#Q1" class="text-decoration-none"
            >Q: Why does Pfosten Dynamics make electric bobbycars?</a
          >
          <br />
          <a href="#Q2" class="text-decoration-none"
            >Q: What makes Pfostendynamics unique?</a
          >
          <br />
          <a href="#Q3" class="text-decoration-none"
            >Q: When can I buy an electric bobbycar?</a
          >
          <br />
        </div>
        <br />
        <div id="Q" class="h4" style="padding-left: 50px">
          <div id="Q1">
            <a>Q: Why does Pfosten Dynamics make electric bobbycars?</a>
            <p>A: Because we can</p>
          </div>
          <div id="Q2">
            <a>Q: What makes Pfostendynamics unique?</a>
            <p>
              A: One of the things that makes Pfostendynamics unique is the
              ambition to build a electric bobbycar that does not go up in smoke
              immediately. Peter Poetzi began tackling this problem before
              anyone else of us. And we’ve been at it since almost 3 years.
              We’ve been inspired by and worked towards this goal for so long
              that we have invented techniques to make bobbycars work that you
              can’t find in any textbook or technical article. The result is
              that we now know how to build such bobbycars so that they work for
              around 100 Kilometers without something breaking or needing for
              repair.
            </p>
          </div>
          <div id="Q3">
            <a>Q: When can I buy an electric bobbycar?</a>
            <p>
              A: For now these are not up for sale, but you can self build
              yourself one.
            </p>
          </div>
        </div>
      </div>
    </div>
    <div
      id="about-us"
      class="container"
      style="border-top: 5px; border-top-style: solid"
    >
      <br />
      <div id="about-pic">
        <!--<img
          src="./img/new-about.jpg"
          class="img-fluid rounded mx-auto d-block shadow"
          style="
            max-width: 99%;
            border: 2px;
            border-style: ridge;
            border-color: gray;
          "
          draggable="false"
          ondragstart="return false;"
        />-->
        <h2
          class="display-4"
          style="text-shadow: 1px 1px #686868; margin-top: -30px"
        >
          Our Team
        </h2>
      </div>
      <br />
      <div class="container" id="team">
        <ul class="list-unstyled">
          <li class="media">
            <img
              class="mr-3 img-fluid shadow rounded"
              src="./img/placeholder.jpg"
              style="
                max-height: 150px;
                border: 2px;
                border-style: ridge;
                border-color: gray;
              "
              draggable="false"
              ondragstart="return false;"
            />
            <div class="media-body">
              <h3 class="mt-0 mb-1">feedc0de</h3>
              feedcode text
            </div>
          </li>
          <br />
          <li class="media">
            <div class="media-body">
              <h3 class="mt-0 mb-1">peterp</h3>
              peterp text
            </div>
          </li>
          <br />
          <li class="media">
            <img
              class="mr-3 img-fluid shadow rounded"
              src="./img/members/greyhash.jpg"
              style="
                max-height: 150px;
                border: 2px;
                border-style: ridge;
                border-color: gray;
              "
              draggable="false"
              ondragstart="return false;"
            />
            <div class="media-body">
              <h3 class="mt-0 mb-1">greyhash</h3>
              greyhash text
            </div>
          </li>
          <br />
          <li class="media">
            <img
              class="mr-3 img-fluid shadow rounded"
              src="./img/members/mick.jpg"
              style="
                max-height: 150px;
                border: 2px;
                border-style: ridge;
                border-color: gray;
              "
              draggable="false"
              ondragstart="return false;"
            />
            <div class="media-body">
              <h3 class="mt-0 mb-1">mick</h3>
              mick text
            </div>
          </li>
          <br />
          <li class="media">
            <img
              class="mr-3 img-fluid shadow rounded"
              src="./img/members/commanderred.jpg"
              style="
                max-height: 150px;
                border: 2px;
                border-style: ridge;
                border-color: gray;
              "
              draggable="false"
              ondragstart="return false;"
            />
            <div class="media-body">
              <h3 class="mt-0 mb-1">CommanderRed</h3>
              Web-Pfosten (WEB-DESIGN)
            </div>
          </li>
        </ul>
      </div>
    </div>

    <!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) -->
    <script
      src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
      integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
      crossorigin="anonymous"
    ></script>
    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx"
      crossorigin="anonymous"
    ></script>

    <!-- Option 2: jQuery, Popper.js, and Bootstrap JS
        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js" integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>
        -->
  </body>
</html>