@font-face {
    font-family: "Pupilice";
    src: url("../../fonts/CalSans-Regular.ttf") format("truetype");
}


*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    overflow-x:auto;
    overflow-y:visible;
    height:100vh;
    font-family: Pupilice;
}

ul {
    list-style:none;
}

.top-nav {
display: flex;
justify-content: space-evenly; /* ou space-around / space-evenly */
width: 100%;
margin: 0;
padding: 10px 20px;
list-style: none;

position: relative;
top: 10;
left: 0;
background: rgba(0,0,0,0);
    font-size: clamp(10px, 3vw, 25px);
}

.top-nav li a {
color: black;
text-decoration: none;}

.menu-deroulant ul {
    display:none;
    font-size:20px;
}

.menu-deroulant:hover {
        background-color: rgb(180 180 180);
}

.menu-deroulant:hover ul {
    display:block;
    z-index:1;
    position:absolute;
    background-color: rgb(200 200 200);
    width:auto;
}

.menu-deroulant:hover ul li:hover {
    background-color: rgb(0 0 0 /50%);
}

.gallery{
    display:flex;
    gap:40px;
    padding:40px;
    /* height:100%; */
    align-items:flex-start;
    width:max-content;
    overflow-x: auto;
}   

.evenement{
    /* min-width:100vw; */
    /* height:400px; */
    /* width:350px; */
    flex-shrink: 0;
    /* display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column; /* AJOUT */
    font-size:4rem;
}

.evenement img{
/* width:100%; */
height:400px;
width:auto;
object-fit:cover;
/* border-radius:20px; */
display:block;
}


.evenement p{
margin-top:15px;
font-size:2vh;
line-height:1.5;
width:70%;}
