/* Based on: http://sixrevisions.com/css/responsive-background-image/ */ 
html, body { 
 height: 100%;
}
/* Reset */ 
html, body, h1, p, a, div, section {
 margin: 0;
 padding: 0;
 font-size: 100%;
 font: inherit;
}
body {
 background-image: url(images/stairs.jpg);
 background-position: center center;
 background-repeat: no-repeat;
 background-attachment: fixed;
 background-size: cover;
 background-color:#464646;
 display: grid;
 grid-template-columns: 1fr 1fr;
 align-items: end;
 min-height: 100vh;
 justify-content: space-between;
 font: 18px/23px "Gruppo", cursive;
 color: #ffffff;
}
h1 {
 color: #ffffff;
 font-size: 100px;
 line-height: 80px;
 font-weight: 400;
 margin:0px;
}
a:link, a:visited, a:hover, a:active {
 color: #ffffff;
}
p {
 font-size: 24px;
 margin: 0px;
}
reference {
 justify-self: end;
}
logo {
 text-align: center;
 justify-self: start;
 margin: 10px
}
/* For mobile devices */ 
@media only screen and (max-width: 767px) {
 body {
  background-image: url(images/stairs-mobile-devices.jpg);
  }
}