@font-face {
    font-family: "din";
    font-weight: 100;
    src: url('../FONT/DINdong.otf'),
         url('../FONT/DINdong.woff2') format('woff2'),
         url('../FONT/DINdong.woff') format('woff');
}

body{
width: 100%;
height: 100%;
position: relative;
margin-left: auto;
margin-right: auto;
display: grid;
column-count: 8;
background-color: #e6eee0;
background-image: url('/img/forme.png');
background-repeat: no-repeat;
background-size: cover;
}

@media only screen and (max-width: 900px) {
  body{
  display: flex;
  column-count: 0;
  }
}

#accueil{
  position: relative;
  width: 90%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  display: grid;
  column-count: 8;
  z-index:9;
}

/* NAVIGATION */

#logo{
  width: 5%;
  position: absolute;
  top:0.5em;
  left:2em;
}

@media only screen and (max-width: 900px) {
  #logo{
    width: 10%;
    margin-top: -20px;
    left:1em;
    top:1.2em;
  }
}

#topnav{
  position: absolute;
  top:0px;
  right: 10px;
  font-size: 2.5vw;
  text-shadow: rgb(249, 187, 3) 7px 0px 0px,
  rgb(249, 187, 3) 6.92869px 0.996602px 0px,
  rgb(249, 187, 3) 6.71622px 1.9729px 0px,
  rgb(249, 187, 3) 6.36692px 2.909px 0px,
  rgb(249, 187, 3) 5.8879px 3.78584px 0px,
  rgb(249, 187, 3) 5.28893px 4.58555px 0px,
  rgb(249, 187, 3) 4.5822px 5.29183px 0px,
  rgb(249, 187, 3) 3.78212px 5.8903px 0px,
  rgb(249, 187, 3) 2.90498px 6.36876px 0px,
  rgb(249, 187, 3) 1.96865px 6.71747px 0px,
  rgb(249, 187, 3) 0.992221px 6.92932px 0px,
  rgb(249, 187, 3) -0.00442571px 7px 0px,
  rgb(249, 187, 3) -1.00098px 6.92806px 0px,
  rgb(249, 187, 3) -1.97715px 6.71498px 0px,
  rgb(249, 187, 3) -2.91303px 6.36508px 0px,
  rgb(249, 187, 3) -3.78956px 5.88551px 0px,
  rgb(249, 187, 3) -4.58889px 5.28603px 0px,
  rgb(249, 187, 3) -5.29472px 4.57885px 0px,
  rgb(249, 187, 3) -5.89269px 3.77839px 0px,
  rgb(249, 187, 3) -6.3706px 2.90095px 0px,
  rgb(249, 187, 3) -6.71871px 1.96441px 0px,
  rgb(249, 187, 3) -6.92995px 0.98784px 0px,
  rgb(249, 187, 3) -6.99999px -0.00885142px 0px,
  rgb(249, 187, 3) -6.92743px -1.00536px 0px,
  rgb(249, 187, 3) -6.71372px -1.98139px 0px,
  rgb(249, 187, 3) -6.36324px -2.91705px 0px,
  rgb(249, 187, 3) -5.88311px -3.79328px 0px,
  rgb(249, 187, 3) -5.28313px -4.59223px 0px,
  rgb(249, 187, 3) -4.57551px -5.29762px 0px,
  rgb(249, 187, 3) -3.77466px -5.89507px 0px,
  rgb(249, 187, 3) -2.89692px -6.37243px 0px,
  rgb(249, 187, 3) -1.96016px -6.71995px 0px,
  rgb(249, 187, 3) -0.983458px -6.93057px 0px,
  rgb(249, 187, 3) 0.0132771px -6.99999px 0px,
  rgb(249, 187, 3) 1.00974px -6.92679px 0px,
  rgb(249, 187, 3) 1.98564px -6.71247px 0px,
  rgb(249, 187, 3) 2.92107px -6.36139px 0px,
  rgb(249, 187, 3) 3.797px -5.88071px 0px,
  rgb(249, 187, 3) 4.59557px -5.28022px 0px,
  rgb(249, 187, 3) 5.30051px -4.57215px 0px,
  rgb(249, 187, 3) 5.89746px -3.77094px 0px,
  rgb(249, 187, 3) 6.37426px -2.89289px 0px,
  rgb(249, 187, 3) 6.72119px -1.95591px 0px,
  rgb(249, 187, 3) 6.93119px -0.979076px 0px;
}

@media only screen and (max-width: 900px) {
  #topnav{
    margin-block-start: 0em;
    z-index: 100;
    font-size: 9vw;
    right: 0em;
    text-shadow: none;
  }
}

#menu-icon {
  display: none; /* Masquer l'icône hamburger par défaut */
  cursor: pointer;
 font-size: 6vw;
 margin-left: 20px;
 color: black;
}

.menu-item {
  display: inline-block;
  text-align: center;
  margin-right: 20px; /* Ajouter un espace entre les éléments du menu */
}

@media only screen and (max-width: 900px) {
  #menu-icon {
    display: inline-block;
  }

  .menu-item {
    display: none;
  }

  #topnav.open {
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 0em;
    width: 100%;
    height: 100%;
    background-color: #e6eee0; /* Couleur de fond avec opacité */
    z-index: 1000; /* Assurez-vous que le menu est au-dessus du reste du contenu */
    overflow-x: hidden;
  }

  #topnav.open .menu-item {
    display: block;
    color: black; /* Couleur du texte dans le menu ouvert */
    margin: 30px; /* Ajustez la marge selon vos besoins */
  }
}

