diff --git a/CSS b/CSS
new file mode 100644
index 0000000000000000000000000000000000000000..f955f61c8073882bdb6a05456931155c1b7a6794
--- /dev/null
+++ b/CSS
@@ -0,0 +1,4 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title> Locations </title>
diff --git a/our locations.html b/our locations.html
new file mode 100644
index 0000000000000000000000000000000000000000..25b69bc2803a0b83228085f3d5bb89cb594143b0
--- /dev/null
+++ b/our locations.html
@@ -0,0 +1,136 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title> Locations </title>
+
+<style>
+ body{
+ background-color: white;
+ color: black;
+}
+
+header{
+ background-color: white;
+ color: black;
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ float: center;
+}
+
+.container {
+ position: relative;
+ padding: 5px;
+ width: 50%;
+ height: 70%;
+ background-color: white;
+ box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+ margin-bottom: 25px;
+}
+
+
+.image {
+ opacity: 1;
+ display: block;
+ width: 100%;
+ height: 75%;
+ transition: .5s ease;
+ backface-visibility: hidden;
+
+}
+
+.middle {
+ transition: .5s ease;
+ opacity: 0;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ -ms-transform: translate(-50%, -50%)
+
+}
+
+.container:hover .image {
+ opacity: 0.3;
+}
+
+.container:hover .middle {
+ opacity: 1;
+}
+
+.text {
+ background-color: black;
+ color: white;
+ font-size: 16px;
+ padding: 16px 32px;
+}
+
+
+
+div.contain {
+ text-align: center;
+}
+
+ul.list {
+ display: inline-block;
+ text-align: left;
+ list-style-type: none;
+}
+
+</style>
+<body>
+ <h1> OUR LOCATIONS </h1>
+ <div class="contain">
+ <ul class= "list">
+ <li>
+<div class="container">
+ <img src="https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646867535415-4JI39H286BUMT26H4FHN/C36A1915.jpg?format=2500w" class="image" >
+
+ <div class="middle">
+ <div class="text"> Codebase </div>
+ </div>
+ </div>
+ </li>
+
+ <li>
+ <div class="container">
+ <img src="https://wearecatalyst.org/wp-content/uploads/2022/05/Catalyst03.jpg" class="image" >
+
+ <div class="middle">
+ <div class="text"> Catalyst </div>
+ </div>
+ </div>
+ </li>
+ <li>
+ <div class="container">
+ <img src="https://images.squarespace-cdn.com/content/v1/5709040420c647579532dbb4/1594914119071-OWI9G22S295OCMSWL0VL/_K5L1162.jpg?format=2500w" Class="image" >
+
+ <div class="middle">
+ <div class="text"> C4DI </div>
+ </div>
+ </div>
+ </li>
+
+ <li>
+ <div class="container">
+ <img src="https://dogpatchlabs.wpenginepowered.com/wp-content/uploads/2022/09/ian_browne.jpg" class="image" >
+
+ <div class="middle">
+ <div class="text"> Dogpatch </div>
+ </div>
+ </div>
+ </li>
+
+ <li>
+ <div class="container">
+ <img src="https://stationf.co/img/misc/create-zone.jpg" class="image" >
+
+ <div class="middle">
+ <div class="text"> Station F </div>
+ </div>
+ </div>
+ </li>
+ </ul>
+</div>
+
+</body>