Cacher is the code snippet organizer for pro developers

<!-- HTML -->
<div class="container">
<div class="row">
<div class="col-sm-4 styles dblhung">
<a class="fdblue" href="#">
<h2>Double Hung</h2>
</a>
</div>
<div class="col-sm-4 styles slider">
<a class="fdblue" href="#">
<h2>Slider</h2>
</a>
</div>
<div class="col-sm-4 styles casement">
<a class="fdblue" href="#">
<h2>Casement</h2>
</a>
</div>
</div>
<div class="row">
<div class="col-sm-6 patio styles">
<a class="fdblue" href="#">
<h2>Patio Doors</h2>
</a>
</div>

<div class="col-sm-6 baybow styles">
<a class="fdblue" href="#">
<h2>Bay & Bow</h2>
</a>
</div>
</div>
</div>

/* CSS */
.dblhung { background-image: url("https://ywpadmin.com/imageserver/UserMedia/YWPGALLERY/Okna/doublehung.jpg");  }
.slider { background-image: url("https://ywpadmin.com/imageserver/UserMedia/YWPGALLERY/Okna/slider.jpg");}
.casement { background-image: url("https://ywpadmin.com/imageserver/UserMedia/YWPGALLERY/Okna/casement.jpg");}
.patio { background-image: url("https://ywpadmin.com/imageserver/UserMedia/YWPGALLERY/Okna/patiodoor.jpg");}
.baybow { background-image:url("https://ywpadmin.com/imageserver/UserMedia/YWPGALLERY/Okna/baybow.jpg");}
.fdblue { 
  display : block;
  padding:2em 0;
  width:100%;
  height:100%;
  cursor: pointer;
  color:#fff;
  text-decoration:none !important;
  transition-timing-function: ease-in-out;
  transition-duration: .7s;
}
.styles {
  background-color:#000000;
  border-top: 3px solid #ffffff;
  border-right: 3px solid #ffffff;
  padding:4.5em;
  text-align: center;
  height: 40vh;
  transition-timing-function: ease-in-out;
  transition-delay: .1s;
  transition-duration: .7s;
}
.dblhung, .slider, .casement, .patio, .baybow {
  background-color: rgba(54, 57, 66, .8);
  background-blend-mode: multiply;
  background-attachment: relative;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  color:#ffffff;
  text-transform: uppercase;
  text-decoration:none !important;
}
.styles:hover,
.styles:active,
.styles:focus,
.styles.hover {
  background-color: rgba(255, 255, 255, .6);
  background-blend-mode: screen;
}
.styles:hover .fdblue {
  color:#0067B1;
  text-shadow: 0px 0px 14px rgba(206,89,55,0.53);
}