@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300&display=swap');

body {
    background-color: #121212;
    color: #E2E2E2;
}
.resbutton {
    display: block;
    padding: 0.5em 1.2em;
    border: 0.1em solid #E2E2E2;
    margin: 0.4em auto;
    border-radius: 0.12em;
    box-sizing: border-box;
    cursor: pointer;
    font-family: 'Kanit', sans-serif;
    font-weight: bold;
    color: #E2E2E2;
    text-align: center;
    transition: all 0.2s;
}
.resbutton:active {
    color: #000000;
    background-color: #E2E2E2;
}
.highcharts-figure,
.highcharts-data-table table {
    min-width: 160px;
    max-width: 1200px;
    margin: 1em auto;
}
.highcharts-data-table table {
    font-family: 'Kanit', sans-serif;
    border-collapse: collapse;
    border: 1px solid #ebebeb;
    margin: 10px auto;
    text-align: center;
    width: 100%;
    max-width: 500px;
}
.highcharts-data-table caption {
    padding: 1em 0;
    font-size: 1.2em;
    color: #555;
}
.highcharts-data-table th {
    font-weight: 600;
    padding: 0.5em;
}
.highcharts-data-table td,
.highcharts-data-table th,
.highcharts-data-table caption {
    padding: 0.5em;
}
.highcharts-data-table thead tr,
.highcharts-data-table tr:nth-child(even) {
    background: #f8f8f8;
}
.highcharts-data-table tr:hover {
    background: #f1f7ff;
}