A website made for a class project to document an ecological issue resulting from human impact on the environment
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.

104 lines
3.5 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Impact of Poaching on Ecosystems</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <meta name="description" content="This biology project looks into the impact of poaching on ecosystems.">
  8. <link href="css/styles.css" rel="stylesheet" media="screen">
  9. <!-- Rhino Icons by Twemoji. Generated using favicon.io -->
  10. <link rel="manifest" href="static/site.webmanifest">
  11. <link rel="apple-touch-icon" sizes="180x180" href="static/icons/apple-touch-icon.png">
  12. <link rel="icon" type="image/png" sizes="32x32" href="static/icons/favicon-32x32.png">
  13. <link rel="icon" type="image/png" sizes="16x16" href="static/icons/favicon-16x16.png">
  14. </head>
  15. <body>
  16. <!-- Top Navbar -->
  17. <div class="Navbar">
  18. <div class="Navbar__Link Navbar__Link-brand">
  19. <h1><a href="#">Impact of Poaching on Ecosystems</a></h1>
  20. </div>
  21. <nav class="Navbar__Items Navbar__Items--right">
  22. <div class="Navbar__Link">
  23. <a href="mailto:ravi@yeetpc.com">Contact Me</a>
  24. </div>
  25. </nav>
  26. </div>
  27. <!-- End Top Navbar -->
  28. <!-- Start background section -->
  29. <div class="background-section">
  30. <div class="section-header">
  31. <h1>Background</h1>
  32. </div>
  33. </div>
  34. <!-- Start image section -->
  35. <div class="image-section-1">
  36. <div class="poaching-image">
  37. <img src="/static/img/" alt="">
  38. </div>
  39. <div class="image-caption">
  40. <caption></caption>
  41. </div>
  42. </div>
  43. <!-- Start location section -->
  44. <div class="location-section">
  45. <div class="section-header">
  46. <h1>Location or something</h1>
  47. </div>
  48. </div>
  49. <!-- Start map section -->
  50. <div class="map-section-1">
  51. <iframe title="Map of Kenya" width="100%" height="90%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.openstreetmap.org/export/embed.html?bbox=31.684570312500004%2C-2.943040910055132%2C43.41796875000001%2C3.425691524418062&amp;layer=hot&amp;marker=0.24169850190165%2C37.55126953125" loading=lazy></iframe><br/><small><a href="https://www.openstreetmap.org/?mlat=0.242&amp;mlon=37.551#map=7/0.242/37.551&amp;layers=H">View Larger Map</a></small>
  52. <div class="image-caption">
  53. <caption></caption>
  54. </div>
  55. </div>
  56. <!-- Start background section -->
  57. <div class="background-section">
  58. <div class="section-header">
  59. <h1>Background</h1>
  60. </div>
  61. </div>
  62. <!-- Start image section -->
  63. <div class="image-section-1">
  64. <div class="poaching-image">
  65. <img src="/static/img/" alt="">
  66. </div>
  67. <div class="image-caption">
  68. <caption></caption>
  69. </div>
  70. </div>
  71. <!-- Start location section -->
  72. <div class="location-section">
  73. <div class="section-header">
  74. <h1>Location or something</h1>
  75. </div>
  76. </div>
  77. <!-- Start map section -->
  78. <div class="map-section-1">
  79. <iframe title="Map of Kenya" width="100%" height="90%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.openstreetmap.org/export/embed.html?bbox=31.684570312500004%2C-2.943040910055132%2C43.41796875000001%2C3.425691524418062&amp;layer=hot&amp;marker=0.24169850190165%2C37.55126953125" loading=lazy></iframe><br/><small><a href="https://www.openstreetmap.org/?mlat=0.242&amp;mlon=37.551#map=7/0.242/37.551&amp;layers=H">View Larger Map</a></small>
  80. <div class="image-caption">
  81. <caption></caption>
  82. </div>
  83. </div>
  84. <div class="placeholder">
  85. <p>placeholder</p>
  86. </div>
  87. </body>
  88. </html>