@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Italianno&display=swap');
@import url("https://use.typekit.net/dea0rqs.css");
@import url("https://use.typekit.net/jtt8wcj.css");
@import url("https://use.typekit.net/hpp1dtu.css");
@import url('https://fonts.googleapis.com/css2?family=Petit+Formal+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Luxurious+Roman&display=swap');


body {
   margin: 0;
}

h1 {
   margin: 0;
}

 #quote1 {
    background-color: #bac8da;
    height: 200px;
 }

 .The {
    font-family: "warbler-deck", sans-serif;
    font-weight: 400;
    font-style: italic;
    vertical-align: text-top;
    font-size: 45pt;
    padding-left: 25px;
 }

 .no {
   font-family: "futura-pt", sans-serif;
   font-weight: 400;
   font-style: italic;
   font-size: 35pt;
  display: flex;
  align-items: flex-end;
  padding-top: 30px;
  margin-left: 1100px;
 }

 #quote2 {
   background-color: #8b84b5;
   height: 400px;
 }

 ul {
   margin: 0;
 }
 
 li {
   font-family: "vandertak-rough", sans-serif;
   font-weight: 400;
   font-style: normal;
   font-size: 100px;
 }

 .inline {
   font-family: "vandertak-inline", sans-serif;
   font-weight: 400;
   font-style: normal;
   font-size: 100px;
   text-decoration-line: underline;
 }

 .row {
   background-color: #8aa6d6;
   display: flex;
   height: 38vh;
 }

 .column {
  font-family: "bahnschrift", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 40px;
  flex: 20%;
  margin-left: 100px;
  margin-top: 20px;
 }

 .Yet {
  margin: -20px;
 }
 
 .column2 {
  font-family: "impact", sans-serif;
  font-weight: 100;
  font-style: normal;
  font-size: 40px;
  margin: left 20%;
 }

 .margintop25 {
  
  margin-left: 30%;
 }

.margintop50 {
  margin-top: 50%;
}

#quote4 {
  background-color: #51657f;
  height: 375px;
  text-align:right;
}

p {
  margin: 0%;
  padding-top: 30px;
}

.t {
  font-family: "commuters-sans", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 30pt;
  margin-right: 20%;
  
}

.d {
  font-family: "commuters-sans", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 30pt;
  margin-right: 21%;
}

.die {
  font-family: "amboy-black", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 50pt;
  color: #262262;
  margin-right: 15%;
}

.a {
  font-family: "commuters-sans", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 30pt;
  margin-right: 30%;
}

#quote5 {
  background-color: #806cb0;
  height:425px;
  text-align: center;
}

h2 {
  margin: 0;
  font-family: "Audiowide", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 130px;
  padding-top: 8%;
}

#quote6 {
  background-color: #31607a;
  height: 200px;
  text-align: right;
}

h3 {
  margin: 0;
  font-family: "Italianno", cursive;
  font-weight: 400;
  font-style: normal;
  font-size: 60px;
  color: ghostwhite;
  margin-right: 45px;
  padding-top: 35px;
}

#quote7 {
  background-color: #474255;
  height: 330px;
}

h4 {
  margin: 0;
  padding-top: 5px;
  font-family: "new-astro", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 50px;
}

.y {
  margin-left: 70px;
}

.ar {
  margin-left: 100px;
}

.pa {
  margin-left: 120px;
}

.of {
  margin-left: 140px;
}

.mac {
  font-family: "watch-mn", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 50px;
  color: ghostwhite;
  margin-left: 30px;
}

#quote8 {
  background-color: #2c3d47;
  height: 500px;
  box-sizing: border-box;
  border: 2px #2c3d47 solid;
  
}

.inner {
  border: 2px lightskyblue solid;
  height: 72%;
  width: 45%;
  margin: 85px auto;
  box-sizing: border-box;
  color: ghostwhite;
  text-align: center;
  line-height: 0.5;
}

h5 {
  font-family: "omnium", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 30px;
}

#quote9 {
  background-color: #243750;
  height: 275px;
  text-align: right;
}

h6 {
  margin: 0;
  font-family: "Petit Formal Script", cursive;
  font-weight: 400;
  font-style: normal;
  font-size: 45px;
  color: ghostwhite;
  text-align: left;
  padding-top: 100px;
  padding-left: 50px;
  line-height: 0;
}

h7 {
  font-family: "avenir-lt-pro", sans-serif;
  font-weight: 800;
  font-style: italic;
  font-size: 50px;
  color: #fbb040;
  padding-right: 50px;
  letter-spacing: 8px;
}

.b {
  opacity: 1;
}

.u {
  opacity: 0.7;
}

.r {
  opacity: 0.5;
}

.n{
  opacity: 0.3;
}

#quote10 {
  background-color: #2d1f33;
  height: 345px;
  margin: 0;
  display: flex;
  align-items:flex-end;
  justify-content: flex-end;
}

h8 {
  font-family: "Luxurious Roman", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 40px;
  color: ghostwhite;
  text-align: right;
  padding-right: 30px;
  padding-bottom: 30px;
}

.cruel {
  color:rgb(246, 153, 207)
}