@font-face {
    font-family: 'HersheyNoaillesTimesSimplexBold';
    src: url('../fonts/Hershey-Noailles-Times-Simplex-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HersheyNoaillesTimesDuplexBoldItalic';
    src: url('../fonts/Hershey-Noailles-Times-Duplex-Italic-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HersheyNoaillesFuturaDuplexRegular';
    src: url('../fonts/Hershey-Noailles-Futura-Duplex-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HersheyNoaillesFuturaSimplexBold';
    src: url('../fonts/Hershey-Noailles-Futura-Simplex-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HersheyNoaillesHelpmeBold';
    src: url('../fonts/Hershey-Noailles-HelpMe-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'resistance';
    src: url('../fonts/resistance_generale-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');

html {
    font-size: 16px;
  }

body {
    margin: 0;
    padding: 0;
    background-color: black;
    
}

/* HEADER menu */

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10000;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row-reverse;
    box-shadow: 0px 0px 10px black;
    background: black;
}

header::after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 10px; /* Hauteur de la bordure floue */
    background: black;
    filter: blur(5px); /* Flou gaussien pour la bordure */
}

/* lie, */
a{
    text-decoration: none;
    z-index: 1000;
    color: white;
    position: relative;
    mix-blend-mode: difference;
}

/* élie bolard menu */

h1{
    font-size: 1.5rem;
    text-align: right;
    padding: 0.8rem;
    margin: 0em;
    font-family: 'HersheyNoaillesTimesDuplexBoldItalic', sans-serif;
    color: white;
}

h1 a{
    font-family: 'HersheyNoaillesTimesDuplexBoldItalic', sans-serif;
    font-size: 1.5rem;
    line-height: 1rem;
}

nav{
    padding-left: 1.5rem;
    font-size: 1.5rem;
    padding-top: 0.8rem;
    font-family: "Work Sans", sans-serif;
    text-align: left;
    display: flex;
}

li{
    list-style-type: none;
    margin-right: 1.5rem;
}

ul{
    padding-inline-start: 0em;
    margin: 0;
}

header ul{
    display: flex;
}

/* LISTE PROJETS/WORKSHOP/ETC */

main li:hover{
    font-family: 'HersheyNoaillesTimesDuplexBoldItalic', sans-serif;
}

main{
    font-family: 'HersheyNoaillesFuturaSimplexBold', sans-serif;
    font-size: 6rem;
    line-height: 6rem;
    padding-left: 1.5rem;
    padding-top: 15rem;
    /* height: 100vh; */
}

ul:hover img {
    opacity: 1; /* Rend l'image visible au survol de la liste */
}

/* TEMPLATE PROJET */

.title{
    font-family: 'HersheyNoaillesFuturaSimplexBold', sans-serif;
    font-size: 6rem;
    line-height: 6rem;
    margin-bottom: 1.5rem;
    color: white;
  }

  .retour{
    font-size: 3rem;
    padding-top: 1.5rem;
    
  }

  .text-descr{
  position: absolute;
  right: 1.5rem;
  width: 20%;
  overflow-y: auto;
  }

  strong{
    font-family: 'HersheyNoaillesTimesDuplexBoldItalic', sans-serif;
  }

  video{
    margin-right: 1rem;
    height: 100%;
    object-fit: cover;
  }

  p{
    color: white;
    margin: 0;
    font-family: "Work Sans", sans-serif;
  }


/* PAGE DEFAULT (LISTE WORKS/WORKSHOP/ETC) */

#code_default{
    position: absolute;
    z-index: 0;
    color: #303030;
    padding: 20px;
    width: 100%;
    font-family: 'HersheyNoaillesFuturaSimplexBold';
    line-height: 1rem;
    overflow-wrap: break-word; /* Permet d'aller à la ligne automatiquement si un mot est trop long */
    word-wrap: break-word; /* Pour compatibilité avec les anciens navigateurs */
    box-sizing: border-box; /* Inclut le padding et la bordure dans la largeur totale */
    }

    .slide{
        display: flex;
        overflow: scroll;
        width: 75%;
        height: 40vh;
      }

    #slider {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 1;
    }


/* PAGE INTRO */


#code_intro{
    position: absolute;
    font-size: 1rem;
    z-index: 1;
    padding: 20px;
    color: white;
    overflow: hidden;
    width: 100%;
    font-family: 'HersheyNoaillesFuturaSimplexBold';
    word-wrap: break-word;
    box-sizing: border-box;
}

.scatter {
    display: inline-block;
    position: relative;
    cursor: pointer;
    color: white;
    font-size: 5rem;
    padding: 10px;
    border-radius: 5px;
    z-index: 1;
    font-family: 'HersheyNoaillesFuturaSimplexBold';
}
.scatter span {
    display: inline-block;
    position: relative;
    transition: transform 1s;
}
.scatter span.scatter-active {
    position: absolute;
}

#test{
    background-color: black;
    /* padding: 1.5rem;
    filter: blur(10px); /* Flou gaussien pour la bordure */  */
    display: flex;
    align-items: center;
    text-shadow: rgb(178, 0, 255) 20px 0px 0px, rgb(178, 0, 255) 19.975px 0.999583px 0px, rgb(178, 0, 255) 19.9001px 1.99667px 0px, rgb(178, 0, 255) 19.7754px 2.98876px 0px, rgb(178, 0, 255) 19.6013px 3.97339px 0px, rgb(178, 0, 255) 19.3782px 4.94808px 0px, rgb(178, 0, 255) 19.1067px 5.9104px 0px, rgb(178, 0, 255) 18.7875px 6.85796px 0px, rgb(178, 0, 255) 18.4212px 7.78837px 0px, rgb(178, 0, 255) 18.0089px 8.69931px 0px, rgb(178, 0, 255) 17.5517px 9.58851px 0px, rgb(178, 0, 255) 17.0505px 10.4537px 0px, rgb(178, 0, 255) 16.5067px 11.2928px 0px, rgb(178, 0, 255) 15.9217px 12.1037px 0px, rgb(178, 0, 255) 15.2968px 12.8844px 0px, rgb(178, 0, 255) 14.6338px 13.6328px 0px, rgb(178, 0, 255) 13.9341px 14.3471px 0px, rgb(178, 0, 255) 13.1997px 15.0256px 0px, rgb(178, 0, 255) 12.4322px 15.6665px 0px, rgb(178, 0, 255) 11.6337px 16.2683px 0px, rgb(178, 0, 255) 10.806px 16.8294px 0px, rgb(178, 0, 255) 9.95142px 17.3485px 0px, rgb(178, 0, 255) 9.07192px 17.8241px 0px, rgb(178, 0, 255) 8.16975px 18.2553px 0px, rgb(178, 0, 255) 7.24716px 18.6408px 0px, rgb(178, 0, 255) 6.30645px 18.9797px 0px, rgb(178, 0, 255) 5.34998px 19.2712px 0px, rgb(178, 0, 255) 4.38013px 19.5145px 0px, rgb(178, 0, 255) 3.39934px 19.709px 0px, rgb(178, 0, 255) 2.41006px 19.8543px 0px, rgb(178, 0, 255) 1.41474px 19.9499px 0px, rgb(178, 0, 255) 0.415897px 19.9957px 0px, rgb(178, 0, 255) -0.58399px 19.9915px 0px, rgb(178, 0, 255) -1.58242px 19.9373px 0px, rgb(178, 0, 255) -2.57689px 19.8333px 0px, rgb(178, 0, 255) -3.56492px 19.6797px 0px, rgb(178, 0, 255) -4.54404px 19.477px 0px, rgb(178, 0, 255) -5.51181px 19.2255px 0px, rgb(178, 0, 255) -6.46579px 18.926px 0px, rgb(178, 0, 255) -7.40362px 18.5792px 0px, rgb(178, 0, 255) -8.32294px 18.1859px 0px, rgb(178, 0, 255) -9.22145px 17.7472px 0px, rgb(178, 0, 255) -10.0969px 17.2642px 0px, rgb(178, 0, 255) -10.9472px 16.738px 0px, rgb(178, 0, 255) -11.77px 16.1699px 0px, rgb(178, 0, 255) -12.5635px 15.5615px 0px, rgb(178, 0, 255) -13.3255px 14.9141px 0px, rgb(178, 0, 255) -14.0543px 14.2295px 0px, rgb(178, 0, 255) -14.7479px 13.5093px 0px, rgb(178, 0, 255) -15.4046px 12.7553px 0px, rgb(178, 0, 255) -16.0229px 11.9694px 0px, rgb(178, 0, 255) -16.6011px 11.1537px 0px, rgb(178, 0, 255) -17.1378px 10.31px 0px, rgb(178, 0, 255) -17.6316px 9.44061px 0px, rgb(178, 0, 255) -18.0814px 8.5476px 0px, rgb(178, 0, 255) -18.486px 7.63322px 0px, rgb(178, 0, 255) -18.8444px 6.69976px 0px, rgb(178, 0, 255) -19.1557px 5.74956px 0px, rgb(178, 0, 255) -19.4192px 4.78499px 0px, rgb(178, 0, 255) -19.634px 3.80845px 0px, rgb(178, 0, 255) -19.7999px 2.8224px 0px, rgb(178, 0, 255) -19.9162px 1.82929px 0px, rgb(178, 0, 255) -19.9827px 0.831613px 0px, rgb(178, 0, 255) -19.9993px -0.168145px 0px, rgb(178, 0, 255) -19.9659px -1.16748px 0px, rgb(178, 0, 255) -19.8826px -2.1639px 0px, rgb(178, 0, 255) -19.7496px -3.15491px 0px, rgb(178, 0, 255) -19.5672px -4.13804px 0px, rgb(178, 0, 255) -19.336px -5.11082px 0px, rgb(178, 0, 255) -19.0564px -6.07083px 0px, rgb(178, 0, 255) -18.7291px -7.01566px 0px, rgb(178, 0, 255) -18.3551px -7.94296px 0px, rgb(178, 0, 255) -17.9352px -8.85041px 0px, rgb(178, 0, 255) -17.4704px -9.73573px 0px, rgb(178, 0, 255) -16.962px -10.5967px 0px, rgb(178, 0, 255) -16.4112px -11.4312px 0px, rgb(178, 0, 255) -15.8194px -12.2372px 0px, rgb(178, 0, 255) -15.188px -13.0125px 0px, rgb(178, 0, 255) -14.5186px -13.7553px 0px, rgb(178, 0, 255) -13.813px -14.4638px 0px, rgb(178, 0, 255) -13.0729px -15.1361px 0px, rgb(178, 0, 255) -12.3px -15.7705px 0px, rgb(178, 0, 255) -11.4965px -16.3655px 0px, rgb(178, 0, 255) -10.6642px -16.9197px 0px, rgb(178, 0, 255) -9.80522px -17.4315px 0px, rgb(178, 0, 255) -8.92175px -17.8998px 0px, rgb(178, 0, 255) -8.01598px -18.3233px 0px, rgb(178, 0, 255) -7.09018px -18.7011px 0px, rgb(178, 0, 255) -6.14666px -19.032px 0px, rgb(178, 0, 255) -5.18777px -19.3155px 0px, rgb(178, 0, 255) -4.21592px -19.5506px 0px, rgb(178, 0, 255) -3.23352px -19.7369px 0px, rgb(178, 0, 255) -2.24305px -19.8738px 0px, rgb(178, 0, 255) -1.24697px -19.9611px 0px, rgb(178, 0, 255) -0.247773px -19.9985px 0px, rgb(178, 0, 255) 0.752043px -19.9859px 0px, rgb(178, 0, 255) 1.74998px -19.9233px 0px, rgb(178, 0, 255) 2.74354px -19.8109px 0px, rgb(178, 0, 255) 3.73025px -19.6491px 0px, rgb(178, 0, 255) 4.70763px -19.4381px 0px, rgb(178, 0, 255) 5.67324px -19.1785px 0px, rgb(178, 0, 255) 6.62468px -18.871px 0px, rgb(178, 0, 255) 7.55956px -18.5163px 0px, rgb(178, 0, 255) 8.47554px -18.1153px 0px, rgb(178, 0, 255) 9.37033px -17.6691px 0px, rgb(178, 0, 255) 10.2417px -17.1787px 0px, rgb(178, 0, 255) 11.0875px -16.6453px 0px, rgb(178, 0, 255) 11.9056px -16.0704px 0px, rgb(178, 0, 255) 12.6939px -15.4553px 0px, rgb(178, 0, 255) 13.4504px -14.8015px 0px, rgb(178, 0, 255) 14.1734px -14.1108px 0px, rgb(178, 0, 255) 14.8609px -13.3848px 0px, rgb(178, 0, 255) 15.5113px -12.6253px 0px, rgb(178, 0, 255) 16.1229px -11.8343px 0px, rgb(178, 0, 255) 16.6943px -11.0137px 0px, rgb(178, 0, 255) 17.2238px -10.1656px 0px, rgb(178, 0, 255) 17.7104px -9.29204px 0px, rgb(178, 0, 255) 18.1527px -8.39528px 0px, rgb(178, 0, 255) 18.5496px -7.47753px 0px, rgb(178, 0, 255) 18.9001px -6.5411px 0px, rgb(178, 0, 255) 19.2034px -5.58831px 0px, rgb(178, 0, 255) 19.4587px -4.62156px 0px, rgb(178, 0, 255) 19.6654px -3.64325px 0px, rgb(178, 0, 255) 19.8229px -2.65584px 0px, rgb(178, 0, 255) 19.9308px -1.66179px 0px, rgb(178, 0, 255) 19.989px -0.663584px 0px;
}

