Front End Lab 4

INFO-1252 (Front End Dev)/Labs/Lab-4/styles/styles.css

@@ -1,12 +1,12 @@
 /* Beginner elements */
 * {
-    font-size: 62.5%;
-    padding: 0;
     margin: 0;
 }
 
 body {
     background: url(../images/squares_bg.png);
+    font-family: Helvetica, sans-serif;
+    font-size: 1rem;
 }
 
 /* Header and logo */
@@ -20,13 +20,13 @@ h1,
 h2 {
     font-family: "Dancing Script", cursive;
     color: teal;
-    font-size: 3rem;
+    font-size: 2rem;
     text-shadow: 2px 2px 4px grey;
-    margin: 2rem auto;
+    margin-left: 1.2rem;
 }
 
 .main-heading {
-    font-size: 4rem;
+    font-size: 2.2rem;
     text-align: center;
 }
 
@@ -38,8 +38,9 @@ nav {
     margin: 2rem 0;
 }
 
+ul,
 a {
-    font-size: 2rem;
+    font-size: 1rem;
     text-decoration: none;
     list-style: none;
     display: block;
@@ -53,8 +54,7 @@ a {
 /* Recipe card styling */
 .recipe-card {
     margin: 2rem 1rem;
-    font-size: 3rem;
+    font-size: 1rem;
-    font-family: Helvetica, sans-serif;
     border: 2px solid grey;
     background-color: white;
     border-radius: 5px;
@@ -71,32 +71,56 @@ a {
     text-align: left;
     line-height: 25px;
     margin: 2rem;
+    color: grey;
+    font-weight: bold;
+    font-family: Helvetica, sans-serif;
 }
 
 .author {
     text-align: right;
+    margin-right: 1rem;
+    color: grey;
 }
 
 .publish-date {
     text-align: right;
+    color: rgba(75, 75, 75, 0.507);
+    margin-right: 1rem;
 }
 
 /* About section styling */
 .about-sandy {
     background-color: grey;
     background-image: url(../images/squares_bg.png);
+    padding-bottom: 1rem;
+    margin-bottom: 0.3rem;
+}
+
+.about-sandy p {
+    text-align: left;
+    line-height: 1.6rem;
+    margin: 2rem;
+    color: lightgrey;
+    font-weight: bold;
+}
+
+.about-sandy h2 {
+    color: white;
+    font-size: 3rem;
+    text-shadow: 2px 2px 4px black;
 }
 
 /* Footer styling */
 footer {
     background: teal;
-    border-top: 2px solid white;
+    font-size: 1rem;
-    font-size: 2rem;
     color: lightgrey;
-    margin: 2rem auto;
+    padding: 2rem;
+    text-align: center;
+    line-height: 1.6;
 }
 
+
 footer strong {
     color: white;
-    font-size: 2rem;
 }