diff --git a/css/styles.css b/css/styles.css
index 1cd6f5a..3af139c 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1,11 +1,39 @@
-* {
+body {
+ margin: 0;
+}
+.main-header {
background-color: #1F2937;
}
+.main-body {
+ margin: 75px 0px;
+ color: #F9FAF8;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+}
+
h1, h2, a {
font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
color: #F9FAF8;
font-size: 38px;
}
+.main-body h1, .main-body h2, .main-body a {
+ font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+ color: black;
+ font-size: 38px;
+}
+
+.photos div p {
+ color: black;
+}
+
+.photos div p a {
+ color: #1F2937;
+ text-decoration: underline;
+}
+
+
a {
text-decoration: none;
@@ -15,6 +43,16 @@ h2 {
font-size: 30px;
}
+.right-subheader p a, p {
+ font-size: 15px;
+ color: #F9FAF8;
+}
+
+.right-subheader p a {
+ text-decoration: underline;
+}
+
+
.header {
display: flex;
justify-content: space-between;
@@ -49,4 +87,77 @@ h2 {
.right-subheader{
margin-right: 100px;
-}
\ No newline at end of file
+}
+
+.main-body .photos img {
+ height: 200px;
+ width: auto;
+}
+.main-body .photos p a {
+ font-size: small;
+}
+
+.photos {
+ display: flex;
+ gap: 30px;
+}
+
+.quote {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background-color: #E5E7EB;
+ padding: 100px 0px;
+}
+
+.quote em {
+ font-size: 36px;
+ color: #232b36;
+}
+
+.quote h1 {
+ margin-left: 200px;
+ color: #1F2937;
+ font-size: 30px;
+}
+
+.subscription {
+ background-color: #F9FAF8;
+ display: flex;
+ justify-content: center;
+ padding: 80px 0px;
+}
+
+.sub-box {
+ background-color: #3882f6 ;
+ height: 150px;
+ width: 70%;
+ border-radius: 25px;
+ display: flex;
+ justify-content: space-evenly;
+ align-items: center;
+}
+
+.sub-box h1 {
+ font-size: 30px;
+ font-weight: 400;
+}
+
+.donation-outer {
+ background-color: white;
+ border-radius: 25px;
+ padding: 10px;
+ height: 30px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.donation-inner {
+ background-color: #3882f6;
+ border-radius: 25px;
+ height: 25px;
+}
+.donation-inner h2 {
+ font-size: 10px;
+}
diff --git a/images/chandler-cruttenden-w-AAV86xQN0-unsplash.jpg b/images/chandler-cruttenden-w-AAV86xQN0-unsplash.jpg
new file mode 100644
index 0000000..8ad9437
Binary files /dev/null and b/images/chandler-cruttenden-w-AAV86xQN0-unsplash.jpg differ
diff --git a/images/joshua-j-cotten-O4k8wcUV964-unsplash.jpg b/images/joshua-j-cotten-O4k8wcUV964-unsplash.jpg
new file mode 100644
index 0000000..6cc464a
Binary files /dev/null and b/images/joshua-j-cotten-O4k8wcUV964-unsplash.jpg differ
diff --git a/images/pexels-michael-m-2278163.jpg b/images/pexels-michael-m-2278163.jpg
new file mode 100644
index 0000000..6d9024b
Binary files /dev/null and b/images/pexels-michael-m-2278163.jpg differ
diff --git a/index.html b/index.html
index 0558974..d24ab2c 100644
--- a/index.html
+++ b/index.html
@@ -8,23 +8,61 @@
Floppa
- 
+ 
+ 
+ 
+