/*Tampilan Mobile*/
@media (max-width: 375px) {

  /*sembunyikan dekstop dan tablet (hanya muncul di hp)*/
  .hidden {
    visibility: hidden;
    display: none;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 0px;
  }

  .logo {
    width: 200px;
  }
}

/*Tampilan Mobile*/
@media (max-width: 768px) {

  /*sembunyikan dekstop dan tablet (hanya muncul di hp)*/
  .hidden {
    visibility: hidden;
    display: none;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 0px;
  }
}

/*Tampilan Mobile*/
@media (max-width: 1000px) {

  /*sembunyikan dekstop dan tablet (hanya muncul di hp)*/
  .hidden {
    visibility: hidden;
    display: none;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 0px;
  }
}

/*Tampilan tablet vertikal*/
@media (min-width: 1001px) {
  .hidden-dekstop {
    visibility: hidden;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 0px;
    display: none;
  }
}

/*Tampilan tablet horizontal dan laptop kecil*/
@media (min-width: 1024px) {
  .hidden-dekstop {
    visibility: hidden;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 0px;
    display: none;
  }

  .t-700 {
    height: auto;
  }

  .t-gambar-home {
    height: 500px;
  }
}

/*tampilan laptop dan dekstop*/
@media (min-width: 1280px) {
  .hidden-dekstop {
    visibility: hidden;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 0px;
    display: none;
  }

  .t-700 {
    height: 700px;
  }

  .t-gambar-home {
    height: 600px;
  }
}

/*tampilan laptop dan dekstop*/
@media (min-width: 1440px) {
  .hidden-dekstop {
    visibility: hidden;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 0px;
    display: none;
  }

  .t-700 {
    height: 700px;
  }

  .t-gambar-home {
    height: 600px;
  }
}

@font-face {
  font-family: Acme;
  src: url(../font/Acme/Acme-Regular.ttf);
}

@font-face {
  font-family: Righteous;
  src: url(../font/Righteous/Righteous-Regular.ttf);
}

.bg-gradient {
  background: rgb(240, 248, 224);
  background: linear-gradient(0deg,
      rgba(240, 248, 224, 1) 0%,
      rgba(212, 233, 169, 1) 100%);
}

.bg-gradient2 {
  background: rgb(240, 248, 224);
  background: linear-gradient(0deg,
      rgba(212, 233, 169, 1) 0%,
      rgba(240, 248, 224, 1) 100%);
}

.bg-salmon {
  background-color: lightsalmon;
}

.bg-botol {
  background-image: url(../img/qum-botol.png) !important;
  background-size: cover;
}

.bg-botol2 {
  background-image: url(../img/qum-botol-tranparant.png) !important;
  background-size: cover;
}

.bg-botol3 {
  background-image: url(../img/qum-produk.png) !important;
  background-size: cover;
}

.bg-botol4 {
  background-image: url(../img/qum-aqua-botol-kecil.png) !important;
  background-size: 400px;
  background-repeat: no-repeat;
  background-position: center top 10px;
}

.bg-botol5 {
  background-image: url(../img/qum-air-mineral.png) !important;
  background-size: 500px;
  background-repeat: no-repeat;
  background-position: center top 140px;
  background-attachment: fixed;
}

.bg-botol6 {
  background-image: url(../img/background.png) !important;
  background-size: cover;
}

.bg-botol7 {
  background-image: url(../img/tentang-air-qum.png) !important;
  background-size: cover;
}

.bg-botol8 {
  background-image: url(../img/qum-beranda.png) !important;
  background-size: cover;
}

.p-salmon {
  color: #e57822;
  text-decoration-line: underline;
  text-decoration-style: solid;
}

.p-salmon2 {
  color: #e57822;
}

.alert-success .alert-link {
  color: #e57822 !important;
}

.body-qum {
  background-color: #f0f8e0;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link:hover {
  color: #ffffff !important;
  background-color: #343a40 !important;
}

.Acme {
  font-family: Acme !important;
}

.Righteous {
  font-family: Righteous !important;
}

.distributor {
  background-color: black !important;
  height: 100px !important;
}

.distributor2 {
  width: 1% !important;
}

.slider-next-prev {
  background-color: black !important;
}

.carousel-indicators li {
  background-color: black !important;
}

.carousel-indicators {
  bottom: -20px !important;
}

.btn-link {
  color: #e57822 !important;
}

.btn-link:hover {
  color: #28a745 !important;
}