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

.case_introIMG {
  width: auto;
  height: auto;
  margin-top: 2vh;
}

.case_introIMG > div {
  background-image: url(../media/MalmoPic.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 225px;
  height: 512px;
  box-shadow: 10px 10px 50px rgba(0, 0, 0, 0.2);
}

/* RESEARCH */
.inner_content_research {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2vw;
  margin-top: 5vh;
}

.chapter_content .inner_content_research img {
  height: 250px;
  width: 500px;
}

.text_bubble_1 {
  grid-column: 2;
  padding: 30px;
  background-color: #ffffff;
  box-shadow: 5px 5px 50px 0px rgba(0, 0, 0, 0.1);
  border-radius: 30px;
  width: 15vw;
  margin-left: 5vw;
  height: 24vh;

  display: flex;
  justify-content: center;
  align-items: center;
}

.text_bubble_2 {
  grid-column: 1;
  grid-row: 2;
  padding: 30px;
  background-color: #ffffff;
  box-shadow: 5px 5px 50px 0px rgba(0, 0, 0, 0.1);
  width: 27vw;
  height: 15vh;
  margin-top: 3vh;
  margin-left: 2vw;
  border-radius: 30px;
}

.inner_content > div:nth-child(3) {
  grid-column: 2;
}

/* FEEDBACK */
.feedback_text_intro {
  width: 60vw;
}

.feedback_insight {
  display: flex;
  gap: 2rem;
}

.feedback_insight > div {
  display: flex;
  gap: 1rem;
}

.number {
  font-family: var(--font-heading);
  font-size: 27px;
  margin-top: 16px;
}

/* IDEATE */
.ideate_chapter .chapter_content img {
  height: 50vh;
  width: 70vw;
}

/* UI */

/* logos */
.logo_container {
  display: flex;
  margin-top: -3vh;
}

.right_column img {
  height: 30vh;
  width: 11vw;
}

.right_column {
  margin-top: -2vh;
  margin: -2vh 0vw 0vh 2vw;
}

.logo_right {
  display: flex;
  gap: 5rem;
}

.left_column img {
  height: 100%;
  width: 100%;
}

.left_column > p {
  flex: 1;
  width: 40vw;
}

.logo_below {
  width: 28vw;
  margin: 5vh 0 0 3vw;
}

/* typography */
.fontInfo_list {
  padding: 30px;
  background-color: #ffffff;
  box-shadow: 5px 5px 50px 0px rgba(0, 0, 0, 0.1);
  border-radius: 30px;
  width: 21.5vw;
  height: 35vh;

  margin-top: -12vh;
  margin-left: 5vw;

  display: flex;
  align-items: center;
  justify-content: center;
}

.fontInfo_list ul {
  max-width: 100%; /* Hindra att den sticker utanför sin container */
  max-height: 100%;
  padding: 30px 30px 50px 30px;
}

.typo_row {
  display: flex;
  gap: 3vw;
  margin-left: 10px;
}

.typointro_ {
  width: 35vw;
}

.MPB {
  font-family: "Myriad Pro Bold";
}
.MPR {
  font-family: "Myriad Pro Regular";
}
.MPL {
  font-family: "Myriad Pro Light";
}
.AGPB {
  font-family: "Adobe Garamond Pro Bold";
}
.AGPR {
  font-family: "Adobe Garamond Pro Regular";
}

.MPB,
.MPR,
.MPL,
.AGPB,
.AGPR {
  font-size: var(--fs-typography);
}

/* colours */
.malmo_Colours img {
  height: 350px;
  width: 500px;
}

.colour_content > p {
  width: 55vw;
}

.colour_palettes {
  display: flex;
  gap: 8vw;
  margin-top: 7vh;
}

.colour_Grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 3.5vh;
}

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

.colour_palettes > .malmo_Colours > p,
.container_colours > p {
  margin-top: 5vh;
  font-size: var(--fs-sub);
}

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

.colour_Grid > .green {
  background-color: #046a38;
}
.colour_Grid > .purple {
  background-color: #72246c;
}
.colour_Grid > .orange {
  background-color: #d86018;
}
.colour_Grid > .mintgreen {
  background-color: #d1e0d7;
}
.colour_Grid > .pink {
  background-color: #eedaea;
}
.colour_Grid > .yellow {
  background-color: #f0b743;
}
.colour_Grid > .black {
  background-color: #000000;
}
.colour_Grid > .darkgrey {
  background-color: #646464;
}
.colour_Grid > .lightgrey {
  background-color: #cfcfcf;
}

/* VALIDATION */
.before_img1 > img,
.before_img2 > img {
  height: 80vh;
}

.main_V_content {
  display: flex;
  width: 70vw;
  margin-top: -3vh;
}

.chapter_content > p {
  width: 61vw;
}

.main_V_content .text {
  margin-top: 7vh;
  width: 20vw;
}

/* LESSONS LEARNED */
.grid_box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, 1fr);
  width: 70vw;
}

.Lesson_1,
.Lesson_2,
.Lesson_3 {
  display: flex;
  align-items: center;
}

.Lesson_1 img,
.Lesson_2 img,
.Lesson_3 img {
  margin-right: 1rem;
  margin-top: -10vh;
  height: 8vh;
}

.Lesson_1 h5,
.Lesson_2 h5,
.Lesson_3 h5 {
  font-family: "Futura Bold";
}

.Lesson_2 {
  grid-row: 2;
  grid-column: 2;
  flex-direction: row-reverse;
}

.Lesson_2 h5 {
  display: flex;
  flex-direction: row-reverse;
  margin-right: 1vw;
}

.Lesson_3 {
  grid-row: 3;
}

/* 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: 20vw;
}

.result_images {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  height: 90vh;
  width: 40vw;
  margin-top: -14vh;
}

.desktop_img {
  height: 65vh;
  width: 100%;
  transition: transform 0.2s ease;
}

.mobile_row img {
  height: 100%;
  width: 100%;
  transition: transform 0.4s ease;
}

.desktop_img:hover,
.mobile_row img:hover {
  transform: scale(1.03);
}

.mobile_row {
  display: flex;
  margin-top: -10vh;
}

.mobile_row img:nth-child(1),
.mobile_row img:nth-child(2) {
  margin-right: -90px;
}

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

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

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