/* css nav atas */
.nav_atas .nav-link {
  color: black;
  font-weight: bold;
}

.nav_atas .container_brand {
    display: flex;
    max-width: 50%;
    text-align: center;
    margin: auto;
    line-height: 1;
    width: max-content;
    text-wrap: wrap;
}
/* .nav_atas .teks {

} */

.nav_atas .h-navbar:hover {
  border-bottom: lightcoral 3px solid;
}

.nav_atas .nav-link .h-navbar.active {
  border-bottom: brown 3px solid;
}

.nav_atas .h-navbar.active:hover {
  border-bottom: white 3px solid;
  color: red;
}
.navbar-toggler {
  font-weight: normal;
}

/* waktu dan tgl */
.container_tampilan_waktu {
  /* margin-top: 1cm; */
  position: absolute;
  top: -2px;
  right: 5%;
  color: black;
  z-index: 2;
  font-weight: bold;
  font-size: x-small;
  /* background-color: antiquewhite; */
}

/* css tombol kembali */
#container_nav_mode_pc #btnKembali {
  position: fixed;
  margin: 5px;
  transform: translate(-50%, -50%);
  font-weight: bold;
  background: transparent;
  color: mediumseagreen;
  font-size: x-large;
  z-index: 3;
}

/* btn reload */
#container_nav_mode_pc #btnReload {
  position: fixed;
  margin-top: 5px;
  margin-left: 50px;
  transform: translate(-50%, -50%);
  font-weight: bold;
  background: transparent;
  color: mediumseagreen;
  font-size: large;
  z-index: 3;
}

/* nav bawah & ikon bawah */
#nav_bawah {
  height: 60px;
  color: darkgreen;
  z-index: 1;
}

#nav_bawah a {
  color: darkgreen;
  font-size: small;
  font-weight: bold;
}

#ikon_nav_bawah {
  font-size: small;
  width: auto;
}

@media screen and (max-width: 355px) and (min-width: 280px) {
  /* nav atas */
  #container_pencarian {
    display: none;
  }

  .navbar img {
    width: auto;
    height: 40px;
  }

  .navbar .teks {
    font-size: 12px;
  }

  .navbar-nav .nav-link {
    font-size: 12px;
  }

  #container_nav_mode_pc {
    display: none;
  }

  #nav_bawah {
    height: 50px;
    font-size: smaller;
  }

  #nav_bawah a {
    font-size: x-small;
  }
  .container_tampilan_waktu {
    margin-top: 1%;
    font-size: 9px;
  }
}

@media screen and (max-width: 800px) and (min-width: 356px) {
  /* nav atas */
  #container_pencarian {
    display: none;
  }

  .navbar img {
    width: auto;
    height: 40px;
  }

  .nav_atas .teks {
    font-size: 13px;
  }

  .navbar-nav li {
    font-size: 13px;
    margin-top: -1px;
    margin-bottom: -1px;
  }


  #container_nav_mode_pc {
    display: none;
  }

  .container_tampilan_waktu {
    margin-top: 5px;
  }
}