CSS3 transition between scaleX en scaleY

Hi all,
I am currently looking into making a transition between first a scaleY of a background and then a scaleX. I googled it a bit but not getting there yet. Here is the code for both scaling at the same time :

.`ib-close{
top: 2px;
right: 2px;
background: #ffffff;
position: absolute;
width: 48px;
height: 48px;
cursor: pointer;
z-index: 1000;
text-indent: -9000px;
}
.ib-close:hover{
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
-webkit-transform: scaley(0.5) scalex(0.5);
-moz-transform: scaley(0.5) scalex(0.5);
-o-transform: scaley(0.5) scalex(0.5);
-ms-transform: scaley(0.5) scalex(0.5);
transform: scaley(0.5) scalex(0.5);
}
`

Any idea?