a{
  margin-right: 30px;
  font-family: "din";
  font-weight: normal;
  margin-top: 0px;
  color: black;
  text-decoration: none;
}

@media only screen and (max-width: 900px) {
  a{
    margin-right: 20px;
    color: white;
  }
}

a:hover{
  color: white;
}

h1{
    font-family: "din";
    font-weight: bolder;
    width: 80%;
    font-weight: normal;
    font-size: 24vw;
    margin-right: auto;
    margin-left: auto;
    margin-top:  5vw;
    margin-bottom: 0.3vw;
    text-align: center;
    z-index: 2;
    color: black;
}

#txt_home{
  font-family: "din";
  position: relative;
  width: 90%;
  font-weight: normal;
  font-size: 2.5vw;
  margin-right: auto;
  margin-left: auto;
  margin-top: 0px;
  grid-column: 1 / 8;
  grid-row: 3;
  z-index: 2;
  margin-bottom: 0px;
}

span{
  text-shadow: rgb(230, 238, 224) 7px 0px 0px,
  rgb(230, 238, 224) 6.92869px 0.996602px 0px,
  rgb(230, 238, 224) 6.71622px 1.9729px 0px,
  rgb(230, 238, 224) 6.36692px 2.909px 0px,
  rgb(230, 238, 224) 5.8879px 3.78584px 0px,
  rgb(230, 238, 224) 5.28893px 4.58555px 0px,
  rgb(230, 238, 224) 4.5822px 5.29183px 0px,
  rgb(230, 238, 224) 3.78212px 5.8903px 0px,
  rgb(230, 238, 224) 2.90498px 6.36876px 0px,
  rgb(230, 238, 224) 1.96865px 6.71747px 0px,
  rgb(230, 238, 224) 0.992221px 6.92932px 0px,
  rgb(230, 238, 224) -0.00442571px 7px 0px,
  rgb(230, 238, 224) -1.00098px 6.92806px 0px,
  rgb(230, 238, 224) -1.97715px 6.71498px 0px,
  rgb(230, 238, 224) -2.91303px 6.36508px 0px,
  rgb(230, 238, 224) -3.78956px 5.88551px 0px,
  rgb(230, 238, 224) -4.58889px 5.28603px 0px,
  rgb(230, 238, 224) -5.29472px 4.57885px 0px,
  rgb(230, 238, 224) -5.89269px 3.77839px 0px,
  rgb(230, 238, 224) -6.3706px 2.90095px 0px,
  rgb(230, 238, 224) -6.71871px 1.96441px 0px,
  rgb(230, 238, 224) -6.92995px 0.98784px 0px,
  rgb(230, 238, 224) -6.99999px -0.00885142px 0px,
  rgb(230, 238, 224) -6.92743px -1.00536px 0px,
  rgb(230, 238, 224) -6.71372px -1.98139px 0px,
  rgb(230, 238, 224) -6.36324px -2.91705px 0px,
  rgb(230, 238, 224) -5.88311px -3.79328px 0px,
  rgb(230, 238, 224) -5.28313px -4.59223px 0px,
  rgb(230, 238, 224) -4.57551px -5.29762px 0px,
  rgb(230, 238, 224) -3.77466px -5.89507px 0px,
  rgb(230, 238, 224) -2.89692px -6.37243px 0px,
  rgb(230, 238, 224) -1.96016px -6.71995px 0px,
  rgb(230, 238, 224) -0.983458px -6.93057px 0px,
  rgb(230, 238, 224) 0.0132771px -6.99999px 0px,
  rgb(230, 238, 224) 1.00974px -6.92679px 0px,
  rgb(230, 238, 224) 1.98564px -6.71247px 0px,
  rgb(230, 238, 224) 2.92107px -6.36139px 0px,
  rgb(230, 238, 224) 3.797px -5.88071px 0px,
  rgb(230, 238, 224) 4.59557px -5.28022px 0px,
  rgb(230, 238, 224) 5.30051px -4.57215px 0px,
  rgb(230, 238, 224) 5.89746px -3.77094px 0px,
  rgb(230, 238, 224) 6.37426px -2.89289px 0px,
  rgb(230, 238, 224) 6.72119px -1.95591px 0px,
  rgb(230, 238, 224) 6.93119px -0.979076px 0px;
}


/* LISTE PROJETS */

#imgback{
  width: 100%;
  position: absolute;
  margin-left: -200px;
}

@media only screen and (max-width: 900px) {
  #imgback{
    visibility: hidden;
  }
}

#content{
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 150px;
}

@media only screen and (max-width: 900px) {
  #content{
    width: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    padding-top: 70px;

  }
}

@media only screen and (max-width: 900px) {
  #all{
  margin-top: auto;
  margin-bottom: auto;
}
}


@media only screen and (max-width: 900px) {
  #gridimg{
  display: grid;
  grid-gap: 5px;
}
}



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

@media only screen and (max-width: 900px) {
  ul{
    position: absolute;
    display: grid;
    height: 95%;
}
}

.xml{
  height: 100%;
}

.xml:nth-child(1){
  width:100%;
}

.xml:nth-child(2){
  width:100%;
}

.xml:nth-child(3){
  width:100%;
}

li{
  list-style: none;
  position: relative;
  font-family: "din";
  font-weight: normal;
  font-size: 5.5vw;
  margin-bottom: 0px;
  margin-top: 20px;
  z-index: 10;
  color: black;
  display: inline-block;
}

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

