@import './RootStyle.css';

.aboutme-container{
    margin: clamp(30px , 20vh, 250px) auto;
    max-width: 800px;
    width: 80%;
}

.aboutme-container p{
    font-weight: var(--main-font);
    line-height: 1.8;
    opacity: 0; /* Initially hidden */
    transform: translateX(-100%); /* Start from the left */
    transition: transform 0.5s ease, opacity 0.5s ease; /* Smooth transition */
}

.aboutme-container p.active{
    opacity: 1; /* Fully visible when in view */
    transform: translateX(0); /* Move to original position */
}

@media screen and (max-width: 800px){
    .aboutme-container{
        margin: 4vh auto;
        width: 90%;
    }
}