.overview_box .content img {
  max-height: 5vh;
  width: auto;
}

.content {
  display: flex;
  gap: 10px;
}

.case_introIMG {
  width: auto;
  height: auto;
}

.case_introIMG > div {
  background-image: url(../media/Group\ 102.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 375px;
  height: 512px;
}

/* RESEARCH */
.research_container {
  display: flex;
  flex-direction: column;
  gap: 2vw;
  margin-top: 5vh;
}

.topRow {
  display: flex;
  gap: 4vw;
}

.topRow p {
  width: 25vw;
  margin-top: 0;
}

.double_Images {
  height: 40vh;
  width: 30vw;
}

#caseContainer .research_chapter .chapter_content > p {
  width: 62vw;
}

.bottomRow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2vw;
  margin-top: 5vh;
}

.left_Section {
  display: flex;
  gap: 2vw;
}

.UserPers_Img img {
  height: 55vh;
}

.Book_IMG {
  display: flex;
  flex-direction: column;
  gap: 5vh;
  align-items: center;
  justify-content: center;
  margin-top: -8vh;
}

.Book_IMG img {
  height: 30vh;
  width: 30vw;
}

/* IDEATE */
#caseContainer .ideate_chapter .chapter_content > p {
  width: 60vw;
}

.Ideate_Images {
  margin-top: 5vh;
  display: flex;
  flex-direction: column;

  width: 70vw;
}

.Ideate_Images img:nth-of-type(1) {
  height: 65vh;
  width: 50vw;
}

.Ideate_Images img:nth-of-type(2) {
  height: 60vh;
  width: 60vw;
  align-self: flex-end;
}

/* UI */
.UI_container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto auto auto auto;
    gap: 2rem;
    position: relative;
}

.intro_UI_text {
  width: 30vw;
  grid-column: 1;
  grid-row: 1;
}

.colour_Grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3.5vh;
  width: 35vw;
  margin: 10vh 0 0 4vw;
  grid-column: 2 / span 3;
  grid-row: 1;
}

.colour_Grid > div > p {
  margin-top: 14vh;
}

.colour_Grid > div {
  height: 14vh;
  width: 7vw;
  font-size: 10px;
  color: var(--sub-text-color);
}

.colour_Grid > .cube_1 {
  background-color: #3981a2;
}
.colour_Grid > .cube_2 {
  background-color: #d6e5e7;
}
.colour_Grid > .cube_3 {
  background-color: #985571;
}
.colour_Grid > .cube_4 {
  background-color: #d9675b;
}
.colour_Grid > .cube_5 {
  background-color: #f6e8e4;
}
.colour_Grid > .cube_6 {
  background-color: #ffffff;
  box-shadow: 5px 5px 50px 0px rgba(0, 0, 0, 0.1);
}
.colour_Grid > .cube_7 {
  background-color: #2c2c2c;
}

.prompt_Container img {
  height: 38vh;
  width: 25vw;
  margin-top: -15vh;
}

.font_Content {
  grid-column: 2 / span 3;
  grid-row: 2;
  width: 30vw;
  margin-top: 7vh;
}

.font_Heading_1 {
    font-family: "Butterfinger";
}

.font_Heading_2 {
    font-family: "Inter";
}

.font_Heading_1, 
.font_Heading_2 {
    font-size: var(--fs-typography);
}

.footprint_Deco {
  position: absolute;
  right: -10vw; 
  top: 20vh;   
  height: 90vh;
  width: auto;
  z-index: 1;
}

.text_Container {
    grid-column: 1 / span 2;
    grid-row: 3;
    width: 41vw;
}

.sus_IMG {
    height: 40vh;
    width: 45vw;
    grid-column: 1 / span 2;
    grid-row: 4;
}

.clue_IMG {
    grid-column: 3;
    grid-row: 4;
    height: 30vh;
    width: 20vw;
    margin-top: -5vh;
}

.arrow_IMG {
    height: 14vh;
    width: 12vw;
    margin: 28vh 0 0 4vw;
    grid-column: 3;
    grid-row: 4;
}


/* VALIDATION */
.Images_Vali_Container {
  display: flex;
  gap: 3vw;
  margin-top: -3vh;
}

.Images_Vali_Container img {
  height: 75vh;
  width: 17vw;
  margin-top: 5vh;
}

.Bottom_Paragraph {
  padding-top: 4vh;
  width: 57vw;
}

/* LESSONS LEARNED */
.content_divider {
  display: flex;
  gap: 7vw;
}

._column1 {
  width: 40vw;
}

._column1 p:nth-child(1) {
  margin-top: 0;
}

._column2 img {
  height: 45vh;
  width: 27vw;
  margin-top: -8vh;
}

/* PROTOTYPE */
.content_box {
  display: flex;
  margin-left: 5vw;
}

.chapter_summary {
  margin-right: 5vw;
}

.chapter_summary h2 {
  font-size: var(--fs-h2);
}

.chapter_summary p {
  width: 23vw;
}

.image_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, 1fr);
  height: 82vh;
  width: 32vw;
  margin-inline: auto;
}

.image_grid img {
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
}

.image_grid img:hover {
  transform: scale(1.06);
}

.pic1 {
  grid-column: 1 / span 2;
  grid-row: 1;
}

.pic2 {
  grid-column: 1 / span 2;
  grid-row: 2;
}

.pic3 {
  grid-column: 3;
  grid-row: 1 / span 2;
}

.pic4 {
  grid-column: 1;
  grid-row: 3 / span 2;
}

.pic5 {
  grid-column: 2;
  grid-row: 3 / span 2;
}

.pic6 {
  grid-column: 3;
  grid-row: 3 / span 2;
}

/* OTHER */
.scroll_arrow.up {
  top: 1025%;
  left: 85%;
}

.scroll_arrow {
    animation: moveArrow 2s ease-in-out infinite;
}

.footer {
  margin-top: 5vh;
  padding-bottom: 1vh;
}

#project_ex.project_1 .project_arrow {
  margin-left: 2vw;
}