.section29 {
    background-color: #ffffff;
    padding: 0 0 0 0; /*top right bottom left*/
    margin: 0 0 0 0;
}

.section29_container {
    width: 500px;
    height: 500px;
    margin: 0 auto; /*first 0 is top and bottom, second 0 is left and right */
    margin-top: 100px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; /*or repeat(3, 1fr)*/
    grid-template-rows: 1fr 1fr 1fr; /*or repeat(3, 1fr)*/
    grid-template:
    'A A B'
    'C D B'
    'C E E';
    gap: 10px;
}

@media screen and (max-width: 1200px) {
    .section29_container {
        width:  350px;
        height: 350px;
        gap: 8px;
    }
    
}
.section29_items:nth-child(1){
    grid-area: A;
}
.section29_items:nth-child(2){
    grid-area: B;
}
.section29_items:nth-child(3){
    grid-area: C;
}
.section29_items:nth-child(4){
    grid-area: D;
}
.section29_items:nth-child(5){
    grid-area: E;
}

.section29_items {
    overflow: hidden;
    border: 2px solid #000000;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform 0.3s ease-in-out; /* Smooth transition for scaling */
}

.section29_items img {
    width: 260%;
    height: 260%;
    object-fit: cover;
}

@keyframes rotation {
    to{
        transform: rotate(360deg);
    }
}

@keyframes rotation_image {
    to {
        transform: rotate(-360deg);
    }
    
}

/*variable form*/
@keyframes rotation {
    to{
        transform: rotate(var(--rotation));
    }
}

.section29_container{
    --rotation: 360deg;
    animation: rotation 10s infinite linear;
}

.section29_container:hover,
.section29_container:hover .section29_items img,
.section29_items img:hover {
    animation-play-state: paused;
}

.section29_items:hover {
    transform: scale(1.2); /* Scale up by 20% */
    z-index: 9999;
}

.section29_items img{
    transition: transform 0.3s ease-in-out; /* Smooth transition for scaling */
    animation: rotation_image 10s infinite linear;
    --rotation: -360deg; /* this use the variable form , in old browsers it will not work */
    animation: rotation 10s infinite linear;
}