.iengrane {
    display: block;
    position:relative;
    width: 30px;
    height: 30px;
    top: 23px;
    right:  14px;
    background: url(../img/iconos/engraneblanco30x30.png);
    -webkit-animation: barrelRoll 5s infinite linear;
    -webkit-animation-play-state: paused;
}

.iengrane:last-of-type {
    top: 10px;
    right: -8px;
    -webkit-animation-name: invertBarrelRoll;
}

.divengrane > i {
    
    -webkit-animation-play-state: running;
}

@-webkit-keyframes barrelRoll {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@-webkit-keyframes invertBarrelRoll {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(-360deg); }
}