<style type="text/css">
.openDoor{width: 500px;height: 350px;margin: 100px auto;overflow: hidden;}
.openDoor img{width:250px;height: 350px;}
.openDoor img:nth-of-type(1){transform: perspective(3000px) rotateY(90deg);animation: openDoorLeft 5s  infinite;animation-timing-function:cubic-bezier(.5,.18,.47,.89); transform-origin: left center;float: left;}
.openDoor img:nth-of-type(2){transform: perspective(3000px) rotateY(-90deg);animation:openDoorRight 5s infinite;animation-timing-function:cubic-bezier(.5,.18,.47,.89);transform-origin: right center;float: right;}

@keyframes openDoorLeft{
	from{transform: perspective(3000px) rotateY(0deg)}
	to{transform: perspective(3000px) rotateY(90deg)}
}
@keyframes openDoorRight{
	from{transform: perspective(3000px) rotateY(0deg)}
	to{transform: perspective(3000px) rotateY(-90deg)}
}
</style>
<div class="openDoor">
	<img src="left.jpg" alt=""/><img src="left.jpg" alt=""/>
</div>