@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@500;600;700&display=swap');

body{
  background: white;
  font-family: 'Quicksand', sans-serif;
}
p{
  font-size: 18px;
  letter-spacing: 0px;
  line-height: 150%;
  font-weight: 300;
}
h1{
  font-size: 50px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 100%;
}
h2{  
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 100%;
}
a{
  text-decoration: none;
  color: #3DA0D9;
}
p{
  font-size: 16px;
}



/** CAROUSEL **/
.carousel{
}
.carousel-item{
  margin-top: 90px;
  width: 100%;
  height: 700px;
}
.carousel-item > a >img{
  position: absolute;
  background-size: cover;
  background-position: center top;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}

.carousel-control-prev-icon {
 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}
.carousel-control-prev-icon {
    position: absolute;  
    left: 20px;
}
.carousel-control-next-icon {
    position: absolute;    
    right: 20px;
}



/** MAIN STYLE **/
.main-logo{
  width: 200px;
  height: auto;
}
.bg-light{
  background: white !important;
}
.btn-primary{
  background: #3DA0D9;
}
.btn{
  outline: none !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
.nav-link{
  color: black !important;
  font-weight: 600 !important;
  margin: 0 5px;
}
.pc-1{
  padding: 5em 0 3em 0;
}
.pc-2{
  padding: 0em 1em;
}
.pc-3{
  padding: 9em 0em 4em 0em;
}
.pc-4{
  padding: 5em 7em;
}
.kerjasama-1{
  background-image: url(../img/kerjasama01.png);
  background-repeat: no-repeat;
  padding: 4em 5em;
  background-size: 125%;
}
.kerjasama-2{
  background-image: url(../img/kerjasama02.png);
  background-repeat: no-repeat;
  padding: 4em 5em;
  background-size: 125%;
}
.card{
  border: none !important;
}
.card:hover{
  border: none !important;
  background: #186794;
  color: white;
}
.text-primary{
  color: #3DA0D9 !important;
}
.wilayah{
  background-image: url(../img/wilayah.jpg);
  width: 100%;
  height: 600px;
  padding-top: 6em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
}
.img100{
  display:block;
  width: 100%;
  height: auto;
}

.info{
  padding: 0.5em 1em;
  border: 1px solid #ebebeb !important;
  background: none;
}
.info a{
  color: black;
}
.info:hover{
  background: #f6f6f6 !important;
  border: 1px solid #ebebeb !important; 
  color: black;
  text-decoration: underline;
}
.info-2{
  padding: 0.5em 1em;
  border: 0px solid #ebebeb !important;
  background: none;
}
.info-2 a{
  color: none;
}
.info-2:hover{
  background: none !important;
  border: 0px solid #ebebeb !important; 
  color: black;
}
.container, .container-fluid{
  scroll-margin-top: 5em;
}
.sub-banner{
  width: 100%;
  height: auto;
  margin: 0 auto ;
  display: block;
  margin-top: 3em;
  padding: 0 !important;
}
.detail-others{
  padding: 1em;
  border: 1px solid #ebebeb;
  background: white;
  margin-bottom: 1em;
  margin-top: 1em;
}
.detail-others a{
  text-decoration: none;
  font-weight: 700;
  font-size: 20px;
  color: #888;
  margin-top: 1em;
}
.detail-others a:hover{
  text-decoration: underline;
  font-weight: 700;
  font-size: 20px;
  color: black;
  margin-top: 1em;
}
/** ANIMATE **/
.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}
.reveal.active{
  transform: translateY(0);
  opacity: 1;
}



/** >>>>>> MOBILE <<<<< **/
@media screen and (max-width: 768px){
  .carousel-item{
  margin-top: 90px;
  width: 100%;
  height: 200px;
  }
  .carousel-control-prev-icon {
    position: absolute;  
    left: 20px;
    top: 170px;
}
.carousel-control-next-icon {
    position: absolute;    
    right: 20px;
    top: 170px;
}
.wilayah{
  background-image: url(../img/wilayah.jpg);
  width: 100%;
  height: 400px;
  padding-top: 2em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 120%;
}
.kerjasama-1{
  background-image: url(../img/kerjasama01.png);
  background-repeat: no-repeat;
  padding: 4em 1em;
  background-size: 175%;
}
.kerjasama-2{
  background-image: url(../img/kerjasama02.png);
  background-repeat: no-repeat;
  padding: 4em 1em;
  background-size: 175%;
}
.pm-1{
  padding: 2em;
}
.pc-1{
  padding: 2em 0 1em 0;
}
.pc-3{
  padding: 9em 2em 4em 1em;
}
.sub-banner{
  width: 100%;
  height: auto;
  margin: 0 auto ;
  display: block;
  margin-top: 5em;
  padding: 0 !important;
}
}