Feat: Change parallax image and favicon, change button styles

Author: juanvisbal

css/style.css

@@ -55,7 +55,7 @@ p {
 /*--- Buttons ---*/
 .btn {
   border: 0;
-  border-radius: 30px;
+  border-radius: 5px;
   box-shadow: none;
   display: inline-block;
   font-size: 1em;
@@ -67,8 +67,7 @@ p {
 
 .btn--header {
   background-color: white;
-  background-color: rgba(255,255,255,0.2);
-  color: white;
+  color: #000;
 }
 
 .btn--header:hover {
@@ -77,7 +76,7 @@ p {
 }
 
 .btn--resume {
-  background-color: #048456;
+  background-color: #01ab6d;
   color: white;
   font-size: 1em;
 }
@@ -98,6 +97,7 @@ p {
   background-color: #ddd;
 }
 
+
 /*--- Helpers ---*/
 .uppercase {
   text-transform: uppercase;
@@ -129,16 +129,15 @@ p {
   padding-left: 20px;
 }
 
-
 .l6 {
   width: 50%;
 }
 
-/*--- Index - Header ---*/
 
+/*--- Index - Header ---*/
 .parallax-container {
-  color: white;
-  color: rgba(255,255,255,.9);
+  /*color: white;
+  color: rgba(255,255,255,.9);*/
   height: 100vh;
   margin: 0;
   padding: 0 !important;
@@ -161,16 +160,16 @@ p {
 }
 
 .header-container {
-  padding-left: 10px;
-  padding-right: 10px;
+  padding-left: 50px;
+  padding-right: 50px;
   position: absolute;
-  text-align: center;
-  top: 50%;
+  /*text-align: center;*/
+  top: 50px;
   -webkit-transition: all .2s;
   transition: all .2s;
-  -webkit-transform: translateY(-50%);
+  /*-webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
-  transform: translateY(-50%);
+  transform: translateY(-50%);*/
   width: 100%;
   z-index: 1;
 }
@@ -260,6 +259,29 @@ p {
   filter: opacity(.75);
 }
 
+@media (max-width: 470px) {
+  .skill {
+    /* width: 100%; */
+    padding-top: 0;
+    position: static !important;
+  }
+  .skill  .devicons {
+    display: none;
+  }
+
+  .skill .fab {
+    display: none;
+  }
+
+  .skill--with-img .icon {
+    display: none;
+  }
+
+  .portfolio__item p {
+    font-size: 12px;
+  }
+}
+
 /*--- Index - Portfolio ---*/
 .portfolio__item {
   text-align: center;
@@ -334,6 +356,13 @@ p {
   .mobile-hidden {
     display: none;
   }
+
+  .header-container {
+    top: 20%;
+    -webkit-transform: none;
+    -ms-transform: none;
+    transform: none;
+  }
 }
 
 @media only screen and (max-width : 479px) {

es.html

@@ -49,7 +49,7 @@ <h4>About me</h4>
 
   <hr />
 
-  <!--My Skills-->
+  <!-- My Skills -->
   <section class="section container">
     <h4>Skills</h4>