header {
  /* margin-top: 3vh; */
  position: relative;
  /* padding: 15vh; */
  text-align: center;
  /* background: linear-gradient(to right, #00234763, #00009e63); */
  background: linear-gradient(to right, #00000063, #00000063);
  overflow: hidden;
}
header svg {
  position: absolute;
  left: 0;
}
header svg#blob1 {
  position: absolute;
  left: -10vh;
  width: 20%;
}
header svg#blob2 {
  position: absolute;
  left: 30vh;
  top: -10vh;
  width: 15%;
}
header svg#blob3 {
  position: absolute;
  left: 40vh;
  width: 30%;
}
header svg#blob4 {
  position: absolute;
  left: 100vh;
  width: 20%;
}
header svg#blob5 {
  position: absolute;
  left: 160vh;
  top: -20vh;
  width: 60%;
}
header .bingkai {
  /* border: 2px solid rgb(255, 0, 0) 47, 255) 47, 255); */
  color: white;
  padding: 10vh;
  position: absolute;
  text-align: center;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  top: 25%;
  right: 15%;
  left: 15%;
  width: 70%;
}
header .carousel {
  z-index: -100;
  /* position: absolute; */
  /* max-height: 80vh; */
  margin-top: -8vh;
}
header .carousel img {
  max-height: 120vh !important;
}
@media (max-width: 991.98px) {
  header #blob1,
  header #blob2,
  header #blob3,
  header #blob4,
  header #blob5 {
    display: none;
  }
  header .bingkai {
    color: white;
    padding: 0;
  }
  header .carousel {
    z-index: -100;
    /* position: absolute; */
    max-height: 80vh;
  }
  header .carousel img {
    max-height: 100vh !important;
  }
}

#sambutan .container {
  display: flex;
  margin-top: 10vh;
}
#sambutan img {
  width: 50vh;
}
#sambutan span {
  margin: 3vh;
}
@media (max-width: 991.98px) {
  #sambutan .container {
    display: block;
  }
  #sambutan img {
    width: 70%;
    margin-left: 6.5vh;
    margin-right: 6.5vh;
    margin-bottom: 3vh;
  }
}

#identitas {
  /* display: flex; */
  margin-top: 10vh;
  background-image: url("../img/4.jpg");
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
#identitas #black {
  padding: 20vh;
  background: linear-gradient(to right, #00000063, #00000063);
  /* background: linear-gradient(to right, #00234763, #00009e63); */
  color: white;
}
/* #identitas span {
  background-color: rgba(0, 0, 0, 0.452);
  color: white;
} */
#identitas img {
  width: 20%;
}
@media (max-width: 991.98px) {
  #identitas #black {
    padding: 5vh;
  }
}

#sarana {
  margin-top: 10vh;
  text-align: center;
}
#sarana .card {
  overflow: hidden;
}
#sarana img {
  margin-top: 5px;
  width: 100%;
  border-radius: 0 0 5px 5px;
}
#sarana img:hover {
  transform: scale(1.1);
}

#prestasi .container {
  color: white;
  text-align: center;
}
#prestasi .dark-blue {
  padding: 10px;
}
@media (max-width: 991.98px) {
  #prestasi .card {
    margin-left: auto;
    margin-right: auto;
    /* width: 35rem; */
  }
}
@media (min-width: 767.98px) {
  #prestasi .card {
    margin-left: auto;
    margin-right: auto;
  }
}

#berita {
  text-align: center;
  position: relative;
}
#berita img.img-vector {
  /* width: 1500rem; */
  position: absolute;
  right: 0;
  /* bottom: 10px; */
}
#berita .col-lg {
  flex: 0 0 auto;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 75%;
}
#berita img {
  max-width: 30%;
}
#berita small {
  color: rgb(172, 172, 172);
}
@media (max-width: 991.98px) {
  #berita .col-lg {
    flex: 1 0 0%;
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: 0%;
  }
  #berita img.img-vector {
    display: none;
  }
  #berita img {
    max-width: 100%;
  }
}

footer {
  margin-top: 10vh;
  padding: 10vh;
  /* position: absolute; */
  bottom: 0;
  background-color: #002347;
  text-align: left;
  color: white;
}