@media only screen and (max-width: 900px) {
  li{
    font-family: "din";
    position: relative;
    font-weight: normal;
    font-size: 10vw;
    line-height: 11vw;
    margin-left: 10px;
    margin-bottom: 0px;
    z-index: 20;
    color: white;
    mix-blend-mode:normal;
    word-wrap: break-word;
    text-shadow: rgb(0, 0, 0) 7px 0px 0px,
    rgb(0, 0, 0) 6.92869px 0.996602px 0px,
    rgb(0, 0, 0) 6.71622px 1.9729px 0px,
    rgb(0, 0, 0) 6.36692px 2.909px 0px,
    rgb(0, 0, 0) 5.8879px 3.78584px 0px,
    rgb(0, 0, 0) 5.28893px 4.58555px 0px,
    rgb(0, 0, 0) 4.5822px 5.29183px 0px,
    rgb(0, 0, 0) 3.78212px 5.8903px 0px,
    rgb(0, 0, 0) 2.90498px 6.36876px 0px,
    rgb(0, 0, 0) 1.96865px 6.71747px 0px,
    rgb(0, 0, 0) 0.992221px 6.92932px 0px,
    rgb(0, 0, 0) -0.00442571px 7px 0px,
    rgb(0, 0, 0) -1.00098px 6.92806px 0px,
    rgb(0, 0, 0) -1.97715px 6.71498px 0px,
    rgb(0, 0, 0) -2.91303px 6.36508px 0px,
    rgb(0, 0, 0) -3.78956px 5.88551px 0px,
    rgb(0, 0, 0) -4.58889px 5.28603px 0px,
    rgb(0, 0, 0) -5.29472px 4.57885px 0px,
    rgb(0, 0, 0) -5.89269px 3.77839px 0px,
    rgb(0, 0, 0) -6.3706px 2.90095px 0px,
    rgb(0, 0, 0) -6.71871px 1.96441px 0px,
    rgb(0, 0, 0) -6.92995px 0.98784px 0px,
    rgb(0, 0, 0) -6.99999px -0.00885142px 0px,
    rgb(0, 0, 0) -6.92743px -1.00536px 0px,
    rgb(0, 0, 0) -6.71372px -1.98139px 0px,
    rgb(0, 0, 0) -6.36324px -2.91705px 0px,
    rgb(0, 0, 0) -5.88311px -3.79328px 0px,
    rgb(0, 0, 0) -5.28313px -4.59223px 0px,
    rgb(0, 0, 0) -4.57551px -5.29762px 0px,
    rgb(0, 0, 0) -3.77466px -5.89507px 0px,
    rgb(0, 0, 0) -2.89692px -6.37243px 0px,
    rgb(0, 0, 0) -1.96016px -6.71995px 0px,
    rgb(0, 0, 0) -0.983458px -6.93057px 0px,
    rgb(0, 0, 0) 0.0132771px -6.99999px 0px,
    rgb(0, 0, 0) 1.00974px -6.92679px 0px,
    rgb(0, 0, 0) 1.98564px -6.71247px 0px,
    rgb(0, 0, 0) 2.92107px -6.36139px 0px,
    rgb(0, 0, 0) 3.797px -5.88071px 0px,
    rgb(0, 0, 0) 4.59557px -5.28022px 0px,
    rgb(0, 0, 0) 5.30051px -4.57215px 0px,
    rgb(0, 0, 0) 5.89746px -3.77094px 0px,
    rgb(0, 0, 0) 6.37426px -2.89289px 0px,
    rgb(0, 0, 0) 6.72119px -1.95591px 0px,
    rgb(0, 0, 0) 6.93119px -0.979076px 0px;
  }
}

@media only screen and (max-width: 900px) {
  li:hover{
    font-family: "din";
    position: relative;
    font-weight: normal;
    font-size: 10vw;
    margin-left: 10px;
    margin-bottom: 0px;
    z-index: 20;
    color: white;
    mix-blend-mode:normal;
    word-wrap: break-word;
    text-shadow: rgb(0, 0, 0) 7px 0px 0px,
    rgb(0, 0, 0) 6.92869px 0.996602px 0px,
    rgb(0, 0, 0) 6.71622px 1.9729px 0px,
    rgb(0, 0, 0) 6.36692px 2.909px 0px,
    rgb(0, 0, 0) 5.8879px 3.78584px 0px,
    rgb(0, 0, 0) 5.28893px 4.58555px 0px,
    rgb(0, 0, 0) 4.5822px 5.29183px 0px,
    rgb(0, 0, 0) 3.78212px 5.8903px 0px,
    rgb(0, 0, 0) 2.90498px 6.36876px 0px,
    rgb(0, 0, 0) 1.96865px 6.71747px 0px,
    rgb(0, 0, 0) 0.992221px 6.92932px 0px,
    rgb(0, 0, 0) -0.00442571px 7px 0px,
    rgb(0, 0, 0) -1.00098px 6.92806px 0px,
    rgb(0, 0, 0) -1.97715px 6.71498px 0px,
    rgb(0, 0, 0) -2.91303px 6.36508px 0px,
    rgb(0, 0, 0) -3.78956px 5.88551px 0px,
    rgb(0, 0, 0) -4.58889px 5.28603px 0px,
    rgb(0, 0, 0) -5.29472px 4.57885px 0px,
    rgb(0, 0, 0) -5.89269px 3.77839px 0px,
    rgb(0, 0, 0) -6.3706px 2.90095px 0px,
    rgb(0, 0, 0) -6.71871px 1.96441px 0px,
    rgb(0, 0, 0) -6.92995px 0.98784px 0px,
    rgb(0, 0, 0) -6.99999px -0.00885142px 0px,
    rgb(0, 0, 0) -6.92743px -1.00536px 0px,
    rgb(0, 0, 0) -6.71372px -1.98139px 0px,
    rgb(0, 0, 0) -6.36324px -2.91705px 0px,
    rgb(0, 0, 0) -5.88311px -3.79328px 0px,
    rgb(0, 0, 0) -5.28313px -4.59223px 0px,
    rgb(0, 0, 0) -4.57551px -5.29762px 0px,
    rgb(0, 0, 0) -3.77466px -5.89507px 0px,
    rgb(0, 0, 0) -2.89692px -6.37243px 0px,
    rgb(0, 0, 0) -1.96016px -6.71995px 0px,
    rgb(0, 0, 0) -0.983458px -6.93057px 0px,
    rgb(0, 0, 0) 0.0132771px -6.99999px 0px,
    rgb(0, 0, 0) 1.00974px -6.92679px 0px,
    rgb(0, 0, 0) 1.98564px -6.71247px 0px,
    rgb(0, 0, 0) 2.92107px -6.36139px 0px,
    rgb(0, 0, 0) 3.797px -5.88071px 0px,
    rgb(0, 0, 0) 4.59557px -5.28022px 0px,
    rgb(0, 0, 0) 5.30051px -4.57215px 0px,
    rgb(0, 0, 0) 5.89746px -3.77094px 0px,
    rgb(0, 0, 0) 6.37426px -2.89289px 0px,
    rgb(0, 0, 0) 6.72119px -1.95591px 0px,
    rgb(0, 0, 0) 6.93119px -0.979076px 0px;
  }
}

