How to fix the child div_3, or rather -img in div_3, when rotating - the parent div_1?

Question

css

Good afternoon!
How to fix child div_3, or rather img in div_3 when rotating - parent div_1?
Structure:

<div_1>
        <div_2>
                 <div_3><img></div_3>
        </div_2>
</div_1>

div_1 {
  -webkit-animation: spin 0.8s infinite linear;
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

!!! .div_3{
position: absolute;
}

Note: Rotates exactly - div_1!
Note_2: If - possible without JS! But.....
Thank you!

Answer 1

no way, change the layout structure and make the elements visually as it should, but without nesting

Answer 2

Rotate div_3 in the opposite direction, as an option.