.inconsolata-<uniquifier> {
  font-family: "Inconsolata", monospace;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}


body {
  
  background-color: #faf8f3;
  //font-family: Arial, Helvetica, sans-serif;
  //font-family: "Lucida Console", "Courier New", monospace;
  font-family: "Inconsolata", monospace;
  font-size: 0.9em;
  line-height: 1.3em;
  margin: 2%;
  
}


h1{
   font-size: 1.6em;
}

img{
   max-width: 100%;
   max-height: 100%;
   display: block;
   margin-top: 5em;
}


video{
width: 100%;
height: 100%;
}


#infos {
  background-color: #f2d2cb;
  text-align: left;
  margin-top: 30px;
  padding: 5px;
}

button {
  background-color: white; /* Green */
  border: none;
  color: black;
  //padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  //font-size: 16px;
}



.popup {
  //z-index: 9;
  //background-color: #f2d2cb;
  opacity: 0.95;
  border: 1px solid #d3d3d3;
  //text-align: center;
  height: 60vh;
  width: 30vw;
  min-height: 30vh;
  min-width: 30vw;
  max-height: 80vh;
  max-width: 60vw;
  padding: 10px;
  padding-top: 30px;


}

/*Drgable */

.popup {
  position: absolute;
  /*resize: both; !*enable this to css resize*! */
  overflow: auto;
  box-shadow: 3px 3px 10px rgba(200, 200, 200, 0.5);
}

.popup-header {
  position: fixed;
  cursor: move;
  //z-index: 10;
  background-color: #fff;
  //color: #fff;
  padding: 5px;
  padding-left: 10px;
  padding-right: 30px;
  margin-top: -30px;
  margin-left: -10px;
  float:left;
}

.popup-header-close {
  cursor: pointer;
  //z-index: 10;
  background-color: #fff;
  //color: #fff;
  //padding: 5px;
  padding-left: 30px;
  //width: 10px;
  //height: 10px;
  float:right;
}




/*NOSELECT*/

.popup * {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}


@media (max-width: 600px) {
    body {
    //font-size: 14px;
    //overflow-y: auto;
    //margin: 0;
    //padding: 0;
    //width: 100%;
    //overflow-x: hidden; /* Empêche le défilement horizontal */
    }
    
    #filter-menu {
        display: flex;
        flex-direction: column;
    }

   .popup {
        position: inline; /* Annule le positionnement absolu si défini */
        width: 200%; /* 100% de la largeur de la fenêtre */
        //height: 100vh; /* 100% de la hauteur de la fenêtre */
        //margin: 0; /* Supprime les marges */
        //margin-bottom: 10px;
        box-sizing: border-box;
       
    }
    
 

}