*,
html {
    margin: 0;
    padding: 0;
}

.a-navbar {
    background-color:rgba(105, 228, 228, 0.877);
    width: 100%;
    height: 20vh;


}

.ul-navbar {
  display: flex;
  justify-content: center;
  height: 100px;
  align-items: center;

}

.li-navbar {
    list-style-type: none;
    padding: 20px;
    margin: 5px;
    color: white;
    font-size: 30px;
    
    
}

.li-navbar:hover {
    background-color:palevioletred;
    border-radius: 10px;

}

.b-navbar {
    background: color #f7f7f7;
    display: flex;
    align-items: center;
    justify-content: center;
    
}

.img-bar1 {
    width: 30%;
    height: 30%;
}

.img-bar2 {
    width: 90%;
    height: 90%;
}

.img-bar3 {
    width: 30%;
    height: 30%;
}

.img-bar4 {
    width: 90%;
    height: 90%;
}
.a-footer {
   background-color: rgb(147, 220, 238);
   display: flex;
   align-items: center;
   justify-content: center; 
   height: 30vh;
   
}

.h1-footer {
    font-size: 20px;
    

}

.a-gambar {
    justify-content: center;
    align-items: center;
    display: flex;
    background-color: white;
    border-radius: 60px;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);

}

.b-gambar {
    justify-content: center;
    align-items: center;
    display: flex;
    background-color: white;
    border-radius: 60px;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
   
}

.c-gambar {
    align-items: center;
    justify-content: center;
    display: flex;
    background-color: white;
    border-radius: 60px;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
   
}

.d-gambar {
    align-items: center;
    justify-content: center;
    display: flex;
    width: 20%;
    height: 20%; 
    background-color: white;
    border-radius: 60px;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);

}

.cb-bar1 {
    width: 70vh;
    height: 70vh;
    justify-content: center;
    align-items: center;
    display: flex;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}


.f-navbar {
    justify-content: center;
    align-items: center;
    display: flex;
}

.wa-bar1 {
    width: 30vh;
    height: 30vh;
    justify-content: center;
    align-items: center;
    display: flex;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    border-radius: 20%;
    
}

.h-navbar {
    justify-content: center;
    align-items: center;
    display: flex;
    background-color: rgba(253, 253, 253, 0.925);
}

.contact-footer {
    font-size: 20px;
}