/*a {
  color: #FFFFFF;
  text-decoration: underline;
  outline: 0;
}
a:hover, a:focus {
  color: inherit;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
}

p {
  margin: 0 0 10px 0;
}*/

.flipbox .front, .flipbox .back {
    overflow:hidden;
  position: absolute;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  width: 200px;
  height: 180px;
  border-radius: 7px;
  padding: 2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}

section {
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
}

.flipbox {
  float: left;
  width: 200px;
  height: 180px;
  margin: 10px;
}
.flipbox .front {
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
  background: #3B9954;
}
.flipbox .front > h2 {
  font-size: 22px;
  width: 100%;
  margin: 0 0 10px 0;
}
.flipbox .back   i.fa {
  font-size: 3em;color:#000;
  -ms-flex-item-align: end;
      align-self: flex-end;
}
.flipbox .front > img {
   height:100%;
  width: 100%;
  -ms-flex-item-align: end;
      align-self: flex-end;
}
.flipbox .back {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
  background: #3B99CA;
}
.flipbox .back > a {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  width: 100%;
}
.flipbox:hover .front {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}
.flipbox:hover .back {
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
}
.back p{
    font-size:16px;

}