about.css

body {
    background: #020617;
    
      font-family: 'Cherry Swash', serif
   !important;
  
  }
@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}
.first-text, .second-text , .third-text {
    opacity: 0; /* Hide all texts before the animation starts */
    animation-fill-mode: forwards; /* Keep the final state after the animation ends */
}

.first-text {
    animation: fadeIn 0.7s ease-in-out forwards; /* First text appears immediately */
}

.second-text {
    animation: fadeIn 0.7s ease-in-out forwards 0.7s; /* Second text appears after 0.7s */
}
.third-text {
    animation: fadeSlideIn 0.7s ease-in-out forwards 1.4s; /* Second text appears after 0.7s */
}

@keyframes fadeIn {
    0% {
        opacity: 0;
       
    }
    100% {
        opacity: 1;
       
    }
}
@keyframes fadeSlideIn {
    0% {
        opacity: 0;
        transform: translateY(30px); 
    }
    100% {
        opacity: 1;
        transform: translateX(0); /* Move the text back to its original position */
    }
}



.contact-btn  {
    opacity: 0;
    animation: fadeSlideIn 1s ease-in-out 1.5s forwards,pulse 1s infinite;
    box-shadow: 0px 10px 20px rgba(255, 193, 7, 0.6);
}
#text{
    font-size: 22px !important;
}



@media (max-width: 500px) {
    #text {
      font-size: 14px !important;
      white-space: normal !important;
      overflow-wrap: break-word !important;
    }
    .text2 {
      font-size: 10px !important;
    }
    #name {
      height: 45px !important;
    }
  }