@import url('https://fonts.googleapis.com/css2?family=Saira:ital,wght@0,100..900;1,100..900&display=swap');

 body {background-image: url("https://meiqth.ing/t/rabbits-bunnies-ezgif.com-crop.gif");} /* HEY SARAH THIS IS THE BACVKGROUND IMAGE */
 body {
  --font-primary: "Saira", sans-serif;
  font-family: var(--font-primary);
} 
 h1 {color: white;}
 p {color: white;}
 h3 {color: white;}
 h2 {color: white;}
 ul {color: white;}
 a:link {color: white;} /* default colour */
 a:visited {color: powderblue;} /* default clicked link */
 a:hover {color: white;} /* overrides above */
 a:active {color: powderblue;} /* the actualy DURING the click */
 body {
  background-color: pink;                                                                                   /* pink bg colour for pallette (your mom)*/
}
 /* most of this css was fixed by ai, blame mae */
* {
  box-sizing: border-box; /* https://youtu.be/3fkP88FDgaI?t=24 */
}

.parent {
  display: grid;
  /* This creates your 7 specific columns: gap, div, gap, div, gap, div, gap */
  grid-template-columns: 3% 20% 1.2% 51.6% 1.2% 20% 3%;
  width: 100%;
  
}

.childleftparent {
  grid-column: 2; /* references percentages above for percentage of screen taken up */
}

.childrightparent {
  grid-column: 6;
}

.childbigparent {
  grid-column: 4;
}


.childleft, .childbig, .childright, .title{
  width: 100%;
  background-color: #dc6ea5; 
  /* pink box colour for palette */
  border: 3px solid #002026; 

  padding: 3%; 
}
.title img {
  display: block;
  margin: auto;
  width: 50%;
}
.showcase {
  box-sizing: border-box; /* Keeps the 3px border inside the width so it doesn't disappear */
  display: flex; 
  gap: 15px; 
  align-items: center; 
  justify-content: center;
  width: 100%;
  background-color: #dc6ea5;                                                                                   /* pink box colour for palette */
  border: 3px solid #002026; 
  padding: 3%; 
}
.showcase iframe {surprisingly simple 
  flex: 0 0 60%; 
  max-width: 60%;
  height: 315px;
  margin-right: 10px; 
}

.video-text {
  flex: 1;
  text-align: left;
  padding-right: 10px; 
}
.foot {
  width: 20%;
     margin: auto;
  text-align: center;
  background-color: #dc6ea5; /* [cite: 4] */                                                                  /* pink box colour for palette */
  border: 3px solid #002026; /* [cite: 4] */
}