body{
    position: relative;
    width: 1500px;
    height: 2718px;

    background: #FFFFFF;
}

*{
    margin: 0;
    padding: 0;
}

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

*{
    margin: 0;
    padding: 0;
}

.logo-nav{
    position: absolute;
    left: 2.87%;
    right: 73.53%;
    top: -29.33%;
    bottom: -37.33%;
    max-width: 100%;
    height: auto;
    width: auto\9;
}

nav{
    position: relative;
    width: 1500px;
    height: 150px;
    background-color: #FFFFFF;

}

.nav-link{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 50px;
    gap: 120px;

    position: absolute;
    left: 29.47%;
    right: 3%;
    top: 30%;
    bottom: 30%;
}

li{
    width: 65px;
    height: 28px;

    font-family: 'Roboto';
    font-style: normal;
    font-weight: 450;
    font-size: 24px;
    line-height: 28px;

    color: #024391;


    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
    list-style-type:none;
}

a{
    text-decoration: none;
}

.judul{
    position: absolute;
    width: 624px;
    height: 134px;
    left: 174px;

    /* H1 */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-size: 56px;
    line-height: 120%;
    /* or 67px */
    color: #002B5F;
}

.ke1{
    top: 257px;
}

.ke2{
    top: 1427.13px;
}

.isi{
    position: absolute;
    width: 1176px;
    height: 135px;
    left: 174px;

    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 28px;
    line-height: 160%;
    /* or 45px */


    color: #002B5F;
    opacity: 0.7;
}

.satu{
    top: 441px;
}

.dua{
    top: 1544.13px;
}

.simpan{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px 0px 60px;
    gap: 200px;

    position: absolute;
    width: 478px;
    height: 474px;
    left: 174px;
    top: 750.64px;
}

.pinjam{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px 0px 60px;
    gap: 200px;

    position: absolute;
    width: 478px;
    height: 474px;
    right: 175px;
    top: 750.64px;

}

.konten2{
    position: absolute;
    width: 1500px;
    height: 954px;
    right: 0px;
    top: 1362px;

    background: rgba(2, 67, 145, 0.1);
}

.produk{
    position: absolute;
    width: 1155px;
    height: 363.6px;
    left: 174px;
    top: 1753.46px;
}

.tombol1{
    position: absolute;
    width: 352px;
    height: 61px;
    left: 574px;
    top: 2165px;

    background: #024391;
    backdrop-filter: blur(40px);
    /* Note: backdrop-filter has minimal browser support */

    border-radius: 4px;
}

.foot{
    position: absolute;
    left: 0%;
    right: 0%;
    bottom: 0%;
    height: 402px;
    width: 1500px;
    left: 0px;
    top: 2165px;

    background: #FFB000;
}

.logo-foot{
    position: absolute;
    left: 1.8%;
    right: 68.93%;
    top: 11.44%;
    bottom: 11.19%;
}

.catatankaki{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 10px;

    position: absolute;
    width: 196px;
    height: 251px;
    left: calc(50% - 196px/2 - 75px);
    top: calc(50% - 251px/2 + 0.5px);
}

.footer{
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 160%;
    /* or 32px */

    color: #024391;

    /* Inside auto layout */

    flex: none;
    order: 0;
    flex-grow: 0;
    font-weight: bold;
}

.oke1{
    width: 145px;
    height: 43px;
}

.oke2{
    width: 166px;
    height: 37px;
}

.oke3{
    width: 196px;
    height: 36px;
}

.oke4{
    width: 99px;
    height: 37px;
}

.teks-form{
    position: absolute;
    left: 58.93%;
    right: 2.53%;
    top: 24.13%;
    bottom: 24.13%;
}

.teks-form1{
    top: 24.13%;
    bottom: 48.01%;

    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 140%;
    /* or 56px */


    color: #024391;
}

.form1{
    box-sizing: border-box;

    position: absolute;
    left: 0%;
    right: 10.67%;
    top: 59.95%;
    bottom: 24.13%;

    border: 1px solid #024391;
    border-radius: 4px;
    background-color: #FFB000;
}

.tombolsub{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 32px;
    gap: 10px;

    position: absolute;
    left: 70%;
    right: 4.8%;
    top: 59.95%;
    bottom: 24.13%;

    background: #024391;
    backdrop-filter: blur(40px);
    /* Note: backdrop-filter has minimal browser support */

    border-radius: 4px;
}

.hak{
    position: absolute;
    width: 248px;
    height: 24px;
    left: 48px;
    top: 357px;

    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-size: 15px;
    line-height: 160%;
    /* identical to box height, or 24px */


    color: #024391;
}