UserInterface-KevinRodriguez/about-us.html at master · safe-space-lambda/UserInterface-KevinRodriguez · 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
<!DOCTYPE HTML>
	<head>
		<title>Safe Space</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
        <link rel="stylesheet" href="css/index.css"/>
        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
        <link rel="icon" href="/images/safe space (4).png">

    </head>
    <body class="container">
        <nav>
                <i class="fas fa-angle-down menu-button header"></i>
            <div class="menu">
                <a class="header" href="https://unruffled-panini-b9bd04.netlify.com/">Sign Up</a>
                <a href="/index.html">Home</a>
            </div>
        </nav>
        <section>
            <h1 class="welcome">Meet the Safe Space staff</h1>
        </section>
        <section class="staff">
            <h2>Here at Safe Space our staff is trained to handle many situations. But not all, cause like one time there was a really soft throw pillow, just the one and it got really bloody after.</h2>
        </section>
        <section>
                <div class = "tabs">
                    <div class="topics">
                        <div data-tab="steve"class="tab active-tab ">Steve</div>
                        <div data-tab="marge" class="tab">Marge</div>
                        <div data-tab="Debra" class="tab">Debra</div>
                        <div data-tab="glorp" class="tab">Glorp</div>
                    </div>
                </div>
            </section>
            <section class="middle-content">
                    <div class="card active-tab-selected" data-tab="steve">
                        <div class="card_info ">
                        <h1>Steve</h1>
                            <p>This is Steve Harbingauer. Steve founded SafeSpace with the sole belief that a person should be able to feel good at all times.</p>
                            <p>Under his leadership the app has taken off farther than he first believed. With his work he hopes to actually make a change in even more people's lives than he first aimed for.</p>
                        </div>
                            <img src = "/images/iStock-684161792.jpg" class = "services-img" data-tab = "steve">
                    </div>
                    <div class="card" data-tab="marge">
                            <div class="card_info">
                        <h1>Marge</h1>
                            <p>Marge was one of the first people Steve approached when he decided to go through with SafeSpace in the beginning. In the beginning she was adamant about using or even joining the SafeSpace but the more she learned about it the more she realized how much it could help.</p>
                            <p>Thankfully she joined and personally oversees the employees and even checks in with them to make sure that it's everything is going well with the app.</p>
                            </div>
                            <img src = "images/6a00d834515c5469e201b7c72b276a970b.png" class = "services-img" data-tab = "marge">
                    </div>
                    <div class="card" data-tab="glorp">
                            <div class="card_info">
                        <h1>Glorp</h1>
                            <p>Glorp is different. Even with his strange name and fuzzy exterior he's very approachable and is described as very warm and cuddly</p>
                            <p>Even though he's all of those things Glorp asks to be respected and treats others with the same courtesy at every chance he gets.</p>
                            </div>
                            <img src = "images/llama.jpg" class = "services-img" data-tab = "glorp">
                    </div>
                    <div class="card" data-tab="Debra">
                            <div class="card_info">
                        <h1>Debra</h1>
                            <p>Debra has destroyed lives with her almighty Sunblade. Of course she's only done this online in roleplaying games. But with the experience of finding a community online and somewhere to feel comfortable. </p>
                            <p>Sharing the same beliefs as everyone else that she now works with she's the head of the tech department and oversees maintenance of the app herself. She knows how important it is to people and of course to herself.</p>
                            </div>
                            <img src = "/images/xena.jpeg" class = "services-img" data-tab = "Debra">
                    </div>
                </section>
            <section class="footer">
                    <div>
                        <ol class="footer-icons">
                            <li><a href="#" class="fa fa-twitter"></a></li>
                            <li><a href="#" class="fa fa-facebook"></a></li>
                            <li><a href="#" class="fa fa-instagram"></a></li>
                            <li><a href="#" class="fa fa-github"></a></li>
                            <li><a href="#" class="fa fa-google"></a></li>
                        </ol>
                    </div>
                    <div>
                        <ol class="copyright">
                            <ul>
                                <li>Copyright</li>
                            </ul>
                            <ul>
                                <li>Made By</li>
                            </ul>
                            <ul>
                                <a class="login" href="https://unruffled-panini-b9bd04.netlify.com/">Sign Up</a>
                            </ul>
                        </ol>
                    </div>
                </section>
                <script src="/js/about-us.js"></script>
                <script src="/js/nav.js"></script>
                <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.2/TweenMax.min.js"></script>
    </body>