.container {
	height:90vh;
	position: relative;
	perspective: 800px;
}

#card {
  width: 100%;
  height: 100%;
  position: absolute;
  transform-style: preserve-3d;
  transition: transform 25s;
}

#card figure {
  margin: 0;
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}


#card .front {
  	background-image:url('index.jpg');
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
}
#card .back {
  	background-image:url('index2.jpg');
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	transform: rotateY( 180deg );
}

#card.flipped {
  transform: rotateY( 180deg );
}