How to make WordPress Twenty Fourteen theme full width

Whilst refreshing a client’s WordPress site, I felt the WordPress Twenty Fourteen theme had too much white space. As with many things in our connected world, I was not the first and someone already had a solution.

A fairly simple process:

1. Locate the theme style.css (in the wp-content/themes/twentyfourteen folder) file and look for the following code and modify the max width to 100% instead 1260px.
   
   .site {
   background-color: #fff;
   max-width: 1260px;
   position: relative;
   }
   
   
2. Find the following piece of code and again modify the max-width to 100% instead 1260px.
   
   .site-header {
   background-color: #000;
   max-width: 1260px;
   position: relative;
   width: 100%;
   z-index: 4;
   }