<div class="social-popout">

<a href="https://twitter.com/probsteizella"><img src="http://zella.de/code/bilder/twitter-48circle.png" /></a>

</div>

<div class="social-popout">

<a href="https://www.facebook.com/probsteizella"><img src="http://zella.de/code/bilder/facebook-48circle.png" /></a>

</div>

<div class="social-popout">

<a href="https://plus.google.com/+probsteizella/"><img src="http://zella.de/code/bilder/googleplus-48circle.png" /></a>

</div>

.social-popout {

height: 48px;

width: 48px;

margin: 15px 10px;

float: left;

-webkit-transition: all ease 0.5s;

-moz-transition: all ease 0.5s;

-o-transition: all ease 0.5s;

-ms-transition: all ease 0.5s;

transition: all ease 0.5s;

}

.social-popout img {

border-radius: 50%;

margin: 8px;

width: 100%;

box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.8);

-webkit-transition: all ease 0.5s;

-moz-transition: all ease 0.5s;

-o-transition: all ease 0.5s;

-ms-transition: all ease 0.5s;

transition: all ease 0.5s;

}

.social-popout img:hover {

margin: 0px;

box-shadow: 6px 6px 4px 4px rgba(0,0,0,0.3);

}

<div class="social-roll">

<a href="https://twitter.com/probsteizella"><img src="http://zella.de/code/bilder/twitter-48circle.png" /></a>

</div>

<div class="social-roll">

<a href="https://www.facebook.com/probsteizella"><img src="http://zella.de/code/bilder/facebook-48circle.png" /></a>

</div>

<div class="social-roll">

<a href="https://plus.google.com/+probsteizella/"><img src="http://zella.de/code/bilder/googleplus-48circle.png" /></a>

</div>

.social-roll {

background-image: url('path/to/gray/image.png');

height: 48px;

width: 48px;

margin: 10px;

float: left;

border-radius: 50%;

-webkit-transition: all ease 0.3s;

-moz-transition: all ease 0.3s;

-o-transition: all ease 0.3s;

-ms-transition: all ease 0.3s;

transition: all ease 0.3s;

}

.social-roll:hover {

background-image: url('path/to/color/image.png');

box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.8);

-webkit-transform:rotate(360deg);

-moz-transform:rotate(360deg);

-o-transform:rotate(360deg);

-ms-transform:rotate(360deg);

transform:rotate(360deg);

}