@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
body{
    font-family: 'Dancing Script', cursive;
    font-size: 40px;
    color: chocolate;
    background-color: pink;

}
img{ 
    width: 25%;
    height: 400px;
 
}

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

video {
  animation: spin 6.3s linear infinite; /* Applies the 'spin' animation */
  /* 2s: duration of one rotation */
  /* linear: animation speed is constant */
  /* infinite: animation repeats indefinitely */
}
#smile {
    /* Set initial size and center the scaling transformation */
   
    
    /* Ensure the transform origin is centered (default, but good practice) */
    transform-origin: center center;
    /* Apply the animation */
    animation-name: growShrink;
    animation-duration: 0.95s; /* Time for one full cycle */
    animation-iteration-count: infinite; /* Loop indefinitely */
    animation-timing-function: ease-in-out; /* Smooth start and end */

}
#pepper{ 

  transform-origin: center center ;
 
  animation-name: growShrink;
  animation-delay: 0.475s;
  animation-duration: 0.95s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}
@keyframes growShrink {
    0% {
        transform: scale(0.6); /* Original size */
    }
    50% {
        transform: scale(1.2); /* Grows to 120% size */
    }
    100% {
        transform: scale(0.6); /* Returns to original size */
    }
}