HTML Company Site

html-company-site.markdown

HTML Company Site

A Pen by Luca on CodePen.

License.

index.html

<nav>
  <ul>
    <li> <a href='#structure'>Day Structure</a> </li>
    <li> <a href='#team'>Team</a> </li>
    <li> <a href='#schedule'>Schedule</a> </li>
  </ul>
  <header>
    <h1><img src='https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/ironhack-skydive-logo.png' alt= 'IronSkyDive'> IronSkyDive</h1>
    <h2>Let the trip begin </h2>
    <aside><i>"The best expirence of our lives"</br>Ariel Quinones & Gonzalo Manrique, Ironhack Founders</i></aside> 
  </header>  
  <section>
      <article> 
        <h3>Hello! </h3>
        <p>Welcome to IronSkyDive, the best adventure you will ever have.</p>
        <a href='#'>Learn More</a>
      </article>
      <article>
        <h3>About us</h3>
        <p>We like a lot programming websites, but we also love to practice sport.</p>
        <a href='#'>Watch Video</a>
      </article>
      <article>
        <h3>Wanna join?</h3>
        <p>Join our fitness program to be in good shape while learning.</p>
        <a href='#'>Register</a>
      </article>
  </section>
    <section>
      <h3>How do we structure the day?</h3>
      <div>
        <article>
          <img src = 'https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/ironskydive-training.png' alt = 'Training'>
          <h4>1. Training</h4>
          <p>We teach all the necessary things to jump from the plane without any kind of problem.</p>
        </article>
        <article>
          <img src = 'https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/ironskydive-get-ready.png' alt = 'Get Ready'>
          <h4>2. Get ready</h4>
          <p>You are already prepared, you just need the suit and a parachute. All sizes available.</p>
        </article>
        <article>
          <img src = 'https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/ironskydive-fly.png' alt = 'Fly'>
          <h4>3. Fly</h4>
          <p>You are ready, and the plane is waiting for us in the hangar. Let's fly!</p>
        </article>
        <article>
          <img src = 'https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/ironskydive-jump.png' alt = 'Jump'>
          <h3>4. Jump!</h3>
          <p>You have done the most complicated. Just one step left...jump!</p>
        </article>
      </div>
  </section>
    <section>
      <h3>Team</h3>
      <p>Our team collectively has 75 years of exeperience. Odds are, when you jump out of the plane with these professional, you won't go splat</p>
      <div>
        <article>
          <h4>Harold Rothstein</h4>
          <img src= 'https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/upload_c18b1c463b80090894237a262dfdfbad.jpg' alt = 'Harold Rothstein'>
        </article>
        <article>
          <h4>Susan Philips</h4>
          <img src = 'https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/upload_a18d6123a7c8e75f7e70a4e59b941093.jpg' alt = 'Susan Philips'>
       </article>
        <article>
          <h4>Taylor Roberts</h4>
          <img src = 'https://s3-eu-west-1.amazonaws.com/ih-materials/uploads/upload_7104a331530d1b0611da55093b7dc421.jpg' alt = 'Taylor Roberts'>
        </article>
      </div>
  </section>
    <section>
      <h3>Schedule</h3>
      <h3>Schedule a Time Slot</h3>
      <table>
        <thead>
          <tr>
            <th>Time</th>
            <th>Monday</th>
            <th>Tuesday</th>
            <th>Wednesday</th>
            <th>Thrusday</th>
            <th>Friday</th>
            <th>Saturday</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>9:00 - 11:00</td>
            <td></td>
            <td></td>
            <td>X</td>
            <td></td>
            <td>X</td>
            <td>X</td>
          </tr>
          <tr>
            <td>12:00 - 14:00</td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>X</td>
            <td>X</td>
          </tr>
          <tr>
            <td>15:00 - 17:00</td>
            <td></td>
            <td></td>
            <td>X</td>
            <td>X</td>
            <td>X</td>
            <td>X</td>
          </tr>
        </tbody>
      </table>
  </section>
    <footer>
      <section>
        <h5>Contact Information</h5>
        <address>IronSkydive </br>33 Rue la Fayette,</br> 75009 Paris, </br>France </br>+33 (0) 619 193 088</address>
        <h5>Follow us</h5>
        <ul>
          <li><a href='#'>Twitter</a></li>
          <li><a href='#'>Facebook</a></li>
          <li><a href='#'>Instagram</a></li>