Full screen image size calculated differently (home page).

Added some images which could be used for header background in about page.
Removed classes and data- attributes no longer needed from header images.

Author: Tomasz-Kluczkowski

_pages/03_events.html

@@ -4,7 +4,7 @@
 permalink: /events/
 ---
 <section class="events-page">
-    <div class="events-page__background-img-container" data-image-type="responsive">
+    <div class="events-page__background-img-container">
         <picture>
             <source srcset="../static/images/events_page/events_page_top_480x150px.jpg 480w,
                             ../static/images/events_page/events_page_top_960x300px.jpg 960w,
@@ -17,8 +17,7 @@
                     sizes="100vw">
             <img class=""
                  src="../static/images/events_page/events_page_top_960x300px.jpg"
-                 alt="Events"
-                 data-overlay="linear-gradient(180deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.65) 100%)">
+                 alt="Events">
         </picture>
         <div class="events-page__title-container row container-fluid">
             <div class="col-sm-12">

_pages/04_contact.html

@@ -4,7 +4,7 @@
 permalink: /contact/
 ---
 <section class="contact">
-    <div class="contact__background-img-container" data-image-type="responsive">
+    <div class="contact__background-img-container">
         <picture>
             <source srcset="../static/images/contact/contact_top_450x150px.jpg 450w,
                             ../static/images/contact/contact_top_960x300px.jpg 960w,
@@ -17,8 +17,7 @@
                     sizes="100vw">
             <img class=""
                  src="../static/images/contact/contact_top_960x300px.jpg"
-                 alt="Contact Us"
-                 data-overlay="linear-gradient(180deg, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.75) 100%)">
+                 alt="Contact Us">
         </picture>
         <div class="contact__page-title-container row container-fluid">
             <div class="col-sm-12">

_sass/style.scss

@@ -41,6 +41,7 @@ a {
 .page__background-img-container {
   position: relative;
   &::after {
+    width: 100vw;
     content: "";
     position: absolute;
     top: 0;
@@ -100,11 +101,15 @@ a {
 }
 
 .navigation__brand {
+  position: relative;
   background-color: rgba(0, 0, 0, 0.2);
   border: rgba(0, 0, 0, 0.2) 1px solid;
   border-radius: 6px;
 }
 
+.navigation__brand-link {
+}
+
 .navigation__brand-name {
   font-size: 0.8em;
   color: $brand-name;

_sass/typography.scss

@@ -115,7 +115,7 @@
 
 .event-label {
   font-family: 'Encode Sans Expanded', sans-serif;
-  background: linear-gradient(45deg, $grey, $grey 80%, transparent 80%,  transparent 100%);
+  background-image: linear-gradient(45deg, $grey, $grey 80%, transparent 80%,  transparent 100%);
   font-size: 1.25em;
   text-align: left;
   color: $title-dark;