diff --git a/IntroToHTMLCSS/src/images/halloween.png b/IntroToHTMLCSS/src/images/halloween.png
new file mode 100644
index 0000000000000000000000000000000000000000..55efa7ec1842a98bea084c51c9b4a25f0dc98fd1
Binary files /dev/null and b/IntroToHTMLCSS/src/images/halloween.png differ
diff --git a/IntroToHTMLCSS/src/images/logo.png b/IntroToHTMLCSS/src/images/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..4c56e7b5e449f216c0871a7dc980ea364b02a01e
Binary files /dev/null and b/IntroToHTMLCSS/src/images/logo.png differ
diff --git a/IntroToHTMLCSS/src/images/movie.png b/IntroToHTMLCSS/src/images/movie.png
new file mode 100644
index 0000000000000000000000000000000000000000..c5210c6b0752b82ca18b74858b14d76a40a3ccc8
Binary files /dev/null and b/IntroToHTMLCSS/src/images/movie.png differ
diff --git a/IntroToHTMLCSS/src/index.html b/IntroToHTMLCSS/src/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..0140f4c2b457bb4fc476a98cff0199eaaa7244bf
--- /dev/null
+++ b/IntroToHTMLCSS/src/index.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="icon" href="logo.png">
+ <link rel="stylesheet" href="style.css">
+ <title>Drexel CHI</title>
+</head>
+<body>
+ <header>
+ <h1>Drexel CHI</h1>
+ <h3>User Experience Club</h3>
+ </header>
+ <nav>
+ <a href="https://www.instagram.com/drexelchi/" target="_blank">Follow Us on Instagram</a>
+ <a href="mailto:drexelchi.uxclub@gmail.com" target="_blank">Contact Us</a>
+ </nav>
+ <div id="content">
+ <div class="about">
+ <a href="https://dragonlink.drexel.edu/organization/chi-ux" target="_blank"><img src="logo.png" id="logo"></a>
+ <p>Drexel CHI User Experience Club is a campus chapter of ACM SIGCHI. We are dedicated to providing students with interest in user experience, computer-human interaction, and design a place to share ideas, collaborate and develop professionally.</p>
+ <p>We aim to show creative students how they can translate their passion into a sustainable career by offering specialized workshops to promote good practices in the field of user experience and providing students with a community of like-minded individuals.</p>
+ </div>
+ <div class="events">
+ <h2>Upcoming Events</h2>
+ <br>
+ <h5>Wednesday, October 28</h5>
+ <h3>Speed Friending: Halloween Edition!</h3>
+ <img src="halloween.png" class="banner">
+ <br><br>
+ <h5>Thursday, October 29</h5>
+ <h3>CHI x WiCs x WiPs Movie Night: The Social Dilemma</h3>
+ <img src="movie.png" class="banner">
+ </div>
+ </div>
+ <footer>
+ Drexel CHI © October 2020
+ </footer>
+</body>
+</html>
\ No newline at end of file
diff --git a/IntroToHTMLCSS/src/style.css b/IntroToHTMLCSS/src/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..28fb2f1bc70d7940dbcfe1413f2bc165e42a526a
--- /dev/null
+++ b/IntroToHTMLCSS/src/style.css
@@ -0,0 +1,66 @@
+* {
+ color: #232F51;
+ font-family: Arial, Helvetica, sans-serif;
+ margin: 0;
+}
+
+header {
+ text-align: center;
+ background-color: #EAC458;
+ padding: 40px;
+}
+
+header h1 {
+ font-size: 40px;
+}
+
+nav {
+ background-color: #002760;
+}
+
+nav a {
+ color: white;
+ text-decoration: none;
+ display: inline-block;
+ padding: 15px;
+}
+
+nav a:hover {
+ font-style: italic;
+}
+
+#content {
+ display: flex;
+}
+
+#content .about {
+ flex: 20%;
+ background-color: #f1f1f1;
+ padding: 20px;
+}
+
+#content .about p {
+ padding: 6px;
+}
+
+#content .about img#logo {
+ max-width: 100%;
+ margin-bottom: 5%;
+}
+
+#content .events {
+ flex: 80%;
+ padding: 40px;
+}
+
+#content .events img.banner {
+ max-width: 500px;
+ padding: 20px;
+}
+
+footer {
+ padding: 15px;
+ text-align: center;
+ background-color: #ddd;
+ font-size: small;
+}
\ No newline at end of file