/* IMAGE */

img{
width: 100%;
}

[class^="div"] {
  position: absolute;
  visibility: hidden;
  top: 200px;
  width: 50%;
  margin-left: 40%;
}

@media only screen and (max-width: 900px) {
  [class^="div"] {
    width: 100%;
    visibility: visible;
    margin-top: 0;
    top:0px;
    position: relative;
    margin-left: 0%;
    display: flex;
  }
}


.lexi {
  color: white;
}

/* FILM */
#column{
  display: grid;
  column-count: 5;
  column-gap: 5%;
}

@media only screen and (max-width: 900px) {
  #column {
    display: contents;
  }
}

#carac{
  margin-bottom: 2em;
}

@media only screen and (max-width: 900px) {
  #carac{
    margin-bottom: 2em;
  }
}

#txtfilm{
  font-family: "din";
  font-size: 2vw;
  line-height: 2.2vw;
  margin-top: 0px;
  margin-bottom: 0px;
  grid-column: 1/2;
  position: sticky;
  top: 50px;
}

@media only screen and (max-width: 900px) {
  #txtfilm{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    font-family: "din";
    font-size: 4vw;
    line-height: 4.4vw;
    margin-top: 0px;
    position: relative;
    margin-bottom: 50px;
    grid-column: 1/2;
    top: 0px;
  }
}

#imagefilm{
  grid-column: 2/5;
  width: 100%;
  display: grid;
  grid-gap: 20px;
  margin-top: 5px;
}

@media only screen and (max-width: 900px) {
  #imagefilm{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
}

.description{
  margin-bottom: 5%;
  font-family: "din";
  font-size: 1.5vw;
  line-height: 1.7vw;
}

@media only screen and (max-width: 900px) {
  .description{
    margin-bottom: 5%;
    font-family: "din";
    font-size: 3vw;
    line-height: 3.4vw;
  }
}

p{
  margin-block-start: 0.5em;
    margin-block-end: 0.5em;
}

.retour{
  color: white;
  text-shadow: rgb(249, 187, 3) 7px 0px 0px,
  rgb(249, 187, 3) 6.92869px 0.996602px 0px,
  rgb(249, 187, 3) 6.71622px 1.9729px 0px,
  rgb(249, 187, 3) 6.36692px 2.909px 0px,
  rgb(249, 187, 3) 5.8879px 3.78584px 0px,
  rgb(249, 187, 3) 5.28893px 4.58555px 0px,
  rgb(249, 187, 3) 4.5822px 5.29183px 0px,
  rgb(249, 187, 3) 3.78212px 5.8903px 0px,
  rgb(249, 187, 3) 2.90498px 6.36876px 0px,
  rgb(249, 187, 3) 1.96865px 6.71747px 0px,
  rgb(249, 187, 3) 0.992221px 6.92932px 0px,
  rgb(249, 187, 3) -0.00442571px 7px 0px,
  rgb(249, 187, 3) -1.00098px 6.92806px 0px,
  rgb(249, 187, 3) -1.97715px 6.71498px 0px,
  rgb(249, 187, 3) -2.91303px 6.36508px 0px,
  rgb(249, 187, 3) -3.78956px 5.88551px 0px,
  rgb(249, 187, 3) -4.58889px 5.28603px 0px,
  rgb(249, 187, 3) -5.29472px 4.57885px 0px,
  rgb(249, 187, 3) -5.89269px 3.77839px 0px,
  rgb(249, 187, 3) -6.3706px 2.90095px 0px,
  rgb(249, 187, 3) -6.71871px 1.96441px 0px,
  rgb(249, 187, 3) -6.92995px 0.98784px 0px,
  rgb(249, 187, 3) -6.99999px -0.00885142px 0px,
  rgb(249, 187, 3) -6.92743px -1.00536px 0px,
  rgb(249, 187, 3) -6.71372px -1.98139px 0px,
  rgb(249, 187, 3) -6.36324px -2.91705px 0px,
  rgb(249, 187, 3) -5.88311px -3.79328px 0px,
  rgb(249, 187, 3) -5.28313px -4.59223px 0px,
  rgb(249, 187, 3) -4.57551px -5.29762px 0px,
  rgb(249, 187, 3) -3.77466px -5.89507px 0px,
  rgb(249, 187, 3) -2.89692px -6.37243px 0px,
  rgb(249, 187, 3) -1.96016px -6.71995px 0px,
  rgb(249, 187, 3) -0.983458px -6.93057px 0px,
  rgb(249, 187, 3) 0.0132771px -6.99999px 0px,
  rgb(249, 187, 3) 1.00974px -6.92679px 0px,
  rgb(249, 187, 3) 1.98564px -6.71247px 0px,
  rgb(249, 187, 3) 2.92107px -6.36139px 0px,
  rgb(249, 187, 3) 3.797px -5.88071px 0px,
  rgb(249, 187, 3) 4.59557px -5.28022px 0px,
  rgb(249, 187, 3) 5.30051px -4.57215px 0px,
  rgb(249, 187, 3) 5.89746px -3.77094px 0px,
  rgb(249, 187, 3) 6.37426px -2.89289px 0px,
  rgb(249, 187, 3) 6.72119px -1.95591px 0px,
  rgb(249, 187, 3) 6.93119px -0.979076px 0px;
}

