/* Note that the page layout changes a bit between viewport sizes. See HTML and media queries*/

h1 {
  font-size: 30px;
}

.researchers-desktop {
  display: none;
}

.researchers-hero-desktop {
  display: none;
}

.researchers-full {
  position: relative;
  top: 100px;
}

.researchers-mobile {
  width: 310px;
  height: 352px;
  position: relative;
  margin: auto;
  padding: 30px;
}

.researchers-hero {
  width: 139px;
  height: 98px;
  position: absolute;
  left: 189px;
  top: 118px;
  border-radius: 0px 25px 25px 25px;
}

.researchers-text {
  position: absolute;
}

.researchers-mobile h2 {
  width: 150px;
  height: 149px;
  position: absolute;
  left: 0px;
  top: 53px;
  font-size: 16px;
  letter-spacing: 0.1px;
  word-wrap: break-word;
}

.researchers-mobile p {
  width: 300px;
  height: 113px;
  position: absolute;
  left: 0px;
  top: 239px;
  font-size: 16px;
  letter-spacing: 0.1px;
  word-wrap: break-word;
}

.researchers-images {
  display: flex;
  justify-content: center;
  flex-direction: row;
  gap: 20px;
  margin: auto;
  max-width: 90ch;
  padding-bottom: 170px;
}

.researchers-logos-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 290px;
}

.researchers-logos-top img {
  width: auto;
  max-height: 90px;
  flex: 1 1 calc(33.33% - 20px);
  margin: 10px;
  object-fit: contain;
}

.researchers-logos-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 290px;
}

.researchers-logos-bottom img {
  width: auto;
  max-height: 90px;
  flex: 1 1 calc(50% - 20px);
  margin: 10px;
  object-fit: contain;
}

.name {
  font-size: 10px;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  flex: 1 1 calc(33.33% - 20px);
  justify-content: center;
  text-align: center;
}

.researchers-logos {
  position: relative;
}
