Resume to post on website or print to PDF.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

resume.html 8.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <link rel="stylesheet" type="text/css" href="dep/normalize.css/normalize.css" />
  6. <link rel="stylesheet" type="text/css" href="dep/Font-Awesome/css/font-awesome.css" />
  7. <link rel="stylesheet" type="text/css" href="style.css" />
  8. </head>
  9. <body lang="en">
  10. <section id="main">
  11. <header id="title">
  12. <h1>John Doe</h1>
  13. <span class="subtitle">Plaintiff, defendant &amp; witness</span>
  14. </header>
  15. <section class="main-block">
  16. <h2>
  17. <i class="fa fa-suitcase"></i> Experiences
  18. </h2>
  19. <section class="blocks">
  20. <div class="date">
  21. <span>2015</span><span>present</span>
  22. </div>
  23. <div class="decorator">
  24. </div>
  25. <div class="details">
  26. <header>
  27. <h3>Some Position</h3>
  28. <span class="place">Some Workplace</span>
  29. <span class="location">(remote)</span>
  30. </header>
  31. <div>
  32. <ul>
  33. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
  34. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec mi ante. Etiam odio eros, placerat eu metus id, gravida eleifend odio. Vestibulum dapibus pharetra odio, egestas ullamcorper ipsum congue ac. Maecenas viverra tortor eget convallis vestibulum. Donec pulvinar venenatis est, non sollicitudin metus laoreet sed. Fusce tincidunt felis nec neque aliquet porttitor</li>
  35. </ul>
  36. </div>
  37. </div>
  38. </section>
  39. <section class="blocks">
  40. <div class="date">
  41. <span>2014</span><span>2015</span>
  42. </div>
  43. <div class="decorator">
  44. </div>
  45. <div class="details">
  46. <header>
  47. <h3>Another Position</h3>
  48. <span class="place">Some Workplace</span>
  49. <span class="location">Some City, Some Country</span>
  50. </header>
  51. <div>
  52. <ul>
  53. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
  54. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
  55. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
  56. </ul>
  57. </div>
  58. </div>
  59. </section>
  60. <section class="blocks">
  61. <div class="date">
  62. <span>2013</span><span>2014</span>
  63. </div>
  64. <div class="decorator">
  65. </div>
  66. <div class="details">
  67. <header>
  68. <h3>Yet Another Job Position</h3>
  69. <span class="place">Some Workplace</span>
  70. <span class="location">Some City, Some Country</span>
  71. </header>
  72. <div>
  73. <ul>
  74. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec mi ante. Etiam odio eros, placerat eu metus id, gravida eleifend odio</li>
  75. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
  76. </ul>
  77. </div>
  78. </div>
  79. </section>
  80. </section>
  81. <section class="main-block">
  82. <h2>
  83. <i class="fa fa-folder-open"></i> Selected Projects
  84. </h2>
  85. <section class="blocks">
  86. <div class="date">
  87. <span>2015</span><span>2016</span>
  88. </div>
  89. <div class="decorator">
  90. </div>
  91. <div class="details">
  92. <header>
  93. <h3>Some Project 1</h3>
  94. <span class="place">Some workplace</span>
  95. </header>
  96. <div>
  97. <ul>
  98. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
  99. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec mi ante. Etiam odio eros, placerat eu metus id, gravida eleifend odio. Vestibulum dapibus pharetra odio, egestas ullamcorper ipsum congue ac</li>
  100. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec mi ante. Etiam odio eros, placerat eu metus id, gravida eleifend odio</li>
  101. </ul>
  102. </div>
  103. </div>
  104. </section>
  105. <section class="blocks">
  106. <div class="date">
  107. <span>2014</span><span>2015</span>
  108. </div>
  109. <div class="decorator">
  110. </div>
  111. <div class="details">
  112. <header>
  113. <h3>Some Project 2</h3>
  114. <span class="place">Some workplace</span>
  115. </header>
  116. <div>
  117. <ul>
  118. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec mi ante. Etiam odio eros, placerat eu metus id, gravida eleifend odio. Vestibulum dapibus pharetra odio, egestas ullamcorper ipsum congue ac. Maecenas viverra tortor eget convallis vestibulum. Donec pulvinar venenatis est, non sollicitudin metus laoreet sed. Fusce tincidunt felis nec neque aliquet porttitor</li>
  119. </ul>
  120. </div>
  121. </div>
  122. </section>
  123. <section class="blocks">
  124. <div class="date">
  125. 2014
  126. </div>
  127. <div class="decorator">
  128. </div>
  129. <div class="details">
  130. <header>
  131. <h3>Some Project 3</h3>
  132. <span class="place">Some workplace</span>
  133. </header>
  134. <div>
  135. <ul>
  136. <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec mi ante. Etiam odio eros, placerat eu metus id, gravida eleifend odio</li>
  137. </ul>
  138. </div>
  139. </div>
  140. </section>
  141. </section>
  142. <section class="main-block concise">
  143. <h2>
  144. <i class="fa fa-graduation-cap"></i> Education
  145. </h2>
  146. <section class="blocks">
  147. <div class="date">
  148. <span>2009</span><span>2014</span>
  149. </div>
  150. <div class="decorator">
  151. </div>
  152. <div class="details">
  153. <header>
  154. <h3>Ph.D. in Forty-Two Discovery</h3>
  155. <span class="place">Inexistent University</span>
  156. <span class="location">Some City, Some Country</span>
  157. </header>
  158. <div>Relationship of the number with the answer to life, the universe and everything</div>
  159. </div>
  160. </section>
  161. <section class="blocks">
  162. <div class="date">
  163. <span>2005</span><span>2009</span>
  164. </div>
  165. <div class="decorator">
  166. </div>
  167. <div class="details">
  168. <header>
  169. <h3>LL.B. in H&aelig;matophagic Economics</h3>
  170. <span class="place">Inexistent University</span>
  171. <span class="location">Some City, Some Country</span>
  172. </header>
  173. <div>President's Scholarship</div>
  174. </div>
  175. </section>
  176. <section class="blocks">
  177. <div class="date">
  178. <span>2005</span><span>2009</span>
  179. </div>
  180. <div class="decorator">
  181. </div>
  182. <div class="details">
  183. <header>
  184. <h3>B.S. in Existential Science (Double Major)</h3>
  185. <span class="place">Inexistent University</span>
  186. <span class="location">Some City, Some Country</span>
  187. </header>
  188. <div>President's Scholarship</div>
  189. </div>
  190. </section>
  191. <section class="blocks">
  192. <div class="date">
  193. </div>
  194. <div class="decorator">
  195. </div>
  196. <div class="details">
  197. <header>
  198. <h3>Massive Online Fee&ndash;Required Course (selective list)</h3>
  199. </header>
  200. <div class="concise">
  201. <ul>
  202. <li>Introduction to something else</li>
  203. <li>Introduction to some more useless things</li>
  204. <li>Impractical philosophy</li>
  205. <li>Astrology and its effects on astrology</li>
  206. <li>Artificial politics</li>
  207. </ul>
  208. </div>
  209. </div>
  210. </section>
  211. </section>
  212. </section>
  213. <aside id="sidebar">
  214. <div class="side-block" id="contact">
  215. <h1>
  216. Contact Info
  217. </h1>
  218. <ul>
  219. <li><i class="fa fa-globe"></i> johndoe.gtld</li>
  220. <li><i class="fa fa-linkedin"></i> linkedin.com/in/john</li>
  221. <li><i class="fa fa-envelope"></i> me@johndoe.gtld</li>
  222. <li><i class="fa fa-phone"></i> 800.000.0000</li>
  223. </ul>
  224. </div>
  225. <div class="side-block" id="skills">
  226. <h1>
  227. Skills
  228. </h1>
  229. <ul>
  230. <li>Omnipresence</li>
  231. <li>Anonymity</li>
  232. </ul>
  233. <ul>
  234. <ul>
  235. <li>Ordinarity</li>
  236. <li>No name rights</li>
  237. </p>
  238. </div>
  239. <div class="side-block" id="disclaimer">
  240. This r&eacute;sum&eacute; was wholly typeset with HTML/CSS &mdash; see <code>git.io/vVSYL</code>
  241. </div>
  242. </aside>
  243. </body>
  244. </html>