@media (min-width: 375px) and (max-width: 768px) {
    #intro{
     max-width: 68%;
    }
    
    #profile-picture{
     max-width: 25%;
    }
 
    #header{
     gap: 0.5rem;
     margin-top: 3rem;
    }
 
    #header > h1{
     text-align: center;
    }
 
    /* #app{
     background-image: linear-gradient(to bottom, #a855f7, #6366f1, #ec4899);
     } */
 }
 
 @media (min-width: 769px) and (max-width: 1024px) {
     #profile-picture{
         max-width: 15%;
     }
 
     #header{
         gap: 1.5rem;
     }
 
     #intro{
         max-width: 40%;
     }
 }
 
 @media (max-width: 374px) {
     #intro{
         max-width: 70%;
     }
 
     #profile-picture{
         max-width: 22%;
     }
 
     #header{
         gap: 0.8rem;
         margin-top: 3rem;
     }

    nav ul li {
        text-align: center;
    }
 }
 
 /* @media (max-width: 360px) {
     #app{
     background-image: linear-gradient(to bottom, #a855f7, #6366f1, #ec4899);
     }
 } */