
@font-face {
    font-family:police1;
    src:url("medias/Font/arial.ttf");
    }

@media screen and (min-width: 992px) {
body{
  font-family: police1;
  user-select: none;
}

p{
  font-size: 40px;
}

pre{
  font-size: 4vh;
  font-family: police1;
}

a{
  font-size: 40px;
  text-decoration: none;
  color: black;
  text-align: right;
}

h2{
  font-size: 40px;
  font-family: police1;
  font-weight: 100;
}

.grid-container1{
  display: grid;
  position: fixed;
  grid-template-columns: 3fr 1fr 1fr;
  gap: 10px;
  top: 0%;
  font-size: 40px;
  width: 99%;
  transform: scaleY(1.2);
}

.grid-container2{
  display: grid;
  grid-template-columns: 0.35fr 4.15fr 2fr 1fr;
  gap: none;
  box-sizing:content-box;
  font-size: 20px;
  transform: scaleY(1.2);
}

.grid-container3{
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: none;
  font-size: 40px;
  margin-top: 120px;
  transform: scaleY(1.2);
  padding-bottom: 10vh;
}

.grid-container4{
  position: fixed;
  bottom: 20px;
  font-size: 40px;
  transform: scaleY(1.2);
}

.end-foot{
  margin-bottom: 70vh;
}

.grid-element1{
  text-align: left;
}

.grid-element3{
  text-align: left;
}

#grid-scroll{
  text-align: left;
  overflow-y: scroll; 
  height: 550px;
  text-wrap: pretty;
  padding-right: 2vw;
}

#grid-scroll::-webkit-scrollbar {
  display: none;
}

.grid-element2{
  text-align: right;
}

.center{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 100%;
}

.image-container{
  display: grid;
  position: relative;
  justify-items: center;
  align-items: center;
  z-index: 1;
  padding-top: 85px;
  padding-bottom: 85px;
  pointer-events: none;
}

.center-image{
  width: 93%;
  height: auto;
}


.grid-container1 + .image-container{
  margin-top: 40px;
}

#img1,#img2,#img3,#img4,#img5,#img6,#img7,#img8,#img9{
  display: none;
}

.mySlides1, .mySlides2 {
  display: none;
}

img { 
  vertical-align: left;
  height: 500px;
}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  padding-top: 10px;
  padding-bottom: 10px;
}

/* Next & previous buttons */
.prev, .next {
  position: absolute;
  height: 500px;
  display: block;
  top: 10px;
  width: 500px;
  user-select: none;
}

.prev{
  cursor: w-resize;
}

/* Position the "next button" to the right */
.next {
  cursor: e-resize;
  right: 0;
  border-radius: 3px 0 0 3px;
}
}

#block-end {
  background-color: white;
  font-size: 40px;
}

#line{
  margin: 0;
}

/* media query pour iphone */

@media screen and (max-width: 992px) {
  body{
    font-family: police1;
  }
  
  p{
    font-size: 40px;
  }

  h2{
    font-size: 15px;
    font-family: police1;
    font-weight: 100;
  }
  
  pre{
    font-size: 15px;
    font-family: police1;
  }
  
  a{
    font-size: 25px;
    text-decoration: none;
    color: black;
    text-align: right;
  }
  
  .grid-container1{
    display: grid;
    position: fixed;
    grid-template-columns: 3fr 1fr 1fr;
    gap: 10px;
    top: 0%;
    font-size: 40px; 
    width: 96%;
    transform: scaleY(1.2);
    z-index: 1;
  }
  
  .grid-container2{
    display: grid;
    grid-template-columns: 0.4fr 4fr 0.5fr;
    gap: none;
    box-sizing:content-box;
    font-size: 15px;
    transform: scaleY(1.2);
  }
  
  .grid-container3{
    gap: none;
    font-size: 25px;
    transform: scaleY(1.2);
    padding-bottom: 10vh;
    padding-top: 30vh;
  }

  #grid-scroll{
    display: block;
    padding-top: 20px;
  }
  
  .grid-container4{
    position: relative;
    font-size: 25px;
    transform: scaleY(1.2);
    margin-top: 20vh;
  }
  
  .end-foot{
    margin-bottom: 75vh;
  }
  
  .grid-element1{
    text-align: left;
  }

  .grid-element3{
    text-align: left;
    display: none;
  }
  
  
  #grid-scroll::-webkit-scrollbar {
    display: none;
  }
  
  .grid-element2{
    text-align: right;
  }
  
  .center{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100%;
  }
  
  .image-container{
    display: grid;
    position: relative;
    justify-items: center;
    align-items: center;
    z-index: 1;
    padding-top: 85px;
    padding-bottom: 85px;
    pointer-events: none;
  }
  
  .center-image{
    width: 93%;
    height: auto;
  }
  
  
  .grid-container1 + .image-container{
    margin-top: 40px;
  }
  
  #img1,#img2,#img3,#img4,#img5,#img6,#img7,#img8,#img9{
    display: none;
  
  }
  
  .mySlides1, .mySlides2 {
    display: none;
  }
  
  img { 
    vertical-align: left;
    width: 96vw;
  }
  
  /* Slideshow container */
  .slideshow-container {
    max-width: 1000px;
    position: relative;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  
  /* Next & previous buttons */
  .prev, .next {
    position: absolute;
    height: 300px;
    display: block;
    top: 10px;
    width: 250px;
    user-select: none;
  }
  
  .prev{
    cursor: w-resize;
  }
  
  /* Position the "next button" to the right */
  .next {
    cursor: e-resize;
    right: 0;
  }
  #block-end {
    background-color: white;
    font-size: 25px;
  }

  #contact{
    height: auto;
  }
  }
