@media screen and (max-width: 414px) {
    .main-container{
        display: grid;
        grid-template-columns: repeat(1,1fr); 
        place-items: center;
        padding-left:10px;
        padding-left:10px;
        row-gap:5px;
       grid-template-areas:
       "first"
       "labelDiv"
       "navDiv"
       "leftPanel1"
       "leftPanel2"
       "midPanel"
       "footer"
       ;
       
          }
#header1{
    grid-area: first;
    background:#8ebf42;
    height:15%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.square{
    width:40px;
    height:40px;
    margin-top: 10px;
    margin-left: 5px;
    position: relative;
    background: black;
}
.line{
    position :absolute;
    height:2px;
    width: 100%;
    background-color:#fff;
    border-radius: 1px;
    transition: all cubic-bezier(0.26,0.1,0.27,1.55) 0.35s;
}
.top{
    top:5%;
}
.middle{
    top:40%;
}
.bottom{
    top:78%;
}
.icon.close .top{
 transform: rotate(45deg);  
 top:48%;
}
.icon.close .middle{
  transform: rotate(-45deg);  
  top:48%;
}
.icon.close .bottom{
  transform: rotate(-45deg);  
  top:48%;
}
#defTitel{
    display:none;
}
#contactStripe{
    display:none;
}
.header2{
 display:none;   
}
#navPara{
 grid-area:labelDiv; 
 text-align: center;
 font-weight: bold;
 font-size: 30px;
 font-family: "Times New Roman", Times, serif;
 color:#02145a;
 height:30px;
}
nav{
    grid-area:navDiv;
    background:#02145a;;
   
}
nav ul{  
     list-style-type: none;
     text-align: left;
     padding-left:15px;
      background-color:#f0b71a;    
}
nav ul li{  
     padding: 5px ; 
  border-bottom: 1px solid #ddd;     
}
nav ul li a{
    text-decoration: none;
    color: white;
}
#navUl{
    grid-area:navDiv;
    background:#02145a;;
   
}
#navUl ul{  
     list-style-type: none;
     text-align: left;
     padding-left:15px;
      background-color:#f0b71a;    
}
#navUl ul li{  
     padding: 5px ; 
  border-bottom: 1px solid #ddd;     
}
#navUl ul li a{
    text-decoration: none;
     color: white;
}
#anglais{
     color:black;
 }
 .leftpanel1{
 grid-area:leftPanel1;
 background-color:#7291c2;
  border-radius: 15px;
  height:150px;
  margin-bottom: 20px;
 }
 #fileTable{
  padding: 1rem;
  text-align: center;
  width:100%;
}
#fileTable td{
  border: 1px solid #999;
  padding-left: 0.5rem;
 
}
#fileTable th{
  border: 1px solid #999;
  padding-left: 0.5rem;
}
#actual-btn{
  display:none; 
}
#messLabel2{
display:none;
background-color: yellow;  
}
#lableFile{
    background-color: #E8E8E8;
    font-family: Verdana, sans-serif;
    font-size:1em;
}
 #maansoId{
 width: 100%;
 border:0;
 text-align: center;
}
.midpanel{
   grid-area:midPanel;
}
#tableResult{
  border-width: 35px;
  border-color: #8ebf42;
  width: 100% ; 
  font-size: 1em;
}
#tableResult th{
    border: 1px solid #999;
  padding: 0.5rem;
 background:#edf2ff; 
}
#tableResult td{
    border: 1px solid #999;
    padding: 0.5rem;
    font-size: 0.75em;
 
}
#captionTB1{
   border: 1px solid black;
   font-size: 1.4em;
   font-weight: bold;
   background-color:#DCDCDC;
   text-align: center;
}
#captionTB2{
   color:red;
   font-size: 1em;
   font-weight: bold;
   text-align: center;
    background-color:#000080;
    color:white;
   
}
#tbSummary{
   background-color:#000080;
   color:white;
   border: 1px solid;
   width: 100% ; 
   text-align: left;  
   font-family: Book Antiqua;
}
#tbSummary th{
     border: 1px solid #999;
}
#tbSummary td{
   border: 2px solid #999; 
    
}
.leftpanel2{
   grid-area:leftPanel2;
   margin-top:10px; 
}
#searchDiv{
    display:none;
    grid-area:searchDiv;
    border-radius: 25px;
    width: 100%;
    background-color:#7291c2;
    margin-top: 10px; 
    margin-bottom: 10px;
}
#tixDiv{
    display:none;
   /* grid-area: tixDiv;
    border-radius: 25px;
    width: 80%; 
   position: relative;
   background: white;
   border-radius: .4em; 
   border: 2px;
   border: 2px solid black;
   padding: 2px;
   margin-top: 10px;
   margin-left: 40px;*/
   
}
#tixDiv:after {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-right-color:red;
	border-left: 0;
	border-bottom: 0;
	margin-top: -10px;
	margin-left: -20px;
}
#tixPar{
 padding-left:50px;
}
#credits{
 
 display:none;
  
  }
footer{
   display:none;
}
#imLogo{
 display:none;   
}
}