.mercy-hero{
    background-image: url('/img/film/mercy/mercy-profile0.jpg');
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .mercy-hero h1{
    font-size: 3em;
    color: #fff;
    text-align: center;
    margin-top: 20px;
  }
  .mercy-hero p{
    font-size: 1.5em;
    color: #fff;
    text-align: center;
    margin-top: 20px;
  }
  .mercy-hero a{
    font-size: 1.5em;
    color: #fff;
    text-align: center;
    margin-top: 20px;
  }
  .mercy-hero a:hover{
    color: #000;
  }
  .mercy-hero .btn{
    background-color: #fff;
    color: #000;
    font-size: 1.5em;
    text-align: center;
    margin-top: 20px;
  }
  .mercy-hero .btn:hover{
    background-color: #000;
    color: #fff;
  }
  .mercy-hero .btn2{
    background-color: #fff;
    color: #000;
    font-size: 1.5em;
    text-align: center;
    margin-top: 20px;
  }
  .mercy-hero .btn2:hover{
    background-color: #000;
    color: #fff;
  }
  .mercy-hero .btn3{
    background-color: #fff;
    color: #000;
    font-size: 1.5em;
    text-align: center;
    margin-top: 20px;
  }
  .mercy-hero .btn3:hover{
    background-color: #000;
    color: #fff;
  }
  .mercy-hero .btn4{
    background-color: #fff;
    color: #000;
    font-size: 1.5em;
    text-align: center;
    margin-top: 20px;
  }
  .mercy-hero .btn4:hover{
    background-color: #000;
    color: #fff;
  }
  .mercy-hero .btn5{
    background-color: #fff;
    color: #000;
    font-size: 1.5em;
    text-align: center;
}


.Box2-mercy{
    background-image: url(/img/film/mercy/child.jpg);
}

.Box1-mercy{
  background-image: url(/img/film/mercy/learn.png);
}

.Box3-mercy{
  background-image: url(/img/film/mercy/orphan.jpg);
}

.Box4-mercy{
  background-image: url(/img/film/mercy/aid.jpg);
}

.Box5-mercy{
  background-image: url(/img/film/mercy/comunity.jpg);
}

.Box6-mercy{
  background-image: url(/img/film/mercy/power.jpg);
}