	<style>
	 .whyus {
      font-family: Arial, sans-serif;
      background-color: #f5f5f5;
      padding: 20px;
	  width:200%;
	
    }

    .whyus p {
      padding: 14px;
      line-height: 1.6;
      margin: 10px 0;
      color: red;
      animation: colorShift 4s ease-in-out infinite;
      border-radius: 8px;
    }
 .services {
      font-family: Arial, sans-serif;
      background-color: #f5f5f5;
      padding: 20px;
	 
	
    }
.services > div{
background-color:none;
}	
    
	
	.row {
  display: flex;
  gap: 16px; /* optional spacing between boxes */
 
}

.box {
      flex: 1;
      padding: 40px;
      color: white;
      text-align: center;
      border-radius: 10px;
      animation-duration: 2s;
      animation-iteration-count: infinite;
      animation-direction: alternate;
      animation-timing-function: ease-in-out;
    }

    .box1 {
      animation-name: colorAnim1;
    }

    .box2 {
      animation-name: colorAnim2;
    }

    .box3 {
      animation-name: colorAnim3;
    }

    .box4 {
      animation-name: colorAnim4;
    }

    @keyframes colorAnim1 {
      0% { background-color: #60a5fa; } /* blue-400 */
      100% { background-color: #3b82f6; } /* blue-500 */
    }

    @keyframes colorAnim2 {
      0% { background-color: #34d399; } /* green-400 */
      100% { background-color: #10b981; } /* green-500 */
    }

    @keyframes colorAnim3 {
      0% { background-color: #facc15; } /* yellow-400 */
      100% { background-color: #eab308; } /* yellow-500 */
    }

    @keyframes colorAnim4 {
      0% { background-color: #f87171; } /* red-400 */
      100% { background-color: #ef4444; } /* red-500 */
    }
	
	</style>
<!-- TailwindCSS custom slide animations -->
<style>
  @keyframes slideInFromLeft {
    from {
      opacity: 0;
      transform: translateX(-100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  @keyframes slideInFromRight {
    from {
      opacity: 0;
      transform: translateX(100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  .slide-in-left {
    animation: slideInFromLeft 0.7s ease-out forwards;
  }

  .slide-in-right {
    animation: slideInFromRight 0.7s ease-out forwards;
  }
</style>
	