Added pictures with text laying over them in home and tutoring page for style purposes.

1 files changed, 39 insertions, 0 deletions

diff --git a/src/components/shared-styles.js b/src/components/shared-styles.js
index 02ea4bf..f75fa9c 100644
--- a/src/components/shared-styles.js
+++ b/src/components/shared-styles.js
@@ -38,6 +38,45 @@ export const SharedStyles = html`
     color: var(--app-dark-text-color);
   }
 
+
+  .img-section {
+    max-width: 100%;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+
+    line-height: 0;
+  }
+
+  .img-section > div {
+    max-width: 100%;
+    width: 100%;
+    margin-bottom: 0;
+  }
+
+  .container > img {
+    width:100%;
+  }
+
+  .container {
+    position: relative;
+    text-align: center;
+    color: white;
+
+    margin-bottom: 0;
+  }
+
+  .centered {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+
+    font-weight: bolder;
+    font-size: 200%;
+    line-height: normal;
+  }
+
   @media (min-width: 460px) {
     h2 {
       font-size: 36px;