#timer-circle {
    /*position: relative;*/
    width: 50px;
    height: 50px;
    position: absolute;
    right: 30px;   /* el poses una mica més a l'esquerra de la imatge */
    top: 0px;      /* ajusta la posició vertical */
}

#timer-circle svg {
    transform: rotate(-90deg);
}

.circle-bg {
    fill: none;
    stroke: #eee;
    stroke-width: 4;
}

.circle {
    fill: none;
    stroke: #00ff00;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 0 999;
}

.rotate {
    animation: spin 0.3s linear;
}

@keyframes spin {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to   { transform: translate(-50%, -50%) rotate(360deg); }
}