@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap);
@media (max-width:767px) {

  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  nav,
  section,
  summary {
    display: block
  }

  audio,
  canvas,
  video {
    display: inline-block
  }

  audio:not([controls]) {
    display: none;
    height: 0
  }

  [hidden],
  template {
    display: none
  }

  html {
    background: #fff;
    color: #000;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
  }

  html,
  button,
  input,
  select,
  textarea {
    font-family: Arial
  }

  body {
    margin: 0
  }

  a {
    background: transparent
  }

  a:focus {
    outline: thin dotted
  }

  a:hover,
  a:active {
    outline: 0
  }

  abbr[title] {
    border-bottom: 1px dotted
  }

  b,
  strong {
    font-weight: bold
  }

  dfn {
    font-style: italic
  }

  mark {
    background: #ff0;
    color: #000
  }

  code,
  kbd,
  pre,
  samp {
    font-family: monospace, serif;
    font-size: 1em
  }

  pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word
  }

  q {
    quotes: "\201C" "\201D" "\2018" "\2019"
  }

  q:before,
  q:after {
    content: '';
    content: none
  }

  small {
    font-size: 80%
  }

  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
  }

  sup {
    top: -0.5em
  }

  sub {
    bottom: -0.25em
  }

  img {
    border: 0
  }

  svg:not(:root) {
    overflow: hidden
  }

  figure {
    margin: 0
  }

  fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em
  }

  legend {
    border: 0;
    padding: 0;
    white-space: normal
  }

  button,
  input,
  select,
  textarea {
    font-family: inherit;
    font-size: 100%;
    margin: 0;
    vertical-align: baseline
  }

  button,
  input {
    line-height: normal
  }

  @media (max-width:767px) {
    .desktop {
      display: none !important;
    }
  }

  @media (min-width:768px) {
    .mobile {
      display: none !important;
    }
  }

  button,
  select {
    text-transform: none
  }

  button,
  html input[type="button"],
  input[type="reset"],
  input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer
  }

  button[disabled],
  input[disabled] {
    cursor: default
  }

  button::-moz-focus-inner,
  input::-moz-focus-inner {
    border: 0;
    padding: 0
  }

  textarea {
    overflow: auto;
    vertical-align: top
  }

  table {
    border-collapse: collapse;
    border-spacing: 0
  }

  input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
  }

  input[type="search"]::-webkit-search-cancel-button,
  input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
  }

  input[type="checkbox"],
  input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
    line-height: normal
  }

  :root {
    --kuler-1: #21409A;
    --kuler-2: #007cbd;
    --kuler-3: #ef672f
  }

  body {
    margin: 0;
    line-height: 1.4;
    font-size: 16px;
    font-family: Helvetica-FF, Arial, Tahoma, sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeSpeed
  }

  * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
  }

  *:before,
  *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
  }

  .clearfix:before,
  .clearfix:after {
    content: " ";
    display: table
  }

  .clearfix:after {
    clear: both
  }

  a {
    text-decoration: none;
    color: #000;
    -webkit-transition: color 0.3s ease-in-out 0s, background 0.3s ease-in-out 0s, opacity 0.3s ease-in-out 0s;
    -moz-transition: color 0.3s ease-in-out 0s, background 0.3s ease-in-out 0s, opacity 0.3s ease-in-out 0s;
    -ms-transition: color 0.3s ease-in-out 0s, background 0.3s ease-in-out 0s, opacity 0.3s ease-in-out 0s;
    -o-transition: color 0.3s ease-in-out 0s, background 0.3s ease-in-out 0s, opacity 0.3s ease-in-out 0s;
    transition: color 0.3s ease-in-out 0s, background 0.3s ease-in-out 0s, opacity 0.3s ease-in-out 0s
  }

  a:hover {
    color: var(--kuler-1)
  }

  a:focus {
    outline: none
  }

  hr {
    border-style: solid none none;
    border-color: #e6e6e6;
    margin: 16px 0
  }

  p {
    margin-top: 0;
    margin-bottom: 16px
  }

  ins {
    text-decoration: none;
    display: contents
  }

  ol,
  ul {
    padding: 0 0 0 24px;
    margin-top: 12px;
    margin-bottom: 12px
  }

  ol ol,
  ol ul,
  ul ol,
  ul ul {
    margin-top: calc(12px / 2);
    margin-bottom: 0
  }

  /* ol li,
ul li {
  padding: 8px 0
} */

  img {
    vertical-align: middle;
    border-style: none
  }

  header,
  footer {
    display: table;
    width: 100%
  }

  @media (min-width:1024px) {

    header,
    footer {
      display: block
    }
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 8px
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .font-heading,
  .font-heading-light,
  .font-heading-semibold,
  .font-heading-bold {
    line-height: 1.3
  }

  h1 {
    font-size: 40px
  }

  h2 {
    font-size: 32px
  }

  h3 {
    font-size: 28px
  }

  h4 {
    font-size: 24px
  }

  h5 {
    font-size: 20px
  }

  h6 {
    font-size: 16px
  }

  .head-1 {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    height: 0.0625rem !important;
    margin: -0.0625rem !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 0.0625rem !important
  }

  .font-hero {
    font-size: 32px !important
  }

  .font-xxl {
    font-size: 26px !important
  }

  .font-xl {
    font-size: 23px !important
  }

  .font-lg {
    font-size: 20px !important
  }

  .font-md {
    font-size: 18px !important
  }

  .font-sm {
    font-size: 16px !important
  }

  .font-xs {
    font-size: 14px !important
  }

  .font-xxs {
    font-size: 12px !important
  }

  @font-face {
    font-family: "Helvetica-FF";
    font-weight: 400;
    font-style: normal;
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Helvetica-Regular.eot");
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Helvetica-Regular.woff2") format("woff2"), url("Helvetica-Regular.woff") format("woff"), url("Helvetica-Regular.ttf") format("truetype"), url("Helvetica-Regular.eot?#iefix") format("embedded-opentype");
    font-display: swap;
    size-adjust: 99.25%
  }

  @font-face {
    font-family: "Helvetica-FF";
    font-weight: 700;
    font-style: normal;
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Helvetica-Bold.eot");
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Helvetica-Bold.woff2") format("woff2"), url("Helvetica-Bold.woff") format("woff"), url("Helvetica-Bold.ttf") format("truetype"), url("Helvetica-Bold.eot?#iefix") format("embedded-opentype");
    font-display: swap;
    size-adjust: 99.25%
  }

  @font-face {
    font-family: "Montserrat-FF";
    font-weight: 400;
    font-style: normal;
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Montserrat-Regular.eot");
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Montserrat-Regular.woff2") format("woff2"), url("Montserrat-Regular.woff") format("woff"), url("Montserrat-Regular.ttf") format("truetype"), url("Montserrat-Regular.eot?#iefix") format("embedded-opentype");
    font-display: swap;
    size-adjust: 92.5%
  }

  @font-face {
    font-family: "Montserrat-FF";
    font-weight: 600;
    font-style: normal;
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Montserrat-SemiBold.eot");
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("Montserrat-SemiBold.woff2") format("woff2"), url("Montserrat-SemiBold.woff") format("woff"), url("Montserrat-SemiBold.ttf") format("truetype"), url("Montserrat-SemiBold.eot?#iefix") format("embedded-opentype");
    font-display: swap;
    size-adjust: 92.5%
  }

  .com-paragraph {
    font-family: Helvetica, "serif"
  }

  .container,
  .container-fluid {
    width: 100%;
    padding-left: calc(26px / 1.444444444444);
    padding-right: calc(26px / 1.444444444444);
    margin-right: auto;
    margin-left: auto
  }

  .grid-row {
    display: flex;
    flex-wrap: wrap;
    margin-left: calc(-26px / 4.3333333333);
    margin-right: calc(-26px / 4.3333333333)
  }

  .no-gutter {
    margin-right: 0;
    margin-left: 0
  }

  .no-gutter>.column,
  .no-gutter>[class*="column-"] {
    padding-right: 0;
    padding-left: 0
  }

  .column-1,
  .column-2,
  .column-3,
  .column-4,
  .column-5,
  .column-6,
  .column-7,
  .column-8,
  .column-9,
  .column-10,
  .column-11,
  .column-12,
  .column,
  .column-auto {
    position: relative;
    width: 100%;
    padding-left: calc(26px / 4.3333333333);
    padding-right: calc(26px / 4.3333333333)
  }

  .column {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%
  }

  .column-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%
  }

  .column-1 {
    -ms-flex: calc(1 / 12);
    flex: 0 0 calc(100% / (12 / 1));
    max-width: calc(100% / (12 / 1))
  }

  .column-2 {
    -ms-flex: calc(2 / 12);
    flex: 0 0 calc(100% / (12 / 2));
    max-width: calc(100% / (12 / 2))
  }

  .column-3 {
    -ms-flex: calc(3 / 12);
    flex: 0 0 calc(100% / (12 / 3));
    max-width: calc(100% / (12 / 3))
  }

  .column-4 {
    -ms-flex: calc(4 / 12);
    flex: 0 0 calc(100% / (12 / 4));
    max-width: calc(100% / (12 / 4))
  }

  .column-5 {
    -ms-flex: calc(5 / 12);
    flex: 0 0 calc(100% / (12 / 5));
    max-width: calc(100% / (12 / 5))
  }

  .column-6 {
    -ms-flex: calc(6 / 12);
    flex: 0 0 calc(100% / (12 / 6));
    max-width: calc(100% / (12 / 6))
  }

  .column-7 {
    -ms-flex: calc(7 / 12);
    flex: 0 0 calc(100% / (12 / 7));
    max-width: calc(100% / (12 / 7))
  }

  .column-8 {
    -ms-flex: calc(8 / 12);
    flex: 0 0 calc(100% / (12 / 8));
    max-width: calc(100% / (12 / 8))
  }

  .column-9 {
    -ms-flex: calc(9 / 12);
    flex: 0 0 calc(100% / (12 / 9));
    max-width: calc(100% / (12 / 9))
  }

  .column-10 {
    -ms-flex: calc(10 / 12);
    flex: 0 0 calc(100% / (12 / 10));
    max-width: calc(100% / (12 / 10))
  }

  .column-11 {
    -ms-flex: calc(11 / 12);
    flex: 0 0 calc(100% / (12 / 11));
    max-width: calc(100% / (12 / 11))
  }

  .column-12 {
    -ms-flex: calc(12 / 12);
    flex: 0 0 calc(100% / (12 / 12));
    max-width: calc(100% / (12 / 12))
  }

  table th,
  table td {
    vertical-align: top
  }

  table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #b3b3b3
  }

  table tbody+tbody {
    border-top: 2px solid #b3b3b3
  }

  table th {
    border: 1px solid #b3b3b3;
    background: #f2f2f2;
    padding: 10px;
    text-align: left
  }

  table td {
    border: 1px solid #b3b3b3;
    padding: 5px 10px
  }

  .table-wrap {
    display: block;
    width: 100%;
    position: relative;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
  }

  .table-wrap th,
  .table-wrap td {
    white-space: nowrap
  }

  .table-strip tr:nth-of-type(odd) {
    background: #f7f7f7
  }

  .color-utility-base {
    color: #6D8591 !important
  }

  .box-utility-base {
    color: #4c5d65 !important;
    background: #e7ebed;
    border: 1px solid #b6c2c8;
    padding: 12px 16px
  }

  .box-utility-base a {
    color: #415057 !important
  }

  .box-utility-base a:hover {
    text-decoration: underline
  }

  .color-utility-info {
    color: #2099d6 !important
  }

  .box-utility-info {
    color: #166993 !important;
    background: #d4ecf9;
    border: 1px solid #88cbed;
    padding: 12px 16px
  }

  .box-utility-info a {
    color: #135a7d !important
  }

  .box-utility-info a:hover {
    text-decoration: underline
  }

  .color-utility-success {
    color: #11aa3d !important
  }

  .box-utility-success {
    color: #0a6424 !important;
    background: #9cf5b5;
    border: 1px solid #4ded7b;
    padding: 12px 16px
  }

  .box-utility-success a {
    color: #084d1c !important
  }

  .box-utility-success a:hover {
    text-decoration: underline
  }

  .color-utility-warning {
    color: #FCB715 !important
  }

  .box-utility-warning {
    color: #c28902 !important;
    background: #fff8e8;
    border: 1px solid #fede93;
    padding: 12px 16px
  }

  .box-utility-warning a {
    color: #a97702 !important
  }

  .box-utility-warning a:hover {
    text-decoration: underline
  }

  .color-utility-error {
    color: #FF0000 !important
  }

  .box-utility-error {
    color: #b30000 !important;
    background: #ffd6d6;
    border: 1px solid #ff8080;
    padding: 12px 16px
  }

  .box-utility-error a {
    color: #990000 !important
  }

  .box-utility-error a:hover {
    text-decoration: underline
  }

  .lqd,
  .lqd_img {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat
  }

  .img-xxs {
    width: 40px !important
  }

  .img-xs {
    width: 80px !important
  }

  .img-sm {
    width: 100px !important
  }

  .img-md {
    width: 200px !important
  }

  .img-lg {
    width: 400px !important
  }

  .img-fluid {
    width: 100% !important
  }

  .img-fluid img {
    width: 100%
  }

  .lqd_img {
    position: absolute;
    width: 150%;
    height: 150%;
    top: -25%;
    left: -25%;
    z-index: 0;
    -webkit-filter: blur(10px);
    -moz-filter: blur(10px);
    -o-filter: blur(10px);
    -ms-filter: blur(10px);
    filter: blur(10px)
  }

  .lqd_block {
    overflow: hidden
  }

  .lqd img {
    display: none
  }

  .ratiobox {
    position: relative;
    display: block;
    height: 0;
    overflow: hidden;
    padding-bottom: 100%;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    -ms-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s
  }

  .ratiobox.ratio_16_9 {
    padding-bottom: 56.25%
  }

  .ratiobox.pdb-counter {
    padding-bottom: calc(56.25% + 35px) !important
  }

  .ratiobox iframe {
    position: absolute;
    width: 100%;
    height: 100%
  }

  .block-link:hover .media__image .ratiobox {
    -webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    transform: scale(1.15)
  }

  .ratiobox--16-9 {
    padding-bottom: 56.25%
  }

  .ratiobox--4-3 {
    padding-bottom: 75%
  }

  .ratiobox--3-4 {
    padding-bottom: 133%
  }

  .ratiobox--9-16 {
    padding-bottom: 178%
  }

  input:focus,
  select:focus,
  textarea:focus,
  button:focus {
    outline: none
  }

  textarea,
  select,
  input[type="text"],
  input[type="date"],
  input[type="button"],
  input[type="submit"],
  input[type="file"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none
  }

  select {
    height: 42px;
    padding-right: 32px !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 64 64' style='enable-background:new 0 0 64 64;' fill='%23999999' xml:space='preserve'><path d='M51.4,20.3c0.7-0.8,1.9-0.8,2.6,0c0.8,0.7,0.8,1.9,0,2.6L33.2,43.7c-0.7,0.7-1.9,0.7-2.7,0L9.8,22.9c-0.7-0.7-0.7-1.9,0-2.6c0.8-0.8,1.9-0.8,2.7,0l19.4,19.4L51.4,20.3z'/></svg>");
    background-size: 16px;
    background-position: calc(100% - 8px) center;
    background-repeat: no-repeat
  }

  [type="checkbox"],
  [type="radio"] {
    padding: 0
  }

  textarea {
    resize: none
  }

  textarea.form-element,
  textarea.tagsinput {
    height: auto
  }

  button {
    cursor: pointer;
    background: #f0f0f0;
    color: #000000;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s
  }

  label {
    display: inline-block;
    margin-top: 8px;
    margin-bottom: 8px;
    font-size: 14px
  }

  .form-check label {
    margin: 0
  }

  .form-inline label {
    display: inline-block;
    margin-right: 4px;
    margin-top: 0;
    margin-bottom: 0
  }

  .form-check--inline label {
    line-height: 2
  }

  label a {
    color: var(--kuler-1);
    position: relative;
    z-index: 2
  }

  .form-inline {
    align-items: center
  }

  .form-block {
    position: relative;
    margin-bottom: 12px
  }

  .form-block--error .tagsinput {
    border-color: #FF0000;
    background: #fae9ec
  }

  .form-check {
    position: relative;
    display: block;
    padding-left: 24px
  }

  .form-check__input {
    margin-left: -25px;
    position: absolute;
    z-index: 2;
    height: 100%;
    cursor: pointer;
    left: 0;
    right: 0;
    opacity: 0;
    filter: alpha(opacity=0)
  }

  .form-check__input:checked+label:before {
    background: #007cbd;
    -webkit-transform: scale(1.075);
    -moz-transform: scale(1.075);
    -ms-transform: scale(1.075);
    -o-transform: scale(1.075);
    transform: scale(1.075)
  }

  .form-check--radio .form-check__input:checked+label:after {
    -webkit-transform: scale(0.4);
    -moz-transform: scale(0.4);
    -ms-transform: scale(0.4);
    -o-transform: scale(0.4);
    transform: scale(0.4)
  }

  .form-check--checkbox .form-check__input:checked+label:after {
    font-family: "detiknetwork-FF";
    content: "\49";
    background: transparent;
    line-height: 1;
    color: #FFFFFF;
    -webkit-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75)
  }

  .form-check__input:disabled~label {
    color: #999999
  }

  .form-check__input:hover+label:after {
    -webkit-transform: scale(0.65);
    -moz-transform: scale(0.65);
    -ms-transform: scale(0.65);
    -o-transform: scale(0.65);
    transform: scale(0.65)
  }

  .form-check label {
    position: relative;
    cursor: pointer
  }

  .form-check label:before,
  .form-check label:after {
    content: "";
    width: 16px;
    height: 16px;
    position: absolute;
    left: -24px;
    top: 2px
  }

  .form-check label:before {
    background: #cccccc;
    -webkit-transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
    -moz-transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
    -ms-transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
    -o-transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2);
    transition: background 0.2s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2)
  }

  .form-check label:after {
    background: #FFFFFF;
    -webkit-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75);
    -webkit-transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
    -moz-transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
    -ms-transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
    -o-transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4);
    transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.4)
  }

  .form-check label:hover:after {
    -webkit-transform: scale(0.35);
    -moz-transform: scale(0.35);
    -ms-transform: scale(0.35);
    -o-transform: scale(0.35);
    transform: scale(0.35)
  }

  .form-check--checkbox label:after {
    font-size: 16px
  }

  .form-check--inline {
    display: inline-flex;
    align-items: center;
    margin-right: 12px
  }

  .form-check--inline__input {
    position: static;
    margin-top: 0;
    margin-right: 8px;
    margin-left: 0
  }

  .form-check--inline label:before,
  .form-check--inline label:after {
    top: 5px
  }

  .form-element,
  .tagsinput {
    display: block;
    width: 100%;
    height: 42px;
    padding: 8px 12px;
    border: 1px solid #e6e6e6;
    line-height: 1.4;
    background-color: #FFFFFF;
    color: #333333;
    font-size: 14px;
    -webkit-transition: border-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out;
    -moz-transition: border-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out;
    -ms-transition: border-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out;
    -o-transition: border-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out;
    transition: border-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out
  }

  .form-element:focus,
  .tagsinput:focus {
    border-color: #cccccc
  }

  .form-element[type="date"],
  .tagsinput[type="date"] {
    padding-top: 7px;
    padding-bottom: 7px
  }

  .form-element--error,
  .form-element--error:focus {
    color: #b30000 !important;
    background: #ffd6d6;
    border-color: #ff8080
  }

  .form-inline .form-element,
  .form-inline .tagsinput {
    display: inline-block;
    width: auto;
    vertical-align: middle
  }

  .form-rounded .form-element,
  .form-rounded .tagsinput {
    border-radius: 24px
  }

  .form-gray .form-element,
  .form-gray .tagsinput {
    background-color: #f7f7f7
  }

  .form-file {
    position: relative;
    width: 100%;
    height: 42px;
    padding: 8px 12px 0 20px;
    margin: 0;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
    font-size: 16px
  }

  .form-file:before {
    position: absolute !important;
    left: 0;
    top: 0;
    line-height: 1.4;
    content: 'Pilih file';
    z-index: 1;
    font-size: 16px;
    display: inline-block;
    line-height: 1.4;
    padding: 8px 16px;
    text-align: center;
    cursor: pointer;
    vertical-align: top;
    border: 1px solid transparent;
    border-radius: 4px;
    background: #e6e6e6;
    color: #000000;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s
  }

  .form-file:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 117px;
    height: 37px;
    background: #fff
  }

  .form-file__input {
    position: absolute;
    left: 12px
  }

  .form-element:disabled,
  .tagsinput:disabled,
  .form-element[readonly],
  .tagsinput[readonly],
  .form-gray .form-element:disabled,
  .form-gray .tagsinput:disabled,
  .form-gray .form-element[readonly],
  .form-gray .tagsinput[readonly] {
    background-color: #f0f0f0
  }

  .btn,
  .label {
    position: relative;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    line-height: 1.4;
    padding: 8px 16px;
    justify-content: center;
    cursor: pointer;
    vertical-align: top;
    border: 1px solid transparent;
    border-radius: 4px
  }

  .btn--default,
  .label--default {
    background: #f0f0f0;
    color: #000000
  }

  .btn--rounded,
  .label--rounded {
    padding-left: 24px;
    padding-right: 24px;
    border-radius: 24px
  }

  .btn--sm,
  .label--sm {
    font-size: 12px;
    padding: calc(12px / 3) 12px
  }

  .btn--md,
  .label--md {
    font-size: 14px;
    padding-top: 6px;
    padding-bottom: 6px
  }

  .btn--lg,
  .label--lg {
    font-size: 20px;
    padding: 8px 32px
  }

  .btn:hover {
    color: #000000;
    opacity: 0.8;
    filter: alpha(opacity=80)
  }

  .btn--rounded.btn--sm {
    padding-left: 16px;
    padding-right: 16px;
    border-radius: 16px
  }

  .btn--rounded.btn--lg {
    padding-left: 48px;
    padding-right: 48px;
    border-radius: 32px
  }

  .btn--default.btn--outline {
    border: 1px solid #666666;
    color: #666666
  }

  .btn--default.btn--link {
    color: #007cbd
  }

  .btn--outline {
    border: 1px solid #000000;
    color: #000000
  }

  .btn--link:hover {
    text-decoration: underline;
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .btn--outline,
  .btn--link {
    background: transparent !important
  }

  .btn--block {
    display: block;
    text-align: center;
    width: 100%
  }

  .form-inline .btn {
    margin-bottom: 0
  }

  .form-rounded .btn {
    padding-left: 24px;
    padding-right: 24px;
    border-radius: 24px
  }

  .label {
    cursor: inherit
  }

  .label--rounded.label--sm {
    padding-left: 16px;
    padding-right: 16px;
    border-radius: 16px
  }

  .label--rounded.label--lg {
    padding-left: 48px;
    padding-right: 48px;
    border-radius: 32px
  }

  .btn--sosmed-instagram {
    color: #FFFFFF;
    border: none;
    background: #5851DB;
    background: -moz-radial-gradient(left bottom, ellipse cover, #ffdc80 15%, #e1306c 55%, #5851db 100%);
    background: -webkit-radial-gradient(left bottom, ellipse cover, #ffdc80 15%, #e1306c 55%, #5851db 100%);
    background: radial-gradient(ellipse at left bottom, #ffdc80 15%, #e1306c 55%, #5851db 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$top_color', endColorstr='$bottom_color', GradientType=1)
  }

  .btn--sosmed-instagram:hover {
    color: #FFFFFF;
    border: none
  }

  .pagination {
    display: block;
    font-size: 14px
  }

  .pagination a {
    text-align: center;
    display: inline-block;
    padding: 4px 8px
  }

  .pagination a:first-child {
    margin-right: 16px
  }

  .pagination a:last-child {
    margin-left: 16px
  }

  .pagination__item:hover {
    background: #f0f0f0;
    color: #000000;
    border-radius: 4px
  }

  .pagination__item--active,
  .pagination__item--active:hover {
    background: var(--kuler-1);
    color: #FFFFFF;
    border-radius: 4px
  }

  .pagination__range {
    letter-spacing: 4px;
    background: transparent
  }

  @font-face {
    font-family: "detiknetwork-FF";
    font-weight: normal;
    font-style: normal;
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("detiknetwork.eot");
    src: local("Helvetica-FF, Arial, Tahoma, sans-serif"), url("detiknetwork.woff2") format("woff2"), url("detiknetwork.woff") format("woff"), url("detiknetwork.ttf") format("truetype"), url("detiknetwork.eot?#iefix") format("embedded-opentype");
    font-display: swap
  }

  .icon {
    line-height: 0;
    display: inline-flex;
    vertical-align: middle
  }

  .icon--xxl {
    font-size: 256px
  }

  .icon--xl {
    font-size: 128px
  }

  .icon--lg {
    font-size: 64px
  }

  .icon--md {
    font-size: 32px
  }

  .icon--sm {
    font-size: 24px
  }

  .icon--xs {
    font-size: 16px
  }

  .btn .icon,
  .label .icon {
    margin: 0 4px
  }

  [data-icon]:before {
    font-family: "detiknetwork-FF" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: middle
  }

  [class^="icon-"]:before,
  [class*=" icon-"]:before {
    font-family: "detiknetwork-FF" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: middle
  }

  .icon-home:before {
    content: "\63"
  }

  .icon-home-bg:before {
    content: "\64"
  }

  .icon-chevron-right:before {
    content: "\65"
  }

  .icon-chevron-right-bg:before {
    content: "\66"
  }

  .icon-chevron-left:before {
    content: "\67"
  }

  .icon-chevron-left-bg:before {
    content: "\68"
  }

  .icon-arrow-right:before {
    content: "\69"
  }

  .icon-arrow-left:before {
    content: "\6a"
  }

  .icon-chevron-up:before {
    content: "\6b"
  }

  .icon-chevron-up-bg:before {
    content: "\6c"
  }

  .icon-chevron-down:before {
    content: "\6d"
  }

  .icon-chevron-down-bg:before {
    content: "\6e"
  }

  .icon-arrow-up:before {
    content: "\6f"
  }

  .icon-arrow-down:before {
    content: "\70"
  }

  .icon-search:before {
    content: "\71"
  }

  .icon-search-bg:before {
    content: "\72"
  }

  .icon-user:before {
    content: "\73"
  }

  .icon-user-bg:before {
    content: "\74"
  }

  .icon-live-tv:before {
    content: "\75"
  }

  .icon-live-tv-bg:before {
    content: "\76"
  }

  .icon-tv:before {
    content: "\77"
  }

  .icon-tv-bg:before {
    content: "\78"
  }

  .icon-menu:before {
    content: "\79"
  }

  .icon-menu-bg:before {
    content: "\7a"
  }

  .icon-lock:before {
    content: "\41"
  }

  .icon-lock-bg:before {
    content: "\42"
  }

  .icon-open-lock:before {
    content: "\43"
  }

  .icon-open-lock-bg:before {
    content: "\44"
  }

  .icon-doc:before {
    content: "\45"
  }

  .icon-doc-bg:before {
    content: "\46"
  }

  .icon-calendar:before {
    content: "\47"
  }

  .icon-calendar-bg:before {
    content: "\48"
  }

  .icon-check:before {
    content: "\49"
  }

  .icon-check-bg:before {
    content: "\4a"
  }

  .icon-trash:before {
    content: "\4b"
  }

  .icon-trash-bg:before {
    content: "\4c"
  }

  .icon-pencil:before {
    content: "\4d"
  }

  .icon-pencil-bg:before {
    content: "\4e"
  }

  .icon-close:before {
    content: "\4f"
  }

  .icon-close-bg:before {
    content: "\50"
  }

  .icon-card:before {
    content: "\51"
  }

  .icon-card-bg:before {
    content: "\52"
  }

  .icon-network:before {
    content: "\53"
  }

  .icon-network-bg:before {
    content: "\54"
  }

  .icon-email:before {
    content: "\55"
  }

  .icon-email-bg:before {
    content: "\56"
  }

  .icon-info:before {
    content: "\57"
  }

  .icon-info-bg:before {
    content: "\58"
  }

  .icon-warning:before {
    content: "\59"
  }

  .icon-warning-bg:before {
    content: "\5a"
  }

  .icon-video:before {
    content: "\30"
  }

  .icon-video-bg:before {
    content: "\31"
  }

  .icon-image:before {
    content: "\32"
  }

  .icon-image-bg:before {
    content: "\33"
  }

  .icon-file-text:before {
    content: "\34"
  }

  .icon-file-text-bg:before {
    content: "\35"
  }

  .icon-graphic:before {
    content: "\36"
  }

  .icon-graphic-bg:before {
    content: "\37"
  }

  .icon-folder:before {
    content: "\38"
  }

  .icon-folder-bg:before {
    content: "\39"
  }

  .icon-notification:before {
    content: "\21"
  }

  .icon-notification-bg:before {
    content: "\22"
  }

  .icon-download:before {
    content: "\23"
  }

  .icon-download-bg:before {
    content: "\24"
  }

  .icon-upload:before {
    content: "\25"
  }

  .icon-upload-bg:before {
    content: "\26"
  }

  .icon-filter:before {
    content: "\27"
  }

  .icon-filter-bg:before {
    content: "\28"
  }

  .icon-sent-mail:before {
    content: "\29"
  }

  .icon-sent-mail-bg:before {
    content: "\2a"
  }

  .icon-play:before {
    content: "\2b"
  }

  .icon-play-bg:before {
    content: "\2c"
  }

  .icon-comment:before {
    content: "\2d"
  }

  .icon-comment-bg:before {
    content: "\2e"
  }

  .icon-plus:before {
    content: "\2f"
  }

  .icon-plus-bg:before {
    content: "\3a"
  }

  .icon-favorite:before {
    content: "\3b"
  }

  .icon-favorite-bg:before {
    content: "\3c"
  }

  .icon-share:before {
    content: "\3d"
  }

  .icon-share-bg:before {
    content: "\3e"
  }

  .icon-setting:before {
    content: "\3f"
  }

  .icon-setting-bg:before {
    content: "\40"
  }

  .icon-crown:before {
    content: "\5b"
  }

  .icon-crown-bg:before {
    content: "\5d"
  }

  .icon-zoom:before {
    content: "\5e"
  }

  .icon-zoom-bg:before {
    content: "\5f"
  }

  .icon-quote-right:before {
    content: "\60"
  }

  .icon-quote-left:before {
    content: "\7b"
  }

  .icon-camera:before {
    content: "\7c"
  }

  .icon-camera-bg:before {
    content: "\7d"
  }

  .icon-link:before {
    content: "\7e"
  }

  .icon-link-bg:before {
    content: "\5c"
  }

  .icon-love:before {
    content: "\e000"
  }

  .icon-love-bg:before {
    content: "\e001"
  }

  .icon-sign-out:before {
    content: "\e002"
  }

  .icon-sign-out-bg:before {
    content: "\e003"
  }

  .icon-sign-in:before {
    content: "\e004"
  }

  .icon-sign-in-bg:before {
    content: "\e005"
  }

  .icon-facebook:before {
    content: "\61"
  }

  .icon-twitter:before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='17' viewBox='0 0 18 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.425986 0.877441L6.99437 9.65591L0.390625 16.7901H1.8758L7.65739 10.5399L12.3339 16.7901H17.3906L10.4598 7.51655L16.6038 0.877441H15.1187L9.79676 6.63251L5.49151 0.877441H0.434827H0.425986ZM2.60955 1.97364H4.93457L15.1982 15.6939H12.8732L2.60955 1.97364Z' fill='white'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 18px;
    height: 17px
  }

  .sticky-share__wrap .icon-twitter:before {
    width: 14px;
    height: 16px
  }

  .page__follow .icon-twitter:before {
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='17' viewBox='0 0 18 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.425986 0.877441L6.99437 9.65591L0.390625 16.7901H1.8758L7.65739 10.5399L12.3339 16.7901H17.3906L10.4598 7.51655L16.6038 0.877441H15.1187L9.79676 6.63251L5.49151 0.877441H0.434827H0.425986ZM2.60955 1.97364H4.93457L15.1982 15.6939H12.8732L2.60955 1.97364Z' fill='%23666666'/%3E%3C/svg%3E%0A")
  }

  .icon-instagram:before {
    content: "\e006"
  }

  .icon-linkedin:before {
    content: "\e007"
  }

  .icon-youtube:before {
    content: "\e008"
  }

  .icon-refresh:before {
    content: "\e009"
  }

  .icon-eye:before {
    content: "\e00a"
  }

  .icon-back-in-time:before {
    content: "\e00b"
  }

  .icon-whatsapp:before {
    content: "\e00c"
  }

  .icon-code:before {
    content: "\e00d"
  }

  .icon-telegram:before {
    content: "\e00e"
  }

  .icon-tiktok:before {
    content: "";
    width: 16px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='22' viewBox='0 0 20 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.96337 19.1587C-1.43553 15.3416 1.4095 6.84288 8.17224 7.91213V8.69927C2.46079 8.43365 -0.053318 15.2464 2.96337 19.1587ZM15.2989 4.41544C15.9938 4.97071 16.9521 5.3803 18.2731 5.45848V6.22958C16.8113 5.9596 15.8848 5.23316 15.2989 4.41544ZM13.4649 0.355957C13.4639 0.640509 13.5008 0.946185 13.5474 1.2254H10.8514V14.6486C10.8514 15.2675 10.7878 15.8184 10.6611 16.3018C9.56319 18.7217 6.45472 18.4056 5.59573 16.7449C6.87451 17.5456 8.97733 17.333 9.84046 15.4324C9.96623 14.9499 10.0298 14.3978 10.0298 13.7792V0.355957H13.4651H13.4649Z' fill='%2300F7EF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.287 1.22559V1.24282C14.288 1.5536 14.379 6.04768 19.0953 6.3281C19.0953 10.509 19.0974 6.32811 19.0974 9.80052C18.7432 9.82164 15.9931 9.62279 14.2819 8.09636L14.2766 14.8562C14.3188 17.9171 12.6149 20.9189 9.42486 21.5237C8.53114 21.693 7.72628 21.7121 6.37539 21.4169C-1.40683 19.089 1.17915 7.54644 8.99317 8.78176C8.99317 12.5081 8.99536 8.78079 8.99536 12.5081C5.76719 12.0332 4.68725 14.7188 5.54528 16.6414C6.3261 18.392 9.54018 18.7717 10.6614 16.302C10.7884 15.8186 10.8517 15.2675 10.8517 14.6488V1.22559H14.287Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.17395 8.69921C8.44029 8.71087 8.7144 8.73709 8.99483 8.78152C8.99483 12.5079 8.99701 8.78055 8.99701 12.5079C5.76885 12.033 4.68891 14.7185 5.54694 16.6412C5.56272 16.6761 5.57971 16.7111 5.59768 16.7449C5.21383 16.5047 4.905 16.1748 4.72533 15.7717C3.86852 13.8488 4.94724 11.1636 8.17541 11.6382C8.17541 8.22285 8.17443 11.065 8.17443 8.69897L8.17395 8.69921ZM18.2748 6.22977C18.5317 6.27712 18.8058 6.31087 19.0967 6.3281C19.0967 10.509 19.0989 6.3281 19.0989 9.80052C18.7446 9.82164 15.9945 9.62279 14.2833 8.09636L14.278 14.8562C14.3202 17.9171 12.6163 20.9189 9.42627 21.5237C8.53255 21.693 7.7277 21.7121 6.3768 21.4169C4.85595 20.9622 3.7328 20.1541 2.96484 19.1587C3.64903 19.7531 4.50779 20.2343 5.55616 20.5484C6.9056 20.8425 7.7107 20.8235 8.60442 20.6541C11.7945 20.049 13.4984 17.0474 13.4571 13.9875L13.4615 7.22668C15.1727 8.75311 17.9228 8.95293 18.2782 8.93059C18.2782 5.70583 18.2751 9.08088 18.2751 6.22953L18.2748 6.22977ZM14.2884 1.22559V1.24282C14.2884 1.42565 14.3212 3.04823 15.3006 4.41563C14.1202 3.47117 13.6994 2.10692 13.5491 1.22559H14.2884Z' fill='%23FF004F'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain
  }

  .notification-overlay {
    width: 300px;
    position: fixed;
    top: 215px;
    left: 50%;
    z-index: 12;
    padding: 12px 16px;
    color: var(--kuler-1);
    background: #FFFFFF;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s
  }

  .notification-overlay__close {
    position: absolute;
    top: calc(4px / 2);
    right: 4px;
    color: #999999
  }

  .notification-overlay a:hover .icon {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: all 0.5s ease-in-out 0s;
    -moz-transition: all 0.5s ease-in-out 0s;
    -ms-transition: all 0.5s ease-in-out 0s;
    -o-transition: all 0.5s ease-in-out 0s;
    transition: all 0.5s ease-in-out 0s
  }

  .notification-overlay--alpha {
    opacity: 0.5;
    filter: alpha(opacity=50)
  }

  .loader-animate {
    width: 32px;
    margin: 12px auto
  }

  .copy_url {
    position: relative
  }

  .copy_url .notif {
    display: inline-block;
    padding: 8px;
    margin: 0;
    position: absolute;
    z-index: 5;
    bottom: 0%;
    left: 50%;
    width: auto;
    white-space: nowrap;
    font-size: 14px;
    background: #FF0000;
    color: #FFFFFF;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateX(-50%) scale(0);
    -moz-transform: translateX(-50%) scale(0);
    -ms-transform: translateX(-50%) scale(0);
    -o-transform: translateX(-50%) scale(0);
    transform: translateX(-50%) scale(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s
  }

  .copy_url .notif:before {
    position: absolute;
    content: "";
    border: 3px solid;
    right: 50%;
    margin: 0 -7px 0 0;
    top: 100%;
    border-top: 8px solid #ff0000;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: none
  }

  .copy_url .notif.url_copied {
    display: inline-block;
    bottom: 135%;
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateX(-50%) scale(1);
    -moz-transform: translateX(-50%) scale(1);
    -ms-transform: translateX(-50%) scale(1);
    -o-transform: translateX(-50%) scale(1);
    transform: translateX(-50%) scale(1)
  }

  .livereport_notif {
    text-align: center;
    padding-top: 16px;
    z-index: 3
  }

  .livereport_notif a:hover i {
    transform: rotate(360deg);
    transition: 2s
  }

  .breaking-sticky {
    visibility: hidden;
    z-index: 5;
    position: fixed;
    left: -100%;
    right: 0;
    height: 0;
    top: 88px;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all 0.2s ease-in-out 0s;
    -moz-transition: all 0.2s ease-in-out 0s;
    -ms-transition: all 0.2s ease-in-out 0s;
    -o-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s
  }

  .breaking-sticky--sticked {
    visibility: visible;
    left: 0px;
    top: 88px;
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
  }

  .breaking-sticky .media__text {
    overflow: hidden
  }

  .breaking-sticky .breaking-detikpagi .media__text {
    background: none;
    display: block
  }

  .breaking-sticky .media__title {
    white-space: nowrap;
    margin-left: -10px;
    overflow: hidden;
    padding: 10px 0;
    line-height: normal;
    font-size: 14px
  }

  .breaking-sticky .media__link {
    color: white
  }

  .breaking-sticky .media__label {
    background: #FF0000;
    border-radius: 0;
    -webkit-transform: skew(-15deg, 0deg);
    -moz-transform: skew(-15deg, 0deg);
    -ms-transform: skew(-15deg, 0deg);
    -o-transform: skew(-15deg, 0deg);
    transform: skew(-15deg, 0deg);
    left: -8px;
    top: auto;
    padding: 10px 20px 10px 24px;
    position: relative;
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.8)
  }

  .breaking-detikpagi {
    visibility: hidden;
    left: -100%;
    width: 100%;
    height: 62px !important;
    background: #ff4c05 url("../index/detikpagi-new-bg-m.svg") no-repeat top;
    background-size: 101%;
    bottom: 100px;
    position: fixed;
    z-index: 10;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all 0.2s ease-in-out 0s;
    -moz-transition: all 0.2s ease-in-out 0s;
    -ms-transition: all 0.2s ease-in-out 0s;
    -o-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s
  }

  .breaking-detikpagi--sore {
    background: #17b8ca url("../index/detiksore-new-bg-m.svg") no-repeat top;
    background-size: 101%
  }

  .breaking-detikpagi--drooftalk {
    background: #020202 url("../index/bg-drooftalk.webp") no-repeat top;
    background-size: 101%
  }

  .breaking-sticky .breaking-detikpagi {
    bottom: auto
  }

  .breaking-detikpagi--sticked {
    visibility: visible;
    left: 0;
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
  }

  .breaking-detikpagi__content {
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px
  }

  .breaking-detikpagi__close {
    position: absolute;
    z-index: 5;
    width: 27px;
    height: 27px;
    right: 0;
    top: 0;
    color: #FFFFFF
  }

  .breaking-detikpagi .media--left {
    height: 72px !important
  }

  .breaking-detikpagi .media--left .media__image {
    width: 110px;
    height: 80px;
    z-index: 3
  }

  .breaking-detikpagi .mt-7 {
    margin-top: 7px
  }

  .detikpagi-live {
    margin-top: 8px
  }

  .breaking-detikpagi--drooftalk .detikpagi-live {
    margin-left: 6px;
    display: inline-block
  }

  .detikpagi-live span {
    position: relative;
    background: #ffe600;
    display: inline-block;
    padding: 0 8px 0 20px;
    color: #EE4023;
    font-size: 9px;
    border-radius: 12px
  }

  .breaking-detikpagi--drooftalk .detikpagi-live span {
    color: #232323
  }

  .detikpagi-live span:before {
    content: "";
    width: 7px;
    height: 7px;
    position: absolute;
    top: 3px;
    left: 7px;
    overflow: hidden;
    animation: live-detikpagi 1s;
    -moz-animation: live-detikpagi 1s infinite;
    -webkit-animation: live-detikpagi 1s infinite;
    background: #C72026
  }

  .detikpagi-live__body {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-left: 12px
  }

  .breaking-detikpagi--drooftalk .detikpagi-live__body {
    margin-left: -6px
  }

  .detikpagi-live__body__left {
    margin-top: 5px
  }

  .detikpagi-live__body__right {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-right: 16px;
    width: 100%
  }

  .breaking-detikpagi--drooftalk .detikpagi-live__body__right {
    margin-top: -12px
  }

  .detikpagi-live__body__right__text {
    font-weight: 600;
    font-size: 11px;
    color: #ffffff;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    width: 80%;
    margin-top: -7px
  }

  .detikpagi-live__body__right__button {
    width: 20%
  }

  .detikpagi-live__body__right__button__play {
    display: block;
    padding: 2px 0 8px
  }

  .detikpagi-live__body__right__button__pause {
    display: none;
    padding: 2px 0 8px
  }

  .detikpagi-live__body__img {
    padding-top: 15px
  }

  @keyframes live-detikpagi {
    0% {
      background: #fcc43f
    }

    50% {
      background: #C72026
    }

    100% {
      background: #fcc43f
    }
  }

  .today-recap-title {
    display: inline-block;
    font-size: 18px;
    -webkit-transform: skew(15deg);
    -moz-transform: skew(15deg);
    -ms-transform: skew(15deg);
    -o-transform: skew(15deg);
    transform: skew(15deg)
  }

  .mgt-36 {
    margin-top: 36px !important
  }

  .custom-width-popup {
    width: 128px;
    height: 127px !important;
    border-radius: 20px
  }

  .position-live-custom {
    top: -102px !important;
    left: 10px !important
  }

  .custom-close {
    width: 14px;
    height: 14px;
    border-radius: 100%;
    background: #ccc
  }

  .custom-icon {
    width: 14px;
    height: 14px;
    font-size: 10px;
    padding-left: 2px;
    padding-top: 2px
  }

  .left-10 {
    left: 10px !important
  }

  .margin-none {
    margin: 0px !important
  }

  .width-128 {
    width: 128px !important
  }

  .close-edit {
    background: none !important;
    right: 8px !important;
    top: 10px !important
  }

  .header {
    display: flex;
    padding: 8px 0 0 0;
    justify-content: space-between;
    align-items: center;
    background: #FFFFFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.15);
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 26;
    width: 100%;
    line-height: 1
  }

  .header__top {
    width: 100%;
    display: block
  }

  .header__left {
    display: flex;
    align-items: center;
    left: -12px
  }

  .header__right {
    display: flex;
    height: 41px
  }

  .header__brand {
    height: 24px
  }

  .header__brand img {
    height: 100%
  }

  .header__icon {
    width: 43px;
    font-size: 35px;
    padding: 0 0 0 8px;
    position: relative
  }

  .header__icon--live {
    color: #21409A
  }

  .header__icon--notif {
    color: #999999
  }

  .menu-button {
    cursor: pointer;
    height: 45px;
    width: 40px;
    position: relative
  }

  .menu-button__wrap {
    position: absolute;
    top: 15px;
    left: 12px
  }

  .menu-button span {
    cursor: pointer;
    height: 2px;
    width: 20px;
    background: #21409A;
    position: absolute;
    display: block;
    border-radius: 10px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
  }

  .menu-button span:nth-child(1) {
    top: 0px
  }

  .menu-button span:nth-child(2) {
    top: 7px
  }

  .menu-button span:nth-child(3) {
    top: 14px;
    width: 14px
  }

  .js-menu-active .menu-button span {
    background: #FF0000
  }

  .js-menu-active .menu-button span:nth-child(1) {
    top: 8px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg)
  }

  .js-menu-active .menu-button span:nth-child(2) {
    opacity: 0;
    left: -60px
  }

  .js-menu-active .menu-button span:nth-child(3) {
    top: 8px;
    width: 20px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg)
  }

  @keyframes top-x {
    0% {
      transform: translateY(-8px) rotate(0)
    }

    50% {
      transform: translateY(0px) rotate(0)
    }

    100% {
      transform: translateY(0px) rotate(45deg)
    }
  }

  @keyframes bottom-x {
    0% {
      transfrom: translateY(0) rotate(0)
    }

    50% {
      transform: translateY(-8px) rotate(0)
    }

    100% {
      transform: translateY(-8px) rotate(-45deg)
    }
  }

  @keyframes bottom-x2 {
    0% {
      transfrom: translateY(5px) rotate(0);
      width: 18px
    }

    50% {
      transform: translateY(0px) rotate(0)
    }

    100% {
      transform: translateY(0px) rotate(-45deg)
    }
  }

  @keyframes undo-top {
    0% {
      transform: translateY(0px) rotate(45deg)
    }

    50% {
      transform: translateY(0px) rotate(0)
    }

    100% {
      transform: translateY(-8px) rotate(0)
    }
  }

  @keyframes undo-bottom {
    0% {
      transform: translateY(-8px) rotate(-45deg)
    }

    50% {
      transform: translateY(-8px) rotate(0)
    }

    100% {
      transfrom: translateY(0px) rotate(0)
    }
  }

  .notif__balon {
    position: absolute;
    width: 22px;
    height: 22px;
    padding: 4px;
    right: -4px;
    top: 0;
    z-index: 1;
    border-radius: 50%;
    background: #FF0000;
    color: #FFFFFF;
    font-size: 12px
  }

  .headline {
    margin: 12px calc(-26px / 4.3333333333) 20px;
    overflow: hidden;
    border-radius: 8px
  }

  .headline a {
    color: #FFFFFF
  }

  .headline--video h2.media__title a {
    position: relative
  }

  .headline .media__image {
    margin-bottom: 0;
    background: transparent
  }

  .headline.headline--breakingnews .media__image {
    width: 100%;
    background: transparent
  }

  .headline .media__text {
    padding: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: column;
    justify-content: center
  }

  .headline.headline--video .media__text,
  .headline.headline--breakingnews .media__text {
    width: 100%;
    height: 154px
  }

  .headline .media__title {
    flex: none;
    font-size: 20px
  }

  .headline.headline--breakingnews .media__title,
  .headline.headline--video .media__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center
  }

  .headline.headline--breakingnews .media__title a,
  .headline.headline--video .media__title a {
    display: block;
    display: -webkit-box;
    max-width: 100%;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
  }

  .headline.headline--video .media__title a {
    -webkit-line-clamp: 3
  }

  .headline.headline--breakingnews .media__title {
    height: 88px
  }

  .headline.headline--breakingnews .media__title a {
    -webkit-line-clamp: 3
  }

  .headline .media__subtitle {
    color: #fcc43f
  }

  .headline .media__subtitle a {
    color: #fcc43f
  }

  .headline .media__date {
    color: #f7f7f7
  }

  .headline.headline--breakingnews .media__label {
    background: #FF0000;
    border-radius: 6px;
    -webkit-transform: skew(-15deg, 0deg);
    -moz-transform: skew(-15deg, 0deg);
    -ms-transform: skew(-15deg, 0deg);
    -o-transform: skew(-15deg, 0deg);
    transform: skew(-15deg, 0deg);
    left: -20px;
    top: -20px;
    padding: 12px 20px 8px 24px;
    position: relative;
    margin-bottom: -5px;
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.8)
  }

  .headline .media--text-overlay .media__text {
    padding: 15% 16px 16px;
    min-height: 160px
  }

  .list-content {
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0
  }

  .list-content__item {
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 8px;
    margin-bottom: 8px
  }

  .list-content__item:first-child {
    margin-top: 8px
  }

  .list-content--column .list-content__item:first-child {
    margin-top: 0
  }

  .list-content__item:last-child {
    margin-bottom: 0
  }

  .list-content--column .list-content__item {
    padding-bottom: 12px;
    margin-bottom: 12px
  }

  .list-content__item .page__share {
    position: absolute;
    right: 0
  }

  .list-content__title {
    margin: 0;
    font-size: 14px
  }

  .list-content__title>a {
    display: block
  }

  .list-content--column {
    margin-top: 8px
  }

  .list-content--bordered .list-content__item {
    border-bottom: 1px solid #f0f0f0
  }

  .list-content--bordered .list-content__item:last-child {
    border: none
  }

  .list-content--bordered.list-content--column .list-content__item {
    border: none
  }

  .list-content--bordered.list-content--column .list-content__item:after {
    content: "";
    position: absolute;
    left: calc(26px / 2);
    right: calc(26px / 2);
    bottom: 0;
    height: 1px;
    background: #f0f0f0
  }

  .media {
    position: relative;
    overflow: hidden;
    flex: 1
  }

  .list-content--equal-height .media {
    background: #FFFFFF;
    box-shadow: 0 calc(4px / 2) 4px 0 rgba(0, 0, 0, 0.15);
    border-radius: 8px
  }

  .media__image {
    position: relative;
    margin-bottom: 12px;
    overflow: hidden;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    background: #f0f0f0
  }

  .media__image.float-vid.flowed {
    -webkit-mask-image: unset
  }

  .media__image a {
    display: block
  }

  .media__text {
    flex: 1;
    position: static;
    font-size: 12px;
    color: #666666
  }

  .list-content--equal-height .media__text {
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 32px
  }

  .media__title {
    margin: 0;
    flex: 1;
    font-size: 14px
  }

  .media__subtitle {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 4px;
    font-size: 12px
  }

  .media__subtitle a {
    position: relative;
    z-index: 3
  }

  .media__subtitle a:hover {
    text-decoration: underline
  }

  .media__date {
    display: inline-block;
    margin-top: 4px;
    line-height: 1.5;
    color: #666666;
    font-size: 12px
  }

  .list-content--equal-height .media__date {
    position: absolute;
    bottom: 12px
  }

  .media__author {
    position: relative;
    z-index: 2;
    margin-top: 8px;
    font-size: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    color: #333333
  }

  .media__author-image-avatar {
    position: relative;
    width: 25px;
    height: 25px;
    display: inline-flex;
    overflow: hidden;
    margin-right: 8px;
    background: #f0f0f0
  }

  .media__author a:hover {
    text-decoration: underline
  }

  .media__link {
    position: static
  }

  .media__link:before {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    top: 0;
    right: 0;
    overflow: hidden;
    white-space: nowrap;
    z-index: 2
  }

  .media__label {
    display: inline-block;
    padding: calc(12px / 3) 12px;
    position: absolute;
    top: 4px;
    left: 4px;
    z-index: 1;
    color: #FFFFFF;
    background: #21409A;
    font-size: 12px
  }

  .media__icon {
    position: absolute;
    z-index: 1;
    padding: calc(4px / 2) 4px;
    text-align: center;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    color: #FFFFFF;
    font-size: 12px;
    background: #000000;
    background: rgba(0, 0, 0, 0.5)
  }

  .media__icon .icon {
    margin: 0 2px
  }

  .media__icon--middle {
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate3d(-50%, -50%, 0);
    -o-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
  }

  .media__icon--top-right {
    top: 4px;
    right: 4px
  }

  .media__icon--top-left {
    top: 4px;
    left: 4px
  }

  .media__icon--bottom-right {
    bottom: 4px;
    right: 4px
  }

  .media__icon--bottom-left {
    bottom: 4px;
    left: 4px
  }

  .media__icon--no-bg {
    background: none;
    padding: 0
  }

  .media__desc {
    color: #000000;
    font-size: 14px;
    margin-bottom: 12px
  }

  .media--left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: flex-start
  }

  .media--right {
    flex-direction: row-reverse;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: flex-start
  }

  .media--left .media__image {
    margin: 0 16px 0 0
  }

  .media--right .media__image {
    margin: 0 0 0 16px
  }

  .media--left .media__image,
  .media--right .media__image {
    width: 116px
  }

  .media--align-center {
    align-items: center
  }

  .media--text-overlay .media__image {
    margin-bottom: 0
  }

  .media--text-overlay .media__text {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15% 12px 12px;
    z-index: 2;
    color: #FFFFFF;
    background: #000000;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1)
  }

  .media--text-overlay .media__text a {
    color: #FFFFFF
  }

  .media--text-overlay .media__subtitle {
    color: #fcc43f
  }

  .media--text-overlay .media__subtitle a {
    color: #fcc43f
  }

  .media--text-overlay .media__date {
    color: #f7f7f7
  }

  .media--text-overlay.media--image-radius .media__text {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px
  }

  .text-list {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: baseline;
    font-size: 16px
  }

  .text-list__data {
    margin-right: 8px
  }

  .text-list__title {
    font-size: inherit;
    font-weight: inherit
  }

  .text-list--title {
    margin-bottom: 12px;
    font-size: 18px
  }

  .box-ads {
    margin-top: 16px;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center
  }

  .box-ads__name {
    position: absolute;
    top: calc(50% - 40px);
    padding: 8px 12px;
    z-index: -1;
    font-size: 14px;
    color: #cccccc
  }

  .ads-slot--smb .box-ads__name {
    top: calc(50% - 25px)
  }

  .box-ads--container {
    margin-left: calc(-26px / 1.444444444444);
    margin-right: calc(-26px / 1.444444444444)
  }

  .ads-slot {
    position: relative;
    z-index: 1;
    margin: 0 auto;
    background: #f7f7f7
  }

  .ads-slot>* {
    flex: 1 100%
  }

  .ads-slot img {
    max-width: 100%;
    height: auto
  }

  .ads-slot:before {
    position: absolute;
    content: "Advertisement";
    left: 50%;
    top: 50%;
    height: 50px;
    z-index: -1;
    letter-spacing: 2px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Crect opacity='0.2' width='32' height='32' fill='url(%23pattern0)'/%3E%3Cdefs%3E%3Cpattern id='pattern0' patternContentUnits='objectBoundingBox' width='1' height='1'%3E%3Cuse xlink:href='%23image0' transform='scale(0.015625)'/%3E%3C/pattern%3E%3Cimage id='image0' width='64' height='64' xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAZ5QTFRFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlvQmPgAAAIp0Uk5TABVTfqXL3+z5M43S/v8Nc9UQgO4BYeoexDvpYgOOsVgqODcR/cx0FgJHieYxBV/oZBPyRPs8dcCVwb2MKD2SfJ6BPyYayKvUQSWyhGebh7yflq9/rZDJNg4H4NNRXqb8tAnWoGzO+PbFXUsMHdgf5DC/w1BPLecc3MY6YwSK6yPtD3LQi8qnfVIYuEyKDwAAAuxJREFUeJylV+d/0zAQVbaTSHH2bimQQtgUwggtAVoopexSaEvZo+y9wgplw39NbDmOrHF2ftzHl/deLOl0ukNIET5/IBgKRzQtEg4FA36fiiePaCyOiSNwPBb1qk7oSSKNpJ7wIE+lM3K5EZl0ykWezeXVciPyuSykLxRhuRHFglpfKrvrCSmXVPqK5kVPiFaRyqtD3uRGDFUl+mHvekKGRYcB/t/8BmH9EHvNiBlrWYzbhxK4f+soaT2LaY6zKMDnJzMgZSYfsi75IzUgxX5O5mC9woDkevqUS/6rDPK9m5V20asMSJriCeD+wgYZWh90N73SgOgmrqg/XgySBhxVC7WaiwEx6mRMLh7dEN2Yrfs2bd4CGcS6cFwmL261k2Tb9h1qg3i3/mMR1nY6Cl9qTGmAfcgvort2I2lIDIgfBQSssUeulxoEUFDA9ir0UoMgGuWhfb31R/c3D4xPuBiEUJiHDlJ2tWXubuMQbBBGEf4DLPbhHnAENIggvpZZtW7SBhpTkIEmGByl5GN9ZBo24JZwnHJnWOwEuARuE2cp9ySLnQI3MeQETlPuNIvFwGPkEukM5Z5lsXNgInGpfJ5y51isBRhc4C/TPOVeZDEdMPDz1/kS5TpsF9QG3evMFZTGoslduix4Sg2WkVDSrlDy1T4yAxgYB8QV1WuUXLdTcR66C2bz6Szr1628G7McbtwEDG6ZOPew3Lbo1Tt3V+7df4AQYEDPh3va8ENbwfWU4tP2iP7APa6Rx0geqsdVeN6fPPVmULYbZ77BePbcqVySG9gNhtjiNMaZxn7ihfxleslskdhk5Vsl8/fUq9kaeV0w442D8fYd+5GyNm+l3Xzfrom49esH5zLBRlMWH/ktHrDVbfH6AZvtuU/iKQ/Q7uPPdVGP/nvgQF5Hns6kSu9p6MLNL2q9MfZ1YHmnAo59CB488Wrgq4vcCNXoi5e/LXqQm8EP3xjj7z8W3HVs9Mb/2mr756/ff/6qeP8AIJG7VASH5AAAAAAASUVORK5CYII='/%3E%3C/defs%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center 4px;
    background-size: 24px;
    padding: 3px 0;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate3d(-50%, -50%, 0);
    -o-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    color: #999999;
    font-size: 12px;
    align-items: flex-end
  }

  .ads-slot__name {
    display: none;
    position: absolute;
    top: calc(50% - 40px);
    padding: 8px 12px;
    z-index: -1;
    font-size: 14px;
    color: #cccccc
  }

  .ads-slot--smb {
    height: 50px;
    z-index: 2;
    box-shadow: 0 calc(4px / 2) 4px 0 rgba(0, 0, 0, 0.15);
    position: sticky;
    position: -webkit-sticky;
    top: 0
  }

  .ads-slot-mb-container {
    width: 100%;
    height: 506px;
    position: absolute;
    background-attachment: scroll;
    background-position: left top;
    background-size: cover;
    clip: rect(auto, auto, auto, auto);
    justify-content: center
  }

  .ads-slot--mb {
    width: 320px;
    height: 480px;
    margin-top: 26px !important;
    position: fixed !important;
    z-index: 1 !important;
    background-image: url("../index/mega-billboard-placeholder.webp");
    background-repeat: no-repeat;
    background-position: center center
  }

  .ads-slot--mb iframe {
    border: 0px;
    vertical-align: bottom;
    width: 320px;
    height: 480px
  }

  .ads-slot--bb {
    width: 100%;
    height: 156px;
    background-image: url("../index/billboard-placeholder.webp");
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    z-index: 1;
    margin: 0 auto;
    background-color: #f7f7f7
  }

  .ads-slot--bb .tvcbillboard+div {
    position: absolute
  }

  .ads-slot--sb {
    width: 300px;
    height: 250px
  }

  .ads-slot--ib {
    width: 320px;
    height: 50px
  }

  .ads-slot--pd {
    width: 320px;
    height: 180px
  }

  .megabillboard {
    height: 524px;
    position: relative
  }

  .megabillboard__swipe {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0
  }

  .megabillboard__swipe p {
    display: block;
    margin: 0px;
    font-size: 10px;
    padding: 2px 0px;
    background: var(--kuler-1)
  }

  .megabillboard-close {
    cursor: pointer;
    position: fixed;
    right: calc(50% - 160px);
    padding: 5px 0;
    z-index: 2;
    color: var(--kuler-1);
    font-size: 12px
  }

  .smartbanner_new {
    height: 50px;
    padding: 0 8px;
    position: relative;
    font-size: 11px;
    align-items: center;
    text-align: left;
    z-index: 27
  }

  .smartbanner_new .app_logo {
    height: 36px;
    margin-right: 10px
  }

  .smartbanner_new strong {
    display: block;
    font-size: 12px
  }

  .smartbanner_new .get_app {
    margin-right: 20px
  }

  .smartbanner_new .sb_close {
    position: absolute;
    text-decoration: none;
    height: 14px;
    width: 14px;
    font-size: 10px;
    top: 5px;
    right: 5px;
    border: 1px solid #21409A
  }

  .smartbanner_new>div>span {
    height: 31px
  }

  .pd-0 {
    padding: 0 !important
  }

  .pdt-0 {
    padding-top: 0 !important
  }

  .pdr-0 {
    padding-right: 0 !important
  }

  .pdb-0 {
    padding-bottom: 0 !important
  }

  .pdl-0 {
    padding-left: 0 !important
  }

  .mg-0 {
    margin: 0 !important
  }

  .mgt-0 {
    margin-top: 0 !important
  }

  .mgr-0 {
    margin-right: 0 !important
  }

  .mgb-0 {
    margin-bottom: 0 !important
  }

  .mgl-0 {
    margin-left: 0 !important
  }

  .px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
  }

  .py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .mx-0 {
    margin-left: 0 !important;
    margin-right: 0 !important
  }

  .my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important
  }

  .pd-4 {
    padding: 4px !important
  }

  .pdt-4 {
    padding-top: 4px !important
  }

  .pdr-4 {
    padding-right: 4px !important
  }

  .pdb-4 {
    padding-bottom: 4px !important
  }

  .pdl-4 {
    padding-left: 4px !important
  }

  .mg-4 {
    margin: 4px !important
  }

  .mgt-4 {
    margin-top: 4px !important
  }

  .mgr-4 {
    margin-right: 4px !important
  }

  .mgb-4 {
    margin-bottom: 4px !important
  }

  .mgl-4 {
    margin-left: 4px !important
  }

  .px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important
  }

  .py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important
  }

  .mx-4 {
    margin-left: 4px !important;
    margin-right: 4px !important
  }

  .my-4 {
    margin-top: 4px !important;
    margin-bottom: 4px !important
  }

  .pd-8 {
    padding: 8px !important
  }

  .pdt-8 {
    padding-top: 8px !important
  }

  .pdr-8 {
    padding-right: 8px !important
  }

  .pdb-8 {
    padding-bottom: 8px !important
  }

  .pdl-8 {
    padding-left: 8px !important
  }

  .mg-8 {
    margin: 8px !important
  }

  .mgt-8 {
    margin-top: 8px !important
  }

  .mgr-8 {
    margin-right: 8px !important
  }

  .mgb-8 {
    margin-bottom: 8px !important
  }

  .mgl-8 {
    margin-left: 8px !important
  }

  .px-8 {
    padding-left: 8px !important;
    padding-right: 8px !important
  }

  .py-8 {
    padding-top: 8px !important;
    padding-bottom: 8px !important
  }

  .mx-8 {
    margin-left: 8px !important;
    margin-right: 8px !important
  }

  .my-8 {
    margin-top: 8px !important;
    margin-bottom: 8px !important
  }

  .pd-12 {
    padding: 12px !important
  }

  .pdt-12 {
    padding-top: 12px !important
  }

  .pdr-12 {
    padding-right: 12px !important
  }

  .pdb-12 {
    padding-bottom: 12px !important
  }

  .pdl-12 {
    padding-left: 12px !important
  }

  .mg-12 {
    margin: 12px !important
  }

  .mgt-12 {
    margin-top: 12px !important
  }

  .mgr-12 {
    margin-right: 12px !important
  }

  .mgb-12 {
    margin-bottom: 12px !important
  }

  .mgl-12 {
    margin-left: 12px !important
  }

  .px-12 {
    padding-left: 12px !important;
    padding-right: 12px !important
  }

  .py-12 {
    padding-top: 12px !important;
    padding-bottom: 12px !important
  }

  .mx-12 {
    margin-left: 12px !important;
    margin-right: 12px !important
  }

  .my-12 {
    margin-top: 12px !important;
    margin-bottom: 12px !important
  }

  .pd-16 {
    padding: 16px !important
  }

  .pdt-16 {
    padding-top: 16px !important
  }

  .pdr-16 {
    padding-right: 16px !important
  }

  .pdb-16 {
    padding-bottom: 16px !important
  }

  .pdl-16 {
    padding-left: 16px !important
  }

  .mg-16 {
    margin: 16px !important
  }

  .mgt-16 {
    margin-top: 16px !important
  }

  .mgr-16 {
    margin-right: 16px !important
  }

  .mgb-16 {
    margin-bottom: 16px !important
  }

  .mgl-16 {
    margin-left: 16px !important
  }

  .px-16 {
    padding-left: 16px !important;
    padding-right: 16px !important
  }

  .py-16 {
    padding-top: 16px !important;
    padding-bottom: 16px !important
  }

  .mx-16 {
    margin-left: 16px !important;
    margin-right: 16px !important
  }

  .my-16 {
    margin-top: 16px !important;
    margin-bottom: 16px !important
  }

  .pd-24 {
    padding: 24px !important
  }

  .pdt-24 {
    padding-top: 24px !important
  }

  .pdr-24 {
    padding-right: 24px !important
  }

  .pdb-24 {
    padding-bottom: 24px !important
  }

  .pdl-24 {
    padding-left: 24px !important
  }

  .mg-24 {
    margin: 24px !important
  }

  .mgt-24 {
    margin-top: 24px !important
  }

  .mgr-24 {
    margin-right: 24px !important
  }

  .mgb-24 {
    margin-bottom: 24px !important
  }

  .mgl-24 {
    margin-left: 24px !important
  }

  .px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important
  }

  .py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important
  }

  .mx-24 {
    margin-left: 24px !important;
    margin-right: 24px !important
  }

  .my-24 {
    margin-top: 24px !important;
    margin-bottom: 24px !important
  }

  .pd-48 {
    padding: 48px !important
  }

  .pdt-48 {
    padding-top: 48px !important
  }

  .pdr-48 {
    padding-right: 48px !important
  }

  .pdb-48 {
    padding-bottom: 48px !important
  }

  .pdl-48 {
    padding-left: 48px !important
  }

  .mg-48 {
    margin: 48px !important
  }

  .mgt-48 {
    margin-top: 48px !important
  }

  .mgr-48 {
    margin-right: 48px !important
  }

  .mgb-48 {
    margin-bottom: 48px !important
  }

  .mgl-48 {
    margin-left: 48px !important
  }

  .px-48 {
    padding-left: 48px !important;
    padding-right: 48px !important
  }

  .py-48 {
    padding-top: 48px !important;
    padding-bottom: 48px !important
  }

  .mx-48 {
    margin-left: 48px !important;
    margin-right: 48px !important
  }

  .my-48 {
    margin-top: 48px !important;
    margin-bottom: 48px !important
  }

  .pd-96 {
    padding: 96px !important
  }

  .pdt-96 {
    padding-top: 96px !important
  }

  .pdr-96 {
    padding-right: 96px !important
  }

  .pdb-96 {
    padding-bottom: 96px !important
  }

  .pdl-96 {
    padding-left: 96px !important
  }

  .mg-96 {
    margin: 96px !important
  }

  .mgt-96 {
    margin-top: 96px !important
  }

  .mgr-96 {
    margin-right: 96px !important
  }

  .mgb-96 {
    margin-bottom: 96px !important
  }

  .mgl-96 {
    margin-left: 96px !important
  }

  .px-96 {
    padding-left: 96px !important;
    padding-right: 96px !important
  }

  .py-96 {
    padding-top: 96px !important;
    padding-bottom: 96px !important
  }

  .mx-96 {
    margin-left: 96px !important;
    margin-right: 96px !important
  }

  .my-96 {
    margin-top: 96px !important;
    margin-bottom: 96px !important
  }

  .mx-auto {
    margin-left: auto;
    margin-right: auto
  }

  .hide-element {
    display: none !important
  }

  .display-block {
    display: block !important
  }

  .display-inline-block {
    display: inline-block !important
  }

  .font-light {
    font-weight: 300 !important
  }

  .font-regular {
    font-weight: 400 !important
  }

  .font-semibold {
    font-weight: 600 !important
  }

  .font-bold {
    font-weight: 700 !important
  }

  .pos-relative {
    position: relative !important
  }

  .pos-static {
    position: static !important
  }

  .overflow-visible {
    overflow: visible !important
  }

  .overflow-hidden {
    overflow: hidden !important
  }

  .w-100 {
    width: 100% !important
  }

  .align-self-start {
    align-self: flex-start !important
  }

  .justify-content-center {
    justify-content: center !important
  }

  .justify-content-end {
    justify-content: flex-end !important
  }

  .justify-content-evenly {
    justify-content: space-evenly !important
  }

  .justify-content-around {
    justify-content: space-around !important
  }

  .justify-content-between {
    justify-content: space-between !important
  }

  .flex-1 {
    flex: 1 !important
  }

  .flex-center,
  .align-items-center {
    align-items: center !important
  }

  .align-items-end {
    align-items: flex-end !important
  }

  .font-family-base,
  .font-family-base-2,
  .font-heading,
  .font-paragraph,
  .form-element,
  .tagsinput,
  .pagination,
  .breaking-sticky .media__link,
  .breaking-sticky .media__label,
  .headline.headline--breakingnews .media__label,
  .list-content__title,
  .media__title,
  .media__subtitle,
  .box__title,
  .section__title,
  .navbar-second .nav a,
  .livereport-content .media__date,
  .detail__artikel-selanjutnya .detail__title,
  .detail__subtitle,
  .detail__newstag-title,
  .detail__multiple-paging {
    font-weight: 400
  }

  .font-base-light,
  .font-heading-light,
  .media__date,
  .ads-slot:before,
  .smartbanner_new,
  .box__title--sponsored-box,
  .detail__body-tag .nav__item,
  .footer .nav,
  .text__body,
  .footer__copy,
  .detail__date,
  .detail__media-caption,
  .static__body-text p,
  .static__body-box p {
    font-weight: 300
  }

  .font-base-semibold,
  .font-heading-semibold,
  .box-utility-base a,
  .box-utility-info a,
  .box-utility-success a,
  .box-utility-warning a,
  .box-utility-error a,
  .notification-overlay,
  .today-recap-title,
  .headline .media__title,
  .text-list--title,
  .smartbanner_new strong,
  .smartbanner_new .get_app,
  .box__title,
  .section__title,
  .page__title,
  .nav,
  .terpopuler .media__title,
  .redirect__ring-seconds,
  .detail__title,
  .detail__body-text>a,
  .detail__body-text p>a,
  .detail__anchor-numb,
  .detail__multiple-link,
  .detail__artikel-selanjutnya-title,
  .linksisip a,
  .embed_video .title,
  .moment__anchor,
  .pemilu-countdown {
    font-weight: 600
  }

  .font-base-bold,
  .font-heading-bold,
  .megabillboard-close,
  .modal-body__title,
  .nav--bold .nav-item,
  .terpopuler .nav,
  .livereport-content .media__title,
  .article__recomendation .media__label,
  .linksisip strong,
  .quotesisip blockquote {
    font-weight: 700
  }

  .font-family-base,
  .font-paragraph,
  .footer .nav,
  .quotesisip,
  .detailFoto__title {
    font-family: Helvetica-FF, Arial, Tahoma, sans-serif
  }

  .font-family-base-2,
  .font-heading,
  .font-heading-light,
  .font-heading-semibold,
  .font-heading-bold,
  label,
  .form-file:before,
  .btn,
  .pagination,
  .notification-overlay,
  .breaking-sticky .media__link,
  .breaking-sticky .media__label,
  .detikpagi-live__body__right__text,
  .headline.headline--breakingnews .media__label,
  .list-content__title,
  .media__title,
  .media__subtitle,
  .media__author,
  .text-list,
  .ads-slot:before,
  .smartbanner_new,
  .modal-body__title,
  .box__title,
  .section__title,
  .box__header a,
  .box__title--sponsored-box,
  .page__header-social,
  .page__title,
  .page__breadcrumb,
  .page__follow,
  .page__indeks-info,
  .page__share,
  .nav,
  .detail__body-tag .nav__item,
  .livereport-content .media__title,
  .livereport-content .media__date,
  .article__recomendation .media__label,
  .media__label--live,
  .text__body,
  .footer,
  .footer-title,
  .detail__title,
  .detail__subtitle,
  .detail__author,
  .detail__multiple .detail__anchor,
  .detail__newstag-title,
  .detail__multiple-link,
  .detail__artikel-selanjutnya-title,
  .linksisip,
  .embed_video,
  .text__body-box,
  .static__body,
  .entry-hoegeng__left__text,
  .btn--hoegeng-entry,
  .list__berita__title,
  .list__berita__item__bottom__title,
  .list__berita__item__bottom__date,
  .cb-pemilu,
  .pemilu-countdown,
  .cb-hoegeng__desc,
  .cb-detikpilkada__desc,
  .cb-s-awards,
  .cb-detikpagi__right__text,
  .cb-detikpagi__right__button__text a,
  .collapsible__top,
  .cb-d-awards,
  .cb-demi-indonesia-emas {
    font-family: Montserrat-FF, Arial, Tahoma, sans-serif
  }

  .breaking-sticky .media__text,
  .media--list,
  .ads-slot:before,
  .ads-slot-mb-container,
  .display-flex,
  .breaking-detikpagi__close,
  .notif__balon,
  .ads-slot,
  .ads-slot--bb,
  .smartbanner_new .sb_close,
  .align-middle,
  .box__title--sponsored-box a,
  .sticky-share,
  .pemilu-countdown__btn,
  .box__title--sponsored-box,
  .navbar-first,
  .footer__app-store,
  .detail__newstag {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex
  }

  .form-inline,
  .list-content__item,
  .display-flex-wrap,
  .nav,
  .detail__body-tag .nav,
  .nav--center,
  .nav--right,
  .static__body-form .steps {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: wrap
  }

  .notification-overlay,
  .smartbanner_new,
  .flex-between,
  .box__header,
  .section__header,
  .box__title--sponsored,
  .page__header,
  .page__nav,
  .page__breadcrumb,
  .page__follow,
  .page__indeks-info {
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: wrap;
    align-items: center
  }

  .detikpagi-live,
  .header__icon,
  .ads-slot,
  .megabillboard__swipe p,
  .text-center,
  .cb-mostpop .text-list__data,
  .cb-commented .text-list__data,
  .detail__newstag,
  .icon-item {
    text-align: center !important
  }

  .text-right {
    text-align: right !important
  }

  .text-style-italic {
    font-style: italic !important
  }

  .breaking-detikpagi__close,
  .notif__balon,
  .ads-slot,
  .ads-slot--bb,
  .smartbanner_new .sb_close,
  .align-middle,
  .box__title--sponsored-box a,
  .sticky-share,
  .pemilu-countdown__btn {
    align-items: center;
    justify-content: center
  }

  .box-utility-base,
  .box-utility-info,
  .box-utility-success,
  .box-utility-warning,
  .box-utility-error,
  .form-check--checkbox label:before,
  .form-check--checkbox label:after,
  .form-element,
  .tagsinput,
  .notification-overlay,
  .copy_url .notif,
  .media__label,
  .media__icon,
  .media--image-radius .media__image,
  .slick-slide-thumbnail .slick-slide,
  .dropdown-menu__content,
  .box-background,
  .detail__body-tag .nav__item,
  .tagsinput .tag,
  .cb-pemilu--small .cb-pemilu__desc,
  .pemilu-countdown,
  .cb-s-awards__desc,
  .cb-d-awards__desc {
    border-radius: 4px
  }

  .form-check--radio label:before,
  .form-check--radio label:after,
  .detikpagi-live span:before,
  .media__image--circle,
  .media__author-image-avatar,
  .media--image-circle .media__image,
  .smartbanner_new .sb_close,
  .circle,
  .lds-ring div,
  .slick-dots li button,
  .nav__item--new a:after,
  .icon-item .comment-count,
  .detail__author-image-avatar,
  .static__body-form .numb,
  .cb-pemilu .slick-arrow,
  .pemilu-countdown__btn,
  .cb-hoegeng .slick-arrow,
  .cb-detikpilkada .slick-arrow,
  .cb-s-awards .slick-arrow,
  .cb-d-awards .slick-arrow,
  .cb-demi-indonesia-emas .slick-arrow,
  .cb-pesanwarga-slider .slick-arrow {
    border-radius: 50%
  }

  .color-black,
  .btn--s-awards {
    color: #000000
  }

  .color-black-light-4 {
    color: #cccccc
  }

  .color-white,
  .breaking-sticky .media__text,
  .megabillboard__swipe p,
  .cb-d-awards .media__title a,
  .btn--pemilu,
  .pemilu-countdown__num-day,
  .cb-hoegeng,
  .cb-detikpilkada,
  .cb-s-awards__desc,
  .cb-d-awards__desc,
  .btn--d-awards,
  .btn--d-awards:hover {
    color: #FFFFFF
  }

  .color-gray {
    color: #6D8591
  }

  .color-gray-light-1 {
    color: #879ba5
  }

  .color-blue-base,
  .color-blue,
  .smartbanner_new .sb_close,
  .detail__multiple-paging .text-list--title a,
  .cb-pemilu .slick-arrow,
  .pemilu-countdown__btn,
  .cb-s-awards .slick-arrow,
  .cb-d-awards .slick-arrow,
  .cb-demi-indonesia-emas .slick-arrow {
    color: #21409A
  }

  .color-orange-light-1,
  .color-orange {
    color: #ef672f
  }

  .color-red-light-2,
  .color-red {
    color: #FF0000
  }

  .color-purple-light-2,
  .color-purple {
    color: #812e88
  }

  .color-green-light-2,
  .color-green {
    color: #11aa3d
  }

  .color-yellow-base,
  .color-yellow {
    color: #FCB715
  }

  .color-pink-light-1,
  .color-pink {
    color: #ec1b7a
  }

  .color-bg-black {
    background: #000000
  }

  .color-bg-black-light-5 {
    background: #e6e6e6
  }

  .color-bg-white,
  .smartbanner_new,
  .sticky-share__wrap,
  .cb-pemilu .slick-arrow,
  .cb-hoegeng .slick-arrow,
  .cb-detikpilkada .slick-arrow,
  .cb-s-awards .slick-arrow,
  .cb-d-awards .slick-arrow,
  .cb-demi-indonesia-emas .slick-arrow,
  .cb-pesanwarga-slider .slick-arrow {
    background: #FFFFFF
  }

  .color-bg-gray {
    background: #6D8591
  }

  .color-bg-gray-light-4 {
    background: #e0e5e8
  }

  .color-bg-blue-base,
  .color-bg-blue {
    background: #21409A
  }

  .color-bg-orange-light-1,
  .color-bg-orange {
    background: #ef672f
  }

  .color-bg-red-light-2,
  .color-bg-red {
    background: #FF0000
  }

  .color-bg-purple-light-2,
  .color-bg-purple {
    background: #812e88
  }

  .color-bg-green-light-2,
  .color-bg-green {
    background: #11aa3d
  }

  .color-bg-yellow-base,
  .color-bg-yellow {
    background: #FCB715
  }

  .color-bg-pink-light-1,
  .color-bg-pink {
    background: #ec1b7a
  }

  .lqd_block>img,
  .media__image>img,
  .media__image a>*>img,
  .media__author-image-avatar img,
  .detail__media-image-wrap img,
  .area_ipt img {
    position: absolute;
    max-height: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    z-index: 1;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate3d(-50%, -50%, 0);
    -o-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
  }

  .modal-box {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: 26;
    opacity: 0;
    transition: opacity 0.3s ease-out 0s;
    background: #fff;
    background: rgba(255, 255, 255, 0.65)
  }

  .modal-box--show {
    opacity: 1;
    overflow-x: hidden;
    overflow-y: auto
  }

  .modal-box--inline {
    pointer-events: none
  }

  .modal-box--inline.modal-box--show {
    pointer-events: auto
  }

  .modal-dialog {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin: 18px auto;
    transition: transform 0.3s ease-out 0s;
    transform: translate(0, 50px);
    height: 100%;
    min-height: calc(100% - 36px);
    max-height: calc(100% - 36px);
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    width: calc(100% - 36px)
  }

  .modal-box--md .modal-dialog {
    width: 700px
  }

  .modal-box--full .modal-dialog {
    width: calc(100% - 36px)
  }

  .anim .modal-dialog {
    transition: transform 0.3s ease-out 0s;
    transform: translate(0, 0)
  }

  .modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    min-height: 100px;
    max-height: 0;
    transition: all 0.3s ease-in-out;
    transform: scale(0.75);
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    background: #FFFFFF
  }

  .modal-content--loaded {
    max-height: 100%;
    transform: scale(1)
  }

  .modal-box--full .modal-content {
    height: 100%
  }

  .modal-body {
    padding: 16px;
    overflow-y: scroll;
    opacity: 0;
    transition: opacity 0.75s ease-in-out
  }

  .modal-content--loaded .modal-body {
    opacity: 1
  }

  .modal-body__title {
    padding-bottom: 12px;
    margin-bottom: 4px;
    font-size: 18px
  }

  .close-modal {
    display: block;
    position: absolute;
    top: 8px;
    right: 8px;
    opacity: 0;
    visibility: hidden;
    z-index: 3;
    color: #999999
  }

  .modal-content--loaded .close-modal {
    opacity: 1;
    visibility: visible
  }

  .modal-overlay {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.3s ease-out 0s;
    z-index: 22;
    background: #FFFFFF
  }

  .modal-open {
    overflow: hidden
  }

  .modal-open .modal-overlay {
    opacity: 0.9
  }

  .lds-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0) scale(1);
    width: 40px;
    height: 40px
  }

  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 40px;
    height: 40px;
    border: 7px solid #999999;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #999999 transparent transparent transparent
  }

  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s
  }

  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s
  }

  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s
  }

  @keyframes lds-ring {
    0% {
      transform: rotate(0deg)
    }

    100% {
      transform: rotate(360deg)
    }
  }

  .accordion-wrap,
  .accordion-title {
    position: relative
  }

  .accordion-title {
    cursor: pointer
  }

  .accordion-title .icon {
    -webkit-transition: all 0.25s ease-in-out 0s;
    -moz-transition: all 0.25s ease-in-out 0s;
    -ms-transition: all 0.25s ease-in-out 0s;
    -o-transition: all 0.25s ease-in-out 0s;
    transition: all 0.25s ease-in-out 0s
  }

  .accordion-content {
    display: none;
    overflow: hidden
  }

  .accordion-open .icon-chevron-down {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
  }

  .wrap-zoom {
    z-index: 666;
    position: relative !important
  }

  .img-zoomin {
    cursor: pointer;
    cursor: -webkit-zoom-in;
    cursor: -moz-zoom-in
  }

  .img-zoomout,
  .wrap-zoom {
    cursor: pointer;
    cursor: -webkit-zoom-out;
    cursor: -moz-zoom-out
  }

  .wrap-zoom,
  .p_img_zoomin {
    position: relative;
    -webkit-transition: transform 300ms;
    -ms-transition: transform 300ms;
    transition: transform 300ms
  }

  .overflow-x-hidden {
    overflow-x: hidden
  }

  .zoom-overlay {
    z-index: 27;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    filter: "alpha(opacity=0)";
    opacity: 0;
    -webkit-transition: opacity 300ms;
    -o-transition: opacity 300ms;
    transition: opacity 300ms;
    cursor: pointer;
    cursor: -webkit-zoom-out;
    cursor: -moz-zoom-out;
    background: #000000;
    background: rgba(0, 0, 0, 0.85)
  }

  .zoom-overlay-open .zoom-overlay {
    filter: "alpha(opacity=100)";
    opacity: 1
  }

  .capzoom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: block;
    text-align: center;
    z-index: 999;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s
  }

  .capzoom .container {
    display: block
  }

  .capzoom span {
    position: relative;
    display: inline-block;
    padding: 8px 12px;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    color: #f7f7f7;
    background: #000000;
    background: rgba(0, 0, 0, 0.75);
    font-size: 14px
  }

  .zoom-overlay-open .capzoom {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
  }

  .slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0
  }

  .slick-list:focus {
    outline: none
  }

  .slick-list.dragging {
    cursor: pointer;
    cursor: hand
  }

  .slick-slider .slick-track,
  .slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }

  .slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    margin-left: auto;
    margin-right: auto
  }

  .slick-track:before,
  .slick-track:after {
    content: "";
    display: table
  }

  .slick-track:after {
    clear: both
  }

  .slick-loading .slick-track {
    visibility: hidden
  }

  .slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
    display: none
  }

  .slick-slide-thumbnail .slick-slide {
    opacity: 0.5;
    filter: alpha(opacity=50)
  }

  .slick-slide-thumbnail .slick-slide:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .slick-slide:focus {
    outline: none
  }

  [dir="rtl"] .slick-slide {
    float: right
  }

  .slick-slide img {
    display: block
  }

  .slick-slide.slick-loading img {
    display: none
  }

  .slick-slide.dragging img {
    pointer-events: none
  }

  .slick-initialized .slick-slide {
    display: block
  }

  .slick-loading .slick-slide {
    visibility: hidden
  }

  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
  }

  .slick-slide-thumbnail {
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px
  }

  .slick-slide-thumbnail .slick-slide {
    margin-left: 4px;
    margin-right: 4px;
    overflow: hidden
  }

  .slick-arrow.slick-hidden {
    display: none
  }

  .slick-arrow {
    position: absolute;
    z-index: 2;
    top: 50%;
    outline: none;
    border: none;
    background: transparent;
    font-size: 0;
    padding: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    -moz-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    -o-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    -ms-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25)
  }

  .detail__media-image-wrap .slick-arrow {
    opacity: 0.5;
    filter: alpha(opacity=50)
  }

  .detail__media-image-wrap:hover .slick-arrow {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .append-nav .slick-arrow,
  .foto-pop-up .slick-arrow {
    color: #FFFFFF
  }

  .slick-prev:before,
  .slick-next:before {
    font-family: detiknetwork-FF;
    font-size: 64px
  }

  .slick-slide-thumbnail .slick-prev:before,
  .slick-slide-thumbnail .slick-next:before {
    font-size: 24px
  }

  .foto-pop-up .slick-prev:before,
  .foto-pop-up .slick-next:before {
    color: #FFFFFF
  }

  .slick-prev {
    left: 0
  }

  .slick-slide-thumbnail .slick-prev {
    left: -24px
  }

  .slick-prev:before {
    content: "\67"
  }

  .slick-next {
    right: 0
  }

  .slick-slide-thumbnail .slick-next {
    right: -24px
  }

  .slick-next:before {
    content: "\65"
  }

  .slick-slide-thumbnail .slick-active {
    opacity: 0.5;
    filter: alpha(opacity=50)
  }

  .slick-slide-thumbnail .slick-active:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .slick-slide-thumbnail .slick-current {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .slick-disabled {
    opacity: 0;
    filter: alpha(opacity=0);
    pointer-events: none
  }

  .slick-dotted.slick-slider {
    padding-bottom: 30px
  }

  .slick-dots {
    position: absolute;
    bottom: 10px;
    list-style: none;
    display: block;
    text-align: center;
    padding: 0;
    margin: 0;
    width: 100%
  }

  .slick-dots li {
    position: relative;
    display: inline-block;
    height: 10px;
    width: 10px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer
  }

  .slick-dots li button {
    border: 1px solid #666666;
    background: #c7d0d5;
    opacity: 0.3;
    display: block;
    height: 10px;
    width: 10px;
    outline: none;
    line-height: 0px;
    font-size: 0px;
    color: transparent;
    padding: 5px;
    cursor: pointer
  }

  .slick-dots li.slick-active button {
    opacity: 0.8
  }

  .append-nav {
    position: absolute;
    left: 0;
    right: 0
  }

  #slider-foto__detail-nav.minim-img .slick-track {
    transform: none !important
  }

  .dropdown {
    position: relative
  }

  .dropdown-wrap {
    display: inline-block;
    position: relative
  }

  .dropdown-menu {
    text-align: left;
    padding-top: 4px;
    display: none;
    min-width: 150px;
    position: absolute;
    top: 100%;
    left: -8px;
    visibility: hidden;
    z-index: 3
  }

  .dropdown-menu__content {
    min-width: 200px;
    position: relative;
    margin: 8px;
    background: #FFFFFF;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15)
  }

  .dropdown-menu__content:after {
    content: "";
    position: absolute;
    left: 28px;
    width: 0;
    height: 0;
    top: 0;
    border: 6px solid black;
    border-color: transparent transparent #FFFFFF #FFFFFF;
    transform-origin: 0 0;
    transform: rotate(135deg);
    box-shadow: -2px 2px 4px 0 rgba(0, 0, 0, 0.05)
  }

  .dropdown-menu__content-article {
    min-width: 260px;
    max-width: 300px;
    padding: 12px
  }

  .dropdown-menu--right .dropdown-menu__content:after {
    left: auto;
    right: 2px
  }

  .dropdown-menu--right {
    left: auto;
    right: -8px
  }

  .dropdown-menu--top {
    top: unset;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 4px
  }

  .dropdown-menu--top .dropdown-menu__content:after {
    transform: rotate(-45deg);
    top: 100%;
    right: 12px
  }

  .dropdown-aktif>.dropdown-menu {
    display: block;
    visibility: visible;
    animation: dropdown-in 0.2s cubic-bezier(0.39, 0.575, 0.565, 1) both
  }

  .dropdown-aktif .dropdown .icon-chevron-down,
  .dropdown-aktif .dropdown .icon-chevron-up {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
  }

  .dropdown>.icon {
    -webkit-transition: transform 0.25s ease-in-out 0s;
    -moz-transition: transform 0.25s ease-in-out 0s;
    -ms-transition: transform 0.25s ease-in-out 0s;
    -o-transition: transform 0.25s ease-in-out 0s;
    transition: transform 0.25s ease-in-out 0s
  }

  @keyframes dropdown-in {
    0% {
      margin-top: 30px;
      opacity: 0
    }

    100% {
      margin-top: 0px;
      opacity: 1
    }
  }

  .box,
  .section,
  .box__form-indeks,
  .box--komentar,
  .detail__multiple-paging .text-list--title,
  .detail__media,
  .detail__anchor,
  .detail__multiple-box,
  .detail__multiple-bg,
  .detail__multiple-paging,
  .scrollable {
    margin-left: -18px;
    margin-right: -18px;
    padding-left: 18px;
    padding-right: 18px
  }

  .box,
  .section {
    position: relative;
    word-wrap: break-word;
    padding-top: 8px;
    padding-bottom: 8px;
    border-top: 3px solid #f0f0f0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: column
  }

  .box__header,
  .section__header {
    margin-top: 8px;
    margin-bottom: 8px;
    font-size: 23px
  }

  .box__title,
  .section__title {
    margin: 0;
    color: var(--kuler-1);
    font-size: 18px
  }

  .box {
    margin-bottom: 24px
  }

  .box__header a {
    padding: 0
  }

  .box__title--sponsored {
    width: 100%
  }

  .box__title--sponsored-box {
    width: 130px;
    font-size: 11px;
    align-items: center;
    margin: -9px 0;
    color: #000000
  }

  .box__title--sponsored-box>span {
    flex: 1
  }

  .box__title--sponsored-box a {
    width: 64px;
    height: 40px
  }

  .box__title--sponsored-box img {
    max-width: 64px;
    max-height: 40px
  }

  .box__logo {
    max-width: 200px;
    max-height: 45px;
    display: block
  }

  .box-background {
    padding: 16px;
    background: #e3f5fe
  }

  .box__form-indeks {
    margin-top: 8px;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6
  }

  .box__form-indeks-date {
    border-left: 1px solid #e6e6e6
  }

  .box--komentar {
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: column
  }

  .section {
    margin-bottom: 16px
  }

  .page__header {
    margin-top: 12px
  }

  .page__header-blak {
    background: #666666;
    background: -moz-linear-gradient(135deg, #666666 50%, #999999 100%);
    background: -webkit-linear-gradient(135deg, #666666 50%, #999999 100%);
    background: linear-gradient(135deg, #666666 50%, #999999 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1);
    padding: 12px 12px 12px 0;
    width: 66%;
    height: 60px;
    position: relative;
    margin-top: 24px
  }

  .page__header-blak-logo {
    position: relative;
    top: -38px
  }

  .page__header-social {
    position: absolute;
    top: 8px;
    right: 8px;
    color: #FFFFFF;
    font-size: 12px
  }

  .page__title {
    margin: 0;
    color: var(--kuler-1);
    font-size: 23px
  }

  .page__nav--float {
    position: absolute;
    top: 50%;
    width: 100%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 2;
    margin-top: 8px
  }

  .page__nav--float a {
    color: #FFFFFF
  }

  .page__breadcrumb,
  .page__follow,
  .page__indeks-info {
    color: #999999;
    font-size: 12px
  }

  .page__breadcrumb a,
  .page__follow a,
  .page__indeks-info a {
    color: #999999
  }

  .page__breadcrumb a {
    position: relative
  }

  /* .page__breadcrumb a:after {
    content: "/";
    padding: 0 4px
  } */

  .page__breadcrumb a:last-child:after {
    content: "";
    padding: 0
  }

  .page__breadcrumb a:hover {
    color: #333333
  }

  .page__share {
    color: #666666;
    font-size: 12px;
    text-align: left;
    line-height: 1.6
  }

  .page__share a {
    color: #666666
  }

  .livereport-content .page__share {
    padding: 0 0 8px
  }

  .nhl .box,
  .nhl .cb,
  .nhl .widget {
    border-bottom: 3px solid #f0f0f0
  }

  .nhl .box+.box,
  .nhl .box+.cb,
  .nhl .box+.widget,
  .nhl .box+div .box,
  .nhl .box+div .cb,
  .nhl .box+div .widget,
  .nhl .cb+.box,
  .nhl .cb+.cb,
  .nhl .cb+.widget,
  .nhl .cb+div .box,
  .nhl .cb+div .cb,
  .nhl .cb+div .widget,
  .nhl .widget+.box,
  .nhl .widget+.cb,
  .nhl .widget+.widget,
  .nhl .widget+div .box,
  .nhl .widget+div .cb,
  .nhl .widget+div .widget {
    border-top: none;
    margin-top: -24px
  }

  .widget.widget-nhl {
    border: none;
    margin-top: 8px;
    background: #f0f0f0
  }

  .sticky {
    position: sticky;
    position: -webkit-sticky;
    top: 88px
  }

  .captcha {
    display: inline-block
  }

  .alert {
    margin: 0 0 24px;
    padding: 16px;
    border-radius: 5px;
    font-size: 14px
  }

  .alert--danger {
    border: 1px solid #f6cfd7;
    background: #fae9ec;
    color: #000000
  }

  .alert--center-inline {
    display: inline-block
  }

  .nav__item--new a:after {
    content: "";
    width: 5px;
    height: 5px;
    background: #FF0000;
    position: absolute;
    top: 0;
    margin-left: 4px;
    overflow: hidden
  }

  .nav {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 14px
  }

  .nav a {
    display: block
  }

  .navbar-second .nav a {
    position: relative;
    display: inline-block;
    padding: 4px 8px;
    text-align: center;
    cursor: pointer;
    vertical-align: top;
    border: 1px solid transparent;
    border-radius: 4px;
    background: #f7f7f7
  }

  .nav__item {
    position: relative;
    padding: 0
  }

  .nav__item a {
    padding: 4px 24px 4px 0
  }

  .nav--column .nav__item a {
    padding: 4px 0
  }

  .footer .nav__item a {
    padding: 0 8px;
    position: relative;
    margin-bottom: 8px;
    color: #666666
  }

  .footer .nav__item a:after {
    content: ".";
    position: absolute;
    top: -12px;
    right: -4px;
    font-size: 23px;
    font-weight: 400
  }

  .navbar-first .nav__item:last-child a {
    padding-right: 0
  }

  .navbar-first .nav__item,
  .navbar-second .nav__item {
    white-space: nowrap
  }

  .navbar-second .nav__item {
    margin-top: 8px;
    margin-right: 8px;
    margin-bottom: 8px
  }

  .navbar-second .nav__item:last-child {
    margin-right: 0
  }

  .nav__item--green a {
    color: #75b72e
  }

  .nav__item--green ins {
    text-decoration: none
  }

  .nav__item--red a {
    color: #FF0000
  }

  .nav__item--red ins {
    text-decoration: none
  }

  .nav__item--new {
    position: relative
  }

  .navbar-first .nav__item--active a,
  .navbar-second .nav__item--active a {
    color: var(--kuler-1)
  }

  .nav--column .nav__item {
    display: inline-block;
    width: 100%;
    vertical-align: top
  }

  .footer .nav__item:last-child a:after {
    content: ""
  }

  .detail__body-tag .nav__item {
    background: #f0f0f0;
    margin: 4px;
    display: block;
    padding: 4px 16px;
    color: #000000;
    font-size: 12px
  }

  .terpopuler .nav__item {
    padding: 4px 24px 4px 0;
    font-size: 14px
  }

  .footer .nav {
    margin: 24px 0
  }

  .navbar--scroll .nav {
    padding-top: 4px;
    padding-right: 16px;
    padding-bottom: 4px;
    padding-left: 16px
  }

  .navbar-first .nav {
    height: 45px
  }

  .navbar-first .nav,
  .navbar-second .nav {
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: nowrap
  }

  .navbar-first .nav::-webkit-scrollbar,
  .navbar-second .nav::-webkit-scrollbar {
    display: none
  }

  .detail__body-tag .nav {
    margin: 8px;
    margin-left: -4px;
    margin-right: -4px
  }

  .nav--center {
    justify-content: center
  }

  .nav--right {
    justify-content: flex-end
  }

  .nav--column {
    flex-direction: column;
    width: 100%
  }

  .navbar {
    position: relative
  }

  .header .navbar {
    height: 35px;
    overflow: hidden
  }

  .navbar-logo {
    display: inline-block;
    line-height: inherit;
    white-space: nowrap
  }

  .navbar--scroll {
    padding-top: 0;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    -webkit-overflow-scrolling: touch
  }

  .navbar-wrap {
    overflow: hidden
  }

  .navbar-shadow {
    position: relative;
    margin-left: -18px;
    margin-right: -18px
  }

  .navbar-shadow:before {
    content: "";
    width: 18px;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background: #fff;
    background: -moz-linear-gradient(right, white 25%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-linear-gradient(right, white 25%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(to right, white 25%, rgba(255, 255, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1);
    position: absolute
  }

  .navbar-shadow:after {
    content: "";
    width: 24px;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 1;
    background: #fff;
    background: -moz-linear-gradient(left, white 25%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-linear-gradient(left, white 25%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(to left, white 25%, rgba(255, 255, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1);
    position: absolute
  }

  .back-top {
    width: 40px;
    height: 40px;
    position: fixed;
    right: 8px;
    bottom: 60px;
    background: #cccccc;
    background: rgba(204, 204, 204, 0.5);
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 22px;
    z-index: 10
  }

  .back-top a {
    display: inherit;
    color: #FFFFFF
  }

  .list-content--column .list-content__item:last-child {
    margin-bottom: 12px
  }

  .dropdown-wrap .list-content__item:last-child,
  .moment .list-content__item:last-child {
    border-bottom: none
  }

  .list-content--column .list-content__item {
    padding-bottom: 12px;
    margin-bottom: 12px
  }

  .terpopuler .list-content__item {
    padding-bottom: 4px;
    margin-bottom: 4px
  }

  .dropdown-wrap .list-content__item {
    border-bottom: 1px solid #f0f0f0
  }

  .moment .list-content__item {
    padding: 0 24px;
    border-bottom: 1px solid #cccccc
  }

  .list-content__title {
    font-size: 16px
  }

  .list-content>div.widget-nhl:first-child {
    margin-top: -8px
  }

  .list-content--border-left {
    border-left: 1px solid #e6e6e6;
    padding: 12px 0 0 12px
  }

  .livereport-content .media {
    overflow: visible;
    flex: auto
  }

  .media__image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15% 12px 12px
  }

  .detail__media .media__image img {
    width: 100%;
    max-width: none
  }

  .livereport-content .media__image {
    margin-left: 12px;
    margin-right: 12px
  }

  .moment .media__text {
    padding-left: 40px;
    display: block;
    padding: 0 0 16px 24px;
    position: relative
  }

  .moment .media__text:before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #C72026;
    position: absolute;
    left: 0px;
    top: 12px
  }

  .media__title {
    font-size: 16px
  }

  .list-content--equal-height .media__title {
    margin-bottom: 24px
  }

  .list-content--column .media__title {
    font-size: 14px
  }

  .terpopuler .media__title {
    font-size: 14px
  }

  .detail__artikel-selanjutnya .media__title {
    margin-bottom: 0;
    font-size: 14px
  }

  .livereport-content .media__title {
    font-size: 16px;
    padding: 12px
  }

  .cb-d-awards .media__title a:hover {
    color: #C2BB3C
  }

  .media__subtitle {
    color: var(--kuler-3);
    font-size: 14px
  }

  .media__subtitle a {
    color: var(--kuler-3)
  }

  .media__subtitle a:hover {
    text-decoration: underline
  }

  .cb-mostpop .media__date {
    margin-left: 37px
  }

  .prokontra .media__date {
    display: block;
    margin-top: 0;
    margin-bottom: 8px
  }

  .livereport-content .media__date {
    font-size: 14px;
    color: #666666;
    background: #FFFFFF;
    padding: 12px 0;
    margin: 0;
    text-align: left;
    margin-left: -16px
  }

  .box-background.livereport-content .media__date {
    background-color: #e3f5fe;
    padding-left: 10px
  }

  .media__label {
    padding: 5px 12px;
    font-size: 14px
  }

  .article__recomendation .media__label {
    position: relative;
    background: none;
    color: #21409A;
    padding: 0;
    margin-bottom: 4px
  }

  .media__label--live {
    background: #FF0000;
    padding: 4px 8px 4px 20px;
    top: 8px;
    left: 8px;
    z-index: 3
  }

  .media__label--live:before {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 10px;
    left: 6px;
    overflow: hidden;
    border-radius: 50%;
    animation: live 1s;
    -moz-animation: live 1s infinite;
    -webkit-animation: live 1s infinite;
    background: #FF0000
  }

  .media--left .media__image {
    margin: 0 12px 0 0
  }

  .media--right .media__image {
    margin: 0 0 0 12px
  }

  .widget-nhl .media--right .media__image {
    width: 150px
  }

  .media--left .media__image,
  .media--right .media__image {
    width: 100px
  }

  .headline .media--text-overlay .media__text {
    background: #21409A;
    background: -moz-linear-gradient(top, #21409a 65%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-linear-gradient(top, #21409a 65%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(to top, #21409a 65%, rgba(255, 255, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1)
  }

  .cb-mostpop .text-list {
    align-items: normal
  }

  .text-list__data--red {
    color: #FF0000
  }

  .cb-mostpop .text-list__data,
  .cb-commented .text-list__data {
    margin-right: 12px;
    margin-top: -4px;
    font-size: 20px;
    color: #999999
  }

  .terpopuler .text-list__data {
    color: #EE4023
  }

  .detail__multiple .text-list__data,
  .detail__multiple-paging .text-list__data {
    color: var(--kuler-1)
  }

  .detail__multiple-paging .text-list--title {
    border-top: 1px solid #e6e6e6;
    padding-top: 12px;
    color: var(--kuler-1)
  }

  .text__body {
    color: #666666;
    font-size: 14px
  }

  @keyframes live {
    0% {
      background: #fcc43f
    }

    50% {
      background: #FF0000
    }

    100% {
      background: #fcc43f
    }
  }

  .btn--blue-base {
    background: #21409A;
    color: #FFFFFF
  }

  .btn--blue-base:hover {
    color: #FFFFFF
  }

  .btn--blue-base.btn--outline {
    border-color: #21409A;
    color: #21409A
  }

  .btn--blue-base.btn--link {
    color: #21409A
  }

  .btn--blue-light-1 {
    background: #2c5498;
    color: #FFFFFF
  }

  .btn--blue-light-1:hover {
    color: #FFFFFF
  }

  .btn--blue-light-1.btn--outline {
    border-color: #2c5498;
    color: #2c5498
  }

  .btn--blue-light-1.btn--link {
    color: #2c5498
  }

  .btn--blue-light-2 {
    background: #007cbd;
    color: #FFFFFF
  }

  .btn--blue-light-2:hover {
    color: #FFFFFF
  }

  .btn--blue-light-2.btn--outline {
    border-color: #007cbd;
    color: #007cbd
  }

  .btn--blue-light-2.btn--link {
    color: #007cbd
  }

  .btn--blue-light-3 {
    background: #3ea6dd;
    color: #FFFFFF
  }

  .btn--blue-light-3:hover {
    color: #FFFFFF
  }

  .btn--blue-light-3.btn--outline {
    border-color: #3ea6dd;
    color: #3ea6dd
  }

  .btn--blue-light-3.btn--link {
    color: #3ea6dd
  }

  .btn--blue-light-4 {
    background: #84c6e9;
    color: #FFFFFF
  }

  .btn--blue-light-4:hover {
    color: #FFFFFF
  }

  .btn--blue-light-4.btn--outline {
    border-color: #84c6e9;
    color: #84c6e9
  }

  .btn--blue-light-4.btn--link {
    color: #84c6e9
  }

  .btn--blue-light-5 {
    background: #e3f5fe;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--blue-light-5:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--blue-light-5.btn--outline {
    border-color: #e3f5fe;
    color: #e3f5fe
  }

  .btn--blue-light-5.btn--link {
    color: #e3f5fe
  }

  .btn--orange-base {
    background: #EE4023;
    color: #FFFFFF
  }

  .btn--orange-base:hover {
    color: #FFFFFF
  }

  .btn--orange-base.btn--link {
    color: #EE4023
  }

  .btn--orange-light-1 {
    background: #ef672f;
    color: #FFFFFF
  }

  .btn--orange-light-1:hover {
    color: #FFFFFF
  }

  .btn--orange-light-1.btn--link {
    color: #ef672f
  }

  .btn--orange-light-2 {
    background: #f7931d;
    color: #FFFFFF
  }

  .btn--orange-light-2:hover {
    color: #FFFFFF
  }

  .btn--orange-light-2.btn--link {
    color: #f7931d
  }

  .btn--orange-light-3 {
    background: #f9ba6f;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--orange-light-3:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--orange-light-3.btn--link {
    color: #f9ba6f
  }

  .btn--orange-light-4 {
    background: #fbd3a3;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--orange-light-4:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--orange-light-4.btn--link {
    color: #fbd3a3
  }

  .btn--orange-light-5 {
    background: #fce7cc;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--orange-light-5:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--orange-light-5.btn--link {
    color: #fce7cc
  }

  .btn--red-base {
    background: #C72026;
    color: #FFFFFF
  }

  .btn--red-base:hover {
    color: #FFFFFF
  }

  .btn--red-base.btn--link {
    color: #C72026
  }

  .btn--red-light-1 {
    background: #ed131b;
    color: #FFFFFF
  }

  .btn--red-light-1:hover {
    color: #FFFFFF
  }

  .btn--red-light-1.btn--link {
    color: #ed131b
  }

  .btn--red-light-2 {
    background: #FF0000;
    color: #FFFFFF
  }

  .btn--red-light-2:hover {
    color: #FFFFFF
  }

  .btn--red-light-2.btn--link {
    color: #FF0000
  }

  .btn--red-light-3 {
    background: #ff5c5c;
    color: #FFFFFF
  }

  .btn--red-light-3:hover {
    color: #FFFFFF
  }

  .btn--red-light-3.btn--link {
    color: #ff5c5c
  }

  .btn--red-light-4 {
    background: #ffa6a6;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-4:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-4.btn--link {
    color: #ffa6a6
  }

  .btn--red-light-5 {
    background: #ffd6d6;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-5:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-5.btn--link {
    color: #ffd6d6
  }

  .btn--utility-base {
    background: #6D8591;
    color: #FFFFFF
  }

  .btn--utility-base:hover {
    color: #FFFFFF
  }

  .btn--utility-base.btn--link {
    color: #6D8591
  }

  .btn--utility-info {
    background: #2099d6;
    color: #FFFFFF
  }

  .btn--utility-info:hover {
    color: #FFFFFF
  }

  .btn--utility-info.btn--link {
    color: #2099d6
  }

  .btn--utility-success {
    background: #11aa3d;
    color: #FFFFFF
  }

  .btn--utility-success:hover {
    color: #FFFFFF
  }

  .btn--utility-success.btn--link {
    color: #11aa3d
  }

  .btn--utility-warning {
    background: #FCB715;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--utility-warning:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--utility-warning.btn--link {
    color: #FCB715
  }

  .btn--utility-error {
    background: #FF0000;
    color: #FFFFFF
  }

  .btn--utility-error:hover {
    color: #FFFFFF
  }

  .btn--utility-error.btn--link {
    color: #FF0000
  }

  button[disabled] {
    background: #e0e5e8;
    color: #879ba5
  }

  button[disabled]:hover {
    color: #879ba5
  }

  .btn--default-next {
    color: var(--kuler-3)
  }

  .btn--paging {
    background: var(--kuler-1);
    color: #FFFFFF
  }

  .btn--paging:hover {
    color: #FFFFFF
  }

  .footer {
    text-align: center;
    font-size: 14px;
    background: #e6e6e6;
    color: #666666
  }

  .footer__logo {
    margin-top: 24px;
    display: inline-block
  }

  .footer__logo img {
    width: 160px
  }

  .footer__social {
    margin: 0px 0px 20px 0
  }

  .footer__copy {
    display: inline-block;
    margin-bottom: 64px
  }

  .footer__border {
    height: 4px;
    display: block
  }

  .footer-title {
    font-size: 12px
  }

  .footer-title__partof {
    margin-top: 8px;
    color: #666666;
    padding: 4px 0
  }

  .footer-title__partof img {
    width: 80px;
    vertical-align: bottom;
    margin: 0 0 3px 3px
  }

  .footer__get-app {
    font-size: 12px
  }

  .footer__app-store {
    justify-content: center;
    align-items: center
  }

  .footer__app-store img {
    margin: 16px 2px;
    width: auto;
    height: 34px
  }

  @media (max-width:359px) {
    .footer__app-store img {
      height: 25px
    }
  }

  .bottom-sticky {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    z-index: 26
  }

  .redirect {
    position: relative
  }

  .redirect__page {
    background: var(--kuler-1);
    margin: 0 0px 16px;
    border-radius: 8px;
    padding: 8px 12px;
    color: #f7f7f7;
    transform: translateY(500px);
    -webkit-transition: transform 0.4s cubic-bezier(0.79, 0.33, 0.64, 0.82);
    transition: transform 0.4s cubic-bezier(0.79, 0.33, 0.64, 0.82)
  }

  .redirect__page h3,
  .redirect__page h4 {
    color: #f7f7f7
  }

  .redirect__page h4 {
    margin-bottom: 0;
    max-height: 48px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    white-space: normal
  }

  .redirect__close {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 0px
  }

  .redirect__close-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 100%;
    color: var(--kuler-1);
    background: #e3f5fe99;
    font-size: 18px
  }

  .redirect__ring {
    padding: 0 8px 0 0;
    display: flex;
    position: relative
  }

  .redirect__ring-circle {
    transition: 0.35s stroke-dashoffset;
    transform: rotate(-90deg);
    transform-origin: 50% 50%
  }

  .redirect__ring-seconds-wrap {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 50%;
    transform: translateY(-65%);
    padding-right: 8px;
    padding-top: 12px
  }

  .redirect__ring-seconds-wrap span {
    display: block;
    padding-top: 0px;
    font-size: 12px;
    font-size: 12px
  }

  .redirect__ring-seconds {
    font-size: 26px;
    line-height: 1em
  }

  .redirect .media__image.img-xss {
    width: 56px
  }

  .redirect .media__text {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 12px
  }

  .redirect .media__text.nomargin {
    padding-left: 0px;
    width: 100%
  }

  .redirect .media__text.nomargin>*:first-child {
    width: 100%
  }

  .redirect .media {
    align-items: center;
    justify-content: center
  }

  .sticky-share {
    visibility: hidden;
    padding: 4px 0;
    z-index: 27;
    position: fixed;
    left: 0;
    right: 0;
    height: 0;
    bottom: -100px;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s
  }

  .sticky-share__wrap {
    padding-left: 8px;
    padding-right: 8px;
    box-shadow: 0 calc(4px / 2) 4px 0 rgba(0, 0, 0, 0.15);
    border-radius: 24px
  }

  .sticky-share--sticked {
    visibility: visible;
    bottom: 0;
    margin-bottom: 25px;
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
  }

  .detail .sticky-share .icon-item {
    position: relative;
    width: 26px;
    height: 26px;
    margin-left: 6px;
    margin-right: 6px
  }

  .icon-item .comment-count {
    position: absolute;
    font-size: 10px;
    top: -4px;
    right: -4px;
    padding: 0 4px;
    min-width: 15px;
    background: #ed131b
  }

  .foto-pop-up .detail {
    color: #FFFFFF;
    max-width: 750px;
    margin-top: 16px;
    margin-left: auto;
    margin-right: auto
  }

  .detail__header {
    text-align: center;
    /* padding: 16px 0; */
    line-height: 1
  }

  .detail__title {
    font-size: 23px;
    color: var(--kuler-1);
    margin-bottom: 12px
  }

  .foto-pop-up .detail__title {
    color: #FFFFFF;
    margin-bottom: 28px
  }

  .dropdown-wrap .detail__title {
    font-size: 14px;
    padding-bottom: 12px;
    margin: 0;
    color: var(--kuler-1)
  }

  .detail__artikel-selanjutnya .detail__title {
    font-size: 14px;
    position: absolute;
    top: 16px;
    margin-bottom: 0
  }

  .detail__date {
    display: inline-block;
    margin-top: 8px;
    color: #666666;
    font-size: 12px
  }

  .foto-pop-up .detail__date {
    margin-bottom: 0
  }

  .detail__subtitle {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 4px;
    color: var(--kuler-3);
    font-size: 18px;
    margin-bottom: 0
  }

  .detail__subtitle a {
    color: var(--kuler-3);
    position: relative;
    z-index: 3
  }

  .detail__subtitle a:hover {
    text-decoration: underline
  }

  .detail__author {
    margin-top: 8px;
    margin-bottom: 8px;
    font-size: 12px;
    color: #666666
  }

  .detail__author-image-avatar {
    width: 25px;
    height: 25px;
    display: inline-flex;
    margin-right: 8px;
    overflow: hidden;
    vertical-align: middle
  }

  .detail__author-image-avatar img {
    width: 100%
  }

  .detail__label {
    color: var(--kuler-3)
  }

  .detail__media {
    padding: 0;
    position: relative
  }

  .detail__media.no-strech {
    margin: 0
  }

  .detail__media-image>img {
    width: 100%;
    min-height: 211px;
    max-width: none;
    position: relative;
    z-index: 2
  }

  .detail__media-image .img-zoomout {
    width: 100%;
    max-width: 100%
  }

  .detail__media-image-wrap--rounded,
  .detail__media-image-wrap--rounded .slick-slider {
    overflow: hidden;
    border-radius: 8px
  }

  .foto-pop-up .detail__media-image {
    margin-bottom: 0
  }

  .detail__media-caption {
    display: inline-block;
    margin-top: 4px;
    color: #666666;
    font-size: 12px;
    padding: 4px 18px
  }

  .foto-pop-up .detail__media-caption {
    color: #FFFFFF;
    font-size: 14px;
    margin-top: 16px
  }

  .no-strech .detail__media-caption {
    padding-left: 0;
    padding-right: 0
  }

  .detail__media.detail__media--rounded {
    margin: 0
  }

  .detail__media.detail__media--rounded img {
    border-radius: 8px
  }

  .foto-pop-up .detail__media {
    margin-bottom: 0
  }

  .detail__body {
    margin-top: 16px
  }

  .detail__body-text>a,
  .detail__body-text p>a {
    color: var(--kuler-1)
  }

  .detail__body-text .label {
    display: block;
    text-align: left
  }

  .detail__body-text img {
    max-width: 100%
  }

  .detail__body-text>p:nth-of-type(1) {
    display: inline
  }

  .detail__body-text>p:nth-of-type(2) {
    margin-top: 16px
  }

  .detail__body-text>h1 {
    font-size: 23px
  }

  .detail__body-text>h2,
  .detail__body-text>h3 {
    font-size: 18px
  }

  .detail__body-text>h2 a,
  .detail__body-text>h3 a {
    color: var(--kuler-1)
  }

  .detail__body-text>h4,
  .detail__body-text>h5,
  .detail__body-text>h6 {
    font-size: 16px
  }

  .detail__body-text>h4 a,
  .detail__body-text>h5 a,
  .detail__body-text>h6 a {
    color: var(--kuler-1)
  }

  .detail__share {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    font-size: 14px;
    justify-content: center
  }

  .detail__prokontra {
    text-align: center
  }

  .detail__prokontra-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: baseline;
    justify-content: center
  }

  .detail__prokontra label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: baseline;
    justify-content: center
  }

  .detail__prokontra label span {
    margin-left: 8px
  }

  .detail__prokontra label input {
    opacity: 0;
    z-index: 0
  }

  .detail__prokontra label input#input-pro:checked+small+span {
    background: var(--kuler-1);
    color: white
  }

  .detail__prokontra label input#input-kontra:checked+small+span {
    background: #ef672f;
    color: white
  }

  .detail__anchor {
    margin-top: 8px;
    margin-bottom: 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f0f0f0
  }

  .detail__multiple .detail__anchor {
    font-size: 14px;
    text-align: left;
    display: inline-block;
    background: none
  }

  .detail__multiple-box .detail__anchor {
    padding-right: 0;
    padding-left: 0;
    margin-right: 0;
    margin-left: 0
  }

  .detail__anchor.detail__anchor--multi {
    background: #FFFFFF
  }

  .detail__anchor a {
    color: white
  }

  .detail__anchor-icon {
    border-radius: 50%;
    width: 30px;
    height: 30px;
    background: #999999;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 8px 0
  }

  .detail__multiple .detail__anchor-icon {
    border-radius: 50%;
    width: 30px;
    height: 30px;
    background: #cccccc;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 8px 2px;
    color: #FFFFFF
  }

  .detail__anchor--multi .detail__anchor-icon {
    background: #cccccc;
    margin: 0 2px;
    width: 25px;
    height: 25px;
    font-size: 14px
  }

  .detail__anchor-icon.detail__anchor-icon--active {
    background: var(--kuler-1)
  }

  .detail__anchor-numb {
    color: #ef672f
  }

  .detail__multiple .detail__anchor-numb {
    border-radius: 50%;
    background: #cccccc;
    color: var(--kuler-1);
    width: 30px;
    height: 30px;
    display: inline-block;
    margin-right: 2px;
    text-align: center;
    line-height: 30px
  }

  .detail__multiple .detail__anchor-numb.detail__anchor-numb--active {
    color: #FFFFFF;
    background: var(--kuler-1)
  }

  .detail__newstag {
    margin: 16px 0
  }

  .detail__newstag-title {
    font-size: 14px;
    flex: 1
  }

  .detail__newstag img {
    margin-left: 16px
  }

  .detail__multiple {
    margin-top: 24px;
    margin-bottom: 24px
  }

  .detail__multiple-link {
    color: var(--kuler-1)
  }

  .detail__multiple-box {
    border-bottom: 1px solid #e6e6e6;
    border-top: 1px solid #e6e6e6;
    margin-top: 8px;
    margin-bottom: 8px
  }

  .detail__multiple-nav {
    margin: 0;
    padding: 12px 8px 12px 0
  }

  .detail__multiple-nav .media--left {
    align-items: center
  }

  .detail__multiple-bg {
    padding-top: 8px;
    padding-bottom: 8px;
    background: #f7f7f7
  }

  .detail__multiple .color-orange-light-1 {
    color: #ef672f
  }

  .detail__multiple-paging {
    padding: 12px 18px 0;
    border-top: 1px solid #f0f0f0;
    color: #999999;
    font-size: 14px
  }

  .detail__multiple .dropdown-wrap {
    flex: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: end
  }

  .detail__artikel-selanjutnya {
    background: #FFFFFF;
    box-shadow: 0 calc(4px / 2) 4px 0 rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    margin-top: 24px;
    margin-bottom: 24px;
    padding: 12px 16px 16px;
    border-top: 5px solid var(--kuler-1)
  }

  .detail__artikel-selanjutnya-title {
    margin-bottom: 8px;
    display: block
  }

  .linksisip {
    position: relative;
    margin: 8px 0;
    border-left: 5px solid #21409A
  }

  .linksisip td {
    border: none;
    padding: 0
  }

  .linksisip strong {
    font-size: 14px
  }

  .linksisip a {
    font-size: 16px;
    color: var(--kuler-1);
    display: block
  }

  .linksisip .lihatjg {
    padding-left: 20px
  }

  .linksisip .lihatjg strong {
    display: block;
    margin-bottom: 4px
  }

  .linksisip .lihatjg a {
    display: block
  }

  .quotesisip {
    position: relative;
    margin: 20px 0;
    padding: 0;
    border: 0;
    width: 100%;
    background: #FFFFFF;
    border-left: 5px solid #21409A
  }

  .quotesisip td {
    border: none;
    padding: 0
  }

  .quotesisip span {
    width: 5px;
    height: 100%;
    background: var(--kuler-1);
    position: absolute
  }

  .quotesisip blockquote {
    display: block;
    width: 100%;
    font-size: 23px;
    margin: 0 0 12px 0;
    padding: 8px 12px 0 24px;
    line-height: 120%;
    position: relative;
    color: #000000
  }

  .quotesisip blockquote:before {
    font-family: detiknetwork-FF;
    content: "\7b";
    font-size: 45px;
    display: block;
    margin-bottom: 8px;
    color: #999999
  }

  .quotesisip cite {
    color: #666666;
    font-size: 14px;
    display: block;
    margin-top: 4px;
    margin-left: 24px
  }

  .pic_artikel_sisip_table {
    text-align: center;
    margin-bottom: 20px;
    color: #666666;
    font-size: 12px;
    line-height: 120%;
    width: 100%;
    table-layout: fixed
  }

  .pic_artikel_sisip_table td {
    border: none;
    padding: 0
  }

  .pic_artikel_sisip {
    text-align: center;
    color: #999999;
    font-size: 12px;
    line-height: 120%;
    width: 100%
  }

  .pic_artikel_sisip .pic {
    position: relative;
    display: inline-block;
    max-width: 100%;
    text-align: center
  }

  .pic_artikel_sisip .pic img {
    position: relative;
    max-width: 100%;
    max-height: 400px;
    height: auto;
    overflow: hidden;
    display: block;
    top: auto;
    left: auto;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    margin-left: auto;
    margin-right: auto
  }

  .pic_artikel_sisip .pic>span {
    position: relative;
    display: block;
    z-index: 1;
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e6e6e6
  }

  .sisip_embed_sosmed iframe {
    min-width: 100% !important;
    width: 100px !important;
    *width: 100% !important
  }

  .sisip_embed_sosmed twitter-widget {
    width: 100% !important
  }

  .embed_video {
    padding-bottom: 20px
  }

  .embed_video .title {
    font-size: 14px;
    padding-bottom: 12px
  }

  .embed_video input {
    border-radius: 4px;
    font-size: 12px;
    background: #FFFFFF;
    display: block;
    padding: 16px;
    width: 90%;
    height: 15px;
    margin: 0;
    border: 1px solid #f0f0f0
  }

  .skybanner {
    margin-left: 16px;
    z-index: 2
  }

  .icon-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 5px 2px;
    width: 28px;
    height: 28px;
    vertical-align: middle;
    font-size: 16px;
    color: #FFFFFF;
    border-radius: 100%
  }

  .icon-item:hover {
    color: #FFFFFF
  }

  .detail .icon-item {
    width: 35px;
    height: 35px;
    padding: 2px
  }

  .icon-item__fb {
    background: #3C5A99
  }

  .icon-item__tw {
    background: #000000
  }

  .icon-item__ig {
    background: #5851DB;
    background: -moz-radial-gradient(left bottom, ellipse cover, #ffdc80 15%, #e1306c 55%, #5851db 100%);
    background: -webkit-radial-gradient(left bottom, ellipse cover, #ffdc80 15%, #e1306c 55%, #5851db 100%);
    background: radial-gradient(ellipse at left bottom, #ffdc80 15%, #e1306c 55%, #5851db 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$top_color', endColorstr='$bottom_color', GradientType=1)
  }

  .icon-item__in {
    background: #0077B5
  }

  .icon-item__yt {
    background: #FF0000
  }

  .icon-item__wa {
    color: #FFFFFF;
    background: #25D366
  }

  .icon-item__tele {
    color: #FFFFFF;
    background: #0088CC
  }

  .icon-item__tk,
  .icon-item__tk:hover {
    color: #FFFFFF;
    background: #000000
  }

  .icon-item__link {
    color: #FFFFFF;
    background: #999999
  }

  .icon-item__line-fb,
  .icon-item__line-tw,
  .icon-item__line-ig,
  .icon-item__line-in,
  .icon-item__line-yt {
    color: #666666;
    margin: 0
  }

  .icon-item__line-fb:hover,
  .icon-item__line-tw:hover,
  .icon-item__line-ig:hover,
  .icon-item__line-in:hover,
  .icon-item__line-yt:hover {
    color: #666666
  }

  .icon-item--light {
    color: #666666;
    background: #e6e6e6
  }

  .icon-item--light.icon-item:hover {
    color: #000000
  }

  .icon-item--light.icon-item__fb,
  .icon-item--light.icon-item__fb:hover {
    color: #3C5A99
  }

  .icon-item--light.icon-item__tw,
  .icon-item--light.icon-item__tw:hover {
    color: #000000
  }

  .icon-item--light.icon-item__in,
  .icon-item--light.icon-item__in:hover {
    color: #0077B5
  }

  .icon-logo {
    position: absolute;
    z-index: 2;
    top: 8px;
    right: 8px
  }

  .icon-logo img {
    display: block;
    max-height: 20px;
    max-width: 70px
  }

  .form-element:disabled,
  .tagsinput:disabled,
  .form-element[readonly],
  .tagsinput[readonly],
  .form-gray .form-element:disabled,
  .form-gray .tagsinput:disabled,
  .form-gray .form-element[readonly],
  .form-gray .tagsinput[readonly] {
    background-color: #f0f0f0
  }

  .char-count {
    padding-right: 40px
  }

  #charNum {
    position: absolute;
    top: 10px;
    right: 12px
  }

  .mce-container,
  .mce-container * {
    background: #f7f7f7 !important
  }

  .mce-container label,
  .mce-container * label {
    background: none !important
  }

  .mce-panel {
    border-color: #e6e6e6 !important
  }

  .mce-tinymce {
    box-shadow: none !important
  }

  .mce-top-part:before {
    box-shadow: none !important
  }

  .area_ipt {
    position: relative;
    overflow: hidden;
    margin-bottom: 8px;
    border: 2px dashed #cccccc;
    border-radius: 8px;
    background: #f7f7f7;
    color: #999999
  }

  .area_ipt .icon_inside span {
    position: absolute;
    top: 50%;
    width: 100%;
    text-align: center;
    margin: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%)
  }

  .area_ipt .hide {
    display: none
  }

  .area_ipt .show {
    display: block
  }

  .file_upload {
    position: absolute;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
    opacity: 0;
    filter: alpha(opacity=0)
  }

  .delimgtemp {
    position: absolute;
    right: 4px;
    bottom: 4px;
    z-index: 2;
    padding: 4px !important
  }

  .bgon .delimgtemp {
    display: none
  }

  .tagsinput {
    width: auto;
    height: auto !important;
    min-height: 50px !important;
    overflow-y: auto
  }

  .tagsinput input {
    background: transparent;
    border: none;
    float: left
  }

  .tagsinput .tag {
    float: left;
    margin-top: 4px;
    margin-right: 8px;
    margin-bottom: 4px;
    border: 1px solid #84c6e9;
    background: #e3f5fe
  }

  .tagsinput .tag span {
    margin: 0;
    padding: 4px;
    display: inline-block
  }

  .tagsinput .tag a {
    display: inline-block;
    margin-right: 4px
  }

  .tagsinput div {
    display: inline-block;
    margin: 3px 0 0
  }

  #tags_1_tag {
    width: 100px
  }

  .form-select {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    color: #999999;
    font-size: 14px;
    margin-bottom: 16px
  }

  .form-select-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-radius: 10px;
    background: #e6e6e6;
    color: #666666
  }

  .form-select-group i {
    font-size: 20px;
    margin-right: 4px
  }

  .form-select-group select {
    color: #666666
  }

  .pop-info {
    color: #666666
  }

  .pop-info .btn--rounded {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    padding: 0;
    text-align: center;
    line-height: 20px;
    display: inline-block;
    vertical-align: middle;
    font-weight: 700
  }

  .box__form-indeks .form-block {
    margin-top: 8px;
    margin-bottom: 8px
  }

  .box__form-indeks .form-element,
  .box__form-indeks .tagsinput {
    border: none
  }

  .box-ads {
    margin-top: 16px;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center
  }

  .box-ads__name {
    position: absolute;
    top: calc(50% - 40px);
    padding: 8px 12px;
    z-index: -1;
    font-size: 14px;
    color: #cccccc
  }

  .ads-slot--smb .box-ads__name {
    top: calc(50% - 25px)
  }

  .box-ads--container {
    margin-left: calc(-26px / 1.444444444444);
    margin-right: calc(-26px / 1.444444444444)
  }

  .ads-slot {
    position: relative;
    z-index: 1;
    margin: 0 auto;
    background: #f7f7f7
  }

  .ads-slot>* {
    flex: 1 100%
  }

  .ads-slot img {
    max-width: 100%;
    height: auto
  }

  .ads-slot:before {
    position: absolute;
    content: "Advertisement";
    left: 50%;
    top: 50%;
    height: 50px;
    z-index: -1;
    letter-spacing: 2px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Crect opacity='0.2' width='32' height='32' fill='url(%23pattern0)'/%3E%3Cdefs%3E%3Cpattern id='pattern0' patternContentUnits='objectBoundingBox' width='1' height='1'%3E%3Cuse xlink:href='%23image0' transform='scale(0.015625)'/%3E%3C/pattern%3E%3Cimage id='image0' width='64' height='64' xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAZ5QTFRFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlvQmPgAAAIp0Uk5TABVTfqXL3+z5M43S/v8Nc9UQgO4BYeoexDvpYgOOsVgqODcR/cx0FgJHieYxBV/oZBPyRPs8dcCVwb2MKD2SfJ6BPyYayKvUQSWyhGebh7yflq9/rZDJNg4H4NNRXqb8tAnWoGzO+PbFXUsMHdgf5DC/w1BPLecc3MY6YwSK6yPtD3LQi8qnfVIYuEyKDwAAAuxJREFUeJylV+d/0zAQVbaTSHH2bimQQtgUwggtAVoopexSaEvZo+y9wgplw39NbDmOrHF2ftzHl/deLOl0ukNIET5/IBgKRzQtEg4FA36fiiePaCyOiSNwPBb1qk7oSSKNpJ7wIE+lM3K5EZl0ykWezeXVciPyuSykLxRhuRHFglpfKrvrCSmXVPqK5kVPiFaRyqtD3uRGDFUl+mHvekKGRYcB/t/8BmH9EHvNiBlrWYzbhxK4f+soaT2LaY6zKMDnJzMgZSYfsi75IzUgxX5O5mC9woDkevqUS/6rDPK9m5V20asMSJriCeD+wgYZWh90N73SgOgmrqg/XgySBhxVC7WaiwEx6mRMLh7dEN2Yrfs2bd4CGcS6cFwmL261k2Tb9h1qg3i3/mMR1nY6Cl9qTGmAfcgvort2I2lIDIgfBQSssUeulxoEUFDA9ir0UoMgGuWhfb31R/c3D4xPuBiEUJiHDlJ2tWXubuMQbBBGEf4DLPbhHnAENIggvpZZtW7SBhpTkIEmGByl5GN9ZBo24JZwnHJnWOwEuARuE2cp9ySLnQI3MeQETlPuNIvFwGPkEukM5Z5lsXNgInGpfJ5y51isBRhc4C/TPOVeZDEdMPDz1/kS5TpsF9QG3evMFZTGoslduix4Sg2WkVDSrlDy1T4yAxgYB8QV1WuUXLdTcR66C2bz6Szr1628G7McbtwEDG6ZOPew3Lbo1Tt3V+7df4AQYEDPh3va8ENbwfWU4tP2iP7APa6Rx0geqsdVeN6fPPVmULYbZ77BePbcqVySG9gNhtjiNMaZxn7ihfxleslskdhk5Vsl8/fUq9kaeV0w442D8fYd+5GyNm+l3Xzfrom49esH5zLBRlMWH/ktHrDVbfH6AZvtuU/iKQ/Q7uPPdVGP/nvgQF5Hns6kSu9p6MLNL2q9MfZ1YHmnAo59CB488Wrgq4vcCNXoi5e/LXqQm8EP3xjj7z8W3HVs9Mb/2mr756/ff/6qeP8AIJG7VASH5AAAAAAASUVORK5CYII='/%3E%3C/defs%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center 4px;
    background-size: 24px;
    padding: 3px 0;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate3d(-50%, -50%, 0);
    -o-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    color: #999999;
    font-size: 12px;
    align-items: flex-end
  }

  .ads-slot__name {
    display: none;
    position: absolute;
    top: calc(50% - 40px);
    padding: 8px 12px;
    z-index: -1;
    font-size: 14px;
    color: #cccccc
  }

  .ads-slot--smb {
    height: 50px;
    z-index: 2;
    box-shadow: 0 calc(4px / 2) 4px 0 rgba(0, 0, 0, 0.15);
    position: sticky;
    position: -webkit-sticky;
    top: 0
  }

  .ads-slot-mb-container {
    width: 100%;
    height: 506px;
    position: absolute;
    background-attachment: scroll;
    background-position: left top;
    background-size: cover;
    clip: rect(auto, auto, auto, auto);
    justify-content: center
  }

  .ads-slot--mb {
    width: 320px;
    height: 480px;
    margin-top: 26px !important;
    position: fixed !important;
    z-index: 1 !important;
    background-image: url("../index/mega-billboard-placeholder.webp");
    background-repeat: no-repeat;
    background-position: center center
  }

  .ads-slot--mb iframe {
    border: 0px;
    vertical-align: bottom;
    width: 320px;
    height: 480px
  }

  .ads-slot--bb {
    width: 100%;
    height: 156px;
    background-image: url("../index/billboard-placeholder.webp");
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    z-index: 1;
    margin: 0 auto;
    background-color: #f7f7f7
  }

  .ads-slot--bb .tvcbillboard+div {
    position: absolute
  }

  .ads-slot--sb {
    width: 300px;
    height: 250px
  }

  .ads-slot--ib {
    width: 320px;
    height: 50px
  }

  .ads-slot--pd {
    width: 320px;
    height: 180px
  }

  .megabillboard {
    height: 524px;
    position: relative
  }

  .megabillboard__swipe {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0
  }

  .megabillboard__swipe p {
    display: block;
    margin: 0px;
    font-size: 10px;
    padding: 2px 0px;
    background: var(--kuler-1)
  }

  .megabillboard-close {
    cursor: pointer;
    position: fixed;
    right: calc(50% - 160px);
    padding: 5px 0;
    z-index: 2;
    color: var(--kuler-1);
    font-size: 12px
  }

  .smartbanner_new {
    height: 50px;
    padding: 0 8px;
    position: relative;
    font-size: 11px;
    align-items: center;
    text-align: left;
    z-index: 27
  }

  .smartbanner_new .app_logo {
    height: 36px;
    margin-right: 10px
  }

  .smartbanner_new strong {
    display: block;
    font-size: 12px
  }

  .smartbanner_new .get_app {
    margin-right: 20px
  }

  .smartbanner_new .sb_close {
    position: absolute;
    text-decoration: none;
    height: 14px;
    width: 14px;
    font-size: 10px;
    top: 5px;
    right: 5px;
    border: 1px solid #21409A
  }

  .smartbanner_new>div>span {
    height: 31px
  }

  .breaking-sticky .media__text,
  .headline,
  .footer__border {
    background: #21409A;
    background: -moz-linear-gradient(135deg, #21409a 50%, #007cbd 100%);
    background: -webkit-linear-gradient(135deg, #21409a 50%, #007cbd 100%);
    background: linear-gradient(135deg, #21409a 50%, #007cbd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1)
  }

  .cb-commented__color-data {
    color: #ef672f
  }

  .text-grey {
    color: #999999
  }

  .color-paging {
    color: var(--kuler-1)
  }

  .textarea-grey {
    width: 100%;
    border-radius: 8px
  }

  .section__blak {
    background: #666666;
    background: -moz-linear-gradient(135deg, #666666 50%, #999999 100%);
    background: -webkit-linear-gradient(135deg, #666666 50%, #999999 100%);
    background: linear-gradient(135deg, #666666 50%, #999999 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1);
    padding: 0px 0px 0px 0;
    height: 39px;
    position: relative;
    margin-top: 20px
  }

  .section__blak img {
    margin-top: -17px
  }

  .article__recomendation {
    padding: 8px 12px;
    background: #FFFFFF;
    border-top: 8px solid #21409A;
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.3);
    display: none
  }

  .text__body-box {
    padding: 16px;
    background: #e3f5fe;
    border-radius: 5px;
    color: #666666;
    position: relative
  }

  .text__body-box-title {
    font-size: 18px;
    color: #333333
  }

  .text__body-box .media__author {
    margin-top: 0
  }

  .text__body-box .media__author-image-avatar {
    width: 35px;
    height: 35px
  }

  .static {
    margin-bottom: 16px
  }

  .static-nav {
    margin-bottom: 16px
  }

  .static-nav .selected div {
    color: #ef672f
  }

  .static-nav .selected div i {
    color: #000000
  }

  .static__body {
    color: #000000;
    font-size: 14px
  }

  .static__body-text ul {
    list-style: none
  }

  .static__body-text h1 {
    font-size: 23px
  }

  .static__body-text h2 {
    font-size: 20px
  }

  .static__body-text h3 {
    font-size: 18px
  }

  .static__body-text h4 {
    font-size: 16px
  }

  .static__body-text h5 {
    font-size: 14px
  }

  .static__body-text h6 {
    font-size: 12px
  }

  .static__body-box {
    margin: 24px 0;
    padding: 16px;
    background: #e3f5fe;
    border-radius: 5px
  }

  .static__body-box div {
    color: #21409A
  }

  .static__body-box p {
    margin: 4px 0 16px
  }

  .static__body-form {
    margin-bottom: 24px
  }

  .static__body-form span {
    margin: 20px 0;
    display: block;
    vertical-align: middle
  }

  .static__body-form--disable {
    opacity: 0.4
  }

  .static__body-form .steps {
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 16px
  }

  .static__body-form .steps span {
    margin-bottom: 4px
  }

  .static__body-form .numb {
    display: inline-block;
    margin: 0 4px 0 0;
    padding: 6px;
    text-align: center;
    width: 30px;
    height: 30px;
    color: #FFFFFF;
    background: #21409A
  }

  .new_banner_reg_100:before {
    position: relative;
    content: "";
    width: auto
  }

  .livereport {
    margin-top: 8px
  }

  .livereport__sponsor {
    text-align: center;
    padding: 4px 12px 12px;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    font-size: 12px
  }

  .livereport__sponsor img {
    margin-top: 4px;
    max-width: 300px;
    max-height: 250px
  }

  .moment {
    padding: 0 0;
    border-radius: 8px;
    background: #e6e6e6
  }

  .moment__anchor {
    padding: 12px;
    display: block;
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    overflow: hidden
  }

  .moment__anchor .icon {
    font-size: 20px
  }

  .foto-pop-up {
    background: #000000;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
    overflow: scroll;
    padding: 20px 0
  }

  .media-pinch {
    min-height: 140%;
    max-width: 1000px;
    max-height: unset;
    position: relative;
    overflow: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    background: #333333;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 1;
    padding: 16px
  }

  .media-pinch>img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    cursor: move;
    touch-action: none;
    vertical-align: unset;
    border-style: unset;
    position: relative;
    max-height: 100%;
    max-width: 100%;
    z-index: 1;
    top: 0;
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }

  .media__image.img-xss {
    width: 56px
  }

  .multi-card {
    opacity: 0;
    max-height: 0px;
    overflow: hidden;
    transition: all 0.3s ease;
    margin: 0
  }

  .multi-card.show {
    opacity: 1;
    max-height: 9999px;
    margin-block: 12px
  }

  .next-article {
    border: 1px solid var(--kuler-1);
    background-color: #fff;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 20px;
    color: var(--kuler-1);
    font-weight: 500;
    margin: 0;
    display: flex;
    align-items: center;
    transition: all 0.3s ease
  }

  .next-article:hover {
    background-color: var(--kuler-1);
    color: #fff
  }

  .flex {
    display: flex
  }

  .custom-box-simplified {
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    text-align: center
  }

  .custom-btn-simplified {
    border: none !important;
    font-size: 16px !important;
    color: black !important;
    font-weight: 700;
    display: flex;
    justify-content: center;
    width: 100%
  }

  .text-sub-simplified {
    color: #c9c9c9;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 5px
  }

  .detailFoto {
    margin-inline: calc(var(--gutter-x) * -0.5);
    max-width: 100vw
  }

  .detailFoto__list {
    display: grid;
    gap: 16px;
    line-height: 0 !important
  }

  .detailFoto__item {
    background: rgba(var(--champagne-pink), 1)
  }

  .detailFoto__item button {
    background: none;
    border: 0;
    padding: 0
  }

  .detailFoto__caption {
    color: rgba(var(--black-lighter), 1);
    font-size: 12px;
    font-weight: 400;
    line-height: 17px
  }

  .detailFoto__title {
    color: #666666;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    padding: 8px 18px 18px
  }

  .detailFoto__img {
    position: relative;
    width: 100%
  }

  .detailFoto__img img {
    width: 100%
  }

  .beaut__sym--img {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    color: #ffffff;
    display: flex;
    flex-shrink: 0;
    font-family: var(--bs-body-font-family);
    font-size: 12px;
    padding: 0;
    position: absolute;
    left: 0;
    bottom: 0
  }

  .beaut__sym--img span {
    padding: 4px 10px
  }

  .entry-hoegeng {
    background-image: url("../index/bg-entry-hoegeng-m.svg");
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 112px;
    border-radius: 8px;
    padding: 12px 24px 9px 16px;
    margin: 24px 0px
  }

  .entry-hoegeng__left {
    display: flex;
    gap: 8px;
    align-items: center
  }

  .entry-hoegeng__left__text__title {
    font-size: 16px;
    color: #ffbf1f;
    font-weight: 700;
    margin-bottom: 2px
  }

  .entry-hoegeng__left__text__sub {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    color: #fff
  }

  .entry-hoegeng__right {
    margin-top: 5px
  }

  .btn--hoegeng-entry {
    border-radius: 8px;
    background: #ffd41f;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    color: #000;
    font-weight: 700;
    width: 127px;
    margin-left: 60px;
    font-size: 12px
  }

  .scrollable--3 .list-content__item {
    width: 100px !important;
    flex: 0 0 100px !important;
    padding-right: 8px !important
  }

  .scrollable--3 .list-content__item .media__text {
    padding: 5px !important;
    font-size: 10px
  }

  .scrollable--3 .list-content__item .media__title {
    font-size: 11px !important;
    font-weight: bold;
    height: auto !important;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden
  }

  .scrollable--3 .list-content__item .media__icon {
    font-size: 10px !important
  }

  .scrollable {
    overflow-x: scroll !important;
    overflow-y: scroll !important;
    -webkit-overflow-scrolling: touch !important;
    -ms-overflow-style: none;
    scrollbar-width: none
  }

  .scrollable::-webkit-scrollbar {
    display: none
  }

  .scrollable.jadwal-tv__list {
    margin: 0;
    padding: 0
  }

  .scrollable__wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: nowrap
  }

  .jadwal-tv .scrollable__wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: column nowrap;
    margin-left: -12px
  }

  .jadwal-tv .scrollable__wrap>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: nowrap
  }

  .jadwal-tv .scrollable__wrap>div:last-child {
    margin-right: 18px
  }

  .flex-gap {
    display: flex;
    gap: 3px;
    align-items: center
  }

  .mgt-minus-6 {
    margin-top: -6px
  }

  .list__berita {
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    margin-bottom: 12px;
    padding-bottom: 20px;
    display: flex
  }

  .list__berita__title {
    color: var(--kuler-1);
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px
  }

  .list__berita__item {
    width: 150px;
    margin-right: 14px
  }

  .list__berita__item__top {
    position: relative;
    margin-top: 10px
  }

  .list__berita__item__top__logo {
    position: absolute;
    top: 2px;
    right: 5px
  }

  .list__berita__item__bottom {
    margin-top: 5px
  }

  .list__berita__item__bottom__title {
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0.04px;
    color: #000000
  }

  .list__berita__item__bottom__date {
    color: #9B9B9B;
    font-style: normal;
    font-weight: 300;
    font-size: 11px;
    line-height: 13px;
    letter-spacing: -0.22px
  }

  .btn--pemilu {
    background: #C72026;
    background: -moz-linear-gradient(127deg, #c72026 40%, #ef672f 100%);
    background: -webkit-linear-gradient(127deg, #c72026 40%, #ef672f 100%);
    background: linear-gradient(127deg, #c72026 40%, #ef672f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1)
  }

  .cb-pemilu {
    position: relative;
    margin-top: 24px !important;
    margin-bottom: 36px !important
  }

  .cb-pemilu--big {
    padding: 16px;
    border-radius: 8px;
    background: #f7f7f7;
    background: -moz-linear-gradient(100deg, #f7f7f7 50%, #f0f0f0 100%);
    background: -webkit-linear-gradient(100deg, #f7f7f7 50%, #f0f0f0 100%);
    background: linear-gradient(100deg, #f7f7f7 50%, #f0f0f0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1)
  }

  .cb-pemilu--small {
    padding: 12px;
    max-height: 475px;
    overflow: hidden;
    border-radius: 8px;
    background: #f0f0f0;
    background: -moz-linear-gradient(-100deg, #f0f0f0 50%, #f7f7f7 100%);
    background: -webkit-linear-gradient(-100deg, #f0f0f0 50%, #f7f7f7 100%);
    background: linear-gradient(-100deg, #f0f0f0 50%, #f7f7f7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1)
  }

  .cb-pemilu--small .bg-flag {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    height: 120px;
    background: url("../index/flag-pemilu-small.png") no-repeat
  }

  .cb-pemilu__desc {
    background: #fff;
    background: rgba(255, 255, 255, 0.95)
  }

  .cb-pemilu .slick-dots li button {
    border: none;
    width: 12px;
    height: 12px;
    background: #f0a7b8
  }

  .cb-pemilu .slick-dots li.slick-active button {
    background: #C72026
  }

  .cb-pemilu .slick-arrow {
    top: 40px;
    width: 34px;
    height: 34px;
    opacity: 0.65;
    filter: alpha(opacity=65)
  }

  .cb-pemilu .slick-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-pemilu .slick-prev,
  .cb-pemilu .slick-next {
    margin: 0 16px
  }

  .cb-pemilu .slick-prev:before,
  .cb-pemilu .slick-next:before {
    font-size: 24px
  }

  .cb-pemilu--big .cb-pemilu__logo {
    width: 130px;
    height: auto
  }

  .cb-pemilu--small .cb-pemilu__logo {
    width: 94px;
    height: auto
  }

  .cb-pemilu--small .cb-pemilu__desc {
    padding: 12px;
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: space-between
  }

  .btn--pemilu {
    padding-left: 16px;
    padding-right: 16px
  }

  .btn--pemilu:hover {
    color: white !important
  }

  .pemilu-countdown {
    border: 1px solid #f0f0f0;
    background: #f7f7f7;
    padding: 6px 8px;
    margin-left: calc(-26px / 4.3333333333);
    margin-right: calc(-26px / 4.3333333333)
  }

  .pemilu-countdown__logo {
    height: auto;
    width: 54px;
    margin-right: 8px
  }

  .pemilu-countdown__num {
    color: #2c5498;
    margin-right: 16px
  }

  .pemilu-countdown__num-day {
    padding: 2px 4px;
    border-radius: 2px;
    background: #21409A;
    background: -moz-linear-gradient(100deg, #21409a 50%, #007cbd 100%);
    background: -webkit-linear-gradient(100deg, #21409a 50%, #007cbd 100%);
    background: linear-gradient(100deg, #21409a 50%, #007cbd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$start_color', endColorstr='$end_color', GradientType=1);
    font-size: 14px
  }

  .pemilu-countdown__num-text {
    font-size: 14px
  }

  .pemilu-countdown__num-title {
    font-size: 8px
  }

  .pemilu-countdown__desc {
    font-size: 12px;
    font-weight: 400
  }

  .pemilu-countdown__btn {
    background: #e0e5e8;
    width: 20px;
    height: 20px;
    margin-left: 8px
  }

  .pemilu-countdown__btn:hover {
    color: #C72026
  }

  .pemilu-countdown__btn .icon {
    font-size: 14px
  }

  .btn--yellow-base {
    background: #FCB715;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-base:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-base.btn--link {
    color: #FCB715
  }

  .btn--yellow-light-1 {
    background: #fcc43f;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-1:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-1.btn--link {
    color: #fcc43f
  }

  .btn--yellow-light-2 {
    background: #fcd373;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-2:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-2.btn--link {
    color: #fcd373
  }

  .btn--yellow-light-3 {
    background: #fde3a5;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-3:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-3.btn--link {
    color: #fde3a5
  }

  .btn--yellow-light-4 {
    background: #fdefcd;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-4:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-4.btn--link {
    color: #fdefcd
  }

  .btn--yellow-light-5 {
    background: #fef7e8;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-5:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--yellow-light-5.btn--link {
    color: #fef7e8
  }

  .cb-hoegeng {
    padding: 12px;
    background-image: url("../index/bg-hoegeng-2025.svg?v=1");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    max-height: 500px;
    margin-top: 24px !important;
    border-radius: 8px;
    margin-bottom: 36px !important
  }

  .cb-hoegeng-btn {
    width: 100%;
    justify-content: center;
    display: flex;
    margin-bottom: 15px
  }

  .cb-hoegeng__logo {
    width: 180px;
    height: auto;
    margin-bottom: 4px
  }

  .cb-hoegeng__desc {
    position: relative;
    font-size: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 500px
  }

  .cb-hoegeng .media__subtitle {
    color: #FCB715
  }

  .cb-hoegeng .media__title a {
    color: #FFFFFF
  }

  .cb-hoegeng .media__title a:hover {
    color: #FCB715
  }

  .cb-hoegeng .slick-dots li button {
    border: none;
    width: 12px;
    height: 12px;
    opacity: 1;
    filter: alpha(opacity=100);
    background: #fef7e8
  }

  .cb-hoegeng .slick-dots li.slick-active button {
    background: #FCB715
  }

  .cb-hoegeng .slick-arrow {
    top: 40px;
    width: 34px;
    height: 34px;
    opacity: 0.65;
    filter: alpha(opacity=65);
    color: #232323
  }

  .cb-hoegeng .slick-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-hoegeng .slick-prev,
  .cb-hoegeng .slick-next {
    margin: 0 16px
  }

  .cb-hoegeng .slick-prev:before,
  .cb-hoegeng .slick-next:before {
    font-size: 24px
  }

  .color-yellow {
    color: #fcb715 !important
  }

  .btn--red-base {
    background: #C72026;
    color: #FFFFFF
  }

  .btn--red-base:hover {
    color: #FFFFFF
  }

  .btn--red-base.btn--link {
    color: #C72026
  }

  .btn--red-light-1 {
    background: #ed131b;
    color: #FFFFFF
  }

  .btn--red-light-1:hover {
    color: #FFFFFF
  }

  .btn--red-light-1.btn--link {
    color: #ed131b
  }

  .btn--red-light-2 {
    background: #FF0000;
    color: #FFFFFF
  }

  .btn--red-light-2:hover {
    color: #FFFFFF
  }

  .btn--red-light-2.btn--link {
    color: #FF0000
  }

  .btn--red-light-3 {
    background: #ff5c5c;
    color: #FFFFFF
  }

  .btn--red-light-3:hover {
    color: #FFFFFF
  }

  .btn--red-light-3.btn--link {
    color: #ff5c5c
  }

  .btn--red-light-4 {
    background: #ffa6a6;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-4:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-4.btn--link {
    color: #ffa6a6
  }

  .btn--red-light-5 {
    background: #ffd6d6;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-5:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-5.btn--link {
    color: #ffd6d6
  }

  .cb-detikpilkada {
    padding: 12px;
    background-color: #F5F5F5;
    background-image: url("../index/bg-cb-detikpilkada.webp");
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 177px 41px;
    overflow: hidden;
    max-height: 500px;
    margin-top: 24px !important;
    border-radius: 8px;
    margin-bottom: 36px !important
  }

  .cb-detikpilkada__logo {
    width: 144px;
    height: auto;
    margin-bottom: 4px;
    margin-top: -8px
  }

  .cb-detikpilkada__desc {
    color: #000000;
    background-color: white;
    position: relative;
    padding: 12px;
    border-radius: 4px;
    font-size: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: space-between
  }

  .cb-detikpilkada .media__subtitle {
    color: #2c5498
  }

  .cb-detikpilkada .media__title a:hover {
    color: #C72026
  }

  .cb-detikpilkada--regional .cb-detikpilkada__logo {
    width: auto;
    height: 33px;
    margin: 0
  }

  .cb-detikpilkada--regional .cb-detikpilkada__desc {
    color: var(--kuler-sp3)
  }

  .cb-detikpilkada--regional .media__subtitle {
    color: var(--kuler-3)
  }

  .cb-detikpilkada--regional .media__title a:hover {
    color: var(--kuler-1)
  }

  .cb-detikpilkada .slick-dots li button {
    border: none;
    width: 7px;
    height: 7px;
    opacity: 1;
    filter: alpha(opacity=100);
    background: #999999
  }

  .cb-detikpilkada .slick-dots li.slick-active button {
    background: #ed131b
  }

  .cb-detikpilkada .slick-arrow {
    top: 40px;
    width: 34px;
    height: 34px;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0.65;
    filter: alpha(opacity=65);
    color: #FFFFFF
  }

  .cb-detikpilkada .slick-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-detikpilkada .slick-prev,
  .cb-detikpilkada .slick-next {
    margin: 0 16px
  }

  .cb-detikpilkada .slick-prev:before,
  .cb-detikpilkada .slick-next:before {
    font-size: 24px
  }

  .btn-detikhot-color {
    background: #c72026;
    background: -moz-linear-gradient(137deg, #c72026 0%, #cd222c 48%, #ef672f 100%);
    background: -webkit-linear-gradient(137deg, #c72026 0%, #cd222c 48%, #ef672f 100%);
    background: linear-gradient(137deg, #c72026 0%, #cd222c 48%, #ef672f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c72026", endColorstr="#ef672f", GradientType=1);
    color: white;
    min-width: 80px;
    padding: calc(12px / 3) 10px
  }

  .btn-detikhot-color span {
    transition: transform 0.3s ease
  }

  .btn-detikhot-color span:hover {
    transform: scale(1.05)
  }

  .btn-detikhot-color:hover {
    background: #d50e15;
    background: -moz-linear-gradient(137deg, #d50e15 0%, #cf121d 48%, #f2591a 100%);
    background: -webkit-linear-gradient(137deg, #d50e15 0%, #cf121d 48%, #f2591a 100%);
    background: linear-gradient(137deg, #d50e15 0%, #cf121d 48%, #f2591a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d50e15", endColorstr="#f2591a", GradientType=1);
    color: white;
    min-width: 80px;
    padding: calc(12px / 3) 10px;
    opacity: 1
  }

  .cb-s-awards {
    position: relative;
    margin-top: 24px !important;
    padding: 12px;
    overflow: hidden;
    background: url("../index/bg-soedirman.webp") #000 no-repeat;
    background-size: cover;
    border-radius: 8px;
    max-height: 475px;
    margin-bottom: 36px !important
  }

  .cb-s-awards__desc {
    padding: 12px;
    background: #000;
    font-size: 12px
  }

  .cb-s-awards__logo {
    width: 135px;
    height: auto
  }

  .cb-s-awards .slick-dots li button {
    border: none;
    width: 7px;
    height: 7px;
    background: #f1f0d6;
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-s-awards .slick-dots li.slick-active button {
    background: #C2BB3C
  }

  .cb-s-awards .slick-arrow {
    top: 40px;
    width: 34px;
    height: 34px;
    opacity: 0.65;
    filter: alpha(opacity=65)
  }

  .cb-s-awards .slick-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-s-awards .slick-prev,
  .cb-s-awards .slick-next {
    margin: 0 16px
  }

  .cb-s-awards .slick-prev:before,
  .cb-s-awards .slick-next:before {
    font-size: 24px
  }

  .cb-s-awards .s-awards-slider {
    background-color: rgba(0, 0, 0, 0.4);
    margin-bottom: -10px
  }

  .cb-s-awards .s-awards-slider a.media__link {
    color: #fff
  }

  .cb-s-awards .s-awards-slider a.media__link:hover {
    color: #ffe48e
  }

  .btn--s-awards {
    background: linear-gradient(85deg, #f4953d 1.82%, #ffe48e 49.98%, #ffd129 98.13%)
  }

  .btn--s-awards:hover {
    color: #df0a0a;
    opacity: 1;
    background: linear-gradient(268deg, #f4953d 1.82%, #ffe48e 49.98%, #ffd129 98.13%)
  }

  .cb-detikpagi {
    background: #ff4c05;
    padding: 12px 8px 12px 12px;
    display: flex;
    gap: 15px;
    margin-bottom: 24px
  }

  .cb-detikpagi__right__text {
    margin: 8px 0px;
    font-weight: 500;
    font-size: 10px;
    color: #ffffff;
    line-height: 12px
  }

  .cb-detikpagi__right__button {
    display: flex;
    align-items: center;
    gap: 7px
  }

  .cb-detikpagi__right__button__text a {
    color: #ff4c05;
    font-weight: 600;
    font-size: 7px;
    padding: 3px 5px;
    background: #ffe600;
    border-radius: 15px
  }

  .position-relative {
    position: relative !important
  }

  .top-0 {
    top: 0
  }

  .collapsible {
    background: #F7F7F7;
    padding: 16px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    border: 1px solid #CCCCCC;
    border-radius: 4px;
    margin-bottom: 24px;
    cursor: pointer
  }

  .collapsible__top {
    color: #000000;
    font-weight: 700;
    font-size: 16px;
    width: 100%
  }

  .collapsible__top::after {
    content: "";
    background-image: url("../index/path-down.png");
    float: right;
    margin-left: 5px;
    background-size: cover;
    background-repeat: no-repeat;
    height: 13px;
    width: 23px;
    margin-top: 5px;
    position: relative;
    -webkit-transition: transform 0.2s ease-in-out 0s;
    -moz-transition: transform 0.2s ease-in-out 0s;
    -ms-transition: transform 0.2s ease-in-out 0s;
    -o-transition: transform 0.2s ease-in-out 0s;
    transition: transform 0.2s ease-in-out 0s
  }

  .active .collapsible__top::after {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
  }

  .collapsible__content {
    transition: max-height 0.5s ease-out;
    overflow: hidden;
    max-height: 0px;
    padding: 0px 16px
  }

  .collapsible__content a {
    display: block
  }

  .mgt-0 {
    margin-top: 0px !important
  }

  .fs-14 {
    font-size: 14px !important
  }

  .active__content {
    max-height: 2000px;
    transition: max-height 0.5s ease-in
  }

  .color__blue {
    color: #21409A !important
  }

  .livereport {
    margin-top: 8px;
    font-family: Montserrat-FF, Arial, Tahoma, sans-serif
  }

  .livereport.sticky-moment {
    z-index: 4;
    top: 145px
  }

  .livereport__sponsor {
    text-align: center;
    padding: 4px 12px 12px;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    font-size: 12px
  }

  .livereport__sponsor img {
    margin-top: 4px;
    max-width: 200px;
    max-height: 80px
  }

  .livereport__nav .accordion-title {
    padding: 5px 0
  }

  .livereport__nav .accordion-title .moment__anchor {
    width: 100%
  }

  .livereport__nav .list-content.moment__list.accordion-content {
    padding: 0
  }

  .livereport__nav .moment__list {
    height: 30dvh;
    overflow: auto
  }

  .cb-d-awards {
    position: relative;
    margin-top: 24px !important;
    padding: 12px;
    overflow: hidden;
    background: url("../index/bg-detikcom-awards.webp") #071C49 no-repeat;
    background-size: cover;
    border-radius: 8px;
    max-height: 475px;
    margin-bottom: 36px !important
  }

  .cb-d-awards__desc {
    padding: 12px;
    background: #071C49;
    font-size: 12px
  }

  .cb-d-awards__logo {
    width: 135px;
    height: auto
  }

  .cb-d-awards .slick-dots li button {
    border: none;
    width: 7px;
    height: 7px;
    background: #f1f0d6;
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-d-awards .slick-dots li.slick-active button {
    background: #C2BB3C
  }

  .cb-d-awards .slick-arrow {
    top: 40px;
    width: 34px;
    height: 34px;
    opacity: 0.65;
    filter: alpha(opacity=65)
  }

  .cb-d-awards .slick-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-d-awards .slick-prev,
  .cb-d-awards .slick-next {
    margin: 0 16px
  }

  .cb-d-awards .slick-prev:before,
  .cb-d-awards .slick-next:before {
    font-size: 24px
  }

  .btn--d-awards {
    background: #A02E79
  }

  .cb-demi-indonesia-emas {
    position: relative;
    margin-top: 24px !important;
    padding: 16px 12px;
    overflow: hidden;
    background: url("../index/bg-demi-indonesia-emas.webp");
    background-size: 100% 100%;
    border-radius: 8px;
    max-height: 475px;
    margin-bottom: 36px !important
  }

  .cb-demi-indonesia-emas .desc-emas {
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    color: #fff;
    line-height: 16px
  }

  .cb-demi-indonesia-emas__logo {
    width: 164px;
    height: auto
  }

  @media only screen and (max-width:325px) {
    .cb-demi-indonesia-emas__logo {
      width: 143px
    }
  }

  .cb-demi-indonesia-emas .slick-dots li button {
    border: none;
    width: 7px;
    height: 7px;
    background: #f1f0d6;
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-demi-indonesia-emas .slick-dots li.slick-active button {
    background: #ef672f
  }

  .cb-demi-indonesia-emas .slick-arrow {
    top: 40px;
    width: 34px;
    height: 34px;
    opacity: 0.65;
    filter: alpha(opacity=65)
  }

  .cb-demi-indonesia-emas .slick-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-demi-indonesia-emas .slick-prev,
  .cb-demi-indonesia-emas .slick-next {
    margin: 0 16px
  }

  .cb-demi-indonesia-emas .slick-prev:before,
  .cb-demi-indonesia-emas .slick-next:before {
    font-size: 24px
  }

  .cb-demi-indonesia-emas .indonesia-emas-slider {
    background-color: rgba(0, 0, 0, 0.4);
    margin-bottom: -10px
  }

  .cb-demi-indonesia-emas .indonesia-emas-slider a.media__link {
    color: #fff
  }

  .cb-demi-indonesia-emas .indonesia-emas-slider a.media__link:hover {
    color: #ffe48e
  }

  .cb-demi-indonesia-emas .slick-dotted.slick-slider {
    padding-bottom: 5px !important
  }

  .cb-demi-indonesia-emas .media__subtitle {
    color: #fcc43f !important
  }

  .cb-demi-indonesia-emas .media__link {
    color: #fff !important
  }

  .btn-juara-eropa {
    border-radius: 4px;
    background: linear-gradient(85deg, #f4953d 1.82%, #ffe48e 49.98%, #ffd129 98.13%);
    color: #000
  }

  .dm-sans-thin-italic {
    font-family: "DM Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: italic
  }

  .poppins-thin {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: normal
  }

  .btn--red-base {
    background: #C72026;
    color: #FFFFFF
  }

  .btn--red-base:hover {
    color: #FFFFFF
  }

  .btn--red-base.btn--link {
    color: #C72026
  }

  .btn--red-light-1 {
    background: #ed131b;
    color: #FFFFFF
  }

  .btn--red-light-1:hover {
    color: #FFFFFF
  }

  .btn--red-light-1.btn--link {
    color: #ed131b
  }

  .btn--red-light-2 {
    background: #FF0000;
    color: #FFFFFF
  }

  .btn--red-light-2:hover {
    color: #FFFFFF
  }

  .btn--red-light-2.btn--link {
    color: #FF0000
  }

  .btn--red-light-3 {
    background: #ff5c5c;
    color: #FFFFFF
  }

  .btn--red-light-3:hover {
    color: #FFFFFF
  }

  .btn--red-light-3.btn--link {
    color: #ff5c5c
  }

  .btn--red-light-4 {
    background: #ffa6a6;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-4:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-4.btn--link {
    color: #ffa6a6
  }

  .btn--red-light-5 {
    background: #ffd6d6;
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-5:hover {
    color: rgba(0, 0, 0, 0.75)
  }

  .btn--red-light-5.btn--link {
    color: #ffd6d6
  }

  .cb-pesanwarga {
    background-color: #ececec;
    font-family: "Poppins", sans-serif;
    border-radius: 8px;
    overflow: hidden
  }

  .cb-pesanwarga .flex-none {
    flex: none
  }

  .cb-pesanwarga__header {
    position: relative;
    padding-bottom: 10px;
    margin-top: 0
  }

  .cb-pesanwarga__header-bg {
    width: 100%;
    height: auto
  }

  .cb-pesanwarga__header a {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center
  }

  .cb-pesanwarga__header-logo {
    width: 56%;
    height: auto
  }

  .cb-pesanwarga__wrapper {
    padding: 0 16px 16px
  }

  .cb-pesanwarga__cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #000;
    font-size: 12px;
    font-weight: 700;
    padding: 10px;
    border: 1px solid #21409a;
    line-height: 20px
  }

  .cb-pesanwarga__cta a {
    background-color: #ffc700;
    color: #000;
    padding: 7px 14px;
    font-size: 12px;
    font-weight: 700;
    margin-left: 16px;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    line-height: 17px
  }

  .cb-pesanwarga__cta a svg {
    margin-left: 8px
  }

  .cb-pesanwarga__card {
    position: relative;
    padding: 33px 22px 14px;
    margin: 16px 16px 8px 4px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.12);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='158' height='111' viewBox='0 0 158 111' fill='none'%3E%3Cg clip-path='url(%23clip0_509_36495)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M21.538 17.0785L20.626 19.9664C22.2609 20.4511 23.8283 21.0839 25.3686 21.7571L26.6387 19.0038C24.97 18.27 23.281 17.5901 21.5448 17.0718L21.538 17.0785Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.0661 14.9784L11.627 17.974C13.3362 18.2231 15.0252 18.526 16.7006 18.9098L17.383 15.9545C15.6197 15.5506 13.8496 15.2342 12.0661 14.9717V14.9784Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.48594 14.1436L2.37109 17.1728C3.2426 17.193 4.10736 17.2469 4.97887 17.3075C5.84362 17.3613 6.71513 17.4085 7.57313 17.5094L7.85688 14.4936C6.9651 14.3926 6.06657 14.3455 5.17479 14.2849C4.28301 14.2243 3.38448 14.1705 2.4927 14.1503L2.48594 14.1436Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M42.7103 36.0956L39.8525 37.1323C40.4403 38.6873 40.8659 40.3164 41.2307 41.9657L44.2033 41.3262C43.8115 39.5625 43.3521 37.7987 42.7103 36.0889V36.0956Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M37.9212 27.5264L35.5566 29.4315C36.597 30.697 37.4956 32.077 38.259 33.5378L40.9478 32.1242C40.0966 30.5018 39.09 28.9535 37.9212 27.5264Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M30.5299 21.0771L28.9287 23.6554C30.3339 24.544 31.6716 25.5201 32.8944 26.6174L34.9347 24.369C33.5633 23.1438 32.077 22.06 30.5299 21.0771Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M45.359 64.753L42.3189 64.6655C42.2648 66.4292 42.2175 68.2064 42.1973 69.9971L45.2374 70.0375C45.2577 68.2805 45.3117 66.5235 45.359 64.753Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M45.5152 55.207L42.475 55.234C42.4885 56.9708 42.475 58.721 42.4277 60.4713L45.4679 60.5386C45.5084 58.7681 45.5287 56.9909 45.5152 55.207Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M44.9409 45.6348L41.9277 46.0185C42.1372 47.7149 42.279 49.4247 42.3669 51.1481L45.4003 51C45.3057 49.2161 45.1638 47.4254 44.9409 45.6415V45.6348Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M50.757 90.8721L48.791 93.208C50.0003 94.1841 51.392 94.9111 52.8378 95.4901L54.0876 95.9613L55.1213 93.1137L54.1011 92.73C52.9054 92.2655 51.7568 91.6731 50.757 90.8721Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M46.3049 83.4131L43.3594 84.1738C43.8593 86.0991 44.5957 87.9839 45.6631 89.6669L48.1831 87.9503C47.3116 86.5568 46.7171 85.0085 46.3049 83.4131Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M45.2511 74.2646L42.2109 74.3387C42.2515 76.1428 42.3528 77.9671 42.569 79.8049L45.5889 79.4481C45.3862 77.7382 45.2849 76.0082 45.2511 74.2646Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M75.6729 89.7816L77.8145 91.9291C79.2062 90.576 80.3682 89.0546 81.3951 87.4659L78.8346 85.8301C77.9158 87.2572 76.8822 88.6103 75.6729 89.7816Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M68.0186 94.2246L68.782 97.1596C69.7481 96.9442 70.6669 96.5672 71.5857 96.2172L72.9166 95.5709C73.3625 95.3555 73.7678 95.0728 74.1934 94.8237L72.572 92.2656C72.214 92.4743 71.8694 92.7167 71.4978 92.8984L70.3764 93.4437C69.5994 93.7331 68.836 94.0563 68.0186 94.238V94.2246Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M59.0941 94.2582L58.4658 97.2202C60.3169 97.651 62.2559 97.8058 64.1948 97.7924L64.1205 94.7631C62.445 94.7631 60.7493 94.6419 59.0941 94.2515V94.2582Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M84.3738 64.2948L87.4072 64.0727C87.4072 63.864 87.3599 63.5207 87.3126 63.211C87.2518 62.9014 87.1775 62.585 87.0694 62.282C86.8668 61.6627 86.5357 61.0972 86.1709 60.5789C85.4007 59.5691 84.4211 58.8488 83.4348 58.3574L82.0498 61.0569C82.7389 61.3934 83.3199 61.8579 83.732 62.3897C84.1306 62.9485 84.3468 63.514 84.3806 64.2948H84.3738Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M83.6444 73.4566L86.6238 74.0557C86.9819 72.2449 87.2453 70.4138 87.3737 68.5626L84.3403 68.3472C84.2187 70.057 83.9755 71.7669 83.6377 73.4566H83.6444Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M80.8202 82.2146L83.5766 83.4869C84.3603 81.7905 85.0021 80.0469 85.5494 78.2832L82.6376 77.4014C82.1309 79.0439 81.5296 80.6595 80.8135 82.2146H80.8202Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M64.5998 67.21L61.5664 67.4254C61.6542 68.6034 62.0055 69.694 62.4582 70.6566C62.9176 71.6193 63.4783 72.4877 64.0999 73.2618L66.4982 71.3971C65.4781 70.1114 64.7079 68.6506 64.5998 67.21Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M69.5187 61.3533L68.3431 58.5596C66.519 59.3337 64.6949 60.4041 63.2627 62.1678L65.6408 64.0527C66.5866 62.8814 68.0053 61.9928 69.5187 61.3533Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M78.3076 60.0607L78.6183 57.0449C76.6456 56.8496 74.6932 56.9506 72.7812 57.2805L73.3015 60.2626C74.9566 59.9732 76.6591 59.8924 78.3076 60.054V60.0607Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M85.2324 80.1619L86.3201 83.1979C88.1172 82.3834 89.5697 80.9966 90.806 79.482L88.9076 76.9307C87.9145 78.2299 86.739 79.4551 85.2392 80.1619H85.2324Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M76.733 79.2666L76.125 82.3497C77.9153 83.171 79.8002 83.8105 81.7594 83.9721L81.4149 80.7745C79.7732 80.5928 78.2126 79.9869 76.7398 79.2666H76.733Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M69.3427 74.312L67.3564 76.6075C68.0793 77.2201 68.7887 77.7856 69.5656 78.3578C70.3696 78.9502 71.2006 79.5089 72.0315 80.0609L73.3759 77.3144C72.6936 76.8566 72.0113 76.3921 71.3492 75.9007C70.6736 75.4026 69.9845 74.8573 69.3359 74.312H69.3427Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M99.4199 56.614L101.535 58.7884C102.683 57.718 104.054 56.6611 105.439 55.7389L103.75 53.2212C102.23 54.2377 100.798 55.335 99.4199 56.614Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M94.5693 65.1634L97.4203 66.2136L98.0013 64.6181L98.5283 63.1304C98.7175 62.5986 98.8796 62.0533 99.1769 61.5686L96.5286 60.0405C96.1637 60.6329 95.9543 61.2994 95.7246 61.9523C95.3192 63.1035 94.9612 64.093 94.5693 65.1499V65.1634Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M90.9824 73.5514L93.401 75.4767C94.3401 73.7399 95.1846 71.855 95.8804 70.172L93.07 69.0142C92.4012 70.6163 91.7458 72.0838 90.9824 73.5514Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M126.645 47.6074L125.922 50.5492C127.442 50.9262 128.881 51.5388 130.185 52.3802L131.833 49.8356C130.246 48.8057 128.476 48.0584 126.645 47.6074Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M116.708 47.6272L117.33 50.5892C118.944 50.2526 120.572 50.0574 122.18 50.0843L122.221 47.055C120.356 47.0214 118.505 47.2502 116.708 47.6205V47.6272Z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M107.532 50.9799L108.944 53.6659C110.437 52.8917 111.978 52.2118 113.558 51.6531L112.545 48.7988C110.822 49.4047 109.154 50.1452 107.539 50.9799H107.532Z' fill='%23DFDFDF'/%3E%3Cpath d='M153.871 64.2342L151.622 61.151L120.612 32.292L122.004 43.8774L108.972 54.2847L123.767 58.9632L125.334 68.556L155.905 66.8798L153.871 64.2342Z' fill='white'/%3E%3Cpath d='M158.317 66.9202C158.459 66.5028 158.29 66.1864 157.973 65.9239C157.932 65.8902 157.891 65.8566 157.858 65.8229C150.656 59.044 143.447 52.2652 136.246 45.4863C131.287 40.8212 126.328 36.156 121.376 31.4842C121.085 31.2082 120.795 30.9659 120.383 30.9053L119.829 31.1813C119.633 31.5717 119.599 31.9689 119.748 32.3795C119.754 32.5007 119.761 32.6151 119.775 32.7363C120.2 36.1964 120.626 39.6566 121.072 43.11C121.119 43.4735 121.018 43.6754 120.734 43.8774C120.254 44.2072 119.795 44.5707 119.336 44.9275C115.883 47.6202 112.424 50.3062 108.986 53.0124C108.526 53.3759 107.911 53.6586 107.851 54.3722L108.128 54.9242C109.492 55.4627 110.931 55.7926 112.303 56.3109C114.161 57.0178 116.059 57.5967 117.951 58.2093C119.457 58.7007 120.93 59.2729 122.464 59.6701C122.808 59.7576 122.95 59.9326 123.011 60.2961C123.504 63.1437 124.017 65.9845 124.531 68.8253C124.673 69.6196 124.923 69.8216 125.72 69.7543C126.591 69.6802 127.456 69.5725 128.321 69.5321C131.044 69.4042 133.759 69.1686 136.475 68.9599C136.631 68.9599 136.779 68.9599 136.935 68.9464C140.394 68.6974 143.853 68.4618 147.312 68.1992C149.244 68.0579 151.169 67.8963 153.102 67.7549C154.534 67.6472 155.973 67.5395 157.405 67.4857C157.817 67.4655 158.148 67.3308 158.297 66.9135L158.317 66.9202ZM122.7 42.8945C122.389 40.3634 122.058 37.839 121.727 35.3146C121.693 34.9174 121.66 34.5135 121.619 33.9884C131.408 43.1975 141.11 52.3257 150.879 61.5146C150.555 61.555 150.433 61.4069 150.284 61.3126C145.481 58.1824 140.677 55.0521 135.867 51.9286C132.604 49.8081 129.328 47.6943 126.058 45.5805C125.97 45.5267 125.875 45.493 125.787 45.4459C124.929 44.8804 124.085 44.2947 123.213 43.7495C122.876 43.5341 122.747 43.285 122.7 42.8945ZM121.531 35.2203C121.531 35.2203 121.531 35.2203 121.538 35.2203C121.538 35.2203 121.538 35.2203 121.531 35.2203ZM121.572 35.2473C121.572 35.2473 121.619 35.2742 121.646 35.2876C121.619 35.2742 121.599 35.2607 121.572 35.2473ZM112.418 52.8306C112.269 52.8575 112.12 52.9316 111.918 52.8306C113.775 51.3833 115.606 49.9562 117.444 48.5223C118.876 47.4116 120.315 46.3075 121.727 45.1766C121.991 44.9679 122.146 45.0016 122.389 45.1631C123.815 46.0921 125.247 47.0009 126.672 47.9232C128.767 49.2964 130.854 50.6765 132.949 52.0363C134.347 52.9451 135.8 53.7798 137.171 54.729C139.056 56.0349 141.008 57.2399 142.92 58.5122C144.44 59.5153 145.967 60.5116 147.487 61.5079C147.474 61.5415 147.454 61.5752 147.44 61.6088C145.508 60.8145 143.569 60.0201 141.637 59.2123C137.847 57.6304 134.063 56.0349 130.28 54.453C130.172 54.4058 130.05 54.3789 129.942 54.3453C127.76 53.423 125.565 52.5142 123.396 51.5583C122.747 51.2756 122.133 51.2285 121.45 51.3496C118.437 51.868 115.424 52.3527 112.404 52.8441L112.418 52.8306ZM130.577 55.8936C130.564 55.8532 130.55 55.8195 130.537 55.7859C130.55 55.8195 130.564 55.8599 130.577 55.8936ZM130.456 55.6041C130.456 55.6041 130.429 55.5435 130.409 55.5099C130.422 55.5435 130.442 55.5704 130.456 55.6041ZM122.241 57.9064C119.072 56.8495 115.91 55.7993 112.749 54.7424C112.654 54.7088 112.559 54.6617 112.472 54.6213C112.458 54.6213 112.451 54.6213 112.438 54.6213C112.451 54.6213 112.465 54.6213 112.472 54.6213C112.478 54.5876 112.492 54.5539 112.499 54.5203C114.465 54.1904 116.424 53.8606 118.39 53.5307C119.383 53.3624 120.376 53.1941 121.369 53.0393C121.525 53.0124 121.727 52.8912 121.781 53.2211C122.051 54.803 122.342 56.385 122.626 58.0073C122.47 57.9669 122.355 57.9468 122.247 57.9131L122.241 57.9064ZM143.285 66.8461C140.954 67.0144 138.624 67.176 136.3 67.3443C136.144 67.3578 135.996 67.3847 135.847 67.4049C135.921 67.6001 136.029 67.7819 136.137 67.9703C136.036 67.7886 135.928 67.6001 135.847 67.4049C133.368 67.5732 130.888 67.7415 128.409 67.9098C127.76 67.9569 127.105 67.9905 126.463 68.0579C126.186 68.0848 126.091 68.004 126.037 67.7213C125.754 66.072 125.443 64.4227 125.146 62.7734C124.598 59.6768 124.051 56.5802 123.49 53.3826C125.923 54.3924 128.307 55.382 130.685 56.3648C132.341 57.0918 134.036 57.7381 135.692 58.4516C137.563 59.2595 139.448 60.0471 141.326 60.8414C142.826 61.4742 144.332 62.0935 145.846 62.7061C148.426 63.7495 150.973 64.8939 153.534 65.9979C153.52 66.0316 153.514 66.0585 153.507 66.0922C150.102 66.3413 146.697 66.5971 143.292 66.8461H143.285Z' fill='%23DFDFDF'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_509_36495'%3E%3Crect width='158' height='111' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-color: #fff;
    background-position: 95% 100%;
    background-repeat: no-repeat
  }

  .cb-pesanwarga__card a {
    color: #000
  }

  .cb-pesanwarga__card::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='51' height='42' viewBox='0 0 51 42' fill='none'%3E%3Cpath d='M11.7578 41.4068C8.3879 41.4068 5.70251 40.2608 3.70163 37.9687C1.75341 35.6234 0.779297 32.5851 0.779297 28.8538C0.779297 23.4701 2.12199 18.273 4.80738 13.2624C7.54543 8.25185 10.7574 4.14745 14.4432 0.949219L23.0522 5.18688C19.9456 8.54502 17.5762 11.9032 15.9439 15.2613C14.3642 18.6194 13.5744 21.5512 13.5744 24.0564H23.0522V31.8122C23.0522 34.1042 21.9991 36.2897 19.893 38.3685C17.8394 40.3941 15.1277 41.4068 11.7578 41.4068ZM39.3774 41.4068C36.0075 41.4068 33.3221 40.2608 31.3212 37.9687C29.373 35.6234 28.3989 32.5851 28.3989 28.8538C28.3989 23.4701 29.7416 18.273 32.427 13.2624C35.1124 8.25185 38.298 4.14745 41.9838 0.949219L50.5929 5.18688C47.4862 8.54502 45.1168 11.9032 43.4845 15.2613C41.9048 18.6194 41.115 21.5512 41.115 24.0564H50.5929V31.8122C50.5929 34.1042 49.5398 36.2897 47.4336 38.3685C45.38 40.3941 42.6946 41.4068 39.3774 41.4068Z' fill='%23DC7500'/%3E%3C/svg%3E");
    width: 52px;
    height: 42px;
    display: block;
    position: absolute;
    left: -4px;
    top: -16px;
    background-repeat: no-repeat
  }

  .cb-pesanwarga__card::after {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 14px 0 0 14px;
    border-color: transparent transparent transparent #ffffff;
    transform: rotate(0deg);
    position: absolute;
    right: -13px;
    top: 46px
  }

  .cb-pesanwarga__card-text {
    font-family: "DM Sans", sans-serif;
    font-size: 14px;
    font-style: italic;
    font-weight: 400;
    line-height: 121%;
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    height: 67px
  }

  .cb-pesanwarga__card-text p {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0
  }

  .cb-pesanwarga__card-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    font-weight: 700
  }

  .cb-pesanwarga__card-info a {
    display: inline-block;
    flex: 0;
    margin-left: 8px
  }

  .cb-pesanwarga-slider .slick-dotted.slick-slider {
    padding-bottom: 24px
  }

  .cb-pesanwarga-slider .slick-dots {
    bottom: 4px
  }

  .cb-pesanwarga-slider .slick-dots li button {
    border: none;
    width: 7px;
    height: 7px;
    opacity: 1;
    filter: alpha(opacity=100);
    background: #cccccc
  }

  .cb-pesanwarga-slider .slick-dots li.slick-active button {
    background: #2c5498;
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-pesanwarga-slider .slick-arrow {
    top: 40px;
    width: 34px;
    height: 34px;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0.65;
    filter: alpha(opacity=65);
    color: #FFFFFF
  }

  .cb-pesanwarga-slider .slick-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100)
  }

  .cb-pesanwarga-slider .slick-prev,
  .cb-pesanwarga-slider .slick-next {
    margin: 0 16px
  }

  .cb-pesanwarga-slider .slick-prev:before,
  .cb-pesanwarga-slider .slick-next:before {
    font-size: 24px
  }

  .adsmart-article article:nth-child(7),
  .adsmart-article article:nth-child(8) {
    display: none
  }
}