:root { --one : 36px;}

.rows                             {display: grid;  grid-gap: var(--gap); grid-auto-rows:         auto;         grid-auto-flow: row;        }  
.columns                          {display: grid;  grid-gap: var(--gap); grid-auto-columns:      auto;         grid-auto-flow: column;   } 
  
  
.leftSeprattorRight               { display:grid;   grid-gap: var(--gap); grid-template-columns:  1fr 1px 1fr;                           } 
.leftSeprattor2Right               { display:grid;   grid-gap: var(--gap); grid-template-columns:  1fr 1px 2fr;                           } 
  
.headerLeftContentFooter          { display:grid;   grid-template-columns: 50px auto;                          grid-template-rows: 60px auto 40px;   }
.headerLeftContent                { display:grid;   grid-template-columns: 50px auto;                          grid-template-rows: 60px auto;        }
  
.headerRightContentFooter         { display:grid;   grid-template-columns: auto 50px;                          grid-template-rows: 60px auto 40px;   }
.headerRightContent               { display:grid;   grid-template-columns: auto 50px;                          grid-template-rows: 60px auto;        }
  
.headerQuarterLeftContentFooter   { display:grid;   grid-template-columns: 50px auto;                          grid-template-rows: 60px auto 40px;   }
.headerQuarterLeftContent         { display:grid;   grid-template-columns: 50px auto;                          grid-template-rows: 60px auto;        }
  
.headerQuarterRightContentFooter  { display:grid;   grid-template-columns: 3fr 1fr;                            grid-template-rows: 60px auto 40px;   }
.headerQuarterRightContent        { display:grid;   grid-template-columns: 3f 1fr;                             grid-template-rows: 60px auto;        }
  
.r_oneTowSeven                    { display:grid;   grid-gap: var(--gap); grid-template-rows:    1fr 2fr 7fr                                  }  
.r_oneAuto                        { display:grid;   grid-gap: var(--gap); grid-template-rows:    var(--one)  auto                             } 
.r_oneOneAuto                     { display:grid;   grid-gap: var(--gap); grid-template-rows:    var(--one) var(--one) auto                   } 
.r_towOneAuto                     { display:grid;   grid-gap: var(--gap); grid-template-rows:    calc(2 * var(--one)) var(--one) auto                   } 
.r_oneTowAuto                     { display:grid;   grid-gap: var(--gap); grid-template-rows:    var(--one) calc(2 * var(--one)) auto                   } 
.r_oneAutoOne                     { display:grid;   grid-gap: var(--gap); grid-template-rows:    var(--one)  auto        var(--one)           }  
.r_oneOneAutoOne                  { display:grid;   grid-gap: var(--gap); grid-template-rows:    var(--one) var(--one) auto  var(--one)       } 
  
 
.c_oneAuto                        { display:grid;   grid-gap: var(--gap); grid-template-columns:    var(--one)  auto                   }
.c_4oneAuto                        { display:grid;   grid-gap: var(--gap); grid-template-columns:   calc(var(--one)*4)  auto                   }
.c_Auto2one                        { display:grid;   grid-gap: var(--gap); grid-template-columns:   1fr calc(var(--one)*2)                     }
.c_Half                           { display:grid;   grid-gap: var(--gap); grid-template-columns:    1fr  1fr                   }
.c_oneTowOne                      { display:grid;   grid-gap: var(--gap); grid-template-columns:    1fr 2fr 1fr                } 
.c_oneSepratorOneSepratorTow      { display:grid;   grid-gap: var(--gap); grid-template-columns:    1fr 1px 1fr 1px 2fr                } 
.c_oneFourTow                     { display:grid;   grid-gap: var(--gap); grid-template-columns:    1fr 4fr 2fr                } 
  




table                             {  border-radius: var(--radius);  border-spacing: 0px;  }
thead                             {  border-radius: var(--radius); height:var(--elementHeight); }
thead td                          {  padding:var(--padding); font-size:15px; font-weight:400; border-bottom:1px solid #ddd; border-top:1px solid #ddd; height:36px; border-radius: 0px}
tbody tr td                       {  padding:var(--padding); border-bottom:1px dashed #f2f2f2; color:#666}
/* tr:nth-child(even)                { }
tr                                { } */
/* tr:hover                          { background: var(--gray10); cursor: pointer; }  */
tfoot  td                         { border-top:1px solid #f2f2f2}