/* Turn the grid container into a grid with three flexible columns.
Style the individual items to recreate the screenshots on class website.*/

.grid-container {
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-template-rows: .15fr .15fr .15fr 1fr 1fr;
  background-color: #f4e6bf;
  font-family: Didot;
  color: black;
  padding: 5%;
  margin: -20px -50px;
}

.one {
  grid-column: 1 / span 2;
  grid-row: 1;
  background-color: white;
  font-family: didot;
  font-size: 90px;
  padding: 0% 6%;
  padding-right: 100%;
  text-align: right;
}

.two {
  grid-column: 1 / span 2;
  grid-row: 2;
  font-size: 90px;
  text-align: right;
  padding: 0% 5%;
  padding-right: 100%;
}

.three {
  grid-column: 1 / span 2;
  grid-row: 3;
  font-size: 90px;
  text-align: right;
  background-color: white;
  break-style: solid;
  padding: 0% 5%;
  padding-right: 72%;
  line-height:
}

.four {
  grid-column: 2;
  grid-row: 1 /span 4;
  text-align: right;
  margin: 0px 80px;
  line-height:2;
    font-size:14pt;
}

.five {  grid-column: 1;
  font-size: 40pt;
  background-color: white;
  padding: 4% 10%;
  font-size:40px;
    line-height:20px

}
.six {  grid-column: 1;
  font-size: 40pt;
  background-color: white;
  padding: 0% 10%;
  font-size:75px
}
.seven{  grid-column: 1;
  font-size: 40pt;
  background-color: white;
  padding: 0% 4%;
  font-size:90px;
line-height: 60px}
.zero{
    grid-column:2;
  font-size: 150pt;
  background-color: white;
  padding: 0% 10%;
  font-family:Didot;
  line-height:150pt
}
.eight{
  grid-column:2;
  grid-row:3
  display:inline-block;
  transform: rotate(-30deg);
  font-size: 100px;
  font-style: italic;
}


hr.style2 {
	border-top: 3px double #8c8b8b;
}
hr.style1{
	border-top: 1px solid #8c8b8b;
  line-height:10pt;
}



/* Additional Visual Styling — you can ignore this */