index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Résumé</title>
    <link rel="stylesheet" href="https://binary-studio-academy.github.io/stage-2/assets/stylesheets/base.css">
  </head>
  <body>
    <main>
      <article>
        <div class="page" style="border-color: midnightblue;">
          <div class="stackable grid">
            <div class="row">
              <div class="three wide center aligned column">
                <div class="avatar-wrapper">
                  <img class="avatar" src="./assets/images/avatar.jpg" title="My profile picture" alt="My profile picture">
                </div>
              </div>
              <div class="thirteen wide column">
                <div class="stackable grid">
                  <div class="sixteen wide column">
                    <h1 class="name">Ryu Hoshi</h1>
                    <div class="job">Street Fighter Hero</div>
                    <ul class="contacts">
                      <li>
                        <a href="https://www.facebook.com/profile.php?id=100004808958030" rel="author" class="facebook">
                          <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M448 56.7v398.5c0 13.7-11.1 24.7-24.7 24.7H309.1V306.5h58.2l8.7-67.6h-67v-43.2c0-19.6 5.4-32.9 33.5-32.9h35.8v-60.5c-6.2-.8-27.4-2.7-52.2-2.7-51.6 0-87 31.5-87 89.4v49.9h-58.4v67.6h58.4V480H24.7C11.1 480 0 468.9 0 455.3V56.7C0 43.1 11.1 32 24.7 32h398.5c13.7 0 24.8 11.1 24.8 24.7z"/></svg>
                          <span>Ryu Hoshi</span>
                        </a>
                      </li>
                      <li>
                        <a href="ryuwins@gmail.com" rel="author" class="mail">
                          <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z"></path></svg>
                          <span>ryuwins@gmail.com</span>
                        </a>
                      </li>
                      <li>
                        <a href="https://twitter.com/denjinryu" rel="author" class="twitter">
                          <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"/></svg>
                          <span>DenjinRyu</span>
                        </a>
                      </li>
                      <li>
                        <a href="https://www.instagram.com/sworn_ryu/" rel="author" class="instagram">
                          <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"/></svg>
                          <span>sworn_ryu</span>
                        </a>
                      </li>
                    </ul>
                  </div>
                  <div class="sixteen wide mobile only column">
                    <div class="divider"></div>
                  </div>
                  <div class="sixteen wide column">
                    <h2>Résumé</h2>
                    <p>&mdash; I do not compete with others, the only competition that challenges me is myself. As a fighter, friend and an employee I am known as contemplative, tortured and driven.</p>
                  </div>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="sixteen wide column">
                <div class="fat divider"></div>
              </div>
            </div>
            <div class="row">
              <div class="ten wide column">
                <h3>Experience</h3>
                <ul class="timeline">
                  <li>
                    <p><em>2018</em></p>
                    <p>Amongst many fighters of the past was featured in the movie "Ready Player One". Ryu ready always!</p>
                  </li>
                  <li>
                    <p><em>2017</em></p>
                    <p>United with unknown until then to me Power Rangers to defea resurrected M.Bison. Damn good fighters they are, even not knowing karate ways!</p>
                  </li>
                  <li>
                    <p><em>2016</em></p>
                    <p>In "Street Fighter V" once and for all erased M.Bison from earth and tamed my inner Evil Ryu.</p>
                    <p>Also spent some time on a side-project, mini-series "Street Fighter: Resurrection"</p>
                  </li>
                  <li>
                    <p><em>2014</em></p>
                    <p>Filmed in a martial arts tutorial "Street Fighter: Assassin's Fist", revealing to audience forgotten art of Ansatsuken</p>
                  </li>
                  <li>
                    <p><em>2012</em></p>
                    <p>The gods of intenet concluded me in the animated movie "Wreck-It Ralph", but rewarded me with a good drink for it!</p>
                  </li>
                  <li>
                    <p><em>2008</em></p>
                    <p>My evil alter ego sneaked out of control and became a boss in "Street Fighter IV"</p>
                  </li>
                  <li>
                    <p><em>2006</em></p>
                    <p>Borrowed my famous ripped gi to Soki in "Onimusha: Dawn of Dreams", gods informed me he needed that for the battle</p>
                  </li>
                  <li>
                    <p><em>1998</em></p>
                    <p>Defeated M. Bison in "Street Fighter Alpha 2", bastard wanted to use my heroic body for his evil intentions, but retreated with shame. Also this year I encountered Marvel universe in "Marvel vs. Capcom: Clash of Super Heroes" fighter, loyal to my employer, Capcom, of course</p>
                  </li>
                  <li>
                    <p><em>1997</em></p>
                    <p>Reunited with Ken, my friend and opponent in "Street Fighter III". Men's friendship works mysteriously. Also helped with Arika project "Street Fighter EX"</p>
                  </li>
                  <li>
                    <p><em>1996</em></p>
                    <p>Took care of villainous Akuma in "Street Fighter Alpha 2". As a freelance on "Super Puzzle Fighter II Turbo" tried myself in a new genre, puzzle games. Let the wrath of seven heavens come upon these malicious enigmas, never again!</p>
                  </li>
                  <li>
                    <p><em>1995</em></p>
                    <p>Kept fighting in "Street Fighter Alpha: Warriors' Dreams"</p>
                  </li>
                  <li>
                    <p><em>1994</em></p>
                    <p>Screened in a movie "Street Fighter", so that the batllesof past would not be forgotten by millenial generation</p>
                  </li>
                  <li>
                    <p><em>1991</em></p>
                    <p>Was promoted to "Street Fighter II". Didn't stay there for long, celebrations and office dwelling is not for me!</p>
                  </li>
                  <li>
                    <p><em>1987</em></p>
                    <p>Started working for Capcom project "Street Fighter". My partner was Ken Masters, the boss'name was Sagat</p>
                  </li>
                </ul>
                <h3>Publications</h3>
                <ul class="timeline">
                  <li>
                    <p><em>2011</em></p>
                    <p>The true and humble story of me under pseudonim Tyler Wilde in an article "The evolution of Ken and Ryu"</p>
                  </li>
                  <li>
                    <p><em>2003-2018</em></p>
                    <p>For 15 years I have published comic books with Udon Entertainment depicting my adventures, bitter lessons and great victories</p>
                  </li>
                </ul>
                <h3>Achivements</h3>
                <ul class="timeline">
                  <li>
                    <p><strong>#1</strong> in "Top 25 Street Fighter Characters" by IGN, who also called me "fancy", "icon" and "a testament to the virtue of simplicity" ❤️</p>
                  </li>
                  <li>
                    <p><strong>#2</strong> in "Top 20 Street Fighter Characters of All Time" by GameDaily, same council found me worth of <strong>#6</strong> place in "Top 25 Capcom Characters of All Time", which I proudly share with my partner Ken</p>
                    <p>I was named "5th Most Powerful Street Fighter Character" by Screen Rant-san</p>
                  </li>
                  <li>
                    <p><strong>#71</strong> in "Top 100 Heroes of All Time" by UGO Networks, also recognized <strong>#2</strong> in their list of "Top 50 Street Fighter Characters".</p>
                    <p>In a survey of 4000 online matches for Super Street Fighter IV, I got to be the most popular character, with 16.6% of players choosing my side</p>
                  </li>
                </ul>
              </div>
              <div class="six wide column">
                <section>
                    <h3>Life & Education</h3>
                    <p class="tags small">To live is to fight and to fight is to live. I started learning fighting at my master Gouken's castle, I was beaten at head way too often to remember when exactly.</p>
                </section>
                <section>
                  <h3>Languages</h3>
                  <p class="tags small"><span class="language" lang="en">&#x1f1fa;&#x1f1f8; ENGLISH</span> <span class="language" lang="cn">&#x1F1E8;&#x1F1F3; MANDARIN</span> <span class="language" lang="jp">&#x1F1EF;&#x1F1F5; JAPANESE</span></p>
                </section>
                <section>
                  <h3>Skills</h3>
                  <p class="tags small">KARATE ENERGY ATTACK SHORYUKEN WALKING BAREFOOT PLAYING VIDEOGAMES DOING BURGERS MASHING POTATOES COPYWRITING ACTING VOICEOVERS</p>
                </section>
                <section>
                  <h3>Character</h3>
                  <p class="tags small">NOBLE DIRECT BOLD CONFIDENT DARING SCHIZOPHRENIC DRAMATIC PERSUASIVE IMMEDIATE WISE</p>
                </section>
                <section>
                  <h3>Life lesson</h3>
                  <p class="tags small">You must defeat Sheng Long to stand a chance</p>
                </section>
                <section>
                  <h3>Likes&#x1f603;</h3>
                  <p class="tags small">GI VEGETABLES BLOOD SMALL MARSHMELLOWS RED COLOR KILLED ENEMY</p>
                </section>
                <section>
                  <h3>Dislikes&#x1f61e;</h3>
                  <p class="tags small">BISONS GHOSTS SMARTPHONES SMELL OF SEAFOOD BARBER SHOPS SLEEVES</p>
                </section>
                <section>
                  <h3>Wants&#x1f97a;</h3>
                  <p class="tags small bulleted">BE FIT WRITE MORE BOOKS FIND A GIRLFRIEND TO GO TO CINEMA WITH KILL ALL OF AKUMA FAMILY</p>
                </section>
              </div>
            </div>
          </div>
        </div>
      </article>
    </main>
  </body>
</html>