#contact,.social{   
width: 98%;
margin: 0;
padding: 0;
margin-left: 2%;
}

.luna {
position: absolute;
width: 400px;
aspect-ratio: 1/1;
right: 200px;
top:200px
}

#contact{
margin-top: 100px;
height: 15vh;
}

        #message p, .social p{           
        margin: 0;   
        padding: 8px;
        }

        .social-cold p:last-of-type{
        margin: 0; 
        padding-top: -8px;         
        }

    
        
    #email a{
    color: #0E51D8;
    text-decoration: none;
    padding-left: 8px;
    }


 /*social selection animation*/
  
    .social-clem, .social-cold{
    width: fit-content;
    margin-top: 10px;
    }
    
    .social ul{
    width: fit-content;
    height: auto;;  
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: row;   
    }
 
    .social-clem a:nth-child(1) {
    background-image: url(../images/icon/picto/linkedin.webp);
    }
        
    .social-clem a:nth-child(2) {
    background-image: url(../images/icon/picto/youtube.webp);
    }


@media only screen and (max-width: 1200px) {

#contact, .social{   
width: 90%;
margin-left: 10%;
}

.luna {
    width: 300px;
right: 20px;
top:400px
}
        


}