#intro {
    flex-flow:  column;
    display : flex;
    justify-content: center;
    align-content: center;
}
#introVideo {
    display:none;
    margin : 0 auto;
    height: 500px;
    width: 888px;
}

.logoLGM {
    flex-basis: 100px;
    background-image: url("../images/LGM-group.svg");
    background-position: left;
    background-size: contain;
    background-repeat: no-repeat;
}
#intro .logoMoka {
    flex : 2;
}

.start-block {
  flex: 2;
  display: flex;
}

#introButtons {
    flex : 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#introButtons button {
    margin: 20px;
}

#introButtons .main-button {
    font-size: 1.5em;
}
#introButtons .secondary-button {
    font-size: 0.8em;
}


/*----------------------------------------*/


/* Format tablette portrait */
@media (max-width: 1000px) {

  #introButtons .main-button {
    font-size: 2.5em;
  }
  #introButtons .secondary-button {
    font-size: 1.5em;
  }

  #introVideo {
    display:none;
    width: 75%;
    margin : 10% auto;
  }

}

/* Format mobile */
@media (max-width: 600px) {
  #introButtons .main-button {
    font-size: 1.8em;
    margin: 20px 20px 0 20px;
  }

  .start-block {
    flex-direction: column;
  }

  .logoLGM {
    flex-basis: initial;
    width: 30%;
    height: auto;
    min-height: 15%;
    background-position: center;
    display: block;
    margin: auto;
  }

  #introVideo {
    width: 100%;
    height: auto;
    margin: 10% auto;
  }

}