html {
    width: 100%;
    scroll-behavior: smooth;
}

body {
    width: 100%; 
    background-attachment: fixed;
    background:  #BDC0DF;
    font-family: "montserrat-regular";
    color: #2E294E; 
    font-size: 18px;
}

header {
    width: 100%;
    position: fixed;
    z-index: 1;
}

.menu {
    display: flex;
    justify-content:center;
    align-items: center;
    background: #BDC0DF;
    border-bottom: 1px solid #9FA4D1;
}

nav {
    display: flex;
    justify-content:center;
    align-items: center;
    width: 100%;
}

.boutonaccueil {
    display: flex;
    align-items: center;
    transition-duration: 0.5s;
}

.boutonaccueil:hover {
    transform: translateX(5px);
}

.logop {
    width: 60px;
    margin : 12px;
    margin-left: 30px;
}

a {
    font-size: 20px;
    transition-duration: 0.7s;
}

a:hover {
    transform: translateY(5px);
}

h1 {
    text-align: center;
    font-size: 28px; 
}

#presentation {
    padding-top: 80px;
    justify-content: center;
}

.portrait {
    width: 400px;
}

.textepresentation {
    text-align: center;
}

.ptextepresentation {
    padding-left: 10px;
    padding-right: 10px;
}

.fleche {
    transition-duration: 0.7s;
}

.fleche:hover {
    transform: translateY(5px);
    opacity: 0.8;
}

.miseenpagecreations{ 
    list-style: none;  
    padding: 0px;
    margin: 0px;
    display: flex;
    flex-wrap: wrap;   
    justify-content: space-around;
 }

.creations {
    margin: 30px;
    transition-duration: 1s;
}
    
.creations:hover { 
    transform: translateY(20px);
    opacity: 0.8;
}

.titrescreations {
    text-align: center;
    color: #294D4F;
}
   
hrfooter {
    background: #9FA4D1;
}

footer {
    width: 100%;
    text-align: center;
}

.logors {
    margin: 6px;
    transition-duration: 0.7s;
}

.logors:hover {
    transform: translateY(5px); 
    opacity: 0.8;
}

.linkedin {
    width: 30px; 
}

.youtube {
    width: 35px; 
}

.telephone {
    margin-top: 10px;
}

.mail {
    color: #2E294E; 
    transition-duration: 0.7s;
}

.mail:hover {
    transform: translateY(5px); 
}

.copyright{ 
    opacity: 0.7;
}

@media (max-width:992px){
    .boutonaccueil:hover {
    transform: translateX(0px);
    }
    a:hover {
    transform: translateY(0px);
    }
    #presentation {
    padding-top: -20px;    
    }
    .textepresentation {
    padding-left : 30px;
    padding-right : 30px; 
    }
    .fleche:hover {
    transform: translateY(0px);
    opacity: 1;
    }
    .creations:hover { 
    transform: translateY(0px);
    opacity: 1;
    }
    .logors:hover {
    transform: translateY(0px); 
    opacity: 1;
    }
    .mail:hover {
    transform: translateY(0px); 
    }
}

@media (max-width:500px){
    .fleche {
    padding-top: 50px;
    } 
}

@font-face {
    font-family: 'montserrat-regular';
    src: url("police/montserrat/Montserrat-Regular.ttf");
}