#homepage-main, .hp-row {
  width: 100%;
  padding-top: 20px;
  margin: 0;
  font-family: 'Source Sans Pro';
}

.hp-row-left-large, .hp-row-right-large, .content-small {
  position: relative;
  cursor: pointer;
}

.hp-row-left-large, .hp-row-right-large {
  width: 50%;
  max-width: 50%;
  height: 50vh;
  float: left;
  box-sizing: border-box;
  min-height: 364px;
}

.content-small {
    min-height: 182px;
}

.hp-row-left-small, .l3 {
    clear: both;
}


.hp-row-left-large.l1 {background: url('//cdn2.webdamdb.com/1280_FF5s7r1uxl8a.jpg?1492634122') no-repeat; background-size: cover;}
.hp-row-right-large.l2 {background: url('//cdn2.webdamdb.com/1280_JckyP0tPW8Hd.jpg?1492632837') no-repeat; background-size: cover;}
.hp-row-left-large.l3 {background: url('//cdn2.webdamdb.com/1280_X90vPHRaK0ps.jpg?1492705690') no-repeat ; background-size: cover;}
.content-small.s1 {background: url('//cdn2.webdamdb.com/1280_bV2BRWdqoA3U.jpg?1492796489') no-repeat; background-size: cover;}
.content-small.s2 {background: url('//cdn2.webdamdb.com/1280_0dvig53Yc0aM.png?1461352191') no-repeat 0 -150px; background-size: cover; background-position: bottom;}
.content-small.s3 {background: url('//cdn2.webdamdb.com/1280_I1HzSKDOXiSj.png?1492800524') no-repeat 0 0; background-size: cover; background-position: bottom;}
.content-small.s4 {background: url('//cdn2.webdamdb.com/1280_gdGnvStGErL4.jpg?1461177696') no-repeat; background-size: cover;}
.content-small.s5 {background: url('//cdn2.webdamdb.com/1280_0zvYcftBPqJK.png?-62169955200') no-repeat; background-size: cover;}
.content-small.s6 {background: url('//cdn2.webdamdb.com/1280_IxqEzN0NeXHy.jpg?1461189105') no-repeat 0 -150px; background-size: cover; background-position: bottom;}

.hp-row-right-large {
  float: right;
}

.hp-row-right-large, .hp-row-left-large, .content-small {
  box-sizing: border-box;
  border: 3px solid white;
  position: relative;
}

.hp-row-left-large:before, .hp-row-right-large:before, .content-small:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(to top, rgba(0,0,0,0.75) 50%,rgba(0,0,0,0) 100%);
  opacity: .6; 
  }


.hp-row-right-small, .hp-row-left-small {
  width: 50%;
  max-width: 50%;
  background-color: #75787b;
  height: 50vh;
  float: left;
}

.hp-row-left-small {
  float: left;
}

.content-small {
  width: 100%;
  height: 50%;
  box-sizing: border-box;
}

.story-title {
  position: absolute;
  bottom: -15px;
  color: white;
  left: 5%;
  width: 75%;
}

.story-title > h1 {
  font-size: 1.75em;
  font-weight: 200;
  color: white;
}

.story-title-desc > p {
    margin-top: 0;
}

.story-title .story-title-desc {
  margin-left: 15px;
  opacity: 0;
}


/*.story-title {
  position: absolute;
  bottom: 40px;
  color: white;
  left: 5%;
  width: 50%;
}*/

.story-title .story-title-desc a {
  text-decoration: none;
  color: white;
  margin-top: 5px;
  display: inline-block;
  font-size: 1em;
}

.story-title .story-title-desc a:hover {
  color: #da291c;
}

.story-title .story-title-desc a:before {
  font-family: FontAwesome;
  content: "\f0da";
  color: #da291c;
  margin-right: 2px
}

.second {
  background: url(../img/bg2.jpg) no-repeat 0 -50px;
  background-size: cover;
}

.third {
  background: url('../img/bg3.jpg') no-repeat 0 -100px;
  background-size: cover;
}

.green{background-color: green;}

.yellow{background-color: yellow;}

@media only screen and (max-width: 1080px){
    .story-title > h1 {
      font-size: 1.5em;
    }
}

@media only screen and (max-width: 860px){
    .story-title .story-title-desc {
      opacity: 1;
    }

    .story-title {
      position: absolute;
      bottom: 5px;
      color: white;
      left: 5%;
      width: 75%;
    }
}

@media only screen and (max-width: 768px) {
    .hp-row {
        padding: 0;
    }

    .hp-row-left-large , .hp-row-right-large, .hp-row-left-small, .hp-row-right-small {
        width: 100%;
        max-width: 100%;
        float: none;
    }
    .content-small {
        float: none;
    }

    .hp-row-right-small, .hp-row-left-small {
        height: initial;
    }

    .story-title > h1 {
      font-size: 1.25em;
    }
}