#test:hover{
    background-color: transparent;
    filter: blur(0px);
    color: rgb(178, 0, 255);
    text-shadow: rgb(255, 255, 255) 20px 0px 0px, rgb(255, 255, 255) 19.975px 0.999583px 0px, rgb(255, 255, 255) 19.9001px 1.99667px 0px, rgb(255, 255, 255) 19.7754px 2.98876px 0px, rgb(255, 255, 255) 19.6013px 3.97339px 0px, rgb(255, 255, 255) 19.3782px 4.94808px 0px, rgb(255, 255, 255) 19.1067px 5.9104px 0px, rgb(255, 255, 255) 18.7875px 6.85796px 0px, rgb(255, 255, 255) 18.4212px 7.78837px 0px, rgb(255, 255, 255) 18.0089px 8.69931px 0px, rgb(255, 255, 255) 17.5517px 9.58851px 0px, rgb(255, 255, 255) 17.0505px 10.4537px 0px, rgb(255, 255, 255) 16.5067px 11.2928px 0px, rgb(255, 255, 255) 15.9217px 12.1037px 0px, rgb(255, 255, 255) 15.2968px 12.8844px 0px, rgb(255, 255, 255) 14.6338px 13.6328px 0px, rgb(255, 255, 255) 13.9341px 14.3471px 0px, rgb(255, 255, 255) 13.1997px 15.0256px 0px, rgb(255, 255, 255) 12.4322px 15.6665px 0px, rgb(255, 255, 255) 11.6337px 16.2683px 0px, rgb(255, 255, 255) 10.806px 16.8294px 0px, rgb(255, 255, 255) 9.95142px 17.3485px 0px, rgb(255, 255, 255) 9.07192px 17.8241px 0px, rgb(255, 255, 255) 8.16975px 18.2553px 0px, rgb(255, 255, 255) 7.24716px 18.6408px 0px, rgb(255, 255, 255) 6.30645px 18.9797px 0px, rgb(255, 255, 255) 5.34998px 19.2712px 0px, rgb(255, 255, 255) 4.38013px 19.5145px 0px, rgb(255, 255, 255) 3.39934px 19.709px 0px, rgb(255, 255, 255) 2.41006px 19.8543px 0px, rgb(255, 255, 255) 1.41474px 19.9499px 0px, rgb(255, 255, 255) 0.415897px 19.9957px 0px, rgb(255, 255, 255) -0.58399px 19.9915px 0px, rgb(255, 255, 255) -1.58242px 19.9373px 0px, rgb(255, 255, 255) -2.57689px 19.8333px 0px, rgb(255, 255, 255) -3.56492px 19.6797px 0px, rgb(255, 255, 255) -4.54404px 19.477px 0px, rgb(255, 255, 255) -5.51181px 19.2255px 0px, rgb(255, 255, 255) -6.46579px 18.926px 0px, rgb(255, 255, 255) -7.40362px 18.5792px 0px, rgb(255, 255, 255) -8.32294px 18.1859px 0px, rgb(255, 255, 255) -9.22145px 17.7472px 0px, rgb(255, 255, 255) -10.0969px 17.2642px 0px, rgb(255, 255, 255) -10.9472px 16.738px 0px, rgb(255, 255, 255) -11.77px 16.1699px 0px, rgb(255, 255, 255) -12.5635px 15.5615px 0px, rgb(255, 255, 255) -13.3255px 14.9141px 0px, rgb(255, 255, 255) -14.0543px 14.2295px 0px, rgb(255, 255, 255) -14.7479px 13.5093px 0px, rgb(255, 255, 255) -15.4046px 12.7553px 0px, rgb(255, 255, 255) -16.0229px 11.9694px 0px, rgb(255, 255, 255) -16.6011px 11.1537px 0px, rgb(255, 255, 255) -17.1378px 10.31px 0px, rgb(255, 255, 255) -17.6316px 9.44061px 0px, rgb(255, 255, 255) -18.0814px 8.5476px 0px, rgb(255, 255, 255) -18.486px 7.63322px 0px, rgb(255, 255, 255) -18.8444px 6.69976px 0px, rgb(255, 255, 255) -19.1557px 5.74956px 0px, rgb(255, 255, 255) -19.4192px 4.78499px 0px, rgb(255, 255, 255) -19.634px 3.80845px 0px, rgb(255, 255, 255) -19.7999px 2.8224px 0px, rgb(255, 255, 255) -19.9162px 1.82929px 0px, rgb(255, 255, 255) -19.9827px 0.831613px 0px, rgb(255, 255, 255) -19.9993px -0.168145px 0px, rgb(255, 255, 255) -19.9659px -1.16748px 0px, rgb(255, 255, 255) -19.8826px -2.1639px 0px, rgb(255, 255, 255) -19.7496px -3.15491px 0px, rgb(255, 255, 255) -19.5672px -4.13804px 0px, rgb(255, 255, 255) -19.336px -5.11082px 0px, rgb(255, 255, 255) -19.0564px -6.07083px 0px, rgb(255, 255, 255) -18.7291px -7.01566px 0px, rgb(255, 255, 255) -18.3551px -7.94296px 0px, rgb(255, 255, 255) -17.9352px -8.85041px 0px, rgb(255, 255, 255) -17.4704px -9.73573px 0px, rgb(255, 255, 255) -16.962px -10.5967px 0px, rgb(255, 255, 255) -16.4112px -11.4312px 0px, rgb(255, 255, 255) -15.8194px -12.2372px 0px, rgb(255, 255, 255) -15.188px -13.0125px 0px, rgb(255, 255, 255) -14.5186px -13.7553px 0px, rgb(255, 255, 255) -13.813px -14.4638px 0px, rgb(255, 255, 255) -13.0729px -15.1361px 0px, rgb(255, 255, 255) -12.3px -15.7705px 0px, rgb(255, 255, 255) -11.4965px -16.3655px 0px, rgb(255, 255, 255) -10.6642px -16.9197px 0px, rgb(255, 255, 255) -9.80522px -17.4315px 0px, rgb(255, 255, 255) -8.92175px -17.8998px 0px, rgb(255, 255, 255) -8.01598px -18.3233px 0px, rgb(255, 255, 255) -7.09018px -18.7011px 0px, rgb(255, 255, 255) -6.14666px -19.032px 0px, rgb(255, 255, 255) -5.18777px -19.3155px 0px, rgb(255, 255, 255) -4.21592px -19.5506px 0px, rgb(255, 255, 255) -3.23352px -19.7369px 0px, rgb(255, 255, 255) -2.24305px -19.8738px 0px, rgb(255, 255, 255) -1.24697px -19.9611px 0px, rgb(255, 255, 255) -0.247773px -19.9985px 0px, rgb(255, 255, 255) 0.752043px -19.9859px 0px, rgb(255, 255, 255) 1.74998px -19.9233px 0px, rgb(255, 255, 255) 2.74354px -19.8109px 0px, rgb(255, 255, 255) 3.73025px -19.6491px 0px, rgb(255, 255, 255) 4.70763px -19.4381px 0px, rgb(255, 255, 255) 5.67324px -19.1785px 0px, rgb(255, 255, 255) 6.62468px -18.871px 0px, rgb(255, 255, 255) 7.55956px -18.5163px 0px, rgb(255, 255, 255) 8.47554px -18.1153px 0px, rgb(255, 255, 255) 9.37033px -17.6691px 0px, rgb(255, 255, 255) 10.2417px -17.1787px 0px, rgb(255, 255, 255) 11.0875px -16.6453px 0px, rgb(255, 255, 255) 11.9056px -16.0704px 0px, rgb(255, 255, 255) 12.6939px -15.4553px 0px, rgb(255, 255, 255) 13.4504px -14.8015px 0px, rgb(255, 255, 255) 14.1734px -14.1108px 0px, rgb(255, 255, 255) 14.8609px -13.3848px 0px, rgb(255, 255, 255) 15.5113px -12.6253px 0px, rgb(255, 255, 255) 16.1229px -11.8343px 0px, rgb(255, 255, 255) 16.6943px -11.0137px 0px, rgb(255, 255, 255) 17.2238px -10.1656px 0px, rgb(255, 255, 255) 17.7104px -9.29204px 0px, rgb(255, 255, 255) 18.1527px -8.39528px 0px, rgb(255, 255, 255) 18.5496px -7.47753px 0px, rgb(255, 255, 255) 18.9001px -6.5411px 0px, rgb(255, 255, 255) 19.2034px -5.58831px 0px, rgb(255, 255, 255) 19.4587px -4.62156px 0px, rgb(255, 255, 255) 19.6654px -3.64325px 0px, rgb(255, 255, 255) 19.8229px -2.65584px 0px, rgb(255, 255, 255) 19.9308px -1.66179px 0px, rgb(255, 255, 255) 19.989px -0.663584px 0px;
}

