html {
  scroll-behavior: smooth;

}

body {
  font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  background: #ffffff;

}

a:hover {
  text-decoration: none;
  background-color: transparent;
}

/**NAVBAR**/

.navbar {
  padding: 15px;
  background-color: rgba(131, 125, 125, 0.4)
}

.navbar-dark .navbar-nav .nav-link {
  color: white;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
  margin-right: 25px;
}

.navbar-brand {
  color: white;
  font-weight: 700;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}


/* * effect for scroll nav * */
.scroll {
  background: linear-gradient(90deg, rgba(230, 242, 24, 0.7) 2%, rgba(119, 200, 8, 0.7) 23%, rgba(8, 200, 97, 0.7) 79%);
  transition: background 500ms;
}


/**HEADER**/

header.masthead {
  position: relative;
  text-align: center;
  height: 100vh;
  margin-top: -75px;
  display: grid;
  place-items: center;
  background: linear-gradient(90deg, rgba(230, 242, 24, 1) 2%, rgba(119, 200, 8, 0.9925012241224614) 23%, rgba(8, 200, 97, 0.9925012241224614) 79%);
}


/* * lapisan */
header.masthead::after {
  content: '';
  display: block;
  position: absolute;
  height: 100vh;
  width: 100%;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.22452731092436973) 0%, rgba(0, 0, 0, 0));
}

header.masthead h1 {
  text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3);

}

header.masthead h1 span {
  font-weight: 600;
}


.blockquote>p {
  text-shadow: 4px 4px 0px rgba(0, 0, 0, 0.2);
}




/**FEATURES**/

#info-panel {
  margin-top: -170px;
  margin-bottom: 70px;
}

.features {
  padding: 30px;
  background-color: white;
  border-radius: 12px;
  box-shadow: 0 3px 20px rgba(0, 0, 0, 0.6);
}

.features-item-icon {
  margin: 25px;
}

i {
  font-size: 4em;
}

.features .features-item:hover .features-item-icon i {
  font-size: 5rem;
}


/* * SHOW CASE */

.showcase-content {
  padding: 20px;
}

.showcase-title {
  margin: 0 10px;
  padding: 10px;

}

.showcase-text {
  padding: 25px;
}

.showcase-image {
  text-align: center;
}

.img-fluid {
  border-radius: 5px;
  min-height: 50vh;

}

/* * BAGAN* */



#bagan {
  margin: 3em auto;
}

.bagan-title {
  text-align: center;
  font-size: 3.5em;
  margin: 1em 0;
}

#orgchart {
  width: 100%;
  height: 100%;
  position: relative;
}

#orgchart>svg {
  background-color: whitesmoke;
}

rect {

  fill: #28a745 !important;

}

/* * PRODUCT CARD * */


#product {
  background: linear-gradient(90deg, rgba(230, 242, 24, 1) 2%, rgba(119, 200, 8, 0.9925012241224614) 23%, rgba(8, 200, 97, 0.9925012241224614) 79%);
}

.card-container {
  padding: 2em 1em;
  text-align: center;
}

.card {
  box-shadow: 0 5px 5px 0 #adb5bd;
  border-radius: 5px;
  min-height: 50vh;
}

.card-container:hover {
  min-width: 30em;
}


.card-title {
  font-size: 2em;
  min-height: 10vh;
  padding: 0;
  margin: 1.5em 0 1em;
}

.card-text {
  margin: 2em 0 1em;
  font-size: 1.2em;

}

.card-body {
  padding: 1em 1em;
}

.card-body>i {
  font-size: 5em;
}


/* * TESTIMONIAL ITEM * */


#testimonial {
  margin: 10px;
}

.carousel {
  background-color: whitesmoke;
  padding-bottom: 2em;
}

.carousel-item {
  height: 40vh;
}

.carousel-indicators li {
  border-radius: 50%;
  height: 15px;
  width: 15px;
  background-color: black;
}

.carousel-img {
  text-align: center;
  margin-top: 160px;
}

.carousel-img>img {
  max-height: 15vh;
}

.carousel-caption {
  color: black;
  top: 5%;
}

.carousel-caption>h5 {
  line-height: 1.4;
}

.carousel-caption>p {
  font-style: italic;
}


.carousel-control-next-icon:after {
  content: '>';
  font-size: 50px;
  color: black;
}

.carousel-control-prev-icon:after {
  content: '<';
  font-size: 50px;
  color: black;
}


/* * FORM CONTACT * */

#contact {
  padding-top: 5em;
  padding-bottom: 5em;
  background: linear-gradient(90deg, rgba(230, 242, 24, 1) 2%, rgba(119, 200, 8, 0.9925012241224614) 23%, rgba(8, 200, 97, 0.9925012241224614) 79%);
}

.contact-head {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
}

.input-contact {
  margin: 30px auto;
}



/* * footer * */

#footer {
  background-color: aliceblue;
  padding: 20px;
}

.icon {
  text-align: center;
}


.menu {
  text-align: center;
}

.icon>.list-inline-item>a>i {
  margin: 5px;
  font-size: 3em;
}

.icon>.list-inline-item>a>i:hover {
  font-size: 4em;
}

.footer-link {
  color: #28a745 !important;
}


/* * very Small devices (landscape phones, 400px ) */

@media (max-width: 400px) {


  .carousel-item {
    height: 45vh;
  }

  .carousel-img {
    margin-top: 220px !important;
  }

  .carousel-indicators li {
    display: none;
  }



}



/* *Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) {


  .showcase-text {
    padding: 20px;
  }

  .card-title {
    min-height: 1vh;
  }

  .card-body {
    margin: 10px;

  }

  .carousel-img {
    margin-top: 200px;
  }

  .alamat {
    text-align: center;
  }

  .carousel-indicators li {
    display: none;
  }

  .card-container:hover {
    min-width: inherit;
  }

}


/* *Medium devices (tablets, 768px and up) */
@media (min-width: 578px) and (max-width: 991.98px) {

  .alamat {
    text-align: center;
  }

  #info-panel {
    padding: 30px;
  }

  .card-title {
    font-size: 2.4em;
    min-height: 1vh;
    padding: 10px;
    margin-top: 5px;

  }

  .card-body>i {
    font-size: 6em;
  }

  .card-body {
    margin: 30px;

  }

}

/* * width desktop */

@media (min-width: 1600px) {

  .showcase-content {
    margin-top: 6em;
  }


}