.container {
  width: 100%;
  height: 300vh;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.subject1 {
  display: flex;
  width: 80%;
  height: 8%;
  border-bottom: 1px dotted gray;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
}
.subject1 h2 {
  width: 100%;
  font-size: 3.5vw;
  font-weight: 900;
  margin-top: 3%;
  color: rgb(43, 39, 39);
}
.subject1 h4 {
  width: 100%;
  color: rgba(0, 0, 0, 0.397);
  display: flex;
  justify-content: end;
}

.grid {
  width: 80%;
  height: 210vh;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(14, 1fr);
  gap: 2% 2%;
  margin-top: 2%;
}
.grid div {
  height: auto;
  font-size: 50px;
  color: whitesmoke;
  display: flex;
  justify-content: center;
  align-items: center;
}
.grid div p {
  padding: 0 5%;
}
.grid > div:nth-of-type(1) {
  grid-row: 1/span 2;
}
.grid > div:nth-of-type(1) p {
  font-size: 2vw;
  color: black;
  margin-bottom: 9%;
}
.grid > div:nth-of-type(2) {
  grid-area: 3/1/span 3/span 1;
}
.grid > div:nth-of-type(2) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-bottom: 25%;
}
.grid > div:nth-of-type(3) {
  grid-area: 6/1/span 1/span 1;
  margin-top: -35%;
}
.grid > div:nth-of-type(3) p {
  font-size: 2vw;
  color: black;
  font-weight: 700;
}
.grid > div:nth-of-type(4) {
  grid-area: 7/1/span 2/span 1;
}
.grid > div:nth-of-type(4) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-top: -60%;
}
.grid > div:nth-of-type(5) {
  grid-area: 9/1/span 5/span 1;
}
.grid > div:nth-of-type(5) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-top: -60%;
}
.grid > div:nth-of-type(6) {
  grid-area: 1/2/span 1/span 1;
}
.grid > div:nth-of-type(6) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
}
.grid > div:nth-of-type(7) {
  grid-area: 2/2/span 6/span 1;
}
.grid > div:nth-of-type(7) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-top: -10%;
}
.grid > div:nth-of-type(8) {
  grid-area: 8/2/span 4/span 1;
}
.grid > div:nth-of-type(8) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-top: -35%;
}
.grid > div:nth-of-type(9) {
  grid-area: 12/2/span 2/span 1;
}
.grid > div:nth-of-type(9) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-top: -52%;
}
.grid > div:nth-of-type(10) {
  grid-area: 1/3/span 3/span 1;
}
.grid > div:nth-of-type(10) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
}
.grid > div:nth-of-type(11) {
  grid-area: 4/3/span 7/span 1;
}
.grid > div:nth-of-type(11) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-top: -25%;
}
.grid > div:nth-of-type(12) {
  grid-area: 11/3/span 3/span 1;
}
.grid > div:nth-of-type(12) p {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.719);
  text-align: justify;
  font-weight: 10;
  margin-top: -57%;
}

.pic {
  width: 80%;
  min-height: 30vh;
  margin-top: -10%;
}
.pic img {
  width: 100%;
  height: 70%;
}
.pic figcaption {
  display: flex;
  justify-content: center;
  align-content: center;
  border-top: 1px solid gray;
  margin-top: 5%;
  padding-top: 3%;
}/*# sourceMappingURL=master.css.map */