@media only screen and (max-width: 900px) {
.retour{
  display: none;
}
}

#title{
  margin-bottom: 1em;
  font-size: 2.5vw;
  font-weight:normal;
  color: white;
  text-shadow: rgb(0, 0, 0) 7px 0px 0px,
  rgb(0, 0, 0) 6.92869px 0.996602px 0px,
  rgb(0, 0, 0) 6.71622px 1.9729px 0px,
  rgb(0, 0, 0) 6.36692px 2.909px 0px,
  rgb(0, 0, 0) 5.8879px 3.78584px 0px,
  rgb(0, 0, 0) 5.28893px 4.58555px 0px,
  rgb(0, 0, 0) 4.5822px 5.29183px 0px,
  rgb(0, 0, 0) 3.78212px 5.8903px 0px,
  rgb(0, 0, 0) 2.90498px 6.36876px 0px,
  rgb(0, 0, 0) 1.96865px 6.71747px 0px,
  rgb(0, 0, 0) 0.992221px 6.92932px 0px,
  rgb(0, 0, 04) -0.00442571px 7px 0px,
  rgb(0, 0, 0) -1.00098px 6.92806px 0px,
  rgb(0, 0, 0) -1.97715px 6.71498px 0px,
  rgb(0, 0, 0) -2.91303px 6.36508px 0px,
  rgb(0, 0, 0) -3.78956px 5.88551px 0px,
  rgb(0, 0, 0) -4.58889px 5.28603px 0px,
  rgb(0, 0, 0) -5.29472px 4.57885px 0px,
  rgb(0, 0, 0) -5.89269px 3.77839px 0px,
  rgb(0, 0, 0) -6.3706px 2.90095px 0px,
  rgb(0, 0, 0) -6.71871px 1.96441px 0px,
  rgb(0, 0, 0) -6.92995px 0.98784px 0px,
  rgb(0, 0, 0) -6.99999px -0.00885142px 0px,
  rgb(0, 0, 0) -6.92743px -1.00536px 0px,
  rgb(0, 0, 0) -6.71372px -1.98139px 0px,
  rgb(0, 0, 0) -6.36324px -2.91705px 0px,
  rgb(0, 0, 0) -5.88311px -3.79328px 0px,
  rgb(0, 0, 0) -5.28313px -4.59223px 0px,
  rgb(0, 0, 0) -4.57551px -5.29762px 0px,
  rgb(0, 0, 0) -3.77466px -5.89507px 0px,
  rgb(0, 0, 0) -2.89692px -6.37243px 0px,
  rgb(0, 0, 0) -1.96016px -6.71995px 0px,
  rgb(0, 0, 0) -0.983458px -6.93057px 0px,
  rgb(0, 0, 0) 0.0132771px -6.99999px 0px,
  rgb(0, 0, 0) 1.00974px -6.92679px 0px,
  rgb(0, 0, 0) 1.98564px -6.71247px 0px,
  rgb(0, 0, 0) 2.92107px -6.36139px 0px,
  rgb(0, 0, 0) 3.797px -5.88071px 0px,
  rgb(0, 0, 0) 4.59557px -5.28022px 0px,
  rgb(0, 0, 0) 5.30051px -4.57215px 0px,
  rgb(0, 0, 0) 5.89746px -3.77094px 0px,
  rgb(0, 0, 0) 6.37426px -2.89289px 0px,
  rgb(0, 0, 0) 6.72119px -1.95591px 0px,
  rgb(0, 0, 0) 6.93119px -0.979076px 0px;
}

@media only screen and (max-width: 900px) {
#title{
  margin-bottom: 1em;
  font-size: 5vw;
  font-weight:normal;
  color: white;
}
}

/* QUI-SOMMES-NOUS */

#txtqui{
  font-family: "din";
  font-size: 2vw;
  line-height: 2.2vw;
  margin-top: 0px;
  margin-bottom: 0px;
  grid-column: 1/3;
}

