@import url('https://fonts.googleapis.com/css?family=Saira+Condensed:700');
@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Delius&display=swap');

hr {
  background-color: #6E918B;
  height: 2px;
  margin: 5px;
}

div#cert-footer {
  position: absolute;
  width: 60%;
  top: 400px;
  text-align: center;
}

#cert-stamp, #cert-ceo-sign {
  width: 60%;
  display: inline-block;
}

div#cert-issued-by, div#cert-ceo-design {
  width: 40%;
  display: inline-block;
  float: left;
}

div#cert-ceo-design {
  margin-left: 10%;
}

h1 {
  font-family: 'Saira Condensed', sans-serif;
  margin: 5px 0px;
}

div.certificate-wrapper {
  width: 950px;
  height: 690px;
  position: absolute;
  left: 30px;
  /*top: 40px;*/
  background: #eee url("/images/certificate.jpg") no-repeat; background-size: 100%;
}

div.certificate-content {
  padding: 33px;
  height: 80%;
}

p {
  /*font-family: 'Arial', sans-serif;*/
  font-family: 'Delius', cursive;
  font-size: 18px;
  margin: 5px 0px;
}

html {
  display: inline-block;
  width: 1024px;
  height: 768px;
  margin: auto;
  position: relative;
  /*background: #eee url("/images/certificate.jpg") no-repeat; background-size: 100%;*/
}

h1#cert-holder {
  font-size: 50px;
  color: #be2d24;
  font-family: 'Parisienne', cursive;
}

p.smaller {
  font-size: 17px !important;
}

div#cert-desc {
  width: 70%;
}

p#cert-from {
  color: #be2d24;
  font-family: 'Saira Condensed', sans-serif;
}

div#cert-verify {
  opacity: 1;
  position: absolute;
  top: 585px;
  left: 18%;
  font-size: 12px;
  color: grey;
  font-family: 'Delius', cursive;
}

/* usage for reference */


div#sign-one, div#sign-two, div#sign-three {
  width: 29%;
  display: inline-block;
  float: left;
  margin: 2.5rem .9rem;
  margin-top: 1px; 
}

.module {
  position: absolute;
}

.image {
  position: relative;
  z-index: 1;
}

/*Certificate button
*/
.btn-style-2,
.btn-style-2:focus {
  background-color: #14548E;
  color: #fff;
}

.mc-btn {
  display: inline-block;
  border: 0;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  cursor: pointer;
  font-family: 'Lato', sans-serif;
  font-size: 16px;
  height: 40px;
  line-height: 40px !important;
  padding: 0 20px;
  margin-top: 15px;
  margin-bottom: 15px;
  text-align: center;
  text-transform: capitalize;
  -webkit-transition: all 0.3s linear 0s;
  -moz-transition: all 0.3s linear 0s;
  -ms-transition: all 0.3s linear 0s;
  -o-transition: all 0.3s linear 0s;
  transition: all 0.3s linear 0s;
}