CSM/explore.html at main · VeronicaOS/CSM · 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
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Community Science Museum | Explore with us</title>
        <meta
            name="description"
            content="The aim of our museum is to create a space where everyone can experience the wonders of our discoveries and perhaps even ignite a lifelong passion to continue the exploration of the world around us."
        />
        <meta name="viewport" content="widt=device-width, initial-scale=1.0" />
        <link href="CSS/styles.css" rel="stylesheet" />
        <link href="CSS/explore.css" rel="stylesheet" />
        <link
            rel="stylesheet"
            href="data/font-awesome/css/font-awesome.min.css"
        />
        <link
            href="https://fonts.googleapis.com/css2?family=Raleway:wght@100;200;300;400;500&display=swap"
            rel="stylesheet"
        />
    </head>
    <body class="explore-body">
        <!--header-->
        <header>
                <img src="Images/CSM-mobile/header.png" class="header-background mobile" alt="wavy cream colored header">
                <div class="logo-cream">
                    <a class="logo1" href="index.html" aria-label="CSM">CSM</a>
                    <a class="logo2" href="index.html" aria-label="Community Science Museum">Community Science Museum</a>
                </div>
                <div class="hamburger-menu">
                    <input type="checkbox" id="menu-checkbox" />
                    <label aria-label="Hamburger menu" for="menu-checkbox">
                        <span class="hamburger-menu">
                            <span class="bar1"></span>
                            <span class="bar2"></span>
                            <span class="bar3"></span>
                        </span>
                    </label>
                    <nav class="menu-list">
                        <a href="index.html">Home</a>
                        <a href="visit-contact.html">Visit/contact</a>
                        <a href="exhibits.html">Exhibits</a>
                        <a href="explore.html">Explore</a>
                        <a href="get-involved.html" class="mobile">Get involved</a>
                    </nav>
                </div>
                <a href="#" class="magnifying-glass mobile" aria-label="magnifying glass icon">
                <i class="fa fa-search fa-flip-horizontal" aria-hidden="true"></i>
                </a>
                <svg class="desktop-header desktop" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="#EFE3CC" fill-opacity="1" d="M0,224L80,213.3C160,203,320,181,480,176C640,171,800,181,960,154.7C1120,128,1280,64,1360,32L1440,0L1440,0L1360,0C1280,0,1120,0,960,0C800,0,640,0,480,0C320,0,160,0,80,0L0,0Z"></path></svg>
        </header>
        <!--main-->
        <main class="explore-container">
            <div class="kids-text text">
                <h1>KIDS</h1>
                <p>You can learn about Newtonian physics from our bumper swing, or why not travel back in   time and meet our resident Woolly Mammoth? Our exhibits are designed to be accessible for interested minds, so make sure you come ready to learn and explore.
                We also have the Young Stars club which meets once a week on a Saturday between 10:00 and 13:00 where you’ll get to explore and experiment with our team of experts.</p>
            </div>
            <img src="Images/CSM-desktop/kids.png" class="kids-image img" alt="Three kids, two boys and a girl, laying down and reading a book">
            <div class="teachers-text text">
                <h2>TEACHERS</h2>
                <p>As a community-driven museum, we want to work with schools to create places of learning and exploring. Our team are on hand to give your students guided tours of the museum, teach them in our learning laboratory, and provide great video presentations that will excite and inspire them. Please get in touch with us here to find out more about our facilities and to arrange a time to bring your students through for a visit.</p>
            </div>
            <img src="Images/CSM-desktop/teachers.png" class="teachers-image img" alt="A man in a blue button up shirt holding a pen in one hand and a book in the other">
            <div class="researchers-text text">
                <h2>RESEARCHERS</h2>
                <p>Are you looking to get involved with our team of researchers and academics?
                Our museum offers various ways for you to use our resources and contribute towards them. We have online records, laboratory space, and a working relationship with a number of universities around the country.</p>
            </div>
            <img src="Images/CSM-desktop/researchers.png" class="researchers-image img" alt="A scientist woman working at the lab, holding up a vile">
        </main>
        <!--footer-->
        <footer>
            <hr />
            <div class="footer-flex">
                <div class="footer-nav">
                    <a href="visit-contact.html">Visit/contact</a>
                    <a href="get-involved.html">Get involved</a>
                    <a href="explore.html">Explore</a>
                    <a href="exhibits.html">Exhibits</a>
                </div>
                <div class="vl"></div>
                <div class="footer-socials">
                    <p>Follow us</p>
                    <div class="socials1">
                        <a href="#" aria-label="instagram logo">
                            <i class="fa fa-instagram fa-2x" aria-hidden="true"></i>
                        </a>
                        <a href="#" aria-label="facebook logo">
                            <i class="fa fa-facebook-square fa-2x" aria-hidden="true"></i>
                        </a>
                        <a href="#" aria-label="twitter logo">
                            <i class="fa fa-twitter fa-2x" aria-hidden="true"></i>
                        </a>
                    </div>
                    <div class="socials2">

                        <a href="#" aria-label="youtube logo">
                            <i class="fa fa-youtube-play fa-2x" aria-hidden="true"></i>
                        </a>
                        <a href="#" aria-label="pinterest logo">
                            <i class="fa fa-pinterest fa-2x" aria-hidden="true"></i>
                        </a>
                        <a href="#" aria-label="snapchat logo">
                            <i class="fa fa-snapchat-square fa-2x" aria-hidden="true"></i>
                        </a>
                    </div>
                </div>
                <div class="vl"></div>
                <div class="footer-info">
                    <a href="#">Terms and conditions</a>
                    <a href="#">Privacy policy</a>
                    <a href="#">Help</a>
                    <a href="#">Cookie Settings</a>
                </div>
            </div>
            <div class="copyright">
                <p>© 2005–2023 The Community Science Museum. All rights reserved.</p>
            </div>
        </footer>
    </body>
</html>