@media only screen and (max-width: 900px) {
  #txtqui{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    font-family: "din";
    font-size: 4.5vw;
    line-height: 4.9vw;
    margin-top: 20px;
    margin-bottom: 20px;
    grid-column: 1/2;
  }
}

#imagequi{
  grid-column: 3/5;
  width: 100%;
  display: grid;
}

@media only screen and (max-width: 900px) {
  #imagequi{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-gap: 30px;
  }
}

#qui{
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  font-family: "din";
  font-weight: normal;
  font-size: 3vw;
  line-height: 6vw;
  margin-bottom: 0px;
  margin-top: 20px;
  z-index: 10;
  color: black;
}

#quibis{
  display: none;
}

@media only screen and (max-width: 900px) {
  #quibis{
    display: block;
    text-align: center;
    font-family: "din";
    font-weight: normal;
    margin-top: 80px;
    font-size: 8vw;
    line-height: 9vw;
    width: 70%;
    margin-left: auto;
    margin-right: auto;

  }
}

@media only screen and (max-width: 900px) {
#qui{
  display: none;
}
}

em{
  font-style: normal;
  margin-right: -20px;


}

@media only screen and (max-width: 900px) {
  em{
    font-size: 13vw;
    margin-top: 4vw;
    margin-bottom: 4vw;
    display: inline-flex;
    margin-right: -20px;
    font-style: normal;
    color: white;
    text-shadow: rgb(0, 0, 0) 7px 0px 0px,
    rgb(0, 0, 0) 6.92869px 0.996602px 0px,
    rgb(0, 0, 0) 6.71622px 1.9729px 0px,
    rgb(0, 0, 0) 6.36692px 2.909px 0px,
    rgb(0, 0, 0) 5.8879px 3.78584px 0px,
    rgb(0, 0, 0) 5.28893px 4.58555px 0px,
    rgb(0, 0, 0) 4.5822px 5.29183px 0px,
    rgb(0, 0, 0) 3.78212px 5.8903px 0px,
    rgb(0, 0, 0) 2.90498px 6.36876px 0px,
    rgb(0, 0, 0) 1.96865px 6.71747px 0px,
    rgb(0, 0, 0) 0.992221px 6.92932px 0px,
    rgb(0, 0, 0) -0.00442571px 7px 0px,
    rgb(0, 0, 0) -1.00098px 6.92806px 0px,
    rgb(0, 0, 0) -1.97715px 6.71498px 0px,
    rgb(0, 0, 0) -2.91303px 6.36508px 0px,
    rgb(0, 0, 0) -3.78956px 5.88551px 0px,
    rgb(0, 0, 0) -4.58889px 5.28603px 0px,
    rgb(0, 0, 0) -5.29472px 4.57885px 0px,
    rgb(0, 0, 0) -5.89269px 3.77839px 0px,
    rgb(0, 0, 0) -6.3706px 2.90095px 0px,
    rgb(0, 0, 0) -6.71871px 1.96441px 0px,
    rgb(0, 0, 0) -6.92995px 0.98784px 0px,
    rgb(0, 0, 0) -6.99999px -0.00885142px 0px,
    rgb(0, 0, 0) -6.92743px -1.00536px 0px,
    rgb(0, 0, 0) -6.71372px -1.98139px 0px,
    rgb(0, 0, 0) -6.36324px -2.91705px 0px,
    rgb(0, 0, 0) -5.88311px -3.79328px 0px,
    rgb(0, 0, 0) -5.28313px -4.59223px 0px,
    rgb(0, 0, 0) -4.57551px -5.29762px 0px,
    rgb(0, 0, 0) -3.77466px -5.89507px 0px,
    rgb(0, 0, 0) -2.89692px -6.37243px 0px,
    rgb(0, 0, 0) -1.96016px -6.71995px 0px,
    rgb(0, 0, 0) -0.983458px -6.93057px 0px,
    rgb(0, 0, 0) 0.0132771px -6.99999px 0px,
    rgb(0, 0, 0) 1.00974px -6.92679px 0px,
    rgb(0, 0, 0) 1.98564px -6.71247px 0px,
    rgb(0, 0, 0) 2.92107px -6.36139px 0px,
    rgb(0, 0, 0) 3.797px -5.88071px 0px,
    rgb(0, 0, 0) 4.59557px -5.28022px 0px,
    rgb(0, 0, 0) 5.30051px -4.57215px 0px,
    rgb(0, 0, 0) 5.89746px -3.77094px 0px,
    rgb(0, 0, 0) 6.37426px -2.89289px 0px,
    rgb(0, 0, 0) 6.72119px -1.95591px 0px,
    rgb(0, 0, 0) 6.93119px -0.979076px 0px;
  }
}

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

