@charset "utf-8"

.wrapper {
  display: block;
  width: 100%
  margin: 0;
}

.wrapper:after {
    content:"";
    display:table;
    clear:both;
}

.ripplelink {
  display: block;
  float: left;
/*  width: 49.6%; */
/*  height: 10em; */
  line-height: 10em;
  text-align: center;
  color: #fff;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  z-index: 88;
}

.ripplelink:hover {
  z-index: 8;
/*  box-shadow: rgba(0, 0, 0, 0.3) 0 16px 16px 0; */
/*  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 16px 16px 0; */
/*  -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 16px 16px 0; */
}

.ink {
  display: block;
  position: absolute;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 100%;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}

.animate {
  -webkit-animation: ripple 0.65s linear;
  -moz-animation: ripple 0.65s linear;
  -ms-animation: ripple 0.65s linear;
  -o-animation: ripple 0.65s linear;
  animation: ripple 0.65s linear;
}
 @-webkit-keyframes 
ripple {  100% {
opacity: 0;
-webkit-transform: scale(.5);
}
}
@-moz-keyframes 
ripple {  100% {
opacity: 0;
-moz-transform: scale(.5);
}
}
@-o-keyframes 
ripple {  100% {
opacity: 0;
-o-transform: scale(.5);
}
}
@keyframes 
ripple {  100% {
opacity: 0;
transform: scale(.5);
}
}