<!DOCTYPE html>
<html>
<head>
  <title>Certificate Template</title>
  <style>
    body {
      margin: 0;
      padding: 0;
    }
    .container {
  background-size: cover;
  background-position: center;
  width: 793.7px;
  height: 1122.5px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media print {
  .container {
    -webkit-print-color-adjust: exact;
    background-image: url('back.png');
    background-size: cover;
    background-position: center;
  }
}
    .row {
      display: flex;
      justify-content: space-between;
      width: 100%;
    }
    .column {
      width: 100%;
      padding: 10px;
      display: flex;
      justify-content: center;
      flex-direction: column;
    }
    .first-div {
      /* Styles for the first div */
	  padding-top: 80px;
      padding-bottom: 5px;
    }
    .second-div {
      padding-top: 5px;
      padding-bottom: 50px;
    }
    .third-div {
      padding-top: 25px;
      padding-bottom: 50px;
    }
    .fourth-div {
      padding-top: 50px;
      padding-bottom: 50px;
      display: grid;
      grid-template-columns: 40% 1% 59%;
      gap: 10px;
    }
  </style>
</head>
<body>
  <div class="container">
    <div class="row first-div">
      <div class="column ">
        <!-- Content for the first div -->
      </div>
      
    </div>
	<div class="row second-div">
      <div class="column ">
        <!-- Content for the first div -->
		 <center><h2>[[nomineename]]</h2></center><hr>

    <p><center>Has demonstrated exemplary leadership qualities,<br>dedication, and commitment to the Vision of the ministry</p><p>(Loveworld a.k.a Christ Embassy).</center></p>
    <p><center>This certificate is a symbol of his/her induction into the</p><p>leadership role of a cell leader.</center></p>
    <p><center>This certificate was issued [[day]] day of [[month]] 20[[year]]</p><p> at [[church_zone]]</center></p>
      </div>
      
    </div>
    <div class="row">
      <div class="column third-div">
        <!-- Content for the third div -->
		
      </div>
      <div class="column fourth-div">
        <div class="grid-item">Column 1</div>
        <div class="grid-item"><center></center></div>
      </div>
    </div>
    <div class="row">
      <div class="column">
        <!-- Content for the fifth div -->
      </div>
      <div class="column">
        <!-- Content for the sixth div -->
      </div>
    </div>
  </div>
</body>
</html>