@media only screen and (max-width: 900px) {
  em:hover{
    font-size: 13vw;
    margin-top: 4vw;
    margin-bottom: 4vw;
    display: inline-flex;
    margin-right: -20px;
    font-style: normal;
    color: white;
    text-shadow: rgb(0, 0, 0) 7px 0px 0px,
    rgb(0, 0, 0) 6.92869px 0.996602px 0px,
    rgb(0, 0, 0) 6.71622px 1.9729px 0px,
    rgb(0, 0, 0) 6.36692px 2.909px 0px,
    rgb(0, 0, 0) 5.8879px 3.78584px 0px,
    rgb(0, 0, 0) 5.28893px 4.58555px 0px,
    rgb(0, 0, 0) 4.5822px 5.29183px 0px,
    rgb(0, 0, 0) 3.78212px 5.8903px 0px,
    rgb(0, 0, 0) 2.90498px 6.36876px 0px,
    rgb(0, 0, 0) 1.96865px 6.71747px 0px,
    rgb(0, 0, 0) 0.992221px 6.92932px 0px,
    rgb(0, 0, 0) -0.00442571px 7px 0px,
    rgb(0, 0, 0) -1.00098px 6.92806px 0px,
    rgb(0, 0, 0) -1.97715px 6.71498px 0px,
    rgb(0, 0, 0) -2.91303px 6.36508px 0px,
    rgb(0, 0, 0) -3.78956px 5.88551px 0px,
    rgb(0, 0, 0) -4.58889px 5.28603px 0px,
    rgb(0, 0, 0) -5.29472px 4.57885px 0px,
    rgb(0, 0, 0) -5.89269px 3.77839px 0px,
    rgb(0, 0, 0) -6.3706px 2.90095px 0px,
    rgb(0, 0, 0) -6.71871px 1.96441px 0px,
    rgb(0, 0, 0) -6.92995px 0.98784px 0px,
    rgb(0, 0, 0) -6.99999px -0.00885142px 0px,
    rgb(0, 0, 0) -6.92743px -1.00536px 0px,
    rgb(0, 0, 0) -6.71372px -1.98139px 0px,
    rgb(0, 0, 0) -6.36324px -2.91705px 0px,
    rgb(0, 0, 0) -5.88311px -3.79328px 0px,
    rgb(0, 0, 0) -5.28313px -4.59223px 0px,
    rgb(0, 0, 0) -4.57551px -5.29762px 0px,
    rgb(0, 0, 0) -3.77466px -5.89507px 0px,
    rgb(0, 0, 0) -2.89692px -6.37243px 0px,
    rgb(0, 0, 0) -1.96016px -6.71995px 0px,
    rgb(0, 0, 0) -0.983458px -6.93057px 0px,
    rgb(0, 0, 0) 0.0132771px -6.99999px 0px,
    rgb(0, 0, 0) 1.00974px -6.92679px 0px,
    rgb(0, 0, 0) 1.98564px -6.71247px 0px,
    rgb(0, 0, 0) 2.92107px -6.36139px 0px,
    rgb(0, 0, 0) 3.797px -5.88071px 0px,
    rgb(0, 0, 0) 4.59557px -5.28022px 0px,
    rgb(0, 0, 0) 5.30051px -4.57215px 0px,
    rgb(0, 0, 0) 5.89746px -3.77094px 0px,
    rgb(0, 0, 0) 6.37426px -2.89289px 0px,
    rgb(0, 0, 0) 6.72119px -1.95591px 0px,
    rgb(0, 0, 0) 6.93119px -0.979076px 0px;
  }
}

strong{
  font-weight: normal;
  color: white;
  text-shadow: rgb(0, 0, 0) 9px 0px 0px,
  rgb(0, 0, 0) 8.9445px 0.997944px 0px,
  rgb(0, 0, 0) 8.77869px 1.98358px 0px,
  rgb(0, 0, 0) 8.50461px 2.94475px 0px,
  rgb(0, 0, 0) 8.12565px 3.86961px 0px,
  rgb(0, 0, 0) 7.64647px 4.74674px 0px,
  rgb(0, 0, 0) 7.07299px 5.56533px 0px,
  rgb(0, 0, 0) 6.41227px 6.31528px 0px,
  rgb(0, 0, 0) 5.67248px 6.98735px 0px,
  rgb(0, 0, 0) 4.86272px 7.57324px 0px,
  rgb(0, 0, 0) 3.99299px 8.06573px 0px,
  rgb(0, 0, 0) 3.07402px 8.45875px 0px,
  rgb(0, 0, 0) 2.11714px 8.74744px 0px,
  rgb(0, 0, 0) 1.13414px 8.92825px 0px,
  rgb(0, 0, 0) 0.137162px 8.99895px 0px,
  rgb(0, 0, 0) -0.861512px 8.95867px 0px,
  rgb(0, 0, 0) -1.84956px 8.8079px 0px,
  rgb(0, 0, 0) -2.8148px 8.5485px 0px,
  rgb(0, 0, 0) -3.74532px 8.18368px 0px,
  rgb(0, 0, 0) -4.62965px 7.71792px 0px,
  rgb(0, 0, 0) -5.45689px 7.15698px 0px,
  rgb(0, 0, 0) -6.21682px 6.50777px 0px,
  rgb(0, 0, 0) -6.90009px 5.77831px 0px,
  rgb(0, 0, 0) -7.49825px 4.97757px 0px,
  rgb(0, 0, 0) -8.00394px 4.11545px 0px,
  rgb(0, 0, 0) -8.41092px 3.20258px 0px,
  rgb(0, 0, 0) -8.71416px 2.2502px 0px,
  rgb(0, 0, 0) -8.90993px 1.27008px 0px,
  rgb(0, 0, 0) -8.99582px 0.274291px 0px,
  rgb(0, 0, 0) -8.97076px -0.72488px 0px,
  rgb(0, 0, 0) -8.83507px -1.71511px 0px,
  rgb(0, 0, 0) -8.59041px -2.68419px 0px,
  rgb(0, 0, 0) -8.23981px -3.62017px 0px,
  rgb(0, 0, 0) -7.78758px -4.51149px 0px,
  rgb(0, 0, 0) -7.23931px -5.34718px 0px,
  rgb(0, 0, 0) -6.60176px -6.11692px 0px,
  rgb(0, 0, 0) -5.88279px -6.81122px 0px,
  rgb(0, 0, 0) -5.09127px -7.42152px 0px,
  rgb(0, 0, 0) -4.23696px -7.94029px 0px,
  rgb(0, 0, 0) -3.33039px -8.36113px 0px,
  rgb(0, 0, 0) -2.38275px -8.67885px 0px,
  rgb(0, 0, 0) -1.40572px -8.88954px 0px,
  rgb(0, 0, 0) -0.411357px -8.99059px 0px,
  rgb(0, 0, 0) 0.58808px -8.98077px 0px,
  rgb(0, 0, 0) 1.58026px -8.86018px 0px,
  rgb(0, 0, 0) 2.55296px -8.63032px 0px,
  rgb(0, 0, 0) 3.49417px -8.29402px 0px,
  rgb(0, 0, 0) 4.39229px -7.85543px 0px,
  rgb(0, 0, 0) 5.23623px -7.31996px 0px,
  rgb(0, 0, 0) 6.0156px -6.69422px 0px,
  rgb(0, 0, 0) 6.72078px -5.98591px 0px,
  rgb(0, 0, 0) 7.34307px -5.20378px 0px,
  rgb(0, 0, 0) 7.87479px -4.35748px 0px,
  rgb(0, 0, 0) 8.3094px -3.45743px 0px,
  rgb(0, 0, 0) 8.64153px -2.51474px 0px,
  rgb(0, 0, 0) 8.86709px -1.54104px 0px,
  rgb(0, 0, 0) 8.98328px -0.548328px 0px;
}

