body{

    box-sizing: border-box;
    margin: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    height: 100%;
    font-family: sans-serif;

}

.agung1-conten{

    box-sizing: border-box;
    width: 100%;
    min-height: 100vh;
    background: linear-gradient(45deg,#d04141,#c8509c);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 33px 30px;

}

.agung-wrap{

    background-color: white;
    max-width: 51rem;
    margin: 0 auto;

}

.agung2-h1{

    text-align: center; 
    font-size: 25px; 
    padding-bottom: 25px;

}
.agung-form {

    padding: 1rem;
    display: grid;
    grid-auto-rows: 2rem;
    grid-row-gap: 0.5rem;

}

.agung-form label{

    font-weight: bold;
    display: block;
    width: 100%;
    
}

.agung-form  input{

    display: block;
    width: 100%;
    
}

.agung-form input:focus{

    outline: none;
    background: #ffffff;
    border-color: #000000;

}

.agung-form input:hover{

    background: #d5d5d55c;

}

.agung-form button[type="submit"]{

    display: block;
    background-color: #cbcbcb;
    color: rgb(0, 0, 0);
    
}

label[for="nama"]{

    grid-row: 3 / 4;

}

#nama
{
    grid-row: 4 / 5;

}

label[for="nim"]{

    grid-row: 5 / 6;

}

#nim{

    grid-row: 6 / 7;

}

label[for="alamat"]{

    grid-row: 9 / 10;

}

#alamat{

    grid-row: 10/ 15;

}

form button[type="submit"]{

    grid-row: 15 / 16;

}

@media (min-width: 40rem){

.agung-form{
    margin: auto;
    width: 50rem;
    grid-template-columns: 22rem 22rem;
    grid-column-gap: 1rem;
}

label[for="nama"]{

    grid-row: 3 / 4;
    grid-column: 1 / 2

}

#nama{

    grid-row: 4 / 5;
    grid-column: 1 / 2;

}

label[for="nim"]{

    grid-row: 3 / 4;
    grid-column: 2 / 3;

}

#nim{

    grid-row: 4 / 5;
    grid-column: 2 / 3;

}

label[for="alamat"]{

    grid-row: 7 / 8;

}

#alamat{

    grid-row: 8 / 13;
    grid-column: 1 / 3;

}

form button[type="submit"]{

    grid-row: 14 / 15;

}

}


