@import url('https://fonts.googleapis.com/css2?family=Montserrat&family=Overpass:wght@300;400;700&display=swap');

@media only print {
  .Cert1 {
    display: inline-block;
    page-break-after: always !important;
  }
}

body {
  font-family: 'Overpass', Arial, sans-serif;
  font-size: large;
  margin: 0px;
}

.Cert1 {
  display: block;
  border: 18px #333 ridge;
  margin: 4px;
  width: 880px;
  margin: 5px auto;
  margin-bottom: 15px;
}

.Cert2 {
  border: 8px #1c75bc ridge;
  margin: 4px;
  padding: 1em;
}

.COA {
  font-size: 2em;
  text-align: center;
  font-weight: bold;
}

.text {
  width: 80%;
  margin: auto;
  text-align: center;
  font-size: 1.2em;
  padding-left: 0em;
  padding-right: 0em;
  padding-top: 0em;
  padding-bottom: 1em;
}

.lessons {
  width: 80%;
  margin: auto;
  text-align: center;
  font-size: 1em;
  padding-left: 0em;
  padding-right: 0em;
  padding-top: 0em;
  padding-bottom: 1em;
}

.name {
  width: 80%;
  margin: auto;
  padding-bottom: 1em;
  font-weight: bold;
  text-align: center;
  font-size: 1.5em;
}

.date {
  width: 75%;
  margin: auto;
  text-align: center;
  font-weight: bold;
  padding: 0em;
}

#block,
#pathBlock {
  width: 95%;
  margin: auto;
  padding-top: 2em;
  padding-bottom: 1.5em;
  text-align: center;
}

#ITILogo {
  border: 0px solid red;
  margin-left: calc(100% - 540px);
}

#customLogo {
  height: 65px;
  border: 0px solid red;
}

#side-a {
  float: left;
  width: 30%;
  border: 0px solid;
  text-align: left;
}

#side-b {
  float: right;
  width: 30%;
  border: 0px solid;
}

#sig {
  margin-top: 0%;
}

.ITI {
  font-size: small;
  margin: 0px;
}

.sig {
  border-top: 1px solid;
  margin: 0px;
  margin-top: 1em;
  text-align: right;
  font-size: small;
}

.copy {
  font-size: x-small;
  text-align: center;
  margin: 0;
  margin-top: 1em;
  clear: both;
  border: 0px solid;
}

/*
=========================================================
      Lesson 63 Certificate Styles
=========================================================
*/

.Cert3 {
  border: 18px #333 ridge;
  width: 880px;
  margin: 4px;
  width: 880px;
  margin: 5px auto;
  margin-bottom: 15px;
}

.Cert4 {
  border: 8px rgb(222, 102, 76) ridge;
  margin: 4px;
  padding: 1em;
  text-align: center;
  color: rgb(86, 76, 62);
  font-family: 'Futura';
  background-color: rgb(240, 242, 230);
}

.Cert4 .certify {
  margin: 15px;
}

.Cert4 .text.alt {
  font-size: 1em;
  margin-top: 1em;
}

.Cert4 .traffic {
  margin: 1em;
}

.Cert4 #block {
  padding-top: 0;
  padding-bottom: 0;
}

.Cert4 .date {
  margin-top: 0.5em;
}

.name.alt {
  padding-bottom: 0px;
}

.sig.alt {
  margin-top: 0px;
  width: 35%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.sig.alt.left {
  margin-left: 0px;
  display: inline-block;
}

.sig.alt.right {
  margin-right: 0px;
  display: inline-block;
}

.text.alt {
  padding-bottom: 0px;
  margin-top: 25px;
}

.traffic {
  text-shadow: -5px 5px rgb(144, 201, 196);
  color: rgb(37, 62, 111);
  font-weight: 100;
  font-family: Impact, Charcoal, sans-serif;
  letter-spacing: 3px;
}

#ttaLogo {
  width: 200px;
  float: right;
}

#ttaSig {
  height: 75px;
  position: relative;
  top: 35px;
  right: 135px;
}

#altITILogo {
  position: relative;
  top: 55px;
  border: 0px solid red;
}

.date {
  width: 35%;
  margin-top: 35px;
}

.certify {
  font-size: 30px;
}

#side-b.zeroVisibility {
  visibility: hidden;
}

#certificateLessonList {
  width: 80%;
  margin: auto;
}

#pathBlock {
  padding-bottom: 3.5em;
}

.printed_name {
  font-size: 16px;
  margin-bottom: -14px;
}

.eldta .printed_name {
  margin-top: -6px;
}