/* utility */

body {
  min-height: 900px;
}
.tombol {
  text-transform: uppercase;

  border-radius: 40px;
}

.tulisanJalan {
  margin-top: 20px;
  padding-top: 10px;
  margin-bottom: 10px;
}

.slider {
  margin-top: -50px;
  padding-top:5px;
  margin-bottom: 40px;
}

.youtube {
  margin-top: 25px;

  margin-bottom: 90px;

  padding-top: 20px;
}

.youtube img {
  margin-top: 30px;

  border-color: #ffffff;

  border-width: 3px;
}

.youtube img:hover {
  background: #778899;
}

.sejarah {
  background-image: url("../img/batik.jpg");
  margin-top: 50px;
  padding-top: 20px;
  padding-bottom: 10px;
}

#sejarah {
  padding-top: 20px;
}

.visiMisi {
  background-image: url("../img/doodles.png");
  padding-top: 130px;
  padding-bottom: 20px;
  margin-bottom: -30px;
}

#visiMisi {
  padding-top: 50px;
  margin-bottom: 150px;
}

#visi {
  padding-top: 90px;
}

.fasilitas {
  margin-top: 100px;
}

.tatib {
  margin-top: 100px;
}

.elib {
  margin-top: 100px;
}
.lulusan2 {
  margin-top: 100px;
}

.tenagaPendidik {
  padding-top: 20px;
}

.wakasek {
  padding-top: 20px;
}

.gurumapel {
  padding-top: 20px;
  padding-bottom: 20px;
}

#personil {
  background-image: url(../img/full-bloom.png);
  padding-top: 100px;
  padding-bottom: 250px;
  margin-bottom: -15px;
}

.lulusan {
  padding-top: 80px;
}

.elib {
  margin-top: 100px;
  padding-bottom: 60px;
}

#lulusan2 {
  padding-top: 30px;
}

.personil,
h3 {
  padding-top: 50px;
  padding-bottom: 50px;
  text-align: center;
}

#guru {
  padding-top: 30px;
}

.tu {
  background-image: url("/img/doodles.png");

  padding-top: 20px;

  padding-bottom: 50px;
}

.tu p {
  font-family: Arial, Helvetica, sans-serif;

  font-style: normal;

  text-align: center;
}

/* Back to Top */

html {
  scroll-behavior: smooth;
}

.backToTop {
  width: 50px;

  height: 50px;

  position: fixed;

  bottom: 50px;

  right: 50px;

  z-index: 99;

  cursor: pointer;

  border-radius: 100px;

  transition: all 0.5s;

  background: #008c5f url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center center;
}

.backToTop:hover {
  background: #1d2129 url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center center;
}

/* versi desktop */

@media (min-width: 1320px) {
  .nav-link {
    text-transform: uppercase;
  }

  .nav-link:hover::after {
    content: "";

    display: block;

    border-bottom: 3px solid #6495ed;

    width: 50%;

    margin: auto;

    padding-bottom: 3px;

    margin-bottom: -6px;
  }
}