diff --git a/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/css/style.css b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/css/style.css
index 641c131..5ea82dc 100644
--- a/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/css/style.css
+++ b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/css/style.css
@@ -1,7 +1,12 @@
 @import url('https://fonts.googleapis.com/css2?family=Open+Sans&family=Poppins:wght@400;700&display=swap');
 
+:root {
+    font-size: 16px;
+    --site-color: hsl(257, 40%, 49%);
+}
+
 body {
-    background-color: hsl(257, 40%, 49%);
+    background-color: var(--site-color);
     background-image: url("../images/bg-desktop.svg");
     /* background-repeat: no-repeat;
     background-size: contain; */
@@ -12,7 +17,8 @@ body {
 
 h1 {
     font-family: 'Poppins', sans-serif;
-    font-weight: 400;
+    font-weight: 400; /* 400 & 40 are very close*/
+    font-size: 40px;
 }
 
 body {
@@ -21,48 +27,74 @@ body {
 
 .logo {
     width: 215px;
-    margin: 3.3125rem 4.4rem 0rem;
+    margin: 3.75% 4.86% 0rem; /* 3.75% 4.375rem 0rem*/
 }
 
 .middleSection {
     display: flex;
-    margin: 5.0625rem 4.6rem 0rem 4.55rem;
+    margin: 5.0625rem 0rem 0rem 4.55rem;
 }
 
 .siteBlurb {
-    margin: 3rem;
+    margin: 1.0625rem 4rem 2rem 3.325rem;
+
     /* line-height: 2rem;
     font-weight: 400; */
 }
 
 .siteBlurb h1 {
     margin-right: 2em;
+    margin-bottom: 0;
 }
 
-/* .siteBlurb p {
-    line-height: 1.5rem;
-} */
+.siteBlurb p {
+    margin-right: 1.5rem;
+    margin-bottom: 1.5625rem;
+    line-height: 1.7rem;
+    font-size: 18px;
+    font-weight: 400;
+}
+
+.registerButton {
+    background-color: white;
+    color: var(--site-color);
+    font-size: 19px;
+    border: none;
+    padding: 17px 64px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    /* margin: 4px 2px; */
+    cursor: pointer;
+    border-radius: 32px;
+    box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.4); /* 10px 5px 10px*/
+}
 
 .socialButtonsSection {
     display: block;
     text-align: right;
+    margin-right: 5.1875rem;
 }
 
 .socialButtonsSection i {
-    padding: 0.5em;
-    margin-left: 0.5em;
-    margin-top: 1em;
+    padding: 0.5rem;
+    margin-left: 0.5rem;
+    margin-top: 0.9375rem;
+    margin-right: 0;
 }
 
 .circleIcon {
+    magin: 0;
+    color: white;
     background: transparent;
-    border: 1px solid #fff;
-    width: 16px;
-    height: 16px;
+    border: 1.75px solid #fff;
+    width: 20px;
+    height: 20px;
     border-radius: 50%;
     text-align: center;
-    line-height: 16px;
+    line-height: 20px;
     vertical-align: middle;
+    font-size: 19px;
     /* padding: 5px; */
 
     /* border: 2px solid #fff;
@@ -74,6 +106,10 @@ body {
     color: transparent; */
 }
 
+.circleIcon:hover {
+    color: blue;
+}
+
 .attribution { font-size: 11px; text-align: center; }
 .attribution a { color: hsl(228, 45%, 44%); }
 
diff --git a/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/index.html b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/index.html
index 4f42932..2847159 100644
--- a/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/index.html
+++ b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/index.html
@@ -34,9 +34,9 @@
   </div>
 
   <div class="socialButtonsSection">
-    <i class="fab fa-facebook-f circleIcon"></i>
-    <i class="fab fa-twitter circleIcon"></i>
-    <i class="fab fa-instagram circleIcon"></i>
+    <a href="#"><i class="fab fa-facebook-f fa-lg circleIcon"></i></a>
+    <a href="#"><i class="fab fa-twitter fa-lg circleIcon"></i></a>
+    <a href="#"><i class="fab fa-instagram fa-lg circleIcon"></i></a>
   </div>
   <footer>
     <p class="attribution">
diff --git a/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/img-diff-2-desktop-near-enough.png b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/img-diff-2-desktop-near-enough.png
new file mode 100644
index 0000000..20633a3
Binary files /dev/null and b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/img-diff-2-desktop-near-enough.png differ
diff --git a/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/myProcess.md b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/myProcess.md
index e5ddd96..b5d33b3 100644
--- a/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/myProcess.md
+++ b/FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/myProcess.md
@@ -32,8 +32,23 @@ next day
     download diffchecker trial rather than keep using website
     adjust size of logo svg
     play with positioning using margin and rem. Logo and mockup images are so close at this point (see image diff 1)
+    ![alt](image-diff-1.png)
     realise I probably should be using % rather than rem for margin positioning
     also should probably be using 0 positioning in body and doing it in each element
+    tweaked logo and mid section margins mixture rem & % for the moment
+    set body to have 0 margin
+    seemingly no changes are made with % unless they are to a pixel, so 4.86 is the same as 4.8611111, need to go to next px % which is 4.7916666667
+    then lots and lots of iterating. Making changes and comparing in diffchecker against the design doc.
+    Spent 2 hours+ on this. Too long.
+    Still haven't quite nailed the blurb section.
+        Basically the logo is slight off
+        the differences between the mockup and symbols are image quality between jpg and png
+        its like a pixel off with the social media buttons
+    img-diff-2-desktop-near-enough.png
+    ![alt](img-diff-2-desktop-near-enough.png)
+
+    Still now on to the mobile variant. Can I nail it better?
+
 
 Things I've not touched so far:
     main section