.table_container-reg {
  display: none;
}
form {      
        display: flex;      
        gap: 0.5rem;      
        max-width: 600px;
        margin: 0 auto;   
        }
input {      
        flex: 1;      
        padding: 0.6rem;    
        }

nav {
  text-align: center;
  margin-top: 35px;
}
        
.button_search {      
        padding: 0.6rem 1rem;      
        cursor: pointer;
        font-weight: 500;
        text-transform: uppercase;
        color: #f3e4e4;
        border: 1px solid #c83a3a;
        border-radius: 4px;
        box-shadow: 1.5px 1.5px 0 0px rgba(156, 42, 42, 1);
        background: #c83a3a;
        -moz-transition: all 0.6s ease;
        -webkit-transition-property: all;
        -webkit-transition-duration: 0.6s;
        -webkit-transition-timing-function: ease;            
        }
        
.button_search:hover {
	      background: rgba(243,228,228,0.5);
	      border: 1px solid #c83a3a;
	      box-shadow: none;
	      color: #c83a3a;
	      -moz-transition: all 0.3s ease;
        -webkit-transition-property: all;
        -webkit-transition-duration: 0.3s;
        -webkit-transition-timing-function: ease;
        }
         
.search-results {
          text-align: center;          
        }
        
.quality {
  color: red;
  font-weight: 500;
}
.quality-thin {
  color: #000;
  font-weight: 400;
}        
        
table {      
        border-collapse: collapse;      
        margin-top: 1rem;
        width: 100%;
        table-layout: fixed;    
        }
        
th, td {      
        border: 1px solid #ccc;      
        padding: 0.6rem;           
        vertical-align: top;
        overflow-wrap: anywhere;    
        }
th {      
  background: #f2f2f2;    
        }

        
.search-results-table,
.hs_container.hidden {
          display:none;
        }
.search-results-table.visible {
          display: contents;
        }
thead {
  display: none;
} 
        
.table-wrap {  
width: 100%;  
overflow-x: auto;
}

.table_container-reg thead {  

}

.table_container-reg,
.table_container-reg tbody {  
display: block;  
width: 100%;
}

.table_container-reg tbody {  
display: grid;  
grid-template-columns: repeat(3, minmax(220px, 1fr));  
column-gap: 40px; /* room for logos outside neighboring cards */  
row-gap: 40px;
}

.table_container-reg tbody tr {  
position: relative;
display: block;
box-sizing: border-box;  
border: 1px solid #ccc;
border-radius: 6px;  
padding: 12px;  
overflow: visible;
}

.table_container-reg tbody td {  
display: flex;  
gap: 8px;  
padding: 6px 0;
}

/* Create table heading */
.table_container-reg tbody td::before {  
font-weight: bold;  
flex: 0 0 80px;
text-align: center;
}
.table_container-reg tbody td:nth-child(1)::before { 
content: "Date:"; 
}.table_container-reg tbody td:nth-child(2)::before { 
content: "Teams:"; 
}.table_container-reg tbody td:nth-child(3)::before { 
content: "Pts:"; 
}.table_container-reg tbody td:nth-child(4)::before { 
content: "Quality:";
 color: black;   
}.table_container-reg tbody td:nth-child(5)::before { 
content: "Comment:"; 
}

.table_container-reg tbody td.copy-cell {  
  display: block;
  padding-top: 10px;
  text-align: center; 
}
.copy_item, #email-cards {  
  display: inline-block;  
  padding: 8px 14px;  
  cursor: pointer;
  color: #f3e4e4;
  border: 1px solid #c83a3a;
  border-radius: 4px;
  background: #c83a3a;
  letter-spacing: 0.07rem;
  -moz-transition: all 0.6s ease;
  -webkit-transition-property: all;
  -webkit-transition-duration: 0.6s;
  -webkit-transition-timing-function: ease;  
}
.copy_item:hover, #email-cards:hover {
  background: rgba(243,228,228,0.5);
  color: #c83a3a;  
}

#load-more {
  display: block;
  margin: 24px auto;
  padding: 12px 28px;      
  color: #c83a3a;
  border: 1px solid #c83a3a;
  border-radius: 4px;
  background: rgba(243,228,228,0.7);
  font-size: 16px;
  cursor: pointer;
  letter-spacing: 0.07rem;
  -moz-transition: all 0.6s ease;
  -webkit-transition-property: all;
  -webkit-transition-duration: 0.6s;
  -webkit-transition-timing-function: ease;
}  
  
#load-more:hover {
  color: #f3e4e4;
  background: #c83a3a;
}

#load-more:focus-visible {
  outline: 3px solid #111;
  outline-offset: 3px;
}

#email-cards,
#load-more,
#pagination {
  display: none;  
}

#email-cards.show_email_button {
  display: block;
  margin: 0 auto;
}

#load-more.show_load_more_button {
  display: block;
  margin: 24px auto;
}

.nav_button {  
  cursor: pointer;
}
.nav_button:hover {
  color: #f3e4e4;
  background: #c83a3a;
  border: 2px solid #c83a3a;
}

#pagination.show_pagination {
  display: block;
}

@media (max-width: 900px) {  
.table_container-reg tbody {    
  grid-template-columns: repeat(2, minmax(0, 1fr));    
  column-gap: 88px;  
}
}
@media (max-width: 600px) {  
.table_container-reg tbody {    
grid-template-columns: 1fr;    
row-gap: 16px;  
}
}


 
@media screen and (max-width: 600px) { 
  th,  td {    
    padding: 4px;    
    font-size: 12px;  
    }
}    
@media screen and (max-width: 587px) { 
  table {
   
  }
}
/*@media screen and (max-width: 600px) { 
   form {
     display: grid;
     margin-bottom: 40px;          
   }
   #query {
     width: 80%;
     margin: 0 auto;
   }
   #submit-search {
     width: 100px;
     margin: 0 auto;
   } 
}
*/