#warning-message{
  display: none;
  width : 100%;
  height :100%;
  background-color: #ff0000;
  color: #ffffff;
  font-size: 1.2em;
  line-height: 1em;
  padding : 20px;
}
@media only screen and (orientation:portrait){
  #wrapper { display:none; }
  #warning-message { display:block; }
} @media only screen and (orientation:landscape){ #warning-message { display:none; } }

#navNiveau{
  width :100%;
  height : 12%;
  background-color: #6f6f6f;
}

html,
body {
    height: 100%;
}

#left{
  float: left;
  width: 85%;
  padding: 3%;
  height: 100%;
}

#right{
  float : left;
  width : 15%;
  height : 100%;
}

div#texteFrançais {
    font-size: 1.3em;
    line-height: 1.2em;
    height: 32%;
}

div#texteEspagnol {
    font-size: 1.3em;
    line-height: 1.2em;
    height: 32%;

}

#btnCorrection{
  text-align : center;
  height: 14%;
  margin-bottom : 2%;
}


div#aide {
    background-color: #0093d8;
    font-size: 1.2em;
    height: 30%;
    padding-top: 35%;
    color: #fff;
    font-weight: bold;
    text-align: center;
}

div#suivant {
    background-color: #ffae00;
    height: 70%;
}

main{
  height : 88%;
}

div#flecheRetour {
    width: 20%;
    float: left;
    height: 100%;
}

div#nomNiveau {
    width: 80%;
    float: left;
    height: 100%;
}

#texteNiveau{
  color : #fff;
  font-size: 1.4em;
}

.btn3boutons {
    float: left;
    text-align: center;
        width: 33%;
}

#les3boutons{
  width: 100%;
    height: 20%;
    margin-top: 3%;

}