diff --git a/build/css/styles.css b/build/css/styles.css
index 68a79a569..3e0178295 100644
--- a/build/css/styles.css
+++ b/build/css/styles.css
@@ -1,44 +1,133 @@
@include foundation-everything;
+@import url('https://fonts.googleapis.com/css?family=Frijole|Roboto|Salsa');
-main {
- background: lightblue;
-}
+body {
+ /*background: #24303C;*/
+ font-family: 'Roboto', sans-serif;
+ background: #24303C; /* fallback for old browsers */
+ background: -webkit-linear-gradient(to right, #24303C, #577592); /* Chrome 10-25, Safari 5.1-6 */
+ background: linear-gradient(to right, #24303C, #577592); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+}
header {
- background-color: lightgreen;
- padding: 0.5rem;
+ padding: 0.5rem;
+}
+
+h1 a {
+ text-decoration: none;
+ font-family: 'Frijole', cursive;
+ color: white;
+}
+
+h1 a:hover {
+ color: white;
}
#completed-checkbox {
- display: inline;
+ display: inline;
}
label {
- display: inline;
+ display: inline;
}
button.success {
- margin-right: 1.2rem;
- display: inline;
+ margin-right: 1.2rem;
+ display: inline;
}
aside.create-tasklist {
- background-color: navy;
- color: #FFFFFF;
+ background-color: navy;
+ color: #FFFFFF;
}
aside label {
- color: #FFFFFF;
+ color: #FFFFFF;
}
.completed {
- text-decoration: line-through;
+ text-decoration: line-through;
}
div {
- display: inline;
+ display: inline;
+}
+
+main {
+ padding: 1%;
+}
+
+#movie-list li {
+ text-align: center;
+ list-style-type: none;
+ /*border: solid 1px black;*/
+ height: 500px;
+ overflow: scroll;
+ background: #58cdb5;
+}
+
+#movie-list li:nth-child(5n + 1) {
+ background: #75d6c1;
+}
+
+#movie-list li:nth-child(5n + 2) {
+ background: #1ABB99;
+}
+
+#movie-list li:nth-child(5n + 3) {
+ background: #138c72;
+}
+
+#movie-list li:nth-child(5n + 4) {
+ background: #19b695;
}
-/*
-* {
- border-style: solid;
+
+#movie-list {
+ margin: 0;
+ padding: 0;
+}
+
+
+#movie-list .movie-title{
+ height: 115px;
+ overflow: scroll;
+ /*overflow: hidden;*/
+ font-family: 'Frijole', cursive;
+}
+
+#movie-list .movie_image_details h4{
+ color: #24303C;
+ font-family: 'Salsa', cursive;
+}
+
+#movie-list img {
+ border-radius: 5px;
+}
+
+.movie_image_details img:hover {
+ box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+}
+
+.movie_image_details {
+ cursor: pointer;
+}
+
+#rental-creation h2, #rental-creation label{
+ font-family: 'Frijole', cursive;
+ color: white;
+}
+
+.button {
+ border-radius: 5px;
+ border: solid white 1px;
+ background: #24303C;
+ margin-right: 1%;
+ font-family: 'Salsa', cursive;
+}
+
+.button:hover {
+ background: #577592;
+}
+
+#messages {
+ color: white;
}
-*/
diff --git a/build/images/favicon.ico b/build/images/favicon.ico
new file mode 100644
index 000000000..cf4d529ff
Binary files /dev/null and b/build/images/favicon.ico differ
diff --git a/build/index.html b/build/index.html
index 03869595f..e73f41596 100644
--- a/build/index.html
+++ b/build/index.html
@@ -1,15 +1,94 @@
-
+
- Backbone Baseline
-
-
+
+ Spicy Flix
+
+
+
+
-
+
+
+
+
+
+
+
+
+
+
+
-
-
+
+
+
+
+
+