label{
  display:inline;
}
#droppable_1{
  width: 100%;
}
.btn_resolution{
  font-size: 20px
}
.img_b3{
  width:"96px";
  height:"72px";
}
#bulle_3{
  display: none;
}
.radio_resolution, .checkbox_resolution{
  height:20px;
  background:white;
  border:2px solid #555;
}
.radio_resolution{
  width:20px;
}
.checkbox_resolution{
  width:30px;
}
.center_utiles,.center_ex ,.center{
  margin-left: 39.5%;
}
label{
    font-family: Arial, Helvetica, sans-serif;
}
.liste_item{
  width: 80%;
  margin: 0px;
  font-size: 100%;
}
.game{
  float: left;
  border: 2px solid lightgray;
  border-radius: 5px;
  padding: 5px;
  margin: 2px;
}
.game:hover{
  opacity: 80%;
  cursor: pointer;
}
#gameBar{
  margin-left: 10%;
  margin-right: 10%;
}
#indice_item{
 padding: 5px;
 margin-right: 20%;
 margin-left: 20%;
 width: 60%;
 border-radius: 5px;
 margin-bottom: 2%;
}
#Menteurs_0{
background-color: lightgray;
}
#Champignions_1{
background-color:lightblue;
}
#Bateau_2{
background-color:lightgreen ;
}
#Photos_3{
background-color: lightpink;
}
#Escalier_4{
background-color: lightyellow;
}
#Livres_5{
background-color: plum;
}
#Triangles_en_carre_6{
background-color: yellow;
}
#Oeufs_7{
background-color: greenyellow;
}
.li_tester{
  border: 2px solid lightgray;padding: 10px; font-weight: bold; font-size: 18px;
  margin:0 20% 0 20%;
}
#sortable:hover{cursor: pointer;}
.responsive_img{
  max-width: 100%;
  max-height: 20%;
}
#next_ex_2{
  display: none;
}
.img_indices{
  max-width: 100%;
  height: auto;
}
.img_b2{
  max-width: 100%;
}
.mobile_img_b2
{
  display: none;
}
#item_3 img{
  width: 100%;
}

@media only screen and (max-device-width: 640px) {
  #draggable-list{
    width: 100%;
    margin: 0;
  }
  #gallery{
    float: left;
    display: inline;
    width: 100%;
  }
  #gallery li a{
    transform: scale(2.5);
  }
  #liste{
    width: 98%;
    border-radius: 25px;
  }
  #liste h4{

    border-radius: 25px;
  }
  #bulle_3{
    display: inline-block;
    text-align: center;
  }
  #bulle_2{
    display: none;
  }
  .mobile_img_b2{
    display: inline-block;
    width: 100%;
  }
  .container{
    width: 100%;
    text-align: left;
  }
  #indice_item{
    margin: 0;
    width: 100%;
  }
  .body{
    background-color: white;
  }

  .li_tester{
    border: 2px solid lightgray;padding-bottom: 80px; font-weight: bold;
    margin: 0px 5px 0px 5px;
    width: 95%;
    height: 90px;
    font-size: 40px;
  }
  p{
    font-size: 20px;
  }
 .mobile_link{
    height: 100px;
    font-size: 60px;
    border-radius: 25px;
    padding-top: 40px;
  }

 .li_tester::selection{
   display: none;
 }
 .draggabble{
   display: block;
 }
 .title_problem{
   width: 100%;
   height: 100%;
 }
.droppable{
  display: none;
}
#next_ex_2{
  display: block;
  font-size: 20px;
}
#sortable {
  -webkit-tap-highlight-color: transparent;
}
.game{
  display: inline-block;
  width: 95%;
}
.btn_res , .btn_resolution , .button_back{
  height: 50px;
  width: 100%;
  font-size: 20px;
}
#droppable_1{
  display: none;
}
#gameBar{
  margin:0;
  text-align: center;
}
.center_utiles,.center_ex ,.center{
  margin-left: 0%;
  width: 100%;
}
.liste_item{
  width: 100%;
}
.problem_b2{
  border: 2px solid gray;
  border-radius: 25px;
  margin-top: 5px;
}
#right_arrow,#left_arrow{
  height: 70px;
  border-radius: 100px;
  background-color: lightgreen
}
#checkbox_div{
  width: 100%;
  text-align: left;
}
.index_link{
  width: 100%;
  text-align: left;
}
.question_2 div{
  border-bottom: 2px solid black;
}
.tester_mes_connaissances_text{
  font-size: 50px;
}
#bulle_test{
  width: 90%;
}
}