:root {
 --c-tbl-header: #ddd;
 --c-tbl-text:   #777;
 --c-tbl-border: #ddd;
 --c-tbl-border-dark: #aaa;
 --c-td-label:   #000;
}


.rc_table table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
}

.rc_table table thead th {
  font-size: calc( var(--fs) * 0.95 );
}

.rc_table table td, .rc_table table th, .rc_table table a {
  font-family: var(--ff);
/*  font-size: var(--fs); */
  font-size: calc( var(--fs) * 0.9 ); /* AKS 2.3rem; */
}

.rc_table table thead a {
  color: #000;
  text-decoration: underline;
}

/*
.rc_table table tbody a {
/ *  color: var(--c-tbl-text); * /
  text-decoration: underline;
}
*/

.rc_table table thead tr {
  background-color: var(--c-tbl-header);
}

.rc_table table thead th {
  border-bottom: 1px solid #000;
  border-right: 1px solid var(--c-tbl-border-dark);
}
.rc_table table thead th:last-child {
  border-right: none; /* Remove border from the last td in each row */
}

/* permusham visu auksciau esancius background nustatymus */
.rc_table table tbody tr, .rc_table table tbody tr:nth-child(odd), .rc_table table tbody tr:nth-child(even) {
  background-color: #ffffff;
  border-left: 1px solid #fff;
  border-right: 1px solid #fff;
}
.rc_table table tbody tr:hover {
  background-color: #eeeeee;
}


.rc_table table th, .rc_table table td {
  border-bottom: 1px solid var(--c-tbl-border); /* #ddd; */
  padding: 8px;
  text-align: left;
}

.rc_table table td.right,  .rc_table table th.right  { text-align: right; }
.rc_table table td.center, .rc_table table th.center { text-align: center; }

/*
.rc_table tr.blank_row {
display: none;
}
*/


@media (max-width: 600px) {

.rc_table table, .rc_table thead, .rc_table tbody, .rc_table th, .rc_table td, .rc_table tr {
  display: block;
}

.rc_table thead tr {
  display: none;
}

.rc_table table th, .rc_table table td {
  border-bottom: 1px solid #ffffff; /* isjungiam linija po td */
}

.rc_table table tr {
  border-bottom: 1px solid var(--c-tbl-border); /* ijungiam bendra linija po tr */
  padding-bottom: 20px;
}

.rc_table td {
  text-align: left;
  position: relative;
}

.rc_table td::before {
  content: attr(data-label); /* ": "; */
  left: 10px;
  padding-right: 20px;
  text-align: left;
  font-weight: bold;
  display: block; /* Ensure it takes a full line */
/*    color: var(--c-td-label); */ /* Optional: Change color to make it less prominent */
  color: black; /*var(--c_jar_dark);*/ /* #88DAF7; */
  margin-bottom: 5px; /* Space between the before content and the cell content */
}


} /* /media 600px */


















.tbl321 {
  display: flex;
  flex-wrap: wrap;
  margin: -10px;
}

.tbl321 .row {
    display: flex; 
    flex-direction: row;
    width: 32%; /* Four items per row on desktop */
    padding: 5px;
    box-sizing: border-box;
    background: white;
 border-bottom: 1px solid #000000;
/*    border: 1px solid #ccc; */
/*    margin: 1px; */
/*    border-radius: 5px; */
}

.tbl321 .key {
    font-weight: bold;
    color: #333;
}

.tbl321 .val {
 margin-left: 10px;
    color: #666;
}


/* ############## */
@media (max-width: 900px) {

.tbl321 .row {
  width: 49%; /* Four items per row on desktop */
}

} /* 800px */



/* ############## */
@media (max-width: 600px) {

.tbl321 .row {
  width: 100%; /* One item per row on mobile */
}

} /* 400 px */