#intro_content{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    flex-direction: column;
}

.date{
    bottom: 0rem;
    position: fixed;
    font-size: 1rem;
}

/* BIO */

.container {
    display: flex;
    flex-direction: row;
    width: 100%; /* Ensure the container takes full width */
    box-sizing: border-box;
}


.column-content {
    flex: 0 0 65%; 
    box-sizing: border-box; /* Include padding in the width */
    overflow-y: auto; /* Add vertical scroll if content overflows */
    padding-right: 5%;
}

.column-article {
    flex: 0 0 35%; 
    padding: 1rem;
    overflow-wrap: break-word; /* Permet d'aller à la ligne automatiquement si un mot est trop long */
    word-wrap: break-word; /* Pour compatibilité avec les anciens navigateurs */
    box-sizing: border-box; /* Include padding in the width */
    overflow-y: auto; /* Add vertical scroll if content overflows */
    background-color: yellow;
    padding-top: 12vh;
}

.cit{
    font-family: 'HersheyNoaillesTimesDuplexBoldItalic', sans-serif;
    padding-left: 2rem;
    color: white;
    font-size: 1.4rem;
      line-height: 1.4rem;
}

#article{
color: black;
font-family: 'HersheyNoaillesFuturaSimplexBold';
line-height: 1.5rem;
}

