h3, h4 {
  font-family: 'Josefin Sans';
}

h3 {
  font-size: 50px;
  text-align: center;
}

h4 {
  font-size: 30px;
  margin-top: 30px;
  font-weight: bold;
}

p {
  font-family: 'Josefin Sans', sans-serif;
  font-size: 15px;
}

form {
  font-family: 'Josefin Sans', sans-serif;
}

footer {
  margin-top: 10px;
  margin-left: 10px;
  font-family: 'lato', sans-serif;
}

.container {
  margin-top: 75px;
}

.navbar-nav {
  font-family: 'lato', sans-serif;
}

.navbar-brand {
  font-family: 'Satisfy', cursive;
}

.form-control {
  width: 50%
}

.image img{
  width: 100%;
}

.overlay {
  position: absolute;
  left: 0;
  right: 0;
}

.image-grid {
    height: 100%;
    width: 100%;
    position: absolute;
}
.overlay {
    position: absolute;
    bottom: -100%;
    height : 100%;
    width : 100%;
    background: transparent;
    opacity:.4;
    text-align: center;
    color: white;
    font-size: 25px;
    font-family: 'Josefin Sans';
}

.wrapper {
  height: 300px;
  width: 300px;
  overflow: hidden;
}

.image {
    position: relative;
    overflow:hidden;
}

.image:hover .overlay {
    bottom: 0;
    -webkit-transition: all 1s, -webkit-transform 1s;
    transition: all 1s, transform 1s;
    height:50%;
    opacity:1;
}