<link href="https://fonts.googleapis.com/css?family=Bree+Serif&display=swap" rel="stylesheet">
<style type="text/css">
    table{
        border: 5px outset blue;
        background: linear-gradient(to bottom, #33ccff 0%, #ff3399 100%);
    }
    th{
        font-family: 'Bree Serif', serif;
        font-size: 30px;
    }
    td{
        font-family: 'Bree Serif', serif;
        font-size: 20px;
    }
    input{
        border: 2px inset black;
        background-color: silver;
        font-family: 'Bree Serif', serif;
        font-size: 15px;
        border-radius: 50px;
        text-align: center;
    }
    input#button{
        border: 3px outset blue;
        background-color: silver;
        font-family: 'Bree Serif', serif;
        transition-duration: 0.5s;
        font-size: 15px;
    }
    input#button:hover{
        border: 3px outset blue;
        background: linear-gradient(to bottom, #33ccff 0%, #ff3399 100%);
        font-family: 'Bree Serif', serif;
        font-size: 17px;
    }
    td.batas{
        height: 5px;
        border-radius: 50px;
        background-color: blue;
    }
</style>

<form id="studi5" name="studi5" method="post" action="hasil5.php">
    <table border="1">
        <tr>
            <td width="150px">NIM</td>
            <td>
                <input type="text" name="nim" id="nim" size="20" autocomplete="off" required="">
            </td>
        </tr>
        <tr>
            <td>Nama Siswa</td>
            <td>
                <input type="text" name="nama" id="nama" size="20" autocomplete="off" required="">
            </td>
        </tr>
        <tr>
            <td>Jurusan</td>
            <td>
                <input type="text" name="jurusan" id="jurusan" size="20" autocomplete="off" required="">
            </td>
        </tr>
        <tr>
            <td>Nilai Harian</td>
            <td>
                <input type="number" name="nilaiHarian" id="nilaiHarian" size="20" autocomplete="off" required="" max="100">
            </td>
        </tr>
        <tr>
            <td>Nilai Tugas</td>
            <td>
                <input type="number" name="nilaiTugas" id="nilaiTugas" size="20" autocomplete="off" required="" max="100">
            </td>
        </tr>
        <tr>
            <td>Nilai UTS</td>
            <td>
                <input type="number" name="nilaiUts" id="nilaiUts" size="20" autocomplete="off" required="" max="100">
            </td>
        </tr>
        <tr>
            <td>Nilai UAS</td>
            <td>
                <input type="number" name="nilaiUAS" id="nilaiUAS" size="20" autocomplete="off" required="" max="100">
            </td>
        </tr>
        <tr>
            <td class="batas" colspan="2"></td>
        </tr>
        <tr>
            <th colspan="2">
                <input type="submit" name="button" id="button" value="Hitung">
            </th>
        </tr>
    </table>
</form>