<div class="axes un">
  <div class="rotated">                              
    <br><br>
    Survolez moi
  </div>
</div>

body{
	background: rgb(230,230,230);
  perspective: 800px;
}
div.axes{
	display:inline-block;
	width:300px;
	height:300px;
	padding:1px;
	margin-right:3em;
}
div.rotated {
  text-align: center;
  background-color: pink;
  width: 100px;
  height: 100px;
  margin: 40px auto;
  border: medium solid;
  transition: 1.5s;
  transform: rotateX(30deg)
}
.axes.un:hover div.rotated {
  transform: rotateX(30deg) translateY(50px);
}