body {
                 font-family: Verdana , Arial , Tahoma , fantasy;
                 background-image: url("image/green_field_1440.png");
                 background-color: #cccccc;
            }
            
            .footer {
                   background-color: #333333;
                   background-image: url("image/logo.png");
                   background-repeat: no-repeat;
                   background-position: top 0.6em left 0.3em;
                   
                   color: white;
                   width: 100%;
                   padding: 0 0 2em 0;
            }
            
            .footer_1 {
                 width:8%;
            }
            .footer_2 {
                 width:28%;
            }
            .footer_3 {
                 width:34%;
            }
            .footer_4 {
                 width:26%;
                 padding:0.7em 0 0 0            }
            
            /* #QEEDD88;*/
            ._side { width: 100%;  margin:0; padding:0 }
            ._main { width: 100%;  margin:0; padding:0 }
            
            .title  { background-color:#EEDD88; }  
            .odd    { background-color:beige; }
            .even   { background-color:#EEDDbb; }  /* EEDD88*/
            ._rank_width { width: 70%; }
            ._main_width { width: 68%; }
            ._down1_width { width:30%; margin:0.4em 1.2em 1.2em 0 }
            ._down2_width { width:30%; margin:0.4em 0 1.2em 1.2em }
            
            ._v_mid {
                   vertical-align: top;
            }
            
              ._logo_font {
                    font-family: luck_font;
                    font-size: 2.0em;
                    color: #FFcc99;
                    margin-top:0.1em; 
              }
            
              ._logo_img img {
                  vertical-align: middle; /* or top, bottom, text-top, text-bottom */
              }                
                    
                .email_font {
                      font-size: 1.4em;
                      padding-bottom: 0.4em;
                      padding-left:2em;
                }        
                
                .butt_normal {
                    font-family: luck_font;
                    font-size: 1.5em;
                    color: #eeeeee;
                    background-color: #3338CC;
                    padding: 0.4em 1.2em 0.4em;
                    border-radius: 8px; 
                }
                
                
            @media only screen and (max-width: 600px)  {
                  ._logo_font {
                        font-family: luck_font;
                        font-size: 2.0em;
                        color: #FFcc99;
                        padding-top:1.4em; 
                  }
                  
                ._side { width: 99%; background-color:blue; }
                ._main { width: 99%; background-color:gray; }
                
                ._rank_width { width: 99%; }
                ._main_width { width: 99%; }
                ._down1_width { width: 80%; margin:0.4em 0 1.2em 0.1em }
                ._down2_width { width: 80%; margin:0.4em 0.2em 1.2em 0.4em}
                
                .footer_1 { width: 26% }
                .footer_2 { width: 72% }
                
                .footer_3 { width: 99% ; padding-top:2em; }
                .footer_4 { width: 99% }
                
                  ._logo_img img {
                      vertical-align: text-top; /* or top, bottom, text-top, text-bottom */
                  }                
                
                .email_font {
                      font-size: 1.4em;
                      padding-bottom: 0.4em;
                      padding-left:1.5em;
                }        
                
            }
            
            
              @font-face {
                font-family: luck_font;
                src: url(image/LuckiestGuy-Regular.ttf);
              }
              
              ._head {
                    font-family: luck_font;
                    font-size: 2.2em;
                    color:blue;
              } 
              
              ._lucky_font {
                    font-family: luck_font;
                    font-size: 1.2em;
                    color: #222222;
              }
              
              
              ._bold_title {
                    font-size: 2.0em;
                    font-weight: bold;
                    color: #222222;
              }
                           
              .center {
                   text-align: center
              }
              
              .lefty {
                   padding-left:4em;
                   text-align: left;
              }
              
              .right {
                   text-align: right;
                   padding-right:0.6em;
              }
              
              .num1 {
                    /*clip-path:     /**inset(0 1920px 576px  0);**/
                    width:160px;
                    height:160px;
              }
              
              table, th, td {
                 border: 2px solid gray;
                 border-collapse: collapse;
              }              
              
              .XXrank_table td {
                  text-align: center
              }
              
                .card {
                  border: 2px solid #222222;
                  padding: 10px;
                  border-radius: 8px;
                  background-color: #f8f8f8;
                }              
                
                
                .item_center {
                    display: flex; justify-content: center;
                }
                
                .item_center2 {
                    display: flex; justify-content: space-between;
                }
                
                .line {
                  width: 32px;
                  height: 6px;
                  background-color: #222222;
                  margin: 4px 0;
                }        
                
                .butt_name {
                      padding-left:0.5em;
                }