Zoom-in Zoom-out img automatically using css only

Question

I have a working demo. just hover the img and there is the effect I want to have.

http://jsfiddle.net/jxgjhzer/1/

As you can see in css file, I don't use any css animation.

Just using CSS transform, I want my img to achieve same effect without hovering it. It should happen automatically.

So how to zoom-in and zoom-out automatically (without animation if possible)?

Code goes here:

.galleryImg{
    height:150px;
    width:100%;
    transform-origin: 50% 50%;
    transition: transform 30s linear;
 }

 .galleryImg:hover{    
    transform: scale(2) rotate(0.1deg);
 }

Answer 1

that's very simple. you can see DEMO on this link on jsfiddle.net

<div class="cardcontainer">
  <img class="galleryImg" src="https://www.google.com/logos/doodles/2014/2014-winter-olympics-5710368030588928-hp.jpg">
</div>

@keyframes zoominoutsinglefeatured {
    0% {
        transform: scale(1,1);
    }
    50% {
        transform: scale(1.2,1.2);
    }
    100% {
        transform: scale(1,1);
    }
}

.cardcontainer img {
    animation: zoominoutsinglefeatured 1s infinite ;
}