not really known
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.

139 lines
6.9 KiB

7 years ago
7 years ago
  1. <!DOCTYPE html>
  2. <html>
  3. <title>Michael Feffert</title>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  7. <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Roboto'>
  8. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  9. <style>
  10. html,body,h1,h2,h3,h4,h5,h6 {font-family: "Roboto", sans-serif}
  11. </style>
  12. <body class="w3-light-grey">
  13. <!-- Page Container -->
  14. <div class="w3-content w3-margin-top" style="max-width:1400px;">
  15. <!-- The Grid -->
  16. <div class="w3-row-padding">
  17. <!-- Left Column -->
  18. <div class="w3-third">
  19. <div class="w3-white w3-text-grey w3-card-4">
  20. <div class="w3-display-container">
  21. <img src="/w3images/avatar_hat.jpg" style="width:100%" alt="Avatar">
  22. <div class="w3-display-bottomleft w3-container w3-text-black">
  23. <h2>Michael Geffert</h2>
  24. </div>
  25. </div>
  26. <div class="w3-container">
  27. <p><i class="fa fa-briefcase fa-fw w3-margin-right w3-large w3-text-teal"></i>Programmer</p>
  28. <p><i class="fa fa-home fa-fw w3-margin-right w3-large w3-text-teal"></i>Rochester, NY</p>
  29. <hr>
  30. <p class="w3-large"><b><i class="fa fa-asterisk fa-fw w3-margin-right w3-text-teal"></i>Skills</b></p>
  31. <p>Java</p>
  32. <div class="w3-light-grey w3-round-xlarge w3-small">
  33. <div class="w3-container w3-center w3-round-xlarge w3-teal" style="width:90%">90%</div>
  34. </div>
  35. <p>Python</p>
  36. <div class="w3-light-grey w3-round-xlarge w3-small">
  37. <div class="w3-container w3-center w3-round-xlarge w3-teal" style="width:80%">
  38. <div class="w3-center w3-text-white">80%</div>
  39. </div>
  40. </div>
  41. <p>Youtube</p>
  42. <div class="w3-light-grey w3-round-xlarge w3-small">
  43. <div class="w3-container w3-center w3-round-xlarge w3-teal" style="width:75%">75%</div>
  44. </div>
  45. <p>Media</p>
  46. <div class="w3-light-grey w3-round-xlarge w3-small">
  47. <div class="w3-container w3-center w3-round-xlarge w3-teal" style="width:50%">50%</div>
  48. </div>
  49. <br>
  50. <p class="w3-large w3-text-theme"><b><i class="fa fa-globe fa-fw w3-margin-right w3-text-teal"></i>Languages</b></p>
  51. <p>English</p>
  52. <div class="w3-light-grey w3-round-xlarge">
  53. <div class="w3-round-xlarge w3-teal" style="height:24px;width:100%"></div>
  54. </div>
  55. <p>Spanish</p>
  56. <div class="w3-light-grey w3-round-xlarge">
  57. <div class="w3-round-xlarge w3-teal" style="height:24px;width:55%"></div>
  58. </div>
  59. <br>
  60. </div>
  61. </div><br>
  62. <!-- End Left Column -->
  63. </div>
  64. <!-- Right Column -->
  65. <div class="w3-twothird">
  66. <div class="w3-container w3-card w3-white w3-margin-bottom">
  67. <h2 class="w3-text-grey w3-padding-16"><i class="fa fa-suitcase fa-fw w3-margin-right w3-xxlarge w3-text-teal"></i>Work Experience</h2>
  68. <div class="w3-container">
  69. <h5 class="w3-opacity"><b>Front End Developer / w3schools.com</b></h5>
  70. <h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Jan 2015 - <span class="w3-tag w3-teal w3-round">Current</span></h6>
  71. <p>Lorem ipsum dolor sit amet. Praesentium magnam consectetur vel in deserunt aspernatur est reprehenderit sunt hic. Nulla tempora soluta ea et odio, unde doloremque repellendus iure, iste.</p>
  72. <hr>
  73. </div>
  74. <div class="w3-container">
  75. <h5 class="w3-opacity"><b>Web Developer / something.com</b></h5>
  76. <h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Mar 2012 - Dec 2014</h6>
  77. <p>Consectetur adipisicing elit. Praesentium magnam consectetur vel in deserunt aspernatur est reprehenderit sunt hic. Nulla tempora soluta ea et odio, unde doloremque repellendus iure, iste.</p>
  78. <hr>
  79. </div>
  80. <div class="w3-container">
  81. <h5 class="w3-opacity"><b>Graphic Designer / designsomething.com</b></h5>
  82. <h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Jun 2010 - Mar 2012</h6>
  83. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p><br>
  84. </div>
  85. </div>
  86. <div class="w3-container w3-card w3-white">
  87. <h2 class="w3-text-grey w3-padding-16"><i class="fa fa-certificate fa-fw w3-margin-right w3-xxlarge w3-text-teal"></i>Education</h2>
  88. <div class="w3-container">
  89. <h5 class="w3-opacity"><b>W3Schools.com</b></h5>
  90. <h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Forever</h6>
  91. <p>Web Development! All I need to know in one place</p>
  92. <hr>
  93. </div>
  94. <div class="w3-container">
  95. <h5 class="w3-opacity"><b>Hilton High School</b></h5>
  96. <h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>2017</h6>
  97. <p>High School</p>
  98. <hr>
  99. </div>
  100. <div class="w3-container">
  101. <h5 class="w3-opacity"><b>RIT</b></h5>
  102. <h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>2017-2022</h6>
  103. <p>Software Engineering</p><br>
  104. </div>
  105. </div>
  106. <!-- End Right Column -->
  107. </div>
  108. <!-- End Grid -->
  109. </div>
  110. <!-- End Page Container -->
  111. </div>
  112. <footer class="w3-container w3-teal w3-center w3-margin-top">
  113. <p>Find me on social media.</p>
  114. <i class="fa fa-facebook-official w3-hover-opacity"></i>
  115. <i class="fa fa-instagram w3-hover-opacity"></i>
  116. <i class="fa fa-snapchat w3-hover-opacity"></i>
  117. <i class="fa fa-pinterest-p w3-hover-opacity"></i>
  118. <i class="fa fa-twitter w3-hover-opacity"></i>
  119. <i class="fa fa-linkedin w3-hover-opacity"></i>
  120. <p>Powered by <a href="https://www.w3schools.com/w3css/default.asp" target="_blank">w3.css</a></p>
  121. </footer>
  122. </body>
  123. </html>