Как убрать отступы @keyframes

Нужно разместь анимацию в центр экрана, при подключении @keyframes, центральный блок смещается. Почему @keyframes добавляет отступы?

    margin: 0;
    padding: 0;
}

.container{
    position: fixed;
    top: 0;
    left: 0;
    min-width: 100%;
    min-height: 100%;
    background: #228b22;
    
}


section {
    background: black;
    color: white;
    border-radius: 1em;
    padding: 1em;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) ;
    animation: rotate 5s infinite;

}

@keyframes rotate {
    
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotateX(360deg);
    }
    
}