.wrap600 {
  max-width: 550px;
  margin: 0 auto;
}

#j2 {
  height:0;
  padding-bottom: 80%;
}

@media screen and (max-height:500px) {
  #j2 {
    width: calc(100vmin - 5em);
    height: calc(100vmin - 5em);
	padding:0
  }
}

#j1 {
  height:0;
  padding-bottom: 35%;
}

@media screen and (max-height:500px) {
  #j1 {
    width: calc(100vmin + 10em);
    height: calc(100vmin - 10em);
	padding:0
  }
}