.hovereffect {
  width:100%;
  height:100%;
  float:left;
  overflow:hidden;
  position:relative;
  text-align:center;
  cursor:default;
}

.hovereffect .overlay {
  width:100%;
  height:100%;
  position:absolute;
  overflow:hidden;
  top:0;
  left:0;
  opacity:0;
  background-color:rgba(0,0,0,0.8);
  -webkit-transition:all .4s ease-in-out;
  transition:all .4s ease-in-out
}

.hovereffect img {
  display:block;
  position:relative;
  -webkit-transition:all .4s linear;
  transition:all .4s linear;
  width:100%;
}

.hovereffect h2 {
  color:#e4f2f9;
  text-align:center;
  position:relative;
  font-size:17px;
  background:rgba(42, 58, 66, 0.88);
  -webkit-transform:translatey(-100px);
  -ms-transform:translatey(-100px);
  transform:translatey(-100px);
  -webkit-transition:all .2s ease-in-out;
  transition:all .2s ease-in-out;
  padding:20px;
}

.info {
  display: inline-block;
  text-decoration: none;
  color: #e7f2f9;
  border: 1px solid #83848c;
  margin: 3% 0 0 0;
  background-color: transparent;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transform: scale(1.5);
  -ms-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  font-weight: normal;
  height: 70%;
  width: 80%;
}

.hovereffect:hover img {
  -ms-transform:scale(1.1);
  -webkit-transform:scale(1.1);
  transform:scale(1.1);
}

.hovereffect:hover .overlay {
  opacity:1;
  filter:alpha(opacity=100);
}

.hovereffect:hover h2,.hovereffect:hover div.info {
  opacity:1;
  filter:alpha(opacity=100);
  -ms-transform:translatey(0);
  -webkit-transform:translatey(0);
  transform:translatey(0);
}

.hovereffect:hover div.info {
  -webkit-transition-delay:.2s;
  transition-delay:.2s;
}

.btn-custom{
  left: 0;
  width: 100%;
  color: #74a0b9;
  background-color: transparent;
  background-image: none;
  border-color: #74a0b9;
}

.btn-custom:hover {
  color: #fff;
  background-color: #74a0b9;
}

.social-icon:hover {
  color: #c16161;
}
