.card-row {
}

.card-holder {
  text-align: center;
}

.card {
  /* Add shadows to create the "card" effect */
  margin: 2em 1em;
  box-shadow: 0 .75em 1.25em 0 rgba(0,0,0,0.5);
  transition: 0.3s;
  display: inline-block;
  max-width: 20em;
  width: 16%;
  min-width: 10em;
  cursor: pointer;
}

.card img {
  margin: 0;
  padding: 0;
  display: block;
}

/* On mouse-over, add a deeper shadow */
.card:hover {
  box-shadow: 0 1.25em 1.75em 0 rgba(0,0,0,0.7);
}

/* Add some padding inside the card container */
.card-text {
  padding: .4em 1em;
  background-color: #FFFFFF;
  height: 13em;
}

.card-text p {
  float: left;
  font-size: 120%;
  font-weight: 600;
}

.outter-p2p-sum {
  position: relative;
}

.inner-p2p-sum {
  position: absolute;
  bottom: .5em;
  background-color: #FFFFFF;
  opacity: 0.85;
  width: 100%;
  border-radius: .4em;
}

.p2p-camp-description {
  margin: 0 auto;
  width: 60%;
}

.thankyou {
  position: fixed; /* Sit on top of the page content */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  background-color: rgba(0,0,0,0.8); /* Black background with opacity */
  cursor: pointer; /* Add a pointer on hover */
}

.thankyou-inner {
  position: absolute;
  top: 40%;
  width: 100%;
  text-align: center;
}

@media only screen and (max-width: 400px) {
  .p2p-camp-description {
    margin: 0 auto;
    width: 90%;
  }
}