table{width:100%;border-collapse:collapse;overflow-x:auto;display:block}table,th,td{border:1px solid black}th,td{padding:8px;text-align:left}th{background-color:#f2f2f2}tr:hover{background-color:#ddd}@media screen and (max-width:600px){table,thead,tbody,th,td,tr{display:block}th{display:none}tr{margin-bottom:10px}td{border:none;position:relative;padding-left:50%;text-align:right}td::before{content:attr(data-label);position:absolute;left:0;width:50%;padding-left:10px;text-align:left;font-weight:700;background-color:#f2f2f2;border-right:1px solid black;box-sizing:border-box}}