.card {
  display: block; 
    margin-bottom: 20px;
    line-height: 1.42857143;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); 
    transition: box-shadow .25s; 
}
.card:hover {
  box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}

.img-card {
  width: 100%;
  height:200px;
  border-top-left-radius:2px;
  border-top-right-radius:2px;
  display:block;
  overflow: hidden;
  position: relative;
}
.img-card img{
  width: 100%;
  height: 200px;
  object-fit:cover;
  transition: all .25s ease;
  
  /* Add the blur effect*/
  filter: blur(8px);
  -webkit-filter: blur(8px);
  
   /* Center and scale the image nicely 
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;*/
} 


.card-content {
  padding:15px;
  text-align:left;
}

.card-title {
  margin-top:0px;
  font-weight: 500;
  font-size: 16px;
}
.card-title a {
  color: #f1f1f1;
  text-decoration: none; !important
  font-size: 16px;
  width: 200px;
}

/* Position text in the middle of the page/image */
.bg-text {
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0, 0.4); /* Black w/opacity/see-through */
  color: white;
  font-weight: bold;
  font-size:16px;
  border: 3px solid #f1f1f1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: 80%;
  padding: 20px;
  text-align: center;
}
.card-read-more {
  border-top: 1px solid #D4D4D4;
}
.card-read-more a {
  text-decoration: none; !important
  padding:10px;
  font-weight:600;
  text-transform: uppercase
}