.firstMotto{
    color:white;
    width:100%;
    font-size:40px;
    font-weight:200;
    padding-top:1%;
}

#imageContainer{
    width:100%;
    display:flex;
    justify-content:center;
}

#image{
    width:70%;
    margin:auto;
}

#imageAndTextContainer{
    display:flex;
    flex-direction:row;
}

#imageContainer2{
    width:15%;
}

#image2{
    width:100%
}

#animatedTextSection{
    padding-top:1%;
    padding-bottom:1%;
}

#motto {
    width:90%;
    font-size: 40px; /* Adjust as needed */
    font-weight: 200; /* Optional */
    background-image: linear-gradient(90deg, #e92449, #f3916b, #b3998b, #767676, #e92449);
    background-size: 200% 100%; /* Moves smoothly and loops seamlessly */
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent; /* Makes the text color transparent */
    animation: gradientMove 8s linear infinite; /* Adjust duration as needed */
}

@keyframes gradientMove {
    0% { background-position: 0% 50%; }
    100% { background-position: -200% 50%; }
}

.section5{
    padding-bottom:3%;
}

@media screen and (max-width:1000px) and (min-width:500px){
    .firstMotto{
        font-size:20px;
        line-height:30px;
    }
    #imageContainer2{
    width:40%;
    justify-content:center;
    align-items:center;
    margin:auto;
}
    #imageAndTextContainer{
    flex-direction:column;
}
#image2{
    margin:auto;

}
    
    #motto{
        font-size:20px;
        line-height:30px;
    }
    
    #image{
    width:100%;
}

}

@media screen and (max-width:500px) and (min-width:300px){
    .firstMotto{
        font-size:25px;
    }
    #imageContainer2{
    width:40%;
    justify-content:center;
    align-items:center;
    margin:auto;
}
    #imageAndTextContainer{
    flex-direction:column;
}
#image2{
    margin:auto;

}
    
    #motto{
        font-size:25px;
    }
    
    #image{
    width:90%;
}

}