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

    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;
}


.konten1{
    position: absolute;
    width: 1500px;
    height: 768px;
    left: 0px;
    top: 171px;

    background: rgba(0, 43, 95, 0.1);
    border-radius: 0px;
}

.garis{
    position: absolute;
    width: 72px;
    height: 0px;
    left: 110px;
    top: 276.5px;

    border: 2px solid #002B5F;
}

.judul{
    position: absolute;
width: 544px;
height: 201px;
right: 750px;
top: 318px;

/* H1 */

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


color: #002B5F;
}

.sub{
    position: absolute;
width: 145px;
height: 23px;
left: 206px;
top: 267px;

font-family: 'Roboto';
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 23px;
letter-spacing: 2px;
text-transform: uppercase;

color: #002B5F;
}

.submenu{
    position: absolute;
    width: 496px;
    height: 96px;
    right: 798px;
    top: 535px;

    /* Paragraph */

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


    color: #002B5F;
}

.side{
    position: absolute;
width: 592px;
height: 576px;
left: 798px;
top: 267px;

}

.judul-home6{
    position: absolute;
    width: 106px;
    height: 56px;
    left: 104px;
    top: 1025px;

    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 40px;
    line-height: 140%;
    /* identical to box height, or 56px */
    color: #002B5F;
}

.thum{
    position: absolute;
    width: 302px;
    height: 221px;
    top: 1131px;
}

.nail1{
    left: 104px;
}

.nail2{
    left: 431px;
}

.nail3{
    left: 758px;
}

.nail4{
    left: 1085px;
}

.teks{
    position: absolute;
    width: 290px;
    height: 69.33px;
    top: 1368.85px;

    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 150%;
    /* or 30px */
    color: #002B5F;
}

.desk{
    position: absolute;
    width: 290px;
    height: 60.09px;
    top: 1454.18px;

    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 160%;
    color: #525560;
}

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

    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;
}