/**
 * @file
 * Recorte de la fotografia en la ficha del investigador.
 *
 * Los originales son cuadrados de 480x480. Antes el recorte lo hacia el image
 * style profile_crop en el servidor; sirviendo la imagen directa desde la API
 * hay que hacerlo aqui. object-fit encaja la foto en un marco mas alto que
 * ancho recortando los laterales por igual, en vez de deformarla.
 */

#profile-info .profile-info-img {
  width: 220px;
  padding-right: 24px;
  vertical-align: top;
}

#profile-info .profile-info-img img {
  display: block;
  width: 220px;
  height: 240px;
  object-fit: cover;
  object-position: center;
}

/* En movil la tabla se apila y la foto pasa a ancho completo, conservando la
   misma proporcion 220x240 mediante aspect-ratio. */
@media (max-width: 575px) {
  #profile-info,
  #profile-info tbody,
  #profile-info tr,
  #profile-info td {
    display: block;
    width: 100%;
  }

  #profile-info .profile-info-img {
    padding: 0 0 16px;
  }

  #profile-info .profile-info-img img {
    width: 100%;
    max-width: 260px;
    height: auto;
    aspect-ratio: 11 / 12;
  }
}
