color of the page changed

contact.html

@@ -19,10 +19,8 @@
   </div>
 
     <article class="contact">
-      <h2>Contact me</h2>
-      <hr>
-
-      <p>[email protected]</p>
+      <h2>Contact</h2>
+      <p class="email">[email protected]</p>
 
       <p class="text-visit">Visit me</p>
       <div class="icons-contact">

index.html

@@ -20,20 +20,20 @@
       <ul class="nav">
         <li><a href="about.html">About me</a></li>
         <li><a href="project.html">Projects</a></li>
-        <li><a href="contact.html">Contact me</a></li>
+        <li><a href="contact.html">Contact</a></li>
       </ul>
 
     </div>
 
     <ul class="nav-small hide">
       <li><a href="about.html">About me</a></li>
       <li><a href="project.html">Projects</a></li>
-      <li><a href="contact.html">Contact me</a></li>
+      <li><a href="contact.html">Contact</a></li>
     </ul>
 
   </header>
 
-  <div class="name-div">
+  <div class=" name-div">
 
     <h2 class="nameSara">Sara <br>
       Damián <br>

styles/_general.scss

@@ -8,12 +8,13 @@
 }
 
 body {
-	background:url(../images/bolaMundo.jpeg); /* Nuestra imagen de fondo */
-	background-repeat:no-repeat; /* Indicamos que no se repetira */
-	background-size:cover; /* Encajamos la imagen al 100% del ancho */
-	background-attachment: fixed; /* Establecemos una posicion fija para la imagen */
+	background:url(../images/bolaMundo.jpeg);
+	background-repeat:no-repeat;
+	background-size:cover;
+	background-attachment: fixed;
 	font-family:helvetica, arial, sans-serif;
   color: $primary-font-color;
   font-family: sans-serif;
-  height: 100vh;
+	width: 100%;
+	height: 100vh;
 }

styles/_settings.scss

@@ -1,6 +1,7 @@
-$border-color: grey;
-$light-color: white;
-$primary-font-color: #0A6A42;
+$border-color: white;
+$primary-font-color: white;
 $secundary-font-color: #BAF4DB;
-$primary-background-color: #BAF4DB; 
+$primary-background-color: #6b8565;
+$font-shadow-color:rgba(0, 0, 0, 0.25);
 $max-screen-size-tablet: 768px;
+$max-screen-size-laptop: 1024px;

styles/_typography.scss

@@ -2,28 +2,20 @@
 .nameSara{
 font-size: 2.4em;
 line-height: 1;
-color: $secundary-font-color;
-margin-top: 150px;
+color: $primary-font-color;
 text-shadow: 2px 2px;
 text-shadow: 1px 1px 2px black, 0 0 25px #40A279, 0 0 5px #2C835F;
 }
 @media (min-width:$max-screen-size-tablet) {
   .nameSara{
   font-size: 3em;
-  margin-top: 150px;
   }
 }
 
 .tag-name{
-color: $secundary-font-color;
+color: $primary-font-color;
 font-size: 1.2em;
 padding: 10px 0;
-margin-bottom: 150px;
-}
-@media (min-width:$max-screen-size-tablet) {
-  .tag-name{
-  margin-bottom: 130px;
-  }
 }
 
 article h2 {

styles/components/_nav.scss

@@ -25,7 +25,7 @@
 .nav-small a {
   text-decoration: none;
   text-transform: uppercase;
-  color: #1B6A49;
+  color: $primary-font-color;
   width: 100%;
   display: block;
   padding-top: 16px;

styles/layout/_footer.scss

@@ -13,7 +13,7 @@ justify-content: center;
 }
 
 .text-footer {
-  color: $light-color;
+  color: $primary-font-color;
   padding: 2%;
 }
 

styles/layout/_main.scss

@@ -5,7 +5,7 @@ article {
 	background-color: $primary-background-color;
 	padding:20px;
 	color:$primary-font-color;
-	box-shadow:0 5px 5px 3px rgba(0, 0, 0, 0.25);
+	box-shadow:0 5px 5px 3px $font-shadow-color;
 	border-radius: 10px;
 	margin-left: auto;
 	margin-right: auto;
@@ -22,6 +22,10 @@ article {
 	max-width:800px;
 	margin-left: auto;
 	margin-right: auto;
+  display: flex;
+  flex-direction: column;
+  height: 75vh;
+  justify-content: center;
 }
 
 .about-me{