3 files changed, 175 insertions, 2 deletions
diff --git a/client/style/admin.css b/client/style/admin.css
new file mode 100644
index 0000000..c2d3f0e
--- /dev/null
+++ b/client/style/admin.css
@@ -0,0 +1,29 @@
+.info {
+    margin: 15px;
+}
+
+input {
+    width: 50px;
+}
+
+.newattraction {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: left;
+    align-items: center;
+    margin: 15px 2.3% 15px 2.3%;
+    border: 1px solid var(--primary-color);
+}
+
+.newattractioninput {
+    margin: 5px;
+    width: auto;
+}
+
+.newattractioninput input {
+    min-width: 140px;
+    resize: both;
+    height: 30px;
+}
+
diff --git a/client/style/main.css b/client/style/main.css
index 0159545..abebf9c 100644
--- a/client/style/main.css
+++ b/client/style/main.css
@@ -28,7 +28,7 @@ article {
     border: 1px solid var(--primary-color);
     color: var(--light-text-color);
     width: 96%;
-    margin: 2% 0 0 2%;
+    margin: 2% 0 10px 2%;
 }
 #logo-header {
     display: none;
@@ -117,7 +117,7 @@ article {
     border-radius: 25px;
     border: 1px solid var(--primary-color);
     color: var(--light-text-color);
-    margin: 10px 0 0 2.3%;
+    margin: 10px 0 10px 2.3%;
     display: inline-block;
     width: 30%;
     position: relative;
@@ -302,3 +302,28 @@ main {
     font-size: 1rem;
     padding: 6px 15px;
 }
+
+.orderdescription {
+    display: block;
+    text-align: center;
+    margin: 5px;
+}
+
+#sortmenu {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: center;
+    align-items: center;
+    margin: 15px 2.3% 15px 2.3%;
+    border: 1px solid var(--primary-color);
+}
+
+#sortmenu .sorter {
+    width: 50%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
diff --git a/client/style/map.css b/client/style/map.css
index e64a4cd..3d9dd1f 100644
--- a/client/style/map.css
+++ b/client/style/map.css
@@ -15,3 +15,122 @@ main {
     position: relative;
     height:100%;
 }
+
+/* Describes the styling of all <article> elements */
+article {
+    color: var(--light-text-color);
+    border: none;
+    display: block;
+    width: 100%;
+    position: relative;
+}
+
+/* Describes the styling of all elements with class="parkname", note the . in front of parkname */
+.parkname {
+    background-color: white;
+    color: black;
+    font-size: 1rem;
+    font-weight: bold;
+    text-transform: none;
+    display: block;
+    height: auto;
+}
+
+/* Describes the styling of all elements with class="parkname", note the . in front of parkname */
+.parkdescription {
+    font-size: 1rem;
+    text-align: left;
+    height: 30px;
+    margin: 15px 15px 0 15px;
+}
+
+.order {
+    padding-top: 25px;
+    text-align:center;
+}
+
+.prices {
+    margin-bottom: 15px;
+    margin-left: 15px;
+    margin-right: 15px;
+    font-size: 0.9rem;
+}
+
+.total {
+    margin: 10px;
+    font-size: 0.9rem;
+}
+
+.adultinput {
+    width:100%;
+}
+
+.kidsinput {
+    width:100%;
+}
+
+.orderbutton {
+  background: hsl(170deg 0% 64%);
+  border-radius: 12px;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  outline-offset: 4px;
+  margin: 20px;
+}
+
+.front {
+  font-size: 1rem;
+  padding: 6px 15px;
+
+  padding: 10px 9px;
+  font-size: 1.2rem;
+
+  display: block;
+  border-radius: 12px;
+  background: var(--primary-color);
+  color: white;
+  transform: translateY(-4px);
+  transition:
+      transform 600ms
+      cubic-bezier(.3, .7, .4, 1);
+}
+
+.disabled {
+  display: block;
+  border-radius: 12px;
+  background: grey;
+  color: white;
+  transform: translateY(-2px);
+  padding: 10px 9px;
+  font-size: 1.2rem;
+}
+
+.orderbutton:hover .front {
+    transform: translateY(-6px);
+    transition:
+        transform
+        250ms
+        cubic-bezier(.3, .7, .4, 1.5);
+}
+
+
+.orderbutton:active .front {
+  transform: translateY(-2px);
+}
+
+.orderbutton:active .disabled {
+  transform: translateY(-2px);
+}
+
+.orderbutton:hover .disabled {
+    transform: translateY(-2px);
+}
+
+
+
+
+.cancel .front {
+    font-size: 1rem;
+    padding: 6px 15px;
+}