make guest page layout look clean

1 files changed, 32 insertions, 5 deletions

diff --git a/styles.css b/styles.css
index cd2742d..c211ef2 100755
--- a/styles.css
+++ b/styles.css
@@ -68,11 +68,12 @@ section:nth-child(odd) {
 
 .title, .title-info-flex, .edges{
     text-align: left;
-    padding: 0 12rem;
+    padding: 0 5rem;
 }
 
 .title {
     color: var(--accent-color);
+    margin-bottom: 2rem;
 }
 
 h2 {
@@ -965,21 +966,26 @@ weekly specials conic border
     height: 100%;
 }
 
-.guest-name, .guest-role {
+.guest-name {
     color: var(--accent-color);
 }
 
-.guest-email {
+.guest-role {
     color: var(--second-accent-color);
 }
 
+.guest-email {
+    
+    color: #857ce1;
+}
+
 .flex-grid-2 {
     display: flex;
     justify-content: space-between;
     vertical-align: top;
 }
 .flex-grid-2 .guest {
-    width: 45%;
+    width: 80%;
     vertical-align: top;
 }
 
@@ -993,9 +999,30 @@ weekly specials conic border
 }
 
 .guest {
-    margin: 2rem 0;
+    margin: 2rem 0 auto 0;
     height: auto;
     display: flex;
     flex-direction: column;
     justify-content: center;
+}
+
+.guest-info {
+    display: flex;
+    vertical-align: top;
+    width: 100%;
+    margin-right: 6%;
+    margin-bottom: 2rem;
+}
+
+.guest-photo {
+    margin-right: 1rem;
+    width: 100px;
+    min-height: 100px;
+    max-height: auto;
+    margin-top: 35px;
+}
+
+img {
+    max-width: 100%;
+    height: auto;
 }
\ No newline at end of file