.inf1{
color: white;
font-size: 1.5rem;
padding-left: 4rem;
font-family: 'HersheyNoaillesFuturaSimplexBold';
}

.inf2{
color: white;
font-size: 1.5rem;
padding-left: 6rem;
font-family: 'HersheyNoaillesFuturaSimplexBold';
}

.inf3{
color: white;
font-size: 1.2rem;
line-height: 1.2rem;
padding-left: 10rem;
font-family: 'HersheyNoaillesFuturaSimplexBold';
}

.highlight_bio {
    background-color: yellow; /* Couleur de surlignage */
    padding: 0.2rem;
    color: black;
}

.link a{
    font-size: 1.5rem;
    color: black;
    mix-blend-mode: unset;
}

.link a::before {
content: "✎"; /* Utilisation du caractère bullet (•) */
margin-right: 0.2rem; /* Espacement entre la marque de puce et le texte */
}


/* TRADUCTION */

.translate-button {
    cursor: pointer;
    padding: 10px;
    margin: 2px;
    color: black;
    border: none;
}

footer{
    position: absolute;
    display: flex;
    justify-content: flex-end;
    right: 5px;
    bottom: 5px;
}


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

    #code_intro{
        padding: 0.5rem !important;
    }
    header{
        align-items: flex-start;
    }
    header ul{
        flex-direction: column;
        padding-bottom: 0rem;
    }

    nav{
        padding-left: 1rem;
    }

    main{
        font-size:3rem;
        line-height: 2.5rem;
        padding-left: 1rem !important;
        padding-top: 12rem !important;
    }

    ul{
        padding-bottom: 1rem;
    }

    .title{
        font-size: 4rem;
        line-height: 3rem;
    }

    .text-descr{
        width: 90%;
        position: static;
        height: 100% !important;
    }

    .slide{
        width: 100%;
        padding-top: 1rem;
    }

    footer{
        position: sticky;
    }

    .container{
        flex-direction: column;
    }

    main p{
        padding-top: 0rem !important;
        padding-left: 0rem !important;
    }

    .inf1{
        padding-left: 1rem;
    }

    .inf2{
        padding-left: 2rem;
    }

    .inf3{
        padding-left: 3rem;
    }

    .column-article{
        margin-top: 2rem;
        padding-top: 1rem;
    }

    .scatter{
        font-size: 3rem;
    }

    .code_default{
        padding: 0.5rem !important;
    }

}