@media only screen and (max-width: 900px) {
  strong{
    font-style: normal;
    color: white;
    font-weight:normal;
    text-shadow: rgb(0, 0, 0) 7px 0px 0px,
    rgb(0, 0, 0) 6.92869px 0.996602px 0px,
    rgb(0, 0, 0) 6.71622px 1.9729px 0px,
    rgb(0, 0, 0) 6.36692px 2.909px 0px,
    rgb(0, 0, 0) 5.8879px 3.78584px 0px,
    rgb(0, 0, 0) 5.28893px 4.58555px 0px,
    rgb(0, 0, 0) 4.5822px 5.29183px 0px,
    rgb(0, 0, 0) 3.78212px 5.8903px 0px,
    rgb(0, 0, 0) 2.90498px 6.36876px 0px,
    rgb(0, 0, 0) 1.96865px 6.71747px 0px,
    rgb(0, 0, 0) 0.992221px 6.92932px 0px,
    rgb(0, 0, 0) -0.00442571px 7px 0px,
    rgb(0, 0, 0) -1.00098px 6.92806px 0px,
    rgb(0, 0, 0) -1.97715px 6.71498px 0px,
    rgb(0, 0, 0) -2.91303px 6.36508px 0px,
    rgb(0, 0, 0) -3.78956px 5.88551px 0px,
    rgb(0, 0, 0) -4.58889px 5.28603px 0px,
    rgb(0, 0, 0) -5.29472px 4.57885px 0px,
    rgb(0, 0, 0) -5.89269px 3.77839px 0px,
    rgb(0, 0, 0) -6.3706px 2.90095px 0px,
    rgb(0, 0, 0) -6.71871px 1.96441px 0px,
    rgb(0, 0, 0) -6.92995px 0.98784px 0px,
    rgb(0, 0, 0) -6.99999px -0.00885142px 0px,
    rgb(0, 0, 0) -6.92743px -1.00536px 0px,
    rgb(0, 0, 0) -6.71372px -1.98139px 0px,
    rgb(0, 0, 0) -6.36324px -2.91705px 0px,
    rgb(0, 0, 0) -5.88311px -3.79328px 0px,
    rgb(0, 0, 0) -5.28313px -4.59223px 0px,
    rgb(0, 0, 0) -4.57551px -5.29762px 0px,
    rgb(0, 0, 0) -3.77466px -5.89507px 0px,
    rgb(0, 0, 0) -2.89692px -6.37243px 0px,
    rgb(0, 0, 0) -1.96016px -6.71995px 0px,
    rgb(0, 0, 0) -0.983458px -6.93057px 0px,
    rgb(0, 0, 0) 0.0132771px -6.99999px 0px,
    rgb(0, 0, 0) 1.00974px -6.92679px 0px,
    rgb(0, 0, 0) 1.98564px -6.71247px 0px,
    rgb(0, 0, 0) 2.92107px -6.36139px 0px,
    rgb(0, 0, 0) 3.797px -5.88071px 0px,
    rgb(0, 0, 0) 4.59557px -5.28022px 0px,
    rgb(0, 0, 0) 5.30051px -4.57215px 0px,
    rgb(0, 0, 0) 5.89746px -3.77094px 0px,
    rgb(0, 0, 0) 6.37426px -2.89289px 0px,
    rgb(0, 0, 0) 6.72119px -1.95591px 0px,
    rgb(0, 0, 0) 6.93119px -0.979076px 0px;
  }
}

ins{
  font-size: 7vw;
  text-decoration: none;
}

#app{
  display: flex;
  width: 20%;
  position: initial;
  margin-top:1em;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 900px) {
#app{
  width: 40%;
}
}

#credit{
  font-family: "din";
  color: #f9bb03;
  bottom: 20px;
  text-align: right;
  position: fixed;
}

@media only screen and (max-width: 900px) {
  #credit{
    margin-top: 30px;
    text-align: center;
    position: inherit;
  }
}