html{ scroll-behavior: smooth;}

body { 
    margin:0;
    padding:0;
    background-color: #f1f1f1; 
    font-family: 'Rajdhani', sans-serif;  
    font-weight: 400;
    width:100vw;
	min-height: 100vh;
    overflow-x: hidden;
}

h1 {font-family: "DM Sans", sans-serif;
    font-size: calc(2vmin + 13px); 
    text-align: center;
    margin:0 auto;
    padding-top:4%;
}
h2{ font-family: "DM Sans", sans-serif;
    font-size: calc(1vmin + 14px);
    font-weight:400; 
    color:rgb(104, 53, 53);
    border-bottom:1px solid #666666;
    text-transform: uppercase;
    text-align: left;
    letter-spacing:-1px; 
    margin: 2% auto;
}
h3{ font-size: calc(1vmin + 8px);
    font-family: "DM Sans", sans-serif;
    font-weight:500; 
}

a { color:#000000;
    text-decoration: none;
 }

a:hover {
    color: rgb(176, 45, 45);
    text-decoration: none;
}

.boutonensavoirplus{     
    border: 1px solid rgba(0, 0, 0, 0.1); 
    box-shadow: 7px 5px 5px rgb(22, 34, 59);
    font-size: calc(1vmin + 11px);    
    box-sizing: border-box;
    cursor: pointer;
    align-self: center;  
    margin: 3%;
    padding:1% 2%;
    text-decoration: none;
    transition: all 250ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation; 
}
    
.boutonensavoirplus:hover,
.boutonensavoirplus:focus {
    border-color: rgba(0, 0, 0, 0.15);
    box-shadow: rgba(0, 0, 0, 0.1) 0 4px 12px;
    color: rgba(0, 0, 0, 0.65);
}    
.boutonensavoirplus:hover {
    transform: translateY(-2px);
}
.boutonensavoirplus:active {
    background-color: #F0F0F1;
    border-color: rgba(0, 0, 0, 0.15);
    box-shadow: rgba(0, 0, 0, 0.06) 0 2px 4px;
    color: rgba(0, 0, 0, 0.65);
    transform: translateY(0);
}
/*header*/
.bandeau_header{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    background-color: #93220e;
    color:#f1f1f1;
    font-size: 18px;
    padding: 1%;
}
.mail, .tel{
    display: flex;
}
.header{ 
    display:flex;
    flex-direction: column;
    background: #f1f1f1;
    top:0;
    width: 100%;
    z-index: 10;
    margin-top: 1%;
}

.contenu_titre_header { /*logo+texte+sous-texte*/
    display: grid ;
    grid-template-columns: 1fr 3fr;
    grid-template-rows: 7vh 7vh;
    margin: 0 auto;
    color:#273129;
    padding-bottom: 2%;
}
.logo_elowup{
    grid-area:1/1/span 2 ;
    max-width: 120px;
    width: 100%;
    max-height: 120px;
}
.contenu_titre_header h2{  /*texte*/
    grid-area:1/2/span 1/span 4 ;
    align-self: end; 
}
.contenu_titre_header h3{
    grid-area:2/2/span 1/span 4 ;
    font-size: calc(0.7vmin + 18px);
    text-align: right;
    align-self: center;
}

.barrenavigation { 
    background-color: #0f5a21;
    width:100%;
    z-index: 12;
}
ul.navbar{
    list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
}
.navbar { 
    display: flex;
    flex-direction:row ;
    gap:3%;
    margin-left: 4%;
    padding: 1% 0 1% 2%;
}  
.nav-link { /*titres seuls*/
    display:block; 
    color: #f1f1f1;
    text-decoration: none;
    font-family: 'Rajdhani', sans-serif; 
    white-space : nowrap;
    text-shadow: 1px 1px 1px #000000;
}
.fixed  {
    position:fixed; 
    top:0;
}
.fixed + .superconteneur{
    padding-top:150px;
}
.contact{
    color: rgb(184, 218, 228);
}

/*footer*/
footer {
    color:#f1f1f1;
    background-image: radial-gradient(circle at 84% 82%, rgba(217, 217, 217,0.03) 0%, rgba(217, 217, 217,0.03) 21%,transparent 21%, transparent 100%),radial-gradient(circle at 75% 56%, rgba(3, 3, 3,0.03) 0%, rgba(3, 3, 3,0.03) 30%,transparent 30%, transparent 100%),radial-gradient(circle at 74% 53%, rgba(153, 153, 153,0.03) 0%, rgba(153, 153, 153,0.03) 95%,transparent 95%, transparent 100%),radial-gradient(circle at 86% 43%, rgba(209, 209, 209,0.03) 0%, rgba(209, 209, 209,0.03) 83%,transparent 83%, transparent 100%),radial-gradient(circle at 64% 88%, rgba(192, 192, 192,0.03) 0%, rgba(192, 192, 192,0.03) 2%,transparent 2%, transparent 100%),radial-gradient(circle at 73% 77%, rgba(205, 205, 205,0.03) 0%, rgba(205, 205, 205,0.03) 18%,transparent 18%, transparent 100%),radial-gradient(circle at 57% 51%, rgba(161, 161, 161,0.03) 0%, rgba(161, 161, 161,0.03) 64%,transparent 64%, transparent 100%),radial-gradient(circle at 40% 84%, rgba(115, 115, 115,0.03) 0%, rgba(115, 115, 115,0.03) 14%,transparent 14%, transparent 100%),linear-gradient(135deg, #000000ba,rgb(22, 34, 59));
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 2% 0 1% 0;
}  
.logo_elowup1{
    background-color: #F0F0F1;
    background-position:70%;
    border-radius: 20% ;
}
.mentions{
    font-size: 12px;
    text-decoration: underline;
}
.mentions a{
    color: #f1f1f1;
}

@media  all  and (max-width:700px){
    footer{
        display: flex;
        flex-direction: column-reverse;
    }
    .text-center{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    }
@media  all  and (max-width:600px){

   /*header*/
    .header{ 
        display:block; 
    }
    .bandeau_header{
        display: grid;
    }
    .contenu_titre_header { /*logo+texte+sous-texte*/
        display: block ;
        padding:0 1vw 0 2vw;
    }
    .navbar { 
        display: block;
        padding:0.4%;
    }
    .nav-link { /*titres seuls*/
        font-size: 18px;
       margin:1.2%;
    }
}