div#kudos
{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  padding: 1em;
}

div#kudos div.kudo_panel
{
  display: block;
}

div#kudos div.kudo_panel div.kudo_image
{
  flex: 1 0 auto;
  display: block;
  float: left;
  max-width: 150px;
  margin: 0 20px 0 0;
}

div#kudos div.kudo_panel div.kudo_image img
{
  display: block;
  width: 100%;
  margin-bottom: 12px;
}

div#kudos div.kudo_panel div.kudo_image_caption
{
  font-size: .8em;
  text-align: center;
  margin-bottom: 6px;
}

div#kudos div.kudo_panel div.kudo_giver
{
  width: 100%;
  justify-self: flex-end;
  text-align: right;
  margin-top: 20px;
  font-size: 0.8em;
  letter-spacing: 1px;
  clear: both;
}

@media screen and (max-width: 500px)
{
  div#kudos div.kudo_panel div.kudo_image
  {
    float: none;
    width: 90%;
    margin: 0 auto;
  }
}