@media (orientation: landscape) {
  #first-bloc{
    padding-top: 10vw;
    position: relative;
    margin-bottom: 5vw;

    display: flex;
    justify-content: space-between;
}

.bloc{
    margin-left: 5vw;
    margin-right: 5vw;
}

#carrousel {
    position: relative;
    width: 42%;   /* largeur du carrousel */
    height: 400px;  /* hauteur du carrousel */
    overflow: hidden;
  }

  #carrousel img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;

    opacity: 0;
    transition: opacity 1s ease-in-out;
  }

  #carrousel img.active {
    opacity: 1;
  }

  .href:hover{
    text-decoration: underline;
    cursor: pointer;
  }

  .img-presse{
    filter: grayscale(100%);
    width: 32%;
    margin-bottom: 1vw;
    transition: .2s;
    border-radius: 50px;
  }

  .img-presse:hover{
    filter: grayscale(0%);
    border-top-right-radius: 150px;
    border-bottom-left-radius: 150px;
    cursor: pointer;
  }

  .img-presse:active{
    transform: scale(1.5);
    z-index: 10;
  }


  #wraper-presse{
    align-content: space-between;
    height: 150vw;
    flex-wrap: wrap;
    display: flex;
    flex-direction: column;
  }  
}

@media (orientation: portrait){
  #first-bloc{
    padding-top: 25vw;
    position: relative;
    margin-bottom: 5vw;

    display: flex;
    flex-direction: column-reverse;
}

.bloc{
    margin-left: 5vw;
    margin-right: 5vw;
}

#carrousel {
    position: relative;
    width: 100%;   /* largeur du carrousel */
    height: 40vh;  /* hauteur du carrousel */
    overflow: hidden;
  }

  #carrousel img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;

    opacity: 0;
    transition: opacity 1s ease-in-out;
  }

  #carrousel img.active {
    opacity: 1;
  }

  .href:hover{
    text-decoration: underline;
    cursor: pointer;
  }

  .img-presse{
    filter: grayscale(100%);
    width: 48%;
    margin-bottom: 3vw;
    transition: .2s;
    border-radius: 50px;
  }

  .img-presse:hover{
    filter: grayscale(0%);
    border-top-right-radius: 150px;
    border-bottom-left-radius: 150px;
    cursor: pointer;
  }

  .img-presse:active{
    transform: scale(1.5);
    z-index: 10;
  }


  #wraper-presse{
    align-content: space-between;
    height: 220vh;
    flex-wrap: wrap;
    display: flex;
    flex-direction: column;
  }

  .accueil-texte{
    margin-top: 4vw;
  }
}