JSFiddle - React, Tailwind, and code Playground
HTML
<a id="siteLogo" class="siteLogo_ani" href="lol">
<img src="http://goo.gl/QafDup"/>
</a>
CSS
.siteLogo_ani img{
-webkit-animation-name: asdf;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: ease-out;
-webkit-animation-delay: 1;
-webkit-animation-iteration-count: 1;
-webkit-animation-direction: normal;
-moz-animation-name: asdf;
-moz-animation-duration: 1s;
-moz-animation-timing-function: ease-out;
-moz-animation-delay: 1;
-moz-animation-iteration-count: 1;
-moz-animation-direction: normal;
animation-name: asdf;
animation-duration: 1s;
animation-timing-function: ease-out;
animation-delay:1;
animation-iteration-count: 1;
animation-direction: normal;
}
@-webkit-keyframes asdf{
from {float: left; width:355px; height:150px; display:block;}
to {float: left; width:160px; height:50px; display:block;}
}
@keyframes asdf{
from {float: left; width:355px; height:150px; display:block;}
to {float: left; width:160px; height:50px; display:block;}
}
#siteLogo img{width:100%; height:100%;}