RunningWild/index.html at master · JimLynx/RunningWild · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Running Wild</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css"/>
    <link href="assets/css/style.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <header>
      <a href="index.html">
        <h2 id="logo">Running Wild</h2>
      </a>
      <nav>
        <ul id="menu">
          <li>
            <a href="signup.html">Support Us</a>
          </li>
          <li>
            <a href="gallery.html">Gallery</a>
          </li>
          <li>
            <a class="active" href="index.html">Home</a>
          </li>
        </ul>
      </nav>
    </header>
    <section id="hero-outer">
      <div id="hero-image"></div>
      <div id="cover-text">
        <h3>Over 8000 Lions in South Africa are currently bred in captivity for:</h3>
        <div>""</div>
        <h5>The Asian lion-bone trade</h5>
        <h5>canned hunting</h5>
        <h5>tourism market</h5>

      </div>
    </section>
    <section id="project-ethos">
        <h2 id="welcome">How do we combat this?</h2>

        <div id="left-about">
          <div class="left-about-heading">
              <h2>Rescue <i class="fas fa-truck-loading"></i></h2>
              <hr>
              <p>
              We identify lion-breeding and hunting facilities and approach the owners to 'buy' the Lions from them.
              </p>
          </div>

          <div class="left-about-heading">
            <h2><i class="fas fa-hand-holding-heart"></i> Rehabilitate</h2>
            <hr>
            <p>
              The Lions are relocated to our safe sanctuary, where they undergo medical care and rehabilitation into their new surroundings.
            </p>
          </div>
        </div>

        <div id="right-about">
          <div class="right-about-heading">
              <h2>Educate <i class="fas fa-chalkboard-teacher"></i></h2>
              <hr>
              <p>
              Working with local communities, we educate schools and general public about the plight of captive-bred Lions and where they ultimately end up.
              </p>
          </div>

          <div class="right-about-heading">
            <h2>Conserve <i class="fas fa-paw"></i></h2>
            <hr>
            <p>
              We continue to provide the rescued, rehabilitated Lions with an excellent quality of life in a natural, wild environment.
            </p>
          </div>
        </div>

        <div id="center-about">
          <div id="circle-container">
            <div id="circle-cover-bg"></div>
          </div>
        </div>

    </section>
    <div><h2 id="support-heading">Our Supporters</h2></div><br>
    <section id="support-img">
      <div>
        <h1><i class="fas fa-hands-helping"></i></h1>
        <h2>World Wildlife Fund</h2>
        <h4>https://www.worldwildlife.org</h4>

      </div>

      <div>
        <h1><i class="fas fa-hands-helping"></i></h1>
        <h2>Earth Organization</h2>
        <h4>https://www.earthorganization.org</h4>

      </div>

      <div>
        <h1><i class="fas fa-hands-helping"></i></h1>
        <h2>EarthStream Live</h2>
        <h4>https://www.earthstreamlive.com</h4>

      </div>

      <div>
        <h1><i class="fas fa-hands-helping"></i></h1>
        <h2>LionWatch</h2>
        <h4>https://www.lionwatch.net</h4>

      </div>

      <div>
        <h1><i class="fas fa-hands-helping"></i></h1>
        <h2>Vision Africa</h2>
        <h4>http://visionafrica.co.za</h4>

      </div>

    </section>
    <footer>
      <ul class="social-networks">
        <li><a href="https://www.facebook.com" target="_blank"><i class="fab fa-facebook"></i></a></li>
        <li><a href="https://twitter.com" target="_blank"><i class="fab fa-twitter-square"></i></a></li>
        <li><a href="https://youtube.com" target="_blank"><i class="fab fa-youtube-square"></i></a></li>
        <li><a href="https://instagram.com" target="_blank"><i class="fab fa-instagram"></i></a></li>

      </ul>
    </footer>
  </body>
</html>