body 
     {
        background: rgb(194, 240, 194); 
        background-repeat: repeat;
        margin: 0; 
        font-family: 'Trebuchet MS'; 
      }
     .br1 { clear: both; }
      
     h1 {
        font-size: 120%; 
        color: navy; 
        text-align: center;
        }
       h2 {
        font-size: 100%; 
        color: red; 
        padding-left: 10px;
        }
        h3 {
            
        font-size: 100%; 
        color: rgb(2, 39, 2); 
        text-align: center;
        }
        h4 {
           font-size: 100%; 
           color: navy; 
       }
       
        h5 {
           font-size: 80%; 
           color: red; 
       }
       
       h6 {
           font-size: 80%; 
           color: black; 
       }
       
       p,ul,li,td {
        color: black; 
        }
        a {
            outline: none;
            text-decoration: none;
            padding: 2px 1px 0;
          }
          
          a:link {
            color: #bcc7b4;
          }
          
          a:visited {
            color: #999c97;
          }
          
          a:focus {
            border-bottom: 1px solid;
            background: #bae498;
          }
          
          a:hover {
            border-bottom: 1px solid;
            background: #cdfeaa;
          }
          
          a:active {
            background: #265301;
            color: #cdfeaa;
          }



      .nwp { margin: auto; word-wrap: break-word;}
      .haut_zero
        {
	        display: none;
	        overflow: hidden;
	        height: 0;
         }
      .center { text-align: center; }
      .bold { font-weight: bold; }
      .full { width: 100%; }
      
      .col_noir {color: black;}
      .col_blanc {color: white;}
      .col_jaune {color: yellow;}


      .bgcol_jaune { background-color: yellow;}
      .bgcol_bleu { background-color: blue;}
      .bgcol_rouge { background-color: red;}
      .bgcol_lightblue { background-color: lightblue;}
      .bgcol_or { background-color : #d6c746; }
      .bgcol_noir { background-color: black;}
      .bgcol_bonus { background-color: grey;}
      .bgcol_lblue {background-color: lightblue;}

      .wrapper_g { margin: 0 auto; width: 200px; border-style: double;}
      .wrapper_m { margin: 0 auto; width: 400px; border-style: double;}
      .wrapper_dd { margin: 0 auto; width: 200px; border-style: double;}

      .wrapper { margin: 0 auto; width: 1000px; border-style: none;}
         .yams_corps
         {
          width: 1000px;
          height: 700px;
          background-color: #213d0a;
         }

        .yams_grid_entete
        {
          display: grid; 
          grid-template-columns: repeat(3, 1fr); 
          grid-auto-rows: 100px; 
          grid-column-gap: 1px;
          grid-row-gap: 5px;
          background-color: #213d0a;
          padding: 1px 1px 1px 1px;
          position: relative;
        } 
        .yams_gdent_col1 {
          grid-column-start: 1; 
            grid-column-end: 1; 
            grid-row-start: 1; 
          grid-row-end: 1; 
          background-color: rgb(241, 248, 244);
          font-size: 14px; 
          color: rgb(10, 10, 10); 
          padding: 1px 1px 1px 1px; 
        }
        .yams_gdent_col2 {
          grid-column-start: 2; 
            grid-column-end: 2; 
            grid-row-start: 1; 
          grid-row-end: 1; 
          background-color: rgb(241, 248, 244);
          font-size: 14px; 
          color: rgb(10, 10, 10); 
          padding: 1px 1px 1px 1px; 
        }
        
        .yams_gdent_col3 {
          grid-column-start: 3; 
            grid-column-end: 3; 
            grid-row-start: 1; 
          grid-row-end: 1; 
          background-color: rgb(241, 248, 244);
          font-size: 14px; 
          color: rgb(10, 10, 10); 
          padding: 1px 1px 1px 1px; 
        }
        .yams_footer
        {
          width: 998px;
          border: 1px;
          border-style: double;
          border-color: rgb(219, 233, 22);
          font-size: 14px; 
          background-color: #213d0a;
          color: rgb(219, 233, 22); 
        }	
        .yams_foot
        {
          width: 1000px;
          border-style:   dotted;
          position: fixed;
          bottom: 0;
          font-size: 14px; 
          background-color: #213d0a;
          color: rgb(219, 233, 22); 
        }	
        .yams_connect
        {
          display: grid; 
          grid-template-columns: 1fr; 
          grid-auto-rows: 350px; 
          grid-column-gap: 1px;
          grid-row-gap: 5px;
          background-image: url('https://www.quizzbees.com/images/Fond_Jeu_Des.jpg');
          background-repeat: repeat-x;
          padding: 0px 0px 0px 0px;
          position: relative;
        }
       .yams_conn_col
        { 
          grid-column-start: 1; 
          grid-row-start: 1; 
          grid-row-end: 1; 
          font-size: 14px; 
          color: rgb(241, 213, 50); 
          padding: 40px 1px 1px 1px; 
        }
        .yams_titre
        {
            display: grid; 
            grid-template-columns: 1fr; 
            grid-auto-rows: 30px; 
            grid-column-gap: 0;
            grid-row-gap: 0;
            background-color: rgb(210, 243, 157);
            padding: 1px 1px 1px 1px;
            position: relative;
        }
        .yams_titre_col
        { 
            grid-column-start: 1; 
            grid-column-end: 1; 
            grid-row-start: 1; 
            grid-row-end: 1; 
            background-color: rgb(210, 243, 157);
            font-size: 14px; 
            color: rgb(10, 10, 10); 
            padding: 1px 1px 1px 1px; 
        }
        .yams_statut_container
        {
            display: inline-grid;
            grid-column-gap: 0;
            grid-row-gap: 0; 
            justify-content: center;
           
        }
        .yams_statut_color_entete
        {
            background-color: black;
            color: white;
        }
        .yams_statut_color_ligne
        {
            color: black;
            background-color: rgb(210, 243, 157);
        }
        .yams_statut_case
        {
            border: 1px solid black;
            min-width: 130px;
            min-height: 30px;
        }
        .yams_tbd_col
        { 
            grid-column-start: 1; 
            grid-column-end: 1; 
            grid-row-start: 1; 
            grid-row-end: 1; 
            background-color: rgb(210, 243, 157);
            font-size: 14px; 
            color: rgb(10, 10, 10); 
            padding: 1px 1px 1px 1px; 
        }
        
       
        .haut_zero
       {
          display: none;
          overflow: hidden;
          height: 0;
       }

       .yams_bloc_statut
       {
            margin: 0 auto;
            width: 1000px;
            border-style: none;
            visibility: hidden;
       }
       .yams_bloc_statut_exit
       {
            margin: 0 auto;
            width: 1000px;
            color: whitesmoke;
       }
       .yams_bloc_game
       {
            
            visibility: hidden;
            background-color: black;
            display: grid;
            grid-template-columns: 500px 500px;
            grid-template-rows: 30px 235px 235px; 
            border: 2px solid red;


       }
       .yams_bloc_game_exit
       {
        margin: 0 auto;
        width: 1000px;
        color: whitesmoke;
       }
       .yams_bloc_manche
       {
            grid-column-start: 1;
            grid-column-end: 3;
            grid-row-start: 1;
            grid-row-end: 1;
            background-color: yellowgreen;
       }
       .yams_bloc_monjeu
       {
            grid-column-start: 1;
            grid-column-end: 1;
            grid-row-start: 2;
            grid-row-end: 2;
            background-color: blueviolet;
       }
       .yams_mjclt_container
       {
            display: grid;
            grid-template-columns: 100px 100px 100px 100px 100px;
            grid-template-rows: 20px;

       }
       .yams_mjclt_L1
       {
            display: inline-block;
            background-color: black;
            color: whitesmoke;
            grid-column-start: 1;
            grid-column-end: 6;
            grid-row-start: 1;
            grid-row-end: 1;
       }
       .yams_mjclt_Ln
       {  
            color: whitesmoke;
       }
       .yams_mj_entete_container
       {
            display: grid;
            grid-template-columns: 100px 400px;
            grid-template-rows: 20px 40px; 
            
       }
       .yams_mj_entete_L1
       {
        background-color: orange;
        color: black;
        grid-column-start: 1;
        grid-column-end: 3;
        grid-row-start: 1;
        grid-row-end: 1;
       }
       .yams_mj_entete_case
       {
        min-width: 30px;
        min-height: 30px;
       }
       .yams_mj_jeu_container
       {
            display: grid;
            grid-template-columns: 250px 250px;
            grid-template-rows:20px auto;
           
       }
       .yams_mj_jeu_des_container
       {
            display: grid;
            grid-template-columns: 220px;
            grid-template-rows: 40px 40px 30px 20px; 
            justify-items: center;
            row-gap: 5px;
       }
       .yams_mj_jeu_des_container_L1L2
       {
            display: grid;
            grid-template-columns: repeat(5, auto);
            grid-template-rows: auto; 
            justify-items: center;
       }
       .yams_mj_jeu_des_container_L3L4
       {
            display: grid;
            grid-template-columns: 220px;
            grid-template-rows: 30px; 
            justify-items: center;
       }

       .yams_mj_jeu_combi_container
       {
            display: grid;
            grid-template-columns: repeat(auto-fill, min(65px));
            grid-template-rows: auto; 
            column-gap: 10px;
            border: 1px black;
       }
       .yams_mj_jeu_combi_case
       {
            display: grid;
            grid-template-columns: repeat(3, 20px);
            grid-template-rows: auto;
            column-gap: 2px; 
            
       }
       .yams_bloc_tchat
       {
            grid-column-start: 1;
            grid-column-end: 1;
            grid-row-start: 3;
            grid-row-end: 3;
            background-color: gray;
       }
       .yams_bloc_tbpts
       {
            grid-column-start: 2;
            grid-column-end: 2;
            grid-row-start: 2;
            grid-row-end: 4;
            background-color: peru;
       }
       .yams_bloc_tbpts_container
       {
            background-color: black;
            display: grid;
            grid-template-columns: 40px, repeat(auto-fill, minmax(40px, 1fr), minmax(40px, 1fr));
            grid-template-rows: auto; 
            border: 1px solid black;
       }
       .yams_bloc_tbpts_container_case
       {
            min-width: 30px;
            min-height: 30px;     
       }
          
      .yams_bloc_tbpts_enteteL1 
      {
        background-color: black;
        color: white;
        grid-column-start: 1;
        grid-column-end: 11;
        grid-row-start: 1;
        grid-row-end: 2;
      }
      .yams_bloc_tbpts_enteteL2 
      {
        background-color: black;
        color: white;
        grid-column-start: 1;
        grid-column-end: 11;
        grid-row-start: 2;
        grid-row-end: 2;
      }

      .tchat_container
      {
          width: 500px;
          height: 235px;
          border: 1px solid black;
      }
      .tchat_saisie 
      {
          width: 460px;
          height: 23px;
          border: 1px solid green;
          font-size: 80%;
          font-family: Verdana, Geneva, Tahoma, sans-serif;
          resize: none;
          overflow: auto;
          background-color: whitesmoke;
          color: blue;
          
      }
      .scrollableDiv {
          width: 496px;
          height: 210px;
          overflow-y: scroll;
          overflow-x: hidden;
          font-size: 80%;
          font-family: Verdana, Geneva, Tahoma, sans-serif;
          
      }
      
      .scr_tb {
          display: grid;
          grid-template-columns: 80px 396px;
          grid-template-rows: auto;
          column-gap: 2px;
          row-gap: 2px;
          border: 1px black; 
      }
      .scr_left {
          text-align: left; 
          word-wrap: break-word;           
      }
      .scr_right {
          text-align: right;
          word-wrap: break-word;
      }
      .scr_bgwhite {
          background-color: whitesmoke;
      }
      .scr_bglyellow {
          background-color: lightyellow;
      }
      .scr_colblack {
          color: black;
      }
      .scr_colred {
          color: red;
      }
      .scr_colgreen {
          color: green;
      }
      .scr_colyellow {
          color: yellow;
      }
      .scr_colpurple {
          color: purple;
      }
      .scr_colblue {
          color: blue;
      }



      .btnrep_yams {
      border:white;
      padding:6px 4px 6px 4px;
      border-radius:8px;
      background:lightgrey;
      font:bold 11px Verdana;
      color: black;
      white-space: normal;
      word-wrap: break-word;
      } 

        .btnrond_yams {
            width:50px;
            height:50px;
            background:#012c07;
            
            font:bold 13px Verdana;
            border-radius:50%;
            border:none;
            color:#fff;
        }
        .btnrondcarre {
            border-radius:12px 0 12px 0;
            background: #478bf9;
            border:none;
            color:#fff;
            font:bold 15px Verdana;
            padding:6px 6px 6px 6px;
        }	
        .btnrondcarre_green {
            border-radius:12px 0 12px 0;
            background: rgb(39, 53, 1);
            border:none;
            color:#fff;
            font:bold 15px Verdana;
            padding:6px 6px 6px 6px;
        }

        .bloc_tbpts_table_general {
          font-size: 80%;
          margin: 0;
          border: 2px solid black; /* Pas de bordure = "none". 1px solid white*/
          border-collapse: separate; /* Valeur par défaut: "separate".  collapse*/
          border-spacing: 0;
          border-radius: 5px 5px 5px 5px;
          padding: 0px;
          
          }
          .td_border {
            border:1px solid black; 
         
         }
         .th_border {
          border:1px solid black; 
          background-color: black;
          color: white
         
         } 
        .td_news {
            vertical-align:top;
            color:black;
            font-size: 100%;
         }	
         .td_footer {
            color:yellow;
            font-size:90%;
         }