/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  padding-top: 3rem;
  *padding-bottom: 3rem;
  color: #5a5a5a;
}

body, html {
  height: 100%;
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 4rem;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 32rem;
  background-color: #777;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 32rem;
}


/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-6 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2 {
  font-weight: 700;
}
.marketing .col-lg-6 p {
  margin-right: .75rem;
  margin-left: .75rem;
}


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.05rem;
}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 7rem;
  }
}

.navbar .nav-link {
  font-size: 20px;
  font-weight: 600;
}

#berita .card-title a {
  color: #535353;
  font-weight: 900;
}

.bgimg-1 {
  /*background-image: url('https://cdn.timesmedia.co.id/images/2021/04/13/microsite-timesindonesia-ramadhan-cover-2021.jpg');*/
  /*background-image: url('https://cdn-1.timesmedia.co.id/images/2022/04/02/microsite-timesindonesia-ramadhan-cover-2022.jpg');*/
  background-image: url('https://cdn-1.timesmedia.co.id/images/2022/11/16/ads-microsite-g20-indonesia-bali.jpg');
  *height: 100%;
  *height: 512px;
  height: 580px;
}

.bgimg-2 {
  background-image: url('https://pialadunia.timesindonesia.co.id/assets/images/background-pialadunia-2022.jpg');
  *height: 100%;
  *height: 512px;
  height: 580px;
}

.bgimg-1, .bgimg-2, .bgimg-3 {
  position: relative;
  *opacity: 0.65;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.bg-arema {
  background-color: #093782!important;
}

.bg-ti {
  background-color: #a50000!important;
}

.media h5 {
  font-size: 15px;
      color: #000;
}

.about p:first-child:first-letter {
  color: #903;
  float: left;
  font-family: Georgia;
  font-size: 75px;
  line-height: 60px;
  padding-top: 4px;
  padding-right: 8px;
  padding-left: 3px;
}

/* Content Placeholder */
.skeleton-wrapper {
  background: #fff;
  *border: 1px solid;
  *border-color: #e5e6e9 #dfe0e4 #d0d1d5;
  *border-radius: 4px;
  *-webkit-border-radius: 4px;
  *margin: 10px 15px;
}

.skeleton-wrapper-inner {
  height: 120px;
  padding: 15px;
  position: relative;
}

.skeleton-wrapper-body div {
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: placeholderSkeleton;
  -webkit-animation-timing-function: linear;
  background: #f6f7f8;
  background-image: -webkit-gradient(linear, left center, right center, from(#f6f7f8), color-stop(.2, #edeef1), color-stop(.4, #f6f7f8), to(#f6f7f8));
  background-image: -webkit-linear-gradient(left, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
  background-repeat: no-repeat;
  background-size: 800px 104px;
  height: 104px;
  position: relative;
}

.skeleton-wrapper-body {
  -webkit-animation-name: skeletonAnimate;
  background-image: -webkit-gradient(linear, center top, center bottom, from(deg), color-stop(0, red), color-stop(.15, orange), color-stop(.3, yellow), color-stop(.45, green), color-stop(.6, blue), color-stop(.75, indigo), color-stop(.8, violet), to(red));
  background-image: -webkit-linear-gradient(135deg, red 0%, orange 15%, yellow 30%, green 45%, blue 60%,indigo 75%, violet 80%, red 100%);
  background-repeat: repeat;
  background-size: 50% auto;
}

.skeleton-wrapper-body div {
  position: absolute;
  right: 15px;
  left: 15px;
  top: 15px;
}

div.skeleton-avatar {
  height: 90px;
  width: 90px;
  border-radius: 5px;
  right: auto;
}
div.skeleton-author {
  top: 20px;
  height: 20px;
  left: 115px;
  width: 195px;
}
div.skeleton-author-2 {
  top: 45px;
  height: 20px;
  left: 115px;
  width: 165px;
}

div.skeleton-label {
  left: 115px;
  top: 70px;
  height: 10px;
  width: 100px;
}
div.skeleton-content-1,
div.skeleton-content-2,
div.skeleton-content-3 {
  left: 15px;
  right: 15px;
  height: 10px;
}
div.skeleton-content-1 {
  top: 100px;
}
div.skeleton-content-2 {
  top: 120px;
}
div.skeleton-content-3 {
  top: 140px;
}

@-webkit-keyframes placeholderSkeleton {
  0% {
    background-position: -468px 0;
  }
  100% {
    background-position: 468px 0;
  }
}

@-webkit-keyframes skeletonAnimate {
  from {
    background-position: top left;
  }
  to {
    background-position: top right;
  }
}
.menu-bg {
  background-color: #1c1c5e;
}
.menu-bg-pildun {
  background-color: #54031c;
}