#titre{
   text-align: center;
   text-decoration: underline;
}

/* Styles spécifiques pour les écrans dont la largeur est inférieure à 600 pixels */
  @media screen and (max-width: 600px) {
   body {
      font-family: Times;
      font-size: 20px;
      background-color: #0F0F0F;
      padding-left: 1%;
      padding-right: 1%;
   }
   .banner{
      font-size: 30px;
      color: #0EA608;
      text-align: center;
      text-shadow: 0 5px 5px #0EA608;
      border-bottom: solid 20px;
      border-color: #0F0F0F;
   }
   
   .ulist{
       text-decoration: underline;    
       font-weight: bold;
   }
   
   a:link{
       color: #0EA608;
   }
   
   a:visited{
       color: #0EA608;
   }
   
   a:hover{
       color: #0EA608;
   }
   
   .fond{
      background-color: #141414;
      font-family: Times;
      font-size: 20px;
      color: #219c0c;
      border-top: solid 50px #141414;
      border-radius: 2%;
   }
   
   .icon{
      width: 50px;
   }
   
   #all{
      width: 75%;
      margin: 0 auto;
   }
   
   #all p{
      text-align:left ;
   }
   
   #left,#right{
      width: auto;
      margin: 2% auto;
      border: solid 0px;
      border-radius: 10px;
      background-color: #1C1C1C;
      padding: 5% ;
   }

   .br{
      height: 0;
   }

   .noselect {
      -webkit-touch-callout: none;
      -webkit-user-select: none; 
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      -user-select: none;
      visibility: hidden;
   }
 }
 
 /* Styles spécifiques pour les écrans dont la largeur est entre 601 et 900 pixels */
 @media screen and (min-width: 601px) and (max-width: 900px) {
   body {
      font-family: Times;
      font-size: 20px;
      background-color: #0F0F0F;
      padding-left: 20px;
      padding-right: 20px;
   }
   .banner{
      font-size: 30px;
      color: #0EA608;
      text-shadow: 0 5px 5px #0EA608;
      border-bottom: solid 20px;
      border-color: #0F0F0F;
      text-align: center;
   }
   
   .ulist{
       text-decoration: underline;    
       font-weight: bold;
   }
   
   a:link{
       color: #0EA608;
   }
   
   a:visited{
       color: #0EA608;
   }
   
   a:hover{
       color: #0EA608;
   }
   
   .fond{
      background-color: #141414;
      font-family: Times;
      font-size: 20px;
      color: #219c0c;
      border-top: solid 50px #141414;
      border-radius: 10px;
   }
   
   .icon{
      width: 75px;
   }
   
   #all{
      width: 75%; 
   }
   
   #all p{
      text-align:left ;
   }
   
   #all #left{
      display: inline-block;
      width: 75%;
      border: solid 0px;
      border-radius: 10px;
      background-color: #1C1C1C;
      margin-left: 5%;
      padding: 25px;
   }
   
   #right{
      display: inline-block;
      width: 75%;
      border: solid 0px;
      border-radius: 10px;
      background-color: #1C1C1C;
      padding: 25px;
      margin-left: 50%;
      margin-right: 5%;
   }
   
   .br{
      height: 20pt;
   }

   .noselect {
      -webkit-touch-callout: none;
      -webkit-user-select: none; 
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      -user-select: none;
      visibility: hidden;
   }
 }
 
 /* Styles spécifiques pour les écrans dont la largeur est supérieure à 900 pixels */
 @media screen and (min-width: 901px) {
   body {
      font-family: Times;
      font-size: 20px;
      background-color: #0F0F0F;
      padding-left: 20px;
      padding-right: 20px;
   }
   .banner{
      font-size: 40px;
      color: #0EA608;
      text-align: center;
      text-shadow: 0 5px 5px #0EA608;
      border-bottom: solid 20px;
      border-color: #0F0F0F;
   }
   
   .ulist{
       text-decoration: underline;    
       font-weight: bold;
   }
   
   a:link{
       color: #0EA608;
   }
   
   a:visited{
       color: #0EA608;
   }
   
   a:hover{
       color: #0EA608;
   }
   
   .fond{
      background-color: #141414;
      font-family: Times;
      font-size: 20px;
      color: #219c0c;
      border-top: solid 50px #141414;
      border-radius: 10px;
   }
   
   .icon{
      width: 100px;
   }
   
   #all{
      width: 75%; 
   }
   
   #all p{
      text-align:left ;
   }
   
   #all #left{
      display: inline-block;
      width: 75%;
      border: solid 0px;
      border-radius: 10px;
      background-color: #1C1C1C;
      margin-left: 5%;
      padding: 25px;
   }
   
   #right{
      display: inline-block;
      width: 75%;
      border: solid 0px;
      border-radius: 10px;
      background-color: #1C1C1C;
      padding: 25px;
      margin-left: 50%;
      margin-right: 5%;
   }
   
   .br{
      height: 50pt;
   }

   .noselect {
      -webkit-touch-callout: none;
      -webkit-user-select: none; 
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      -user-select: none;
      visibility: hidden;
   }
}